section[id]{scroll-margin-top:84px}
:root{
  --preto:#0B0B0C;
  --preto-2:#141518;
  --preto-3:#1E2024;
  --claro:#F2F1EE;
  --claro-2:#E4E2DC;
  --branco:#FFFFFF;
  --amarelo:#FFD400;
  --amarelo-2:#E6BE00;
  --texto:#FFFFFF;
  --texto-fraco:#A7ADB4;
  --tinta:#111214;
  --tinta-2:#4A5055;
  --linha:#2A2D31;
  --linha-clara:#D6D3CA;
  --max:1160px;
  --r:16px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--preto);
  color:var(--texto);
  font-family:Inter,"Helvetica Neue",Arial,sans-serif;
  font-size:17px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3{font-family:Archivo,"Helvetica Neue",Arial,sans-serif;letter-spacing:-.025em;margin:0 0 .5em;line-height:1.04}
h1{font-size:clamp(36px,5vw,60px);font-weight:900;text-transform:uppercase}
h2{font-size:clamp(27px,3.7vw,42px);font-weight:800}
h3{font-size:20px;font-weight:700}
p{margin:0 0 1em}
.wrap{width:100%;max-width:var(--max);margin:0 auto;padding:0 20px}
.wrap--estreito{max-width:760px}

.eyebrow{
  font-family:Archivo,sans-serif;font-weight:700;font-size:12px;
  text-transform:uppercase;letter-spacing:.16em;color:var(--amarelo);margin:0 0 14px;
}
.h2-centro{text-align:center;max-width:18ch;margin-left:auto;margin-right:auto}
.sub-centro{text-align:center;max-width:56ch;margin:0 auto 44px;color:var(--texto-fraco)}
.nota{text-align:center;font-size:14px;color:var(--texto-fraco);margin:14px 0 0}

/* BOTOES */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  background:var(--amarelo);color:#111;
  font-family:Archivo,sans-serif;font-weight:800;font-size:16px;
  letter-spacing:-.01em;
  padding:15px 26px;border-radius:999px;border:2px solid var(--amarelo);
  cursor:pointer;transition:transform .12s ease,background .15s ease;
  text-align:center;
}
.btn:hover{background:var(--amarelo-2);border-color:var(--amarelo-2);transform:translateY(-1px)}
.btn--sm{padding:10px 20px;font-size:14px}
.btn--lg{padding:17px 32px;font-size:17px}
.btn--full{width:100%}
.btn--linha{background:transparent;color:var(--amarelo);border-color:var(--amarelo)}
.btn--linha:hover{background:var(--amarelo);color:#111}
.sec--clara .btn--linha{color:#111;border-color:#111}
.sec--clara .btn--linha:hover{background:#111;color:#fff;border-color:#111}

/* TOPBAR + NAV */
.topbar{background:var(--amarelo);color:#111;font-size:13px;font-weight:600}
.topbar__in{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;padding-top:9px;padding-bottom:9px}
.topbar .dot{width:4px;height:4px;border-radius:50%;background:#111;opacity:.45}

.nav{position:sticky;top:0;z-index:40;background:rgba(11,11,12,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--linha)}
.nav__in{display:flex;align-items:center;gap:20px;padding-top:12px;padding-bottom:12px}
.brand{display:flex;align-items:center;gap:10px;font-family:Archivo,sans-serif;font-weight:800;font-size:16px}
.brand img{border-radius:50%;background:#fff}
.nav__links{display:flex;gap:26px;margin-left:auto;font-size:15px;color:var(--texto-fraco)}
.nav__links a:hover{color:var(--amarelo)}

/* HERO */
.hero{padding:66px 0 54px;background:
  radial-gradient(1000px 420px at 12% 0%, rgba(255,212,0,.10), transparent 62%),
  var(--preto);}
.hero__in{display:grid;grid-template-columns:1.05fr .95fr;gap:52px;align-items:center}
.hero__txt .lead{font-size:19px;color:#D7DBDF;max-width:46ch}
.hero__cta{display:flex;flex-wrap:wrap;gap:12px;margin:28px 0 22px}
.hero__selos{list-style:none;display:flex;flex-wrap:wrap;gap:10px;margin:0;padding:0}
.hero__selos li{
  font-size:13px;font-weight:600;color:#E7EAEC;
  border:1px solid var(--linha);border-radius:999px;padding:7px 14px;background:var(--preto-2);
}
.hero__img{margin:0;position:relative}
.hero__img img{border-radius:var(--r);width:100%;object-fit:cover;max-height:620px}
.hero__img figcaption{
  margin-top:14px;font-size:14px;color:var(--amarelo);font-weight:600;text-align:center;
}

/* FAIXA */
.faixa{background:var(--amarelo);color:#111}
.faixa__in{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;padding-top:22px;padding-bottom:22px}
.fato{display:flex;flex-direction:column;gap:2px}
.fato strong{font-family:Archivo,sans-serif;font-size:16px;font-weight:800}
.fato span{font-size:14px;opacity:.78}

/* SECOES */
.sec{padding:78px 0}
.sec--escura{background:var(--preto-2)}
.sec--clara{background:var(--claro);color:var(--tinta)}
.sec--clara .eyebrow{color:#8A7A00}
.sec--clara .sub-centro{color:var(--tinta-2)}
.sec--clara .nota{color:var(--tinta-2)}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.foto img{border-radius:var(--r)}
.foto--alta img{max-height:560px;width:100%;object-fit:cover}
.frase{
  border-left:3px solid var(--amarelo);padding-left:16px;margin-top:22px;
  font-family:Archivo,sans-serif;font-weight:600;font-size:19px;line-height:1.35;color:#fff;
}

/* PARA QUEM E */
.publicos{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:40px}
.publico{background:var(--preto-3);border:1px solid var(--linha);border-radius:var(--r);padding:24px 22px}
.publico h3{color:var(--amarelo);font-size:17px;margin-bottom:10px}
.publico p{margin:0;font-size:15px;color:#C9CED3}

/* PASSOS */
.passos{list-style:none;counter-reset:p;display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin:40px 0 0;padding:0}
.passos li{background:var(--preto-2);border:1px solid var(--linha);border-radius:var(--r);padding:26px 24px}
.passo__n{font-family:Archivo,sans-serif;font-weight:900;font-size:28px;color:var(--amarelo);display:block;margin-bottom:8px}
.passos p{margin:0;color:#C9CED3;font-size:15px}

/* TABELA DE CAPACIDADE */
.tabela-cap{width:100%;max-width:620px;margin:0 auto;border-collapse:collapse;background:var(--branco);border-radius:var(--r);overflow:hidden}
.tabela-cap thead th{
  background:#111;color:var(--amarelo);font-family:Archivo,sans-serif;font-size:13px;
  text-transform:uppercase;letter-spacing:.12em;padding:14px 20px;text-align:left;
}
.tabela-cap tbody th{
  text-align:left;padding:16px 20px;font-family:Archivo,sans-serif;font-weight:800;font-size:20px;
  border-top:1px solid var(--linha-clara);width:45%;
}
.tabela-cap tbody td{padding:16px 20px;border-top:1px solid var(--linha-clara);color:var(--tinta-2)}
.foto-larga{margin:40px 0 0}
.foto-larga img{border-radius:var(--r);width:100%}

/* MODELOS */
.modelos{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:40px}
.modelo{position:relative;background:var(--preto-2);border:1px solid var(--linha);border-radius:var(--r);overflow:hidden;display:flex;flex-direction:column}
.modelo--destaque{border-color:var(--amarelo)}
.modelo .tag{
  position:absolute;top:14px;left:14px;z-index:2;background:var(--amarelo);color:#111;
  font-family:Archivo,sans-serif;font-weight:800;font-size:12px;text-transform:uppercase;
  letter-spacing:.08em;padding:6px 12px;border-radius:999px;
}
.modelo figure{margin:0;background:#fff}
.modelo figure img{width:100%;height:320px;object-fit:contain;padding:18px}
.modelo__corpo{padding:24px}
.modelo__corpo p{margin:0;color:#C9CED3;font-size:15px}

/* USOS */
.usos{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:40px}
.uso{margin:0;background:var(--preto-3);border:1px solid var(--linha);border-radius:var(--r);overflow:hidden}
.uso img{width:100%;height:220px;object-fit:cover}
.uso figcaption{padding:18px;font-size:14px;color:#C9CED3}
.uso figcaption strong{display:block;font-family:Archivo,sans-serif;font-size:16px;color:#fff;margin-bottom:6px}

/* COMPRA */
.compra{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:8px}
.card-compra{
  position:relative;background:var(--branco);border:1px solid var(--linha-clara);
  border-radius:var(--r);overflow:hidden;display:flex;flex-direction:column;
}
.card-compra--destaque{border:2px solid #111;box-shadow:0 18px 40px rgba(0,0,0,.12)}
.card-compra .tag{
  position:absolute;top:14px;left:14px;z-index:2;background:var(--amarelo);color:#111;
  font-family:Archivo,sans-serif;font-weight:800;font-size:12px;text-transform:uppercase;
  letter-spacing:.08em;padding:6px 12px;border-radius:999px;
}
.card-compra figure{margin:0;background:var(--claro-2);display:flex;justify-content:center}
.card-compra figure img{height:300px;width:auto;object-fit:contain;padding:16px 0}
.card-compra__corpo{padding:24px;display:flex;flex-direction:column;gap:6px;flex:1}
.card-compra .litros{font-family:Archivo,sans-serif;font-weight:900;font-size:28px;color:var(--tinta)}
.card-compra__uso{margin:0;color:var(--tinta-2);font-size:15px}
.card-compra__preco{margin:10px 0 18px;display:flex;flex-direction:column}
.card-compra__preco strong{font-family:Archivo,sans-serif;font-size:32px;font-weight:900;color:var(--tinta);line-height:1}
.card-compra__preco span{font-size:14px;color:var(--tinta-2);margin-top:4px}
.card-compra .btn{margin-top:auto}

.garantias{
  list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:14px;
  margin:44px 0 0;padding:0;font-size:14px;color:var(--tinta-2);
}
.garantias li{background:var(--branco);border:1px solid var(--linha-clara);border-radius:12px;padding:14px 16px}
.garantias strong{display:block;font-family:Archivo,sans-serif;color:var(--tinta);font-size:15px}

/* FAQ */
.faq details{border-top:1px solid var(--linha);padding:4px 0}
.faq details:last-child{border-bottom:1px solid var(--linha)}
.faq summary{
  cursor:pointer;list-style:none;padding:18px 36px 18px 0;position:relative;
  font-family:Archivo,sans-serif;font-weight:700;font-size:17px;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:6px;top:15px;font-size:24px;color:var(--amarelo);font-weight:700}
.faq details[open] summary::after{content:"–"}
.faq p{margin:0 0 18px;color:#C9CED3;font-size:15px}

/* FINAL */
.final{background:var(--amarelo);color:#111;padding:72px 0;text-align:center}
.final__in{display:flex;flex-direction:column;align-items:center}
.final__logo{border-radius:50%;background:#fff;margin-bottom:20px}
.final h2{max-width:16ch}
.final p{max-width:46ch;opacity:.8}
.final .btn{background:#111;border-color:#111;color:var(--amarelo);margin-top:10px}
.final .btn:hover{background:#000;border-color:#000}

/* RODAPE */
.rodape{background:var(--preto);border-top:1px solid var(--linha);padding:54px 0 0}
.rodape__in{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:32px;padding-bottom:36px}
.rodape__col img{border-radius:50%;background:#fff;margin-bottom:14px}
.rodape__col h3{font-size:14px;text-transform:uppercase;letter-spacing:.12em;color:var(--amarelo)}
.rodape__nome{font-family:Archivo,sans-serif;font-weight:800;margin:0 0 4px}
.rodape__cidade{color:var(--texto-fraco);font-size:15px;margin:0}
.rodape__lista{list-style:none;margin:0;padding:0;font-size:15px;color:var(--texto-fraco)}
.rodape__lista li{padding:5px 0}
.rodape__lista a:hover{color:var(--amarelo)}
.rodape__fim{border-top:1px solid var(--linha);padding-top:20px;padding-bottom:20px;font-size:13px;color:var(--texto-fraco)}

/* BARRA FIXA MOBILE */
.barra{
  position:fixed;left:0;right:0;bottom:0;z-index:50;display:none;
  align-items:center;gap:14px;padding:12px 16px calc(12px + env(safe-area-inset-bottom));
  background:rgba(11,11,12,.96);border-top:1px solid var(--linha);
  transform:translateY(110%);transition:transform .22s ease;
}
.barra.ativa{transform:translateY(0)}
.barra__preco{display:flex;flex-direction:column;line-height:1.1}
.barra__preco strong{font-family:Archivo,sans-serif;font-size:16px}
.barra__preco span{font-size:12px;color:var(--texto-fraco)}
.barra .btn{margin-left:auto;padding:13px 22px;font-size:15px}

/* RESPONSIVO */
@media (max-width:980px){
  .hero__in{grid-template-columns:1fr;gap:34px}
  .hero__img img{max-height:460px}
  .grid-2{grid-template-columns:1fr;gap:28px}
  .faixa__in{grid-template-columns:repeat(2,1fr)}
  .publicos,.usos{grid-template-columns:repeat(2,1fr)}
  .passos{grid-template-columns:1fr}
  .modelos{grid-template-columns:1fr}
  .compra{grid-template-columns:1fr;max-width:420px;margin-left:auto;margin-right:auto}
  .garantias{grid-template-columns:repeat(2,1fr)}
  .rodape__in{grid-template-columns:1fr;gap:26px}
  .nav__links{display:none}
}
@media (max-width:640px){
  body{font-size:16px}
  .sec{padding:58px 0}
  .hero{padding:44px 0 38px}
  .topbar__in{font-size:12px;gap:8px}
  .publicos,.usos,.garantias{grid-template-columns:1fr}
  .uso img{height:200px}
  .barra{display:flex}
  main{padding-bottom:0}
  body.com-barra{padding-bottom:78px}
}

/* PAGINA DE OBRIGADO */
.obrigado{min-height:100vh;display:flex;align-items:center;padding:56px 0;background:var(--preto)}
.obrigado__in{display:flex;flex-direction:column;align-items:center;text-align:center}
.obrigado__logo{border-radius:50%;background:#fff;margin-bottom:18px}
.obrigado h1{font-size:clamp(30px,4.4vw,46px)}
.obrigado__texto{max-width:46ch;color:var(--texto-fraco);margin-bottom:26px}
.obrigado__ref{font-size:14px;color:var(--texto-fraco);margin:18px 0 0}
.obrigado__passos{
  list-style:none;counter-reset:p;padding:0;margin:36px 0 0;
  text-align:left;max-width:44ch;width:100%;
}
.obrigado__passos li{
  counter-increment:p;position:relative;padding:0 0 0 42px;margin:0 0 14px;
  color:var(--texto-fraco);font-size:16px;
}
.obrigado__passos li::before{
  content:counter(p);position:absolute;left:0;top:-1px;
  width:28px;height:28px;border-radius:50%;
  background:var(--amarelo);color:#111;
  font-family:Archivo,sans-serif;font-weight:800;font-size:14px;
  display:flex;align-items:center;justify-content:center;
}
.obrigado__voltar{margin-top:34px;font-size:15px;color:var(--texto-fraco);text-decoration:underline}
.obrigado__voltar:hover{color:var(--amarelo)}