/* ============================================================
   ANIMASI INTERAKTIF (SCROLL ANIMATIONS)
   ============================================================ */

/* Kondisi awal sebelum masuk layar (tersembunyi & bergeser) */
.reveal {
  opacity: 0;
  will-change: transform, opacity;
  transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
  transition-delay: var(--d, 0ms);
}

/* 1. Efek Muncul dari Bawah (Default) */
.reveal, .reveal-up {
  transform: translateY(50px);
}

/* 2. Efek Muncul dari Atas */
.reveal-down {
  transform: translateY(-50px);
}

/* 3. Efek Muncul dari Kiri */
.reveal-left {
  transform: translateX(-60px);
}

/* 4. Efek Muncul dari Kanan */
.reveal-right {
  transform: translateX(60px);
}

/* 5. Efek Zoom In / Membesar */
.reveal-zoom {
  transform: scale(0.85);
}

/* Kondisi KETIKA SUDAH MASUK LAYAR (Aktif) */
.reveal.is-in,
.reveal-up.is-in,
.reveal-down.is-in,
.reveal-left.is-in,
.reveal-right.is-in,
.reveal-zoom.is-in {
  opacity: 1;
  transform: translate(0, 0) scale(1);
}