/* Framework de Criativos DR White — tema Underdogz (mesmo sistema do Raio-X do Funil) */
:root{
  --marinho:#0a1628; --profundo:#0f1f38; --chapa:#122a47; --chapa-2:#163356;
  --luz:#87ceeb; --luz-forte:#b0e0ff; --luz-veu:rgba(135,206,250,.10);
  --azul:#0057ff; --texto:#e8f1f8; --texto-2:#8fa8c4; --texto-3:#6b84a1;
  --linha:rgba(135,206,250,.14); --linha-forte:rgba(135,206,250,.32);
  --erro:#ff9f93; --aviso:#f3c97a; --ok:#86e3bd;
  --display:'Barlow Condensed','Arial Narrow',sans-serif;
  --corpo:'Barlow','Helvetica Neue',Helvetica,sans-serif;
  --raio:5px; --gutter:20px; --max:760px;
  color-scheme:dark;
}
*,*::before,*::after{box-sizing:border-box}
html{background:var(--marinho);-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;font-family:var(--corpo);font-size:17px;line-height:1.55;color:var(--texto);background:transparent;overflow-x:hidden}
body::after{content:'';position:fixed;inset:0;pointer-events:none;z-index:-1;
  background:radial-gradient(1100px 620px at 8% -12%,rgba(0,87,255,.24),transparent 62%),
             radial-gradient(760px 520px at 108% 18%,rgba(135,206,250,.07),transparent 60%),
             linear-gradient(180deg,var(--marinho) 0%,var(--profundo) 100%)}
body::before{content:'';position:fixed;inset:0;pointer-events:none;z-index:0;
  background-image:linear-gradient(var(--linha) 1px,transparent 1px),linear-gradient(90deg,var(--linha) 1px,transparent 1px);
  background-size:44px 44px;opacity:.28;
  -webkit-mask-image:radial-gradient(ellipse 80% 70% at 20% 0%,#000 0%,transparent 75%);
  mask-image:radial-gradient(ellipse 80% 70% at 20% 0%,#000 0%,transparent 75%)}
main{position:relative;z-index:1}
img{max-width:100%;height:auto;display:block}
a{color:var(--luz-forte);text-underline-offset:3px}
::selection{background:rgba(135,206,250,.35)}
:focus-visible{outline:2px solid var(--luz-forte);outline-offset:3px}
h1,h2,h3{font-family:var(--display);font-weight:800;line-height:.98;letter-spacing:-.005em;margin:0}
p{margin:0}

/* ---------- estrutura ---------- */
.sec{padding:52px var(--gutter)}
.sec--curta{padding:34px var(--gutter)}
.env{max-width:var(--max);margin:0 auto}
.centro{text-align:center}
.sep{height:1px;background:linear-gradient(90deg,transparent,var(--linha-forte),transparent);margin:0 var(--gutter)}

/* ---------- tipografia ---------- */
.h1{font-size:clamp(34px,8.4vw,60px);font-weight:900;text-transform:uppercase;letter-spacing:-.015em;line-height:.96}
.h2{font-size:clamp(28px,6.6vw,46px);font-weight:900;text-transform:uppercase;letter-spacing:-.012em;line-height:1.0}
.h3{font-size:clamp(22px,5vw,32px);font-weight:800;text-transform:uppercase;line-height:1.04}
.luz{color:var(--luz-forte)}
.grifo{color:var(--luz-forte);text-shadow:0 0 34px rgba(135,206,250,.35)}
.olho{font-family:var(--corpo);font-weight:600;font-size:13px;letter-spacing:.26em;text-transform:uppercase;
  color:var(--luz);display:flex;align-items:center;gap:11px;justify-content:center}
.olho::before,.olho::after{content:'';height:1px;width:26px;background:var(--luz);opacity:.55}
.p{font-size:clamp(17px,4.2vw,20px);color:var(--texto);margin-top:18px;line-height:1.5}
.p--soft{color:var(--texto-2)}
.p b,.p strong{color:#fff;font-weight:700}
.mini{font-family:var(--corpo);font-size:14px;color:var(--texto-3);margin-top:12px;line-height:1.45}

/* ---------- hero ---------- */
.hero{padding:34px var(--gutter) 40px;text-align:center}
.tarja{display:inline-block;font-family:var(--corpo);font-weight:600;font-size:12px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--luz);border:1px solid var(--linha-forte);border-radius:999px;
  padding:8px 16px;background:var(--luz-veu);margin-bottom:22px}
.selos-tres{display:flex;flex-direction:column;gap:9px;margin:26px 0 0}
.selo3{display:flex;align-items:center;justify-content:center;gap:9px;padding:13px 14px;border-radius:var(--raio);
  border:1px solid var(--linha-forte);background:rgba(18,42,71,.5);
  font-family:var(--display);font-weight:800;font-size:19px;letter-spacing:.04em;text-transform:uppercase;color:var(--texto)}
.selo3 svg{flex:none;color:var(--luz-forte)}

/* ---------- botao ---------- */
.btn{display:block;width:100%;max-width:520px;margin:26px auto 0;padding:21px 22px;border-radius:999px;border:0;
  background:linear-gradient(180deg,#5cf09a,#16a34a);color:#04240f;
  box-shadow:0 14px 34px rgba(74,222,128,.28),inset 0 2px 0 rgba(255,255,255,.35);
  font-family:var(--display);font-weight:900;font-size:clamp(21px,5vw,27px);letter-spacing:.01em;
  text-transform:uppercase;text-align:center;text-decoration:none;cursor:pointer;
  transition:transform .15s ease,box-shadow .15s ease}
.btn:hover{transform:translateY(-2px);box-shadow:0 18px 42px rgba(74,222,128,.36),inset 0 2px 0 rgba(255,255,255,.4)}
.btn:active{transform:translateY(0)}
@media (prefers-reduced-motion:reduce){.btn{transition:none}.btn:hover{transform:none}}

/* ---------- preco ---------- */
.preco{margin-top:20px;text-align:center}
.preco .de{font-family:var(--display);font-weight:700;font-size:22px;color:var(--texto-3);text-decoration:line-through;text-decoration-thickness:2px}
.preco .por{font-family:var(--display);font-weight:800;font-size:16px;letter-spacing:.18em;text-transform:uppercase;color:var(--texto-2);margin-top:4px}
.preco .val{font-family:var(--display);font-weight:900;font-size:clamp(66px,17vw,104px);line-height:.86;color:#fff;
  letter-spacing:-.04em;text-shadow:0 0 54px rgba(135,206,250,.3);margin-top:2px}
.preco .val small{font-size:.42em;color:var(--texto-2);vertical-align:baseline;margin-right:6px}
.parcela{font-size:15px;color:var(--texto-2);margin-top:8px}

/* ---------- prova / figuras ---------- */
.fig{margin:22px auto 0;border:1px solid var(--linha-forte);border-radius:10px;overflow:hidden;
  background:var(--chapa);box-shadow:0 18px 44px rgba(0,0,0,.42)}
.fig img{width:100%}
.fig--nu{border:0;background:none;box-shadow:none}
.cap{font-family:var(--corpo);font-size:14px;color:var(--texto-3);margin-top:10px;text-align:center;line-height:1.4}
.par{display:grid;gap:16px;margin-top:22px}
.par .rot{font-family:var(--corpo);font-weight:700;font-size:12px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--texto-3);margin-bottom:8px;text-align:center}
.par .rot--ok{color:var(--ok)} .par .rot--ruim{color:var(--erro)}

/* ---------- tese ---------- */
.tese{border-left:4px solid var(--luz);padding:20px 0 20px 20px;margin:30px 0 0;background:linear-gradient(90deg,var(--luz-veu),transparent 70%)}
.tese .h2{font-size:clamp(24px,5.6vw,38px)}

/* ---------- listas ---------- */
.lista{list-style:none;padding:0;margin:20px 0 0;display:grid;gap:11px}
.lista li{display:flex;gap:12px;align-items:flex-start;font-size:clamp(17px,4.2vw,20px);line-height:1.4}
.lista li span{flex:none;font-size:19px;line-height:1.3}
.lista--sim li span{color:var(--ok)} .lista--nao li span{color:var(--erro)}

/* ---------- etapas ---------- */
.etapas{display:grid;gap:12px;margin-top:26px;counter-reset:et}
.etapa{position:relative;display:flex;gap:16px;align-items:flex-start;padding:17px 18px;border-radius:8px;
  border:1px solid var(--linha);background:rgba(18,42,71,.45)}
.etapa .n{flex:none;width:38px;height:38px;border-radius:50%;border:2px solid var(--luz);background:var(--marinho);
  display:flex;align-items:center;justify-content:center;font-family:var(--display);font-weight:900;font-size:20px;color:var(--luz-forte)}
.etapa .t{font-family:var(--display);font-weight:900;font-size:24px;text-transform:uppercase;line-height:1;color:var(--texto)}
.etapa .d{font-size:15px;color:var(--texto-2);margin-top:4px;line-height:1.4}

/* ---------- bonus ---------- */
.bonus{margin-top:22px;display:grid;gap:18px}
.card{border:1px solid var(--linha-forte);border-radius:12px;background:linear-gradient(165deg,rgba(18,42,71,.8),rgba(10,22,40,.85));
  padding:22px 20px;box-shadow:0 14px 36px rgba(0,0,0,.34)}
.card .tag{display:inline-block;font-family:var(--corpo);font-weight:700;font-size:11px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--marinho);background:var(--luz-forte);border-radius:4px;padding:5px 11px}
.card .t{font-family:var(--display);font-weight:900;font-size:clamp(22px,5vw,28px);text-transform:uppercase;
  line-height:1.02;margin-top:14px;color:var(--texto)}
.card .t em{font-style:normal;color:var(--luz-forte)}

/* ---------- garantia ---------- */
.selo-g{width:168px;margin:0 auto 4px}

/* ---------- socios ---------- */
.socios{display:grid;gap:20px;margin-top:26px}
.socio{border:1px solid var(--linha);border-radius:12px;background:rgba(18,42,71,.45);padding:22px 20px;text-align:center}
.socio img{width:104px;height:104px;border-radius:50%;object-fit:cover;margin:0 auto 14px;border:2px solid var(--linha-forte)}
.socio .nome{font-family:var(--display);font-weight:900;font-size:27px;text-transform:uppercase;color:var(--texto)}
.socio .bio{font-size:16px;color:var(--texto-2);margin-top:9px;line-height:1.5}

/* ---------- faq ---------- */
.faq{margin-top:22px;display:grid;gap:9px}
.faq details{border:1px solid var(--linha);border-radius:8px;background:rgba(18,42,71,.4);overflow:hidden}
.faq summary{list-style:none;cursor:pointer;padding:17px 46px 17px 18px;position:relative;
  font-family:var(--display);font-weight:800;font-size:20px;line-height:1.16;color:var(--texto)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:'+';position:absolute;right:16px;top:50%;transform:translateY(-50%);
  font-family:var(--display);font-weight:800;font-size:27px;color:var(--luz);line-height:1}
.faq details[open] summary::after{content:'–'}
.faq .r{padding:0 18px 18px;color:var(--texto-2);font-size:16px;line-height:1.55}
.faq .r b{color:var(--texto);font-weight:700}

/* ---------- selos de seguranca ---------- */
.seguros{display:flex;flex-wrap:wrap;justify-content:center;gap:22px;margin-top:26px}
.seg{display:flex;align-items:center;gap:9px;font-size:13px;color:var(--texto-2);line-height:1.2}
.seg b{display:block;color:var(--texto);font-weight:700;font-size:14px}
.seg svg{flex:none;color:var(--texto-2)}

/* ---------- placeholder ---------- */
.ph{border:2px dashed var(--linha-forte);border-radius:10px;background:rgba(18,42,71,.3);
  padding:44px 18px;text-align:center;font-family:var(--corpo);font-size:13px;color:var(--texto-3);
  letter-spacing:.06em;text-transform:uppercase;margin-top:22px}

/* ---------- rodape ---------- */
.rodape{padding:36px var(--gutter) 128px;text-align:center;border-top:1px solid var(--linha);margin-top:20px}
.rodape p{font-size:13px;color:var(--texto-3);line-height:1.6}
.rodape .disc{margin-top:10px;font-style:italic}

/* ---------- barra fixa (mobile) ---------- */
.barra{position:fixed;left:0;right:0;bottom:0;z-index:50;padding:11px 14px calc(11px + env(safe-area-inset-bottom));
  background:linear-gradient(180deg,rgba(10,22,40,.82),rgba(10,22,40,.98));
  border-top:1px solid var(--linha-forte);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  transform:translateY(110%);transition:transform .28s ease;display:flex;align-items:center;gap:13px}
.barra.visivel{transform:translateY(0)}
@media (prefers-reduced-motion:reduce){.barra{transition:none}}
.barra .txt{flex:1;min-width:0;text-align:left}
.barra .txt .a{font-family:var(--display);font-weight:700;font-size:13px;color:var(--texto-3);text-decoration:line-through;line-height:1}
.barra .txt .b{font-family:var(--display);font-weight:900;font-size:27px;color:#fff;line-height:1;margin-top:2px}
.barra .btn{margin:0;width:auto;flex:none;padding:15px 22px;font-size:17px;max-width:none}
@media (min-width:861px){.barra{display:none}}

/* ---------- desktop ---------- */
@media (min-width:861px){
  :root{--gutter:40px;--max:820px}
  body{font-size:18px}
  .sec{padding:76px var(--gutter)}
  .sec--curta{padding:48px var(--gutter)}
  .hero{padding:58px var(--gutter) 64px}
  .selos-tres{flex-direction:row;gap:12px}
  .selo3{flex:1;font-size:17px;padding:15px 10px}
  .par--duo{grid-template-columns:1fr 1fr;gap:22px}
  .bonus{grid-template-columns:1fr 1fr}
  .bonus .card--largo{grid-column:1/-1}
  .socios{grid-template-columns:1fr 1fr}
  .etapa .t{font-size:27px}
  .rodape{padding-bottom:48px}
}
@media (min-width:1180px){:root{--max:880px}}

/* prints em retrato: nao podem comer a rolagem inteira */
.fig--retrato{max-width:320px;margin-left:auto;margin-right:auto}
@media (min-width:861px){.fig--retrato{max-width:380px}}

/* ===== ajustes portados da v2 (16/09) ===== */

/* pré-headline no topo da página */
.faixa-topo{background:linear-gradient(90deg,rgba(0,87,255,.34),rgba(135,206,250,.16));
  border-bottom:1px solid var(--linha-forte);padding:10px 16px;text-align:center;
  font-family:var(--display);font-weight:800;font-size:13px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--luz-forte)}

/* bullets lado a lado já no mobile */
.selos-tres{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin:20px 0 0}
.selo3{flex-direction:row;gap:6px;padding:11px 5px;font-size:11px;line-height:1.12;text-align:center}
.selo3 svg{width:14px;height:14px}

/* hero compacto: preço e botão na primeira dobra */
.hero{padding:20px var(--gutter) 30px}
.ph--hero{padding:30px 16px;margin-top:18px;max-height:30vh;display:grid;place-items:center}
.hero .fig{max-height:30vh;margin-top:18px}
.hero .fig img{max-height:30vh;width:auto;margin:0 auto;object-fit:contain}
.preco{margin-top:18px}
.btn{margin-top:16px;padding:19px 22px}

/* ancoragem riscada em vermelho */
.de--vermelho{color:#FF453A !important;text-decoration-color:#FF453A}

/* respiro menor entre blocos */
.sec{padding:34px var(--gutter)}
.tese{margin-top:24px}
.sep{margin:0 var(--gutter)}
@media (min-width:861px){.sec{padding:52px var(--gutter)}}

/* hierarquia no bloco de entrega */
.p--grande{font-family:var(--display);font-weight:900;font-size:clamp(25px,6vw,38px);
  text-transform:uppercase;line-height:1.02;margin-top:22px;color:var(--texto)}
.p--grande b{color:var(--luz-forte);font-weight:900}
.p--pequena{font-size:clamp(15px,3.7vw,17px);color:var(--texto-2);margin-top:10px;line-height:1.45}
.p--destaque{font-family:var(--display);font-weight:900;font-size:clamp(19px,4.6vw,26px);
  text-transform:uppercase;line-height:1.16;margin-top:24px;color:var(--texto)}
.p--destaque b{color:var(--luz-forte);font-weight:900}
.duplo{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:22px;text-align:left}
.qd{border:1px solid var(--linha-forte);border-radius:10px;background:rgba(18,42,71,.5);padding:14px 13px}
.qd-t{font-family:var(--display);font-weight:900;font-size:15px;text-transform:uppercase;
  line-height:1.08;color:var(--luz-forte)}
.qd-d{font-size:13px;color:var(--texto-2);margin-top:6px;line-height:1.35}

/* figuras dentro dos cards de bônus */
.fig--b{margin-top:16px;max-width:100%}
.fig--b img{width:100%}
.fig--print{background:#fff;padding:10px;border-color:var(--linha-forte)}
.fig--print img{border-radius:6px}
.fig--claro{background:#fff;padding:26px 22px;border-color:var(--linha-forte)}
.fig--claro img{max-width:230px;margin:0 auto}

/* barra fixa: só o botão */
.barra .btn{margin:0;width:100%;max-width:none;padding:16px 20px;font-size:18px}

/* bloco da entrega: três pesos, linha curta */
.p--intro{font-family:var(--corpo);font-weight:400;font-size:clamp(15px,3.6vw,18px);
  color:var(--texto-2);margin-top:24px;line-height:1.4;text-transform:none}
.p--destaque{font-family:var(--display);font-weight:900;font-size:clamp(21px,5.2vw,32px);
  text-transform:uppercase;line-height:1.08;margin-top:8px;color:var(--texto)}
.p--destaque b{color:var(--luz-forte);font-weight:900}
.p--fecho{font-family:var(--display);font-weight:900;font-size:clamp(17px,4.2vw,23px);
  text-transform:uppercase;line-height:1.14;margin-top:12px;color:var(--luz-forte)}
/* preço em verde */
.preco .val{color:#4ADE80;text-shadow:0 0 54px rgba(74,222,128,.34)}
.preco .val small{color:rgba(74,222,128,.62)}

/* ======================================================================
   TESTE DE FONTE — Archivo Black + Archivo (a tipografia da v2)
   Para voltar à Barlow Condensed original: apague daqui até o fim do arquivo.
   ====================================================================== */
:root{
  --display:'Archivo Black','Arial Black',sans-serif;
  --corpo:'Archivo','Helvetica Neue',Helvetica,sans-serif;
}
/* Archivo Black só tem um peso: 900 vira negrito falso e borra */
h1,h2,h3,.h1,.h2,.h3,
.selo3,.btn,.preco .de,.preco .por,.preco .val,
.etapa .t,.etapa .n,.card .t,.card .tag,.socio .nome,.faq summary,
.p--grande,.p--destaque,.p--fecho,.qd-t,.rot,.tarja,.faixa-topo,
.barra .txt .a,.barra .txt .b{font-weight:400}
.p--grande b,.p--destaque b{font-weight:400}

/* Archivo Black é bem mais larga que a Condensed: corpo menor e entrelinha maior */
.h1{font-size:clamp(26px,6.6vw,46px);line-height:1.0;letter-spacing:-.02em}
.h2{font-size:clamp(23px,5.6vw,37px);line-height:1.04;letter-spacing:-.018em}
.h3{font-size:clamp(19px,4.6vw,27px);line-height:1.08}
.selo3{font-size:11px;line-height:1.12}
.etapa .t{font-size:21px}
.socio .nome{font-size:24px}
.faq summary{font-size:18px;line-height:1.2}
.preco .val{font-size:clamp(58px,15vw,94px);line-height:.9}
.btn{font-size:clamp(19px,4.8vw,26px)}
.tese .h2{font-size:clamp(22px,5.2vw,32px)}
