/* ==========================================================================
   INAEC · SEÇÃO 6: RODAPÉ INSTITUCIONAL
   Navegação secundária, contato, redes, políticas e copyright.

   Fundo em Grafite (#231F20) — o MIV reserva Verde Profundo para fundos
   densos, mas o portal foi definido sem fundos verdes; Grafite é o neutro
   escuro institucional e entrega 15.9:1 com o branco.

   >>> MIGRAÇÃO ELEMENTOR PRO
   Alvo: Theme Builder → Footer.
     Container "footer" (fundo Grafite · régua no topo)
       ├── Container "footer__topo"   (flex row · gap 64 · align start)
       │     ├── "footer__marca"      (logo mono-branco + missão + redes)
       │     └── "footer__navs"       (grid 3 colunas de listas de links)
       └── Container "footer__base"   (flex row · space-between · borda topo)
   ========================================================================== */

.site-footer {
  position: relative;
  background-color: var(--color-bg-inverse);
  color: var(--color-text-inverse);
  padding-block-start: var(--space-xl);
}

/* Régua institucional abrindo o rodapé */
.site-footer::before {
  content: "";
  position: absolute;
  inset-block-start: 0;
  inset-inline: 0;
  block-size: var(--regua-height);
  background-image: var(--inaec-grad-ciclo);
}

.site-footer :is(h2, h3) { color: var(--color-text-inverse); }

/* --- Topo --------------------------------------------------------------- */
.footer__topo {
  display: flex;
  align-items: flex-start;
  gap: clamp(var(--space-lg), 5vw, var(--space-2xl));
  padding-block-end: var(--space-xl);
}

.footer__marca { flex: 1 1 34%; display: flex; flex-direction: column; gap: var(--space-sm); }
.footer__marca .logo img { inline-size: 190px; min-inline-size: var(--logo-horizontal-min); }

.footer__missao {
  margin: 0;
  font-size: var(--fs-legend);   /* 14px */
  line-height: var(--lh-body);
  color: color-mix(in srgb, var(--inaec-branco) 74%, transparent);
  max-inline-size: 44ch;
}

/* --- Redes sociais ------------------------------------------------------- */
.footer__redes { display: flex; gap: var(--space-2xs); }
.footer__rede {
  display: grid;
  place-items: center;
  inline-size: 44px;
  block-size: 44px;
  border: 1px solid var(--color-border-inverse);
  border-radius: var(--radius-pill);
  color: var(--inaec-branco);
  transition: background-color var(--duration) var(--ease),
              border-color var(--duration) var(--ease),
              color var(--duration) var(--ease);
}
.footer__rede svg {
  inline-size: 20px; block-size: 20px;
  fill: none; stroke: currentColor; stroke-width: 2;
  stroke-linecap: round; stroke-linejoin: round;
}
@media (hover: hover) {
  .footer__rede:hover {
  background-color: var(--color-accent);
  border-color: var(--color-accent);
  color: var(--color-on-accent);
}
}

/* --- Colunas de navegação ------------------------------------------------ */
.footer__navs {
  flex: 1 1 66%;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-md);
}

.footer__titulo {
  margin: 0 0 var(--space-xs);
  font-family: var(--font-body);
  font-size: var(--fs-label);
  font-weight: var(--fw-semibold);
  letter-spacing: var(--tracking-label);
  text-transform: uppercase;
  color: var(--inaec-amarelo);
}

.footer__lista { display: flex; flex-direction: column; gap: 0.625rem; }
.footer__lista a {
  font-size: var(--fs-legend);   /* 14px */
  color: color-mix(in srgb, var(--inaec-branco) 78%, transparent);
  text-decoration: none;
  transition: color var(--duration) var(--ease);
}
@media (hover: hover) {
  .footer__lista a:hover { color: var(--inaec-branco); text-decoration: underline; }
}

/* Bloco de contato institucional */
.footer__contato { font-style: normal; display: flex; flex-direction: column; gap: 0.625rem; }
.footer__contato p, .footer__contato a {
  margin: 0;
  font-size: var(--fs-legend);   /* 14px */
  line-height: 1.55;
  color: color-mix(in srgb, var(--inaec-branco) 78%, transparent);
  text-decoration: none;
}
@media (hover: hover) {
  .footer__contato a:hover { color: var(--inaec-branco); text-decoration: underline; }
}

/* --- Base: políticas e copyright ---------------------------------------- */
.footer__base {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-xs);
  padding-block: var(--space-sm);
  border-block-start: 1px solid var(--color-border-inverse);
}

.footer__copy {
  margin: 0;
  font-size: 0.8125rem;          /* 13px — linha legal, subordinada */
  color: color-mix(in srgb, var(--inaec-branco) 62%, transparent);
}

.footer__politicas { display: flex; flex-wrap: wrap; gap: var(--space-sm); }
.footer__politicas a {
  font-size: 0.8125rem;          /* 13px */
  color: color-mix(in srgb, var(--inaec-branco) 72%, transparent);
  text-decoration: none;
}
@media (hover: hover) {
  .footer__politicas a:hover { color: var(--inaec-branco); text-decoration: underline; }
}

@media (max-width: 1024px) {
  .footer__topo { flex-direction: column; }
  .footer__marca, .footer__navs { flex: 1 1 auto; inline-size: 100%; }
}
@media (max-width: 640px) {
  .footer__navs { grid-template-columns: 1fr; gap: var(--space-lg); }
  .footer__base { flex-direction: column; align-items: flex-start; }
}

/* --- Linha legal ---------------------------------------------------------
   Razão social e CNPJ. Corpo menor que o do copyright e cor mais contida:
   é informação de registro, obrigatória mas não protagonista. */
.footer__legal { display: grid; gap: 0.15rem; }
.footer__razao {
  margin: 0;
  font-size: 0.75rem;
  line-height: 1.5;
  color: color-mix(in srgb, var(--inaec-branco) 55%, transparent);
}