/* Put the people first, with enough space for their role and vision. */
.about-team { scroll-margin-top:130px; padding-top:24px; }
.about-team-heading { display:flex; gap:40px; align-items:flex-end; justify-content:space-between; margin-bottom:48px; }
.about-team-heading h2 { max-width:650px; margin-bottom:0; }
.about-team-heading>p { max-width:340px; color:#c6cbd0; line-height:1.65; }
.about-team-grid { display:grid; gap:72px; }
.about-person { display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); align-items:start; gap:clamp(28px,5vw,72px); min-width:0; padding-top:32px; border-top:1px solid #9be8ed50; }
.about-person:nth-child(even) { border-color:#eea4c160; }
.about-person-photo { position:relative; overflow:hidden; background:#111719; border-radius:8px; }
.about-person-photo img { display:block; width:100%; height:auto; aspect-ratio:4/5; object-fit:cover; }
.about-person-number { position:absolute; bottom:16px; left:16px; padding:8px 12px; color:#111719; background:#9be8ed; border-radius:4px; font-weight:700; letter-spacing:.12em; }
.about-person-copy { min-width:0; }
.about-person-role { color:#eea4c1; font-size:14px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; line-height:1.5; margin:0 0 12px; }
.about-person h3 { font-size:clamp(32px,4vw,52px); line-height:1.08; margin:0 0 22px; }
.about-person-copy p:not(.about-person-role) { color:#c9cdd0; font-size:16px; line-height:1.75; max-width:66ch; }
.about-person-copy h4 { color:#9be8ed; font:700 14px/1.4 var(--body); text-transform:uppercase; letter-spacing:.08em; margin:24px 0 8px; }
.about-person-copy h4+p { margin-top:0; }
.about-person-vision { border-left:3px solid #eea4c1; padding-left:20px; }
.about-person-vision h4 { color:#eea4c1; }
.about-person .inline-link { margin-top:12px; }
@media(min-width:1000px) { .about-person:nth-child(even) { grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr); } .about-person:nth-child(even) .about-person-photo { grid-column:2; grid-row:1; } .about-person:nth-child(even) .about-person-copy { grid-column:1; grid-row:1; } }
@media(max-width:760px) { .about-team-heading { display:block; } .about-team-heading>p { max-width:50ch; margin-top:24px; } .about-person { grid-template-columns:1fr; gap:24px; } .about-person-photo { max-width:440px; width:100%; margin-inline:auto; } .about-person h3 { font-size:36px; } .about-team-grid { gap:48px; } }
