/* ============================================================
   SENZAVI · Entrance Animation – Fade + Slide Up
   ------------------------------------------------------------
   Anwendung: Klasse "sen_animate-in" im Elementor-Editor
              unter Erweitert → CSS-Klassen eintragen.

   Modifier:
     sen_delay-1 … sen_delay-5      gestaffelte Verzögerung
     sen_fast / sen_slow            Geschwindigkeit
     sen_from-left / sen_from-right Richtung
     sen_zoom                       Zoom-Variante
   ============================================================ */

/* ---------- Grundzustand (unsichtbar + verschoben) ------------ */

.sen_animate-in {
    opacity:    0;
    transform:  translateY(40px);
    transition:
        opacity   0.7s cubic-bezier(0.22, 1, 0.36, 1),
        transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
    will-change: opacity, transform;
}


/* ---------- Aktiv (sichtbar + Originalposition) --------------- */

.sen_animate-in.sen_visible {
    opacity:   1;
    transform: translateY(0);
}


/* ---------- Verzögerungs-Varianten ---------------------------- */

.sen_animate-in.sen_delay-1 { transition-delay: 0.1s; }
.sen_animate-in.sen_delay-2 { transition-delay: 0.2s; }
.sen_animate-in.sen_delay-3 { transition-delay: 0.3s; }
.sen_animate-in.sen_delay-4 { transition-delay: 0.4s; }
.sen_animate-in.sen_delay-5 { transition-delay: 0.5s; }


/* ---------- Geschwindigkeits-Varianten ------------------------ */

.sen_animate-in.sen_fast { transition-duration: 0.4s; }
.sen_animate-in.sen_slow { transition-duration: 1.1s; }


/* ---------- Richtungs-Varianten ------------------------------- */

.sen_animate-in.sen_from-left  { transform: translateX(-50px); }
.sen_animate-in.sen_from-right { transform: translateX(50px); }

.sen_animate-in.sen_from-left.sen_visible,
.sen_animate-in.sen_from-right.sen_visible {
    transform: translateX(0);
}


/* ---------- Zoom-Variante ------------------------------------- */

.sen_animate-in.sen_zoom {
    transform: scale(0.88) translateY(20px);
}

.sen_animate-in.sen_zoom.sen_visible {
    transform: scale(1) translateY(0);
}


/* ---------- Reduced Motion Respekt ---------------------------- */

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

    .sen_animate-in,
    .sen_animate-in.sen_visible {
        opacity:    1;
        transform:  none;
        transition: none;
    }
}


/* ---------- Im Elementor-Editor deaktivieren ------------------ */

.elementor-editor-active .sen_animate-in,
.elementor-editor-active .sen_animate-in.sen_from-right,
.elementor-editor-active .sen_animate-in.sen_from-left {
    opacity:   1;
    transform: translateY(0px) !important;
    transform: translateX(0px) !important;
}