@font-face{font-family:Poppins;src:url(/fonts/Poppins-Regular.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:Poppins;src:url(/fonts/Poppins-Medium.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:Poppins;src:url(/fonts/Poppins-SemiBold.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:Poppins;src:url(/fonts/Poppins-Bold.woff2) format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:Poppins;src:url(/fonts/Poppins-ExtraBold.woff2) format("woff2");font-weight:800;font-display:swap}

:root{--navy:#14213D;--navy2:#1d2f57;--ink:#1B2B48;--amber:#FFB703;--orange:#FB8500;--red:#E63946;--green:#2A9D8F;--blue:#3A86FF;--cream:#FFF4DC;--grey:#F4F6F9;--muted:#6B778C}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;font-family:Poppins,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:var(--ink);background:#fff;font-size:17px;line-height:1.65;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
b,strong{color:var(--navy)}
a{color:var(--orange)}
h1,h2,h3,h4{color:var(--navy);margin:0;line-height:1.2}
h2{font-size:clamp(26px,6.4vw,40px);font-weight:800;margin-bottom:22px;letter-spacing:-.01em}
h2 em{font-style:normal;background:linear-gradient(transparent 62%,rgba(255,183,3,.6) 62%) no-repeat 0 0/0% 100%;transition:background-size .9s .35s cubic-bezier(.2,.8,.2,1)}
h2.in em{background-size:100% 100%}
h4{font-size:17px}
p{margin:0 0 16px}
.w{max-width:1040px;margin:0 auto;padding:0 20px}
.narrow{max-width:720px}
section{padding:72px 0}
.center{text-align:center}
.small{font-size:14px}
.muted{color:var(--muted)}
.cream{background:var(--cream)}
.grey{background:var(--grey)}
.navy{background:var(--navy);color:#DCE3EE}
.navy h2,.navy h4,.navy b{color:#fff}
.kick{display:inline-block;font-size:12.5px;font-weight:700;letter-spacing:.2em;color:var(--orange);margin-bottom:10px;text-transform:uppercase}
.kick.amber{color:var(--amber)}

/* reveal */
.rv{opacity:0;transform:translateY(28px);transition:opacity .7s var(--d,0s) cubic-bezier(.2,.8,.2,1),transform .7s var(--d,0s) cubic-bezier(.2,.8,.2,1)}
.rv.in{opacity:1;transform:none}

/* top bar */
.bar{background:var(--amber);color:var(--navy);font-weight:600;font-size:14px;overflow:hidden;white-space:nowrap;padding:9px 0}
.bar-track{display:inline-flex;gap:48px;animation:marq 28s linear infinite;padding-left:24px}
.bar-track span:before{content:"●";margin-right:12px;font-size:8px;vertical-align:middle;opacity:.5}
.bar s{opacity:.6}

/* buttons */
.btn{position:relative;overflow:hidden;display:block;max-width:480px;margin:26px auto 0;background:var(--amber);color:var(--navy)!important;text-decoration:none;text-align:center;font-weight:800;font-size:19px;padding:17px 22px;border-radius:16px;box-shadow:0 6px 0 #c98a00,0 14px 30px rgba(251,133,0,.28);transition:transform .15s,box-shadow .15s}
.btn small{display:block;font-weight:500;font-size:13.5px;opacity:.85;margin-top:2px}
.btn:hover{transform:translateY(-2px);box-shadow:0 8px 0 #c98a00,0 18px 34px rgba(251,133,0,.35)}
.btn:active{transform:translateY(4px);box-shadow:0 2px 0 #c98a00}
.btn:after{content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.65),transparent);transform:skewX(-20deg);animation:shine 3.2s 1.5s infinite}
.btn.rv.in{animation:pulse 2.6s 2s infinite}

/* hero */
.hero{position:relative;background:radial-gradient(120% 90% at 70% 10%,#26407a 0,var(--navy) 60%);color:#fff;overflow:hidden;padding:48px 0 150px}
.glow{position:absolute;right:-10%;top:5%;width:620px;height:620px;border-radius:50%;background:radial-gradient(circle,rgba(251,133,0,.45),rgba(255,183,3,.1) 45%,transparent 70%);filter:blur(10px);animation:breathe 6s ease-in-out infinite}
.hero-grid{position:relative;display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center}
.pre{color:var(--amber);font-weight:700;letter-spacing:.22em;font-size:12.5px}
.hero h1{font-size:clamp(44px,9vw,84px);font-weight:800;line-height:.98;margin:16px 0 18px;letter-spacing:-.02em}
.hero h1 span{display:block;opacity:0;transform:translateY(40px) scale(.96)}
.hero h1 .l1{color:var(--amber);animation:rise .8s .1s cubic-bezier(.2,.8,.2,1) forwards,shake .5s 1.3s}
.hero h1 .l2{color:#fff;animation:rise .8s .3s cubic-bezier(.2,.8,.2,1) forwards}
.sub{font-size:clamp(17px,2.4vw,21px);color:#DCE3EE;font-weight:300;max-width:520px}
.sub b{color:#fff;font-weight:600}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0 0}
.chips span{border:1.5px solid rgba(255,183,3,.65);color:var(--amber);border-radius:30px;padding:5px 14px;font-size:13.5px;font-weight:600}
.hero .btn{margin-left:0}
.note{font-size:13.5px;color:#9FB0C8;margin-top:14px}
.hero-book{perspective:1400px;display:flex;flex-direction:column;align-items:center}
.book{position:relative;width:min(330px,70vw);aspect-ratio:620/877;transform-style:preserve-3d;transform:rotateY(-22deg) rotateX(6deg);animation:bookIn 1.2s .2s cubic-bezier(.2,.8,.2,1) backwards,float 6s 1.4s ease-in-out infinite;transition:transform .3s}
.book img{width:100%;height:100%;border-radius:3px 8px 8px 3px;box-shadow:0 30px 60px rgba(0,0,0,.45);position:relative;z-index:2}
.book .spine{position:absolute;left:0;top:0;width:34px;height:100%;background:linear-gradient(90deg,#070d1a,#1b2b48);transform-origin:left;transform:rotateY(90deg);z-index:1}
.book .pages{position:absolute;right:0;top:4px;width:30px;height:calc(100% - 8px);background:repeating-linear-gradient(90deg,#fff 0 2px,#e7e9ee 2px 3px);transform-origin:right;transform:rotateY(-90deg) translateX(15px);z-index:1}
.book .shine{position:absolute;inset:0;z-index:3;border-radius:3px 8px 8px 3px;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.22) 45%,transparent 60%);background-size:250% 100%;animation:gloss 5s 2s ease-in-out infinite;pointer-events:none}
.book:before{content:"";position:absolute;left:0;top:0;bottom:0;width:10px;z-index:4;background:linear-gradient(90deg,rgba(0,0,0,.35),rgba(255,255,255,.12),transparent)}
.book-shadow{width:60%;height:18px;border-radius:50%;background:rgba(0,0,0,.45);filter:blur(10px);margin-top:26px;animation:shadow 6s 1.4s ease-in-out infinite}

/* road animation */
.road{position:absolute;left:0;right:0;bottom:0;height:96px;background:#3D4760;border-top:4px solid #E9EDF2;overflow:hidden}
.dash{position:absolute;left:0;top:56px;width:200%;height:6px;background:repeating-linear-gradient(90deg,var(--amber) 0 44px,transparent 44px 92px);animation:road 1.6s linear infinite}
.car{position:absolute;bottom:22px;width:150px;height:auto}
.car-r{left:calc(50% + 10px);animation:jolt 5s infinite}
.car-b{left:-170px;animation:drive 5s infinite}
.boom{position:absolute;bottom:40px;left:calc(50% - 22px);width:64px;opacity:0;animation:boom 5s infinite}

/* story */
.story h2{max-width:780px}
.pic{margin:0 0 30px;border-radius:22px;overflow:hidden;box-shadow:0 22px 50px rgba(20,33,61,.18)}
.pic img{width:100%;transform:scale(1.08);transition:transform 6s ease-out}
.pic.in img{transform:scale(1)}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.stat{background:var(--navy);color:#fff;border-radius:18px;padding:20px 16px;text-align:center}
.stat b{color:var(--amber);font-size:clamp(30px,6vw,46px);font-weight:800;line-height:1}
.stat>span{color:var(--amber);font-weight:700;font-size:18px;margin-left:2px}
.stat p{margin:8px 0 0;font-size:13.5px;color:#C9D3E3;line-height:1.35}

/* questions */
.qs{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:24px}
.q{background:#fff;border-radius:16px;padding:16px 18px 16px 58px;position:relative;box-shadow:0 2px 0 #eadfc3;font-size:16px;line-height:1.45;transition:transform .25s,box-shadow .25s}
.q:hover{transform:translateY(-3px) rotate(-.4deg);box-shadow:0 10px 24px rgba(20,33,61,.1)}
.q:before{content:"?";position:absolute;left:16px;top:15px;width:28px;height:28px;border-radius:50%;background:var(--red);color:#fff;font-weight:800;text-align:center;line-height:28px}
.q.in:before{animation:pop .5s var(--d,0s) both}

/* mistakes */
.mist{display:grid;grid-template-columns:1fr;gap:12px}
.m{display:flex;gap:16px;align-items:center;background:#fff;border:1.5px solid #F3C9CC;border-radius:18px;padding:12px 18px 12px 12px;position:relative;transition:transform .25s,border-color .25s}
.m:hover{transform:translateX(6px);border-color:var(--red)}
.m img{width:78px;height:78px;flex:none;border-radius:14px;mix-blend-mode:multiply}
.m:after{content:"✕";position:absolute;left:66px;top:8px;width:24px;height:24px;border-radius:50%;background:var(--red);color:#fff;font-size:12px;font-weight:800;display:flex;align-items:center;justify-content:center;transform:scale(0)}
.m.in:after{animation:pop .45s .45s forwards}
.m h4{margin-bottom:2px}
.m p{margin:0;font-size:15px;color:#4a5670;line-height:1.45}

.esc-box{margin-top:44px;background:var(--grey);border-radius:24px;padding:26px 22px}
.esc-head{display:flex;flex-direction:column;align-items:flex-start;gap:8px;margin-bottom:10px}
.esc-head h3{font-size:20px}
.tag-ill{background:#E3E8EF;color:var(--muted);font-size:11.5px;font-weight:700;letter-spacing:.12em;padding:3px 10px;border-radius:20px;text-transform:uppercase}
.esc{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;height:210px;align-items:end;margin-top:16px}
.col{height:100%;display:flex;flex-direction:column;justify-content:flex-end;text-align:center}
.bar-g{height:0;background:var(--c);border-radius:12px 12px 4px 4px;transition:height 1s cubic-bezier(.2,.8,.2,1);margin-bottom:8px}
.col:nth-child(2) .bar-g{transition-delay:.35s}.col:nth-child(3) .bar-g{transition-delay:.7s}.col:nth-child(4) .bar-g{transition-delay:1.05s}
.esc.in .bar-g{height:calc((100% - 56px) * var(--f))}
.col b{font-size:13px}.col span{font-size:12px;color:var(--muted);line-height:1.3;min-height:31px}
.esc-total{text-align:center;font-size:clamp(40px,10vw,64px);font-weight:800;color:var(--red);margin-top:12px;line-height:1}

/* solution */
.lead{font-size:19px;font-weight:500;color:var(--navy);border-left:5px solid var(--amber);padding-left:16px;max-width:720px}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:26px 0 34px}
.steps span{background:#fff;border-radius:16px;padding:16px;font-weight:600;color:var(--navy);font-size:15px;line-height:1.4;border:1.5px solid #E3E8EF}
.steps small{font-weight:400;color:var(--muted)}
.steps i{display:flex;width:30px;height:30px;border-radius:50%;background:var(--green);color:#fff;font-style:normal;align-items:center;justify-content:center;font-weight:800;margin-bottom:10px}
.parts{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.part{display:flex;gap:14px;align-items:center;background:#fff;border-radius:20px;padding:14px;border:1.5px solid #E3E8EF;transition:transform .3s,box-shadow .3s}
.part:hover{transform:translateY(-4px);box-shadow:0 14px 30px rgba(20,33,61,.1)}
.part img{width:96px;height:96px;flex:none;mix-blend-mode:multiply;transition:transform .4s}
.part:hover img{transform:rotate(-6deg) scale(1.08)}
.part em{font-style:normal;display:inline-block;background:var(--navy);color:var(--amber);font-weight:800;font-size:13px;border-radius:8px;padding:1px 9px;margin-bottom:4px}
.part h4{margin-bottom:3px}
.part p{margin:0;font-size:14.5px;color:#4a5670;line-height:1.45}

/* phone frame + app snapshots */
.phone{background:#0b1426;border-radius:30px;padding:7px;box-shadow:0 24px 50px rgba(20,33,61,.28),inset 0 0 0 2px #2a3a5e}
.phone img{width:100%;border-radius:24px}
.hero-book{position:relative}
.hero-phone{position:absolute;z-index:5;width:128px;right:calc(50% - 215px);bottom:10px;border-radius:22px;padding:5px;animation:phoneIn 1s .9s cubic-bezier(.2,.8,.2,1) backwards,float 6s 2s ease-in-out infinite reverse}
.hero-phone img{border-radius:18px}
.app-sec{overflow:hidden}
.shots{display:flex;gap:22px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:14px max(20px,calc(50% - 500px)) 26px;-webkit-overflow-scrolling:touch}
.shots::-webkit-scrollbar{display:none}
.shot{flex:0 0 240px;margin:0;scroll-snap-align:center;text-align:center;opacity:0;transform:translateY(40px) rotate(-2deg);transition:opacity .7s,transform .7s cubic-bezier(.2,.8,.2,1)}
.shots.in .shot{opacity:1;transform:none}
.shots.in .shot:nth-child(2){transition-delay:.1s}.shots.in .shot:nth-child(3){transition-delay:.2s}.shots.in .shot:nth-child(4){transition-delay:.3s}.shots.in .shot:nth-child(5){transition-delay:.4s}.shots.in .shot:nth-child(6){transition-delay:.5s}
.shot .phone{transition:transform .4s,box-shadow .4s}
.shot.on .phone,.shot:hover .phone{transform:translateY(-8px);box-shadow:0 32px 60px rgba(20,33,61,.32),inset 0 0 0 2px var(--amber)}
.shot figcaption{margin-top:16px;font-size:14px;line-height:1.45;color:#4a5670}
.shot figcaption b{display:block;font-size:15.5px;margin-bottom:2px}
.dots{display:flex;justify-content:center;gap:8px;margin-bottom:26px}
.dots button{width:9px;height:9px;border-radius:9px;border:0;padding:0;background:#D5DBE5;cursor:pointer;transition:width .3s,background .3s}
.dots button.on{width:26px;background:var(--amber)}
.perks{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.perks span{background:var(--grey);border:1.5px solid #E3E8EF;border-radius:30px;padding:8px 16px;font-size:14px;font-weight:600;color:var(--navy)}
@keyframes phoneIn{from{opacity:0;transform:translate(60px,30px) rotate(12deg)}}

/* cases marquee */
.cases-sec{overflow:hidden}
.big{color:var(--amber);font-size:1.5em}
.marq{display:flex;flex-direction:column;gap:12px;margin-top:10px;-webkit-mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.row{overflow:hidden}
.track{display:inline-flex;gap:12px;white-space:nowrap;animation:marq 60s linear infinite;will-change:transform}
.row.rev .track{animation-direction:reverse;animation-duration:70s}
.row:hover .track{animation-play-state:paused}
.track span{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);border-radius:40px;padding:10px 18px;font-size:15px;color:#E6ECF5}
.track b{color:var(--amber);margin-right:10px}

/* tips */
.tips{display:grid;gap:12px;margin-bottom:20px}
.tip{background:#fff;border-radius:18px;border-top:5px solid var(--green);overflow:hidden}
.tip summary{list-style:none;cursor:pointer;padding:18px 48px 18px 18px;font-weight:700;color:var(--navy);position:relative;display:flex;gap:12px;align-items:center}
.tip summary::-webkit-details-marker{display:none}
.tip summary span{font-size:24px}
.tip summary:after{content:"+";position:absolute;right:20px;font-size:26px;color:var(--green);transition:transform .3s}
.tip[open] summary:after{transform:rotate(45deg)}
.tip p,.tip ol{margin:0;padding:0 20px 18px 56px}
.tip ol{padding-left:74px}.tip li{margin-bottom:4px}
.tip[open] p,.tip[open] ol{animation:fadeDown .4s}

/* bonus */
.bonus{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:10px}
.bonus div{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:16px;padding:16px;font-size:22px;transition:background .3s,transform .3s}
.bonus div:hover{background:rgba(255,183,3,.12);transform:translateY(-3px)}
.bonus b{display:block;font-size:15.5px;margin-top:6px}
.bonus span{display:block;font-size:13.5px;color:#AFBDD2}
.navy .pic{box-shadow:0 22px 50px rgba(0,0,0,.35)}

/* who */
.two{display:grid;grid-template-columns:1.3fr 1fr;gap:14px}
.for{border-radius:20px;padding:20px;border:1.5px solid}
.for.yes{border-color:#BFE3DD;background:#F1FAF8}.for.yes h4{color:var(--green)}
.for.no{border-color:#F3C9CC;background:#FDF3F4}.for.no h4{color:var(--red)}
.for h4{margin-bottom:10px}
.for ul{margin:0;padding-left:20px;font-size:15.5px}.for li{margin-bottom:6px}

/* price */
.cost{background:#fff;border-radius:18px;overflow:hidden;margin-bottom:30px}
.cost div{display:flex;justify-content:space-between;gap:16px;padding:13px 16px;border-bottom:1px solid #EEF1F5;font-size:15px}
.cost b{color:var(--red);text-align:right;white-space:nowrap}
.price{position:relative;background:#fff;border:3px solid var(--amber);border-radius:26px;padding:30px 22px;text-align:center;box-shadow:0 24px 50px rgba(20,33,61,.14)}
.price:before{content:"";position:absolute;inset:-3px;border-radius:26px;padding:3px;background:conic-gradient(from var(--a,0deg),var(--amber),var(--orange),var(--red),var(--amber));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:spin 5s linear infinite}
.ptag{display:table;margin-left:auto;margin-right:auto;background:var(--red);color:#fff;font-weight:700;font-size:13px;border-radius:30px;padding:5px 14px;margin-bottom:10px}
.old{position:relative;display:inline-block;font-size:24px;color:#8A94A6;font-weight:600}
.old i{position:absolute;left:-4px;right:-4px;top:52%;height:3px;background:var(--red);transform:scaleX(0);transform-origin:left;transition:transform .6s .4s}
.price.in .old i{transform:scaleX(1) rotate(-8deg)}
.new{font-size:76px;font-weight:800;color:var(--navy);line-height:1;transform:scale(.6);opacity:0;transition:all .6s 1s cubic-bezier(.3,1.6,.5,1)}
.price.in .new{transform:none;opacity:1}
.new sup{font-size:28px;vertical-align:36px;margin-right:2px}
.price ul{list-style:none;padding:0;margin:18px 0 0;text-align:left}
.price li{padding:8px 0 8px 32px;position:relative;border-bottom:1px dashed #E3E8EF;font-size:15.5px}
.price li:before{content:"✓";position:absolute;left:2px;top:9px;color:#fff;background:var(--green);width:21px;height:21px;border-radius:50%;font-size:12px;text-align:center;line-height:21px;font-weight:800}

/* order */
.order{background:linear-gradient(180deg,var(--navy) 0,var(--navy) 260px,var(--grey) 260px)}
.order h2,.order .kick{color:#fff}.order .kick{color:var(--amber)}
.order>.w>p.muted.rv{color:#AFBDD2}
.frame{position:relative;background:#fff;border-radius:22px;overflow:hidden;box-shadow:0 24px 50px rgba(20,33,61,.18);min-height:960px;margin:18px 0 14px}
.frame iframe{position:relative;z-index:1;width:100%;height:960px;border:0;display:block;background:transparent}
.frame-load{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;color:var(--muted);font-size:14px}
.frame-load i{width:36px;height:36px;border:4px solid #E3E8EF;border-top-color:var(--amber);border-radius:50%;animation:spin2 .8s linear infinite}

/* faq */
.faq{background:#fff;border-radius:16px;margin-bottom:10px;border:1.5px solid #E3E8EF;transition:border-color .2s}
.faq[open]{border-color:var(--amber)}
.faq summary{cursor:pointer;font-weight:700;color:var(--navy);padding:16px 48px 16px 18px;list-style:none;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary:after{content:"+";position:absolute;right:18px;top:11px;font-size:26px;color:var(--orange);transition:transform .3s}
.faq[open] summary:after{transform:rotate(45deg)}
.faq p{padding:0 18px 16px;margin:0;font-size:15.5px;animation:fadeDown .35s}

/* final */
.final .pic{margin-bottom:34px}
.lead-c{font-size:19px}
.ps{text-align:left;margin-top:34px;background:#fff;border-left:5px solid var(--amber);border-radius:0 16px 16px 0;padding:18px;font-size:15.5px}
.disc{font-size:12.5px;color:#8A94A6;text-align:center;padding:26px 20px 110px;background:var(--grey)}

/* sticky CTA */
.sticky{position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));z-index:50;display:flex;justify-content:space-between;align-items:center;gap:10px;max-width:520px;margin:0 auto;background:var(--amber);color:var(--navy);text-decoration:none;font-weight:800;padding:13px 18px;border-radius:16px;box-shadow:0 12px 30px rgba(0,0,0,.3);transform:translateY(150%);transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.sticky.show{transform:none}
.sticky span{font-size:15px}.sticky s{opacity:.55;font-weight:600;font-size:13px}.sticky b{font-size:18px}

/* keyframes */
@keyframes marq{to{transform:translateX(-50%)}}
@keyframes shine{0%{left:-60%}35%,100%{left:130%}}
@keyframes pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.025)}}
@keyframes rise{to{opacity:1;transform:none}}
@keyframes shake{0%,100%{translate:0}20%{translate:-6px}40%{translate:6px}60%{translate:-4px}80%{translate:3px}}
@keyframes breathe{0%,100%{opacity:.75;transform:scale(1)}50%{opacity:1;transform:scale(1.08)}}
@keyframes bookIn{from{opacity:0;transform:rotateY(-60deg) rotateX(10deg) translateY(40px)}}
@keyframes float{0%,100%{translate:0 0}50%{translate:0 -14px}}
@keyframes shadow{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(.85);opacity:.6}}
@keyframes gloss{0%,60%,100%{background-position:150% 0}30%{background-position:-50% 0}}
@keyframes road{to{transform:translateX(-92px)}}
@keyframes drive{0%{left:-170px}38%{left:calc(50% - 150px)}40%{left:calc(50% - 158px)}75%{left:calc(50% - 158px);opacity:1}88%{opacity:0}100%{left:calc(50% - 158px);opacity:0}}
@keyframes jolt{0%,38%{transform:none}40%{transform:translateX(10px) rotate(2deg)}44%{transform:translateX(8px)}75%{opacity:1}88%,100%{opacity:0;transform:translateX(8px)}}
@keyframes boom{0%,37%{opacity:0;transform:scale(.2)}40%{opacity:1;transform:scale(1.2) rotate(10deg)}50%{opacity:1;transform:scale(1)}60%,100%{opacity:0;transform:scale(.8)}}
@keyframes pop{0%{transform:scale(0)}70%{transform:scale(1.25)}100%{transform:scale(1)}}
@keyframes fadeDown{from{opacity:0;transform:translateY(-6px)}}
@property --a{syntax:"<angle>";inherits:false;initial-value:0deg}
@keyframes spin{to{--a:360deg}}
@keyframes spin2{to{transform:rotate(360deg)}}

@media (max-width:820px){
  .hero{padding:32px 0 130px;text-align:center}
  .hero-grid{grid-template-columns:1fr;gap:10px}
  .hero-book{order:-1}
  .book{width:min(180px,46vw)}
  .book-shadow{margin-top:12px;height:12px}
  .sub{margin:0 auto 18px}.chips{justify-content:center}.hero .btn{margin:22px auto 0}
  .glow{right:-40%;top:-5%;width:480px;height:480px}
  .car{width:118px}
  .hero-phone{width:78px;right:calc(50% - 128px);bottom:14px;border-radius:16px;padding:4px}
  .hero-phone img{border-radius:12px}
  .shot{flex-basis:62vw}
  .qs,.parts,.two{grid-template-columns:1fr}
  .bonus{grid-template-columns:1fr 1fr}
}
@media (max-width:560px){
  body{font-size:16px}
  section{padding:54px 0}
  .stats{gap:8px}.stat{padding:16px 8px}.stat p{font-size:12px}
  .steps{grid-template-columns:1fr}
  .part img{width:78px;height:78px}
  .m img{width:64px;height:64px}.m:after{left:54px}
  .esc{height:180px;gap:6px}
  .frame,.frame iframe{min-height:1040px;height:1040px}
  .cost div{font-size:14px}
}
@media (prefers-reduced-motion:reduce){
  *,*:before,*:after{animation:none!important;transition:none!important}
  .rv,.hero h1 span,.shot{opacity:1;transform:none}
  .new{opacity:1;transform:none}
  .bar-g{height:calc((100% - 56px) * var(--f))}
}