/* Banners grandes via JSON */

.fo-banner {
  position: relative;
  width: 100%;
  max-width: 100%;
  margin: 0 auto;
  padding: 8px 0;
  box-sizing: border-box;
}

.fo-banner__viewport {
  margin: 0 auto;
  max-width: 1280px;
  width: 100%;
  overflow: hidden;
  position: relative;
}

.fo-banner__track {
  display: flex;
  transition: transform 0.4s ease;
  will-change: transform;
}

.fo-banner__slide {
  flex: 0 0 100%;
  min-width: 100%;
  display: none;
}

.fo-banner__slide.is-active {
  display: block;
}

.fo-banner--carousel .fo-banner__slide {
  display: block;
}

.fo-banner__link {
  display: block;
  line-height: 0;
}

.fo-banner__link img {
  display: block;
  width: 100% !important;
  max-width: 1280px;
  height: auto !important;
  margin: 0 auto !important;
  object-fit: contain;
}

/* setas */
.fo-banner__arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 3;
  border: 0;
  background: #333; /* Fundo escuro */
  color: #fff;      /* Ícone branco */
  font-size: 1.5rem; /* Ajustado para ícone duplo */
  cursor: pointer;
  width: 44px;
  height: 44px;
  display: none;
  place-items: center;
  border-radius: 2px;
}

.fo-banner--carousel .fo-banner__arrow {
  display: grid;
}

.fo-banner__arrow--prev { left: 4px; }
.fo-banner__arrow--next { right: 4px; }

.fo-banner__arrow:hover { opacity: 0.75; }

.fo-banner__dots {
  display: flex;
  justify-content: center;
  gap: 6px;
  padding: 8px 0 4px;
}

.fo-banner__dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  border: 0;
  background: #bbb;
  cursor: pointer;
  padding: 0;
}

.fo-banner__dot.is-active {
  background: #ff2739;
}

.fo-banner.slide-index-0 .fo-banner__viewport,
.fo-banner.fo-banner--principal .fo-banner__viewport {
  max-width: 100%;
}

.fo-banner.fo-banner--principal {
  padding: 0;
  margin-top: 1px;
}

.fo-banner.fo-banner--principal .fo-banner__link img {
  max-width: 100%;
}
.fo-banner.slide-index-2 .fo-banner__viewport { max-width: 1120px; }
.fo-banner.slide-index-2 .fo-banner__link img { padding: 12px; box-sizing: border-box; }

.fo-banner.slide-index-4 .fo-banner__viewport,
.fo-banner.slide-index-6 .fo-banner__viewport,
.fo-banner.slide-index-8 .fo-banner__viewport,
.fo-banner.slide-index-10 .fo-banner__viewport,
.fo-banner.slide-index-12 .fo-banner__viewport,
.fo-banner.slide-index-14 .fo-banner__viewport,
.fo-banner.slide-index-16 .fo-banner__viewport,
.fo-banner.slide-index-17 .fo-banner__viewport,
.fo-banner.slide-index-18 .fo-banner__viewport {
  max-width: 1280px;
}

/* Slide 2: Trust bar com 4 itens no desktop e 1 no mobile */
@media (min-width: 751px) {
  .fo-banner.slide-index-2 .fo-banner__slide {
    flex: 0 0 25%;
    min-width: 25%;
  }
}

@media (max-width: 750px) {
  .fo-banner.slide-index-2 .fo-banner__slide {
    flex: 0 0 100%;
    min-width: 100%;
  }
}

/* Media queries de visibilidade removidas para garantir que a imagem apareça no mobile */
@media (max-width: 750px) {
  .fo-banner.desktop:not(.mobile) {
    display: block; /* Força exibir no mobile */
  }
}

@media (min-width: 751px) {
  .fo-banner.mobile:not(.desktop) {
    display: block; /* Força exibir no desktop também, por precaução */
  }
}