/* ============================================================
   SCROLL REVEAL ANIMATION
   Konten muncul saat di-scroll
   ============================================================ */

/* ---------- Base state — tersembunyi ---------- */
[data-reveal] {
  opacity: 0;
  transform: translateY(30px);
  transition: 
    opacity .8s cubic-bezier(.25, .8, .25, 1),
    transform .8s cubic-bezier(.25, .8, .25, 1);
  will-change: opacity, transform;
}

[data-reveal].is-revealed {
  opacity: 1;
  transform: translateY(0);
}

/* ---------- Varian arah animasi ---------- */
[data-reveal="fade-up"] { transform: translateY(30px); }
[data-reveal="fade-up"].is-revealed { transform: translateY(0); }

[data-reveal="fade-down"] { transform: translateY(-30px); }
[data-reveal="fade-down"].is-revealed { transform: translateY(0); }

[data-reveal="fade-left"] { transform: translateX(40px); }
[data-reveal="fade-left"].is-revealed { transform: translateX(0); }

[data-reveal="fade-right"] { transform: translateX(-40px); }
[data-reveal="fade-right"].is-revealed { transform: translateX(0); }

[data-reveal="fade"] { transform: none; }
[data-reveal="fade"].is-revealed { opacity: 1; }

[data-reveal="zoom-in"] {
  opacity: 0;
  transform: scale(.9);
}
[data-reveal="zoom-in"].is-revealed {
  opacity: 1;
  transform: scale(1);
}

[data-reveal="zoom-out"] {
  opacity: 0;
  transform: scale(1.1);
}
[data-reveal="zoom-out"].is-revealed {
  opacity: 1;
  transform: scale(1);
}

[data-reveal="flip-up"] {
  opacity: 0;
  transform: perspective(1000px) rotateX(-20deg) translateY(30px);
  transform-origin: center bottom;
}
[data-reveal="flip-up"].is-revealed {
  opacity: 1;
  transform: perspective(1000px) rotateX(0) translateY(0);
}

/* ---------- Delay berjenjang ---------- */
[data-reveal-delay="1"] { transition-delay: .1s; }
[data-reveal-delay="2"] { transition-delay: .2s; }
[data-reveal-delay="3"] { transition-delay: .3s; }
[data-reveal-delay="4"] { transition-delay: .4s; }
[data-reveal-delay="5"] { transition-delay: .5s; }
[data-reveal-delay="6"] { transition-delay: .6s; }
[data-reveal-delay="7"] { transition-delay: .7s; }
[data-reveal-delay="8"] { transition-delay: .8s; }

/* ---------- Durasi kustom ---------- */
[data-reveal-duration="fast"] { transition-duration: .5s; }
[data-reveal-duration="slow"] { transition-duration: 1.2s; }

/* ---------- Mobile — animasi lebih ringan ---------- */
@media (max-width: 768px) {
  [data-reveal] {
    transform: translateY(20px);
    transition-duration: .6s;
  }
  [data-reveal="fade-left"],
  [data-reveal="fade-right"] {
    transform: translateY(20px);
  }
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  [data-reveal] {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}