/* ==========================================================================
   Scroll Animations — IntersectionObserver based
   ========================================================================== */

/* ── Base animation state ── */
[data-animate] {
    opacity: 0;
    transition: opacity 0.6s ease, transform 0.6s ease;
    will-change: opacity, transform;
}

[data-animate].animated {
    opacity: 1;
    transform: none !important;
}

/* ── Fade Up ── */
[data-animate="fade-up"] {
    transform: translateY(30px);
}

/* ── Fade In ── */
[data-animate="fade-in"] {
    transform: none;
}

/* ── Slide Left ── */
[data-animate="slide-left"] {
    transform: translateX(-40px);
}

/* ── Slide Right ── */
[data-animate="slide-right"] {
    transform: translateX(40px);
}

/* ── Scale In ── */
[data-animate="scale-in"] {
    transform: scale(0.9);
}

/* ── Staggered delays ── */
[data-delay="100"] { transition-delay: 0.1s; }
[data-delay="200"] { transition-delay: 0.2s; }
[data-delay="300"] { transition-delay: 0.3s; }
[data-delay="400"] { transition-delay: 0.4s; }
[data-delay="500"] { transition-delay: 0.5s; }
[data-delay="600"] { transition-delay: 0.6s; }

/* ── General transition utilities ── */
.hover-lift {
    transition: transform var(--transition-base);
}

.hover-lift:hover {
    transform: translateY(-4px);
}

.hover-zoom img {
    transition: transform var(--transition-slow);
}

.hover-zoom:hover img {
    transform: scale(1.05);
}