.section-animate {
    opacity: 0;
    transform: scale(0.95);
    transition: all .5s ease-in;
    will-change: opacity, transform;
}

.section-animate.in-view {
    opacity: 1;
    transform: translateY(0);
}

/* Animation Variants */
.fade-up {
    transform: translateY(40px);
}

.fade-down {
    transform: translateY(-40px);
}

.fade-left {
    transform: translateX(-40px);
}

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

.zoom-in {
    transform: scale(0.95);
}

.rotate-in {
    transform: rotate(-10deg);
}

.rotate-in.in-view {
    transform: rotate(0deg);
}

/* Optional Delays */
[data-delay="100"] {
    transition-delay: 0.1s;
}

[data-delay="300"] {
    transition-delay: 0.3s;
}

[data-delay="500"] {
    transition-delay: 0.5s;
}