/* WHEELING2HELP — Typography refinement / V5.1
   Clean Greek typography, balanced headline rhythm and comfortable mobile wrapping.
   Design-only override: no admin/backend or interaction changes. */
:root{--title-color:#133c5c;--title-ease:cubic-bezier(.22,1,.36,1)}
/* The previous tracking was unusually tight for Greek, and the oversized italic
   display face created uneven baselines. Keep the editorial pairing, lose the noise. */
h1,h2,h3{letter-spacing:-.042em;line-height:1.16;word-break:normal;overflow-wrap:break-word;font-kerning:normal}
h1,h2{text-wrap:balance}
h3{letter-spacing:-.025em;line-height:1.28}
.serif,.statement h2 em,.world-head h2 em,.film-copy h2 em,.apply-body h2 em,.editorial-intro p em{
  font-family:'Manrope', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-style:normal;
  font-weight:400;
  letter-spacing:-.032em;
  line-height:inherit;
}
/* Signature homepage headline: two measured lines on wide screens;
   natural, intact word-wrapping on smaller screens. */
.hero-cinematic .hero-copy{max-width:870px}
.hero-cinematic h1{
  font-size:clamp(57px,5.6vw,86px);
  font-weight:750;
  letter-spacing:-.055em;
  line-height:1.13;
  max-width:870px;
  text-wrap:initial;
  margin:27px 0 25px;
}
.hero-cinematic h1 .hero-title-line{display:block}
.hero-cinematic h1 .serif{color:#c6e9fb;letter-spacing:-.027em;font-size:.97em;font-weight:400}
.hero-cinematic .hero-sub{max-width:555px}
/* Section typography — shared visual rhythm throughout all nine pages. */
.section-head h2,.section-title,.opportunities-heading h2{
 font-size:clamp(38px,4.1vw,60px);
 font-weight:750;
 letter-spacing:-.049em;
 line-height:1.18;
 max-width:790px;
}
.section-head,.opportunities-heading{margin-bottom:43px}
.section-head .serif,.section-title .serif,.about-copy .serif,.feature-copy .serif,
.opportunities-heading .serif,.page-hero .serif,.cta-text .serif{color:#287aab}
.about-copy h2,.feature-copy h2{
 font-size:clamp(38px,4vw,57px);
 font-weight:750;
 letter-spacing:-.048em;
 line-height:1.18;
}
.statement h2{font-size:clamp(38px,4.3vw,62px);letter-spacing:-.045em;line-height:1.18;font-weight:700}
.statement h2 em{letter-spacing:-.025em}
.page-hero h1{font-size:clamp(48px,5.35vw,76px);line-height:1.15;letter-spacing:-.05em;max-width:920px;font-weight:750}
.page-hero .serif{letter-spacing:-.03em}
.cta-text h2{font-size:clamp(35px,3.5vw,49px);font-weight:750;line-height:1.2;letter-spacing:-.04em}
/* Two-column map headline no longer overwhelms the interactive content. */
.world-head{align-items:center;gap:7%;margin-bottom:42px}
.world-head h2{font-size:clamp(43px,4.45vw,65px);font-weight:700;letter-spacing:-.048em;line-height:1.17;max-width:790px;margin:16px 0 0}
.world-head h2 em{color:#bedff3;letter-spacing:-.025em}
.film-copy h2{font-size:clamp(38px,3.6vw,55px);letter-spacing:-.044em;line-height:1.19;font-weight:700;margin:20px auto 24px}
.film-copy h2 em{color:#c2e6f7}
.apply-body h2{font-size:clamp(34px,4.1vw,51px);line-height:1.17;letter-spacing:-.044em}
/* Product/card titles should feel deliberate rather than compressed. */
.program-card h3,.story-card h3,.opportunity-title{letter-spacing:-.025em;line-height:1.28}
.world-detail h3{letter-spacing:-.038em;line-height:1.2}
/* Tablet & mobile: reduce headline weight and keep natural breathing room. */
@media(max-width:980px){
 .hero-cinematic h1{font-size:clamp(52px,6.5vw,68px);line-height:1.15;max-width:720px}
 .page-hero h1{font-size:clamp(46px,6.2vw,67px)}
 .world-head h2{font-size:clamp(42px,6.25vw,59px)}
}
@media(max-width:700px){
 .hero-cinematic .hero-copy{width:100%;max-width:100%}
 .hero-cinematic h1{font-size:clamp(43px,10.4vw,56px);line-height:1.17;letter-spacing:-.05em;margin:21px 0 18px}
 .hero-cinematic h1 .hero-title-line:first-child{max-width:11ch}
 .hero-cinematic h1 .serif{letter-spacing:-.028em}
 .section-head h2,.section-title,.opportunities-heading h2{font-size:clamp(34px,8.7vw,43px);line-height:1.2;letter-spacing:-.045em}
 .section-head,.opportunities-heading{margin-bottom:30px}
 .about-copy h2,.feature-copy h2{font-size:clamp(35px,8.6vw,44px);line-height:1.2}
 .statement h2{font-size:clamp(34px,8.5vw,43px);line-height:1.2}
 .page-hero h1{font-size:clamp(40px,9.2vw,52px);line-height:1.17;letter-spacing:-.045em}
 .world-head h2{font-size:clamp(35px,8.8vw,44px);line-height:1.19}
 .world-head{margin-bottom:29px}
 .film-copy h2{font-size:clamp(35px,8.3vw,45px);line-height:1.21}
 .cta-text h2{font-size:clamp(34px,8vw,42px)}
 .apply-body h2{font-size:clamp(33px,8.4vw,43px)}
}
@media(max-width:375px){
 .hero-cinematic h1{font-size:clamp(39px,10.3vw,43px)}
 .page-hero h1{font-size:39px}
 .section-head h2,.section-title,.opportunities-heading h2{font-size:34px}
 .world-head h2{font-size:35px}
}
/* Preserve the full-bleed photograph deterministically. Older theme layers
   alternated between a hidden image and an empty background, depending on
   browser stacking; use one stable background layer instead. */
.hero-cinematic{
 background-image:
  linear-gradient(90deg,rgba(2,19,35,.87) 0%,rgba(2,22,40,.7) 32%,rgba(4,23,41,.25) 76%,rgba(4,23,41,.12) 100%),
  linear-gradient(0deg,rgba(2,21,40,.69) 0%,rgba(3,24,42,.10) 55%,rgba(3,23,42,.18) 100%),
  url('community-hero.webp')!important;
 background-position:center center!important;
 background-repeat:no-repeat!important;
 background-size:cover!important;
}
.hero-cinematic .hero-photo{display:none!important}
@media(max-width:700px){
 .hero-cinematic{
  background-image:
    linear-gradient(0deg,rgba(3,20,39,.91),rgba(3,22,42,.62) 45%,rgba(4,24,42,.21)),
    linear-gradient(90deg,rgba(3,23,43,.32),transparent),
    url('community-hero.webp')!important;
  background-position:60% center!important;
 }
}
/* Use one harmonious Greek-friendly sans family for the large headlines.
   Secondary phrases are lighter, not calligraphic; this keeps their baseline
   and perceived weight consistent with the main line. */
h1 .serif,h2 .serif,h1 em,h2 em,
.statement h2 em,.world-head h2 em,.film-copy h2 em,.apply-body h2 em{
  font-family:'Manrope', system-ui, -apple-system, 'Segoe UI', sans-serif !important;
  font-weight:500!important;
  font-style:normal!important;
  letter-spacing:-.047em!important;
}
