/* Shared foundation for the approved redesign. No framework or runtime dependencies. */
:root {
  color-scheme: dark;
  --color-background: #080808;
  --color-surface: #111111;
  --color-elevated: #151515;
  --color-text: #f5f5f3;
  --color-secondary: #bebeb9;
  --color-accent: #b99a68;
  --color-border: rgba(255, 255, 255, 0.10);

  --font-sans: 'DM Sans', 'Helvetica Neue', Arial, sans-serif;
  --text-body: 1rem;
  --text-label: .875rem;
  --text-meta: .75rem;

  --space-1: .25rem;
  --space-2: .5rem;
  --space-3: .75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;

  --content-width: 90rem;
  --page-gutter: clamp(1.25rem, 4.4vw, 5rem);
  --header-height: 5rem;
  --motion-duration: 180ms;
  --motion-easing: cubic-bezier(.2, .65, .3, 1);
}

@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('./assets/dm-sans-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('./assets/dm-sans-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: calc(var(--header-offset, var(--header-height)) + 1.5rem); }
body { margin: 0; background: var(--color-background); color: var(--color-text); font-family: var(--font-sans); font-size: var(--text-body); line-height: 1.6; -webkit-font-smoothing: antialiased; }
body, button, a { -webkit-tap-highlight-color: transparent; }
h1, h2, h3, p, figure, blockquote, dl, dd { margin: 0; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; cursor: pointer; }
img, svg { display: block; max-width: 100%; }
img { height: auto; }
[hidden] { display: none !important; }
::selection { background: var(--color-accent); color: var(--color-background); }
:focus-visible { outline: 2px solid var(--color-accent); outline-offset: 6px; }
.container { width: min(var(--content-width), calc(100% - var(--page-gutter) * 2)); margin-inline: auto; }
.skip-link { position: fixed; z-index: 100; top: var(--space-4); left: var(--space-4); padding: var(--space-3) var(--space-5); background: var(--color-text); color: var(--color-background); transform: translateY(calc(-100% - 2rem)); }
.skip-link:focus { transform: translateY(0); }
.button { display: inline-flex; justify-content: center; align-items: center; gap: var(--space-8); min-height: 3.25rem; font-size: var(--text-label); font-weight: 500; letter-spacing: .055em; transition: color var(--motion-duration), background-color var(--motion-duration), border-color var(--motion-duration); }
.button-primary { background: var(--color-text); color: var(--color-background); padding: var(--space-3) var(--space-6); }
.button-primary:hover { background: var(--color-accent); }
.button-text { border-bottom: 1px solid rgba(245, 245, 243, .3); }
.button-text:hover { color: var(--color-accent); border-color: var(--color-accent); }
.button > span { font-size: 1.25rem; line-height: 1; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: 0ms !important; animation: none !important; }
}
