:root{--vw:min(1vw,4.8px)}
:root{--bg:#050b18;--bg2:#0b1426;--line:#1a2742;--tx:#f2f5fb;--mut:#b9c5dc;--blue:#1495ff;--red:#ff4d5e;--ok:#43d18a;--d:"Montserrat","Open Sans",system-ui,-apple-system,"Segoe UI",sans-serif;--b:"Open Sans",system-ui,-apple-system,"Segoe UI",sans-serif;--price:"Sora","Montserrat",system-ui,-apple-system,"Segoe UI",sans-serif}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--tx);font:400 16px/1.55 var(--b);padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);overflow-x:hidden}
a{color:inherit}
:focus-visible{outline:2px solid var(--blue);outline-offset:3px}
.wrap{width:min(480px,100% - 36px);margin-inline:auto}
.top{display:flex;align-items:center;justify-content:space-between;padding:18px 0;gap:12px}
.logo{font:800 26px var(--d);color:var(--blue);letter-spacing:.02em;text-decoration:none}
nav{display:flex;gap:6px;align-items:center}nav a.l{color:var(--mut);text-decoration:none;padding:8px 10px;font-size:15px}nav a.l:hover{color:var(--tx)}
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:999px;padding:14px 28px;font:700 16px var(--d);letter-spacing:-.01em;cursor:pointer;text-decoration:none;transition:transform .2s cubic-bezier(.2,.8,.2,1),box-shadow .2s,background .2s,border-color .2s,filter .2s;min-height:48px;isolation:isolate;overflow:hidden}
.btn:active{transform:scale(.96)}.btn[disabled]{opacity:.55;cursor:wait;filter:saturate(.6)}
.btn--p{background:linear-gradient(135deg,#4db4ff,var(--blue) 55%,#5f7bff);color:#fff;box-shadow:0 10px 28px -10px rgba(20,149,255,.75),inset 0 1px 0 rgba(255,255,255,.4)}
.btn--p::after{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background:linear-gradient(100deg,transparent,rgba(255,255,255,.45),transparent);transform:translateX(-130%) skewX(-18deg);transition:transform .6s ease}
@media(hover:hover){.btn--p:hover{transform:translateY(-2px);box-shadow:0 16px 36px -10px rgba(20,149,255,.9),inset 0 1px 0 rgba(255,255,255,.45)}.btn--p:hover::after{transform:translateX(130%) skewX(-18deg)}}
.btn--g{background:rgba(255,255,255,.04);color:var(--tx);border:1px solid var(--line);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
@media(hover:hover){.btn--g:hover{background:rgba(255,255,255,.09);border-color:rgba(160,200,255,.5);transform:translateY(-1px)}}
.btn--s{padding:9px 20px;font-size:14.5px;min-height:40px}
.hero{position:relative;padding:32px 0 64px;display:grid;gap:40px;align-items:center}
.hero::before{content:"";position:absolute;inset:-120px calc(-20*var(--vw)) auto auto;width:900px;height:900px;background:conic-gradient(from 200deg at 70% 30%,transparent 0 35%,rgba(20,149,255,.35) 48%,transparent 60%);filter:blur(40px);pointer-events:none;animation:beam 6s ease-in-out infinite alternate;z-index:-1}
@keyframes beam{to{transform:rotate(8deg) scale(1.06)}}
h1{font:800 clamp(32px,calc(7.4*var(--vw)),58px)/1.1 var(--d);letter-spacing:-.03em;max-width:14ch}
h2{font:800 clamp(24px,calc(4.8*var(--vw)),36px)/1.15 var(--d);letter-spacing:-.02em;margin-bottom:12px}
.lead{color:var(--mut);font-size:18px;max-width:46ch;margin:18px 0 28px}.sub{color:var(--mut);max-width:52ch;margin-bottom:32px}
.cta{display:flex;flex-wrap:wrap;gap:12px}
.note{display:none;margin-top:14px;padding:12px 14px;border:1px solid var(--blue);border-radius:12px;font-size:14px;background:var(--bg2)}.note.on{display:block}
.phone{justify-self:center;width:min(300px,calc(80*var(--vw)));border:1px solid var(--line);border-radius:36px;padding:14px;background:var(--bg2);box-shadow:0 30px 80px rgba(20,149,255,.18)}
.screen{border-radius:24px;background:#000;padding:14px;display:grid;gap:12px}
.live{aspect-ratio:16/9;border-radius:14px;background:linear-gradient(135deg,#0e3b72,#06142b 70%);position:relative;overflow:hidden}
.live::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 40%,rgba(255,255,255,.14) 50%,transparent 60%);animation:sweep 3.2s linear infinite}
@keyframes sweep{from{transform:translateX(-100%)}to{transform:translateX(100%)}}
.tag{position:absolute;top:10px;left:10px;z-index:1;background:rgba(255,77,94,.18);color:var(--red);font:700 12px var(--b);padding:3px 10px;border-radius:99px}
.chs{display:grid;grid-template-columns:1fr 1fr;gap:8px}.chs i{height:44px;border-radius:10px;background:var(--bg2);border:1px solid var(--line)}.chs i:first-child{border-color:var(--blue)}
section{padding:56px 0}
.feat{display:grid;border-top:1px solid var(--line)}.feat div{display:grid;gap:4px;padding:22px 0;border-bottom:1px solid var(--line)}
.feat b{font:700 20px var(--d)}.feat span{color:var(--mut)}
.plans{display:grid;gap:16px}
.plan{border:1px solid var(--line);border-radius:22px;padding:28px;background:var(--bg2);display:flex;flex-direction:column;gap:14px}
.plan--on{border-color:var(--blue);box-shadow:0 0 0 1px var(--blue)}
.plan h3{font:700 22px var(--d)}.price{font:800 32px var(--d)}.price small{font:400 15px var(--b);color:var(--mut)}
.plan ul{list-style:none;padding:0;display:grid;gap:8px;color:var(--mut);flex:1}.plan li::before{content:"✓ ";color:var(--blue);font-weight:700}
.badge{align-self:flex-start;background:var(--blue);color:#fff;font:700 12px var(--b);padding:3px 10px;border-radius:99px}
.card{border:1px solid var(--line);border-radius:22px;padding:28px;background:var(--bg2);display:grid;gap:16px;width:min(460px,100%)}
.narrow{padding:32px 0 64px;display:grid;justify-items:center}
.tabs{display:grid;grid-template-columns:1fr 1fr;gap:6px;background:var(--bg);padding:5px;border-radius:99px}
.tabs button{border:0;border-radius:99px;padding:10px;background:none;color:var(--mut);font:700 15px var(--b);cursor:pointer;min-height:44px}
.tabs button[aria-selected=true]{background:var(--blue);color:#fff}
form{display:grid;gap:14px}[hidden]{display:none!important}
label{display:grid;gap:6px;font-size:14px;color:var(--mut)}
input,select{background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:13px 14px;color:var(--tx);font:16px var(--b);min-height:48px}
input[aria-invalid=true]{border-color:var(--red)}
.fe{color:#ff8a96;font-size:13px}
.msg{font-size:14px;padding:10px 12px;border-radius:10px}.msg:empty{display:none}.msg.err{color:#ff8a96;background:rgba(255,77,94,.1)}.msg.ok{color:var(--ok);background:rgba(67,209,138,.1)}
dl{display:grid;grid-template-columns:auto 1fr;gap:8px 18px}dt{color:var(--mut)}dd{font-weight:700;overflow-wrap:anywhere}
details{border-bottom:1px solid var(--line);padding:16px 0}summary{cursor:pointer;font:700 18px var(--d);list-style:none;display:flex;justify-content:space-between;gap:12px}
summary::after{content:"+";color:var(--blue)}details[open] summary::after{content:"–"}details p{color:var(--mut);margin-top:10px}
.legal h2{font-size:22px;margin:28px 0 8px}.legal p{color:var(--mut);max-width:68ch}
.nf{text-align:center;padding:96px 0}.nf .big{font:800 clamp(90px,calc(25*var(--vw)),180px)/1 var(--d);color:var(--blue);text-shadow:0 0 60px rgba(20,149,255,.5)}
footer{border-top:1px solid var(--line);padding:28px 0 40px;color:var(--mut);font-size:14px;display:flex;flex-wrap:wrap;gap:12px 24px;justify-content:space-between}
@media all{.top nav a.l{display:none}}
@media(min-width:99999px){.hero{grid-template-columns:1.2fr .8fr;padding:72px 0 96px}.plans{grid-template-columns:repeat(2,1fr);max-width:760px}.stats{grid-template-columns:repeat(4,1fr)}.feat{grid-template-columns:1fr 1fr;column-gap:48px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}html{scroll-behavior:auto}}

/* Fundo em gradiente que muda de cor ao rolar (cores definidas em app.js) */
.bg{position:fixed;inset:0;z-index:-2;pointer-events:none;background:linear-gradient(rgba(5,11,24,.5),rgba(5,11,24,.5)),radial-gradient(90% 55% at 100% var(--y1,6%),var(--c1,rgb(200,99,31)),transparent 70%),radial-gradient(90% 55% at 0% var(--y2,8%),var(--c2,rgb(26,155,232)),transparent 70%),linear-gradient(180deg,var(--ca,rgb(10,95,160)),var(--cb,rgb(5,34,63)))}

/* Carrossel 3D "Mais assistidos" */
.trend{padding:8px 0 0;text-align:center;overflow:hidden;width:calc(100*var(--vw));margin-left:calc(50% - calc(50*var(--vw)))}.trend h2{margin-bottom:18px}.trend+.hero{padding-top:40px}
.t-stage{--tr-h:clamp(100px,calc((calc(50*var(--vw)) - 6px)/1.5),400px);--tr-w:calc(var(--tr-h)*.6667);position:relative;height:calc(var(--tr-h) + 52px);perspective:calc(var(--tr-h)*3.4);perspective-origin:50% 40%;touch-action:pan-y;cursor:grab;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent}
.t-stage:active{cursor:grabbing}
.tc{position:absolute;top:0;left:50%;width:var(--tr-w);height:var(--tr-h);margin-left:calc(var(--tr-w)/-2);will-change:transform,opacity;backface-visibility:hidden}
.tf{position:absolute;inset:0;overflow:hidden;border-radius:clamp(14px,calc(var(--tr-w)*.16),24px);background:var(--c);display:flex;align-items:center;justify-content:center;box-shadow:0 18px 30px -14px var(--g),inset 0 0 0 1px rgba(255,255,255,.1)}
.tf::after{content:"";position:absolute;inset:0;background:#000;opacity:var(--dim,0);pointer-events:none}
.tf img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none}
.tl{font:800 calc(var(--tr-w)*.52)/1 var(--d);color:rgba(255,255,255,.96);text-shadow:0 2px 10px rgba(0,0,0,.25)}
.tn{position:absolute;left:-6%;right:-6%;top:calc(100% + 10px);font-size:clamp(13px,calc(3.4*var(--vw)),16px);font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:calc(.35 + .65*var(--a,0))}

/* Vidro azul (glass) */
.plan,.card,.stat,.offer{position:relative;isolation:isolate;overflow:hidden}
.plan,.card,.offer{background:linear-gradient(155deg,rgba(40,150,255,.26),rgba(8,20,44,.42) 55%,rgba(8,20,44,.5));border:1px solid rgba(110,190,255,.32);-webkit-backdrop-filter:blur(18px) saturate(150%);backdrop-filter:blur(18px) saturate(150%);box-shadow:0 22px 50px -24px rgba(20,149,255,.6),inset 0 1px 0 rgba(255,255,255,.2),inset 0 0 36px rgba(20,149,255,.07)}
.plan::before,.card::before,.offer::before{content:"";position:absolute;z-index:-1;inset:-30% -10% auto -10%;height:70%;background:radial-gradient(closest-side,rgba(70,175,255,.32),transparent);pointer-events:none}
.stat{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.stats{display:grid;grid-template-columns:1fr 1fr;gap:14px;align-items:stretch}
.stat{background:linear-gradient(165deg,rgba(28,38,58,.85),rgba(5,9,18,.92) 60%);border:1px solid rgba(255,255,255,.08);box-shadow:0 30px 60px -28px rgba(0,0,0,.85),inset 0 1px 0 rgba(255,255,255,.08);border-radius:24px;padding:22px 20px;display:grid;gap:8px;align-content:start;min-height:132px;transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s,border-color .3s}
.stat::before{display:none}
.stat::after{content:"";position:absolute;right:16px;top:16px;width:8px;height:8px;border-radius:50%;background:var(--blue);box-shadow:0 0 12px 2px rgba(20,149,255,.8)}
.stat b{font:800 clamp(24px,calc(6*var(--vw)),32px)/1.15 var(--d);letter-spacing:-.03em;color:#fff}
.stat span{color:var(--mut);font-size:14px;line-height:1.4}
@media(hover:hover){.stat:hover{transform:translateY(-4px);border-color:rgba(255,255,255,.16);box-shadow:0 36px 70px -26px rgba(0,0,0,.9),0 0 0 1px rgba(110,190,255,.18),inset 0 1px 0 rgba(255,255,255,.12)}}
.rv.in .stat{animation:statIn .55s cubic-bezier(.2,.8,.2,1) both}
.rv.in .stat:nth-child(1){animation-delay:.05s}.rv.in .stat:nth-child(2){animation-delay:.15s}.rv.in .stat:nth-child(3){animation-delay:.25s}.rv.in .stat:nth-child(4){animation-delay:.35s}
@keyframes statIn{from{opacity:0;transform:translateY(18px) scale(.96)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.rv.in .stat{animation:none}}
.offer{border-radius:24px;padding:28px;display:grid;gap:12px;justify-items:start}
.offer h2{margin:0;font-size:clamp(30px,calc(8*var(--vw)),44px)}.offer p{color:var(--mut)}.offer b{color:var(--tx)}
.steps{list-style:none;padding:0;display:grid;counter-reset:s}
.steps li{counter-increment:s;display:flex;gap:14px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line)}
.steps li::before{content:counter(s);flex:none;width:34px;height:34px;border-radius:50%;background:var(--blue);display:grid;place-items:center;font:700 15px var(--b)}

/* === Novas seções da home === */

/* Disponibilidade no hero */
.avail{display:flex;flex-wrap:wrap;gap:8px 16px;margin-top:22px;color:var(--mut);font-size:14px}
.avail span{display:inline-flex;align-items:center;gap:6px}
.avail span::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--ok)}

/* Bento grid — o que você encontra na Lumi */
.bento{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.bento a{position:relative;border-radius:20px;overflow:hidden;min-height:150px;display:flex;align-items:flex-end;padding:18px;border:1px solid var(--line);background:linear-gradient(160deg,rgba(40,150,255,.16),rgba(8,20,44,.55));text-decoration:none;isolation:isolate}
.bento a::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--bg2);opacity:.6}
.bento a b{font:700 18px var(--d);color:var(--tx)}
.bento a.b2{grid-column:span 2}
.bento a.tall{grid-row:span 2;min-height:320px}

/* Prova do produto — frames do app */
.frames{display:grid;grid-auto-flow:column;grid-auto-columns:min(calc(78*var(--vw)),280px);gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding:4px 4px 10px;-webkit-overflow-scrolling:touch}
.frames::-webkit-scrollbar{display:none}
.frame{scroll-snap-align:start;border:1px solid var(--line);border-radius:22px;background:var(--bg2);padding:10px}
.frame .fs{aspect-ratio:9/17;border-radius:16px;background:linear-gradient(150deg,#0e2444,#060e1e 70%);position:relative;overflow:hidden;display:grid;place-items:center}
.frame .fs span{color:var(--mut);font:700 13px var(--d)}
.frame p{margin-top:10px;font-size:14px;color:var(--mut);text-align:center}

/* Futebol */
.football{border:1px solid var(--line);border-radius:24px;padding:24px;background:linear-gradient(160deg,rgba(20,149,255,.14),rgba(8,20,44,.5));display:grid;gap:16px}
.fx-list{display:grid;gap:10px}
.fx{display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--bg);border:1px solid var(--line);border-radius:14px;padding:12px 16px;font-size:14px}
.fx time{color:var(--blue);font-weight:700}

/* Compatibilidade */
.compat{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.compat div{border:1px solid var(--line);border-radius:16px;padding:18px;display:grid;gap:8px;justify-items:center;text-align:center;color:var(--mut);font-size:14px}

/* FAQ já usa <details>, reaproveitado */

/* Indicador de atividade honesto (sem número fake) */
.liveinfo{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:999px;padding:8px 16px;font-size:13px;color:var(--mut);background:var(--bg2)}
.liveinfo::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--ok);animation:pulse 2s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.35}}

/* Depoimentos — preparado para dados reais, placeholder honesto quando vazio */
.testi{display:grid;gap:14px}
.testi-empty{border:1px dashed var(--line);border-radius:18px;padding:24px;color:var(--mut);text-align:center;font-size:14px}
.testi-card{border:1px solid var(--line);border-radius:18px;padding:20px;background:var(--bg2);display:grid;gap:8px}
.testi-card .who{font-weight:700;font-size:14px;color:var(--tx)}

/* Barra de confiança */
.trust{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;color:var(--mut);font-size:13px}
.trust div{display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:12px;padding:10px 12px}
.trust div::before{content:"✓";color:var(--ok);font-weight:700}

/* CTA fixo mobile */
.sticky-cta{position:fixed;left:0;right:0;bottom:0;z-index:40;padding:10px 20px calc(10px + env(safe-area-inset-bottom));background:linear-gradient(180deg,transparent,var(--bg) 30%);display:flex;justify-content:center}
.sticky-cta .btn{width:min(420px,100%)}
body{padding-bottom:78px}
@media(min-width:99999px){.sticky-cta{display:none}body{padding-bottom:0}.bento{grid-template-columns:repeat(4,1fr)}.bento a.b2{grid-column:span 2}.bento a.tall{grid-row:span 1}.compat{grid-template-columns:repeat(4,1fr)}.trust{grid-template-columns:repeat(4,1fr)}}


/* === Redesign v3 === */
.top{position:sticky;top:0;z-index:50;padding:14px 0;transition:background .3s,backdrop-filter .3s}
.top.sc{background:rgba(5,11,24,.72);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.hero2{position:relative;padding:48px 0 56px;display:grid;gap:22px;justify-items:start}
.hero2::before{content:"";position:absolute;z-index:-1;width:520px;height:520px;right:-180px;top:-60px;background:radial-gradient(closest-side,rgba(20,149,255,.45),transparent);filter:blur(30px)}
.hero2 h1{font-size:clamp(38px,calc(10*var(--vw)),76px);max-width:13ch;line-height:1.02}
.hero2 .lead{margin:0;max-width:44ch}
.hero2 .fine{color:var(--mut);font-size:14px;display:flex;flex-wrap:wrap;gap:6px 18px}
.hero2 .fine span::before{content:"✓ ";color:var(--ok);font-weight:700}
.btn--xl{padding:18px 36px;font-size:18px;min-height:58px;box-shadow:0 16px 44px -12px rgba(20,149,255,.85),inset 0 1px 0 rgba(255,255,255,.4)}
@media(hover:hover){.btn--xl:hover{transform:translateY(-3px)}}
.frames{padding:6px 2px 14px;scrollbar-width:none}
.frame{margin:0;padding:10px;background:linear-gradient(160deg,rgba(40,150,255,.2),rgba(8,20,44,.6));border-color:rgba(110,190,255,.28)}
.frame .fs{aspect-ratio:9/17;border-radius:18px;background:#000;overflow:hidden;display:block}
.frame img{width:100%;height:100%;object-fit:cover;display:block}
.frame figcaption{margin-top:10px;text-align:center;font:700 14px var(--d)}
.sk{height:100%;display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:12px;align-content:start}
.sk i{aspect-ratio:2/3;border-radius:10px;background:linear-gradient(160deg,#10305c,#07142b)}
.sk i:first-child{grid-column:span 2;aspect-ratio:16/9}
.bento a{min-height:130px;flex-direction:column;align-items:flex-start;justify-content:flex-end;gap:4px;cursor:default}
.bento a span{color:var(--mut);font-size:13px;line-height:1.35}
.bento a:nth-child(1){background:linear-gradient(160deg,rgba(91,61,245,.5),rgba(8,20,44,.7))}
.bento a:nth-child(2){background:linear-gradient(160deg,rgba(192,57,43,.45),rgba(8,20,44,.7))}
.bento a:nth-child(3){background:linear-gradient(160deg,rgba(31,157,85,.4),rgba(8,20,44,.7))}
.bento a:nth-child(4){background:linear-gradient(160deg,rgba(217,131,36,.4),rgba(8,20,44,.7))}
.bento a:nth-child(5){background:linear-gradient(160deg,rgba(20,149,255,.45),rgba(8,20,44,.7))}
.path{display:grid;gap:12px}
.path>div{border:1px solid rgba(110,190,255,.28);border-radius:20px;padding:22px;background:linear-gradient(160deg,rgba(40,150,255,.14),rgba(8,20,44,.55));display:grid;gap:8px}
.path h3{font:700 19px var(--d)}.path p{color:var(--mut);font-size:15px}
.path .btn{justify-self:start;margin-top:6px}
.deliver{display:grid;gap:10px;margin-top:20px}
.deliver div{border-left:3px solid var(--blue);padding:4px 0 4px 14px;color:var(--mut);font-size:15px}.deliver b{color:var(--tx)}
.testi-card{margin:0}.testi-card img{width:100%;border-radius:12px;display:block}.testi-card blockquote{font-size:16px;line-height:1.5}
.testi-empty{display:grid;gap:12px;justify-items:center}
.plan .btn{width:100%}
.wa-float{position:fixed;right:16px;bottom:calc(86px + env(safe-area-inset-bottom));z-index:45;width:56px;height:56px;border-radius:50%;background:#25d366;display:grid;place-items:center;box-shadow:0 10px 30px -8px rgba(37,211,102,.8);text-decoration:none;font-size:26px}
.sticky-cta{gap:10px}.sticky-cta .btn{width:auto;flex:1;max-width:240px}
.rv{opacity:0;transform:translateY(16px);transition:opacity .5s,transform .5s}.rv.in{opacity:1;transform:none}
details summary{min-height:44px;align-items:center}
@media(min-width:99999px){.path{grid-template-columns:repeat(3,1fr)}.hero2{padding:96px 0 80px}.wa-float{bottom:24px}.deliver{grid-template-columns:1fr 1fr}.testi{grid-template-columns:repeat(3,1fr)}.frames{grid-auto-columns:240px}}
@media(prefers-reduced-motion:reduce){.rv{opacity:1;transform:none}}


/* Tipografia v5 — Montserrat + Open Sans */
body{font-weight:400;letter-spacing:0;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
h1,h2,.logo,.price,.stat b,.nf .big{font-family:var(--d);font-weight:800;letter-spacing:-.035em}
h1{line-height:1.04}
h2{line-height:1.1;letter-spacing:-.03em}
h3,summary,.frame figcaption,.bento a b,.path h3{font-family:var(--d);font-weight:700;letter-spacing:-.015em}
.lead{font-size:clamp(17px,calc(4.4*var(--vw)),20px);line-height:1.55;font-weight:400}
.sub{font-size:17px}
.btn{font-family:var(--d);font-weight:700;letter-spacing:.01em;font-size:15px}
.btn--xl{font-size:16px}
.logo{letter-spacing:-.02em;font-weight:900}


/* Cabeçalho e rodapé v6 */
.top{gap:10px}
.top.sc{margin-inline:calc(50% - calc(50*var(--vw)));padding-inline:calc(calc(50*var(--vw)) - 50%);border-bottom:1px solid rgba(110,190,255,.14)}
.logo{display:inline-flex;align-items:center;gap:10px;color:var(--tx);font-size:22px}
.logo img{border-radius:9px;display:block}
.top nav{gap:4px}
.top nav a.l{font:600 14px var(--d);padding:8px 12px;border-radius:999px;transition:color .2s,background .2s}
.top nav a.l[aria-current=page]{color:var(--tx);background:rgba(110,190,255,.14)}
.top nav .btn{margin-left:4px}
@media all{.top nav a.l{display:none}.logo{font-size:20px}.top nav .btn--s{padding:8px 14px;font-size:14px;min-height:38px}}
footer{display:grid;grid-template-columns:1fr;gap:28px;padding:44px 0 36px;margin-top:24px;border-top:1px solid rgba(110,190,255,.18);font-size:15px}
footer .ft-brand{display:grid;gap:12px;max-width:34ch}
footer .ft-brand p{color:var(--mut);font-size:14px}
footer nav{display:grid;gap:2px;align-content:start}
footer nav a.l{padding:7px 0;color:var(--mut);font-size:15px}
footer h4{font:700 15px var(--d);color:var(--tx);margin-bottom:6px}
footer .ft-bot{grid-column:1/-1;border-top:1px solid var(--line);padding-top:20px;color:var(--mut);font-size:13px}
@media(min-width:99999px){footer{grid-template-columns:1.6fr 1fr 1fr 1fr}}
@media all{footer nav{grid-template-columns:1fr 1fr;grid-auto-flow:row}footer nav h4{grid-column:1/-1}}


/* Cabeçalho sem sombra/faixa */
.top,.top.sc{background:none!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;border-bottom:0!important;box-shadow:none!important}


/* Player "Veja o Filme" */
.vp{position:relative;aspect-ratio:16/9;border-radius:22px;overflow:hidden;background:linear-gradient(150deg,#0e2444,#050b18 70%);border:1px solid rgba(110,190,255,.28);box-shadow:0 30px 70px -30px rgba(20,149,255,.55);outline:0}
.vp:focus-visible{box-shadow:0 0 0 2px var(--blue)}
.vp video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#000;display:block}
.vp::before{content:"";position:absolute;inset:0 0 auto 0;height:34%;background:linear-gradient(rgba(0,0,0,.7),transparent);z-index:1;pointer-events:none}
.vp-title{position:absolute;z-index:2;top:14px;left:16px;right:16px;font:800 clamp(15px,calc(4*var(--vw)),24px)/1.2 var(--d);letter-spacing:-.02em;text-shadow:0 2px 12px rgba(0,0,0,.6);pointer-events:none}
.vp-big{position:absolute;z-index:2;left:50%;top:50%;width:72px;height:72px;margin:-36px 0 0 -36px;border-radius:50%;border:1px solid rgba(255,255,255,.3);background:rgba(20,149,255,.9);color:#fff;font-size:26px;cursor:pointer;box-shadow:0 12px 36px -8px rgba(20,149,255,.9);transition:transform .2s,opacity .3s}
.vp-big:active{transform:scale(.94)}
.vp.playing .vp-big{opacity:0;pointer-events:none}
.vp.empty .vp-big{width:auto;height:auto;padding:12px 22px;border-radius:999px;margin:0;transform:translate(-50%,-50%);font:700 15px var(--d);background:rgba(8,20,44,.85);cursor:default}
.vp-ctl{position:absolute;z-index:3;left:0;right:0;bottom:0;padding:26px 12px 8px;background:linear-gradient(transparent,rgba(0,0,0,.85));display:grid;gap:4px;transition:opacity .3s}
.vp.idle .vp-ctl{opacity:0;pointer-events:none}.vp.idle{cursor:none}
.vp.empty .vp-ctl{opacity:.55;pointer-events:none}
.sk2{width:100%;height:20px;margin:0;accent-color:var(--blue);background:none;border:0;padding:0;min-height:0;cursor:pointer}
.vp .row{display:flex;align-items:center;gap:2px}
.vp .gap{flex:1}
.vp .b{min-width:40px;min-height:40px;padding:0 8px;border:0;border-radius:10px;background:none;color:#fff;font:700 13px var(--d);cursor:pointer}
.vp .b:hover{background:rgba(255,255,255,.14)}
.vp .b[aria-pressed=true]{color:var(--blue)}
.vp .tm{font:600 13px var(--b);color:#e6eefc;padding:0 8px;white-space:nowrap}
@media all{.vp .sp,.vp .mu{display:none}.vp .tm{padding:0 4px;font-size:12px}.vp-big{width:60px;height:60px;margin:-30px 0 0 -30px}}

.logo--foto img{width:44px;height:44px;border-radius:50%;object-fit:cover}

.top{transition:background .3s,backdrop-filter .3s,opacity .25s ease,transform .25s ease}
.top.gone{opacity:0;transform:translateY(-8px);pointer-events:none}
@media(prefers-reduced-motion:reduce){.top{transition:none}}

@property --bg-c{syntax:'<color>';inherits:true;initial-value:#1495FF}
@property --bg-c2{syntax:'<color>';inherits:true;initial-value:#0B5FD1}
@property --bg-c3{syntax:'<color>';inherits:true;initial-value:rgba(255,255,255,0)}
@property --bg-light-a{syntax:'<number>';inherits:true;initial-value:0}
.bg{--bg-c:#1495FF;--bg-c2:#1495FF;background:linear-gradient(to bottom,transparent 42%,rgba(0,0,0,.58) 100%),radial-gradient(70% 34% at 50% 8%,color-mix(in srgb,var(--bg-c3) calc(var(--bg-light-a)*100%),transparent) 0%,transparent 100%),radial-gradient(85% 48% at 100% 6%,var(--bg-c2) 0%,transparent 100%),radial-gradient(90% 46% at 0% 88%,var(--bg-c2) 0%,transparent 100%),radial-gradient(120% 55% at 50% 28%,var(--bg-c) 0%,transparent 100%),radial-gradient(90% 45% at 0% 0%,var(--bg-c) 0%,transparent 100%),radial-gradient(130% 50% at 50% 100%,var(--bg-c) 0%,transparent 100%),#000;transition:--bg-c .7s ease,--bg-c2 .7s ease,--bg-c3 .7s ease,--bg-light-a .7s ease}
.logo--foto img{width:32px;height:32px}
.hero2 h1{font-size:clamp(26px,calc(7*var(--vw)),54px);max-width:18ch;line-height:1.06}
.bg::after{content:"";position:absolute;inset:0;background:#000;opacity:var(--dk,0);pointer-events:none}

.plan .inc{margin:0;font:700 14px var(--d);color:var(--tx)}
.plan .ref{font-size:14px;color:var(--tx);background:rgba(110,190,255,.12);border:1px solid rgba(110,190,255,.28);border-radius:14px;padding:10px 14px}
.why-ios{margin-top:20px;max-width:760px;width:100%;display:grid;gap:14px;text-align:left;padding:30px 26px;background:linear-gradient(165deg,rgba(28,38,58,.85),rgba(5,9,18,.92) 60%)!important;border:1px solid rgba(255,255,255,.08)!important;box-shadow:0 30px 60px -28px rgba(0,0,0,.85),inset 0 1px 0 rgba(255,255,255,.08)!important;border-radius:26px}
.why-ios::before{display:none}
.why-ios .tag{display:inline-flex;align-items:center;gap:6px;font:700 11px var(--d);letter-spacing:.08em;text-transform:uppercase;color:rgba(230,240,255,.85);background:rgba(255,255,255,.08);border:1px solid rgba(160,200,255,.3);border-radius:999px;padding:6px 12px;width:fit-content}
.why-ios h3{font:800 clamp(20px,calc(5*var(--vw)),24px) var(--d);letter-spacing:-.02em;margin:2px 0 0}
.why-ios p{margin:0;color:var(--mut);line-height:1.55}
.why-ios .p-sep{margin:4px 0 2px}
.why-ios .price{display:flex;align-items:baseline;gap:6px;font:800 clamp(34px,calc(9*var(--vw)),42px)/1 var(--price);letter-spacing:-.03em;color:#fff;margin-top:2px}
.why-ios .price small{font:600 15px var(--b);color:var(--mut)}
.why-ios .btn{width:100%;margin-top:4px}
.rv.in .why-ios{animation:wiosIn .6s cubic-bezier(.2,.8,.2,1) both .1s}
.rv.in .why-ios .tag{animation:statIn .5s cubic-bezier(.2,.8,.2,1) both .22s}
.rv.in .why-ios h3{animation:statIn .5s cubic-bezier(.2,.8,.2,1) both .3s}
.rv.in .why-ios p{animation:statIn .5s cubic-bezier(.2,.8,.2,1) both}
.rv.in .why-ios p:nth-of-type(1){animation-delay:.38s}.rv.in .why-ios p:nth-of-type(2){animation-delay:.46s}
.rv.in .why-ios .price{animation:statIn .5s cubic-bezier(.2,.8,.2,1) both .54s}
.rv.in .why-ios .btn{animation:statIn .5s cubic-bezier(.2,.8,.2,1) both .62s}
@keyframes wiosIn{from{opacity:0;transform:translateY(24px) scale(.97)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.rv.in .why-ios,.rv.in .why-ios *{animation:none!important;opacity:1!important;transform:none!important}}

/* ── Cards de planos (visual premium) ── */
@property --ang{syntax:'<angle>';inherits:false;initial-value:0deg}
@keyframes pSpin{to{--ang:360deg}}
@keyframes pSheen{0%,55%{transform:translateX(-120%) skewX(-18deg)}100%{transform:translateX(220%) skewX(-18deg)}}
@keyframes pFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
@keyframes pLi{from{opacity:0;transform:translateX(-8px)}to{opacity:1;transform:none}}
@keyframes pGlow{0%,100%{opacity:.55}50%{opacity:1}}
.plans{gap:20px}
.plan{--gl:70,175,255;position:relative;gap:12px;padding:26px 22px 22px;border-radius:26px;border:0;background:linear-gradient(160deg,rgba(24,64,140,.55),rgba(10,16,34,.82) 48%,rgba(8,12,26,.92));box-shadow:0 24px 60px -28px rgba(var(--gl),.55),inset 0 1px 0 rgba(255,255,255,.12);transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s;overflow:hidden}
.plan::before{content:"";position:absolute;z-index:-1;inset:-40% -20% auto -20%;height:75%;background:radial-gradient(closest-side,rgba(var(--gl),.38),transparent);pointer-events:none;animation:pGlow 5s ease-in-out infinite}
.plan::after{content:"";position:absolute;inset:0;border-radius:inherit;padding:1.5px;pointer-events:none;background:conic-gradient(from var(--ang),rgba(var(--gl),.18) 0 55%,rgba(var(--gl),1) 78%,#fff 84%,rgba(var(--gl),.18) 92%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);animation:pSpin 7s linear infinite}
.plan--hot{--gl:120,130,255;box-shadow:0 30px 70px -26px rgba(var(--gl),.7),inset 0 1px 0 rgba(255,255,255,.16)}
.plan--hot::after{animation-duration:4.5s}
@media(hover:hover){.plan:hover{transform:translateY(-8px);box-shadow:0 36px 80px -26px rgba(var(--gl),.85),inset 0 1px 0 rgba(255,255,255,.18)}}
.plan:active{transform:scale(.99)}
.p-top{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.plan h3{font:700 17px var(--d);letter-spacing:-.01em;color:#e8f2ff}
.pill{font:700 11px var(--d);letter-spacing:.06em;text-transform:uppercase;color:#fff;padding:6px 12px;border-radius:999px;background:linear-gradient(180deg,rgba(255,255,255,.18),rgba(255,255,255,.06));border:1px solid rgba(255,255,255,.28);box-shadow:0 0 18px -4px rgba(var(--gl),.9)}
.p-price{display:flex;align-items:flex-start;justify-content:center;gap:6px;margin-top:10px;line-height:1}
.p-price .cur{font:700 22px var(--d);margin-top:10px;color:rgba(220,235,255,.65)}
.p-price .num{font:800 clamp(56px,calc(16*var(--vw)),76px)/1 var(--d);letter-spacing:-.05em;background:linear-gradient(110deg,#fff 0%,#cfe6ff 35%,#7fb8ff 55%,#fff 80%);background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;filter:drop-shadow(0 8px 24px rgba(var(--gl),.45));animation:pShine 6s ease-in-out infinite}
@keyframes pShine{0%,100%{background-position:100% 0}50%{background-position:0 0}}
.p-per{text-align:center;font:700 12px var(--d);letter-spacing:.18em;text-transform:uppercase;color:rgba(230,240,255,.8)}
.p-sep{height:1px;margin:8px 0 2px;background:linear-gradient(90deg,transparent,rgba(160,200,255,.35),transparent)}
.plan .inc{font:700 13px var(--d);letter-spacing:.04em;text-transform:uppercase;color:rgba(200,225,255,.7)}
.plan ul{gap:10px;color:#dbe8fb}
.plan li{position:relative;padding-left:30px;font-size:15px;line-height:1.35}
.plan li::before{content:"✓";position:absolute;left:0;top:0;width:21px;height:21px;border-radius:50%;display:grid;place-items:center;font-size:12px;font-weight:800;color:#bfe0ff;background:rgba(var(--gl),.2);border:1px solid rgba(var(--gl),.55);box-shadow:0 0 12px -2px rgba(var(--gl),.7)}
.rv.in .plan li{animation:pLi .5s both;animation-delay:calc(var(--i)*45ms + .15s)}
.plan .ref{border-radius:16px;padding:11px 14px;font-size:14px;color:#eaf4ff;background:linear-gradient(120deg,rgba(var(--gl),.2),rgba(var(--gl),.06));border:1px solid rgba(var(--gl),.4)}
.plan .btn{position:relative;overflow:hidden;width:100%;min-height:52px;border-radius:16px;font:700 16px var(--d);display:flex;align-items:center;justify-content:center;gap:8px;transition:transform .25s,box-shadow .25s,background .25s}
.plan .btn--p{color:#fff;background:linear-gradient(135deg,#4db4ff,#1495ff 50%,#5f7bff);border:1px solid rgba(255,255,255,.35);box-shadow:0 10px 30px -8px rgba(var(--gl),.95),0 0 0 4px rgba(var(--gl),.12),inset 0 1px 0 rgba(255,255,255,.45)}
.plan .btn--p::after{content:"";position:absolute;top:0;bottom:0;width:40%;left:0;background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);animation:pSheen 3.6s ease-in-out infinite}
.plan .btn--p i{font-style:normal;transition:transform .25s}
.plan .btn--g{color:#e8f2ff;background:rgba(255,255,255,.06);border:1px solid rgba(160,200,255,.28);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
@media(hover:hover){.plan .btn--p:hover{transform:translateY(-2px);box-shadow:0 16px 38px -8px rgba(var(--gl),1),0 0 0 6px rgba(var(--gl),.18),inset 0 1px 0 rgba(255,255,255,.5)}.plan .btn--p:hover i{transform:translateX(4px)}.plan .btn--g:hover{background:rgba(255,255,255,.12);border-color:rgba(190,220,255,.55)}}
.plan .btn:active{transform:scale(.97)}
@media(prefers-reduced-motion:reduce){.plan,.plan::before,.plan::after,.plan .btn--p::after,.p-price .num,.rv.in .plan li{animation:none!important;transition:none!important}}

/* A partir de "Conheça o app por dentro": gradiente só azul (Midnight Blue); as cores dos posters ficam só no topo */
.bg.blue{--bg-c:#0356C5!important;--bg-c2:#0447a8!important;--bg-c3:transparent!important;--bg-light-a:0!important}

/* Lista dos planos: marcador simples (bolinha) */
.plan ul{gap:9px}
.plan li{padding-left:20px}
.plan li::before{content:"•";width:auto;height:auto;top:0;border:0;border-radius:0;background:none;box-shadow:none;display:block;font-size:20px;line-height:1.2;font-weight:800;color:rgb(var(--gl))}

/* Preço: tudo branco — R$ 12⁹⁰/Mês */
.p-price{display:flex;align-items:baseline;justify-content:center;gap:4px;margin:14px 0 4px;color:#fff;line-height:1}
.p-price .cur{font:700 22px var(--price);margin:0;color:#fff;align-self:baseline}
.p-price .int{font:800 clamp(58px,calc(17*var(--vw)),80px)/1 var(--price);letter-spacing:-.04em;color:#fff;background:none;-webkit-text-fill-color:#fff;filter:none;animation:none}
.p-price .cts{font:800 clamp(24px,calc(7*var(--vw)),32px)/1 var(--price);color:#fff;align-self:flex-start;margin-top:.22em;letter-spacing:-.02em}
.p-price .mes{font:700 20px var(--price);color:#fff;margin-left:2px}
/* Lista: marcador "•" perfeitamente alinhado ao texto (inclusive em linhas que quebram) */
.plan ul{gap:11px}
.plan li{display:flex;align-items:flex-start;gap:10px;padding-left:0;font-size:15.5px;line-height:1.4;color:#fff}
.plan li::before{content:"•";position:static;flex:0 0 auto;width:auto;height:auto;top:auto;left:auto;border:0;border-radius:0;background:none;box-shadow:none;font-size:20px;line-height:1.4;font-weight:800;color:rgb(var(--gl))}
.rv.in .plan li{animation:none!important;opacity:1!important;transform:none!important}

/* === Refino: "Catálogo gigante" + card "Por que o iPhone custa menos?" === */
.stats{grid-template-columns:repeat(3,1fr);gap:10px}
.stat{min-height:0;padding:18px 14px 16px;border-radius:20px;gap:6px;align-content:space-between;background:linear-gradient(170deg,rgba(24,44,82,.7),rgba(6,14,32,.9) 70%);border:1px solid rgba(120,180,255,.18);box-shadow:0 18px 40px -26px rgba(0,0,0,.9),inset 0 1px 0 rgba(255,255,255,.07)}
.stat::after{right:auto;left:14px;top:0;width:28px;height:3px;border-radius:0 0 4px 4px;box-shadow:0 2px 10px rgba(20,149,255,.7)}
.stat b{font:800 clamp(22px,calc(6.2*var(--vw)),28px)/1.1 var(--d);letter-spacing:-.03em;margin-top:6px;background:linear-gradient(180deg,#fff,#b9d8ff);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.stat span{font-size:12.5px;line-height:1.35;color:var(--mut)}
.stat--wide{grid-column:1/-1;padding:16px 18px;display:flex;align-items:center;gap:14px}
.stat--wide::before{content:"";display:block!important;flex:none;width:40px;height:40px;border-radius:12px;background:rgba(20,149,255,.14) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2360b4ff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='7' y='2.5' width='10' height='19' rx='2.5'/%3E%3Cpath d='M11 18.5h2'/%3E%3C/svg%3E") center/22px no-repeat;border:1px solid rgba(120,180,255,.28);position:static;inset:auto;height:40px;opacity:1}
.stat--wide .stat-t{display:grid;gap:2px}
.stat--wide b{font-size:clamp(17px,calc(4.8*var(--vw)),20px);margin:0}
.stat--wide span{font-size:13px}
@media(min-width:99999px){.stats{grid-template-columns:repeat(4,1fr);gap:14px}.stat{padding:22px 20px}.stat span{font-size:14px}.stat--wide{grid-column:auto;display:grid;align-content:space-between;gap:6px}.stat--wide::before{display:none!important}}

.why-ios{margin-top:18px;padding:22px 20px 20px;gap:12px;border-radius:22px;background:linear-gradient(170deg,rgba(24,44,82,.7),rgba(6,14,32,.92) 70%)!important;border:1px solid rgba(120,180,255,.2)!important;box-shadow:0 24px 50px -28px rgba(0,0,0,.9),inset 0 1px 0 rgba(255,255,255,.07)!important}
.why-ios .tag{position:static;inset:auto;display:inline-flex;align-items:center;gap:7px;font:700 10.5px var(--d);letter-spacing:.12em;color:#8cc8ff;background:rgba(20,149,255,.12);border:1px solid rgba(20,149,255,.3);padding:5px 11px;margin:0 0 2px}
.why-ios .tag::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--blue);box-shadow:0 0 8px 1px rgba(20,149,255,.8)}
.why-ios h3{font:700 clamp(17px,calc(4.6*var(--vw)),20px)/1.25 var(--d);letter-spacing:-.015em;margin:0}
.why-ios p{font-size:13.5px;line-height:1.6;color:#aebbd4}
.why-ios p+p{padding-left:12px;border-left:2px solid rgba(20,149,255,.45)}
.why-ios .p-sep{height:1px;margin:6px 0 2px;background:linear-gradient(90deg,transparent,rgba(120,180,255,.28),transparent)}
.why-ios .price{font:800 clamp(30px,calc(8*var(--vw)),36px)/1 var(--price);margin:0}
.why-ios .price small{font:600 13px var(--b)}
.why-ios .btn{margin-top:6px;min-height:48px;font-size:15px}

/* === Cards "Conheça o app por dentro": botão de informação + painel === */
.frame{position:relative}
.frame .fi{position:absolute;top:20px;right:20px;z-index:3;width:34px;height:34px;padding:0;border-radius:50%;display:grid;place-items:center;cursor:pointer;color:#fff;background:rgba(10,24,52,.55);border:1px solid rgba(160,205,255,.4);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 6px 18px -6px rgba(0,0,0,.7);transition:background .2s,transform .2s,border-color .2s}
.frame .fi span{display:grid;place-items:center;grid-area:1/1;transition:opacity .2s,transform .25s}
.frame .fi .fi-x{opacity:0;transform:rotate(-90deg) scale(.6)}
.frame .fi[aria-expanded=true]{background:var(--blue);border-color:transparent}
.frame .fi[aria-expanded=true] .fi-i{opacity:0;transform:rotate(90deg) scale(.6)}
.frame .fi[aria-expanded=true] .fi-x{opacity:1;transform:none}
@media(hover:hover){.frame .fi:hover{background:rgba(20,149,255,.45);transform:scale(1.06)}}
.frame .fp{position:absolute;z-index:2;inset:10px 10px 44px;border-radius:18px;padding:60px 18px 18px;overflow-y:auto;scrollbar-width:none;background:linear-gradient(170deg,rgba(14,36,76,.94),rgba(4,10,24,.97));-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border:1px solid rgba(120,180,255,.22);animation:fpIn .28s cubic-bezier(.2,.8,.2,1) both}
.frame .fp::-webkit-scrollbar{display:none}
.frame .fp-k{position:absolute;top:26px;left:18px;font:700 10.5px var(--d);letter-spacing:.12em;text-transform:uppercase;color:#8cc8ff;display:inline-flex;align-items:center;gap:7px}
.frame .fp-k::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--blue);box-shadow:0 0 8px 1px rgba(20,149,255,.8)}
.frame .fp h4{font:800 18px/1.25 var(--d);letter-spacing:-.02em;margin:0 0 14px;color:#fff}
.frame .fp ul{list-style:none;margin:0;padding:0;display:grid;gap:0}
.frame .fp li{display:grid;gap:2px;padding:12px 0 12px 22px;border-top:1px solid rgba(120,180,255,.14);position:relative}
.frame .fp li::before{content:"";position:absolute;left:0;top:17px;width:10px;height:10px;border-radius:50%;background:var(--blue);box-shadow:0 0 0 3px rgba(20,149,255,.18)}
.frame .fp li b{font:700 13.5px/1.3 var(--d);color:#fff}
.frame .fp li span{font-size:12.5px;line-height:1.5;color:#aebbd4}
@keyframes fpIn{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.frame .fp{animation:none}}

/* Imagens enviadas pelo painel (aba Site) em cards com data-slot */
.bento a.has-img{background-size:cover;background-position:center}
.bento a.has-img::before{background:linear-gradient(to top,rgba(5,11,24,.88),rgba(5,11,24,.08) 65%);opacity:1}
.bento a.has-img span{color:#e6eefc}

/* ===== Fase 15 — tipografia menor, player horizontal, player Lumi, proteção ===== */
.trend h2{font-size:clamp(19px,calc(5*var(--vw)),24px);margin-bottom:8px}
.rv>h2{font-size:clamp(20px,calc(5.2*var(--vw)),26px);line-height:1.15;margin-bottom:6px}
.sub{font-size:14.5px;line-height:1.5;margin-bottom:18px;max-width:46ch}
.hero2 .lead{font-size:clamp(14.5px,calc(3.8*var(--vw)),16.5px);line-height:1.5;margin:12px 0 20px;max-width:42ch}

/* só o Player fica na horizontal */
.frames{display:flex;align-items:center;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory}
.frame{flex:0 0 min(calc(78*var(--vw)),280px)}
.frame--land{flex-basis:min(calc(90*var(--vw)),470px)}
.frame--land .fs{aspect-ratio:16/9}
@media(min-width:99999px){.frame{flex-basis:240px}.frame--land{flex-basis:400px}}
/* proteção de conteúdo */
html,body{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}
input,textarea,select,[contenteditable=true]{-webkit-user-select:text;user-select:text}
img,video{-webkit-user-drag:none;user-drag:none}
/* espaçamento entre seções: compacto, sem colar */
section{padding:0}
main>.rv{margin-block:0;padding:26px 0}
.trend{padding:4px 0 0}
.hero2{padding:26px 0 22px;gap:14px}
.hero2 .lead{margin:0}
.hero2 .cta{margin:2px 0}
.hero2::before{width:380px;height:380px}
/* player Lumi */
.lpv{position:relative;aspect-ratio:16/9;border-radius:18px;overflow:hidden;background:#000;border:1px solid rgba(110,190,255,.28);box-shadow:0 24px 60px -30px rgba(20,149,255,.55);outline:0;color:#fff;touch-action:manipulation;-webkit-tap-highlight-color:transparent;cursor:pointer}
.lpv video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#000;display:block}
.lpv video::-webkit-media-controls,.lpv video::-webkit-media-controls-enclosure{display:none!important}
.lpv::before,.lpv::after{content:"";position:absolute;left:0;right:0;z-index:1;pointer-events:none;transition:opacity .28s ease}
.lpv::before{top:0;height:38%;background:linear-gradient(rgba(0,0,0,.75),transparent)}
.lpv::after{bottom:0;height:52%;background:linear-gradient(transparent,rgba(0,0,0,.9))}
.lpv-top,.lpv-mid,.lpv-bot{transition:opacity .28s ease,transform .28s ease}
.lpv-top{position:absolute;z-index:2;top:10px;left:14px;right:14px;display:flex;justify-content:space-between;align-items:center;gap:10px;pointer-events:none}
.lpv-title{font:700 14px/1.2 var(--d);letter-spacing:-.01em;text-shadow:0 2px 10px rgba(0,0,0,.7);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lpv-spec{flex:none;font:700 10px var(--d);padding:3px 8px;border-radius:999px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.28);color:#fff}
.lpv-mid{position:absolute;z-index:3;inset:0;display:flex;align-items:center;justify-content:center;gap:26px;pointer-events:none}
.lpv-mid>button{pointer-events:auto}
.lpv-ic{width:38px;height:38px;padding:0;border:0;background:none;color:#fff;cursor:pointer;filter:drop-shadow(0 2px 8px rgba(0,0,0,.6));transition:transform .15s}
.lpv-ic:active{transform:scale(.88)}.lpv-ic svg{width:100%;height:100%;display:block}
.lpv-pp{width:56px;height:56px;padding:0;border:0;background:none;color:#fff;cursor:pointer;display:grid;place-items:center;filter:drop-shadow(0 2px 10px rgba(0,0,0,.6));transition:transform .15s}
.lpv-pp:active{transform:scale(.9)}
.lpv-pp svg{width:100%;height:100%;grid-area:1/1}.lpv-pp .i-pause{display:none}
.lpv.playing .lpv-pp .i-play{display:none}.lpv.playing .lpv-pp .i-pause{display:block}
.lpv-bot{position:absolute;z-index:3;left:0;right:0;bottom:0;padding:0 14px 6px}
.lpv-times{display:flex;justify-content:space-between;font:600 11.5px var(--b);font-variant-numeric:tabular-nums;color:#fff;text-shadow:0 1px 6px rgba(0,0,0,.8);margin-bottom:6px}
.lpv-trk{position:relative;height:3px;border-radius:3px;background:rgba(255,255,255,.28)}
.lpv-buf{position:absolute;left:0;top:0;bottom:0;width:0;border-radius:3px;background:rgba(255,255,255,.28)}
.lpv-fill{position:absolute;left:0;top:0;bottom:0;width:0;border-radius:3px;background:#fff}
.lpv-thumb{position:absolute;top:50%;left:0;width:13px;height:13px;margin:-6.5px 0 0 -6.5px;border-radius:50%;background:#fff;box-shadow:0 0 0 4px rgba(255,255,255,.18)}
.lpv-rng{position:absolute;left:-8px;width:calc(100% + 16px);top:-15px;height:34px;margin:0;opacity:0;cursor:pointer}
.lpv-row{display:flex;align-items:center;justify-content:center;gap:2px;margin-top:2px}
.lpv-b{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:38px;padding:0 12px;border:0;border-radius:10px;background:none;color:#fff;font:600 12.5px var(--d);cursor:pointer}
.lpv-b svg{width:19px;height:19px;flex:none}
.lpv-b[aria-pressed=true]{color:var(--blue)}
.lpv-b .x{display:none}.lpv-b.off .w{display:none}.lpv-b.off .x{display:block}
@media(hover:hover){.lpv-b:hover{background:rgba(255,255,255,.12)}}
/* controles escondidos: um toque na tela traz de volta */
.lpv.hud-off .lpv-top,.lpv.hud-off .lpv-mid,.lpv.hud-off .lpv-bot,.lpv.hud-off::before,.lpv.hud-off::after{opacity:0;pointer-events:none}
.lpv.hud-off .lpv-mid>button,.lpv.hud-off .lpv-bot *{pointer-events:none}
.lpv.hud-off .lpv-bot{transform:translateY(6px)}
.lpv.empty .lpv-mid,.lpv.empty .lpv-bot{opacity:.45;pointer-events:none}
/* carregando */
.lpv-spin{position:absolute;z-index:4;left:50%;top:50%;width:44px;height:44px;margin:-22px 0 0 -22px;border-radius:50%;border:3px solid rgba(255,255,255,.25);border-top-color:#fff;opacity:0;pointer-events:none;animation:lpvs .8s linear infinite}
.lpv.wait .lpv-spin{opacity:1}.lpv.wait.playing .lpv-mid{opacity:0}
@keyframes lpvs{to{transform:rotate(360deg)}}
/* tela cheia */
.lpv.fs-on,.lpv.pfs{border-radius:0;border:0}
.lpv.fs-on .lpv-title,.lpv.pfs .lpv-title{font-size:17px}
.lpv.fs-on .lpv-mid,.lpv.pfs .lpv-mid{gap:48px}
.lpv.fs-on .lpv-ic,.lpv.pfs .lpv-ic{width:52px;height:52px}
.lpv.fs-on .lpv-pp,.lpv.pfs .lpv-pp{width:76px;height:76px}
.lpv.fs-on .lpv-bot,.lpv.pfs .lpv-bot{padding:0 28px 10px}
.lpv.fs-on .lpv-top,.lpv.pfs .lpv-top{top:16px;left:28px;right:28px}
.lpv.pfs{position:fixed;inset:0;z-index:9999;width:100vw;height:100dvh;aspect-ratio:auto}
html.pfs-on,html.pfs-on body{overflow:hidden}
/* trava dos 15 minutos */
.lpv-gate{position:absolute;inset:0;z-index:10;display:grid;place-items:center;padding:14px;background:rgba(2,6,16,.92);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);text-align:center;cursor:default}
.lpv-gate[hidden]{display:none}
.lpv-gate-in{display:grid;gap:8px;justify-items:center;max-width:340px}
.lpv-gate h3{font:800 clamp(17px,5.4vw,24px)/1.15 var(--d);letter-spacing:-.02em}
.lpv-gate p{color:var(--mut);font-size:12.5px;line-height:1.4}
.lpv-gate .btn{width:min(230px,100%);padding:10px 18px;font-size:14px;min-height:0}
.lpv.gated::before,.lpv.gated::after,.lpv.gated .lpv-mid,.lpv.gated .lpv-bot,.lpv.gated .lpv-top,.lpv.gated .lpv-spin{display:none}
@media(max-height:420px){.lpv-gate-in{gap:6px}.lpv-gate p{display:none}}
html,body{overflow-x:clip;max-width:100%}
.hero2::before{right:-60px}

/* ===== Fase 17 — rodapé, feedbacks, páginas legais ===== */
.ft-name{font:700 25px/1.1 "Sora","Montserrat",system-ui,sans-serif;letter-spacing:.005em;text-decoration:none;color:#fff;background:linear-gradient(100deg,#fff 10%,#9fd0ff 55%,#4db4ff);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;width:max-content}
.fb{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;padding:2px 2px 10px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.fb::-webkit-scrollbar{display:none}
.fb-card{flex:0 0 min(86%,330px);scroll-snap-align:start;margin:0;padding:16px 16px 18px;border-radius:18px;display:grid;gap:10px;align-content:start;background:linear-gradient(160deg,rgba(16,30,60,.6),rgba(3,8,20,.74));border:1px solid rgba(140,190,255,.16);-webkit-backdrop-filter:blur(16px) saturate(1.2);backdrop-filter:blur(16px) saturate(1.2);box-shadow:0 18px 40px -24px rgba(0,0,0,.9),inset 0 1px 0 rgba(255,255,255,.07)}
.fb-hd{display:flex;align-items:center;gap:12px}
.fb-av{flex:none;width:42px;height:42px;border-radius:50%;display:grid;place-items:center;font:800 18px var(--d);color:#fff;background:linear-gradient(145deg,#4db4ff,#1495ff 55%,#5f7bff);box-shadow:0 8px 20px -8px rgba(20,149,255,.8),inset 0 1px 0 rgba(255,255,255,.4)}
.fb-nm{font:700 15px var(--d);color:#fff;letter-spacing:-.01em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fb-st{display:flex;gap:3px}
.fb-st i{display:block;line-height:0}
.fb-st svg{fill:currentColor;display:block}
.fb-st .on{color:#ffc247}.fb-st .off{color:rgba(255,255,255,.18)}
.fb-card blockquote{font-size:14.5px;line-height:1.55;color:#dce6f8}
.fb-note{margin-top:8px;text-align:center;font-size:11.5px;line-height:1.5;color:rgba(185,197,220,.45);max-width:40ch;margin-inline:auto}
/* páginas legais */
.legal{padding:18px 0 8px;-webkit-user-select:text;user-select:text}
.legal *{-webkit-user-select:text;user-select:text}
.legal h1{font:800 clamp(26px,7vw,34px)/1.12 var(--d)!important;letter-spacing:-.025em;max-width:none;margin-bottom:6px}
.legal .upd{color:rgba(185,197,220,.6);font-size:13px;margin-bottom:18px}
.legal .intro{padding:14px 16px;border-radius:14px;background:rgba(20,149,255,.08);border:1px solid rgba(110,190,255,.2);margin-bottom:6px}
.legal h2{font:700 17px/1.3 var(--d);letter-spacing:-.01em;margin:26px 0 8px;color:#fff}
.legal p,.legal li{color:var(--mut);font-size:14.5px;line-height:1.7;max-width:none;text-align:left}
.legal p+p{margin-top:10px}
.legal ul{margin:8px 0 0;padding-left:20px;display:grid;gap:6px}
.legal li::marker{color:var(--blue)}
.legal strong{color:#e6eefc;font-weight:600}
.legal a{color:#8cc8ff}
.legal .end{margin-top:28px;padding-top:16px;border-top:1px solid var(--line);font-size:13px}

/* =====================================================================
   v2 — Refinamento visual (início): carrossel maior, hero elegante,
   slider do app. Esta camada fica por último e sobrescreve as anteriores.
   ===================================================================== */

/* ---------- Em Alta: título discreto + carrossel grande ---------- */
.trend{padding:2px 0 0}
.trend h2{display:inline-flex;align-items:center;gap:12px;margin:0 0 14px;font:700 11.5px/1 var(--d);letter-spacing:.22em;text-transform:uppercase;color:rgba(232,243,255,.92)}
.trend h2::before,.trend h2::after{content:"";width:26px;height:1px;background:linear-gradient(90deg,transparent,rgba(190,225,255,.7))}
.trend h2::after{transform:scaleX(-1)}

/* card central ~54% da largura; os vizinhos aparecem pela metade nas laterais */
.t-stage{--tr-w:calc(54*var(--vw));--tr-h:calc(var(--tr-w)*1.5);height:calc(var(--tr-h) + 44px);perspective:calc(var(--tr-h)*3.4);perspective-origin:50% 42%}
.tc{width:var(--tr-w);height:var(--tr-h);margin-left:calc(var(--tr-w)/-2)}
.tf{border-radius:clamp(16px,calc(var(--tr-w)*.09),24px);box-shadow:0 26px 40px -20px var(--g),0 10px 24px -12px rgba(0,0,0,.7),inset 0 0 0 1px rgba(255,255,255,.14);animation:tfIn .7s cubic-bezier(.22,1,.36,1) both;animation-delay:calc(var(--i,0)*70ms)}
.tf::before{content:"";position:absolute;inset:0;z-index:1;border-radius:inherit;pointer-events:none;background:linear-gradient(180deg,rgba(255,255,255,.14),transparent 28%,transparent 70%,rgba(0,0,0,.28))}
.tf::after{z-index:2}
@keyframes tfIn{from{opacity:0;filter:blur(6px)}to{opacity:1;filter:none}}
.tn{left:0;right:0;top:calc(100% + 14px);text-align:center;font:600 15px/1.2 var(--d);letter-spacing:-.01em;color:#fff;opacity:var(--a,0);transition:opacity .2s;text-shadow:0 2px 12px rgba(0,0,0,.45)}
.t-dots,.f-dots{display:flex;justify-content:center;align-items:center;gap:6px;margin:6px 0 0}
.t-dots i,.f-dots i{width:6px;height:6px;border-radius:99px;background:rgba(255,255,255,.28);transition:width .35s cubic-bezier(.22,1,.36,1),background .3s}
.t-dots i.on,.f-dots i.on{width:20px;background:#fff}
/* esqueleto enquanto os pôsteres chegam */
.t-stage:empty::before{content:"";position:absolute;left:50%;top:0;width:var(--tr-w);height:var(--tr-h);margin-left:calc(var(--tr-w)/-2);border-radius:22px;background:linear-gradient(110deg,rgba(255,255,255,.07) 30%,rgba(255,255,255,.17) 50%,rgba(255,255,255,.07) 70%) 0 0/200% 100%;box-shadow:calc(-50*var(--vw)) 0 0 0 rgba(255,255,255,.04),calc(50*var(--vw)) 0 0 0 rgba(255,255,255,.04);animation:skSh 1.4s linear infinite}
@keyframes skSh{to{background-position:-200% 0}}

/* ---------- Hero: centralizado, títulos e botões menores ---------- */
.hero2{padding:14px 0 30px;gap:12px;justify-items:center;text-align:center}
.hero2::before{left:50%;right:auto;top:-40px;width:420px;height:300px;transform:translateX(-50%);opacity:.55}
.hero2 h1{font:700 clamp(23px,calc(6.3*var(--vw)),38px)/1.14 var(--d);letter-spacing:-.03em;max-width:17ch;text-wrap:balance;margin:0}
.hero2 h1 .hg{background:linear-gradient(90deg,#7fd0ff,#a9b6ff 60%,#c9b8ff);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.hero2 .lead{font:400 clamp(13.5px,calc(3.55*var(--vw)),15.5px)/1.6 var(--b);color:rgba(212,224,243,.86);max-width:34ch;margin:0;text-wrap:balance}
.hero2 .cta{flex-direction:column;flex-wrap:nowrap;gap:10px;width:min(100%,300px);margin:6px 0 2px}
.hero2 .cta .btn{width:100%;min-height:46px;padding:0 22px;font:700 14.5px var(--d);letter-spacing:0;gap:9px}
.hero2 .cta .btn svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;flex:none}
.hero2 .cta .btn--p{box-shadow:0 12px 26px -12px rgba(20,149,255,.85),inset 0 1px 0 rgba(255,255,255,.38)}
.hero2 .cta .btn--p svg{transition:transform .25s cubic-bezier(.22,1,.36,1)}
@media(hover:hover){.hero2 .cta .btn--p:hover svg{transform:translateX(4px)}}
.hero2 .cta .btn--g{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.2);color:#fff;font-weight:600}
.hero2 .fine{justify-content:center;gap:8px 16px;font:500 12px/1.3 var(--b);color:rgba(205,218,238,.82);max-width:340px}
.hero2 .fine span{display:inline-flex;align-items:center;gap:6px}
.hero2 .fine span::before{content:"";width:14px;height:14px;flex:none;border-radius:50%;background:rgba(67,209,138,.18) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2343d18a' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5.5 12.5l4.3 4.3L18.5 8'/%3E%3C/svg%3E") center/9px no-repeat;color:transparent}

/* ---------- Conheça o app por dentro ---------- */
.frames{--fw:min(calc(66*var(--vw)),300px);position:relative;display:flex;align-items:center;gap:14px;width:calc(100*var(--vw));margin-left:calc(50% - 50*var(--vw));padding:8px calc((100*var(--vw) - var(--fw))/2) 6px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.frames::-webkit-scrollbar{display:none}
.frame{flex:0 0 var(--fw);scroll-snap-align:center;scroll-snap-stop:always;position:relative;margin:0;padding:10px 10px 12px;border-radius:30px;background:linear-gradient(165deg,rgba(70,165,255,.24),rgba(6,16,38,.74));border:1px solid rgba(140,205,255,.3);box-shadow:0 30px 50px -30px rgba(0,0,0,.9),0 0 40px -22px rgba(20,149,255,.7),inset 0 1px 0 rgba(255,255,255,.14);transform:scale(calc(1 - var(--k,0)*.07));opacity:calc(1 - var(--k,0)*.5);transition:transform .25s ease-out,opacity .25s ease-out;cursor:pointer}
.frame--land{flex-basis:min(calc(88*var(--vw)),440px)}
.frame .fs{border-radius:21px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.07)}
.fcap{display:grid;grid-template-columns:36px 1fr 36px;align-items:center;margin-top:9px}
.fcap::before{content:""}
.frame figcaption{margin:0;text-align:center;font:700 14px/1.2 var(--d);letter-spacing:-.01em;color:#fff}
/* botão de detalhes agora fica na barra de baixo (não cobre mais o app) */
.frame .fi{position:static;grid-column:3;width:34px;height:34px;justify-self:end;top:auto;right:auto}
.frame .fp{inset:10px 10px 58px;padding:56px 16px 16px}
.frame .fp-k{top:20px;left:16px}
.frame--land .fp{padding:44px 14px 10px}.frame--land .fp-k{top:16px;left:14px}.frame--land .fp h4{font-size:16px;margin-bottom:6px}.frame--land .fp li{padding:8px 0 8px 20px}.frame--land .fp li::before{top:13px}
@media(prefers-reduced-motion:reduce){.frame{transition:none}.tf{animation:none}}

/* ---------- Ritmo geral das seções ---------- */
main>.rv{padding:24px 0}
.rv>h2{letter-spacing:-.025em}
.sub{color:rgba(205,218,238,.82)}