@charset "UTF-8";
/*!
 * animate.css (精简增强版) — 供 hciis 主题使用
 * 结构：基础工具类 → 滚动入场（默认可见）→ keyframes/动画类 → 无障碍降级
 */

/* ============================ 基础工具类 ============================ */
.animate__animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

.animate__animated.animate__infinite {
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}

.animate__animated.animate__delay-1s { -webkit-animation-delay: 0.2s; animation-delay: 0.2s; }
.animate__animated.animate__delay-2s { -webkit-animation-delay: 0.4s; animation-delay: 0.4s; }
.animate__animated.animate__delay-3s { -webkit-animation-delay: 0.6s; animation-delay: 0.6s; }
.animate__animated.animate__delay-4s { -webkit-animation-delay: 0.8s; animation-delay: 0.8s; }
.animate__animated.animate__delay-5s { -webkit-animation-delay: 1.0s; animation-delay: 1.0s; }

.animate__animated.animate__fast { -webkit-animation-duration: 0.6s; animation-duration: 0.6s; }
.animate__animated.animate__faster { -webkit-animation-duration: 0.4s; animation-duration: 0.4s; }
.animate__animated.animate__slow { -webkit-animation-duration: 1.4s; animation-duration: 1.4s; }
.animate__animated.animate__slower { -webkit-animation-duration: 2s; animation-duration: 2s; }

/* ============================ 滚动入场（渐进增强） ============================
 * 重要：.reveal 默认「可见」。隐藏态 .reveal-init 由 main.js 只加在视口外元素上，
 * 因此 JS 未执行、被拦截或报错时，页面内容依然完整可见。
 */
.reveal {
  /* 保持默认可见，不设置 opacity / visibility */
}
.reveal.is-visible {
  opacity: 1 !important;
  visibility: visible !important;
}
.reveal.reveal-init {
  opacity: 0;
  visibility: hidden;
  will-change: opacity, transform;
}
.reveal.reveal-init.is-visible {
  opacity: 1 !important;
  visibility: visible !important;
}

/* ============================ 淡入 ============================ */
@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}
.animate__fadeIn { -webkit-animation-name: fadeIn; animation-name: fadeIn; }

@keyframes fadeInUp {
  from { opacity: 0; -webkit-transform: translate3d(0, 40px, 0); transform: translate3d(0, 40px, 0); }
  to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
}
.animate__fadeInUp { -webkit-animation-name: fadeInUp; animation-name: fadeInUp; }

@keyframes fadeInDown {
  from { opacity: 0; -webkit-transform: translate3d(0, -40px, 0); transform: translate3d(0, -40px, 0); }
  to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
}
.animate__fadeInDown { -webkit-animation-name: fadeInDown; animation-name: fadeInDown; }

@keyframes fadeInLeft {
  from { opacity: 0; -webkit-transform: translate3d(-48px, 0, 0); transform: translate3d(-48px, 0, 0); }
  to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
}
.animate__fadeInLeft { -webkit-animation-name: fadeInLeft; animation-name: fadeInLeft; }

@keyframes fadeInRight {
  from { opacity: 0; -webkit-transform: translate3d(48px, 0, 0); transform: translate3d(48px, 0, 0); }
  to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
}
.animate__fadeInRight { -webkit-animation-name: fadeInRight; animation-name: fadeInRight; }

@keyframes fadeInUpBig {
  from { opacity: 0; -webkit-transform: translate3d(0, 120px, 0); transform: translate3d(0, 120px, 0); }
  to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
}
.animate__fadeInUpBig { -webkit-animation-name: fadeInUpBig; animation-name: fadeInUpBig; }

/* ============================ 缩放 ============================ */
@keyframes zoomIn {
  from { opacity: 0; -webkit-transform: scale3d(0.85, 0.85, 0.85); transform: scale3d(0.85, 0.85, 0.85); }
  50% { opacity: 1; }
  to { opacity: 1; -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); }
}
.animate__zoomIn { -webkit-animation-name: zoomIn; animation-name: zoomIn; }

@keyframes zoomInUp {
  from { opacity: 0; -webkit-transform: scale3d(0.9, 0.9, 0.9) translate3d(0, 40px, 0); transform: scale3d(0.9, 0.9, 0.9) translate3d(0, 40px, 0); }
  to { opacity: 1; -webkit-transform: scale3d(1, 1, 1) translate3d(0, 0, 0); transform: scale3d(1, 1, 1) translate3d(0, 0, 0); }
}
.animate__zoomInUp { -webkit-animation-name: zoomInUp; animation-name: zoomInUp; }

/* ============================ 滑入 ============================ */
@keyframes slideInUp {
  from { -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); visibility: visible; }
  to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
}
.animate__slideInUp { -webkit-animation-name: slideInUp; animation-name: slideInUp; }

@keyframes slideInLeft {
  from { -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); visibility: visible; }
  to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
}
.animate__slideInLeft { -webkit-animation-name: slideInLeft; animation-name: slideInLeft; }

@keyframes slideInRight {
  from { -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); visibility: visible; }
  to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
}
.animate__slideInRight { -webkit-animation-name: slideInRight; animation-name: slideInRight; }

/* ============================ 弹性 / 强调 ============================ */
@keyframes bounce {
  from, 20%, 53%, 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); -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
  40%, 43% { -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); -webkit-transform: translate3d(0, -24px, 0); transform: translate3d(0, -24px, 0); }
  70% { -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); -webkit-transform: translate3d(0, -12px, 0); transform: translate3d(0, -12px, 0); }
  90% { -webkit-transform: translate3d(0, -3px, 0); transform: translate3d(0, -3px, 0); }
}
.animate__bounce {
  -webkit-animation-name: bounce;
  animation-name: bounce;
  -webkit-transform-origin: center bottom;
  transform-origin: center bottom;
}

@keyframes pulse {
  from { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); }
  50% { -webkit-transform: scale3d(1.06, 1.06, 1.06); transform: scale3d(1.06, 1.06, 1.06); }
  to { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); }
}
.animate__pulse {
  -webkit-animation-name: pulse;
  animation-name: pulse;
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
}

@keyframes shakeY {
  from, to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
  10%, 30%, 50%, 70%, 90% { -webkit-transform: translate3d(0, -6px, 0); transform: translate3d(0, -6px, 0); }
  20%, 40%, 60%, 80% { -webkit-transform: translate3d(0, 6px, 0); transform: translate3d(0, 6px, 0); }
}
.animate__shakeY { -webkit-animation-name: shakeY; animation-name: shakeY; }

/* ============================ 自定义：悬浮 / 流光 / 旋转 ============================ */
@keyframes floatY {
  0%, 100% { -webkit-transform: translateY(0); transform: translateY(0); }
  50% { -webkit-transform: translateY(-12px); transform: translateY(-12px); }
}
.animate__float {
  -webkit-animation: floatY 3s ease-in-out infinite;
  animation: floatY 3s ease-in-out infinite;
}

@keyframes shine {
  0% { background-position: -220% 0; }
  100% { background-position: 220% 0; }
}
.animate__shine {
  background-size: 200% auto;
  -webkit-animation: shine 3.2s linear infinite;
  animation: shine 3.2s linear infinite;
}

@keyframes spinSlow {
  from { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
  to { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
}
.animate__spin {
  -webkit-animation: spinSlow 14s linear infinite;
  animation: spinSlow 14s linear infinite;
}

/* ============================ 无障碍降级（必须置于末尾） ============================ */
@media (prefers-reduced-motion: reduce) {
  .animate__animated,
  .reveal,
  .reveal.reveal-init {
    -webkit-animation: none !important;
    animation: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
  }
}


