[hidden]{ display:none !important; }

/* =========================
   MODO BASIC / GORILLA
   - NO forzamos display:block a nada (para no romper flex/grid/elementor)
   - Respetamos ocultos por responsive tal cual estaban
   ========================= */
.gg-basic .gorillamode{ display:none !important; }     /* En basic, gorillamode SIEMPRE oculto */
.gg-gorilla #cajaproducto{ display:none !important; }  /* En gorilla, cajaproducto SIEMPRE oculto */

/* =========================
   LLUVIA
   ========================= */
.gg-fall{
  position:fixed;
  top:-20vh;
  left:var(--left,0vw);
  width:var(--size-px, 60px); /* JS lo pisa SIEMPRE */
  height:auto;
  opacity:1;
  filter:drop-shadow(0 6px 8px rgba(0,0,0,.18));
  will-change:transform;
  user-select:none; -webkit-user-drag:none;
  transform-origin:50% 50%;
  transform: translate3d(0, -20vh, 0) rotate(var(--rot-start, 0deg));
  animation: gg-fall-spin linear var(--duration, 10s) var(--delay, 0s) forwards;
  z-index:2147483647;

  pointer-events:auto;
  cursor: grab;
  touch-action: none;
}

@keyframes gg-fall-spin{
  0%   { transform: translate3d(0, -20vh, 0) rotate(var(--rot-start, 0deg)); }
  100% { transform: translate3d(0, 120vh, 0) rotate(var(--rot-end, 360deg)); }
}

@keyframes gg-drop{
  to { transform: translate3d(0, var(--drop-dy, 120vh), 0) rotate(var(--drop-rot, 360deg)); }
}

@media (prefers-reduced-motion: reduce){
  .gg-fall{ display:none!important; }
}
