@font-face { font-family: 'Bricolage Grotesque'; src: url('../fonts/bricolage-grotesque.woff2') format('woff2'); font-weight: 200 800; font-display: swap; }
@font-face { font-family: 'Inter'; src: url('../fonts/inter.woff2') format('woff2'); font-weight: 100 900; font-display: swap; }
@font-face { font-family: 'JetBrains Mono'; src: url('../fonts/jetbrains-mono-400.woff2') format('woff2'); font-weight: 400; font-display: swap; }
:root {
  --space: #0B0A0F; --starlight: #F5F1EA; --starlight-dim: #B9B2A8;
  --ember: #FF6A2B; --magenta: #E23A9B; --plasma: #36C6E8;
  --cream: #F3EBDD; --ink: #141217; --ember-night: #1A0B08;
  --gold-paper: #FBF6EA; --gold: #C9962B; --plum: #1E0F26;
  --fire: linear-gradient(90deg, var(--ember), var(--magenta) 55%, var(--plasma));
  --font-display: 'Bricolage Grotesque', system-ui, sans-serif;
  --font-body: 'Inter', system-ui, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, monospace;
  --step-hero: clamp(3.25rem, 9vw, 9.5rem);
  --step-h2: clamp(2.5rem, 6.5vw, 6.5rem);
  --gutter: clamp(1rem, 4vw, 3rem);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --z-content: 10; --z-chrome: 40; --z-overlay: 100;
}