:root {
    --color-black: #000000;
  --color-ink: #0d0d0d;
  --color-ink-soft: #161616;
  --color-paper: #f7f6f3;
  --color-paper-alt: #ffffff;
  --color-text-primary-on-light: #0d0d0d;
  --color-text-primary-on-dark: #f7f6f3;
  --color-text-secondary: #8a8a85;
  --color-text-secondary-on-dark: #9a9a95;
  --color-divider-light: #e4e2dc;
  --color-divider-dark: #2a2a2a;

    --font-display: 'Fraunces', 'Times New Roman', Georgia, serif;
  --font-ui: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;

  --fs-hero: clamp(2.75rem, 6vw + 1rem, 6.5rem);
  --fs-h2: clamp(2rem, 3.5vw + 0.5rem, 3.75rem);
  --fs-h3: clamp(1.5rem, 1.5vw + 0.75rem, 2.25rem);
  --fs-body-lg: clamp(1.125rem, 0.5vw + 1rem, 1.375rem);
  --fs-body: 1rem;
  --fs-label: 0.8125rem;

  --lh-display: 1.08;
  --lh-body: 1.6;
  --tracking-label: 0.14em;
  --tracking-label-wide: 0.18em;

    --space-4: 4px;
  --space-8: 8px;
  --space-16: 16px;
  --space-24: 24px;
  --space-32: 32px;
  --space-48: 48px;
  --space-64: 64px;
  --space-96: 96px;
  --space-128: 128px;
  --space-160: 160px;

    --container-max: 1440px;
  --container-text: 860px;
  --container-pad: clamp(20px, 5vw, 96px);
  --section-pad: clamp(64px, 10vw, 160px);
  --header-h: 64px;
    --logo-h: 38px;

    --ease-out-soft: cubic-bezier(0.16, 1, 0.3, 1);
  --dur-hover: 250ms;
  --dur-media: 500ms;
  --dur-reveal: 800ms;
}

@media (min-width: 640px) {
  :root {
    --header-h: 72px;
    --logo-h: 46px;
  }
}

@media (min-width: 1024px) {
  :root {
    --header-h: 88px;
    --logo-h: 60px;
  }
}

[data-theme='light'] {
  --bg: var(--color-paper);
  --text: var(--color-text-primary-on-light);
  --text-secondary: var(--color-text-secondary);
  --divider: var(--color-divider-light);
  --surface: var(--color-paper-alt);
}

[data-theme='dark'] {
  --bg: var(--color-ink);
  --text: var(--color-text-primary-on-dark);
  --text-secondary: var(--color-text-secondary-on-dark);
  --divider: var(--color-divider-dark);
  --surface: var(--color-ink-soft);
}

[data-theme='dark'][data-bleed='media'] {
  --bg: var(--color-black);
}

[data-theme='light'][data-surface='white'] {
  --bg: var(--color-paper-alt);
}