/* =========================================
   RED ECHO – GALLERY EFFECT
   STAPEL FÄCHERT SICH AUF
========================================= */


/* =========================================
   1. AUSGANGSZUSTAND

   Solange die Bühne die Klasse
   gallery__stage--stacked hat, liegen alle
   Karten als kleiner Stapel in der Mitte.

   js/gallery.js entfernt die Klasse, sobald
   das erste Bild geladen ist. Dann gleiten
   die Karten durch die Transition aus
   gallery.css an ihren Platz.
========================================= */

.gallery__stage--stacked .gallery__card {
    opacity: 0;

    transform:
        translate(-50%, -50%)
        rotate(calc(var(--offset) * 3deg))
        scale(0.82);
}


/* =========================================
   2. REDUCED MOTION

   Ohne Animation stehen die Karten
   sofort an ihrem Platz. Dafür sorgt
   bereits "transition: none" in gallery.css.
========================================= */