/* Taurene design tokens ("Paper on glass": white paper, near-black ink, one electric blue used
   as punctuation; pill controls and soft rounded cards). Shared by every page. The usage rules are
   in the project's design-system doc; keep the two in step. Fonts are self-hosted, SIL Open Font
   License (fonts/OFL-*.txt). */

/* site type: Open Runde (everything), Unbounded (the "Taurene" wordmark only) */
@font-face{font-family:"Open Runde";src:url("fonts/open-runde-latin-500-normal.woff2") format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Open Runde";src:url("fonts/open-runde-latin-600-normal.woff2") format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Unbounded";src:url("fonts/unbounded-latin-700-normal.woff2") format("woff2");font-weight:700;font-display:swap}

/* poster type (drawn inside the posters; the poster maker embeds the same files in exports) */
@font-face{font-family:"Taurene Display";src:url("fonts/big-shoulders-display-latin-700-normal.woff2") format("woff2");font-weight:700;font-display:block}
@font-face{font-family:"Taurene Display";src:url("fonts/big-shoulders-display-latin-900-normal.woff2") format("woff2");font-weight:900;font-display:block}
@font-face{font-family:"Taurene Mono";src:url("fonts/ibm-plex-mono-latin-400-normal.woff2") format("woff2");font-weight:400;font-display:block}
@font-face{font-family:"Taurene Mono";src:url("fonts/ibm-plex-mono-latin-500-normal.woff2") format("woff2");font-weight:500;font-display:block}
@font-face{font-family:"Taurene Geo";src:url("fonts/jost-latin-300-normal.woff2") format("woff2");font-weight:300;font-display:block}
@font-face{font-family:"Taurene Geo";src:url("fonts/jost-latin-400-normal.woff2") format("woff2");font-weight:400;font-display:block}
@font-face{font-family:"Taurene Geo";src:url("fonts/jost-latin-500-normal.woff2") format("woff2");font-weight:500;font-display:block}
@font-face{font-family:"Taurene Geo";src:url("fonts/jost-latin-700-normal.woff2") format("woff2");font-weight:700;font-display:block}

:root{
  /* colour: near-monochrome; blue only for small marks (numbers, ticks, eyebrows, focus) */
  --paper:#ffffff; --sheet:#fafafa; --relief:#f1f3f6;
  --ink:#1e1e1e; --ink-muted:#666666; --ink-faint:#8d8d8d;
  --rule:#e4e7ec; --neatline:#ccd1da;
  --action:#0d111b; --on-action:#ffffff;
  --signal:#0098f2; --on-signal:#ffffff;
  --water-tint:#e5f4fd; --iris:#6c56fc;
  /* type */
  --font-sans:"Open Runde","Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-cond:var(--font-sans);
  --font-brand:"Unbounded","Open Runde",system-ui,sans-serif;
  --track-display:-.03em; --track-body:-.02em;
  /* space, radius, shadow */
  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px; --space-6:24px; --space-8:32px; --space-12:48px; --space-18:96px;
  --radius-0:0; --radius-1:12px; --radius-card:16px; --radius-img:20px; --radius-panel:32px; --radius-round:999px;
  --shadow-btn:0 0 0 1px #242628,0 1px 2px rgba(27,28,29,.48);
  --shadow-card:0 1.78px 8px rgba(0,0,0,.05),0 .89px 2.67px rgba(0,0,0,.04);
  --hairline:1px; --neat:1px; --route:3px;
  --max:1200px;
  /* light only: the site is white paper like the print, whatever the device theme */
  color-scheme:only light;
}
/* shared base */
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--font-sans);font-weight:500;font-size:16px;line-height:1.5;letter-spacing:var(--track-body);
  font-feature-settings:"ss01" on;-webkit-font-smoothing:antialiased}
h1,h2,h3{letter-spacing:var(--track-display)}
a{color:inherit;text-underline-offset:3px;text-decoration-thickness:1px}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:2px solid var(--signal);outline-offset:2px}
[hidden]{display:none!important}
.brand{font-family:var(--font-brand);font-weight:700;font-size:19px;letter-spacing:-.01em;text-decoration:none;line-height:1;color:var(--ink)}

/* buttons: pills. Filled near-black for the one primary action, outline for the rest.
   Blue is never a button colour. */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);min-height:44px;padding:0 20px;border-radius:var(--radius-round);
  font-family:var(--font-sans);font-weight:500;font-size:15px;letter-spacing:var(--track-body);line-height:1;text-decoration:none;cursor:pointer;
  background:var(--action);color:var(--on-action);border:0;box-shadow:var(--shadow-btn);transition:background .15s}
.btn:hover{background:#000}
.btn-quiet{background:var(--paper);color:var(--ink);box-shadow:inset 0 0 0 1px var(--neatline)}
.btn-quiet:hover{background:var(--sheet);box-shadow:inset 0 0 0 1px var(--ink-faint)}
.btn:disabled{opacity:.5;cursor:progress}
.eyebrow,.label{font-family:var(--font-sans);font-weight:600;font-size:11px;letter-spacing:.02em;text-transform:uppercase;line-height:1.6;color:var(--signal)}
.caption{font-family:var(--font-sans);font-weight:500;font-size:14px;line-height:1.43;color:var(--ink-muted)}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;scroll-behavior:auto!important}}
