/* ============================================================
   Kanwar Infra — Animations
   ============================================================ */

/* ── Keyframes ── */
@keyframes ki-fadeUp {
  from { opacity: 0; transform: translateY(32px); }
  to   { opacity: 1; transform: translateY(0); }
}

@keyframes ki-fadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}

@keyframes ki-slideRight {
  from { opacity: 0; transform: translateX(-24px); }
  to   { opacity: 1; transform: translateX(0); }
}

@keyframes ki-slideLeft {
  from { opacity: 0; transform: translateX(24px); }
  to   { opacity: 1; transform: translateX(0); }
}

@keyframes ki-pulse {
  0%, 100% { transform: scale(1); opacity: 1; }
  50%       { transform: scale(1.12); opacity: .7; }
}

@keyframes ki-float {
  0%, 100% { transform: translateY(0); }
  50%       { transform: translateY(-10px); }
}

@keyframes ki-spin-slow {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}

@keyframes ki-shimmer {
  0%   { background-position: -400px 0; }
  100% { background-position:  400px 0; }
}

/* ── Hero entrance sequence ── */
.ki-fade-1 { opacity: 0; animation: ki-fadeUp .5s ease .1s forwards; }
.ki-fade-2 { opacity: 0; animation: ki-fadeUp .6s ease .25s forwards; }
.ki-fade-3 { opacity: 0; animation: ki-fadeUp .6s ease .4s forwards; }
.ki-fade-4 { opacity: 0; animation: ki-fadeUp .6s ease .55s forwards; }
.ki-fade-5 { opacity: 0; animation: ki-fadeUp .6s ease .7s forwards; }

.ki-slide-right-1 { opacity: 0; animation: ki-slideRight .6s ease .1s forwards; }
.ki-slide-right-2 { opacity: 0; animation: ki-slideRight .6s ease .25s forwards; }
.ki-slide-right-3 { opacity: 0; animation: ki-slideRight .6s ease .4s forwards; }

.ki-slide-left-1 { opacity: 0; animation: ki-slideLeft .6s ease .2s forwards; }

/* ── Utility animation classes ── */
.ki-float   { animation: ki-float 4s ease-in-out infinite; }
.ki-pulse   { animation: ki-pulse 2s ease-in-out infinite; }
.ki-spin    { animation: ki-spin-slow 10s linear infinite; }

/* ── Skeleton shimmer ── */
.ki-skeleton {
  background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
  background-size: 400px 100%;
  animation: ki-shimmer 1.4s infinite linear;
  border-radius: 6px;
}

/* ── Counter number color accent ── */
.ki-stat__number { color: var(--ki-accent); }

/* ── Hover lift (for cards that need it via utility) ── */
.ki-hover-lift {
  transition: transform .3s ease, box-shadow .3s ease;
}
.ki-hover-lift:hover {
  transform: translateY(-6px);
  box-shadow: 0 20px 40px rgba(0,0,0,.08);
}

/* ── Line accent grow ── */
.ki-line-grow {
  position: relative;
}
.ki-line-grow::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0;
  width: 0; height: 2px;
  background: var(--ki-accent);
  transition: width .3s ease;
}
.ki-line-grow:hover::after { width: 100%; }

/* ── Reduced motion ── */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}