/* Frozen Electric "Shard" brand tokens (screen colours).
   Source of truth: the approved Blue Shard / White Shard business cards and the AC pamphlet.
   Print uses the same colours mapped through Coated FOGRA39 (see SKILL.md), never these hex values directly.

   Use: put class "shard-blue" (navy) or "shard-white" (paper) on any block; children read the tokens.
   Fonts are not loaded here: each medium adds its own @font-face for 'Poppins' (see SKILL.md). */

:root {
  --font: Poppins, system-ui, "Segoe UI", Roboto, Arial, sans-serif;

  /* fixed brand colours */
  --fe-navy: #101722;          /* Blue Shard background (flat) */
  --fe-navy-hi: #1A2131;       /* gradient top-left */
  --fe-navy-lo: #0A0F18;       /* gradient bottom-right */
  --fe-glow: #2F6BDD;          /* emblem glow + hairline rules */
  --fe-blue: #5F98F8;          /* accent on navy */
  --fe-ice: #7CCBF5;           /* small highlights on navy */
  --fe-deep: #325CA8;          /* accent on white */
  --fe-ink: #17213B;           /* text on white */
  --fe-slate: #5C6980;         /* secondary text on white */
  --fe-paper: #FFFFFF;
  --fe-mist: #F3F6FB;          /* quiet alternate band on white */
}

/* ---- theme blocks: every component reads only these ---- */
.shard-blue {
  --bg: var(--fe-navy);
  --bg-art: radial-gradient(120% 90% at 50% 0%, rgba(47,107,221,.24), rgba(47,107,221,.07) 60%, transparent),
            linear-gradient(160deg, var(--fe-navy-hi), #111723 55%, var(--fe-navy-lo));
  --ink: #ECEFF7;
  --ink-2: #B0BACD;
  --ink-3: #9AA6BF;
  --accent: var(--fe-blue);
  --accent-ink: #0A0F18;       /* text on an accent-filled button */
  --hi: var(--fe-ice);
  --rule: rgba(152,164,188,.28);
  --card: rgba(95,152,248,.08);
  --card-line: rgba(95,152,248,.35);
  background: var(--bg-art);
  color: var(--ink);
}
.shard-white {
  --bg: var(--fe-paper);
  --bg-art: var(--fe-paper);
  --ink: var(--fe-ink);
  --ink-2: var(--fe-slate);
  --ink-3: #7A8597;
  --accent: var(--fe-deep);
  --accent-ink: #FFFFFF;
  --hi: var(--fe-deep);
  --rule: rgba(92,105,128,.25);
  --card: rgba(50,92,168,.06);
  --card-line: rgba(50,92,168,.30);
  background: var(--bg-art);
  color: var(--ink);
}

/* ---- type: Poppins, light headlines with a medium emphasis, wide-tracked caps for labels ---- */
.shard-blue, .shard-white { font-family: var(--font); }
.fe-eyebrow { font-weight: 400; letter-spacing: .3em; text-transform: uppercase; font-size: .78rem; color: var(--accent); }
.fe-headline { font-weight: 300; line-height: 1.2; letter-spacing: 0; }
.fe-headline em { font-style: normal; font-weight: 500; }
.fe-wordmark { font-weight: 400; letter-spacing: .32em; text-transform: uppercase; }
.fe-rule { height: 1px; border: 0; background: var(--rule); }
