@keyframes stats-bar-rise {
  from {
    transform: scaleY(0);
    transform-origin: bottom;
    opacity: 0;
  }
  to {
    transform: scaleY(1);
    transform-origin: bottom;
    opacity: 1;
  }
}

@keyframes stats-fade-up {
  from {
    opacity: 0;
    transform: translateY(12px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.stats-animate .stats-bar {
  animation: stats-bar-rise 0.7s ease-out forwards;
}

.stats-animate .stats-fade {
  animation: stats-fade-up 0.55s ease-out forwards;
}

.stats-bar:nth-child(1) {
  animation-delay: 0.05s;
}
.stats-bar:nth-child(2) {
  animation-delay: 0.15s;
}
.stats-bar:nth-child(3) {
  animation-delay: 0.25s;
}
.stats-bar:nth-child(4) {
  animation-delay: 0.35s;
}

.stats-fade-delay-1 {
  animation-delay: 0.1s;
  opacity: 0;
}
.stats-fade-delay-2 {
  animation-delay: 0.2s;
  opacity: 0;
}
.stats-fade-delay-3 {
  animation-delay: 0.3s;
  opacity: 0;
}

.stats-animate .stats-fade-delay-1,
.stats-animate .stats-fade-delay-2,
.stats-animate .stats-fade-delay-3 {
  animation-fill-mode: forwards;
}

@media (prefers-reduced-motion: reduce) {
  .stats-animate .stats-bar,
  .stats-animate .stats-fade,
  .stats-animate .stats-fade-delay-1,
  .stats-animate .stats-fade-delay-2,
  .stats-animate .stats-fade-delay-3 {
    animation: none;
    opacity: 1;
    transform: none;
  }
}