
/* Shared redesign component rules. */
.brand-scroll-scene {position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden;}
.brand-scroll-scene__light {position:absolute;inset:-25%;background:radial-gradient(ellipse at 95% 42%,#ff007f70,transparent 48%),radial-gradient(ellipse at 3% 80%,#ff007f28,transparent 40%);}
.brand-scroll-scene__far,.brand-scroll-scene__near,.brand-scroll-scene__focus {position:absolute;inset:-15%;width:130%;height:130%;object-fit:cover;}
.brand-scroll-scene__far {opacity:.48;}
.brand-scroll-scene__near {opacity:.2;transform:scale(1.3) rotate(16deg);}
.brand-scroll-scene__focus {opacity:.65;}
.brand-scroll-scene::after {content:"";position:absolute;inset:0;background:linear-gradient(90deg,#0b0b0c33,#0b0b0c88 42%,#0b0b0c66 70%,transparent);}
@keyframes studio-far {from{transform:translate(0,-3%)}to{transform:translate(-5%,5%)}}
@keyframes studio-near {from{transform:translate(4%,-8%) scale(1.3) rotate(16deg)}to{transform:translate(-5%,8%) scale(1.3) rotate(22deg)}}
@keyframes studio-focus {from{transform:translate(-3%,-6%) scale(.9)}to{transform:translate(3%,7%) scale(1.15)}}
@keyframes studio-light {0%{transform:translate(6%,-7%)}50%{transform:translate(-12%,3%)}100%{transform:translate(5%,12%)}}
@supports(animation-timeline:scroll()) {
@media(prefers-reduced-motion:no-preference) {
.brand-scroll-scene__far {animation:studio-far linear both;animation-timeline:scroll(root block);}
.brand-scroll-scene__near {animation:studio-near linear both;animation-timeline:scroll(root block);}
.brand-scroll-scene__focus {animation:studio-focus linear both;animation-timeline:scroll(root block);}
.brand-scroll-scene__light {animation:studio-light linear both;animation-timeline:scroll(root block);}
}
}
body[data-motion-paused="true"] main *,body[data-motion-paused="true"] main *::before,body[data-motion-paused="true"] main *::after {animation-play-state:paused!important;}
/* Motion off keeps the fixed brand gradient, without moving star planes. */
body[data-motion-paused="true"] :is(.brand-scroll-scene__far,.brand-scroll-scene__near,.brand-scroll-scene__focus) {display:none;}
body[data-motion-paused="true"] .brand-scroll-scene__light {animation:none;transform:none;}
body[data-motion-paused="true"] .brand-arrival {display:none;}
body[data-motion-paused="true"] .brand-circulation {animation:none;opacity:1;}
@media(prefers-reduced-motion:reduce) {
.brand-scroll-scene * {animation:none;transition:none;}
:is(.brand-scroll-scene__far,.brand-scroll-scene__near,.brand-scroll-scene__focus) {display:none;}
.brand-scroll-scene__light {transform:none;}
}

/* Phone rendering: a static brand gradient, independent of the logo animation. */
@media(max-width:767px) {
 .brand-scroll-scene picture {display:none;}
 .brand-scroll-scene * {animation:none;transition:none;transform:none;}
 .brand-scroll-scene__light {inset:0;}
}
