/* animations.css
   Layered on top of style.css, loaded after it.
   Only adds effects style.css doesn't already have:
   scroll reveal and count-up support. Hover states on
   .btn and .ledger-entry are left alone, style.css already
   handles those. Panel and stat-box hover are new here since
   style.css doesn't define hover for them yet. */

/* Scroll reveal */
.reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}
.reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* Hover lift for panels and stat boxes */
.panel,
.stat-box {
  transition: transform 0.25s ease, border-color 0.25s ease;
}
.panel:hover,
.stat-box:hover {
  transform: translateY(-3px);
  border-color: rgba(224, 151, 60, 0.5);
}

/* Count-up number container */
.count {
  display: inline-block;
  font-variant-numeric: tabular-nums;
}

/* Respect reduced motion. style.css already disables
   transitions globally here too, this resets the
   opacity/transform values reveal depends on. */
@media (prefers-reduced-motion: reduce) {
  .reveal {
    opacity: 1;
    transform: none;
    transition: none;
  }
  .panel:hover,
  .stat-box:hover {
    transform: none;
  }
}