:root{
  --fund:#002813;--prof:#00150A;--acao:#00A859;--nobre:#E6E7E8;--preto:#231F20;--wa:#25D366;--alerta:#B50000;
  --claro:#F1F3F2;--mut-d:#9aaba1;--mut-l:#4a5a50;
  --r:20px;--gut:20px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:Montserrat,system-ui,sans-serif;font-size:17px;line-height:1.65;color:var(--preto);background:var(--prof);overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
ul,ol{list-style:none}
b,strong{font-weight:700}
:focus-visible{outline:3px solid var(--acao);outline-offset:3px;border-radius:6px}
.skip{position:absolute;left:-999px;top:8px;background:var(--acao);color:#fff;padding:10px 16px;border-radius:10px;z-index:100;font-weight:700}
.skip:focus{left:8px}
.wrap{width:100%;max-width:1180px;margin:0 auto;padding:0 var(--gut)}
.wrap.narrow{max-width:820px}

/* marca */
.nm{white-space:nowrap;font-weight:800;letter-spacing:-.01em}
.nm b{font-weight:800}.nm i{font-style:normal;color:var(--acao);font-weight:800}
.dark .nm b,.top .nm b,.foot .nm b,.final .nm b,.phone .nm b{color:#fff}
.light .nm b{color:var(--fund)}
.g{color:var(--acao)}

/* tipografia */
.eyebrow,.tn,.pilar,.sbar,.micro,.sn{font-family:"JetBrains Mono",ui-monospace,monospace}
.eyebrow{font-size:12px;letter-spacing:.3em;text-transform:uppercase;color:var(--acao);font-weight:500;margin-bottom:18px}
h1,h2,h3{font-weight:900;text-transform:uppercase;letter-spacing:-.02em;line-height:1.06}
h1{font-size:clamp(38px,9.4vw,76px)}
h2{font-size:clamp(30px,7vw,54px);margin-bottom:24px}
h3{font-size:clamp(24px,5.2vw,34px)}
.lead{font-size:clamp(18px,2.6vw,22px);line-height:1.55;font-weight:500;max-width:46ch;margin-bottom:24px}
.dark .lead{color:#c8d4cc}.light .lead{color:var(--mut-l)}
.micro{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--mut-d);margin-top:14px;font-weight:500}
.light .micro{color:var(--mut-l)}

/* seções */
.sec{position:relative;padding:72px 0;isolation:isolate}
.sec::before{content:"";position:absolute;inset:0;z-index:-1;background-size:54px 54px;pointer-events:none}
.dark{background:radial-gradient(ellipse at 85% 0%,#00411f 0%,#002813 40%,#00150A 100%);color:var(--nobre)}
.dark::before{background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px)}
.light{background:var(--claro);color:var(--fund)}
.light::before{background-image:linear-gradient(rgba(0,40,19,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(0,40,19,.055) 1px,transparent 1px)}
.light p,.light li{color:#26382d}
.two{display:grid;gap:40px;align-items:center}

/* botões */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;background:var(--wa);color:#04210f;font-weight:800;text-decoration:none;border-radius:999px;padding:14px 26px;font-size:16px;line-height:1.2;text-align:center;transition:transform .25s cubic-bezier(.32,.72,0,1),box-shadow .25s;box-shadow:0 10px 30px rgba(37,211,102,.25)}
.btn:hover{transform:translateY(-2px);box-shadow:0 14px 36px rgba(37,211,102,.38)}
.btn:active{transform:scale(.98)}
.btn.lg{padding:18px 32px;font-size:18px}
.btn.sm{padding:11px 20px;font-size:14px}
.btn.full{width:100%}
.wai{width:22px;height:22px;flex:none}
.ghost{background:none;border:1.5px solid rgba(255,255,255,.35);color:var(--nobre);font:700 15px Montserrat,sans-serif;border-radius:999px;padding:15px 24px;cursor:pointer;transition:border-color .2s,background .2s}
.ghost:hover{border-color:var(--acao);background:rgba(0,168,89,.12)}
.ctas{display:flex;flex-wrap:wrap;gap:14px;align-items:center}

/* header */
.top{position:sticky;top:0;z-index:50;background:rgba(0,21,10,.82);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid rgba(255,255,255,.08);color:#fff}
.bar{display:flex;align-items:center;justify-content:space-between;gap:12px;height:68px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;font-size:20px}
.brand img{width:44px;height:44px}
.nav{display:none;gap:30px}
.nav a{font-size:14px;font-weight:600;text-decoration:none;color:#c8d4cc}
.nav a:hover{color:var(--acao)}
.hdrbtn{display:none}

/* hero */
.hero{padding:44px 0 72px}
.herogrid{display:grid;gap:44px}
.hero h1{margin-bottom:22px}
.sub{font-size:clamp(19px,3vw,24px);font-weight:500;color:#d6e0d9;max-width:30ch;margin-bottom:30px;line-height:1.5}
.hero .micro{margin-top:18px}
.heroph{display:flex;justify-content:center}

/* telefone */
.phone{position:relative;width:min(100%,330px);aspect-ratio:9/18;background:#0A1A12;border:9px solid #0b0b0b;border-radius:46px;overflow:hidden;box-shadow:0 40px 80px rgba(0,0,0,.45),0 0 0 1.5px rgba(255,255,255,.08);display:flex;flex-direction:column;color:#EAF2ED}
.light .phone{box-shadow:0 36px 70px rgba(0,40,19,.3),0 0 0 1.5px rgba(255,255,255,.08)}
.notch{position:absolute;top:8px;left:50%;transform:translateX(-50%);width:84px;height:24px;background:#000;border-radius:20px;z-index:3}
.sbar{height:42px;display:flex;justify-content:space-between;align-items:center;padding:8px 24px 0;font-size:12px;font-weight:700;color:#fff;flex:none}
.bat{width:22px;height:11px;border:1.5px solid #fff;border-radius:3px;position:relative}
.bat::after{content:"";position:absolute;inset:1.5px;right:5px;background:#fff;border-radius:1px}
.wahead{display:flex;align-items:center;gap:10px;padding:8px 14px 10px;background:#0F2419;border-bottom:1px solid rgba(255,255,255,.07);flex:none}
.wahead img{width:34px;height:34px}
.wahead .whn{display:block;font-size:15px;line-height:1.2;white-space:nowrap}
.wahead span{font-size:11px;color:var(--acao);font-weight:600}
.chat{flex:1;overflow:hidden;padding:12px 10px;display:flex;flex-direction:column;gap:8px;background:radial-gradient(circle at 80% 10%,rgba(0,168,89,.10),transparent 50%),#0A1A12}
.m{max-width:90%;padding:9px 12px 20px;border-radius:16px;font-size:13px;line-height:1.38;color:#EAF2ED;font-weight:500;position:relative;overflow-wrap:anywhere}
.m b{color:#fff;font-weight:800}
.m.me{align-self:flex-end;background:#0B6B45;border-bottom-right-radius:5px}
.m.bt{align-self:flex-start;background:#17271F;border-bottom-left-radius:5px}
.m.short{padding-bottom:20px}
.tk{position:absolute;right:10px;bottom:5px;font-size:9.5px;color:rgba(255,255,255,.55);font-weight:600}
.aud{display:flex;align-items:center;gap:8px}
.play{width:0;height:0;border-left:11px solid #fff;border-top:7px solid transparent;border-bottom:7px solid transparent;flex:none}
.wv{display:flex;align-items:center;gap:2px;flex:1;height:22px}
.wv i{display:block;width:2.5px;background:rgba(255,255,255,.85);border-radius:2px}
.dur{font-size:11px;font-weight:700;color:rgba(255,255,255,.7)}
.q{margin-top:6px;font-style:italic;font-size:12px;color:rgba(235,244,238,.85)}
.ph-photo{height:64px;border-radius:10px;margin-bottom:8px;background:linear-gradient(160deg,#2F4A3B,#13261C);display:flex;align-items:flex-end;padding:6px 8px}
.ph-photo span{font-size:10px;color:rgba(255,255,255,.7);font-weight:600}
.cardimg{margin-top:6px;border-radius:10px;width:100%}
.vid{position:relative;margin-top:6px}
.vid img{border-radius:10px;width:100%;object-fit:cover;max-height:110px}
.vid .pl{position:absolute;left:50%;top:50%;width:34px;height:34px;transform:translate(-50%,-50%);background:rgba(0,0,0,.5);border-radius:50%}
.vid .pl::after{content:"";position:absolute;left:13px;top:9px;border-left:12px solid #fff;border-top:8px solid transparent;border-bottom:8px solid transparent}
.nw{white-space:nowrap;font-size:11.5px}

/* animação do chat */
.js .chat .m{opacity:0;transform:translateY(10px)}
.js .chat.go .m{animation:in .5s cubic-bezier(.32,.72,0,1) forwards;animation-delay:calc(var(--i)*.85s + .2s)}
@keyframes in{to{opacity:1;transform:none}}

/* dor */
.dores{display:grid;gap:14px;margin:34px 0 10px}
.dores li{display:flex;gap:18px;align-items:flex-start;padding:20px 22px;border-radius:var(--r);background:rgba(0,40,19,.07);border:1px solid rgba(0,40,19,.13);font-weight:600;font-size:18px;color:var(--fund)}
.dores span{font-family:"JetBrains Mono",monospace;color:var(--acao);font-weight:500;font-size:18px;flex:none}
.punch{font-size:clamp(24px,5vw,38px);font-weight:900;text-transform:uppercase;letter-spacing:-.02em;line-height:1.12;margin-top:36px;color:var(--fund)!important}

/* passos */
.steps{display:grid;gap:18px;margin:36px 0 8px}
.steps li{padding:28px;border-radius:28px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12)}
.sn{display:inline-flex;width:38px;height:38px;border-radius:50%;background:var(--acao);color:#fff;align-items:center;justify-content:center;font-weight:700;margin-bottom:16px}
.steps h3{font-size:26px;margin-bottom:8px}
.steps p{color:#c8d4cc}
.note{margin-top:22px;max-width:62ch;color:#c8d4cc}

/* funções */
.explorer{display:grid;gap:26px;margin-top:34px}
.tablist{display:flex;gap:8px;overflow-x:auto;padding:4px 2px 14px;margin:0 calc(var(--gut)*-1);padding-left:var(--gut);padding-right:var(--gut);scroll-snap-type:x proximity;scrollbar-width:thin}
.pilar{display:none}
.tab{flex:none;scroll-snap-align:start;display:flex;align-items:center;gap:10px;background:rgba(0,40,19,.07);border:1px solid rgba(0,40,19,.15);color:var(--fund);font:700 14px Montserrat,sans-serif;border-radius:999px;padding:11px 18px;cursor:pointer;text-align:left;white-space:nowrap;transition:background .2s,color .2s}
.tab .tn{font-size:12px;color:var(--acao);font-weight:500}
.tab[aria-selected="true"]{background:var(--fund);color:#fff;border-color:var(--fund)}
.tab:hover{background:rgba(0,40,19,.14)}
.tab[aria-selected="true"]:hover{background:var(--fund)}
.panel{display:grid;gap:34px;align-items:center}
.panel[hidden]{display:none}
.ptxt h3{margin-bottom:18px;color:var(--fund)}
.faz{font-size:17px;max-width:52ch;margin-bottom:18px}
.faz b{color:var(--fund)}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:20px}
.chips li{font-family:"JetBrains Mono",monospace;font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:500;padding:8px 14px;border-radius:999px;background:rgba(0,168,89,.14);color:var(--fund)!important;border:1px solid rgba(0,168,89,.4)}
.dark .chips li{color:#fff!important}
.chips.big li{font-size:14px;padding:11px 18px}
.da{font-weight:800;font-size:19px;color:var(--fund)!important;margin-bottom:24px;max-width:40ch;line-height:1.4}
.pph{display:flex;justify-content:center}

/* checks */
.checks{display:grid;gap:12px}
.checks li{position:relative;padding:18px 22px 18px 56px;border-radius:var(--r);background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);color:#d6e0d9}
.checks li::before{content:"";position:absolute;left:22px;top:24px;width:14px;height:14px;border-radius:50%;background:var(--acao)}
.checks b{color:#fff}
.dark .micro{margin-top:16px}
#oferta .btn{margin-top:6px}

/* quem faz */
.whofig{position:relative;max-width:420px;margin:0 auto}
.whofig>img:first-child{border-radius:28px;width:100%;object-fit:cover;aspect-ratio:4/5;box-shadow:0 30px 60px rgba(0,40,19,.25)}
.mascot{position:absolute;right:-14px;bottom:-24px;width:38%;filter:drop-shadow(0 14px 22px rgba(0,40,19,.35))}
.who p{margin-bottom:14px;max-width:56ch}
.nums{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:24px 0}
.nums li{padding:16px 12px;border-radius:18px;background:rgba(0,40,19,.07);border:1px solid rgba(0,40,19,.13)}
.nums b{display:block;font-weight:900;font-size:clamp(18px,4.4vw,26px);color:var(--fund);line-height:1.1}
.nums span{display:block;font-size:12px;line-height:1.35;margin-top:6px;color:var(--mut-l)}
.cargos{display:grid;gap:8px;margin-bottom:22px}
.cargos li{padding-left:28px;position:relative;font-weight:600}
.cargos li::before{content:"";position:absolute;left:0;top:.6em;width:11px;height:11px;border-radius:50%;background:var(--acao)}
.punch2{font-size:20px;font-weight:600;color:var(--fund)!important;margin-bottom:22px}
.punch2 .g{color:var(--acao)!important;font-weight:800}

/* imersão */
.imgrid{display:grid;gap:34px;margin-top:20px}
.imtxt .lead{margin-bottom:16px}
.imtxt p{margin-bottom:14px;max-width:54ch}
.imtxt .chips{margin:20px 0 14px}
.imtxt .btn{margin-top:6px}
.bento{display:grid;grid-template-columns:1fr 1fr;gap:10px;align-content:start}
.bento img{width:100%;height:100%;object-fit:cover;border-radius:20px;aspect-ratio:4/3;border:1px solid rgba(0,40,19,.13)}
.bento .b1{grid-column:1/-1;aspect-ratio:16/10;object-position:78% 30%}

/* faq */
.faq{display:grid;gap:10px;margin-top:30px}
details{border-radius:var(--r);background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12)}
summary{cursor:pointer;list-style:none;padding:18px 56px 18px 22px;font-weight:700;font-size:17px;position:relative;color:#fff}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";position:absolute;right:22px;top:50%;transform:translateY(-50%);font-size:26px;font-weight:400;color:var(--acao);transition:transform .25s}
details[open] summary::after{transform:translateY(-50%) rotate(45deg)}
details p{padding:0 22px 20px;color:#c8d4cc;max-width:62ch}

/* final */
.final{background:radial-gradient(ellipse at 50% 0%,#00411f 0%,#002813 45%,#00150A 100%);color:var(--nobre);padding:84px 0 96px;position:relative;isolation:isolate}
.final::before{content:"";position:absolute;inset:0;z-index:-1;background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:54px 54px}
.center{text-align:center;display:flex;flex-direction:column;align-items:center}
.coin{width:140px;height:140px;margin-bottom:26px;filter:drop-shadow(0 20px 40px rgba(0,0,0,.5))}
.e1{font-size:clamp(28px,6.6vw,56px);font-weight:900;text-transform:uppercase;letter-spacing:-.02em;line-height:1.08;max-width:16ch}
.e2{font-size:clamp(22px,4.6vw,38px);font-weight:900;color:var(--acao);margin-top:18px;letter-spacing:-.01em}
.e3{font-size:clamp(18px,3.4vw,26px);font-weight:600;margin:10px 0 34px}
.ps{max-width:60ch;margin-top:44px;padding-top:30px;border-top:1px solid rgba(255,255,255,.14);color:#c8d4cc;text-align:left;font-size:16px}
.ps b{color:#fff}
.sig{display:inline-block;margin-top:12px;font-weight:800;color:#fff}

/* rodapé */
.foot{background:var(--prof);color:#c8d4cc;padding:34px 0 120px;border-top:1px solid rgba(255,255,255,.08)}
.fbar{display:flex;flex-direction:column;gap:18px;align-items:flex-start}
.contact{display:flex;flex-wrap:wrap;gap:8px 14px;font-family:"JetBrains Mono",monospace;font-size:13px;letter-spacing:.06em}
.contact a{text-decoration:none}
.contact a:hover{color:var(--acao)}
.contact span{opacity:.4}

/* barra fixa mobile */
.stick{position:fixed;left:0;right:0;bottom:0;z-index:60;padding:10px var(--gut) calc(10px + env(safe-area-inset-bottom));background:linear-gradient(to top,rgba(0,21,10,.96) 60%,transparent);transform:translateY(110%);transition:transform .35s cubic-bezier(.32,.72,0,1);pointer-events:none}
.stick.on{transform:none;pointer-events:auto}

/* vídeo */
dialog{border:none;background:#000;border-radius:20px;padding:0;width:min(92vw,420px);max-height:92vh;overflow:hidden;color:#fff}
dialog::backdrop{background:rgba(0,10,5,.82)}
dialog video{display:block;width:100%;max-height:88vh;background:#000}
.vclose{position:absolute;right:10px;top:10px;z-index:2;width:42px;height:42px;border-radius:50%;border:none;background:rgba(0,0,0,.6);color:#fff;font-size:28px;line-height:1;cursor:pointer}

/* desktop */
@media(min-width:900px){
  :root{--gut:32px}
  body{font-size:18px}
  .sec{padding:104px 0}
  .nav{display:flex}.hdrbtn{display:inline-flex}
  .herogrid{grid-template-columns:1.15fr .85fr;align-items:center;gap:56px}
  .hero{padding:72px 0 104px}
  .two{grid-template-columns:1fr 1fr;gap:64px}
  .who{grid-template-columns:.8fr 1.2fr}
  .dores{grid-template-columns:1fr 1fr}
  .steps{grid-template-columns:repeat(3,1fr)}
  .explorer{grid-template-columns:300px 1fr;gap:48px;align-items:start}
  .tablist{flex-direction:column;overflow:visible;margin:0;padding:0;gap:6px;position:sticky;top:92px}
  .pilar{display:block;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--mut-l);margin:16px 0 4px;font-weight:500}
  .pilar:first-child{margin-top:0}
  .pilar span{display:inline-block;background:var(--acao);color:#fff;padding:2px 8px;border-radius:999px;margin-right:8px}
  .tab{border-radius:16px;white-space:normal;padding:12px 16px}
  .panel{grid-template-columns:1fr 340px}
  .imgrid{grid-template-columns:1fr 1fr;align-items:center;gap:56px}
  .stick{display:none}
  .foot{padding-bottom:40px}
  .fbar{flex-direction:row;justify-content:space-between;align-items:center}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .js .chat .m{opacity:1;transform:none;animation:none!important}
  .btn,.stick{transition:none}
}
.light .phone .nm b,.dark .phone .nm b{color:#fff}
@media(max-width:480px){.btn.lg{font-size:15.5px;padding:17px 18px;gap:8px}.btn.lg .wai{width:20px;height:20px}.hero .ctas .btn,#oferta .btn,.imtxt .btn,.final .btn{width:100%}}
/* capa premium */
.nav a{color:#fff;font-weight:800}
.nav a:hover{color:var(--acao)}
.tag{display:inline-flex;align-items:center;gap:10px;padding:9px 16px 9px 12px;border-radius:999px;background:rgba(0,168,89,.12);border:1px solid rgba(0,168,89,.55);color:var(--acao);font:700 12px "JetBrains Mono",monospace;letter-spacing:.2em;text-transform:uppercase;margin-bottom:26px;line-height:1.3}
.tag i{width:8px;height:8px;border-radius:50%;background:var(--acao);box-shadow:0 0 0 4px rgba(0,168,89,.25);flex:none}
.hero h1{margin-bottom:22px}
.hero .sub{font-weight:700;font-size:clamp(21px,3.2vw,28px);color:#fff;margin-bottom:30px;max-width:none}
.pbtn{display:inline-flex;align-items:center;gap:16px;background:var(--wa);color:#04210f;text-decoration:none;font-weight:800;font-size:16px;border-radius:999px;padding:7px 7px 7px 28px;box-shadow:0 12px 34px rgba(37,211,102,.28);transition:transform .35s cubic-bezier(.32,.72,0,1),box-shadow .35s}
.pbtn .ic{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:#04210f;color:var(--wa);transition:transform .35s cubic-bezier(.32,.72,0,1)}
.pbtn .wai{width:22px;height:22px}
.pbtn:hover{transform:translateY(-2px);box-shadow:0 16px 40px rgba(37,211,102,.4)}
.pbtn:hover .ic{transform:scale(1.08) rotate(-8deg)}
.pbtn:active{transform:scale(.98)}
.hero .micro{color:#fff;font-weight:800;margin-top:20px}
.hero .ctas{gap:16px}

/* faixa das 10 funções */
.band{margin-top:64px;display:grid;gap:12px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.row{overflow:hidden}
.trk{display:flex;gap:12px;width:max-content;animation:mq 46s linear infinite}
.r2 .trk{animation-direction:reverse;animation-duration:52s}
.band:hover .trk{animation-play-state:paused}
@keyframes mq{to{transform:translateX(-50%)}}
.fp{display:inline-flex;align-items:center;gap:12px;white-space:nowrap;padding:14px 24px 14px 18px;border-radius:999px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);font-weight:700;font-size:15px;color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.08)}
.fp b{font:700 12px "JetBrains Mono",monospace;color:var(--acao);letter-spacing:.06em}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@media(prefers-reduced-motion:reduce){
  .trk{animation:none;flex-wrap:wrap;width:auto}
  .trk>.fp:nth-child(n+6){display:none}
  .row{overflow:visible}
  .band{-webkit-mask-image:none;mask-image:none}
}

/* hero em camadas */
.hero{overflow-x:clip}
.heroph{display:flex;justify-content:center}
.stage{position:relative;width:min(100%,430px);height:620px;margin:0 auto;perspective:1200px}
.pl{position:absolute;will-change:transform;transform:translate3d(0,var(--y,0px),0)}
.stage .coin{width:340px;height:340px;left:-70px;top:-14px;opacity:.95;filter:drop-shadow(0 30px 50px rgba(0,0,0,.5)) saturate(1.05);transform:translate3d(0,var(--y,0px),0) rotate(-14deg)}
.stage .phn{left:50%;top:26px;margin-left:-135px;width:270px}
.stage .phn .phone{width:100%}
.fc{z-index:3;width:216px}
.fc .bob{padding:12px 14px 13px;border-radius:18px;background:rgba(10,26,18,.78);border:1px solid rgba(255,255,255,.18);box-shadow:0 18px 40px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.1);animation:bob 6s ease-in-out infinite}
.fc .b2{animation-delay:-2s}.fc .b3{animation-delay:-4s}
.fc p{font-size:13px;line-height:1.4;font-weight:600;color:#fff;margin:4px 0 0}
.ft{font:700 10.5px "JetBrains Mono",monospace;letter-spacing:.16em;text-transform:uppercase;color:var(--mut-d)}
.ft.ok{color:var(--acao)}
.c1{left:-46px;top:150px}
.c2{right:-38px;top:300px}
.c3{right:-6px;top:512px;width:200px}
.stage .duo{left:-34px;bottom:-26px;height:300px;width:auto;z-index:4;filter:drop-shadow(0 22px 26px rgba(0,0,0,.55))}
@keyframes bob{50%{transform:translateY(-8px)}}
@media(max-width:899px){
  .stage{width:min(100%,360px);height:560px}
  .stage .coin{width:240px;height:240px;left:-34px;top:0}
  .stage .phn{width:236px;margin-left:-118px}
  .fc{width:176px}.fc p{font-size:12px}
  .c1{left:-12px;top:120px}.c2{right:-8px;top:270px}.c3{display:none}
  .stage .duo{height:210px;left:-12px;bottom:-14px}
}
@media(prefers-reduced-motion:reduce){.fc .bob{animation:none}.pl{transform:none!important}.stage .coin{transform:rotate(-14deg)!important}}
/* composição final do hero em camadas */
@media(min-width:900px){
  .herogrid{grid-template-columns:1fr 1fr}
  .stage{width:min(100%,540px);height:640px}
  .stage .coin{width:280px;height:280px;left:auto;right:-6px;top:-34px;transform:translate3d(0,var(--y,0px),0) rotate(12deg)}
  .stage .phn{left:auto;right:34px;margin-left:0;top:34px;width:270px}
  .c1{left:0;top:128px;width:206px}
  .c2{left:-8px;top:292px;width:206px;right:auto}
  .c3{right:-4px;left:auto;top:520px;width:204px}
  .stage .duo{left:18px;bottom:-30px;height:270px}
}
@media(prefers-reduced-motion:reduce){.stage .coin{transform:rotate(12deg)!important}}
@media(max-width:899px){
  .stage{height:600px}
  .stage .coin{width:230px;height:230px;left:-52px;top:-6px}
  .stage .phn{left:auto;right:4px;margin-left:0;top:30px;width:240px}
  .c1{display:none}
  .c2{left:-6px;top:318px;right:auto;width:158px}
  .c3{display:none}
  .stage .duo{left:auto;right:-8px;bottom:-24px;height:210px}
}
.dur{white-space:nowrap;flex:none}
@media(max-width:899px){
  .stage{height:650px}
  .stage .m{font-size:11.5px;padding:8px 10px 18px}
  .stage .q{font-size:11px}
  .stage .wv{height:18px}
  .stage .wv i:nth-child(n+22){display:none}
}

/* capa v3: moeda flutuante em cima, mascotes embaixo, celular à direita */
.stage .coinw{left:0;top:30px;width:250px}
.stage .coinw .coin{position:static;display:block;width:100%;height:auto;transform:none;opacity:1;filter:drop-shadow(0 30px 44px rgba(0,0,0,.55));animation:coinf 7s ease-in-out infinite}
@keyframes coinf{0%,100%{transform:translateY(0) rotate(-8deg)}50%{transform:translateY(-14px) rotate(6deg)}}
.stage .phn{left:auto;right:0;margin-left:0;top:34px;width:270px}
.stage .duo{left:-6px;bottom:-14px;height:340px}
.hero .micro{font-size:24px;line-height:1.35;letter-spacing:.05em;color:#fff;font-weight:800;margin-top:22px}
.hero .micro u{text-decoration:underline;text-decoration-thickness:3px;text-underline-offset:6px;text-decoration-color:var(--acao)}
@media(max-width:899px){
  .stage{height:660px}
  .stage .coinw{left:-6px;top:56px;width:132px}
  .stage .phn{right:0;top:34px;width:236px;margin-left:0}
  .stage .duo{left:-18px;bottom:-12px;height:270px}
  .hero .micro{font-size:18px}
}
@media(prefers-reduced-motion:reduce){.stage .coinw .coin{animation:none;transform:rotate(-6deg)}}
@media(max-width:480px){.pbtn{font-size:15px;gap:8px;padding-left:20px;width:100%;justify-content:space-between}.pbtn span:first-child{white-space:nowrap}}

/* sem pagar nada antes: linha verde com o mesmo espaço acima e abaixo */
.hero .micro{line-height:1}
.hero .micro .l1{display:inline-block;padding-bottom:12px;border-bottom:3px solid var(--acao)}
.hero .micro .l2{display:block;margin-top:12px}
/* capa v4: distribuição das três peças (moeda, mascotes, celular) */
@media(min-width:900px){
  .heroph{justify-content:flex-end}
  .stage{flex:none;width:560px;height:640px}
  .stage .coinw{left:0;top:60px;width:215px}
  .stage .phn{right:0;top:30px;width:262px}
  .stage .duo{left:10px;bottom:-16px;height:340px}
}
@media(min-width:1200px){
  .stage{width:640px;height:660px}
  .stage .coinw{left:0;top:70px;width:270px}
  .stage .phn{right:0;top:30px;width:280px}
  .stage .duo{left:46px;bottom:-18px;height:420px}
}
@media(max-width:899px){
  .stage .coinw{width:140px;top:46px}
  .stage .duo{height:300px;left:-20px}
}
@media(min-width:900px) and (max-width:1199px){
  .stage{width:100%;max-width:480px;height:600px}
  .stage .coinw{width:170px;top:60px}
  .stage .phn{width:228px;top:24px}
  .stage .duo{left:0;height:300px}
}

/* polish da capa: sem eyebrow, hierarquia título > público > promessa */
.hero h1{text-wrap:balance;margin-bottom:20px}
.hero .pub{color:var(--acao);font-weight:800;font-size:clamp(19px,2.4vw,26px);line-height:1.3;letter-spacing:-.005em;margin:0 0 14px;max-width:26ch;text-wrap:balance}
.hero .sub{text-wrap:balance;margin-bottom:30px}
.hero .micro{font-family:Montserrat,system-ui,sans-serif;font-size:22px;letter-spacing:.01em;text-transform:uppercase;font-weight:800;line-height:1}
.hero .micro .l1{padding-bottom:12px}
@media(max-width:899px){.hero .micro{font-size:17px}}
.fp{font-size:15.5px;padding:14px 26px}
::selection{background:var(--acao);color:#04210f}
.hero h1{font-size:clamp(38px,9.4vw,66px)}
/* capa v5: moeda e celular sobem, mascotes descem, com respiro entre eles */
@media(min-width:1200px){.stage .coinw{top:-14px}.stage .phn{top:-8px}.stage .duo{bottom:-70px}}
@media(min-width:900px) and (max-width:1199px){.stage .coinw{top:8px}.stage .phn{top:0}.stage .duo{bottom:-56px}}
@media(max-width:899px){.stage{height:700px}.stage .coinw{top:14px}.stage .phn{top:4px}.stage .duo{bottom:-50px}}

/* capa v6: promessa vira cartão flutuante entre a moeda e os mascotes */
.rcvin{display:flex;align-items:center;gap:16px;padding:16px 22px 16px 18px;border-radius:22px;background:rgba(10,26,18,.84);border:1px solid rgba(255,255,255,.2);box-shadow:0 22px 44px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,255,255,.1);animation:cardf 6.5s ease-in-out infinite}
.rcvin p{margin:0;line-height:1.25}
.rcvin b{display:block;color:#fff;font-weight:800;font-size:18px}
.rcvin p span{display:block;color:var(--acao);font-weight:800;font-size:18px;margin-top:2px}
.eq{display:flex;align-items:center;gap:3px;height:34px;flex:none}
.eq i{display:block;width:4px;height:100%;border-radius:3px;background:var(--acao);transform-origin:center;animation:eq 1.1s ease-in-out infinite}
.eq i:nth-child(2){animation-delay:-.2s}.eq i:nth-child(3){animation-delay:-.45s}.eq i:nth-child(4){animation-delay:-.7s}.eq i:nth-child(5){animation-delay:-.3s}.eq i:nth-child(6){animation-delay:-.6s}.eq i:nth-child(7){animation-delay:-.1s}
@keyframes eq{0%,100%{transform:scaleY(.25)}50%{transform:scaleY(1)}}
@keyframes cardf{0%,100%{transform:translateY(0) rotate(-1.5deg)}50%{transform:translateY(-10px) rotate(1.5deg)}}
@media(prefers-reduced-motion:reduce){.rcvin,.eq i{animation:none}.eq i{transform:scaleY(.7)}}
@media(min-width:900px){
  .hero .sub{display:none}
  .stage .rcv{left:0;top:262px;width:282px;z-index:3}
  .stage .coinw{width:250px;left:10px}
  .hero .ctas{flex-wrap:nowrap}
  .pbtn{font-size:15px;padding-left:24px}
  .hero .ghost{padding:13px 20px;font-size:14px;white-space:nowrap}
}
@media(min-width:900px) and (max-width:1199px){
  .stage .rcv{width:210px;top:236px}.rcvin{padding:12px 16px 12px 14px;gap:12px}.rcvin b,.rcvin p span{font-size:15px}.eq{height:28px}
  .hero .ctas{flex-wrap:wrap}
}
@media(max-width:899px){.stage .rcv{display:none}}
/* ajuste v6.1: cartão em uma linha, botões lado a lado, mascotes na altura do texto */
.rcvin b,.rcvin p span{white-space:nowrap}
.pbtn span:first-child{white-space:nowrap}
@media(min-width:1200px){
  .stage .rcv{width:auto;top:222px}
  .stage .coinw{top:-32px;width:236px;left:16px}
  .stage .duo{bottom:-34px}
  .hero .ctas .pbtn,.hero .ctas .ghost{flex:none}
}
@media(min-width:900px) and (max-width:1199px){
  .stage .rcv{width:auto}
  .stage .duo{bottom:-40px}
}
/* capa v7: título, moeda e celular começam na mesma altura; margens simétricas */
@media(min-width:900px){
  .herogrid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start}
  .heroph{min-width:0}
  .hero .herotxt{padding-top:0}
  .hero h1{margin-top:-6px}
}
@media(min-width:1200px){
  .stage .coinw{top:0}
  .stage .phn{top:0;right:0}
  .stage .rcv{top:236px}
}
@media(min-width:900px) and (max-width:1199px){
  .stage .coinw{top:0}
  .stage .phn{top:0}
}
@media(min-width:1200px){
  .stage .coinw{left:70px}
  .stage .rcv{left:46px}
  .stage .duo{left:96px}
}
/* capa v8: margens laterais menores e espaçamento igual entre moeda, cartão e mascotes */
@media(min-width:900px){
  .wrap{max-width:1600px;padding-left:clamp(32px,6.1vw,120px);padding-right:clamp(32px,6.1vw,120px)}
  .wrap.narrow{max-width:1000px}
}
@media(min-width:1200px){
  .stage .rcv{top:272px}
  .stage .duo{bottom:-78px}
}
@media(min-width:1200px){.stage .duo{bottom:-97px}}
/* capa v9: margens laterais um terço menores (88 px para 59 px em 1440) */
@media(min-width:900px){
  .wrap{padding-left:clamp(24px,4.07vw,80px);padding-right:clamp(24px,4.07vw,80px)}
}
/* capa v10: moeda, cartão e mascotes um pouco mais à esquerda, longe do celular */
@media(min-width:1200px){
  .stage .coinw{left:34px}
  .stage .rcv{left:10px}
  .stage .duo{left:60px}
}

/* título justificado: as três linhas com a mesma largura (tamanho por linha) */
.hero h1 .ln{display:block;width:fit-content;white-space:nowrap}
.hero h1 .l2{font-size:1.2426em;line-height:.96}
.hero h1 .l3{font-size:1.19em;line-height:1}
.hero h1{line-height:1.02}
/* cabeçalho do WhatsApp: nome na altura do meio da moeda, 50% maior, "online" centralizado abaixo */
.wahead{align-items:flex-start;padding:10px 14px 12px}
.wahead img{width:36px;height:36px}
.wahead>div{display:flex;flex-direction:column;align-items:center}
.wahead .whn{font-size:22.5px;line-height:1;margin-top:7px}
.wahead>div>span{margin-top:4px;text-align:center}
.wahead .nm{font-size:inherit;font-weight:800;color:#fff}
.wahead .nm i{color:var(--acao)}
/* cabeçalho do WhatsApp proporcional: moeda 40 px, nome 16 px (o meio do nome no meio da moeda) */
.wahead img{width:40px;height:40px}
.wahead .whn{font-size:16px;margin-top:12px}
.wahead>div>span{font-size:11px;margin-top:4px}
/* cabeçalho do WhatsApp mais fino e mensagens do celular da capa inteiras */
.wahead{padding:7px 14px 7px;border-bottom-width:1px}
.wahead img{width:34px;height:34px}
.wahead .whn{font-size:15px;margin-top:9px}
.wahead>div>span{font-size:10.5px;margin-top:2px}
.sbar{height:36px;padding-top:6px}
.hero .chat{padding:8px 9px;gap:6px}
.hero .m{font-size:11.5px;line-height:1.32;padding:7px 10px 16px;border-radius:14px}
.hero .q{font-size:10.5px;margin-top:4px}
.hero .tk{font-size:8.5px;right:8px;bottom:3px}
.hero .wv{height:16px}.hero .wv i{width:2px}
.hero .play{border-left-width:9px;border-top-width:6px;border-bottom-width:6px}
.hero .dur{font-size:10px}
.wahead>div>span{line-height:1}
.hero .m{font-size:12px}
.hero .q{font-size:11px}
.cardimg{max-height:120px;object-fit:cover;object-position:center}
@media(max-width:899px){
  .stage .phn .phone{aspect-ratio:9/19}
  .hero .m{font-size:10.5px;line-height:1.3;padding:6px 9px 15px}
  .hero .q{font-size:10px;margin-top:3px}
  .hero .chat{gap:5px;padding:7px 8px}
  .hero .wv{height:14px}
  .stage{height:720px}
}
/* conversa distribuída com espaços iguais (topo, entre mensagens e embaixo) */
.chat{justify-content:space-evenly;gap:8px}
.hero .chat{gap:8px;padding:6px 9px}
.chat,.hero .chat{gap:0;padding:0 10px}

/* capa v11: público em duas linhas, promessa logo abaixo, botões descem; "Recebe pronto." centralizado */
.hero .pub{max-width:none;margin:0 0 20px}
.hero .pub .al{display:block;white-space:nowrap}
.hero .micro{margin:0 0 34px}
.hero .ctas{margin-top:0}
.rcvin p{text-align:center}

/* capa v12: público em branco e centralizado sob o título; promessa em verde com traço branco */
.hero .hb{display:inline-block;max-width:100%}
.hero .pub{color:#fff;text-align:center;margin:0 0 22px}
.hero .micro{color:var(--acao)}
.hero .micro .l1{border-bottom-color:#fff}

/* capa v13: promessa centralizada sob o título, junto com o público */
.hero .hb{display:block;width:fit-content;max-width:100%}
.hero .micro{text-align:center;margin:0 0 34px}

/* capa v14: botão do WhatsApp centralizado e TV animada que abre o vídeo demonstração */
.hero .hb .pbtn{display:flex;width:fit-content;margin:0 auto}
.tv{display:flex;align-items:center;gap:16px;margin:22px auto 0;padding:10px 22px 10px 12px;border-radius:20px;background:rgba(10,26,18,.72);border:1px solid rgba(255,255,255,.2);box-shadow:0 18px 36px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.1);color:#fff;font-family:Montserrat,system-ui,sans-serif;text-align:left;cursor:pointer;transition:transform .3s cubic-bezier(.32,.72,0,1),border-color .25s}
.tv:hover{transform:translateY(-2px);border-color:var(--acao)}
.tv:active{transform:scale(.98)}
.tvbox{position:relative;flex:none;width:88px;height:64px;padding:5px;border-radius:14px;background:#0b0b0b;box-shadow:0 0 0 1.5px rgba(255,255,255,.14),0 10px 22px rgba(0,0,0,.45);animation:tvf 5.5s ease-in-out infinite}
.ant{position:absolute;top:-17px;width:2px;height:20px;background:#5a6a60;border-radius:2px}
.ant.a1{left:30px;transform:rotate(-26deg)}
.ant.a2{right:30px;transform:rotate(26deg)}
.scr{position:relative;display:block;width:100%;height:100%;border-radius:9px;overflow:hidden;background:#04150a}
.scr img{width:100%;height:100%;object-fit:cover;object-position:center 22%;opacity:.92;animation:crt 3.2s steps(2,end) infinite}
.scr::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,rgba(0,0,0,.22) 0 1px,transparent 1px 3px);pointer-events:none}
.pp{position:absolute;left:50%;top:50%;width:26px;height:26px;margin:-13px 0 0 -13px;border-radius:50%;background:var(--acao);z-index:2;box-shadow:0 0 0 0 rgba(0,168,89,.6);animation:pulse 1.8s ease-out infinite}
.pp::before{content:"";position:absolute;left:10px;top:7px;border-left:9px solid #fff;border-top:6px solid transparent;border-bottom:6px solid transparent}
.tvtxt{display:flex;flex-direction:column;line-height:1.25}
.tvtxt b{font-size:16px;font-weight:800;color:#fff}
.tvtxt span{font-size:14px;font-weight:700;color:var(--acao)}
@keyframes tvf{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-5px) rotate(2deg)}}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(0,168,89,.65)}80%,100%{box-shadow:0 0 0 14px rgba(0,168,89,0)}}
@keyframes crt{0%,100%{filter:brightness(1)}50%{filter:brightness(1.12)}}
@media(prefers-reduced-motion:reduce){.tvbox,.pp,.scr img{animation:none}}
@media(max-width:899px){
  .hero .hb{width:100%}
  .hero h1 .ln{margin-inline:auto}
  .hero .sub{text-align:center;margin:0 0 20px}
  .hero .hb .pbtn{width:100%;justify-content:space-between}
  .tv{width:fit-content}
}
/* capa v15: mesma distância acima e abaixo do botão; ícone branco com o símbolo verde */
.hero .micro{margin-bottom:32px}
.tv{margin-top:32px}
.pbtn .ic{background:#fff;color:#25D366}
/* capa v16: botão branco, símbolo original do WhatsApp (círculo verde, ícone branco) */
.pbtn{background:#fff;color:#04210f;box-shadow:0 14px 34px rgba(0,0,0,.38)}
.pbtn:hover{box-shadow:0 18px 40px rgba(0,0,0,.46)}
.pbtn .ic{background:#25D366;color:#fff}
.pbtn .wai{width:26px;height:26px}
/* capa v17: ícone do app WhatsApp como no iPhone (quadrado arredondado, degradê verde, símbolo branco) */
.pbtn .ic{width:48px;height:48px;border-radius:12px;background:linear-gradient(180deg,#61FD7D 0%,#25CF43 100%);color:#fff;box-shadow:inset 0 0 0 .5px rgba(0,0,0,.12),0 3px 8px rgba(0,60,20,.28)}
.pbtn .wai{width:32px;height:32px}
.pbtn:hover .ic{transform:scale(1.06) rotate(-4deg)}
.pbtn .wai{width:34px;height:34px}
/* capa v18: metade da distância até o menu, funções mais perto da TV */
@media(min-width:900px){
  .hero{padding-top:36px}
}
@media(max-width:899px){.hero{padding-top:22px}}
@media(min-width:900px){
  .band{margin-top:26px;gap:8px}
  .fp{padding:10px 24px 10px 20px;font-size:15px}
}
/* capa v19: faixa de funções a meia distância da TV e o dobro de espaço entre as duas linhas */
@media(min-width:900px){
  .band{margin-top:-11px;gap:16px;position:relative;z-index:1}
  .stage{z-index:2}
}
/* capa v20: TV, mascotes e celular terminam na mesma linha */
@media(min-width:1200px){
  .hero .pub{margin-bottom:51px}
  .stage .phn{width:294px}
  .stage .phn .phone{aspect-ratio:294/640}
  .stage .duo{height:378px;bottom:-59px}
  .band{margin-top:18px}
}

/* mascote e Paulo em camadas separadas: os pés dos dois na mesma linha */
.stage .duo.m{margin-bottom:-13px}
@media(min-width:1200px){.stage .duo.m{margin-bottom:-16px}}
/* feed de mensagens (guardado para a próxima etapa, hoje não usado na capa) */
.feed{display:flex;flex-direction:column;align-items:flex-end;gap:12px;padding:6px 10px;animation:feedup 42s linear infinite;will-change:transform}
.fm{position:relative;max-width:90%;padding:10px 14px 19px;border-radius:16px 16px 4px 16px;background:#0B6B45;color:#fff;font-weight:700;font-size:14px;line-height:1.3;box-shadow:0 6px 14px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.12)}
.fm i{position:absolute;right:11px;bottom:4px;font-style:normal;font-size:9.5px;font-weight:600;color:rgba(255,255,255,.62)}
@keyframes feedup{to{transform:translateY(-50%)}}

/* capa: as 4 bolhas do celular ficam onde estão; só o texto troca pelas funções, em rodízio */
.hero .m.fx{display:flex;align-items:center;justify-content:center;width:90%;padding:6px 12px;text-align:center}
.hero .m.fx .fnm{display:block;font-weight:800;font-size:13px;line-height:1.25;color:#fff;transition:opacity .32s cubic-bezier(.32,.72,0,1),transform .32s cubic-bezier(.32,.72,0,1)}
.hero .m.fx .fnm.out{opacity:0;transform:translateY(-7px)}
.hero .m.fx .fnm.in{opacity:0;transform:translateY(7px);transition:none}
@media(min-width:1200px){
  .hero .m.fx:nth-of-type(1),.hero .m.fx:nth-of-type(3){height:72px}
  .hero .m.fx:nth-of-type(2),.hero .m.fx:nth-of-type(4){height:86.3px}
}
@media(min-width:900px) and (max-width:1199px){
  .hero .m.fx:nth-of-type(1){height:87px}.hero .m.fx:nth-of-type(2),.hero .m.fx:nth-of-type(4){height:102px}.hero .m.fx:nth-of-type(3){height:72px}
  .hero .m.fx .fnm{font-size:12px}
}
@media(max-width:899px){
  .hero .m.fx:nth-of-type(1){height:77px}.hero .m.fx:nth-of-type(2),.hero .m.fx:nth-of-type(4){height:89px}.hero .m.fx:nth-of-type(3){height:64px}
  .hero .m.fx .fnm{font-size:11.5px}
}
@media(prefers-reduced-motion:reduce){.hero .m.fx .fnm{transition:none}}
/* capa: distância entre o público e "Sem pagar nada antes" reduzida pela metade (51 px para 25 px) */
@media(min-width:1200px){.hero .pub{margin-bottom:25px}}
/* capa: celular menor e mascotes mais acima, terminando na mesma linha da TV (719 px) */
@media(min-width:1200px){
  .stage{height:614px}
  .stage .phn{width:282px}
  .stage .phn .phone{aspect-ratio:282/614}
  .stage .rcv{top:259px}
  .stage .duo{bottom:-79px}
  .band{margin-top:38px}
}

/* capa: a lâmina verde termina no tamanho da janela (as funções vivem dentro do celular) */
@media(min-width:900px){.hero{min-height:calc(100vh - 69px);padding-bottom:40px}}

/* título do rodízio dentro do celular: acima da primeira bolha, centralizado, em branco */
.hero .fnlabel{align-self:center;margin:0;color:#fff;font-weight:800;font-size:13px;line-height:1;letter-spacing:.01em;text-align:center}
@media(max-width:899px){.hero .fnlabel{font-size:11.5px}}
@media(min-width:900px) and (max-width:1199px){
  .hero .m.fx:nth-of-type(1),.hero .m.fx:nth-of-type(3){height:62px}
  .hero .m.fx:nth-of-type(2),.hero .m.fx:nth-of-type(4){height:74px}
}

/* título do rodízio 50% maior, sem mexer no resto: a altura na coluna continua a mesma */
.hero .fnlabel{display:flex;align-items:center;justify-content:center;height:13px;font-size:19.5px;white-space:nowrap;overflow:visible}
@media(max-width:899px){.hero .fnlabel{height:11.5px;font-size:17.25px}}
/* botão do topo: verde original do WhatsApp com texto e símbolo em branco */
.top .hdrbtn{background:#25D366;color:#fff;text-shadow:0 1px 2px rgba(0,70,25,.45)}
.top .hdrbtn .wai{filter:drop-shadow(0 1px 1px rgba(0,70,25,.4))}

/* lâminas 2 a 6 trazidas do PDF oficial: cada uma é um palco 1920x1080 escalado pela largura da janela */
.lsec{display:block}
.lamw{display:none}
.lam .ftr{display:none}
.lamlink{color:inherit;text-decoration:none}
.lamlink:hover{text-decoration:underline;text-underline-offset:.2em}
.mobimg{border-radius:24px;margin:8px 0 20px;max-width:420px;width:100%}
.mobbento{margin:18px 0 22px}
.mob .final{padding:64px 0}
@media(min-width:900px){
  .lamw{display:block;position:relative;width:100%;height:calc(1080px * var(--s,.75));overflow:hidden}
  .lam{width:1920px;height:1080px;transform:scale(var(--s,.75));transform-origin:0 0}
  .mob{display:none}
}
.lam .slide .ftr{display:none!important}
/* isola as lâminas do PDF das regras do resto do site */
.lam .e1,.lam .e2,.lam .e3,.lam .e4{max-width:none;margin-left:0;margin-right:0}
.lam .coin{filter:none}
/* cada lâmina cabe exatamente na janela abaixo do cabeçalho fixo (como a capa) */
@media(min-width:900px){
  html{scroll-padding-top:69px;scroll-snap-type:y proximity}
  .lsec,#inicio{scroll-snap-align:start}
  .lamw{height:var(--lamh,calc(100vh - 69px))}
  .lam{position:absolute;left:calc((100% - 1920px * var(--s,.75)) / 2);top:calc((var(--lamh,calc(100vh - 69px)) - 1080px * var(--s,.75)) / 2)}
}

/* faixas laterais (quando a janela é mais larga que o palco): mesma cor e mesma grade da lâmina */
@media(min-width:900px){
  .lsec.l-light .lamw{background:#F1F3F2}
  .lsec.l-dark .lamw{background:#012a15}
  .lamw::before{content:"";position:absolute;inset:0;pointer-events:none;background-size:calc(54px * var(--s,.75)) calc(54px * var(--s,.75));background-position:calc((100% - 1920px * var(--s,.75)) / 2) calc((var(--lamh,700px) - 1080px * var(--s,.75)) / 2)}
  .lsec.l-light .lamw::before{background-image:linear-gradient(rgba(0,40,19,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(0,40,19,.055) 1px,transparent 1px)}
  .lsec.l-dark .lamw::before{background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px)}
  .lam{z-index:1}
}
@media(min-width:900px){
  .lsec.l-light .lamw{background:#fff}
  .lsec.l-light .lamw::before{background-image:linear-gradient(rgba(0,168,89,.16) 1px,transparent 1px),linear-gradient(90deg,rgba(0,168,89,.16) 1px,transparent 1px)}
  .lsec.l-dark .lamw{background:radial-gradient(ellipse at 85% 0%,#00411f 0%,#002813 40%,#00150A 100%)}
  .lsec.l-dark .lam .slide{background:transparent}
}

/* capa: celular no aparelho das lâminas (iPhone cromado); o miolo mantém as proporções de antes (zoom 1.4795 sobre 263,6 x 561 px) */
.hdev{position:relative;width:calc(428px*var(--k,.6));height:calc(868px*var(--k,.6))}
.hdev .hscale{position:absolute;left:0;top:0;width:428px;height:868px;transform:scale(var(--k,.6));transform-origin:0 0}
.hdev .scr3{display:block!important}
.hdev .hin{zoom:1.4795;width:263.6px;height:561px;display:flex;flex-direction:column;background:#0A1A12}
.hdev .hin .sbar,.hdev .hin .wahead{flex:none}
.hdev .hin .wahead,.hdev .hin .sbar{display:flex}
.hdev .hin .wahead>div{display:flex}
.hdev .hin .nm,.hdev .hin .nm *{display:inline}
.hdev .hin .chat{flex:1}
.stage .phn{width:auto!important;--k:.55}
@media(min-width:900px) and (max-width:1199px){.stage .phn{--k:.56}}
@media(min-width:1200px){.stage .phn{--k:var(--hk,.6);right:calc(34px*var(--hk,.6)/.6)!important}}

/* capa: respiro embaixo como nas outras lâminas (TV, mascotes e celular a cerca de 95 px do fim da janela) */
@media(min-width:1200px){
  .hero .hb h1{margin-bottom:31px}
  .hero .micro{margin-bottom:32px}
  .hero .tv{margin-top:32px}
  .stage .duo{bottom:-56px}
  .stage .rcv{top:252px}
  .stage .phn{top:-14px}
}
@media(min-width:1200px){
  .hero .hb h1{margin-bottom:22px}
  .hero .pub{margin-bottom:18px}
  .hero .micro{margin-bottom:20px}
  .hero .tv{margin-top:20px}
}
@media(min-width:1200px) and (max-height:760px){
  .hero{padding-top:26px}
  .hero .hb h1{margin-bottom:16px}
  .hero .pub{margin-bottom:12px}
  .hero .micro{margin-bottom:14px}
  .hero .tv{margin-top:14px}
}

/* capa: as 10 funções como mensagens de WhatsApp dentro do celular */
.hdev .chat{display:flex;flex-direction:column;padding:0 10px 12px;gap:0;overflow:hidden;justify-content:flex-start}
.hdev .chat .fnlabel{flex:none;height:auto;font-size:15px;padding:12px 0 10px;justify-content:center}
.hdev .hstack{flex:1;min-height:0;display:flex;flex-direction:column;justify-content:flex-end;gap:7px;overflow:hidden;-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 12%);mask-image:linear-gradient(to bottom,transparent 0,#000 12%)}
.hdev .hm{position:relative;flex:none;max-width:90%;max-height:0;opacity:0;transform:translateY(14px);overflow:hidden;border-radius:14px;color:#EAF2ED;transition:max-height .5s cubic-bezier(.32,.72,0,1),opacity .45s cubic-bezier(.32,.72,0,1),transform .5s cubic-bezier(.32,.72,0,1)}
.hdev .hm.show{max-height:60px;opacity:1;transform:none}
.hdev .hm.me{align-self:flex-end;background:#0B6B45;border-bottom-right-radius:4px}
.hdev .hm.bt{align-self:flex-start;background:#17271F;border-bottom-left-radius:4px}
.hdev .hi{display:flex;align-items:baseline;gap:8px;padding:8px 12px 16px;font-size:12.5px;line-height:1.3;font-weight:700}
.hdev .hn{font:700 9.5px "JetBrains Mono",ui-monospace,monospace;color:#2FD07A}
.hdev .hm.me .hn{color:#C8F5DC}
.hdev .ht{color:#fff}
.hdev .hm .tk{position:absolute;right:9px;bottom:3px;font-size:8.5px;color:rgba(255,255,255,.55);font-weight:600}
@media(prefers-reduced-motion:reduce){.hdev .hm{transition:none}}

/* capa: mesma distância entre "assessores e pré-candidatos", "Sem pagar nada antes", "Poucas vagas grátis", o botão e a TV */
@media(min-width:1200px){
  .hero .pub{margin-bottom:23px}
  .hero .micro{margin-bottom:22px}
  .hero .tv{margin-top:20px}
}
@media(min-width:1200px) and (max-height:760px){
  .hero .pub{margin-bottom:17px}
  .hero .micro{margin-bottom:16px}
  .hero .tv{margin-top:14px}
}
.hdev .hstack{gap:0}
.hdev .hm.show{margin-top:7px}
.hdev .hm{margin-top:0;transition-property:max-height,opacity,transform,margin-top}
.hdev .hi{padding:10px 13px 18px;font-size:13.5px}
.hdev .hn{font-size:10.5px}
.hdev .hm .tk{font-size:9px;bottom:4px}
.hdev .hm.show{max-height:70px}
@media(min-width:1200px){.hero .micro{margin-bottom:24px}.hero .tv{margin-top:21px}}
@media(min-width:1200px) and (max-height:760px){.hero .micro{margin-bottom:18px}.hero .tv{margin-top:15px}}
@media(min-width:1200px){.hero .pub{margin-bottom:24px}.hero .micro{margin-bottom:23px}}
@media(min-width:1200px) and (max-height:760px){.hero .pub{margin-bottom:18px}.hero .micro{margin-bottom:17px}}
/* capa: vãos visuais iguais (linha de base do texto até o topo da próxima peça) = 30 px */
@media(min-width:1200px){.hero .pub{margin-bottom:19px}.hero .micro{margin-bottom:26px}.hero .tv{margin-top:30px}}
@media(min-width:1200px) and (max-height:760px){.hero .pub{margin-bottom:11px}.hero .micro{margin-bottom:18px}.hero .tv{margin-top:22px}}
/* capa: botão "Testar de graça" 30% menor no desktop */
@media(min-width:900px){.hero .hb .pbtn{zoom:.7}}
.hdev .hstack{-webkit-mask-image:none;mask-image:none}
/* celular da capa: conteúdo mais para baixo e mais respiro entre as 5 mensagens */
.hdev .chat .fnlabel{padding:26px 0 14px}
.hdev .hstack{justify-content:flex-start}
.hdev .hm.show{margin-top:13px}
