/* 动效层：RotatingText 照搬自 clonerUI（cloudflare.com 逆向版），仅橙→青换色。
   无进场动画；JS 不运行时保持模板里的静态首词，绝不影响内容。 */

/* —— 噪点光带：200% 宽，translateX(-50%)→0 每 2s 循环 —— */
@keyframes rotating-text-noise-drift {
  from { transform: translateX(-50%); }
  to   { transform: translateX(0); }
}
.rt-noise-band {
  position: absolute; top: 0; bottom: 0; left: 0; width: 200%;
  animation: rotating-text-noise-drift 2s linear infinite;
  will-change: transform;
  /* 原版 NOISE_GRADIENT，暖橙 → 我们的青色系 */
  background-image:
    radial-gradient(55% 70% at 0% 28%, rgba(80,200,230,0.2), transparent 70%),
    radial-gradient(55% 70% at 100% 28%, rgba(80,200,230,0.2), transparent 70%),
    radial-gradient(55% 65% at 50% 72%, rgba(0,110,140,0.15), rgba(0,110,140,0.01) 70%),
    radial-gradient(40% 60% at 50% 45%, rgba(40,170,200,0.05), rgba(0,110,140,0.01) 75%);
  background-size: 50% 100%;
  background-repeat: repeat-x;
}

/* —— 逐词入场：blur(4px)+0.1em 上滑 → 清晰；38ms/词 交错 —— */
@keyframes rt-word-in {
  from { opacity: 0; filter: blur(4px); transform: translateY(0.1em); }
  to   { opacity: 1; filter: blur(0);   transform: translateY(0); }
}
.rt-word {
  position: relative; z-index: 2; display: inline-block; flex-shrink: 0; white-space: nowrap;
  animation: rt-word-in 280ms cubic-bezier(0.25, 0.1, 0.25, 1) both;
  animation-delay: calc(var(--word-i, 0) * 38ms);
}
.rt-space { position: relative; z-index: 2; display: inline-block; flex-shrink: 0; white-space: pre; }

/* —— 胶囊与两层叠加（结构与原版 DOM 一致）—— */
.rt-pill {
  position: relative; display: inline-flex; align-items: baseline;
  overflow: hidden; border-radius: 5px; vertical-align: baseline;
}
.rt-bg {
  pointer-events: none; position: absolute; inset: 0; isolation: isolate;
  border-radius: 5px; mix-blend-mode: color-dodge;
}
.rt-noise {
  pointer-events: none; position: absolute; inset: 0; overflow: hidden;
  border-radius: 5px; mix-blend-mode: plus-darker;
}
.rt-sizer {
  pointer-events: none; position: absolute; top: 0; left: 0; z-index: -10;
  opacity: 0; white-space: nowrap; padding: 0.1em 0.22em;
}

/* —— 环境微效（非进场）—— */
.prod-cover img { transition: transform .5s cubic-bezier(.4,0,.2,1); }
.prod-card:hover .prod-cover img { transform: scale(1.05); }
@keyframes dot-breathe {
  0%, 100% { opacity: 1; }
  50%      { opacity: .45; }
}
.dot-breathe { animation: dot-breathe 2.4s ease-in-out infinite; }

/* —— 系统级兜底 —— */
@media (prefers-reduced-motion: reduce) {
  .rt-noise-band { animation: none; }
  .rt-word { animation: none; opacity: 1; filter: none; transform: none; }
  .prod-cover img { transition: none; }
  .dot-breathe { animation: none; }
}