/* ==========================================================================
   Mr. White Agency – Soft Scroll & Reveal-Feinschliff (v7.12.0)

   Lädt NACH dark-theme.css. Enthält zwei Dinge:
   1. Die Pflicht-Regeln von Lenis (aus lenis.css übernommen, MIT)
   2. Den verfeinerten Reveal-Einblendeffekt inkl. Staffelung

   Achtung: Diese Datei überschreibt .reveal aus style.css. Die
   .reveal-delay-N-Klassen werden hier bewusst erneut deklariert, damit sie
   die Staffel-Variable schlagen.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Lenis – Grundgerüst
   -------------------------------------------------------------------------- */
html.lenis,
html.lenis body { height: auto; }

/* Hebt scroll-behavior:smooth auf — sonst kämpfen native Glättung und Lenis
   gegeneinander (header.php Critical-CSS + style.css setzen es global).
   Lenis selbst setzt .lenis-smooth nur WÄHREND einer Bewegung; die eigene
   Klasse .has-soft-scroll (aus soft-scroll.js) hält es dauerhaft aus. */
html.has-soft-scroll,
.lenis.lenis-smooth { scroll-behavior: auto !important; }

.lenis.lenis-smooth [data-lenis-prevent] { overscroll-behavior: contain; }
.lenis.lenis-stopped { overflow: clip; }
.lenis.lenis-smooth iframe { pointer-events: none; }


/* --------------------------------------------------------------------------
   2. Reveal – ruhiger, weicher, gestaffelt
   Kürzerer Weg (18px statt 30px) und ein Easing, das am Ende ausläuft
   statt abzubremsen. translate3d hält die Animation auf der GPU.
   -------------------------------------------------------------------------- */
.reveal {
    opacity: 0;
    transform: translate3d(0, 18px, 0);
    transition:
        opacity   0.85s cubic-bezier(0.22, 0.61, 0.36, 1),
        transform 0.85s cubic-bezier(0.22, 0.61, 0.36, 1);
    transition-delay: calc(var(--reveal-i, 0) * var(--reveal-stagger, 80ms));
}

.reveal.visible {
    opacity: 1;
    transform: translate3d(0, 0, 0);
}

/* Bestehende manuelle Verzögerungen behalten Vorrang vor der Staffelung */
.reveal-delay-1 { transition-delay: 0.1s; }
.reveal-delay-2 { transition-delay: 0.2s; }
.reveal-delay-3 { transition-delay: 0.3s; }
.reveal-delay-4 { transition-delay: 0.4s; }

/* Touch-Geräte: etwas kürzerer Weg und schnellerer Ablauf, damit beim
   nativen (schnellen) Wischen nichts hinterherhinkt. */
@media (hover: none), (pointer: coarse) {
    .reveal {
        transform: translate3d(0, 14px, 0);
        transition-duration: 0.65s;
        transition-delay: calc(var(--reveal-i, 0) * 60ms);
    }
}

/* Reduzierte Bewegung: alles sofort sichtbar, keine Verzögerung.
   (Ergänzt die Regel in dark-theme.css um transition-delay.) */
@media (prefers-reduced-motion: reduce) {
    .reveal,
    .reveal.visible {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
        transition-delay: 0s !important;
    }
}