/* ============================================================
   Scroll Reveal Animations — Modern & Diverse Effects
   ============================================================ */

/* Base: all reveal elements start hidden */
[data-reveal] {
    opacity: 0;
    will-change: opacity, transform, filter;
    transition: opacity 0.7s cubic-bezier(0.22, 1, 0.36, 1),
                transform 0.7s cubic-bezier(0.22, 1, 0.36, 1),
                filter 0.7s cubic-bezier(0.22, 1, 0.36, 1);
}

/* --- Individual reveal types --- */

/* Fade up (classic, smooth) */
[data-reveal="fade-up"] {
    transform: translateY(50px);
}

/* Fade up with blur (modern, dreamy) */
[data-reveal="blur-up"] {
    transform: translateY(40px);
    filter: blur(8px);
}

/* Slide from left */
[data-reveal="slide-left"] {
    transform: translateX(-60px);
}

/* Slide from right */
[data-reveal="slide-right"] {
    transform: translateX(60px);
}

/* Scale up with blur (for cards, images) */
[data-reveal="scale-blur"] {
    transform: scale(0.88);
    filter: blur(6px);
}

/* Scale up (subtle zoom-in) */
[data-reveal="scale-up"] {
    transform: scale(0.9);
}

/* Fade in only (no movement) */
[data-reveal="fade-in"] {
    transform: none;
}

/* Clip reveal — content slides out of a mask */
[data-reveal="clip-up"] {
    clip-path: inset(100% 0 0 0);
    transform: none;
    opacity: 1; /* clip handles visibility */
}

/* Rotate in slightly */
[data-reveal="rotate-in"] {
    transform: translateY(30px) rotate(3deg);
    transform-origin: left bottom;
}

/* --- Revealed state (all types) --- */
[data-reveal].revealed {
    opacity: 1;
    transform: translateY(0) translateX(0) scale(1) rotate(0deg);
    filter: blur(0);
    clip-path: inset(0 0 0 0);
}

/* --- Custom transition delays via data attribute --- */
[data-reveal][data-delay="100"] { transition-delay: 100ms; }
[data-reveal][data-delay="200"] { transition-delay: 200ms; }
[data-reveal][data-delay="300"] { transition-delay: 300ms; }
[data-reveal][data-delay="400"] { transition-delay: 400ms; }
[data-reveal][data-delay="500"] { transition-delay: 500ms; }

/* --- Stagger container (children animate sequentially) --- */
[data-reveal-stagger] > * {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.5s cubic-bezier(0.22, 1, 0.36, 1),
                transform 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}

[data-reveal-stagger].revealed > * {
    opacity: 1;
    transform: translateY(0);
}

/* Stagger delays (each child gets progressively longer delay) */
[data-reveal-stagger].revealed > *:nth-child(1) { transition-delay: 0ms; }
[data-reveal-stagger].revealed > *:nth-child(2) { transition-delay: 50ms; }
[data-reveal-stagger].revealed > *:nth-child(3) { transition-delay: 100ms; }
[data-reveal-stagger].revealed > *:nth-child(4) { transition-delay: 150ms; }
[data-reveal-stagger].revealed > *:nth-child(5) { transition-delay: 200ms; }
[data-reveal-stagger].revealed > *:nth-child(6) { transition-delay: 250ms; }
[data-reveal-stagger].revealed > *:nth-child(7) { transition-delay: 300ms; }
[data-reveal-stagger].revealed > *:nth-child(8) { transition-delay: 350ms; }
[data-reveal-stagger].revealed > *:nth-child(9) { transition-delay: 400ms; }
[data-reveal-stagger].revealed > *:nth-child(10) { transition-delay: 450ms; }
[data-reveal-stagger].revealed > *:nth-child(11) { transition-delay: 500ms; }
[data-reveal-stagger].revealed > *:nth-child(12) { transition-delay: 550ms; }
[data-reveal-stagger].revealed > *:nth-child(13) { transition-delay: 600ms; }
[data-reveal-stagger].revealed > *:nth-child(14) { transition-delay: 650ms; }
[data-reveal-stagger].revealed > *:nth-child(15) { transition-delay: 700ms; }
[data-reveal-stagger].revealed > *:nth-child(16) { transition-delay: 750ms; }
[data-reveal-stagger].revealed > *:nth-child(17) { transition-delay: 800ms; }
[data-reveal-stagger].revealed > *:nth-child(18) { transition-delay: 850ms; }
[data-reveal-stagger].revealed > *:nth-child(19) { transition-delay: 900ms; }
[data-reveal-stagger].revealed > *:nth-child(20) { transition-delay: 950ms; }
[data-reveal-stagger].revealed > *:nth-child(21) { transition-delay: 1000ms; }
[data-reveal-stagger].revealed > *:nth-child(22) { transition-delay: 1050ms; }
[data-reveal-stagger].revealed > *:nth-child(23) { transition-delay: 1100ms; }
[data-reveal-stagger].revealed > *:nth-child(24) { transition-delay: 1150ms; }

/* --- Respect reduced motion preference --- */
@media (prefers-reduced-motion: reduce) {
    [data-reveal],
    [data-reveal-stagger] > * {
        opacity: 1 !important;
        transform: none !important;
        filter: none !important;
        clip-path: none !important;
        transition: none !important;
    }
}