/*
 * Burvic design tokens — the ONLY place raw values live.
 * Names are a contract shared by the marketing site, app.css (staff), portal.css and
 * chat.css; do not rename tokens. Primitive -> semantic. Components use semantic tokens only.
 * VALUES = the original burvic.com design (legacy/assets/css/burvic.src.css):
 *   ink #0F1733 / paper #FFFFFF / mist #EEF2FF / cobalt #2447F5 / sun #FFC916,
 *   Bricolage Grotesque (display) + Figtree (text), pill buttons, 16px cards, 10px inputs.
 * Restored 2026-10-22 (Client Projects/burvic/qa/theme-restore-site.md).
 * The marketing pages load burvic.css + elevate.css after this file; those define the
 * legacy component variables (--paper, --cobalt, --sun, ...) with the same values.
 */

/* Fonts: self-hosted latin subsets, SIL OFL 1.1, same files the original site shipped. */
@font-face {
  font-family: "Bricolage Grotesque";
  font-style: normal;
  font-weight: 700 800;
  font-display: swap;
  src: url("../fonts/bricolage-latin-subset.woff2") format("woff2");
}
@font-face {
  font-family: "Figtree";
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("../fonts/figtree-latin-subset.woff2") format("woff2");
}
/* Metric-matched fallbacks (measured on the shipped woff2; see burvic.src.css) so the swap does not shift layout. */
@font-face {
  font-family: "Bricolage Fallback";
  font-style: normal;
  font-weight: 100 900;
  src: local("Arial Black"), local("Arial-Black");
  size-adjust: 80.59%;
  ascent-override: 115.40%;
  descent-override: 33.50%;
  line-gap-override: 0%;
}
@font-face {
  font-family: "Figtree Fallback";
  font-style: normal;
  font-weight: 100 900;
  src: local("Arial"), local("ArialMT"), local("Helvetica");
  size-adjust: 101.13%;
  ascent-override: 93.94%;
  descent-override: 24.72%;
  line-gap-override: 0%;
}

:root {
  color-scheme: light dark;

  /* type */
  --font-display: "Bricolage Grotesque", "Bricolage Fallback", "Arial Black", sans-serif;
  --font-text: "Figtree", "Segoe UI", "Figtree Fallback", sans-serif;
  --font-mono: ui-monospace, "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  --step--1: 0.88rem;
  --step-0: 1rem;
  --step-1: 1.25rem;
  --step-2: clamp(1.5rem, 2.4vw, 2rem);
  --step-3: clamp(1.9rem, 3.6vw, 2.9rem);
  --step-4: clamp(2.5rem, 5.6vw, 4.4rem);
  --step-5: clamp(2.6rem, 5.4vw, 4.6rem);
  --leading-tight: 1.05;
  --leading-snug: 1.25;
  --leading-body: 1.6;

  /* space (4px base) */
  --space-1: 0.25rem; --space-2: 0.5rem; --space-3: 0.75rem; --space-4: 1rem;
  --space-5: 1.5rem;  --space-6: 2rem;   --space-7: 3rem;    --space-8: 4.5rem;
  --space-9: 7rem;
  --measure: 62ch;
  --container: 75rem;            /* 1200px, the legacy --wrap */
  --gutter: clamp(20px, 4vw, 40px);

  /* radius, elevation, z — pill buttons, 10px inputs, 16px cards */
  --radius-1: 6px; --radius-2: 10px; --radius-3: 16px; --radius-pill: 999px;
  --shadow-1: 0 10px 26px -12px rgba(15, 23, 51, 0.35);
  --shadow-2: 0 18px 50px -18px rgba(27, 53, 194, 0.28);
  --z-nav: 90; --z-dialog: 120; --z-toast: 130;

  /* motion */
  --dur-instant: 100ms; --dur-fast: 180ms; --dur-base: 250ms; --dur-slow: 400ms; --dur-story: 700ms;
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --ease-in: cubic-bezier(0.55, 0, 1, 0.45);

  /* colour — semantic (light) */
  --surface: #FFFFFF;            /* legacy --paper */
  --surface-raised: #FFFFFF;     /* legacy --surface */
  --surface-sunken: #EEF2FF;     /* legacy --mist */
  --ink: #0F1733;
  --ink-muted: #46507A;          /* legacy --ink-soft */
  --ink-subtle: #46507A;
  --line: rgba(15, 23, 51, 0.48);/* legacy --line-control: >= 3:1 for control edges */
  --accent: #2447F5;             /* legacy --cobalt */
  --accent-ink: #FFFFFF;
  --accent-soft: #EEF2FF;
  --signal-ok: #135E2C;
  --signal-warn: #7A5300;
  --signal-error: #96121F;
  --focus: #2447F5;
}

/* dark: the legacy night shift — cobalt lifts, sun unchanged */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --surface: #0A0F22; --surface-raised: #141C3A; --surface-sunken: #0F1730;
    --ink: #E9EDFC; --ink-muted: #A6B0D8; --ink-subtle: #A6B0D8; --line: rgba(233, 237, 252, 0.4);
    --accent: #7C97FF; --accent-ink: #0A0F22; --accent-soft: #223061;
    --signal-ok: #7FE0A2; --signal-warn: #FFC916; --signal-error: #FF9DAA; --focus: #7C97FF;
    --shadow-1: 0 10px 26px -12px rgba(0, 0, 0, 0.65);
    --shadow-2: 0 18px 50px -18px rgba(0, 0, 0, 0.75);
  }
}
:root[data-theme="dark"] {
  --surface: #0A0F22; --surface-raised: #141C3A; --surface-sunken: #0F1730;
  --ink: #E9EDFC; --ink-muted: #A6B0D8; --ink-subtle: #A6B0D8; --line: rgba(233, 237, 252, 0.4);
  --accent: #7C97FF; --accent-ink: #0A0F22; --accent-soft: #223061;
  --signal-ok: #7FE0A2; --signal-warn: #FFC916; --signal-error: #FF9DAA; --focus: #7C97FF;
  --shadow-1: 0 10px 26px -12px rgba(0, 0, 0, 0.65);
  --shadow-2: 0 18px 50px -18px rgba(0, 0, 0, 0.75);
}
:root[data-theme="light"] { color-scheme: light; }
:root[data-theme="dark"] { color-scheme: dark; }
