/* ---------------------------------------------------- */
    /* ESTILOS CSS DEL SLIDER DE LOGOS */
    /* ---------------------------------------------------- */
    .slider-container {
        max-width: 100%;
        margin: 40px auto;
        overflow: hidden;
        position: relative;
        padding: 20px 0;
        background-color: #f0f0f0; /* Fondo ligero para destacarse */
    }

    .slider-track {
        display: flex;
        transition: transform 0.8s ease-in-out;
    }

    .slide-logo {
        flex: 0 0 16.666%; /* Muestra 6 logos a la vez en desktop */
        min-width: 150px; /* Ancho mínimo para cada logo */
        display: flex;
        justify-content: center;
        align-items: center;
        padding: 0 10px;
    }

    .slide-logo img {
        width: 80%;
        max-width: 120px;
        height: auto;
        opacity: 0.6; /* Hacemos los logos un poco transparentes para que el foco sea el servicio */
        transition: opacity 0.3s;
        filter: grayscale(100%); /* Escala de grises para un look más profesional y uniforme */
    }

    .slide-logo img:hover {
        opacity: 1;
        filter: none;
    }

    /* Media Query para Móviles: Muestra menos logos */
    @media (max-width: 768px) {
        .slide-logo {
            flex: 0 0 33.333%; /* Muestra 3 logos a la vez en móvil */
        }
    }