/* =============================================================
   外观层样式（modern 专属）
   原则：
     · 只增加"动效与视觉元素"，不改动 styles/tokens.css 的配色与间距。
     · 默认状态即为完整可见状态；只有 JS 明确武装（[data-reveal-armed]）后才进入动画起始态，
       因此禁用 JS、减弱动效、或静态截图时不会出现隐藏内容。
     · 所有装饰层 pointer-events:none，不参与布局尺寸计算。
   ============================================================= */



/* 经典外观不显示增强层元素。 */
html[data-appearance='classic'] .light-guide__beam,
html[data-appearance='classic'] .scroll-progress { display: none !important; }

/* 手机客户带：五个客户名称作为可见锚点，网络线仅作连续装饰。 */

@keyframes customer-network-flow {
  from { stroke-dashoffset: 0; }
  to { stroke-dashoffset: -38; }
}
@keyframes customer-network-pulse {
  0%, 100% { opacity: .24; transform: scale(.8); }
  50% { opacity: .72; transform: scale(1.22); }
}
@keyframes customer-network-satellite {
  0%, 100% { opacity: .4; transform: scale(.75); }
  50% { opacity: 1; transform: scale(1.35); }
}

/* ---------- 4. 光引导：极细光路流动线（仅表明"光在导引"，不暗示自动推进能力） ---------- */
@keyframes beam-travel {
  0% { background-position: -46% 0; opacity: 0; }
  18% { opacity: 1; }
  82% { opacity: 1; }
  100% { background-position: 146% 0; opacity: 0; }
}

/* ---------- 5. 入场淡入（仅在 JS 武装后生效） ---------- */
/* 位移做乘法收紧：区块与子项同时武装时不会累加成大幅位移 */
[data-reveal] { --reveal-distance: 12px; }
[data-reveal][data-reveal-armed] {
  opacity: 0;
  transform: translateY(calc(var(--reveal-distance) * .55));
  transition:
    opacity 420ms cubic-bezier(.22, .61, .36, 1) var(--reveal-delay, 0ms),
    transform 420ms cubic-bezier(.22, .61, .36, 1) var(--reveal-delay, 0ms);
}
[data-reveal][data-reveal-armed] > * {
  opacity: 0;
  transform: translateY(calc(var(--reveal-distance) * .45));
  transition:
    opacity 420ms cubic-bezier(.22, .61, .36, 1) var(--reveal-delay, 0ms),
    transform 420ms cubic-bezier(.22, .61, .36, 1) var(--reveal-delay, 0ms);
}
[data-reveal][data-reveal-armed].is-revealed {
  opacity: 1;
  transform: none;
}
[data-reveal][data-reveal-armed].is-revealed > * {
  opacity: 1;
  transform: none;
}

/* 章节标题 clip 揭示（对齐参考站 clip-path 标题层）：
   仅武装后从右向左露出；默认完整可见。减弱动效下不武装，规则不生效。 */
[data-reveal][data-reveal-armed] .section-head__title,
[data-reveal][data-reveal-armed] .home-proof__title {
  clip-path: inset(0 100% 0 0);
}
[data-reveal][data-reveal-armed].is-revealed .section-head__title,
[data-reveal][data-reveal-armed].is-revealed .home-proof__title {
  animation: title-clip-reveal 620ms cubic-bezier(.22, .61, .36, 1) both;
}
@keyframes title-clip-reveal {
  from { clip-path: inset(0 100% 0 0); }
  to { clip-path: inset(0 0 0 0); }
}

/* ---------- 6. 微交互：卡片轻抬升 + 媒体轻微放大（不做整卡缩放） ---------- */
.slot-card,

.media-figure .reference-media img {
  transition: transform 620ms cubic-bezier(.22, .61, .36, 1);
}
.media-figure:hover .reference-media img { transform: scale(1.012); }

.module-tab { position: relative; overflow: hidden; }
.module-tab::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: radial-gradient(circle at 50% 120%, color-mix(in srgb, var(--color-text) 6%, transparent), transparent 70%);
  opacity: 0;
  transition: opacity var(--motion-standard) var(--motion-ease);
  pointer-events: none;
}
.module-tab:hover::after { opacity: 1; }

/* 导航链接的下划线引导：苹果式细线，不改变高度 */
.site-nav__link { position: relative; }
.site-nav__link::after {
  content: '';
  position: absolute;
  left: 4px;
  right: 4px;
  bottom: 6px;
  height: 1px;
  background: currentColor;
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform var(--motion-standard) var(--motion-ease);
}
.site-nav__link:hover::after { transform: scaleX(1); }

/* ---------- 7. 滚动进度条 ---------- */
.scroll-progress {
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  height: 2px;
  z-index: 60;
  pointer-events: none;
  background: transparent;
}
.scroll-progress__bar {
  height: 100%;
  width: 100%;
  transform: scaleX(0);
  transform-origin: left center;
  background: color-mix(in srgb, var(--color-text) 22%, transparent);
}

/* ---------- 8. 经典外观：完全回到首批状态 ---------- */
html[data-appearance='classic'] .media-figure:hover .reference-media img { transform: none; }
html[data-appearance='classic'] .module-tab::after { display: none; }
html[data-appearance='classic'] .site-nav__link::after { display: none; }

/* ---------- 9. 减弱动效 ---------- */
@media (prefers-reduced-motion: reduce) {
  [data-reveal][data-reveal-armed],
  [data-reveal][data-reveal-armed] > * { opacity: 1; transform: none; }
  [data-reveal][data-reveal-armed] .section-head__title,
  [data-reveal][data-reveal-armed] .home-proof__title {
    clip-path: none;
    animation: none;
  }
  .scroll-progress__bar { animation: none; }
  .media-figure:hover .reference-media img { transform: none; }
}