/*--------------------------------------------------------------
  # Mobile Nav
  --------------------------------------------------------------*/
.mobile-nav__wrapper {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    z-index: 999;
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
    -webkit-transform-origin: left center;
    transform-origin: left center;
    -webkit-transition: visibility 500ms ease 500ms, -webkit-transform 500ms ease 500ms;
    transition: visibility 500ms ease 500ms, -webkit-transform 500ms ease 500ms;
    transition: transform 500ms ease 500ms, visibility 500ms ease 500ms;
    transition: transform 500ms ease 500ms, visibility 500ms ease 500ms, -webkit-transform 500ms ease 500ms;
    visibility: hidden;
}

.mobile-nav__wrapper.expanded {
    opacity: 1;
    -webkit-transform: translateX(0%);
    transform: translateX(0%);
    visibility: visible;
    -webkit-transition: visibility 500ms ease 0ms, -webkit-transform 500ms ease 0ms;
    transition: visibility 500ms ease 0ms, -webkit-transform 500ms ease 0ms;
    transition: transform 500ms ease 0ms, visibility 500ms ease 0ms;
    transition: transform 500ms ease 0ms, visibility 500ms ease 0ms, -webkit-transform 500ms ease 0ms;
}

.mobile-nav__wrapper .container {
    padding-left: 0;
    padding-right: 0;
}

.mobile-nav__overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: var(--thm-black);
    opacity: 0.7;
    cursor: pointer;
}

.mobile-nav__content {
    position: relative;
    width: 300px;
    background-color: var(--thm-black);
    height: 100%;
    overflow-y: auto;
    padding-top: 30px;
    padding-bottom: 30px;
    padding-left: 20px;
    padding-right: 20px;
    opacity: 0;
    visibility: hidden;
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
    -webkit-transition: opacity 500ms ease 0ms, visibility 500ms ease 0ms, -webkit-transform 500ms ease 0ms;
    transition: opacity 500ms ease 0ms, visibility 500ms ease 0ms, -webkit-transform 500ms ease 0ms;
    transition: opacity 500ms ease 0ms, visibility 500ms ease 0ms, transform 500ms ease 0ms;
    transition: opacity 500ms ease 0ms, visibility 500ms ease 0ms, transform 500ms ease 0ms, -webkit-transform 500ms ease 0ms;
    z-index: 10;
}

.mobile-nav__wrapper.expanded .mobile-nav__content {
    opacity: 1;
    visibility: visible;
    -webkit-transform: translateX(0);
    transform: translateX(0);
    -webkit-transition: opacity 500ms ease 500ms, visibility 500ms ease 500ms, -webkit-transform 500ms ease 500ms;
    transition: opacity 500ms ease 500ms, visibility 500ms ease 500ms, -webkit-transform 500ms ease 500ms;
    transition: opacity 500ms ease 500ms, visibility 500ms ease 500ms, transform 500ms ease 500ms;
    transition: opacity 500ms ease 500ms, visibility 500ms ease 500ms, transform 500ms ease 500ms, -webkit-transform 500ms ease 500ms;
}

.mobile-nav__close {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    top: 20px;
    right: 15px;
    width: 40px;
    height: 40px;
    background-color: rgba(255, 255, 255, 0.3);
    color: #ffffff;
    font-size: 16px;
    cursor: pointer;
    transition: all 200ms linear;
    transition-delay: 0.1s;
}

.mobile-nav__close:hover {
    background-color: var(--thm-primary-color);
}

.mobile-nav__close i:before {
    position: relative;
    display: inline-block;
    transform: rotate(0deg);
}

.mobile-nav__content .logo-box {
    margin-bottom: 40px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}




.mobile-nav-search-box {
    position: relative;
    display: block;
    margin-bottom: 30px;
}

.mobile-nav-search-box form.search-form {
    position: relative;
    display: block;
    width: 100%;
}

.mobile-nav-search-box .search-form input[type="text"] {
    position: relative;
    display: block;
    width: 100%;
    height: 52px;
    background-color: #ffffff;
    border: 1px solid #ffffff;
    color: #909090;
    font-size: 16px;
    font-weight: 500;
    padding-left: 20px;
    padding-right: 60px;
    border-radius: 0px;
    font-family: var(--thm-font);
    transition: all 500ms ease 0s;
}

.mobile-nav-search-box .search-form button {
    position: absolute;
    top: 0px;
    right: 0px;
    bottom: 0px;
    width: 50px;
    height: 52px;
    color: #ffffff;
    font-size: 15px;
    background: rgba(var(--thm-primary-color-rgb), 0.80);
    text-align: center;
    border: 0px solid #e7e7e8;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
    transition: all 500ms ease 0s;
}

.mobile-nav-search-box .search-form button i {
    position: relative;
    top: 0px;
}

.mobile-nav-search-box .search-form input[type="text"]:focus {
    color: var(--thm-black);
}

.mobile-nav-search-box .search-form input[type="text"]:focus+button,
.mobile-nav-search-box .search-form button:hover {
    color: #ffffff;
    background-color: var(--thm-primary-color);
}

.mobile-nav-search-box .search-form input::-webkit-input-placeholder {
    color: rgba(var(--thm-black-rgb), .70);
}

.mobile-nav-search-box .search-form input:-moz-placeholder {
    color: rgba(var(--thm-black-rgb), .70);
}

.mobile-nav-search-box .search-form input::-moz-placeholder {
    color: rgba(var(--thm-black-rgb), .70);
}

.mobile-nav-search-box .search-form input:-ms-input-placeholder {
    color: rgba(var(--thm-black-rgb), .70);
}




.mobile-nav__container {
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.mobile-nav__container .menu-products-menus{
  display:flex;
  flex-direction:column;
  gap:12px;
  width:100%;
}
.mobile-nav__container .menu-products-menus > li{
  width:100%;
}

.mobile-nav__content .main-menu__list,
.mobile-nav__content .main-menu__list>li>ul,
.mobile-nav__content .main-menu__list>li>ul>li>ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
}

.mobile-nav__content .main-menu__list>li>ul,
.mobile-nav__content .main-menu__list>li>ul>li>ul {
    display: none;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    margin-left: 20px;
}

.mobile-nav__content .main-menu__list>li:not(:last-child),
.mobile-nav__content .main-menu__list>li>ul>li:not(:last-child),
.mobile-nav__content .main-menu__list>li>ul>li>ul>li:not(:last-child) {
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.mobile-nav__content .main-menu__list>li>a,
.mobile-nav__content .main-menu__list>li>ul>li>a,
.mobile-nav__content .main-menu__list>li>ul>li>ul>li>a {
    position: relative;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    line-height: 30px;
    color: #ffffff;
    font-size: 16px;
    font-family: var(--thm-font);
    font-weight: 500;
    height: 46px;
    transition: 500ms;
}

.mobile-nav__content .main-menu__list>li>ul>li>a {
    font-size: 15px;
    font-weight: 400;
}

.mobile-nav__content .main-menu__list>li>ul>li>ul>li>a {
    font-size: 14px;
    font-weight: 400;
}

.mobile-nav__content .main-menu__list>li>a.expanded,
.mobile-nav__content .main-menu__list>li>ul>li>a.expanded,
.mobile-nav__content .main-menu__list>li>ul>li>ul>li>a.expanded {
    color: var(--thm-primary-color);
}

.mobile-nav__content .main-menu__list>li>a>button,
.mobile-nav__content .main-menu__list>li>ul>li>a>button,
.mobile-nav__content .main-menu__list>li>ul>li>ul>li>a>button {
    width: 30px;
    height: 30px;
    background: rgba(var(--thm-primary-color-rgb), 0.3);
    border: none;
    outline: none;
    color: #fff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center;
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    -webkit-transition: -webkit-transform 500ms ease;
    transition: -webkit-transform 500ms ease;
    transition: transform 500ms ease;
    transition: transform 500ms ease, -webkit-transform 500ms ease;
    padding: 0;
}

.mobile-nav__content .main-menu__list>li>a>button.expanded,
.mobile-nav__content .main-menu__list>li>ul>li>a>button.expanded,
.mobile-nav__content .main-menu__list>li>ul>li>ul>li>a>button.expanded {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    color: var(--thm-primary-color);
}

.mobile-nav__content .home-showcase__title {
    background-color: rgba(255, 255, 255, 0.1);
    margin-top: 0px;
}



/* 
////////////////////////////
Mobile Nav Megamenu Css 
///////////////////////////
*/
.mobile-nav__wrapper .megamenu-content-box__inner {
    padding: 0px 0px;
    background-color: transparent;
    box-shadow: none;
}

.mobile-nav__wrapper .megamenu-content-box__inner::before {
    display: none;
}

.mobile-nav__wrapper .megamenu-box__inner {
    padding: 0px 0px;
    background-color: transparent;
    box-shadow: none;
}

.mobile-nav__wrapper .megamenu-content-box .row ul {
    margin-left: 0px;
}

.mobile-nav__wrapper .megamenu-content-box .row ul li {
    padding: 0 0px;
}

.mobile-nav__wrapper .megamenu-content-box .row ul li:not(:last-child) {
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    padding: 0 0px;
}

.mobile-nav__wrapper .megamenu-content-box .row ul li a {
    position: relative;
    display: block;
    height: 46px;
    font-size: 14px;
    font-weight: 400;
    line-height: 46px;
    color: var(--thm-white);
    padding: 0 0px;
    border-top: 0px solid var(--thm-border-color);
    font-family: var(--thm-font);
}

.mobile-nav__wrapper .megamenu-box .row {
    --bs-gutter-x: 20px;
    --bs-gutter-y: 0px;
}

.mobile-nav__wrapper .megamenu-box__inner .row [class*=col-] {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
}

/* Make standard desktop dropdowns visually match the Bands mega style
     - applied only on larger viewports to avoid interfering with mobile nav
     - keeps existing structural rules but gives white background, shadow and padding
*/
@media (min-width: 992px) {
    .main-menu .main-menu__list>li>ul,
    .stricky-header .main-menu__list>li>ul {
        position: absolute !important;
        left: 0 !important;
        right: 0 !important;
        top: 100% !important;
        background: #fff !important;
        border-top: 1px solid #eee !important;
        box-shadow: 0 14px 40px rgba(0,0,0,.12) !important;
        padding: 22px 24px !important;
        display: block !important;
        z-index: 9998 !important;
        width: 100% !important;
    }

    /* Give each top-level dropdown item a relaxed column-like layout; keeps compatibility with single-column menus */
    .main-menu .main-menu__list>li>ul > li,
    .stricky-header .main-menu__list>li>ul > li {
        display: inline-block !important;
        vertical-align: top !important;
        padding: 6px 16px !important;
        min-width: 180px !important;
    }

    .main-menu .main-menu__list>li>ul > li > a,
    .stricky-header .main-menu__list>li>ul > li > a {
        color: #111 !important;
        font-weight: 700 !important;
        display: block !important;
        padding: 4px 0 !important;
    }

    /* Ensure inner deeper uls keep their spacing but inherit light background */
    .main-menu .main-menu__list>li>ul>li>ul,
    .stricky-header .main-menu__list>li>ul>li>ul {
        background: transparent !important;
        box-shadow: none !important;
        border: none !important;
        display: block !important;
        padding: 0 !important;
    }
}

/* 确保二级菜单正常显示 - 全局修复（优先级提升） */
@media (min-width: 1200px) {
  /* 所有一级菜单项的下拉菜单 */
  .main-menu .main-menu__list > li > ul,
  .stricky-header .main-menu__list > li > ul {
    display: block !important;
    opacity: 0 !important;
    visibility: hidden !important;
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    min-width: 270px !important;
    background: #fff !important;
    border-top: 1px solid #eee !important;
    box-shadow: 0 14px 40px rgba(0,0,0,.12) !important;
    padding: 22px 24px !important;
    z-index: 9998 !important;
    transform: translateY(10px) !important;
    transition: opacity .3s ease, visibility .3s ease, transform .3s ease !important;
  }

  /* Hover 时显示二级菜单 */
  .main-menu .main-menu__list > li:hover > ul,
  .stricky-header .main-menu__list > li:hover > ul {
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateY(0) !important;
  }

  /* 二级菜单项样式 */
  .main-menu .main-menu__list > li > ul > li,
  .stricky-header .main-menu__list > li > ul > li {
    display: block !important;
    width: 100% !important;
    padding: 0 !important;
  }

  .main-menu .main-menu__list > li > ul > li > a,
  .stricky-header .main-menu__list > li > ul > li > a {
    display: block !important;
    padding: 10px 18px !important;
    color: #111 !important;
    font-weight: 700 !important;
    border-top: 1px solid var(--thm-border-color) !important;
    transition: all .3s ease !important;
  }

  .main-menu .main-menu__list > li > ul > li:first-child > a,
  .stricky-header .main-menu__list > li > ul > li:first-child > a {
    border-top: none !important;
  }

  .main-menu .main-menu__list > li > ul > li > a:hover,
  .stricky-header .main-menu__list > li > ul > li > a:hover {
    color: var(--thm-primary-color) !important;
    padding-left: 25px !important;
  }

  /* 三级菜单（如果有） */
  .main-menu .main-menu__list > li > ul > li > ul,
  .stricky-header .main-menu__list > li > ul > li > ul {
    display: none !important;
    position: absolute !important;
    left: 100% !important;
    top: 0 !important;
    min-width: 270px !important;
    background: #fff !important;
    box-shadow: 0 14px 40px rgba(0,0,0,.12) !important;
    padding: 8px 0 !important;
  }

  .main-menu .main-menu__list > li > ul > li:hover > ul,
  .stricky-header .main-menu__list > li > ul > li:hover > ul {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
  }
}





.mobile-nav__contact {
    position: relative;
    display: block;
    margin-top: 40px;
    margin-bottom: 30px;
}

.mobile-nav__contact li {
    position: relative;
    display: flex;
    align-items: center;
    color: #ffffff;
    font-size: 15px;
    font-weight: 500;
}

.mobile-nav__contact li+li {
    margin-top: 15px;
}

.mobile-nav__contact li a {
    color: #ffffff;
    -webkit-transition: 500ms;
    transition: 500ms;
}

.mobile-nav__contact li a:hover {
    color: var(--thm-primary-color);
}

.mobile-nav__contact li>i {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 0%;
    background-color: rgba(255, 255, 255, 0.1);
    color: #fff;
    font-size: 12px;
    margin-right: 10px;
}


.mobile-nav__top {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 30px;
}

.mobile-nav__social {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.mobile-nav__social a {
    position: relative;
    display: block;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, 0.1);
    color: #ffffff;
    font-size: 16px;
    line-height: 40px;
    text-align: center;
    transition: 500ms;
}

.mobile-nav__social a+a {
    margin-left: 10px;
}

.mobile-nav__social a:hover {
    color: var(--thm-primary-color);
    background-color: #ffffff;
}


/* no menu after 2rd level dropdown */
.mobile-nav__content .main-menu__list>li>ul>li>ul>li>a>button,
.mobile-nav__content .main-menu__list>li>ul>li>ul>li>ul {
    display: none !important;
}

@media (min-width: 1367px) {
  .mobile-nav__wrapper,
  body.mobile-menu-visible .mobile-nav__wrapper {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    transform: translateX(-100%) !important;
  }
}

/*--------------------------------------------------------------
# Main Header Css
--------------------------------------------------------------*/
.main-header {
    position: relative;
    display: block;
    width: 100%;
    background: transparent;
    -webkit-transition: all 500ms ease;
    transition: all 500ms ease;
    z-index: 99;
}

.main-menu {
    position: relative;
    display: block;
}

.main-menu__wrapper {
    position: relative;
    display: block;
}

.main-menu__wrapper-inner {
    display: flex;
    align-items: center;
}

.main-menu-box {
    display: block;
    float: none;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

.main-menu .main-menu__list,
.main-menu .main-menu__list>li>ul,
.main-menu .main-menu__list>li>ul>li>ul,
.stricky-header .main-menu__list,
.stricky-header .main-menu__list>li>ul,
.stricky-header .main-menu__list>li>ul>li>ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: none;
}

@media (min-width: 1200px) {

    .main-menu .main-menu__list,
    .main-menu .main-menu__list>li>ul,
    .main-menu .main-menu__list>li>ul>li>ul,
    .stricky-header .main-menu__list,
    .stricky-header .main-menu__list>li>ul,
    .stricky-header .main-menu__list>li>ul>li>ul {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }
    
    .main-menu .main-menu__list,
    .stricky-header .main-menu__list {
        justify-content: center;
    }
}



.main-menu .main-menu__list>li,
.stricky-header .main-menu__list>li {
    position: relative;
    padding-top: 27px;
    padding-bottom: 27px;
}

.main-menu .main-menu__list>li+li,
.stricky-header .main-menu__list>li+li {
    margin-left: 20px;
}

.main-menu .main-menu__list>li>a,
.stricky-header .main-menu__list>li>a {
    position: relative;
    display: inline-block;
    color: var(--thm-white);
    font-size: 16px;
    line-height: 20px;
    font-weight: 700;
    text-transform: uppercase;
    font-family: var(--thm-font-2);
    -webkit-transition: all 500ms ease;
    transition: all 500ms ease;
}

.main-menu .main-menu__list>li.current>a,
.main-menu .main-menu__list>li:hover>a,
.stricky-header .main-menu__list>li.current>a,
.stricky-header .main-menu__list>li:hover>a {
    color: var(--thm-primary-color);
}

/* Reset Preowned menu item to standard theme colors (it had a forced red inline color) */
.main-menu .main-menu__list>li>a[href*="preowned" i],
.main-menu .main-menu__list>li>a[href*="pre-owned" i],
.stricky-header .main-menu__list>li>a[href*="preowned" i],
.stricky-header .main-menu__list>li>a[href*="pre-owned" i],
body.home .main-menu .main-menu__list>li:nth-last-child(3)>a,
body.home .stricky-header .main-menu__list>li:nth-last-child(3)>a {
    color: var(--thm-white) !important;
}
.main-menu .main-menu__list>li:hover>a[href*="preowned" i],
.main-menu .main-menu__list>li:hover>a[href*="pre-owned" i],
.main-menu .main-menu__list>li.current>a[href*="preowned" i],
.main-menu .main-menu__list>li.current>a[href*="pre-owned" i],
.stricky-header .main-menu__list>li:hover>a[href*="preowned" i],
.stricky-header .main-menu__list>li:hover>a[href*="pre-owned" i],
.stricky-header .main-menu__list>li.current>a[href*="preowned" i],
.stricky-header .main-menu__list>li.current>a[href*="pre-owned" i],
body.home .main-menu .main-menu__list>li:nth-last-child(3):hover>a,
body.home .main-menu .main-menu__list>li:nth-last-child(3).current>a,
body.home .stricky-header .main-menu__list>li:nth-last-child(3):hover>a,
body.home .stricky-header .main-menu__list>li:nth-last-child(3).current>a {
    color: var(--thm-primary-color) !important;
}

.main-menu .main-menu__list>li.dropdown>a,
.stricky-header .main-menu__list>li.dropdown>a {
    padding-right: 18px;
}

.main-menu .main-menu__list>li.dropdown>a:after {
    position: absolute;
    right: -2px;
    font-family: 'icomoon' !important;
    content: "\e907" !important;
    color: var(--thm-white);
    font-size: 12px;
    font-weight: 400;
    transform: rotate(0deg);
    transition: all 200ms linear;
    transition-delay: 0.1s;
    z-index: 1;
}

.main-menu .main-menu__list>li.current.dropdown>a:after,
.main-menu .main-menu__list>li:hover.dropdown>a:after,
.stricky-header .main-menu__list>li.current.dropdown>a:after,
.stricky-header .main-menu__list>li:hover.dropdown>a:after {
    color: var(--thm-primary-color);
}


.main-menu .main-menu__list>li.dropdown>a::before {
    position: absolute;
    right: -5px;
    font-family: 'icomoon' !important;
    content: "\e904" !important;
    color: #a5b1ad;
    font-size: 10px;
    font-weight: 400;
    transform: rotate(0deg);
    transition: -webkit-transform 0.4s ease;
    transition: transform 0.4s ease;
    transition: transform 0.4s ease, -webkit-transform 0.4s ease;
    transform-origin: bottom right;
    -webkit-transform: scale(0, 1);
    transform: scale(0, 1);
    z-index: 1;
    display: none;
}

.main-menu .main-menu__list>li.current.dropdown>a:before,
.main-menu .main-menu__list>li:hover.dropdown>a:before,
.stricky-header .main-menu__list>li.current.dropdown>a:before,
.stricky-header .main-menu__list>li:hover.dropdown>a:before {
    color: var(--thm-primary-color);
    -webkit-transform: scale(1, 1);
    transform: scale(1, 1);
    transform-origin: left center;
}




.main-menu .main-menu__list>li>ul,
.main-menu .main-menu__list>li>ul>li>ul,
.stricky-header .main-menu__list>li>ul,
.stricky-header .main-menu__list>li>ul>li>ul {
    position: absolute;
    /* vertically center popup relative to parent link */
    top: 50%;
    left: 50%;
    min-width: 270px;
    padding: 8px 0px 8px;
    background-color: var(--thm-white);
    -ms-flex-direction: column;
    flex-direction: column;
    opacity: 0;
    visibility: hidden;
    /* use translate + scaleY for centered open/close animation */
    transform-origin: center center;
    transform: translate(-50%, -50%) scaleY(0);
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    box-shadow: none;
    z-index: 99;
}



.main-menu .main-menu__list>li>ul:before,
.main-menu .main-menu__list>li>ul>li>ul:before,
.stricky-header .main-menu__list>li>ul:before,
.stricky-header .main-menu__list>li>ul>li>ul:before {
    content: "";
    position: absolute;
    top: 0px;
    left: 0;
    bottom: 0;
    right: 0;
    background-color: var(--thm-white);
    box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.15);
    z-index: -1;
}

.main-menu .main-menu__list>li:hover>ul,
.main-menu .main-menu__list>li>ul>li:hover>ul,
.stricky-header .main-menu__list>li:hover>ul,
.stricky-header .main-menu__list>li>ul>li:hover>ul {
    opacity: 1;
    visibility: visible;
    transform: scale(1);
}

/* Fix submenu horizontal offset: center submenu under its parent link to avoid visual shift
     when the top menu is centered or when items wrap. This keeps the dropdown aligned to the
     parent anchor instead of drifting left/right. */
.main-menu .main-menu__list>li:hover>ul,
.main-menu .main-menu__list>li>ul>li:hover>ul,
.stricky-header .main-menu__list>li:hover>ul,
.stricky-header .main-menu__list>li>ul>li:hover>ul {
    opacity: 1;
    visibility: visible;
    transform: translate(-50%, -50%) scaleY(1);
}

/* Special case: make the second-last top-level menu expand horizontally on large screens
     to avoid vertical overflow when it contains many items. We align the horizontal panel
     to the parent's right edge (so it grows left-to-right inside viewport). */
@media (min-width: 1200px) {
    /* Apply the previous Bands (second-to-last) horizontal dropdown layout to all dropdowns */
    .main-menu .main-menu__list>li > ul,
    .stricky-header .main-menu__list>li > ul {
        display: flex !important;
        flex-direction: row !important;
        left: auto !important;
        right: 0 !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        min-width: 360px;
        max-width: 80vw;
        white-space: nowrap;
        padding: 8px 12px !important;
        transform-origin: center right;
        box-shadow: 0 6px 20px rgba(0,0,0,0.12);
    }
    .main-menu .main-menu__list>li > ul > li,
    .stricky-header .main-menu__list>li > ul > li {
        display: block;
        width: auto;
        padding: 0 12px;
    }
    /* Make nested groups stack vertically inside each column */
    .main-menu .main-menu__list>li > ul > li > ul {
        display: block !important;
        position: static !important;
        transform: none !important;
        opacity: 1 !important;
        visibility: visible !important;
        background: transparent !important;
        box-shadow: none !important;
        padding: 0 !important;
    }
}

.main-menu .menu-products-menus,
.stricky-header .menu-products-menus{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  align-items:flex-start;
}
.main-menu .menu-products-menus > li,
.stricky-header .menu-products-menus > li{
  flex:0 0 auto;
}

@media (min-width: 992px){
  /* Force desktop sub-menus into 6-row column grid; wrap after 6 items per column */
  .main-menu .main-menu__list > li > ul,
  .main-menu .main-menu__list > li > .sub-menu,
  .main-menu .main-menu__list li > ul.sub-menu,
  .stricky-header .main-menu__list > li > ul,
  .stricky-header .main-menu__list > li > .sub-menu,
  .stricky-header .main-menu__list li > ul.sub-menu{
    display: grid !important;
    /* 关键：固定6行，高度由内容决定(min-content)，不足6个时空行不占位 */
    grid-template-rows: repeat(6, min-content);
    /* 关键：纵向优先填充，填满6行后自动换到下一列 */
    grid-auto-flow: column;
    grid-auto-columns: max-content;
    align-items: start;
    align-content: start;
    justify-content: flex-start;
    gap: 0 30px; /* 列间距 30px */
    padding: 15px 20px !important;
    width: auto !important;
    min-width: 200px !important;
    max-width: 90vw !important;
    white-space: nowrap !important;
    left: auto !important;
    right: 0 !important;
    top: 100% !important;
    transform: none !important;
    background-color: #fff !important;
    box-shadow: 0 14px 40px rgba(0,0,0,.12) !important;
    border-top: 1px solid #eee !important;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease-in-out;
  }

  /* Hover state */
  .main-menu .main-menu__list > li:hover > ul,
  .stricky-header .main-menu__list > li:hover > ul {
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
  }

  .main-menu .main-menu__list > li > ul > li,
  .main-menu .main-menu__list > li > .sub-menu > li,
  .main-menu .main-menu__list li > ul.sub-menu > li,
  .stricky-header .main-menu__list > li > ul > li,
  .stricky-header .main-menu__list > li > .sub-menu > li,
  .stricky-header .main-menu__list li > ul.sub-menu > li{
    display: block !important;
    padding: 0 !important;
    margin: 0 !important;
    width: auto !important;
    border: none !important;
  }

  .main-menu .main-menu__list > li > ul > li > a,
  .main-menu .main-menu__list > li > .sub-menu > li > a,
  .main-menu .main-menu__list li > ul.sub-menu > li > a,
  .stricky-header .main-menu__list > li > ul > li > a,
  .stricky-header .main-menu__list > li > .sub-menu > li > a,
  .stricky-header .main-menu__list li > ul.sub-menu > li > a{
    font-size: 14px !important; /* 调小字体 */
    font-weight: 400 !important; /* 取消加粗 */
    line-height: 1.5;
    padding: 6px 0 !important;
    color: #111 !important;
    display: block;
    transition: all 0.3s ease;
    border: none !important;
    text-transform: none !important;
  }

  .main-menu .main-menu__list > li > ul > li > a:hover,
  .stricky-header .main-menu__list > li > ul > li > a:hover {
      color: var(--thm-primary-color) !important;
      padding-left: 5px !important;
  }

  /* Hide 3rd level menus */
  .main-menu .main-menu__list > li > ul > li > ul,
  .stricky-header .main-menu__list > li > ul > li > ul {
      display: none !important;
  }
}
