/* Ornn Ironworks · generated from tokens.json. Edit tokens.json, then regenerate. */
@import url("https://fonts.googleapis.com/css2?family=Chakra+Petch:wght@500;600;700&family=Barlow:wght@400;500;600&family=Martian+Mono:wght@400;500&display=swap");

/* Light section (default) */
:root, [data-theme="light"] {
  --navy-950: #0A1422;
  --navy-900: #0E1A2B;
  --navy-800: #18263A;
  --navy-700: #2E3E57;
  --steel-200: #CBD5E0;
  --steel-100: #E3E9EF;
  --steel-50: #F4F7FA;
  --blue-700: #1C3F7A;
  --blue-600: #2457A6;
  --blue-300: #7FB2FF;
  --yellow-500: #FFC72C;
  --yellow-200: #FFE08A;
  --surface: var(--steel-100);
  --surface-raised: var(--steel-50);
  --surface-inverse: var(--navy-900);
  --border: var(--steel-200);
  --ink: var(--navy-900);
  --ink-body: #33415A;
  --ink-muted: #4E5D70;
  --label: var(--blue-600);
  --accent: var(--yellow-500);
  --on-accent: var(--navy-900);
  --accent-hover: var(--yellow-200);
  --focus: var(--blue-600);
  --glow: rgba(255,199,44,0.26);
  --glow-cool: rgba(127,178,255,0.12);
}

/* Dark band: put data-theme="dark" on the hero, map, labs section and footer */
[data-theme="dark"] {
  --surface: var(--navy-900);
  --surface-raised: var(--navy-800);
  --surface-inverse: var(--steel-100);
  --border: var(--navy-700);
  --ink: #EEF2F7;
  --ink-body: #C3CEDC;
  --ink-muted: #9FB0C4;
  --label: var(--blue-300);
  --focus: var(--yellow-500);
}

:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 112px;
  --radius-none: 0px;
  --radius-dot: 50%;
  --cut-md: 12px;
  --cut-sm: 10px;
  --font-display: "Chakra Petch", "Arial Narrow", system-ui, sans-serif;
  --font-sans: Barlow, system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "Martian Mono", ui-monospace, "SF Mono", Menlo, monospace;
}

.display-xl { font-family: var(--font-display); font-size: 84px; line-height: 1.0; font-weight: 600; letter-spacing: -0.01em; text-transform: uppercase; }
.display-l { font-family: var(--font-display); font-size: 56px; line-height: 1.02; font-weight: 600; text-transform: uppercase; }
.display-m { font-family: var(--font-display); font-size: 30px; line-height: 1.1; font-weight: 600; text-transform: uppercase; }
.display-s { font-family: var(--font-display); font-size: 16px; line-height: 1.25; font-weight: 600; text-transform: uppercase; }
.numeral { font-family: var(--font-display); font-size: 52px; line-height: 1.0; font-weight: 600; text-transform: uppercase; }
.wordmark { font-family: var(--font-display); font-size: 24px; line-height: 1.0; font-weight: 700; letter-spacing: 0.18em; }
.body-l { font-family: var(--font-sans); font-size: 20px; line-height: 1.5; font-weight: 400; }
.body { font-family: var(--font-sans); font-size: 18px; line-height: 1.5; font-weight: 400; }
.body-s { font-family: var(--font-sans); font-size: 15px; line-height: 1.45; font-weight: 400; }
.button { font-family: var(--font-sans); font-size: 16px; line-height: 1.0; font-weight: 600; }
.label { font-family: var(--font-mono); font-size: 11px; line-height: 1.45; font-weight: 400; letter-spacing: 0.14em; text-transform: uppercase; }
.label-s { font-family: var(--font-mono); font-size: 10px; line-height: 1.4; font-weight: 400; letter-spacing: 0.1em; text-transform: uppercase; }