@media (max-width: 1200px) {
    .main-header.header-style-two .header-upper .logo {
        transform: translateY(-30px) !important;
    }
    .header-top .auto-container{
        padding: 0 20px 0 20px !important;
    }
    .header-logo-dynamic{
        display: none;
    }
    .main-header.header-style-two .header-top .mobile-nav-toggler,
    .main-header.header-style-two .sticky-header .header-top .mobile-nav-toggler {
        display: block !important;
        float: none;
        margin: unset;
        margin-left: 0 !important;
        align-self: flex-start;
    }
    .main-menu{
        display: none;
    }
}
@media (max-width: 991px) {
    .header-top {
        display: block !important;
        position: relative;
        padding: 5px 0;
    }
    .header-top .info-list {
        display: flex;
        justify-content: space-around;
        align-items: center;
        margin: 0;
        padding: 0;
    }
    .header-top .info-list li {
        font-size: 11px;
        margin: 0 5px;
    }
    .header-top .info-list li a i {
        margin-right: 3px;
    }

    /* Mobile/Tablet: sticky-header trượt mượt từ trên xuống (không giật).
       Override cơ chế opacity/visibility/z-index của theme để chỉ dùng transform. */
    .main-header .sticky-header {
        display: block !important;
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;
        box-sizing: border-box;

        /* Ép trạng thái hiển thị ổn định, dùng transform để ẩn/hiện */
        visibility: visible !important;
        opacity: 1 !important;
        z-index: 99901 !important;

        transform: translate3d(0, -110%, 0);
        transition: transform 320ms ease;
        will-change: transform;
        pointer-events: none;
    }

    .main-header.fixed-header .sticky-header {
        transform: translate3d(0, 0, 0);
        pointer-events: auto;
    }
    .main-header.header-style-one .header-upper .inner-container, .header-upper .inner-container {
        padding-top: 5px;
        padding-bottom: 0px;
    }
    .nav-outer .mobile-nav-toggler{
        margin: 0px;
        margin-left: 15px !important;
    }
}
@media (max-width: 860px) {
    
}
/* Responsive */
@media (max-width: 768px) {
    .upper-box{
        margin-top: 20px;
    }
    .contact-widget-two {
        flex-direction: column;
    }
    .contact-widget-two .image {
        width: 100%;
        height: 200px;
    }
    #cookieConsent {
        flex-direction: column;
        text-align: center;
        padding: 14px;
    }
    #cookieConsent .cookie-actions {
        width: 100%;
        justify-content: center;
    }
}
@media (max-width: 650px) {
    .header-top .info-list {
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;
        gap: 10px;
        margin-left: 0;
    }
    .main-header.header-style-two .header-upper .logo {
        transform: translateY(-11px) !important;
    }

    .scroll-to-top{
        right: 10px;
        bottom: 50px;
        width: 43px;
        height: 44px;
        font-size: 15px;
        line-height: 47px;
    }
}

/* Khóa đồng nhất nav mobile giữa trạng thái thường và sticky */
@media (max-width: 767.98px) {
    /* Biến chung mobile: áp dụng mọi trang */
    .main-header {
        --mobile-top-padding-y: 5px;
        --mobile-top-container-x: 12px;
        --mobile-top-right-padding-y: 10px;
        --mobile-top-right-padding-bottom: 10px;
        --mobile-top-skew-left: -5px;
        --mobile-top-skew-width: 500%;
    }

    .main-header .sticky-header,
    .main-header.fixed-header .sticky-header {
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;
        box-sizing: border-box;
    }

    .main-header .header-top,
    .main-header .sticky-header .header-top,
    .main-header.fixed-header .sticky-header .header-top {
        padding: var(--mobile-top-padding-y) 0 !important;
    }

    .main-header .header-top .auto-container,
    .main-header .sticky-header .header-top .auto-container,
    .main-header.fixed-header .sticky-header .header-top .auto-container {
        max-width: 100% !important;
        padding-left: var(--mobile-top-container-x) !important;
        padding-right: var(--mobile-top-container-x) !important;
    }

    .main-header .header-top .wrapper-box,
    .main-header .sticky-header .header-top .wrapper-box,
    .main-header.fixed-header .sticky-header .header-top .wrapper-box {
        justify-content: flex-start !important;
    }

    

    .main-header .header-top .right-column:before,
    .main-header .sticky-header .header-top .right-column:before,
    .main-header.fixed-header .sticky-header .header-top .right-column:before {
        left: var(--mobile-top-skew-left) !important;
        width: var(--mobile-top-skew-width) !important;
    }
}

/* Final sync: sticky header-top must match top header */
@media (max-width: 767.98px) {
    .main-header .header-top,
    .main-header.fixed-header .sticky-header .header-top {
        padding: 5px 0 !important;
    }

    .main-header .header-top .auto-container,
    .main-header.fixed-header .sticky-header .header-top .auto-container {
        max-width: 100% !important;
        padding-left: 12px !important;
        padding-right: 12px !important;
    }

    .main-header .header-top .wrapper-box,
    .main-header.fixed-header .sticky-header .header-top .wrapper-box {
        justify-content: flex-start !important;
    }

    .main-header .header-top .right-column,
    .main-header.fixed-header .sticky-header .header-top .right-column {
        margin-left: auto !important;
        padding: var(--mobile-top-right-padding-y) 0 var(--mobile-top-right-padding-bottom) !important;
    }

    .main-header .header-top .right-column:before,
    .main-header.fixed-header .sticky-header .header-top .right-column:before {
        width: 500% !important;
        transform: skewX(40deg) !important;
    }
}
@media(max-width: 520px){
    .main-header.header-style-two .header-top .right-column{
        margin-left: 28% !important;
        width: 89%;
    }
    .main-header.header-style-two > .header-top .auto-container{
        padding-left: 20px !important;
        padding-right: 0px !important;
    }
    .left-column{
        padding-left: unset;
    }
    .pb-rp{
        padding-bottom: 0px;
    }
    .mb-rp{
        margin-bottom: 30px;
    }
}
@media(max-width: 420px){
    .header-top .info-list li{
        margin-left: 24px !important;
    }
    .main-header.header-style-two > .header-top .auto-container{
        padding-left: 12px !important;
        padding-right: 0px !important;
    }
    .menu-mobi{
        height: 20px;
        width: 31px;
    }
    .main-header.header-style-two .header-top .right-column{
        margin-left: 24% !important;
        width: 89%;
    }
}