/**
 * Pro Effects — Letter Bounce
 *
 * Hover (mouseenter): cada letra ejecuta UN BOUNCE COMPLETO via @keyframes
 * (sube hasta -h y vuelve a 0). El stagger left-to-right (idx*stagger) hace
 * que la ola recorra la palabra. Las letras VUELVEN solas al baseline,
 * independientemente de si el mouse sigue encima — el bounce es un evento,
 * no un estado mantenido.
 *
 * JS aplica/quita la clase .pe-lb-bouncing en cada mouseenter para forzar
 * restart de la animation (CSS no re-dispara la misma animation por si sola).
 */

.elementor-button.pe-lb-active .elementor-button-text {
  display: inline-block;
}

.elementor-button.pe-lb-active .pe-lb-char-wrap {
  display: inline-block;
  transform-origin: center;
  will-change: transform, color;
}

/* @keyframes — sube y baja en una sola animacion (one-shot) */
@keyframes peLbBounce {
  0%   { transform: translateY(0); }
  50%  { transform: translateY(calc(var(--pe-lb-bounce-h, 8px) * -1)); }
  100% { transform: translateY(0); }
}
@keyframes peLbBounceColor {
  0%   { color: inherit; }
  50%  { color: var(--pe-lb-color-hover, inherit); }
  100% { color: inherit; }
}

/* Aplicamos la animation cuando .pe-lb-bouncing esta presente. JS la
 * remueve+agrega cada mouseenter para forzar restart. */
.elementor-button.pe-lb-active.pe-lb-bouncing .pe-lb-char-wrap {
  animation: peLbBounce var(--pe-lb-dur, 0.5s) cubic-bezier(0.34, 1.56, 0.64, 1)
             calc(var(--pe-lb-idx, 0) * var(--pe-lb-stagger, 0.05s)) 1 both;
}

/* Color sweep en sync con el bounce (solo si --pe-lb-color-hover esta seteado) */
.elementor-button.pe-lb-active[data-pe-lb-color="yes"].pe-lb-bouncing .pe-lb-char-wrap {
  animation:
    peLbBounce      var(--pe-lb-dur, 0.5s) cubic-bezier(0.34, 1.56, 0.64, 1)
                    calc(var(--pe-lb-idx, 0) * var(--pe-lb-stagger, 0.05s)) 1 both,
    peLbBounceColor var(--pe-lb-dur, 0.5s) ease
                    calc(var(--pe-lb-idx, 0) * var(--pe-lb-stagger, 0.05s)) 1 both;
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  .elementor-button.pe-lb-active .pe-lb-char-wrap {
    animation: none !important;
    transform: none !important;
  }
}