/* Image-based hero carousel overrides */
.carousel .hero-slide {
    position: relative;
    width: 100%;
    height: 100%;
}

.carousel img.hero-image-img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Maintain explicit heights to match legacy responsive behavior */
@media (min-width:1200px) {
    .carousel .carousel-inner .item.hero-image {
        height: 550px;
    }
}

@media (max-width:1199px) {
    .carousel .carousel-inner .item.hero-image {
        height: 450px;
    }
}

@media (max-width:991px) {
    .carousel .carousel-inner .item.hero-image {
        height: 350px;
    }
}

@media (max-width:767px) {
    .carousel .carousel-inner .item.hero-image {
        height: 250px;
    }
}

/* hero text positioning */
.carousel .hero-text {
    text-align: center;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    color: #fff;
    width: 100%;
    padding-left: 45px;
    padding-right: 45px;
}

    .carousel .hero-text h1, .carousel .hero-text h2 {
        color: #fff;
    }

@media (max-width:767px) {
    .carousel .hero-text {
        padding-left: 25px;
        padding-right: 25px;
    }
}

/* Consolidated hero image containers with pjt-hero-consistent class */
.pjt-block--hero .jumbotron.hero-image.pjt-hero-consistent,
.groups-jumbotron.pjt-hero-consistent,
.hero-image.pjt-hero-consistent {
    position: relative;
    overflow: hidden;
}

/* Consolidated hero image styling for all hero containers */
.pjt-block--hero img.hero-image-img,
.groups-jumbotron.pjt-hero-consistent > img.hero-image-img,
.hero-image.pjt-hero-consistent > img.hero-image-img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Hero text layering */
.hero-image.pjt-hero-consistent .hero-text {
    position: relative;
    z-index: 1;
}
