/* ===========================================================================
   AWPCAB Design Tokens  - single source of truth (mirrors docs/03-design-system)
   In production these export to tokens.json + tailwind.config + theme.json.
   =========================================================================== */
:root {
  /* ---- Brand palette, EXACT LOGO COLORS: #3a2313 #F8941E #a87b51 #774c29 ---- */
  /* browns from the hands ring: dark #3a2313, mid #774c29, light #a87b51 */
  --clay-900:#3a2313; --clay-700:#5a3a20; --clay-500:#774c29; --clay-300:#a87b51; --clay-100:#d8c2aa;
  /* the logo's signature orange band #F8941E + shades/tints */
  --orange-500:#F8941E; --orange-600:#D9760A; --orange-700:#A85A0A;
  --orange-400:#FAA847; --orange-300:#FCC580; --orange-200:#FDE2BD;
  --ink-900:#1E1206; --ink-700:#3a2313;
  /* legacy accent slots all remapped onto logo colours so nothing off-palette renders */
  --plum-600:#774c29;
  --marigold-500:#FAA847; --indigo-600:#774c29; --teal-500:#774c29; --ribbon-600:#D9760A;
  --coral-500:#D9760A; --coral-600:#A85A0A; --coral-400:#F8941E;

  /* ---- Warm neutrals derived from the logo cream (#F0F0E6) ---- */
  --bone-50:#FAF7F0; --bone-100:#F0EADF; --sand-200:#E4D8C4;
  --stone-400:#B3A188; --stone-600:#6E5A45; --white:#FFFFFF;

  /* ---- Semantic ---- */
  --color-bg:var(--bone-50);
  --color-surface:var(--white);
  --color-surface-alt:var(--bone-100);
  --color-text:var(--ink-900);
  --color-text-muted:var(--stone-600);
  --color-heading:var(--clay-700);
  --color-primary:var(--orange-500);
  --color-primary-hover:var(--orange-600);
  --color-accent:var(--clay-500);
  --color-link:var(--orange-600);
  --color-border:var(--sand-200);
  --color-focus:var(--orange-500);

  /* ---- Type ---- */
  --font-display:"Afacad", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;  /* headlines */
  --font-punch:"Afacad", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;    /* big display */
  --font-script:"Caveat", "Segoe Script", cursive;                                    /* handwritten accent */
  --font-body:"Afacad", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;     /* subtitles/body */

  --fs-display-1:clamp(3rem, 9vw, 8.5rem);
  --fs-display-2:clamp(2.5rem, 6vw, 5.5rem);
  --fs-h1:clamp(2.25rem, 4vw, 3.75rem);
  --fs-h2:clamp(1.75rem, 2.6vw, 2.75rem);
  --fs-h3:clamp(1.375rem, 1.8vw, 1.875rem);
  --fs-h4:1.25rem;
  --fs-lead:clamp(1.3rem, 1.4vw, 1.5rem);
  --fs-body:1.5rem;
  --fs-small:1.2rem;
  --fs-eyebrow:1.2rem;

  /* ---- Spacing (8px base) ---- */
  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px; --space-5:24px;
  --space-6:32px; --space-7:48px; --space-8:64px; --space-9:96px; --space-10:128px;
  --space-11:160px; --space-12:240px;
  --section-y:clamp(2.5rem, 5vw, 5.5rem);
  --gutter:clamp(1.25rem, 3vw, 3rem);

  /* ---- Widths ---- */
  --w-prose:68ch; --w-content:1180px; --w-wide:1320px;

  /* ---- Radius ---- */
  --radius-xs:4px; --radius-sm:8px; --radius-md:14px; --radius-lg:22px;
  --radius-xl:32px; --radius-2xl:44px; --radius-pill:999px;
  --radius-organic:42px 42px 8px 42px;

  /* ---- Elevation (warm) ---- */
  --shadow-1:0 1px 2px rgba(26,16,4,.06), 0 1px 1px rgba(26,16,4,.04);
  --shadow-2:0 4px 12px rgba(26,16,4,.08), 0 2px 4px rgba(26,16,4,.05);
  --shadow-3:0 12px 32px rgba(26,16,4,.12), 0 4px 8px rgba(26,16,4,.06);
  --shadow-4:0 28px 64px rgba(58,30,20,.18);
  --shadow-glow:0 8px 40px rgba(248,148,30,.30);

  /* ---- Glass ---- */
  --glass-bg:rgba(250,246,239,.72);
  --glass-blur:blur(18px) saturate(140%);
  --glass-border:1px solid rgba(255,255,255,.4);

  /* ---- Motion ---- */
  --ease-out-soft:cubic-bezier(.22,1,.36,1);
  --ease-out-expo:cubic-bezier(.16,1,.3,1);
  --ease-in-out-quart:cubic-bezier(.76,0,.24,1);
  --ease-spring:cubic-bezier(.34,1.56,.64,1);
  --dur-fast:180ms; --dur-base:320ms; --dur-slow:600ms;

  --header-h:76px;
}

/* ---- Warm dark theme ---- */
:root[data-theme="dark"] {
  --color-bg:#160E04; --color-surface:#21160A; --color-surface-alt:#2A1C0C;
  --color-text:#F3E8DD; --color-text-muted:#C6B49C; --color-heading:#FAA847;
  --color-primary:#FAA847; --color-primary-hover:#FCC580; --color-link:#FAA847;
  --color-border:#3A2912;
  --glass-bg:rgba(22,14,4,.66);
}