/* ============================================================
 * animations.css — 关键帧与进入动画
 * 统一节奏：位移 12-24px、缓动 var(--ease-out)；减少动态时自动失效（见 reset.css）。
 * ============================================================ */
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(20px); }
  to   { opacity: 1; transform: none; }
}
@keyframes fogDrift {
  from { transform: translate3d(0, 0, 0) scale(1); }
  to   { transform: translate3d(4vw, 3vh, 0) scale(1.12); }
}
@keyframes hintPulse {
  0%, 100% { opacity: 0.3; transform: scaleY(0.6); }
  50%      { opacity: 1;   transform: scaleY(1); }
}
@keyframes breathe {
  0%, 100% { opacity: 0.85; }
  50%      { opacity: 1; }
}

/* 首屏分层进入（加载即播放，轻微错峰） */
.fade-up { opacity: 0; animation: fadeUp 0.9s var(--ease-out) forwards; }
.delay-1 { animation-delay: 0.08s; }
.delay-2 { animation-delay: 0.16s; }
.delay-3 { animation-delay: 0.24s; }
.delay-4 { animation-delay: 0.32s; }
.delay-5 { animation-delay: 0.40s; }
.delay-6 { animation-delay: 0.48s; }

/* 区块滚动进入（渐进增强：默认可见，JS 加载后做动画进入） */
[data-reveal] { opacity: 1; transform: none; }
/* 仅在 JS 成功初始化后才启用淡入动画（由 section-observer.js 添加 .reveal-animated 到 body 触发） */
body.reveal-ready [data-reveal]:not(.in-view) { opacity: 0; transform: translateY(24px); transition: opacity var(--t-slow) var(--ease-out), transform var(--t-slow) var(--ease-out); }
body.reveal-ready [data-reveal].in-view { opacity: 1; transform: none; }

.vinyl-glow { animation: breathe 7s ease-in-out infinite; }