/* ═══════════════════════════════════════════════════════════════
   DESIGN GOLDFINGER · GBX Circle · token hand-over
   theLoroX v6.3 · the single source of truth · import this one file.
   Locked values — do not invent a 9th colour without the owner.
   Rules: square (radius 0) · weight ceiling 400 · one gold · no shadows.
   ═══════════════════════════════════════════════════════════════ */

:root {
  /* ── CORE PALETTE · 8 locked tokens ─────────────────────────── */
  --deep:      #111616;   /* base background · the floor · nothing darker     */
  --stone:     #1F2828;   /* card / panel surface                             */
  --mid:       #222929;   /* hover state only                                 */
  --cashmere:  #F3F6F9;   /* text on dark · light page background             */
  --paper:     #F9F9F5;   /* brightest light surface                         */
  --linen:     #EDE7D9;   /* editorial light register (Who Attends, Advisory) */
  --gold:      #ba9933;   /* THE accent · one gold for everything             */
  --graphite:  #4A4949;   /* the one non-teal grey · UI rules                 */
  --private:   #202505;   /* AIO grounds + gate bands ONLY                    */

  /* ── PROPOSED · pending owner sign-off ──────────────────────── */
  --gold-ink:  #7e6418;   /* gold TEXT on light grounds (AA: paper 5.3:1,
                             cashmere 5.1:1, linen 4.6:1). Pure --gold fails
                             as text on light (2.2–2.6:1) — use it only for
                             hairlines + the key glyph in light mode.        */

  /* ── FORUM DARK GROUNDS · per-forum page floor ──────────────── */
  --ground-bils: #111616; /* teal-black   · reference build */
  --ground-cgti: #0F1419; /* steel-black  · cool blue cast  */
  --ground-ddif: #151313; /* warm-black   · neutral         */
  --ground-mevo: #15111A; /* aubergine-black · faint violet */
  --ground-aio:  #202505; /* olive-black  · = --private     */
  --ground-scis: #0E1714; /* pine-black   · deep green cast */
  --ground-gbx:  #111616; /* parent umbrella · = --deep     */

  /* ── DERIVED GOLD ───────────────────────────────────────────── */
  --g2: rgba(186,153,51,0.236);  /* hairlines · the only border weight */
  --g3: rgba(186,153,51,0.07);   /* faint gold wash                    */
  --gold-hover: #cda861;         /* gold link / key hover only         */

  /* ── TEXT ON DARK ───────────────────────────────────────────── */
  --dim:  rgba(243,246,249,0.72);  /* body copy   · AAA on every ground */
  --dim2: rgba(243,246,249,0.52);  /* secondary   · AA                  */
  --dim3: rgba(243,246,249,0.28);  /* tertiary / footer                 */

  /* ── INK ON LIGHT ───────────────────────────────────────────── */
  --ink:      #141414;             /* headings on light · AAA           */
  --ink-body: rgba(17,22,22,0.72); /* body on light   · AA–AAA          */
  --ink-dim:  rgba(17,22,22,0.36); /* secondary on light (decorative)   */

  /* ── TYPE · 3 families · fixed roles · never swap ───────────── */
  --serif: 'Cormorant', Georgia, serif;                      /* meaning: display, quotes, italic gold */
  --sans:  'Jost', system-ui, sans-serif;                    /* structure: nav, eyebrows, labels, buttons */
  --hv:    'Helvetica Neue', Helvetica, Arial, sans-serif;   /* detail: body, institutional, legal */
  /* Google Fonts: Cormorant 300/400 (+ital) · Jost 200/300/400 */

  --w-thin: 200; --w-regular: 300; --w-medium: 400;  /* 400 is the CEILING — never heavier */

  --body-size: 12.944px;  /* φ-derived (8 × φ) */
  --body-lh:   1.7639;
  --body-ls:   0.01618em;

  --ls-mark: 0.40em; --ls-eyebrow: 0.24em; --ls-nav: 0.20em; --ls-sub: 0.14em;

  --fs-display: clamp(64px, 9vw, 120px);   /* hero / entry heading   */
  --fs-section: clamp(48px, 6.5vw, 90px);  /* section heading        */
  --fs-quote:   clamp(24px, 3.2vw, 38px);  /* pull quote             */
  --fs-ssub:    clamp(18px, 2vw, 24px);    /* italic gold subhead    */

  /* ── SPACING · live Fibonacci grade · 8·13·21·34·55·89·144 ──── */
  --sp1: 8px; --sp2: 13px; --sp3: 21px; --sp4: 34px; --sp5: 55px; --sp6: 89px; --sp7: 144px;
  --gap-lockup: 6.9px;   /* 369 sacred lockup gap (icon ↔ wordmark) */

  /* ── BORDERS & CORNERS ──────────────────────────────────────── */
  --rule: 0.5px solid var(--g2);                 /* the only border on dark  */
  --rule-light: 0.5px solid rgba(17,22,22,0.1);  /* the only border on light */
  --radius: 0px;        /* SQUARE is the brand */
  --radius-soft: 2px;   /* printed-card softening only */

  /* ── MOTION ─────────────────────────────────────────────────── */
  --ease: cubic-bezier(.2,.7,.2,1);  /* fades + slides 0.2–0.9s · no bounce, no shrink-on-press */

  /* ── SEMANTIC ALIASES (prefer these) ────────────────────────── */
  --bg-dark: var(--deep);  --bg-light: var(--cashmere);
  --surface-card: var(--stone);  --surface-raised: var(--mid);
  --text-primary: var(--cashmere); --text-body: var(--dim); --text-secondary: var(--dim2);
  --text-on-light: var(--ink);
  --accent: var(--gold);  --hairline: var(--g2);  --gold-wash: var(--g3);
}

/* ── CONTRAST · tested (WCAG 2.1) ─────────────────────────────────
   DARK  · cashmere on any ground 14.6–17.2:1 AAA · gold 5.8–6.8:1 AA
         · body(--dim) ~8–9:1 AAA · secondary(--dim2) ~5:1 AA
   LIGHT · ink on paper/cashmere/linen 14.9–17.5:1 AAA
         · ink-body 6.5–7.1:1 AA–AAA
         · gold-ink 4.6–5.3:1 AA  (pure --gold as text FAILS on light)
   ───────────────────────────────────────────────────────────────── */

/* ══ EMAIL CONTEXT · Inline override table ═══════════════════════
   CSS variables do not work in email clients. All values below are
   the locked inline equivalents used in HubSpot HTML emails.
   Template: _ds/…/templates/email-voice/email-voice-template.html

   COLOUR (inline px values)
   body bg outer     #0c1010   email outer wrapper
   body bg inner     #111616   email content area  (= --deep)
   gold accent       #ba9933   eyebrows · CTA · hairlines  (= --gold)
   primary text      #f3f6f9   speaker name · pull quote   (= --cashmere)
   body copy         #b0b8ba   paragraphs · bullets
   dim / role        #8a9090   footer · room card
   legal             #4a5050   unsubscribe line
   gold hairline     rgba(186,153,51,0.236)  divider rule  (= --g2)

   TYPOGRAPHY (inline, magic-number sizes — multiples of 3)
   Speaker name      Georgia 42px 300 lh:0.98 ls:-0.015em  (mob: 34px)
   Pull quote        Georgia italic 24px 300 lh:1.35        (mob: 19px)
   Role italic       Georgia italic 18px 300
   Body copy         Helvetica Neue 15px 300 lh:1.76        (mob: 14px)
   Eyebrow/label     Helvetica Neue 10px 300 ls:0.24em UPPER
   Footer address    Helvetica Neue 12px 300 lh:1.8
   Room card label   Helvetica Neue 9px  300 ls:2px  UPPER
   Pull attribution  Helvetica Neue 9px  300 ls:1.5px UPPER
   Legal line        Helvetica Neue 9px  300

   SPACING — "369 magic numbers" (multiples of 3, no CSS vars in email)
   9px   bullet padding · icon gap
   12px  tight vertical gaps
   15px  paragraph margin
   18px  footer section rule
   21px  social row top
   24px  pull quote top pad
   27px  secondary section pad
   30px  primary section pad
   33px  footer cell pad
   36px  pull quote section pad
   39px  name/authority section pad
   48px  horizontal body pad (= ~2 × 24 = 6 × 8)
   ═══════════════════════════════════════════════════════════════ */

/* ══ GOLDFINGER EMAIL KIT · file index ════════════════════════════
   goldfinger-kit/hubspot-email-kit/
   ├── GBX Email - Nuno Fontes BILS 2027.html   ← production reference
   ├── GBX Email - BILS.html
   ├── GBX Email - CGTI.html
   ├── GBX Email - DDIF.html
   ├── GBX Email - MEVO.html
   ├── GBX Email - AIO.html
   ├── GBX Email - SCIS.html
   ├── GBX Email Template.html
   ├── GBX Email - BILS Chair Letter.html
   └── README.md
   Master tokenized template:
   _ds/…/templates/email-voice/email-voice-template.html
   ═══════════════════════════════════════════════════════════════ */