/* v2: the eyebrow is NOT mono and NOT uppercase — it is body-font,
   15px, medium, brand purple. Mono uppercase survives only in table
   headers and the .mq-pill. */
.mq-eyebrow {
  font-family: var(--mq-body);
  font-size: 0.9375rem;
  font-weight: 500;
  letter-spacing: 0;
  text-transform: none;
  color: var(--mq-brand);
  margin: 0;
}

.mq-display-xl, .mq-display-l, .mq-h2 {
  font-family: var(--mq-display);
  font-weight: 600;
  color: var(--mq-ink);
  margin: 0;
  text-wrap: balance;
}
.mq-display-xl { font-size: var(--fs-display-xl); line-height: 0.98; letter-spacing: -0.02em; max-width: 18ch; }
.mq-display-l  { font-size: var(--fs-display-l);  line-height: 1.05; letter-spacing: -0.018em; max-width: 20ch; }
.mq-h2         { font-size: var(--fs-h2);         line-height: 1.10; letter-spacing: -0.015em; max-width: 24ch; }

.mq-h3 { font-family: var(--mq-body); font-weight: 500; font-size: var(--fs-h3); line-height: 1.3; color: var(--mq-ink); margin: 0; }
.mq-body-l { font-size: var(--fs-body-l); line-height: 1.6; max-width: 62ch; margin: 0; color: var(--mq-mute); }
.mq-body   { font-size: var(--fs-body);   line-height: 1.65; max-width: 62ch; margin: 0; }
.mq-mute   { color: var(--mq-mute); }
.mq-small  { font-size: var(--fs-small); line-height: 1.5; color: var(--mq-mute); }

.mq-data, .mq-cell { font-family: var(--mq-data); font-variant-numeric: tabular-nums; font-size: var(--fs-small); }
.mq-data-xl {
  font-family: var(--mq-data);
  font-variant-numeric: tabular-nums;
  font-size: var(--fs-data-xl);
  font-weight: 500;
  line-height: 1;
  color: var(--mq-ink);
}

/* section header block: eyebrow + h2 + lede */
.mq-head { display: flex; flex-direction: column; gap: var(--s-4); margin-bottom: var(--s-8); }