/* ==========================================================================
   ClickEarn — Animations
   ========================================================================== */
@keyframes fadeInUp{ from{ opacity:0; transform:translateY(10px); } to{ opacity:1; transform:translateY(0); } }
@keyframes fadeIn{ from{ opacity:0; } to{ opacity:1; } }
@keyframes pulseRing{ 0%{ box-shadow:0 0 0 0 rgba(124,58,237,.35); } 70%{ box-shadow:0 0 0 10px rgba(124,58,237,0); } 100%{ box-shadow:0 0 0 0 rgba(124,58,237,0); } }
@keyframes spin{ to{ transform:rotate(360deg); } }
@keyframes shimmer{ 0%{ background-position:-400px 0; } 100%{ background-position:400px 0; } }

.animate-fade-up{ animation:fadeInUp .45s ease both; }
.animate-fade{ animation:fadeIn .35s ease both; }
.stagger > *{ animation:fadeInUp .45s ease both; }
.stagger > *:nth-child(1){ animation-delay:.02s; }
.stagger > *:nth-child(2){ animation-delay:.07s; }
.stagger > *:nth-child(3){ animation-delay:.12s; }
.stagger > *:nth-child(4){ animation-delay:.17s; }
.stagger > *:nth-child(5){ animation-delay:.22s; }
.stagger > *:nth-child(6){ animation-delay:.27s; }

.pulse-cta{ animation:pulseRing 2.2s infinite; }
.spin{ animation:spin 1s linear infinite; }

.skeleton{
  background:linear-gradient(90deg, #EFEDF7 25%, #F7F6FC 37%, #EFEDF7 63%);
  background-size:400px 100%;
  animation:shimmer 1.4s ease infinite;
  border-radius:8px;
}

@media (prefers-reduced-motion: reduce){
  *{ animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important; }
}