/* 极夜群管官网 - 渐进动画增强
   1) hero 顶部对齐 + 封顶高度，首屏无大块空白
   2) 下滑时各 section 渐进淡入出现（淡入 + 小幅上移，无翻转、无吸附）
   该文件在主样式表之后加载，覆盖 .hero 与 .scroll-reveal 相关规则。 */

/* ---- 首屏：内容顶部对齐，消除上方空白；高度封顶避免大屏撑出空白 ---- */
.hero {
  min-height: min(calc(100vh - 74px), 640px);
  align-items: flex-start;
  background: #fff;
}

/* ---- 渐进淡入进入动画（淡入 + 小幅上移，无翻转） ---- */
.scroll-reveal {
  opacity: 0;
  transform: translateY(48px);
  transition:
    opacity 1.4s cubic-bezier(.2, .7, .2, 1),
    transform 1.4s cubic-bezier(.2, .7, .2, 1);
  will-change: opacity, transform;
}
.scroll-reveal.visible {
  opacity: 1;
  transform: translateY(0);
}

/* ---- 让 section 内主要区块错落进入，增强层次感 ---- */
.scroll-reveal .section-heading,
.scroll-reveal .advantage-grid,
.scroll-reveal .start-inner {
  opacity: 0;
  transform: translateY(28px);
  transition:
    opacity 1.2s cubic-bezier(.2, .7, .2, 1),
    transform 1.2s cubic-bezier(.2, .7, .2, 1);
}
.scroll-reveal.visible .section-heading { transition-delay: .2s; opacity: 1; transform: translateY(0); }
.scroll-reveal.visible .advantage-grid { transition-delay: .35s; opacity: 1; transform: translateY(0); }
.scroll-reveal.visible .start-inner { transition-delay: .3s; opacity: 1; transform: translateY(0); }

/* ---- 平板/中屏 ---- */
@media (width <= 1050px) {
  .hero { min-height: min(calc(100vh - 74px), 680px); }
}

/* ---- 移动端：单列内容已较高，封顶放宽，header 66px，上移幅度略减 ---- */
@media (width <= 760px) {
  .hero { min-height: min(calc(100vh - 66px), 760px); }
  .scroll-reveal {
    transform: translateY(36px);
  }
}

/* ---- 小屏 ---- */
@media (width <= 390px) {
  .scroll-reveal {
    transform: translateY(30px);
  }
}

/* ---- 尊重“减少动态”偏好 ---- */
@media (prefers-reduced-motion: reduce) {
  .scroll-reveal,
  .scroll-reveal .section-heading,
  .scroll-reveal .advantage-grid,
  .scroll-reveal .start-inner {
    transform: none;
    transition: opacity .4s ease;
  }
}