/* ================================================================
   About page. Builds on index.css (wrap, section, head, card, grid,
   photo, record, chips); only page-specific layout lives here.
   ================================================================ */

.about__photo { min-height: 0; aspect-ratio: 4 / 3; }
.about__photo img { object-position: center 40%; }

.about__recognition { margin-top: clamp(20px, 2.4vw, 32px); }
.about__recognition h3.display { font-size: clamp(22px, 2.2vw, 28px); }

.person { display: flex; flex-direction: column; }
.person__photo { min-height: 0; aspect-ratio: 16 / 9; margin: 0 0 var(--space-3); }
.person h3.display { margin-bottom: var(--space-1); }
.person .link-arrow { align-self: flex-start; margin-top: auto; font-size: 15px; }
.person p:not(.eyebrow) { color: var(--ink-soft); margin-bottom: var(--space-3); }
.person__side { display: grid; gap: clamp(14px, 1.6vw, 20px); align-content: start; }

.about__cta { text-align: center; padding: clamp(36px, 5vw, 64px); }
.about__cta h2 { font-size: clamp(34px, 4.4vw, 54px); margin: 0 0 var(--space-2); }
.about__cta p:not(.eyebrow) { max-width: 52ch; margin-left: auto; margin-right: auto; color: var(--ink-soft); }
.about__cta .actions { justify-content: center; margin-top: var(--space-3); }
