/* ===== TEMA (trocar só estas variáveis para mudar a identidade) ===== */
:root{
  --bg:#fff6f1;--fg:#3a2127;--muted:#7a626a;--card:#fff;--border:#f3cfd9;
  --primary:#d62f6a;--primary-2:#f2709f;--soft:#ffe9ef;
  --lilac:#e9ddff;--mint:#d8f2e5;--peach:#ffe2d1;
  --ok:#1f8a58;--red:#d92d3a;
  --font-display:'Fredoka','Trebuchet MS',system-ui,sans-serif;
  --font-body:'Nunito',system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-hand:'Caveat','Comic Sans MS',cursive;
}

/* ===== BASE (mobile first) ===== */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--font-body);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:clip}
img,video,svg{display:block;max-width:100%;height:auto}
h1,h2,h3{font-family:var(--font-display);margin:0;line-height:1.15;text-wrap:balance;overflow-wrap:break-word}
h1{font-size:clamp(1.75rem,7.2vw,3rem);font-weight:700}
h2{font-size:clamp(1.45rem,5.6vw,2.3rem);font-weight:700}
h3{font-size:1.1rem;font-weight:600}
p{margin:0}
.sec{padding:48px 16px}
.alt{background:var(--soft)}
.max3{max-width:768px;margin:0 auto}
.max4{max-width:896px;margin:0 auto}
.max5{max-width:1024px;margin:0 auto}
.center{text-align:center}
.muted{color:var(--muted)}
.hl{color:var(--primary)}

/* cabeçalho de seção */
.eyebrow{display:inline-block;background:var(--card);color:var(--primary);font:600 .72rem var(--font-display);letter-spacing:.14em;text-transform:uppercase;padding:6px 14px;border-radius:999px;box-shadow:0 0 0 2px var(--border);margin-bottom:12px}
.divider{display:flex;align-items:center;justify-content:center;gap:8px;margin:14px 0 0;color:var(--primary)}
.divider span{height:2px;width:40px;background:repeating-linear-gradient(90deg,var(--border) 0 6px,transparent 6px 10px)}
.lead{max-width:640px;margin:18px auto 0;text-align:center;color:var(--muted);font-size:1.05rem}

/* adesivo: borda branca + linha de corte */
.sticker{position:relative;background:var(--card);border:5px solid #fff;border-radius:26px;box-shadow:0 0 0 2px var(--border),0 16px 30px -16px rgba(120,40,70,.45)}
.sticker::after{content:"";position:absolute;inset:7px;border:2px dashed var(--border);border-radius:18px;pointer-events:none}
.sticker.nocut::after{display:none}
.sticker img{border-radius:18px;width:100%}

/* botão */
.cta{margin:28px auto 0;max-width:420px}
.btn{display:flex;align-items:center;justify-content:center;width:100%;min-height:56px;padding:15px 22px;border-radius:999px;border:4px solid #fff;cursor:pointer;
  background:linear-gradient(135deg,var(--primary),var(--primary-2));color:#fff;font:700 1rem var(--font-display);letter-spacing:.04em;text-transform:uppercase;text-decoration:none;text-align:center;line-height:1.2;
  box-shadow:0 0 0 2px var(--primary),0 14px 26px -12px rgba(214,47,106,.7);transition:transform .15s;-webkit-tap-highlight-color:transparent}
.btn:hover{transform:scale(1.02)}
.btn:active{transform:scale(.99)}
.btn:focus-visible{outline:3px solid var(--fg);outline-offset:4px}

/* lista com check */
.chk{list-style:none;padding:0;margin:0;display:grid;gap:12px}
.chk li{display:flex;gap:10px;align-items:flex-start}
.chk li::before{content:"✓";flex:none;width:24px;height:24px;border-radius:50%;background:var(--mint);color:var(--ok);font-weight:800;display:grid;place-items:center;font-size:.85rem;margin-top:1px}

/* ===== 1. HERO (coluna única, vídeo centralizado abaixo da subheadline) ===== */
.hero{background:radial-gradient(circle at 12% 8%,var(--lilac) 0,transparent 42%),radial-gradient(circle at 92% 90%,var(--peach) 0,transparent 42%),var(--bg);border-bottom:2px dashed var(--border);padding-top:calc(40px + env(safe-area-inset-top,0px))}
.hero .in{max-width:760px;margin:0 auto;text-align:center}
.hero .eyebrow{display:inline-flex;gap:6px;align-items:center}
.hero h1{margin-top:6px}
.hero .sub{margin:18px auto 0;max-width:36rem;font-size:1.08rem;color:var(--muted)}
.vid{width:100%;max-width:320px;margin:28px auto 0;padding:0;overflow:hidden}
.vid video{width:100%;aspect-ratio:9/16;object-fit:cover;background:#000;border-radius:20px}

/* ===== 2. PRÉVIAS ===== */
.prev{display:grid;gap:16px;margin:32px auto 0;max-width:1024px;grid-template-columns:1fr}
.ph{display:grid;place-items:center;aspect-ratio:1;padding:12px;text-align:center;font-weight:700;color:var(--primary);background:repeating-linear-gradient(45deg,var(--soft),var(--soft) 10px,#fff 10px,#fff 20px)}

/* ===== 3. FEATURES ===== */
.feat{display:grid;gap:14px;margin:32px auto 0;max-width:896px}

/* ===== 4. PARA VOCÊ ===== */
.ben{display:grid;gap:18px;margin:32px auto 0;max-width:1024px}
.b{padding:24px 22px}
.b .n{display:inline-grid;place-items:center;min-width:52px;height:52px;padding:0 10px;border-radius:999px;font:700 1.25rem var(--font-display);border:3px solid #fff;box-shadow:0 0 0 2px var(--border);margin-bottom:10px}
.b:nth-child(1) .n{background:var(--lilac)}.b:nth-child(2) .n{background:var(--mint)}.b:nth-child(3) .n{background:var(--peach)}.b:nth-child(4) .n{background:var(--soft)}
.b p{margin-top:6px;color:var(--muted)}

/* ===== 5. CONTEÚDO ===== */
.get{display:grid;gap:28px;align-items:center;margin:32px auto 0;max-width:1024px}
.get .sticker{padding:8px}

/* ===== 6. BÔNUS ===== */
.bn-grid{display:grid;gap:22px;margin:32px auto 0;max-width:1100px}
.bn{padding:14px;display:flex;flex-direction:column;gap:14px}
.bn .body{padding:2px 8px 10px}
.bn .tag{display:inline-block;background:var(--primary);color:#fff;font:600 .76rem var(--font-display);letter-spacing:.1em;text-transform:uppercase;padding:4px 14px;border-radius:999px;margin-bottom:8px}
.bn p.d{margin-top:6px;color:var(--muted)}
.bn .val{margin-top:10px;font-weight:800;color:var(--ok)}
.bn .val s{color:var(--red);font-weight:700}
.badge-n{margin-top:16px;font:600 1rem var(--font-display);letter-spacing:.06em;text-transform:uppercase;color:var(--primary)}

/* ===== 7. OFERTA (pacote único) ===== */
.offer{max-width:500px;margin:32px auto 0;padding:26px 20px;text-align:center}
.offer h3{font-size:1.3rem}
.offer img{max-width:340px;margin:16px auto}
.from{font-size:1.15rem;font-weight:700;color:var(--red);text-decoration:line-through}
.por{margin-top:2px}
.price{font:700 3.4rem/1.1 var(--font-display);color:var(--primary)}
.save{margin-top:6px;font-weight:800;color:var(--ok)}
.offer .chk{text-align:left;margin:22px 0}
.offer .cta{margin-top:0;max-width:none}

/* ===== 8. GARANTIA ===== */
.gar{display:grid;gap:20px;justify-items:center;text-align:center;padding:30px 22px;max-width:768px;margin:0 auto}
.gar svg{width:140px;height:140px}
.gar .hand{font:700 1.6rem var(--font-hand);color:var(--primary);margin-top:10px}

/* ===== 9. COMO FUNCIONA ===== */
.steps{display:grid;gap:18px;margin:32px auto 0;max-width:896px}
.st{padding:24px 20px;text-align:center}
.st .ic{width:54px;height:54px;margin:0 auto 10px;border-radius:50%;display:grid;place-items:center;font-size:1.5rem;background:var(--lilac);border:3px solid #fff;box-shadow:0 0 0 2px var(--border)}
.st p{margin-top:6px;color:var(--muted)}

/* ===== 10. FAQ ===== */
.faq{max-width:768px;margin:32px auto 0}
.faq details{background:#fff;border:2px solid var(--border);border-radius:18px;margin-top:12px;overflow:hidden}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:14px;padding:16px 18px;font-weight:800;min-height:52px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";flex:none;font:700 1.4rem var(--font-display);color:var(--primary);transition:transform .2s}
.faq details[open] summary{color:var(--primary)}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{padding:0 18px 18px;color:var(--muted)}

/* ===== RODAPÉ ===== */
footer{padding:40px 16px calc(48px + env(safe-area-inset-bottom,0px));text-align:center;font-size:.85rem;color:var(--muted);border-top:2px dashed var(--border)}
footer .cta{margin:0 auto 32px}
footer p{max-width:720px;margin:8px auto 0}

/* ===== TABLET ≥ 640px ===== */
@media (min-width:640px){
  .sec{padding:64px 24px}
  .prev{grid-template-columns:1fr 1fr}
  .prev .wide{grid-column:1/-1;aspect-ratio:2/1}
  .feat,.ben{grid-template-columns:1fr 1fr}
  .steps{grid-template-columns:repeat(3,1fr)}
  .gar{grid-template-columns:170px 1fr;text-align:left;justify-items:start}
  .offer{padding:32px 28px}
}
/* ===== DESKTOP ≥ 900px ===== */
@media (min-width:900px){
  .get{grid-template-columns:1fr 1fr}
  .bn-grid{grid-template-columns:1fr 1fr}
  .bn-grid .bn:last-child:nth-child(odd){grid-column:1/-1;justify-self:center;width:calc(50% - 11px)}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.btn{transition:none}}
