
.img--full{
    width: 100% !important;
    height: 100% !important;
    object-fit: cover;
}


@media only screen and (max-width: 420px){
    .standard-hero__logo{
        max-height: 112px;
    }

    .standard-hero__logo img{
        max-height: 112px;
    }
}


/* ============================================================
   Menu 3 cấp (Task 2) — override, nạp sau app.min.css
   (Desktop: menu CÓ cấp 3 -> mega 2 cột; menu không cấp 3 giữ 1 cột)
   ============================================================ */

/* Cấp 3: list con dưới mục cấp 2 (mọi breakpoint) */
.nav-right__sub{ list-style:none; margin:.6rem 0 0; padding:0; }
.nav-right__sub-item{ margin-top:.5rem; }
.nav-right__sub-item:first-child{ margin-top:0; }
.nav-right__sub-link{
    font-size:1.5rem; line-height:1.35; color:#5c666f;
    transition:color .3s ease-out;
}
.nav-right__sub-link:hover{ color:#ed0000; }

@media (min-width:1200px){
    /* Menu CÓ cấp 3: thu nhỏ ảnh trái, chừa chỗ cho 2 cột */
    .nav-menu__item.has-l3 .nav-sub__thumb{ max-width:34vw; }
    .nav-menu__item.has-l3 .nav-sub__body{ padding-left:40%; }

    /* 2 cột nhóm cấp-2 */
    .nav-menu__item.has-l3 .nav-right{
        columns:2; column-gap:6rem; width:100%; padding:0 2rem; margin:0;
    }
    .nav-menu__item.has-l3 .nav-right__item{
        display:inline-block; width:100%; margin:0 0 2.6rem;
        break-inside:avoid; -webkit-column-break-inside:avoid; page-break-inside:avoid;
    }
    .nav-menu__item.has-l3 .nav-right__item:first-child{ margin-top:0; }

    /* Cấp-2 thành tiêu đề nhóm (đậm, in hoa) */
    .nav-menu__item.has-l3 .nav-right__link{
        font-size:1.8rem; font-weight:700; text-transform:uppercase;
        color:#5c666f; display:inline-block; margin-bottom:.9rem;
    }
    .nav-menu__item.has-l3 .nav-right__sub-link{ font-size:1.5rem; }

    /* Cấp-2 có con không có link riêng (render ra <span>): không giả vờ bấm được.
       Ghi đè hover đỏ/đen của app.min.css (.is-desktop .nav-right__link:hover). */
    .nav-right__item.has-child > .nav-right__link,
    .is-desktop .nav-right__item.has-child > .nav-right__link:hover{
        cursor:default; color:#5c666f;
    }
}

/* Mobile (<1200): cấp-3 dạng accordion, ẩn tới khi chạm tiêu đề cấp-2 (có nút menu-l3.js).
   (2026-08-04: gỡ panel drill-down .m-drill của slide 6 theo yêu cầu khách — giữ accordion tại chỗ.) */
@media (max-width:1199px){
    .nav-right__item.has-child > .nav-right__link{
        display:block; position:relative; padding-right:2.5rem; cursor:pointer;
    }
    .nav-right__item.has-child > .nav-right__link::after{
        content:''; position:absolute; right:.4rem; top:50%;
        width:.8rem; height:.8rem; margin-top:-.6rem;
        border-right:2px solid currentColor; border-bottom:2px solid currentColor;
        transform:rotate(45deg); transition:transform .3s ease;
    }
    .nav-right__item.has-child.is-open > .nav-right__link::after{ transform:rotate(-135deg); }

    .nav-right__sub{ max-height:0; overflow:hidden; transition:max-height .35s ease; margin:0; padding-left:1.6rem; }
    .nav-right__item.has-child.is-open > .nav-right__sub{ max-height:200rem; margin:.6rem 0 .4rem; }
    .nav-right__sub-item{ margin-top:.8rem; }
}

/* Slide 7: dropdown điều hướng mobile = cây cấp-2 -> cấp-3 (accordion, mũi tên xổ). .nav-dropdown mobile-only. */
.nav-dropdown__body{ max-height:70vh; overflow-y:auto; }
.nav-dropdown__item.has-sub{ position:relative; padding-right:4rem; cursor:pointer; }
/* Cấp-2 có con không có link riêng (render ra <span>) — bấm cả dòng để xổ cấp-3. */
.nav-dropdown__item.has-sub > .nav-dropdown__link{ cursor:pointer; }
.nav-dropdown__arrow{ position:absolute; right:0; top:0; width:4rem; height:3.4rem; cursor:pointer; z-index:2; }
.nav-dropdown__arrow::after{
    content:''; position:absolute; right:1.2rem; top:1.1rem;
    width:.9rem; height:.9rem; border-right:2px solid #5c666f; border-bottom:2px solid #5c666f;
    transform:rotate(45deg); transition:transform .3s ease;
}
.nav-dropdown__item.is-open > .nav-dropdown__arrow::after{ transform:rotate(-135deg); }
/* Padding chỉ đặt ở trạng thái mở: max-height:0 vẫn giữ padding -> nhóm đóng chiếm ~10px thừa. */
.nav-dropdown__sub{ list-style:none; margin:0; padding:0 0 0 1.6rem; max-height:0; overflow:hidden; transition:max-height .3s ease; }
.nav-dropdown__item.is-open > .nav-dropdown__sub{ max-height:120rem; padding-top:.4rem; padding-bottom:.6rem; }
.nav-dropdown__sub-item{ padding:.5rem 0; }
.nav-dropdown__sub-link{ color:#5c666f; }
.nav-dropdown__item.is-active > .nav-dropdown__link,
.nav-dropdown__sub-item.is-active > .nav-dropdown__sub-link{ color:#ed0000; }

/* Thanh điều hướng section DESKTOP (.nav-more): mục cấp-2 có con không có link riêng,
   click xổ hàng menu con cấp-3 ngay dưới thanh (nền đen khớp thanh). Xử lý bởi menu-l3.js.

   Panel .nav-more__sub nằm NGOÀI .nav-more-wrap (xem render_section_nav) — cố ý:
   .nav-more-wrap phải giữ overflow:auto hidden để thanh dài còn cuộn ngang được
   (section "Mua xe" rộng ~1370px, ở viewport <=1355px mà bỏ cuộn là mất luôn 2 mục cuối).
   Nhờ vậy KHÔNG cần override overflow -> không phải đánh nhau với app.min.css
   (header.php nạp app.min.css lần 2 qua rel=preload/onload nên nó áp dụng SAU style.css). */
/* Panel là em của .nav-more-wrap chứ không nằm trong nó, nên KHÔNG hưởng
   .nav-more-wrap{display:none} của mobile -> phải tự ẩn, không thì lộ list cấp-3 trong header. */
.nav-more-subs{ display:none; }

@media (min-width:1200px){
    .header__foot{ position:relative; }

    .nav-more__item.has-sub > .nav-more__link{
        cursor:pointer; position:relative; display:inline-block; padding-right:1.6rem;
    }
    .nav-more__item.has-sub > .nav-more__link::after{
        content:''; position:absolute; right:0; top:50%;
        width:.7rem; height:.7rem; margin-top:-.5rem;
        border-right:2px solid currentColor; border-bottom:2px solid currentColor;
        transform:rotate(45deg); transition:transform .3s ease;
    }
    .nav-more__item.has-sub.is-open > .nav-more__link::after{ transform:rotate(-135deg); }

    .nav-more-subs{
        display:block; position:absolute; top:100%; left:0; right:0; z-index:10;
    }
    .nav-more__sub{
        display:none; margin:0; padding:1.2rem 2rem; list-style:none;
        background-color:#000;
        justify-content:center; align-items:center; flex-wrap:wrap; gap:1rem 3rem;
    }
    .nav-more__sub.is-open{ display:flex; }
    .nav-more__sub-link{
        display:block; white-space:nowrap;
        color:#fff; transition:color .3s ease-out;
    }
    .is-desktop .nav-more__sub-link:hover{ color:#ed0000; }
    .nav-more__sub-item.is-active > .nav-more__sub-link{ color:#ed0000; }
}

/* Khi mở menu chính (drawer) trên mobile: ẩn thanh điều hướng section (.header__foot)
   để mũi tên của nó không đè lên menu chính. */
@media (max-width:1199px){
    .header.is-show .header__foot{ display:none; }
}

