.leader-brief-layout{
  display:grid;
  grid-template-columns:minmax(150px,230px) minmax(0,1fr);
  gap:clamp(22px,4vw,52px);
  align-items:start;
}
.leader-portrait{margin:0}
.leader-portrait img,.portrait-pending>span{
  display:block;
  width:100%;
  aspect-ratio:3/4;
  border-radius:18px;
  border:1px solid var(--line);
  background:#15373e;
  object-fit:cover;
  object-position:center top;
}
.leader-portrait figcaption{
  margin-top:10px;
  color:var(--muted);
  font-size:9px;
  line-height:1.45;
}
.leader-portrait figcaption a{color:var(--gold)}
.portrait-pending>span{
  display:grid;
  place-items:center;
  color:var(--gold);
  font:500 42px Georgia,serif;
  background:linear-gradient(145deg,#15373e,#0b252e);
}
@media(max-width:600px){
  .leader-brief{padding:20px 16px}
  .leader-brief-layout{grid-template-columns:94px minmax(0,1fr);gap:14px}
  .leader-brief h2{font-size:clamp(27px,8vw,38px);margin:10px 0}
  .leader-portrait figcaption{font-size:8px}
  .portrait-pending>span{font-size:27px}
}

/* Mobile-first usability refinements layered over the desktop visual system. */
@media(max-width:900px){
  body{font-size:14px}
  .header-inner{padding-inline:max(12px,env(safe-area-inset-left))}
  .menu-toggle{min-width:64px;min-height:48px}
  .nav{left:8px;right:8px;padding:8px}
  .nav a{display:flex;align-items:center;min-height:48px}
  .shell{padding-inline:max(12px,env(safe-area-inset-left))}
  .btn{min-height:46px}
  .section{padding:42px 0}
  .page-head{padding:28px 2px 12px;margin-bottom:20px}
  .page-head h1{font-size:clamp(38px,10vw,58px)}
  .page-head p{font-size:14px;line-height:1.55}
  .toolbar{display:grid;grid-template-columns:1fr;padding:14px}
  .toolbar label,.toolbar .grow,.toolbar .field{width:100%;max-width:none;min-width:0}
  .field{min-height:48px;font-size:16px}
  .country-actions{margin-top:0;gap:8px}
  .country-actions .btn{flex:1 1 145px}
  .leader-browser{gap:12px}
  .leader-list{position:relative;top:auto;display:flex;gap:8px;max-height:none;overflow-x:auto;overflow-y:hidden;padding:9px;scroll-snap-type:x proximity;scrollbar-width:thin;overscroll-behavior-inline:contain;-webkit-overflow-scrolling:touch}
  .leader-option{flex:0 0 min(72vw,230px);min-height:72px;padding:11px 13px;scroll-snap-align:start}
  .leader-brief{min-height:0}
  .country-card{min-height:150px;padding:18px}
  .country-card h2{font-size:25px}
  .country-card .news-link{padding-top:12px}
  .profile{gap:14px}
  .profile-aside,.profile-content{padding:16px}
  .profile-content h2{font-size:27px;margin-top:28px}
  .footer{margin-top:44px}
  .footer-inner{padding:34px 18px;gap:22px}
}

@media(max-width:480px){
  .glass{border-radius:18px}
  .section{padding:34px 0}
  .section-head h2{font-size:34px}
  .metrics{gap:9px}
  .metric{padding:17px}
  .metric strong{font-size:32px}
  .card{padding:19px}
  .researcher-card .body{padding:18px}
  .researcher-card h3{font-size:22px}
  .director-copy{padding:24px 18px}
  .director-copy h2{font-size:38px}
  .director-copy p{font-size:15px}
  .country-panel{left:6px;right:6px;bottom:max(6px,env(safe-area-inset-bottom));height:min(58dvh,430px)}
  .map-hint{max-width:calc(100% - 16px);white-space:normal;line-height:1.25}
}

@media(max-width:390px){
  .shell{padding:8px}
  .hero{height:calc(100dvh - 80px);grid-template-rows:210px minmax(0,1fr)}
  .hero-copy{padding:12px 15px 8px;justify-content:flex-start}
  .hero-copy .eyebrow{font-size:7px;margin-top:2px}
  .hero h1{font-size:32px;line-height:.96;margin:7px 0}
  .hero p{font-size:11.5px;line-height:1.35;margin:0}
  .hero-actions{margin-top:9px;gap:6px;flex-wrap:nowrap}
  .hero-actions .btn{min-height:38px;padding:6px 9px;font-size:10px;white-space:nowrap}
  .map-title{top:7px;left:11px;right:11px;align-items:center}
  .map-title .eyebrow{display:none}
  .map-title h2{max-width:150px;font-size:15px;line-height:1.08}
  .map-title .btn{min-height:36px;padding:5px 10px;font-size:11px}
  .map-stage{inset:44px 0 10px}
  .map-label{width:100px;font-size:9px}
  .map-portrait{width:48px;height:48px}
  .page-head h1{font-size:36px}
  .leader-option{flex-basis:78vw}
  .leader-brief-layout{grid-template-columns:82px minmax(0,1fr);gap:12px}
  .leader-brief{padding:16px 12px}
  .leader-brief h2{font-size:27px}
  .leader-portrait figcaption{font-size:7px}
}

@media(max-height:620px) and (max-width:390px){
  .hero{grid-template-rows:194px minmax(0,1fr)}
  .hero h1{font-size:29px}
  .hero p{font-size:10.5px}
  .hero-actions{margin-top:6px}
  .map-title h2{font-size:14px}
}