/* =============================================================
   HEALTH MERCANTIL — Componente: Footer
   ============================================================= */

.site-footer {
  background: var(--color-brand-dark);
  color: rgba(255,255,255,0.75);
  padding-top: var(--space-20);
}

.site-footer__grid {
  display: grid;
  grid-template-columns: 2fr 1.7fr 1fr 1fr;
  gap: var(--space-12);
  padding-bottom: var(--space-16);
  border-bottom: 1px solid var(--color-border-dark);
}

/* ─── Coluna da marca ─────────────────────────────────────────── */
.site-footer__brand img {
  /* ANTERIOR (até 30/09): height: 36px — mesmo ajuste do header, para seguir o minimo do
     Brandbook (p.23, Formato 1: 54px para tela). */
  height: 54px;
  width: auto;
  margin-bottom: var(--space-6);
}

.site-footer__brand p {
  font-size: var(--text-sm);
  line-height: var(--leading-relaxed);
  max-width: 36ch;
  color: rgba(255,255,255,0.6);
}

.site-footer__address {
  margin-top: var(--space-6);
  font-size: var(--text-xs);
  line-height: var(--leading-relaxed);
  color: rgba(255,255,255,0.45);
  font-style: normal;
}

.site-footer__socials {
  display: flex;
  gap: var(--space-3);
  margin-top: var(--space-6);
}

.site-footer__social-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: var(--radius-md);
  background: rgba(255,255,255,0.07);
  border: 1px solid var(--color-border-dark);
  color: rgba(255,255,255,0.7);
  font-size: var(--text-sm);
  transition: background var(--duration-fast), color var(--duration-fast);
}

.site-footer__social-link:hover {
  background: var(--color-accent);
  color: var(--color-white);
  border-color: var(--color-accent);
}

/* ─── Colunas de links ─────────────────────────────────────────── */
.site-footer__col-title {
  font-family: var(--font-display);
  font-size: var(--text-sm);
  font-weight: var(--weight-semi);
  color: var(--color-white);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin-bottom: var(--space-5);
}

.site-footer__links {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.site-footer__link {
  font-size: var(--text-sm);
  color: rgba(255,255,255,0.6);
  transition: color var(--duration-fast);
}

.site-footer__link:hover { color: var(--color-white); }

/* ─── Coluna Soluções: 2 sub-colunas + link "ver todas" ─────────── */
.site-footer__ver-todas {
  display: inline-block;
  margin-bottom: var(--space-4);
  font-weight: var(--weight-semi);
  color: var(--color-accent) !important;
}

.site-footer__links--solucoes {
  display: grid;
  grid-template-columns: max-content max-content;
  grid-auto-flow: column;
  grid-template-rows: repeat(3, auto);
  column-gap: var(--space-6);
  row-gap: var(--space-3);
}

.site-footer__links--solucoes li {
  align-self: start;
  white-space: nowrap;
}

.site-footer__links--solucoes .site-footer__link {
  font-size: var(--text-xs);
  line-height: var(--leading-snug);
}

/* ─── Contato no footer ────────────────────────────────────────── */
.site-footer__contact-item {
  display: flex;
  align-items: flex-start;
  gap: var(--space-3);
  font-size: var(--text-sm);
  color: rgba(255,255,255,0.6);
  margin-bottom: var(--space-4);
}

.site-footer__contact-item a {
  color: rgba(255,255,255,0.85);
  transition: color var(--duration-fast);
}

.site-footer__contact-item a:hover { color: var(--color-white); }

/* ─── Apps ────────────────────────────────────────────────────── */
.site-footer__apps {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-2);
  margin-top: var(--space-4);
}

.site-footer__app-badge {
  display: inline-flex;
  opacity: 0.92;
  transition: opacity var(--duration-fast), transform var(--duration-fast);
}

.site-footer__app-badge:hover {
  opacity: 1;
  transform: translateY(-1px);
}

.site-footer__app-badge img {
  display: block;
  height: 40px;
  width: auto;
}

/* ─── Bottom bar ──────────────────────────────────────────────── */
.site-footer__bottom {
  padding-block: var(--space-6);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  font-size: var(--text-xs);
  color: rgba(255,255,255,0.35);
}

.site-footer__bottom a {
  color: rgba(255,255,255,0.5);
  transition: color var(--duration-fast);
}

.site-footer__bottom a:hover { color: rgba(255,255,255,0.8); }

.site-footer__bottom-links {
  display: flex;
  gap: var(--space-6);
}

/* ─── Disclaimer legal ─────────────────────────────────────────── */
.site-footer__disclaimer {
  padding-block: var(--space-6);
  border-top: 1px solid rgba(255,255,255,0.06);
  font-size: var(--text-xs);
  color: rgba(255,255,255,0.25);
  line-height: var(--leading-relaxed);
  max-width: none;
}

.site-footer__disclaimer p {
  max-width: none;
}

/* ─── Responsive ──────────────────────────────────────────────── */
@media (max-width: 1024px) {
  .site-footer__grid {
    grid-template-columns: 1fr 1fr;
  }
  .site-footer__brand {
    grid-column: 1 / -1;
  }
  .site-footer__links--solucoes {
    grid-template-columns: 1fr;
    grid-auto-flow: row;
    grid-template-rows: none;
  }
}

@media (max-width: 640px) {
  .site-footer__grid {
    grid-template-columns: 1fr;
    gap: var(--space-8);
  }
  .site-footer__bottom {
    flex-direction: column;
    text-align: center;
  }
  .site-footer__bottom-links {
    flex-wrap: wrap;
    justify-content: center;
  }
}


/* ─── Dobra da Newsletter (acima do rodapé, em todas as páginas) ─── */
.newsletter-band {
  background: var(--color-brand-dark);
  border-top: 1px solid var(--color-border-dark);
  padding: var(--space-10) 0;
}

.newsletter-band__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-8);
  flex-wrap: wrap;
}

.newsletter-band__text {
  max-width: 480px;
}

.newsletter-band__title {
  font-size: var(--text-lg);
  font-weight: var(--weight-bold);
  color: #fff;
  margin: 0 0 var(--space-2);
}

.newsletter-band__subtitle {
  font-size: var(--text-sm);
  color: rgba(255,255,255,0.65);
  margin: 0;
}

.newsletter-band__eyebrow {
  color: var(--color-accent);
  font-size: var(--text-base);
  margin: 0 0 var(--space-2);
}

.newsletter-band__note {
  font-size: var(--text-xs);
  color: rgba(255,255,255,0.45);
  margin: var(--space-3) 0 0;
}

.newsletter-band__form {
  background: var(--color-brand-dark);
  border-radius: var(--radius-lg);
  padding: var(--space-6) var(--space-8);
  min-width: 320px;
  flex: 1 1 420px;
  max-width: 520px;
  overflow: hidden;
}

/* ─── Correção do formulário embutido do RD Station ───────────────────
   A correção principal (largura e labels) é feita via JS em main.js,
   porque o RD monta o form numa árvore flex aninhada com "min-width:
   auto" em cada nível — só dá pra remover isso de forma confiável com
   JS, aplicando em toda a árvore depois que o RD termina de renderizar.
   Aqui ficam só redes de segurança em CSS puro:
   - overflow:hidden no card, para nunca mais deixar nada "estourar"
     visualmente para fora dos cantos arredondados;
   - fundo/borda visível nos campos, caso o JS ainda não tenha rodado. */
.newsletter-band__form {
  overflow: hidden;
}

#newsletters-rodape-form-9105f258de5fb713eaf4 .bricks-form__input {
  background: #fff !important;
  border: 1px solid rgba(13,31,34,0.18) !important;
}

#newsletters-rodape-form-9105f258de5fb713eaf4 label {
  color: #fff !important;
}

.newsletter-band__form > div[role="main"] {
  width: 100%;
}

@media (max-width: 768px) {
  .newsletter-band__inner { flex-direction: column; align-items: flex-start; }
  .newsletter-band__form { width: 100%; max-width: 100%; }
}