/* Motion is progressive enhancement: all content is readable without scripting. */
.reading-progress{position:fixed;left:0;top:0;width:100%;height:3px;background:#839c79;transform-origin:left;z-index:40;pointer-events:none;transform:scaleX(0)}
.supporter-invitation{padding:52px 0 62px;display:flex;gap:50px;align-items:center;justify-content:space-between}.supporter-invitation h2{font-size:clamp(2rem,3.2vw,3.5rem);margin:8px 0 0;max-width:20ch}.supporter-invitation .eyebrow{font-size:12px}.supporter-invitation .text-link{font-size:17px;flex-shrink:0}
@media(prefers-reduced-motion:no-preference){
.motion .immersive-welcome{height:170svh;min-height:1000px;display:block;padding:0;position:relative;background:var(--ink)}
.motion .welcome-pin{height:100svh;min-height:650px;position:sticky;top:0;overflow:hidden;display:grid;align-items:center;grid-template-columns:1fr 1fr;padding:8vw;isolation:isolate}
.motion .immersive-welcome .scene{position:absolute;inset:0;border-radius:0;z-index:-2;clip-path:inset(calc((1 - var(--p,0))*6%) calc((1 - var(--p,0))*4%) round 3px)}
.motion .immersive-welcome .scene img{height:100%;width:100%;object-fit:cover;aspect-ratio:auto;transform:scale(calc(1.1 - var(--p,0)*.1));object-position:35% center}
.motion .welcome-pin:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(12,31,25,.14),rgba(12,31,25,.25) 30%,rgba(12,31,25,.87));z-index:-1}
.motion .immersive-welcome .story-copy{grid-column:2;color:var(--cream);transform:translateY(calc((1 - var(--p,0))*32px));max-width:530px}
.motion .immersive-welcome .story-copy h2{font-size:clamp(3rem,5.8vw,6rem)}
.motion .immersive-welcome .story-copy p{color:#f0f1e9;font-size:1.125rem}.motion .immersive-welcome .quiet-note{border-color:#849486}.motion .immersive-welcome .text-link:hover{color:#fff}
.motion [data-reveal]{opacity:var(--reveal,1);transform:translate3d(0,calc((1 - var(--reveal,1))*38px),0)}
.motion [data-image-reveal]{clip-path:inset(calc((1 - var(--reveal,1))*13%) 0 0);transform:translateY(calc((1 - var(--reveal,1))*20px))}
.motion .donor-hero .hero-landscape{transform:scale(calc(1.06 + var(--hero-p,0)*.08));will-change:transform}
.motion .donor-hero .donor-hero-copy{transform:translateY(calc(var(--hero-p,0)*60px));opacity:calc(1 - var(--hero-p,0)*.7)}
}
@media(min-width:681px){.listen{padding-top:110px;padding-bottom:100px}.listen .scene{margin-top:60px}.listen .scene img{aspect-ratio:1.8}.support,.learning,.together{padding-top:120px;padding-bottom:120px}}
@media(max-width:1000px){nav{gap:19px}.supporter-invitation{display:block}.supporter-invitation .text-link{margin-top:20px}}
@media(max-width:680px){header nav>a.stories-nav{display:inline-flex;font-size:13px;line-height:1.2;max-width:55px}header nav{gap:12px}.brand{flex-shrink:0}header .button.small{font-size:13px;padding:12px;gap:8px}header .button.small svg{display:none}.supporter-invitation{padding:35px 0 45px}.supporter-invitation h2{font-size:2rem}.supporter-invitation .text-link{font-size:16px}
.motion .immersive-welcome{height:150svh;min-height:1100px}.motion .welcome-pin{min-height:690px;grid-template-columns:1fr;align-items:end;padding:40px 6% 100px}.motion .immersive-welcome .story-copy{grid-column:1}.motion .immersive-welcome .story-copy h2{font-size:clamp(2.7rem,10vw,3.8rem)}.motion .immersive-welcome .scene img{object-position:37% center}.motion .welcome-pin:after{background:linear-gradient(0deg,rgba(12,31,25,.95),rgba(12,31,25,.7) 47%,rgba(12,31,25,.08) 85%)}.motion .immersive-welcome .story-copy p{font-size:1rem}.motion .immersive-welcome .quiet-note{margin-top:17px;padding-top:15px}}
@media(max-width:360px){header .brand{width:80px}header nav{gap:8px}header .button.small{max-width:120px;font-size:12px}}
@media(prefers-reduced-motion:reduce){.welcome-pin{display:contents}.reading-progress{display:none}}

.welcome-pin{display:contents}
@media(prefers-reduced-motion:no-preference){.motion .welcome-pin{display:grid}}
@media(max-width:680px){.hero .intro br{display:none}.motion .welcome-pin{padding-bottom:115px}}
@media(max-width:680px){.motion .immersive-welcome .scene{background:var(--ink)}.motion .immersive-welcome .scene img{height:65%;object-position:59% 20%;transform:none}.motion .welcome-pin:after{background:linear-gradient(0deg,#213936 0%,rgba(33,57,54,.98) 34%,rgba(33,57,54,.75) 46%,rgba(33,57,54,0) 70%)}}