/* Scroll reveal, hero entrance and motion effects */

:root {
    --reveal-duration: 0.75s;
    --reveal-ease: cubic-bezier(0.22, 1, 0.36, 1);
    --reveal-distance: 48px;
    --reveal-stagger: 0.1s;
}

.reveal {
    opacity: 0;
    transition:
        opacity var(--reveal-duration) var(--reveal-ease),
        transform var(--reveal-duration) var(--reveal-ease);
    transition-delay: var(--reveal-delay, 0s);
    will-change: opacity, transform;
}

.reveal-up {
    transform: translateY(var(--reveal-distance));
}

.reveal-down {
    transform: translateY(calc(var(--reveal-distance) * -1));
}

.reveal-left {
    transform: translateX(calc(var(--reveal-distance) * -1));
}

.reveal-right {
    transform: translateX(var(--reveal-distance));
}

.reveal-scale {
    transform: scale(0.94);
}

.reveal-fade {
    transform: none;
}

.reveal.is-visible {
    opacity: 1;
    transform: none;
}

/* Hero entrance on page load */
.hero-reveal {
    opacity: 0;
    transform: translateY(32px);
    animation: heroEnter 0.9s var(--reveal-ease) forwards;
    animation-delay: var(--hero-delay, 0s);
}

.hero-reveal-scale {
    opacity: 0;
    transform: scale(0.92) translateY(24px);
    animation: heroEnterScale 1s var(--reveal-ease) forwards;
    animation-delay: var(--hero-delay, 0s);
}

@keyframes heroEnter {
    to {
        opacity: 1;
        transform: none;
    }
}

@keyframes heroEnterScale {
    to {
        opacity: 1;
        transform: none;
    }
}

[data-parallax] {
    will-change: transform;
    transition: transform 0.1s linear;
}

html.reduce-motion .reveal,
html.reduce-motion .hero-reveal,
html.reduce-motion .hero-reveal-scale {
    opacity: 1;
    transform: none;
    animation: none;
    transition: none;
}

@media (prefers-reduced-motion: reduce) {
    .reveal {
        opacity: 1;
        transform: none;
        transition: none;
    }

    .hero-reveal,
    .hero-reveal-scale {
        opacity: 1;
        transform: none;
        animation: none;
    }

    [data-parallax] {
        transform: none !important;
    }
}