/* ============================================
   滚动 / 入场淡入（reveal）— 2026-10-12
   ------------------------------------------------------------
   工作方式：
   1. header.php 里有一段极小的内联脚本，在**首屏绘制之前**给 <html> 加上 .rv-on。
      → CSS 立刻把「顶层区块」设为透明+下移，浏览器从第一帧起就看不到它们，
        所以不会出现「先看到内容 → 消失 → 再淡入」的闪烁。
      → 没有 .rv-on 时（禁用 JS / 老浏览器 / 开了「减少动态效果」），
        下面所有隐藏规则一律不生效，页面照常显示，什么都不丢。
   2. reveal.js 给元素加 .rv-shown / .rv-item-in → 播放入场动画。
      · 首屏内的元素：DOM 就绪后立刻加 → 就是「进页面文字从下方升起」
      · 首屏之外的元素：滚动进入视口时加 → 就是「往下滑，新内容依次升起」
   3. 动画结束 transform 归零（.rv-shown 是 transform:none）。
      否则 transform 会给子元素造 containing block，
      破坏 position:fixed 的右侧浮层 .rightNav1。

   ⚠️ 改这里的三个选择器时，要同步改 reveal.js 顶部的 EXCLUDE / CONTENT_ONLY，
      两边必须一一对应，否则会出现「藏了没人显示」或「该藏的没藏」。
   ============================================ */

/* ---------- ① 顶层区块：从第一帧起就隐藏（仅当内联脚本打了 .rv-on） ----------
   ⚠️ 结尾的 :not(.rv-shown) 不能省：加上它之后，元素一旦拿到 .rv-shown，
   这条规则就**完全不匹配**了，不需要跟它比权重（否则它的权重 (0,3,5) 比
   `.rv-shown` 的 (0,2,2) 还高，会出现「加了类也不显示」的坑）。
   .banner / .statsBar / footer / .ind-hero 见下面 ② —— 它们属于「背景不动、只动内容」的区块。
   .ind-tsteps（3D 打印技术·视差滚动步骤）自带钉住 + 切换动画，且靠 position:sticky 工作
   —— 顶层若被加 transform 会影响它的定位，所以整块排除（详见 industry.css 第 14 节）。 */
html.rv-on body > *:not(header):not(.rBox):not(script):not(.blackCover):not(.banner):not(.statsBar):not(footer):not(.ind-hero):not(.ind-tsteps):not(.rv-shown) {
    opacity: 0;
    transform: translate3d(0, 32px, 0);
}

/* 显示态（--rv-delay 由 JS 按顺序给，用于错峰） */
html.rv-on body > *.rv-shown {
    opacity: 1;
    transform: none;
    transition: opacity .75s cubic-bezier(.22, .61, .36, 1),
                transform .75s cubic-bezier(.22, .61, .36, 1);
    transition-delay: var(--rv-delay, 0s);
}

/* ---------- ② 「背景不动、只动内容」的区块 ----------
   深色底/图片底的整块区域，整块淡入会显得像「背景突然出现」，所以：
   底色/背景图保持原样，只让里面的内容升起。
   · .banner     —— 首页/宣传页轮播：背景图 + 深色遮罩不动，只让 .coverBox 里的文案升起
   · .statsBar   —— 首页服务数据条：深色底(#11131e)不动，只让 .statsList 的 4 项升起
                    （数字另有 index.js 的滚动计数动画，两者互不干扰）
   · footer      —— 全站页脚：深色底(#171b24)不动，只让 .main 里的内容升起
   · .ind-hero   —— 内页 Hero：背景图不动，只让 .ind-hero-main（标题/副标题/描述/列表/按钮）
                    与 .ind-hero-cards（右侧图卡）依次升起
   新增这类区块时，这里两条规则各加选择器，并同步 reveal.js 的 CONTENT_ONLY。 */
html.rv-on .banner .coverBox > *:not(.rv-shown),
html.rv-on .statsBar .statsList > *:not(.rv-shown),
html.rv-on footer .main > *:not(.rv-shown),
html.rv-on .ind-hero .ind-hero-main > *:not(.rv-shown),
html.rv-on .ind-hero .ind-hero-cards > *:not(.rv-shown) {
    opacity: 0;
    transform: translate3d(0, 26px, 0);
}
html.rv-on .banner .coverBox > *.rv-shown,
html.rv-on .statsBar .statsList > *.rv-shown,
html.rv-on footer .main > *.rv-shown,
html.rv-on .ind-hero .ind-hero-main > *.rv-shown,
html.rv-on .ind-hero .ind-hero-cards > *.rv-shown {
    opacity: 1;
    transform: none;
    transition: opacity .7s cubic-bezier(.22, .61, .36, 1),
                transform .7s cubic-bezier(.22, .61, .36, 1);
    transition-delay: var(--rv-delay, 0s);
}

/* ---------- ③ 卡片 / 列表项：错峰淡入 ----------
   隐藏态由 reveal.js 在 DOM 就绪时添加。此时它们所在的区块本来就是隐藏的，
   所以这一步不会造成任何可见闪烁。 */
.rv-item {
    opacity: 0;
    transform: translate3d(0, 22px, 0);
}
.rv-item.rv-item-in {
    opacity: 1;
    transform: none;
    transition: opacity .6s cubic-bezier(.22, .61, .36, 1),
                transform .6s cubic-bezier(.22, .61, .36, 1);
    transition-delay: var(--rv-delay, 0s);
}

/* ---------- 兜底：系统开启「减少动态效果」时，任何情况下都不隐藏 ---------- */
@media (prefers-reduced-motion: reduce) {
    html.rv-on body > *,
    html.rv-on .banner .coverBox > *,
    html.rv-on .statsBar .statsList > *,
    html.rv-on footer .main > *,
    html.rv-on .ind-hero .ind-hero-main > *,
    html.rv-on .ind-hero .ind-hero-cards > *,
    .rv-item {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
        transition-delay: 0s !important;
    }
}