/* ANIMACIÓN DEL CARRUSEL */
@keyframes desplazar {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(calc(-260px * 5 - 20px * 4));
    }
}

/* ESTILOS DEL CARRUSEL */
.carrusel-track {
    display: flex !important;
    gap: 20px !important;
    margin: 0 auto !important;
    width: max-content !important;
}

.carrusel-contenedor {
    overflow: hidden !important;
    width: 100% !important;
    max-width: 1300px !important;
    margin: 0 auto !important;
}

    .carrusel-contenedor:hover .carrusel-track {
        animation-play-state: paused !important;
    }

.carrusel-track .card {
    transition: transform 0.3s ease, box-shadow 0.3s ease !important;
}

    .carrusel-track .card:hover {
        transform: scale(1.08) translateY(-8px) !important;
        box-shadow: 0 20px 40px rgba(0,0,0,0.2) !important;
        z-index: 10 !important;
    }

/* RESPONSIVE */
@media (max-width: 1200px) {
    @keyframes desplazar {
        100% {
            transform: translateX(calc(-240px * 5 - 20px * 4));
        }
    }

    .carrusel-track .card {
        width: 240px !important;
    }
}

@media (max-width: 992px) {
    @keyframes desplazar {
        100% {
            transform: translateX(calc(-220px * 5 - 20px * 4));
        }
    }

    .carrusel-track .card {
        width: 220px !important;
    }
}

@media (max-width: 768px) {
    @keyframes desplazar {
        100% {
            transform: translateX(calc(-200px * 5 - 20px * 4));
        }
    }

    .carrusel-track .card {
        width: 200px !important;
    }

    .card-header {
        height: 65px !important;
        min-height: 65px !important;
    }

    .card-img-top {
        height: 130px !important;
    }
}

@media (max-width: 480px) {
    @keyframes desplazar {
        100% {
            transform: translateX(calc(-180px * 5 - 20px * 4));
        }
    }

    .carrusel-track .card {
        width: 180px !important;
    }

    .card-img-top {
        height: 120px !important;
    }
}