/* tokens.css
   Brand tokens. Palette, radius, measure. Change a colour here and it changes everywhere.
   Part of The 12-Point Retirement Checkup - Heritage Edition.
   Load order matters: see the <link> block in any page. */

/* =================================================================
   THE 12-POINT RETIREMENT CHECKUP — HERITAGE EDITION
   A white-label lead-generation tool for financial advisors.
   Single file. No dependencies.

   Design language: pine, brass, cream. Fraunces + Libre Franklin.
   Matches the Retirement Paycheck Suite / Caldwell brand world.

   >>> TO PERSONALIZE: edit ONLY the ADVISOR CONFIG block in the
   <script> section near the bottom. Nothing else needs to change.
   ================================================================= */

:root{
  --pine:#0F4C45;         /* primary — trust, permanence        */
  --pine-deep:#0A3833;    /* pressed / deepest                  */
  /* The dark panels — gate masthead and report score — share one ground so
     the unlock reads as the same document revealing itself. Do not use for
     type, buttons or borders; those stay on --pine. */
  --pine-panel:#0B302B;
  --brass:#B08A38;
  /* Small brass type on cream measured 2.92:1 — below even the large-text
     threshold. --brass stays for fills, borders, rings and rules where
     contrast doesn't apply; --brass-text is for words. 4.99:1. */
  --brass-text:#846425;        /* accent — rules, eyebrows, the ring */
  --brass-lite:#C9A24B;
  --ink:#22312E;          /* body text — warm charcoal          */
  --ink-soft:#5E6D69;     /* secondary text                     */
  --hair:#D8D0C0;         /* hairline borders on cream          */
  --cream:#F7F4ED;        /* page ground                        */
  --cream-deep:#EFE9DC;   /* alternating band                   */
  --paper:#FFFDF8;        /* cards                              */
  /* Stoplight signals — solid fills: chips, status dots, icons.
     Tuned so green and red stay separable under red-green colour
     blindness (dE 25) rather than collapsing together. */
  --sig-green:#22B356;
  --sig-yellow:#FFC300;
  --sig-red:#BC1409;
  --sig-ink:#3A2606;      /* dark numeral/icon for yellow fills */

  /* Same three hues, darkened for TEXT on cream paper (all >=4.5:1):
     pill labels, block titles, the GREEN/ORANGE/RED words. */
  --good:#15703A;         /* covered                            */
  --partial:#8A5A10;      /* partly covered                     */
  --gap:#A31408;          /* not yet addressed                  */
  /* Text on the dark pine card. Solid values, not cream-at-opacity:
     opacity multiplies against whatever is behind it, so the real
     contrast drifts and is easy to get wrong. All of these clear 7:1
     (WCAG AAA) because the audience is largely 55-75. */
  --on-pine:#E6E3D6;      /* headings, emphasis      11.1:1 */
  --on-pine-soft:#D6D5C6; /* body + instruction copy  9.6:1 */
  --on-pine-mute:#C6C7B7; /* labels, secondary        8.3:1 */
  --on-pine-fine:#B4B8A8; /* legal fine print         7.0:1 */

  --accent:#0F4C45;       /* overridden by config               */
  --radius:5px;
  --max:1000px;
  --prose:560px;          /* one measure for every prose column       */
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  font-family:"Libre Franklin",-apple-system,BlinkMacSystemFont,"Helvetica Neue",sans-serif;
  color:var(--ink);
  background:var(--cream);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
.wrap{max-width:var(--max);margin:0 auto;padding:0 24px}

