.xai-slider img {
    width: 100%;
    height: auto;
    max-height: 600px; /* Default max height for desktop */
    object-fit: cover; /* Ensure images cover the carousel area */
}

@media (max-width: 768px) {
    .xai-slider img {
        max-height: 400px; /* Adjust height for tablets */
    }
}

@media (max-width: 576px) {
    .xai-slider img {
        max-height: 300px; /* Adjust height for mobile */
    }
}

.carousel-caption {
    background: rgba(0, 0, 0, 0.5); /* Semi-transparent background for captions */
    padding: 10px;
}