/* Shift Facelift Maio/26 — footer */

.ac-footer {
  width: 100%;
  background: #033936;
  border-top: 4px solid #f6a71c;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px !important;
  padding: 32px 0;
  overflow: hidden;
}

/* ── Flatten Drupal block wrappers ─────────────────
 * !important: no mahi_facelift_v2 o CSS legado (.block-menu/.block-region com
 * display:block) vence e desfaz o achatamento → título cola no 1º link. Forçar
 * garante que h2 + ul virem filhos flex diretos da coluna (gap 16px uniforme).
 * Inócuo no accamargo_shift. */
.ac-footer__col .block-region,
.ac-footer__col .region,
.ac-footer__col .block,
.ac-footer__col nav {
  display: contents !important;
}

/* ── Links principais: 4 colunas ─────────────────── */
.ac-footer__main {
  max-width: 1104px;
  width: 100%;
  padding: 0 16px;
  display: flex;
  flex-wrap: wrap;
  gap: 32px 24px !important;
  align-items: flex-start;
}

.ac-footer__col {
  flex: 1 0 0;
  display: flex;
  flex-direction: column;
  gap: 16px !important;
  min-width: 240px;
}

/* Column title — rendered by Drupal menu block as <h2> */
.ac-footer__col h2,
.ac-footer__col-title {
  font-family: var(--font-heading);
  font-weight: 700;
  font-size: 14px;
  color: #f6a71c;
  text-transform: uppercase;
  letter-spacing: 2.8px;
  line-height: 1.2;
  margin: 0;
  padding: 0;
  font-feature-settings: 'lnum' 1, 'pnum' 1;
}

/* Block wrapper reset */
.ac-footer__col .block {
  display: contents;
}

/* Reset listas geradas pelo Drupal dentro do footer */
.ac-footer__col ul,
.ac-footer__col ol {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 16px !important;
}

.ac-footer__col li {
  margin: 0;
  padding: 0;
}

.ac-footer__col a {
  font-family: var(--font-body);
  font-weight: 700;
  font-size: 14px;
  color: #fff;
  line-height: 20px;
  text-decoration: none;
  transition: text-decoration 0.2s;
}

.ac-footer__col a:hover {
  color: #fff;
  text-decoration: underline;
}

/* Coluna 4 outline buttons — sem underline no hover (regra própria abaixo) */
.ac-footer__col--actions a:hover {
  text-decoration: none;
}

/* ── Neutralização do CSS legado do mahi (vale no mahi_facelift_v2) ──────────
 * No mahi_facelift_v2 o footer carrega junto o global-styling do mahi (bootstrap
 * + .block-title/.menu genéricos com ::before/::after) que vence nossas regras
 * por especificidade. Escopado sob .ac-footer e nas colunas 1–3 (preserva a
 * coluna 4 de botões). Inócuo no accamargo_shift (essas classes/pseudo do mahi
 * não existem lá). */
.ac-footer .block-title::before,
.ac-footer .block-title::after {
  content: none !important;
  display: none !important;
}
.ac-footer .ac-footer__col h2,
.ac-footer .ac-footer__col .block-title {
  font-family: var(--font-heading) !important;
  font-weight: 700 !important;
  font-size: 14px !important;
  color: #f6a71c !important;
  text-transform: uppercase !important;
  letter-spacing: 2.8px !important;
  line-height: 1.2 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: none !important;
}

/* Respiro de 16px título↔menu SÓ no accamargo_shift (h2 sem classe). No
 * mahi_facelift_v2 o título vira `.block-title` (template legado) e já tem o
 * respiro do gap/legado — a margin extra ali dobrava o espaçamento (32px). */
.ac-footer .ac-footer__col h2:not(.block-title) {
  margin-bottom: 16px !important;
}
.ac-footer .ac-footer__col:not(.ac-footer__col--actions) ul,
.ac-footer .ac-footer__col:not(.ac-footer__col--actions) .menu {
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}
.ac-footer .ac-footer__col:not(.ac-footer__col--actions) li {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}
.ac-footer .ac-footer__col:not(.ac-footer__col--actions) a {
  font-family: var(--font-body) !important;
  font-weight: 700 !important;
  font-size: 14px !important;
  color: #fff !important;
  line-height: 20px !important;
  padding: 0 !important;
  background: none !important;
  display: inline !important;
}

/* ── Coluna 4 — botões outline + redes sociais ──── */
.ac-footer__col--actions {
  display: flex;
  flex-direction: column;
  gap: 16px !important;
  align-items: center;
}

/* Drupal menu links as outline buttons — apenas dentro de ul, não nos social btns */
.ac-footer__col--actions ul {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  width: 100%;
  align-items: stretch;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.ac-footer__col--actions ul a {
  display: flex;
  align-items: center;
  gap: 8px !important;
  border: 1px solid #fff;
  border-radius: 36px;
  padding: 6px 16px;
  font-size: 14px;
  font-weight: 700;
  color: #fff;
  line-height: 20px;
  width: 100%;
  transition: background 0.2s, color 0.2s, border-color 0.2s;
}

.ac-footer__col--actions ul a::after {
  content: '';
  display: block;
  width: 20px;
  height: 20px;
  flex-shrink: 0;
  margin-left: auto;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='9 18 15 12 9 6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  transition: background-image 0.2s;
}

.ac-footer__col--actions ul a:hover {
  background: #fff;
  color: #033936;
  border-color: #fff;
  text-decoration: none;
}

.ac-footer__col--actions ul a:hover::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23033936' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='9 18 15 12 9 6'/%3E%3C/svg%3E");
}

/* ── Redes Sociais Views wrappers ────────────────── */
.ac-footer__social-btn-wrap {
  display: contents;
}

.ac-footer__social-btn-wrap .views-field,
.ac-footer__social-btn-wrap .field-content {
  display: contents;
}

/* O <a> com a imagem vira o botão circular */
.ac-footer__social-icons .field-content a,
.ac-footer__social-icons a {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 32px !important;
  height: 32px !important;
  min-width: 32px !important;
  background: #fff !important;
  border: none !important;
  border-radius: 36px !important;
  padding: 0 !important;
  flex-shrink: 0 !important;
  transition: background 0.2s !important;
}

.ac-footer__social-icons .field-content a:hover,
.ac-footer__social-icons a:hover {
  background: #0e5236 !important;
}

.ac-footer__social-icons img,
.ac-footer__social-icons .image-field {
  width: 20px !important;
  height: 20px !important;
  object-fit: contain !important;
  display: block !important;
  filter: none !important;
}

/* ── Redes Sociais ───────────────────────────────── */
.ac-footer__social {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px !important;
  width: 100%;
}

.ac-footer__social-label {
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 400;
  color: #fff;
  line-height: 1.6;
  text-align: center;
  white-space: nowrap;
}

.ac-footer__social-icons {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  gap: 8px !important;
  align-items: center;
  justify-content: center;
}

.ac-footer__social-btn {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 32px !important;
  height: 32px !important;
  min-width: 32px !important;
  max-width: 32px !important;
  background: #fff !important;
  border: none !important;
  border-radius: 36px !important;
  padding: 0 !important;
  flex-shrink: 0 !important;
  color: #033936 !important;
  transition: background 0.2s, color 0.2s !important;
}

.ac-footer__social-btn:hover {
  background: #0e5236 !important;
  color: #fff !important;
  text-decoration: none;
}

.ac-footer__social-btn::after {
  display: none !important;
}

.ac-footer__social-btn img {
  width: 20px !important;
  height: 20px !important;
  display: block !important;
  filter: none !important;
  flex-shrink: 0;
}

/* ── Divisória ───────────────────────────────────── */
.ac-footer__divider {
  max-width: 1104px;
  width: calc(100% - 32px);
  margin-inline: auto;
  border: none;
  border-top: 1px solid rgba(255,255,255,0.15);
}

/* ── Certificações ───────────────────────────────── */
.ac-footer__certs {
  max-width: 1104px;
  width: 100%;
  padding: 0 16px;
  display: flex;
  flex-direction: column;
  gap: 0 !important;
}

.ac-footer__certs-heading {
  font-family: var(--font-body);
  font-size: 16px;
  font-weight: 700;
  color: #fff;
  line-height: 1.6;
  margin: 0;
  padding: 0;
}

.ac-footer__certs-grid {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 16px !important;
  align-items: flex-start;
  padding-top: 24px;
}

.ac-footer__cert-item {
  display: flex;
  gap: 8px !important;
  align-items: center;
  width: 240px;
  min-width: 240px;
  flex-shrink: 0;
}

.ac-footer__cert-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  background: #fff;
  border-radius: 16px;
  flex-shrink: 0;
  box-shadow: 0px 6px 8px -2px rgba(0,0,0,0.06);
}

.ac-footer__cert-icon img,
.ac-footer__cert-icon .image-field {
  width: 40px;
  height: 40px;
  object-fit: contain;
  display: block;
}

/* Views wrappers dentro do cert-icon */
.ac-footer__cert-icon .views-field,
.ac-footer__cert-icon .field-content,
.ac-footer__cert-icon a {
  display: contents;
}

.ac-footer__cert-label,
.ac-footer__cert-label a {
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 700;
  color: #fff;
  line-height: 1.7;
  text-decoration: none;
}

.ac-footer__cert-label--light {
  font-weight: 400;
}

.ac-footer__cert-label {
  flex: 1;
  padding-right: 8px;
}

.ac-footer__cert-label a:hover {
  text-decoration: underline;
  color: #fff;
}

/* ── Bottom: logo + dados legais ─────────────────── */
.ac-footer__bottom {
  max-width: 1104px;
  width: 100%;
  padding: 24px 16px 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px !important;
  text-align: center;
}

.ac-footer__logo img {
  filter: brightness(0) invert(1);
  height: 48px;
  width: auto;
}

.ac-footer__legal-group {
  display: flex;
  flex-direction: column;
  gap: 4px !important;
  align-items: center;
}

.ac-footer__legal {
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 400;
  color: rgba(255,255,255,1);
  line-height: 1.7;
  margin: 0;
  text-align: center;
}

/* ── Responsive ──────────────────────────────────── */
@media (max-width: 1024px) {
  .ac-footer__main {
    gap: 32px 24px !important;
  }
}

@media (max-width: 768px) {
  .ac-footer__main {
    flex-direction: column;
    gap: 24px !important;
  }

  .ac-footer__col {
    min-width: unset;
    width: 100%;
  }

  .ac-footer__col--actions {
    align-items: stretch;
  }

  /* Certificações no mobile (Figma): só os ícones (sem label), flex com 16px
   * de gap, quebrando em linhas. O item huga o ícone (sem largura de coluna). */
  .ac-footer__certs-grid {
    gap: 16px !important;
  }
  .ac-footer__cert-item {
    width: auto;
    min-width: 0;
    gap: 0 !important;
  }
  .ac-footer__cert-label {
    display: none;
  }
}

@media (max-width: 480px) {
  /* Mantém ícone-only (não voltar a full-width); herda hide-label e gap 16 do
   * bloco ≤768px. */
  .ac-footer__cert-item {
    width: auto;
    min-width: 0;
  }

  .ac-footer__social-icons {
    justify-content: center;
  }

  .ac-footer__bottom {
    gap: 16px !important;
    padding: 16px;
  }

  .ac-footer__logo img {
    height: 40px;
  }
}