/* #313 — Trang chủ công ty hoaviet.vn (giao diện mới). Dùng token ui2.css (var(--hv-…)); khối hm.* dùng chung home_moi.css. Tiền tố .hc- */
.hc .hm-sec{margin-bottom:12px}
.hc .hm-sec>.hm-wrap{background:var(--hv-white);border-radius:var(--hv-radius-card);padding:20px var(--hv-pad)}
.hc .hm-sec h2{margin:0 0 12px;font-size:var(--hv-fs-title);font-weight:700;color:var(--hv-ink)}
.hc .hm-head{margin-bottom:12px}
.hc .hm-head h2{margin:0}
.hc p{margin:0 0 10px}

/* hero giới thiệu: chữ trái, ảnh trụ sở phải (mobile: ảnh dưới) */
.hc .hm-sec--hc_gioithieu>.hm-wrap{padding:0;overflow:hidden}
.hc-hero{display:grid;grid-template-columns:1fr;gap:0}
.hc-hero__txt{padding:24px var(--hv-pad) 20px}
.hc-kicker{display:inline-block;margin:0 0 10px!important;padding:4px 12px;border-radius:var(--hv-radius);background:var(--hv-red-soft);color:var(--hv-red-d);font-size:13px;font-weight:600}
.hc .hc-hero h1{margin:0 0 12px;font-size:26px;line-height:1.25;font-weight:800;color:var(--hv-ink)}
.hc-hero__txt>p:not(.hc-kicker):not(.hc-cta){font-size:15.5px;line-height:1.65;color:var(--hv-text)}
.hc-cta{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px!important}
.hc-cta .hv-btn{min-height:44px;padding:0 20px;font-size:15px}
.hc-hero__img{position:relative;aspect-ratio:4/3;background:var(--hv-bg-2)}
.hc-hero__img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 35%}

/* cửa hàng trực tuyến: chữ + nút, lưới danh mục gọn */
.hc-shop{display:grid;grid-template-columns:1fr;gap:16px}
.hc-shop__txt p{color:var(--hv-muted)}
.hc .hm-cats--gon{grid-template-columns:repeat(5,1fr)}

/* chính sách + liên hệ */
.hc .hm-sec--hc_lienhe>.hm-wrap{background:transparent;padding:0}
.hc-2col{display:grid;grid-template-columns:1fr;gap:12px}
.hc-box{background:var(--hv-white);border-radius:var(--hv-radius-card);padding:20px var(--hv-pad)}
.hc-box ul{list-style:none;margin:0 0 12px;padding:0}
.hc-box .mergetags_menu li a{display:flex;align-items:center;justify-content:space-between;padding:10px 0;border-bottom:1px solid var(--hv-line);color:var(--hv-text)}
.hc-box .mergetags_menu li:last-child a{border-bottom:0}
.hc-box .mergetags_menu li a::after{content:"›";font-size:20px;color:var(--hv-muted)}
.hc-box .mergetags_menu li a:hover{color:var(--hv-red)}
.hc-contact li{display:flex;gap:10px;align-items:flex-start;padding:7px 0;line-height:1.45}
.hc-contact i{color:var(--hv-red);margin-top:2px}
.hc-contact a{color:var(--hv-text)}
.hc-contact a:hover{color:var(--hv-red)}

/* menu doanh nghiệp trên header (hoaviet.vn) */
body.ui2 #header .hc-nav__shop i{font-size:12px;margin-left:4px}

@media (min-width:768px){
	.hc-2col{grid-template-columns:1fr 1fr}
	.hc .hm-cats--gon{grid-template-columns:repeat(5,1fr)}
}
@media (min-width:992px){
	.hc-hero{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);align-items:stretch}
	.hc-hero__txt{padding:40px 36px;display:flex;flex-direction:column;justify-content:center}
	.hc .hc-hero h1{font-size:36px}
	.hc-hero__img{aspect-ratio:auto;min-height:420px}
	.hc .hm-sec>.hm-wrap{padding:24px 28px}
	.hc .hm-sec--hc_gioithieu>.hm-wrap{padding:0}
	.hc-shop{grid-template-columns:minmax(0,1fr) minmax(0,2fr);align-items:center;gap:28px}
	.hc .hm-cats--gon{grid-template-columns:repeat(5,1fr)}
	.hc-box{padding:24px 28px}
}
.hc-2col--1{grid-template-columns:1fr!important}
@media (min-width:768px){.hc-2col--1 .hc-contact{display:grid;grid-template-columns:1fr 1fr;column-gap:24px}}

/* #313 vòng 2 — hero: khung nền trắng bo 4 góc nằm dưới, ảnh trụ sở bo góc + đổ bóng "nổi" tràn ra mép trên/dưới khung */
.hc .hm-sec--hc_gioithieu>.hm-wrap{background:transparent!important;padding:20px 0 4px!important;overflow:visible!important}
.hc-hero{position:relative;display:grid;grid-template-columns:1fr;background:var(--hv-white);border-radius:var(--hv-radius-card);overflow:visible}
.hc-hero__img{order:-1;position:relative;z-index:1;margin:-16px 12px 0;aspect-ratio:4/3;border-radius:16px;overflow:hidden;box-shadow:0 14px 32px var(--hv-shade-18);background:var(--hv-bg-2)}
.hc-hero__img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 35%}
.hc-hero__txt{padding:20px var(--hv-pad) 22px}
@media (min-width:992px){
	.hc .hm-sec--hc_gioithieu>.hm-wrap{padding:36px 0 12px!important}
	.hc-hero{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);align-items:stretch}
	.hc-hero__img{order:0;aspect-ratio:auto;min-height:480px;margin:-32px 28px -32px 0;border-radius:20px;box-shadow:0 24px 48px var(--hv-shade-18)}
	.hc-hero__txt{padding:44px 40px}
}
/* ảnh trụ sở là ảnh dọc: khung gần tỷ lệ gốc (4:5), canh phía trên để luôn thấy bảng tên "HÓA VIỆT" trên mặt tiền */
.hc-hero__img{aspect-ratio:4/5}
.hc-hero__img img{object-position:50% 0}
@media (min-width:992px){.hc-hero__img{aspect-ratio:4/5;min-height:0}}

/* #313 vòng 3 — hàng logo "Nhập khẩu & phân phối trực tiếp" trong hero (nhỏ, xám, rê chuột hiện màu) */
.hc-trustrow{margin-top:22px;padding-top:16px;border-top:1px solid var(--hv-line)}
.hc-trustrow>span{display:block;font-size:12.5px;font-weight:600;color:var(--hv-muted);margin-bottom:10px;text-transform:uppercase;letter-spacing:.3px}
.hc-trustrow p{margin:0!important}
.hm-trust{display:flex;flex-wrap:wrap;align-items:center;gap:10px 22px;list-style:none;margin:0;padding:0}
.hm-trust a{display:block}
.hm-trust img{height:30px;width:auto;max-width:110px;object-fit:contain;filter:grayscale(1);opacity:.7;transition:filter .15s,opacity .15s}
.hm-trust a:hover img,.hm-trust a:focus img{filter:none;opacity:1}
@media (max-width:575.98px){.hm-trust{gap:10px 16px}.hm-trust img{height:26px;max-width:90px}}

/* hero: ảnh được cắt từ trên xuống (luôn thấy bảng tên), chiều cao theo khung chữ trên desktop */
.hc-hero__img{aspect-ratio:4/3!important}
.hc-hero__img img{object-position:50% 0!important}
@media (min-width:992px){
	.hc-hero__img{aspect-ratio:auto!important;min-height:0!important;height:auto}
	.hc-hero{align-items:stretch}
}

/* khối liên hệ: bản đồ trái, chi tiết phải; mobile bản đồ trên. Cùng khung/lề với các khối khác */
.hc .hm-sec--hc_lienhe>.hm-wrap{background:var(--hv-white)!important;padding:20px var(--hv-pad)!important}
.hc-lh{display:grid;grid-template-columns:1fr;gap:16px}
.hc-lh__map{position:relative;aspect-ratio:4/3;border-radius:var(--hv-radius-card);overflow:hidden;background:var(--hv-bg-2)}
.hc-lh__map iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.hc-lh__ph{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:16px;text-align:center;background:var(--hv-bg)}
.hc-lh__ph i{font-size:40px;color:var(--hv-red)}
.hc-lh__ph b{color:var(--hv-ink);font-weight:600}
.hc-lh__ct h3{font-size:18px;font-weight:700;margin:0 0 10px;color:var(--hv-ink)}
.hc-lh .hc-contact{list-style:none;margin:0 0 12px;padding:0}
@media (min-width:992px){
	.hc .hm-sec--hc_lienhe>.hm-wrap{padding:24px 28px!important}
	.hc-lh{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:28px;align-items:center}
	.hc-lh__map{aspect-ratio:16/11}
}
/* khung logo cố định -> không xê dịch bố cục khi ảnh tải xong */
.hm-trust img{width:96px!important;height:32px!important;max-width:none}
@media (max-width:575.98px){.hm-trust img{width:80px!important;height:28px!important}}
/* hàng logo hero: lưới đều 6 cột (mobile 3), ô cố định, logo lớn hơn */
.hm-trust{display:grid!important;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px 18px!important}
.hm-trust img{width:100%!important;height:40px!important}
@media (max-width:575.98px){.hm-trust{grid-template-columns:repeat(3,minmax(0,1fr))}.hm-trust img{height:34px!important}}

/* #313: ảnh hero thấp hơn một chút - chỉ nhô 14px mỗi đầu thay vì 32px */
@media (min-width:992px){.hc-hero__img{margin-top:-14px!important;margin-bottom:-14px!important}}