/* =============================================================================
   Cohessra design tokens, from dna/DNA.md (Wispr Flow, measured) with the three declared deviations in
   DEVIATIONS.json (anchor colour, CTA fill, wordmark face). Nothing in base.css or a sec-*.css file hard-codes a
   colour, a radius, a font or a gap: if a value is not a token here, it does not belong in this system.
   Tracking trap: em tracking sits on each type role's class, never on body.
   ========================================================================== */
:root {
  /* --- colour (DNA.md "Colours") ------------------------------------------- */
  --ground:      #FFFFEB;                 /* page: cream (lumen) */
  --ink:         #1A1A1A;                 /* text, borders, dark panels (vast) */
  --ink-70:      rgba(26, 26, 26, .7);    /* secondary text, inactive links */
  --ink-50:      rgba(26, 26, 26, .5);    /* non-text lines and icons only: 3.3:1 on cream, below 4.5 for text */
  --ink-30:      rgba(26, 26, 26, .3);
  --card:        #E4E4D0;                 /* pale card, borders, segmented track (lumen-dark) */
  --nav-active:  #FFFDF9;                 /* active segmented tab */
  --anchor:      #0B3A86;                 /* DEVIATION: deep cobalt where the template has deep green #034F46 */
  --anchor-deep: #082A62;                 /* DEVIATION: darker cobalt where the template has #07352F */
  --band:        #1A1A1A;                 /* dark band */
  --cta:         #DCE6FF;                 /* DEVIATION: pale cobalt primary fill where the template has lilac #F0D7FF */
  --cta-ink:     #1A1A1A;
  --orange:      #FFA946;                 /* accents and tilted cards (glow) */
  --lilac:       #F0D7FF;                 /* (dawn) */
  --coral:       #FF6C4C;                 /* (flare) */
  --mint:        #34D399;                 /* status only: the Paid and Verified pills and the confirmed ticks, never a profession accent */
  --signal:      #FFBCF2;                 /* the template's own palette (signal): the Coaches accent where mint stood */
  --brand:       #2272C2;                 /* Cohessra's own mark */
  --link:        #0047AB;                 /* Cohessra's own link and focus blue, 9:1 on cream */
  --err:         #B3261E;
  --ink-soft:    rgba(255, 255, 235, .72);   /* secondary text on --band and --anchor */

  /* --- type (DNA.md "Type roles"; Google Fonts, OFL, self-hosted) ------------- */
  --display:  "EB Garamond", "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, serif;
  --body:     "Figtree", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --wordmark: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;   /* DEVIATION: Cohessra's header wordmark is Inter */
  /* fluid from the 390 value to the 1440 value (DNA.md): 48 to 96, 40 to 64, 44 to 75, 32 to 48, 56 to 120 */
  --fs-h1:    clamp(48px, calc(48px + (100vw - 390px) * .045714), 96px);     /* H1 96/91.2, tracking -0.03em */
  --fs-h2:    clamp(40px, calc(40px + (100vw - 390px) * .022857), 64px);     /* H2 64 */
  --fs-h2big: clamp(44px, calc(44px + (100vw - 390px) * .029524), 75px);     /* H2 big 75 */
  --fs-h3:    clamp(32px, calc(32px + (100vw - 390px) * .015238), 48px);     /* H3 48 */
  --fs-close: clamp(56px, calc(56px + (100vw - 390px) * .060952), 120px);    /* the closing statement 120/102 */
  --lh-display: .95;
  --lh-close:   .85;

  /* --- radius (DNA.md histogram, section scale) ------------------------------- */
  --r-xs: 4px;  --r-sm: 8px;  --r-nav: 10px;  --r-md: 16px;  --r-lg: 24px;  --r-xl: 32px;
  --r-section: 40px;          /* 2.5rem: sections under 768 */
  --r-corner: 80px;           /* the data-corners cap from 768 up */
  --r-pill: 1600px;
  --r-card: var(--r-md);

  /* --- shadow (DNA.md) -------------------------------------------------------- */
  --shadow-chip:  rgba(0, 0, 0, .1) 1px 1px 3px 0;
  --shadow-float: rgba(0, 0, 0, .3) 1.1px 1.1px 1.1px 0;
  --shadow-card:  var(--shadow-chip);

  /* --- frame (DNA.md: 1240 content with 100 gutters at 1440, 350 with 20 at 390) ---- */
  --content:  1240px;
  --gutter-x: clamp(20px, calc(20px + (100vw - 390px) * .07619), 100px);
  --gap:      24px;
  --gap-s:    8px;  --gap-m: 16px;  --gap-l: 32px;  --gap-xl: 48px;  --gap-xxl: 64px;
  --band-pad: clamp(64px, calc(64px + (100vw - 390px) * .034286), 100px);
  --demo-top: 112px;          /* where the Demo notes panel opens under the narrow header, pill bottom + 8px */

  /* compatibility names the Demo notes css (V2.1 device) reads */
  --tint: var(--card);  --line: var(--ink-50);  --line-soft: rgba(26, 26, 26, .14);
  --ink-quiet: var(--ink-70);  --ink-invert: var(--ground);  --glass: var(--ground);  --gutter: 12px;

  /* --- motion (dna/MOTION-DECODE.md) ----------------------------------------------- */
  --ease-rise: cubic-bezier(.16, .84, .44, 1);
  --dur-rise:  .6s;  --stagger: .08s;  --rise-y: 22px;
  --ease-hide: cubic-bezier(.45, 0, .55, 1);   /* power2.inOut, 0.5 s: the mobile header hide */

  /* --- the ONE nav breakpoint shared by CSS and JS (DETAILS.md: 991) ------------------ */
  --bp-nav: 991px;

  /* --- P1 additions (phase 2): values measured on the template that had no token yet --- */
  --bubble:     #F5F4F0;                  /* the FAQ answer bubble */
  --edge:       #D1D1C1;                  /* hairline of coded UI cards on cream */
  --ground-10:  rgba(255, 255, 235, .1);  /* translucent cream fills and borders on dark */
  --ground-18:  rgba(255, 255, 235, .18);
  --ink-10:     rgba(26, 26, 26, .1);
  --card-10:    rgba(228, 228, 208, .1);  /* active question row on the anchor panel */
  --dur-hover:  .3s;
  --r-14:       14px;                     /* the Monthly/Annual toggle shell (DETAILS part A device 7) */
  --r-12:       12px;                     /* the compare table sticky head and the footer product cards */
  --r-6:        6px;                      /* the footer product card tile (DETAILS part C device 17) */
  --r-deck:     48px;                    /* the tilted cards: the template's "regular" section radius, 3rem */
  --ease-ind:   cubic-bezier(.22, 1, .36, 1);   /* the rail indicator (served computed value) */
  --ease-draw:  cubic-bezier(.4, 0, .2, 1);
  --dim:        .7;                       /* inactive feature block: the template dims to .35, which fails 4.5:1; .7 keeps the highlight and passes */

  /* --- final touches (10 Nov 2026): Cohessra's own hover and the footer lockup (all new) --- */
  --cta-deep:   #B8CDFA;                  /* the primary button's hover sweep: a deeper tint of --cta; ink label on it is 10.9:1 */
  --dur-sweep:  .28s;                     /* the button fill sweeping in from the left edge */
  --dur-draw:   .24s;                     /* the underline drawing left to right under a link; the chevron nudge */
  --uline:      var(--link);              /* the drawn underline's colour; dark panels redefine it to --ground */
  --fs-lock-name: clamp(36px, calc(36px + (100vw - 390px) * .026667), 64px);    /* the footer lockup's "Cohessra": 36 at 390, 64 at 1440 */
  --fs-lock-tag:  clamp(24px, calc(24px + (100vw - 390px) * .007619), 32px);    /* the lockup's tagline: 24 at 390, 32 at 1440 */
}
