:root{--g:#22c26a;--g2:#3ee08a;--bg:#121212;--card:#1a1a1a;--fg:#fff;--fg2:rgba(255,255,255,.62);--line:rgba(255,255,255,.09);--wrap:1000px}
body{background:var(--bg);color:var(--fg);font-family:"Lexend",system-ui,sans-serif;font-size:15px;line-height:1.6}
.wrap{width:min(var(--wrap),100% - 40px);margin-inline:auto}
h1,h2,.stats b,.pr{font-family:"Lexend Exa","Lexend",sans-serif;font-weight:400;letter-spacing:-.02em}
.logo{display:inline-flex;align-items:center;gap:.4rem;font-size:2rem;font-weight:400;letter-spacing:-.02em;white-space:nowrap}
.logo svg{width:2rem;height:2rem}
.logo--sm{font-size:1.25rem}.logo--sm svg{width:1.25rem;height:1.25rem}
.btn{display:inline-flex;align-items:center;justify-content:center;height:44px;padding:0 1.6rem;border-radius:4px;font-weight:400;white-space:nowrap;transition:transform .25s,background .3s,box-shadow .3s}
.btn--g{background:linear-gradient(180deg,#2bd677,#1fae5f);color:#fff;height:40px;box-shadow:0 10px 30px -14px var(--g)}
.btn--g:hover{box-shadow:0 14px 36px -10px var(--g)}
.btn--k{background:#0d0d0d;color:#fff;height:36px;padding:0 1.75rem}
.btn--o{border:1px solid var(--line);color:#fff}
.btn--o:hover{background:#222}
.kick{display:inline-block;color:var(--g2);font-size:.82rem;letter-spacing:.16em;text-transform:uppercase}
.av{display:inline-grid;place-items:center;flex:none;width:34px;height:34px;border-radius:50%;background:hsl(var(--h,150) 55% 42%);color:#fff;font-size:.7rem;font-weight:600}

/* painel verde da direita (como no print) */
.greenbg{position:absolute;top:0;right:0;width:36%;height:687px;background:linear-gradient(160deg,#25c46d,#1a9d55);overflow:hidden;z-index:0}
.sheen{position:absolute;inset:-50%;background:linear-gradient(115deg,transparent 42%,rgba(255,255,255,.14) 50%,transparent 58%);animation:sheen 7s ease-in-out infinite}
@keyframes sheen{0%{transform:translateX(-40%)}60%,100%{transform:translateX(40%)}}

.hd{position:relative;z-index:30;display:flex;align-items:center;gap:2rem;width:min(980px,100% - 40px);margin:0 auto;padding:12px 0}
.hd__nav{display:flex;gap:1.7rem;margin-right:auto;margin-left:.2rem}
.hd__nav a{position:relative;display:inline-flex;align-items:center;gap:.5rem;font-size:.92rem;transition:color .3s}
.hd__nav a svg{width:14px;height:14px}
.hd__nav a.on,.hd__nav a:hover{color:var(--g)}
.hd__burger{display:none;margin-left:auto;width:42px;height:42px;flex-direction:column;justify-content:center;align-items:center;gap:5px}
.hd__burger span{width:20px;height:2px;background:#fff}
.kit-drawer__panel{background:#161616;color:#fff}
.drawer-x{align-self:flex-end;font-size:2rem;width:44px;height:44px}

.hero{position:relative;z-index:1;display:grid;grid-template-columns:1fr 1fr;width:min(980px,100% - 40px);margin:0 auto;min-height:620px;align-items:center}
.hero__txt{padding-bottom:40px}
.selo{display:inline-flex;align-items:center;gap:.55rem;padding:.45rem .7rem;border-radius:3px;background:#3a3a3a;border:1px solid #555;font-size:.78rem}
.selo i{width:11px;height:11px;border-radius:50%;border:2px solid var(--g);position:relative}
.selo i::after{content:"";position:absolute;inset:1.5px;border-radius:50%;background:var(--g);animation:led 1.8s infinite}
@keyframes led{50%{opacity:.2}}
.hero__h{margin-top:1.4rem;font-size:clamp(2rem,3.2vw,2.55rem);line-height:1.2;white-space:nowrap}
.verde{color:var(--g2)}
.hero__p{margin-top:.9rem;max-width:44ch;color:#ddd;font-size:.85rem}
.stats{display:flex;margin-top:1rem}
.stats div{padding:0 1.8rem;text-align:center;position:relative}
.stats div+div::before{content:"";position:absolute;left:0;top:34px;height:18px;width:1px;background:#bbb}
.stats div:first-child{padding-left:1.6rem}
.stats b{display:block;font-size:2.05rem;color:var(--g2)}
.stats small{display:block;max-width:12ch;margin:auto;font-size:.82rem;line-height:1.3;color:#ddd}
.hero__txt>.btn{margin-top:2.2rem}

.stage{position:relative;height:620px;perspective:1600px}
.phone{position:absolute;left:52%;top:48%;width:270px;height:540px;transform-style:preserve-3d;transform:translate(-50%,-50%) rotateX(32deg) rotateY(-18deg) rotateZ(18deg)}
.phone__body{position:absolute;inset:0;border-radius:44px;background:#0a0a0a;padding:10px;box-shadow:inset 0 0 0 2px #333,0 0 0 4px #b8bcc4,0 0 0 5px #6f7378;transform:translateZ(8px)}
.phone__side{position:absolute;inset:0;border-radius:44px;background:#5f6368;transform:translateZ(-4px) translateX(8px) translateY(6px);filter:blur(.4px)}
.phone::after{content:"";position:absolute;inset:40px -40px -60px 40px;background:rgba(0,0,0,.45);filter:blur(30px);transform:translateZ(-60px);z-index:-1}
.scr{position:relative;height:100%;border-radius:35px;background:#050505;padding:18px 16px;overflow:hidden;font-size:9px}
.scr__top{display:flex;justify-content:space-between;align-items:center}
.ham{display:grid;gap:2px;width:22px;height:22px;place-content:center;border:1px solid #555;border-radius:50%}
.ham i{width:9px;height:1px;background:#fff}
.island{width:70px;height:18px;border-radius:12px;background:#000;box-shadow:inset 0 0 0 1px #222;margin-top:-8px}
.av--me{width:24px;height:24px;font-size:7px;--h:330;border-radius:7px}
.scr__hi{margin-top:12px;font-size:9px}
.cards{position:relative;height:92px;margin-top:12px}
.cc{position:absolute;top:0;left:0;width:170px;height:92px;border-radius:9px;padding:9px 10px;display:flex;flex-direction:column;justify-content:space-between;transition:transform .8s cubic-bezier(.7,0,.2,1),opacity .8s}
.cc span{font-size:8px;font-weight:600}
.cc em{font-style:normal;font-size:8px;text-align:center;letter-spacing:.1em}
.cc__f{display:flex;gap:16px;align-items:end;font-size:6px}
.cc__f .brand{margin-left:auto;font-size:9px}
.cc--g{background:linear-gradient(135deg,#2fd27a,#19a457);color:#06331b}
.cc--w{background:#f2f2ee;color:#111}
.cc--k{background:linear-gradient(135deg,#2a2a2a,#111);border:1px solid #333}
.scr__lb{display:flex;justify-content:space-between;margin:14px 0 8px;font-size:8px;color:#ccc}
.scr__lb em{font-style:normal}
.ops{display:flex;justify-content:space-between}
.ops span{display:grid;justify-items:center;gap:3px;font-size:7px;color:#bbb}
.ops i{display:grid;place-items:center;width:26px;height:26px;border:1px solid var(--g);border-radius:8px;color:var(--g);font-style:normal;font-size:11px}
.tx li{display:flex;align-items:center;gap:8px;padding:6px 0}
.tx .av{width:26px;height:26px;font-size:7px;border-radius:8px}
.tx div{flex:1;display:grid}
.tx b{font-weight:500;font-size:8px}
.tx small{color:#888;font-size:7px}
.tx em{font-style:normal;color:#e66;font-size:8px}
.tx em.in{color:var(--g2)}
.tab{position:absolute;left:0;right:0;bottom:0;display:flex;justify-content:space-around;padding:12px 0 14px;background:#0b0b0b;border-top:1px solid #1d1d1d}
.tab i{font-style:normal;color:#888;font-size:12px}.tab i.on{color:var(--g)}
.toast{position:absolute;right:-10px;top:120px;display:flex;align-items:center;gap:.6rem;padding:.6rem .9rem .6rem .6rem;border-radius:12px;background:rgba(14,14,14,.82);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.1);box-shadow:0 20px 40px -20px #000;opacity:0;transform:translateY(-10px);transition:opacity .5s,transform .5s cubic-bezier(.2,.8,.2,1)}
.toast.on{opacity:1;transform:none}
.toast b{display:block;font-size:.82rem;font-weight:500}
.toast small{font-size:.75rem;color:var(--fg2)}

section{position:relative}
.head{margin-bottom:2.6rem}
.head--c{text-align:center}
h2{margin-top:.7rem;font-size:clamp(1.7rem,3vw,2.3rem);line-height:1.2}
.sobre{padding:150px 0 110px}
.manif{margin-top:1.4rem;font-family:"Lexend Exa","Lexend",sans-serif;font-size:clamp(1.3rem,2.5vw,1.95rem);line-height:1.45;letter-spacing:-.02em}
.manif .fw{color:rgba(255,255,255,.14);transition:color .35s}
.manif .fw.on{color:#fff}
.manif .fw.on.k{color:var(--g2)}

.recursos{padding:40px 0 120px}
.bento{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:12px}
.b{position:relative;padding:26px;border-radius:16px;background:var(--card);border:1px solid var(--line);overflow:hidden}
.b h3{font-size:1.05rem;font-weight:500}
.b p{color:var(--fg2);font-size:.88rem}
.b--big{grid-row:span 2;display:flex;flex-direction:column}
.chart{width:100%;height:170px;margin-top:auto}
.b__val{font-family:"Lexend Exa";font-size:1.6rem;margin-top:.4rem}
.b__val small{display:block;font-family:"Lexend";font-size:.72rem;color:var(--fg2)}
.ico{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;border:1px solid var(--g);color:var(--g);margin-bottom:2rem}
.pixbar{height:4px;border-radius:4px;background:#2a2a2a;margin-top:1.4rem;overflow:hidden}
.pixbar i{display:block;height:100%;width:40%;background:var(--g);animation:pix 1.6s cubic-bezier(.6,0,.3,1) infinite}
@keyframes pix{0%{transform:translateX(-100%)}100%{transform:translateX(260%)}}
.zero{margin-top:1rem;font-family:"Lexend Exa";font-size:1.7rem;color:var(--g2)}
.b--wide{grid-column:2/4;display:grid;grid-template-columns:1fr 1.3fr;gap:1rem;align-items:end}
.bars{display:flex;gap:10px;align-items:end;height:120px}
.bars span{position:relative;flex:1;height:100%;border-radius:6px;background:#222;overflow:hidden}
.bars span::before{content:"";position:absolute;left:0;right:0;bottom:0;height:calc(var(--v)*100%);background:linear-gradient(var(--g2),#178c4b);transform-origin:bottom;transform:scaleY(var(--s,0));transition:transform 1.1s cubic-bezier(.2,.8,.2,1)}
.bars i{position:absolute;left:0;right:0;bottom:6px;text-align:center;font-style:normal;font-size:.62rem;color:#062;z-index:1;mix-blend-mode:normal;color:#fff}

.passos__pin{height:100vh;display:flex;align-items:center}
.passos__grid{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:center}
.pl{margin-top:1.4rem}
.pl li{display:grid;grid-template-columns:56px 1fr;padding:22px 0;border-bottom:1px solid var(--line);opacity:.3;transition:opacity .5s}
.pl li.on{opacity:1}
.pl span{font-family:"Lexend Exa";color:var(--g2)}
.pl h3{font-size:1.2rem;font-weight:500}
.pl p{color:var(--fg2)}
.mini{justify-self:center;width:250px;height:500px;border-radius:40px;padding:10px;background:#0a0a0a;box-shadow:0 0 0 3px #b8bcc4,0 0 0 4px #6f7378,0 40px 80px -30px rgba(34,194,106,.4)}
.mini__scr{position:relative;height:100%;border-radius:31px;background:#050505;overflow:hidden}
.ms{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;gap:1.2rem;text-align:center;opacity:0;transform:translateY(30px) scale(.96);transition:opacity .6s,transform .7s cubic-bezier(.2,.8,.2,1)}
.ms.on{opacity:1;transform:none}
.ms b{font-weight:500}
.ms__logo{display:grid;place-items:center;width:70px;height:70px;border-radius:20px;background:var(--g);color:#06331b;font-size:1.4rem}
.prog{width:140px;height:4px;border-radius:4px;background:#222;overflow:hidden}
.prog i{display:block;height:100%;width:100%;background:var(--g);transform-origin:left;animation:prog 2.4s ease-in-out infinite}
@keyframes prog{0%{transform:scaleX(0)}80%,100%{transform:scaleX(1)}}
.face{position:relative;width:130px;height:130px}
.face svg{width:100%;height:100%;animation:spin 14s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.scanl{position:absolute;left:10%;right:10%;height:2px;background:var(--g2);box-shadow:0 0 12px var(--g2);animation:scan 1.8s ease-in-out infinite alternate}
@keyframes scan{from{top:15%}to{top:85%}}
.cc--mini{position:relative;width:180px;height:110px}

.cartao{padding:130px 0}
.cartao__grid{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:center}
.sub{color:var(--fg2);margin-top:1rem}
.cores{display:flex;gap:.8rem;margin-top:1.8rem;flex-wrap:wrap}
.cores button{display:inline-flex;align-items:center;gap:.5rem;padding:.4rem .9rem .4rem .4rem;border-radius:999px;border:1px solid var(--line);font-size:.85rem;transition:border-color .3s,background .3s}
.cores button::before{content:"";width:22px;height:22px;border-radius:50%;background:var(--c);box-shadow:inset 0 0 0 1px rgba(255,255,255,.2)}
.cores button[aria-checked=true]{border-color:var(--g);background:rgba(34,194,106,.08)}
.card3d{perspective:1200px;justify-self:center;width:min(380px,100%);aspect-ratio:1.586}
.card3d__in{position:relative;width:100%;height:100%;transform-style:preserve-3d;transition:transform .9s cubic-bezier(.3,.9,.2,1)}
.card3d:hover .card3d__in,.card3d.flip .card3d__in{transform:rotateY(180deg)}
.face3{position:absolute;inset:0;border-radius:18px;backface-visibility:hidden;padding:24px;overflow:hidden;transition:background .6s,color .6s;box-shadow:0 30px 60px -25px rgba(0,0,0,.8)}
.face3::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.22) 45%,transparent 60%);transform:translateX(var(--sx,-60%));transition:transform .2s}
.front{display:grid;grid-template-rows:auto 1fr auto auto}
.chip{width:44px;height:34px;border-radius:7px;background:linear-gradient(135deg,#e8d39a,#a8904f)}
.front .brand{position:absolute;right:24px;top:22px;font-size:1.4rem}
.front em{font-style:normal;font-family:"Lexend Exa";letter-spacing:.12em;font-size:1.05rem;align-self:end}
.front small{margin-top:.4rem;letter-spacing:.14em;font-size:.72rem}
.nfc{position:absolute;right:26px;top:50%;transform:translateY(-50%) rotate(0);font-size:.9rem;opacity:.7}
.back{transform:rotateY(180deg);display:flex;flex-direction:column;gap:1rem;padding:24px 0}
.mag{height:44px;background:#0a0a0a}
.sig{display:flex;align-items:center;margin:0 24px;height:38px;background:repeating-linear-gradient(-45deg,#f4f4f0 0 6px,#e6e6e0 6px 12px);color:#333;font-size:.7rem;padding:0 10px;justify-content:space-between}
.back small{margin:0 24px;font-size:.62rem;opacity:.75}
.card3d[data-c=g] .face3{background:linear-gradient(135deg,#2fd27a,#158c49);color:#04301a}
.card3d[data-c=k] .face3{background:linear-gradient(135deg,#2c2c2c,#0b0b0b);color:#eee}
.card3d[data-c=w] .face3{background:linear-gradient(135deg,#f6f6f2,#d6d6cf);color:#111}
.card3d[data-c=m] .face3{background:linear-gradient(135deg,#e9d7a3,#9c8248 60%,#d7c28a);color:#2a2208}

.seg{padding:110px 0;background:#0e0e0e}
.seg__grid{display:grid;grid-template-columns:1fr 1.1fr;gap:4rem;align-items:center}
.cofre{position:relative;aspect-ratio:1;max-width:380px;display:grid;place-items:center}
.cofre__ring{position:absolute;inset:0;border-radius:50%;border:1px dashed rgba(34,194,106,.4);animation:spin 40s linear infinite}
.cofre__ring.r2{inset:16%;border:1px solid rgba(34,194,106,.25);border-top-color:var(--g);animation-duration:6s}
.lock{display:grid;place-items:center;width:110px;height:110px;border-radius:28px;background:radial-gradient(circle at 30% 25%,#2a2a2a,#121212);border:1px solid #2c2c2c;color:var(--g2);box-shadow:0 0 60px -10px rgba(34,194,106,.5)}
.lock svg{width:48px;height:48px}
.cofre code{position:absolute;bottom:14%;font-family:ui-monospace,Menlo,monospace;color:var(--g2);font-size:.9rem;letter-spacing:.12em}
.segl{margin-top:1.6rem;display:grid;gap:12px}
.segl li{padding:16px 18px;border-radius:12px;background:var(--card);border:1px solid var(--line);color:var(--fg2)}
.segl b{display:block;color:#fff;font-weight:500}

.planos{padding:120px 0}
.pl3{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;align-items:stretch}
.pl3 article{position:relative;display:flex;flex-direction:column;padding:30px;border-radius:16px;background:var(--card);border:1px solid var(--line)}
.pl3 article.hot{background:linear-gradient(180deg,#14361f,#151515 60%);border-color:rgba(34,194,106,.5)}
.badge{position:absolute;top:-12px;left:30px;padding:.2rem .7rem;border-radius:999px;background:var(--g);color:#04301a;font-size:.72rem;font-weight:600}
.pl3 h3{font-weight:500}
.pr{margin:.8rem 0 1.4rem;font-size:1.9rem}
.pr small{font-family:"Lexend";font-size:.85rem;color:var(--fg2)}
.pl3 ul{display:grid;gap:.6rem;margin-bottom:2rem;color:var(--fg2)}
.pl3 li::before{content:"✓";color:var(--g2);margin-right:.6rem}
.pl3 .btn{margin-top:auto}

.depo{padding:60px 0 120px;overflow:hidden}
.depo__row{display:flex;gap:12px;padding:0 max(20px,calc((100% - var(--wrap))/2));cursor:grab;user-select:none}
.depo__row:active{cursor:grabbing}
.depo figure{flex:none;width:340px;padding:28px;border-radius:16px;background:var(--card);border:1px solid var(--line);display:flex;flex-direction:column;justify-content:space-between;gap:1.6rem}
.depo blockquote{font-size:1.02rem}
.depo figcaption{display:flex;align-items:center;gap:.7rem;color:var(--fg2);font-size:.85rem}
.faq{padding:80px 0}
.faq__grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:3rem}
.acc__icon{color:var(--g);border-color:var(--line)!important}
.cta{padding:60px 0 110px}
.cta__box{display:flex;justify-content:space-between;align-items:center;gap:2rem;padding:48px;border-radius:20px;background:linear-gradient(140deg,#25c46d,#178c4b);color:#04301a;overflow:hidden;position:relative}
.cta__box::after{content:"";position:absolute;right:-80px;top:-120px;width:340px;height:340px;border-radius:50%;border:50px solid rgba(255,255,255,.1)}
.cta__box h2{margin:0}
.cta__box p{margin-top:.5rem}
.cta__b{position:relative;z-index:1;display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end;max-width:380px}
.store{display:inline-flex;align-items:center;gap:.6rem;padding:.5rem 1rem;border-radius:10px;background:#0b0b0b;color:#fff;line-height:1.1;font-size:.95rem}
.store small{display:block;font-size:.62rem;opacity:.7}
.apl{width:14px;height:17px;border-radius:50% 50% 45% 45%;background:#fff}
.cta__b .btn--k{height:48px;border-radius:10px}
.ft{padding:28px 0;border-top:1px solid var(--line)}
.ft__in{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem;color:var(--fg2);font-size:.82rem}

@media (max-width:980px){
  .hd__nav,.hd__cta{display:none}.hd__burger{display:flex}
  .greenbg{width:100%;height:520px;top:auto;bottom:auto;top:640px}
  .hero{grid-template-columns:1fr;padding-top:30px}
  .hero__h{white-space:normal}
  .stage{height:520px}
  .toast{right:0;top:30px}
  .bento{grid-template-columns:1fr 1fr}.b--big{grid-column:1/-1;grid-row:auto}.b--wide{grid-column:1/-1}
  .passos__pin{height:auto;padding:80px 0}
  .passos__grid,.cartao__grid,.seg__grid,.faq__grid{grid-template-columns:1fr}
  .pl3{grid-template-columns:1fr}
  .cta__box{flex-direction:column;align-items:flex-start}.cta__b{justify-content:flex-start}
}
@media (max-width:560px){
  .stats div{padding:0 .8rem}.stats div:first-child{padding-left:0}
  .stats b{font-size:1.5rem}
  .phone{transform:translate(-50%,-50%) scale(.85) rotateX(28deg) rotateY(-14deg) rotateZ(14deg)}
  .bento{grid-template-columns:1fr}.b--wide{grid-template-columns:1fr}
  .depo figure{width:280px}
  .cta__box{padding:32px 24px}
}
