/* Dark Overlay for Carousel */
.carousel-caption {
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    /* background: rgba(0, 0, 0, 0.4);  <-- REMOVE OR COMMENT OUT THIS LINE */
    z-index: 1;
}
/* Ensure images don't stretch weirdly on mobile */
.carousel-item img {
    height: 600px; /* Adjust height as needed */
    object-fit: cover;
}

@media (max-width: 768px) {
    .carousel-item img {
        height: 400px; /* Smaller height for mobile */
    }
}