html{scroll-padding-top:0}
.film-section,.faq-section,.details{scroll-margin-top:96px}
/* Each scene stays in view while its full sequence follows the scroll. */
.scroll-scene-section{position:relative!important;height:var(--scene-length,300svh)!important;min-height:0!important;margin-top:0!important;margin-bottom:0!important;padding-top:0!important;padding-bottom:0!important;overflow:visible!important;scroll-margin-top:0!important}
.scroll-scene-pin{position:sticky;top:0;height:100svh;box-sizing:border-box;padding:100px 0 28px;--scene-padding-top:100px;--scene-padding-bottom:28px;background:#fff}
.scroll-scene-section *, .scroll-scene-section *::before, .scroll-scene-section *::after{animation-play-state:paused!important;animation-delay:calc(-1 * var(--scene-time,0s))!important;transition-duration:0s!important}
.css-device-stage *, .css-device-stage *::before, .css-device-stage *::after{animation-play-state:paused!important;animation-delay:calc(-1 * var(--scene-time,0s))!important;transition-duration:0s!important}
.stage-copy{transition:none!important}.voice-command{cursor:default}.voice-command:hover{transform:none;background:#f5f5f7}.voice-command .command-arrow{display:none}
.final-wave i,.scroll-line::after{animation:none!important}
.reduce-motion .scroll-scene-section{height:auto!important}
.reduce-motion .scroll-scene-pin{position:relative}
@media(max-width:760px){.scroll-scene-pin{padding-top:84px;padding-bottom:24px;--scene-padding-top:84px;--scene-padding-bottom:24px}}
@media(max-height:560px){.scroll-scene-pin{padding-top:74px;padding-bottom:16px;--scene-padding-top:74px;--scene-padding-bottom:16px}}

/* The notch and Safari opening are also driven by the same scroll playhead. */
.css-device-stage .css-notch{width:calc(148px + 282px * var(--notch-open,0))!important;height:calc(29px + 87px * var(--notch-open,0))!important}
.css-device-stage .css-notch-expanded{opacity:var(--notch-open,0)!important}
.css-device-stage .css-safari{opacity:var(--safari-open,0)!important;transform:translateY(calc(28px * (1 - var(--safari-open,0)))) scale(calc(.94 + .06 * var(--safari-open,0)))!important}

/* Chapter positions are interpolated from scroll; no timed CSS transitions. */
.stage-copy{opacity:var(--copy-opacity,0)!important;visibility:var(--copy-visibility,hidden)!important;transform:translateY(var(--copy-y,0px))!important}
.css-device-stage .css-ensemble{will-change:transform,left,top}
.css-device-stage .css-phone{left:var(--phone-x,790px)!important;top:var(--phone-y,125px)!important;width:var(--phone-width,191px)!important;transform:translateY(var(--pickup-y,0px)) translateZ(var(--phone-z,0px)) rotateY(var(--phone-yaw,-12deg)) rotateZ(calc(var(--phone-roll,6deg) + var(--pickup-r,0deg))) scale(var(--phone-scale,1))!important;will-change:transform}
.css-device-stage .css-laptop{transform:translateX(var(--laptop-x,0px)) translateZ(var(--laptop-z,0px)) rotateX(var(--rx)) rotateY(var(--ry)) rotateZ(var(--rz)) scale(var(--laptop-scale,1))!important;transform-origin:center center!important;will-change:transform}
.css-device-stage .css-products article:first-child{opacity:calc(.2 + .8 * var(--shop-first,0))!important;filter:blur(calc(1px * (1 - var(--shop-first,0))))!important;transform:translateY(calc(6px * (1 - var(--shop-first,0))))!important}
.css-device-stage .css-products article:nth-child(2){opacity:calc(.2 + .8 * var(--shop-second,0))!important;filter:blur(calc(1px * (1 - var(--shop-second,0))))!important;transform:translateY(calc(6px * (1 - var(--shop-second,0))))!important}
.css-device-stage .css-shop-conclusion{opacity:var(--shop-complete,0)!important;transform:translateY(calc(5px * (1 - var(--shop-complete,0))))!important}
