/* ══════════════════════════════════════════════════════════════════
   RODAPÉ PADRÃO — visual único do rodapé, compartilhado entre a home e
   todo microsite. Ver assets/rodape-padrao.js para o HTML injetado.
   O microsite marca o próprio <footer> com class="site" (igual à home) e
   dá um id="rodape-padrao" para o script encontrar onde montar.
   ══════════════════════════════════════════════════════════════════ */
footer.site{background:#0B0B2E; color:#C7C8E0; padding:64px 0 28px; margin-top:20px; text-align:left}
/* O componente não pode depender do .container da página: as páginas legais
   antigas (energia-solar/privacidade.html e cia.) são autossuficientes, com
   <style> inline e sem css/style.css nem microsite/style.css. Sem esta regra
   o rodapé abria de ponta a ponta da tela nelas. Mesmos valores do
   .container de css/style.css, escopados pra não vazar pro resto. */
footer.site .container{max-width:1280px; margin:0 auto; padding:0 24px}
footer.site p{margin:0}
footer.site .foot-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:40px}
footer.site h4{color:#fff; font-size:13px; text-transform:uppercase; letter-spacing:.06em; margin-bottom:16px}
footer.site .brand{color:#fff}
footer.site .brand img{filter:brightness(0) invert(1)}
footer.site a{color:#C7C8E0; font-size:14.5px; text-decoration:none}
footer.site a:hover{color:#fff}
footer.site ul{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:11px}
footer.site .foot-contato{display:flex; flex-direction:column; gap:14px; font-size:14.5px; margin-bottom:4px}
footer.site .foot-marcas{display:flex; flex-direction:column; gap:14px; margin-top:14px}
footer.site .foot-marca b{
  display:block; font-size:12px; font-weight:800; letter-spacing:.07em;
  text-transform:uppercase; color:#FFC800; margin-bottom:5px;
}
footer.site .foot-marca a{display:block; font-size:14px; color:#C7C8E0; text-decoration:none; padding:2px 0}
footer.site .foot-marca a:hover{color:#fff}
footer.site .social{display:flex; gap:12px; margin-top:8px}
footer.site .social a{
  width:44px; height:44px; border-radius:50%; background:rgba(255,255,255,.08);
  display:flex; align-items:center; justify-content:center; transition:.15s;
}
footer.site .social a svg{width:20px; height:20px; fill:#fff}
footer.site .social a:hover{transform:translateY(-3px)}
footer.site .social a[data-contato-link="instagram"]:hover{background:linear-gradient(45deg,#f9ce34,#ee2a7b,#6228d7)}
footer.site .social a[data-whatsapp]:hover{background:#25D366}
footer.site .social a[data-contato-link="email"]:hover{background:#1652D8}
/* Aviso legal da solução (coberturas, análise de crédito, contemplação de
   consórcio...). Não é enfeite: é exigência regulatória e muda de solução
   pra solução, então vem no HTML de cada página e o rodapé só o acomoda —
   ver o comentário em rodape-padrao.js. Fica acima da linha do copyright,
   menor e mais apagado, pra não competir com o resto do rodapé. */
footer.site .foot-aviso{
  border-top:1px solid rgba(255,255,255,.1); margin-top:48px; padding-top:22px;
  font-size:12.5px; line-height:1.6; color:#75779F; max-width:960px;
}
footer.site .foot-aviso + .bottom{border-top:0; margin-top:20px; padding-top:0}
footer.site .bottom{
  border-top:1px solid rgba(255,255,255,.1); margin-top:48px; padding-top:24px;
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px; font-size:13px; color:#8082AC;
}
footer.site .link-painel{color:#8082AC}
footer.site .link-painel:hover{color:#fff}
@media (max-width:820px){ footer.site .foot-grid{grid-template-columns:1fr 1fr; gap:32px} }
@media (max-width:520px){ footer.site .foot-grid{grid-template-columns:1fr} }