/* ═══════════════════════════════════════════════════════════
   SCROLL REVEAL — Lightweight AOS replacement
   Uses IntersectionObserver instead of scroll listeners.
   Drop-in compatible with data-aos / data-aos-delay attributes.
   ═══════════════════════════════════════════════════════════ */

/* ── Base hidden state ─────────────────────────────────────
   Every [data-aos] element starts invisible and will-change
   hints let the browser promote the layer to GPU early.
   ────────────────────────────────────────────────────────── */
[data-aos] {
    opacity: 0;
    transition-property: opacity, transform;
    transition-duration: 0.8s;
    transition-timing-function: ease-out;
    will-change: opacity, transform;
}

/* ── Revealed state ────────────────────────────────────────
   Added by IntersectionObserver when element enters viewport.
   ────────────────────────────────────────────────────────── */
[data-aos].aos-animate {
    opacity: 1;
    transform: none !important;
}

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

/* ── Animation: fade-down ──────────────────────────────── */
[data-aos="fade-down"] {
    transform: translateY(-30px);
}

/* ── Animation: fade-left ──────────────────────────────── */
[data-aos="fade-left"] {
    transform: translateX(30px);
}

/* ── Animation: fade-right ─────────────────────────────── */
[data-aos="fade-right"] {
    transform: translateX(-30px);
}

/* ── Animation: zoom-in ────────────────────────────────── */
[data-aos="zoom-in"] {
    transform: scale(0.9);
}

/* ── Duration override ─────────────────────────────────── */
[data-aos][data-aos-duration="1000"] {
    transition-duration: 1s;
}

/* ── Reduced motion preference ─────────────────────────── */
@media (prefers-reduced-motion: reduce) {
    [data-aos] {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }
}