/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Jun 16 2026 | 22:56:02 */
/* Contenedor flotante en la esquina inferior izquierda */
.soccer-bounce-container {
  position: fixed;
  left: 3rem;
  bottom: 3rem;
  width: 120px;
  height: 180px;
  z-index: 9999;
  cursor: pointer;
  display: flex;
  align-items: flex-end;
}

/* SVG del preloader */
.pl {
  width: 100%;
  height: 100%;
  display: block;
  position: relative;
  z-index: 2;
}

/* Animación de rebote */
.pl__bouncing-group {
  animation: ball-bounce 1.4s infinite ease-in-out;
  transform-origin: 28px 28px;
}

/* Animación de rotación del balón */
.pl__ball-image {
  animation: ball-spin 4s infinite linear;
  transform-origin: 0px 0px;
}

/* Animación de escala de la sombra del suelo */
.pl__floor-shadow {
  animation: shadow-scale 1.4s infinite ease-in-out;
  transform-origin: 28px 92px;
}

/* KEYFRAMES - ANIMACIONES */

/* Rebote vertical con efecto de deformación física (squash & stretch) */
@keyframes ball-bounce {
  0%, 100% {
    transform: translateY(36px) scale(1.15, 0.85);
    animation-timing-function: cubic-bezier(0.25, 0.8, 0.25, 1);
  }
  10% {
    transform: translateY(32px) scale(0.9, 1.15);
    animation-timing-function: cubic-bezier(0.25, 0.8, 0.25, 1);
  }
  50% {
    transform: translateY(0px) scale(1, 1);
    animation-timing-function: cubic-bezier(0.6, 0, 0.8, 0.2);
  }
  90% {
    transform: translateY(32px) scale(0.95, 1.1);
  }
}

/* Giro del balón */
@keyframes ball-spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

/* Escala de la sombra según la altura del balón */
@keyframes shadow-scale {
  0%, 100% {
    transform: scale(1.2);
    opacity: 0.9;
    animation-timing-function: cubic-bezier(0.25, 0.8, 0.25, 1);
  }
  50% {
    transform: scale(0.4);
    opacity: 0.15;
    animation-timing-function: cubic-bezier(0.6, 0, 0.8, 0.2);
  }
}
