.hero-copy {
    animation:
        heroEnter 1.2s var(--ease) both;
}

@keyframes heroEnter {

    from {
        opacity: 0;
        transform: translateY(50px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}


.hero-image {
    animation:
        heroImageEnter 1.8s var(--ease) both;
}

@keyframes heroImageEnter {

    from {
        transform: scale(1.08);
    }

    to {
        transform: scale(1);
    }
}


.hero-scroll {
    animation:
        scrollPulse 2s ease-in-out infinite;
}

@keyframes scrollPulse {

    0%,
    100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(8px);
    }
}


.feature-image,
.split-image,
.news-image {
    transition:
        transform .8s var(--ease);
}

.feature-card:hover .feature-image,
.news-card:hover .news-image {
    transform: scale(.98);
}


@media (prefers-reduced-motion: reduce) {

    *,
    *::before,
    *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
        scroll-behavior: auto !important;
    }

    .reveal {
        opacity: 1;
        transform: none;
    }
}
/* =========================================
   SCROLL REVEAL
========================================= */

.reveal {
    opacity: 0;

    transition:
        opacity 900ms cubic-bezier(.16, 1, .3, 1),
        transform 1100ms cubic-bezier(.16, 1, .3, 1);

    will-change: opacity, transform;
}


/* =========================================
   AUSGANGSPOSITIONEN
========================================= */

.reveal-left {
    transform: translateX(-120px);
}

.reveal-right {
    transform: translateX(200px);
}

.reveal-up {
    transform: translateY(80px);
}

.reveal-down {
    transform: translateY(-80px);
}

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


/* =========================================
   SICHTBAR
========================================= */

.reveal.is-visible {
    opacity: 1;
    transform: translateX(0) translateY(0) scale(1);
}


/* =========================================
   OPTIONALE VERZÖGERUNGEN
========================================= */

.reveal-delay-1 {
    transition-delay: 100ms;
}

.reveal-delay-2 {
    transition-delay: 200ms;
}

.reveal-delay-3 {
    transition-delay: 300ms;
}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 700px) {

    .reveal-left {
        transform: translateX(-60px);
    }

    .reveal-right {
        transform: translateX(60px);
    }

}


/* =========================================
   REDUCED MOTION
========================================= */

@media (prefers-reduced-motion: reduce) {

    .reveal,
    .reveal-left,
    .reveal-right,
    .reveal-up,
    .reveal-down,
    .reveal-scale {
        opacity: 1;
        transform: none;
        transition: none;
    }

}