/* css/promesas.css */

/* Animación suave de gradiente de fondo */
@keyframes gradient-xy {
    0%, 100% {
        background-size: 200% 200%;
        background-position: left center;
    }
    50% {
        background-size: 200% 200%;
        background-position: right center;
    }
}

.animate-gradient-xy {
    animation: gradient-xy 8s ease infinite;
    /* Colores sutiles pero corporativos para el fondo */
    background: linear-gradient(120deg, #f8fafc 0%, #eff6ff 50%, #f3e8ff 100%); 
}

/* Mejora de las tarjetas para que resalten sobre el fondo */
#promesas .group {
    border: 1px solid rgba(255, 255, 255, 0.8);
    /* Sombra suave y difusa */
    box-shadow: 0 20px 40px -10px rgba(30, 58, 138, 0.08); 
}