/* Sky and terrain masks share the original hero's cover projection. The hero itself never moves. */
.hero-atmosphere,.hero-foreground{position:absolute;inset:0;pointer-events:none;mask-size:cover;mask-position:center 35%;mask-repeat:no-repeat;-webkit-mask-size:cover;-webkit-mask-position:center 35%;-webkit-mask-repeat:no-repeat}
.hero-atmosphere{z-index:-3;overflow:hidden;mask-image:url('/assets/westria-sky-mask.svg');-webkit-mask-image:url('/assets/westria-sky-mask.svg')}
.hero-foreground{z-index:-2;background:inherit;mask-image:url('/assets/westria-foreground-mask.svg');-webkit-mask-image:url('/assets/westria-foreground-mask.svg')}
.sky-layer{position:absolute;background-size:100% 100%;background-repeat:no-repeat;transform-origin:center;will-change:transform;animation-timing-function:cubic-bezier(.37,0,.63,1);animation-iteration-count:infinite;animation-direction:alternate}
.sky-clouds{background-image:url('/assets/westria-sky-clouds.webp');background-size:cover;filter:sepia(.55) saturate(2) hue-rotate(75deg) contrast(1.1)}
.sky-clouds-far{--travel:clamp(100px,12vw,180px);inset:-65% -40% -5%;opacity:.55;animation-name:sky-cloud-far;animation-duration:32s;animation-delay:-8s}
.sky-clouds-near{--travel:clamp(160px,18vw,260px);inset:-55% -55% -10%;opacity:.65;animation-name:sky-cloud-near;animation-duration:24s;animation-delay:-6s}
.sky-aurora{--travel:clamp(60px,9vw,130px);inset:-30% -35% -10%;opacity:.65;background-image:url('/assets/westria-sky-aurora.webp');mix-blend-mode:screen;animation-name:sky-aurora;animation-duration:20s;animation-delay:-5s}
.hero-atmosphere[data-active=false] .sky-layer{animation-play-state:paused;will-change:auto}
@keyframes sky-cloud-far{from{transform:translate3d(calc(-1 * var(--travel)),-2%,0) scale(1.04)}to{transform:translate3d(var(--travel),2%,0) scale(1.08)}}
@keyframes sky-cloud-near{from{transform:translate3d(var(--travel),3%,0) scale(1.08)}to{transform:translate3d(calc(-1 * var(--travel)),-3%,0) scale(1.04)}}
@keyframes sky-aurora{0%{transform:translate3d(calc(-1 * var(--travel)),-4%,0) rotate(-2deg) skewX(-7deg) scale(1.06)}50%{transform:translate3d(0,2%,0) rotate(.5deg) skewX(1deg) scale(1.12)}100%{transform:translate3d(var(--travel),-2%,0) rotate(2deg) skewX(7deg) scale(1.08)}}
@media(max-width:520px){.hero-atmosphere,.hero-foreground{mask-position:64% center;-webkit-mask-position:64% center}.sky-clouds-far{opacity:.58}.sky-clouds-near{opacity:.7}.sky-aurora{opacity:.62}}
@media(prefers-reduced-motion:reduce){.hero-atmosphere,.hero-foreground{display:none}.sky-layer{animation:none!important;will-change:auto}}
@supports not (mask-image:url('')){.hero-atmosphere,.hero-foreground{display:none}}
