/* Cobblemon-inspired composition: fixed scene + separately moving atmosphere. */
.hero{isolation:isolate!important}
.hero__scene{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none;background:#060818}
.hero__scene-layer{position:absolute;inset:-7%;will-change:transform;transform:translate3d(0,0,0);transition:transform .18s cubic-bezier(.2,.8,.2,1)}
.hero__scene-layer--sky{inset:0;background:radial-gradient(ellipse at 78% 26%,rgba(104,78,220,.36),transparent 32%),radial-gradient(ellipse at 58% 78%,rgba(47,143,210,.20),transparent 30%),linear-gradient(135deg,#050817 0%,#0a1232 52%,#1a1040 100%);filter:saturate(1.05) contrast(1.04)}
.hero__scene-layer--nebula{background:radial-gradient(ellipse at 76% 30%,rgba(96,209,255,.28),transparent 28%),radial-gradient(ellipse at 72% 72%,rgba(172,93,255,.25),transparent 34%);mix-blend-mode:screen;opacity:.72;animation:nebulaDrift 18s ease-in-out infinite alternate}
.hero__scene-layer--clouds{inset:auto -12% -4%;height:44%;background:radial-gradient(ellipse at 16% 80%,rgba(210,224,255,.24),transparent 18%),radial-gradient(ellipse at 56% 92%,rgba(149,115,255,.30),transparent 27%),radial-gradient(ellipse at 92% 72%,rgba(81,222,255,.22),transparent 20%);filter:blur(17px);opacity:.72;animation:heroCloudDrift 20s ease-in-out infinite alternate}
.hero__scene-layer--glow{background:radial-gradient(circle at 74% 43%,rgba(214,154,255,.18),transparent 22%),radial-gradient(circle at 45% 28%,rgba(78,218,255,.10),transparent 28%);mix-blend-mode:screen;animation:heroGlow 9s ease-in-out infinite alternate}
.hero__scene-layer--stars{inset:0;opacity:.42;background-image:radial-gradient(circle,rgba(255,255,255,.86) 0 1px,transparent 1.6px),radial-gradient(circle,rgba(151,220,255,.66) 0 1px,transparent 1.5px);background-size:127px 127px,211px 211px;background-position:13px 7px,71px 38px;animation:heroStars 26s linear infinite}
.starfield{display:block!important;z-index:2!important;opacity:.8}
.hero__scene-layer--stars::before,.hero__scene-layer--stars::after{content:"";position:absolute;width:120px;height:2px;border-radius:999px;background:linear-gradient(90deg,transparent,rgba(143,229,255,.9),transparent);filter:blur(.3px);opacity:0;transform:rotate(-28deg);animation:shootingStar 9s ease-in-out infinite}
.hero__scene-layer--stars::before{left:58%;top:19%;animation-delay:1.6s}.hero__scene-layer--stars::after{left:78%;top:42%;animation-delay:5.2s;width:88px}
.hero__mew-cutout{position:absolute;z-index:3;right:2%;top:18%;width:min(34vw,480px);height:auto;max-height:62vh;object-fit:contain;filter:drop-shadow(0 28px 34px rgba(11,4,36,.5));animation:mewFloat 6s ease-in-out infinite;transform:translate3d(0,0,0);will-change:transform}
.hero__scene~.hero__video{display:none!important;z-index:1!important;opacity:0!important;pointer-events:none!important}
@keyframes heroCloudDrift{from{transform:translate3d(-2%,0,0) scale(1)}to{transform:translate3d(3%,-2%,0) scale(1.06)}}
@keyframes heroGlow{from{opacity:.42;transform:scale(1)}to{opacity:.8;transform:scale(1.08)}}
@keyframes heroStars{from{background-position:13px 7px,71px 38px}to{background-position:70px 53px,4px 90px}}
@keyframes shootingStar{0%,68%,100%{opacity:0;transform:translate3d(-80px,-36px,0) rotate(-28deg)}73%{opacity:.9}82%{opacity:0;transform:translate3d(180px,82px,0) rotate(-28deg)}}
@keyframes nebulaDrift{from{transform:scale(1) translate3d(-1%,0,0);filter:blur(0)}to{transform:scale(1.08) translate3d(2%,-1%,0);filter:blur(2px)}}
@keyframes mewFloat{0%,100%{transform:translate3d(0,0,0) rotate(-2deg) scale(1)}50%{transform:translate3d(0,-28px,0) rotate(2deg) scale(1.025)}}
.hero::after{
  content:"";position:absolute;inset:auto -12% 0;width:124%;height:44%;z-index:2;pointer-events:none;
  background:
    radial-gradient(ellipse at 16% 82%,rgba(84,228,255,.22) 0 4%,transparent 22%),
    radial-gradient(ellipse at 72% 72%,rgba(183,115,255,.20) 0 5%,transparent 25%),
    linear-gradient(0deg,rgba(4,6,22,.62),transparent 74%);
  filter:blur(1px);opacity:.9;animation:starlightMist 18s ease-in-out infinite alternate;
}
.hero__atmosphere{position:absolute;inset:0;z-index:2;overflow:hidden;pointer-events:none}
.hero__atmosphere::before,.hero__atmosphere::after{content:"";position:absolute;display:block;width:74vw;height:19vw;min-width:680px;min-height:175px;border-radius:50%;filter:blur(26px);opacity:.15}
.hero__atmosphere::before{left:-25vw;top:34%;background:linear-gradient(90deg,transparent,rgba(79,226,255,.58),transparent);animation:cloudPass 32s linear infinite}
.hero__atmosphere::after{right:-26vw;top:14%;background:linear-gradient(90deg,transparent,rgba(191,117,255,.52),transparent);animation:cloudPass 40s linear infinite reverse}
.nav,.hero__content{z-index:4!important}.scroll-cue{z-index:4!important}
@keyframes starlightMist{from{transform:translate3d(-1.4%,0,0) scale(1)}to{transform:translate3d(1.7%,-1%,0) scale(1.04)}}
@keyframes cloudPass{from{transform:translate3d(-7%,0,0)}to{transform:translate3d(18%,3%,0)}}
@media(max-width:840px){.hero::after{height:48%;opacity:.76}.hero__atmosphere::before,.hero__atmosphere::after{opacity:.1}}
@media(prefers-reduced-motion:reduce){.hero::after,.hero__atmosphere::before,.hero__atmosphere::after{animation:none!important}}
@media(max-width:840px){.hero__scene-layer--sky{background-position:62% center}.hero__scene-layer--clouds{height:34%;opacity:.55}.hero__scene-layer--nebula{opacity:.48}}
@media(max-width:840px){.hero__mew-cutout{right:-14%;top:31%;width:68vw;opacity:.8}.hero__content{position:relative;z-index:5}}
@media(prefers-reduced-motion:reduce){.hero__scene-layer{transition:none!important}.hero__scene-layer--clouds,.hero__scene-layer--glow,.hero__scene-layer--stars{animation:none!important}}
@media(prefers-reduced-motion:reduce){.hero__mew-cutout{animation:none!important}}