/* Base hidden state */
.animate-item {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.6s ease;
}

/* Active animation state */
.animate-item.animate-active {
    opacity: 1;
    transform: translateY(0);
}

/* Optional Variations */
.animate-left {
    transform: translateX(-40px);
}

.animate-right {
    transform: translateX(40px);
}

.animate-zoom {
    transform: scale(0.8);
}