/* ─────────────────────────────────────────────────────────────
   Contact Current brand layer — CLIENT-FACING surfaces only.
   Linked AFTER /styles/tokens.css by start/ and home/ ONLY.
   /admin and /editor keep the Brighthouse Fuse chrome — do NOT
   include this file there.

   Satoshi is self-hosted (Fontshare license forbids CDN reuse);
   weight rule per CC brand: display 900, buttons/labels 700,
   body 400–500. Palette: pink #ff007f primary, blue #0061ef
   secondary — aliased onto the token names the pages already
   consume, so both themes stay AA via the existing accent-text
   pairs in tokens.css.
   ───────────────────────────────────────────────────────────── */
@font-face{font-family:'Satoshi';src:url('/styles/fonts/Satoshi-400.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Satoshi';src:url('/styles/fonts/Satoshi-500.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Satoshi';src:url('/styles/fonts/Satoshi-700.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'Satoshi';src:url('/styles/fonts/Satoshi-900.woff2') format('woff2');font-weight:900;font-style:normal;font-display:swap}

:root{
  --head:'Satoshi',system-ui,sans-serif;
  --body:'Satoshi',system-ui,Arial;

  /* CC accent remap — aliases resolve per-theme, so dark/light
     AA text variants keep working without duplication */
  --orange:var(--pink);
  --orange-text:var(--pink-text);
  --orange-a:var(--pink-a);
  --orange-line:var(--pink-line);
  --yellow:var(--blue);
  --yellow-text:var(--blue-text);
  --yellow-a:var(--blue-a);
  --yellow-line:var(--blue-line);
  /* own literal, NOT var(--send) — tokens.css documents --send as "editor send only";
     coupling client primary buttons to it would restyle them on any editor tweak */
  --grad:linear-gradient(135deg,#ff007f,#0061ef);
}

/* The hue remap collapses orange→pink and yellow→blue, which makes the /home
   quick-tile color coding collide (q-orange==q-pink, q-yellow==q-blue). Re-point
   the two colliding tiles to looks still distinct under the CC skin.
   NOTE: this alias layer is a stopgap — when a client page next needs a REAL
   orange/yellow, introduce semantic tokens (--accent/--accent-2/--warn) in the
   pages and override those here instead. */
.q-orange .qico{background:var(--grad);color:#fff}
.q-yellow .qico{background:var(--surface-hover);box-shadow:inset 0 0 0 1px var(--line-2);color:var(--ink-2)}