/* ========================================================================== fonts.css — typeface loading and type roles Manrope (headings) and Inter (body) are loaded from Google Fonts in with preconnect + display=swap. This file owns the fallback metrics and the semantic type roles used across the project. ========================================================================== */ @font-face { font-family: "Manrope Fallback"; src: local("Segoe UI Semibold"), local("Helvetica Neue"), local("Arial"); size-adjust: 102%; ascent-override: 96%; descent-override: 24%; line-gap-override: 0%; } @font-face { font-family: "Inter Fallback"; src: local("Segoe UI"), local("Helvetica Neue"), local("Arial"); size-adjust: 100%; ascent-override: 94%; descent-override: 24%; line-gap-override: 0%; } .font-heading { font-family: var(--font-heading); font-optical-sizing: auto; } .font-body { font-family: var(--font-body); } .font-mono { font-family: var(--font-mono); font-variant-numeric: tabular-nums; } /* Type roles ------------------------------------------------------------- */ .display { font-family: var(--font-heading); font-size: var(--fs-h1); line-height: var(--lh-h1); letter-spacing: var(--ls-display); font-weight: 700; } .headline { font-family: var(--font-heading); font-size: var(--fs-h2); line-height: var(--lh-h2); letter-spacing: var(--ls-display); font-weight: 700; } .subhead { font-family: var(--font-heading); font-size: var(--fs-h3); line-height: var(--lh-heading); letter-spacing: var(--ls-heading); font-weight: 700; } .lead { font-family: var(--font-body); font-size: var(--fs-lead); line-height: 1.5; color: var(--color-secondary); } .eyebrow { font-family: var(--font-heading); font-size: var(--fs-eyebrow); font-weight: 700; letter-spacing: var(--ls-eyebrow); text-transform: uppercase; color: var(--color-accent); } .micro { font-size: var(--fs-micro); line-height: 1.5; color: var(--color-secondary); }