/* Bondback tokens: the only place raw colours and sizes live. */
:root {
  --c-paper: #F3F5F4;
  --c-paper-2: #E8EDEC;
  --c-white: #FFFFFF;
  --c-ink: #0F1A1F;
  --c-stage: #11303A;
  --c-stage-hi: #1B4553;
  --c-rule: #C9D3D6;
  --c-mute: #566872;
  --c-on-stage-mute: #A9BDC4;
  --c-tag: #FF5A2C;
  --c-tag-deep: #B8390F;
  --c-error: #A3200B;

  --font-sans: "Familjen Grotesk", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;

  --fs-hero: clamp(3.25rem, 1.6rem + 7.2vw, 7.5rem);
  --fs-h2: clamp(2rem, 1.4rem + 2.6vw, 3.5rem);
  --fs-h3: 1.375rem;
  --fs-lead: clamp(1.1875rem, 1.05rem + 0.6vw, 1.5rem);
  --fs-body: 1.0625rem;
  --fs-small: 0.9375rem;
  --fs-mono: 0.8125rem;
  --lh-body: 1.55;
  --track-tight: -0.035em;
  --track-mid: -0.015em;

  --sp-1: 0.25rem;
  --sp-2: 0.5rem;
  --sp-3: 0.75rem;
  --sp-4: 1rem;
  --sp-5: 1.5rem;
  --sp-6: 2rem;
  --sp-7: 3rem;
  --sp-8: 4.5rem;
  --section-gap: clamp(6rem, 4rem + 8vw, 10.5rem);
  --content-max: 72rem;
  --prose-max: 42rem;
  --tap: 3rem;

  --radius: 0.375rem;
  --hairline: 1px;
  --focus-width: 3px;

  --ease: cubic-bezier(0.2, 0.8, 0.2, 1);
  --d-hover: 160ms;
  --d-reveal: 240ms;
  --d-panel: 260ms;
  --d-scene: 900ms;
  --press: 0.98;
}

@font-face { font-family: "Familjen Grotesk"; src: url("/fonts/familjen-grotesk-latin-400-normal.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Familjen Grotesk"; src: url("/fonts/familjen-grotesk-latin-600-normal.woff2") format("woff2"); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: "Familjen Grotesk"; src: url("/fonts/familjen-grotesk-latin-700-normal.woff2") format("woff2"); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: "IBM Plex Mono"; src: url("/fonts/ibm-plex-mono-latin-400-normal.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "IBM Plex Mono"; src: url("/fonts/ibm-plex-mono-latin-500-normal.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }