/* Additional carousel height fix */
@media (max-width: 1199px) {
  .carousel,
  .carousel .item,
  .carousel .item img {
    max-height: 450px;
  }
}

@media (max-width: 991px) {
  .carousel,
  .carousel .item,
  .carousel .item img {
    max-height: 400px;
  }
}

@media (max-width: 767px) {
  .carousel,
  .carousel .item,
  .carousel .item img {
    max-height: 350px;
  }
}

/* Ensure the carousel doesn't overflow */
.carousel {
  overflow: hidden;
}

/* Make sure images maintain aspect ratio but don't get too tall */
.carousel .item img {
  object-fit: cover;
  object-position: center 30%; /* Focus more on the upper part of the image */
}

/* Ensure the caption stays within the carousel */
.carousel-caption {
  width: 100%;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 15px;
  background: rgba(0,0,0,0.4);
}