/* =============================================
   IRADIVI — Scroll Reveal Animations CSS
   Bootstrap Compatible | No library needed
   ============================================= */

/* ---- Prevent horizontal overflow from translateX animations ---- */
html, body {
  overflow-x: hidden;
}

/* ---- Base hidden state for all animated elements ---- */
[data-anim] {
  opacity: 0;
  transition-timing-function: cubic-bezier(0.22, 1, 0.36, 1);
  transition-property: opacity, transform;
  will-change: opacity, transform;
}

/* ---- Animation types ---- */

/* Fade up (default) */
[data-anim="fade-up"] {
  transform: translateY(40px);
  transition-duration: 0.75s;
}

/* Fade down */
[data-anim="fade-down"] {
  transform: translateY(-40px);
  transition-duration: 0.75s;
}

/* Fade left */
[data-anim="fade-left"] {
  transform: translateX(30px);
  transition-duration: 0.8s;
}

/* Fade right */
[data-anim="fade-right"] {
  transform: translateX(-30px);
  transition-duration: 0.8s;
}

/* Fade only (no movement) */
[data-anim="fade"] {
  transform: none;
  transition-duration: 0.9s;
}

/* Scale up */
[data-anim="zoom-in"] {
  transform: scale(0.88);
  transition-duration: 0.8s;
}

/* Slide up with slight scale */
[data-anim="rise"] {
  transform: translateY(60px) scale(0.97);
  transition-duration: 0.85s;
}

/* Gold line / divider expand */
[data-anim="line-expand"] {
  transform: scaleX(0);
  transform-origin: left center;
  transition-duration: 0.9s;
}

/* ---- Visible state (added by JS when in viewport) ---- */
[data-anim].anim-visible {
  opacity: 1;
  transform: none !important;
}

/* ---- Delay utilities ---- */
[data-delay="100"] { transition-delay: 0.1s; }
[data-delay="200"] { transition-delay: 0.2s; }
[data-delay="300"] { transition-delay: 0.3s; }
[data-delay="400"] { transition-delay: 0.4s; }
[data-delay="500"] { transition-delay: 0.5s; }
[data-delay="600"] { transition-delay: 0.6s; }
[data-delay="700"] { transition-delay: 0.7s; }
[data-delay="800"] { transition-delay: 0.8s; }

/* ---- Optional: stagger children automatically ---- */
/* Add class "anim-stagger" to a parent with data-anim children */
.anim-stagger > [data-anim]:nth-child(1) { transition-delay: 0.05s; }
.anim-stagger > [data-anim]:nth-child(2) { transition-delay: 0.15s; }
.anim-stagger > [data-anim]:nth-child(3) { transition-delay: 0.25s; }
.anim-stagger > [data-anim]:nth-child(4) { transition-delay: 0.35s; }
.anim-stagger > [data-anim]:nth-child(5) { transition-delay: 0.45s; }
.anim-stagger > [data-anim]:nth-child(6) { transition-delay: 0.55s; }

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