/* vatlieutrangtri — canh theo mockup (11-01): mockup 748px = trang 1440 (x1.93), khung ~1240px; chữ/khối ~1.4-1.5x bản dựng đầu */
.vl-hero::before { display: none !important; }
#top-bar .flex-row { min-height: 38px; } .vl-tb { font-size: 14.5px !important; font-weight: 500; }
#header .header-main { height: 90px !important; }
#header #logo { width: 250px !important; flex: 0 0 250px; } #header #logo a { width: 250px !important; height: 64px !important; } #header #logo img { max-height: 64px !important; }
#header .header-nav > li > a { font-size: 15px !important; font-weight: 500 !important; } #header .header-nav > li { margin: 0 11px !important; }
#header .header-button-1 .button { border-radius: 6px !important; min-height: 50px !important; padding: 0 26px !important; font-size: 16px !important; line-height: 50px !important; }
/* hero: chữ trái trên nền than, ảnh phủ kín nửa phải tới mép màn hình */
.vl-hero .row { max-width: none !important; }
.vl-hero .col-inner { padding: 70px 40px 70px max(20px, calc((100vw - 1240px) / 2)) !important; }
.vl-hr .col-inner { padding: 0 !important; }
.vl-hi { min-height: 470px !important; }
.vl-kk { font-size: 15px !important; margin-bottom: 14px !important; }
.vl-h1 { font-size: 50px !important; line-height: 1.16 !important; margin-bottom: 26px !important; }
.vl-ck li { font-size: 19px !important; margin-bottom: 14px !important; gap: 16px !important; } .vl-ck img { width: 26px !important; }
a.vl-btn { min-height: 58px !important; padding: 0 34px !important; font-size: 18px !important; border-radius: 6px !important; margin-top: 12px; } a.vl-btn img { width: 18px !important; }
.vl-sts { padding: 34px 0 !important; } .vl-st b { font-size: 44px !important; } .vl-st span { font-size: 17px !important; display: block; margin-top: 6px; }
section.vl-cat, section.vl-sv, section.vl-ft, section.vl-pj, section.vl-news { padding: 48px 0 !important; }
.vl-hd { margin-bottom: 26px !important; } .vl-hd h2, .vl-h2 { font-size: 40px !important; } .vl-hd p, .vl-s { font-size: 18px !important; margin-top: 6px !important; }
a.vl-all { font-size: 15px !important; } a.vl-all img { width: 15px !important; }
.vl-cg { gap: 20px !important; } .vl-cg a > img { aspect-ratio: 1.5 / 1 !important; } .vl-cg b { font-size: 19px !important; padding: 16px 0 4px !important; } .vl-cg span { font-size: 15px !important; padding: 0 0 6px !important; } .vl-cg span img { width: 14px !important; } .vl-cg a { border: 0 !important; background: transparent !important; }
/* dịch vụ: icon to, nối bằng đường mảnh như mockup (không dùng mũi tên đậm) */
.vl-sg { margin-top: 34px !important; } .vl-sg > div > img { width: 76px !important; height: 76px !important; } .vl-sg b { font-size: 20px !important; margin: 14px 0 4px !important; } .vl-sg span { font-size: 15.5px !important; }
.vl-sg img.vl-ar { width: 130px !important; height: 1px !important; object-fit: none; object-position: -9999px 0; background: #c3c9ce; margin-top: -60px; }
.vl-fg { gap: 20px !important; } .vl-fg > div { padding: 14px 16px 18px !important; } .vl-fg b { font-size: 16.5px !important; margin: 16px 0 6px !important; } .vl-fg strong { font-size: 17px !important; margin-bottom: 14px !important; }
.vl-f1, .vl-f2 { min-height: 42px !important; font-size: 14.5px !important; border-radius: 4px !important; } .vl-fb { gap: 10px !important; }
.vl-pg { gap: 14px !important; } .vl-pg a > img { aspect-ratio: 1.75 / 1 !important; } .vl-pg b { font-size: 16px !important; padding: 12px 14px !important; }
.vl-news .b9-po-t { font-size: 19px !important; } .vl-news .b9-po-e { font-size: 15.5px !important; } .vl-news .b9-more { font-size: 15px !important; }
.vl-ft-in p, .vl-ft-in a, .vl-ft-in li, .vl-ft-ct, .vl-ft-ct a { font-size: 15px !important; } .vl-ft-h { font-size: 17px !important; } .vl-ft-copy { font-size: 14px !important; }
@media (max-width: 849px) {
 .vl-hero .col-inner { padding: 34px 16px !important; } .vl-hi { min-height: 260px !important; }
 .vl-h1 { font-size: 31px !important; } .vl-ck li { font-size: 16px !important; } .vl-hd h2, .vl-h2 { font-size: 28px !important; } .vl-hd p, .vl-s { font-size: 15.5px !important; }
 .vl-hd { flex-wrap: wrap; gap: 8px; } .vl-st b { font-size: 34px !important; } .vl-sg img.vl-ar { display: none !important; }
 .vl-fg { grid-template-columns: 1fr 1fr !important; gap: 12px !important; } .vl-fb { grid-template-columns: 1fr !important; } .vl-fg b { font-size: 15px !important; }
 #header #logo { width: 190px !important; flex: 0 0 190px; } #header #logo a { width: 190px !important; height: 50px !important; } #header #logo img { max-height: 50px !important; }
 #header .header-main { height: 70px !important; }
}
/* lượt 2 */
.vl-h1 { font-size: 46px !important; } .vl-hero .col-inner { padding-right: 24px !important; }
.vl-sg { align-items: start !important; } .vl-sg > div > img { width: 86px !important; height: 86px !important; } .vl-sg img.vl-ar { margin-top: 43px !important; }
html body .vl-ft-c, html body .vl-ft-c p, html body .vl-ft-c a, html body .vl-ft-c li, html body .vl-ft-c span { font-size: 15.5px !important; line-height: 1.75 !important; }
html body .vl-ft-c .vl-ft-h { font-size: 17.5px !important; } html body .vl-ft-copy, html body .vl-ft-copy p { font-size: 14.5px !important; }
html body .vl-ft-logo img, html body img.vl-ft-logo { width: 220px !important; max-width: 220px !important; height: auto !important; }
@media (max-width: 849px) { .vl-h1 { font-size: 31px !important; } .vl-sg > div > img { width: 64px !important; height: 64px !important; } }
.vl-hd h2, .vl-h2 { font-size: 36px !important; }
/* lượt 3: h1 theo mockup (2 dòng), footer mobile 1 cột */
.vl-h1 { font-size: 42px !important; }
@media (max-width: 549px) { html body .vl-ft-in { grid-template-columns: 1fr !important; gap: 22px !important; } html body .vl-ft-c a, html body .vl-ft-c span { overflow-wrap: anywhere; } }
@media (max-width: 849px) { .vl-h1 { font-size: 31px !important; } }
/* lượt 4: ảnh danh mục đủ vật (contain + nền trùng màu ảnh) */
.vl-cg a:nth-child(2) > img { object-fit: contain !important; background: #e2e3e7; }
.vl-cg a:nth-child(4) > img { object-fit: contain !important; background: #fdfdfd; }
.vl-cg a:nth-child(6) > img { object-fit: contain !important; background: #3f4247; }
