/* ==========================================================================
   Trouvera Labs design tokens
   Locked 2026-08-20. Single source of truth for color, type, and spacing.
   Change a value here and it propagates everywhere.
   ========================================================================== */

:root {
  /* ---- brand ---- */
  --p:        #0E7C86;  /* teal, primary. Buttons, CTA bands, links.         */
  --p-dk:     #0A5F67;  /* primary hover, gradient tail                      */
  --p-sft:    #E3EDEE;  /* teal wash for subtle fills and icon plates        */

  /* ---- accent: three tokens, not one ----------------------------------
     Terracotta fails AA at body-text size on light backgrounds in its base
     form (3.3:1). Use --a for FILLS only; --a-dk for text on light;
     --a-lt for text and lines on dark. See README "Accent needs three tokens".
     ------------------------------------------------------------------- */
  --a:        #D07750;  /* fills only: buttons, badges, bars, step dots      */
  --a-dk:     #9E4E2A;  /* accent as TEXT on light. 5.0:1 on --surface,
                           5.7:1 on --card. Must clear 4.5:1 against BONE,
                           not just against the card white: bone is darker,
                           and #A9552F only reached 4.46:1 there.            */
  --a-dkr:    #83401F;  /* accent button hover. 7.8:1 with white             */
  --a-lt:     #E39068;  /* accent as TEXT/LINE on dark. 7.4:1 on --dark      */
  --a-sft:    #F6E4DA;  /* terracotta wash for badges and row backgrounds    */

  /* ---- neutrals ---- */
  --ink:      #0C1719;  /* body text                                         */
  --muted:    #586669;  /* secondary text. 4.8:1 on --surface                */
  --surface:  #F1EDE4;  /* bone. The page background                         */
  --card:     #FCFBF8;  /* warm near-white, lifted off the surface           */
  --line:     #DFD9CC;  /* borders, rules, dividers                          */
  --dark:     #0C1A1E;  /* hero base, footer                                 */
  --dark2:    #142C31;  /* hero gradient mid                                 */
  --onDark:   #BCCCCE;  /* body text on dark                                 */

  /* ---- state ----------------------------------------------------------
     Warm accent sits close to the usual warning orange, so error/warning
     need their own hues that cannot be confused with the brand.
     ------------------------------------------------------------------- */
  --ok:       #2F7A55;
  --warn:     #B07A1E;
  --err:      #A3302B;

  /* ---- type ---- */
  --font-head: 'Sora', ui-sans-serif, system-ui, sans-serif;
  --font-body: 'Inter', ui-sans-serif, system-ui, -apple-system, sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, monospace;

  --step--1: 0.8125rem;  /* 13px captions, eyebrows          */
  --step-0:  0.9375rem;  /* 15px body                        */
  --step-1:  1.125rem;   /* 18px lead paragraphs             */
  --step-2:  1.375rem;   /* 22px h3                          */
  --step-3:  1.6875rem;  /* 27px h2                          */
  --step-4:  clamp(2rem, 4.2vw, 3.25rem); /* h1 / hero       */

  /* ---- space ---- */
  --s-1: 0.5rem;  --s-2: 0.75rem; --s-3: 1rem;    --s-4: 1.5rem;
  --s-5: 2rem;    --s-6: 3rem;    --s-7: 4.5rem;  --s-8: 6rem;

  /* ---- shape ---- */
  --radius:    9px;
  --radius-sm: 6px;
  --radius-lg: 14px;
  --container: 1140px;
  --measure:   68ch;

  --shadow-sm: 0 1px 2px rgba(12,23,25,.05);
  --shadow:    0 2px 8px rgba(12,23,25,.07);
  --shadow-lg: 0 12px 32px rgba(12,23,25,.12);

  --ease: cubic-bezier(.2,.6,.3,1);
}
