/* /about: page-only styles. Shared blocks live in site.css. */

.page-about .page-hero { padding-bottom: clamp(24px, 4vw, 40px); }

/* Quick facts: a label column and an answer column. */
.page-about .facts {
  max-width: 920px; margin: 0 auto; padding: 8px clamp(18px, 3vw, 32px);
  background: var(--card); border-radius: 24px; box-shadow: inset 0 0 0 1px var(--line);
}
.page-about .facts > div {
  display: grid; grid-template-columns: minmax(120px, 190px) minmax(0, 1fr); gap: 8px 24px;
  padding-block: 18px; border-bottom: 1px solid var(--line);
}
.page-about .facts > div:last-child { border-bottom: 0; }
.page-about .facts dt { font-weight: 900; color: var(--ink); }
.page-about .facts dd { margin: 0; color: var(--ink-soft); }

.page-about .compare { max-width: 920px; margin: 0 auto; display: grid; gap: 14px; }
.page-about .compare-row {
  display: grid; grid-template-columns: minmax(150px, 230px) minmax(0, 1fr); gap: 8px 24px; align-items: start;
  padding: 22px clamp(18px, 3vw, 28px); background: var(--card); border-radius: 18px; box-shadow: inset 0 0 0 1px var(--line);
}
.page-about .compare-row h3 { margin: 0; font-size: 1.15rem; }
.page-about .compare-row p { margin: 0; color: var(--ink-soft); }

.page-about .fact-list { max-width: 820px; margin: 0 auto; padding-inline-start: 1.2em; display: grid; gap: 12px; color: var(--ink-soft); }
.page-about .center-note { text-align: center; margin-top: 28px; }

@media (max-width: 640px) {
  .page-about .facts > div,
  .page-about .compare-row { grid-template-columns: 1fr; }
}