/* ================================================== */
/* === ANIMACIONES AL CARGAR SOLO EN CARDS === */
/* ================================================== */

/* Keyframes base */
@keyframes fadeUp {
    from {opacity: 0; transform: translateY(20px);}
    to {opacity: 1; transform: translateY(0);}
}

/* Animación de entrada para cards */
.card-style,
.content-box {
    animation: fadeUp 0.8s ease forwards;
    opacity: 0; /* empieza invisible y se anima al cargar */
}

/* Retrasos progresivos para entrada secuencial */
.card-style:nth-child(1),
.content-box:nth-child(1) { animation-delay: 0.1s; }
.card-style:nth-child(2),
.content-box:nth-child(2) { animation-delay: 0.2s; }
.card-style:nth-child(3),
.content-box:nth-child(3) { animation-delay: 0.3s; }
.card-style:nth-child(4),
.content-box:nth-child(4) { animation-delay: 0.4s; }
.card-style:nth-child(5),
.content-box:nth-child(5) { animation-delay: 0.5s; }

/* Animación al hacer hover en cards */
.card-style:hover,
.content-box:hover {
    transform: translateY(-2px);
    transition: all 250ms cubic-bezier(0.4, 0, 0.2, 1);
}