/* ============================================================
   KEELARIS DESIGN TOKENS  ·  packages/ui/tokens.css
   ------------------------------------------------------------
   THE single source of truth for design values. Change a value
   here and it propagates to the marketing site AND the app —
   nothing hard-codes a colour, font or size outside this file.

   Consumed by:
     • apps/marketing  (copied in at deploy; see deploy-marketing.sh)

   NOT consumed by apps/web. The app defines its own :root in
   src/app/globals.css and does not import this file — corrected here
   5 Aug 2026, the old claim that it did sent DESIGN.md wrong. The two
   layers are being reconciled; globals.css is the reference. See
   DESIGN.md for what is settled and what is still open.

   Layers: raw brand values → semantic aliases → type/space/motion.
   Components (base.css / React) reference the aliases, never raw hex.
   ============================================================ */

/* Inter, self-hosted. Latin subset, variable 400-700, 48 KB.
   Self-hosted deliberately: a Google Fonts link would put a third-party request
   (and the visitor's IP) on every page of a site about people's tax affairs. The
   app self-hosts the same face via next/font, so both surfaces match with no
   external call. File: apps/marketing/fonts/ (shipped as-is by Pages).
   Licence: SIL Open Font Licence 1.1. */
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("fonts/inter-latin-var.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
    U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191,
    U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Real italic, not a synthesised slant. Worth the extra 50 KB because the
   emphasis in both heroes is set in italic at display size ("...turns one
   filing into *five*", "...*With the team you already have*"), and a browser's
   faux oblique on those is a visibly sheared roman. Only loaded on pages that
   actually use italics. */
@font-face {
  font-family: "Inter";
  font-style: italic;
  font-weight: 400 700;
  font-display: swap;
  src: url("fonts/inter-latin-var-italic.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
    U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191,
    U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  /* — Brand palette: Navy + Gold — */
  --paper:      #FBF8F2;   /* page ground, warm off-white */
  --paper-2:    #EFE9DD;   /* raised wash / alt sections */
  --ink:        #12202F;   /* near-black, navy-leaning */
  --ink-soft:   #33404E;   /* secondary text */
  --muted:      #66707B;   /* labels, captions */
  --navy:       #23507E;   /* primary accent — buttons, links */
  --navy-deep:  #0E2135;   /* dark grounds — top nav, bands */
  --navy-tint:  #E7EDF5;   /* faint wash / hovers / hero glow */
  --gold:       #E8A11C;   /* character pop — the marigold */
  --hairline:   #E7E1D4;   /* warm hairline rules */
  --line:       #D5CDBD;   /* stronger structural line */
  --on-dark:    #F4F0E7;   /* text on dark grounds */
  --on-dark-mut:#9EB2C8;   /* muted text on dark grounds */

  /* — Semantic aliases (components reference these) — */
  --accent:      var(--navy);
  --accent-deep: var(--navy-deep);
  --accent-tint: var(--navy-tint);
  --pop:         var(--gold);
  /* legacy names kept so existing component/page CSS resolves unchanged */
  --green:      var(--navy);
  --green-deep: var(--navy-deep);
  --green-ink:  var(--navy);
  --green-tint: var(--navy-tint);
  --brass:      var(--gold);
  --marigold:   var(--gold);

  /* — Status: amber "due / needs attention" (pills) — */
  --warn-ink:   #8A5A1A;   /* amber text */
  --warn-line:  #EFE2CD;   /* amber border */
  --warn-bg:    #F8EFE0;   /* amber wash */

  /* — Type — */
  /* One typeface. There is no serif/sans split any more: the site and the app
     both run Inter, so a rule that wants "the font" asks for --font and gets it.
     The old --serif and --sans tokens were removed 5 Aug 2026 along with every
     reference to them. */
  --font:  "Inter","Segoe UI",system-ui,-apple-system,sans-serif;
  --step--1: 0.85rem;
  --step-0:  1.0625rem;
  --step-1:  1.2rem;
  --step-2:  clamp(1.4rem, 2.2vw, 1.75rem);
  --step-3:  clamp(1.9rem, 3.6vw, 2.75rem);
  --step-4:  clamp(2.5rem, 6vw, 4.6rem);

  /* — Layout, motion, elevation — */
  --maxw:   74rem;
  --ease:   cubic-bezier(.2,.6,.2,1);
  --shadow: 0 1px 2px rgba(18,32,47,.05), 0 18px 40px -18px rgba(18,32,47,.16);
}