body {
  color: var(--text);
  background-color: var(--bg);
  background-image:
    radial-gradient(1100px 620px at 88% -8%, rgba(0, 98, 173, 0.05), transparent 60%),
    radial-gradient(900px 560px at 6% 32%, rgba(142, 154, 175, 0.10), transparent 55%),
    radial-gradient(rgba(142, 154, 175, 0.13) 1px, transparent 1.4px);
  background-size: 100% 100%, 100% 100%, 24px 24px;
  background-attachment: fixed, fixed, scroll;
  font-family: var(--font-body);
  font-size: var(--space-sm);
  line-height: 1.6;
}

h1,
h2,
h3,
h4 {
  color: var(--text);
  font-family: var(--font-display);
  line-height: 1.15;
}

h1 {
  max-width: 13ch;
  font-size: clamp(var(--space-lg), 8vw, var(--space-xl));
}

h2 {
  font-size: clamp(var(--space-md), 5vw, var(--space-lg));
}

h3 {
  font-size: var(--space-md);
}

h4 {
  font-size: var(--space-sm);
}

p {
  color: var(--mid);
}

.lead {
  max-width: 68ch;
  color: var(--mid);
  font-size: clamp(var(--space-sm), 2vw, var(--space-md));
}

.eyebrow {
  display: inline-flex;
  margin-bottom: var(--space-xs);
  color: var(--accent2);
  font-family: var(--font-body);
  font-size: var(--space-sm);
  text-transform: uppercase;
}

.text-stack {
  display: grid;
  gap: var(--space-sm);
}