@charset "UTF-8";
/*
 * Đúc đồng Chiến Thắng: màu, chữ + kiểu cho ô / element gốc của Flatsome do công cụ dựng gắn class ddt-*.
 * Element Flatsome chủ shop tự thêm (không có class ddt-*) giữ kiểu Flatsome, chỉ nhận màu chung.
 * CSS Flatsome nằm trong lớp cascade (inc/flatsome/layout.php) nên luật ở đây thắng mà không cần !important.
 */

/* ========== Màu, chữ: nền trắng, chữ đen, nhấn vàng nâu, phối đỏ ========== */
:root{
	--primary:#783F04;--primary-hover:#5C3003;--on-primary:#fff;
	--gold:#F1C232;--gold-hover:#E2AE14;--on-gold:#1A1A1A;
	/* Nền nâu tối (Dịch vụ, Số liệu, Mời tư vấn, Chân trang): tiêu đề kem vàng, chữ thường trắng 90%, nút vàng chữ nâu đậm. */
	--on-dark:#FBEBC8;--on-dark-2:rgba(255,255,255,.9);--gold-soft:#F8E3A3;--brown-deep:#3A1D06;
	--red:#CC0000;--red-hover:#A80000;
	--secondary:#FBF5ED;--tint:#FBF1D6;--accent:#CC0000;--on-accent:#fff;
	--bg:#FFFFFF;--surface:#FFFFFF;--text:#1A1A1A;--text-2:#5A5047;--border:#ECE4D6;--border-strong:#B9A88F;
	--sale:#CC0000;--footer:#2B1B10;--footer-text:#F3E6CF;--footer-accent:#F3CF7E;
	--font-display:var(--font-ui);--dw:700;
	--r-sm:4px;--r-md:8px;--r-lg:12px;--r-xl:16px;--r-btn:999px;
	--shadow-card:0 3px 12px rgba(60,32,4,.06);--shadow-hover:0 10px 24px rgba(60,32,4,.12);
	/* Thẻ sản phẩm, danh mục, công trình, nhận xét ở trang chủ: viền mảnh + bóng đậm về cạnh dưới để mép thẻ rõ trên nền cùng màu. */
	--card-border:rgba(60,32,4,.05);--card-shadow:0 1px 2px rgba(60,32,4,.06),0 6px 16px rgba(60,32,4,.10);
	--card-shadow-hover:0 2px 4px rgba(60,32,4,.06),0 14px 30px rgba(60,32,4,.16);
	--tap:44px;
	/* Cỡ chữ theo vai trò, cao nút, khoảng cách khối; cỡ máy tính bảng / điện thoại ở ngay sau khối :root. */
	--fs-hero:48px;--fs-h1:36px;--fs-h2:36px;--fs-h3:26px;--fs-h4:20px;--fs-card:18px;--fs-card-sm:16px;--fs-lead:17px;--fs-body:16px;
	--space-title:28px;--section:48px;
	/* Ô nhập form (trừ form Liên hệ trang chủ bo tròn hai đầu): cao bằng nút vừa, chữ 16px để iPhone không tự phóng to. */
	--field-h:48px;
	--btn-h-sm:40px;--btn-h:48px;--btn-h-lg:56px;
	/* Khung .sb-container (giỏ, thanh toán, tài khoản) cùng bề rộng nội dung đầu trang Flatsome: 1220px + lề 15px. */
	--container:1220px;--gutter:15px;
}
/* --section của khuôn gốc đổi ở 1023px / 767px; trang dựng bằng Flatsome đổi cột ở 849px / 549px nên đổi theo Flatsome. */
@media (max-width:849px){:root{--fs-hero:34px;--fs-h1:30px;--fs-h2:30px;--fs-h3:24px;--section:40px}}
@media (max-width:549px){:root{--fs-hero:28px;--fs-h1:26px;--fs-h2:26px;--fs-h3:22px;--fs-h4:18px;--fs-card:16px;--fs-lead:16px;--space-title:18px;--section:28px}}
/* Chữ thường 16px (khuôn gốc của theme để 15px): chữ nhỏ hơn khó đọc, iPhone còn tự phóng to ô nhập. */
body{font-size:16px}

/* Luật a{} của thiết kế (không thuộc lớp nào) đè màu chữ và gạch chân của ô Flatsome: trả về kiểu Flatsome. */
:is(#header,.ddt-footer,.ddt-cats,.ddt-works,.ddt-posts,.ddt-row .ux-menu) a:not(.button),
:is(#header,.ddt-footer,.ddt-cats,.ddt-works,.ddt-posts,.ddt-row .ux-menu) a:not(.button):hover{color:revert-layer;text-decoration:none}

/* ========== Đầu trang (ô gốc của Header Builder) ========== */
/* Thanh trên: liên hệ bên trái, menu các trang bên phải. */
#top-bar{font-size:13px}
#top-bar .header-contact a,#top-bar .header-contact a:hover{color:#fff;text-transform:none;font-size:13px;font-weight:500;letter-spacing:0}
#top-bar .header-contact span{max-width:46vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:inline-block;vertical-align:middle}
#top-bar .top-bar-nav>li{margin:0 0 0 22px}
#top-bar .top-bar-nav>li>a{display:inline-flex;align-items:center;min-height:36px;padding:0;color:#fff;font-size:13px;font-weight:500;text-transform:none;letter-spacing:0}
#top-bar .top-bar-nav>li>a:hover,#top-bar .top-bar-nav>li.active>a,#top-bar .top-bar-nav>li.current-menu-item>a{color:var(--gold)}
/* Điện thoại / máy tính bảng: hàng trên cùng là "Menu chính", một dòng, vuốt ngang khi không đủ chỗ (theme.js cuộn tới
   mục đang xem). Đầu trang ghim khi cuộn; lúc đã ghim thì ẩn hàng ô tìm cho đầu trang gọn. */
@media (max-width:849px){
	#top-bar .flex-col.show-for-medium{min-width:0}
	#top-bar .mobile-nav{flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;scrollbar-width:none;margin:0 -15px;padding:0 5px}
	#top-bar .mobile-nav::-webkit-scrollbar{display:none}
	#top-bar .mobile-nav>li{flex:none;margin:0}
	#top-bar .mobile-nav>li>a{display:inline-flex;align-items:center;min-height:38px;padding:0 10px;color:#fff;font-size:14px;font-weight:500;letter-spacing:0;text-transform:none;white-space:nowrap}
	#top-bar .mobile-nav>li.active>a,#top-bar .mobile-nav>li.current-menu-item>a{color:var(--gold)}
	.header-wrapper.stuck #wide-nav{display:none}
}

/* Logo chữ (khi chưa tải ảnh logo): Flatsome viết hoa + cỡ lớn làm tên dài xuống 3 dòng, tràn khỏi hàng. */
#logo{margin-right:24px}
#logo a{color:var(--primary);font-family:var(--font-display);font-size:25px;font-weight:700;line-height:1.15;text-transform:none;letter-spacing:0;white-space:normal}

/* Hàng chính: logo │ nút "Danh mục" + ô tìm giãn hết chỗ còn lại │ hotline, giỏ hàng, đăng nhập (biểu tượng nét + chữ). */
#masthead .flex-col.flex-left>.header-nav{flex-wrap:nowrap;width:100%;gap:12px}
#masthead .flex-col.flex-left>.header-nav>li{margin:0}
#masthead .header-search-form{flex:1 1 auto;min-width:0}
#masthead .header-search-form-wrapper,#masthead .searchform-wrapper{width:100%;max-width:none}
#masthead .flex-col.flex-right{margin-left:24px}
#masthead .flex-col.flex-right>.header-nav{flex-wrap:nowrap;gap:22px}
#masthead .flex-col.flex-right>.header-nav>li{margin:0}
#header .header-vertical-menu__opener{height:44px;padding:0 16px;gap:8px;border-radius:var(--r-md);box-shadow:inset 0 0 0 1.5px currentColor;font-size:15px;font-weight:700;text-transform:none;letter-spacing:0;white-space:nowrap}
/* Nút gọn như thiết kế (biểu tượng ≡ + chữ): bỏ mũi tên xổ xuống của Flatsome, nút vẫn mở danh mục khi rê / bấm. */
#header .header-vertical-menu__opener .icon-angle-down{display:none}
.header-vertical-menu__fly-out .menu-item>a{font-size:14px;color:var(--text)}
.header-vertical-menu__fly-out .menu-item>a:hover{background:var(--tint);color:var(--primary)}
/* Bảng danh mục con: Flatsome dựng dạng bảng, mục có cháu thành ô rộng, các mục khác dồn thành ô hẹp vỡ chữ từng từ.
   Đổi sang cột đều (CSS columns), số cột theo số mục và chỗ trống bên phải nút Danh mục (bảng mở từ mép nút + 270px). */
.nav-vertical-fly-out>li>.nav-dropdown{display:block;width:280px;columns:1;column-gap:24px;padding:12px 20px}
.nav-vertical-fly-out>li>.nav-dropdown:has(>li:nth-child(6)){width:520px;columns:2}
@media (min-width:1280px){.nav-vertical-fly-out>li>.nav-dropdown:has(>li:nth-child(11)){width:700px;columns:3}}
@media (max-width:1023px){.nav-vertical-fly-out>li>.nav-dropdown:has(>li:nth-child(6)){width:300px;columns:1}}
.nav-vertical-fly-out .nav-dropdown li{display:block;width:auto;min-width:0;break-inside:avoid;white-space:normal;text-align:left}
.nav-vertical-fly-out .nav-dropdown li>a{margin:0;padding:8px 0;border:0;line-height:1.4;font-weight:400;text-transform:none;white-space:normal}
.nav-vertical-fly-out .nav-dropdown li>a:hover{background:none;color:var(--primary)}
.nav-vertical-fly-out .nav-dropdown .nav-dropdown-col>a{font-weight:700;color:var(--text)}
.nav-vertical-fly-out .nav-dropdown .nav-column{margin:0;padding:0 0 6px 12px;border-left:2px solid var(--border)}
.nav-vertical-fly-out .nav-dropdown .nav-column li>a{padding:6px 0;color:var(--text-2)}

#header .searchform .search-field{height:44px;border:1px solid var(--border-strong);border-right:0;border-radius:var(--r-md) 0 0 var(--r-md);box-shadow:none;font-size:14px}
#header .searchform .search_categories{height:44px;border:1px solid var(--border-strong);border-right:0;border-radius:var(--r-md) 0 0 var(--r-md);background-color:var(--secondary);font-size:13px;min-width:116px}
/* Bật lại ô chọn danh mục trong ô tìm (Theme Options → Header → Search): góc bo trái thuộc ô chọn, ô gõ chữ vuông. */
#header .searchform:has(.search_categories) .search-field{border-radius:0}
#header .searchform .ux-search-submit{height:44px;min-width:52px;border-radius:0 var(--r-md) var(--r-md) 0;background:var(--gold);color:var(--on-gold)}
#header .searchform .ux-search-submit:hover{background:var(--gold-hover)}
/* Khung viền chung của :focus-visible (lệch 2px ra ngoài) bao riêng ô gõ, đè lên nút kính lúp: đổi sang viền ô gõ đổi màu
   + vòng sáng quanh cả khối tìm. */
#header .searchform .search-field:focus-visible{outline:0}
#header .searchform .search-field:focus{border-color:var(--primary)}
#header .searchform:focus-within>.flex-row{border-radius:var(--r-md);box-shadow:0 0 0 3px var(--tint)}

/* Hotline · Giỏ hàng · Tài khoản ở đầu trang: biểu tượng nét mảnh màu nâu, chữ hai dòng (nhãn nhỏ xám trên, giá trị đậm
   dưới), giỏ có số món trong chấm đỏ. */
#masthead .ddt-hotline{gap:8px}
#masthead .ddt-hotline__icon{width:auto;height:auto;background:none;color:var(--primary)}
#masthead .ddt-hotline__icon .sb-ic{width:24px;height:24px}
#masthead .ddt-hotline__text small{font-weight:400}
#masthead .ddt-hotline__text strong{font-size:15px;font-weight:700;color:var(--text);letter-spacing:0}
#masthead .ddt-hotline:hover .ddt-hotline__text strong{color:var(--primary)}
.ddt-hotline{display:inline-flex;align-items:center;gap:10px;color:var(--text)}
.ddt-hotline:hover{color:var(--primary)}
.ddt-hotline__icon{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:var(--tint);color:var(--primary)}
.ddt-hotline__text{display:flex;flex-direction:column;line-height:1.25;text-align:left}
.ddt-hotline__text small{font-size:12px;color:var(--text-2);font-weight:500}
.ddt-hotline__text strong{font-size:17px;font-weight:700;color:var(--red);letter-spacing:.01em}

/* Giỏ hàng + Tài khoản (element gốc của Flatsome): biểu tượng đứng trước chữ. Flatsome in chữ giỏ trước biểu tượng và
   chỉ in biểu tượng tài khoản khi tắt chữ → đảo thứ tự giỏ, thêm biểu tượng người bằng ::before; biểu tượng font fl-icons
   (khối đặc) đổi sang biểu tượng nét của theme (mask, cùng hình .sb-ic--cart / .sb-ic--user). Element tài khoản chỉ in
   "Đăng nhập" / tên khách → nhãn nhỏ "Tài khoản" thêm bằng ::before. Bộ chọn có thẻ a: phải nặng bằng luật trả màu chung
   :is(#header,…) a:not(.button) ở đầu tệp, nếu không màu chữ về màu xám của Flatsome. */
#header{--ddt-i-cart:url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2024%2024'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'1.8'%20stroke-linecap%3D'round'%20stroke-linejoin%3D'round'%3E%3Cpath%20d%3D'M3%204h2l2.4%2011.2a2%202%200%200%200%202%201.6h7.7a2%202%200%200%200%202-1.5L21%208H6M10%2021a1%201%200%201%200%200-2%201%201%200%200%200%200%202zM17%2021a1%201%200%201%200%200-2%201%201%200%200%200%200%202z'%2F%3E%3C%2Fsvg%3E");--ddt-i-user:url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2024%2024'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'1.8'%20stroke-linecap%3D'round'%20stroke-linejoin%3D'round'%3E%3Cpath%20d%3D'M12%2012a4%204%200%201%200%200-8%204%204%200%200%200%200%208zM4%2021a8%208%200%200%201%2016%200'%2F%3E%3C%2Fsvg%3E")}
#header a.header-cart-link,#header .account-item>a{display:inline-flex;align-items:center;gap:8px;min-height:var(--tap);color:var(--text);font-size:15px;font-weight:700;text-transform:none;letter-spacing:0}
/* Giỏ: khe rộng hơn để chấm số món (lấn ra ngoài biểu tượng 9px) không chạm chữ "Giỏ hàng". */
#header a.header-cart-link{flex-direction:row-reverse;gap:14px}
#header a.header-cart-link:hover,#header .account-item>a:hover{color:var(--primary)}
#header .header-cart-title{font-size:15px;color:inherit;text-transform:none;letter-spacing:0;font-weight:700}
#header .header-cart-link .icon-shopping-cart{display:block;margin:0;color:var(--primary);font-size:0;line-height:0}
#header .header-cart-link .icon-shopping-cart::before{content:"";display:block;width:24px;height:24px;background:currentColor;-webkit-mask:var(--ddt-i-cart) center/contain no-repeat;mask:var(--ddt-i-cart) center/contain no-repeat}
#header .header-cart-link .icon-shopping-cart::after{top:-7px;right:-9px;min-width:18px;height:18px;padding:0 4px;border-radius:999px;background:var(--red);color:#fff;font:700 11px/18px var(--font-ui);opacity:1;box-shadow:0 0 0 2px #fff;transform:none}
/* Flatsome ẩn chấm số khi giỏ trống; giữ chấm "0" để chỗ giỏ hàng luôn cùng một hình. */
#header .header-cart-link [data-icon-label="0"]::after{display:block}
#header .account-item>a::before{content:"";flex:none;width:24px;height:24px;background:var(--primary);-webkit-mask:var(--ddt-i-user) center/contain no-repeat;mask:var(--ddt-i-user) center/contain no-repeat}
#header .account-item>a>i{display:none}
#header .account-item>a>span{display:flex;flex-direction:column;line-height:1.25;text-align:left}
#header .account-item>a>span::before{content:"Tài khoản";font-size:12px;font-weight:400;color:var(--text-2)}
/* Bảng giỏ hàng xổ xuống: giỏ không phải mục cuối hàng nên Flatsome canh bảng theo mép trái mục và bảng tràn khỏi màn
   hình → canh theo mép phải; khung bo góc, nút chữ thường như mọi nút của theme. */
#header .nav-right li.cart-item.has-dropdown:hover>.nav-dropdown,#header .nav-right li.cart-item.current-dropdown>.nav-dropdown{left:auto;right:-15px}
#header .cart-item>.nav-dropdown{min-width:300px;padding:20px;border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--card-shadow-hover)}
#header .cart-item>.nav-dropdown .button{text-transform:none;letter-spacing:0}
#header .cart-icon strong{border-color:var(--primary);color:var(--primary)}
#header .cart-icon strong::after{border-color:var(--primary)}

/* Hàng dưới: danh mục sản phẩm cấp 1 dàn đều hết bề ngang, rê vào xổ danh mục con. */
#wide-nav{border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
#wide-nav .flex-col.flex-left{flex:1 1 auto}
/* Cột giữa / phải không có ô nào vẫn giữ chỗ: ẩn để menu dàn hết hàng. Thêm ô vào cột đó (Header Builder) thì hiện lại. */
#wide-nav .flex-col:is(.flex-center,.flex-right):not(:has(li)){display:none}
/* 8 mục chữ hoa đậm 14px + mũi tên ≈ 1085px: dàn đều trong khung 1220px còn khoảng 19px giữa các mục. */
#wide-nav .header-bottom-nav{width:100%;flex-wrap:nowrap;justify-content:space-between}
#wide-nav .header-bottom-nav>li{margin:0}
#wide-nav .header-bottom-nav>li>a{display:inline-flex;align-items:center;min-height:var(--tap);padding:0;color:var(--text);font-size:14px;font-weight:700;letter-spacing:0;white-space:nowrap}
#wide-nav .header-bottom-nav>li>a:hover,#wide-nav .header-bottom-nav>li.active>a,#wide-nav .header-bottom-nav>li.current-menu-item>a{color:var(--primary)}
#wide-nav .nav-dropdown li>a{color:var(--text);font-size:15px}
#wide-nav .nav-dropdown li>a:hover{color:var(--primary)}
/* JS Flatsome ghi inline inset:Xpx 0 0 (cả bottom:0) cho bảng rộng hết khung: bảng tự co theo nội dung, khối thường thì bị
   ép thấp → bỏ bottom. */
#wide-nav .menu-item-design-container-width>.nav-dropdown{bottom:auto!important}

/* Bảng xổ là UX Block (Dropdown → UX Block của mục menu): khung bảng do khối .ddt-mega vẽ, bỏ khung mặc định của Flatsome. */
#wide-nav .menu-item-has-block>.nav-dropdown{padding:0;border:0;background:none;box-shadow:none;min-width:0}
#wide-nav .menu-item-has-block>.nav-dropdown::before,#wide-nav .menu-item-has-block>.nav-dropdown::after{display:none}
.ddt-mega{width:100%;max-width:none;margin:0;background:var(--surface);border-top:2px solid var(--primary);border-radius:0 0 14px 14px;overflow:hidden;box-shadow:0 24px 48px -12px rgba(43,27,16,.28),0 2px 6px rgba(43,27,16,.08)}
.ddt-mega>.col{padding:0}
.ddt-mega__feature>.col-inner{height:100%}
/* Banner cao theo cột chữ bên phải (Flatsome đặt chiều cao bằng padding-top trong thẻ style riêng của banner). */
.ddt-mega__banner{height:100%;min-height:300px;padding-top:0!important}
.ddt-mega__banner .banner-layers{background:linear-gradient(180deg,rgba(26,14,6,0) 25%,rgba(26,14,6,.9) 100%)}
.ddt-mega__title{margin:0 0 8px;font-family:var(--font-display);font-size:28px;font-weight:700;line-height:1.15;color:#fff}
.ddt-mega--wide .ddt-mega__title{font-size:30px}
.ddt-mega__desc{margin:0 0 14px;font-size:14px;line-height:1.5;color:#E9DECB}
/* Banner nền tối để chữ trắng: nút vàng phải giữ chữ đen (trắng trên vàng tương phản ~1.7). */
#wide-nav .ddt-mega__btn.button{margin:0;padding:0 18px;min-height:42px;line-height:42px;color:var(--on-gold);font-size:14px;text-transform:none;letter-spacing:0}
.ddt-mega__body>.col-inner{padding:20px 22px 22px}
.ddt-mega__tiles.row{margin:0}
.ddt-mega__tiles .product-category.col{padding:0 4px 4px}
.ddt-mega__tiles .box-category{display:flex;align-items:center;gap:14px;padding:8px;border-radius:10px;transition:background-color .15s}
.ddt-mega__tiles .product-category:hover .box-category{background:var(--secondary)}
.ddt-mega__tiles .box-category .box-image{flex:0 0 60px;width:60px!important;margin:0}
.ddt-mega__tiles .box-category .box-image img{display:block;width:60px;height:60px;object-fit:cover;border:1px solid var(--border);border-radius:8px;background:var(--secondary)}
.ddt-mega__tiles .box-category .box-text{display:block;width:auto;padding:0;text-align:left}
.ddt-mega__tiles .header-title{margin:0;font-size:14.5px;font-weight:600;line-height:1.35;color:var(--text);text-transform:none;letter-spacing:0}
.ddt-mega__tiles .product-category:hover .header-title{color:var(--primary)}

/* Mục menu có cấp con nhưng bỏ UX Block: Flatsome dựng bảng, mục có cấp 3 thành ô rộng còn các mục khác dồn thành ô hẹp
   → chia cột đều bằng CSS columns; mục có cấp 3 là tiêu đề cột, cấp 3 có chấm đầu dòng. */
#wide-nav .menu-item-design-container-width:not(.menu-item-has-block)>.nav-dropdown{display:block;columns:4;column-gap:40px;padding:24px 30px 18px}
#wide-nav .menu-item-design-container-width>.nav-dropdown>li{display:block;width:auto;min-width:0;padding:0;break-inside:avoid;white-space:normal;text-align:left}
#wide-nav .menu-item-design-container-width .nav-dropdown li>a{margin:0;padding:7px 0;border:0;line-height:1.4;font-weight:400;text-transform:none;white-space:normal}
#wide-nav .menu-item-design-container-width .nav-dropdown>li.nav-dropdown-col>a{margin-bottom:6px;padding:2px 0 10px;border-bottom:1px solid var(--border);color:var(--primary);font-weight:700;text-transform:uppercase;letter-spacing:.02em}
#wide-nav .menu-item-design-container-width .nav-column{margin:0 0 14px;padding:0}
#wide-nav .menu-item-design-container-width .nav-column li>a{position:relative;padding-left:14px}
#wide-nav .menu-item-design-container-width .nav-column li>a::before{content:"";position:absolute;left:2px;top:50%;width:5px;height:5px;border-radius:50%;background:var(--gold);transform:translateY(-50%)}
@media (max-width:1099px){#wide-nav .menu-item-design-container-width:not(.menu-item-has-block)>.nav-dropdown{columns:3;column-gap:28px}}

/* Máy tính bảng ngang / màn nhỏ: bớt chữ để ô tìm còn đủ rộng. */
@media (min-width:850px) and (max-width:1199px){
	#logo{width:auto!important;max-width:200px;margin-right:16px}
	#logo a{font-size:21px}
	#header .header-vertical-menu__opener{padding:0 12px;font-size:14px}
	#masthead .flex-col.flex-right{margin-left:16px}
	#masthead .flex-col.flex-right>.header-nav{gap:16px}
	#header .header-cart-title,#header .account-item>a>span{display:none}
	#top-bar .header-contact li:nth-child(n+2){display:none}
	#top-bar .header-contact span{max-width:30vw}
	#top-bar .top-bar-nav>li{margin-left:16px}
	#wide-nav .header-bottom-nav>li>a{font-size:12px}
	#wide-nav .header-bottom-nav>li>a>.icon-angle-down{display:none}
}
@media (min-width:850px) and (max-width:1023px){
	#masthead .ddt-hotline__text{display:none}
	#header .searchform .search_categories{display:none}
	#header .searchform .search-field{border-radius:var(--r-md) 0 0 var(--r-md)}
	#wide-nav .header-bottom-nav>li>a{font-size:11px}
}
@media (min-width:850px) and (max-width:949px){
	#wide-nav .header-bottom-nav>li>a{font-size:10px}
}
@media (max-width:849px){
	/* Nút menu và giỏ của Flatsome trên điện thoại chỉ rộng bằng hình (24–28px): nới đủ vùng bấm ngón tay. */
	#masthead .mobile-nav>li>a{min-width:var(--tap);min-height:var(--tap);justify-content:center}
	#header .header-cart-link{gap:0}
	#logo{margin-right:0}
	#logo a{font-size:19px;text-align:center}
	#wide-nav .flex-col.flex-center{padding:0}
	#header .searchform .search_categories{display:none}
	#header .searchform .search-field{border-radius:var(--r-md) 0 0 var(--r-md)}
	#top-bar .header-contact li:nth-child(n+2){display:none}
}

/* ========== Khối chung ========== */
/* Nút của theme (giỏ, thanh toán, form…) bo tròn hai đầu như nút Flatsome (ô bo góc nút trong Theme Options). */
.sb-btn,.sb-btn--sm{border-radius:var(--r-btn)}
/* Nút, tiêu đề, ô nhập, khung của khuôn theme (chính sách, giỏ hàng, thanh toán, tài khoản, 404) theo bộ thông số chung. */
.sb-btn{font-size:16px;font-weight:700}
.sb-btn--lg{height:var(--btn-h-lg)}
.sb-btn--sm{height:var(--btn-h-sm);font-size:14px}
.woocommerce .sb-product__actions a.button{font-weight:700}
.woocommerce-loop-product__title{font-size:15px}
.sb-page-title,.sb-404 h1{font-family:var(--font-display);font-size:var(--fs-h1);color:var(--primary)}
.sb-section__title{font-family:var(--font-display);font-size:var(--fs-h3);color:var(--primary)}
/* Lớp tiện ích u-fs-22px của khuôn theme đặt cỡ chữ bằng !important. */
.sb-empty h1.u-fs-22px{font-family:var(--font-display);font-size:var(--fs-h3)!important}
.sb-breadcrumb{font-size:14px}
.sb-input,.sb-select,.sb-textarea,.sb-search input{font-size:16px}
.sb-card,.sb-empty,.sb-auth,.sb-member-card,.woocommerce ul.products li.product{border-radius:var(--r-xl)}
.ddt-contact-form-row .sb-card__title{font-family:var(--font-display);font-size:var(--fs-h3);color:var(--primary)}
/* Ô bo góc nút của Flatsome (lớp flatsome-custom, có !important) dính cả thẻ <button> dùng làm ô chọn Tỉnh / Phường:
   trả về bo góc của ô nhập. Với !important, lớp khai báo trước (flatsome) thắng lớp sau. */
/* Nút Áp dụng mã giảm giá đứng liền ô nhập: cùng bo góc ô (8px), không kiểu viên thuốc của nút chung. */
@layer flatsome{.sb-select.sb-dd__btn,.sb-coupon .sb-btn{border-radius:var(--r-md)!important}}
/* Row giữ khổ mặc định của Flatsome (bằng khung đầu trang) để mọi khối thẳng mép; Row lồng trong Row (lưới sản phẩm,
   bài viết) bỏ giới hạn khổ, nếu không lề âm -15px bị cắt và lưới thụt vào so với tiêu đề. */
.row.ddt-row .row{max-width:none}
.ddt-sec .col-inner>:last-child{margin-bottom:0}
/* Trang trong: tiêu đề trang (H1) là cấp lớn nhất; các khối liên quan bên dưới (Công trình nổi bật, Cẩm nang…) dùng cấp h3. */
body:not(.home){--fs-sec:var(--fs-h3)}
/* Nhịp khối trang chủ: Section / Row ngoài cùng của mỗi khối mang class ddt-block; mép dưới cách nội dung đúng --section
   như mép trên (đệm trên do Row .hto-sec). Cột Flatsome đã có đệm dưới 30px nên khối chỉ bù phần thiếu; Section in đệm
   theo #id (ô Padding = 0) nên phần bù đặt ở .section-content. */
.section.ddt-block>.section-content,.row.ddt-block{padding-bottom:max(0px,calc(var(--section) - 30px))}
/* Vòng chọn bàn phím của khuôn gốc màu nâu, chìm trên nền nâu → đổi sang kem trong các khối nền tối. */
:is(.ddt-slide,.ddt-stats-sec,.ddt-cta,.ddt-footer) :focus-visible{outline-color:var(--on-dark)}
/* Dải trượt (Flickity) tự nhận con trỏ khi bấm / kéo chuột, vòng chọn chung bao cả dải. Flatsome vốn bỏ vòng này
   (.flickity-enabled:focus), luật :focus-visible của khuôn gốc đè lại; link trong thẻ vẫn có vòng chọn khi dùng bàn phím. */
.flickity-enabled:focus-visible{outline:0}
/* Điện thoại: Row có class ddt-swipe thành hàng vuốt ngang kiểu app. Thẻ sau ló ra mép phải để biết còn nữa; hàng tràn
   tới hai mép màn, thẻ đầu thẳng mép nội dung (đệm hàng 9px + đệm cột 6px = 15px). Bề rộng thẻ: --swipe-w. */
@media (max-width:549px){
	.row.ddt-swipe{flex-wrap:nowrap;padding:0 9px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-left:9px;scrollbar-width:none}
	.row.ddt-swipe::-webkit-scrollbar{display:none}
	/* Row lồng trong cột (sản phẩm, tin tức) lùi đủ 15px ra mép màn; Row hàng nhỏ (row-small) của Flatsome chỉ lùi 9.8px. */
	.col .row.ddt-swipe{margin-left:-15px;margin-right:-15px}
	.row.ddt-swipe>.col{flex:0 0 auto;width:var(--swipe-w,82%);max-width:none;padding:0 6px 6px;scroll-snap-align:start}
}
/* Tiêu đề khối: element Title kiểu Normal (chữ trái, không kẻ dưới) + ô Link "Xem tất cả" cùng hàng bên phải. */
.ddt-title.section-title-container{margin-bottom:4px}
.ddt-title .section-title{align-items:baseline;gap:4px 16px;border-bottom:0;padding-bottom:12px;font-family:var(--font-display);font-size:var(--fs-sec,var(--fs-h2));font-weight:700;line-height:1.25;color:var(--primary)}
/* Tiêu đề các khối viết IN HOA (chữ không chân) để tách khỏi tên sản phẩm, tên bài. */
.ddt-title .section-title-main{margin:0;padding:0;border:0;text-transform:uppercase;letter-spacing:.02em;text-wrap:balance}
.ddt-title .section-title a{display:inline-flex;align-items:center;min-height:var(--tap);padding:0;font-family:var(--font-ui);font-size:15px;font-weight:700;color:var(--primary);white-space:nowrap}
.ddt-title .section-title a:hover{color:var(--primary-hover);text-decoration:underline}
.ddt-title .section-title a i{margin-left:4px;opacity:1}
.ddt-sub{margin:10px 0 24px;text-align:left;color:var(--text-2);font-size:15px}
.ddt-sub--center{max-width:46em;margin:-6px auto 24px;text-align:center}

/* ========== Slide ========== */
.ddt-slider .ddt-slide .text-box{padding:0}
.ddt-slide__title{margin:0 0 12px;font-family:var(--font-display);font-size:var(--fs-hero);font-weight:700;line-height:1.15;color:#fff;text-wrap:balance}
/* Mô tả khoảng 3 dòng, nằm trong vùng tối bên trái ảnh (ảnh slide đặt đồ vật từ khoảng 45% bề ngang). */
.ddt-slide__text{max-width:25em;margin:0 0 24px;font-size:18px;line-height:1.55;color:var(--on-dark-2)}
.ddt-slide__eyebrow{display:flex;align-items:center;gap:12px;margin:0 0 14px;font-size:14px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--gold)}
.ddt-slide__eyebrow::before,.ddt-slide__eyebrow::after{content:"";flex:0 0 28px;height:1px;background:currentColor;opacity:.7}
.button.ddt-slide__btn{margin:0 10px 10px 0;padding:0 26px;height:var(--btn-h);line-height:var(--btn-h);font-size:16px;font-weight:700;text-transform:none;letter-spacing:0;color:var(--on-gold)}
.button.ddt-slide__btn--call i{margin-right:8px}
.button.ddt-slide__btn.ddt-slide__btn--ghost{border:1.5px solid rgba(255,255,255,.85);background:transparent;color:#fff}
.button.ddt-slide__btn.ddt-slide__btn--ghost:hover{border-color:#fff;background:#fff;color:var(--text)}
.ddt-slide .banner-bg .bg::after,.ddt-slide .bg-overlay{pointer-events:none}
@media (max-width:849px){
	.ddt-slide__text{font-size:16px}
}
@media (max-width:549px){
	.ddt-slide .banner-layers{background:linear-gradient(180deg,rgba(20,10,2,0) 30%,rgba(20,10,2,.82) 80%)}
	.ddt-slide__text{font-size:15px;margin-bottom:16px}
	.ddt-slide__eyebrow{margin-bottom:10px;font-size:12px}
	.button.ddt-slide__btn{padding:0 20px}
}

/* ========== 4 cam kết ========== */
.ddt-usp-sec{background:var(--bg)}
.ddt-usp-row{padding:24px 0 8px}
.ddt-usp-row .col{padding-bottom:16px}
.ddt-usp__col .col-inner{height:100%}
.ddt-usp.icon-box{align-items:center;height:100%;padding:18px 20px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-xl)}
/* Khoảng cách tới chữ do padding-left 1em của .icon-box-text (Flatsome). */
.ddt-usp .icon-box-img{flex-shrink:0;margin-right:0!important}
/* Màu biểu tượng lấy từ ô Icon Color của UX Builder (mặc định trắng); ô vuông là nền nhấn. */
.ddt-usp .icon-box-img .icon{display:grid;place-items:center;width:48px;height:48px;border-radius:var(--r-lg);background:var(--primary)}
.ddt-usp__title{margin:0 0 2px;font-size:var(--fs-card-sm);font-weight:700;line-height:1.35;color:var(--text)}
.ddt-usp__text{margin:0;font-size:15px;line-height:1.45;color:var(--text-2)}
/* Cột large-3 của Flatsome áp từ 850px: dưới 1200px mỗi thẻ còn ~225px, chữ vỡ 6 dòng → 2 thẻ một hàng. */
@media (min-width:850px) and (max-width:1199px){.ddt-usp-row .ddt-usp__col{flex-basis:50%;max-width:50%}}
/* Điện thoại: 4 thẻ xếp dọc cao ~440px → một hàng vuốt, mỗi thẻ đủ rộng để tên và mô tả nằm một dòng. */
@media (max-width:549px){
	.row.ddt-usp-row{--swipe-w:76%;padding-top:16px;padding-bottom:12px}
	.ddt-usp.icon-box{padding:12px 14px}
	.ddt-usp .icon-box-img .icon{width:40px;height:40px;border-radius:var(--r-md)}
}

/* ========== Danh mục tiêu biểu ========== */
/* Tiêu đề giữa (Title kiểu Center): hai vạch vàng ngắn hai bên thay vạch mờ dài hết hàng của Flatsome. */
.ddt-title--center.section-title-container{margin-bottom:var(--space-title)}
.ddt-title.ddt-title--center .section-title{flex-wrap:nowrap;justify-content:center;gap:24px;padding-bottom:0;border-bottom:0;text-align:center}
.ddt-title--center .section-title-main{min-width:0}
/* Kiểu Center của Flatsome vẽ vạch hai bên chữ bằng thẻ b: tiêu đề khối không dùng vạch. */
.ddt-title--center .section-title b{display:none}
/* Thẻ danh mục: ảnh tràn mép trên, tên ở giữa (cả thẻ là link, không có nút mũi tên); ô tên giữ chỗ 2 dòng để các thẻ
   cùng hàng cao bằng nhau. */
.ddt-cats .box-category{display:flex;flex-direction:column;overflow:hidden;background:var(--surface);border:1px solid var(--card-border);border-radius:var(--r-xl);box-shadow:var(--card-shadow);transition:transform .2s,box-shadow .2s}
.ddt-cats .product-category:hover .box-category{transform:translateY(-4px);box-shadow:var(--card-shadow-hover)}
/* .box-image của Flatsome canh giữa bằng margin auto: trong khung flex dọc nó co về 0 → ép rộng hết thẻ. */
.ddt-cats .box-image{width:100%;background:var(--secondary)}
.ddt-cats .box-text{padding:12px 12px 16px;text-align:center}
.ddt-cats .box-text-inner{display:flex;flex-direction:column;align-items:center;gap:10px}
/* Chừa đúng 2 dòng (tên dài nhất 2 dòng) để mọi thẻ cùng cao. */
.ddt-cats .header-title{display:flex;align-items:center;justify-content:center;min-height:2.7em;margin:0;font-size:var(--fs-card-sm);font-weight:700;line-height:1.35;color:var(--text);text-transform:none;letter-spacing:0}
.ddt-cats .product-category:hover .header-title{color:var(--primary)}
.ddt-cats .flickity-prev-next-button,.ddt-works .flickity-prev-next-button{color:var(--primary)}
@media (max-width:549px){
	.ddt-title.ddt-title--center .section-title{gap:10px}
}
/* Điện thoại: trượt 2 thẻ một lượt (thanh trượt tự chạy), ảnh giữ vuông để không cắt đầu tượng, tên giữ chỗ 2 dòng, nút
   tròn nhỏ; bỏ hai mũi tên của thanh trượt vì chúng đè lên thẻ. */
@media (max-width:549px){
	/* Khe giữa 2 thẻ 10px như ảnh mẫu: hàng lùi 5px (thay 9.8px của Flatsome) + đệm cột 5px, thẻ đầu vẫn thẳng mép 15px. */
	.row.ddt-cats{margin-left:-5px;margin-right:-5px}
	.ddt-cats .flickity-slider>.product-category{flex-basis:50%;max-width:50%;width:50%;padding-left:5px;padding-right:5px}
	.ddt-cats .header-title{min-height:2.7em;font-size:var(--fs-card-sm)}
	.ddt-cats .box-text{padding:10px 10px 14px}
	.ddt-cats .box-text-inner{gap:8px}
	.ddt-cats .flickity-prev-next-button,.ddt-works .flickity-prev-next-button{display:none}
}

/* ========== Thẻ sản phẩm (Product Box của Flatsome): trang chủ, danh mục, tìm kiếm ========== */
/* Thẻ gọn: ảnh, tên 2 dòng, giá; không nút mua (Theme Options → Product Catalog → Add To Cart Button: tắt) vì chọn mẫu,
   báo giá làm ở trang sản phẩm. Mọi giá cùng cỡ: luật .price ins của khuôn gốc theme chỉ phóng to giá đang giảm. */
.product-small.box{height:100%;border:1px solid var(--border);border-radius:var(--r-xl);overflow:hidden;background:var(--surface);transition:border-color .2s ease,box-shadow .2s ease}
.product-small.box:hover{border-color:var(--border-strong);box-shadow:var(--shadow-hover)}
.product-small .box-image{background:var(--secondary)}
.product-small .box-text-products{padding:12px 14px 16px}
.product-small .product-title{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.9em;max-height:2.9em;margin:0 0 6px;font-size:16px;line-height:1.45}
/* Tên cắt ở khung tên (2 dòng), không cắt ở link bên trong: Flatsome "Equalize" đặt chiều cao cho khung tên theo thẻ cao
   nhất hàng, cắt hai lớp thì lộ một mẩu dòng thứ ba. */
.product-small .product-title a{display:inline;color:var(--text)}
.product-small.box:hover .product-title a{color:var(--primary)}
.product-small .price{font:700 17px/1.3 var(--font-ui);color:var(--sale)}
.product-small .price ins,.product-small .price .amount{font:inherit;color:inherit}
.product-small .price del{font-size:13px;font-weight:400;color:var(--text-2)}
/* Dòng cuối thẻ: "Còn hàng" (dấu tích xanh) / "Hết hàng" bên trái, nút "Mua ngay" bên phải; thẻ hẹp thì xuống hai dòng. */
.ddt-buyrow{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 10px;margin-top:12px}
.ddt-stock{display:inline-flex;align-items:center;gap:5px;font-size:14px;font-weight:600;line-height:1.3;white-space:nowrap}
.ddt-stock.is-in{color:var(--success,#2E7D32)}
.ddt-stock.is-in::before{content:"";width:6px;height:11px;margin:-3px 3px 0 2px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg)}
.ddt-stock.is-out{color:var(--text-2)}
.ddt-stock.is-back{color:var(--primary)}
.button.ddt-buybtn{display:inline-flex;align-items:center;justify-content:center;margin:0 0 0 auto;padding:0 18px;min-height:var(--btn-h-sm);line-height:1;font-size:14px;font-weight:700;text-transform:none;letter-spacing:0;white-space:nowrap}
/* Thẻ cùng hàng cao bằng nhau, dòng "Còn hàng" + nút Mua ngay dồn đáy: thẻ có giá gạch ngang xuống dòng không làm nút lệch hàng. */
.hto-viewbtn .product-small.col>.col-inner{height:100%}
.hto-viewbtn .product-small.box{display:flex;flex-direction:column;height:100%}
.hto-viewbtn .box-text-products{display:flex;flex:1;flex-direction:column}
.hto-viewbtn .box-text-products>.price-wrapper{padding-bottom:12px}
.hto-viewbtn .ddt-buyrow{margin-top:auto}
/* Hàng gợi ý trong khuôn của theme (giỏ hàng, 404): lề âm như hàng Flatsome để thẻ đầu, thẻ cuối thẳng mép nội dung. */
.hto-fs>.row{width:auto;margin-left:-10px;margin-right:-10px}
.ddt-quote{font-size:15px;font-weight:700;color:var(--primary)}
/* Nhãn giảm giá (Bubble Style: Square) nằm gọn trong góc ảnh. Luật .onsale của khuôn gốc theme đặt nhãn absolute, gỡ. */
.badge-container{margin:10px 0 0 10px}
.badge-container .badge{width:auto;height:auto;min-width:0;min-height:0}
.badge-container .badge-inner{padding:5px 8px;border-radius:var(--r-sm);background:var(--sale);color:#fff;font:700 13px/1 var(--font-ui)}
.badge-container .onsale{position:static;padding:0;background:none;font:inherit;color:inherit}
/* Sản phẩm nổi bật trang chủ: thẻ đổ bóng, rê chuột nổi lên như thẻ Danh mục tiêu biểu. Thẻ cùng màu nền khối nên mép
   tách bằng viền mảnh + bóng đậm về cạnh dưới (bóng chung --shadow-card quá nhạt, mép chìm). */
/* Sản phẩm nổi bật, Danh mục tiêu biểu, Công trình, Nhận xét: cùng khe giữa thẻ 12px (Row hàng nhỏ của Flatsome: 20px); lề âm của
   hàng bằng nửa khe để thẻ đầu / cuối thẳng mép khối. */
@media (min-width:550px){
	.ddt-block .row.ddt-products,.category-page-row .products.row,.row.ddt-cats,.row.ddt-works{margin-left:-6px;margin-right:-6px}
	.ddt-block .row.ddt-products>.col,.category-page-row .products.row>.col,.row.ddt-cats .product-category.col,.row.ddt-works .col,.row.ddt-reviews>.col{padding:0 6px 12px}
	/* Dải trượt (danh mục, công trình) cắt mọi thứ tràn khung: chừa đủ chỗ dưới thẻ để bóng thẻ không bị cắt thẳng. */
	.row.ddt-cats:not(.ddt-cats--grid) .product-category.col,.row.ddt-works:not(.ddt-works--grid) .col{padding-bottom:24px}
	/* Hàng Nhận xét nằm thẳng trong Section (canh giữa bằng margin auto, cột đệm 15px): bù 9px bằng padding của hàng. */
	.row.ddt-reviews{padding:0 9px}
}
/* Lưới trang cửa hàng, danh mục, tìm kiếm (.category-page-row) dùng chung kiểu thẻ, khe và nút của Sản phẩm nổi bật. */
:is(.ddt-block .ddt-products,.category-page-row .products) .product-small.box{border:1px solid var(--card-border);box-shadow:var(--card-shadow);transition:transform .2s,box-shadow .2s}
:is(.ddt-block .ddt-products,.category-page-row .products) .product-small.box:hover{transform:translateY(-4px);border-color:var(--card-border);box-shadow:var(--card-shadow-hover)}
@media (hover:none){:is(.ddt-block .ddt-products,.category-page-row .products) .product-small.box:hover{transform:none;box-shadow:var(--card-shadow)}}
@media (prefers-reduced-motion:reduce){.product-small.box{transition:none}:is(.ddt-block .ddt-products,.category-page-row .products) .product-small.box:hover{transform:none}}
/* Máy tính bảng: lưới 3 cột, thẻ cuối nằm lẻ một mình ở hàng cuối (10 thẻ → 3-3-3-1) thì ẩn cho các hàng đều. */
@media (min-width:550px) and (max-width:849px){
	.row.ddt-products>.col:last-child:nth-child(3n+1){display:none}
}
/* Điện thoại, trang chủ: sản phẩm nổi bật, công trình, danh mục (bản lưới) xếp lưới, khe 10px (hàng lùi 5px + đệm cột
   5px, thẻ đầu vẫn thẳng mép); sản phẩm chỉ 2 hàng nên ẩn thẻ thứ 5 trở đi; nút trong thẻ hẹp giữ một dòng. */
@media (max-width:549px){
	.ddt-block .row.ddt-products,.category-page-row .products.row,.row.ddt-works--grid{margin-left:-5px;margin-right:-5px}
	.ddt-block .row.ddt-products>.col,.category-page-row .products.row>.col,.row.ddt-works--grid>.col,.row.ddt-cats--grid>.product-category.col{padding:0 5px 10px}
	.ddt-block .row.ddt-products>.col:nth-child(n+5){display:none}
	.ddt-products .button.ddt-buybtn,.category-page-row .button.ddt-buybtn,.row.ddt-swipe .button.ddt-buybtn{padding:0 12px}
	.section.ddt-stats-sec{margin-top:var(--section)}
	/* Thẻ danh mục 2 cột: ảnh lớn, tên rồi nút mũi tên như máy tính. Thẻ cùng hàng cao bằng nhau: phần chữ giãn hết thẻ,
	   tên canh giữa phần còn trống, nút luôn ở đáy nên các nút thẳng hàng. Thẻ công trình 2 cột: tên tối đa 2 dòng để các
	   thẻ cao bằng nhau (lưới Portfolio của Flatsome xếp kiểu so le khi thẻ cao khác nhau). */
	.row.ddt-cats--grid .product-category>.col-inner,.row.ddt-cats--grid .box-category{height:100%}
	.row.ddt-cats--grid .box-text{flex:1 1 auto;display:flex;padding:10px 8px 12px}
	.row.ddt-cats--grid .box-text-inner{flex:1 1 auto}
	.row.ddt-cats--grid .header-title{flex:1 1 auto;min-height:0;font-size:15px}
	.row.ddt-works--grid .box-text{padding:10px 10px 12px}
	.row.ddt-works--grid .box-text h5,.row.ddt-works--grid .box-text .portfolio-box-title{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.7em;font-size:14px}
}

/* ========== Công trình ========== */
/* Thẻ công trình: nền trắng bo góc, ảnh tràn mép trên, tên giữa; ô tên giữ chỗ 2 dòng để các thẻ cao bằng nhau. */
.ddt-works .box{overflow:hidden;background:var(--surface);border:1px solid var(--card-border);border-radius:var(--r-xl);box-shadow:var(--card-shadow);transition:transform .2s,box-shadow .2s}
.ddt-works .col:hover .box{transform:translateY(-4px);box-shadow:var(--card-shadow-hover)}
.ddt-works .box-text{padding:14px 16px 16px;text-align:center}
.ddt-works .box-text h5,.ddt-works .box-text .portfolio-box-title{display:flex;align-items:center;justify-content:center;min-height:2.7em;margin:0;font-size:var(--fs-card-sm);font-weight:700;line-height:1.35;text-transform:none;letter-spacing:0;color:var(--text)}
.ddt-works .box-text .portfolio-box-title{opacity:1}
.ddt-works .col:hover .portfolio-box-title{color:var(--primary)}
/* Dòng nhóm công trình Flatsome chỉ hiện khi rê chuột nhưng vẫn chiếm chỗ dưới tên → bỏ cho thẻ gọn như thiết kế. */
.ddt-works .portfolio-box-category{display:none}
.ddt-works .box-text p{font-size:14px;color:var(--text-2)}
.button.ddt-works__more{display:flex;align-items:center;gap:8px;width:fit-content;margin:30px auto 0;padding:0 28px;min-height:var(--btn-h);line-height:1;font-size:16px;font-weight:700;text-transform:none;letter-spacing:0}
.button.ddt-works__more i{margin:0;font-size:18px}
/* Điện thoại: thẻ 82% để thẻ sau ló ra, thay cho mũi tên (đã ẩn ở khối Danh mục). */
@media (max-width:549px){.ddt-works .flickity-slider>.col{flex-basis:82%;max-width:82%;width:82%}}
/* Màn cảm ứng: trạng thái rê chuột dính lại sau khi chạm (thẻ nhấc lên, bóng đậm) → bỏ. */
@media (hover:none){.ddt-works .col:hover .box,.ddt-cats .product-category:hover .box-category{transform:none;box-shadow:var(--card-shadow)}.portfolio-archive .col:hover .portfolio-box{transform:none;box-shadow:var(--shadow-card)}}
@media (prefers-reduced-motion:reduce){.ddt-works .box,.ddt-cats .box-category{transition:none}.ddt-works .col:hover .box,.ddt-cats .product-category:hover .box-category{transform:none}}

/* ========== Tin tức & cẩm nang ========== */
.ddt-posts .box-image{border-radius:var(--r-lg);overflow:hidden}
.ddt-posts .post-title{font-weight:700;line-height:1.4;color:var(--text)}
.ddt-posts .post-item:hover .post-title{color:var(--primary)}
.ddt-posts .post-meta{font-size:14px;color:var(--text-2);opacity:1}
.ddt-posts--lead .post-title{font-size:22px}
.ddt-posts--lead .from_the_blog_excerpt{font-size:15px;color:var(--text-2)}
.ddt-posts--list .post-item{padding-bottom:18px}
.ddt-posts--list .post-title{font-size:var(--fs-card-sm);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.ddt-posts--list .box-text{padding:2px 0 0 14px}
.ddt-posts .is-divider{display:none}
/* Dưới 850px bài lớn nằm trên danh sách: đệm dưới của cột cộng với khe của thẻ bài thành khoảng trống ~80px. */
@media (max-width:849px){.ddt-news__lead{padding-bottom:0}}
/* Điện thoại: bài lớn (ảnh, tên, ngày) rồi 3 dòng bài nhỏ (ảnh 104px trái, tên tối đa 2 dòng + ngày phải). Ô Image Width
   của Blog Posts in bề rộng ảnh bằng style trên thẻ nên phải dùng !important. Tiêu đề khối: "Xem tất cả" cùng hàng chữ. */
@media (max-width:549px){
	.ddt-news>.col:first-child{padding-bottom:12px}
	.ddt-news__lead .post-item{padding-bottom:16px}
	.ddt-posts--lead .post-title{font-size:18px}
	.ddt-posts--lead .from_the_blog_excerpt{display:none}
	.row.ddt-posts--list>.col:nth-child(n+4){display:none}
	.ddt-posts--list .post-item{padding-bottom:12px}
	.ddt-posts--list .box-vertical{display:flex;align-items:center;gap:12px}
	.ddt-posts--list .box-vertical .box-image{flex:0 0 104px;width:104px!important;margin:0}
	.ddt-posts--list .box-vertical .box-text{padding:0}
	.ddt-posts--list .post-title{font-size:15px;-webkit-line-clamp:2}
	.ddt-title .section-title{flex-wrap:nowrap;align-items:flex-end;padding-bottom:4px}
	.ddt-title .section-title-main{min-width:0}
	.ddt-title .section-title a{flex:none;font-size:14px}
}

/* ========== Những con số (Section nền ảnh hoa văn rồng) ========== */
.ddt-stats-sec .ddt-title.ddt-title--center .section-title{color:var(--on-dark)}
/* Hộp số liệu: Section thu về bề rộng khung nội dung, bo góc; ảnh nền (ô Background của Section) nằm gọn trong hộp.
   Đệm trong hộp gọn hơn nhịp khối thường để hộp thấp. */
.section.ddt-stats-sec{width:calc(100% - 2 * var(--gutter));max-width:var(--container);margin-left:auto;margin-right:auto;border-radius:var(--r-xl);overflow:hidden}
.ddt-stats-sec .row.hto-sec{padding-top:20px}
.section.ddt-stats-sec.ddt-block>.section-content{padding-bottom:20px}
.ddt-stats-sec .row.hto-sec>.col{padding-bottom:0}
.ddt-stats-sec .ddt-title--center.section-title-container{margin-bottom:14px}
@media (min-width:550px){.ddt-stats-sec .ddt-title .section-title{font-size:24px}}
/* Máy tính 4 số một hàng: bỏ đệm dưới cột; màn hẹp 2 × 2 giữ đệm để hai hàng số không dính nhau. */
@media (min-width:850px){.ddt-stats-sec .ddt-stat.col{padding-bottom:0}}
.ddt-stat{position:relative}
.ddt-stat__box .icon-box-img{width:32px!important;margin:0 auto 6px!important}
.ddt-stat__box .icon-box-img svg{width:32px;height:32px;stroke-width:1.5}
.ddt-stat__num{margin:0 0 2px;font-family:var(--font-display);font-size:34px;font-weight:700;line-height:1.05;color:var(--on-dark)}
.ddt-stat__label{margin:0;font-size:14px;line-height:1.4;color:var(--on-dark-2)}
/* Vạch ngăn mảnh giữa các cột số (chỉ khi 4 cột một hàng). */
@media (min-width:850px){
	.ddt-stat+.ddt-stat::before{content:"";position:absolute;left:0;top:12%;bottom:22%;width:1px;background:rgba(241,194,50,.35)}
}
@media (max-width:549px){
	.ddt-stat{padding-bottom:18px}
	/* Ô Icon Width của Icon Box in bề rộng bằng style trên thẻ. */
	.ddt-stat__box .icon-box-img{width:36px!important;margin:0 auto 6px!important}
	.ddt-stat__box .icon-box-img svg{width:36px;height:36px}
	.ddt-stat__num{margin-bottom:4px;font-size:32px}
	.ddt-stat__label{font-size:13px}
}

/* ========== Quy trình chế tác ========== */
.ddt-step{position:relative}
.ddt-step__box .icon-box-img{margin:0 auto 16px!important}
.ddt-step__box .icon-box-img .icon{display:grid;place-items:center;width:80px;height:80px;margin:0 auto;border-radius:50%;background:var(--primary);box-shadow:0 8px 20px rgba(60,32,4,.16)}
.ddt-step__box .icon-box-img svg{width:40px;height:40px;stroke-width:1.5}
.ddt-step__title{margin:0 0 8px;font-size:var(--fs-card);font-weight:700;line-height:1.35;color:var(--text)}
.ddt-step__text{max-width:20em;margin:0 auto;font-size:16px;line-height:1.6;color:var(--text-2)}
/* Mũi tên giữa hai bước: nằm giữa khe hai cột, ngang tâm vòng tròn (vòng 80px → tâm cách đỉnh cột 40px). */
@media (min-width:850px){
	.ddt-step:not(:last-child)::after{content:"";position:absolute;top:40px;right:0;width:44px;height:24px;transform:translate(50%,-50%);background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 44 24' fill='none' stroke='%23783F04' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h34M30 4l8 8-8 8'/%3E%3C/svg%3E") center/contain no-repeat}
}
@media (max-width:549px){
	/* Lưới 2 × 2: mỗi bước một thẻ (vòng tròn biểu tượng trên, tên, mô tả), khe 10px như các lưới khác. Row nằm thẳng
	   trong Section (cột đệm 15px): bù 10px bằng padding của hàng để thẻ thẳng mép nội dung. */
	.row.ddt-steps{padding:0 10px}
	.ddt-steps .ddt-step{flex-basis:50%;max-width:50%;padding:0 5px 10px}
	.ddt-step>.col-inner{height:100%}
	.ddt-step__box.icon-box{height:100%;padding:16px 10px 14px;border:1px solid var(--card-border);border-radius:var(--r-xl);background:var(--surface);box-shadow:var(--card-shadow)}
	.ddt-step__box .icon-box-img{width:48px!important;margin:0 auto 10px!important}
	.ddt-step__box .icon-box-img .icon{width:48px;height:48px;box-shadow:none}
	.ddt-step__box .icon-box-img svg{width:24px;height:24px}
	.ddt-step__title{margin:0 0 4px;font-size:15px}
	.ddt-step__text{max-width:none;margin:0;font-size:13px;line-height:1.5}
}

/* ========== Câu hỏi thường gặp (trang chủ) ========== */
/* Khoảng dưới dòng mô tả đặt ở cột (Flatsome bỏ margin dưới của phần tử cuối trong cột). */
.ddt-faq-head .col{padding-bottom:var(--space-title)}
.ddt-faq-sec__lead{margin:-12px 0 0;font-size:var(--fs-lead);line-height:1.6;color:var(--text-2);text-align:center}
.ddt-faq-sec__media .img{margin:0 auto}
.ddt-faq .accordion-item{margin:0 0 14px;border:1px solid var(--card-border);border-radius:var(--r-xl);background:var(--surface);box-shadow:var(--card-shadow)}
.ddt-faq .accordion-item:last-child{margin-bottom:0;border-bottom:0}
.ddt-faq .accordion-title{position:relative;display:flex;align-items:center;min-height:68px;padding:14px 64px 14px 62px;border:0;font-size:var(--fs-card);font-weight:700;line-height:1.4;color:var(--text)}
.ddt-faq .accordion-title.active,.ddt-faq .accordion-title:hover{color:var(--primary)}
/* Accordion tô nền xám + gạch chân câu đang mở; thẻ bo góc đã đủ phân biệt nên bỏ. */
.ddt-faq .accordion-title.active{background:transparent}
.ddt-faq .accordion-title,.ddt-faq .accordion-title span{text-decoration:none}
/* Biểu tượng tài liệu bên trái; dấu cộng bên phải (thành dấu trừ khi mở) thay mũi tên mặc định của Accordion. */
.ddt-faq .accordion-title::before{content:"";position:absolute;left:24px;top:50%;width:22px;height:22px;transform:translateY(-50%);background:var(--primary);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 3H7a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V8z'/%3E%3Cpath d='M14 3v5h5M9 13h6M9 17h6'/%3E%3C/g%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 3H7a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V8z'/%3E%3Cpath d='M14 3v5h5M9 13h6M9 17h6'/%3E%3C/g%3E%3C/svg%3E") center/contain no-repeat}
.ddt-faq .accordion-title .toggle{position:absolute;left:auto;right:18px;top:50%;width:32px;height:32px;margin:0;transform:translateY(-50%);color:var(--primary)}
.ddt-faq .accordion-title .toggle i{display:none}
.ddt-faq .accordion-title .toggle::before,.ddt-faq .accordion-title .toggle::after{content:"";position:absolute;left:50%;top:50%;width:16px;height:2.5px;border-radius:2px;background:currentColor;transform:translate(-50%,-50%)}
.ddt-faq .accordion-title .toggle::after{transform:translate(-50%,-50%) rotate(90deg);transition:transform .2s}
.ddt-faq .accordion-title.active .toggle::after{transform:translate(-50%,-50%) rotate(0deg)}
.ddt-faq .accordion-inner{padding:0 64px 20px 62px;font-size:16px;line-height:1.65;color:var(--text-2)}
.ddt-faq .accordion-inner p{margin:0}
.ddt-faq .accordion-inner a{color:var(--primary);text-decoration:underline}
@media (max-width:549px){
	.ddt-faq-sec__lead{margin:-8px 0 0}
	.ddt-faq .accordion-title{min-height:60px;padding:12px 52px 12px 50px}
	.ddt-faq .accordion-title::before{left:16px}
	.ddt-faq .accordion-title .toggle{right:10px}
	.ddt-faq .accordion-inner{padding:0 20px 18px 50px;font-size:15px}
}

/* ========== Khách hàng nói gì (Testimonial của Flatsome) ========== */
.ddt-review .col-inner{height:100%}
/* Flatsome in: ảnh │ (sao, lời nhận xét, tên / nơi ở). Thiết kế: ảnh │ tên, nơi ở, sao, lời nhận xét trải hết thẻ bên
   dưới → lưới 2 cột, khối chữ display:contents để từng phần tự đặt vào ô lưới. */
.ddt-review .testimonial-box{display:grid;grid-template-columns:96px 1fr;column-gap:20px;align-items:center;height:100%;margin:0;padding:28px 28px 30px;background:var(--surface);border:1px solid var(--card-border);border-radius:var(--r-xl);box-shadow:var(--card-shadow)}
.ddt-review .testimonial-image{grid-column:1;grid-row:1/span 2;width:96px!important;height:96px;margin:0!important;overflow:hidden;border-radius:50%;background:var(--secondary);border:1px solid var(--border)}
.ddt-review .testimonial-image img{width:100%;height:100%;object-fit:cover}
/* Ảnh tạm là biểu tượng SVG (chưa có ảnh khách): thu nhỏ, làm nhạt; ảnh chụp thật vẫn phủ kín vòng tròn. */
.ddt-review .testimonial-image img[src$=".svg"]{padding:26%;object-fit:contain;opacity:.35}
.ddt-review .icon-box-text{display:contents}
.ddt-review .testimonial-meta{grid-column:2;grid-row:1;align-self:end;padding:0}
.ddt-review .testimonial-name{display:block;font-size:var(--fs-card);font-weight:700;line-height:1.3;color:var(--text)}
.ddt-review .testimonial-name-divider{display:none}
.ddt-review .testimonial-company{display:block;margin-top:2px;font-size:15px;color:var(--text-2)}
.ddt-review .star-rating{grid-column:2;grid-row:2;align-self:start;margin:8px 0 0;font-size:18px;color:var(--gold)}
.ddt-review .testimonial-text{grid-column:1/-1;grid-row:3;margin-top:22px;font-size:var(--fs-body);line-height:1.6;color:var(--text)}
@media (max-width:549px){
	.row.ddt-reviews{--swipe-w:86%}
	.ddt-review .testimonial-box{grid-template-columns:72px 1fr;column-gap:16px;padding:20px}
	.ddt-review .testimonial-image{width:72px!important;height:72px}
	.ddt-review .testimonial-text{margin-top:16px}
}

/* ========== Lời mời liên hệ cuối trang chủ (Banner trong khung) ========== */
.ddt-cta{overflow:hidden;border-radius:var(--r-xl)}
.ddt-cta .text-box{padding:0}
.ddt-cta__title{margin:0 0 12px;font-family:var(--font-display);font-size:var(--fs-h2);font-weight:700;line-height:1.25;color:var(--on-dark)}
.ddt-cta__text{margin:0;font-size:var(--fs-lead);line-height:1.6;color:var(--on-dark-2)}
.button.ddt-cta__btn{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;margin:0;padding:0 22px;min-height:var(--btn-h-lg);line-height:1;font-size:16px;font-weight:700;text-transform:none;letter-spacing:0}
.button.ddt-cta__btn i{margin:0;font-size:18px}
.button.ddt-cta__btn+.button.ddt-cta__btn{margin-top:14px}
.button.ddt-cta__btn--call{background:var(--gold);border-color:var(--gold);color:var(--brown-deep)}
.button.ddt-cta__btn--call:hover{background:var(--gold-soft);border-color:var(--gold-soft);color:var(--brown-deep)}
.button.ddt-cta__btn--ghost{border:1.5px solid rgba(251,235,200,.85);background:transparent;color:var(--on-dark)}
.button.ddt-cta__btn--ghost:hover{border-color:var(--on-dark);background:var(--on-dark);color:var(--brown-deep)}
/* Điện thoại: banner cao theo nội dung thay cho chiều cao cố định: chữ và nút xếp dọc trong luồng. Flatsome in chiều cao
   banner bằng #id và khoá vị trí lớp chữ bằng !important trong lớp flatsome nên phải đè đúng hai chỗ đó. Phủ nâu để
   chữ đọc được trên con rồng. */
@media (max-width:549px){
	.ddt-cta.banner{height:auto;padding-top:0!important}
	.ddt-cta .banner-inner{position:relative;height:auto}
	.ddt-cta .banner-layers{display:flex;flex-direction:column;gap:16px;height:auto;max-height:none;padding:24px 20px;background:rgba(40,20,6,.55)}
	.ddt-cta .banner-layers>.text-box{top:auto!important;left:auto!important;width:100%!important;max-height:none;margin:0;transform:none!important}
	@layer flatsome{.ddt-cta .banner-layers>.text-box{position:relative!important}}
}

/* ========== Liên hệ cuối trang chủ ========== */
.ddt-contact-home{align-items:stretch}
.ddt-cinfo{margin:0;padding:4px 0 0;list-style:none}
.ddt-cinfo li{position:relative;margin:0 0 22px;padding-left:60px}
/* [hto_info] trả rỗng khi ô thông tin cửa hàng chưa nhập → ẩn cả dòng. */
.ddt-cinfo li:has(>span:empty){display:none}
.ddt-cinfo li::before{content:"";position:absolute;left:0;top:2px;width:40px;height:40px;background:var(--primary);-webkit-mask:var(--ic) center/contain no-repeat;mask:var(--ic) center/contain no-repeat}
.ddt-cinfo__pin,.ddt-fcontact__pin{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' fill-rule='evenodd' d='M12 2a7.5 7.5 0 0 0-7.5 7.5C4.5 15.2 12 22 12 22s7.5-6.8 7.5-12.5A7.5 7.5 0 0 0 12 2zm0 10.3a2.8 2.8 0 1 1 0-5.6 2.8 2.8 0 0 1 0 5.6z'/%3E%3C/svg%3E")}
.ddt-cinfo__phone,.ddt-fcontact__phone{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M6.7 2.5h2.9l1.8 4.6-2.3 1.6a11.5 11.5 0 0 0 6.2 6.2l1.6-2.3 4.6 1.8v2.9a2.6 2.6 0 0 1-2.8 2.6C10.4 19.3 4.7 13.6 4.1 5.3a2.6 2.6 0 0 1 2.6-2.8z'/%3E%3C/svg%3E")}
.ddt-cinfo__mail,.ddt-fcontact__mail{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2.5' y='4.5' width='19' height='15' rx='2.5'/%3E%3Cpath d='M3.5 6.5 12 13l8.5-6.5M3.5 18l6-6M20.5 18l-6-6'/%3E%3C/g%3E%3C/svg%3E")}
.ddt-cinfo__clock,.ddt-fcontact__clock{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9.5'/%3E%3Cpath d='M12 6.5V12h4'/%3E%3C/g%3E%3C/svg%3E")}
.ddt-cinfo strong{display:block;margin-bottom:2px;font-size:var(--fs-card);font-weight:700;line-height:1.3;color:var(--text)}
.ddt-cinfo span{display:block;font-size:var(--fs-body);line-height:1.45;color:var(--text);overflow-wrap:anywhere}
.ddt-cinfo__phone span{font-size:19px;font-weight:600}
.ddt-cinfo__mail span{overflow-wrap:normal}
/* Form dùng chung với trang Liên hệ: ở trang chủ bỏ khung thẻ, ẩn nhãn (vẫn đọc được bằng trình đọc màn hình), hiện chữ
   gợi ý + biểu tượng trong ô, bỏ ô Email (không bắt buộc) cho gọn như thiết kế. */
.sb-card .sb-input::placeholder,.sb-card .sb-textarea::placeholder{color:transparent}
/* Ô mã giảm giá (giỏ hàng, thanh toán) không có nhãn hiện: giữ chữ gợi ý. */
.sb-card .sb-coupon .sb-input::placeholder{color:var(--text-2)}
.ddt-contact-home__form>.col-inner{padding-left:28px;border-left:1px solid #E6D3B5}
.ddt-contact-home .sb-card{margin:0;padding:0;border:0;background:none;box-shadow:none}
.ddt-contact-home .sb-card__title{margin:0 0 16px;font-family:var(--font-display);font-size:var(--fs-h3);font-weight:700;line-height:1.25;color:var(--primary)}
.ddt-contact-home .sb-form-grid{display:flex;flex-direction:column;gap:10px}
.ddt-contact-home .sb-field label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.ddt-contact-home .sb-field:has(#c-mail){display:none}
.ddt-contact-home .sb-input,.ddt-contact-home .sb-textarea{width:100%;padding-left:54px;border:1.5px solid #E6CFA6;border-radius:var(--r-btn);background:#FFFDF9 no-repeat 20px center/20px;font-size:17px;color:var(--text);box-shadow:none}
.ddt-contact-home .sb-input{height:50px}
.ddt-contact-home .sb-input:focus,.ddt-contact-home .sb-textarea:focus{border-color:var(--primary);box-shadow:0 0 0 3px var(--tint)}
.ddt-contact-home .sb-textarea{height:110px;min-height:110px;padding-top:13px;border-radius:22px;background-position:20px 15px;resize:vertical}
.ddt-contact-home .sb-input::placeholder,.ddt-contact-home .sb-textarea::placeholder{color:#4A3F35}
.ddt-contact-home #c-name{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%233A2F26' d='M12 12a4.6 4.6 0 1 0 0-9.2 4.6 4.6 0 0 0 0 9.2zM3.5 21a8.5 8.5 0 0 1 17 0z'/%3E%3C/svg%3E")}
.ddt-contact-home #c-phone{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%233A2F26' d='M6.7 2.5h2.9l1.8 4.6-2.3 1.6a11.5 11.5 0 0 0 6.2 6.2l1.6-2.3 4.6 1.8v2.9a2.6 2.6 0 0 1-2.8 2.6C10.4 19.3 4.7 13.6 4.1 5.3a2.6 2.6 0 0 1 2.6-2.8z'/%3E%3C/svg%3E")}
.ddt-contact-home #c-msg{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%233A2F26' fill-rule='evenodd' d='M5 3.5h14a2 2 0 0 1 2 2V15a2 2 0 0 1-2 2H9.5L5 21v-4a2 2 0 0 1-2-2V5.5a2 2 0 0 1 2-2zm3 8.3a1.3 1.3 0 1 0 0-2.6 1.3 1.3 0 0 0 0 2.6zm4 0a1.3 1.3 0 1 0 0-2.6 1.3 1.3 0 0 0 0 2.6zm4 0a1.3 1.3 0 1 0 0-2.6 1.3 1.3 0 0 0 0 2.6z'/%3E%3C/svg%3E")}
.ddt-contact-home .sb-btn.sb-btn--lg{display:flex;align-items:center;justify-content:center;gap:12px;width:100%;min-height:var(--btn-h-lg);margin-top:4px;border-radius:var(--r-btn);font-size:16px;font-weight:700}
.ddt-contact-home .sb-btn::after{content:"";width:20px;height:20px;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h15M13 6l6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h15M13 6l6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat}
/* Bản đồ: máy tính là khung chữ nhật nằm ngang 4:3, canh giữa theo cột form; màn hẹp (cột rộng hết hàng) phủ kín cột. */
.ddt-map.ddt-map--home{position:relative;max-width:none;height:100%;min-height:340px;margin:0;border:1px solid var(--card-border);border-radius:var(--r-xl);box-shadow:var(--card-shadow);background:var(--secondary)}
@media (min-width:850px){
	/* Tỉ lệ cột theo thiết kế 28 / 38 / 34 (lưới 12 cột của Flatsome gần nhất là 3-5-4, cột thông tin quá hẹp). */
	.ddt-contact-home>.ddt-contact-home__info{flex-basis:28%;max-width:28%}
	.ddt-contact-home>.ddt-contact-home__form{flex-basis:38%;max-width:38%}
	.ddt-contact-home>.ddt-contact-home__map{flex-basis:34%;max-width:34%}
	.ddt-contact-home__map{align-self:center}
	.ddt-map.ddt-map--home{height:auto;min-height:0;aspect-ratio:4/3}
}
.ddt-map.ddt-map--home iframe{position:absolute;inset:0;width:100%;height:100%}
.ddt-contact-home__map .col-inner,.ddt-contact-home__map .ux-html{height:100%}
@media (max-width:849px){
	.ddt-contact-home__form>.col-inner{padding-left:0;border-left:0}
	.ddt-map.ddt-map--home{min-height:300px}
}
@media (max-width:549px){
	.ddt-cinfo li{margin-bottom:14px;padding-left:46px}
	.ddt-cinfo li::before{width:30px;height:30px}
	.ddt-cinfo strong{font-size:15px}
	.ddt-cinfo span,.ddt-cinfo__phone span{font-size:15px}
	.ddt-map.ddt-map--home{min-height:220px}
}

/* ========== Về chúng tôi ========== */
.ddt-about .row,.row.ddt-about{align-items:center}
.ddt-about__text p.ddt-about__eyebrow{display:flex;align-items:center;gap:12px;margin:0 0 8px;font-size:16px;font-weight:700;color:var(--primary)}
.ddt-about__eyebrow::after{content:"";flex:0 0 40px;height:2px;background:var(--gold)}
.ddt-about__title{margin:0 0 14px;font-family:var(--font-display);font-size:var(--fs-h2);font-weight:700;line-height:1.25;color:var(--primary);text-transform:uppercase;letter-spacing:.02em}
.ddt-about__text p{color:var(--text-2);font-size:16px;line-height:1.7}
.ddt-about__img img{border-radius:var(--r-xl);box-shadow:var(--shadow-card)}
/* Nút Flatsome là inline-block, dòng chữ cao hơn ô nên chữ lệch lên trên: căn giữa bằng flex như nút "Xem thêm dự án". */
.button.ddt-about__btn{display:inline-flex;align-items:center;justify-content:center;margin-top:8px;padding:0 28px;min-height:var(--btn-h);line-height:1.2;font-size:16px;font-weight:700;text-transform:none;letter-spacing:0}
@media (max-width:549px){.ddt-about__img img{aspect-ratio:16/9;object-fit:cover}}

/* ========== Chân trang (UX Block); khoảng cách trên / dưới đặt ở ô Padding của Section ========== */
/* Nút mạng xã hội của element Follow chỉ ~32px: nới đủ vùng bấm ngón tay, cách nhau 8px để không bấm nhầm nút bên cạnh. */
.ddt-follow{display:flex;flex-wrap:wrap;gap:8px}
.ddt-follow a.icon{display:inline-flex;align-items:center;justify-content:center;min-width:var(--tap);min-height:var(--tap);margin:0}

/* Dải trên chân trang (mọi trang): 3 ô Featured Box trên nền kem, biểu tượng nâu, chữ đậm; ô giữa có hotline, ô cuối có
   nút mạng xã hội. */
.ddt-fstrip-row .col{padding-bottom:0}
.ddt-fstrip.icon-box{align-items:center;gap:14px}
.ddt-fstrip .icon-box-img{flex-shrink:0;margin:0!important}
.ddt-fstrip .icon-box-text{padding:0}
.ddt-fstrip__title{margin:0;font-size:17px;font-weight:700;line-height:1.35;color:var(--primary);text-transform:none;letter-spacing:0}
.ddt-fstrip__text{margin:2px 0 0;font-size:18px;font-weight:700;line-height:1.3}
.ddt-fstrip__text a{color:var(--red)}
.ddt-fstrip__text a:hover{color:var(--red-hover)}
.ddt-fstrip__follow{margin:4px 0 0}
.ddt-fstrip__follow a.icon{margin:0 6px 0 0}
@media (max-width:549px){
	.ddt-fstrip-row .col{padding-bottom:14px}
	.ddt-fstrip-row .col:last-child{padding-bottom:0}
}

/* Chân trang nền nâu, 3 cột: logo + liên hệ │ Hỗ trợ khách hàng + mạng xã hội │ Fanpage + bản đồ; dòng bản quyền +
   trang chính sách. */
.ddt-footer{color:var(--footer-text)}
.ddt-footer__grid .col{padding-bottom:28px}
.ddt-footer__title--map{margin-top:22px}
/* Khung Fanpage (Page Plugin của Facebook) cao 130px, rộng theo cột (plugin tự co trong 180–500px). */
.ddt-ffb{max-width:500px;border-radius:var(--r-md);overflow:hidden;background:rgba(255,255,255,.06)}
.ddt-ffb iframe{display:block;width:100%;height:130px;border:0}
.ddt-map--footer{max-width:500px}
.ddt-map--footer iframe{height:180px}
.ddt-footer__col--quick .ddt-follow{margin-top:16px}
@media (pointer:coarse){.ddt-fstrip__follow a.icon{display:inline-flex;align-items:center;justify-content:center;min-width:var(--tap);min-height:var(--tap);margin:0}}
/* Điện thoại: mỗi nhóm liên kết một hàng (mở / thu gọn), mỗi link một dòng. */
@media (max-width:549px){
	.ddt-fmenu .ux-menu-link{align-items:flex-start}
	.ddt-fmenu .ux-menu-link__link{font-size:16px}
	.ddt-fmenu .ux-menu-link__text{padding-left:17px}
}
.ddt-footer__brand{margin:0 0 14px;font-family:var(--font-display);font-size:30px;font-weight:700;line-height:1.15;color:var(--on-dark)}
/* Logo tải lên là bản màu cho nền sáng: lọc về một màu kem để đọc được trên nền nâu, logo màu nào cũng ra cùng tông.
   Element Image tự đặt width bằng id: chỉ giới hạn max-width để vẫn chỉnh được độ rộng trong UX Builder. */
.ddt-flogo{max-width:260px;margin:0 0 18px}
.ddt-flogo img{filter:brightness(0) invert(77%) sepia(26%) saturate(215%) hue-rotate(3deg) brightness(114%)}
.ddt-footer__desc{max-width:30em;margin:0 0 20px;font-size:16px;line-height:1.65;color:rgba(243,230,207,.88)}
.ddt-footer__title{margin:0 0 14px;font-size:22px;font-weight:700;line-height:1.3;color:var(--on-dark);text-transform:none;letter-spacing:0}
.ddt-fmenu .ux-menu-link__link{min-height:32px;padding:4px 0;align-items:flex-start;color:rgba(243,230,207,.92);font-size:17px;line-height:1.4}
/* Mũi tên gắn vào chữ (không vào cả ô bấm) để luôn ngang dòng đầu, kể cả khi tên dài xuống hai dòng. */
.ddt-fmenu .ux-menu-link__text{position:relative;padding-left:20px}
.ddt-fmenu .ux-menu-link__text::before{content:"";position:absolute;left:1px;top:.7em;width:7px;height:7px;border-top:2px solid #F3D9A4;border-right:2px solid #F3D9A4;transform:translateY(-50%) rotate(45deg)}
.ddt-fmenu .ux-menu-link__link:hover{color:var(--gold)}
@media (max-width:849px){.ddt-fmenu .ux-menu-link__link{min-height:var(--tap);padding:10px 0}}
.ddt-fcontact{margin:0;padding:4px 0 0;list-style:none}
.ddt-fcontact li{position:relative;margin:0 0 18px;padding-left:40px;font-size:17px;line-height:1.55;color:rgba(243,230,207,.92);overflow-wrap:anywhere}
.ddt-fcontact li:empty{display:none}
.ddt-fcontact li::before{content:"";position:absolute;left:0;top:0;width:24px;height:24px;background:var(--footer-accent);-webkit-mask:var(--ic) center/contain no-repeat;mask:var(--ic) center/contain no-repeat}
.ddt-footer .ddt-follow{margin-top:0;gap:12px}
/* Element Follow kiểu "fill" tô màu từng hãng bằng !important ở lớp flatsome: ghi đè trong cùng lớp, độ đặc hiệu cao hơn. */
@layer flatsome{
	.ddt-footer .social-icons.ddt-follow .button.icon{color:#B07D2F!important;background-color:#B07D2F!important;border:2px solid #E7BC65!important}
	.ddt-footer .social-icons.ddt-follow .button.icon:hover{color:#C8913A!important;background-color:#C8913A!important;border-color:var(--footer-accent)!important}
	.ddt-footer .social-icons.ddt-follow .button.icon>i{color:#FFF8EA!important}
}
/* Dòng cuối: bản quyền bên trái │ Chính sách bảo mật, Điều khoản sử dụng bên phải; chữ cách đường kẻ trên và đáy trang
   bằng nhau (18px). Đường kẻ vẽ trong Row, chừa đúng lề 15px của cột để thẳng mép nội dung. Section chân trang đệm đều
   trên dưới 56px: đáy rút còn 18px. Màn hẹp: hai phần xếp hai dòng, canh giữa. */
.section.ddt-footer{padding-bottom:18px!important}
/* Màn chạm: link dòng cuối cao 44px (vùng bấm), chữ nằm giữa vùng đó nên đáy bù bớt phần dư. */
@media (max-width:849px){.section.ddt-footer{padding-bottom:8px!important}}
/* Máy tính bảng dọc: bản quyền và link cùng một hàng cao 44px, chữ đã nằm giữa hàng nên đỉnh cũng bù bớt. */
@media (min-width:550px) and (max-width:849px){.row.ddt-footer__legal{padding-top:8px}}
.ddt-footer__legal{position:relative;padding-top:18px}
.ddt-footer__legal::before{content:"";position:absolute;top:0;left:15px;right:15px;height:1px;background:#D5AD65}
.ddt-footer__legal .col{padding-bottom:0}
.ddt-footer__bottom>.col-inner{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:6px 24px}
.ddt-footer__copy{margin:0;font-size:15px;line-height:1.6;color:rgba(243,230,207,.88)}
.ux-menu.ddt-flegal{flex-direction:row;flex-wrap:wrap}
.ddt-flegal .ux-menu-link{align-items:center}
.ddt-flegal .ux-menu-link__link{min-height:0;padding:0;align-items:center;color:rgba(243,230,207,.92);font-size:15px;line-height:1.6}
.ddt-flegal .ux-menu-link__link:hover{color:var(--gold)}
/* Vạch ngăn giữa các link (link đầu không có). Vạch gắn vào link (không vào mục): UX Builder dùng ::before của mục để
   vẽ khung kéo thả. */
.ddt-flegal .ux-menu-link__link::before{content:"";flex:none;width:1px;height:14px;margin:0 12px;background:var(--footer-accent)}
.ddt-flegal .ux-menu-link:first-child .ux-menu-link__link::before{display:none}
@media (max-width:549px){
	.ddt-footer__bottom>.col-inner{justify-content:center;text-align:center}
	.ddt-footer__copy{flex-basis:100%}
	.ux-menu.ddt-flegal{justify-content:center}
}
@media (max-width:849px){.ddt-flegal .ux-menu-link__link{min-height:var(--tap);display:flex;align-items:center}}
/* Điện thoại: liên hệ ngay dưới phần giới thiệu; Liên kết nhanh, Danh mục (cột có class ddt-acc) thành
   mục mở rộng / thu gọn. theme.js chèn nút (.ddt-acc__btn) vào tiêu đề và class ddt-acc-ready cho chân trang; chưa chạy JS
   thì danh sách vẫn hiện đủ.
   Đường kẻ đặt ở .col-inner để thẳng mép nội dung. */
@media (max-width:549px){
	.ddt-footer__title{font-size:18px}
	.ddt-footer .ddt-acc{padding-bottom:0}
	.ddt-footer .ddt-acc>.col-inner{border-top:1px solid rgba(243,230,207,.22)}
	.ddt-footer__legal::before{background:rgba(243,230,207,.22)}
	.ddt-acc-ready .ddt-acc .ddt-footer__title{margin:0}
	/* Nút trông như tiêu đề: bỏ nền, viền, chữ hoa, đệm mặc định của nút Flatsome. */
	.ddt-acc__btn{position:relative;display:flex;align-items:center;width:100%;min-height:56px;margin:0;padding:0 32px 0 0;border:0;background:none;box-shadow:none;color:inherit;font:inherit;line-height:1.3;letter-spacing:0;text-align:left;text-transform:none;cursor:pointer}
	.ddt-acc__btn::after{content:"";position:absolute;right:6px;top:50%;width:10px;height:10px;margin-top:-8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);transition:transform .2s,margin .2s}
	.ddt-acc.is-open .ddt-acc__btn::after{margin-top:-2px;transform:rotate(-135deg)}
	.ddt-acc-ready .ddt-acc:not(.is-open) .ux-menu{display:none}
	.ddt-acc-ready .ddt-acc.is-open .ux-menu{padding-bottom:12px}
}
/* Khung bản đồ dùng chung (trang chủ, trang Liên hệ). */
.ddt-map{overflow:hidden;border-radius:var(--r-xl)}
.ddt-map iframe{display:block;width:100%;border:0}

/* ========== Trang Sản phẩm, danh mục (khuôn gốc Flatsome) ========== */
/* Banner tĩnh (UX Block "Đầu trang Sản phẩm" ở Shop Page Header). */
.ddt-shop-head{padding-top:20px}
.ddt-shop-head .col{padding-bottom:0}
.ddt-shop-banner{border-radius:var(--r-xl);overflow:hidden}
.ddt-shop-banner .text-box{padding:0}
.ddt-shop-banner__title{margin:0 0 8px;font-family:var(--font-display);font-size:var(--fs-h3);font-weight:700;line-height:1.2;color:#fff;text-wrap:balance}
.ddt-shop-banner__text{margin:0;font-size:16px;line-height:1.55;color:rgba(255,255,255,.92)}
/* Thanh tiêu đề: tên + đường dẫn (số kết quả + sắp xếp nằm ở hàng công cụ dưới hàng danh mục con). */
.category-page-title .page-title-inner{padding-top:24px;padding-bottom:8px;align-items:flex-end}
h1.shop-page-title{margin:0 0 6px;font-family:var(--font-display);font-size:var(--fs-h1);font-weight:700;line-height:1.25;color:var(--primary);text-transform:none;letter-spacing:0}
.woocommerce-breadcrumb{font-size:14px;color:var(--text-2);text-transform:none;letter-spacing:0}
.woocommerce-breadcrumb a{color:var(--text-2)}
.woocommerce-breadcrumb a:hover{color:var(--primary)}
.woocommerce-breadcrumb .divider{margin:0 6px;opacity:.6}
.woocommerce-result-count{margin:0 14px 0 0;font-size:14px;color:var(--text-2)}
.woocommerce-ordering{margin:0}
/* Hàng công cụ dưới hàng danh mục con: số sản phẩm bên trái, "Sắp xếp" + ô chọn bên phải. */
.ddt-shop-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 16px;margin:0 0 20px}
.ddt-shop-bar__count{margin:0;font-size:15px;color:var(--text-2)}
.ddt-shop-bar__sort{display:flex;align-items:center;gap:10px;margin-left:auto}
.ddt-shop-bar__label{font-size:15px;color:var(--text-2);white-space:nowrap}
/* Ô sắp xếp dùng bộ ô chọn của theme (theme.js): nút cùng cỡ ô chọn cũ, danh sách xổ bám mép phải. */
.ddt-shop-bar .sb-dd{width:200px}
.ddt-shop-bar .sb-dd__btn{height:var(--tap);padding:0 36px 0 14px;font-size:15px}
.ddt-shop-bar .sb-dd__panel{left:auto;right:0}
/* Điện thoại: câu số sản phẩm một dòng riêng; dòng dưới "Sắp xếp" + ô chọn kéo hết bề ngang. */
@media (max-width:549px){
	.ddt-shop-bar{gap:8px}
	.ddt-shop-bar__count{flex-basis:100%;font-size:14px}
	.ddt-shop-bar__sort{flex:1 1 100%;margin-left:0}
	.ddt-shop-bar__sort .woocommerce-ordering{flex:1 1 auto}
	.ddt-shop-bar .woocommerce-ordering select,.ddt-shop-bar .sb-dd{width:100%}
}
.woocommerce-ordering select{min-width:190px;height:var(--tap);margin:0;padding:0 36px 0 12px;border:1px solid var(--border-strong);border-radius:var(--r-md);background-color:#fff;font-size:15px;color:var(--text)}
.category-page-row{padding-top:12px}
.term-description{margin-bottom:16px;color:var(--text-2);font-size:15px}
/* Nút danh mục con: chỉ chữ, viền nâu, căn giữa, xuống dòng ở máy tính; rê chuột thì nền nâu chữ trắng. Điện thoại cuộn
   ngang một hàng cho khỏi đẩy lưới xuống sâu. */
.sb-subcats{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:0 0 24px;padding:0}
.sb-subcats a{display:inline-flex;align-items:center;min-height:var(--tap);padding:4px 18px;border:1px solid var(--primary);border-radius:999px;background:var(--surface);color:var(--primary);font-size:15px;font-weight:600;line-height:1.3;white-space:nowrap;text-decoration:none;transition:background-color .2s,color .2s}
.sb-subcats a:hover,.sb-subcats a:focus-visible{background:var(--primary);color:#fff}
/* Máy tính: hàng nút quá 2 dòng thì theme.js thu về 2 dòng (chiều cao đo sẵn trong --sb-subcats-h) + nút Xem thêm / Thu gọn. */
.sb-subcats.is-clamped{max-height:var(--sb-subcats-h);overflow:hidden;margin-bottom:10px}
.sb-subcats.is-open{margin-bottom:10px}
.sb-subcats-more{display:flex;align-items:center;gap:6px;min-height:var(--tap);margin:0 auto 16px;padding:0;border:0;background:none;color:var(--primary);font:700 15px/1.2 var(--font-ui);text-transform:none;letter-spacing:0;cursor:pointer}
.sb-subcats-more::after{content:"";width:7px;height:7px;margin-top:-4px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg)}
.sb-subcats-more[aria-expanded="true"]::after{margin-top:3px;transform:rotate(-135deg)}
.sb-subcats-more:hover{color:var(--primary-hover);text-decoration:underline}
.sb-subcats-more[hidden]{display:none}
/* Phân trang: ô số đủ vùng bấm. */
.woocommerce-pagination .page-numbers li>*{min-width:var(--tap);height:var(--tap);line-height:calc(var(--tap) - 2px);border-color:var(--border-strong);color:var(--text);font-weight:600}
.woocommerce-pagination .page-numbers li>.current,.woocommerce-pagination .page-numbers li>a:hover{border-color:var(--primary);background:var(--primary);color:#fff}
@media (max-width:849px){
	.category-page-title .page-title-inner{align-items:center}
	.sb-subcats{flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;margin:0 -15px 20px;padding:0 15px 4px;scrollbar-width:none;scroll-snap-type:x proximity;scroll-padding-inline:15px}
	.sb-subcats::-webkit-scrollbar{display:none}
	.sb-subcats a{flex:none;scroll-snap-align:start}
	/* Lề tự động hai đầu: hàng ngắn thì nằm giữa, hàng dài hơn màn thì vẫn cuộn từ nút đầu (căn giữa bằng justify-content
	   sẽ đẩy nút đầu ra ngoài mép trái, không cuộn tới được). */
	.sb-subcats a:first-child{margin-left:auto}
	.sb-subcats a:last-child{margin-right:auto}
}
@media (max-width:549px){
	.ddt-shop-banner .banner-layers{background:linear-gradient(180deg,rgba(20,10,2,.25),rgba(20,10,2,.7))}
	.ddt-shop-banner__text{font-size:14px}
	.woocommerce-ordering select{min-width:0;width:100%}
	.product-small .box-text-products{padding:10px 10px 12px}
	.product-small .product-title{font-size:15px}
	.product-small .price{font-size:15px}
}

/* ========== Trang sản phẩm (UX Block "Trang sản phẩm", bố cục Custom của Flatsome) ========== */
.ddt-pdp-top{padding-top:16px}
.ddt-pdp-crumbs{padding-bottom:12px}
.ddt-pdp-crumbs .breadcrumbs{font-size:14px}
.ddt-pdp-summary .product-title{margin:0 0 10px;font-family:var(--font-display);font-size:28px;font-weight:700;line-height:1.3;color:var(--text)}
/* Ô Divider của Product Title lưu chữ "false" nhưng Flatsome vẫn in đường kẻ (chuỗi khác rỗng là true). */
.ddt-pdp-summary .product-title-container .is-divider{display:none}
.ddt-pdp-summary .product_meta{display:flex;flex-wrap:wrap;gap:4px 24px;margin:0 0 14px;font-size:15px;color:var(--text-2)}
.ddt-pdp-summary .product_meta>span{display:inline;padding:0;border:0}
.ddt-pdp-summary .product_meta .posted_in,.ddt-pdp-summary .product_meta .tagged_as{display:none}
.ddt-pdp-summary .product_meta .sku{color:var(--text);font-weight:600}
.ddt-stock strong{color:#2E7D32;font-weight:600}
.ddt-stock--outofstock strong{color:var(--red)}
.ddt-pdp-summary .product-price-container{margin:0 0 16px;padding:12px 16px;border-radius:var(--r-md);background:var(--secondary)}
.ddt-pdp-summary .product-page-price,.ddt-pdp-summary .woocommerce-variation-price .price{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;margin:0;font:700 28px/1.25 var(--font-ui);color:var(--sale)}
.ddt-pdp-summary .price ins{order:-1;font:inherit;color:inherit;text-decoration:none}
.ddt-pdp-summary .price .amount,.ddt-mini .price .amount{color:inherit}
.ddt-pdp-summary .price del{font-size:17px;font-weight:400;color:var(--text-2)}
.ddt-pdp-summary .ddt-quote{font-size:24px}
.ddt-off{display:inline-block;padding:4px 8px;border-radius:var(--r-sm);background:var(--sale);color:#fff;font:700 14px/1 var(--font-ui);align-self:center}
.ddt-pdp-summary .product-short-description{margin:0 0 18px;font-size:16px;line-height:1.65;color:var(--text)}
.ddt-pdp-summary .product-short-description p{margin:0}
/* Chọn mẫu: nút bấm (Swatches của Flatsome, kiểu Label), nhãn ở trên. */
.ddt-pdp-summary table.variations{margin:0 0 6px}
.ddt-pdp-summary table.variations th,.ddt-pdp-summary table.variations td{padding:0;border:0}
.ddt-pdp-summary table.variations .label label,.ddt-pdp-summary .variations th{font-size:15px;font-weight:700;color:var(--text);text-transform:none;letter-spacing:0}
.ddt-pdp-summary .ux-swatches{gap:8px;margin:8px 0 6px}
.ddt-pdp-summary .ux-swatch--label{min-width:72px;min-height:var(--tap);margin:0;padding:0 16px;border:1px solid var(--border-strong);border-radius:var(--r-md);background:var(--surface);box-shadow:none;color:var(--text);font-size:15px;font-weight:600}
.ddt-pdp-summary .ux-swatch--label:hover{border-color:var(--primary)}
.ddt-pdp-summary .ux-swatch--label.selected{border-color:var(--primary);box-shadow:inset 0 0 0 1px var(--primary);background:var(--tint);color:var(--primary)}
/* Link bỏ chọn nằm cùng dòng nhãn "Kích thước: …", sát mép phải (Flatsome đặt nó lơ lửng phía trên dòng nhãn). */
.ddt-pdp-summary .reset_variations{top:0;display:inline-block;padding:6px 0;font-size:14px;line-height:1.35;color:var(--text-2);text-decoration:underline;text-transform:none;letter-spacing:0}
.ddt-pdp-summary .woocommerce-variation-price{margin:6px 0 4px}
.ddt-pdp-summary .woocommerce-variation-availability p{margin:0;font-size:14px}
/* Số lượng, Thêm vào giỏ (viền), Mua ngay (tô): cùng cao 48px. */
.ddt-pdp-summary form.cart,.ddt-pdp-summary .woocommerce-variation-add-to-cart{display:flex;flex-wrap:wrap;align-items:stretch;gap:10px;margin:12px 0 0}
.ddt-pdp-summary form.variations_form{display:block}
.ddt-pdp-summary .quantity{display:inline-flex;margin:0;height:48px;border:1px solid var(--border-strong);border-radius:var(--r-md);overflow:hidden}
.ddt-pdp-summary .quantity .button,.ddt-pdp-summary .quantity input{height:46px;margin:0;border:0;box-shadow:none;background:var(--surface)}
.ddt-pdp-summary .quantity .button{width:40px;min-width:40px;padding:0;color:var(--text)}
.ddt-pdp-summary .quantity input.qty{width:48px;font-size:16px;font-weight:600}
.ddt-pdp-summary .single_add_to_cart_button,.ddt-pdp-summary .ux-buy-now-button{flex:1 1 170px;height:48px;margin:0;padding:0 18px;border-radius:var(--r-btn);font-size:16px;font-weight:700;line-height:46px;text-transform:none;letter-spacing:0}
.ddt-pdp-summary .single_add_to_cart_button{border:1px solid var(--primary);background:var(--surface);color:var(--primary)}
.ddt-pdp-summary .single_add_to_cart_button:hover{background:var(--tint);color:var(--primary)}
.ddt-pdp-summary .ux-buy-now-button{border:1px solid var(--primary);background:var(--primary);color:#fff}
.ddt-pdp-summary .ux-buy-now-button:hover{border-color:var(--primary-hover);background:var(--primary-hover);color:#fff}
/* Đặt hàng nhanh (element riêng): Messenger, Zalo cùng hàng; Gọi rộng hết hàng dưới. */
.ddt-quick{margin-top:20px;padding-top:16px;border-top:1px solid var(--border)}
.ddt-quick__title{margin:0 0 10px;font-size:14px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--text-2)}
.ddt-quick__grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.ddt-quick__btn{display:flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 12px;border:1px solid var(--border-strong);border-radius:var(--r-btn);background:var(--surface);color:var(--text);font-size:15px;font-weight:600;line-height:1.3;text-align:center}
.ddt-quick__btn:hover{border-color:var(--primary);color:var(--primary)}
.ddt-quick__btn--messenger .ddt-quick__icon{color:#0A7CFF}
.ddt-quick__btn--call{grid-column:1/-1;border-color:var(--red);background:var(--red);color:#fff;font-weight:700}
.ddt-quick__btn--call:hover{border-color:var(--red-hover);background:var(--red-hover);color:#fff}
.ddt-quick__icon{display:inline-grid;place-items:center;line-height:0}
.ddt-quick__icon img,.ddt-quick__icon svg{width:24px;height:24px}
/* Tab mô tả, hướng dẫn mua hàng, đánh giá. */
.ddt-pdp-body,.ddt-pdp-more{padding-top:36px}
.ddt-pdp-main .woocommerce-tabs{padding:0}
.ddt-pdp-main .product-tabs{border-bottom:1px solid var(--border)}
.ddt-pdp-main .product-tabs>li>a{padding:12px 0;font-size:16px;font-weight:700;text-transform:none;letter-spacing:0;color:var(--text-2)}
.ddt-pdp-main .product-tabs>li.active>a,.ddt-pdp-main .product-tabs>li>a:hover{color:var(--primary)}
.ddt-pdp-main .product-tabs>li+li{margin-left:28px}
.ddt-pdp-main .woocommerce-Tabs-panel{padding-top:20px;font-size:16px;line-height:1.7}
.ddt-pdp-main .woocommerce-Tabs-panel h2,.ddt-pdp-main .woocommerce-Tabs-panel h3{margin:28px 0 10px;font-family:var(--font-display);font-size:var(--fs-h3);color:var(--text)}
.ddt-pdp-main .woocommerce-Tabs-panel h3{font-size:var(--fs-h4)}
/* Tiêu đề khung form đánh giá: không nhận khoảng cách trên dành cho tiêu đề trong bài mô tả. */
.ddt-pdp-main .woocommerce-Tabs-panel .sb-review-form .sb-card__title{margin:0}
/* Chỉ danh sách đánh số trong mô tả: Row 4 bước ở trang chủ cũng mang class ddt-steps. */
ol.ddt-steps{margin:0 0 12px 20px}
ol.ddt-steps li{margin-bottom:8px}
/* Thu gọn mô tả dài: nút "Xem thêm" / "Thu gọn" (theme.js gắn khi mô tả cao quá khung). */
.ddt-more-wrap{position:relative;max-height:620px;overflow:hidden}
.ddt-more-wrap::after{content:"";position:absolute;left:0;right:0;bottom:0;height:120px;background:linear-gradient(rgba(255,255,255,0),var(--bg));pointer-events:none}
/* Bài viết, công trình chỉ gập khi dài quá ~2 màn hình (theme.js); phần còn hiện cũng cỡ một màn hình để đọc được mục lục
   và mấy đoạn đầu. */
.single-post .ddt-more-wrap,.ddt-work .ddt-more-wrap{max-height:1100px}
.ddt-more-wrap.is-open{max-height:none}
.ddt-more-wrap.is-open::after{display:none}
.ddt-more-btn{display:flex;align-items:center;justify-content:center;gap:6px;min-height:var(--btn-h);margin:12px auto 0;padding:0 24px;border:1px solid var(--primary);border-radius:var(--r-btn);background:var(--surface);color:var(--primary);font-size:16px;font-weight:700;text-transform:none;letter-spacing:0;cursor:pointer}
.ddt-more-btn:hover{background:var(--tint)}
/* Cột phải: thông tin chi tiết, đã xem, tương tự. */
.ddt-pdp-side>.col-inner>*+*{margin-top:28px}
.ddt-side__title,.ddt-pdp-side .product-section-title{margin:0 0 12px;padding:0 0 10px;border-bottom:1px solid var(--border);font-family:var(--font-display);font-size:var(--fs-h4);font-weight:700;line-height:1.3;color:var(--primary);text-transform:uppercase;letter-spacing:.02em}
/* Cột phải trang sản phẩm (Thông tin chi tiết, Sản phẩm tương tự): tiêu đề không gạch chân. */
.ddt-pdp-side :is(.ddt-side__title,.product-section-title){padding-bottom:0;border-bottom:0}
.ddt-pdp-side .related.product-section{border-top:0}
.ddt-specs__table{width:100%;margin:0;border:1px solid var(--border);border-collapse:separate;border-spacing:0;border-radius:var(--r-lg);overflow:hidden;font-size:15px}
.ddt-specs__table th,.ddt-specs__table td{padding:10px 12px;border:0;vertical-align:top;line-height:1.5}
.ddt-specs__table tr+tr th,.ddt-specs__table tr+tr td{border-top:1px solid var(--border)}
.ddt-specs__table th{width:40%;background:var(--secondary);color:var(--text-2);font-size:14px;font-weight:600;text-align:left;text-transform:none;letter-spacing:0}
.ddt-specs__table td{color:var(--text)}
/* Sản phẩm tương tự (Product Related, 1 cột) và sản phẩm đã xem: ảnh nhỏ bên trái, tên + giá bên phải. */
.ddt-pdp-side .related .row{margin:0}
.ddt-pdp-side .related .product-small.col{padding:0 0 12px}
.ddt-pdp-side .related .badge-container,.ddt-pdp-side .related .image-tools{display:none}
.ddt-pdp-side .related .product-small.box{display:flex;align-items:center;gap:12px;border:0;border-radius:0;box-shadow:none;background:none}
.ddt-pdp-side .related .box-image{flex:0 0 84px;width:84px!important;border-radius:var(--r-md);overflow:hidden}
.ddt-pdp-side .related .box-text-products{padding:0}
.ddt-pdp-side .related .price{font-size:15px}
.ddt-pdp-side .related .product-title{min-height:0}
.ddt-mini{margin:0;padding:0;list-style:none}
.ddt-mini__item{display:flex;align-items:center;gap:12px;margin:0 0 12px;padding:0}
.ddt-mini__img{flex:0 0 84px;width:84px;border-radius:var(--r-md);overflow:hidden;background:var(--secondary)}
.ddt-mini__img img{display:block;width:100%;height:auto}
.ddt-mini__name{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-bottom:4px;font-size:15px;line-height:1.45;color:var(--text)}
.ddt-mini__name:hover{color:var(--primary)}
.ddt-mini .price{display:block;font:700 15px/1.3 var(--font-ui);color:var(--sale)}
.ddt-mini .price del{font-size:13px;font-weight:400;color:var(--text-2)}
.ddt-mini .price ins{font:inherit;color:inherit;text-decoration:none}
/* Giải đáp nhanh (Accordion), cẩm nang (Blog posts). */
.ddt-posts--side .post-item{padding-bottom:16px}
.ddt-posts--side .box-text{padding:0 0 0 14px}
.ddt-posts--side .post-title{font-size:15px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.custom-product-page .ddt-works-sec{margin-top:40px}
.ddt-placeholder{padding:16px;border:1px dashed var(--border-strong);border-radius:var(--r-md);color:var(--text-2);font-size:14px}
@media (max-width:849px){
	.ddt-pdp-summary{padding-top:8px}
	.ddt-pdp-summary .product-title{font-size:24px}
	.ddt-pdp-summary .product-page-price,.ddt-pdp-summary .woocommerce-variation-price .price{font-size:24px}
	.ddt-pdp-main .product-tabs>li+li{margin-left:20px}
}
/* Điện thoại: Flatsome xếp tab thành danh sách dọc (small-nav-collapse) đẩy nội dung xuống; giữ một hàng, chật thì cuộn ngang.
   Flatsome đặt margin:0 !important cho tab ở màn nhỏ (luật !important trong lớp Flatsome thắng luật thường của theme),
   nên khoảng cách giữa các tab đặt bằng gap của hàng tab. */
@media (max-width:549px){
	/* Chữ 14px, khe 12px: ba tab (Mô tả chi tiết · Hướng dẫn mua hàng · Đánh giá) vừa một hàng 360px, không phải vuốt. */
	.ddt-pdp-main .product-tabs{flex-wrap:nowrap;gap:12px;overflow-x:auto;scrollbar-width:none}
	.ddt-pdp-main .product-tabs::-webkit-scrollbar{display:none}
	.ddt-pdp-main .product-tabs>li{flex:none;width:auto}
	.ddt-pdp-main .product-tabs>li>a{padding:12px 0;font-size:14px;white-space:nowrap}
	.ddt-quick__pre{display:none}
}
@media (max-width:549px){
	.ddt-pdp-summary .product-title{font-size:22px}
	.ddt-posts--side .box-vertical{display:flex;align-items:center;gap:12px}
	.ddt-posts--side .box-vertical .box-image{flex:0 0 112px;width:112px!important;margin:0}
	.ddt-posts--side .box-vertical .box-text{padding:0}
}

/* ========== Giỏ hàng, thanh toán (khuôn Việt Nam của theme) ========== */
.sb-main{padding-bottom:var(--section)}
/* Phí giao báo sau khi xác nhận đơn: chữ thường, không tô xanh như "Miễn phí". */
.sb-ship-later{color:var(--text-2);font-weight:600;text-align:right}
/* Hướng dẫn chuyển khoản ở trang đặt hàng thành công là thẻ cùng hàng các thẻ khác: bỏ giới hạn độ dài dòng của .sb-prose. */
.sb-card.sb-prose{max-width:none}
.sb-pay--bank{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2064%2040'%3E%3Cg%20fill%3D'none'%20stroke%3D'%23783F04'%20stroke-width%3D'2'%20stroke-linejoin%3D'round'%3E%3Cpath%20d%3D'M20%2016l12-7%2012%207z'%2F%3E%3Cpath%20d%3D'M23%2018v10M29%2018v10M35%2018v10M41%2018v10M19%2031h26'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E")}
/* Link "Xem giỏ hàng" trong thông báo là nút Woo (chữ trắng) trên nền xanh nhạt → link chữ đậm màu thương hiệu. */
.sb-notice .button.wc-forward{display:inline;min-height:0;margin:0 0 0 8px;padding:0;border:0;background:none;color:var(--primary);font-size:inherit;font-weight:700;line-height:inherit;text-decoration:underline;text-transform:none;letter-spacing:0}

/* ========== Trang trong: Cẩm nang, Video, Công trình, Giới thiệu, Liên hệ ========== */
/* Banner tĩnh (UX Block "Banner trang trong"): in dưới đầu trang hoặc đặt đầu nội dung trang UX Builder. */
.ddt-inner-head{padding-top:20px}
.ddt-inner-head .col{padding-bottom:0}
.ddt-inner-banner+*,.ddt-inner-banner+#content{margin-top:0}
/* Cẩm nang không cột phải: Flatsome để lưới 10/12 canh giữa (hẹp hơn đầu trang) → rộng đủ khung như mọi khối. */
.blog-archive>.row.align-center>.large-10{flex-basis:100%;max-width:100%}
.blog-wrapper{padding-top:16px}
.ddt-blog-title .page-title-inner{padding-bottom:4px}
.ddt-chips-col{padding-bottom:8px}
/* Nút nhóm video nằm trên cột bài + thanh bên: giữ căn trái theo cột bài (nút danh mục sản phẩm thì căn giữa). */
.ddt-chips-col .sb-subcats{justify-content:flex-start}
.ddt-chips-col .sb-subcats a:first-child,.ddt-chips-col .sb-subcats a:last-child{margin-left:0;margin-right:0}
.sb-subcats a.is-active{border-color:var(--primary);background:var(--primary);color:#fff}
/* Lưới bài viết / video. */
.ddt-posts--grid .box-image{border-radius:var(--r-lg);overflow:hidden;background:var(--secondary)}
.ddt-posts--grid .box-text{padding:14px 2px 0}
.ddt-posts--grid .post-title{font-size:17px;line-height:1.45}
.ddt-posts--grid .from_the_blog_excerpt{font-size:15px;line-height:1.55;color:var(--text-2)}
.ddt-posts--grid .is-divider{display:none}
/* Video: biểu tượng phát trên ảnh để nhận ra đây là video. */
.ddt-posts--video .box-image{position:relative}
.ddt-posts--video .box-image::after{content:"";position:absolute;left:50%;top:50%;width:56px;height:56px;margin:-28px 0 0 -28px;border-radius:50%;background:var(--primary) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M8 5v14l11-7z'/%3E%3C/svg%3E") center/26px no-repeat;box-shadow:0 4px 14px rgba(0,0,0,.3);pointer-events:none}
/* Lưới chính trang Cẩm nang, Video: thẻ đổ bóng như thẻ sản phẩm trang chủ (khe 12px, rê chuột nổi lên); thẻ cùng hàng cao
   bằng nhau, tên và tóm tắt tối đa 2 dòng, link cuối thẻ dồn đáy cho thẳng hàng. */
.row.ddt-posts--archive{margin-left:-6px;margin-right:-6px}
.row.ddt-posts--archive>.col{padding:0 6px 12px}
.ddt-posts--archive .col-inner{height:100%}
.ddt-posts--archive .box-blog-post{display:flex;flex-direction:column;height:100%;border:1px solid var(--card-border);border-radius:var(--r-xl);overflow:hidden;background:var(--surface);box-shadow:var(--card-shadow);transition:transform .2s,box-shadow .2s}
.ddt-posts--archive .box-blog-post:hover{transform:translateY(-4px);box-shadow:var(--card-shadow-hover)}
@media (hover:none){.ddt-posts--archive .box-blog-post:hover{transform:none;box-shadow:var(--card-shadow)}}
@media (prefers-reduced-motion:reduce){.ddt-posts--archive .box-blog-post{transition:none}.ddt-posts--archive .box-blog-post:hover{transform:none}}
/* Khung ảnh của Flatsome canh giữa bằng margin auto: trong thẻ flex cột nó co về 0 → ép rộng hết thẻ. */
.ddt-posts--archive .box-image{width:100%;border-radius:0}
.ddt-posts--archive .box-text{display:flex;flex:1 1 auto;padding:14px 16px 16px}
.ddt-posts--archive .blog-post-inner{display:flex;flex:1 1 auto;flex-direction:column}
.ddt-post-meta{margin:0 0 6px;font-size:13px;line-height:1.4;color:var(--text-2)}
.ddt-posts--archive .post-title{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin:0 0 6px}
/* Link tên bài là inline-block (một khối liền) thì không cắt dòng được: trả về inline. */
.ddt-posts--archive .post-title a{display:inline}
.ddt-posts--archive .from_the_blog_excerpt{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin:0 0 12px;font-size:14px}
.ddt-posts--archive .button.is-link{display:inline-flex;align-items:center;gap:8px;align-self:flex-start;margin:auto 0 0;padding:0;min-height:0;border:0;background:none;font-size:14px;font-weight:700;line-height:1.4;color:var(--primary);text-transform:none;letter-spacing:0}
.ddt-posts--archive .button.is-link::after{content:"";width:7px;height:7px;border-top:2px solid currentColor;border-right:2px solid currentColor;transform:rotate(45deg)}
.ddt-posts--archive .box-blog-post:hover .button.is-link{text-decoration:underline}
/* Chi tiết bài viết, video, công trình. */
.ddt-post-crumbs{padding-top:8px}
.ddt-work{padding-top:24px}
.ddt-post-crumbs .col{padding-bottom:0}
.blog-single .entry-header .entry-title,.ddt-work .entry-title{margin:0 0 8px;font-family:var(--font-display);font-size:var(--fs-h1);font-weight:700;line-height:1.3;color:var(--text);text-transform:none}
.blog-single .entry-header .is-divider{display:none}
.blog-single .entry-header-text{padding-bottom:0}
.blog-single .entry-content{padding-top:0}
.blog-single .entry-meta,.ddt-work .entry-meta{margin:0 0 20px;font-size:14px;color:var(--text-2);text-transform:none;letter-spacing:0}
.blog-single .entry-meta a{color:var(--text-2)}
.blog-single .entry-image,.ddt-work .entry-image{margin:0 0 20px;border-radius:var(--r-xl);overflow:hidden}
.ddt-work__crumbs{margin:0 0 10px}
.ddt-work__crumbs .breadcrumbs{font-size:14px;text-transform:none;letter-spacing:0}
.ddt-work__crumbs .breadcrumbs a{color:var(--text-2)}
.blog-single .entry-content,.ddt-work .entry-content{font-size:16px;line-height:1.75}
.blog-single .entry-content h3,.ddt-work .entry-content h3{margin:22px 0 8px;font-family:var(--font-display);font-size:var(--fs-h4);color:var(--text)}
.blog-single .entry-content h2,.ddt-work .entry-content h2{margin:28px 0 10px;font-family:var(--font-display);font-size:var(--fs-h3);color:var(--text);scroll-margin-top:24px}
.blog-share{margin:24px 0 8px;text-align:left}
.blog-share .is-divider{display:none}
.ddt-toc{margin:0 0 24px;padding:16px 20px;border:1px solid var(--border);border-left:4px solid var(--primary);border-radius:var(--r-lg);background:var(--secondary)}
.ddt-toc__title{margin:0 0 8px;font-size:16px;font-weight:700;color:var(--text)}
.ddt-toc ol{margin:0 0 0 20px}
.ddt-toc li{margin:4px 0}
.ddt-toc a{color:var(--primary)}
.ddt-toc a[aria-current="true"]{font-weight:700}
.ddt-embed{max-width:100%;margin:20px auto}
.ddt-embed iframe{display:block;width:100%;height:auto;aspect-ratio:16/9;border:0;border-radius:var(--r-md)}
.ddt-embed--portrait{max-width:360px}
.ddt-embed--portrait iframe{aspect-ratio:9/16}
/* Phản hồi của cửa hàng dưới một đánh giá (tab Đánh giá trang sản phẩm). */
.sb-rv__reply{margin:4px 0 0;padding:10px 14px;border-left:3px solid var(--primary);border-radius:0 var(--r-md) var(--r-md) 0;background:var(--secondary)}
.sb-rv__reply p{margin:0;font-size:14px;line-height:1.6}
.sb-rv__reply .sb-rv__reply-head{margin-bottom:2px}
.sb-rv__reply-head strong{color:var(--primary)}
.sb-rv__reply-head small{margin-left:6px;color:var(--text-2)}
/* Bình luận, khung gọn: Họ và tên + Email chung một hàng (điện thoại xếp dọc), Nội dung 3 dòng, nút gửi. */
.comment-respond{padding:16px 20px;border:1px solid var(--border);border-radius:var(--r-xl);background:var(--secondary)}
.comment-reply-title{margin:0 0 4px;font-family:var(--font-display);font-size:20px;color:var(--primary);text-transform:none}
.comment-form{display:grid;grid-template-columns:1fr 1fr;column-gap:16px;margin:0}
.comment-form>*{grid-column:1/-1;margin:0 0 12px}
.comment-form>.comment-form-author{grid-column:1}
.comment-form>.comment-form-email{grid-column:2}
.comment-form>.form-submit{display:flex;margin-bottom:0}
.comment-form .comment-notes{font-size:14px;color:var(--text-2)}
.comment-form label{margin-bottom:4px;font-size:15px;font-weight:600;text-transform:none;letter-spacing:0;color:var(--text)}
.comment-form input[type=text],.comment-form input[type=email],.comment-form textarea{min-height:var(--field-h);margin:0;border:1px solid var(--border-strong);border-radius:var(--r-md);background:#fff;font-size:16px}
.comment-form textarea{min-height:100px;resize:vertical}
@media (max-width:549px){
	.comment-form{grid-template-columns:1fr}
	.comment-form>.comment-form-email{grid-column:1}
}
/* Nút chia sẻ (bài viết, công trình, video): mặc định 33px, màn cảm ứng nới đủ 44px cho ngón tay. */
@media (max-width:849px){.share-icons .button.icon{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;min-height:44px;margin:0 6px 6px 0;padding:0;line-height:1}}
/* Ô tick "Lưu tên của tôi…": ô 20px, chữ thụt thẳng hàng với dòng đầu khi xuống dòng. */
.comment-form-cookies-consent{display:flex;align-items:flex-start;gap:10px}
.comment-form-cookies-consent input[type=checkbox]{flex:none;width:20px;height:20px;margin:2px 0 0;accent-color:var(--primary)}
.comment-form-cookies-consent label{margin:0;font-weight:400;line-height:1.5}
.comment-form .form-submit .submit{min-height:var(--btn-h);padding:0 28px;border-radius:var(--r-btn);text-transform:none;letter-spacing:0;font-size:16px;font-weight:700;color:var(--on-primary)}
/* Cột phải (UX Block "Thanh bên bài viết") + cột phải trang Giới thiệu. */
.post-sidebar .widget,.post-sidebar .widget_block_widget{margin-bottom:0}
.post-sidebar .col-inner>*+*,.post-sidebar .widget>*+*{margin-top:28px}
.button.ddt-side__btn{display:flex;align-items:center;justify-content:center;margin:12px 0 0;min-height:var(--btn-h);padding:0 16px;border-width:1px;border-radius:var(--r-btn);font-size:16px;font-weight:700;line-height:1.3;text-transform:none;letter-spacing:0}
.ddt-mini__date{display:block;font-size:13px;color:var(--text-2)}
/* Tiêu đề khối cột phải dựng bằng element Title của Flatsome: cùng kiểu tiêu đề khối bài liên quan; danh sách và nút
   ngay dưới thuộc cùng khối nên không giãn cách như giữa hai khối. */
.ddt-title--side.section-title-container{margin-bottom:0}
.ddt-title--side .section-title{margin:0 0 12px;padding-bottom:10px;border-bottom:1px solid var(--border);font-size:var(--fs-h4)}
.post-sidebar .ddt-title--side+.ddt-side-products,.post-sidebar .ddt-side-products+.ddt-side__btn,.ddt-page-side .ddt-side-products+.ddt-side__btn{margin-top:0}
/* Cột phải trang Giới thiệu: khối sau nút "Xem thêm" cách ra như giữa hai khối (không thì tiêu đề dính sát nút). */
.ddt-page-side .button+.section-title-container{margin-top:28px}
/* Products List của Flatsome: ảnh nằm trong link tên, giá là các thẻ rời sau link → ảnh đặt tuyệt đối bên trái, tên và giá
   chảy bên phải, cùng cỡ với danh sách bài liên quan. */
.ddt-side-products{margin:0;padding:0}
.ddt-side-products li{position:relative;min-height:84px;margin:0 0 12px;padding:0 0 0 96px;border:0;list-style:none;font-size:15px;line-height:1.3}
.ddt-side-products li img{position:absolute;left:0;top:0;float:none;width:84px;height:84px;margin:0;border-radius:var(--r-md);object-fit:cover;background:var(--secondary)}
.ddt-side-products li a{display:block;margin:0 0 4px;font-size:15px;line-height:1.45;color:var(--text)}
.ddt-side-products li a .product-title{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ddt-side-products li a:hover{color:var(--primary)}
.ddt-side-products .amount{font-weight:700;color:var(--sale)}
.ddt-side-products del .amount{font-weight:400;color:var(--text-2)}
.ddt-ad{border-radius:var(--r-xl);overflow:hidden}
.ddt-ad .text-box{padding:0}
/* Tiêu đề 2 dòng cân nhau, cả khối chữ nằm trên đầu tượng trong ảnh nền. */
.ddt-ad__title{margin:0 0 12px;font-family:var(--font-display);font-size:18px;font-weight:700;line-height:1.35;color:#fff;text-wrap:balance}
.button.ddt-ad__btn{margin:0;min-height:var(--btn-h);padding:0 20px;border-radius:var(--r-btn);text-transform:none;letter-spacing:0;font-size:16px;font-weight:700;line-height:var(--btn-h);color:var(--on-gold)}
/* Khối cuối trang chi tiết (công trình nổi bật / tin tức mới nhất). */
.ddt-after{margin-top:24px;padding-bottom:var(--section)}
/* Hàng 2 cột "row-large" (bài │ cột phải) thò ra 15px mỗi bên để chữ thẳng mép đầu trang; màn hẹp hơn bề rộng tối đa của
   hàng thì hết chỗ thò, chữ thụt vào 15px → bù ở hai mép ngoài. */
@media (min-width:850px) and (max-width:1279px){
	.blog-wrapper>.row-large>.col:first-child,.ddt-work>.col:first-child{padding-left:15px}
	.blog-wrapper>.row-large>.col:last-child,.ddt-work>.col:last-child{padding-right:15px}
}
/* Trang Công trình (mẫu "Portfolio" của Flatsome). */
.portfolio-archive .page-title,.page-title.ddt-page-header{background:none;border:0}
/* Tiêu đề + đường dẫn xếp dọc, canh trái như trang Cẩm nang, Video (mẫu gốc để đường dẫn bên phải, canh giữa ở mobile);
   dùng chung cho element Page Header ở trang Giới thiệu, Liên hệ. */
.portfolio-archive .page-title-inner,.ddt-page-header .page-title-inner{flex-direction:column;align-items:flex-start;gap:4px;padding-top:24px;padding-bottom:8px;text-align:left}
.portfolio-archive .page-title-inner>.flex-col,.ddt-page-header .page-title-inner>.flex-col{margin:0;padding:0}
/* Cột tiêu đề mang lớp medium-text-center (text-align:center!important trong lớp CSS Flatsome, không đè được) → canh trái
   ở phần tử con, vốn chỉ thừa hưởng giá trị đó. */
.portfolio-archive .page-title-inner>.flex-col>*,.ddt-page-header .page-title-inner>.flex-col>*{text-align:left}
.ddt-page-header .title-breadcrumbs{padding:0}
.page-header-wrapper+.ddt-page-row{padding-top:8px}
.portfolio-archive .page-title .entry-title,.ddt-page-header .entry-title{font-family:var(--font-display);font-size:var(--fs-h1);font-weight:700;color:var(--primary);text-transform:none;letter-spacing:0}
.portfolio-archive .page-title .breadcrumbs,.ddt-page-header .breadcrumbs{font-size:14px;text-transform:none;letter-spacing:0}
.portfolio-archive .page-title .breadcrumbs a,.ddt-page-header .breadcrumbs a{color:var(--text-2)}
/* Tab lọc loại công trình: nút bo tròn có biểu tượng, nền kem viền vàng nhạt, tab đang chọn nền nâu chữ trắng. Biểu tượng
   theo tên loại (Flatsome lọc theo tên, ô data-filter chứa tên loại); loại khác / loại chủ shop thêm dùng biểu tượng tòa
   nhà chung. Dùng cho trang Công trình và khối Công trình trang chủ (kiểu nav-line-grow / in hoa của Flatsome bị thay:
   ::before của Flatsome là vạch chân, ở đây là biểu tượng). Điện thoại: một hàng vuốt ngang tràn hai mép. */
:is(.portfolio-archive,.ddt-works-sec) .filter-nav{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 12px}
.ddt-works-sec .filter-nav>li>a::after{display:none}
:is(.portfolio-archive,.ddt-works-sec) .filter-nav>li{margin:0}
:is(.portfolio-archive,.ddt-works-sec) .filter-nav>li>a{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 21V4.5h10V21'/%3E%3Cpath d='M14 9h6v12'/%3E%3Cpath d='M7 8h4M7 12h4M7 16h4'/%3E%3Cpath d='M17 13h0M17 17h0'/%3E%3Cpath d='M2.5 21h19'/%3E%3C/svg%3E");display:inline-flex;align-items:center;gap:8px;min-height:var(--tap);padding:0 18px 0 14px;border:1px solid #E6CFA6;border-radius:999px;background:var(--secondary);color:var(--brown-deep);font-size:15px;font-weight:600;white-space:nowrap;text-transform:none;letter-spacing:0;transition:background-color .15s,border-color .15s,color .15s}
:is(.portfolio-archive,.ddt-works-sec) .filter-nav>li>a::before{content:"";position:static;flex:none;width:20px;height:20px;opacity:1;transform:none;background:currentColor;-webkit-mask:var(--ic) center/contain no-repeat;mask:var(--ic) center/contain no-repeat}
:is(.portfolio-archive,.ddt-works-sec) .filter-nav>li>a[data-filter="*"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8'%3E%3Crect x='3.5' y='3.5' width='7' height='7' rx='1.5'/%3E%3Crect x='13.5' y='3.5' width='7' height='7' rx='1.5'/%3E%3Crect x='3.5' y='13.5' width='7' height='7' rx='1.5'/%3E%3Crect x='13.5' y='13.5' width='7' height='7' rx='1.5'/%3E%3C/svg%3E")}
:is(.portfolio-archive,.ddt-works-sec) .filter-nav>li>a[data-filter*="Đình chùa"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 10.5 12 4l9.5 6.5'/%3E%3Cpath d='M4 9.5h16'/%3E%3Cpath d='M5.5 10v10h13V10'/%3E%3Cpath d='M10 20v-5h4v5'/%3E%3Cpath d='M3 20h18'/%3E%3C/svg%3E")}
:is(.portfolio-archive,.ddt-works-sec) .filter-nav>li>a[data-filter*="Tượng đài"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 21h8'/%3E%3Cpath d='M9.5 21v-3h5v3'/%3E%3Cpath d='M10.5 18l.5-11h2l.5 11'/%3E%3Cpath d='M11 7l1-3 1 3'/%3E%3C/svg%3E")}
:is(.portfolio-archive,.ddt-works-sec) .filter-nav>li>a[data-filter*="Nhà thờ họ"]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 11 12 4l8.5 7'/%3E%3Cpath d='M5.5 9.5V20h13V9.5'/%3E%3Cpath d='M10 20v-5h4v5'/%3E%3C/svg%3E")}
:is(.portfolio-archive,.ddt-works-sec) .filter-nav>li>a:hover{border-color:var(--primary);color:var(--primary)}
:is(.portfolio-archive,.ddt-works-sec) .filter-nav>li.active>a{border-color:var(--primary);background:var(--primary);color:#fff}
@media (max-width:549px){
	:is(.portfolio-archive,.ddt-works-sec) .filter-nav{flex-wrap:nowrap;justify-content:flex-start;margin-left:-15px;margin-right:-15px;padding:0 15px 4px;overflow-x:auto;scrollbar-width:none}
	:is(.portfolio-archive,.ddt-works-sec) .filter-nav::-webkit-scrollbar{display:none}
	:is(.portfolio-archive,.ddt-works-sec) .filter-nav>li{flex:none}
}
/* Thẻ công trình cùng kiểu khối Công trình trang chủ: nền trắng bo 16px, bóng nhẹ, ảnh tràn mép trên, nhấc lên khi rê chuột. */
.portfolio-archive .portfolio-box{height:100%;overflow:hidden;background:var(--surface);border-radius:var(--r-xl);box-shadow:var(--shadow-card);transition:transform .2s,box-shadow .2s}
.portfolio-archive .col:hover .portfolio-box{transform:translateY(-4px);box-shadow:var(--shadow-hover)}
.portfolio-archive .portfolio-box .box-image{border-radius:0;overflow:hidden}
.portfolio-archive .portfolio-box .box-text{padding:14px 16px 16px;text-align:left}
@media (prefers-reduced-motion:reduce){.portfolio-archive .portfolio-box{transition:none}.portfolio-archive .col:hover .portfolio-box{transform:none}}
/* Lưới lọc của Flatsome xếp so le theo chiều cao từng ô; tên cố định 2 dòng + danh mục 1 dòng để mọi ô cao bằng nhau,
   các hàng thẳng như thiết kế (4 ô / hàng). */
.portfolio-archive .portfolio-box-title{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.8em;font-size:16px;font-weight:700;line-height:1.4;text-transform:none;letter-spacing:0;color:var(--text)}
.portfolio-archive .portfolio-box-category{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;text-transform:none;letter-spacing:0;font-size:14px;opacity:1;color:var(--text-2)}
.portfolio-archive .portfolio-box-category .show-on-hover{opacity:1;visibility:visible}
/* Trang Giới thiệu, Liên hệ (UX Builder). */
.ddt-page-row{padding-top:24px}
.ddt-page-main p,.ddt-page-main li{font-size:16px;line-height:1.7}
.ddt-page-main h2,.ddt-page-main h3{margin:24px 0 8px;font-family:var(--font-display);font-size:var(--fs-h4);color:var(--text)}
.ddt-map--page{max-width:none;margin:0;background:var(--secondary)}
.ddt-map--page iframe{height:280px}
.ddt-contact-form-row{padding-bottom:var(--section)}
/* Trang Liên hệ: banner mang tiêu đề trang (H1) + đường dẫn; 3 thẻ liên hệ nhanh; form │ thẻ thông tin xưởng + bản đồ. */
.ddt-contact-head .col,.ddt-contact-quick .col{padding-bottom:0}
.ddt-contact-hero__crumbs{margin:0 0 8px;font-size:14px;color:var(--on-dark-2)}
.ddt-contact-hero__crumbs a,.ddt-contact-hero__crumbs a:hover{color:#fff}
.ddt-contact-hero__crumbs .divider{margin:0 6px;opacity:.7}
.ddt-contact-hero__title{margin:0 0 8px;font-family:var(--font-display);font-size:var(--fs-h1);font-weight:700;line-height:1.2;color:#fff;text-wrap:balance}
.ddt-contact-hero__text{max-width:30em;margin:0;font-size:var(--fs-lead);line-height:1.55;color:var(--on-dark-2)}
.ddt-ccards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.ddt-ccard{display:flex;align-items:center;gap:14px;min-height:88px;padding:16px 20px;border:1px solid var(--border);border-radius:var(--r-xl);background:var(--surface);box-shadow:var(--shadow-card);color:var(--text);transition:transform .2s,box-shadow .2s}
.ddt-ccard:hover{transform:translateY(-3px);box-shadow:var(--shadow-hover);color:var(--text)}
.ddt-ccard__icon{display:grid;place-items:center;flex:none;width:52px;height:52px;border-radius:50%;background:var(--primary);color:#fff;line-height:0}
.ddt-ccard--zalo .ddt-ccard__icon{border:1px solid var(--border);background:#fff}
.ddt-ccard--messenger .ddt-ccard__icon{background:linear-gradient(45deg,#0099FF,#A033FF 60%,#FF5280)}
.ddt-ccard__icon svg{width:26px;height:26px}
.ddt-ccard__icon img{width:30px;height:30px}
.ddt-ccard__text{display:flex;flex-direction:column;gap:2px;min-width:0}
.ddt-ccard__title{font-size:var(--fs-card);font-weight:700;line-height:1.3}
.ddt-ccard__sub{font-size:15px;line-height:1.4;color:var(--text-2)}
.ddt-ccard--call .ddt-ccard__sub{font-weight:700;color:var(--primary)}
@media (hover:none){.ddt-ccard:hover{transform:none;box-shadow:var(--shadow-card)}}
@media (prefers-reduced-motion:reduce){.ddt-ccard{transition:none}.ddt-ccard:hover{transform:none}}
.ddt-contact-side>.col-inner{padding:24px;border:1px solid var(--border);border-radius:var(--r-xl);background:var(--surface)}
.ddt-contact-card__title{margin:0 0 18px;font-family:var(--font-display);font-size:var(--fs-h3);font-weight:700;line-height:1.25;color:var(--primary)}
.ddt-contact-info li:last-child{margin-bottom:18px}
.ddt-contact-info a{color:var(--text)}
.ddt-contact-info a:hover{color:var(--primary)}
.ddt-contact-info__old{display:block;margin-top:2px;font-size:14px;color:var(--text-2)}
.ddt-contact-side .ddt-map--page{border-radius:var(--r-lg)}
@media (min-width:850px){
	/* Hai cột cao bằng nhau: thẻ form kéo dài theo thẻ thông tin, phần dư dồn vào ô Nội dung (yêu cầu đúc thường dài). */
	.ddt-contact-main>.col-inner{height:100%}
	.ddt-contact-main .sb-card{display:flex;flex-direction:column;height:100%;margin:0}
	.ddt-contact-main .sb-form-grid{flex:1;grid-template-rows:auto auto 1fr auto}
	.ddt-contact-main .sb-field:has(.sb-textarea){display:flex;flex-direction:column}
	.ddt-contact-main .sb-textarea{flex:1;min-height:150px}
	.ddt-contact-side .ddt-map--page iframe{height:240px}
}
@media (max-width:549px){
	/* Điện thoại: 3 thẻ một hàng, biểu tượng trên chữ, bỏ dòng phụ cho vừa bề ngang. */
	.ddt-ccards{gap:8px}
	.ddt-ccard{flex-direction:column;justify-content:center;gap:8px;min-height:0;padding:14px 6px;text-align:center}
	.ddt-ccard__icon{width:44px;height:44px}
	.ddt-ccard__title{font-size:15px}
	.ddt-ccard__sub{display:none}
	.ddt-contact-side>.col-inner{padding:18px}
}
@media (max-width:849px){
	.post-sidebar{margin-top:24px}
}
@media (max-width:549px){
	.portfolio-archive .portfolio-box-title{-webkit-line-clamp:3;min-height:4.2em;font-size:15px}
	.portfolio-archive .filter-nav{flex-wrap:nowrap;overflow-x:auto;margin:0 -15px 12px;padding:0 15px 4px;scrollbar-width:none}
	.portfolio-archive .filter-nav>li>a{white-space:nowrap}
	.comment-respond{padding:16px}
	.ddt-map--page iframe{height:240px}
}

/* Trang ít nội dung (vd trang chính sách chưa viết): phần giữa giãn ra để chân trang chạm đáy màn hình, không để dải trắng. */
#wrapper{display:flex;flex-direction:column;min-height:calc(100vh - var(--wp-admin--admin-bar--height,0px))}
#wrapper>#main{flex:1 0 auto}

/* ========== Ngăn kéo menu điện thoại (danh mục sản phẩm) ========== */
/* Nền đặc: nền trắng 95% mặc định để chữ của trang phía sau lộ qua. */
.off-canvas .mfp-content{background:var(--surface)}
.mobile-sidebar .sidebar-menu{padding-top:0}
/* Thanh tiêu đề màu thương hiệu (ô Top content của Flatsome). */
.mobile-sidebar .sidebar-menu-top-content{margin:0;padding:0}
.ddt-drawer__title{display:flex;align-items:center;height:56px;margin:0;padding:0 16px;background:var(--primary);color:#fff;font-size:17px;font-weight:700;line-height:1.3}
/* Mỗi mục một dòng có vạch ngăn. Chữ co theo chỗ còn lại (flex-basis 0): tên dài xuống dòng trong ô chữ, nút mở luôn ở
   bên phải; mặc định chữ chiếm cả hàng nên nút mở rơi xuống dòng riêng bên trái. */
.mobile-sidebar .nav-sidebar>li{border-bottom:1px solid var(--border)}
.mobile-sidebar .nav-sidebar li>a{flex:1 1 0;min-width:0;min-height:48px;padding:12px 16px;align-items:center;color:var(--text);font-size:15px;font-weight:600;line-height:1.4;letter-spacing:0;text-transform:none}
.mobile-sidebar .nav-sidebar .toggle{flex:none;width:48px;height:48px;margin:0;color:var(--text-2);opacity:1}
/* Mục con: nền kem nhạt, thụt vào theo cấp, cao ≥ 44px cho ngón tay. */
.mobile-sidebar .nav-sidebar ul.children{border-top:1px solid var(--border);background:var(--secondary)}
.mobile-sidebar .nav-sidebar ul.children>li+li{border-top:1px solid var(--border)}
.mobile-sidebar .nav-sidebar ul.children li>a{min-height:44px;padding:11px 16px 11px 28px;font-weight:400}
.mobile-sidebar .nav-sidebar ul.children ul.children li>a{padding-left:40px}
.mobile-sidebar .nav-sidebar li.current-menu-item>a{color:var(--primary);font-weight:600}
/* Nút đóng: Flatsome ghim ở góc phải màn hình (trên lớp phủ, tách khỏi ngăn kéo) → đưa vào cuối thanh tiêu đề của ngăn
   kéo (bề rộng ngăn kéo = --drawer-width của Flatsome), chữ X trắng trên nền thương hiệu; bỏ hoà màu kiểu difference
   của Flatsome (X trắng trên nền nâu thành xanh nhạt). */
.off-canvas-left .mfp-close{top:8px;right:auto;left:calc(var(--drawer-width) - 48px);display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:none;box-shadow:none;color:#fff;opacity:1;mix-blend-mode:normal}
.off-canvas-left .mfp-close:hover{background:rgba(255,255,255,.15);color:#fff}
.ddt-drawer__title{padding-right:56px}
/* Ngăn giỏ hàng (bên phải): nút đóng nằm trên vùng trắng / lớp phủ, chữ trắng hoà màu mặc định gần như không thấy → nút
   tròn trắng có bóng, X đậm. */
.off-canvas-right .mfp-close{top:10px;right:10px;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:#fff;box-shadow:0 4px 12px rgba(0,0,0,.25);color:var(--text);opacity:1;mix-blend-mode:normal}

/* ========== Nút nổi: máy tính 3 nút tròn, điện thoại thanh điều hướng đáy ========== */
.ddt-float{position:fixed;right:16px;bottom:88px;z-index:98;display:flex;flex-direction:column;gap:10px}
.ddt-float__btn{position:relative;display:grid;place-items:center;width:52px;height:52px;border-radius:50%;box-shadow:0 6px 18px rgba(0,0,0,.22);color:#fff;transition:transform .2s ease}
.ddt-float__btn:hover{transform:scale(1.07);color:#fff;text-decoration:none}
.ddt-float__btn--zalo{order:1;background:#fff}
.ddt-float__btn--messenger{order:2;background:linear-gradient(45deg,#0099FF,#A033FF 60%,#FF5280)}
.ddt-float__btn--call{order:3;background:var(--red)}
.ddt-float__btn--call::before{content:"";position:absolute;inset:0;border-radius:50%;box-shadow:0 0 0 0 rgba(204,0,0,.45);animation:ddt-ring 1.8s ease-out infinite}
.ddt-float__btn--only-phone,.ddt-float__tab,.ddt-float__ico-phone{display:none}
.ddt-float__ico-desk{display:contents}
.ddt-float__icon{position:relative;display:grid;place-items:center;line-height:0}
.ddt-float__icon img{width:30px;height:30px}
.ddt-float__label{position:absolute;right:62px;top:50%;transform:translateY(-50%);padding:6px 10px;border-radius:6px;background:var(--text);color:#fff;font-size:13px;font-weight:600;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .2s ease}
.ddt-float__btn:hover .ddt-float__label,.ddt-float__btn:focus-visible .ddt-float__label{opacity:1}
@keyframes ddt-ring{to{box-shadow:0 0 0 14px rgba(204,0,0,0)}}
@media (prefers-reduced-motion:reduce){.ddt-float__btn--call::before{animation:none}.ddt-float__btn{transition:none}}
/* Điện thoại / máy tính bảng: nút tròn nổi che nút và giá của thẻ sản phẩm khi cuộn → thanh điều hướng nổi ở đáy kiểu app,
   5 mục (Danh mục, Tìm kiếm, Điện thoại, Zalo, Giỏ hàng), biểu tượng trên chữ; mục của trang đang xem tô nền. Trang chừa
   đáy bằng chiều cao thanh + khoảng hở để nội dung cuối trang không bị che. */
@media (max-width:849px){
	.ddt-float{left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom));flex-direction:row;gap:2px;padding:6px;background:var(--surface);border:1px solid var(--border);border-radius:24px;box-shadow:0 8px 28px rgba(60,32,4,.16)}
	.ddt-float__btn{order:0;flex:1 1 0;min-width:0;width:auto;height:56px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;border-radius:18px;box-shadow:none;background:none;color:var(--text)}
	.ddt-float__btn:hover{transform:none;color:var(--primary)}
	.ddt-float__btn--only-phone{display:flex}
	.ddt-float__btn--only-desktop,.ddt-float__label,.ddt-float__ico-desk{display:none}
	.ddt-float__ico-phone{display:contents}
	.ddt-float__btn--zalo,.ddt-float__btn--call,.ddt-float__btn--call:hover{background:none}
	.ddt-float__btn--call::before{display:none}
	.ddt-float__btn.is-active{background:var(--tint);color:var(--primary)}
	.ddt-float__icon svg{width:24px;height:24px}
	.ddt-float__icon img{width:26px;height:26px}
	.ddt-float__tab{display:block;max-width:100%;overflow:hidden;font-size:12px;font-weight:600;line-height:1.2;white-space:nowrap;text-overflow:ellipsis}
	/* Số trong giỏ: góc trên phải biểu tượng, viền trắng tách khỏi hình. */
	.ddt-float__badge{position:absolute;left:14px;top:-7px;min-width:18px;height:18px;padding:0 5px;border:2px solid var(--surface);border-radius:999px;background:var(--red);color:#fff;font-size:10px;font-weight:700;line-height:14px;text-align:center;box-sizing:border-box}
	/* Số trong vòng là ô đếm dùng chung (.sb-cart-count, JS cập nhật khi thêm vào giỏ) vốn có vòng đỏ riêng: bỏ để chỉ còn một vòng. */
	.ddt-float__badge .sb-cart-count{position:static;min-width:0;height:auto;padding:0;border-radius:0;background:none;color:inherit;font:inherit;line-height:inherit;animation:none}
	body:has(.ddt-float){padding-bottom:calc(84px + env(safe-area-inset-bottom))}
	body:has(.ddt-float) #top-link{bottom:96px!important}
	/* Giỏ hàng, thanh toán có thanh ghim đáy riêng (tổng tiền + nút đặt hàng) cùng chỗ → thanh điều hướng nhường chỗ, trang
	   chừa đáy theo thanh đặt hàng. */
	body:has(.sb-paybar) .ddt-float{display:none}
	body:has(.sb-paybar){padding-bottom:calc(72px + env(safe-area-inset-bottom))}
}
/* Nút lên đầu trang (điện thoại cũng hiện): tròn nền nâu, mũi tên trắng, nổi rõ trên cả nền trắng lẫn chân trang nâu. */
#top-link{z-index:97}
@layer flatsome{#top-link.button{border:0!important;background:var(--primary)!important;color:#fff!important;box-shadow:0 4px 12px rgba(0,0,0,.25)}}
@media (pointer:coarse){#top-link{display:flex;align-items:center;justify-content:center;width:44px;height:44px}}