/* ================================
   Animations
================================ */

/* Fade Left */
@keyframes fadeLeft {
  from {
    opacity: 0;
    transform: translateX(-30px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

/* Zoom In */
@keyframes zoomIn {
  from {
    opacity: 0;
    transform: scale(0.85);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

/* Fade Up (bereits vorhanden) */
@keyframes fadeUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}





/* ================================
   Jump Animation
================================ */

@keyframes jumpY {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-8px);
  }
  100% {
    transform: translateY(0);
  }
}

.is-style-jump {
  animation: jumpY 3s ease-in-out infinite;
}




/* Initial State */
.is-style-fade-up,
.is-style-fade-left,
.is-style-zoom-in{
  opacity: 0;
}

/* Active State */
.animate-fade-up {
  animation: fadeUp 0.6s ease forwards;
}

.animate-fade-left {
  animation: fadeLeft 0.6s ease forwards;
}

.animate-zoom-in {
  animation: zoomIn 0.6s ease forwards;
}