/* Ajuste para exibir 2 marcas por vez no mobile */
@media only screen and (max-width: 767px) {
    .marcas .flexslider .slides > li {
        width: 50% !important; /* Exibe 2 marcas. Para 3 marcas, use 33.3% */
        float: left !important;
        display: block !important;
    }
    
    .marcas .flexslider {
        margin-bottom: 20px;
    }
}

   @media only screen and (max-width: 767px) {
       .banner-principal img {
           width: 100% !important;
           height: auto !important;
           object-fit: contain !important;
       }
   }
   /* ==========================================================================
   Centralização e Ajustes do Rodapé - Loja Integrada
   ========================================================================== */

/* Container principal do rodapé */
.rodape,
#rodape,
footer.rodape,
.rodape-destaque,
.rodape-institucional {
  width: 100%;
  display: block;
  text-align: center;
  box-sizing: border-box;
  margin: 0 auto;
  padding: 40px 16px;
}

/* Centralização dos títulos */
.rodape__titulo,
.rodape-titulo,
.rodape h3,
.rodape h4,
.rodape .titulo,
.rodape .titulo-rodape,
#rodape h3,
#rodape h4,
footer h3,
footer h4 {
  text-align: center !important;
  margin: 0 auto 16px auto;
  display: block;
  width: 100%;
}

/* Centralização de textos e parágrafos */
.rodape p,
.rodape span,
.rodape .texto,
#rodape p,
#rodape span,
footer p,
footer span {
  text-align: center !important;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

/* Centralização das listas de links */
.rodape ul,
.rodape__links,
.rodape-links,
.rodape-menu,
.rodape .menu,
#rodape ul,
footer ul {
  list-style: none;
  padding: 0;
  margin: 0 auto;
  text-align: center;
}

.rodape ul li,
.rodape__links li,
.rodape-links li,
#rodape ul li,
footer ul li {
  display: inline-block;
  margin: 0 12px 8px 12px;
  text-align: center;
}

/* Links do rodapé */
.rodape a,
.rodape__links a,
#rodape a,
footer a {
  display: inline-block;
  text-align: center;
  text-decoration: none;
  transition: color 0.2s ease;
}

.rodape a:hover,
#rodape a:hover,
footer a:hover {
  text-decoration: underline;
}

/* Centralização dos ícones de redes sociais */
.rodape-social,
.redes-sociais,
.rodape .redes-sociais,
#rodape .redes-sociais,
.rodape-social .icones,
.rodape-social .lista-redes,
.rodape-social ul,
.redes-sociais ul {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  padding: 0;
  margin: 20px auto 0 auto;
  list-style: none;
  width: 100%;
}

.rodape-social li,
.redes-sociais li,
.rodape-social a,
.redes-sociais a {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  text-align: center;
}

.rodape-social i,
.redes-sociais i,
.rodape-social img,
.redes-sociais img,
.rodape-social svg,
.redes-sociais svg {
  display: block;
  margin: 0 auto;
  vertical-align: middle;
}

/* Colunas do rodapé */
.rodape .row,
.rodape__colunas,
.rodape-colunas,
.rodape .colunas,
#rodape .row,
footer .row {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: flex-start;
  text-align: center;
}

.rodape .col,
.rodape .coluna,
.rodape__coluna,
.rodape-coluna,
#rodape .col,
footer .col {
  flex: 1 1 200px;
  max-width: 300px;
  text-align: center;
  margin: 0 auto 24px auto;
  padding: 0 12px;
}

/* Seção de pagamentos e selos */
.rodape-pagamentos,
.rodape-selos,
.rodape .pagamentos,
.rodape .selos,
#rodape .pagamentos,
footer .selos {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  margin: 20px auto 0 auto;
  text-align: center;
}

.rodape-pagamentos img,
.rodape-selos img,
.rodape .pagamentos img,
.rodape .selos img {
  display: inline-block;
  margin: 0 auto;
  vertical-align: middle;
}

/* Direitos autorais / copyright */
.rodape-copyright,
.rodape__copyright,
.rodape-direitos,
.rodape .copyright,
#rodape .copyright,
footer .copyright {
  text-align: center;
  display: block;
  width: 100%;
  margin: 24px auto 0 auto;
  padding-top: 16px;
}

/* Ajustes responsivos */
@media (max-width: 768px) {
  .rodape,
  #rodape,
  footer.rodape {
    padding: 32px 12px;
  }

  .rodape .col,
  .rodape .coluna,
  .rodape__coluna,
  .rodape-coluna,
  #rodape .col,
  footer .col {
    flex: 1 1 100%;
    max-width: 100%;
    margin-bottom: 20px;
  }

  .rodape ul li,
  .rodape__links li,
  .rodape-links li,
  #rodape ul li,
  footer ul li {
    display: block;
    margin: 0 auto 6px auto;
  }

  .rodape-social,
  .redes-sociais,
  .rodape .redes-sociais,
  #rodape .redes-sociais {
    gap: 16px;
  }
}

/* Forçar centralização com important quando necessário */
.rodape .centralizar,
.rodape .text-center,
.rodape .align-center,
#rodape .centralizar,
footer .centralizar {
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Forçar exibição total do banner no mobile sem cortes */
@media only screen and (max-width: 767px) {
    /* Ajusta o container do banner para ter altura automática */
    .secao-banners .banner-principal,
    .flexslider,
    .flex-viewport {
        height: auto !important;
        max-height: none !important;
    }

    /* Garante que a imagem se ajuste à largura e mantenha a proporção */
    .banner-principal img,
    .flexslider .slides img {
        width: 100% !important;
        height: auto !important;
        object-fit: contain !important; /* Mantém a imagem inteira no espaço */
    }
}