/* ============================================================
   弥境 Mi Jing — Animations & Keyframes
   ============================================================ */

/* ---- Hero Progress Bar ---- */
@keyframes progress-tick {
  from { width: 0%; }
  to   { width: 100%; }
}

/* ---- Scroll Indicator Bounce ---- */
@keyframes scroll-bounce {
  0%, 100% { transform: translateX(-50%) translateY(0); }
  50%      { transform: translateX(-50%) translateY(8px); }
}

/* ---- Marquee Left ---- */
@keyframes marquee-left {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

/* ---- Marquee Right ---- */
@keyframes marquee-right {
  from { transform: translateX(-50%); }
  to   { transform: translateX(0); }
}

/* ---- Download Button Pulse ---- */
@keyframes download-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(232, 83, 46, 0.5); }
  50%      { box-shadow: 0 0 0 18px rgba(232, 83, 46, 0); }
}

/* ---- Hero Title Reveal ---- */
@keyframes title-reveal {
  from {
    opacity: 0;
    transform: translateY(30px);
    filter: blur(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
    filter: blur(0);
  }
}

/* ---- Float Animation (Visual Cards) ---- */
@keyframes float {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(-10px); }
}

.vc-front {
  animation: float 4s ease-in-out infinite;
}

/* ---- Glow Fade ---- */
@keyframes glow-fade {
  0%, 100% { opacity: 0.3; }
  50%      { opacity: 0.7; }
}

.hero-badge {
  animation: glow-fade 3s ease-in-out infinite;
}

/* ---- Score Ring Fill (triggered by JS) ---- */
.score-ring-progress {
  transition: stroke-dashoffset 2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* ---- Particle Float (hero canvas) ---- */
@keyframes particle-rise {
  from {
    opacity: 0.8;
    transform: translateY(0) scale(1);
  }
  to {
    opacity: 0;
    transform: translateY(-120px) scale(0);
  }
}

/* ---- Section Badge Flicker ---- */
@keyframes subtle-flicker {
  0%, 100% { border-color: rgba(var(--color-primary-rgb, 232, 83, 46), 0.3); }
  50%      { border-color: rgba(var(--color-primary-rgb, 232, 83, 46), 0.6); }
}

.section-badge {
  animation: subtle-flicker 4s ease-in-out infinite;
}

/* ---- Shimmer (for placeholder cards) ---- */
@keyframes shimmer {
  0%   { background-position: -200% 0; }
  100% { background-position: 200% 0; }
}

.sim-img-placeholder {
  background-size: 200% 100%;
  animation: shimmer 3s ease-in-out infinite;
}

/* ---- Reduced Motion ---- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  html { scroll-behavior: auto; }
}