/* ═══════════════════════════════════════════════
   ACUMINATE — Brand tokens
   Source: brand/Acuminate-Brand-ID-Deck-1.0.pptx (v1.0, May 2026)
           brand/Acuminate-Brand-ID-How-to-Use.docx (v1.1)
   The deck wins where the two disagree.

   Custom properties only — this file styles nothing by itself.
   --brand-* tokens describe the brand guide as written; --site-*
   tokens are the website's own choices, built from them. Every page
   uses them; the old violet/cyan design was retired on 19 Sep 2026.
═══════════════════════════════════════════════ */

:root {
    /* ── Primary palette ──────────────────────────
       Proportions across any view: roughly 60% Linen,
       30% Midnight, 10% Coral. More Coral than Midnight
       means it's overcooked.                          */
    --brand-midnight: #1B2B4B;        /* Primary Blue */
    --brand-secondary-blue: #2E4A7A;  /* Mid blue */
    --brand-coral: #E8694A;           /* Coral Accent */
    --brand-linen: #F5EDE8;           /* Warm White */
    --brand-slate: #8A9BB5;           /* Muted Slate */

    /* ── Secondary palette ────────────────────────
       For charts, hover states and illustration only.
       Never carries the brand on its own.             */
    --brand-deep-blue: #0F1B30;
    --brand-coral-light: #F28E78;
    --brand-coral-dark: #B04A30;

    /* ── Colour roles ─────────────────────────────
       Only roles the How-to guide states outright.    */
    --brand-surface: var(--brand-linen);             /* default page background */
    --brand-surface-dark: var(--brand-midnight);     /* dark backgrounds */
    --brand-card-on-dark: var(--brand-linen);        /* cards on Midnight surfaces */
    --brand-text: var(--brand-midnight);             /* body text on light */
    --brand-text-secondary: var(--brand-secondary-blue); /* secondary text, supporting copy */
    --brand-link: var(--brand-secondary-blue);
    --brand-accent: var(--brand-coral);              /* CTAs, eyebrow labels, the logo — one per view */
    --brand-muted: var(--brand-slate);               /* captions, muted labels, footers — never body copy */

    /* ── Typefaces ────────────────────────────────
       Fallbacks are the guide's own. Pages built from
       templates/base.html load the brand fonts from
       Google Fonts; the homepage doesn't yet.          */
    --brand-font-wordmark: 'Sora', 'Helvetica Neue', Arial, sans-serif;
    --brand-font-heading: 'Instrument Sans', Inter, 'Helvetica Neue', Arial, sans-serif;
    --brand-font-body: 'Source Serif 4', Georgia, 'Times New Roman', serif;

    /* ── Weights and treatments ───────────────────
       Wordmark: logo only, UPPERCASE. Thin (100) is
       also permitted.
       Headings: all headings, buttons, labels, UI.
       Body: anything read at length; captions italic
       in Slate. Eyebrow labels: heading face, Coral,
       UPPERCASE (tracking given only as "4–5
       character spacing", so not tokenised).          */
    --brand-weight-wordmark: 300;
    --brand-weight-heading: 600;
    --brand-weight-body: 400;
    --brand-tracking-wordmark: 6.5px;

    /* ── Web type sizes ───────────────────────────
       The guide gives point sizes for slides only.
       These web sizes were approved by Aaron on
       18 September 2026.                               */
    --brand-size-display: 44px;   /* page titles */
    --brand-size-h1: 30px;        /* section headings */
    --brand-size-h2: 22px;        /* subheadings */
    --brand-size-body: 18px;      /* body copy, Source Serif 4 */
    --brand-size-eyebrow: 13px;   /* eyebrow labels, uppercase */
    --brand-size-caption: 15px;   /* captions, italic */

    /* ── Website scheme: Midnight ─────────────────
       Decided by Aaron on 18 September 2026. The guide's
       default surface is Linen (above); its dark-mode web
       slide sanctions Midnight, which is what the website
       uses. Deep Blue only supports it (cards, header,
       footer). Linen on Deep Blue is 14.89:1.
       Contrast against Midnight, WCAG AA needs 4.5:1:
         Linen text 12.16 · Slate captions 4.98
         Coral Light accents 5.97 · Midnight on Coral Light 5.97
       Coral itself is 4.39:1 — large text, logo and
       decoration only. Coral Dark and Secondary Blue fail
       on dark and aren't used for text here.            */
    --site-bg: var(--brand-midnight);
    --site-bg-deep: var(--brand-deep-blue);                          /* cards, header, footer */
    --site-text: var(--brand-linen);
    --site-text-muted: var(--brand-slate);                           /* captions, notes */
    --site-accent-text: var(--brand-coral-light);                    /* eyebrows, links */
    --site-action: var(--brand-coral-light);                         /* primary buttons */
    --site-action-text: var(--brand-midnight);
    --site-action-hover: var(--brand-linen);
    --site-line: color-mix(in srgb, var(--brand-linen) 18%, transparent);  /* dividers */
}
