:root{
  --abismo:#06222c; --mar:#0b3a49; --media:#1b5a6e; --turquesa:#2fb5a6; --espuma:#9fe3d6;
  --areia:#f7f3ea; --areia-2:#efe8da; --claro:#e9f4f2;
  --fundo:#fbf9f4; --cartao:#ffffff; --tinta:#0d1f26; --tinta-2:#46646e; --tinta-3:#7d979f;
  --borda:rgba(13,31,38,.09); --sombra:0 1px 2px rgba(6,34,44,.06),0 12px 40px -12px rgba(6,34,44,.18);
  --r:20px; --serif:'Fraunces',Georgia,serif; --sans:'Inter',system-ui,sans-serif;
}
:root[data-tema="escuro"]{
  --fundo:#071a21; --cartao:#0c2630; --areia:#0a2029; --areia-2:#0e2a35; --tinta:#e8f1f2; --tinta-2:#a6c0c6; --tinta-3:#6f8e96;
  --borda:rgba(255,255,255,.08); --sombra:0 1px 2px rgba(0,0,0,.3),0 20px 50px -20px rgba(0,0,0,.6);
}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth}
body{font-family:var(--sans);color:var(--tinta);background:var(--fundo);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit}
.largura{width:min(1180px,100% - 32px);margin-inline:auto}
h1,h2,h3{font-family:var(--serif);line-height:1.08;letter-spacing:-.02em;font-weight:600}
.selo{display:inline-flex;gap:.5rem;align-items:center;font-size:.8rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--turquesa)}
.selo::before{content:"";width:18px;height:2px;background:currentColor;border-radius:2px}

/* Botões */
.botao{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;padding:.95rem 1.5rem;border-radius:999px;font-weight:600;font-size:.98rem;text-decoration:none;border:0;cursor:pointer;transition:transform .2s,box-shadow .2s,background .2s;white-space:nowrap}
.botao--sol{background:#fff;color:var(--abismo);box-shadow:0 1px 2px rgba(0,0,0,.2),0 10px 24px -12px rgba(0,0,0,.6)}
.botao--sol:hover{background:var(--claro);transform:translateY(-2px);box-shadow:0 2px 4px rgba(0,0,0,.2),0 16px 30px -14px rgba(0,0,0,.65)}
.botao--vidro{background:rgba(255,255,255,.08);color:#fff;border:1px solid rgba(255,255,255,.2)}
.botao--vidro:hover{background:rgba(255,255,255,.16)}
.botao--escuro{background:var(--tinta);color:var(--fundo)}
.botao--escuro:hover{transform:translateY(-2px)}
.botao--contorno{background:transparent;color:var(--tinta);border:1.5px solid var(--borda)}
.botao--contorno:hover{border-color:var(--tinta)}

/* Topo */
.topo{position:fixed;inset:0 0 auto;z-index:50;transition:background .3s,box-shadow .3s}
.topo.rolou{background:rgba(5,24,32,.97);box-shadow:0 1px 0 rgba(255,255,255,.06),0 10px 30px -18px rgba(0,0,0,.6)}
.topo__interno{display:flex;align-items:center;justify-content:space-between;height:72px;gap:1rem}
.marca{display:flex;align-items:center;gap:.6rem;font-family:var(--serif);font-weight:700;font-size:1.35rem;color:#fff;text-decoration:none}
.marca i{display:grid;place-items:center;width:36px;height:36px;border-radius:11px;background:linear-gradient(135deg,var(--turquesa),var(--media))}
.topo nav{display:flex;gap:2rem}
.topo nav a,.topo .entrar{color:rgba(255,255,255,.78);text-decoration:none;font-size:.94rem;font-weight:500;transition:color .2s}
.topo nav a:hover,.topo .entrar:hover{color:#fff}
.topo .acoes{display:flex;align-items:center;gap:1.1rem}
.topo .botao{padding:.6rem 1.15rem;font-size:.9rem}
.tema-btn{background:none;border:1px solid rgba(255,255,255,.2);color:#fff;width:38px;height:38px;border-radius:50%;cursor:pointer;display:grid;place-items:center}
@media(max-width:820px){.topo nav{display:none}}
@media(max-width:420px){.topo .entrar{display:none}}

/* Hero */
.hero{--mar:clamp(260px,34vh,360px);position:relative;background:linear-gradient(180deg,#030f16 0%,#062130 45%,#0f3d4e calc(100% - var(--mar)),#0d3442 calc(100% - var(--mar)),#04151c 100%);color:#fff;padding:128px 0 0;overflow:hidden;isolation:isolate}
.cena-mar{position:absolute;inset:0;z-index:-1;display:block;pointer-events:none}
.hero__mar{position:absolute;left:0;right:0;bottom:0;height:var(--mar);pointer-events:none;visibility:hidden}

.hero__grade{display:grid;gap:3rem;align-items:center;padding-bottom:calc(var(--mar) + 8px)}
@media(min-width:980px){.hero__grade{grid-template-columns:1.08fr .92fr}}
.pilula{display:inline-flex;align-items:center;gap:.6rem;padding:.4rem .9rem .4rem .45rem;border-radius:999px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);font-size:.85rem;color:rgba(255,255,255,.85)}
.pilula b{background:var(--turquesa);color:var(--abismo);padding:.15rem .55rem;border-radius:999px;font-size:.72rem;letter-spacing:.04em}
.hero h1{font-size:clamp(2.6rem,6vw,4.6rem);margin:1.4rem 0 1.3rem;font-weight:600}
.hero h1 em{font-style:italic;font-weight:400;background:linear-gradient(90deg,#d8efec,var(--turquesa));-webkit-background-clip:text;background-clip:text;color:transparent}
.hero p.lead{font-size:1.18rem;color:rgba(255,255,255,.75);max-width:34rem}
.hero .ctas{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:2.2rem}
.provas{display:flex;flex-wrap:wrap;gap:1.6rem;margin-top:2.6rem;color:rgba(255,255,255,.65);font-size:.88rem}
.provas span{display:flex;align-items:center;gap:.45rem}
.provas svg{color:var(--espuma)}

/* Telefone */
.telefone-wrap{position:relative;display:flex;justify-content:center}
.telefone-wrap::before{content:"";position:absolute;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,rgba(47,181,166,.35),transparent 65%);top:50%;left:50%;transform:translate(-50%,-50%);filter:blur(20px);z-index:-1}
.telefone{width:min(350px,100%);background:#0b141a;border-radius:42px;padding:12px;box-shadow:0 0 0 1.5px rgba(255,255,255,.12),0 50px 100px -30px rgba(0,0,0,.7);transform:rotate(-2deg);animation:flutua 7s ease-in-out infinite}
@keyframes flutua{50%{transform:rotate(-1deg) translateY(-12px)}}
.tela{border-radius:32px;overflow:hidden;background:#0b141a}
.zap-topo{display:flex;align-items:center;gap:.7rem;padding:1.1rem 1rem .8rem;background:#1f2c34}
.zap-topo .av{width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,var(--turquesa),var(--media));display:grid;place-items:center;font-weight:700;font-size:.8rem}
.zap-topo b{display:block;font-size:.92rem}
.zap-topo small{color:#7fd9a4;font-size:.75rem;display:inline-flex;align-items:center;gap:.35rem}
.zap-topo small::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.msg small .lido{color:#53bdeb;vertical-align:-3px;margin-left:.2rem}
.conversa{height:430px;padding:1rem .8rem;display:flex;flex-direction:column;gap:.45rem;background:#0b141a url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='60'%3E%3Cpath d='M0 30h60M30 0v60' stroke='%23ffffff' stroke-opacity='.025'/%3E%3C/svg%3E");overflow:hidden;justify-content:flex-end}
.msg{max-width:82%;padding:.5rem .7rem .35rem;border-radius:10px;font-size:.86rem;line-height:1.4;white-space:pre-line;opacity:0;transform:translateY(8px) scale(.98);animation:entra .4s forwards}
.msg small{display:block;text-align:right;font-size:.66rem;opacity:.55;margin-top:.15rem}
.msg.cli{align-self:flex-end;background:#005c4b;border-top-right-radius:3px}
.msg.bot{align-self:flex-start;background:#1f2c34;border-top-left-radius:3px}
.msg .chips{display:flex;flex-wrap:wrap;gap:.3rem;margin-top:.4rem}
.msg .chips span{border:1px solid rgba(127,217,164,.5);color:#7fd9a4;padding:.1rem .5rem;border-radius:999px;font-size:.76rem}
.digitando{align-self:flex-start;background:#1f2c34;border-radius:10px;padding:.6rem .8rem;display:flex;gap:4px}
.digitando i{width:6px;height:6px;border-radius:50%;background:#8696a0;animation:pula 1s infinite}
.digitando i:nth-child(2){animation-delay:.15s}.digitando i:nth-child(3){animation-delay:.3s}
@keyframes pula{50%{transform:translateY(-4px);opacity:.5}}
@keyframes entra{to{opacity:1;transform:none}}
.flutuante{position:absolute;background:rgba(255,255,255,.95);color:#0d1f26;padding:.75rem 1rem;border-radius:16px;box-shadow:0 20px 40px -12px rgba(0,0,0,.45);font-size:.82rem;display:flex;gap:.65rem;align-items:center}
.flutuante b{display:block;font-size:.9rem}
.flutuante .ic{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;flex:none}
.f1{left:-10px;top:18%;animation:flutua 6s ease-in-out infinite .5s}
.f2{right:-14px;bottom:16%;animation:flutua 8s ease-in-out infinite 1s}
@media(max-width:560px){.flutuante{display:none}}
.onda{position:absolute;left:0;right:0;bottom:-1px;line-height:0}
.onda svg{width:200%;height:90px;animation:mar 18s linear infinite}
.onda svg:nth-child(2){position:absolute;left:0;bottom:0;animation-duration:11s;opacity:.5}
@keyframes mar{to{transform:translateX(-50%)}}

/* Faixas */
.faixa{padding:110px 0}
.cabeca{max-width:44rem;margin-bottom:3.5rem}
.cabeca h2{font-size:clamp(2rem,4vw,3rem);margin:.8rem 0 1rem}
.cabeca p{color:var(--tinta-2);font-size:1.1rem}
.centro{text-align:center;margin-inline:auto}
.centro .selo::after{content:"";width:18px;height:2px;background:currentColor;border-radius:2px}

/* Passos */
.passos{display:grid;gap:1.25rem;counter-reset:p}
@media(min-width:720px){.passos{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1080px){.passos{grid-template-columns:repeat(4,1fr)}}
.passo{position:relative;background:var(--cartao);border:1px solid var(--borda);border-radius:var(--r);padding:2rem 1.6rem;transition:transform .3s,box-shadow .3s}
.passo:hover{transform:translateY(-4px);box-shadow:var(--sombra)}
.passo .n{font-family:var(--serif);font-size:3.2rem;line-height:1;font-weight:700;background:linear-gradient(135deg,var(--turquesa),var(--media));-webkit-background-clip:text;background-clip:text;color:transparent}
.passo h3{font-size:1.3rem;margin:1rem 0 .6rem}
.passo p{color:var(--tinta-2);font-size:.95rem}
.passo:last-child{background:linear-gradient(160deg,var(--mar),var(--abismo));color:#fff;border-color:transparent}
.passo:last-child p{color:rgba(255,255,255,.7)}
.passo:last-child .n{background:linear-gradient(135deg,#d8efec,var(--turquesa));-webkit-background-clip:text;background-clip:text}

/* Recursos (bento) */
.faixa--areia{background:var(--areia)}
.bento{display:grid;gap:1.25rem}
@media(min-width:900px){.bento{grid-template-columns:repeat(6,1fr)}.b-a{grid-column:span 4}.b-b{grid-column:span 2}.b-c,.b-d,.b-e{grid-column:span 2}.b-f{grid-column:span 6}}
.rec{background:var(--cartao);border:1px solid var(--borda);border-radius:var(--r);padding:2rem;position:relative;overflow:hidden}
.rec .ic{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;background:color-mix(in srgb,var(--turquesa) 14%,transparent);color:var(--turquesa);margin-bottom:1.3rem}
.rec h3{font-size:1.35rem;margin-bottom:.55rem}
.rec p{color:var(--tinta-2);font-size:.97rem;max-width:36rem}
.b-a{display:grid;gap:1.5rem}
@media(min-width:700px){.b-a{grid-template-columns:1fr 1fr;align-items:center}}
.agenda{background:var(--areia);border-radius:14px;padding:1rem;display:grid;gap:.45rem;font-size:.85rem}
.slot{display:flex;justify-content:space-between;align-items:center;padding:.6rem .8rem;border-radius:10px;background:var(--cartao);border:1px solid var(--borda)}
.slot.ocupado{opacity:.5;text-decoration:line-through}
.slot.ok{border-color:var(--turquesa);box-shadow:0 0 0 3px color-mix(in srgb,var(--turquesa) 18%,transparent)}
.slot em{font-style:normal;font-size:.72rem;font-weight:600;padding:.15rem .5rem;border-radius:999px;background:color-mix(in srgb,var(--turquesa) 16%,transparent);color:var(--turquesa)}
.b-f{display:flex;flex-wrap:wrap;gap:1.5rem;align-items:center;justify-content:space-between;background:linear-gradient(120deg,var(--mar),var(--abismo));color:#fff;border:0}
.b-f p{color:rgba(255,255,255,.72)}
.b-f .ic{background:rgba(255,255,255,.08);color:#d8efec}

/* Planos */
.alternador{display:inline-flex;padding:5px;border-radius:999px;background:var(--areia-2);border:1px solid var(--borda);margin-top:1.8rem;position:relative}
.alternador button{position:relative;z-index:1;border:0;background:none;padding:.6rem 1.3rem;border-radius:999px;font:600 .9rem var(--sans);color:var(--tinta-2);cursor:pointer;transition:color .25s}
.alternador button[aria-pressed="true"]{color:var(--tinta)}
.alternador .pista{position:absolute;top:5px;bottom:5px;border-radius:999px;background:var(--cartao);box-shadow:0 2px 8px rgba(0,0,0,.12);transition:all .3s cubic-bezier(.4,1.3,.5,1)}
.alternador small{color:var(--turquesa);font-weight:700;margin-left:.3rem}
.planos{display:grid;gap:1.25rem;align-items:stretch}
@media(min-width:640px){.planos{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1120px){.planos{grid-template-columns:repeat(4,1fr)}}
.plano{display:flex;flex-direction:column;background:var(--cartao);border:1px solid var(--borda);border-radius:24px;padding:2rem 1.6rem;position:relative;transition:transform .3s,box-shadow .3s}
.plano:hover{transform:translateY(-6px);box-shadow:var(--sombra)}
.plano .emb{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;color:var(--turquesa);background:color-mix(in srgb,var(--turquesa) 12%,transparent)}
.plano--destaque .emb{color:#d8efec;background:rgba(255,255,255,.08)}
.plano h3{font-size:1.55rem;margin:.8rem 0 .3rem}
.plano .desc{color:var(--tinta-2);font-size:.9rem;min-height:2.9em}
.preco{margin:1.4rem 0 .2rem;display:flex;align-items:baseline;gap:.3rem}
.preco b{font-family:var(--serif);font-size:2.6rem;letter-spacing:-.03em;font-weight:700}
.preco span{color:var(--tinta-3);font-size:.9rem}
.economia{font-size:.82rem;color:var(--turquesa);font-weight:600;min-height:1.3em}
.limites{display:grid;grid-template-columns:repeat(3,1fr);gap:.4rem;margin:1.4rem 0;padding:1rem 0;border-block:1px dashed var(--borda);text-align:center}
.limites b{display:block;font-family:var(--serif);font-size:1.25rem}
.limites small{font-size:.7rem;color:var(--tinta-3);line-height:1.2;display:block}
.inclui{list-style:none;padding:0;display:grid;gap:.6rem;margin-bottom:1.8rem;font-size:.9rem}
.inclui li{display:flex;gap:.6rem;align-items:center}
.inclui li::before{content:"";flex:none;width:18px;height:18px;border-radius:50%;background:color-mix(in srgb,var(--turquesa) 16%,transparent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232fb5a6' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12l4 4 8-8'/%3E%3C/svg%3E") center/11px no-repeat}
.inclui li.nao{color:var(--tinta-3)}
.inclui li.nao::before{background:var(--areia-2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237d979f' stroke-width='3' stroke-linecap='round'%3E%3Cpath d='M7 12h10'/%3E%3C/svg%3E") center/11px no-repeat}
.plano .botao{margin-top:auto;width:100%;white-space:normal;text-align:center}
.plano--destaque{background:linear-gradient(170deg,#0f4556,var(--abismo));color:#fff;border-color:transparent;box-shadow:0 30px 60px -25px rgba(6,34,44,.6)}
.plano--destaque .desc,.plano--destaque .preco span,.plano--destaque .limites small{color:rgba(255,255,255,.62)}
.plano--destaque .limites{border-color:rgba(255,255,255,.15)}
.plano--destaque .economia{color:var(--espuma)}
.plano--destaque .inclui li.nao{color:rgba(255,255,255,.4)}
.plano--destaque .inclui li.nao::before{background-color:rgba(255,255,255,.08)}
.fita{position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:var(--turquesa);color:var(--abismo);font-size:.75rem;font-weight:700;padding:.3rem .9rem;border-radius:999px;letter-spacing:.03em;white-space:nowrap}
.nota{margin:2.5rem auto 0;max-width:42rem;text-align:center;color:var(--tinta-2);font-size:.92rem;display:flex;gap:.6rem;align-items:flex-start;justify-content:center}

/* CTA final */
.final{padding:0 0 110px}
.final__caixa{position:relative;overflow:hidden;border-radius:32px;padding:clamp(3rem,7vw,5.5rem) 2rem;text-align:center;color:#fff;background:radial-gradient(600px 300px at 50% 120%,rgba(47,181,166,.45),transparent 70%),linear-gradient(160deg,var(--mar),var(--abismo))}
.final__caixa h2{font-size:clamp(2rem,4.5vw,3.4rem);margin-bottom:1rem}
.final__caixa p{color:rgba(255,255,255,.72);font-size:1.1rem;margin-bottom:2rem}



/* Rodapé */
.rodape{border-top:1px solid var(--borda);padding:2.2rem 0;color:var(--tinta-3);font-size:.88rem}
.rodape .largura{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem}
.rodape .marca{color:var(--tinta);font-size:1.15rem}
.rodape .marca i{width:30px;height:30px;border-radius:9px}

/* Revelar ao rolar */
.revela{opacity:0;transform:translateY(24px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1)}
.revela.visivel{opacity:1;transform:none}
/* Movimento reduzido: nada desliza nem flutua, mas o que aparece ainda aparece com um esmaecimento curto. */
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.telefone,.f1,.f2,.onda svg,.digitando i{animation:none!important}.revela{transform:none;transition:opacity .5s ease}@keyframes entra{from{opacity:0;transform:none}to{opacity:1;transform:none}}.plano:hover,.passo:hover,.botao:hover{transform:none}}
