/* ============================================================
   WOW EFFECTS — effetti condivisi per index.html / giochi.html / blog.html
   Vanilla CSS. Rispetta prefers-reduced-motion e dispositivi touch.
   ============================================================ */

/* ---- Canvas particelle/stelle di sfondo ---- */
.wow-canvas{
  position:fixed;
  inset:0;
  z-index:-1;
  display:block;
  pointer-events:none;
  opacity:.65;
}
@media (max-width:600px){
  .wow-canvas{ opacity:.45; }
}

/* ---- Scroll reveal (fade + slide up) ---- */
.wow-reveal{
  opacity:0;
  transform:translateY(28px);
  transition:opacity .7s cubic-bezier(.16,1,.3,1), transform .7s cubic-bezier(.16,1,.3,1);
  transition-delay:var(--wow-delay,0s);
  will-change:opacity, transform;
}
.wow-reveal.wow-visible{
  opacity:1;
  transform:translateY(0);
}

/* ---- Tilt 3D on hover (mouse only, via JS) ---- */
.wow-tilt{
  transform:perspective(900px);
  transition:transform .5s cubic-bezier(.22,1,.36,1), box-shadow .5s ease;
  will-change:transform;
}
.wow-tilt.wow-tilting{
  transition:box-shadow .15s ease;
}

/* ---- Hero glow text ---- */
.wow-glow{
  text-shadow:0 0 8px rgba(0,255,136,.35), 0 0 22px rgba(0,255,136,.18);
  animation:wowGlowPulse 3.2s ease-in-out infinite;
}
@keyframes wowGlowPulse{
  0%,100%{ text-shadow:0 0 8px rgba(0,255,136,.35), 0 0 22px rgba(0,255,136,.18); }
  50%{ text-shadow:0 0 16px rgba(0,255,136,.55), 0 0 38px rgba(0,255,136,.32); }
}

/* ---- Animated gradient text sweep ---- */
.wow-gradient-text{
  background:linear-gradient(90deg,var(--accent,#00FF88),var(--accent3,#3399FF),var(--accent,#00FF88));
  background-size:200% auto;
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  color:transparent;
  animation:wowGradientShift 5s linear infinite;
}
@keyframes wowGradientShift{
  to{ background-position:200% center; }
}

/* ---- Entrance fade-up for elements already on screen at load ---- */
.wow-fade-up{
  animation:wowFadeUp .8s cubic-bezier(.16,1,.3,1) both;
}
@keyframes wowFadeUp{
  from{ opacity:0; transform:translateY(18px); }
  to{ opacity:1; transform:translateY(0); }
}

@media (prefers-reduced-motion: reduce){
  .wow-reveal{ transition:none !important; opacity:1 !important; transform:none !important; }
  .wow-tilt{ transition:none !important; transform:none !important; }
  .wow-glow{ animation:none !important; text-shadow:0 0 10px rgba(0,255,136,.3); }
  .wow-gradient-text{ animation:none !important; }
  .wow-fade-up{ animation:none !important; opacity:1 !important; transform:none !important; }
  .wow-canvas{ display:none !important; }
}