/* One spatial scene: a photographic hand beneath three sculpted protection layers. */
.hero-journey{position:relative;--scene-header:86px;--scene-height:clamp(640px,calc(100svh - var(--scene-header)),860px)}
.security-stage{position:absolute;inset:0;z-index:0;pointer-events:none}
.security-canvas{display:block;width:100%;height:100%;opacity:0;transition:opacity .7s ease}
.hero-journey .hero-hand{transition:opacity .7s ease}
.scene-pending .hero-journey .hero-hand,.hero-journey.scene-ready .hero-hand{opacity:0}
.hero-journey.scene-ready .security-canvas{opacity:1}
.hero-journey .hero{background:radial-gradient(ellipse at 76% 45%,#e5edff 0%,#f4f8ff 35%,#fff 72%);min-height:var(--scene-height)}
.hero-journey .hero.hero--hand .hero-inner{height:auto;min-height:var(--scene-height);padding-block:50px}
.hero-journey .hero.hero--hand .hero-copy{position:relative;z-index:2;max-width:min(650px,49vw)}
.hero-journey .hero.hero--hand .hero-lead{max-width:38ch}
.scene-motion-enabled .hero-journey{min-height:calc(var(--scene-height) + clamp(240px,36svh,400px))}
.scene-motion-enabled .hero-journey>.hero{position:sticky;top:var(--scene-header)}
.intro-active.intro-exiting .hero-journey .hero-inner{animation:intro-content-arrive .55s cubic-bezier(.16,1,.3,1) both}
@media(max-width:1100px) and (min-width:761px){
 .hero-journey .hero.hero--hand .hero-copy{max-width:46vw}
 .hero-journey .hero.hero--hand h1.hero-brand-heading{font-size:clamp(5rem,10vw,7.6rem)}
 .hero-journey .hero.hero--hand .hero-brand-promise{font-size:clamp(1.8rem,3.6vw,2.8rem)}
 .hero-journey .hero.hero--hand .hero-tagline{font-size:1.75rem}
}
@media(max-width:900px){.hero-journey{--scene-header:72px}}
@media(max-width:760px){
 .hero-journey{--scene-height:max(760px,calc(100svh - 72px))}
 .scene-motion-enabled .hero-journey{min-height:calc(var(--scene-height) + 230px)}
 .hero-journey .hero.hero--hand .hero-inner{padding-block:30px;display:block}
 .hero-journey .hero.hero--hand .hero-copy{max-width:100%;display:block;margin-top:0}
 .hero-journey .hero.hero--hand h1.hero-brand-heading{margin-top:0;font-size:clamp(4.6rem,18vw,6.5rem)}
 .hero-journey .hero.hero--hand .hero-brand-promise{margin-top:18px;font-size:clamp(1.85rem,7.2vw,2.5rem)}
 .hero-journey .hero.hero--hand .hero-tagline{margin-top:14px;font-size:clamp(1.55rem,6vw,2rem)}
 .hero-journey .hero.hero--hand .hero-lead{margin-top:21px;font-size:1rem;line-height:1.8;max-width:36ch}
 .hero-journey .hero{background:radial-gradient(ellipse at 60% 74%,#e0eaff,#f2f7ff 37%,#fff 69%)}
}
@media(max-width:360px){.hero-journey{--scene-height:800px}}
@media(prefers-reduced-motion:reduce){
 .scene-motion-enabled .hero-journey{min-height:0}
 .scene-motion-enabled .hero-journey>.hero{position:relative;top:auto}
 .security-canvas,.hero-journey .hero-hand{transition:none}
 .intro-active.intro-exiting .hero-journey .hero-inner{animation:none}
}
@media print{
 .security-stage{display:none!important}
 .hero-journey,.scene-motion-enabled .hero-journey{min-height:0}
 .hero-journey .hero-hand{opacity:1!important}
 .scene-motion-enabled .hero-journey>.hero{position:relative;top:auto}
 .hero-journey .hero.hero--hand .hero-copy{max-width:100%}
 .hero-journey .hero.hero--hand .hero-inner{min-height:0;padding-block:30px}
}