* {
  font-family: 'Poppins', sans-serif;
}

.texto-shimmer {
  background: linear-gradient(
    to right, 
    #fdf000 0%, 
    #c49704 50%, 
    #fdf000 100%
  );
  
  /* 2. Tamaño del fondo: Debe ser más ancho que el texto para poder moverse (200%) */
  background-size: 200% auto;
  
  /* 3. Recortamos el fondo a la forma del texto */
  background-clip: text;
  -webkit-background-clip: text; /* Necesario para Chrome/Safari */
  
  /* 4. Hacemos el texto transparente para ver el fondo */
  color: transparent;
  -webkit-text-fill-color: transparent;
  
  /* 5. La animación */
  animation: brillo 3s linear infinite;
}

/* Definición del movimiento */
@keyframes brillo {
  0% {
    background-position: 200% center;
  }
  100% {
    background-position: -200% center;
  }
}

.fade-left {
  opacity: 0;                  /* invisible al inicio */
  transform: translateX(-50px); /* desplazado hacia la izquierda */
  animation: fadeLeft 1.2s ease-out forwards; /* ejecuta animación */
}

@keyframes fadeLeft {
  to {
    opacity: 1;
    transform: translateX(0); /* vuelve a su posición original */
  }
}