#bloco-imagem-interativa {
  position: relative;
  background-image: url(imgs/paralax.jpg);
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
  background-repeat: no-repeat;
  height: 75vh;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: end;
  overflow: hidden;
}

#bloco-imagem-interativa .overlay {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background-color: rgba(0, 0, 0, 0.4); /* ou use um gradiente aqui se quiser */
  z-index: 1;
}

#bloco-imagem-interativa h2 {
  width: 60vw;
  color: #ffffff;
  text-shadow: 0 0 3px #ffffff;
  z-index: 2;
  position: relative;
  padding-right: 9vw;
}

/* Bloco 5 */

#bloco-carrosel {
  background-color: white;
  overflow: hidden;
  width: 100%;
  height: auto;
  display: flex;
  align-items: center;
  justify-content: center;
}

.carousel-container {
  width: 75vw;
  margin: 15vh auto;
}

.carousel-inner {
  height: auto; /* deixa ele ajustar automaticamente */
  overflow: hidden;
}

.carousel-inner img {
  width: 100%;
  max-height: 80vh; /* altura máxima */
  object-fit: cover;
  filter: brightness(80%);
}

/* Botoes carrosel */

/* velocidade */
.carousel-item {
  transition: transform 1s ease-in-out;
}

/* Visibildade */
.carousel-control-prev-icon,
.carousel-control-next-icon {
  filter: brightness(100) drop-shadow(0 0 3px white);
}

.carousel-control-prev,
.carousel-control-next {
  opacity: 1 !important; /* sempre visíveis */
}
