/* 桌面端导航下拉改版（2026-11-11）
 *
 * 为什么单独一层 DOM：
 *   lplug.min.css 在 max-width:1024px 里把 .nav-two 变成了全屏抽屉，
 *   复用 .left/.right/dl dd/.nav-three 结构并由 JS 切换 .open。
 *   直接替换 .nav-two 会把手机菜单弄坏，所以这里只覆盖桌面端：
 *   ≥1025px 隐藏 .nav-two、显示 .nav-mega；≤1024px 完全走原逻辑。
 *
 * 位置：面板以 .header-cont 为定位容器居中，不依赖各菜单项的宽度，
 *   因此 1025–1920px 任意宽度都不会溢出屏幕（已逐档实测）。
 */

/* 默认不渲染：≤1024px 由原 .nav-two 抽屉接管。
   没有这条兜底，窄窗口（鼠标设备但宽度不足 1025）会把面板里的链接
   平铺进导航项，等于把手机菜单弄乱。 */
.nav-mega{display:none}

@media screen and (min-width:1025px){

  /* 站点没有全局 border-box（lplug.min.css 未设），不显式声明的话
     880px 面板会算成 960px，比预览稿宽 80px。 */
  .nav-mega,.nav-mega *{box-sizing:border-box}

  /* 定位上下文统一收回到 .header-cont：
     .lh-nav 自带 l-relative，若不清掉，面板会以导航条（.center）为基准，
     各页宽度不同就会左右错位甚至出屏。清成 static 后三个面板共用同一条
     中轴（= 页面中轴），1025–1920 均不出屏。
     li 保持 relative —— 下面的 ::after 桥接要用它当定位基准。 */
  .header-cont{position:relative}
  .lh-nav{position:static}
  .lh-nav>li{position:relative}
  .lh-nav>li>.nav-two{display:none}          /* 桌面端由 .nav-mega 接管 */

  /* 鼠标从导航文字斜着移向面板时，会短暂经过头部下方的空白。
     这一段由 nav-mega-20261111 的内联脚本加 180ms 宽限（.mega-open），
     不用透明元素铺桥 —— 那样会在头部下方留一条挡点击的隐形带。 */

  /* ---------- 开合：0.6s 同族缓出，进出可逆 ----------
     position:fixed 是必须的：li 是 relative，若用 absolute，面板会以
     各自的菜单项为基准居中（1440 下 Products 面板左边界会跑到 -58px
     被裁掉）。fixed 让它相对视口居中，top 直接取头部高度，
     三个面板共用同一条中轴。 */
  .nav-mega{
    display:block;
    position:fixed;left:50%;top:calc(var(--size-85) + 6px);
    opacity:0;pointer-events:none;transform:translate(-50%,16px);
    transition:opacity .6s cubic-bezier(.22,.61,.36,1),transform .6s cubic-bezier(.22,.61,.36,1);
    z-index:20;
  }
  .lh-nav>li:hover>.nav-mega,
  .lh-nav>li.mega-open>.nav-mega,
  .lh-nav>li:focus-within>.nav-mega{
    opacity:1;pointer-events:auto;transform:translate(-50%,0);
  }

  /* ---------- 面板 ---------- */
  .nm-panel{
    max-width:calc(100vw - 48px);
    background:linear-gradient(180deg,#14151a 0%,#0d0e11 100%);
    border:1px solid rgba(255,255,255,.06);
    border-radius:10px;
    box-shadow:0 28px 64px -16px rgba(0,0,0,.55);
    padding:34px 40px 38px;
    display:grid;gap:0;
    color:#e8eaee;
    /* 导航栏带 l-uppercase，不清掉会把产品名全变大写 */
    text-transform:none;letter-spacing:normal;text-align:left;
    font-size:14.5px;line-height:1.4;
  }
  .nm-p3{width:880px;grid-template-columns:1fr 1fr 1.3fr}
  .nm-pi2{width:760px;grid-template-columns:1fr 1fr}
  .nm-p2{width:680px;grid-template-columns:1fr 1.3fr}

  /* ---------- 栏 ---------- */
  .nm-col{padding-right:34px;min-width:0}
  .nm-col+.nm-col{border-left:1px solid rgba(255,255,255,.07);padding-left:34px}
  .nm-label{
    font-size:11px;letter-spacing:.16em;text-transform:uppercase;
    color:#84888f;margin-bottom:12px;font-weight:600;
  }

  /* ---------- 行 ---------- */
  .nm-row{
    display:flex;align-items:center;justify-content:space-between;gap:12px;
    padding:12px 0;text-decoration:none;color:#e8eaee;
    position:relative;border-bottom:1px solid rgba(255,255,255,.08);
    transition:color .4s ease;
  }
  .nm-col .nm-row:last-of-type{border-bottom:none}
  .nm-txt{display:flex;flex-direction:column;gap:3px;min-width:0}
  .nm-t{font-size:14.5px;font-weight:400;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .nm-sub{
    font-size:11.5px;line-height:1.3;color:#7d838d;
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
    transition:color .4s ease;
  }
  .nm-row::after{
    content:'';position:absolute;left:0;bottom:-1px;height:1px;width:100%;
    background:rgba(255,255,255,.85);transform:scaleX(0);transform-origin:right;
    transition:transform .55s cubic-bezier(.22,.61,.36,1);
  }
  .nm-row:hover::after{transform:scaleX(1);transform-origin:left}
  .nm-row:hover{color:#86aaef}
  .nm-row:hover .nm-sub{color:#9aa3b0}
  .nm-btn{width:12px;height:12px;flex:none;overflow:visible}
  .nm-btn svg{
    display:block;width:100%;height:100%;stroke:#6a6f7a;fill:none;stroke-width:1.4;
    transition:transform .5s cubic-bezier(.22,.61,.36,1),stroke .4s ease;
  }
  .nm-row:hover .nm-btn svg{stroke:#86aaef;transform:translate(2px,-2px)}

  /* ---------- 引导卡 ---------- */
  .nm-card{
    margin-top:24px;background:rgba(255,255,255,.045);
    border:1px solid rgba(255,255,255,.07);border-radius:10px;
    padding:20px 20px 22px;
  }
  .nm-card-t{font-size:13.5px;font-weight:600;color:#fff;margin-bottom:8px}
  .nm-card p{font-size:13px;line-height:1.65;color:#98a0ab;margin:0 0 16px}
  .nm-cta{
    display:block;text-align:center;white-space:nowrap;
    background:transparent;color:#fff;
    border:1px solid rgba(255,255,255,.35);border-radius:7px;
    text-decoration:none;font-size:13px;font-weight:500;
    padding:11px 14px;
    transition:background .35s ease,color .35s ease,border-color .35s ease;
  }
  .nm-cta:hover{background:#3b6fd4;border-color:#3b6fd4;color:#fff}
}

/* 触屏设备没有悬停：避免点一下把面板粘住，交给父级页面兜底 */
@media (hover:none){
  .nav-mega{display:none}
}