/* assets/css/components/reveal.css — 滚动显现：全站唯一一套。
   原站有四套互不兼容的实现（站点级 + 三个页面内联），时长与缓动各不相同；
   这里收敛成一套，方向与错峰都由 data-* 控制，参数写在 HTML 上而不是散在 CSS 里。

   动画一律包在 no-preference 里（"允许动效时才开"）：reduce 环境下元素本来就在
   最终位置，不需要 JS 补类，也不会出现"内容永远不显示"的降级事故。 */

@media (prefers-reduced-motion: no-preference){
  [data-reveal]{ opacity:0; transition:opacity .6s ease, transform .6s ease; transform:translateY(18px); }
  [data-reveal][data-direction="down"]{ transform:translateY(-18px); }
  [data-reveal][data-direction="left"]{ transform:translateX(-22px); }
  [data-reveal][data-direction="right"]{ transform:translateX(22px); }
  [data-reveal][data-direction="none"]{ transform:none; }
  [data-reveal].is-inview{ opacity:1; transform:none; }

  /* 子项错峰：父级标 data-reveal-stagger，子项自动依次进场（最多 8 项） */
  [data-reveal-stagger] > *{ opacity:0; transform:translateY(16px); transition:opacity .55s ease, transform .55s ease; }
  [data-reveal-stagger].is-inview > *{ opacity:1; transform:none; }
  [data-reveal-stagger].is-inview > *:nth-child(1){ transition-delay:.02s; }
  [data-reveal-stagger].is-inview > *:nth-child(2){ transition-delay:.08s; }
  [data-reveal-stagger].is-inview > *:nth-child(3){ transition-delay:.14s; }
  [data-reveal-stagger].is-inview > *:nth-child(4){ transition-delay:.20s; }
  [data-reveal-stagger].is-inview > *:nth-child(5){ transition-delay:.26s; }
  [data-reveal-stagger].is-inview > *:nth-child(6){ transition-delay:.32s; }
  [data-reveal-stagger].is-inview > *:nth-child(n+7){ transition-delay:.38s; }
}
