/* Basis-Klasse: Das Element ist unsichtbar und versetzt */
.fade-up {
  opacity: 0;
  transform: translateY(40px);

  /* Hardware-Beschleunigung für ruckelfreies Scrollen auf Handys */
  will-change: opacity, transform;
	
  /* Die Bewegung definieren */
  transition: opacity 0.8s ease-out, transform 0.8s cubic-bezier(0.2, 0.8, 0.2, 1);
}

/* Aktiv-Klasse: Wird per JS hinzugefügt, wenn das Element sichtbar ist */
.fade-up.in-view {
  opacity: 1;
  transform: translateY(0);
}


/* --- OPTIONAL: Verzögerungs-Klassen (für den Wasserfall-Effekt) --- */
.delay-100 { transition-delay: 0.2s; }
.delay-200 { transition-delay: 0.4s; }
.delay-300 { transition-delay: 0.6s; }
.delay-400 { transition-delay: 0.8s; }
.delay-500 { transition-delay: 1.0s; }
.delay-600 { transition-delay: 1.2s; }