/* ============================================================
   CNKD Topbar v2 —— 全重构导航 (cnkd-nav.css)
   不依赖 bootstrap navbar;PC 悬停下拉,移动端白色抽屉+手风琴
   ============================================================ */
.ck-topbar{position:sticky;top:0;z-index:900;background:#fff;border-bottom:1px solid var(--ck-line);}
.ck-topnav{max-width:1200px;margin:0 auto;height:64px;display:flex;align-items:center;padding:0 20px;position:relative;}

/* ---- 品牌 ---- */
.ck-brand{display:flex;align-items:center;flex:0 0 auto;margin-right:26px;text-decoration:none;}
.ck-brand img{height:32px;width:auto;max-width:200px;object-fit:contain;display:block;}
.ck-brand .ck-brandtxt{font-size:19px;font-weight:800;color:var(--ck-ink);letter-spacing:.3px;white-space:nowrap;line-height:1;}

/* ---- PC 菜单 ---- */
.ck-menu{flex:1 1 auto;display:flex;justify-content:flex-end;min-width:0;}
.ck-list{display:flex;align-items:center;list-style:none;margin:0;padding:0;gap:2px;}
.ck-item{position:relative;margin:0;padding:0;}
.ck-item>a{display:flex;align-items:center;gap:6px;height:64px;padding:0 15px;font-size:15px;font-weight:500;
  color:var(--ck-ink);text-decoration:none;white-space:nowrap;transition:color .2s;}
.ck-item>a:hover{color:var(--ck-blue);}
.ck-arrow{display:inline-block;flex:0 0 auto;width:7px;height:7px;border-right:1.7px solid currentColor;
  border-bottom:1.7px solid currentColor;transform:rotate(45deg) translateY(-2px);transition:transform .25s;opacity:.5;}
.ck-item:hover>a.ck-top .ck-arrow{transform:rotate(225deg);opacity:.9;}

/* ---- 普通下拉(二级) ---- */
.ck-drop{position:absolute;top:100%;left:50%;transform:translate(-50%,10px);background:#fff;
  border:1px solid var(--ck-line);border-radius:12px;box-shadow:0 18px 48px rgba(24,46,140,.14);
  padding:10px;min-width:210px;list-style:none;margin:0;opacity:0;visibility:hidden;
  transition:opacity .22s,transform .22s,visibility .22s;}
.ck-item:hover>.ck-drop{opacity:1;visibility:visible;transform:translate(-50%,0);}
.ck-drop li{position:relative;margin:0;list-style:none;}
.ck-drop li>a{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 14px;
  border-radius:8px;font-size:14px;color:var(--ck-ink);text-decoration:none;transition:all .18s;white-space:nowrap;}
.ck-drop li>a:hover{background:var(--ck-bg);color:var(--ck-blue);}

/* ---- 三级 ---- */
.ck-sub3{position:absolute;left:100%;top:-10px;padding:10px;list-style:none;margin:0;background:#fff;
  border:1px solid var(--ck-line);border-radius:12px;box-shadow:0 16px 44px rgba(24,46,140,.14);
  min-width:180px;opacity:0;visibility:hidden;transform:translateX(8px);transition:all .2s;}
.has-sub2:hover>.ck-sub3{opacity:1;visibility:visible;transform:translateX(0);}
.has-sub2>a.ck-top2 .ck-arrow{transform:rotate(-45deg) translateY(-1px);}

/* ---- 商品全宽面板 ---- */
.ck-mega{position:absolute;top:100%;left:50%;transform:translate(-50%,10px);width:min(1040px,94vw);
  background:#fff;border:1px solid var(--ck-line);border-radius:14px;box-shadow:0 24px 64px rgba(24,46,140,.16);
  padding:24px;display:flex;gap:8px;opacity:0;visibility:hidden;
  transition:opacity .22s,transform .22s,visibility .22s;}
.ck-item:hover>.ck-mega{opacity:1;visibility:visible;transform:translate(-50%,0);}
.ck-mega dl{margin:0;flex:1 1 0;min-width:0;}
.ck-mega dt{font-size:13px;font-weight:700;color:#98A1B8;padding:6px 12px 8px;letter-spacing:.4px;}
.ck-mega dd{margin:0;}
.ck-mega dd a{display:block;padding:9px 12px;border-radius:8px;font-size:14px;color:var(--ck-ink);
  text-decoration:none;transition:all .18s;}
.ck-mega dd a:hover{background:var(--ck-bg);color:var(--ck-blue);}

/* ---- 右侧动作 ---- */
.ck-acts{flex:0 0 auto;display:flex;align-items:center;gap:8px;margin-left:16px;}
.ck-acts .ck-link{font-size:14px;color:var(--ck-ink);text-decoration:none;padding:8px 10px;transition:color .2s;}
.ck-acts .ck-link:hover{color:var(--ck-blue);}
.ck-acts .ck-reg{display:inline-flex;align-items:center;height:38px;padding:0 20px;border-radius:19px;
  background:linear-gradient(135deg,var(--ck-blue),var(--ck-blue2));color:#fff;font-size:14px;font-weight:600;
  text-decoration:none;box-shadow:0 6px 16px rgba(41,72,223,.25);transition:all .2s;}
.ck-acts .ck-reg:hover{transform:translateY(-1px);box-shadow:0 10px 22px rgba(41,72,223,.35);color:#fff;}

/* ---- 汉堡 ---- */
.ck-burger{display:none;flex:0 0 auto;width:40px;height:40px;border:none;background:transparent;
  margin-left:6px;padding:9px 8px;cursor:pointer;position:relative;z-index:960;}
.ck-burger span{display:block;height:2px;background:var(--ck-ink);border-radius:2px;margin:5px 0;
  transition:transform .28s,opacity .2s;}
.ck-burger.active span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.ck-burger.active span:nth-child(2){opacity:0;}
.ck-burger.active span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
body.ck-noscroll{overflow:hidden;}

/* ============================================================
   移动端:全屏白色抽屉 + 手风琴
   ============================================================ */
@media (max-width:991px){
  .ck-topnav{height:56px;padding:0 14px;}
  .ck-brand{margin-right:10px;}
  .ck-brand img{height:27px;max-width:150px;}
  .ck-burger{display:block;}
  .ck-acts{margin-left:auto;}
  .ck-acts .ck-link{padding:6px 4px;font-size:14px;}
  .ck-acts .ck-reg{height:34px;padding:0 14px;font-size:13px;}

  .ck-menu{position:fixed;top:57px;left:0;right:0;bottom:0;width:100%;background:#fff;z-index:940;
    overflow-y:auto;-webkit-overflow-scrolling:touch;padding:8px 16px 46px;display:block;
    opacity:0;visibility:hidden;transform:translateY(-10px);
    transition:opacity .25s,transform .25s,visibility .25s;
    box-shadow:0 20px 50px rgba(20,27,51,.12);}
  .ck-topnav.ck-open .ck-menu{opacity:1;visibility:visible;transform:translateY(0);}
  .ck-list{display:block;}
  .ck-item{border-bottom:1px solid var(--ck-line);}
  .ck-item>a{height:auto;min-height:50px;padding:13px 4px;font-size:16px;font-weight:600;
    justify-content:space-between;width:100%;}
  .ck-item>a .ck-arrow{transform:rotate(45deg);opacity:.4;}
  .ck-item.ck-exp>a.ck-top .ck-arrow{transform:rotate(225deg);opacity:.7;}

  .ck-drop,.ck-mega{position:static;transform:none;opacity:1;visibility:visible;width:auto;min-width:0;
    box-shadow:none;border:none;border-radius:0;background:transparent;padding:0 0 8px 12px;display:none;
    transition:none;gap:0;}
  .ck-item.ck-exp>.ck-drop,.ck-item.ck-exp>.ck-mega{display:block;}
  .ck-mega{flex-direction:column;}
  .ck-mega dl{width:100%;}
  .ck-mega dt{padding:10px 12px 4px;font-size:12.5px;}
  .ck-drop li>a,.ck-mega dd a{padding:11px 12px;font-size:15px;font-weight:500;justify-content:flex-start;
    gap:8px;white-space:normal;border-radius:8px;}
  .ck-drop li>a:hover,.ck-mega dd a:hover{background:var(--ck-bg);}
  .ck-drop li>a .ck-arrow{margin-left:auto;opacity:.4;}
  .ck-item.ck-exp3>a.ck-top2 .ck-arrow{transform:rotate(225deg);opacity:.7;}
  .ck-sub3{position:static;transform:none;opacity:1;visibility:visible;box-shadow:none;border:none;
    background:transparent;padding:0 0 6px 14px;display:none;min-width:0;transition:none;}
  .ck-item.ck-exp3>.ck-sub3{display:block;}
  .ck-sub3 li a{padding:10px 12px;font-size:14.5px;color:var(--ck-gray);font-weight:500;}
}
@media (max-width:420px){
  .ck-brand img{height:25px;max-width:132px;}
  .ck-acts .ck-link{padding:6px 2px;font-size:13.5px;}
  .ck-acts .ck-reg{height:32px;padding:0 12px;font-size:12.5px;}
}
