/* Staff directory: the site's paper, serif and oxblood palette, led by portraiture. */
.staff-hero { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:end; padding:48px 0 64px; border-bottom:1px solid var(--rule); }
.staff-hero h1 { font-size:72px; line-height:1.04; margin:20px 0 0; }
.staff-hero-copy > p { font-size:18px; max-width:46ch; }
.staff-facts { display:flex; align-items:end; gap:38px; margin-top:32px; }
.staff-facts strong { display:block; font:400 40px/1.1 var(--serif); color:var(--ink); }
.staff-facts span { display:block; font:500 12px/1.6 var(--sans); text-transform:uppercase; letter-spacing:.06em; color:var(--muted); margin-top:8px; }
.staff-facts a { margin-left:auto; font-size:14px; }
.staff-directory { display:grid; grid-template-columns:220px minmax(0,1fr); gap:48px; padding-block:48px 88px; scroll-margin-top:88px; }
.staff-sidebar { align-self:start; position:sticky; top:96px; max-height:calc(100svh - 112px); overflow-y:auto; scrollbar-width:thin; }
.staff-sidebar[hidden] + .staff-main { grid-column:1 / -1; }
.staff-sidebar nav { display:grid; margin-top:20px; }
.staff-sidebar button { display:flex; text-align:left; justify-content:space-between; gap:16px; border:0; border-top:1px solid var(--rule); background:transparent; color:var(--muted); font:400 13px/1.5 var(--sans); padding:13px 10px; min-height:48px; cursor:pointer; }
.staff-sidebar button span:last-child { font-variant-numeric:tabular-nums; font-size:12px; }
.staff-sidebar button[aria-pressed=true] { background:var(--ink); color:var(--paper); border-color:var(--ink); }
.staff-sidebar button:hover:not([aria-pressed=true]) { color:var(--accent); background:var(--surface); }
.staff-main { min-width:0; }
.staff-filters { display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:20px; margin:0; }
.staff-filters > div { min-width:0; }
.staff-filters label { font:500 12px/1.6 var(--sans); letter-spacing:.08em; text-transform:uppercase; margin-bottom:10px; display:block; }
.staff-filters :is(input,select) { width:100%; height:48px; margin:0; padding:10px 12px; min-width:0; font:400 14px/1.5 var(--sans); background:transparent; border:1px solid var(--rule); color:var(--ink); }
.staff-filters select { padding-right:28px; text-overflow:ellipsis; }
.staff-mobile-group { display:none; }
.staff-results-bar { display:flex; justify-content:space-between; align-items:center; min-height:72px; gap:20px; }
.staff-results-bar p { font-size:13px; margin:0; color:var(--muted); }
.staff-reset { border:0; padding:10px 0; min-height:44px; background:none; color:var(--accent); text-decoration:underline; text-underline-offset:4px; font:400 13px var(--sans); cursor:pointer; }
.staff-group { margin-bottom:48px; }
.staff-group-heading { border-top:1px solid var(--rule); display:flex; justify-content:space-between; align-items:center; gap:24px; padding:24px 0; }
.staff-group-heading h2 { font:400 28px/1.15 var(--serif); margin:0; }
.staff-group-heading > span { flex-shrink:0; font:400 12px/1.5 var(--sans); color:var(--muted); }
.staff-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px 32px; align-items:start; }
.staff-card { min-width:0; padding:20px 0 0; border-top:1px solid var(--rule); }
.staff-card-heading { display:flex; gap:20px; align-items:center; }
.staff-card-heading > div { min-width:0; }
.staff-card .staff-portrait { display:block; flex:0 0 96px; width:96px; height:96px; object-fit:cover; background:var(--surface); }
/* The portrait frame stays one inch square, including while a biography is open. */
.staff-photo-block { flex:0 0 96px; width:96px; }
.staff-profile-label { display:flex; align-items:center; gap:6px; margin-bottom:8px; color:var(--muted); font:500 10px/1.4 var(--sans); letter-spacing:.08em; text-transform:uppercase; }
.staff-photo-frame { position:relative; width:96px; height:96px; overflow:hidden; background:var(--surface); }
.staff-photo-frame[data-photo-visible="false"] .staff-portrait { filter:blur(7px); }
.staff-view-image { position:absolute; inset:0; margin:auto; width:84px; height:44px; border:1px solid var(--rule); background:var(--paper); color:var(--ink); font:500 11px/1.2 var(--sans); cursor:pointer; box-shadow:0 2px 12px #00000012; }
.staff-view-image[hidden] { display:none; }
.staff-view-image:hover { background:var(--ink); color:var(--paper); }
.staff-view-image:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
.staff-photo-frame:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
.staff-card h3 { font:400 25px/1.15 var(--serif); margin:0 0 10px; }
.staff-card .staff-role { font:400 13px/1.6 var(--sans); color:var(--muted); margin:0; }
.staff-biography { margin-top:12px; }
.staff-biography summary { display:flex; align-items:center; gap:12px; min-height:44px; width:fit-content; padding:8px 0; color:var(--accent); cursor:pointer; list-style:none; font:500 13px/1.5 var(--sans); text-decoration:underline; text-underline-offset:4px; }
.staff-biography summary > span { font:inherit; transform:none; }
.staff-biography[open] summary > span { transform:none; }
.staff-biography summary::-webkit-details-marker { display:none; }
.staff-biography summary::after { content:'+'; font-size:18px; text-decoration:none; }
.staff-biography[open] summary::after { content:'−'; }
.staff-biography summary:focus-visible { outline:2px solid var(--accent); outline-offset:4px; }
.staff-biography .bio-hide,.staff-biography[open] .bio-show { display:none; }
.staff-biography[open] .bio-hide { display:inline; }
.staff-bio { padding:16px 0 8px; }
.staff-bio p { font:400 16px/1.75 var(--sans); color:var(--muted); margin:0 0 20px; max-width:65ch; }
.staff-bio p:last-child { margin-bottom:0; }
.staff-pagination { border-top:1px solid var(--rule); display:flex; justify-content:space-between; align-items:center; padding-top:28px; gap:20px; }
.staff-pagination p { font-size:13px; margin:0; }
.staff-pagination button:disabled { cursor:default; opacity:.45; }
.staff-empty { padding:72px 24px; text-align:center; background:var(--surface); }
.staff-empty h2 { font-size:36px; }
.staff-empty p { margin:20px auto; }
#staff-results:focus { outline:none; }
@media(max-width:1250px){
 .staff-hero { gap:40px; } .staff-hero h1 { font-size:60px; }
 .staff-facts { flex-wrap:wrap; gap:24px; } .staff-facts a { margin-left:0; }
 .staff-directory { grid-template-columns:190px minmax(0,1fr); gap:28px; }
 .staff-grid { gap:28px 20px; } .staff-card h3 { font-size:23px; }
}
@media(max-width:1000px){
 .staff-directory { display:block; } .staff-sidebar { display:none; }
 .staff-mobile-group { display:block; } .staff-filters { grid-template-columns:1fr 1fr; }
 .staff-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:760px){
 .staff-hero { grid-template-columns:1fr; gap:28px; padding:28px 0 40px; }
 .staff-hero h1 { font-size:48px; } .staff-hero-copy > p { font-size:17px; }
 .staff-facts { gap:32px; align-items:center; } .staff-facts a { width:100%; }
 .staff-facts strong { font-size:36px; }
 .staff-directory { padding-top:32px; }
 .staff-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px 20px; }
 .staff-group-heading h2 { font-size:26px; }

}
@media(max-width:520px){
 .staff-hero h1 { font-size:44px; } .staff-grid { grid-template-columns:1fr; }
 .staff-search { grid-column:1 / -1; } .staff-mobile-group { grid-column:1 / -1; }
 .staff-card h3 { font-size:28px; } .staff-card .staff-role { font-size:14px; }
 .staff-group-heading { gap:12px; } .staff-pagination { gap:12px; }
 .staff-pagination .button { padding:12px; }
}

@media(max-width:650px){ .staff-grid { grid-template-columns:1fr; } .staff-card-heading { gap:16px; } .staff-card h3 { font-size:25px; } }