@media (max-width: 768px) {
  /* Animación de zoom */
  .zoom-on-mobile {
    transition: transform 0.8s ease, opacity 0.8s ease;
    transform: scale(0.8);
    opacity: 0;
  }

  .zoom-in {
    transform: scale(1);
    opacity: 1;
  }

  /* Animación de abajo hacia arriba */
  .slide-up-on-mobile {
    opacity: 0;
    transform: translateY(40px);
    transition: all 0.7s ease-out;
  }

  .slide-up-in {
    opacity: 1;
    transform: translateY(0);
  }

  /* Animación tipo flip-up */
  .flip-up-on-mobile {
    transform: rotateX(90deg);
    opacity: 0;
    transition: all 0.6s ease-out;
    transform-origin: bottom;
    backface-visibility: hidden;
  }

  .flip-up-in {
    transform: rotateX(0);
    opacity: 1;
  }

  /* Animación tipo fade-right */
  .fade-right-on-mobile {
    opacity: 0;
    transform: translateX(-30px);
    transition: all 0.6s ease-out;
  }

  .fade-right-in {
    opacity: 1;
    transform: translateX(0);
  }

  /* Animación tipo fade-left */
  .fade-left-on-mobile {
    opacity: 0;
    transform: translateX(30px);
    transition: all 0.6s ease-out;
  }

  .fade-left-in {
    opacity: 1;
    transform: translateX(0);
  }

  /* Animación tipo fade-up */
  .fade-up-on-mobile {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.6s ease-out;
  }

  .fade-up-in {
    opacity: 1;
    transform: translateY(0);
  }
}