/* ==========================================================================
   Benchmark Air — Design Tokens
   Navy + gold editorial system: deep navy as the dominant dark color
   (header, hero, dark bands, footer), warm gold as the one loud accent,
   white/near-white for content sections. Single source of truth — no
   one-off hex values in components. Commits to one light-content look
   (no dark-mode swap).
   ========================================================================== */

:root {
  /* ---- Color: ink ramp — deep navy, the site's dominant dark color ---- */
  --ink-950: oklch(20% 0.07 264);
  --ink-800: oklch(30% 0.075 263);
  --ink-700: oklch(38% 0.07 262);
  --ink-600: oklch(48% 0.06 260);
  --ink-400: oklch(66% 0.045 258);

  /* ---- Color: paper ramp (crisp near-white) ---- */
  --paper-050: oklch(98% 0.004 95);
  --paper-100: oklch(95.5% 0.005 95);
  --paper-200: oklch(91% 0.007 95);
  --paper-border: oklch(87% 0.012 100);

  /* ---- Color: accent — warm gold (used sparingly: CTAs, frames, marks) ---- */
  --gold-300: oklch(91% 0.1 96);
  --gold-500: oklch(83% 0.16 92);
  --gold-600: oklch(75% 0.16 88);
  --gold-text: oklch(45% 0.13 70); /* AA-safe on light bg for small text */

  /* ---- Color: decorative — coral (heating) / teal (cooling), illustration only ---- */
  --coral-300: oklch(88% 0.07 40);
  --coral-500: oklch(72% 0.17 35);
  --teal-300: oklch(87% 0.05 195);
  --teal-500: oklch(68% 0.1 195);

  /* ---- Color: technical blue — brighter than navy, for frame accents / marks ---- */
  --blue-300: oklch(88% 0.05 250);
  --blue-500: oklch(52% 0.16 255);
  --blue-700: oklch(38% 0.14 258); /* AA-safe on light bg for small text */

  /* ---- Semantic ---- */
  --color-bg: var(--paper-050);
  --color-bg-dim: var(--paper-100);
  --color-surface: #fff;
  --color-ink: var(--ink-950);
  --color-ink-soft: var(--ink-700);
  --color-muted: var(--ink-600);
  --color-accent: var(--gold-500);
  --color-accent-strong: var(--gold-600);
  --color-accent-text: var(--gold-text);
  --color-technical: var(--blue-500);
  --color-technical-text: var(--blue-700);
  --color-technical-wash: var(--blue-300);
  --color-border: var(--paper-border);

  --color-footer-bg: var(--ink-950);
  --color-footer-ink: var(--paper-050);
  --color-footer-muted: var(--ink-400);
  --color-footer-border: oklch(38% 0.07 262 / 0.6);

  /* ---- Type families ---- */
  --font-display: "Archivo Black", "Arial Black", sans-serif;
  --font-logo: "Fraunces", "Iowan Old Style", "Georgia", serif;
  --font-body: "Work Sans", "Segoe UI", sans-serif;
  --font-mono: "IBM Plex Mono", "Consolas", monospace;

  /* ---- Type scale (fluid) ---- */
  --text-xs: clamp(0.72rem, 0.69rem + 0.15vw, 0.8rem);
  --text-sm: clamp(0.84rem, 0.8rem + 0.18vw, 0.92rem);
  --text-base: clamp(1rem, 0.96rem + 0.2vw, 1.08rem);
  --text-md: clamp(1.15rem, 1.08rem + 0.35vw, 1.3rem);
  --text-lg: clamp(1.4rem, 1.25rem + 0.75vw, 1.85rem);
  --text-xl: clamp(1.9rem, 1.6rem + 1.4vw, 2.7rem);
  --text-2xl: clamp(2.5rem, 1.9rem + 2.8vw, 4rem);
  --text-3xl: clamp(3rem, 2.1rem + 4.5vw, 5.4rem);

  --tracking-tight: -0.02em;
  --tracking-wide: 0.06em;
  --tracking-wider: 0.14em;

  --leading-body: 1.65;
  --leading-tight: 1.02;

  /* ---- Spacing scale ---- */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4.5rem;
  --space-9: 6.5rem;
  --space-10: 9rem;

  --content-max: 1200px;
  --measure: 65ch;

  /* ---- Radius (generous — this is the round, graphic-poster direction) ---- */
  --radius-sm: 8px;
  --radius-md: 16px;
  --radius-lg: 28px;
  --radius-pill: 999px;

  /* ---- Shadow ---- */
  --shadow-sm: 0 1px 2px oklch(20% 0.07 264 / 0.08);
  --shadow-md: 0 16px 40px oklch(20% 0.07 264 / 0.16);
  --shadow-card: 0 1px 0 var(--color-border), 0 20px 44px oklch(20% 0.07 264 / 0.14);

  /* ---- Motion ---- */
  --ease-dial: cubic-bezier(0.16, 1, 0.3, 1);
  --duration-fast: 160ms;
  --duration-base: 320ms;
  --duration-slow: 900ms;
  --duration-gauge: 1800ms;
}