/* ═══════════════════════════════════════════════════
   STEPCAR — ANIMATION SYSTEM
   CSS + IntersectionObserver (no library)
   Rispetta prefers-reduced-motion
═══════════════════════════════════════════════════ */

/* Base: attivo solo quando JS è caricato */
.sc-anim-js [data-anim],
.sc-anim-js [data-anim-hero] {
  opacity: 0;
  transition:
    opacity  0.9s cubic-bezier(0.22, 1, 0.36, 1),
    transform 0.9s cubic-bezier(0.22, 1, 0.36, 1);
  will-change: opacity, transform;
}

/* ── Tipi ── */
.sc-anim-js [data-anim="fade-up"],
.sc-anim-js [data-anim-hero="fade-up"]    { transform: translateY(34px); }

.sc-anim-js [data-anim="fade-down"],
.sc-anim-js [data-anim-hero="fade-down"]  { transform: translateY(-24px); }

.sc-anim-js [data-anim="fade-left"],
.sc-anim-js [data-anim-hero="fade-left"]  { transform: translateX(48px); }

.sc-anim-js [data-anim="fade-right"],
.sc-anim-js [data-anim-hero="fade-right"] { transform: translateX(-48px); }

.sc-anim-js [data-anim="fade-in"],
.sc-anim-js [data-anim-hero="fade-in"]    { transform: none; }

.sc-anim-js [data-anim="scale-up"],
.sc-anim-js [data-anim-hero="scale-up"]   { transform: scale(0.93); }

/* ── Stato visibile ── */
.sc-anim-js [data-anim].anim-visible,
.sc-anim-js [data-anim-hero].anim-visible {
  opacity:   1 !important;
  transform: none !important;
}

/* ── Delay ── */
[data-anim-delay="80"]  { transition-delay:  80ms !important; }
[data-anim-delay="100"] { transition-delay: 100ms !important; }
[data-anim-delay="150"] { transition-delay: 150ms !important; }
[data-anim-delay="200"] { transition-delay: 200ms !important; }
[data-anim-delay="250"] { transition-delay: 250ms !important; }
[data-anim-delay="300"] { transition-delay: 300ms !important; }
[data-anim-delay="350"] { transition-delay: 350ms !important; }
[data-anim-delay="400"] { transition-delay: 400ms !important; }
[data-anim-delay="450"] { transition-delay: 450ms !important; }
[data-anim-delay="500"] { transition-delay: 500ms !important; }
[data-anim-delay="600"] { transition-delay: 600ms !important; }

/* ── Reduced motion: mostra tutto subito ── */
@media (prefers-reduced-motion: reduce) {
  .sc-anim-js [data-anim],
  .sc-anim-js [data-anim-hero] {
    opacity:    1 !important;
    transform:  none !important;
    transition: none !important;
  }
}