/* Forewave 2.0: sculptural hero, native scroll, responsive composition. */
.spatial-hero.hero{--scene-bg:#cbbdf4;--scene-ink:#25183f;position:relative;isolation:isolate;min-height:680px;height:calc(100svh - 90px);max-height:960px;margin:-28px -42px 0;padding:0;border:0;border-radius:0 0 48px 48px;overflow:hidden;background:var(--scene-bg);color:var(--scene-ink);transition:background .7s}
.spatial-hero[data-palette="1"]{--scene-bg:#c5ebd6;--scene-ink:#123a32}.spatial-hero[data-palette="2"]{--scene-bg:#f1c8b1;--scene-ink:#48271d}
.spatial-hero.hero:before{background-image:url('./assets/scene-fallback.svg');background-size:contain;background-repeat:no-repeat;background-position:85% center;inset:0;z-index:0;opacity:1;transition:opacity .4s}.spatial-hero.hero.webgl-ready:before{opacity:0}.spatial-hero.hero:after{content:'';inset:0;pointer-events:none;z-index:2;opacity:1;background:linear-gradient(90deg,var(--scene-bg),transparent 56%)}
.spatial-canvas{position:absolute;inset:0;z-index:1}.spatial-canvas canvas{display:block;width:100%;height:100%}.spatial-hero,.spatial-canvas canvas{touch-action:pan-y pinch-zoom}.spatial-grain{display:none}
.scene-hit-zone{position:absolute;left:0;top:0;z-index:3;clip-path:ellipse(50% 50% at 50% 50%);touch-action:pinch-zoom;cursor:grab;user-select:none;-webkit-user-select:none}.scene-hit-zone[hidden],.spatial-hero:not(.webgl-ready) .scene-hit-zone{display:none}.is-scene-dragging .scene-hit-zone{cursor:grabbing}
.scene-word{position:absolute;bottom:0;left:2%;font-size:clamp(140px,24vw,340px);font-weight:800;letter-spacing:-.09em;line-height:.83;color:var(--scene-ink);opacity:.045;pointer-events:none;z-index:0}
.spatial-caption{position:absolute;top:28px;left:5%;right:5%;display:flex;justify-content:space-between;gap:16px;z-index:4;font-size:10px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;color:var(--scene-ink);opacity:.65}
.spatial-copy{position:absolute;top:46%;left:5%;width:46%;max-width:600px;transform:translateY(-50%);z-index:4;pointer-events:none}.spatial-copy>.eyebrow,.spatial-copy>h1,.spatial-copy>p{pointer-events:auto;touch-action:pan-y pinch-zoom;opacity:var(--story-copy-alpha,1);transform:translateY(var(--story-copy-shift,0px))}
.spatial-copy .eyebrow{color:var(--scene-ink);font-size:10px;letter-spacing:1.8px;margin-bottom:23px;font-weight:600}.spatial-copy .eyebrow:before{background:currentColor;box-shadow:none}.spatial-hero.hero h1{font-size:clamp(56px,6.8vw,98px);font-weight:600;line-height:1.02;letter-spacing:-.065em;color:var(--scene-ink);white-space:pre-line;max-width:100%;margin:0 0 25px;text-shadow:none;text-wrap:balance}.spatial-hero.hero p{font-size:15px;line-height:1.75;max-width:330px;color:var(--scene-ink);opacity:.75;margin:0 0 28px}
.spatial-actions{display:flex;gap:10px;flex-wrap:wrap;pointer-events:auto}.spatial-actions button{border-radius:100px;min-height:52px;padding:14px 24px;font-size:13px;font-weight:600;transition:background .2s,transform .3s;line-height:1.4}.spatial-primary{background:#241839;color:#f6f0ff;box-shadow:0 6px 0 #24183918}.spatial-secondary{color:var(--scene-ink);border:1px solid #25183f40;background:#ffffff18}
.spatial-bottom{position:absolute;bottom:26px;left:5%;right:5%;z-index:4;display:flex;justify-content:space-between;gap:12px;align-items:center;color:var(--scene-ink)}.spatial-scroll{display:flex;gap:12px;align-items:center;font-size:11px;min-height:44px;color:inherit}.spatial-scroll i{font-style:normal;font-size:18px}.spatial-controls{display:flex;gap:4px;align-items:center}.spatial-motion{display:flex;gap:8px;align-items:center;font-size:10px;min-height:44px;color:inherit}.spatial-motion i{font-style:normal;width:30px;height:30px;border:1px solid #25183f40;border-radius:50%;display:grid;place-items:center}.spatial-sensor{width:44px;height:44px;border-radius:50%;color:inherit}.spatial-sensor[hidden]{display:none}.spatial-sensor svg{width:22px;height:22px}.spatial-sensor[data-state=active]{background:#ffffff55}
.scene-switch{position:absolute;right:6%;top:90px;z-index:6;display:flex;gap:3px;padding:3px;background:#ffffff50;border:1px solid #ffffff66;border-radius:100px}.scene-switch button{width:40px;height:40px;position:relative;border-radius:50%}.scene-switch button:before{content:'';position:absolute;inset:10px;border-radius:50%;background:#8560dc}.scene-switch button:nth-child(2):before{background:#41ae91}.scene-switch button:nth-child(3):before{background:#dc946a}.scene-switch button[aria-pressed=true]{background:#ffffffaa;box-shadow:0 2px 7px #25183f15}.scene-hint{position:absolute;bottom:110px;left:70%;transform:translateX(-50%);z-index:4;font-size:10px;letter-spacing:.6px;opacity:.65;pointer-events:none}
.spatial-transition{position:relative;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:22px;padding:45px 0;margin-bottom:14px;border-bottom:1px solid var(--line)}.spatial-transition>span{font-size:10px;letter-spacing:2px;color:#c4afea}.spatial-transition p{font-size:14px;margin:0;color:#c7c2d3}.spatial-transition>i{font-style:normal;font-size:24px;color:#d0bef0}.signal-track{position:absolute;inset:0;display:flex;justify-content:space-around;align-items:center;opacity:.08;pointer-events:none;overflow:hidden}.signal-track i{display:block;width:6px;height:80%;background:#c6b3fa;border-radius:10px;transform:scaleY(calc(.2 + var(--journey,0)*.7))}.signal-track i:nth-child(3n){height:40%}.signal-track i:nth-child(2n){height:60%}
.is-scene-hover canvas{cursor:grab}.is-scene-dragging canvas{cursor:grabbing}.viewing-spatial .tabbar{opacity:0;pointer-events:none;transform:translate(-50%,20px)}.viewing-spatial .gift-mini{opacity:0;pointer-events:none}[dir=rtl] .spatial-copy{right:5%;left:auto}[dir=rtl] .spatial-hero.hero h1{letter-spacing:0}.spatial-caption span:first-child{direction:ltr;unicode-bidi:isolate}
@media(max-width:850px){.spatial-hero.hero{margin:-24px -24px 0;height:calc(100svh - var(--site-header-height,72px));min-height:740px;max-height:1040px;border-radius:0 0 32px 32px}.spatial-hero.hero:after{background:linear-gradient(180deg,var(--scene-bg),transparent 49%)}.spatial-hero.hero:before{background-size:95% auto;background-position:center 65%}.spatial-caption{top:21px;left:24px;right:24px;font-size:8px;letter-spacing:1px}.spatial-caption span:last-child{text-align:end;max-width:48%}.spatial-copy{top:66px;bottom:0;left:24px;max-width:none;width:calc(100% - 48px);transform:none}.spatial-copy .eyebrow{font-size:9px;margin-bottom:16px;letter-spacing:1.3px}.spatial-hero.hero h1{font-size:clamp(43px,10.7vw,66px);line-height:1.02;letter-spacing:-.055em;max-width:95%;margin-bottom:16px}.spatial-hero.hero p{font-size:12px;max-width:310px;line-height:1.7;margin:0}.spatial-actions{position:absolute;bottom:85px;left:0;right:0;gap:8px;flex-wrap:nowrap}.spatial-actions button{flex:1;min-height:50px;font-size:11px;padding:12px 15px}.spatial-bottom{left:24px;right:24px;bottom:20px}.spatial-scroll{font-size:10px}.spatial-motion{font-size:9px}.spatial-motion span{max-width:80px;text-align:start}.scene-switch{top:auto;bottom:152px;right:24px;padding:1px}.scene-switch button{width:36px;height:36px}.scene-switch button:before{inset:9px}.scene-hint{bottom:163px;left:24px;transform:none;font-size:9px;max-width:45%}.spatial-transition{grid-template-columns:1fr auto;gap:10px;padding:30px 0}.spatial-transition>span{font-size:9px}.spatial-transition p{grid-column:1;font-size:12px}.spatial-transition>i{grid-column:2;grid-row:1/3}.scene-word{font-size:30vw;bottom:195px}[dir=rtl] .spatial-copy{right:24px;left:auto}}
@media(max-width:540px){.spatial-hero.hero{margin:-16px -16px 0;min-height:720px}.spatial-hero.hero h1:lang(zh),.spatial-hero.hero h1:lang(zh-TW){font-size:52px;line-height:1.12;letter-spacing:-2px}.spatial-hero.hero h1:lang(de),.spatial-hero.hero h1:lang(nl),.spatial-hero.hero h1:lang(ko){font-size:42px}.spatial-hero.hero h1:lang(hi),.spatial-hero.hero h1:lang(bn),.spatial-hero.hero h1:lang(th){font-size:40px;letter-spacing:0;line-height:1.15}}
@media(max-width:360px){.spatial-caption,.spatial-bottom{left:18px;right:18px}.spatial-copy{left:18px;width:calc(100% - 36px)}.spatial-hero.hero h1{font-size:42px}.spatial-motion span{max-width:65px}.spatial-scroll{font-size:9px}}
