/* =========================================================
   明璟AI 官网 v2 · 高级交互增强层（独立、可整体删除回退）
   - 指针涟漪 / 卡片 3D 微倾斜 / 触摸按压 / 顶部滚动进度
   - 零依赖、零外链；只用 Pointer Events，鼠标+触摸+触控笔统一
   ========================================================= */

/* 顶部阅读进度条 */
.mj-progress {
  position: fixed; top: 0; left: 0; height: 3px; width: 0;
  z-index: 300;
  background: linear-gradient(92deg, var(--teal), var(--blue));
  box-shadow: 0 0 12px rgba(55, 230, 214, 0.7);
  pointer-events: none;
}

/* 涟漪圆点（JS 注入） */
.mj-ripple {
  position: absolute; border-radius: 50%; transform: scale(0);
  background: radial-gradient(circle, rgba(55, 230, 214, 0.55), rgba(55, 230, 214, 0.25) 60%, transparent 70%);
  pointer-events: none;
  animation: mj-ripple-anim 0.62s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}
@keyframes mj-ripple-anim {
  to { transform: scale(2.4); opacity: 0; }
}

/* 需要涟漪/倾斜的元素：确保定位与裁切正确（不改变视觉外观） */
.btn,
.b-card,
.work-card,
.pipe-node,
.pipe-mid .pm,
.faq-item,
.stat-cell,
.dl-feat { position: relative; }

/* 卡片 3D 倾斜容器由 JS 设置 transform，这里只补透视与平滑 */
.mj-tilt {
  transform-style: preserve-3d;
  transition: transform 0.18s ease-out, border-color .3s ease, box-shadow .3s ease;
  will-change: transform;
}
.mj-tilt .b-ico,
.mj-tilt .play { transform: translateZ(26px); }

/* 按压反馈（鼠标 + 触摸统一） */
.mj-press { transition: transform .14s cubic-bezier(0.22,1,0.36,1); }
.mj-press.mj-down { transform: scale(0.965); }

/* 倾斜时的光泽跟随层 */
.mj-sheen {
  position: absolute; inset: 0; border-radius: inherit;
  pointer-events: none; opacity: 0;
  background: radial-gradient(320px circle at var(--mx, 50%) var(--my, 50%),
    rgba(255, 255, 255, 0.12), transparent 60%);
  transition: opacity .25s ease;
}
.mj-tilt:hover .mj-sheen { opacity: 1; }

/* 触摸设备：涟漪更明显，倾斜关闭（避免移动端抖动） */
@media (hover: none) {
  .mj-tilt { transform: none !important; }
  .mj-sheen { display: none; }
}

/* 尊重减少动效 */
@media (prefers-reduced-motion: reduce) {
  .mj-progress { transition: none; }
  .mj-ripple, .mj-tilt, .mj-press { animation: none !important; transition: none !important; transform: none !important; }
}