body {
        #top {
                background-image: linear-gradient(to bottom, #2c2c2c, #1a1a1a);
                background-repeat: repeat-x;
                border: 1px solid #1a1a1a;
                border-color: #1a1a1a #1a1a1a #000000;
                --bs-bg-opacity: 1;
                background-color: rgba(var(--bs-dark-rgb), var(--bs-bg-opacity));
                margin-bottom: 0;
                padding: 0;
                border: 0;
                height: 50px;
                color: #fff;
        }
}

.header_container {
        width: 100%;
        max-width: unset;
        padding: 0;
        background-color: #fff;
        background-image: none;
        border: none;
        box-shadow: none;
}

.header_container #menu {
        background-color: #fff !important;
        background-image: none;
        border: none;
        box-shadow: none;
}

.header_container #menu .navbar-nav>li>a {
        text-shadow: none;
}

#menu {
        border-radius: 0;
        height: 80px;
        margin: 0;
        max-width: 1440px;
        margin: auto;
        border-left: none;
        border-right: none;
        text-transform: uppercase;
}

#menu .navbar-collapse {
        align-items: center;
}

#menu .navbar-nav {
        flex: 1;
}

.menu-talk-btn-wrap {
        flex-shrink: 0;
        margin-left: auto;
        padding: 10px 0;
}

.menu-talk-btn {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        background-color: #FF2F2F;
        color: #fff;
        border: none;
        padding: 12px 20px;
        font-family: Jost, sans-serif;
        font-size: 14px;
        font-weight: 600;
        letter-spacing: 0.5px;
        line-height: 1;
        cursor: pointer;
        white-space: nowrap;
        transition: background-color 0.2s ease;
}

.menu-talk-btn:hover,
.menu-talk-btn:focus {
        background-color: #E62828;
        color: #fff;
}

.menu-talk-btn-icon {
        display: block;
        width: 20px;
        height: 20px;
        flex-shrink: 0;
}

html.header-quote-locked,
body.header-quote-locked {
        overflow: hidden;
}

#top .list-inline-item>a, #top .list-inline-item .dropdown>a {
        line-height: 50px;
        color: white;
}

#menu .navbar-nav>li>a {
        color: black;
        font-family: Jost;
        font-size: 16px;
        font-style: normal;
        font-weight: 350;
        line-height: normal;
}

#menu .dropdown-menu.menu-dropdown-l2 {
        min-width: 240px;
        padding: 0.5rem 0;
        overflow: visible;
}

#menu .menu-level2-item {
        position: relative;
}

#menu .menu-level2-link {
        display: flex;
        align-items: center;
        justify-content: space-between;
        white-space: nowrap;
}

#menu .menu-level1-toggle {
        cursor: default;
}

@media screen and (max-width: 991px) {
        #menu .menu-level1-toggle {
                cursor: pointer;
        }
}

#menu .menu-submenu-icon {
        font-size: 0.7em;
        margin-left: 12px;
        opacity: 0.6;
}

#menu .menu-has-children > .menu-level2-link:hover {
        transform: none;
}

#menu .menu-level2-link:hover,
#menu .menu-level3 .dropdown-item:hover {
        transform: none;
}

.dropdown-item {
        /* 1. 先在原状态定义好过渡：监听所有属性（或 transform），耗时 0.2s，平滑过渡 */
        transition: transform 0.2s ease-in-out;
}

.dropdown-item.hover, .dropdown-item:hover {
        color: red;
        transform: translateX(10px);
}

.dropdown-item.active, .dropdown-item:active {
        color: var(--bs-dropdown-link-active-color);
        background-color: var(--bs-dropdown-link-active-color);
        text-decoration: none;

}


#content .fa-solid {
        color: white;
}
@media screen and (max-width: 991px) {
        /* 当屏幕宽度小于 992px 时，这里的样式会生效 */
        #menu {
                border-radius: 0;
                margin: 0;
                height: auto;
        }

        #menu .menu-level1-toggle.dropdown-toggle::after {
                display: none;
        }

        #menu .menu-level1-icon {
                font-size: 0.7em;
                transition: transform 0.2s ease;
        }

        #menu .nav-item.dropdown.is-open > .menu-level1-toggle .menu-level1-icon {
                transform: rotate(180deg);
        }

        #menu .dropdown-menu {
                display: none !important;
                position: static !important;
                float: none;
                width: 100%;
                margin: 0;
                border: none;
                box-shadow: none;
                visibility: visible !important;
                opacity: 1 !important;
                transform: none !important;
                transition: none;
                padding: 0 0 0.5rem 1rem;
        }

        #menu .nav-item.dropdown.is-open > .dropdown-menu {
                display: block !important;
        }

        #menu .dropdown:hover .dropdown-menu {
                display: none !important;
        }

        #menu .nav-item.dropdown.is-open:hover > .dropdown-menu {
                display: block !important;
        }

        #menu .menu-level2-link {
                white-space: normal;
        }

        #menu .menu-level3 {
                display: none;
                padding-left: 1rem;
                background-color: rgba(0, 0, 0, 0.03);
        }

        #menu .menu-level2-item.is-open > .menu-level3 {
                display: block;
        }

        #menu .menu-level2-item.is-open .menu-submenu-icon {
                transform: rotate(90deg);
        }

        .menu-talk-btn-wrap {
                width: 100%;
                margin-left: 0;
                padding: 12px 0 4px;
        }

        .menu-talk-btn {
                width: 100%;
                justify-content: center;
        }

}

@media screen and (min-width: 992px) {
        #menu .dropdown-menu.menu-dropdown-l2 {
                overflow: visible !important;
        }

        #menu .menu-level3 {
                position: absolute;
                left: 100%;
                top: 0;
                min-width: 220px;
                margin-left: 0;
                background-color: #fff;
                border: 1px solid rgba(0, 0, 0, 0.08);
                box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
                padding: 0.5rem 0;
                visibility: hidden;
                opacity: 0;
                pointer-events: none;
                z-index: 1040;
                transition: opacity 0.15s ease, visibility 0.15s ease;
        }

        #menu .menu-level3-footer .dropdown-divider {
                margin: 0.25rem 0;
        }

        #menu .menu-level3::before {
                content: '';
                position: absolute;
                left: -12px;
                top: 0;
                width: 12px;
                height: 100%;
        }

        #menu .menu-has-children:hover > .menu-level3 {
                visibility: visible;
                opacity: 1;
                pointer-events: auto;
        }
}

@media screen and (min-width: 1025px) {
        #site-header {
                z-index: 1030;
                width: 100%;
                transition: transform 0.3s ease-in-out;
        }

        #site-header.is-fixed {
                position: fixed;
                top: 0;
                left: 0;
                right: 0;
                box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
        }

        #site-header.is-fixed.is-hidden {
                transform: translateY(-100%);
        }

        #site-header.is-fixed.is-visible {
                transform: translateY(0);
        }

        #site-header-placeholder {
                display: none;
        }
}

/* Contact form toast */
.contact-form-toast {
        position: fixed;
        left: 50%;
        top: 20px;
        z-index: 10050;
        display: flex;
        align-items: center;
        gap: 14px;
        max-width: calc(100% - 40px);
        padding: 12px 24px 12px 14px;
        background: #ffffff;
        border-radius: 999px;
        box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
        opacity: 0;
        pointer-events: none;
        transform: translate(-50%, calc(-100% - 24px));
        transition: transform 0.45s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.35s ease, top 0.2s ease;
}

.contact-form-toast.is-visible {
        opacity: 1;
        transform: translate(-50%, 0);
}

.contact-form-toast.is-leaving {
        opacity: 0;
        transform: translate(-50%, -12px);
        transition: transform 0.35s ease, opacity 0.35s ease, top 0.2s ease;
}

.contact-form-toast-icon {
        width: 34px;
        height: 34px;
        border-radius: 50%;
        flex-shrink: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #ffffff;
        font-size: 18px;
        font-weight: 700;
        line-height: 1;
}

.contact-form-toast--success .contact-form-toast-icon {
        background-color: #28b446;
}

.contact-form-toast--success .contact-form-toast-icon::before {
        content: '\2713';
}

.contact-form-toast--error .contact-form-toast-icon {
        background-color: #e53935;
}

.contact-form-toast--error .contact-form-toast-icon::before {
        content: '\00d7';
        font-size: 22px;
}

.contact-form-toast-content {
        display: flex;
        flex-direction: column;
        gap: 2px;
        min-width: 0;
}

.contact-form-toast-message {
        font-size: 14px;
        font-weight: 600;
        line-height: 1.35;
        color: #111111;
}

.contact-form-toast-countdown {
        font-size: 12px;
        line-height: 1.3;
        color: #666666;
}

/* Contact form shared field widths (home / about / contact / quote modals) */
:root {
        --contact-form-field-gap: 16px;
}

.home-form-form-grid,
.product-quote-form .product-quote-row {
        gap: var(--contact-form-field-gap);
}

.home-form-input-group,
.product-quote-form .product-quote-row > .contact-form-field,
.product-quote-form .product-quote-row > .product-quote-select-wrapper,
.product-quote-form .product-quote-row > .product-quote-field,
.product-quote-form .product-quote-row > .product-quote-input {
        flex: 1 1 calc(50% - var(--contact-form-field-gap) / 2);
        min-width: 0;
        box-sizing: border-box;
}

.home-form-textarea-group,
.product-quote-form > .contact-form-field {
        flex: 0 0 100%;
        width: 100%;
        min-width: 0;
}

.home-form-input,
.home-form-select,
.product-quote-row .product-quote-input,
.product-quote-row .product-quote-select,
.product-quote-row .product-quote-combobox,
.product-quote-row .product-quote-combobox-input {
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
}

@media (max-width: 767px) {

        .home-form-input-group,
        .product-quote-form .product-quote-row > .contact-form-field,
        .product-quote-form .product-quote-row > .product-quote-select-wrapper,
        .product-quote-form .product-quote-row > .product-quote-field,
        .product-quote-form .product-quote-row > .product-quote-input {
                flex: 0 0 100%;
                width: 100%;
                max-width: 100%;
        }
}