/* ==========================================================================
   Oferta black — página de venda direta (pt-BR)
   Identidade própria: fundo quase preto, amarelo de impacto, vermelho para a
   coluna ruim e verde para a coluna que ganha. Nada de repaint das anteriores.
   ========================================================================== */

:root{
  --fundo:#0a0a0b;
  --fundo-2:#121214;
  --fundo-3:#1a1a1e;
  --texto:#f4f4f5;
  --texto-2:#b9b9c0;
  --texto-3:#8a8a93;
  --amarelo:#ffd400;
  --vermelho:#ff3b30;
  --verde:#19c37d;
  --fio:#26262b;
  --font:'IBM Plex Sans',system-ui,-apple-system,'Segoe UI',Helvetica,sans-serif;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:12px}
body{
  margin:0;background:var(--fundo);color:var(--texto);
  font-family:var(--font);font-size:17px;line-height:1.55;
  padding-bottom:96px;overflow-x:hidden;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
p{margin:0 0 1em}
.wrap{width:100%;max-width:880px;margin:0 auto;padding:0 16px}

/* ---------- topo ---------- */
.topo{
  border-bottom:1px solid var(--fio);background:#0d0d0f;
  padding:11px 0;position:sticky;top:0;z-index:40;
}
.topo .in{max-width:880px;margin:0 auto;padding:0 16px;display:flex;align-items:center;justify-content:space-between;gap:12px}
.topo .marca{display:flex;align-items:center;gap:9px;font-weight:700;letter-spacing:-.01em}
.topo .pt{width:9px;height:9px;border-radius:50%;background:var(--vermelho);box-shadow:0 0 0 4px rgba(255,59,48,.18)}
.topo .mini-cta{
  background:var(--amarelo);color:#171500;font-weight:800;font-size:13px;letter-spacing:.04em;
  padding:8px 13px;border-radius:3px;white-space:nowrap;
}

/* ---------- hero ---------- */
.hero{padding:26px 0 8px}
.selo{
  display:inline-block;background:var(--vermelho);color:#fff;font-size:12px;font-weight:800;
  letter-spacing:.14em;text-transform:uppercase;padding:5px 11px;border-radius:2px;margin-bottom:14px;
}
h1{
  font-size:clamp(28px,5.2vw,54px);line-height:1.04;letter-spacing:-.028em;font-weight:800;
  text-transform:uppercase;margin:0 0 16px;
}
h1 .am{color:var(--amarelo)}
h1 .vm{color:var(--vermelho)}
h1 .vd{color:var(--verde)}
.sub{font-size:clamp(17px,2.2vw,21px);color:var(--texto-2);margin:0 0 20px;max-width:60ch}
.sub b{color:#fff}

.ancora{
  display:grid;grid-template-columns:1fr;gap:12px;margin:20px 0 6px;
  background:var(--fundo-2);border:1px solid var(--fio);border-left:4px solid var(--amarelo);
  padding:16px 18px;border-radius:3px;
}
@media (min-width:620px){.ancora{grid-template-columns:1.2fr 1fr;align-items:center}}
.ancora .rot{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--texto-3);font-weight:700}
.ancora .de{font-size:19px;color:var(--texto-3);text-decoration:line-through}
.ancora .por{font-size:clamp(38px,7vw,58px);font-weight:800;line-height:1;color:#fff;letter-spacing:-.03em}
.ancora .por small{font-size:.4em;vertical-align:super;color:var(--amarelo);font-weight:700}
.ancora .dose{font-size:14.5px;color:var(--texto-2)}
.ancora .dose b{color:var(--verde)}

/* ---------- botões ---------- */
.botao{
  display:block;width:100%;background:var(--amarelo);color:#171500;border:0;border-radius:4px;
  padding:19px 18px;font-family:var(--font);font-weight:800;font-size:19px;letter-spacing:-.01em;
  text-align:center;cursor:pointer;transition:transform .1s ease,filter .12s ease;
}
.botao:hover{filter:brightness(1.06)}
.botao:active{transform:translateY(2px)}
.botao.vermelho{background:var(--vermelho);color:#fff}
.botao.fantasma{background:transparent;color:var(--texto);border:1px solid #3a3a42;font-size:15.5px;padding:14px 16px;font-weight:700}
.cta{margin:18px 0 8px}
.cta .abaixo{text-align:center;font-size:13px;color:var(--texto-3);margin-top:9px}
.cta .abaixo b{color:var(--texto-2)}

/* ---------- seções ---------- */
section{padding:30px 0 0}
h2{
  font-size:clamp(22px,3.4vw,34px);line-height:1.12;letter-spacing:-.022em;font-weight:800;
  text-transform:uppercase;margin:0 0 12px;
}
h2 .am{color:var(--amarelo)}
h2 .vm{color:var(--vermelho)}
h2 .vd{color:var(--verde)}
.lead{color:var(--texto-2);font-size:17.5px;max-width:64ch}
.lead b{color:#fff}

/* ---------- tabela das colunas ---------- */
.colunas{display:grid;grid-template-columns:1fr;gap:12px;margin-top:20px}
@media (min-width:760px){.colunas{grid-template-columns:repeat(3,1fr)}}
.col{border:1px solid var(--fio);border-radius:5px;padding:16px;background:var(--fundo-2);display:flex;flex-direction:column}
.col.ruim{border-color:#4a1f1d;background:#160f0f}
.col.melhor{border:2px solid var(--verde);background:#0d1a15}
.col .tag{
  font-size:11.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;
  color:var(--texto-3);display:flex;justify-content:space-between;gap:8px;
}
.col.ruim .tag{color:var(--vermelho)}
.col.melhor .tag{color:var(--verde)}
.col img{height:118px;width:auto;margin:12px auto 8px}
.col h3{font-size:22px;font-weight:800;margin:4px 0 2px;letter-spacing:-.01em}
.col .sup{font-size:13px;color:var(--texto-3)}
.col dl{margin:14px 0 0;font-size:14.5px;border-top:1px solid var(--fio)}
.col dl div{display:flex;justify-content:space-between;gap:10px;padding:7px 0;border-bottom:1px solid var(--fio)}
.col dt{color:var(--texto-3)}
.col dd{margin:0;font-weight:700}
.col dd.ruim{color:var(--vermelho)}
.col dd.bom{color:var(--verde)}
.col .acao{margin-top:auto;padding-top:14px}
.col .veredito{font-size:13px;text-align:center;margin:9px 0 0;font-weight:700}
.col.ruim .veredito{color:var(--vermelho)}
.col.melhor .veredito{color:var(--verde)}

/* ---------- barras de custo por dose ---------- */
.barras{margin-top:22px;background:var(--fundo-2);border:1px solid var(--fio);border-radius:4px;padding:16px}
.barras .rot{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--texto-3);font-weight:700;margin-bottom:12px}
.linha{display:grid;grid-template-columns:44px 1fr 74px;align-items:center;gap:10px;margin-bottom:10px;font-size:14px}
.linha .fita{height:16px;background:#202026;border-radius:2px;overflow:hidden}
.linha .fita i{display:block;height:100%;width:0;background:linear-gradient(90deg,#7a1f1a,#ff3b30);transition:width .9s cubic-bezier(.22,.61,.36,1)}
.linha.bom .fita i{background:linear-gradient(90deg,#0f7a52,#19c37d)}
.linha .val{text-align:right;font-weight:700;color:var(--texto-2)}
.linha.bom .val{color:var(--verde)}
.barras .pe{font-size:13px;color:var(--texto-3);margin-top:6px}

/* ---------- produto ---------- */
.produto{display:grid;grid-template-columns:1fr;gap:20px;margin-top:22px;align-items:start}
@media (min-width:760px){.produto{grid-template-columns:280px 1fr}}
.produto .foto{background:var(--fundo-2);border:1px solid var(--fio);border-radius:5px;padding:16px;display:grid;place-items:center}
.produto .foto img{max-height:320px;width:auto}
.lista{list-style:none;margin:0;padding:0}
.lista li{display:flex;gap:11px;padding:9px 0;border-bottom:1px solid var(--fio);font-size:15.5px;color:var(--texto-2)}
.lista li b{color:#fff}
.lista .tick{flex:0 0 auto;width:20px;height:20px;border-radius:50%;background:rgba(25,195,125,.15);color:var(--verde);display:grid;place-items:center;font-size:12px;font-weight:800}

/* ---------- pilha da oferta ---------- */
.pilha{margin-top:20px;border:1px solid var(--fio);border-radius:5px;overflow:hidden}
.pilha .cab{background:var(--fundo-3);padding:13px 16px;font-size:12.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--amarelo)}
.pilha ul{list-style:none;margin:0;padding:0}
.pilha li{display:flex;justify-content:space-between;gap:14px;padding:12px 16px;border-top:1px solid var(--fio);font-size:15.5px}
.pilha li b{color:#fff;font-weight:700}
.pilha li span{color:var(--texto-2);white-space:nowrap;font-weight:700}
.pilha li.total{background:#141407;border-top:2px solid var(--amarelo)}
.pilha li.total b{font-size:17px}
.pilha li.total span{color:var(--amarelo);font-size:19px}

/* ---------- garantia ---------- */
.garantia{
  display:flex;gap:15px;align-items:flex-start;margin-top:22px;
  background:var(--fundo-2);border:1px solid var(--fio);border-left:4px solid var(--verde);
  border-radius:3px;padding:17px 18px;
}
.garantia .selo60{
  flex:0 0 auto;width:60px;height:60px;border-radius:50%;border:2px solid var(--verde);color:var(--verde);
  display:grid;place-items:center;font-size:20px;font-weight:800;background:rgba(25,195,125,.08);
}
.garantia b{display:block;color:#fff;font-size:17px;margin-bottom:5px}
.garantia p{margin:0;color:var(--texto-2);font-size:15px}

/* ---------- objeções ---------- */
.obj{margin-top:20px}
.obj .item{border-bottom:1px solid var(--fio);padding:14px 0}
.obj .q{font-weight:800;color:var(--amarelo);font-size:17px;margin-bottom:6px}
.obj .a{color:var(--texto-2);font-size:15.5px;margin:0}
.obj .a b{color:#fff}

/* ---------- fechamento ---------- */
.fechamento{margin-top:30px;background:linear-gradient(180deg,#141405,#0d0d0f);border:1px solid #3a3413;border-radius:6px;padding:22px 18px}
.fechamento h2{margin-bottom:10px}
.fechamento .preco{text-align:center;margin:14px 0 4px}
.fechamento .preco .de{font-size:16px;color:var(--texto-3)}
.fechamento .preco .de s{color:var(--vermelho)}
.fechamento .preco .por{font-size:clamp(46px,10vw,68px);font-weight:800;line-height:1;color:#fff;letter-spacing:-.035em}
.fechamento .preco .por small{font-size:.36em;vertical-align:super;color:var(--amarelo)}
.fechamento .preco .obs{font-size:14.5px;color:var(--texto-2);margin-top:8px}
.pagamentos{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:center;margin-top:16px}
.pagamentos img{height:26px;width:auto;background:#fff;border-radius:3px;padding:3px 6px}
.pagamentos span{font-size:12.5px;color:var(--texto-3)}

footer{margin-top:34px;border-top:1px solid var(--fio);padding:18px 0 6px;font-size:13px;color:var(--texto-3)}
footer .cols{display:grid;grid-template-columns:1fr;gap:14px}
@media (min-width:700px){footer .cols{grid-template-columns:1.3fr 1fr}}
footer b{color:var(--texto-2);display:block;font-size:12px;letter-spacing:.1em;text-transform:uppercase;margin-bottom:5px}

/* ---------- barra fixa ---------- */
.barra{display:none}
@media (max-width:999px){
  .barra{display:none;position:fixed;left:0;right:0;bottom:0;z-index:60;background:rgba(10,10,11,.97);
    border-top:2px solid var(--amarelo);padding:9px 12px calc(9px + env(safe-area-inset-bottom));
    align-items:center;gap:11px}
  body.cta-on .barra{display:flex}
  .barra .mini{font-size:12px;color:var(--texto-3);line-height:1.3}
  .barra .mini b{display:block;color:#fff;font-size:14.5px}
  .barra .botao{flex:1 1 auto;padding:13px 14px;font-size:15px}
  .topo .mini-cta{padding:7px 10px;font-size:12px}
}
@media (min-width:1000px){body{padding-bottom:0}}

@media (prefers-reduced-motion:reduce){
  .sobe{opacity:1;transform:none;transition:none}
  .linha .fita i{transition:none}
}
.sobe{opacity:0;transform:translateY(12px);transition:opacity .5s ease,transform .5s cubic-bezier(.22,.61,.36,1)}
.sobe.vis{opacity:1;transform:none}