/* ============================================================
   NASH KEYS — DESIGN TOKENS
   Copied from Desk/Websites/design-system/tokens.css (source of
   truth) + Nash brand layer. Golden-ratio fluid type (Utopia
   method) · Fibonacci space · WCAG-checked palette.
   Synced: 2026-07-24
   ============================================================ */
:root {
  /* ---------- Fluid type — base 16px@375 → 18px@1240 ---------- */
  --fs-base: clamp(1rem, 0.9457rem + 0.2312vw, 1.125rem);
  --fs--1: calc(var(--fs-base) * 0.833);
  --fs-0:  var(--fs-base);
  --fs-1:  calc(var(--fs-base) * 1.22);
  --fs-2:  calc(var(--fs-base) * 1.618);
  --fs-3:  calc(var(--fs-base) * 2);
  --fs-4:  calc(var(--fs-base) * 2.618);
  --fs-display-lg: clamp(2.6rem, 1.9rem + 3.4vw, 3.6rem);
  --fs-display-xl: clamp(3rem, 2.05rem + 4.6vw, 4.4rem);

  /* ---------- Space — Fibonacci only ---------- */
  --sp-8: 8px; --sp-13: 13px; --sp-21: 21px;
  --sp-34: 34px; --sp-55: 55px; --sp-89: 89px;
  --sp-section: clamp(34px, 6vw, 55px);
  --sp-section-lg: clamp(55px, 9vw, 89px);

  /* ---------- Radius (Fibonacci) ---------- */
  --radius-sm: 8px; --radius-md: 13px; --radius-lg: 21px;

  /* ---------- Line height / measure ---------- */
  --lh-tight: 1.05; --lh-heading: 1.2; --lh-body: 1.55;
  --measure: 68ch;

  /* ---------- Depth ---------- */
  --shadow-1: 0 2px 8px rgba(0, 0, 0, 0.18);
  --shadow-2: 0 8px 28px rgba(0, 0, 0, 0.28);

  /* ---------- Motion ---------- */
  --ease: cubic-bezier(0.4, 0, 0.2, 1);
  --t-fast: 0.2s var(--ease);
  --t-slow: 0.35s var(--ease);

  /* ---------- Layout ---------- */
  --container-max: 1200px;
  --column-narrow: 640px;
  --ratio-golden: 1.618;

  /* ============================================================
     BRAND LAYER — The Nash Keys (Pantone-exact)
     Contrast-verified 2026-07-24 (design-system/tools/contrast_check.py):
     cream/black 14.8:1 · gray-300/card 7.9:1 · gray-400/card 6.5:1 ·
     yellow/card 11.6:1 · orange/black 8.2:1 · cream/red 5.6:1 — all AA+.
     gray-500 FAILS AA for normal text on dark (3.6:1) — decorative only.
     ============================================================ */
  --nash-black: #0E151C;
  --nash-black-light: #182230;
  --nash-card: #141d27;
  --nash-red: #A62C2A;
  --nash-red-light: #c43b39;
  --nash-orange: #F89522;
  --nash-yellow: #F9D074;
  --cream: #EDE6DB;
  --gray-300: #b8b0a4;
  --gray-400: #a89f92;   /* AA-safe muted text on dark */
  --gray-500: #7a7265;   /* ⚠ decorative/large only — fails AA <18px */
  --line: rgba(237, 230, 219, 0.09);
  --font-display: 'Bebas Neue', 'Impact', sans-serif;
  --font-heading: 'Oswald', 'Arial Narrow', sans-serif;
  --font-body: 'Lato', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}