/* Version 18: restrained institutional typography and compact spacing. */
body{font-size:15.5px;line-height:1.58}
h1,h2,h3{letter-spacing:-.02em}
h2{font-size:clamp(1.9rem,3.2vw,3rem);line-height:1.16}
.hero{min-height:650px;height:min(720px,calc(100vh - 30px))}
.hero-content{padding:46px 0 142px}
.hero h1{font-size:clamp(2.8rem,5vw,4.4rem);max-width:790px;line-height:1.04;letter-spacing:-.035em}
.hero-copy{font-size:clamp(1rem,1.5vw,1.15rem);max-width:620px}
.section{padding:70px 0}
.section-head{margin-bottom:34px;gap:46px}
.section-head>p{font-size:.98rem}
.mission-band{padding:50px 0}
.mission-grid h3{font-size:1.35rem}
.programme{min-height:260px;padding:32px}
.programme.featured{min-height:540px;padding:44px}
.programme h3{font-size:clamp(1.35rem,2.2vw,1.9rem);margin:20px 0 12px}
.youth-focus,.zsbfp-spotlight{padding:62px 0}
.spotlight-grid{gap:68px}
.spotlight-grid h2{font-size:clamp(2rem,3.5vw,3.25rem)}
.field-grid,.contact-grid{gap:68px}
.updates-grid h3{font-size:1.15rem;line-height:1.25}
.updates-grid article>div{padding:22px}
.partnership-inner{gap:72px}
.contact{padding:68px 0}
.page-hero{padding:78px 0 58px}
.page-hero h1{font-size:clamp(2.35rem,4vw,3.6rem);max-width:820px;line-height:1.1}
.page-hero>div>p:last-child{font-size:1.05rem}
.page-section{padding:62px 0}
.page-intro{gap:52px}
.page-intro h2{font-size:clamp(1.8rem,3vw,2.75rem)}
.page-intro>p{font-size:1rem}
.timeline{margin-top:34px}
.timeline article{padding:22px 0}
.timeline h3{font-size:1.22rem}
.page-cta{padding:56px 0}
.page-cta h2{font-size:clamp(1.8rem,3vw,2.7rem)}
@media(max-width:850px){
  .hero{min-height:650px}
  .hero-content{padding:58px 0 190px}
  .section{padding:54px 0}
  .programme.featured{min-height:460px}
  .page-hero{padding:56px 0 44px}
  .page-section{padding:52px 0}
}
@media(max-width:520px){
  body{font-size:15px}
  h2{font-size:clamp(1.7rem,8vw,2.15rem)}
  .hero{min-height:620px}
  .hero-content{padding:48px 0 185px}
  .hero h1{font-size:2.35rem;line-height:1.06}
  .hero-copy{font-size:1rem}
  .section{padding:44px 0}
  .section-head{gap:24px;margin-bottom:28px}
  .mission-band,.youth-focus,.zsbfp-spotlight,.contact{padding:46px 0}
  .programme,.programme.featured{padding:26px;min-height:auto}
  .programme.featured{padding-top:105px}
  .spotlight-grid,.field-grid,.contact-grid,.partnership-inner{gap:36px}
  .page-hero{padding:46px 0 38px}
  .page-hero h1{font-size:2.15rem}
  .page-section{padding:46px 0}
  .timeline article{padding:18px 0}
  .page-cta{padding:46px 0}
}