/* =============================================================
   GRANJA IGUARARO — EFECTOS (todas las paginas)
   Aparicion al scroll, abeja que vuela al carrito y pulso del boton de
   WhatsApp. Basado en herramientas/snippets/efectos.css del taller.
   Solo transform y opacity. El bloque final respeta prefers-reduced-motion.
   ============================================================= */

/* Aparicion al entrar en pantalla. La clase .gi-oculto la pone JS solo a lo
   que esta bajo el primer pantallazo: sin JS nada queda invisible. */
.gi-oculto{opacity:0;transform:translateY(28px)}
.gi-oculto.gi-visible{
  opacity:1;transform:none;
  transition:opacity .8s var(--ease),transform .8s var(--ease);
  transition-delay:calc(var(--i,0) * 90ms);
}

/* Abeja que vuela de un boton al carrito (la crea interaccion.js). */
.gi-abeja-vuela{
  position:fixed;left:0;top:0;z-index:var(--z-modal);width:64px;height:auto;pointer-events:none;
  margin:-32px 0 0 -32px;will-change:transform,opacity;
  filter:drop-shadow(0 6px 6px rgba(60,40,0,.3));
}

/* Miel que cae de una tarjeta o boton al pasar el mouse (se pinta en shop.css
   para las tarjetas); aqui el pulso del boton flotante de WhatsApp. */
.gi-wa-flotante{position:fixed}
@media (prefers-reduced-motion:no-preference){
  .gi-wa-flotante::after{
    content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
    box-shadow:0 0 0 0 rgba(37,211,102,.55);animation:gi-pulso 9s ease-out infinite;
  }
}
@keyframes gi-pulso{0%{box-shadow:0 0 0 0 rgba(37,211,102,.5)}14%,100%{box-shadow:0 0 0 16px rgba(37,211,102,0)}}

@media (prefers-reduced-motion:reduce){
  .gi-oculto{opacity:1;transform:none}
  .gi-marquesina{overflow-x:auto}
  .gi-marquesina-pista{animation:none}
  .gi-frasco img,.gi-sobre-abeja,.gi-cta-abeja,.gi-hero-bajar span{animation:none}
}