/* Text and actions stay visible while the background animation plays. */
.hero-immediate .journey-intro .hero-copy{opacity:1;visibility:visible;pointer-events:auto;transition:none}
.hero-immediate.is-wide-story .journey-stage-media{inset:0;width:100%;height:100%}
.hero-immediate.is-wide-story .journey-stage::after{background:linear-gradient(90deg,#edf0f3f0 0%,#edf0f3d9 26%,#edf0f355 48%,#edf0f300 70%)}
.hero-immediate .hero-copy .hero-actions .button{background:var(--blue);color:#fff}
.hero-immediate .hero-copy .hero-actions .button:hover{background:#0d3d92}
/* Also retain a complete, useful cover if video fails or motion is reduced. */
.hero-immediate:not(.is-wide-story) .journey-intro{isolation:isolate;min-height:calc(100svh - 82px);padding-bottom:80px}
.hero-immediate:not(.is-wide-story) .journey-intro .hero-copy{position:relative;z-index:2;background:transparent}
.hero-immediate:not(.is-wide-story) .media-intro{position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto;z-index:-1}
.hero-immediate:not(.is-wide-story) .media-intro::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#edf0f3f0,#edf0f3b3 50%,#edf0f322)}
.hero-immediate:not(.is-wide-story) .hero-brands{z-index:2;position:relative;padding-bottom:20px}
@media(max-width:1040px){
 .hero-immediate.is-mobile-story .journey-stage-media{inset:0;width:100%;height:100%}
 .hero-immediate.is-mobile-story .journey-stage::after,.hero-immediate:not(.is-wide-story) .media-intro::after{background:linear-gradient(180deg,#edf0f3ed 0%,#edf0f3d9 22%,#edf0f399 43%,#edf0f326 62%,#edf0f300 80%)}
 .hero-immediate.is-mobile-story .journey-stage-media img,.hero-immediate.is-mobile-story .journey-stage-media video{object-position:76% center}
 .hero-immediate.is-mobile-story .journey-intro .hero-copy{background:transparent}
 .hero-immediate.is-mobile-story .journey-intro-controls{bottom:calc(max(18px,env(safe-area-inset-bottom)) + var(--intro-header-offset,0px))}
}
@media(max-width:760px) and (max-height:740px){
 .hero-immediate.is-mobile-story .journey-intro .journey-hint{display:none}
 .hero-immediate.is-mobile-story .hero-copy h1{font-size:38px}
}
@media(max-width:1040px) and (orientation:landscape){
 .hero-immediate.is-mobile-story .journey-stage::after{background:linear-gradient(90deg,#edf0f3f0 0%,#edf0f3d9 30%,#edf0f366 50%,#edf0f300 75%)}
 .hero-immediate.is-mobile-story .journey-intro .journey-hint{display:none}
}