/* ============================================================
 * anim-lite.css —— animate.css(76KB) 的轻量替代（约 2KB）
 * ------------------------------------------------------------
 * 背景：全站 18 个页面通过 new WOW().init() 触发滚动进场动画，
 *       但模板中实际只用到 5 个动画（扫描全部 pc 模板 197 个 .wow
 *       元素的 class 组合得出）：
 *         fadeInUp(约 95 处) / fadeInRight(8) / fadeInLeft(3)
 *         fadeIn(1) / bounceIn(1)
 *       其余 animate.css 中的 70+ 个动画从未被使用，故不搬运。
 *
 * 关键：关键帧与 .animated / .bounceIn 的时长、缓动、fill-mode
 *       全部逐字对照原 animate.min.css 复刻（含原文件中
 *       "to 帧仅写 opacity、transform 被注释掉" 这一细节），
 *       保证 PC 端视觉与原来完全一致。
 *
 * 配套：static/js/anim-lite.js（IntersectionObserver + WOW 垫片）
 * 影响隔离：新建独立文件，未改动 style.css / index.css 等共用样式。
 * ============================================================ */

/* 基础类：与原 animate.css 的 .animated 完全一致 */
.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

/* ---------- fadeIn ---------- */
@-webkit-keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}
@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}
.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
}

/* ---------- fadeInUp ----------
   注意：to 帧只写 opacity，不写 transform —— 与原 animate.min.css
   保持一致（原文件该行被注释）。动画结束后 transform 回落到元素
   自身的基础值，若元素另有 hover/CSS transform 不会被覆盖。 */
@-webkit-keyframes fadeInUp {
  from { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); }
  to { opacity: 1; }
}
@keyframes fadeInUp {
  from { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); }
  to { opacity: 1; }
}
.fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}

/* ---------- fadeInLeft ---------- */
@-webkit-keyframes fadeInLeft {
  from { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); }
  to { opacity: 1; }
}
@keyframes fadeInLeft {
  from { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); }
  to { opacity: 1; }
}
.fadeInLeft {
  -webkit-animation-name: fadeInLeft;
  animation-name: fadeInLeft;
}

/* ---------- fadeInRight ---------- */
@-webkit-keyframes fadeInRight {
  from { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); }
  to { opacity: 1; }
}
@keyframes fadeInRight {
  from { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); }
  to { opacity: 1; }
}
.fadeInRight {
  -webkit-animation-name: fadeInRight;
  animation-name: fadeInRight;
}

/* ---------- bounceIn（0.75s，与原文件一致） ---------- */
@-webkit-keyframes bounceIn {
  from, 20%, 40%, 60%, 80%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  0% { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); }
  20% { -webkit-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); }
  40% { -webkit-transform: scale3d(0.9, 0.9, 0.9); transform: scale3d(0.9, 0.9, 0.9); }
  60% { opacity: 1; -webkit-transform: scale3d(1.03, 1.03, 1.03); transform: scale3d(1.03, 1.03, 1.03); }
  80% { -webkit-transform: scale3d(0.97, 0.97, 0.97); transform: scale3d(0.97, 0.97, 0.97); }
  to { opacity: 1; -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); }
}
@keyframes bounceIn {
  from, 20%, 40%, 60%, 80%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  0% { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); }
  20% { -webkit-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); }
  40% { -webkit-transform: scale3d(0.9, 0.9, 0.9); transform: scale3d(0.9, 0.9, 0.9); }
  60% { opacity: 1; -webkit-transform: scale3d(1.03, 1.03, 1.03); transform: scale3d(1.03, 1.03, 1.03); }
  80% { -webkit-transform: scale3d(0.97, 0.97, 0.97); transform: scale3d(0.97, 0.97, 0.97); }
  to { opacity: 1; -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); }
}
.bounceIn {
  -webkit-animation-duration: 0.75s;
  animation-duration: 0.75s;
  -webkit-animation-name: bounceIn;
  animation-name: bounceIn;
}

/* ---------- 无障碍：尊重系统「减少动态效果」偏好 ----------
   开启后所有进场动画立即完成（不做位移/缩放），元素直接可见。
   JS 侧同样会跳过隐藏逻辑，双保险避免内容不可见。 */
@media (prefers-reduced-motion: reduce) {
  .animated,
  .fadeIn,
  .fadeInUp,
  .fadeInLeft,
  .fadeInRight,
  .bounceIn {
    -webkit-animation: none !important;
    animation: none !important;
    -webkit-transition: none !important;
    transition: none !important;
    opacity: 1 !important;
    -webkit-transform: none !important;
    transform: none !important;
    visibility: visible !important;
  }
}