/* ============================================================
   OliverDeck — TIER 1 · REFERENCE TOKENS (primitives)
   Raw palettes + raw scales. The single source of truth.
   Components must NOT reference these directly — they go
   through Tier 2 (semantic) / Tier 3 (component) tokens.
   The --od-* aliases give the canonical, predictable names;
   the short legacy names (--olive-400, --s-6, --r-md …) are
   kept so the existing OliverDeck prototype keeps working.
   ============================================================ */

:root {
  /* ---------- BRAND PRIMARY — olive-gold (from the logo) ----------
     Canonical brand accent = #EEC30D (logo). olive-400 is the anchor;
     the ramp brackets it for hovers, tints and on-dark variants. */
  --olive-50:  #fdf8e4;
  --olive-100: #f9ecb2;
  --olive-200: #f4dc79;
  --olive-300: #eecb4a;
  --olive-400: #eec30d;   /* ← BRAND. logo + token unified (was #e6c02e) */
  --olive-500: #d4ab1c;
  --olive-600: #b28912;
  --olive-700: #8b6a0e;
  --olive-800: #604a0a;
  --olive-900: #3b2e08;

  /* ---------- WOOD / EARTH — primary supporting palette ----------
     Teak, venge, graphite, sand — drawn from product photography. */
  --wood-50:  #faf6f0;
  --wood-100: #f0e7d7;
  --wood-200: #e1cfaf;
  --wood-300: #c9ae7e;
  --wood-400: #a9895a;   /* tik */
  --wood-500: #8b6a43;   /* natural */
  --wood-600: #6b4f30;   /* walnut */
  --wood-700: #4a361f;   /* venge */
  --wood-800: #3a2718;   /* dark venge — warmer */
  --wood-900: #281a10;   /* deep espresso brown — hero/footer field (was near-black #181009) */

  /* ---------- MOSS / FOREST — secondary accent ("expert" sections) ---------- */
  --moss-50:  #f2f7ee;
  --moss-100: #deeacf;
  --moss-200: #bdd5a2;
  --moss-300: #8fb472;
  --moss-400: #6a9150;
  --moss-500: #4e7338;
  --moss-600: #3c5b2a;
  --moss-700: #2f471f;
  --moss-800: #1f2f15;
  --moss-900: #121c0c;

  /* ---------- CLAY / TERRACOTTA — warm accent ("sunset on terrace") ---------- */
  --clay-50:  #fbeee7;
  --clay-100: #f5d6c4;
  --clay-200: #eab79a;
  --clay-300: #d99468;
  --clay-400: #c57540;
  --clay-500: #a85c2e;
  --clay-600: #864622;
  --clay-700: #65341a;
  --clay-800: #442211;
  --clay-900: #26130a;

  /* ---------- LAGOON / DEEP TEAL — cool accent ("pool & water") ---------- */
  --lagoon-50:  #e6f1f0;
  --lagoon-100: #c5dcd9;
  --lagoon-200: #94beb9;
  --lagoon-300: #5f9a93;
  --lagoon-400: #3a7a72;
  --lagoon-500: #285d57;
  --lagoon-600: #1e4844;
  --lagoon-700: #173735;
  --lagoon-800: #0f2523;
  --lagoon-900: #081615;   /* fixed: was #08161515 (invalid 8-digit hex) */

  /* ---------- AMBER / HONEY — mid-accent between olive and clay ---------- */
  --amber-50:  #fff3d8;
  --amber-100: #fde2a1;
  --amber-200: #f8c95e;
  --amber-300: #efab2c;
  --amber-400: #da8c14;
  --amber-500: #b46e0e;
  --amber-600: #8a530a;
  --amber-700: #633b07;
  --amber-800: #3f2504;
  --amber-900: #221402;

  /* ---------- NEUTRALS — slightly warm, paper-like ---------- */
  --neutral-0:   #ffffff;
  --neutral-50:  #faf8f4;   /* paper */
  --neutral-100: #f3efe7;
  --neutral-200: #e6e0d2;
  --neutral-300: #cec6b4;
  --neutral-400: #a79e8b;
  --neutral-500: #7d7565;
  --neutral-600: #5c5547;
  --neutral-700: #403a2f;
  --neutral-800: #26221b;
  --neutral-900: #13110d;

  /* ---------- TYPOGRAPHY — families ---------- */
  /* Manrope: warm humanist sans — UI + body. Unbounded: geometric
     display face with character — hero / titles / wordmark. */
  --font-body:    'Manrope', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-display: 'Unbounded', 'Manrope', sans-serif;
  --font-mono:    ui-monospace, SFMono-Regular, Menlo, monospace;
  --od-font-body:    var(--font-body);
  --od-font-display: var(--font-display);
  --od-font-mono:    var(--font-mono);

  /* ---------- TYPE SCALE — fluid display, fixed body ---------- */
  --fs-d1: clamp(2.25rem, 1.3rem + 3.6vw, 3.5rem); /* @kind other */
  --fs-d2: clamp(1.85rem, 1.2rem + 2.6vw, 2.875rem); /* @kind other */
  --fs-h1: clamp(1.6rem, 1.15rem + 1.6vw, 2.25rem); /* @kind other */
  --fs-h2: clamp(1.5rem,  1.1rem + 1.6vw, 2.25rem); /* @kind other */
  --fs-h3: 1.5rem;     /* 24 */
  --fs-h4: 1.25rem;    /* 20 */
  --fs-h5: 1.0625rem;  /* 17 */
  --fs-body-lg: 1.125rem;  /* 18 */
  --fs-body:    1rem;      /* 16 */
  --fs-body-sm: 0.9375rem; /* 15 */
  --fs-small:   0.8125rem; /* 13 */
  --fs-tiny:    0.6875rem; /* 11 — caps labels */

  --lh-tight: 1.1;   /* @kind other */
  --lh-snug:  1.25;  /* @kind other */
  --lh-body:  1.55;  /* @kind other */
  --lh-loose: 1.7;   /* @kind other */

  --fw-light:   300; /* @kind other */
  --fw-regular: 400; /* @kind other */
  --fw-medium:  500; /* @kind other */
  --fw-semi:    600; /* @kind other */
  --fw-bold:    700; /* @kind other */
  --fw-black:   800; /* @kind other */

  --tracking-caps:  0.08em;  /* @kind other */
  --tracking-tight: -0.02em; /* @kind other */
  --tracking-snug:  -0.01em; /* @kind other */

  /* canonical aliases */
  --od-text-d1: var(--fs-d1);  --od-text-d2: var(--fs-d2);
  --od-text-h1: var(--fs-h1);  --od-text-h2: var(--fs-h2);
  --od-text-h3: var(--fs-h3);  --od-text-h4: var(--fs-h4);  --od-text-h5: var(--fs-h5);
  --od-text-body-lg: var(--fs-body-lg); --od-text-body: var(--fs-body);
  --od-text-body-sm: var(--fs-body-sm); --od-text-caption: var(--fs-small);
  --od-text-eyebrow: var(--fs-tiny);

  /* ---------- SPACING (4-based) ---------- */
  --s-1:  4px;   --s-2:  8px;   --s-3:  12px;  --s-4:  16px;
  --s-5:  20px;  --s-6:  24px;  --s-8:  32px;  --s-10: 40px;
  --s-12: 48px;  --s-14: 56px;  --s-16: 64px;  --s-20: 80px;
  --s-24: 96px;  --s-32: 128px;
  --od-space-1: var(--s-1);  --od-space-2: var(--s-2);  --od-space-3: var(--s-3);
  --od-space-4: var(--s-4);  --od-space-5: var(--s-5);  --od-space-6: var(--s-6);
  --od-space-8: var(--s-8);  --od-space-10: var(--s-10); --od-space-12: var(--s-12);
  --od-space-16: var(--s-16); --od-space-20: var(--s-20); --od-space-24: var(--s-24);

  /* ---------- RADII ---------- */
  --r-xs:  4px;  --r-sm: 8px;  --r-md: 12px;  --r-lg: 16px;
  --r-xl:  24px; --r-2xl: 32px; --r-pill: 999px;
  --od-radius-xs: var(--r-xs);   --od-radius-sm: var(--r-sm);
  --od-radius-md: var(--r-md);   --od-radius-lg: var(--r-lg);
  --od-radius-xl: var(--r-xl);   --od-radius-2xl: var(--r-2xl);
  --od-radius-pill: var(--r-pill);

  /* ---------- SHADOWS — warm, earth-toned (never cold-blue) ---------- */
  --shadow-xs: 0 1px 2px rgba(48, 32, 12, 0.06);
  --shadow-sm: 0 2px 6px rgba(48, 32, 12, 0.07), 0 1px 2px rgba(48, 32, 12, 0.05);
  --shadow-md: 0 6px 18px rgba(48, 32, 12, 0.10), 0 2px 4px rgba(48, 32, 12, 0.06);
  --shadow-lg: 0 18px 40px rgba(48, 32, 12, 0.14), 0 4px 10px rgba(48, 32, 12, 0.07);
  --shadow-xl: 0 30px 60px rgba(48, 32, 12, 0.22), 0 10px 20px rgba(48, 32, 12, 0.10);
  --shadow-inset: inset 0 1px 2px rgba(48, 32, 12, 0.08);
  --shadow-glow: 0 0 0 4px rgba(238, 195, 13, 0.30);   /* olive focus ring */
  --od-shadow-xs: var(--shadow-xs); --od-shadow-sm: var(--shadow-sm);
  --od-shadow-md: var(--shadow-md); --od-shadow-lg: var(--shadow-lg);
  --od-shadow-xl: var(--shadow-xl); --od-shadow-inset: var(--shadow-inset);

  /* ---------- LAYOUT ---------- */
  --container:    1440px;
  --container-sm: 960px;
  --gutter:    var(--s-6);
  --gutter-lg: var(--s-8);
  --od-container: var(--container);
  --od-container-sm: var(--container-sm);

  /* ---------- MOTION ---------- */
  --ease-out:    cubic-bezier(0.22, 0.61, 0.36, 1); /* @kind other */
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);    /* @kind other */
  --ease-spring: cubic-bezier(0.34, 1.4, 0.64, 1);  /* @kind other */
  --dur-fast:  120ms; /* @kind other */
  --dur-base:  200ms; /* @kind other */
  --dur-slow:  320ms; /* @kind other */
  --dur-enter: 480ms; /* @kind other */
  --od-ease-out: var(--ease-out); --od-ease-in-out: var(--ease-in-out); --od-ease-spring: var(--ease-spring);
  --od-dur-fast: var(--dur-fast); --od-dur-base: var(--dur-base); --od-dur-slow: var(--dur-slow);

  /* ---------- Z-INDEX scale ---------- */
  --z-sticky:  100;  /* @kind other */
  --z-overlay: 500;  /* @kind other */
  --z-modal:   900;  /* @kind other */
  --z-toast:   1200; /* @kind other */
}