.animate-fade {
    opacity: 0;
    transform: translateY(30px);
    animation: fadeInUp 1s forwards;
}
@keyframes fadeInUp {
    to { opacity: 1; transform: translateY(0); }
}

.animate-up {
    opacity: 0;
    transform: translateY(50px);
}
.animate-up.visible {
    opacity: 1;
    transform: translateY(0);
    transition: all 0.8s ease-out;
}

.animate-left {
    opacity: 0;
    transform: translateX(-50px);
}
.animate-left.visible {
    opacity: 1;
    transform: translateX(0);
    transition: all 0.8s ease-out;
}