/* TGH CATALOG 1.0.2 — Chỉ .tgh-bcat-*, không đổi header/footer/Single Product.
   Hai lưới: 4 cột >1024px, 3 cột 768–1024px, 2 cột <=767px.
   Không co thành ít cột khi ít mục; không có ngoại lệ 1 cột ở màn hình nhỏ.
   JavaScript giữ nguyên bản gốc (lọc, tải thêm, Xem nhanh, popup tư vấn).
*/
.tgh-bcat-page, .tgh-bcat-qv {
  --tgh-bcat-green:#0B4F42; --tgh-bcat-dark:#04372F; --tgh-bcat-gold:#C9943D;
  --tgh-bcat-text:#435E56; --tgh-bcat-line:rgba(11,79,66,.15);
  color:var(--tgh-bcat-text); font-family:"TGH Brands Roboto",Roboto,Arial,sans-serif;
  font-size:14px; line-height:1.65; box-sizing:border-box;
}
body .e-con.tgh-bcat-page { display:block!important; width:100%!important; max-width:none!important; min-height:0!important; height:auto!important; padding:0!important; margin:0!important; gap:0!important; background:#fff; }
body .tgh-bcat-page > .e-con-inner { display:block!important; width:100%!important; max-width:none!important; padding:0!important; margin:0!important; }
body .tgh-bcat-page :is(.tgh-bcat-hero-slot,.tgh-bcat-terms-slot,.tgh-bcat-list-slot,.tgh-bcat-description-slot) { width:100%!important; max-width:none!important; min-width:0; margin:0!important; padding:0!important; }
.tgh-bcat-page *, .tgh-bcat-qv * { box-sizing:border-box; }
.tgh-bcat-page .tgh-bcat-inner { width:min(1280px,calc(100% - 64px)); margin-inline:auto; }
.tgh-bcat-page h1,.tgh-bcat-page h2,.tgh-bcat-qv h2 { font-family:"TGH Brands Roboto",Roboto,Arial,sans-serif!important; font-weight:400!important; color:var(--tgh-bcat-green)!important; margin:0; letter-spacing:0; }
.tgh-bcat-page h2 { font-size:clamp(26px,2.3vw,34px); line-height:1.2; margin-bottom:22px; }
.tgh-bcat-page a, .tgh-bcat-qv a { text-decoration:none; }
.tgh-bcat-page a:focus-visible, .tgh-bcat-page button:focus-visible,.tgh-bcat-page select:focus-visible,.tgh-bcat-page summary:focus-visible,.tgh-bcat-qv :is(a,button):focus-visible { outline:2px solid var(--tgh-bcat-gold)!important; outline-offset:4px; }
.tgh-bcat-page .tgh-bcat-eyebrow,.tgh-bcat-qv .tgh-bcat-eyebrow { font-size:11px; font-weight:600; letter-spacing:.13em; line-height:1.4; color:#987136; margin:0 0 16px; }
.tgh-bcat-page .tgh-bcat-hero { padding:calc(var(--tgh-bcat-header-gap,88px) + 32px) 0 48px; background-color:#EAE4DA; background-image:linear-gradient(110deg,rgba(239,233,222,.6),rgba(242,238,229,.86)),var(--tgh-bcat-bg-image,none); background-size:cover; background-position:center; border-bottom:1px solid rgba(201,148,61,.18); }
/* Editor có header đã đổi relative: không cộng lại chiều cao cố định. */
.elementor-editor-active .tgh-bcat-hero, html.tgh-elementor-canvas .tgh-bcat-hero { padding-top:32px!important; }
.tgh-bcat-page .tgh-bcat-breadcrumb { font-size:11px; margin-bottom:18px; }
.tgh-bcat-breadcrumb ol { display:flex; flex-wrap:wrap; gap:6px 10px; padding:0; margin:0; list-style:none; }
.tgh-bcat-breadcrumb li { display:inline-flex; gap:10px; margin:0; align-items:baseline; }
.tgh-bcat-breadcrumb li+li::before { content:"/"; color:#A78245; }
body .tgh-bcat-breadcrumb a { color:#58746B!important; }
body .tgh-bcat-breadcrumb a:hover { color:#946C2E!important; }
.tgh-bcat-breadcrumb [aria-current] { color:#72877F; }
.tgh-bcat-page #tgh-bcat-title { font-size:clamp(34px,4vw,56px); line-height:1.12; margin:0 0 26px; }
.tgh-bcat-page .tgh-bcat-hero-grid { display:grid; grid-template-columns:minmax(0,1.18fr) minmax(0,1fr); align-items:center; gap:clamp(28px,4vw,64px); }
.tgh-bcat-hero-image { margin:0; overflow:hidden; aspect-ratio:16/9; border-radius:10px; background:rgba(255,255,255,.3); }
.tgh-bcat-hero-image img { display:block; width:100%; height:100%; object-fit:cover; }
.tgh-bcat-hero-copy { min-width:0; max-width:540px; }
.tgh-bcat-intro { font-size:15px; line-height:1.9; color:#435E56; }
.tgh-bcat-intro p { margin:0 0 14px; }
.tgh-bcat-gold-rule { display:block; width:54px; height:1px; background:#C9943D; margin-top:24px; }
.tgh-bcat-placeholder { display:flex; align-items:center; justify-content:center; text-align:center; width:100%; height:100%; min-height:120px; background:linear-gradient(135deg,#E8E4DC,#F8F6F1); color:#60786E; padding:12px; }
.tgh-bcat-terms { padding:36px 0 6px; background:#fff; }
body .tgh-bcat-page .tgh-bcat-term-grid { display:grid!important; grid-template-columns:repeat(4,minmax(0,1fr))!important; gap:18px; width:100%; min-width:0; align-items:start; }
.tgh-bcat-term-card { min-width:0; display:block; }
.tgh-bcat-term-image { display:block; aspect-ratio:16/9; overflow:hidden; border-radius:8px; background:#F1EFE9; }
.tgh-bcat-term-image img { display:block; width:100%; height:100%; object-fit:cover; transition:transform .25s ease; }
body .tgh-bcat-term-name { overflow-wrap:anywhere; display:block; color:#0B4F42!important; font-size:13px; font-weight:600; margin-top:9px; }
.tgh-bcat-more-terms { margin-top:18px; }
.tgh-bcat-more-terms summary { color:#0B4F42; font-size:12px; font-weight:600; cursor:pointer; padding:8px 0; margin-bottom:12px; }
.tgh-bcat-more-terms .when-open,.tgh-bcat-more-terms[open] .when-closed { display:none; }
.tgh-bcat-more-terms[open] .when-open { display:inline; }
.tgh-bcat-products { padding:38px 0 34px; background:#fff; scroll-margin-top:112px; }
.tgh-bcat-list-heading { display:flex; align-items:baseline; justify-content:space-between; gap:16px; margin-bottom:20px; }
.tgh-bcat-list-heading h2 { margin-bottom:0; }
.tgh-bcat-count { font-size:12px; margin:0; white-space:nowrap; }
.tgh-bcat-filters { display:flex; flex-wrap:wrap; gap:14px; align-items:flex-end; margin:0 0 26px; padding:18px; background:#F8F7F3; border:1px solid var(--tgh-bcat-line); border-radius:8px; }
.tgh-bcat-filters label { flex:1 1 150px; min-width:0; display:block; }
.tgh-bcat-filters label>span { display:block; font-size:11px; font-weight:600; margin-bottom:6px; }
body .tgh-bcat-filters select { width:100%; height:42px; border:1px solid rgba(11,79,66,.22); border-radius:4px; color:#244B40; background-color:white; font-family:inherit; font-size:12px; padding:8px 30px 8px 10px; }
body .tgh-bcat-page .tgh-bcat-button,body .tgh-bcat-qv .tgh-bcat-button { display:inline-flex!important; align-items:center!important; justify-content:center!important; gap:8px; min-height:42px; padding:11px 18px!important; margin:0; border:1px solid #0B4F42!important; border-radius:5px!important; background:#0B4F42!important; color:#fff!important; font:600 12px/1.45 "TGH Brands Roboto",Roboto,Arial,sans-serif!important; cursor:pointer; box-shadow:none!important; text-decoration:none!important; transform:none!important; }
body .tgh-bcat-page .tgh-bcat-button:hover,body .tgh-bcat-qv .tgh-bcat-button:hover { background:#C9943D!important; border-color:#C9943D!important; color:#04372F!important; }
body .tgh-bcat-qv .tgh-bcat-button-outline { background:transparent!important; color:#0B4F42!important; }
body .tgh-bcat-qv .tgh-bcat-button-outline:hover { background:#0B4F42!important; color:white!important; }
body .tgh-bcat-page .tgh-bcat-text-link, body .tgh-bcat-qv .tgh-bcat-text-link { display:inline-flex; align-items:center; gap:8px; color:#0B4F42!important; background:transparent!important; font:600 12px/1.6 "TGH Brands Roboto",Roboto,Arial,sans-serif; text-decoration:none!important; padding:8px 0; }
body .tgh-bcat-page .tgh-bcat-text-link:hover,body .tgh-bcat-qv .tgh-bcat-text-link:hover { color:#946C2E!important; }
.tgh-bcat-status:empty { display:none; }
.tgh-bcat-status { font-size:12px; margin:0 0 16px; }
.tgh-bcat-products[aria-busy="true"] .tgh-bcat-product-grid { opacity:.55; pointer-events:none; }
body .tgh-bcat-page .tgh-bcat-product-grid { display:grid!important; grid-template-columns:repeat(4,minmax(0,1fr))!important; gap:26px 22px; width:100%; min-width:0; align-items:start; }
.tgh-bcat-card { min-width:0; margin:0; padding:0; }
.tgh-bcat-card-media { position:relative; isolation:isolate; overflow:hidden; border-radius:9px; background:#F2F0EA; aspect-ratio:1/1; }
.tgh-bcat-card-link { display:block; position:relative; width:100%; height:100%; }
.tgh-bcat-card-media img { position:absolute; inset:0; display:block; width:100%; height:100%; object-fit:cover; transition:opacity .25s ease; }
.tgh-bcat-card-main { opacity:1; }
.tgh-bcat-card-second { opacity:0; }
body .tgh-bcat-card h3 { overflow-wrap:anywhere; font:500 13px/1.65 "TGH Brands Roboto",Roboto,Arial,sans-serif!important; margin:10px 0 0!important; }
body .tgh-bcat-card h3 a { color:#0B4F42!important; text-decoration:none!important; }
body .tgh-bcat-card h3 a:hover { color:#946C2E!important; }
body .tgh-bcat-page .tgh-bcat-quick-button { display:none; position:absolute; z-index:2; bottom:14px; left:50%; width:max-content; max-width:calc(100% - 24px); min-height:40px; transform:translateX(-50%)!important; padding:9px 16px!important; border:1px solid rgba(255,255,255,.85)!important; border-radius:4px!important; background:rgba(4,55,47,.92)!important; color:white!important; font:600 11px/1.4 "TGH Brands Roboto",Roboto,Arial,sans-serif!important; letter-spacing:.06em; cursor:pointer; box-shadow:none!important; }
html.tgh-bcat-js .tgh-bcat-page .tgh-bcat-quick-button { display:inline-flex; align-items:center; justify-content:center; }
body .tgh-bcat-page .tgh-bcat-quick-button:hover { background:#C9943D!important; color:#04372F!important; border-color:#C9943D!important; }
@media (hover:hover) and (pointer:fine) {
  html.tgh-bcat-js .tgh-bcat-card .tgh-bcat-quick-button { opacity:0; transition:opacity .2s ease; }
  .tgh-bcat-card:hover .tgh-bcat-quick-button,.tgh-bcat-card:focus-within .tgh-bcat-quick-button { opacity:1!important; }
  .tgh-bcat-card.has-second:hover .tgh-bcat-card-second,.tgh-bcat-card.has-second:focus-within .tgh-bcat-card-second { opacity:1; }
  .tgh-bcat-card.has-second:hover .tgh-bcat-card-main,.tgh-bcat-card.has-second:focus-within .tgh-bcat-card-main { opacity:0; }
  .tgh-bcat-term-card:hover img { transform:scale(1.035); }
}
.tgh-bcat-pagination { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:18px; margin-top:30px; font-size:12px; }
body .tgh-bcat-page .tgh-bcat-more { display:inline-flex; align-items:center; gap:10px; border:1px solid #C9943D!important; border-radius:30px; background:transparent!important; color:#0B4F42!important; padding:12px 23px; font:600 12px/1.5 "TGH Brands Roboto",Roboto,Arial,sans-serif; }
body .tgh-bcat-page .tgh-bcat-more:hover { color:white!important; background:#0B4F42!important; }
.tgh-bcat-empty,.tgh-bcat-hint { padding:18px; background:#F5F2EB; font-size:13px; border:1px solid var(--tgh-bcat-line); border-radius:6px; }
.tgh-bcat-description { background:#fff; padding:16px 0 60px; }
.tgh-bcat-description .tgh-bcat-inner { border-top:1px solid var(--tgh-bcat-line); padding-top:32px; }
.tgh-bcat-richtext { max-width:920px; font-size:14px; line-height:1.85; overflow-wrap:anywhere; }
.tgh-bcat-richtext :is(h3,h4) { color:#0B4F42; font-family:"TGH Brands Roboto",Roboto,Arial,sans-serif; font-weight:400; line-height:1.3; margin:26px 0 10px; }
.tgh-bcat-richtext img { max-width:100%; height:auto; }
.tgh-bcat-richtext table { display:block; max-width:100%; overflow-x:auto; }
.tgh-bcat-richtext a { color:#0B4F42!important; text-decoration:underline!important; }
.tgh-bcat-faq { max-width:920px; margin-top:32px; }
.tgh-bcat-faq details { border-bottom:1px solid var(--tgh-bcat-line); padding:13px 0; }
.tgh-bcat-faq summary { color:#0B4F42; cursor:pointer; font-weight:600; }
.tgh-bcat-faq details>div { padding-top:10px; }
/* Một dialog dùng chung, mở bằng API gốc của trình duyệt. */
body .tgh-bcat-qv { position:fixed; inset:0; width:min(1040px,calc(100vw - 40px)); max-width:none; max-height:calc(100dvh - 40px); padding:38px 30px 30px; border:1px solid rgba(201,148,61,.35); border-radius:14px; margin:auto; background:#FBFAF6; color:#435E56; overflow:auto; box-shadow:0 24px 80px rgba(0,0,0,.25); }
body .tgh-bcat-qv:not([open]) { display:none; }
.tgh-bcat-qv::backdrop { background:rgba(2,26,23,.72); }
html.tgh-bcat-modal-open { overflow:hidden; }
body .tgh-bcat-qv .tgh-bcat-qv-close { position:absolute; top:8px; right:10px; display:flex; align-items:center; justify-content:center; width:36px; height:36px; border:1px solid rgba(11,79,66,.25)!important; border-radius:50%!important; padding:0!important; background:#fff!important; color:#0B4F42!important; font:24px/1 Arial,sans-serif!important; cursor:pointer; box-shadow:none!important; }
.tgh-bcat-qv-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:30px; align-items:start; }
.tgh-bcat-qv-main { aspect-ratio:1/1; overflow:hidden; border-radius:8px; background:#EEECE4; }
.tgh-bcat-qv-image { width:100%; height:100%; display:block; object-fit:contain; }
.tgh-bcat-qv-thumbs { display:flex; gap:8px; margin-top:10px; }
body .tgh-bcat-qv-thumbs button { display:block; width:68px; height:68px; padding:2px!important; margin:0!important; background:transparent!important; border:1px solid var(--tgh-bcat-line)!important; border-radius:5px; cursor:pointer; }
body .tgh-bcat-qv-thumbs button[aria-pressed="true"] { border-color:#C9943D!important; }
.tgh-bcat-qv-thumbs img { display:block; width:100%; height:100%; object-fit:cover; }
.tgh-bcat-qv h2 { font-size:32px; line-height:1.15; margin:0 0 18px; }
.tgh-bcat-qv-specs { margin:0 0 12px; }
.tgh-bcat-qv-specs>div { display:grid; grid-template-columns:115px minmax(0,1fr); gap:12px; border-bottom:1px solid var(--tgh-bcat-line); padding:10px 0; }
.tgh-bcat-qv-specs dt { font-size:11px; color:#6A8178; }
.tgh-bcat-qv-specs dd { font-size:12px; color:#04372F; font-weight:600; text-align:right; margin:0; overflow-wrap:anywhere; }
.tgh-bcat-qv-price { margin-top:18px; padding:0; border:0; }
.tgh-bcat-old-price { color:#75847C; font-size:12px; margin:0 0 5px; }
.tgh-bcat-now-price { color:#0B4F42; font-size:27px; font-weight:600; line-height:1.25; margin:0 0 10px; }
.tgh-bcat-now-price small { font-size:12px; font-weight:500; }
.tgh-bcat-qv-quote { color:#0B4F42; font-size:18px; font-weight:600; line-height:1.4; margin:0 0 8px; }
.tgh-bcat-price-note { color:#63756B; font-size:12px; line-height:1.7; margin:0 0 20px; }
.tgh-bcat-qv-actions { display:flex; flex-direction:column; gap:10px; }
.tgh-bcat-qv-actions .tgh-bcat-text-link { justify-content:center; }
@media(max-width:1024px) {
 .tgh-bcat-page .tgh-bcat-inner { width:calc(100% - 40px); }
 body .tgh-bcat-page .tgh-bcat-product-grid { grid-template-columns:repeat(3,minmax(0,1fr))!important; gap:24px 18px; }
 .tgh-bcat-hero-grid { gap:28px!important; }
 body .tgh-bcat-page .tgh-bcat-term-grid { grid-template-columns:repeat(3,minmax(0,1fr))!important; gap:14px; }
}
@media(max-width:767px) {
 .tgh-bcat-page .tgh-bcat-inner { width:calc(100% - 32px); }
 .tgh-bcat-page .tgh-bcat-hero { padding-top:calc(var(--tgh-bcat-header-gap,88px) + 18px); padding-bottom:30px; }
 .tgh-bcat-page #tgh-bcat-title { font-size:34px; margin-bottom:20px; }
 .tgh-bcat-page .tgh-bcat-hero-grid { grid-template-columns:minmax(0,1fr); gap:22px!important; }
 .tgh-bcat-intro { font-size:13px; line-height:1.8; }
 .tgh-bcat-hero-copy { max-width:none; }
 .tgh-bcat-gold-rule { margin-top:14px; }
 body .tgh-bcat-page .tgh-bcat-term-grid { grid-template-columns:repeat(2,minmax(0,1fr))!important; }
 body .tgh-bcat-page .tgh-bcat-product-grid { grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:22px 14px; }
 .tgh-bcat-terms { padding-top:28px; }
 .tgh-bcat-products { padding-top:28px; }
 .tgh-bcat-filters { gap:12px; padding:14px; }
 .tgh-bcat-filters label { flex-basis:calc(50% - 8px); }
 .tgh-bcat-filters select { font-size:16px; }
 .tgh-bcat-list-heading { align-items:flex-start; }
 .tgh-bcat-list-heading h2 { font-size:27px; }
 .tgh-bcat-card h3 { font-size:12px!important; }
 body .tgh-bcat-page .tgh-bcat-quick-button { font-size:10px!important; bottom:10px; padding:8px 10px!important; min-height:40px; }
 body .tgh-bcat-qv { width:calc(100vw - 20px); max-height:calc(100dvh - 20px); padding:48px 18px 22px; }
 .tgh-bcat-qv-grid { grid-template-columns:minmax(0,1fr); gap:24px; }
 .tgh-bcat-qv h2 { font-size:29px; }
 .tgh-bcat-qv-quote { font-size:16px; }
}
@media(prefers-reduced-motion:reduce){ .tgh-bcat-page *, .tgh-bcat-qv * { transition:none!important; scroll-behavior:auto!important; } }