/* HVSC header v2 – 12/10/2026 (đề xuất). Chỉ dùng token sẵn có (tokens.css + hv-theme.css, tự đổi Sáng/Tối). Tiền tố hh2-. */
.hh2{--hh2-top:60px;--hh2-nav:46px;--hh2-chip:52px;--hh2-mt:106px;position:sticky;top:0;z-index:100;display:block;background:var(--hd-bg,var(--bg));color:var(--ink);border-bottom:1px solid var(--line);backdrop-filter:saturate(1.3) blur(14px);-webkit-backdrop-filter:saturate(1.3) blur(14px);margin:0!important}
.is-home .hh2{margin-bottom:0!important}
.hh2 *{box-sizing:border-box}
.hh2 :where(ul){list-style:none;margin:0;padding:0}
.hh2 a{color:inherit;text-decoration:none}
.hh2 :where(a,button,input):focus-visible{outline:2px solid var(--brand-ink,#D0161C);outline-offset:2px;border-radius:10px}
.hh2 .screen-reader-text{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.hh2-i{display:block;flex:none}

/* ---- hàng 1: logo + icon ---- */
.hh2__top{display:flex;align-items:center;justify-content:space-between;gap:12px;height:var(--hh2-top);padding-inline:var(--gutter);transition:height .25s var(--ease-out,ease),opacity .2s}
.hh2 .brand{display:flex;align-items:center;min-width:0}
.hh2__act{display:flex;align-items:center;gap:6px;margin-left:auto}
.hh2-ib{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:4px;width:40px;height:40px;padding:0;border-radius:12px;border:1px solid var(--line-2);background:transparent;color:var(--ink);cursor:pointer;font:inherit;font-size:12px;font-weight:700;transition:background .15s,border-color .15s,color .15s}
.hh2-ib:hover{background:var(--veil,rgba(18,19,22,.05))}
.hh2-ib[aria-expanded=true]{background:var(--veil,rgba(18,19,22,.07));border-color:var(--ink-2)}
.hh2-ib--lang{width:auto;padding:0 10px;font-size:13px}
.hh2-ib--book{background:var(--brand-ink);border-color:var(--brand-ink);color:#fff}
.hh2-ib--book:hover{background:var(--brand-700,#A90F14);border-color:var(--brand-700,#A90F14)}
html[data-theme=dark] .hh2-ib--book{background:transparent;color:var(--brand-ink);border-color:var(--brand-ink)}
html[data-theme=dark] .hh2-ib--book:hover{background:rgba(255,107,112,.14)}
.hh2-ib--call{color:var(--brand-ink);border-color:var(--line-2)}
.hh2 .hbtn--menu{display:none!important}
.hh2 .hbtn__label,.hh2 .hbtn__txt{display:none!important}
/* nút chèn sẵn (Sáng/Tối, Chế độ đọc) cùng cỡ icon */
.hh2 .hvt-btn,.hh2 .hv-rd-btn{width:40px;height:40px;border-radius:12px;border:1px solid var(--line-2)}
.hh2 .hv-rd-wrap{display:inline-flex;position:relative}
/* tooltip: chỉ hiện khi rê chuột/focus bàn phím, KHÔNG thay cho aria-label */
@media (hover:hover){
 .hh2-ib[data-tip]::after{content:attr(data-tip);position:absolute;top:calc(100% + 8px);right:0;white-space:nowrap;padding:5px 9px;border-radius:8px;background:var(--ink);color:var(--on-ink,#fff);font-size:12.5px;font-weight:600;opacity:0;transform:translateY(-3px);pointer-events:none;transition:opacity .15s,transform .15s;z-index:5}
 .hh2-ib[data-tip]:is(:hover,:focus-visible)::after{opacity:1;transform:none;transition-delay:.35s}
 .hh2-ib[aria-expanded=true]::after{display:none}
}

/* ---- hàng 2: menu chính FULL-WIDTH ---- */
.hh2__nav{display:none;border-top:1px solid var(--line)}
.hh2__list{display:flex;align-items:center;justify-content:center;gap:2px;height:var(--hh2-nav);padding-inline:var(--gutter)}
.hh2-it{position:relative;display:flex;align-items:center;height:100%}
.hh2-lk{display:flex;align-items:center;height:100%;padding:0 12px;font-size:15px;font-weight:600;line-height:1.2;white-space:nowrap;color:var(--ink-2);position:relative}
.hh2-it.has-tg .hh2-lk,.hh2-it:has(.hh2-tg) .hh2-lk{padding-right:2px}
.hh2-lk::after{content:"";position:absolute;left:12px;right:12px;bottom:0;height:3px;border-radius:3px 3px 0 0;background:var(--brand);transform:scaleX(0);transition:transform .2s var(--ease-out,ease)}
.hh2-it:hover .hh2-lk,.hh2-it.is-open .hh2-lk{color:var(--ink)}
.hh2-it:is(:hover,.is-open) .hh2-lk::after{transform:scaleX(.5)}
.hh2-it.is-cur .hh2-lk{color:var(--ink)}
.hh2-it.is-cur .hh2-lk::after{transform:scaleX(1)}
.hh2-tg{display:inline-flex;align-items:center;justify-content:center;width:24px;height:28px;margin-right:4px;border-radius:8px;color:var(--muted);background:transparent;border:0;cursor:pointer;padding:0}
.hh2-tg:hover{color:var(--ink);background:var(--veil,rgba(18,19,22,.06))}
.hh2-chev{width:7px;height:7px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:translateY(-2px) rotate(45deg);transition:transform .2s}
.hh2-it.is-open .hh2-chev{transform:translateY(1px) rotate(225deg)}
.hh2-it.is-open::after{content:"";position:absolute;left:-8px;right:-8px;top:100%;height:26px}
@media (min-width:1100px){.hh2__nav{display:block}.hh2 .hbtn--menu{display:none!important}}
@media (max-width:1099px){.hh2 .hbtn--menu{display:inline-flex!important}.hh2-ib--lang{display:none}}
@media (min-width:1100px) and (max-width:1279px){.hh2-lk{padding:0 8px;font-size:14.5px}.hh2-lk::after{left:8px;right:8px}}

/* ---- panel (mega) ---- */
.hh2-mega{position:absolute;top:var(--hh2-mt);left:0;width:max-content;max-width:calc(100vw - 32px);max-height:min(430px,calc(100vh - var(--hh2-mt) - 16px));overflow:auto;background:var(--surface);border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow-3);z-index:99}
.hh2-mega[hidden]{display:none}
.hh2-mega.is-in{animation:hh2in .18s var(--ease-out,ease)}
@keyframes hh2in{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.hh2-mega.is-in{animation:none}.hh2-it .hh2-lk::after,.hh2-chev{transition:none}}
.hh2-mega__in{padding:20px 22px}
.hh2-cols3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px 36px}
.hh2-cols2{display:grid;grid-template-columns:repeat(2,minmax(150px,1fr));gap:12px 32px}
.hh2-gt{display:flex;align-items:center;gap:8px;margin:0 0 8px;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.hh2-gt a{display:flex;align-items:center;gap:8px;width:100%;color:var(--ink);font-size:14px;letter-spacing:.02em}
.hh2-gt a span{margin-left:auto;font-size:12px;font-weight:600;color:var(--muted-2);text-transform:none;letter-spacing:0}
.hh2-gt i,.hh2-nl__a i{width:10px;height:10px;border-radius:50%;background:var(--c,var(--brand));flex:none}
.hh2-gt--s{text-transform:none;letter-spacing:0;font-size:13.5px;color:var(--ink)}
.hh2-gt--plain{padding-bottom:6px}
.hh2-g--air{--c:var(--air)}.hh2-g--tech{--c:var(--tech)}.hh2-g--mkt{--c:var(--mkt)}.hh2-g--csr{--c:var(--csr)}
.hh2-gl{display:grid;gap:1px;align-content:start}
.hh2-gl--2{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:10px;grid-auto-flow:row}
.hh2-gl a{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:34px;padding:6px 10px;border-radius:9px;font-size:14px;line-height:1.3;color:var(--ink-2)}
.hh2-gl a:hover,.hh2-gl a:focus-visible{background:var(--veil,rgba(18,19,22,.06));color:var(--ink)}
.hh2-gl a[aria-current=page]{background:var(--c-soft,var(--surface-2));color:var(--ink);font-weight:700}
.hh2-gl em{font-style:normal;font-size:12px;font-weight:700;color:var(--muted-2);background:var(--surface-2);border-radius:999px;padding:1px 8px}
.hh2-gf{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:10px 0 0;padding-top:10px;border-top:1px solid var(--line);font-size:13px;font-weight:600}
.hh2-gf a{display:inline-flex;align-items:center;gap:6px;color:var(--c,var(--brand-ink));filter:none}
.hh2-g--air .hh2-gf>a:first-child{color:var(--air-ink)}.hh2-g--tech .hh2-gf>a:first-child{color:var(--tech-ink)}.hh2-g--mkt .hh2-gf>a:first-child{color:var(--mkt-ink)}
.hh2-gf .hh2-i,.hh2-mega__foot .hh2-i{width:15px;height:15px}
.hh2-tel{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:700;color:var(--ink-2)!important}
.hh2-tel .hh2-i{width:15px;height:15px}
.hh2-mega__foot{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0;padding:11px 22px;border-top:1px solid var(--line);background:var(--surface-2);font-size:13px;color:var(--muted);border-radius:0 0 18px 18px}
.hh2-mega__foot a{display:inline-flex;align-items:center;gap:6px;font-weight:700;color:var(--ink)}
.hh2-mega__foot a:hover{color:var(--brand-ink)}
/* Cộng đồng */
.hh2-cd{display:grid;grid-template-columns:minmax(0,1fr) 236px;gap:28px;padding:20px 22px}
.hh2-cd__grid{display:grid;grid-template-columns:repeat(3,minmax(170px,1fr));gap:16px 22px}
.hh2-step{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--csr);color:#06210f;font-size:11px;font-weight:800}
html[data-theme=light] .hh2-step{background:var(--csr-ink);color:#fff}
.hh2-aside{display:flex;flex-direction:column;gap:8px;padding:16px;border-radius:14px;background:var(--csr-soft);border:1px solid var(--line)}
.hh2-k{margin:0;font-size:11.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--csr-ink)}
.hh2-aside__t{margin:0;font-size:14px;line-height:1.45;font-weight:600;color:var(--ink)}
.hh2-aside__x{margin:0;font-size:12.5px;line-height:1.45;color:var(--muted)}
.hh2-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:38px;padding:0 14px;border-radius:11px;border:1px solid var(--brand-ink);background:var(--brand-ink);color:#fff!important;font-size:13.5px;font-weight:700;cursor:pointer;font-family:inherit}
.hh2-btn:hover{filter:brightness(.92)}
html[data-theme=dark] .hh2-btn{background:transparent;color:var(--brand-ink)!important}
.hh2-aside .hh2-btn{margin-top:4px}
.hh2-nlgrid{display:grid;grid-template-columns:repeat(4,minmax(170px,1fr));gap:12px}
.hh2-nl{display:flex;flex-direction:column;gap:6px;padding:12px;border:1px solid var(--line);border-radius:14px;background:var(--surface)}
.hh2-nl__a{display:grid;grid-template-columns:auto 1fr;column-gap:8px;align-items:center}
.hh2-nl__a b{font-size:14.5px}.hh2-nl__a small{grid-column:2;font-size:12.5px;color:var(--muted)}
.hh2-nl__a:hover b{text-decoration:underline;text-underline-offset:3px}
.hh2-nl__pdf{align-self:flex-start;font-size:12.5px;font-weight:700;padding:3px 10px;border-radius:999px;border:1px solid var(--line-2);color:var(--ink-2)}
.hh2-nl__pdf:hover{border-color:var(--ink-2)}
.hh2-mega--sm .hh2-gl a,.hh2-mega--xs .hh2-gl a{min-width:200px}

/* ---- popover tìm kiếm / ngôn ngữ ---- */
.hh2-pop{position:absolute;top:calc(var(--hh2-top) - 4px);right:var(--gutter);z-index:98;background:var(--surface);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow-3);padding:10px}
.hh2-pop[hidden]{display:none}
.hh2-pop--search{display:flex;gap:8px;width:min(420px,calc(100vw - 32px))}
.hh2-pop--search[hidden]{display:none}
.hh2-pop--search input{flex:1;min-width:0;height:40px;border-radius:10px;border:1px solid var(--line-2);background:var(--bg);color:var(--ink);padding:0 12px;font:inherit;font-size:15px}
.hh2-pop--lang{display:grid;min-width:150px}
.hh2-pop--lang a{padding:9px 12px;border-radius:9px;font-size:14px}
.hh2-pop--lang a:hover{background:var(--veil,rgba(18,19,22,.06))}
.hh2-pop--lang a[aria-current]{font-weight:800}

/* ---- hàng 3: thanh chip chuyên mục cuộn ngang ---- */
.hh2__chips{border-top:1px solid var(--line);background:var(--surface-2);transition:max-height .25s var(--ease-out,ease),opacity .2s}
.hh2__chips-in{position:relative;display:flex;align-items:center;gap:10px;height:var(--hh2-chip);padding-inline:var(--gutter)}
.hh2__chipnav{position:relative;flex:1;min-width:0;overflow:hidden}
.hh2__chiplist{display:flex;gap:8px;overflow-x:auto;scroll-behavior:smooth;scrollbar-width:none;padding:4px 2px;-webkit-overflow-scrolling:touch}
.hh2__chiplist::-webkit-scrollbar{display:none}
.hh2__chipnav::before,.hh2__chipnav::after{content:"";position:absolute;top:0;bottom:0;width:28px;z-index:2;pointer-events:none;opacity:0;transition:opacity .15s}
.hh2__chipnav::before{left:0;background:linear-gradient(90deg,var(--surface-2),transparent)}
.hh2__chipnav::after{right:0;background:linear-gradient(270deg,var(--surface-2),transparent)}
.hh2__chipnav.has-l::before,.hh2__chipnav.has-r::after{opacity:1}
.hh2-chip{display:inline-flex;align-items:center;gap:7px;height:36px;padding:0 14px;border-radius:999px;border:1px solid var(--line-2);background:var(--surface);font-size:14px;font-weight:600;line-height:1;white-space:nowrap;color:var(--ink-2);transition:background .15s,border-color .15s}
.hh2-chip:hover{border-color:var(--ink-2);color:var(--ink)}
.hh2-chip i{font-style:normal;font-size:12px;font-weight:700;color:var(--muted-2)}
.hh2-chip.is-on{background:var(--cx-soft,var(--brand-50));border-color:var(--cx-ink,var(--brand-ink));color:var(--cx-ink,var(--brand-ink))}
.hh2-chip.is-on i{color:inherit}
.hh2-arr{display:inline-grid;place-items:center;width:32px;height:32px;border-radius:50%;border:1px solid var(--line-2);background:var(--surface);color:var(--ink);cursor:pointer;flex:none;padding:0}
.hh2-arr--l .hh2-i{transform:rotate(180deg)}
.hh2-arr .hh2-i{width:16px;height:16px}
.hh2-arr[hidden]{display:none}
.hh2-btn--cx{flex:none;min-height:36px;background:var(--cx-ink,var(--brand-ink));border-color:var(--cx-ink,var(--brand-ink))}
html[data-theme=dark] .hh2-btn--cx{background:transparent;color:var(--cx-ink)!important}
.hh2--air{--cx:var(--air);--cx-ink:var(--air-ink);--cx-soft:var(--air-soft)}
.hh2--tech{--cx:var(--tech);--cx-ink:var(--tech-ink);--cx-soft:var(--tech-soft)}
.hh2--mkt{--cx:var(--mkt);--cx-ink:var(--mkt-ink);--cx-soft:var(--mkt-soft)}
.hh2--csr{--cx:var(--csr);--cx-ink:var(--csr-ink);--cx-soft:var(--csr-soft)}
@media (max-width:759px){.hh2-btn--cx{display:none}.hh2__chips-in{gap:0}.hh2 .hv-rd-wrap{display:none}}
@media (min-width:760px){.hh2-arr{display:inline-grid}}
@media (max-width:759px){.hh2-arr{display:none!important}}
/* thu gọn khi cuộn xuống: bỏ hàng logo; chip ẩn trên điện thoại */
.hh2.is-compact .hh2__top{height:0;overflow:hidden;opacity:0;pointer-events:none}
.hh2.is-compact{--hh2-mt:calc(var(--hh2-nav) + 0px)}
@media (max-width:1099px){.hh2.is-compact .hh2__top{height:var(--hh2-top);opacity:1;pointer-events:auto}.hh2.is-compact .hh2__chips{max-height:0;opacity:0;overflow:hidden;border-top:0}.hh2__chips{max-height:var(--hh2-chip)}}
/* thanh "Trang chủ ›" cũ (hvhb) dư khi đã có chip: ẩn trên trang có chip */
.hh2.has-chips ~ .hvhb,.hv-h2 .hh2.has-chips + .hvhb{display:none}
/* trang Năng lực (shortcode) */
.hh2-hub{max-width:var(--container,1320px);margin:0 auto;padding:32px var(--gutter) 56px}
.hh2-hub__lead{font-size:18px;line-height:1.6;color:var(--ink-2);max-width:62ch}
.hh2-hub__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:16px;margin-top:24px}
.hh2-hubc{padding:20px;border:1px solid var(--line);border-radius:18px;background:var(--surface);box-shadow:var(--shadow-1)}
.hh2-hubc h2{display:flex;align-items:center;gap:10px;font-size:20px;margin:0 0 8px}
.hh2-hubc h2 i{width:12px;height:12px;border-radius:50%;background:var(--c)}
.hh2-hubc p{margin:0 0 12px;color:var(--ink-2);line-height:1.55}
.hh2-hubc__a{display:flex;flex-wrap:wrap;gap:10px;font-weight:700;font-size:14px}
.hh2-hubc__a a{padding:7px 14px;border-radius:999px;border:1px solid var(--line-2)}
.hh2-hubc__a a:first-child{background:var(--ink);color:var(--on-ink,#fff);border-color:var(--ink)}
.hh2-hub__all{margin-top:24px}
/* ≤ 1099: header gọn, hàng nav ẩn (drawer cũ lo menu) */
@media (max-width:759px){.hh2{--hh2-top:56px;--hh2-chip:50px}.hh2-ib{width:38px;height:38px}.hh2__act{gap:4px}.hh2 .hvt-btn{width:38px;height:38px}}
/* điện thoại hẹp: Sáng/Tối + Chế độ đọc đã có trong drawer → bỏ khỏi header cho vừa 390px */
@media (max-width:479px){.hh2 .hvt-btn,.hh2 .hv-rd-wrap{display:none!important}}