:root{--brand-green:#2d6b51}
header{position:relative;background:var(--brand-green);height:126px;padding:24px 5%;border:0;color:#f2f0e5}
header .brand{position:absolute;left:50%;transform:translateX(-50%);font-size:40px;letter-spacing:6px;text-align:center;white-space:nowrap}
header .brand span{font-size:11px;letter-spacing:2px;margin-top:13px}
header nav{gap:24px;font-size:10px}header .header-cta{margin-left:auto;padding:14px 18px;border:1px solid #f2f0e566}
.hero{height:calc(100svh - 126px);min-height:570px;max-height:1050px;background:#263a31}
.hero-photo{inset:0;height:100%;filter:saturate(.7);object-position:center;transform:none!important}
.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(.65);opacity:0;transition:opacity .8s}
.hero-video.is-playing{opacity:1}
.hero:after{background:linear-gradient(90deg,rgba(12,31,23,.73),rgba(12,31,23,.2) 60%,rgba(12,31,23,.05)),linear-gradient(0deg,#10251b88,transparent 35%)}
.hero-copy{padding:65px 7% 100px}.hero h1,.hero h1 em{font-family:var(--serif);font-weight:400;font-size:clamp(65px,7vw,112px);letter-spacing:-4px;line-height:1.02}.hero h1 em{font-style:italic}.title-line em{padding-left:65px}.hero-kicker{margin-bottom:26px;letter-spacing:2.5px}.hero-description{font-size:13px;max-width:300px;margin-top:24px}.hero-bottom{bottom:25px}.motion-toggle{opacity:1;background:#153e2fbb;padding:10px 14px;bottom:62px;border:1px solid #ffffff40}

@media(max-width:760px){header{height:110px;padding:18px 6%;gap:15px}header .brand{position:static;transform:none;text-align:left;font-size:30px;letter-spacing:4px}header .brand span{font-size:8px;letter-spacing:1.2px;margin-top:10px}header .header-cta{font-size:9px;padding:12px 10px;max-width:112px;line-height:1.6}header nav{display:none}.hero{height:calc(100svh - 110px);min-height:580px}.hero-copy{padding:40px 7% 120px;justify-content:flex-end}.hero h1,.hero h1 em{font-size:62px;letter-spacing:-2.8px}.title-line em{padding-left:35px}.hero-kicker{font-size:7px;letter-spacing:1.5px;margin-bottom:17px}.hero-description{font-size:11px;margin:15px 0 12px}.hero:after{background:linear-gradient(0deg,#0d2a20ed,rgba(13,42,32,.45) 45%,rgba(13,42,32,.03) 80%)}.hero-photo{object-position:60% center}.hero-video{object-position:center}.motion-toggle{top:18px;bottom:auto;right:6%;font-size:8px}.hero-bottom{left:7%;right:7%;font-size:6px}.scroll-cue{gap:8px}}
@media(max-width:360px){header .brand{font-size:25px}.hero h1,.hero h1 em{font-size:54px}}
/* Mobile: keep the wider massage frame, then let the copy sit on green. */
@media(max-width:760px){
 .hero{--film-height:clamp(230px,62vw,390px);height:auto;min-height:0;max-height:none;background:#173d2e}
 .hero-visual{height:var(--film-height);bottom:auto}
 .hero-photo,.hero-video{object-position:center;object-fit:cover}
 .hero:after{bottom:auto;height:calc(var(--film-height) + 1px);background:linear-gradient(0deg,#173d2e,rgba(23,61,46,.15) 35%,transparent 65%)}
 .hero-copy{height:auto;padding:calc(var(--film-height) - 10px) 7% 100px;justify-content:flex-start}
 .hero h1,.hero h1 em{font-size:clamp(48px,12.8vw,72px);letter-spacing:-2px}
 .title-line{padding-bottom:5px}.title-line em{padding-left:30px}
 .hero-kicker{margin-bottom:18px}.hero-description{margin:18px 0 15px}
 .motion-toggle{top:14px}.hero-bottom{bottom:24px}
}
