/* Preview-only phantom entrance. Original hero remains visible and interactive. */
.hero-phantom{position:absolute;inset:0 12.5%;pointer-events:none;z-index:0;opacity:0;background:url("assets/hero-clean-1920-v6.webp") center top/100% auto no-repeat;filter:brightness(1.65) sepia(.3);will-change:transform,opacity}
.hero-phantom-left{mask-image:linear-gradient(90deg,transparent,#000 8%,#000 23%,transparent 37%);-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 23%,transparent 37%)}
.hero-phantom-right{mask-image:linear-gradient(90deg,transparent 63%,#000 77%,#000 92%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent 63%,#000 77%,#000 92%,transparent)}
.hero-phantom-flash{position:absolute;inset:0;pointer-events:none;z-index:2;opacity:0;background:radial-gradient(ellipse at 50% 51%,#fff7db99 0%,#ffd58b40 15%,transparent 49%)}
.hero-intro-running .hero-phantom-left{animation:hp-spirit-left 1.15s cubic-bezier(.18,.65,.25,1) both}
.hero-intro-running .hero-phantom-right{animation:hp-spirit-right 1.15s .32s cubic-bezier(.18,.65,.25,1) both}
.hero-intro-running .hero-phantom-trail{animation-delay:.09s;filter:brightness(1.35) sepia(.4)}
.hero-intro-running .hero-phantom-right.hero-phantom-trail{animation-delay:.41s}
.hero-intro-running .hero-brand-link{animation:hp-title-arrive .65s 1.08s ease-out both}
.hero-intro-running .hero-join-link{animation:hp-button-arrive .45s 1.35s ease-out both}
.hero-intro-running .hero-phantom-flash{animation:hp-spirit-flash .5s 1.68s ease-out both}
@keyframes hp-spirit-left{0%{opacity:0;transform:translateX(-18%)}22%{opacity:.38}65%{opacity:.23}88%{opacity:.16;transform:translateX(0)}100%{opacity:0;transform:translateX(0)}}
@keyframes hp-spirit-right{0%{opacity:0;transform:translateX(18%)}22%{opacity:.38}65%{opacity:.23}88%{opacity:.16;transform:translateX(0)}100%{opacity:0;transform:translateX(0)}}
@keyframes hp-title-arrive{0%{opacity:0;transform:translateY(7px) scale(.96)}100%{opacity:1;transform:translateY(0) scale(1)}}
@keyframes hp-button-arrive{0%{opacity:0;transform:translateY(4px)}100%{opacity:1;transform:translateY(0)}}
@keyframes hp-spirit-flash{0%,100%{opacity:0}18%{opacity:.7}45%{opacity:.2}}
@media(min-width:1921px),(-webkit-min-device-pixel-ratio:2) and (min-width:1000px){.hero-phantom{background-image:url("assets/hero-clean-3840-v6.webp")}}
@media(max-width:720px){.hero-phantom{inset:0}.hero-phantom-trail{display:none}.hero-intro-running .hero-phantom-flash{animation-name:hp-spirit-flash-mobile}@keyframes hp-spirit-flash-mobile{0%,100%{opacity:0}18%{opacity:.35}}}
@media(prefers-reduced-motion:reduce){.hero-phantom,.hero-phantom-flash{display:none}.hero-intro-running .hero-brand-link,.hero-intro-running .hero-join-link{animation:none}}
.hero-phantom-left{mask-image:linear-gradient(90deg,transparent,#000 8%,#000 23%,transparent 37%),linear-gradient(#000 55%,transparent 100%);-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 23%,transparent 37%),linear-gradient(#000 55%,transparent 100%);mask-composite:intersect;-webkit-mask-composite:source-in}
.hero-phantom-right{mask-image:linear-gradient(90deg,transparent 63%,#000 77%,#000 92%,transparent),linear-gradient(#000 55%,transparent 100%);-webkit-mask-image:linear-gradient(90deg,transparent 63%,#000 77%,#000 92%,transparent),linear-gradient(#000 55%,transparent 100%);mask-composite:intersect;-webkit-mask-composite:source-in}
