/* tokens.css — BBMc digital card. Values from bbmc-site/css/tokens.css and the e-mail signature.
 * Dark ground (ink), pale text, ONE accent: sky (as on the site); gold only as sparks. Semantic names kept from the REAC stack:
 * --c-ink is the TEXT colour, --c-bg/--c-surface are the dark grounds. */
/* Montserrat, complete: variable weight 100-900, normal + italic, Latin + Latin Extended (self-hosted, @fontsource-variable/montserrat 5.2.8) */
@font-face {
  font-family: "Montserrat";
  src: url("../fonts/montserrat-latin-wght-normal.woff2") format("woff2-variations"), url("../fonts/montserrat-latin-wght-normal.woff2") format("woff2");
  font-weight: 100 900; font-style: normal; font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Montserrat";
  src: url("../fonts/montserrat-latin-ext-wght-normal.woff2") format("woff2-variations"), url("../fonts/montserrat-latin-ext-wght-normal.woff2") format("woff2");
  font-weight: 100 900; font-style: normal; font-display: swap;
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Montserrat";
  src: url("../fonts/montserrat-latin-wght-italic.woff2") format("woff2-variations"), url("../fonts/montserrat-latin-wght-italic.woff2") format("woff2");
  font-weight: 100 900; font-style: italic; font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Montserrat";
  src: url("../fonts/montserrat-latin-ext-wght-italic.woff2") format("woff2-variations"), url("../fonts/montserrat-latin-ext-wght-italic.woff2") format("woff2");
  font-weight: 100 900; font-style: italic; font-display: swap;
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

:root {
  color-scheme: dark;

  /* colour */
  --c-bg: #0C1A26;               /* --ink-deep */
  --c-surface: #132636;          /* --ink: the card, same as the signature */
  --c-surface-2: #1C3547;        /* --navy: raised rows, inputs */
  --c-petrol: #3C5768;
  --c-ink: #E9F1F7;              /* text (pale) */
  --c-ink-2: #AEBFCB;            /* secondary text, 9.6:1 on surface */
  --c-ink-3: #5E7384;            /* decorative only */
  --c-line: rgba(169, 196, 222, .38);
  --c-line-soft: rgba(169, 196, 222, .16);
  --c-accent: #5E9AC8;           /* sky — the one accent (site CTA colour) */
  --c-accent-ink: #8DBBE0;       /* sky for small text/links, 7.4:1 on surface */
  --c-signal: #5E9AC8;
  --c-gold: #C99A3E;             /* sparks only: particles, rook star, one hairline */
  --c-on-ink: #0C1A26;           /* text on a pale or gold pill */
  --c-steel: #A9C4DE;
  --c-danger: #F2867A;
  --c-success: #7FD3A6;
  --c-focus: #8DBBE0;

  /* type */
  --font-sans: "Montserrat", "Segoe UI", system-ui, -apple-system, Arial, sans-serif;
  --font-mono: var(--font-sans);   /* no mono face: labels are Montserrat caps (see .label) */
  --fs-12: .75rem;
  --fs-14: .875rem;
  --fs-16: 1rem;
  --fs-20: 1.25rem;
  --fs-28: 1.75rem;
  --fs-44: 2.75rem;
  --fs-h1: clamp(2rem, 1.3rem + 3vw, 3.4rem);
  --lh-tight: 1.08;
  --lh-snug: 1.3;
  --lh-body: 1.55;
  --tracking-h1: -0.02em;
  --tracking-label: 0.16em;
  --fw-light: 300;
  --fw-regular: 400;
  --fw-medium: 600;
  --fw-bold: 700;

  /* space */
  --s-4: 4px;  --s-8: 8px;  --s-12: 12px; --s-16: 16px; --s-24: 24px;
  --s-32: 32px; --s-48: 48px; --s-64: 64px; --s-96: 96px;

  /* shape */
  --r-panel: 18px;
  --r-img: 14px;
  --r-ctl: 10px;
  --r-pill: 999px;
  --hairline: 1px solid var(--c-line);
  --hairline-soft: 1px solid var(--c-line-soft);
  --shadow-lift: 0 1px 0 rgba(0,0,0,.2), 0 30px 60px -30px rgba(0,0,0,.6);

  /* motion */
  --ease-out: cubic-bezier(.16, 1, .3, 1);
  --ease-in-out: cubic-bezier(.65, 0, .35, 1);
  --t-fast: 160ms;
  --t-mid: 240ms;
  --t-slow: 300ms;
  --t-flip: 640ms;

  /* layout */
  --w-max: 1120px;
  --gutter: clamp(16px, 4vw, 40px);
  --tap: 44px;
  --z-bg: 0; --z-content: 1; --z-sticky: 20; --z-toast: 60; --z-dialog: 50; --z-consent: 70;
}

@media (prefers-reduced-motion: reduce) {
  :root { --t-fast: 1ms; --t-mid: 1ms; --t-slow: 1ms; --t-flip: 160ms; }
}