.about-hero { padding-block: var(--space-8) var(--space-7); max-width: 760px; }
.about-hero p { font-size: 1.125rem; margin-top: var(--space-4); }

.about-narrative {
  display: grid;
  gap: var(--space-6);
  grid-template-columns: 1fr;
  margin-bottom: var(--space-8);
}
@media (min-width: 800px) { .about-narrative { grid-template-columns: repeat(2, 1fr); } }
.about-narrative-item h3 { margin-bottom: var(--space-3); }
.about-narrative-item p { font-size: var(--fs-body); }