@charset "UTF-8";
/* ============================================================
   WCGhost 页面过渡优化  pt.css
   ============================================================ */

/* --- 1. 滚动条常驻，避免长短页切换时整页横移 --- */
html { scrollbar-gutter: stable; }
@supports not (scrollbar-gutter: stable) {
  html { overflow-y: scroll; }
}
html, body { background: #fff; }

/* --- 2. 站内跳转进来：直接呈现最终状态，不再重播 wow 入场动画 --- */
html.pt-instant .wow {
  visibility: visible !important;
  opacity: 1 !important;
  transform: none !important;
  animation: none !important;
}
html.pt-instant body { animation: none !important; }

/* --- 3. 跨文档视图过渡 ---
   这里刻意【不做】交叉淡变，也不给 header/footer 单独命名快照。
   原因：本站各页版式高度不一致，且页头是叠在 hero 上的绝对定位块，
   两张不同滚动位置/不同版式的快照一旦同时可见，就会出现
   「重影」和「先跳到头部再向下弹」。
   改为整体一次性切换，仅让新页做一次极轻的落位。                */
@view-transition { navigation: auto; }

::view-transition-old(root) {
  animation: none;
  opacity: 0;            /* 旧页当即消失，杜绝两层内容同时可见 */
}

::view-transition-new(root) {
  animation: pt-settle 0.12s ease-out both;
}

@keyframes pt-settle {
  from { opacity: 0.9; }
  to   { opacity: 1; }
}

/* --- 4. 不支持视图过渡的浏览器：退化为淡入 + 点击淡出 --- */
@supports not (view-transition-name: none) {
  body { animation: pt-fade 0.18s ease both; }
  @keyframes pt-fade { from { opacity: 0; } }
  body.pt-leaving {
    opacity: 0;
    transition: opacity 0.13s ease;
  }
}

/* --- 5. 尊重系统“减少动态效果”设置 --- */
@media (prefers-reduced-motion: reduce) {
  ::view-transition-group(*),
  ::view-transition-old(*),
  ::view-transition-new(*) { animation: none !important; }
  ::view-transition-old(root) { opacity: 0; }
  body, html.pt-instant body { animation: none !important; }
}