.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.no-js-submit{align-self:end}.project-monogram{font-size:64px;font-weight:700;color:var(--navy);opacity:.22}.pagination{display:flex;align-items:center;justify-content:center;gap:24px;margin-top:42px}.pagination a{font-weight:700;text-decoration:underline;text-underline-offset:4px}.htmx-request{opacity:.65;transition:opacity .15s}.htmx-request .editorial-grid,.htmx-request.projects-grid{pointer-events:none}.enquiry-form{display:grid;gap:20px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.enquiry-form label:not(.consent-field){display:block;margin-bottom:7px;font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase}.enquiry-form label span{font-weight:400;text-transform:none;letter-spacing:0}.enquiry-form input:not([type=checkbox]),.enquiry-form select,.enquiry-form textarea,.filter-row select{width:100%;border:1px solid #c9c8c3;border-radius:3px;background:#fff;color:var(--navy);font:inherit;padding:13px 14px}.enquiry-form input:focus,.enquiry-form select:focus,.enquiry-form textarea:focus,.filter-row select:focus{outline:3px solid rgba(231,50,123,.22);border-color:var(--pink)}.consent-field{display:flex;align-items:flex-start;gap:10px;font-size:13px;line-height:1.5}.consent-field input{width:20px;height:20px;margin-top:1px}.errorlist{margin:6px 0 0;padding:0;list-style:none;color:#9b1c31;font-size:13px}.form-errors,.enquiry-success{padding:18px;border-left:4px solid var(--pink);background:#fff}.profile-layout{display:grid;grid-template-columns:minmax(220px,340px) minmax(0,760px);gap:70px;align-items:start}.profile-portrait{width:100%;height:auto}.profile-art{min-height:340px}.director-card>a{color:inherit;text-decoration:none}.director-card>a:focus-visible{outline:3px solid var(--pink);outline-offset:5px}.filter-row select{width:min(100%,280px)}
@media(max-width:700px){.form-grid,.profile-layout{grid-template-columns:1fr}.profile-layout{gap:30px}.no-js-submit{width:100%}.pagination{justify-content:space-between;gap:10px}.pagination span{font-size:12px}}
.js .no-js-submit{display:none}
.content-blocks{padding-top:72px;padding-bottom:72px}.content-block{margin:0 0 34px}.content-block h2{margin-top:0}.content-block--text{max-width:780px}.content-block--image img,.service-hero-media img{display:block;width:100%;height:auto;max-height:720px;object-fit:cover}.content-block--image figcaption{display:flex;justify-content:space-between;gap:24px;margin-top:10px;color:#666;font-size:13px}.content-block--split{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,1fr);gap:52px;align-items:center;padding:42px}.content-block--split.image-first img{order:-1}.content-block--split img{width:100%;height:100%;max-height:480px;object-fit:cover}.content-block--callout,.content-block--quote{padding:38px;border-left:5px solid var(--pink)}.content-block--quote{font-size:clamp(22px,3vw,34px);line-height:1.35}.content-block--quote cite{display:block;margin-top:20px;font-size:14px;font-style:normal;font-weight:700}.content-block--link{display:grid;gap:8px;padding:30px;color:inherit;text-decoration:none;border:1px solid #d8d7d2}.content-block--link strong{font-size:24px}.content-block--media video{display:block;width:100%;max-height:720px;background:#111}.content-block--media audio{display:block;width:100%}.content-block--media figcaption{margin-top:10px;color:#666;font-size:13px}.content-block--soft{background:#f2f1ed}.content-block--dark{background:var(--navy);color:#fff}.content-block--brand{background:var(--pink);color:#fff}.story-byline{padding-bottom:18px;border-bottom:1px solid #ddd}.service-hero-media{margin-top:52px}.services-directory .service-card h2{font-size:26px}.hero-visual>img{width:100%;height:100%;object-fit:cover}
@media(max-width:700px){.content-block--split{grid-template-columns:1fr;padding:24px}.content-block--image figcaption{display:block}.service-hero-media{margin-top:24px}}

/* Final UI refinements, 30 September 2026 */
/* Eyebrows: keep one size everywhere; layout rules such as ".page-hero p" were overriding it */
main p.eyebrow{font-size:10px;line-height:1.4}
@media(max-width:560px){main p.eyebrow{font-size:9px}}
/* Office directory: country name and toggle label on one tidy row */
.office-directory summary{display:flex;align-items:center;gap:12px;list-style:none}
.office-directory summary::-webkit-details-marker{display:none}
.office-directory .office-name{flex:1;min-width:0}
.office-directory .office-toggle{flex-shrink:0;font-size:11px;font-weight:600;color:#934470;white-space:nowrap}
.office-directory .office-toggle:after{content:' +'}
.office-directory details[open] .office-toggle{color:#6c5b6b}
.office-directory details[open] .office-toggle:after{content:' −'}
.office-directory details[open] summary{margin-bottom:4px}
.office-directory .text-link{margin-right:18px}
/* Sidebar link lists: keep the arrow beside its label instead of wrapping onto its own line */
.aside-links a.text-link,.record-card a.text-link{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.aside-links a.text-link svg,.record-card a.text-link svg{flex-shrink:0;width:16px;height:16px;margin-top:2px}
.record-card a[href^="mailto:"]{overflow-wrap:anywhere}
/* Footer bottom row: align copyright with the legal links */
.footer-bottom{align-items:center}
@media(max-width:560px){.footer-bottom{align-items:flex-start}}
/* Mobile header: compact the call-to-action so it does not crowd the logo */
@media(max-width:560px){.nav-cta{min-height:40px;padding:9px 13px;font-size:12px}.nav-cta span{display:none}}
/* Director profile without a biography yet */
.profile-pending{padding:30px;border:1px solid var(--line);border-radius:10px;background:#fff}
.profile-pending h2{font-size:26px;margin-top:0}
.profile-pending p{font-size:15px}
.profile-pending p:last-child{margin-bottom:0}
/* Error page */
.notfound{padding:120px 0 130px}
.notfound .notfound-eyebrow{justify-content:center}
.notfound h1{font-size:clamp(40px,7vw,65px);letter-spacing:-.05em;line-height:1.05;margin:0 auto 20px;max-width:760px}
.notfound-intro{max-width:520px;margin:0 auto 34px;color:var(--muted)}
.notfound-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:14px 26px}
@media(max-width:560px){.notfound{padding:70px 0 80px}.notfound-actions{flex-direction:column}}
/* Profile monogram card: stay inside its column (min-height x aspect-ratio was forcing ~490px width) */
.profile-layout>aside{min-width:0}
.profile-layout .profile-art{min-height:0;width:100%;aspect-ratio:1.1}
@media(max-width:700px){.profile-layout .profile-art{aspect-ratio:1.45;height:auto;grid-row:auto}}
/* Neutral project and newsroom artwork when repeating a misleading image would be worse */
.project-cover>svg{width:64px;height:64px;color:var(--navy);opacity:.22}
.editorial-photo .publisher-tile{width:100%;height:100%;aspect-ratio:auto;border-radius:0}
.feature-portrait .publisher-tile{width:100%;height:100%;min-height:280px;aspect-ratio:1.35;border-radius:0}
.project-card h2{font-size:23px}
@media(max-width:1100px){.project-card h2{font-size:21px}}
@media(max-width:560px){.project-card h2{font-size:26px}}
@media(min-width:1000px) and (max-width:1099px){.africa-art{margin-left:0;margin-right:0}}

/* Leadership should feel human and remain usable on small screens. */
.director-card .director-art{aspect-ratio:4/5}
.director-art.has-photo{padding:0;background:#ded8df;aspect-ratio:4/5}
.director-art.has-photo:after{display:none}
.director-art.has-photo img{width:100%;height:100%;object-fit:cover}
.director-art--garang-mayom-malek img{object-position:18% center}
.person-monogram--photo{padding:0;overflow:hidden;background:#ddd}
.person-monogram--photo img{width:100%;height:100%;object-fit:cover}
.person-monogram--garang-mayom-malek img{object-position:18% center}
.profile-portrait{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:12px;background:#e7e2e7}
.profile-portrait--garang-mayom-malek{object-position:18% center}
.services-directory .service-card{position:relative}
.services-directory .legacy-anchor{position:absolute;inset:0 auto auto 0;width:0;height:0;overflow:hidden}
.executive-feature{background:#fff;border:1px solid var(--line);border-radius:12px;padding:24px;grid-template-columns:minmax(220px,300px) minmax(0,1fr)}
.executive-portrait{display:block;aspect-ratio:4/5;border-radius:9px;overflow:hidden;background:#e7e2e7}
.executive-portrait img{width:100%;height:100%;object-fit:cover}
.executive-feature .eyebrow{margin-bottom:14px}
.executive-feature h3{font-size:36px;margin-bottom:8px}
.executive-role{color:#914c73;font-size:13px!important;margin-bottom:20px}
.executive-summary{font-size:14px!important;line-height:1.8;max-width:500px}
.team-rows{margin-top:24px;gap:12px 16px}
.team-rows .team-row{display:grid;grid-template-columns:50px minmax(0,1fr) auto;align-items:center;gap:15px;min-height:82px;padding:12px 16px;border:1px solid #ddd7df;border-radius:9px;background:#fff}
.team-avatar{display:grid;place-items:center;width:50px;height:54px;border-radius:7px;background:#e8dfe9;color:#6b4968;font-size:16px}
.team-row strong{display:block;font-size:16px;font-weight:600;line-height:1.35}
.team-row small{display:block;color:var(--muted);font-size:11px;line-height:1.45;margin-top:3px}
.team-arrow{font-size:18px;color:#8e5375}
.team-row:hover{border-color:#bd91aa}
@media(max-width:800px){
  .director-card{display:block}
  .director-card>a{display:grid;grid-template-columns:120px minmax(0,1fr);grid-template-rows:1fr auto auto;gap:0 22px;align-items:end;min-height:150px}
  .director-card .director-art{grid-column:1;grid-row:1/4;width:120px;height:150px;min-height:0;aspect-ratio:4/5;margin:0}
  .director-card h3{grid-column:2;grid-row:2;font-size:24px;align-self:end;margin:0 0 5px}
  .director-card p{grid-column:2;grid-row:3;font-size:13px;line-height:1.55;margin:0 0 4px}
  .executive-feature{grid-template-columns:180px minmax(0,1fr);gap:24px}
}
@media(max-width:520px){
  .directors-grid{gap:18px}
  .director-card{padding:14px;border:1px solid var(--line);border-radius:10px;background:#fff}
  .director-card>a{grid-template-columns:104px minmax(0,1fr);gap:0 16px;min-height:130px}
  .director-card .director-art{width:104px;height:130px}
  .director-card h3{font-size:21px}
  .director-card p{font-size:12px}
  .executive-feature{grid-template-columns:108px minmax(0,1fr);gap:17px;padding:16px;align-items:center}
  .executive-feature h3{font-size:24px;line-height:1.1;margin-bottom:6px}
  .executive-feature .eyebrow{font-size:8px;margin-bottom:9px}
  .executive-role{font-size:11px!important;line-height:1.5;margin-bottom:14px}
  .executive-summary{display:none}
  .executive-feature .text-link{font-size:11px}
  .team-rows{grid-template-columns:1fr;margin-top:16px}
  .team-rows .team-row{min-height:76px;padding:10px 13px;grid-template-columns:46px minmax(0,1fr) auto;gap:12px}
  .team-avatar{width:46px;height:50px}
  .team-row strong{font-size:15px}
  .profile-layout>aside:has(.profile-portrait){max-width:360px}
}
@media(max-width:700px){
  .services-directory{grid-template-columns:1fr;gap:14px}
  .services-directory .service-card{display:grid;grid-template-columns:46px minmax(0,1fr);grid-template-rows:auto auto auto;gap:0 17px;min-height:0;padding:21px 22px}
  .services-directory .service-icon{grid-column:1;grid-row:1/4;width:46px;height:46px;margin:1px 0 0}
  .services-directory .service-card h2{grid-column:2;grid-row:1;font-size:23px;line-height:1.15;margin:0 0 9px}
  .services-directory .service-card p{grid-column:2;grid-row:2;font-size:12px;line-height:1.65;margin:0 0 8px}
  .services-directory .service-card .text-link{grid-column:2;grid-row:3;width:auto;min-height:38px;justify-content:flex-start;align-items:center;font-size:11px}
}
@media(max-width:355px){
  .director-card>a{grid-template-columns:88px minmax(0,1fr);gap:0 14px;min-height:110px}
  .director-card .director-art{width:88px;height:110px}
  .director-card h3{font-size:19px}
  .executive-feature{grid-template-columns:90px minmax(0,1fr);gap:14px;padding:14px}
  .executive-feature h3{font-size:21px}
  .services-directory .service-card{grid-template-columns:40px minmax(0,1fr);gap:0 13px;padding:18px 16px}
  .services-directory .service-icon{width:40px;height:40px}
  .services-directory .service-card h2{font-size:20px}
}