@import url("https://fonts.googleapis.com/css2?family=DM+Sans:opsz,wght@9..40,400;9..40,500;9..40,600;9..40,700&family=Bebas+Neue&family=JetBrains+Mono:wght@400;500&display=swap");

/* BECS type — Bebas Neue (display), DM Sans (body/UI), JetBrains Mono (labels) */
:root {
  --font-display: "Bebas Neue", "Arial Narrow", Impact, sans-serif;
  --font-body: "DM Sans", ui-sans-serif, system-ui, sans-serif;
  --font-mono-label: "JetBrains Mono", ui-monospace, SFMono-Regular, monospace;
}

.display-hero { font-family: var(--font-display); font-size: 7.5rem; line-height: 0.9; font-weight: 400; letter-spacing: 0.01em; }
.heading-1 { font-family: var(--font-display); font-size: 2.25rem; line-height: 1.1; font-weight: 400; letter-spacing: 0.02em; }
.heading-1-compact { font-family: var(--font-display); font-size: 1.875rem; line-height: 1.1; font-weight: 400; letter-spacing: 0.02em; }
.stat-value { font-family: var(--font-display); font-size: 1.875rem; line-height: 2.25rem; font-weight: 400; }
.heading-3 { font-family: var(--font-display); font-size: 1.25rem; line-height: 1.1; font-weight: 400; letter-spacing: 0.02em; }
.heading-4 { font-family: var(--font-display); font-size: 1.125rem; line-height: 1.1; font-weight: 400; letter-spacing: 0.02em; }
.body { font-family: var(--font-body); font-size: 1rem; line-height: 1.6; font-weight: 400; }
.body-sm { font-family: var(--font-body); font-size: 0.875rem; line-height: 1.625; font-weight: 400; }
.button { font-family: var(--font-body); font-size: 0.875rem; line-height: 1.25rem; font-weight: 500; }
.caption { font-family: var(--font-body); font-size: 0.75rem; line-height: 1rem; font-weight: 400; }
.wordmark { font-family: var(--font-body); font-size: 0.875rem; line-height: 1; font-weight: 600; letter-spacing: 0.06em; }
.eyebrow-wide { font-family: var(--font-mono-label); font-size: 1rem; line-height: 1.4; font-weight: 500; letter-spacing: 0.3em; }
.eyebrow { font-family: var(--font-mono-label); font-size: 0.8125rem; line-height: 1.25rem; font-weight: 500; letter-spacing: 0.14em; }
.label { font-family: var(--font-mono-label); font-size: 0.8125rem; line-height: 1.25rem; font-weight: 400; letter-spacing: 0.12em; }
.pill { font-family: var(--font-mono-label); font-size: 0.8125rem; line-height: 1.25rem; font-weight: 400; letter-spacing: 0.08em; }
.tagline { font-family: var(--font-mono-label); font-size: 0.625rem; line-height: 1; font-weight: 500; letter-spacing: 0.28em; }
/* Uppercase is applied by style, not copy */
.display-hero,.heading-1,.heading-1-compact,.heading-3,.heading-4,.wordmark,.eyebrow-wide,.eyebrow,.label,.pill,.tagline { text-transform: uppercase; }