<!-- Estilos personalizados para la animación del robot -->

     /* Ajustes para mover el robot más abajo */
 .banner-section .banner_wrapper .banner-image {
     text-align: right !important;
     position: relative !important;
     right: -20px !important;
     top: 50px !important; /* Mueve la imagen hacia abajo */
 }

.banner-section .banner_wrapper .banner-image img {
    max-width: 130% !important;
    height: auto !important;
    transform: scale(1.15) !important;
    transform-origin: center right !important;
}

/* Centrar los elementos del banner para compensar el movimiento del robot */
.banner-section .row {
    align-items: flex-start !important; /* Cambiado de center a flex-start */
    padding-top: 20px !important; /* Añadir un poco de espacio en la parte superior */
}

/* Ajuste del texto para alinear con el robot */
.banner-section .banner_content {
    padding-top: 50px !important; /* Mover el contenido hacia abajo para alinearlo */
}

/* Asegurar que el robot no se corte en la parte inferior */
.banner-section {
    overflow: visible !important;
    padding-bottom: 50px !important; /* Añadir espacio adicional en la parte inferior */
}

/* Ajustes para dispositivos móviles */
@media (max-width: 991px) {
    .banner-section .banner_wrapper .banner-image {
        top: 10px !important; /* Menos espacio en móviles */
    }

    .banner-section .banner_content {
        padding-top: 0 !important;
    }

    .banner-section .banner_wrapper .banner-image img {
        max-width: 100% !important;
        transform: scale(1) !important;
    }
}
/* Restaurar la animación del robot mientras mantenemos la posición */
.banner-section .banner_wrapper .banner-image {
    text-align: right !important;
    position: relative !important;
    right: -20px !important;
    top: 50px !important; /* Mantiene la posición más baja */
    /* No añadir más propiedades que puedan interferir con la animación */
}

.banner-section .banner_wrapper .banner-image img {
    max-width: 130% !important;
    height: auto !important;
    transform: scale(1.15) !important;
    transform-origin: center right !important;
}

/* Quitar cualquier propiedad que pueda interferir con la animación de AOS */
.banner-section .banner_wrapper[data-aos] {
    transition-property: all !important; /* Asegurar que la transición funcione */
    overflow: visible !important;
}

/* Restaurar las clases de animación originales si fueron sobrescritas */
/* Modificar las clases de animación para mover de izquierda a derecha */
[data-aos=fade-right] {
    transform: translate3d(-100px, 0, 0) !important;
}

[data-aos=fade-right].aos-animate {
    transform: translate3d(0, 0, 0) !important;
}

[data-aos^=fade][data-aos^=fade].aos-animate {
    opacity: 1 !important;
    transform: translateZ(0) !important;
}

     /* Animación personalizada para el robot - desplazamiento de izquierda a derecha */
@keyframes moveLeftToRight {
    0% {
        transform: translateX(-150px);
        opacity: 0;
    }
    100% {
        transform: translateX(100px);
        opacity: 1;
    }
}

/* Aplicar la animación personalizada */
.robot-animation {
    animation: moveLeftToRight 1.2s ease-out forwards;
    /* Desactivar cualquier otra animación que pudiera interferir */
    transition: none !important;
}

/* Desactivar explícitamente AOS para este elemento */
.robot-animation[data-aos] {
    animation: moveLeftToRight 1.2s ease-out forwards !important;
    transition: none !important;
}