/* ==========================================================================
   153 Base — design tokens
   Palette contrast is verified, not estimated. Ratios noted per token.
   Light theme only: committed deliberately, not omitted.
   ========================================================================== */

/* ---------- Typefaces (self-hosted; no third-party font CDN) ---------- */
@font-face {
  font-family: "Source Serif 4";
  src: url("../fonts/source-serif-4-600.woff2") format("woff2");
  font-weight: 600; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Source Serif 4";
  src: url("../fonts/source-serif-4-700.woff2") format("woff2");
  font-weight: 700; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Source Serif 4";
  src: url("../fonts/source-serif-4-800.woff2") format("woff2");
  font-weight: 800; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "IBM Plex Sans";
  src: url("../fonts/ibm-plex-sans-400.woff2") format("woff2");
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "IBM Plex Sans";
  src: url("../fonts/ibm-plex-sans-600.woff2") format("woff2");
  font-weight: 600; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "IBM Plex Mono";
  src: url("../fonts/ibm-plex-mono-500.woff2") format("woff2");
  font-weight: 500; font-style: normal; font-display: swap;
}

:root {
  /* ---------- Colour ---------- */
  --c-ink:        #12181F;  /* 17.9:1 on white  — body text, headings        */
  --c-navy:       #103A5D;  /* 11.8:1 white-on  — structure, buttons, rules  */
  --c-blue:       #0A4F8A;  /*  8.4:1 on white  — links                      */
  --c-accent:     #F7602F;  /*  5.7:1 with ink  — taken from the logo vector,
                                not sampled from a compressed export. NEVER
                                carries white text (3.2:1 on white, fails AA). */
  --c-accent-ink: #12181F;  /* the only text colour permitted on --c-accent  */
  --c-page:       #FFFFFF;
  --c-surface:    #F4F6F8;  /* cool grey, biased toward navy                 */
  --c-muted:      #5A6672;  /*  5.9:1 on white  — secondary text             */
  --c-border-fn:  #6B7785;  /*  4.6:1 on white  — functional edges: inputs,
                                button outlines. Meets 1.4.11's 3:1.         */
  --c-border-dec: #D3DAE0;  /*  1.4:1 — DECORATIVE RULES ONLY. Never an input
                                border; it would fail 1.4.11.                */

  /* Dark band, ratios measured against --c-dark:
       white   11.8:1  — any text
       muted    7.0:1  — any text
       accent   3.7:1  — LARGE TEXT ONLY (>=24px, or >=18.7px bold).
                         Above WCAG's 3:1 for large text, below the 4.5:1
                         for body size. Never use it for links or copy here. */
  --c-dark:       #103A5D;
  --c-dark-text:  #FFFFFF;
  --c-dark-muted: #B8CADB;  /*  7.0:1 on navy — secondary text on the band   */
  --c-dark-rule:  rgba(255,255,255,.22); /* decorative only, as above        */
  --c-dark-link:  #9EC5EA;  /*  6.5:1 on navy — link hover on the dark band  */

  /* ---------- Semantic ---------- */
  --c-error:   #B3261E;     /* 6.5:1 on white */
  --c-success: #14663D;     /* 7.0:1 on white */
  --c-warning: #8A5A00;     /* amber cannot carry text on white; this can    */

  /* ---------- Type ---------- */
  --f-serif: "Source Serif 4", Georgia, "Iowan Old Style", "Times New Roman", serif;
  /* IBM Plex Sans, so the body face and the data face are one family. */
  --f-sans:  "IBM Plex Sans", -apple-system, BlinkMacSystemFont, "Segoe UI",
             Roboto, Helvetica, Arial, sans-serif;
  --f-mono:  "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  --t-display: clamp(2.75rem, 7vw, 5rem);
  --t-h1:      clamp(2.5rem, 6vw, 4rem);
  --t-h2:      clamp(2rem, 4vw, 3rem);
  --t-h3:      1.5rem;
  --t-h4:      1.25rem;
  --t-body:    1.125rem;   /* 18px, deliberately above the usual 16 */
  --t-small:   0.9375rem;
  --t-caption: 0.875rem;   /* floor — nothing on the site goes below 14px */

  /* ---------- Space (4px base) ---------- */
  --s-1: 4px;  --s-2: 8px;  --s-3: 12px; --s-4: 16px; --s-5: 24px;
  --s-6: 32px; --s-7: 48px; --s-8: 64px; --s-9: 96px;

  /* ---------- Layout ---------- */
  --w-max: 1200px;
  --w-measure: 66ch;
  --radius-sm: 4px;
  --radius: 8px;
}