/* fontes hospedadas aqui: evita DNS+TLS para o Google no caminho crítico */
@font-face{
  font-family:'Anton';
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src:url('/assets/fontes/Anton-400.woff2') format('woff2');
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face{
  font-family:'Poppins';
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src:url('/assets/fontes/Poppins-400.woff2') format('woff2');
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face{
  font-family:'Poppins';
  font-style:normal;
  font-weight:500;
  font-display:swap;
  src:url('/assets/fontes/Poppins-500.woff2') format('woff2');
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face{
  font-family:'Poppins';
  font-style:normal;
  font-weight:600;
  font-display:swap;
  src:url('/assets/fontes/Poppins-600.woff2') format('woff2');
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root{
  --verde:#2d8f1e;
  --verde-esc:#14490c;
  --verde-mais-esc:#0d3208;
  --amarelo:#ffc706;
  --amarelo-claro:#ffdb4d;
  --zap:#25d366;
  --zap-esc:#1da851;
  --branco:#fff;
  --tinta:#12240d;
  --cinza:#6b7768;
  --borda:#dfe6dc;
  --raio:16px;
  --wrap:1120px;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  font-family:'Poppins',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  color:var(--tinta);
  background:var(--verde);
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:inherit}

.wrap{width:100%;max-width:var(--wrap);margin:0 auto;padding:0 20px}

/* ---------- topo ---------- */
/* tarja legal obrigatória, no topo de tudo */
.tarja-legal{
  background:var(--verde-mais-esc);
  color:rgba(255,255,255,.82);
  font-size:10.5px;
  font-weight:500;
  letter-spacing:.08em;
  text-transform:uppercase;
  text-align:center;
  padding:7px 16px;
  line-height:1.4;
}

.topo-camp{
  background:var(--verde);
  padding:16px 0 10px;
}
.topo-camp picture{display:block}
.topo-camp .lockup{
  margin:0 auto;
  width:100%;
  height:auto;   /* sem isso o atributo height=133 estica a imagem */
  max-width:420px;
}

/* ---------- palco ---------- */
.palco{
  position:relative;
  background:
    radial-gradient(120% 80% at 50% 0%, #37a524 0%, var(--verde) 45%, #226f17 100%);
  overflow:hidden;
}
.palco::after{
  content:"";
  position:absolute;inset:auto 0 0 0;height:180px;
  background:linear-gradient(180deg,rgba(13,50,8,0) 0%,rgba(13,50,8,.55) 100%);
  pointer-events:none;
}
.palco .wrap{position:relative;z-index:2;padding-top:22px;padding-bottom:0}

.grade{display:grid;gap:24px}

/* ---------- manchete ---------- */
.manchete{text-align:center}
.manchete .linha{
  font-family:'Anton',Impact,'Arial Narrow Bold',sans-serif;
  font-weight:400;
  letter-spacing:.4px;
  line-height:.98;
  text-transform:uppercase;
  margin:0 0 6px;
  padding:.14em .35em .2em;
  display:block;
}
.manchete .l1{
  background:var(--amarelo);
  color:var(--verde-esc);
  font-size:clamp(34px,10.2vw,62px);
}
.manchete .l2{
  background:var(--verde-esc);
  color:var(--amarelo);
  font-size:clamp(27px,8.1vw,50px);
}
.manchete .l3{
  color:#fff;
  background:none;
  font-size:clamp(26px,7.7vw,47px);
  padding-top:.16em;
  text-shadow:0 2px 0 rgba(0,0,0,.18);
}
.manchete .apoio{
  margin:10px auto 0;
  max-width:22ch;
  color:#fff;
  font-size:clamp(15px,4.2vw,20px);
  font-weight:500;
  line-height:1.35;
  text-shadow:0 1px 2px rgba(0,0,0,.22);
}

/* ---------- imagem da dupla ---------- */
.dupla{
  margin:14px -20px 0;   /* sangra até a borda da tela */
  position:relative;
}
.dupla picture{display:block}
.dupla img{
  width:100%;
  height:auto;
  aspect-ratio:1012/700;   /* mesma proporção do recorte de mobile */
  object-fit:cover;
  object-position:center;
}

/* ---------- cartao do formulario ---------- */
.cartao{
  background:var(--branco);
  border-radius:var(--raio);
  box-shadow:0 18px 46px rgba(6,32,4,.32);
  padding:22px 20px 20px;
}
.cartao h2{
  font-family:'Anton',Impact,sans-serif;
  font-weight:400;
  text-transform:uppercase;
  letter-spacing:.3px;
  font-size:clamp(21px,5.6vw,26px);
  line-height:1.05;
  color:var(--verde-esc);
  margin:0 0 4px;
}
.cartao .chamada{
  margin:0 0 16px;
  font-size:14px;
  line-height:1.45;
  color:var(--cinza);
}

.campo{margin-bottom:13px}
.campo label{
  display:block;
  font-size:12.5px;
  font-weight:600;
  letter-spacing:.02em;
  color:var(--verde-esc);
  margin-bottom:6px;
}
.campo input{
  width:100%;
  font:inherit;
  font-size:16px;
  padding:13px 14px;
  border:1.5px solid var(--borda);
  border-radius:11px;
  background:#fbfdfa;
  color:var(--tinta);
  transition:border-color .15s,box-shadow .15s,background .15s;
}
.campo input::placeholder{color:#a9b3a6}
.campo input:focus{
  outline:none;
  border-color:var(--verde);
  background:#fff;
  box-shadow:0 0 0 3.5px rgba(45,143,30,.16);
}
.campo input[aria-invalid="true"]{
  border-color:#d33a2c;
  box-shadow:0 0 0 3.5px rgba(211,58,44,.13);
}
.erro{
  display:none;
  margin:6px 0 0;
  font-size:12.5px;
  font-weight:500;
  color:#c0392b;
}
.campo.invalido .erro{display:block}

.botao{
  width:100%;
  border:0;
  cursor:pointer;
  font-family:'Anton',Impact,sans-serif;
  font-weight:400;
  text-transform:uppercase;
  letter-spacing:.5px;
  font-size:clamp(17px,4.7vw,20px);
  color:#fff;
  background:linear-gradient(180deg,var(--zap) 0%,var(--zap-esc) 100%);
  border-radius:12px;
  padding:15px 16px;
  margin-top:6px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  box-shadow:0 8px 20px rgba(29,168,81,.32);
  transition:transform .12s,box-shadow .12s,filter .12s;
}
.botao:hover{filter:brightness(1.05)}
.botao:active{transform:translateY(1px);box-shadow:0 5px 14px rgba(29,168,81,.3)}
.botao:disabled{opacity:.72;cursor:progress}
.botao svg{width:22px;height:22px;flex:none;fill:#fff}

.aviso-falha{
  display:none;
  margin:12px 0 0;
  padding:10px 12px;
  border-radius:10px;
  background:#fdecea;
  border:1px solid #f5c6c0;
  color:#a5342a;
  font-size:13px;
  line-height:1.45;
  text-align:center;
}

.selo{
  margin:12px 0 0;
  text-align:center;
  font-size:12px;
  line-height:1.5;
  color:var(--cinza);
}
.selo strong{color:var(--verde-esc)}
.lgpd{
  margin:10px 0 0;
  font-size:11px;
  line-height:1.5;
  color:#8a948a;
  text-align:center;
}

/* ---------- sucesso ---------- */
.sucesso{display:none;text-align:center;padding:8px 0 4px}
.sucesso.on{display:block}
.form-area.off{display:none}
.sucesso .tique{
  width:62px;height:62px;margin:0 auto 14px;
  border-radius:50%;
  background:var(--zap);
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 8px 20px rgba(29,168,81,.35);
}
.sucesso .tique svg{width:32px;height:32px;stroke:#fff;stroke-width:3;fill:none;stroke-linecap:round;stroke-linejoin:round}
.sucesso h2{margin-bottom:8px}
.sucesso p{margin:0 0 16px;font-size:14px;line-height:1.5;color:var(--cinza)}
.sucesso .botao{text-decoration:none}

/* ---------- rodape ---------- */
.rodape-camp{
  background:var(--verde-mais-esc);
  color:rgba(255,255,255,.72);
  padding:26px 0 30px;
  text-align:center;
  font-size:12px;
  line-height:1.65;
}
.rodape-camp strong{color:#fff}
.rodape-camp a{color:var(--amarelo);text-decoration:none;border-bottom:1px solid rgba(255,199,6,.4)}
.rodape-camp a:hover{border-bottom-color:var(--amarelo)}
.rodape-camp .ficha-legal{
  margin:18px auto 0;
  max-width:640px;
  padding:16px 18px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:12px;
  background:rgba(255,255,255,.04);
  font-size:12px;
  line-height:1.7;
}
.rodape-camp .ficha-legal dt{
  color:rgba(255,255,255,.66);
  font-size:10px;
  letter-spacing:.09em;
  text-transform:uppercase;
  margin-top:10px;
}
.rodape-camp .ficha-legal dt:first-child{margin-top:0}
.rodape-camp .ficha-legal dd{margin:1px 0 0;color:#fff}

.rodape-camp .legal{
  margin:14px 0 0;
  font-size:10.5px;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:rgba(255,255,255,.66);
}

/* ---------- desktop ---------- */
@media (min-width:900px){
  .topo-camp{padding:20px 0 6px}
  .topo-camp .lockup{max-width:520px}
  .palco .wrap{padding-top:30px}
  .grade{
    grid-template-columns:1.05fr .95fr;
    gap:44px;
    align-items:end;
  }
  .coluna-arte{align-self:end}
  .manchete{text-align:left}
  .manchete .linha{display:inline-block;padding:.12em .3em .18em}
  .manchete .l1{font-size:clamp(48px,4.6vw,66px)}
  .manchete .l2{font-size:clamp(38px,3.7vw,53px)}
  .manchete .l3{font-size:clamp(35px,3.4vw,49px);padding-left:0}
  .manchete .apoio{margin-left:0;max-width:26ch;font-size:19px}
  .dupla{margin:22px 0 0}
  .dupla img{height:auto;aspect-ratio:auto;object-fit:fill}
  .coluna-form{padding-bottom:46px}
  .cartao{padding:28px 26px 24px}
}