/* Crane Marketing — generated from tokens.json */
:root, [data-theme="light"] {
  --surface-100: #f4f2ee;
  --surface-200: #ffffff;
  --surface-300: #e7e4de;
  --ink: #16191c;
  --ink-muted: #565b60;
  --line: #cfcac1;
  --line-strong: #8a857c;
  --brand: #f5b800;
  --on-brand: #16191c;
  --brand-text: #8a6200;
  --steel: #1e2328;
  --on-steel: #f4f2ee;
  --concrete: #cfcac1;
  --blueprint: #1f4e79;
  --focus: #1f4e79;
  --success: #0b5d8c;
  --danger: #a33a00;
  --warning: var(--brand);
}
[data-theme="dark"] {
  --surface-100: #121416;
  --surface-200: #1b1f23;
  --surface-300: #24292e;
  --ink: #f2efea;
  --ink-muted: #a8adb2;
  --line: #33393f;
  --line-strong: #6b737b;
  --brand: #f5b800;
  --on-brand: #16191c;
  --brand-text: #f5c233;
  --steel: #3a424a;
  --on-steel: #f4f2ee;
  --concrete: #4a4f55;
  --blueprint: #7fb0de;
  --focus: #f5c233;
  --success: #6fb6e8;
  --danger: #ff8a4c;
  --warning: var(--brand);
}
:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-8: 32px;
  --space-12: 48px;
  --space-16: 64px;
  --space-24: 96px;
  --radius-0: 0px;
  --radius-sm: 2px;
  --radius-md: 4px;
  --font-sans: "Urbanist", "Helvetica Neue", Arial, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, Menlo, monospace;
}
.display-xl {
  font-family: var(--font-sans);
  font-size: 88px;
  line-height: 0.92;
  font-weight: 900;
  letter-spacing: -0.02em;
}
.display-l {
  font-family: var(--font-sans);
  font-size: 64px;
  line-height: 0.95;
  font-weight: 900;
  letter-spacing: -0.015em;
}
.h1 {
  font-family: var(--font-sans);
  font-size: 44px;
  line-height: 1.0;
  font-weight: 800;
  letter-spacing: -0.01em;
}
.h2 {
  font-family: var(--font-sans);
  font-size: 32px;
  line-height: 1.1;
  font-weight: 800;
}
.h3 {
  font-family: var(--font-sans);
  font-size: 24px;
  line-height: 1.2;
  font-weight: 700;
}
.body-l {
  font-family: var(--font-sans);
  font-size: 18px;
  line-height: 28px;
  font-weight: 500;
}
.body {
  font-family: var(--font-sans);
  font-size: 16px;
  line-height: 24px;
  font-weight: 500;
}
.body-s {
  font-family: var(--font-sans);
  font-size: 14px;
  line-height: 20px;
  font-weight: 500;
}
.label {
  font-family: var(--font-sans);
  font-size: 13px;
  line-height: 16px;
  font-weight: 700;
  letter-spacing: 0.08em;
}
.spec {
  font-family: var(--font-mono);
  font-size: 14px;
  line-height: 20px;
  font-weight: 500;
}
.caption {
  font-family: var(--font-mono);
  font-size: 12px;
  line-height: 16px;
  font-weight: 400;
}
