/* Orbti Brand Kit — generated from tokens.json */

:root, [data-theme="espresso"] {
  --espresso: #241917;
  --espresso-2: #33221f;
  --cream: #dfcfb8;
  --sand: #ccc49f;
  --olive: #32332d;
  --black: #100f0d;
  --orange: #ea5334;
  --signal: #f93310;
  --maroon: #3e0201;
  --line-dark: #4a3833;
  --line-light: #b9a88f;
  --color-bg: var(--espresso);
  --color-surface: var(--espresso-2);
  --color-text: var(--cream);
  --color-text-muted: #b3a38d;
  --color-accent: var(--orange);
  --color-highlight: var(--signal);
  --color-on-accent: var(--espresso);
  --color-border: var(--line-dark);
  --color-focus: var(--signal);
}
[data-theme="paper"] {
  --color-bg: var(--cream);
  --color-surface: #d3c2a9;
  --color-text: var(--espresso);
  --color-text-muted: #6b5649;
  --color-accent: var(--orange);
  --color-highlight: var(--signal);
  --color-on-accent: var(--espresso);
  --color-border: var(--line-light);
  --color-focus: var(--signal);
}
[data-theme="poster"] {
  --color-bg: var(--sand);
  --color-surface: var(--olive);
  --color-text: var(--olive);
  --color-text-muted: #5a5a4c;
  --color-accent: var(--orange);
  --color-highlight: var(--signal);
  --color-on-accent: var(--espresso);
  --color-border: #a9a17f;
  --color-focus: var(--signal);
}
:root {
  --wrap-max: 1280px;
  --wrap-gutter: 96px;
  --section-y: 112px;
  --gap-col: 72px;
  --frame-w: 14px;
  --stripe: 6px;
  --stripe-gap: 5px;
  --radius-frame: 22px;
  --radius-window: 8px;
  --radius-button: 999px;
  --text-hero: clamp(3.5rem,8vw,7.5rem);
  --text-h1: clamp(2.8rem,5.6vw,5rem);
  --text-h2: clamp(2rem,3.6vw,3.25rem);
  --text-h3: 28px;
  --text-lead: 22px;
  --text-body: 16px;
  --text-body-s: 14px;
  --text-micro: 11px;
  --tracking-display: -.01em;
  --tracking-mono: .12em;
  --leading-display: .95;
  --leading-body: 1.6;
  --font-display: "Russo One", "Arial Black", sans-serif;
  --font-sans: Jost, Futura, Arial, sans-serif;
  --font-mono: "Space Mono", ui-monospace, monospace;
}
.display-hero { font-family: var(--font-display); font-size: 7.5rem; line-height: 0.9; font-weight: 400; letter-spacing: -0.01em; }
.display-h1 { font-family: var(--font-display); font-size: 5rem; line-height: 0.95; font-weight: 400; letter-spacing: -0.01em; }
.display-h2 { font-family: var(--font-display); font-size: 3.25rem; line-height: 0.95; font-weight: 400; letter-spacing: -0.01em; }
.display-h3 { font-family: var(--font-display); font-size: 28px; line-height: 1.05; font-weight: 400; letter-spacing: -0.01em; }
.heading-h4 { font-family: var(--font-sans); font-size: 20px; line-height: 1.25; font-weight: 600; }
.body-lead { font-family: var(--font-sans); font-size: 22px; line-height: 1.4; font-weight: 400; }
.body { font-family: var(--font-sans); font-size: 16px; line-height: 1.6; font-weight: 400; }
.body-s { font-family: var(--font-sans); font-size: 14px; line-height: 1.6; font-weight: 400; }
.body-quote { font-family: var(--font-sans); font-size: 13px; line-height: 1.6; font-weight: 400; font-style: italic; }
.label-micro { font-family: var(--font-mono); font-size: 11px; line-height: 1.5; font-weight: 700; letter-spacing: 0.12em; }