.elementor-widget-button .elementor-button{background-color:var( --e-global-color-accent );font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-122 .elementor-element.elementor-element-bde607d{margin:-40px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-122 .elementor-element.elementor-element-bde607d .elementor-button{font-family:"Roboto", Sans-serif;font-size:1.2rem;font-weight:500;border-radius:40px 40px 40px 40px;}/* Start custom CSS for button, class: .elementor-element-bde607d *//* Botón base con ambas animaciones unificadas */
.button-pul .elementor-button {
    /* Tu degradado base */
    background: linear-gradient(45deg, #ee7752, #e73c7e, #23a6d5) !important;
    color: #ffffff !important;
    border: none !important;
    transition: transform 0.3s ease, box-shadow 0.3s ease !important;
    
    /* Aplicamos ambas animaciones: rotación (4s) y pulso (3s) */
    animation: rotarColores 4s linear infinite, pulsoLento 3s ease-in-out infinite !important;
}

/* Efecto hover (mantiene el pulso pero añade sombra y un extra de escala al pasar el cursor) */
.button-pul .elementor-button:hover {
    box-shadow: 0px 4px 15px rgba(0, 0, 0, 0.4) !important;
    transform: scale(1.05) !important; /* Un ligero extra de tamaño al pasar el mouse */
}

/* Animación 1: Rota la paleta cromática 360 grados */
@keyframes rotarColores {
    0% {
        filter: hue-rotate(0deg);
    }
    100% {
        filter: hue-rotate(360deg);
    }
}

/* Animación 2: Efecto de pulsación suave y sutil */
@keyframes pulsoLento {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.03); /* Se agranda un 3% (sutil y elegante) */
    }
    100% {
        transform: scale(1);
    }
}/* End custom CSS */