/* Flexible layouts for phones, split windows and both iPhone Duo displays.
   Layout follows the available space; resizing never replaces page content. */
:root{--field-border:#929798;--safe-left:env(safe-area-inset-left,0px);--safe-right:env(safe-area-inset-right,0px)}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
.frame{padding-left:max(var(--gutter),var(--safe-left));padding-right:max(var(--gutter),var(--safe-right))}
.header{padding-top:env(safe-area-inset-top,0px)}
.footer{padding-bottom:max(24px,env(safe-area-inset-bottom,0px))}
button,a,summary{touch-action:manipulation}
button,input,select,textarea{max-width:100%}
.text-button,.document-open,.project-summary summary{min-height:44px}
.text-button,.document-open{align-content:center}
.footer-bottom>a{min-height:44px;display:inline-flex;align-items:center}
.section,.leadership{min-height:0}
.orientation-grid>*,.news-layout>*,.community-grid>*,.resources-grid>*,.project-grid>*,.leadership-heading>*,.form-row>*,.document-heading>*{min-width:0}
.orientation-grid{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)}
.news-layout{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr)}
.community-grid{grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr)}
.resources-grid{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr)}
.project-grid{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)}
.leadership-heading{grid-template-columns:minmax(0,1fr) minmax(0,1.12fr)}
.form-row{grid-template-columns:repeat(auto-fit,minmax(min(100%,15.5rem),1fr))}
.filters,.hero-foot{flex-wrap:wrap}
.presentation-choice{min-width:0}
.project-documents{container-type:inline-size}
.presentation-controls{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:16px}
.presentation-controls .button{justify-content:center}
.presentation-choice select{height:auto;min-height:54px}
.presentation-slide+.presentation-slide{margin-top:0}
.presentation-hint,.presentation-status,.document-open,.leadership-team dd,.leadership-team dt{overflow-wrap:anywhere}
.presentation-hint{max-width:none}
dialog{max-height:calc(100dvh - 32px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px))}
.dialog-header{align-items:center}
.dialog-close{flex-shrink:0;min-width:44px}

@container(max-width:640px){
  .presentation-controls{grid-template-columns:1fr 1fr}
  .presentation-choice{grid-column:1/-1;grid-row:1;order:0}
  .presentation-controls .button{width:100%}
}

/* Keep the navigation usable before desktop links begin to crowd. */
@media(max-width:1000px){
  .nav-wrap{height:88px}
  .brand{height:78px;width:181px}
  .brand img{width:202px;margin-left:-10px}
  .menu-toggle{display:flex;align-items:center;gap:14px;min-height:48px;background:none;padding:10px 0;font-size:15px;font-weight:700}
  .menu-lines{width:24px;height:12px;border-top:2px solid currentColor;border-bottom:2px solid currentColor}
  nav{display:none;position:absolute;top:100%;left:0;right:0;background:var(--paper);padding:12px max(var(--gutter),var(--safe-right)) 24px max(var(--gutter),var(--safe-left));align-items:stretch;gap:4px;max-height:calc(100dvh - 88px - env(safe-area-inset-top,0px));overflow-y:auto;overscroll-behavior:contain}
  nav.is-open{display:flex;flex-direction:column}
  nav>a:not(.button){min-height:48px;padding-block:12px}
  nav .button{margin-top:12px;max-width:none;justify-content:space-between}
  .form-bottom{align-items:flex-start;flex-wrap:wrap;gap:20px}
  .document-heading{align-items:flex-start;flex-direction:column;gap:22px}
  .leadership-team{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px;margin-top:56px}
  .leadership-team::before,.leadership-team>div::before{display:none}
  .leadership-presidency::after{height:32px}
  .leadership-team dt{min-height:48px}
  .leadership-team dd{font-size:28px}
  .footer-bottom .text-button{padding-block:10px}
}

@media(max-width:700px){
  :root{--gutter:20px}
  .orientation-grid,.news-layout,.community-grid,.resources-grid,.project-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:32px}
  .justice-figure{display:none}
  .section-top{display:block}
  .section-top>p,.section-top>div{margin-top:24px;max-width:48ch}
  .project-grid{margin-top:32px}
  .community-image{aspect-ratio:1.45}
  .resources figure img{aspect-ratio:1.5}
  .resource-list{width:100%}
  .news-layout.filtered-analysis .feature-story,.news-layout.filtered-news .news-stories{display:block}
  .news-layout.filtered-analysis .feature-story img{aspect-ratio:1.65}
  .news-layout.filtered-news .news-story+.news-story{margin-top:32px}
  .project-documents{padding:24px 20px}
  .document-heading .button{width:100%;gap:16px}
  .presentation-controls{grid-template-columns:1fr 1fr;gap:12px}
  .presentation-choice{grid-column:1/-1;grid-row:1;order:0}
  .leadership-heading{display:block}
  .leadership-heading h2{font-size:clamp(42px,10vw,60px)}
  .leadership-logo{width:200px;margin:28px 0 22px}
  .faq-row{grid-template-columns:1fr;gap:18px}
  .faq-row p{margin-top:0}
  .footer-top{display:block}
  .footer-top>p{margin-top:12px}
  .footer-top>.button{margin-top:28px}
  .footer-bottom{align-items:flex-start;flex-direction:column;gap:12px}
}

/* Expanded portrait: use the extra width for choices and the team directory. */
@media(min-width:561px) and (max-width:700px){
  .topic-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .topic-list button{min-height:64px;font-size:15px;padding:12px}
  .leadership-team{grid-template-columns:repeat(2,minmax(0,1fr))}
  .leadership-team dt{min-height:48px}
}

@media(max-width:560px){
  .leadership-team{grid-template-columns:1fr;gap:30px}
  .leadership-team dt{min-height:0}
  .hero-foot{font-size:12px}
  .hero h1{font-size:clamp(38px,12.6vw,70px)}
  .hero-bottom{padding-inline:max(20px,var(--safe-left)) max(20px,var(--safe-right))}
}

/* Short outer screens retain a complete title and a reachable first action. */
@media(max-width:1000px) and (max-height:650px){
  .nav-wrap{height:76px}
  .brand{height:70px}
  nav{max-height:calc(100dvh - 76px - env(safe-area-inset-top,0px))}
  .hero h1{padding-block:32px 34px}
  .hero-bottom{padding-top:28px;padding-bottom:22px;gap:20px}
  .hero-foot{padding-top:20px;margin-top:4px}
  .section{padding-block:56px}
}

/* Open landscape and rotated phones: a compact two-panel opening. */
@media(min-width:540px) and (max-width:1000px) and (max-height:650px){
  .hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:stretch}
  .hero h1{display:flex;flex-direction:column;justify-content:center;font-size:clamp(36px,6.8vw,68px);padding:32px 20px 36px max(20px,var(--safe-left));line-height:1.04}
  .hero-bottom{padding:32px max(20px,var(--safe-right)) 26px 20px;gap:22px;justify-content:center}
  .hero-bottom>p{font-size:16px;max-width:34ch}
  .hero-bottom>p br{display:none}
  .hero-bottom>.button{gap:16px;max-width:100%;padding-inline:16px}
  .hero-foot{padding-top:8px;gap:10px;font-size:11px}
  .hero-foot span:last-child{max-width:24ch;text-align:right}
}

@media(max-width:360px){
  :root{--gutter:16px}
  .nav-wrap{gap:12px}
  .brand{width:159px}
  .brand img{width:178px;margin-left:-9px}
  .menu-toggle{font-size:14px;gap:10px}
  .hero-foot{font-size:11px;gap:10px}
  .hero h1{padding-inline:16px}
  .project-documents{padding:22px 16px}
  .prepare-heading,form,.result{padding-inline:16px}
  .leadership-presidency{padding-inline:20px}
  .leadership-presidency h3{font-size:29px}
  .filters button{padding-inline:13px}
  .news-story+.news-story{margin-inline:calc(-1 * var(--gutter));padding-inline:var(--gutter)}
}

/* Community: two aligned reading rows and a full-width action, no trailing void. */
.community-intro{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:clamp(32px,6vw,96px);align-items:center}
.community-intro .large-copy{max-width:38ch}
.community .community-grid{margin-top:48px;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:clamp(32px,6vw,96px);align-items:stretch}
.community .community-image{margin:0;width:100%;height:100%;min-height:320px;aspect-ratio:1.6;object-fit:cover}
.community-principles{display:flex;flex-direction:column;justify-content:space-between;min-width:0}
.community-principles .principle{margin:0;padding-block:22px;border-top:1px solid #f8f8f633}
.community-principles .principle:first-child{padding-top:0;border-top:0}
.community-principles .principle:last-child{padding-bottom:0}
.community-principles .principle h3{font-size:clamp(22px,2.2vw,30px)}
.community-principles .principle p{max-width:42ch;margin-top:10px;font-size:17px}
.community .collaborate{margin-top:36px;border-top:1px solid #f8f8f633;padding-top:28px}
.community .collaborate>summary{display:flex;width:100%;justify-content:space-between;padding:22px 24px;font-size:18px}
.community .collaborate form{max-width:800px;margin-inline:auto}
@media(max-width:700px){
  .community-intro{grid-template-columns:minmax(0,1fr);gap:24px}
  .community-intro .large-copy{max-width:48ch;font-size:21px}
  .community .community-grid{grid-template-columns:minmax(0,1fr);margin-top:32px;gap:32px}
  .community .community-image{height:auto;min-height:0;aspect-ratio:1.5}
  .community-principles .principle{padding-block:24px}
  .community .collaborate{margin-top:28px;padding-top:24px}
  .community .collaborate>summary{padding:20px;font-size:16px}
}

/* The supplied relief eagle rises once, centered at half width without distortion. */
.hero-heading{position:relative;isolation:isolate;overflow:hidden;width:100%;min-width:0}
.hero-heading::after{content:"";position:absolute;z-index:1;inset:0;pointer-events:none;background:linear-gradient(180deg,transparent 28%,#f8f8f640 48%,#f8f8f6e6 76%,var(--paper) 98%)}
.hero-heading h1{z-index:2;animation:none;padding-top:200px;padding-bottom:60px}
.hero-eagle{position:absolute;z-index:0;pointer-events:none;user-select:none;left:50%;top:0;width:min(50%,720px);max-width:none;height:100%;object-fit:contain;object-position:center top;opacity:1;transform:translateX(-50%);transform-origin:50% 65%}
.hero-eagle.is-arriving{animation:eagle-arrive 1500ms cubic-bezier(.16,1,.3,1) both}
@keyframes eagle-arrive{from{opacity:0;transform:translate(-50%,22%) scale(.92)}to{opacity:1;transform:translate(-50%,0) scale(1)}}
@media(max-width:820px){.hero-heading h1{padding-block:180px 54px}.hero-eagle{width:58%}}
@media(max-width:560px){.hero-heading h1{padding-block:150px 36px}.hero-eagle{width:64%}}
@media(max-width:1000px) and (max-height:650px){.hero-heading h1{padding-block:142px 34px}}
@media(min-width:540px) and (max-width:1000px) and (max-height:650px){.hero-heading h1{height:100%;padding-block:132px 34px}.hero-eagle{width:68%}}
@media(min-width:540px) and (max-width:700px) and (max-height:450px){.hero-heading h1{padding-block:96px 28px}}
@media(prefers-reduced-motion:reduce){.hero-eagle.is-arriving{animation:none}}