:root{--roxo:#7C3AED;--roxo-2:#6A2BD6;--roxo-claro:#F1EDF8;--roxo-tinta:#5B21B6;--tinta:#15171C;--t2:#4B5059;--t3:#6B717B;
--bg:#FFFFFF;--s2:#F7F6FA;--borda:#E6E3EC;--ok:#0B8A5A;--raio:16px;--fonte:Onest,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;font:16px/1.6 var(--fonte);color:var(--tinta);background:var(--bg)}
img{max-width:100%;display:block}a{color:inherit}
h1,h2,h3{letter-spacing:-.025em;line-height:1.15;margin:0}
.envolve{width:min(1160px,100% - 32px);margin:0 auto}
.botao{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:52px;padding:0 26px;border-radius:12px;background:var(--roxo);color:#fff;font-weight:700;font-size:16px;text-decoration:none;transition:background .15s,transform .15s}
.botao:hover{background:var(--roxo-2);transform:translateY(-1px)}
.botao.leve{background:#fff;color:var(--tinta);border:1px solid var(--borda)}.botao.leve:hover{background:var(--s2)}
.botao.pequeno{height:40px;padding:0 16px;font-size:14.5px;border-radius:10px}
.botao svg{flex:none}

/* Topo */
.topo{position:sticky;top:0;z-index:10;background:rgba(255,255,255,.88);backdrop-filter:blur(14px);border-bottom:1px solid transparent;transition:border-color .2s}
.topo.rolou{border-color:var(--borda)}
.topo .envolve{display:flex;align-items:center;gap:24px;height:68px}
.topo .logo img{height:32px;width:auto}
.topo nav{display:flex;gap:22px;margin-left:auto}.topo nav a{text-decoration:none;color:var(--t2);font-weight:500;font-size:15px}.topo nav a:hover{color:var(--roxo)}
.topo .acoes{display:flex;gap:10px}

/* Primeira dobra */
.heroi{padding:64px 0 40px;background:radial-gradient(1000px 420px at 85% -10%,#EDE4FF 0,transparent 70%),radial-gradient(700px 360px at -10% 20%,#F6F1FF 0,transparent 70%)}
.heroi-grade{display:grid;grid-template-columns:1.02fr 1fr;gap:48px;align-items:center}
.selo{display:inline-flex;align-items:center;gap:8px;padding:6px 12px;border-radius:999px;background:var(--roxo-claro);color:var(--roxo-tinta);font-weight:700;font-size:13px}
.selo i{width:7px;height:7px;border-radius:2px;background:var(--roxo)}
.heroi h1{font-size:clamp(34px,5vw,56px);font-weight:800;margin:18px 0 18px}
.heroi h1 em{font-style:normal;color:var(--roxo)}
.heroi p.lead{font-size:clamp(17px,1.6vw,19px);color:var(--t2);margin:0 0 28px;max-width:34em}
.heroi .acoes{display:flex;flex-wrap:wrap;gap:12px}
.heroi .garantias{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:22px;color:var(--t3);font-size:14px}
.heroi .garantias span{display:inline-flex;align-items:center;gap:7px}.heroi .garantias svg{color:var(--ok)}
.tela{position:relative;border-radius:14px;overflow:hidden;background:#0B0C10;box-shadow:0 30px 80px -20px rgba(60,20,140,.45),0 0 0 1px rgba(124,58,237,.18)}
.tela img{width:100%;height:auto}
.etiqueta{position:absolute;display:flex;align-items:center;gap:8px;padding:9px 13px;border-radius:12px;background:#fff;box-shadow:0 12px 30px rgba(20,10,50,.22);font-size:13.5px;font-weight:700}
.etiqueta i{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:8px;background:var(--roxo-claro);color:var(--roxo);font-style:normal}
.etiqueta.e1{left:14px;bottom:14%}.etiqueta.e2{right:14px;top:12%}

/* Máquinas */
.maquinas{padding:26px 0;border-block:1px solid var(--borda);background:var(--s2)}
.maquinas .envolve{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:12px 34px;color:var(--t2);font-weight:700}
.maquinas small{font-weight:500;color:var(--t3)}

/* Seções */
section.bloco{padding:84px 0}
.cab-secao{max-width:680px;margin:0 auto 44px;text-align:center}
.cab-secao h2{font-size:clamp(28px,3.4vw,40px);font-weight:800}
.cab-secao p{color:var(--t2);font-size:17.5px;margin:14px 0 0}
.sobre{font-size:13px;font-weight:800;color:var(--roxo);margin-bottom:10px;display:block}

.recursos{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.recurso{padding:24px;border:1px solid var(--borda);border-radius:var(--raio);background:#fff;transition:border-color .15s,box-shadow .15s}
.recurso:hover{border-color:#CDB8FF;box-shadow:0 14px 40px -18px rgba(124,58,237,.35)}
.recurso .ic{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:var(--roxo-claro);color:var(--roxo);margin-bottom:16px}
.recurso h3{font-size:18px;margin-bottom:8px}.recurso p{margin:0;color:var(--t2);font-size:15px}

.destaque{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.destaque+.destaque{margin-top:80px}
.destaque h3{font-size:clamp(24px,2.6vw,32px);font-weight:800;margin-bottom:14px}
.destaque p{color:var(--t2);margin:0 0 16px}
.lista-ok{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.lista-ok li{display:flex;gap:10px;align-items:flex-start}.lista-ok svg{flex:none;margin-top:4px;color:var(--roxo)}
.quadro-img{border-radius:20px;padding:28px;background:linear-gradient(160deg,#F3ECFF,#FFF6FB);border:1px solid var(--borda)}
.quadro-img img{margin:0 auto;max-height:420px;width:auto;filter:drop-shadow(0 16px 30px rgba(80,40,140,.18))}
.marcas-demo{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.marca-cartao{padding:18px;border-radius:14px;background:#fff;border:1px solid var(--borda)}
.marca-cartao b{display:block;margin-bottom:4px}.marca-cartao small{color:var(--t3)}

.passos{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;counter-reset:p}
.passo{position:relative;padding:28px 24px;border-radius:var(--raio);background:var(--s2);border:1px solid var(--borda)}
.passo::before{counter-increment:p;content:counter(p);display:grid;place-items:center;width:36px;height:36px;border-radius:10px;background:var(--tinta);color:#fff;font-weight:800;margin-bottom:16px}
.passo h3{font-size:18px;margin-bottom:6px}.passo p{margin:0;color:var(--t2);font-size:15px}

.publico{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.publico span{padding:10px 18px;border-radius:999px;border:1px solid var(--borda);background:#fff;font-weight:600;color:var(--t2)}

/* Preço */
.preco-secao{background:linear-gradient(180deg,#fff,#F6F1FF)}
.preco{max-width:520px;margin:0 auto;padding:36px;border-radius:24px;background:#fff;border:2px solid var(--roxo);box-shadow:0 30px 70px -30px rgba(124,58,237,.45);text-align:center}
.preco .selo{margin-bottom:14px}
.preco h3{font-size:22px}
.preco .de{color:var(--t3);text-decoration:line-through;margin-top:16px}
.preco .valor{font-size:56px;font-weight:800;letter-spacing:-.03em;line-height:1.1}.preco .valor small{font-size:20px;font-weight:700}
.preco .parcela{color:var(--t2);margin-bottom:22px}
.preco .lista-ok{text-align:left;margin:22px 0 26px}
.preco .botao{width:100%}
.preco .nota{font-size:13px;color:var(--t3);margin-top:12px}

/* Perguntas */
.perguntas{max-width:760px;margin:0 auto;display:grid;gap:10px}
.perguntas details{border:1px solid var(--borda);border-radius:14px;background:#fff}
.perguntas summary{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:18px 20px;cursor:pointer;font-weight:700;list-style:none}
.perguntas summary::-webkit-details-marker{display:none}
.perguntas summary::after{content:"+";font-size:22px;font-weight:500;color:var(--roxo);transition:transform .2s}
.perguntas details[open] summary::after{transform:rotate(45deg)}
.perguntas details p{margin:0;padding:0 20px 18px;color:var(--t2)}

.final{padding:72px 0;text-align:center;background:var(--tinta);color:#fff}
.final h2{font-size:clamp(28px,3.4vw,40px);font-weight:800;margin-bottom:14px}.final p{color:#C9CBD3;margin:0 0 28px}

.rodape{padding:34px 0;border-top:1px solid var(--borda);color:var(--t3);font-size:14px}
.rodape .envolve{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px}
.rodape img{height:26px;width:auto}.rodape nav{display:flex;gap:20px}.rodape a{text-decoration:none}.rodape a:hover{color:var(--roxo)}

/* Textos legais */
.legal{max-width:780px;margin:0 auto;padding:56px 0 80px}
.legal h1{font-size:clamp(30px,4vw,40px);font-weight:800;margin-bottom:8px}
.legal .data{color:var(--t3);margin-bottom:32px}
.legal h2{font-size:21px;margin:34px 0 10px}
.legal p,.legal li{color:var(--t2)}.legal ul{padding-left:22px}

@media (max-width:960px){
  .heroi-grade,.destaque{grid-template-columns:1fr;gap:36px}
  .destaque.inverte .quadro-img{order:-1}
  .recursos{grid-template-columns:1fr 1fr}.passos{grid-template-columns:1fr}
  .topo nav{display:none}.etiqueta{display:none}
}
@media (max-width:600px){
  .heroi{padding:36px 0 28px}.recursos{grid-template-columns:1fr}section.bloco{padding:60px 0}
  .topo .acoes .leve{display:none}.heroi .acoes .botao{width:100%}.marcas-demo{grid-template-columns:1fr}
  .preco{padding:26px 20px}.preco .valor{font-size:46px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* Nunca mais borda branca: comparação em fundo escuro */
.escuro{background:#1C1530;color:#fff}
.escuro .cab-secao p{color:#C9C2DA}.escuro .sobre{color:#C4B5FD}
.comparar{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.lado{position:relative;padding:22px;border-radius:20px;background:#2A1F44;border:1px solid rgba(255,255,255,.08)}
.lado.bom{background:linear-gradient(160deg,#3B2470,#2A1F44);border-color:rgba(167,139,250,.45)}
.lado-cab{display:flex;align-items:center;gap:10px;margin-bottom:6px;font-weight:800;font-size:18px}
.lado-cab .marca-x,.lado-cab .marca-v{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:8px;font-size:15px}
.marca-x{background:rgba(255,107,94,.18);color:#FF8A80}.marca-v{background:rgba(61,213,152,.18);color:#5BE3A8}
.lado p{margin:0 0 14px;color:#C9C2DA;font-size:15px}
.lado-imgs{display:grid;grid-template-columns:1.25fr 1fr;gap:12px;align-items:center}
.lado-imgs img{width:100%;height:auto}
.lado-imgs .zoom{border-radius:14px;overflow:hidden;background:#3a2d58;border:2px solid rgba(255,255,255,.14);position:relative}
.lado-imgs .zoom::after{content:"zoom na borda";position:absolute;left:8px;bottom:8px;padding:2px 8px;border-radius:6px;background:rgba(0,0,0,.55);font-size:11.5px;color:#fff}
.nota-escura{text-align:center;color:#9E96B3;font-size:13px;margin:18px 0 0}
.modos{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:56px}
.modo{padding:18px;border-radius:18px;background:#2A1F44;border:1px solid rgba(255,255,255,.08);text-align:center}
.modo img{height:230px;width:auto;margin:0 auto 12px}
.modo b{display:block;font-size:17px}.modo small{color:#B9B1CC}
/* Antes e depois do remover fundo */
.antes-depois{display:grid;grid-template-columns:1fr auto 1fr;gap:16px;align-items:center}
.antes-depois figure{margin:0;border-radius:18px;overflow:hidden;border:1px solid var(--borda);position:relative}
.antes-depois figcaption{position:absolute;left:12px;top:12px;padding:4px 10px;border-radius:8px;background:rgba(255,255,255,.92);font-size:13px;font-weight:700}
.xadrez{background:repeating-conic-gradient(#ECE8F2 0% 25%,#fff 0% 50%) 50%/22px 22px}
.seta-ad{display:grid;place-items:center;width:48px;height:48px;border-radius:999px;background:var(--roxo);color:#fff;font-size:22px}
.foto-larga{border-radius:20px;overflow:hidden;border:1px solid var(--borda);box-shadow:0 30px 60px -30px rgba(60,20,140,.35)}
@media (max-width:960px){.comparar,.modos{grid-template-columns:1fr}.antes-depois{grid-template-columns:1fr}.seta-ad{margin:0 auto;transform:rotate(90deg)}.modo img{height:200px}}
