/* ================================================================
   SSSP Parishad — Shared Animations Library  (sssp-animations.css)
   Applied globally across all pages
   ================================================================ */

/* ── Page reveal on scroll ────────────────────────────────────── */
@keyframes fadeUp {
  from { opacity:0; transform:translateY(24px); }
  to   { opacity:1; transform:none; }
}
@keyframes fadeIn {
  from { opacity:0; }
  to   { opacity:1; }
}
@keyframes scaleIn {
  from { opacity:0; transform:scale(0.92); }
  to   { opacity:1; transform:scale(1); }
}

/* ── Icon animations ──────────────────────────────────────────── */
@keyframes iconPopIn {
  0%   { transform:scale(0.5) rotate(-10deg); }
  60%  { transform:scale(1.18) rotate(4deg); }
  80%  { transform:scale(0.95) rotate(-2deg); }
  100% { transform:scale(1) rotate(0deg); }
}
@keyframes iconFloat {
  0%,100% { transform:translateY(0); }
  50%      { transform:translateY(-5px); }
}
@keyframes iconSpin {
  from { transform:rotate(0deg); }
  to   { transform:rotate(360deg); }
}
@keyframes iconPulse {
  0%,100% { transform:scale(1); }
  50%      { transform:scale(1.15); }
}

/* ── Social icon animations (same as homepage) ────────────────── */
@keyframes socRingIn   { to { opacity:1; transform:scale(1); } }
@keyframes socSquareIn { to { opacity:1; transform:rotate(0deg) scale(1); } }
@keyframes socIconIn   { to { opacity:1; transform:scale(1); } }

/* ── Background section animations ───────────────────────────── */
@keyframes bgKenBurns {
  from { transform:scale(1); }
  to   { transform:scale(1.08); }
}
@keyframes bgDrift {
  0%   { transform:scale(1)    translateX(0); }
  50%  { transform:scale(1.06) translateX(-1.5%); }
  100% { transform:scale(1.10) translateX(1.5%); }
}

/* ── Card hover lifts ─────────────────────────────────────────── */
.sssp-card-hover {
  transition:transform 0.28s cubic-bezier(0.34,1.56,0.64,1),
             box-shadow 0.28s ease;
}
.sssp-card-hover:hover {
  transform:translateY(-6px);
  box-shadow:0 18px 40px rgba(26,18,9,0.14);
}

/* ── Reveal on scroll (class toggled by JS) ───────────────────── */
.sssp-reveal {
  opacity:0;
  transform:translateY(22px);
  transition:opacity 0.6s ease, transform 0.6s ease;
}
.sssp-reveal.visible {
  opacity:1;
  transform:none;
}
.sssp-reveal-scale {
  opacity:0;
  transform:scale(0.94);
  transition:opacity 0.5s ease, transform 0.5s ease;
}
.sssp-reveal-scale.visible {
  opacity:1;
  transform:scale(1);
}

/* ── Icon pop-in when in view ─────────────────────────────────── */
.sssp-ico { display:inline-block; }
.sssp-ico.ico-anim {
  animation:iconPopIn 0.55s cubic-bezier(0.34,1.56,0.64,1) both;
}
.sssp-ico-wrap:hover .sssp-ico {
  animation:iconFloat 1.6s ease-in-out infinite;
}

/* ── Section icon boxes ───────────────────────────────────────── */
.sssp-icon-box {
  transition:transform 0.25s cubic-bezier(0.34,1.56,0.64,1),
             box-shadow 0.25s ease;
}
.sssp-icon-box.ico-anim {
  animation:iconPopIn 0.55s cubic-bezier(0.34,1.56,0.64,1) both;
}
.sssp-icon-box:hover, *:hover > .sssp-icon-box {
  transform:scale(1.18) rotate(-6deg);
  box-shadow:0 6px 20px rgba(139,26,26,0.3);
}

/* ── Progress / stat counters ─────────────────────────────────── */
@keyframes countPop {
  0%   { transform:scale(1); }
  40%  { transform:scale(1.12); }
  100% { transform:scale(1); }
}
.stat-num.counting { animation:countPop 0.4s ease; }

/* ── Loader ───────────────────────────────────────────────────── */
@keyframes spin { to { transform:rotate(360deg); } }

/* ── Button ripple ────────────────────────────────────────────── */
.sssp-btn {
  position:relative; overflow:hidden;
  transition:transform 0.2s, box-shadow 0.2s;
}
.sssp-btn:hover  { transform:translateY(-2px); box-shadow:0 8px 24px rgba(139,26,26,0.3); }
.sssp-btn:active { transform:translateY(0); }
.sssp-btn::after {
  content:'';
  position:absolute; inset:0;
  background:rgba(255,255,255,0.15);
  opacity:0; border-radius:inherit;
  transition:opacity 0.3s;
}
.sssp-btn:hover::after { opacity:1; }

/* ── Tab / pill active indicator ─────────────────────────────── */
@keyframes tabSlide {
  from { transform:scaleX(0); }
  to   { transform:scaleX(1); }
}

/* ── Hero text stagger ────────────────────────────────────────── */
.hero-stagger > *:nth-child(1) { animation-delay:0s; }
.hero-stagger > *:nth-child(2) { animation-delay:0.1s; }
.hero-stagger > *:nth-child(3) { animation-delay:0.2s; }
.hero-stagger > *:nth-child(4) { animation-delay:0.3s; }

/* ── Responsive tweaks ────────────────────────────────────────── */
@media (prefers-reduced-motion:reduce) {
  *, *::before, *::after {
    animation-duration:0.01ms !important;
    transition-duration:0.01ms !important;
  }
}
