.carousel-container {
    overflow: hidden;
    position: relative;
}
.carousel-track {
    will-change: transform;
    transition: transform 0.5s ease-in-out;
}
.carousel-buttons {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
    right: 0;
    z-index: 10;
}
.carousel-buttons button {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
}
.carousel-buttons .prev {
    left: 10px;
}
.carousel-buttons .next {
    right: 10px;
}
/* Remove scale for active items */
.carousel-item.active {
    opacity: 1;
    transition: opacity 0.3s ease-in-out;
}
@media (min-width: 768px) {
    /* Ensure items are evenly spaced without scaling */
    .carousel-item {
    width: 60%; /* Adjust for tablet */
    }
}