/* ── Scroll-reveal base states ─────────────────────────────────────── */

/* Default: fade up */
[data-reveal],
.reveal {
    opacity: 0;
    transform: translateY(36px);
    transition: opacity 0.65s ease, transform 0.65s ease;
}

/* Left slide */
[data-reveal="left"],
.reveal-left {
    transform: translateX(-40px);
}

/* Right slide */
[data-reveal="right"],
.reveal-right {
    transform: translateX(40px);
}

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

/* Scale up */
[data-reveal="scale"],
.reveal-scale {
    transform: scale(0.92);
}

/* ── Visible state (added by JS) ───────────────────────────────────── */
[data-reveal].is-visible,
.reveal.is-visible,
.reveal-left.is-visible,
.reveal-right.is-visible,
.reveal-fade.is-visible,
.reveal-scale.is-visible {
    opacity: 1;
    transform: none;
}

/* ── Delay helpers ─────────────────────────────────────────────────── */
.reveal-delay-1 { transition-delay: 0.10s; }
.reveal-delay-2 { transition-delay: 0.20s; }
.reveal-delay-3 { transition-delay: 0.30s; }
.reveal-delay-4 { transition-delay: 0.40s; }
.reveal-delay-5 { transition-delay: 0.50s; }

/* ── Respect reduced-motion preference ─────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
    [data-reveal],
    .reveal,
    .reveal-left,
    .reveal-right,
    .reveal-fade,
    .reveal-scale {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }
}