/* Studio Hesperus — generated from tokens.json */
:root, [data-theme="light"] {
  --navy: #062C59;
  --cream: #FEFBF0;
  --amber: #E09C2F;
  --surface: var(--cream);
  --ink: var(--navy);
  --surface-inverse: var(--navy);
  --ink-inverse: var(--cream);
  --rule: var(--navy);
  --rule-soft: rgba(6, 44, 89, 0.3);
  --point: var(--amber);
  --focus: var(--ink);
}
[data-theme="dark"] {
  --surface: var(--navy);
  --ink: var(--cream);
  --surface-inverse: var(--cream);
  --ink-inverse: var(--navy);
  --rule: var(--cream);
  --rule-soft: rgba(254, 251, 240, 0.35);
}
:root {
  --space-2xs: 4px;
  --space-xs: 8px;
  --space-s: 12px;
  --space-m: 16px;
  --space-l: 24px;
  --space-xl: 32px;
  --space-2xl: 48px;
  --space-3xl: 64px;
  --space-4xl: 96px;
  --space-5xl: 120px;
  --radius-none: 0;
  --radius-round: 50%;
  --shadow-none: none;
  --hairline: 1px;
  --ring-xs: 7px;
  --ring-s: 15px;
  --ring-m: 22px;
  --ring-l: 29px;
  --ring-xl: 50px;
  --disc-marker: 8px;
  --disc-bullet: 14px;
  --disc-point: 48px;
  --disc-play: 104px;
  --logo-min-width: 160px;
  --icon-min: 24px;
  --tap-target: 44px;
  --page-margin: 64px;
  --page-margin-mobile: 24px;
  --social-margin: 48px;
  --print-margin: 80px;
  --content-max: 1440px;
  --grid-columns: 12;
  --font-sans: Jost, system-ui, sans-serif;
}
.monument-xl { font-family: var(--font-sans); font-size: 320px; line-height: 0.84; font-weight: 500; letter-spacing: -0.03em; text-transform: uppercase; }
.monument-l { font-family: var(--font-sans); font-size: 236px; line-height: 0.84; font-weight: 500; letter-spacing: -0.03em; text-transform: uppercase; }
.monument-m { font-family: var(--font-sans); font-size: 180px; line-height: 0.84; font-weight: 500; letter-spacing: -0.03em; text-transform: uppercase; }
.monument-s { font-family: var(--font-sans); font-size: 96px; line-height: 0.84; font-weight: 500; letter-spacing: -0.03em; text-transform: uppercase; }
.headline-xl { font-family: var(--font-sans); font-size: 64px; line-height: 1.05; font-weight: 300; }
.headline-l { font-family: var(--font-sans); font-size: 48px; line-height: 1.08; font-weight: 300; }
.headline-m { font-family: var(--font-sans); font-size: 36px; line-height: 1.12; font-weight: 300; }
.headline-s { font-family: var(--font-sans); font-size: 28px; line-height: 1.2; font-weight: 300; }
.lead { font-family: var(--font-sans); font-size: 32px; line-height: 1.3; font-weight: 300; }
.body-l { font-family: var(--font-sans); font-size: 18px; line-height: 1.65; font-weight: 300; }
.body { font-family: var(--font-sans); font-size: 16px; line-height: 1.6; font-weight: 300; }
.body-s { font-family: var(--font-sans); font-size: 14px; line-height: 1.5; font-weight: 300; }
.label-l { font-family: var(--font-sans); font-size: 13px; line-height: 1.6; font-weight: 400; letter-spacing: 0.3em; text-transform: uppercase; }
.label { font-family: var(--font-sans); font-size: 11px; line-height: 1.6; font-weight: 400; letter-spacing: 0.3em; text-transform: uppercase; }
.label-s { font-family: var(--font-sans); font-size: 9px; line-height: 1.6; font-weight: 400; letter-spacing: 0.3em; text-transform: uppercase; }
.wordmark { font-family: var(--font-sans); font-size: 32px; line-height: 1.2; font-weight: 350; letter-spacing: 0.25em; text-transform: uppercase; }
