/* P23-B: adapted from actual VinFast gx-navbar + gx-product-mega DOM.
 * Every rule is scoped to #qn23-header to isolate Transport's 20+ historical stylesheets.
 * Original QN SEO/backend is unchanged. */
#qn23-header{--qn23-blue:#347fbd;--qn23-navy:#102d4a;--qn23-border:#e4eaf2;--qn23-hotline:#367ebb;position:relative;z-index:5000;width:100%;background:#f7faff;color:#162a40;box-sizing:border-box;font-family:inherit}
#qn23-header *,#qn23-header *::before,#qn23-header *::after{box-sizing:border-box}
#qn23-header .gx-navbar{position:relative;width:100%;background:#f6faff;border-bottom:1px solid #e7eef5;box-shadow:0 1px 8px rgba(14,53,86,.05)}
#qn23-header .gx-shell{display:flex;align-items:center;justify-content:space-between;gap:14px;max-width:1280px;width:calc(100% - 40px);height:72px;margin-inline:auto;padding:0}
#qn23-header .gx-left-zone,#qn23-header .gx-right-zone{display:flex;align-items:center;min-width:0;gap:13px}
#qn23-header .gx-left-zone{flex:1 1 auto}
#qn23-header .gx-right-zone{flex:0 0 auto;margin-left:auto}
#qn23-header .gx-brand{display:flex;align-items:center;flex:0 0 auto;max-width:230px}
#qn23-header .gx-logo-link{display:flex;align-items:center;text-decoration:none;color:#152c42}
#qn23-header .gx-logo-box{display:inline-flex;align-items:center;gap:10px;max-width:230px}
#qn23-header .gx-logo-img{object-fit:contain;object-position:left;width:auto;height:auto;max-height:50px;max-width:225px;display:block}
#qn23-header .qn23-logo-initials{display:grid;place-items:center;width:46px;height:46px;color:#fff;background:#e82437;font-size:15px;font-weight:800;border-radius:5px;flex:none}
#qn23-header .qn23-logo-name{font-size:16px;line-height:1.2;font-weight:800;white-space:nowrap}
#qn23-header .gx-desktop-menu{min-width:0}
#qn23-header .gx-desktop-menu ul{display:flex;align-items:center;gap:17px;padding:0;margin:0;list-style:none}
#qn23-header .gx-menu-item{position:relative;display:flex;align-items:center;min-height:72px;list-style:none}
#qn23-header .gx-menu-item>a,#qn23-header .qn23-mega-trigger{display:inline-flex;align-items:center;justify-content:center;gap:5px;font-size:13px;font-weight:700;line-height:1.25;white-space:nowrap;color:#17283c;text-decoration:none;border:0;padding:12px 0;background:transparent;cursor:pointer;font-family:inherit}
#qn23-header .gx-menu-item>a:hover,#qn23-header .qn23-mega-trigger:hover,#qn23-header .gx-menu-item>a:focus-visible,#qn23-header .qn23-mega-trigger:focus-visible,#qn23-header [aria-current="page"]{color:var(--qn23-blue);outline-offset:5px}
#qn23-header .gx-chevron{transition:transform .18s ease}
#qn23-header .is-mega-open .gx-chevron{transform:rotate(180deg)}
#qn23-header .gx-hotline{min-height:43px;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:9px 13px;background:#367dbb;border:1px solid #367dbb;border-radius:9px;color:#fff;font-weight:750;font-size:12px;text-decoration:none;white-space:nowrap;cursor:pointer;font-family:inherit;line-height:1.2}
#qn23-header .gx-hotline svg{flex:none;width:17px;height:17px}
#qn23-header .gx-hotline:hover{background:#2165a1;color:#fff}
#qn23-header .qn23-hotline-secondary{background:#347fbd}
#qn23-header .gx-menu-toggle{display:none;width:44px;height:44px;align-items:center;justify-content:center;border:0;background:transparent;color:#1d3c58;border-radius:9px;cursor:pointer}
/* The VF mega structure: fixed-width tab strip followed by 4-column product cards. */
#qn23-header .gx-product-mega{position:fixed;top:var(--qn23-nav-bottom,72px);left:50%;width:min(1280px,calc(100vw - 32px));transform:translateX(-50%) translateY(-7px);background:#fff;border:1px solid #dce5ed;border-top:3px solid var(--qn23-blue);box-shadow:0 22px 55px rgba(21,52,88,.2);padding:0 18px 14px;max-height:min(78vh,685px);overflow:auto;z-index:5050;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .16s ease,visibility .16s ease,transform .16s ease}
#qn23-header .is-mega-open>.gx-product-mega,#qn23-header .is-product-mega:focus-within>.gx-product-mega{visibility:visible;opacity:1;pointer-events:auto;transform:translateX(-50%) translateY(0)}
#qn23-header .gx-product-mega-tabs{position:sticky;top:0;z-index:2;display:flex;align-items:center;gap:0;background:#fff;border-bottom:1px solid var(--qn23-border);margin:0 -18px 10px;padding:0 18px}
#qn23-header .gx-product-mega-tab{border:0;border-bottom:3px solid transparent;background:#fff;color:#2a4460;padding:14px 22px 12px;font-size:14px;font-weight:700;line-height:1.25;font-family:inherit;cursor:pointer;white-space:nowrap}
#qn23-header .gx-product-mega-tab.is-active{border-color:#347fbd;color:#2574b6;background:#f2f8fd}
#qn23-header .gx-product-mega-panel{display:none;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;align-items:stretch;padding:1px 0 8px}
#qn23-header .gx-product-mega-panel.is-active:not([hidden]){display:grid}
#qn23-header .gx-product-mega-panel[hidden]{display:none!important}
#qn23-header .gx-product-mega-card{display:flex;flex-direction:column;align-items:stretch;min-width:0;padding:0;text-align:left;color:#1b2f43;background:#fff;border:1px solid #e3ebf4;text-decoration:none;font-family:inherit;cursor:pointer;overflow:hidden}
#qn23-header .gx-product-mega-card:hover,#qn23-header .gx-product-mega-card:focus-visible{border-color:#7db7e5;background:#f6fbff;box-shadow:0 6px 18px #0f588c19;outline:0}
#qn23-header .gx-product-mega-image{position:relative;display:block;height:112px;background:#f5f8fb;overflow:hidden;text-align:center}
#qn23-header .gx-product-mega-image img{width:100%;height:100%;object-fit:contain;display:block}
#qn23-header .gx-product-mega-watermark{position:absolute;left:10px;top:6px;color:#a6b6c8;letter-spacing:1px;font-style:italic;font-weight:800;font-size:15px;pointer-events:none}
#qn23-header .gx-product-mega-info{display:flex;flex-direction:column;gap:4px;padding:10px 12px 12px;min-width:0;font-size:13px;line-height:1.35}
#qn23-header .gx-product-mega-info strong{color:#122d47;font-size:13px;line-height:1.35;font-weight:750;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
#qn23-header .gx-product-mega-info small{color:#287dbf;font-size:12px}
#qn23-header .qn23-mini-card{flex-direction:row;align-items:center;min-height:75px;gap:10px}
#qn23-header .qn23-mini-icon{display:grid;place-items:center;flex:0 0 45px;height:45px;margin-left:10px;border-radius:10px;background:#e7f5ff;color:#3184c2;font-size:24px}
#qn23-header .qn23-mega-bottom{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:12px 3px 1px;color:#58718c;font-size:12px;border-top:1px solid var(--qn23-border)}
#qn23-header .qn23-mega-bottom button{border:0;border-radius:6px;background:#347fbd;color:white;cursor:pointer;padding:10px 15px;font-weight:750}
#qn23-header .gx-product-mega-empty{padding:18px;color:#56718c;grid-column:1/-1}
#qn23-header .gx-product-mega-empty button{color:#287dbf;border:0;background:transparent;cursor:pointer}
/* Mobile menu follows VinFast drawer logic but contains the transport route tree. */
#qn23-header .qn23-mobile-menu{position:absolute;inset:100% 0 auto 0;background:rgba(5,28,47,.38);z-index:5090;padding:0 12px 12px;min-height:calc(100vh - 70px)}
#qn23-header .qn23-mobile-menu[hidden]{display:none!important}
#qn23-header .qn23-mobile-panel{background:#fff;box-shadow:0 18px 38px #0c3f6728;border-radius:0 0 16px 16px;max-height:calc(100vh - 89px);overflow:auto;padding:12px 16px 18px}
#qn23-header .qn23-mobile-title{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:6px;padding-bottom:10px;border-bottom:1px solid var(--qn23-border);font-size:15px}
#qn23-header .qn23-mobile-title button{padding:7px 10px;border:0;background:#e8f5fd;border-radius:6px;cursor:pointer}
#qn23-header .qn23-mobile-panel>a,#qn23-header .qn23-mobile-panel>details>summary{display:block;text-align:left;padding:13px 4px;border-bottom:1px solid #eaf0f6;text-decoration:none;font-weight:700;font-size:14px;color:#184668;cursor:pointer}
#qn23-header .qn23-mobile-panel details a,#qn23-header .qn23-mobile-panel details button{display:block;width:100%;text-align:left;padding:11px 16px;background:#fff;border:0;border-bottom:1px solid #f1f4f8;font-size:13px;color:#1e4b6d;text-decoration:none;cursor:pointer;font-family:inherit}
#qn23-header .qn23-mobile-panel .qn23-mobile-hotline{background:#eaf5ff;color:#1470b0;padding:13px}
#qn23-header .qn23-mobile-book{width:100%;min-height:44px;background:#367fbb;color:#fff;border:0;border-radius:7px;font-size:14px;font-weight:700;margin-top:12px;cursor:pointer}
@media(min-width:1091px){#qn23-header .qn23-mobile-menu{display:none!important}}
@media(max-width:1279px){#qn23-header .gx-desktop-menu ul{gap:11px}#qn23-header .gx-shell{gap:10px}#qn23-header .gx-left-zone,#qn23-header .gx-right-zone{gap:9px}#qn23-header .gx-menu-item>a,#qn23-header .qn23-mega-trigger{font-size:12px}#qn23-header .gx-hotline{padding:9px 10px;font-size:11px}#qn23-header .qn23-logo-name{font-size:14px}}
@media(max-width:1090px){#qn23-header .gx-desktop-menu{display:none}#qn23-header .gx-menu-toggle{display:inline-flex}#qn23-header .gx-product-mega{display:none}#qn23-header .gx-shell{height:70px}}
@media(max-width:700px){#qn23-header .gx-shell{width:calc(100% - 24px);height:66px;gap:8px}#qn23-header .gx-logo-img{max-height:41px;max-width:173px}#qn23-header .qn23-logo-initials{width:40px;height:40px;font-size:13px}#qn23-header .qn23-logo-name{font-size:14px;max-width:158px;overflow:hidden;text-overflow:ellipsis}#qn23-header .gx-right-zone{gap:4px}#qn23-header .qn23-hotline{padding:9px;min-height:39px;font-size:0}#qn23-header .qn23-hotline svg{width:20px;height:20px}#qn23-header .qn23-hotline-secondary{display:none}#qn23-header .gx-menu-toggle{width:40px;height:40px}#qn23-header .qn23-mobile-panel{max-height:calc(100vh - 77px)}}
@media(prefers-reduced-motion:reduce){#qn23-header .gx-product-mega,#qn23-header .gx-chevron{transition:none!important}}

/* P23-H2: VinFast 72px nav frame; balanced two-call primary CTAs. */
body.qnvf23g-home #qn23-header .gx-navbar{background:#f7fbff}
body.qnvf23g-home #qn23-header .gx-shell{max-width:1280px}
body.qnvf23g-home #qn23-header .gx-menu-item>a,
body.qnvf23g-home #qn23-header .qn23-mega-trigger{font-size:13px;letter-spacing:0;font-weight:700}
body.qnvf23g-home #qn23-header .gx-hotline{min-height:42px;border-radius:9px;padding:9px 13px}
body.qnvf23g-home #qn23-header .gx-product-mega{border-top-width:2px}
body.qnvf23g-home #qn23-header .gx-product-mega-card{min-height:0}
@media(max-width:1090px){body.qnvf23g-home #qn23-header .gx-shell{height:68px}}
@media(max-width:700px){body.qnvf23g-home #qn23-header .gx-shell{height:62px}}
