/* ============================================================
   GIA THAI STONE - Design System 2026
   Palette: trang / xam da / den granite / vang dong nhe
   Prefix: giathai-  (khong dung xung dot voi Flatsome/plugin)
   ============================================================ */

:root {
	--gt-dark: #15171c;
	--gt-dark-2: #1d2026;
	--gt-stone: #2a2e37;
	--gt-text: #2b2f36;
	--gt-muted: #667085;
	--gt-bg: #f5f6f8;
	--gt-line: #e5e8ee;
	--gt-gold: #b98a2e;
	--gt-gold-d: #9c7222;
	--gt-gold-l: #d9b45f;
	--gt-green: #12894a;
	--gt-green-d: #0d6e3b;
	--gt-zalo: #0068ff;
	--gt-zalo-d: #0052cc;
	--gt-red: #d43c2a;
	--gt-radius: 10px;
	--gt-radius-lg: 16px;
	--gt-shadow: 0 4px 18px rgba(21, 23, 28, .08);
	--gt-shadow-lg: 0 16px 44px rgba(21, 23, 28, .16);
	--gt-ease: cubic-bezier(.22, .8, .35, 1);
}

html { scroll-behavior: smooth; }

body.giathai { color: var(--gt-text); }
.giathai .section-title, .giathai h1, .giathai h2, .giathai h3 { letter-spacing: .01em; }

/* ---------- Icons & buttons ---------- */
.giathai-ic { display: inline-flex; width: 1.25em; height: 1.25em; vertical-align: -0.28em; flex: none; }
.giathai-ic svg { width: 100%; height: 100%; }

.giathai-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: .5em;
	padding: .78em 1.5em; border-radius: 8px; font-weight: 700; font-size: 15px;
	line-height: 1.2; letter-spacing: .02em; text-decoration: none; cursor: pointer;
	transition: transform .18s var(--gt-ease), box-shadow .18s var(--gt-ease), background .18s;
	border: 0; white-space: nowrap;
}
.giathai-btn:hover { transform: translateY(-2px); text-decoration: none; }
.giathai-btn--gold { background: linear-gradient(135deg, var(--gt-gold-l), var(--gt-gold)); color: #fff !important; box-shadow: 0 6px 18px rgba(185, 138, 46, .35); }
.giathai-btn--gold:hover { background: linear-gradient(135deg, var(--gt-gold), var(--gt-gold-d)); color: #fff; }
.giathai-btn--green { background: var(--gt-green); color: #fff !important; box-shadow: 0 6px 18px rgba(18, 137, 74, .3); }
.giathai-btn--green:hover { background: var(--gt-green-d); color: #fff; }
.giathai-btn--zalo { background: var(--gt-zalo); color: #fff !important; box-shadow: 0 6px 18px rgba(0, 104, 255, .3); }
.giathai-btn--zalo:hover { background: var(--gt-zalo-d); color: #fff; }
.giathai-btn--dark { background: var(--gt-dark); color: #fff !important; }
.giathai-btn--dark:hover { background: var(--gt-stone); color: #fff; }
.giathai-btn--ghost { background: rgba(255, 255, 255, .12); color: #fff !important; border: 1px solid rgba(255, 255, 255, .45); backdrop-filter: blur(2px); }
.giathai-btn--ghost:hover { background: rgba(255, 255, 255, .22); color: #fff; }
.giathai-btn--outline { background: #fff; color: var(--gt-dark) !important; border: 1.5px solid var(--gt-line); }
.giathai-btn--outline:hover { border-color: var(--gt-gold); color: var(--gt-gold-d) !important; }
.giathai-btn--sm { padding: .5em 1em; font-size: 13px; border-radius: 7px; }

/* ---------- An rac cu: plugin nut goi cu + wishlist ---------- */
#ntg-call-bottom, .call-now-button, #draggable, #quick-call-button,
[id^="quickcallbutton"], .quick-call-button,
.yith-wcwl-add-to-wishlist, .wishlist_table, .image-tools .wishlist-button { display: none !important; }

/* ============================================================
   TOPBAR
   ============================================================ */
.giathai-topbar { background: var(--gt-dark); color: #cfd4dd; font-size: 13px; position: relative; z-index: 12; }
.giathai-topbar-in { display: flex; align-items: center; justify-content: space-between; gap: 16px; max-width: 1230px; margin: 0 auto; padding: 7px 15px; }
.giathai-topbar a { color: #cfd4dd; display: inline-flex; align-items: center; gap: 6px; transition: color .15s; }
.giathai-topbar a:hover { color: var(--gt-gold-l); }
.giathai-topbar-group { display: flex; align-items: center; gap: 20px; min-width: 0; }
.giathai-topbar .giathai-ic { width: 1.1em; height: 1.1em; opacity: .8; }
.giathai-topbar-hot { color: var(--gt-gold-l) !important; font-weight: 700; }
@media (max-width: 849px) { .giathai-topbar { display: none; } }

/* ============================================================
   HEADER MAIN
   ============================================================ */
.giathai .header-main { background: #fff; }
.giathai .header-main .header-inner { align-items: center; }
.giathai .header-logo, .giathai .header-logo-dark { max-height: 64px; width: auto; border-radius: 6px; }

/* Search giua */
.giathai-search { width: 100%; max-width: 480px; margin: 0 auto; }
.giathai-search .searchform .flex-row { border: 2px solid var(--gt-line); border-radius: 999px; overflow: hidden; transition: border-color .15s; background: var(--gt-bg); }
.giathai-search .searchform .flex-row:focus-within { border-color: var(--gt-gold); background: #fff; }
.giathai-search .search-field { border: 0 !important; background: transparent !important; box-shadow: none !important; padding-left: 18px; font-size: 14px; height: 42px; }
.giathai-search .ux-search-submit { background: transparent !important; color: var(--gt-muted) !important; border: 0 !important; min-height: 42px; }
.giathai-search .ux-search-submit:hover { color: var(--gt-gold-d) !important; }

/* Khoi lien he ben phai header */
.giathai-hcta { display: flex; align-items: center; gap: 14px; }
.giathai-hcta-phone { display: flex; align-items: center; gap: 10px; text-align: left; }
.giathai-hcta-phone .giathai-ic { width: 38px; height: 38px; color: var(--gt-gold); background: rgba(185, 138, 46, .1); border-radius: 50%; padding: 8px; }
.giathai-hcta-phone small { display: block; font-size: 11px; color: var(--gt-muted); text-transform: uppercase; letter-spacing: .06em; line-height: 1.3; }
.giathai-hcta-phone strong { display: block; font-size: 18px; color: var(--gt-dark); line-height: 1.2; white-space: nowrap; }
.giathai-hcta-phone:hover strong { color: var(--gt-gold-d); }

/* Gio hang gon */
.giathai-cart { position: relative; display: inline-flex; color: var(--gt-dark); padding: 6px; }
.giathai-cart .giathai-ic { width: 24px; height: 24px; }
.giathai-cart-count { position: absolute; top: -2px; right: -4px; background: var(--gt-gold); color: #fff; font-size: 10px; font-weight: 700; min-width: 16px; height: 16px; border-radius: 999px; display: flex; align-items: center; justify-content: center; padding: 0 4px; }

/* Mobile header */
.giathai-micon { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 9px; margin-left: 6px; }
.giathai-micon .giathai-ic { width: 21px; height: 21px; }
.giathai-micon--tel { background: var(--gt-green); color: #fff !important; }
.giathai-micon--zalo { background: var(--gt-zalo); color: #fff !important; }
@media (max-width: 849px) {
	.giathai .header-main { height: auto; }
	.giathai .header-logo, .giathai .header-logo-dark { max-height: 52px; }
}

/* ============================================================
   NAV BAR (header-bottom) + MEGA MENU + STICKY
   ============================================================ */
.giathai .header-bottom.giathai-nav { background: var(--gt-dark) !important; min-height: 50px; box-shadow: 0 2px 10px rgba(21, 23, 28, .25); }
.giathai-nav .header-bottom-nav > li > a { color: #e8eaef !important; font-size: 13px; letter-spacing: .04em; padding: 0 10px; line-height: 50px; position: relative; white-space: nowrap; }
.giathai-nav .header-bottom-nav > li > a:before { content: ""; position: absolute; left: 10px; right: 10px; bottom: 8px; height: 2px; background: var(--gt-gold-l); transform: scaleX(0); transition: transform .2s var(--gt-ease); transform-origin: left; }
.giathai-nav .header-bottom-nav > li:hover > a:before, .giathai-nav .header-bottom-nav > li.active > a:before { transform: scaleX(1); }
.giathai-nav .header-bottom-nav > li:hover > a, .giathai-nav .header-bottom-nav > li.active > a { color: var(--gt-gold-l) !important; }
/* Flatsome nav-box to nen xanh la mac dinh cho item active -> doi sang vang dong */
.giathai-nav .nav-box > li > a:hover, .giathai-nav .nav-box > li.active > a { background-color: var(--gt-gold) !important; color: #fff !important; }
.giathai-nav .nav-box > li.active > a:before, .giathai-nav .nav-box > li:hover > a:before { display: none; }

/* Mega dropdown */
.giathai-nav .nav-dropdown { border: 0 !important; border-top: 3px solid var(--gt-gold) !important; border-radius: 0 0 12px 12px; box-shadow: var(--gt-shadow-lg); padding: 18px 10px !important; min-width: 640px; }
.giathai-nav .nav-dropdown > li { display: inline-block; width: 49%; vertical-align: top; }
.giathai-nav .nav-dropdown > li > a { padding: 9px 16px !important; font-size: 13.5px !important; color: var(--gt-text) !important; border-radius: 8px; border-bottom: 0 !important; font-weight: 600; }
.giathai-nav .nav-dropdown > li > a:hover { background: var(--gt-bg); color: var(--gt-gold-d) !important; }

/* CTA ben phai nav */
/* Cum CTA tren thanh menu: an mac dinh (header chinh da co du nut),
   chi hien khi sticky vi luc do header chinh bi an */
.giathai-navcta { display: none; align-items: center; gap: 8px; padding: 7px 0; }
.stuck .giathai-navcta { display: flex; }
.giathai-navcta .giathai-btn { font-size: 12.5px; padding: .5em .95em; }
.giathai-navcta-tel { color: #fff !important; font-weight: 700; display: inline-flex; align-items: center; gap: 7px; font-size: 14.5px; margin-right: 4px; white-space: nowrap; }
.giathai-navcta-tel .giathai-ic { color: var(--gt-gold-l); }
.giathai-navcta-tel:hover { color: var(--gt-gold-l) !important; }

/* Logo nho khi sticky */
.giathai-sticky-logo { display: none; align-items: center; margin-right: 14px; }
.giathai-sticky-logo img { max-height: 36px; width: auto; border-radius: 4px; }
.stuck .giathai-sticky-logo { display: flex; }
.giathai .header-bottom.stuck, .stuck .giathai-nav { box-shadow: 0 4px 22px rgba(21, 23, 28, .4); }

/* ============================================================
   MOBILE OFF-CANVAS MENU
   ============================================================ */
.giathai .mobile-sidebar { background: var(--gt-dark-2); }
.giathai .mobile-sidebar .nav > li > a { color: #e8eaef; font-weight: 600; }
.giathai .mobile-sidebar .nav > li { border-color: rgba(255, 255, 255, .07) !important; }
.giathai .mobile-sidebar .nav > li > a:hover, .giathai .mobile-sidebar .nav > li.active > a { color: var(--gt-gold-l); }
.giathai .mobile-sidebar .children a, .giathai .mobile-sidebar .nav-dropdown a { color: #aab0bc; }
.giathai .mobile-sidebar .toggle { color: #aab0bc; }
.giathai .mobile-sidebar .searchform .flex-row { border-radius: 8px; overflow: hidden; }
.giathai-msb-cta { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding: 16px 20px 8px; }
.giathai-msb-cta .giathai-btn { font-size: 13px; padding: .7em .5em; }
.giathai-msb-cta .giathai-btn--gold { grid-column: 1 / -1; }
.giathai-msb-contact { padding: 10px 20px 24px; color: #8b93a1; font-size: 12.5px; line-height: 1.7; }

/* ============================================================
   HERO
   ============================================================ */
.giathai-hero-sec { background: radial-gradient(1200px 500px at 85% -10%, rgba(185, 138, 46, .16), transparent 60%), linear-gradient(160deg, #1a1d24 0%, var(--gt-dark) 55%, #101216 100%); padding: 0 !important; }
.giathai-hero { position: relative; max-width: 1230px; margin: 0 auto; padding: 54px 15px 26px; }
.giathai-hero-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 44px; align-items: center; }
.giathai-hero-eyebrow { display: inline-flex; align-items: center; gap: 8px; color: var(--gt-gold-l); font-size: 13px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; margin-bottom: 14px; }
.giathai-hero-eyebrow:before { content: ""; width: 26px; height: 2px; background: var(--gt-gold); }
.giathai-hero h1 { color: #fff; font-size: 38px; line-height: 1.18; margin: 0 0 16px; }
.giathai-hero h1 em { font-style: normal; color: var(--gt-gold-l); }
.giathai-hero-desc { color: #b9c0cc; font-size: 16.5px; line-height: 1.65; max-width: 560px; margin-bottom: 24px; }
.giathai-hero-cta { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 8px; }

/* Slider anh ben phai */
.giathai-hslides { position: relative; border-radius: var(--gt-radius-lg); overflow: hidden; box-shadow: var(--gt-shadow-lg); aspect-ratio: 4 / 3.4; background: var(--gt-stone); }
.giathai-hslide { position: absolute; inset: 0; opacity: 0; transition: opacity .7s var(--gt-ease); }
.giathai-hslide.is-active { opacity: 1; }
.giathai-hslide img { width: 100%; height: 100%; object-fit: cover; display: block; }
.giathai-hslide-cap { position: absolute; left: 14px; right: 14px; bottom: 14px; background: rgba(21, 23, 28, .82); backdrop-filter: blur(4px); color: #fff; border-radius: 10px; padding: 12px 16px; display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.giathai-hslide-cap strong { font-size: 14.5px; display: block; }
.giathai-hslide-cap span { color: #a7aebc; font-size: 12.5px; display: block; }
.giathai-hslide-cap a { color: var(--gt-gold-l); font-weight: 700; font-size: 13px; white-space: nowrap; }
.giathai-hdots { position: absolute; top: 14px; right: 14px; display: flex; gap: 6px; z-index: 3; }
.giathai-hdots button { width: 22px; height: 4px; border-radius: 4px; background: rgba(255, 255, 255, .4); border: 0; padding: 0; cursor: pointer; transition: background .2s; }
.giathai-hdots button.is-active { background: var(--gt-gold-l); }

/* Trust badges */
.giathai-trust { display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; margin-top: 34px; padding-top: 22px; border-top: 1px solid rgba(255, 255, 255, .1); }
.giathai-trust-item { display: flex; align-items: center; gap: 10px; color: #cfd4dd; font-size: 13px; font-weight: 600; line-height: 1.35; }
.giathai-trust-item .giathai-ic { width: 34px; height: 34px; color: var(--gt-gold-l); background: rgba(185, 138, 46, .14); border-radius: 9px; padding: 7px; }

@media (max-width: 991px) {
	.giathai-hero-grid { grid-template-columns: 1fr; gap: 28px; }
	.giathai-hero h1 { font-size: 30px; }
	.giathai-trust { grid-template-columns: repeat(3, 1fr); row-gap: 14px; }
}
@media (max-width: 549px) {
	.giathai-hero { padding: 34px 15px 20px; }
	.giathai-hero h1 { font-size: 25px; }
	.giathai-hero-desc { font-size: 15px; }
	.giathai-hero-cta .giathai-btn { flex: 1 1 100%; }
	.giathai-trust { grid-template-columns: repeat(2, 1fr); }
	.giathai-hslides { aspect-ratio: 4 / 3; }
}

/* ============================================================
   SECTIONS CHUNG
   ============================================================ */
.giathai-sec { padding: 64px 0; }
.giathai-kicker { color: var(--gt-gold-d); font-size: 12.5px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; margin-bottom: 8px; display: block; text-align: inherit; }
.giathai-h2 { font-size: 30px; color: var(--gt-dark); margin-bottom: 10px; line-height: 1.25; }
.giathai-sub { color: var(--gt-muted); font-size: 15.5px; max-width: 640px; margin: 0 auto 34px; line-height: 1.65; }
.text-center .giathai-sub, .giathai-center .giathai-sub { margin-left: auto; margin-right: auto; }
.giathai-sechead { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 20px; border-bottom: 2px solid var(--gt-line); padding-bottom: 12px; position: relative; }
.giathai-sechead:after { content: ""; position: absolute; left: 0; bottom: -2px; width: 64px; height: 2px; background: var(--gt-gold); }
.giathai-sechead h2 { font-size: 22px; margin: 0; color: var(--gt-dark); }
.giathai-sechead h2 a { color: inherit; }
.giathai-sechead-link { color: var(--gt-gold-d); font-weight: 700; font-size: 13.5px; white-space: nowrap; display: inline-flex; align-items: center; gap: 6px; }
.giathai-sechead-link:hover { color: var(--gt-dark); }
@media (max-width: 549px) { .giathai-h2 { font-size: 24px; } .giathai-sec { padding: 44px 0; } }

/* Fade-up nhe khi cuon */
.giathai-fade { opacity: 0; transform: translateY(22px); transition: opacity .6s var(--gt-ease), transform .6s var(--gt-ease); }
.giathai-fade.is-inview { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .giathai-fade { opacity: 1; transform: none; transition: none; } html { scroll-behavior: auto; } }

/* ============================================================
   CTA STRIP (sau hero) + CTA cuoi trang
   ============================================================ */
.giathai-ctastrip { background: linear-gradient(120deg, var(--gt-gold-d), var(--gt-gold) 55%, var(--gt-gold-l)); border-radius: 0; padding: 22px 15px; }
.giathai-ctastrip-in { max-width: 1230px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 18px; flex-wrap: wrap; }
.giathai-ctastrip p { color: #fff; font-size: 16.5px; font-weight: 700; margin: 0; max-width: 640px; line-height: 1.5; }
.giathai-ctastrip p span { display: block; font-weight: 400; font-size: 13.5px; opacity: .92; margin-top: 3px; }
.giathai-ctastrip-btns { display: flex; gap: 10px; flex-wrap: wrap; }
.giathai-ctastrip .giathai-btn--dark { background: var(--gt-dark); }
.giathai-ctastrip .giathai-btn--light { background: #fff; color: var(--gt-gold-d) !important; }

.giathai-finalcta { background: linear-gradient(160deg, #1a1d24, var(--gt-dark)); border-radius: var(--gt-radius-lg); padding: 52px 30px; text-align: center; position: relative; overflow: hidden; }
.giathai-finalcta:before { content: ""; position: absolute; inset: 0; background: radial-gradient(600px 240px at 50% -20%, rgba(185, 138, 46, .22), transparent 70%); }
.giathai-finalcta > * { position: relative; }
.giathai-finalcta h2 { color: #fff; font-size: 28px; margin-bottom: 10px; }
.giathai-finalcta p { color: #b9c0cc; max-width: 560px; margin: 0 auto 24px; font-size: 15.5px; line-height: 1.65; }
.giathai-finalcta-btns { display: flex; justify-content: center; gap: 12px; flex-wrap: wrap; }

/* ============================================================
   CATEGORY GRID
   ============================================================ */
.giathai-category-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.giathai-cat-card { background: #fff; border-radius: var(--gt-radius); overflow: hidden; box-shadow: var(--gt-shadow); border: 1px solid var(--gt-line); transition: box-shadow .25s var(--gt-ease), transform .25s var(--gt-ease); display: flex; flex-direction: column; }
.giathai-cat-card:hover { box-shadow: var(--gt-shadow-lg); transform: translateY(-4px); }
.giathai-cat-img { position: relative; overflow: hidden; aspect-ratio: 4 / 3; display: block; }
.giathai-cat-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--gt-ease); display: block; }
.giathai-cat-card:hover .giathai-cat-img img { transform: scale(1.06); }
.giathai-cat-body { padding: 16px 18px 18px; display: flex; flex-direction: column; flex: 1; }
.giathai-cat-body h3 { font-size: 16.5px; margin: 0 0 6px; }
.giathai-cat-body h3 a { color: var(--gt-dark); }
.giathai-cat-body h3 a:hover { color: var(--gt-gold-d); }
.giathai-cat-body p { color: var(--gt-muted); font-size: 13px; line-height: 1.55; margin: 0 0 14px; flex: 1; }
.giathai-cat-actions { display: flex; gap: 8px; }
.giathai-cat-actions .giathai-btn { flex: 1; }
@media (max-width: 991px) { .giathai-category-grid { grid-template-columns: repeat(3, 1fr); gap: 14px; } }
@media (max-width: 767px) { .giathai-category-grid { grid-template-columns: repeat(2, 1fr); } .giathai-cat-actions { flex-direction: column; } }

/* ============================================================
   BENEFITS (Vi sao chon) + COUNTERS
   ============================================================ */
.giathai-benefits-sec { background: var(--gt-bg); }
.giathai-benefits { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.giathai-benefit { background: #fff; border-radius: var(--gt-radius); padding: 26px 24px; box-shadow: var(--gt-shadow); border-top: 3px solid transparent; transition: border-color .25s, transform .25s var(--gt-ease), box-shadow .25s; }
.giathai-benefit:hover { border-top-color: var(--gt-gold); transform: translateY(-4px); box-shadow: var(--gt-shadow-lg); }
.giathai-benefit .giathai-ic { width: 48px; height: 48px; color: var(--gt-gold); background: rgba(185, 138, 46, .1); border-radius: 12px; padding: 11px; margin-bottom: 14px; }
.giathai-benefit h3 { font-size: 16.5px; margin: 0 0 8px; color: var(--gt-dark); }
.giathai-benefit p { color: var(--gt-muted); font-size: 13.5px; line-height: 1.6; margin: 0; }
.giathai-counters { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-top: 34px; background: var(--gt-dark); border-radius: var(--gt-radius-lg); padding: 30px 24px; }
.giathai-counter-item { text-align: center; }
.giathai-counter-item strong { display: block; font-size: 32px; color: var(--gt-gold-l); font-weight: 800; line-height: 1.15; }
.giathai-counter-item span { color: #aab0bc; font-size: 13px; }
@media (max-width: 849px) { .giathai-benefits { grid-template-columns: repeat(2, 1fr); gap: 12px; } .giathai-counters { grid-template-columns: repeat(2, 1fr); row-gap: 22px; } }
@media (max-width: 549px) { .giathai-benefits { grid-template-columns: 1fr; } }

/* ============================================================
   PRODUCT CARDS (WooCommerce/Flatsome loop restyle)
   ============================================================ */
.giathai .product-small.box { border-radius: var(--gt-radius); overflow: hidden; background: #fff; border: 1px solid var(--gt-line); box-shadow: 0 2px 10px rgba(21, 23, 28, .05); transition: box-shadow .25s var(--gt-ease), transform .25s var(--gt-ease); }
.giathai .product-small.box:hover { box-shadow: var(--gt-shadow-lg); transform: translateY(-4px); }
.giathai .product-small .box-image img { transition: transform .5s var(--gt-ease); }
.giathai .product-small.box:hover .box-image img { transform: scale(1.07); }
.giathai .product-small .box-text { padding: 12px 14px 14px; }
.giathai .product-small .box-text .product-title, .giathai .product-small .name { font-size: 14.5px; font-weight: 700; line-height: 1.4; }
.giathai .product-small .box-text .product-title a { color: var(--gt-dark); }
.giathai .product-small .box-text .product-title a:hover { color: var(--gt-gold-d); }
.giathai .product-small .price { color: var(--gt-gold-d); font-weight: 700; }
.giathai .product-small .price del { color: var(--gt-muted); opacity: .7; }
.giathai-price-contact { color: var(--gt-green-d); font-weight: 700; font-size: 13.5px; }
/* An nut them gio hang o loop cho gon (van mua duoc trong trang san pham) */
.giathai .product-small .box-text .add-to-cart-button, .giathai .product-small .image-tools { display: none !important; }

/* Badge goc anh */
.giathai-pbadge { position: absolute; top: 10px; left: 10px; z-index: 2; font-size: 11px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: #fff; padding: 4px 9px; border-radius: 6px; pointer-events: none; }
.giathai-pbadge--gold { background: var(--gt-gold); }
.giathai-pbadge--green { background: var(--gt-green); }
.giathai-pbadge--dark { background: rgba(21, 23, 28, .85); }

/* CTA nho trong card */
.giathai-loop-cta { display: flex; gap: 6px; margin-top: 10px; }
.giathai-loop-cta a { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 5px; font-size: 12px; font-weight: 700; padding: 7px 4px; border-radius: 7px; line-height: 1.1; }
.giathai-loop-cta .giathai-lc-tel { background: rgba(18, 137, 74, .1); color: var(--gt-green-d) !important; }
.giathai-loop-cta .giathai-lc-tel:hover { background: var(--gt-green); color: #fff !important; }
.giathai-loop-cta .giathai-lc-zalo { background: rgba(0, 104, 255, .08); color: var(--gt-zalo) !important; }
.giathai-loop-cta .giathai-lc-zalo:hover { background: var(--gt-zalo); color: #fff !important; }
.giathai-loop-cta .giathai-ic { width: 1.05em; height: 1.05em; }

/* ============================================================
   SOLUTIONS (giai phap theo hang muc)
   ============================================================ */
.giathai-solutions { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.giathai-sol-card { position: relative; border-radius: var(--gt-radius); overflow: hidden; min-height: 320px; display: flex; align-items: flex-end; box-shadow: var(--gt-shadow); }
.giathai-sol-card img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .55s var(--gt-ease); }
.giathai-sol-card:hover img { transform: scale(1.06); }
.giathai-sol-card:after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(21, 23, 28, 0) 30%, rgba(21, 23, 28, .88) 78%); }
.giathai-sol-body { position: relative; z-index: 2; padding: 20px; color: #fff; width: 100%; }
.giathai-sol-body h3 { color: #fff; font-size: 18px; margin: 0 0 6px; }
.giathai-sol-pain { color: #c3c9d4; font-size: 13px; line-height: 1.55; margin: 0 0 4px; }
.giathai-sol-fix { color: var(--gt-gold-l); font-size: 13px; line-height: 1.55; margin: 0 0 14px; font-weight: 600; }
@media (max-width: 849px) { .giathai-solutions { grid-template-columns: repeat(2, 1fr); gap: 12px; } .giathai-sol-card { min-height: 280px; } }
@media (max-width: 549px) { .giathai-solutions { grid-template-columns: 1fr; } }

/* ============================================================
   PROCESS TIMELINE
   ============================================================ */
.giathai-process { display: grid; grid-template-columns: repeat(5, 1fr); gap: 14px; counter-reset: gtstep; }
.giathai-step { background: #fff; border: 1px solid var(--gt-line); border-radius: var(--gt-radius); padding: 24px 18px 20px; position: relative; text-align: center; transition: transform .25s var(--gt-ease), box-shadow .25s; }
.giathai-step:hover { transform: translateY(-4px); box-shadow: var(--gt-shadow); }
.giathai-step:before { counter-increment: gtstep; content: "0" counter(gtstep); position: absolute; top: -14px; left: 50%; transform: translateX(-50%); background: var(--gt-gold); color: #fff; font-weight: 800; font-size: 13px; padding: 4px 12px; border-radius: 999px; letter-spacing: .06em; }
.giathai-step .giathai-ic { width: 44px; height: 44px; color: var(--gt-gold); background: rgba(185, 138, 46, .1); border-radius: 50%; padding: 10px; margin: 6px 0 12px; }
.giathai-step h3 { font-size: 14.5px; margin: 0 0 6px; color: var(--gt-dark); }
.giathai-step p { color: var(--gt-muted); font-size: 12.5px; line-height: 1.55; margin: 0; }
.giathai-process-cta { text-align: center; margin-top: 30px; }
.giathai-process-cta p { font-weight: 700; color: var(--gt-dark); font-size: 16px; margin-bottom: 14px; }
@media (max-width: 991px) { .giathai-process { grid-template-columns: repeat(3, 1fr); row-gap: 26px; } }
@media (max-width: 649px) { .giathai-process { grid-template-columns: repeat(2, 1fr); } }

/* ============================================================
   QUOTE FORM SECTION
   ============================================================ */
.giathai-quote-sec { background: linear-gradient(160deg, #1a1d24, var(--gt-dark)); }
.giathai-quote-sec .giathai-kicker { color: var(--gt-gold-l); }
.giathai-quote-sec .giathai-h2 { color: #fff; }
.giathai-quote-sec .giathai-sub { color: #b9c0cc; margin-bottom: 26px; }
.giathai-quote-form { background: #fff; border-radius: var(--gt-radius-lg); padding: 28px; box-shadow: var(--gt-shadow-lg); }
.giathai-quote-form .giathai-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 14px; }
.giathai-quote-form .giathai-fw { grid-column: 1 / -1; }
.giathai-quote-form label { font-size: 13px; font-weight: 700; color: var(--gt-text); display: block; margin-bottom: 4px; }
.giathai-quote-form .wpcf7-form-control-wrap { display: block; margin-bottom: 14px; }
.giathai-quote-form input[type="text"], .giathai-quote-form input[type="tel"], .giathai-quote-form input[type="email"],
.giathai-quote-form select, .giathai-quote-form textarea {
	border: 1.5px solid var(--gt-line); border-radius: 8px; background: var(--gt-bg); box-shadow: none;
	padding: 11px 14px; font-size: 14px; width: 100%; transition: border-color .15s, background .15s; height: auto;
}
.giathai-quote-form input:focus, .giathai-quote-form select:focus, .giathai-quote-form textarea:focus { border-color: var(--gt-gold); background: #fff; outline: 0; }
.giathai-quote-form textarea { min-height: 90px; }
.giathai-quote-form .wpcf7-submit { width: 100%; background: linear-gradient(135deg, var(--gt-gold-l), var(--gt-gold)); color: #fff; font-weight: 700; font-size: 15.5px; border-radius: 8px; padding: 14px; margin: 4px 0 0; border: 0; box-shadow: 0 6px 18px rgba(185, 138, 46, .35); transition: transform .18s var(--gt-ease); }
.giathai-quote-form .wpcf7-submit:hover { transform: translateY(-2px); background: linear-gradient(135deg, var(--gt-gold), var(--gt-gold-d)); }
.giathai-quote-form .wpcf7-not-valid-tip { font-size: 12px; margin-top: -10px; margin-bottom: 8px; display: block; }
.giathai-quote-form .wpcf7-response-output { border-radius: 8px; margin: 12px 0 0; padding: 10px 14px; font-size: 13.5px; }
.giathai-quote-note { color: #8b93a1; font-size: 12.5px; line-height: 1.6; margin-top: 14px; }
@media (max-width: 649px) { .giathai-quote-form .giathai-form-grid { grid-template-columns: 1fr; } .giathai-quote-form { padding: 20px 16px; } }

/* Box lien he canh form */
.giathai-quote-box { background: rgba(255, 255, 255, .05); border: 1px solid rgba(255, 255, 255, .12); border-radius: var(--gt-radius-lg); padding: 26px; color: #cfd4dd; }
.giathai-quote-box h3 { color: #fff; font-size: 18px; margin: 0 0 18px; }
.giathai-quote-box .giathai-btn { width: 100%; margin-bottom: 10px; }
.giathai-qinfo { margin-top: 18px; border-top: 1px solid rgba(255, 255, 255, .12); padding-top: 16px; font-size: 13.5px; }
.giathai-qinfo p { display: flex; gap: 10px; margin: 0 0 12px; line-height: 1.55; }
.giathai-qinfo .giathai-ic { color: var(--gt-gold-l); margin-top: 1px; }
.giathai-qinfo a { color: #fff; }
.giathai-qinfo a:hover { color: var(--gt-gold-l); }

/* ============================================================
   GALLERY + LIGHTBOX
   ============================================================ */
.giathai-gfilter { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-bottom: 24px; }
.giathai-gfilter button { background: #fff; border: 1.5px solid var(--gt-line); color: var(--gt-muted); font-size: 13px; font-weight: 700; border-radius: 999px; padding: 8px 18px; cursor: pointer; transition: all .18s; }
.giathai-gfilter button:hover { border-color: var(--gt-gold); color: var(--gt-gold-d); }
.giathai-gfilter button.is-active { background: var(--gt-dark); border-color: var(--gt-dark); color: #fff; }
.giathai-gallery { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.giathai-gbox { position: relative; border-radius: var(--gt-radius); overflow: hidden; aspect-ratio: 1; display: block; cursor: zoom-in; background: var(--gt-bg); }
.giathai-gbox img { width: 100%; height: 100%; object-fit: cover; transition: transform .45s var(--gt-ease); display: block; }
.giathai-gbox:hover img { transform: scale(1.06); }
.giathai-gbox figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: 24px 12px 10px; background: linear-gradient(transparent, rgba(21, 23, 28, .85)); color: #fff; font-size: 12.5px; font-weight: 600; opacity: 0; transform: translateY(6px); transition: all .25s var(--gt-ease); }
.giathai-gbox:hover figcaption { opacity: 1; transform: none; }
.giathai-gbox.is-hidden { display: none; }
@media (max-width: 849px) { .giathai-gallery { grid-template-columns: repeat(3, 1fr); gap: 8px; } }
@media (max-width: 549px) { .giathai-gallery { grid-template-columns: repeat(2, 1fr); } .giathai-gbox figcaption { opacity: 1; transform: none; } }

.giathai-lightbox { position: fixed; inset: 0; z-index: 99999; background: rgba(12, 13, 16, .94); display: flex; align-items: center; justify-content: center; opacity: 0; pointer-events: none; transition: opacity .25s; }
.giathai-lightbox.is-open { opacity: 1; pointer-events: auto; }
.giathai-lightbox img { max-width: 92vw; max-height: 86vh; border-radius: 8px; box-shadow: 0 20px 80px rgba(0, 0, 0, .6); }
.giathai-lb-cap { position: absolute; bottom: 22px; left: 50%; transform: translateX(-50%); color: #cfd4dd; font-size: 14px; background: rgba(21, 23, 28, .8); padding: 6px 16px; border-radius: 999px; max-width: 90vw; text-align: center; }
.giathai-lb-close, .giathai-lb-prev, .giathai-lb-next { position: absolute; background: rgba(255, 255, 255, .1); border: 0; color: #fff; width: 44px; height: 44px; border-radius: 50%; cursor: pointer; font-size: 20px; line-height: 1; display: flex; align-items: center; justify-content: center; transition: background .18s; }
.giathai-lb-close:hover, .giathai-lb-prev:hover, .giathai-lb-next:hover { background: var(--gt-gold); }
.giathai-lb-close { top: 18px; right: 18px; }
.giathai-lb-prev { left: 14px; top: 50%; transform: translateY(-50%); }
.giathai-lb-next { right: 14px; top: 50%; transform: translateY(-50%); }

/* ============================================================
   BLOG CARDS
   ============================================================ */
.giathai .blog-sec .box-blog-post .box-text { padding: 16px 18px 18px; }
.giathai .blog-sec .box-blog-post { border-radius: var(--gt-radius); overflow: hidden; border: 1px solid var(--gt-line); background: #fff; box-shadow: 0 2px 10px rgba(21, 23, 28, .05); transition: box-shadow .25s, transform .25s var(--gt-ease); }
.giathai .blog-sec .box-blog-post:hover { box-shadow: var(--gt-shadow-lg); transform: translateY(-4px); }
.giathai .blog-sec .post-title { font-size: 16px; line-height: 1.45; }
.giathai .blog-sec .box-image img { transition: transform .5s var(--gt-ease); }
.giathai .blog-sec .box-blog-post:hover .box-image img { transform: scale(1.06); }

/* ============================================================
   FAQ
   ============================================================ */
.giathai-faq { max-width: 780px; margin: 0 auto; }
.giathai-faq-item { background: #fff; border: 1px solid var(--gt-line); border-radius: var(--gt-radius); margin-bottom: 10px; overflow: hidden; transition: box-shadow .2s; }
.giathai-faq-item.is-open { box-shadow: var(--gt-shadow); border-color: rgba(185, 138, 46, .4); }
.giathai-faq-q { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 14px; background: none; border: 0; padding: 16px 20px; font-size: 15px; font-weight: 700; color: var(--gt-dark); text-align: left; cursor: pointer; text-transform: none; letter-spacing: .01em; margin: 0; min-height: 0; line-height: 1.5; }
.giathai-faq-q:hover { color: var(--gt-gold-d); }
.giathai-faq-q svg { flex: none; width: 18px; height: 18px; transition: transform .25s var(--gt-ease); color: var(--gt-gold-d); }
.giathai-faq-item.is-open .giathai-faq-q svg { transform: rotate(45deg); }
.giathai-faq-a { max-height: 0; overflow: hidden; transition: max-height .3s var(--gt-ease); }
.giathai-faq-a > div { padding: 0 20px 18px; color: var(--gt-muted); font-size: 14px; line-height: 1.7; }

/* ============================================================
   FOOTER
   ============================================================ */
.giathai-footer { background: linear-gradient(180deg, var(--gt-dark-2), #101216); color: #aab0bc; font-size: 14px; }
.giathai-footer-main { max-width: 1230px; margin: 0 auto; padding: 54px 15px 40px; display: grid; grid-template-columns: 1.3fr 1fr 1fr 1.25fr; gap: 36px; }
.giathai-footer h4 { color: #fff; font-size: 14px; letter-spacing: .12em; text-transform: uppercase; margin: 0 0 18px; position: relative; padding-bottom: 10px; }
.giathai-footer h4:after { content: ""; position: absolute; left: 0; bottom: 0; width: 34px; height: 2px; background: var(--gt-gold); }
.giathai-footer-brand strong { display: block; color: #fff; font-size: 20px; letter-spacing: .04em; margin-bottom: 2px; }
.giathai-footer-brand em { display: block; color: var(--gt-gold-l); font-size: 13px; font-style: normal; letter-spacing: .06em; margin-bottom: 14px; }
.giathai-footer-brand p { font-size: 13.5px; line-height: 1.7; margin-bottom: 18px; }
.giathai-footer-social { display: flex; gap: 10px; }
.giathai-footer-social a { display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 9px; background: rgba(255, 255, 255, .07); color: #cfd4dd; transition: all .18s; }
.giathai-footer-social a:hover { background: var(--gt-gold); color: #fff; transform: translateY(-2px); }
.giathai-footer ul { margin: 0; padding: 0; list-style: none; }
.giathai-footer ul li { margin-bottom: 9px; }
.giathai-footer ul a { color: #aab0bc; font-size: 13.5px; transition: color .15s, padding-left .15s; }
.giathai-footer ul a:hover { color: var(--gt-gold-l); padding-left: 4px; }
.giathai-footer-contact p { display: flex; gap: 10px; font-size: 13.5px; line-height: 1.6; margin: 0 0 13px; }
.giathai-footer-contact .giathai-ic { color: var(--gt-gold-l); margin-top: 2px; }
.giathai-footer-contact a { color: #e8eaef; font-weight: 600; }
.giathai-footer-contact a:hover { color: var(--gt-gold-l); }
.giathai-footer-contact .giathai-fhot { font-size: 16px; font-weight: 800; color: var(--gt-gold-l) !important; }
.giathai-footer-bottom { border-top: 1px solid rgba(255, 255, 255, .08); }
.giathai-footer-bottom-in { max-width: 1230px; margin: 0 auto; padding: 16px 15px; display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; font-size: 12.5px; color: #767e8c; }
.giathai-footer-bottom a { color: #aab0bc; }
.giathai-footer-bottom a:hover { color: var(--gt-gold-l); }
@media (max-width: 991px) { .giathai-footer-main { grid-template-columns: 1fr 1fr; gap: 30px; } }
@media (max-width: 549px) { .giathai-footer-main { grid-template-columns: 1fr; gap: 26px; padding: 40px 15px 28px; } }

/* ============================================================
   STICKY MOBILE BAR + FLOATING DESKTOP
   ============================================================ */
.giathai-mbar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 9999; display: none; grid-template-columns: repeat(4, 1fr); background: #fff; border-top: 1px solid var(--gt-line); box-shadow: 0 -6px 24px rgba(21, 23, 28, .12); padding-bottom: env(safe-area-inset-bottom); }
.giathai-mbar a { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; padding: 9px 4px 8px; font-size: 11px; font-weight: 700; color: var(--gt-text) !important; line-height: 1; }
.giathai-mbar .giathai-ic { width: 21px; height: 21px; }
.giathai-mbar-tel { color: var(--gt-green-d) !important; }
.giathai-mbar-zalo { color: var(--gt-zalo) !important; }
.giathai-mbar-quote { background: linear-gradient(135deg, var(--gt-gold-l), var(--gt-gold)); color: #fff !important; }
@media (max-width: 849px) {
	.giathai-mbar { display: grid; }
	body.giathai { padding-bottom: 58px; }
	.giathai .back-to-top { bottom: 70px !important; }
}

.giathai-float { position: fixed; right: 18px; bottom: 26px; z-index: 9998; display: flex; flex-direction: column; gap: 10px; }
.giathai-float a { position: relative; display: flex; align-items: center; justify-content: center; width: 50px; height: 50px; border-radius: 50%; color: #fff !important; box-shadow: 0 8px 24px rgba(21, 23, 28, .28); transition: transform .18s var(--gt-ease); }
.giathai-float a:hover { transform: scale(1.08); }
.giathai-float .giathai-ic { width: 24px; height: 24px; }
.giathai-float-tel { background: var(--gt-green); }
.giathai-float-zalo { background: var(--gt-zalo); }
.giathai-float-quote { background: linear-gradient(135deg, var(--gt-gold-l), var(--gt-gold)); }
.giathai-float a:after { content: attr(data-tip); position: absolute; right: 60px; top: 50%; transform: translateY(-50%) translateX(6px); background: var(--gt-dark); color: #fff; font-size: 12px; font-weight: 600; padding: 6px 12px; border-radius: 7px; white-space: nowrap; opacity: 0; pointer-events: none; transition: all .18s var(--gt-ease); }
.giathai-float a:hover:after { opacity: 1; transform: translateY(-50%); }
.giathai-float-tel:before { content: ""; position: absolute; inset: -6px; border-radius: 50%; border: 2px solid var(--gt-green); opacity: 0; animation: giathai-pulse 2s ease-out infinite; }
@keyframes giathai-pulse { 0% { transform: scale(.85); opacity: .8; } 100% { transform: scale(1.25); opacity: 0; } }
@media (max-width: 849px) { .giathai-float { display: none; } }

/* ============================================================
   WOOCOMMERCE - CATEGORY / ARCHIVE
   ============================================================ */
.giathai.archive.woocommerce .shop-page-title { background: linear-gradient(160deg, #1a1d24, var(--gt-dark)); padding: 40px 0 34px; }
.giathai.archive.woocommerce .shop-page-title .page-title-inner { min-height: 0; }
.giathai.archive.woocommerce .shop-page-title h1, .giathai.archive .page-title h1,
.giathai.archive.woocommerce .shop-page-title .is-large { color: #fff; }
.giathai.archive .woocommerce-breadcrumb, .giathai .breadcrumbs { color: #8b93a1; font-size: 13px; }
.giathai.archive .woocommerce-breadcrumb a, .giathai .breadcrumbs a { color: #c3c9d4; }
.giathai.archive .woocommerce-breadcrumb a:hover, .giathai .breadcrumbs a:hover { color: var(--gt-gold-l); }
.giathai .shop-page-title .term-description { color: #b9c0cc; }
.giathai-cat-h1 { font-size: 26px; color: var(--gt-dark); margin: 4px 0 6px; }
.giathai .term-description { color: var(--gt-muted); font-size: 14px; max-width: 760px; line-height: 1.65; }
.giathai.woocommerce .products.row { row-gap: 6px; }
.giathai .woocommerce-result-count { display: none; }

/* Sidebar shop: bo nen hoa van cu, ve card sach */
.giathai .sidebar .widget, .giathai .sidebar-inner .widget { background: #fff !important; background-image: none !important; border: 1px solid var(--gt-line); border-radius: var(--gt-radius); padding: 16px 18px !important; margin-bottom: 20px; }
.giathai .sidebar .widget ul, .giathai .sidebar .widget li { background: none !important; background-image: none !important; border: 0 !important; }
.giathai .sidebar .widget-title, .giathai .sidebar .widget .widget-title { background: none !important; color: var(--gt-dark) !important; font-size: 13.5px; letter-spacing: .1em; text-transform: uppercase; display: block; border-bottom: 2px solid var(--gt-line); padding: 0 0 9px !important; margin-bottom: 10px; position: relative; }
.giathai .sidebar .widget-title:after { content: ""; position: absolute; left: 0; bottom: -2px; width: 40px; height: 2px; background: var(--gt-gold); }
.giathai .sidebar .widget li a { color: var(--gt-text) !important; font-size: 13.5px; padding: 6px 0 !important; display: block; transition: color .15s, padding-left .15s; }
.giathai .sidebar .widget li a:hover, .giathai .sidebar .widget li.current-cat > a { color: var(--gt-gold-d) !important; padding-left: 4px !important; font-weight: 700; }
.giathai .sidebar .is-divider { display: none; }

/* ============================================================
   WOOCOMMERCE - SINGLE PRODUCT
   ============================================================ */
.giathai .product-info .product-title, .giathai .product-info .product_title { font-size: 26px; line-height: 1.3; }
.giathai .product-info .price { font-size: 20px; color: var(--gt-gold-d); }
.giathai-pinfo { background: var(--gt-bg); border: 1px solid var(--gt-line); border-radius: var(--gt-radius); padding: 14px 18px; margin: 16px 0; }
.giathai-pinfo p { display: flex; gap: 10px; align-items: flex-start; font-size: 13.5px; margin: 0 0 8px; color: var(--gt-text); }
.giathai-pinfo p:last-child { margin-bottom: 0; }
.giathai-pinfo .giathai-ic { color: var(--gt-gold-d); margin-top: 1px; }
.giathai-pinfo strong { color: var(--gt-dark); }
.giathai-pcta { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 18px 0 8px; }
.giathai-pcta .giathai-btn { font-size: 14px; padding: .85em 1em; }
.giathai-pcta .giathai-btn--gold { grid-column: 1 / -1; font-size: 15.5px; }
.giathai-pcta-note { font-size: 12.5px; color: var(--gt-muted); margin: 6px 0 0; line-height: 1.6; }
.giathai .product-footer .woocommerce-tabs { border-top: 1px solid var(--gt-line); }
@media (max-width: 549px) { .giathai-pcta { grid-template-columns: 1fr; } }

/* ============================================================
   PAGES: LIEN HE / GIOI THIEU
   ============================================================ */
.giathai-contact-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-bottom: 10px; }
.giathai-ccard { background: #fff; border: 1px solid var(--gt-line); border-radius: var(--gt-radius); padding: 22px 20px; box-shadow: var(--gt-shadow); }
.giathai-ccard .giathai-ic { width: 42px; height: 42px; color: var(--gt-gold); background: rgba(185, 138, 46, .1); border-radius: 10px; padding: 9px; margin-bottom: 12px; }
.giathai-ccard h3 { font-size: 15px; margin: 0 0 6px; }
.giathai-ccard p { font-size: 13.5px; color: var(--gt-muted); line-height: 1.6; margin: 0; }
.giathai-ccard a { color: var(--gt-dark); font-weight: 700; }
.giathai-ccard a:hover { color: var(--gt-gold-d); }
.giathai-map { border-radius: var(--gt-radius-lg); overflow: hidden; box-shadow: var(--gt-shadow); line-height: 0; }
.giathai-map iframe { width: 100%; height: 340px; border: 0; }
@media (max-width: 767px) { .giathai-contact-cards { grid-template-columns: 1fr; } }

.giathai-values { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.giathai-value { background: #fff; border: 1px solid var(--gt-line); border-top: 3px solid var(--gt-gold); border-radius: var(--gt-radius); padding: 22px 20px; box-shadow: var(--gt-shadow); }
.giathai-value h3 { font-size: 15.5px; margin: 0 0 8px; color: var(--gt-dark); text-transform: uppercase; letter-spacing: .05em; }
.giathai-value p { font-size: 13.5px; color: var(--gt-muted); line-height: 1.65; margin: 0; }
@media (max-width: 849px) { .giathai-values { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 549px) { .giathai-values { grid-template-columns: 1fr; } }

/* Mot vai don dep chung */
.giathai .section { position: relative; }
.giathai #main { background-color: #fff; }
.giathai .shop-container .term-description { margin-top: 8px; }

/* ============================================================
   VINASITE PORT - phan bo sung khi chuyen tu Flatsome sang VinaSite
   ============================================================ */

/* ---------- Header bar ---------- */
.giathai-hd-bar { background: #fff; box-shadow: 0 1px 0 var(--gt-line); }
.giathai-hd-in { display: flex; align-items: center; gap: 20px; padding: 12px 15px; }
.giathai-hd-logo img { max-height: 60px; width: auto; display: block; }
.giathai-hd-logotext { font-weight: 800; font-size: 20px; color: var(--gt-dark); letter-spacing: .04em; white-space: nowrap; }
.giathai-hd-search { flex: 1; max-width: 480px; margin: 0 auto; }
.giathai-hd-search form { display: flex; border: 2px solid var(--gt-line); border-radius: 999px; overflow: hidden; background: var(--gt-bg); transition: border-color .15s; }
.giathai-hd-search form:focus-within { border-color: var(--gt-gold); background: #fff; }
.giathai-hd-search input[type="search"] { flex: 1; border: 0; background: transparent; padding: 10px 18px; font-size: 14px; outline: 0; min-width: 0; box-shadow: none; }
.giathai-hd-search button { border: 0; background: transparent; color: var(--gt-muted); padding: 0 16px; cursor: pointer; display: flex; align-items: center; }
.giathai-hd-search button:hover { color: var(--gt-gold-d); }
.giathai-hd-search .giathai-ic { width: 18px; height: 18px; }
.giathai-hd-actions { display: flex; align-items: center; gap: 12px; margin-left: auto; }
.giathai-burger { display: none; background: var(--gt-dark); color: #fff; border: 0; width: 42px; height: 42px; border-radius: 9px; align-items: center; justify-content: center; cursor: pointer; }
.giathai-burger .giathai-ic { width: 22px; height: 22px; }
.giathai-hd-monly { display: none; }

/* Sticky: dragon.js them .is-stuck vao #dragon-bar */
#dragon-bar.is-stuck { position: fixed; top: 0; left: 0; right: 0; z-index: 9990; box-shadow: 0 6px 24px rgba(21, 23, 28, .14); animation: giathai-slidedown .25s var(--gt-ease); }
@keyframes giathai-slidedown { from { transform: translateY(-100%); } to { transform: none; } }
#dragon-bar.is-stuck .giathai-hd-logo img { max-height: 46px; }

/* ---------- Thanh menu chinh ---------- */
.giathai-nbar { background: var(--gt-dark); box-shadow: 0 2px 10px rgba(21, 23, 28, .25); }
.giathai-menu { display: flex; flex-wrap: wrap; margin: 0; padding: 0; list-style: none; }
.giathai-menu > li { position: relative; margin: 0; }
.giathai-menu > li > a { display: block; color: #e8eaef; font-size: 13.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; padding: 15px 14px; line-height: 1.2; white-space: nowrap; }
.giathai-menu > li:hover > a, .giathai-menu > li.current-menu-item > a, .giathai-menu > li.current_page_item > a, .giathai-menu > li.current-menu-ancestor > a { background: var(--gt-gold); color: #fff; }
.giathai-menu .sub-menu { position: absolute; top: 100%; left: 0; min-width: 620px; background: #fff; border-top: 3px solid var(--gt-gold); border-radius: 0 0 12px 12px; box-shadow: var(--gt-shadow-lg); padding: 16px 10px; margin: 0; list-style: none; display: none; z-index: 99; }
.giathai-menu > li:hover > .sub-menu, .giathai-menu > li:focus-within > .sub-menu { display: block; }
.giathai-menu .sub-menu li { display: inline-block; width: 49%; margin: 0; }
.giathai-menu .sub-menu a { display: block; padding: 9px 16px; color: var(--gt-text); font-size: 13.5px; font-weight: 600; border-radius: 8px; }
.giathai-menu .sub-menu a:hover { background: var(--gt-bg); color: var(--gt-gold-d); }

@media (max-width: 991px) { .giathai-menu .sub-menu { min-width: 420px; } .giathai-hd-search { max-width: 300px; } }
@media (max-width: 849px) {
	.giathai-nbar, .giathai-hd-search { display: none; }
	.giathai-hd .giathai-hcta-phone, .giathai-hd-zalo, .giathai-hd-quote, .giathai-hd .giathai-cart { display: none !important; }
	.giathai-hd-monly { display: inline-flex; }
	.giathai-burger { display: inline-flex; }
	.giathai-hd-logo img { max-height: 48px; }
	.giathai-hd-in { gap: 10px; padding: 10px 15px; }
}

/* ---------- Off-canvas skin ---------- */
.giathai-offcanvas { background: var(--gt-dark-2) !important; color: #e8eaef; }
.giathai-offcanvas .dragon-offcanvas__nav a { color: #e8eaef; }
.giathai-offcanvas .dragon-offcanvas__nav a:hover { color: var(--gt-gold-l); }
.giathai-offcanvas .dragon-offcanvas__close { color: #e8eaef; background: rgba(255, 255, 255, .08); border: 0; width: 36px; height: 36px; border-radius: 8px; cursor: pointer; font-size: 15px; }
.giathai-offcanvas .giathai-msb-cta { padding: 16px; }
.giathai-offcanvas .giathai-msb-contact { padding: 0 16px 24px; }

/* ---------- Shim sections (noi dung trang chu / trang con) ---------- */
.giathai-hero-sec > .dragon-container { max-width: 100%; padding: 0; }
.vs-ux-section .giathai-ctastrip { border-radius: 14px; }
.giathai-front .vs-ux-row { row-gap: 6px; }

/* ---------- WooCommerce: loop mac dinh thanh card ---------- */
.giathai ul.products { display: grid !important; grid-template-columns: repeat(4, 1fr); gap: 20px; margin: 0 0 30px; padding: 0; list-style: none; }
.giathai ul.products::before, .giathai ul.products::after { display: none !important; }
.giathai ul.products li.product { width: auto !important; float: none !important; margin: 0 !important; position: relative; background: #fff; border: 1px solid var(--gt-line); border-radius: var(--gt-radius); overflow: hidden; box-shadow: 0 2px 10px rgba(21, 23, 28, .05); transition: box-shadow .25s var(--gt-ease), transform .25s var(--gt-ease); display: flex; flex-direction: column; padding: 0 0 14px !important; }
.giathai ul.products li.product:hover { box-shadow: var(--gt-shadow-lg); transform: translateY(-4px); }
.giathai ul.products li.product img { width: 100%; height: auto; display: block; margin: 0 !important; transition: transform .5s var(--gt-ease); }
.giathai ul.products li.product:hover img { transform: scale(1.06); }
.giathai ul.products li.product .woocommerce-loop-product__title { font-size: 14.5px; font-weight: 700; padding: 12px 14px 4px; color: var(--gt-dark); line-height: 1.4; }
.giathai ul.products li.product .price { padding: 0 14px; color: var(--gt-gold-d); font-weight: 700; margin: 0; }
.giathai ul.products li.product .button, .giathai ul.products li.product .add_to_cart_button, .giathai ul.products li.product .added_to_cart { display: none !important; }
.giathai ul.products li.product .giathai-loop-cta { margin: 10px 14px 0; }
.giathai ul.products li.product .onsale { position: absolute; top: 10px; right: 10px; left: auto; z-index: 2; background: var(--gt-red); color: #fff; border-radius: 6px; padding: 3px 8px; font-size: 11px; font-weight: 700; min-height: 0; line-height: 1.4; }
.giathai ul.products li.product .giathai-pbadge { top: 10px; left: 10px; }
@media (max-width: 991px) { .giathai ul.products { grid-template-columns: repeat(3, 1fr); gap: 14px; } }
@media (max-width: 649px) { .giathai ul.products { grid-template-columns: repeat(2, 1fr); gap: 10px; } }

/* Khung trang Woo (wrapper mac dinh cua WooCommerce) */
.giathai.woocommerce #container, .giathai.woocommerce-page #container { max-width: 1230px; margin: 0 auto; padding: 0 15px; }
.giathai .woocommerce-breadcrumb { font-size: 13px; color: var(--gt-muted); margin: 18px 0 10px; }
.giathai .woocommerce-breadcrumb a { color: var(--gt-text); }
.giathai .woocommerce-breadcrumb a:hover { color: var(--gt-gold-d); }
.giathai .woocommerce-products-header { margin-bottom: 18px; }
.giathai .woocommerce-ordering select { border: 1.5px solid var(--gt-line); border-radius: 8px; padding: 8px 12px; }

/* Trang san pham chi tiet */
.giathai div.product .product_title { font-size: 26px; line-height: 1.3; }
.giathai div.product p.price { font-size: 20px; color: var(--gt-gold-d); }
.giathai .woocommerce-tabs { margin-top: 30px; }
.giathai .woocommerce-tabs ul.tabs li a { font-weight: 700; }
.giathai .related.products > h2 { font-size: 20px; margin: 34px 0 16px; }

/* ---------- [ux_products] grid moi ---------- */
.giathai-pgrid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-bottom: 34px; }
.giathai-pgrid--3 { grid-template-columns: repeat(3, 1fr); }
.giathai-pcard { background: #fff; border: 1px solid var(--gt-line); border-radius: var(--gt-radius); overflow: hidden; box-shadow: 0 2px 10px rgba(21, 23, 28, .05); transition: box-shadow .25s var(--gt-ease), transform .25s var(--gt-ease); display: flex; flex-direction: column; }
.giathai-pcard:hover { box-shadow: var(--gt-shadow-lg); transform: translateY(-4px); }
.giathai-pcard-img { position: relative; display: block; overflow: hidden; aspect-ratio: 1; }
.giathai-pcard-img img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .5s var(--gt-ease); }
.giathai-pcard:hover .giathai-pcard-img img { transform: scale(1.07); }
.giathai-pcard-body { padding: 12px 14px 14px; display: flex; flex-direction: column; flex: 1; }
.giathai-pcard-title { font-size: 14.5px; margin: 0 0 6px; line-height: 1.4; font-weight: 700; }
.giathai-pcard-title a { color: var(--gt-dark); }
.giathai-pcard-title a:hover { color: var(--gt-gold-d); }
.giathai-pcard-price { color: var(--gt-gold-d); font-weight: 700; margin-bottom: 6px; min-height: 22px; }
.giathai-pcard .giathai-loop-cta { margin-top: auto; }
@media (max-width: 991px) { .giathai-pgrid { grid-template-columns: repeat(3, 1fr); gap: 14px; } }
@media (max-width: 649px) { .giathai-pgrid { grid-template-columns: repeat(2, 1fr); gap: 10px; } }

/* ---------- [blog_posts] grid moi ---------- */
.giathai-bgrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.giathai-bcard { background: #fff; border: 1px solid var(--gt-line); border-radius: var(--gt-radius); overflow: hidden; box-shadow: 0 2px 10px rgba(21, 23, 28, .05); transition: box-shadow .25s var(--gt-ease), transform .25s var(--gt-ease); }
.giathai-bcard:hover { box-shadow: var(--gt-shadow-lg); transform: translateY(-4px); }
.giathai-bcard-img { display: block; aspect-ratio: 16 / 10; overflow: hidden; }
.giathai-bcard-img img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .5s var(--gt-ease); }
.giathai-bcard:hover .giathai-bcard-img img { transform: scale(1.06); }
.giathai-bcard-body { padding: 16px 18px 18px; }
.giathai-bcard-date { font-size: 12px; color: var(--gt-muted); }
.giathai-bcard h3 { font-size: 16px; margin: 6px 0 8px; line-height: 1.45; }
.giathai-bcard h3 a { color: var(--gt-dark); }
.giathai-bcard h3 a:hover { color: var(--gt-gold-d); }
.giathai-bcard p { font-size: 13.5px; color: var(--gt-muted); line-height: 1.6; margin: 0 0 10px; }
.giathai-bcard-more { color: var(--gt-gold-d); font-weight: 700; font-size: 13px; }
.giathai-bcard-more:hover { color: var(--gt-dark); }
@media (max-width: 849px) { .giathai-bgrid { grid-template-columns: repeat(2, 1fr); gap: 12px; } }
@media (max-width: 549px) { .giathai-bgrid { grid-template-columns: 1fr; } }

/* ---------- Bo gach chan link tu dragon-base o cac vung giao dien giathai ---------- */
.giathai .giathai-hd a, .giathai .giathai-menu a, .giathai .giathai-footer a,
.giathai .giathai-pcard a, .giathai .giathai-bcard a, .giathai .giathai-cat-body a,
.giathai .giathai-sechead a, .giathai .giathai-hslide-cap a, .giathai .giathai-btn,
.giathai .giathai-loop-cta a, .giathai .giathai-mbar a, .giathai .giathai-float a,
.giathai .giathai-quote-box a, .giathai .giathai-qinfo a, .giathai .giathai-ccard a,
.giathai .giathai-offcanvas a, .giathai ul.products li.product a,
.giathai .giathai-hero-cta a, .giathai .giathai-ctastrip a, .giathai .giathai-finalcta a,
.giathai .woocommerce-breadcrumb a, .giathai .giathai-sechead-link, .giathai .giathai-bcard-more {
	text-decoration: none !important;
}

/* Logo khong bi flex ep nho */
.giathai-hd-logo { flex: none; display: block; }
.giathai-hd-logo img { max-height: 60px; width: auto; max-width: 260px; object-fit: contain; }
@media (max-width: 849px) { .giathai-hd-logo img { max-height: 48px; max-width: 190px; } }

/* Wrapper Woo mac dinh (#primary.content-area) can vao container */
.giathai #primary.content-area, .giathai .content-area { max-width: 1230px; margin: 0 auto; padding: 24px 15px 40px; }
.giathai-cat-h1 { color: var(--gt-dark); }
