/* ─── Haft Scroll-Reveal Animation System ──────────────────────────────────
   Class-based IntersectionObserver reveals — no Webflow IX2 CDN dependency.
   JS (haft-scroll-animations.js) adds [data-haft-hidden] on load and
   [data-haft-visible] when the element scrolls into view.
   ──────────────────────────────────────────────────────────────────────── */

/* Respect user reduced-motion preference */
@media (prefers-reduced-motion: reduce) {
  [data-haft-hidden],
  [data-haft-hidden-left],
  [data-haft-hidden-right],
  [data-haft-hidden-scale] {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}

/* ── Base transition shared by all reveal variants ─────────────────────── */
[data-haft-hidden],
[data-haft-hidden-left],
[data-haft-hidden-right],
[data-haft-hidden-scale] {
  transition:
    opacity 0.62s cubic-bezier(0.22, 0.61, 0.36, 1),
    transform 0.62s cubic-bezier(0.22, 0.61, 0.36, 1);
}

/* ── Hidden states ─────────────────────────────────────────────────────── */
[data-haft-hidden] {
  opacity: 0;
  transform: translateY(28px);
}

[data-haft-hidden-left] {
  opacity: 0;
  transform: translateX(-38px);
}

[data-haft-hidden-right] {
  opacity: 0;
  transform: translateX(38px);
}

[data-haft-hidden-scale] {
  opacity: 0;
  transform: scale(0.93);
}

/* ── Revealed state (added by JS) ──────────────────────────────────────── */
[data-haft-visible] {
  opacity: 1 !important;
  transform: none !important;
}

/* ── Stagger helpers: JS sets --haft-stagger delay on child elements ───── */
[data-haft-stagger-child] {
  transition-delay: var(--haft-stagger, 0ms) !important;
}

/* ── Respect already-started CSS animations (haft-animations.css) ──────── */
/* Don't double-hide elements that are already handled by keyframe CSS       */
.banner-area [data-haft-hidden],
.banner-area [data-haft-hidden-left],
.banner-area [data-haft-hidden-right] {
  opacity: 1;
  transform: none;
}

/* ── About page ─────────────────────────────────────────────────────────── */

/* About intro section */
.about-section .about-area {
  /* handled by parent block reveal */
}

/* Mission section counters */
.mission-section .count-item:nth-child(1) { transition-delay: 0ms; }
.mission-section .count-item:nth-child(2) { transition-delay: 80ms; }
.mission-section .count-item:nth-child(3) { transition-delay: 160ms; }
.mission-section .count-item:nth-child(4) { transition-delay: 240ms; }

/* FAQ items */
.faq-section .faq-item:nth-child(1)  { transition-delay: 0ms;   }
.faq-section .faq-item:nth-child(2)  { transition-delay: 60ms;  }
.faq-section .faq-item:nth-child(3)  { transition-delay: 120ms; }
.faq-section .faq-item:nth-child(4)  { transition-delay: 180ms; }
.faq-section .faq-item:nth-child(5)  { transition-delay: 240ms; }
.faq-section .faq-item:nth-child(6)  { transition-delay: 300ms; }

/* Volunteer / team cards */
.volunteer-section .volunteer-item:nth-child(1),
.about-volunteer-section .volunteer-item:nth-child(1) { transition-delay: 0ms;   }
.volunteer-section .volunteer-item:nth-child(2),
.about-volunteer-section .volunteer-item:nth-child(2) { transition-delay: 80ms;  }
.volunteer-section .volunteer-item:nth-child(3),
.about-volunteer-section .volunteer-item:nth-child(3) { transition-delay: 160ms; }

/* Trust / partner logos */
.trust-section .trust-logo-area > *:nth-child(1) { transition-delay: 0ms;   }
.trust-section .trust-logo-area > *:nth-child(2) { transition-delay: 50ms;  }
.trust-section .trust-logo-area > *:nth-child(3) { transition-delay: 100ms; }
.trust-section .trust-logo-area > *:nth-child(4) { transition-delay: 150ms; }
.trust-section .trust-logo-area > *:nth-child(5) { transition-delay: 200ms; }
.trust-section .trust-logo-area > *:nth-child(6) { transition-delay: 250ms; }

/* Cause / fundraising cards */
.cases-area .cases-post-card:nth-child(1) { transition-delay: 0ms;   }
.cases-area .cases-post-card:nth-child(2) { transition-delay: 90ms;  }
.cases-area .cases-post-card:nth-child(3) { transition-delay: 180ms; }

/* Testimonial slider */
.testimonial-area {
  /* full block fade-in — slider already handles inner transitions */
}

/* Video CTA section */
.video-cta-section .video-cta-area {
  /* handled as a unit */
}

/* ── Homepage ───────────────────────────────────────────────────────────── */

/* Hero / banner — never hide, always visible */
.banner-area,
.banner-area .banner-title,
.banner-area .banner-sub-title,
.banner-area .primary-button,
.banner-area .secondary-button {
  opacity: 1 !important;
  transform: none !important;
}

/* Services / feature cards */
.service-area .service-item:nth-child(1) { transition-delay: 0ms;   }
.service-area .service-item:nth-child(2) { transition-delay: 80ms;  }
.service-area .service-item:nth-child(3) { transition-delay: 160ms; }
.service-area .service-item:nth-child(4) { transition-delay: 240ms; }

/* ── Blog / news cards ──────────────────────────────────────────────────── */
.blog-area .blog-post-item:nth-child(1) { transition-delay: 0ms;   }
.blog-area .blog-post-item:nth-child(2) { transition-delay: 80ms;  }
.blog-area .blog-post-item:nth-child(3) { transition-delay: 160ms; }

/* ── Event cards ────────────────────────────────────────────────────────── */
.event-item:nth-child(1) { transition-delay: 0ms;   }
.event-item:nth-child(2) { transition-delay: 80ms;  }
.event-item:nth-child(3) { transition-delay: 160ms; }

/* ── Donation / fundraising ─────────────────────────────────────────────── */
.haft-donation-tier-card:nth-child(1) { transition-delay: 0ms;   }
.haft-donation-tier-card:nth-child(2) { transition-delay: 60ms;  }
.haft-donation-tier-card:nth-child(3) { transition-delay: 120ms; }
.haft-donation-tier-card:nth-child(4) { transition-delay: 180ms; }

/* ── Utility: instant reveal (skip animation entirely) ──────────────────── */
.haft-no-anim,
.haft-no-anim * {
  transition: none !important;
  animation: none !important;
  opacity: 1 !important;
  transform: none !important;
}