/* ============================================================
   FrontEdge Consulting - Design Tokens
   Phase 1 artifact. Canonical values from FRONTEDGE-WEBSITE-BIBLE.md §4/§5.
   Type system locked 2026-07-02 (Kurtis): Alumni Sans / Inter / Archivo.
   ============================================================ */

/* ---- Fonts ----
   Launch loads via Google Fonts CDN (all three are free + self-hostable).
   Self-host at Phase 5 for the perf budget (§9 gate 5). Import used in specimen:
   https://fonts.googleapis.com/css2?family=Alumni+Sans:ital,wght@0,300..800;1,400..700&family=Inter:wght@300;400;500;600&family=Archivo:wght@400;500;600&display=swap
*/

:root {
  /* ---------- Colour (§4 canonical, do not alter) ---------- */
  --c-dark:        #10271B;   /* dark-first page background            */
  --c-green:       #1A4D32;   /* brand green; raised panel on dark     */
  --c-slate:       #6A6D63;   /* warm slate: brand grey; LARGE text/graphics only (3.0:1 on dark) */
  --c-gold:        #C09E60;   /* accent: sparingly (labels/CTA/1 word); 6.2:1 on dark ✓ */
  --c-gold-deep:   #7A5F2B;   /* gold darkened for use ON bone: 4.9:1 ✓ (was #8A6D33 @ 4.0:1, failed AA at eyebrow size; taste pass 1) */
  --c-offwhite:    #F1EEE6;   /* primary text on dark                  */
  --c-bone:        #EDE8DC;   /* the single light-relief section       */

  /* derived */
  --c-hairline-dark: rgba(241, 238, 230, 0.12);  /* hairline on dark   */
  --c-hairline-bone: rgba(26, 77, 50, 0.18);     /* hairline on bone   */
  --c-input-border:  rgba(241, 238, 230, 0.44);  /* form input boundary on dark: ~3.6:1 vs #10271B, WCAG 1.4.11; 0.38->0.44 for headroom where the topo layer lightens the surround (phase 6 taste F1 + mobile delta pass 1) */
  --c-text-bone:     var(--c-green);             /* body text on bone (8.0:1 ✓) */

  /* contrast-safe caption variants (taste pass 1: raw slate fails AA at caption size) */
  --c-slate-light: #9A9D92;   /* captions/secondary ON DARK: 5.7:1 ✓ (slate lightened, keeps warm-grey read) */
  --c-slate-bone:  #5D6058;   /* captions/secondary ON BONE: 5.3:1 ✓ (slate darkened) */

  /* ---------- Type families ---------- */
  --f-display: 'Alumni Sans', 'Arial Narrow', sans-serif;  /* headlines, big numbers */
  --f-body:    'Inter', 'Inter-fallback', system-ui, -apple-system, sans-serif;  /* Inter-fallback = metric-matched local Arial (fonts.css): shift-free swap + LCP settles at fallback paint (2026-07-13) */
  --f-label:   'Archivo', 'Inter', sans-serif;             /* eyebrows/captions/CTA (CAPS) */

  /* ---------- Type scale (fluid, editorial) ---------- */
  --fs-display: clamp(3.2rem, 10vw, 8rem);     /* hero display          */
  --fs-h1:      clamp(2.6rem, 6vw, 4.5rem);
  --fs-h2:      clamp(2.4rem, 4.5vw, 3.4rem);  /* min 2rem->2.4rem: 375 section headers were optically sub-body (mobile audit 2026-07-11); desktop >=853px unchanged */
  --fs-h3:      1.6rem;
  --fs-h4:      1.4rem;                         /* FAQ questions, minor headings (added Phase 5 spot-check 2026-07-10) */
  --fs-lead:    clamp(1.2rem, 2.4vw, 1.9rem);  /* manifesto / big body  */
  --fs-subhead: clamp(1.05rem, 1.6vw, 1.35rem);
  --fs-body:    1.0625rem;                      /* 17px                  */
  --fs-small:   0.875rem;
  --fs-eyebrow: 0.72rem;                        /* Archivo caps          */
  --fs-caption: 0.68rem;

  /* line-heights */
  --lh-display: 0.88;   /* negative tuck for condensed display */
  --lh-head:    1.0;
  --lh-body:    1.6;
  --lh-lead:    1.5;

  /* tracking */
  --tr-display: 0.002em;
  --tr-label:   0.2em;    /* eyebrows/captions */
  --tr-cta:     0.1em;

  /* weights */
  --w-display: 600;
  --w-body:    400;
  --w-body-lt: 300;
  --w-label:   600;
  --w-cap:     500;

  /* ---------- Spacing rhythm (4px base) ---------- */
  --s-1: 0.25rem;  --s-2: 0.5rem;  --s-3: 0.75rem; --s-4: 1rem;
  --s-6: 1.5rem;   --s-8: 2rem;    --s-12: 3rem;   --s-16: 4rem;
  --s-24: 6rem;    --s-32: 8rem;
  --s-section: clamp(4rem, 10vh, 7rem);  /* vertical padding per section */

  /* ---------- Layout ---------- */
  --maxw: 1180px;
  --gutter: clamp(1.5rem, 5vw, 4rem);
  --radius: 4px;   /* pill buttons, small chrome only */
  --radius-card: 10px;  /* cream service cards (KW 2026-07-15: "try 10 and see how it looks") */

  /* ---------- Motion (§5 restraint; two signature moments) ---------- */
  --ease-reveal: cubic-bezier(0.16, 1, 0.3, 1);   /* expo-out: headline line reveal */
  --ease-soft:   cubic-bezier(0.4, 0, 0.2, 1);    /* fades, word reveal, hovers     */
  --dur-reveal:  0.9s;
  --dur-hover:   0.25s;
  --stagger:     0.08s;   /* per headline line */
}

/* Honour reduced motion globally (§9 gate 5) */
@media (prefers-reduced-motion: reduce) {
  :root { --dur-reveal: 0.001s; --dur-hover: 0.001s; --stagger: 0s; }
}