.page-hero h1 { font-family: var(--serif); font-weight: 400; font-size: clamp(48px, 7vw, 92px); line-height: 1.02; letter-spacing: -0.01em; margin: 0 0 var(--sp-4) 0; max-width: 15ch; color: var(--ink); text-wrap: balance; }
.page-hero p.lede { font-family: var(--serif); font-style: italic; font-size: clamp(21px, 2vw, 27px); line-height: 1.4; color: var(--ink); max-width: 50ch; margin: 0; }
.page-section { padding-block: clamp(8px, 2vw, 24px) clamp(56px, 8vw, 112px); }
.intro { max-width: 64ch; }
.intro p { font-family: var(--serif); font-size: 22px; line-height: 1.6; color: var(--ink); margin: 0 0 1.1em; font-weight: 500; }
.intro em { font-style: italic; color: var(--forest-deep); }
.people-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--sp-4); margin-top: var(--sp-5); }
@media (max-width: 900px) { .people-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .people-grid { grid-template-columns: 1fr; } }
.person { border: 0.5px solid var(--rule); background: var(--paper); padding: var(--sp-4); display: flex; flex-direction: column; gap: var(--sp-3); }
.person-portrait { aspect-ratio: 4/5; background: var(--forest); display: flex; align-items: flex-end; justify-content: flex-start; padding: var(--sp-3); position: relative; }
.person-portrait[data-bio-target] { cursor: pointer; }
.person-portrait[data-bio-target] img { transition: opacity 200ms ease, transform 360ms cubic-bezier(.22,.61,.36,1); }
.person-portrait[data-bio-target]:hover img { opacity: 0.92; transform: scale(1.02); }
.person-portrait[data-bio-target] { overflow: hidden; }
.person-portrait[data-bio-target]:focus-visible { outline: 2px solid var(--forest-deep); outline-offset: 2px; }
.person-portrait span { font-family: var(--serif); font-style: italic; font-size: clamp(40px, 5vw, 56px); line-height: 1; color: rgba(255,255,255,0.92); }
.person-portrait::after { content: "Portrait pending"; position: absolute; top: var(--sp-3); right: var(--sp-3); font-family: var(--sans); font-size: 9px; letter-spacing: 0.16em; text-transform: uppercase; color: rgba(255,255,255,0.6); }
.person-name { font-family: var(--serif); font-weight: 400; font-size: 26px; line-height: 1.1; color: var(--ink); margin: 0; }
.person-role { font-family: var(--sans); font-size: 12px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--meta); margin: 0; line-height: 1.5; }
.person-open { align-self: flex-start; margin-top: auto; background: transparent; border: 0; padding: 6px 0 4px; font-family: var(--sans); font-size: 12.5px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--forest-deep); cursor: pointer; border-bottom: 0.5px solid var(--forest-deep); transition: color 160ms ease, border-color 160ms ease; }
.person-open:hover { color: var(--ink); border-color: var(--ink); }
.bio-data { display: none; }
.bio-eyebrow { font-family: var(--serif); font-weight: 400; font-size: clamp(28px, 3.4vw, 38px); line-height: 1.1; color: var(--ink); margin: 0 0 var(--sp-2); }
.bio-role { font-family: var(--sans); font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--forest-deep); margin: 0 0 var(--sp-4); }
.bio-body { font-family: var(--serif); font-size: 21px; line-height: 1.6; color: var(--ink); margin: 0 0 1.1em; font-weight: 500; }
.people-ledger { margin-top: var(--sp-6); }
.person-portrait.has-photo { padding: 0; }
.person-portrait.has-photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 18%; display: block; }
.person-portrait.has-photo::after { content: none; }
.person-portrait.has-photo span { display: none; }