:root{
  --megabrand:   #5001be;
  --megabrand-2: #600ff0;
  --megabrand-50:#f4eefe;
  --megabrand-100:#ece2ff;
  --mega-text:   #1a1a1a;
  --mega-text-2: #555;
  --mega-text-3: #888;
  --mega-line:   #e5e5e5;
  --mega-line-2: #dfdfdf;
  --mega-hot:    #ff9933;
  --mega-new:    #4fb568;
  --mega-radius: 6px;
  --mega-top-h:  0.8rem;

  --kv-bg-1:  #0a0118;
  --kv-bg-2:  #1a0240;
  --kv-bg-3:  #0f001f;
  --kv-neon:  #b388ff;
  --kv-neon-2:#7c4dff;
}

header .nav-ul > li{
  position:relative;
  height:var(--mega-top-h);
  display:flex;
  align-items:center;
}
header.open:has(.mega-li.is-open) .nav-main,
header:has(.mega-li.is-open) .nav-main{
  background:transparent !important;
  border-top:none !important;
  height:0 !important;
  max-height:0 !important;
  overflow:hidden !important;
}
header.open:has(.mega-li.is-open) .nav-main .nmDiv,
header:has(.mega-li.is-open) .nav-main .nmDiv{
  display:none !important;
}
header .nav-ul > li.mega-li .mega-trigger{
  display:flex;
  align-items:center;
  gap:4px;
  height:var(--mega-top-h);
  transition:color .15s;
  cursor:pointer;
  user-select:none;
}
header .nav-ul > li.mega-li .mega-trigger:hover,
header .nav-ul > li.mega-li.is-open .mega-trigger{
  color:var(--megabrand);
}
header .nav-ul > li.mega-li .mega-trigger .caret{
  width:0; height:0;
  border-left:4px solid transparent;
  border-right:4px solid transparent;
  border-top:5px solid currentColor;
  opacity:.5;
  margin-top:2px;
  transition:transform .15s, opacity .15s;
}
header .nav-ul > li.mega-li.is-open .mega-trigger .caret{
  transform:rotate(180deg);
  opacity:1;
}

header .nav-ul > li .caret{
  width:0; height:0;
  border-left:4px solid transparent;
  border-right:4px solid transparent;
  border-top:5px solid currentColor;
  opacity:.5;
  margin-top:2px;
  margin-left:4px;
  transition:transform .15s, opacity .15s;
}
header .nav-ul > li:not(.mega-li):not(.nosub){
  transition:color .15s;
}
header .nav-ul > li:not(.mega-li):not(.nosub):hover,
header .nav-ul > li:not(.mega-li):not(.nosub).is-active{
  color:var(--megabrand);
}
header .nav-ul > li:not(.mega-li):not(.nosub):hover .caret,
header .nav-ul > li:not(.mega-li):not(.nosub).is-active .caret{
  opacity:1;
}
header .nav-ul > li:not(.mega-li):not(.nosub).is-active .caret{
  transform:rotate(180deg);
}

header .headTop .mega-hamburger{
  display:none;
  width:36px; height:36px;
  align-items:center; justify-content:center;
  border-radius:6px;
  cursor:pointer;
}
header .headTop .mega-hamburger:hover{ background:transparent; }
header .headTop .mega-hamburger span{
  display:block; width:18px; height:2px;
  background:var(--megabrand); position:relative;
  transition:background .2s;
}
header .headTop .mega-hamburger span::before,
header .headTop .mega-hamburger span::after{
  content:''; position:absolute; left:0; width:18px; height:2px; background:var(--megabrand);
  transition:transform .25s, top .25s, bottom .25s;
}
header .headTop .mega-hamburger span::before{ top:-6px; }
header .headTop .mega-hamburger span::after{ bottom:-6px; }
header .headTop .mega-hamburger.is-open span{ background:transparent; }
header .headTop .mega-hamburger.is-open span::before{ top:0;  transform:rotate(45deg); }
header .headTop .mega-hamburger.is-open span::after{ bottom:0; transform:rotate(-45deg); }

.mega-backdrop{
  position:absolute; left:0; right:0;
  top:var(--mega-top-h);
  height:100vh;
  background:rgba(0,0,0,.4);
  opacity:0; visibility:hidden;
  transition:opacity .2s, visibility .2s;
  z-index:90;
  pointer-events:none;
}
.mega-backdrop.is-open{
  opacity:1; visibility:visible; pointer-events:auto;
}

.mega-menu{
  position:absolute;
  left:0; right:0;
  top:var(--mega-top-h);
  margin-top:-2px;
  background:#fff;
  border-bottom:1px solid var(--mega-line-2);
  box-shadow:0 8px 24px rgba(80,1,190,.08);
  opacity:0; visibility:hidden;
  transform:translateY(0);
  transition:opacity .15s, visibility .15s;
  z-index:100;
  max-height:calc(100vh - var(--mega-top-h) + 2px);
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
}
/* 导航锁定（fixed 头部）时，下拉与遮罩钉在视口；否则相对 header 随页面滚动 */
.homeBody .mega-menu,
.homeBody .mega-backdrop{
  position:fixed;
}
.homeBody .mega-backdrop{
  height:auto;
  bottom:0;
}
.mega-menu.is-open{
  opacity:1; visibility:visible;
  pointer-events:auto;
}
.mega-inner{
  max-width:1430.016px;
  width:85.652%;
  margin:0 auto;
  padding:32px 0 24px;
  display:grid;
  grid-template-columns:1.15fr 1fr 1fr 320px;
  gap:0 36px;
}

.mega-group{ display:flex; flex-direction:column; }
.mega-group-title{
  font-size:16px;
  font-weight:700;
  color:var(--megabrand);
  text-transform:uppercase;
  letter-spacing:1px;
  padding-bottom:10px; margin-bottom:12px;
  border-bottom:2px solid var(--megabrand);
  display:flex; align-items:baseline; gap:6px;
}
.mega-group-title .count{
  font-size:11px;
  font-weight:500;
  color:var(--mega-text-3);
  letter-spacing:0;
}

.mega-item{
  padding:5px 8px;
  margin:0 -10px;
  border-radius:var(--mega-radius);
  display:flex; flex-direction:column; gap:4px;
  transition:background .15s;
}
.mega-item + .mega-item{ margin-top:2px; }
.mega-item:hover{ background:var(--megabrand-50); }
.mega-item .t{
  font-size:16px;
  font-weight:600;
  color:var(--mega-text);
  line-height:1.3;
  display:flex; align-items:center; gap:6px;
  transition:color .15s;
}
.mega-item:hover .t{ color:var(--megabrand); }
.mega-item .d{
  font-size:14px;
  color:var(--mega-text-2);
  line-height:1.55;
}

.mega-badge{
  display:inline-flex; align-items:center;
  height:17px; padding:0 7px;
  border-radius:9px;
  font-size:10px; font-weight:700;
  color:#fff;
  letter-spacing:.5px;
  text-transform:uppercase;
  flex-shrink:0;
}
.mega-badge-hot{ background:var(--mega-hot); }
.mega-badge-new{ background:var(--mega-new); }

.mega-item.is-highlight{
  background:var(--megabrand-50);
  border:1px solid var(--megabrand-100);
}
.mega-item.is-highlight:hover{ background:var(--megabrand-100); }
.mega-item.is-highlight .t{ color:var(--megabrand); }

.mega-featured{
  grid-column:4 / 5;
  grid-row:1 / 3;
}
.mega-featured-v3{
  height:55%;
  border-radius:10px;
  overflow:hidden;
  position:relative;
  /*color:#fff;*/
  display:flex; flex-direction:column; justify-content:space-between;
  padding:22px;
 /* background:
    radial-gradient(ellipse at top right, rgba(124,77,255,.35), transparent 55%),
    linear-gradient(160deg, var(--kv-bg-2) 0%, var(--kv-bg-1) 60%, var(--kv-bg-3) 100%);*/
  border:1px solid rgba(124,77,255,.4);
  box-shadow:0 8px 24px rgba(80,1,190,.18), inset 0 1px 0 rgba(255,255,255,.05);
}
.mega-featured-v3::before{
  content:''; position:absolute; inset:0;
  /*background:
    linear-gradient(180deg, transparent 55%, rgba(0,0,0,.45) 56%, rgba(0,0,0,.45) 100%),
    linear-gradient(90deg, transparent 0%, var(--kv-neon) 30%, var(--kv-neon-2) 50%, var(--kv-neon) 70%, transparent 100%);*/
  background-size:100% 100%, 100% 2px;
  background-position:0 0, 0 100%;
  background-repeat:no-repeat;
  opacity:.7;
  z-index:0;
}
.mega-featured-v3::after{
  content:'';
  position:absolute; right:-30px; bottom:-30px;
  width:200px; height:200px;
 /* background:radial-gradient(circle at center, rgba(124,77,255,.45), transparent 60%);*/
  z-index:0;
  pointer-events:none;
}
.mega-featured-v3 > *{ position:relative; z-index:1; }

.mega-kv-rack{
  position:absolute;
  right:18px; bottom:18px;
  width:80px; height:90px;
  z-index:0;
  background:
    linear-gradient(180deg,
      rgba(124,77,255,.15) 0%, rgba(124,77,255,.15) 8%,
      rgba(255,255,255,.04) 8%, rgba(255,255,255,.04) 18%,
      rgba(124,77,255,.15) 18%, rgba(124,77,255,.15) 26%,
      rgba(255,255,255,.04) 26%, rgba(255,255,255,.04) 36%,
      rgba(124,77,255,.15) 36%, rgba(124,77,255,.15) 44%,
      rgba(255,255,255,.04) 44%, rgba(255,255,255,.04) 54%,
      rgba(124,77,255,.15) 54%, rgba(124,77,255,.15) 62%,
      rgba(255,255,255,.04) 62%, rgba(255,255,255,.04) 72%,
      rgba(124,77,255,.15) 72%, rgba(124,77,255,.15) 80%,
      rgba(255,255,255,.04) 80%, rgba(255,255,255,.04) 90%,
      rgba(124,77,255,.15) 90%, rgba(124,77,255,.15) 100%
    );
  border:1px solid rgba(124,77,255,.4);
  border-radius:3px;
}
.mega-featured-tag{
  font-size:11px; font-weight:700; letter-spacing:1.4px;
  color:var(--kv-neon); text-transform:uppercase;
  text-shadow:0 0 12px rgba(179,136,255,.6);
  display:inline-flex; align-items:center; gap:6px;
}
.mega-featured-tag::before{
  content:''; width:14px; height:2px;
  background:var(--kv-neon);
  border-radius:1px;
  box-shadow:0 0 8px var(--kv-neon);
}
.mega-featured-title{
  font-size:22px;
  font-weight:700;
  line-height:1.25;
  margin-top:14px;
  letter-spacing:-.3px;
}
.mega-featured-title .v3-badge{
  display:inline-block; margin-left:6px;
  font-size:13px; font-weight:800;
  letter-spacing:1px;
  color:#fff;
  background:linear-gradient(135deg, var(--megabrand-2), var(--kv-neon-2));
  padding:2px 8px;
  border-radius:4px;
  vertical-align:middle;
  box-shadow:0 0 12px rgba(124,77,255,.6);
}
.mega-featured-desc{
  font-size:13px;
  line-height:1.6;
  /*color:rgba(255,255,255,.82);*/
  margin-top:8px;
}
.mega-featured-meta{
  display:flex; align-items:center; gap:14px; flex-wrap:wrap;
  margin-top:14px;
  font-size:12px;
  color:rgba(255,255,255,.6);
  border-top:1px solid rgba(255,255,255,.08);
  padding-top:12px;
}
.mega-featured-meta strong{ color:#fff; font-weight:700; margin-right:4px; }

.mega-featured-cta{
  align-self:flex-start;
  margin-top:8px;
  display:inline-flex; align-items:center; gap:6px;
  padding:10px 18px;
  background-color:#600ff0;
  color:#FFF;
 /* background:linear-gradient(135deg, #fff 0%, #f0e8ff 100%);
  color:var(--megabrand);*/
  font-size:13px; font-weight:700;
  border-radius:var(--mega-radius);
  transition:transform .15s, box-shadow .15s;
  box-shadow:0 4px 16px rgba(124,77,255,.35);
}
.mega-featured-cta::after{
  content:'';
  width:6px; height:10px;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 6 11' fill='none' stroke='%235001be' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'><path d='M1 1l4 4.5L1 10'/></svg>");
  background-repeat:no-repeat; background-size:6px 10px;
}
.mega-featured-cta:hover{
  transform:translateX(2px);
  box-shadow:0 6px 20px rgba(124,77,255,.5); 
background-color:#fff;
}
.mega-featured-sub{
  align-self:flex-start;
  margin-top:6px;
  font-size:12px; font-weight:600;
  color:rgba(255,255,255,.85);
  display:inline-flex; align-items:center; gap:5px;
  transition:color .15s;
}
.mega-featured-sub::after{
  content:'';
  width:5px; height:9px;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 6 11' fill='none' stroke='white' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'><path d='M1 1l4 4.5L1 10'/></svg>");
  background-repeat:no-repeat; background-size:5px 9px;
}
.mega-featured-sub:hover{ color:#fff; }

.mega-footer{
  grid-column:1 / 4;
  grid-row:2 / 3;
  align-self:end;
  display:flex; align-items:center; justify-content:space-between;
  border-top:1px solid var(--mega-line-2);
  margin-top:24px;
  padding-top:14px;
}
.mega-view-all{
  display:inline-flex; align-items:center; gap:6px;
  font-size:13px; font-weight:600;
  color:var(--megabrand);
  transition:gap .15s;
}
.mega-view-all::after{
  content:'';
  width:6px; height:10px;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 6 11' fill='none' stroke='%235001be' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'><path d='M1 1l4 4.5L1 10'/></svg>");
  background-repeat:no-repeat; background-size:6px 10px;
}
.mega-view-all:hover{ gap:10px; }
.mega-footer .hint{ font-size:12px; color:var(--mega-text-3); }

.nav-main .nmDiv ul li .tit{
  font-size:16px !important;
  font-weight:700;
  color:var(--megabrand);
  text-transform:uppercase;
  letter-spacing:1px;
  padding-bottom:10px;
  margin-bottom:12px;
  border-bottom:2px solid var(--megabrand);
  display:flex;
  align-items:baseline;
}
.nav-main .nmDiv ul li .tit::after{
  content:'';
  display:inline-block;
  width:6px;
  height:10px;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 6 11' fill='none' stroke='%235001be' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'><path d='M1 1l4 4.5L1 10'/></svg>");
  background-repeat:no-repeat;
  background-size:6px 10px;
  margin-left:8px;
}

.nav-main:has(.nmDiv.ul-support.active),
.nav-main:has(.nmDiv.ul-aboutus.active){
  background:transparent !important;
  border-top:none !important;
  height:auto !important;
  overflow:visible !important;
}
.nav-main .nmDiv.ul-support,
.nav-main .nmDiv.ul-aboutus{
  height:auto !important;
  background:#fff !important;
}
.nav-main .nmDiv.ul-support.active,
.nav-main .nmDiv.ul-aboutus.active{
  display:block !important;
  border-bottom:1px solid var(--mega-line-2);
  box-shadow:0 8px 24px rgba(80,1,190,.08);
}
.nav-main .nmDiv.ul-support .autowidth,
.nav-main .nmDiv.ul-aboutus .autowidth{
  box-shadow:none !important;
  padding:32px 0 24px;
}
.nav-main .nmDiv.ul-support ul,
.nav-main .nmDiv.ul-aboutus ul{
  padding:0 !important;
  gap:36px;
}
.nav-main .nmDiv.ul-support ul li,
.nav-main .nmDiv.ul-aboutus ul li{
  width:auto !important;
  margin-right:0 !important;
  flex:1;
  min-width:0;
}
.nav-main .nmDiv.ul-support ul li:first-child{
  flex:1.6;
}
.nav-main .nmDiv.ul-support .phoneIconBox,
.nav-main .nmDiv.ul-aboutus .phoneIconBox{
  display:none;
}

.nav-main .nmDiv.ul-support a::after,
.nav-main .nmDiv.ul-aboutus a::after{
  content:none !important;
  background:none !important;
}
.nav-main .nmDiv.div-products a::after{
  content:none !important;
  background:none !important;
}

@media (min-width:1025px){
  .mega-mobile-panel{ display:none !important; }
}

@media (max-width:1024px){
  header .navUl, header .nav-ul, header .navFlex{ display:none !important; }
  header .headTop .mega-hamburger{ display:inline-flex; }
  header .headOther{ display:flex !important; align-items:center; gap:8px; }
  header .headOther .searchDiv{ display:flex !important; align-items:center; }
  header .headOther .lang05{ display:flex !important; align-items:center; }

  .mega-mobile-panel{
    display:none;
    position:absolute;
    top:var(--mega-top-h);
    left:0; right:0;
    height:calc(100vh - var(--mega-top-h));
    background:#fff;
    z-index:100;
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
  }
  .mega-mobile-panel.is-open{ display:block; }
  .mega-mobile-item{
    padding:16px 24px;
    font-size:15px;
    font-weight:700;
    color:var(--mega-text);
    border-bottom:1px solid var(--mega-line-2);
    display:flex;
    align-items:center;
    justify-content:space-between;
    cursor:pointer;
    transition:background .15s;
  }
  .mega-mobile-item:active{ background:var(--megabrand-50); }
  .mega-mobile-item .caret{
    width:0; height:0;
    border-left:4px solid transparent;
    border-right:4px solid transparent;
    border-top:5px solid currentColor;
    opacity:.5;
  }

  .mega-menu{
    position:absolute;
    top:var(--mega-top-h);
    left:0; right:0;
    bottom:auto;
    height:calc(100vh - var(--mega-top-h));
    max-height:none;
    margin-top:0;
    z-index:101;
    transition:none;
  }
  .homeBody .mega-menu{
    position:fixed;
    bottom:0;
    height:auto;
  }
  .homeBody .mega-mobile-panel{
    position:fixed;
    height:auto;
    bottom:0;
  }
  .mega-menu.is-open{
    display:block !important;
    opacity:1 !important;
    visibility:visible !important;
    pointer-events:auto !important;
  }
  .mega-backdrop{ display:none !important; }
  header.open .nav-main{
    background:transparent !important;
    height:auto !important;
    overflow:visible !important;
    position:absolute !important;
    top:var(--mega-top-h) !important;
    left:0 !important; right:auto !important;
    height:calc(100vh - var(--mega-top-h)) !important;
    bottom:auto !important;
    width:100% !important;
    z-index:101 !important;
  }
  .homeBody header.open .nav-main{
    position:fixed !important;
    right:0 !important;
    bottom:0 !important;
    height:auto !important;
  }
  .nav-main .nmDiv{
    background:#fff !important;
    display:none !important;
  }
  .nav-main .nmDiv.active{
    display:block !important;
    height:calc(100vh - var(--mega-top-h)) !important;
    overflow-y:auto !important;
    -webkit-overflow-scrolling:touch;
  }
  .nav-main .nmDiv .autowidth{
    width:100% !important;
    max-width:100% !important;
    padding:0 !important;
    box-shadow:none !important;
  }
  .nav-main .nmDiv .phoneIconBox{
    display:none !important;
  }
  .nav-main .nmDiv ul{
    display:block !important;
    padding:0 !important;
  }
  .nav-main .nmDiv ul li{
    width:100% !important;
    padding:16px 24px !important;
    border-bottom:1px solid var(--mega-line-2) !important;
    display:block !important;
  }
  .nav-main .nmDiv ul li .tit{
    font-size:15px !important;
    border-bottom:none !important;
    padding:0 !important;
    margin:0 0 12px 0 !important;
  }
  .nav-main .nmDiv .divAs{
    display:block !important;
    overflow:hidden !important;
  }
  .nav-main .nmDiv .divAs div,
  .nav-main .nmDiv .divAs a{
    display:block !important;
    width:100% !important;
    float:none !important;
    margin:0 0 2px 0 !important;
    padding:2px 0 !important;
    font-size:14px !important;
  }
  .nav-main .nmDiv .divAs a .desc{
    display:block !important;
    font-size:12px !important;
    color:#888 !important;
    line-height:1.4 !important;
    margin-top:2px !important;
  }
  .nav-main .nmDiv .divAs a .badge{
    display:inline-block !important;
    font-size:10px !important;
    color:#fff !important;
    background:var(--megabrand) !important;
    padding:1px 6px !important;
    border-radius:3px !important;
    margin-left:4px !important;
    vertical-align:middle !important;
  }
  .mega-inner{
    grid-template-columns:1fr;
    gap:0;
    padding:0;
    width:100%;
  }
  .mega-group{
    border-bottom:1px solid var(--mega-line-2);
    padding:0;
  }
  .mega-group-title{
    padding:18px 24px;
    margin:0;
    border-bottom:none;
    background:#fff;
    letter-spacing:.5px;
    justify-content:space-between;
    cursor:pointer;
    user-select:none;
  }
  .mega-group-title::after{
    content:'';
    width:8px; height:8px;
    border-right:2px solid var(--megabrand);
    border-bottom:2px solid var(--megabrand);
    transform:rotate(-45deg);
    transition:transform .2s;
    margin-left:auto;
  }
  .mega-group.is-open .mega-group-title::after{ transform:rotate(45deg); }
  .mega-group-body{
    max-height:0;
    overflow:hidden;
    transition:max-height .3s ease;
  }
  .mega-group.is-open .mega-group-body{ max-height:5000px !important; overflow:visible !important; }
  .mega-group-body-inner{ padding:4px 24px 20px; }
  .mega-item{ padding:14px 12px; }
  .mega-item .t{ font-size:16px; }
  .mega-item .d{ font-size:13px; }

  .mega-featured{
    grid-column:1;
    grid-row:auto;
    padding:20px 24px 24px;
  }
  .mega-featured-v3{ height:auto; min-height:320px; }

  .mega-footer{
    grid-column:1;
    grid-row:auto;
    padding:18px 24px;
    margin:0;
    flex-direction:column;
    align-items:flex-start;
    gap:6px;
  }
}

@media (max-width:640px){
  .mega-group-title{ padding:16px 18px; font-size:14px; }
  .mega-group-body-inner{ padding:4px 18px 18px; }
  .mega-featured{ padding:16px 18px 20px; }
  .mega-featured-v3{ padding:18px; min-height:auto; }
  .mega-featured-title{ font-size:18px; }
  .mega-featured-meta{ flex-wrap:wrap; gap:8px 14px; }
}