/* Ensure videos behave like images */
.carousel-video {
    max-height: 500px;
    object-fit: cover;
}

/* Prevent iframe interaction issues */
.youtube-iframe {
    width: 100%;
    height: 100%;
    border: none;
}

/* Optional: smooth fade */
.carousel-item {
    transition: transform 0.6s ease-in-out;
}

.carousel-caption {
    background: rgba(0, 0, 0, 0.45);
    padding: 1rem 1.25rem;
    border-radius: 0.5rem;
    max-width: 420px;
}

.carousel-caption h5 {
    font-weight: 600;
}

.carousel-caption p {
    margin-bottom: 0.5rem;
}

/* Fixed height for the slider */
.media-carousel {
    height: 520px;              /* desktop height */
}

/* Make inner elements fill the height */
.media-carousel .carousel-inner,
.media-carousel .carousel-item {
    height: 100%;
}

/* Images & videos fit perfectly */
.media-carousel img,
.media-carousel video {
    height: 100%;
    width: 100%;
    object-fit: cover;
}

/* YouTube iframe fit */
.media-carousel .ratio,
.media-carousel iframe {
    height: 100%;
}

/* Caption stays inside */
.media-carousel .carousel-caption {
    bottom: 2rem;
}

/* Responsive height */
@media (max-width: 992px) {
    .media-carousel {
        height: 420px;
    }
}

@media (max-width: 576px) {
    .media-carousel {
        height: 300px;
    }
}