/* === AOS FATTO IN CASA - collegato a odf.js === */

/* ✨ Stato iniziale - animazioni in attesa */
.anim-fade-up,
.anim-fade-down,
.anim-fade-left,
.anim-fade-right,
.anim-fade-left-up,
.anim-fade-right-up,
.anim-zoom-in,
.anim-zoom-out {
  opacity: 0 !important;
  will-change: opacity, transform;
}

/* Effetti specifici */
.anim-fade-up       { transform: translateY(20px); }
.anim-fade-down     { transform: translateY(-20px); }
.anim-fade-left     { transform: translateX(-20px); }
.anim-fade-right    { transform: translateX(20px); }
.anim-fade-left-up  { transform: translateX(-20px) translateY(20px); }
.anim-fade-right-up { transform: translateX(20px) translateY(20px); }
.anim-zoom-in       { transform: scale(0.9); }
.anim-zoom-out      { transform: scale(1.1); }

/* ✨ Stato attivo - quando entra in viewport */
.anim-fade-up.active,
.anim-fade-down.active,
.anim-fade-left.active,
.anim-fade-right.active,
.anim-fade-left-up.active,
.anim-fade-right-up.active,
.anim-zoom-in.active,
.anim-zoom-out.active {
  opacity: 1 !important;
  transform: none; /* Tutto torna alla posizione/scala originale */
}

/* 🔒 Disattiva le animazioni sotto gli 850px */
@media (max-width: 850px) {
  .anim-fade-up,
  .anim-fade-down,
  .anim-fade-left,
  .anim-fade-right,
  .anim-fade-left-up,
  .anim-fade-right-up,
  .anim-zoom-in,
  .anim-zoom-out {
    opacity: 1 !important;
    transform: none !important;
    will-change: auto;
  }
}