
<!-- ══════════════════════════════════════════════════════════════
     MEGA MENU CSS — 全部限制在 .mega_menu 内
════════════════════════════════════════════════════════════════ -->
<style>

/* ── 触发器 wrapper ───────────────────────────────────────── */
.mega_menu-trigger { position: static; }

/* ── Panel 基础 ───────────────────────────────────────────── */
.mega_menu {
  position: fixed;
  top: 80px; left: 0; width: 100%;
  z-index: 999;
  background: #fff;
  border-top: 2px solid #1a7bb5;
  box-shadow: 0 16px 48px rgba(0,30,60,.13);
  opacity: 0;
  transform: translateY(-6px);
  pointer-events: none;
  transition: opacity .22s ease, transform .22s ease;
}
.admin-bar .mega_menu{
top: 112px;
}
.mega_menu.is-visible {
  opacity: 1; transform: translateY(0); pointer-events: auto;
}

/* ── 共用内层容器 ─────────────────────────────────────────── */
.mega_menu__inner {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 24px 32px;
}

/* ════════════════════════════════════════════════════════════
   产品中心：水平 TAB
════════════════════════════════════════════════════════════ */

.mega_menu__tab-bar {
  display: flex;
  gap: 0;
  border-bottom: 1px solid #edf0f5;
  margin-bottom: 28px;
}

.mega_menu__tab-btn {
  position: relative;
  padding: 18px 28px 16px;
  font-size: 14px;
  font-weight: 600;
  color: #666;
  background: none;
  border: none;
  cursor: pointer;
  white-space: nowrap;
  transition: color .18s;
  letter-spacing: .2px;
}
.mega_menu__tab-btn::after {
  content: '';
  position: absolute;
  bottom: -1px; left: 0; right: 0;
  height: 2px;
  background: #1a7bb5;
  transform: scaleX(0);
  transition: transform .2s ease;
}
.mega_menu__tab-btn:hover { color: #1a7bb5; }
.mega_menu__tab-btn.is-active { color: #1a7bb5;
 background: linear-gradient(30deg, #45b5ba, #45b5ba 0%, #355c97);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  display: inline-block;
  color: unset;
   }
.mega_menu__tab-btn.is-active::after { transform: scaleX(1); }

.mega_menu__tab-panels { position: relative; }

.mega_menu__tab-panel {
  display: none;
  animation: mm_fadeIn .18s ease;
}
.mega_menu__tab-panel.is-active { display: block; }

@keyframes mm_fadeIn {
  from { opacity: 0; transform: translateY(4px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* 产品网格 */
.mega_menu__product-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
}
.mega_menu__product-grid--single {
  grid-template-columns: repeat(2, 1fr);
}

/* 产品卡片 */
.mega_menu__product-card {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 14px 16px;
  border: 1px solid #edf0f5;
  border-radius: 10px;
  text-decoration: none;
  color: #333;
  transition: border-color .18s, box-shadow .18s, transform .18s;
}
.mega_menu__product-card:hover {
  border-color: #1a7bb5;
  box-shadow: 0 4px 18px rgba(26,123,181,.11);
  transform: translateY(-2px);
}

.mega_menu__product-thumb {
  width: 64px; height: 48px;
  border-radius: 7px;
  background: linear-gradient(135deg, #dce8f5, #edf4fb);
  flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
}
.mega_menu__product-thumb svg { width: 28px; height: 28px; opacity: .5; }
.mega_menu__product-thumb img{
  padding: 10px;
}
.mega_menu__product-info { flex: 1; min-width: 0; }
.mega_menu__product-name {
  font-size: 13px; font-weight: 700; color: #1a7bb5;
  margin-bottom: 3px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.mega_menu__product-desc { font-size: 12px; color: #8a97a8; line-height: 1.45; }

.mega_menu__product-arrow {
  width: 14px; height: 14px; color: #c8d4e0; flex-shrink: 0;
  transition: color .15s, transform .15s;
}
.mega_menu__product-card:hover .mega_menu__product-arrow {
  color: #1a7bb5; transform: translateX(3px);
}

/* Tab footer */
.mega_menu__tab-footer {
  margin-top: 24px; padding-top: 18px;
  border-top: 1px solid #f0f3f7;
  display: flex; align-items: center; justify-content: space-between;
}
.mega_menu__tab-footer-text { font-size: 12px; color: #a0acba; }
.mega_menu__tab-footer-link {
  display: flex; align-items: center; gap: 5px;
  font-size: 13px; font-weight: 600; color: #1a7bb5; text-decoration: none;
  transition: gap .18s;
}
.mega_menu__tab-footer-link:hover { gap: 9px; }
.mega_menu__tab-footer-link svg { width: 13px; height: 13px; }


/* ════════════════════════════════════════════════════════════
   下载中心：4 栏平铺
════════════════════════════════════════════════════════════ */

.mega_menu--downloads .mega_menu__inner { padding-top: 28px; }

.mega_menu__dl-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}

.mega_menu__dl-card {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 22px 20px;
  border: 1px solid #edf0f5;
  border-radius: 12px;
  text-decoration: none;
  color: #333;
  transition: border-color .18s, box-shadow .18s, transform .18s;
}
.mega_menu__dl-card:hover {
  border-color: #1a7bb5;
  box-shadow: 0 6px 24px rgba(26,123,181,.12);
  transform: translateY(-3px);
}

.mega_menu__dl-icon {
  width: 44px; height: 44px;
  border-radius: 10px;
  background: #eaf4fb;
  display: flex; align-items: center; justify-content: center;
  transition: background .18s;
}
.mega_menu__dl-card:hover .mega_menu__dl-icon { background: #1a7bb5; }
.mega_menu__dl-icon svg { width: 22px; height: 22px; color: #1a7bb5; transition: color .18s; }
.mega_menu__dl-card:hover .mega_menu__dl-icon svg { color: #fff; }

.mega_menu__dl-title { font-size: 14px; font-weight: 700; color: #222; margin-bottom: 5px; }
.mega_menu__dl-sub   { font-size: 12px; color: #8a97a8; line-height: 1.6; }

.mega_menu__dl-footer {
  margin-top: 22px; padding-top: 18px;
  border-top: 1px solid #f0f3f7;
  display: flex; align-items: center; justify-content: space-between;
}
.mega_menu__dl-footer-text { font-size: 12px; color: #a0acba; }
.mega_menu__dl-footer-link {
  display: flex; align-items: center; gap: 5px;
  font-size: 13px; font-weight: 600; color: #1a7bb5; text-decoration: none;
  transition: gap .18s;
}
.mega_menu__dl-footer-link:hover { gap: 9px; }
.mega_menu__dl-footer-link svg { width: 13px; height: 13px; }


/* ── 遮罩 ─────────────────────────────────────────────────── */
.mega_menu-overlay {
  position: fixed; inset: 64px 0 0 0;
  background: rgba(8,25,45,.22);
  backdrop-filter: blur(2px);
  z-index: 998;
  opacity: 0; pointer-events: none;
  transition: opacity .22s;
}
.mega_menu-overlay.is-visible { opacity: 1; pointer-events: auto; }