h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { color: var(--ink); font-family: var(--display); font-weight: 600; }
h1 { max-width: 13ch; margin-bottom: 24px; font-size: clamp(2.75rem, 6vw, 4rem); line-height: .98; letter-spacing: -2px; }
h2 { max-width: 18ch; margin-bottom: 24px; font-size: clamp(2rem, 4vw, 3rem); line-height: 1.02; letter-spacing: -1.5px; }
h3 { margin-bottom: 10px; font-size: 1.75rem; line-height: 1.08; letter-spacing: -.5px; }
p, li, dd, dt, a, small { font-size: 1rem; }
p { max-width: 70ch; margin-bottom: 20px; }
.hero__intro { max-width: 62ch; margin-bottom: 28px; color: var(--body); font-size: 1.125rem; line-height: 1.55; }
.lead { max-width: 62ch; margin-bottom: 32px; color: var(--muted); font-size: 1.125rem; }
.eyebrow { margin-bottom: 16px; color: var(--blue); font-size: .8125rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }
.badge { display: inline-flex; align-items: center; min-height: 28px; padding: 3px 10px; color: #1e40af; background: #dbeafe; border-radius: 999px; font-size: .8125rem; font-weight: 600; letter-spacing: .02em; }
.card p, .callout p, .mock span, .mock strong, .source small, .foot p, .foot a { font-size: 1rem; }

@media (max-width: 640px) {
  h1 { font-size: 2.65rem; letter-spacing: -1.5px; }
  h2 { font-size: 2.15rem; letter-spacing: -1px; }
  h3 { font-size: 1.5rem; }
}