.background-shell { background: linear-gradient(160deg, #365b65, #19372c 55%, #0e1c17); inset: 0; position: fixed; z-index: 0; }
.motion-scene { height: 100svh; isolation: isolate; overflow: hidden; position: relative; }
.scene__media, .scene__layer { inset: 0; overflow: hidden; pointer-events: none; position: absolute; }
.scene__media { height: 100%; object-fit: cover; width: 100%; }
.scene__strip { background-position: left center; background-repeat: no-repeat; background-size: 100% 100%; height: 100%; left: 0; position: absolute; top: 0; transform: translate3d(0,0,0); width: 300%; }
.scene__far { z-index: 0; } .scene__mid { z-index: 1; } .scene__near { z-index: 2; } .scene__foreground { z-index: 3; }
.scene__far .scene__strip { animation: drift-feather var(--duration-far,1080s) linear infinite; width: 100vw; }
.scene__mid .scene__strip { animation: drift var(--duration-mid,480s) linear infinite; background-image: var(--layer-mid); }
.scene__near .scene__strip { animation: drift var(--duration-near,312s) linear infinite; background-image: var(--layer-near); }
.scene__foreground .scene__strip { animation: drift var(--duration-foreground,192s) linear infinite; background-image: var(--layer-foreground); }
.scene__strip--feather i { background-image: var(--layer-far); background-position: center; background-repeat: no-repeat; background-size: 100% 100%; height: 100%; left: -110vw; mask-image: linear-gradient(to right,transparent,#000 8.333%,#000 91.667%,transparent); -webkit-mask-image: linear-gradient(to right,transparent,#000 8.333%,#000 91.667%,transparent); position: absolute; top: 0; width: 120vw; }
.scene__strip--feather i:nth-child(2){left:-10vw}.scene__strip--feather i:nth-child(3){left:90vw}.scene__strip--feather i:nth-child(4){left:190vw}.scene__strip--feather i:nth-child(5){left:290vw}.scene__strip--feather i:nth-child(6){left:390vw}
.motion-scene[data-layer-render="repeat"] .scene__strip { background-repeat: repeat-x; background-size: auto 100%; }
.motion-scene[data-layer-render="repeat"] .scene__far .scene__strip, .motion-scene[data-layer-render="panorama"] .scene__far .scene__strip { animation: drift var(--duration-far,1080s) linear infinite; background-image: var(--layer-far); width: 300%; }
.motion-scene[data-layer-render="repeat"] .scene__strip--feather i, .motion-scene[data-layer-render="panorama"] .scene__strip--feather i { display: none; }
.motion-scene[data-layer-render="panorama"] .scene__strip { background-repeat: no-repeat; background-size: 100% 100%; }
.environment-mask { background: radial-gradient(ellipse at 50% 44%, rgba(5,14,12,.06) 0 24%, rgba(5,12,11,.58) 78%), linear-gradient(to bottom,rgba(4,12,10,.76),rgba(5,12,11,.15) 27%,rgba(5,12,11,.25) 62%,rgba(5,11,10,.9)); inset: 0; position: absolute; z-index: 5; }
@keyframes drift { to { transform: translate3d(-66.666667%,0,0); } }
@keyframes drift-feather { to { transform: translate3d(-300vw,0,0); } }
@media (prefers-reduced-motion: reduce) { .scene__strip { animation: none !important; transform: none !important; } }