/* Hero responsive fix: remove white gaps and enforce cover */
#hero { padding: 0; background-color: transparent; overflow: hidden; }
#hero .carousel-item { background-color: transparent; }
#hero .carousel-item img { width: 100%; height: 100%; object-fit: cover !important; display: block; }

/* Tablet: keep reasonable height and cover */
@media (max-width: 991.98px) {
  #hero { height: 70vh !important; }
  #hero .carousel,
  #hero .carousel-inner { height: 70vh !important; }
}

/* Mobile: use auto height and drop absolute positioning to avoid letterboxing */
@media (max-width: 575.98px) {
  #hero { height: auto !important; }
  #hero .carousel,
  #hero .carousel-inner,
  #hero .carousel-item,
  #hero .carousel-item::before {
    position: relative !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    height: auto !important;
  }
  #hero .carousel-item img {
    width: 100% !important;
    height: auto !important;
    object-fit: cover !important;
  }
}