/* ============================================================
   Thriv3 — Design tokens
   Source of truth: the Thriv3 app (thriv3.html). Warm-paper
   neutral shell + mosaic domain palette + teal single accent.
   Extended here with a marketing-scale type + spacing system.
   ============================================================ */
:root {
  /* ---- neutrals · warm paper ------------------------------ */
  --bg:        #F4F1EB;
  --bg-2:      #EFEBE3;   /* faint alt section */
  --card:      #FFFFFF;
  --card-2:    #FBF9F5;
  --ink:       #211F1B;   /* text strong */
  --ink-soft:  #4A463E;
  --text:      #211F1B;
  --text-m:    #6B675E;   /* muted */
  --text-mm:   #918C82;   /* faint */
  --gray-l:    #EBE7DF;
  --gray-m:    #DED8CE;
  --line:      #E2DDD3;
  --white:     #FFFFFF;

  /* ---- ink surface (for cinematic dark sections) ---------- */
  --ink-bg:    #1C2420;   /* deep warm green-black */
  --ink-bg-2:  #24302B;
  --ink-fg:    #EDEAE2;
  --ink-fg-m:  #A6B0A9;
  --ink-line:  rgba(255,255,255,.10);

  /* ---- mosaic · domain + score-band semantics ------------- */
  --teal:      #0E7A63;  --teal-l:#E1EFE9;  --teal-m:#159E7D;  --teal-2:#5FB8AE;
  --amber:     #A9761C;  --amber-l:#F5EBD6;  --amber-2:#E6AC3C;
  --purple:    #6C5A93;  --purple-l:#ECE8F3; --purple-2:#B4A6D8;
  --rose:      #B0526A;  --rose-l:#F6E5EA;   --rose-2:#C98CA1;
  --blue:      #3E6EA3;  --blue-l:#E7EEF6;   --blue-2:#4E7AA6;
  --red:       #BB5341;  --red-l:#F7E7E2;    --red-2:#C05C48;
  --green:     #367A48;  --green-l:#E6F0E3;  --green-2:#4E8C58;
  --orange:    #B7663A;  --orange-l:#F7E9DF;

  /* ---- typography ----------------------------------------- */
  --font:    'Geist', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --display: 'Familjen Grotesk', 'Geist', sans-serif;
  --mono:    'Geist Mono', ui-monospace, 'SF Mono', Menlo, monospace;

  /* fluid modular scale (min → max via clamp) */
  --fs-eyebrow: 0.75rem;                              /* 12px labels */
  --fs-body:    1.0625rem;                            /* 17px */
  --fs-lead:    clamp(1.15rem, 1.0rem + 0.7vw, 1.5rem);
  --fs-1: clamp(1.35rem, 1.15rem + 1.0vw, 1.9rem);   /* card heads */
  --fs-2: clamp(1.7rem, 1.3rem + 1.9vw, 2.6rem);     /* section heads */
  --fs-3: clamp(2.2rem, 1.5rem + 3.4vw, 3.6rem);     /* big section */
  --fs-hero: clamp(2.5rem, 1.7rem + 3.6vw, 4.6rem);  /* hero display */

  --lh-tight: 1.04;
  --lh-snug:  1.18;
  --lh-body:  1.62;
  --tr-tight: -0.022em;
  --tr-hero:  -0.03em;

  /* ---- spacing · 4/8 grid --------------------------------- */
  --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;
  --section-y: clamp(64px, 8vw, 120px);
  --container:  1200px;
  --measure:    62ch;
  --pad-x:      clamp(20px, 5vw, 48px);

  /* ---- radius / shadow / motion --------------------------- */
  --radius-xl: 28px;
  --radius:    18px;
  --radius-sm: 12px;
  --radius-pill: 999px;
  --shadow-sm: 0 1px 2px rgba(50,42,28,.06);
  --shadow:    0 1px 2px rgba(50,42,28,.05), 0 6px 20px -8px rgba(50,42,28,.14);
  --shadow-lg: 0 2px 4px rgba(50,42,28,.05), 0 24px 60px -18px rgba(50,42,28,.28);
  --shadow-ink: 0 30px 80px -30px rgba(0,0,0,.55);
  --ring:      0 0 0 3px rgba(14,122,99,.20);

  --dur-fast: 130ms;
  --dur:      230ms;
  --dur-slow: 520ms;
  --ease:     cubic-bezier(.22,.61,.36,1);   /* decelerate */
}