/* ==========================================================================
   Nice PageBuilder — Frontend Animations
   Triggered by IntersectionObserver in animations.js
   ========================================================================== */

/* ── Base state (hidden, ready to animate) ──────────────────────────────── */
[class*="nice-anim--"] {
  --npb-anim-transform: none;
  opacity: 0;
  will-change: opacity, transform;
  transition: opacity .6s ease, transform .6s ease;
  transform: var(--npb-anim-transform);
}

/* ── Animated state (JS adds .is-animated) ──────────────────────────────── */
[class*="nice-anim--"].is-animated {
  opacity: 1;
  transform: none;
}

/* ── Fade from below ────────────────────────────────────────────────────── */
.nice-anim--fade-up {
  --npb-anim-transform: translateY(30px);
}

/* ── Fade from above ────────────────────────────────────────────────────── */
.nice-anim--fade-down {
  --npb-anim-transform: translateY(-30px);
}

/* ── Fade from right (element enters from right, slides left) ───────────── */
.nice-anim--fade-left {
  --npb-anim-transform: translateX(30px);
}

/* ── Fade from left (element enters from left, slides right) ────────────── */
.nice-anim--fade-right {
  --npb-anim-transform: translateX(-30px);
}

/* ── Fade from center ───────────────────────────────────────────────────── */
.nice-anim--fade-center {
  --npb-anim-transform: scale(.94);
}

/* ── Stagger children ───────────────────────────────────────────────────── */
/* Layout containers use the wrapper as trigger and animate children in cascade */
[data-anim-stagger] {
  opacity: 1;
  transform: none;
  transition: none;
}

[data-anim-stagger].nice-pb-section:not(.nice-pb-section--full-width)>.nice__container>*,
[data-anim-stagger].nice-pb-section.nice-pb-section--full-width>*,
[data-anim-stagger].nice-pb-grid-row>*,
[data-anim-stagger].nice-pb-col>* {
  opacity: 0;
  transform: var(--npb-anim-transform);
  will-change: opacity, transform;
  transition: opacity .6s ease, transform .6s ease;
}

[data-anim-stagger].is-animated.nice-pb-section:not(.nice-pb-section--full-width)>.nice__container>*,
[data-anim-stagger].is-animated.nice-pb-section.nice-pb-section--full-width>*,
[data-anim-stagger].is-animated.nice-pb-grid-row>*,
[data-anim-stagger].is-animated.nice-pb-col>* {
  opacity: 1;
  transform: none;
}

[data-anim-stagger].nice-pb-section:not(.nice-pb-section--full-width)>.nice__container>*,
[data-anim-stagger].nice-pb-section.nice-pb-section--full-width>*,
[data-anim-stagger].nice-pb-grid-row>*,
[data-anim-stagger].nice-pb-col>* {
  transition-delay: 0s;
}

[data-anim-stagger].nice-pb-section:not(.nice-pb-section--full-width)>.nice__container>*:nth-child(2),
[data-anim-stagger].nice-pb-section.nice-pb-section--full-width>*:nth-child(2),
[data-anim-stagger].nice-pb-grid-row>*:nth-child(2),
[data-anim-stagger].nice-pb-col>*:nth-child(2) {
  transition-delay: .1s;
}

[data-anim-stagger].nice-pb-section:not(.nice-pb-section--full-width)>.nice__container>*:nth-child(3),
[data-anim-stagger].nice-pb-section.nice-pb-section--full-width>*:nth-child(3),
[data-anim-stagger].nice-pb-grid-row>*:nth-child(3),
[data-anim-stagger].nice-pb-col>*:nth-child(3) {
  transition-delay: .2s;
}

[data-anim-stagger].nice-pb-section:not(.nice-pb-section--full-width)>.nice__container>*:nth-child(4),
[data-anim-stagger].nice-pb-section.nice-pb-section--full-width>*:nth-child(4),
[data-anim-stagger].nice-pb-grid-row>*:nth-child(4),
[data-anim-stagger].nice-pb-col>*:nth-child(4) {
  transition-delay: .3s;
}

[data-anim-stagger].nice-pb-section:not(.nice-pb-section--full-width)>.nice__container>*:nth-child(5),
[data-anim-stagger].nice-pb-section.nice-pb-section--full-width>*:nth-child(5),
[data-anim-stagger].nice-pb-grid-row>*:nth-child(5),
[data-anim-stagger].nice-pb-col>*:nth-child(5) {
  transition-delay: .4s;
}

[data-anim-stagger].nice-pb-section:not(.nice-pb-section--full-width)>.nice__container>*:nth-child(6),
[data-anim-stagger].nice-pb-section.nice-pb-section--full-width>*:nth-child(6),
[data-anim-stagger].nice-pb-grid-row>*:nth-child(6),
[data-anim-stagger].nice-pb-col>*:nth-child(6) {
  transition-delay: .5s;
}

/* ── Reduced motion ─────────────────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  [class*="nice-anim--"] {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}