/* Hero particle styles */
.hero-particles {
  position: absolute;
  inset: 0;
  pointer-events: none;
  overflow: hidden;
  z-index: 0;
}
.h-particle {
  position: absolute;
  border-radius: 50%;
  opacity: 0;
  animation: hpFloat linear infinite;
}
@keyframes hpFloat {
  0%   { transform: translateY(0) scale(0.8); opacity: 0; }
  10%  { opacity: 1; }
  90%  { opacity: 0.7; }
  100% { transform: translateY(-110vh) scale(1.2); opacity: 0; }
}
.hero-content { position: relative; z-index: 1; }

/* Hero slide-up animation */
@keyframes heroSlideUp {
  from { opacity: 0; transform: translateY(30px); }
  to   { opacity: 1; transform: translateY(0); }
}
.hero-anim { animation: heroSlideUp 0.7s cubic-bezier(0.22,1,0.36,1) both; }

/* Stat count-up entrance */
@keyframes statEntrance {
  from { opacity: 0; transform: translateY(30px) scale(0.9); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}
.stat-visible { animation: statEntrance 0.6s cubic-bezier(0.34,1.56,0.64,1) both; }

/* Card stagger entrance */
@keyframes cardSlideIn {
  from { opacity: 0; transform: translateY(40px) scale(0.95); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}
.card-anim { animation: cardSlideIn 0.5s cubic-bezier(0.34,1.56,0.64,1) both; }
body.dark .hero-section {
  background: #111010;
}

.hero {
  background: linear-gradient(160deg, #FDF8F0 0%, #F9EEF0 50%, #FDF5E8 100%);
  position: relative;