/* ========================================
   topbar.css - 顶部导航栏公共样式
   所有页面共用，通过 <link> 引入
   ======================================== */

.topbar {
  position: relative;
  z-index: 20;
  height: 66px;
  background: rgba(255,255,255,.97);
  border-bottom: 1px solid rgba(10,74,120,.1);
  box-shadow: 0 3px 14px rgba(20,54,87,.08);
}

.topbar .inner {
  height: 100%;
  margin: 0 auto;
  padding-left: 100px;
  padding-right: 80px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
}

/* ---- logo 区域 ---- */
.logo {
  display: flex;
  align-items: center;
  gap: 10px;
  white-space: nowrap;
  text-decoration: none;
}

.logo-wind { height:36px; width:auto; display:block }
.logo-gel  { height:28px; width:auto; display:block }
.logo-official { height:32px; width:auto; display:block; margin-left:4px }

/* ---- 导航栏 ---- */
.nav {
  display: flex;
  align-items: center;
  gap: 18px;
}

.nav a,
.nav-trigger {
  height: 34px;
  display: inline-flex;
  align-items: center;
  color: #2d3a4c;
  font-size: 14px;
  opacity: .98;
  background: transparent;
  border: 0;
  padding: 0;
  cursor: pointer;
  text-decoration: none;
  white-space: nowrap;
}

.nav a:hover,
.nav-trigger:hover {
  color: var(--wind-blue);
}

.nav-item {
  position: relative;
}

/* 应用入口按钮（带图标背景） */
.nav-trigger.app {
  padding: 0 12px 0 34px;
  background: #eef7fb;
  border-radius: 4px;
  color: var(--wind-blue-deep);
  font-weight: 700;
}
.nav-trigger.app:before {
  content: "";
  position: absolute;
  left: 12px;
  width: 14px;
  height: 14px;
  background:
    linear-gradient(var(--wind-blue), var(--wind-blue)) left top/6px 6px no-repeat,
    linear-gradient(var(--wind-blue), var(--wind-blue)) right top/6px 6px no-repeat,
    linear-gradient(var(--wind-blue), var(--wind-blue)) left bottom/6px 6px no-repeat,
    linear-gradient(var(--wind-blue), var(--wind-blue)) right bottom/6px 6px no-repeat;
}

/* VIP 服务 */
.nav-vip { color:#9b6a14 !important; font-weight:700 }
.nav-vip:before {
  content:"";
  width:15px;
  height:15px;
  margin-right:5px;
  background:linear-gradient(135deg,#f2ca75,#c9902d);
  clip-path:polygon(50% 0,64% 31%,98% 35%,73% 57%,80% 92%,50% 74%,20% 92%,27% 57%,2% 35%,36% 31%);
}

/* 登录按钮 */
.nav-login { padding:0 14px !important; background:var(--wind-blue); border-radius:3px }

/* ---- 下拉菜单 ---- */
.dropdown {
  display:none;
  position:absolute;
  top:40px;
  left:0;
  z-index:30;
  min-width:190px;
  padding:8px;
  background:#fff;
  border:1px solid var(--home-line);
  box-shadow:0 16px 34px rgba(17,45,84,.16);
}
.dropdown a {
  display:block;
  height:auto;
  padding:9px 10px;
  color:#34445a;
  font-size:14px;
}
.dropdown a:hover { background:#f4f9ff; color:var(--wind-blue) }
.nav-item:hover .dropdown { display:block }

/* ---- Mega 菜单（万得企业库产品功能） ---- */
.nav-item--mega { position:relative }

.mega-menu {
  display:none;
  position:absolute;
  top:42px;
  right:-220px;
  z-index:36;
  width:min(1120px,94vw);
  padding:22px 24px;
  background:#fff;
  border:1px solid var(--home-line);
  box-shadow:0 18px 44px rgba(17,45,84,.18);
  border-radius:4px;
  text-align:left;
}
.nav-item--mega:hover .mega-menu,
.nav-item--mega:focus-within .mega-menu,
.nav-item--mega.show .mega-menu { display:block }

.mega-menu__grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px 22px;
}

.mega-menu__group { min-width:0 }

.mega-menu__title {
  display:flex;
  align-items:center;
  margin:0 0 10px;
  color:var(--home-ink);
  font-size:15px;
  font-weight:800;
}
.mega-menu__title:before {
  content:"";
  width:3px;
  height:15px;
  margin-right:8px;
  background:var(--wind-blue);
  border-radius:2px;
}

.mega-menu__items {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:6px 8px;
}

.mega-menu__item {
  display:flex !important;
  align-items:center;
  min-height:32px;
  height:auto !important;
  padding:5px 6px !important;
  color:#46576b !important;
  border-radius:4px;
  font-size:13px !important;
  text-decoration:none;
}
.mega-menu__item:hover { background:#f4f9ff !important; color:var(--wind-blue) !important }

.mega-menu__icon {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:22px;
  height:22px;
  margin-right:7px;
  flex:0 0 auto;
}
.mega-menu__icon img {
  width:18px;
  height:18px;
  display:block;
}

.mega-menu__badge {
  display:inline-flex;
  align-items:center;
  height:16px;
  margin-left:5px;
  padding:0 5px;
  border-radius:10px;
  background:#fff0df;
  color:#b45f00;
  font-size:10px;
  font-weight:800;
}
.mega-menu__badge--new { background:#e8f5ff; color:#0876bd }

/* ---- 响应式 ---- */

@media (max-width:1100px) {
  .topbar { height:auto }
  .topbar .inner { padding:12px 0; flex-wrap:wrap; justify-content:center }
  .nav { flex-wrap:wrap; justify-content:center }
}

@media (max-width:680px) {
  .logo-wind     { height:22px }
  .logo-gel      { height:18px }
  .logo-official { display:none }
  .nav           { gap:14px }
  .dropdown      { position:static; margin-top:8px }
  .mega-menu     { position:static; width:100%; box-shadow:none; margin-top:8px }
  .mega-menu__grid,
  .mega-menu__items { grid-template-columns:1fr }
}