html, body {
  max-width: 100%;
  overflow-x: hidden;
}


img {
  display: block;
  max-width: 100%;
  height: auto;
}

.hero-img {
  width: 100%;
  max-width: 100%;
  margin: 0 auto 1rem;}

  body {background: #c0c0be;}

  .carousel-item img {
  width: 30%;           
  height: 400px;         
  object-fit: cover;     
  border-radius: 10px;
  margin: 0 auto;   
}

/* Carrossel do topo - mostrar imagem inteira sem corte */
#carousel-hero .carousel-item img {
  height: 450px;        /* Ajuste a altura que ficar mais bonita */
  object-fit: contain;  /* Mostra a imagem inteira */
  background-color: #f2f2f2; /* Fundo atrás da imagem */
}