/* ==========================================================================
   玄墨 · 赤金  |  导航与动效增强 v2.0（深色适配）
   参考：www.zibll.com 的导航滚动隐藏与图片渐进加载
   v2.0 修正：
     ① 移除 .header-cta 的 ::before 遮罩层——它会在特定状态下盖住按钮文字
     ② 导航背景/下划线/图标全部改为深色体系
     ③ hover 反馈改用 box-shadow + transform（零遮挡风险）
   ========================================================================== */

/* ---------- 1. 导航：滚动隐藏 / 回升显示 ---------- */
body.geo-body .site-top{
  will-change:transform;
  transition:transform .34s cubic-bezier(.22,.61,.36,1),
             box-shadow .28s cubic-bezier(.22,.61,.36,1),
             background .28s cubic-bezier(.22,.61,.36,1);
}
body.geo-body.is-scroll-down .site-top{
  transform:translate3d(0,-102%,0);
  box-shadow:none;
}
body.geo-body.is-scroll-up .site-top{transform:translate3d(0,0,0)}

/* 未滚动：导航更透；滚动后：实底 + 毛玻璃 + 细阴影 */
body.geo-body:not(.is-scrolled) .site-header{
  background:rgba(27,29,32,.6);
  border-bottom-color:transparent;
  box-shadow:none;
}
body.geo-body.is-scrolled .site-header{
  background:rgba(24,26,29,.94);
  -webkit-backdrop-filter:saturate(160%) blur(18px);
  backdrop-filter:saturate(160%) blur(18px);
  border-bottom-color:rgba(255,255,255,.09);
  box-shadow:0 10px 34px rgba(0,0,0,.42);
}
body.geo-body.is-scrolled .utility-bar{border-bottom-color:rgba(255,255,255,.09)}
body.geo-body .float-right,
body.geo-body .back-to-top{transition:transform .34s cubic-bezier(.22,.61,.36,1),opacity .28s}
body.geo-body.is-scroll-down .float-right{transform:translateX(200%)}

/* ---------- 2. 菜单下划线（同时覆盖 active 态） ---------- */
body.geo-body .main-nav > a{overflow:hidden}
body.geo-body .main-nav > a::after,
body.geo-body .main-nav > a.is-active::after,
body.geo-body .main-nav > a[aria-current="page"]::after{
  content:"";
  display:block;
  position:absolute;left:14px;right:14px;bottom:5px;height:2px;
  border-radius:2px;
  background-image:linear-gradient(90deg,#FF4D6A 0%,#E0B95E 100%);
  background-color:transparent;
  transform:scaleX(0);transform-origin:left center;
  transition:transform .3s cubic-bezier(.22,.61,.36,1);
  opacity:1;
}
body.geo-body .main-nav > a:hover::after,
body.geo-body .main-nav > a:focus-visible::after,
body.geo-body .main-nav > a.is-active::after,
body.geo-body .main-nav > a[aria-current="page"]::after{transform:scaleX(1)}
body.geo-body .main-nav > a.is-active,
body.geo-body .main-nav > a[aria-current="page"]{background:transparent;color:#FF4D6A}
body.geo-body .main-nav > a:hover{background:transparent;color:var(--ink)}
/* 预约按钮是 CTA，不参与菜单下划线 */
body.geo-body .main-nav > a.header-cta::after{display:none !important}
body.geo-body .main-nav > a.header-cta{overflow:visible}

/* ---------- 3. 渐变 CTA（无伪元素遮罩，零遮挡风险） ---------- */
body.geo-body .header-cta{
  background-image:linear-gradient(120deg,#FF4D6A 0%,#E03552 100%) !important;
  color:#fff !important;
  border:none !important;
  box-shadow:0 10px 26px rgba(255,77,106,.28);
}
body.geo-body .header-cta:hover{
  background-image:linear-gradient(120deg,#FF6079 0%,#EE4A66 100%) !important;
  color:#fff !important;
  box-shadow:0 14px 32px rgba(255,77,106,.42);
  transform:translateY(-1px);
}
body.geo-body .header-cta:active{transform:translateY(0) scale(.985)}

/* 主按钮箭头右移 */
body.geo-body .btn-primary span[aria-hidden="true"],
body.geo-body .saas-btn--primary span[aria-hidden="true"]{
  display:inline-block;
  transition:transform .3s cubic-bezier(.22,.61,.36,1);
}
body.geo-body .btn-primary:hover span[aria-hidden="true"],
body.geo-body .saas-btn--primary:hover span[aria-hidden="true"]{transform:translateX(4px)}

/* ---------- 4. 图片渐进加载（默认可见，加载完才播动画） ---------- */
@keyframes obsImgIn{
  from{opacity:0;filter:blur(6px);transform:scale(1.03)}
  to{opacity:1;filter:blur(0);transform:scale(1)}
}
body.geo-body img.is-obs-loaded{animation:obsImgIn .62s cubic-bezier(.16,1,.3,1) both}
body.geo-body .hc-card,
body.geo-body .product-card{overflow:hidden}
body.geo-body .hc-card img,
body.geo-body .product-card img{transition:transform .55s cubic-bezier(.16,1,.3,1)}
body.geo-body .hc-card:hover img,
body.geo-body .product-card:hover img{transform:scale(1.04)}

/* ---------- 5. 区块入场 ---------- */
body.geo-body .reveal{
  transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1);
}
body.geo-body .reveal.is-visible{transform:translateY(0)}

/* ---------- 6. 顶条文字微反馈 ---------- */
body.geo-body .utility-bar .text-link{transition:color .2s cubic-bezier(.22,.61,.36,1),letter-spacing .2s}
body.geo-body .utility-bar .text-link:hover{letter-spacing:.06em}

/* ---------- 7. 响应式与可访问性 ---------- */
@media (max-width:1024px){
  body.geo-body.is-scroll-down .site-top{transform:translate3d(0,-102%,0)}
  body.geo-body.nav-open .site-top,
  body.geo-body.mobile-navbar-show .site-top,
  body.geo-body.is-open .site-top{transform:translate3d(0,0,0) !important}
}
@media (hover:none){
  body.geo-body .hc-card:hover img,
  body.geo-body .product-card:hover img{transform:none}
}
@media (prefers-reduced-motion:reduce){
  body.geo-body .site-top{transition:none}
  body.geo-body.is-scroll-down .site-top{transform:none}
  body.geo-body img.is-obs-loaded{animation:none}
  body.geo-body .main-nav > a::after{transition:none}
}
