/* CSS 3D hardware. The supplied screenshot remains intact on both displays. */
.cinema-story{height:530vh;background:var(--cream);position:relative}
.cinema-story .story-sticky{--scene-bg:246,249,232;--scene-ink:0,73,63;--scene-accent:39,126,62;--scene-muted:77,112,95;position:sticky;top:0;height:100svh;min-height:690px;background:rgb(var(--scene-bg));color:rgb(var(--scene-ink));isolation:isolate;overflow:hidden;padding:40px max(5vw,24px) 25px}
.cinema-story .story-top{position:relative;z-index:5;border-color:rgba(var(--scene-ink),.15)}
.cinema-story .story-top .eyebrow,.cinema-story .story-count{color:rgb(var(--scene-muted))}
.cinema-story .story-count>span,.cinema-story .step-label,.cinema-story .step-text em{color:rgb(var(--scene-accent))}
.cinema-story .step-text p{color:rgb(var(--scene-muted))}
.cinema-story .story-progress button{border-color:rgba(var(--scene-ink),.3);color:rgb(var(--scene-muted));min-height:40px}
.cinema-story .story-progress button.active{border-color:rgb(var(--scene-accent));color:rgb(var(--scene-accent))}
.cinema-story .story-layout{max-width:1320px;grid-template-columns:1fr 1.05fr;gap:55px;position:relative;z-index:3;height:calc(100% - 75px)}
.cinema-story .story-copy{height:370px}
.cinema-story .step-text h2{font-size:clamp(43px,4.7vw,68px);letter-spacing:-.06em}
.cinema-story .step-text p{max-width:400px;font-size:14px;line-height:1.85}
.cinema-story .phone-stage{height:100%;perspective:1250px;transform-style:preserve-3d;position:relative}
.rig-entry{position:relative;transform-style:preserve-3d;transform:translate3d(calc((1 - var(--story-entry,1))*300px),calc((1 - var(--story-entry,1))*80px),0);will-change:transform}
.device3d{--device-width:292px;width:var(--device-width);height:calc((var(--device-width) - 16px)*1.87421384 + 40px);position:relative;transform-style:preserve-3d;will-change:transform;isolation:auto}
.story-device{transform:translate3d(var(--x,0px),var(--y,0px),var(--z,0px)) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) rotateZ(var(--rz,0deg)) scale(var(--zoom,1))}
.device3d-front,.device3d-back{position:absolute;inset:0;border-radius:43px;-webkit-backface-visibility:hidden;backface-visibility:hidden}
.device3d-front{transform:translateZ(9px);padding:8px;background:linear-gradient(110deg,#64746d 0%,#101e18 5%,#111c18 65%,#87948a 95%,#0b1711);box-shadow:inset 0 0 0 1px #8b998b,inset 0 0 0 3px #101d17;overflow:hidden}
.device3d-speaker{display:flex;align-items:center;justify-content:center;gap:7px;height:24px}
.device3d-speaker>span{width:42px;height:4px;border-radius:8px;background:#34453c;box-shadow:0 1px 0 #070e09}
.device3d-speaker>i{width:5px;height:5px;background:#273b3c;border:1px solid #4a5a52;border-radius:50%}
.device3d-glass{width:100%;overflow:hidden;border-radius:24px 24px 33px 33px;position:relative;background:#fff9f0}
.device3d-glass>img{display:block;width:100%;height:auto;margin:0;border:0;box-shadow:none;transform:none;max-width:none;opacity:1}
.screen-shade{position:absolute;inset:0;background:#08241b;opacity:calc(var(--explode,0)*.28);pointer-events:none}
.glass-shine{position:absolute;inset:0;border-radius:43px;pointer-events:none;opacity:.25;background:linear-gradient(112deg,transparent 15%,#ffffff33 30%,transparent 43%);transform:translateX(calc((var(--progress,0) - .5)*35%))}
.device3d-back{transform:rotateY(180deg) translateZ(9px);background:linear-gradient(125deg,#376d55,#0e372b 60%,#518069);border:1px solid #809a84;box-shadow:inset 0 0 0 3px #193c2d;overflow:hidden}
.device3d-back:after{content:'';position:absolute;inset:0;opacity:.2;background:radial-gradient(ellipse at 20% 20%,#d3f8c6,transparent 70%)}
.camera-bump{position:absolute;left:18px;top:20px;display:grid;grid-template-columns:28px 28px;gap:9px;padding:10px;border-radius:21px;background:#193d2a;box-shadow:0 2px 4px #07120b80,inset 0 0 0 1px #718d6e}
.camera-bump>i{width:28px;height:28px;border-radius:50%;background:radial-gradient(circle,#0f3438 0 17%,#061613 20% 47%,#789483 50% 56%,#0c2319 60% 75%,#435f4d 78%);box-shadow:0 1px 3px #07120b}
.camera-bump>b{width:12px;height:12px;border-radius:50%;background:#d5dec3;align-self:center;justify-self:center;box-shadow:inset 0 0 0 2px #9eaf91}
.back-brand{position:absolute;left:0;right:0;top:48%;text-align:center;font:36px Georgia,serif;color:#d5ecb8;letter-spacing:-1.7px}.back-brand>span{font-style:italic}.back-brand>small{display:block;letter-spacing:2px;font:6px Arial,sans-serif;margin-top:16px;color:#97b99b}
.device3d-edge{position:absolute;top:36px;bottom:36px;width:18px;background:linear-gradient(90deg,#17241d,#7c8c7c 45%,#2e4436 66%,#0c1711);transform-style:preserve-3d;backface-visibility:visible;border-radius:5px}
.edge-left{left:-9px;transform:rotateY(90deg)}.edge-right{right:-9px;transform:rotateY(90deg)}.edge-left:before,.edge-right:before{content:'';position:absolute;width:5px;left:7px;height:44px;top:87px;background:linear-gradient(90deg,#95a38f,#304834);border-radius:4px}.edge-left:after{content:'';position:absolute;width:5px;left:7px;height:29px;top:145px;background:#5f7660;border-radius:4px}
.device-ui-space{position:absolute;top:32px;left:8px;right:8px;aspect-ratio:954/1788;transform:translateZ(10px);transform-style:preserve-3d;pointer-events:none}
.ui-fragment{position:absolute;left:3.2495%;width:94.13%;overflow:hidden;border-radius:calc(var(--device-width)*.045);-webkit-backface-visibility:hidden;backface-visibility:hidden;opacity:var(--explode,0);box-shadow:0 10px 25px #001e2926}
.ui-fragment>img{position:absolute;display:block;width:106.236%;max-width:none;height:auto;left:-3.452%;border:0}
.fragment-store{top:21.924%;aspect-ratio:898/326;transform:translate3d(calc(var(--explode,0)*-62px),calc(var(--explode,0)*-20px),calc(var(--explode,0)*115px)) rotateY(calc(var(--explode,0)*12deg))}.fragment-store>img{top:-120.245%}
.fragment-product{top:67.058%;aspect-ratio:898/354;transform:translate3d(calc(var(--explode,0)*42px),calc(var(--explode,0)*-22px),calc(var(--explode,0)*180px)) rotateY(calc(var(--explode,0)*-7deg))}.fragment-product>img{top:-338.701%}
.fragment-nav{top:92.561%;left:0;width:100%;aspect-ratio:954/133;transform:translate3d(0,calc(var(--explode,0)*45px),calc(var(--explode,0)*90px));border-radius:calc(var(--device-width)*.04)}.fragment-nav>img{width:100%;left:0;top:-1244.36%}
.scene-callout{position:absolute;display:flex;flex-direction:column;font-size:9px;line-height:1.8;pointer-events:none;color:rgb(var(--scene-ink));opacity:var(--explode,0);transform:translateY(calc((1 - var(--explode,0))*18px));z-index:5}
.scene-callout>span{font-size:7px;letter-spacing:1px;color:rgb(var(--scene-accent));border-top:1px solid rgba(var(--scene-ink),.3);padding-top:7px;width:80px}.scene-callout>b{font-weight:500}.scene-callout>i{font-style:normal;color:rgb(var(--scene-muted));font-size:8px}.callout-one{left:-24px;top:20%}.callout-two{right:-20px;bottom:15%}
.scene-glow{position:absolute;left:39%;top:2%;width:70%;height:96%;border-radius:50%;background:radial-gradient(ellipse,#9bd36c28,transparent 66%);transform:translateX(calc((var(--progress,0) - .5)*90px)) scale(calc(.85 + var(--progress,0)*.4));pointer-events:none;z-index:-1}
.scene-floor{position:absolute;left:22%;right:-22%;height:650px;bottom:-365px;background-image:linear-gradient(rgba(var(--scene-ink),.08) 1px,transparent 1px),linear-gradient(90deg,rgba(var(--scene-ink),.08) 1px,transparent 1px);background-size:60px 60px;transform:perspective(550px) rotateX(65deg) rotateZ(calc((var(--progress,0) - .5)*10deg));mask-image:radial-gradient(ellipse,black,transparent 67%);pointer-events:none}
.scene-orb{position:absolute;border-radius:50%;border:1px solid rgba(var(--scene-ink),.12);width:580px;height:580px;left:48%;top:18%;transform:translate3d(calc((var(--progress,0) - .5)*80px),0,0) rotateX(55deg) rotateZ(calc(var(--progress,0)*150deg));pointer-events:none}.orb-two{width:670px;height:670px;left:42%;top:8%;transform:rotateY(50deg) rotateZ(calc(var(--progress,0)*-150deg))}
.device-shadow{position:absolute;width:280px;height:35px;border-radius:50%;bottom:12%;background:radial-gradient(ellipse,rgba(var(--scene-ink),.14),transparent 70%);filter:blur(6px);transform:scaleX(calc(.7 + var(--zoom,1)*.4))}
.cinema-story .floating-label{background:rgba(var(--scene-ink),.07);border:1px solid rgba(var(--scene-ink),.18);color:rgb(var(--scene-ink));right:0;bottom:7%;font-size:9px;transform:translate3d(0,calc((var(--progress,0) - .5)*-25px),0) rotate(calc(-5deg + var(--progress,0)*8deg));box-shadow:none}
.scene-bottom{position:absolute;bottom:22px;left:5%;right:5%;display:flex;align-items:center;justify-content:space-between}.scene-bottom .demo-caption{position:static;font-size:8px;color:rgb(var(--scene-muted))}.scroll-direction{font-size:7px;letter-spacing:1.5px;color:rgb(var(--scene-muted))}.scroll-direction>b{font-size:17px;display:inline-block;margin-left:20px;font-weight:400}
.launch-section .device-entry{width:314px;transform-style:preserve-3d;transform:translate3d(calc((1 - var(--enter,1))*130px),calc((1 - var(--enter,1))*75px),0)}.showcase-device{--device-width:314px;transform:rotateX(var(--final-rx,0deg)) rotateY(var(--final-ry,0deg)) rotateZ(-2deg)}.launch-section .preview-display{perspective:1200px;height:710px;overflow:visible}.launch-section .preview-ring{transform:rotateX(28deg) rotateZ(calc(var(--drift,.5)*40deg)) scale(calc(.8 + var(--enter,1)*.2));border:1px solid #b6d58a}.launch-section .tag1{left:12%;transform:translate3d(calc((1 - var(--enter,1))*-90px),calc((var(--drift,.5) - .5)*-50px),35px) rotate(-8deg)}.launch-section .tag2{right:10%}.app-preview{perspective:1500px}
.benefit-grid{perspective:1100px}.benefit-grid article{transform-style:preserve-3d;transform:translateY(calc((1 - var(--enter,1))*(80px + var(--order,0)*35px))) rotateX(calc((var(--drift,.5) - .5)*-9deg)) rotateY(calc(var(--mx,0)*8deg));transform-origin:center bottom}.benefit-grid article .benefit-icon{transform:translateZ(28px) rotateY(calc((var(--drift,.5) - .5)*30deg))}.play-grid{perspective:1100px}.play-section .receipt{transform:translate3d(calc((1 - var(--enter,1))*80px),calc((var(--drift,.5) - .5)*-35px),0) rotateX(calc((var(--drift,.5) - .5)*-14deg)) rotateY(calc(var(--mx,0)*9deg)) rotateZ(calc(9deg - var(--enter,1)*7deg));transform-style:preserve-3d}.receipt-total{transform:translateZ(14px)}
@media(max-width:1100px){.story-device{--device-width:265px}.cinema-story .story-layout{gap:30px}.scene-callout{font-size:8px}.callout-one{left:-5px}.callout-two{right:-5px}}
@media(max-width:900px){.story-device{--device-width:236px}.cinema-story .step-text h2{font-size:45px}.cinema-story .step-text p{font-size:12px}.cinema-story .story-layout{gap:20px}.callout-one{left:0;top:13%}.callout-two{right:0;bottom:13%}.scene-orb{left:40%}}
@media(max-width:600px){.cinema-story{height:485svh}.cinema-story .story-sticky{height:100svh;min-height:650px;padding:22px 22px 18px}.cinema-story .story-layout{display:flex;flex-direction:column;height:calc(100% - 43px);gap:0}.cinema-story .story-copy{height:218px;margin-top:24px;flex-shrink:0}.cinema-story .step-text h2{font-size:36px;line-height:1}.cinema-story .step-text p{font-size:10px;max-width:320px;line-height:1.7;margin-top:14px}.cinema-story .story-progress{bottom:0;right:0}.cinema-story .story-progress button{font-size:7px;padding:7px 9px 0;min-height:28px}.cinema-story .phone-stage{height:calc(100% - 245px);min-height:325px;margin:0;perspective:900px}.story-device{--device-width:190px}.device3d-front,.device3d-back{border-radius:31px}.device3d-glass{border-radius:16px 16px 24px 24px}.device3d-speaker>span{width:32px;height:3px}.glass-shine{border-radius:31px}.camera-bump{left:13px;top:16px;grid-template-columns:19px 19px;gap:6px;padding:8px;border-radius:15px}.camera-bump>i{width:19px;height:19px}.camera-bump>b{width:9px;height:9px}.back-brand{font-size:27px;letter-spacing:-1px}.back-brand>small{font-size:4px;letter-spacing:1px}.rig-entry{transform:translate3d(calc((1 - var(--story-entry,1))*130px),calc((1 - var(--story-entry,1))*40px),0)}.fragment-store{transform:translate3d(calc(var(--explode,0)*-20px),calc(var(--explode,0)*-12px),calc(var(--explode,0)*60px)) rotateY(calc(var(--explode,0)*10deg))}.fragment-product{transform:translate3d(calc(var(--explode,0)*14px),calc(var(--explode,0)*-14px),calc(var(--explode,0)*105px)) rotateY(calc(var(--explode,0)*-5deg))}.fragment-nav{transform:translate3d(0,calc(var(--explode,0)*25px),calc(var(--explode,0)*45px))}.scene-callout{font-size:7px}.scene-callout>span{width:48px;font-size:6px}.scene-callout>i{font-size:6px;max-width:65px}.callout-one{left:-3px;top:22%}.callout-two{right:-3px;bottom:12%}.device-shadow{width:185px;bottom:7%}.scene-glow{left:-10%;width:130%;top:25%;height:70%}.scene-floor{left:-50%;right:-50%;bottom:-380px;background-size:45px 45px}.scene-orb{left:50%;margin-left:-160px;top:50%;width:320px;height:320px}.orb-two{width:380px;height:380px;margin-left:-190px;top:44%}.cinema-story .floating-label{font-size:7px;bottom:3%;right:0;padding:8px 10px;max-width:158px}.scene-bottom{left:22px;right:22px;bottom:11px}.scene-bottom .demo-caption{font-size:6px}.scroll-direction{font-size:5px;letter-spacing:.8px}.scroll-direction>b{font-size:12px;margin-left:6px}.launch-section .preview-display{height:570px}.launch-section .device-entry{width:246px}.showcase-device{--device-width:246px}.showcase-device .device3d-front,.showcase-device .device3d-back{border-radius:36px}.showcase-device .device3d-glass{border-radius:20px 20px 28px 28px}.launch-section .tag1{left:-10px;top:100px;font-size:7px}.launch-section .tag2{right:-9px;top:420px;font-size:7px}.benefit-grid article{transform:translateY(calc((1 - var(--enter,1))*(40px + var(--order,0)*12px))) rotateX(calc((var(--drift,.5) - .5)*-7deg))}.play-section .receipt{transform:translateX(calc((1 - var(--enter,1))*22px)) rotateX(calc((var(--drift,.5) - .5)*-9deg)) rotateZ(calc(5deg - var(--enter,1)*4deg))}}
@media(max-width:600px) and (max-height:760px){.cinema-story .story-sticky{min-height:620px}.cinema-story .story-copy{height:183px;margin-top:18px}.cinema-story .step-text h2{font-size:31px}.cinema-story .step-text p{font-size:9px;max-width:310px}.cinema-story .phone-stage{height:calc(100% - 205px);min-height:305px}.story-device{--device-width:169px}.scene-callout{font-size:6px}.callout-two{bottom:14%}.cinema-story .floating-label{font-size:6px;bottom:1%}}
@media(prefers-reduced-motion:reduce){.cinema-story{height:auto}.cinema-story .story-sticky{position:relative;min-height:780px;height:auto;background:#00564b;color:var(--cream)}.cinema-story .story-layout{min-height:650px}.rig-entry,.story-device,.showcase-device,.device-entry{transform:none!important}.ui-fragment,.scene-callout,.scene-floor,.scene-orb,.screen-shade{display:none}.device3d-front{transform:translateZ(9px)!important}.device3d-back,.device3d-edge{display:none}.scene-glow{transform:none}.cinema-story .story-progress{top:auto;position:absolute;bottom:0}.cinema-story .story-copy{height:350px}.benefit-grid article,.benefit-grid article .benefit-icon,.play-section .receipt,.receipt-total{transform:none!important}.cinema-story .phone-stage{height:450px}.cinema-story .step-text p{color:#c1dac6}.cinema-story .step-text em,.cinema-story .step-label{color:#a9eb71}}