@import url("/data/plugin/fontawesome581pro/fontawesome581pro.css");
@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700;900&display=swap");

@layer reset, tokens, base, layout, components, template, utilities, overrides;

@layer tokens {
	:root {
		/* Template KHONG co che do dark/light: khoa color-scheme de trinh duyet
		   khong tu doi mau input/select */
		color-scheme: light;

		/* Mau thuong hieu rut tu CSS goc cua theme con (flatsome-child):
		   #ff7e09 dung 24 lan, #ff7f0d 13 lan, #cd3006 13 lan, #f37321 5 lan */
		--az-template-brand: #ff7e09;
		--az-template-brand-2: #f37321;
		--az-template-brand-dark: #cd3006;
		/* Mau dau dai chuyen sac cua tieu de .the-title h2 ben ban dang chay */
		--az-template-brand-grad: #ff7f0d;
		--az-template-text: #0a0a0a;
		--az-template-text-soft: #515151;
		--az-template-bg: #ffffff;
		--az-template-bg-soft: #f2f2f2;
		--az-template-bg-dot: #fbfbfb;
		--az-template-dot: #e9e9e9;
		--az-template-dark: #282828;
		--az-template-line: #e3e3e3;
		--az-template-ok: #6cb917;

		--az-template-gap: 16px;
		--az-template-radius: 5px;
		--az-template-width: 1270px;
		/* Be ngang cot chu o trang ke chuyen; cot cham dieu huong bam theo so nay */
		/* Ban goc: hang chua noi dung tung muc do duoc 1270 x 530 (id row-114038796,
		   lop row align-middle align-center). Be ngang lay tu day; chieu cao 530 la
		   chieu cao TU NHIEN cua chu nen khong can ep. */
		--az-template-story-w: 1270px;
		--az-template-header-h: 75px;
		--az-template-font: 'Montserrat', Arial, Helvetica, sans-serif;
	}
}

@layer template {

	/* ==================== NEN TANG ==================== */
	* {
		outline: none;
		box-sizing: border-box;
		-webkit-text-size-adjust: 100%;
		-ms-text-size-adjust: 100%;
	}

	/* Lay dung theo body cua ban dang chay (doc bang DevTools):
	     background: url(...) no-repeat center center fixed; background-size: cover;
	     font-family Montserrat; font-weight 400; font-size 100%; color #0a0a0a
	   Duong dan anh viet TUONG DOI: style.css nam ngay trong thu muc template nen
	   trinh duyet tu ghep thanh {TemplateID}/images/bg.jpg - khong phai nhung ma
	   template vao tep CSS, va copy template sang site khac van chay. */
	body {
		margin: 0;
		/* 100vw cua khoi tran vien tinh ca thanh cuon doc -> chan tran ngang */
		overflow-x: hidden;
		padding: 0;
		background: url("images/bg.jpg") no-repeat center center fixed;
		background-size: cover;
		color: var(--az-template-text);
		font-family: var(--az-template-font);
		font-weight: 400;
		font-style: normal;
		font-size: 100%;
		line-height: 1.6;
	}

	a {
		color: inherit;
		text-decoration: none;
		transition: color .2s;
	}

	a:hover { color: var(--az-template-brand); }

	img {
		max-width: 100%;
		height: auto;
		border: 0;
		vertical-align: middle;
	}

	ul { list-style: none; margin: 0; padding: 0; }

	h1, h2, h3 { margin: 0 0 12px; line-height: 1.3; font-weight: 700; }
	h1 { font-size: 26px; }
	h2 { font-size: 21px; }
	h3 { font-size: 17px; }

	/* Khoi du lieu co cau truc schema.org - chi de may doc, khong hien */
	.az-template-schema { display: none; }

	/* Ban goc: .container, .row { max-width: 1270px } + padding 0 15px */
	.az-template-container {
		width: 100%;
		max-width: var(--az-template-width);
		margin: 0 auto;
		padding: 0 15px;
	}

	/* ==================== HEADER ====================
	   Do tu ban dang chay: .header-main{height:75px}, font Montserrat,
	   muc menu KHONG viet hoa, muc dang xem co gach chan ngan bang chu. */
	.az-template-header {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		z-index: 90;
		height: var(--az-template-header-h);
		/* Nen trang trai het be ngang. Viec dan hang giao cho khung ben trong,
		   khung do dung chung lop az-template-container voi than trang nen logo,
		   menu va o tim kiem thang hang voi noi dung ben duoi. */
		padding: 0;
		/* MAC DINH: nen dac. Trang khong co anh lon giu nguyen kieu nay. */
		background: #fff;
		box-shadow: 0 1px 6px rgba(0, 0, 0, .08);
		transition: background .25s, box-shadow .25s;
	}

	/* CHI trang co anh lon tran vien ngay duoi header moi trong suot khi chua cuon.
	   :has() de trinh duyet tu nhan biet — khong phai liet ke ten trang, va khong
	   nhay mau trong luc cho JS chay. */
	body:has(.az-template-story, .az-template-groupbanner) .az-template-header:not(.scrolled) {
		background: transparent;
		box-shadow: none;
	}

	.az-template-headerinner {
		display: flex;
		align-items: center;
		height: 100%;
	}

	/* O trong gian ra giua logo va menu - dung cach ban goc day menu sang phai
	   (flex-col flex-left flex-grow), thay vi can giua bang space-between. */
	.az-template-headerspace { flex: 1 1 auto; }

	.az-template-headerright {
		display: flex;
		align-items: center;
		gap: 10px;
		flex: 0 0 auto;
	}

	.az-template-headersep { height: var(--az-template-header-h); }

	/* Ban goc: #logo { width: 200px } - o logo co be ngang co dinh, anh cao toi da
	   bang chieu cao header. */
	.az-template-logo {
		display: flex;
		align-items: center;
		gap: 12px;
		flex: 0 0 200px;
		width: 200px;
		font-size: 20px;
		font-weight: 900;
		color: var(--az-template-brand);
		text-transform: uppercase;
	}

	/* Ban goc: #logo img { max-height: 75px; padding: 3px 0 } */
	.az-template-logo img { max-height: 75px; width: auto; padding: 3px 0; }
	.az-template-bars { font-size: 22px; color: var(--az-template-text); }

	/* ---- Menu may tinh ---- */
	.az-template-menu { flex: 0 1 auto; }

	.az-template-header .az-template-menu > ul {
		display: flex;
		align-items: center;
	}

	.az-template-header .az-template-menu > ul > li { position: relative; }

	/* Chep dung a.mega-menu-link ben ban dang chay:
	     color #ff7e09, font-size 16px, bold, line-height 40px, padding 0 20px,
	     gach chan 2px trong suot; di chuot hoac dang xem thi doi sang #cd3007. */
	.az-template-header .az-template-menu > ul > li > a {
		display: block;
		line-height: 40px;
		height: 40px;
		padding: 0 20px;
		font-size: 16px;
		font-weight: 700;
		white-space: nowrap;
		color: var(--az-template-brand);
		border-bottom: 2px solid transparent;
	}

	.az-template-header .az-template-menu > ul > li.on > a,
	.az-template-header .az-template-menu > ul > li > a:hover {
		color: var(--az-template-brand-dark);
		border-bottom-color: var(--az-template-brand-dark);
	}

	/* ---- Tong chu sang: CHI khi co anh lon phia duoi VA chua cuon ---- */
	body:has(.az-template-story, .az-template-groupbanner) .az-template-header:not(.scrolled) .az-template-logo,
	body:has(.az-template-story, .az-template-groupbanner) .az-template-header:not(.scrolled) .az-template-bars,
	body:has(.az-template-story, .az-template-groupbanner) .az-template-header:not(.scrolled) .az-template-searchtoggle {
		color: #fff;
	}

	/* LUU Y: Menu chinh KHONG doi mau khi header trong suot.
	   Ben ban dang chay co luat .transparent .nav > li > a { color: #fff } nhung
	   menu chinh chay qua Mega Menu voi selector nang hon han (hai id) nen luat
	   trang KHONG thang noi - thuc te menu van mau cam ca hai trang. Chi nut mo
	   menu va nut kinh lup moi doi sang trang (luat ngay ben tren).
	   Truoc day o day doi menu sang trang, lam trang Gioi thieu lech han trang chu. */
	body:has(.az-template-story, .az-template-groupbanner) .az-template-header:not(.scrolled) .az-template-menu > ul > li > ul > li > a {
		color: var(--az-template-text);
	}
	.az-template-header .az-template-menu > ul > li > a i { font-size: 11px; margin-left: 5px; }

	/* Nhom con: hien khi tro chuot vao muc cha */
	.az-template-header .az-template-menu > ul > li > ul {
		position: absolute;
		top: 100%;
		left: 0;
		min-width: 220px;
		padding: 6px 0;
		background: #fff;
		border-radius: var(--az-template-radius);
		box-shadow: 0 4px 16px rgba(0, 0, 0, .16);
		opacity: 0;
		visibility: hidden;
		transform: translateY(6px);
		transition: opacity .18s, transform .18s, visibility .18s;
	}

	.az-template-header .az-template-menu > ul > li:hover > ul {
		opacity: 1;
		visibility: visible;
		transform: translateY(0);
	}

	.az-template-header .az-template-menu > ul > li > ul > li > a {
		display: block;
		padding: 9px 16px;
		font-size: 15px;
		font-weight: 500;
	}

	.az-template-header .az-template-menu > ul > li > ul > li > a:hover {
		background: var(--az-template-bg-soft);
		color: var(--az-template-brand);
	}

	/* ---- Tim kiem: mac dinh chi hien nut kinh lup ---- */
	.az-template-header .az-template-search {
		flex: 0 0 auto;
		position: relative;
	}

	.az-template-header .az-template-searchtoggle {
		display: block;
		font-size: 19px;
		color: var(--az-template-brand);
	}

	.az-template-header .az-template-searchbox {
		display: none;
		position: absolute;
		right: 0;
		top: calc(100% + 8px);
		padding: 8px;
		background: #fff;
		border-radius: 24px;
		box-shadow: 0 4px 16px rgba(0, 0, 0, .16);
	}

	.az-template-header .az-template-search.open .az-template-searchbox { display: block; }
	.az-template-header .az-template-search.open .az-template-searchtoggle { color: var(--az-template-brand-dark); }

	.az-template-header .az-template-searchbox input[type="text"] {
		width: 240px;
		height: 38px;
		padding: 0 38px 0 14px;
		font-family: inherit;
		font-size: 14px;
		background: #fff;
		border: 1px solid var(--az-template-brand);
		border-radius: 19px;
	}

	.az-template-header .az-template-searchbox a {
		position: absolute;
		right: 20px;
		top: 50%;
		transform: translateY(-50%);
		color: var(--az-template-brand);
	}

	/* ==================== MENU TRUOT (dien thoai) ==================== */
	.az-template-panelmenu {
		position: fixed;
		top: 0;
		left: 0;
		bottom: 0;
		z-index: 120;
		width: 290px;
		max-width: 84vw;
		background: var(--az-template-bg);
		box-shadow: 2px 0 14px rgba(0, 0, 0, .2);
		transform: translateX(-102%);
		transition: transform .25s ease;
		overflow-y: auto;
	}

	.az-template-panelmenu.active { transform: translateX(0); }

	.az-template-menudim {
		position: fixed;
		inset: 0;
		z-index: 110;
		background: rgba(0, 0, 0, .45);
	}

	.az-template-panelmenu .az-template-search {
		position: relative;
		padding: 14px 14px 14px 46px;
		background: var(--az-template-brand);
	}

	.az-template-panelmenu .az-template-search .close {
		position: absolute;
		left: 12px;
		top: 50%;
		transform: translateY(-50%);
		font-size: 20px;
		color: #fff;
	}

	.az-template-panelmenu .az-template-search input[type="text"] {
		width: 100%;
		height: 36px;
		padding: 0 34px 0 12px;
		font-family: inherit;
		font-size: 14px;
		border: 0;
		border-radius: 18px;
	}

	.az-template-panelmenu .az-template-search span a {
		position: absolute;
		right: 24px;
		top: 50%;
		transform: translateY(-50%);
		color: var(--az-template-brand);
	}

	.az-template-panelmenu .az-template-menu li > a {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 8px;
		padding: 13px 16px;
		font-size: 15px;
		border-bottom: 1px solid var(--az-template-line);
	}

	.az-template-panelmenu .az-template-menu li > a i { font-size: 12px; color: var(--az-template-text-soft); }

	.az-template-panelmenu .az-template-menu li ul { display: none; background: var(--az-template-bg-soft); }
	.az-template-panelmenu .az-template-menu li.open > ul { display: block; }
	.az-template-panelmenu .az-template-menu li ul li > a { padding-left: 32px; font-size: 14px; }

	/* ==================== CHAN TRANG ====================
	   Theo ban dang chay: nen trang, ba phan — thuong hieu + menu ngang |
	   lien he | mang cam vat cheo o phai. */
	.az-template-footer {
		position: relative;
		display: flex;
		align-items: stretch;
		margin-top: 0;
		background: #fff;
		font-size: 15px;
		overflow: hidden;
	}

	.az-template-footermain {
		flex: 1 1 auto;
		display: flex;
		flex-wrap: wrap;
		gap: 40px;
		padding: 34px 4vw 30px;
	}

	/* ---- Thuong hieu + menu ngang ---- */
	.az-template-footerbrand { flex: 1 1 320px; }
	.az-template-footerbrand img { max-height: 74px; width: auto; margin-bottom: 18px; }

	.az-template-footerbrand ul {
		display: flex;
		flex-wrap: wrap;
		gap: 6px 18px;
	}

	.az-template-footerbrand li a {
		font-size: 14px;
		font-weight: 600;
		color: var(--az-template-text);
	}

	.az-template-footerbrand li a:hover { color: var(--az-template-brand); }

	/* ---- Lien he ---- */
	.az-template-footercontact {
		flex: 0 1 320px;
		padding-top: 8px;
	}

	.az-template-footercontact > div {
		margin-bottom: 12px;
		font-weight: 600;
		color: var(--az-template-text);
	}

	.az-template-footercontact i { width: 20px; color: var(--az-template-text); }
	.az-template-footercontact a:hover { color: var(--az-template-brand); }
	.az-template-footerphone { font-size: 17px; letter-spacing: .5px; }

	/* ---- Mang cam vat cheo ---- */
	.az-template-footerslogan {
		flex: 0 0 34%;
		min-height: 190px;
		display: flex;
		flex-direction: column;
		justify-content: center;
		padding: 30px 4vw 30px 7vw;
		background: var(--az-template-brand);
		color: #fff;
		/* Canh trai vat cheo: dinh lui vao 25% be rong mang, day sat mep trai */
		clip-path: polygon(25% 0, 100% 0, 100% 100%, 0 100%);
	}

	.az-template-footerslogan p {
		margin: 0 0 10px;
		font-size: 15px;
		font-weight: 700;
		line-height: 1.6;
	}

	.az-template-footerslogan .az-template-copyright {
		margin: 0;
		padding: 0;
		border: 0;
		font-size: 13px;
		font-weight: 600;
		font-style: italic;
		color: rgba(255, 255, 255, .9);
		text-align: left;
	}

	/* ==================== THANH NOI (goi / chi duong / zalo) ==================== */
	.az-template-navfooter {
		position: fixed;
		right: 12px;
		bottom: 200px;
		z-index: 95;
	}

	.az-template-navfooter ul { display: flex; flex-direction: column; gap: 8px; }

	.az-template-navfooter a {
		display: flex;
		align-items: center;
		gap: 8px;
		padding: 9px 14px;
		background: var(--az-template-brand);
		color: #fff;
		font-size: 13px;
		font-weight: 500;
		border-radius: 22px;
		box-shadow: 0 2px 8px rgba(0, 0, 0, .22);
	}

	.az-template-navfooter a:hover { background: var(--az-template-brand-dark); color: #fff; }

	/* ==================== KHOI NOI DUNG DUNG CHUNG ==================== */
	/* Chep .product-title ben ban dang chay: mau cam thuong hieu.
	   Khi la lien ket thi 16px dam 600 (luat ngay ben duoi). */
	.az-template-h1 {
		margin: 24px 0 6px;
		font-size: 24px;
		color: var(--az-template-brand);
	}

	.az-template-h1 a,
	.az-template-product .az-template-name a {
		font-size: 16px;
		font-weight: 600;
		color: var(--az-template-brand);
	}

	.az-template-title {
		margin: 30px 0 16px;
		padding-bottom: 8px;
		font-size: 19px;
		text-transform: uppercase;
		color: var(--az-template-text);
		border-bottom: 2px solid var(--az-template-brand);
	}

	.az-template-btn {
		display: inline-block;
		padding: 10px 22px;
		background: var(--az-template-brand);
		color: #fff;
		font-weight: 500;
		border-radius: var(--az-template-radius);
	}

	.az-template-btn:hover { background: var(--az-template-brand-dark); color: #fff; }

	/* ---- Bang bang ---- */
	.az-template-slide {
		width: 100%;
		max-width: var(--az-template-width);
		margin: 50px auto 0;
		padding: 0 var(--az-template-gap);
		overflow: hidden;
	}
	.az-template-slide img {
		width: 100%;
		display: block;
		/* Anh nguon co the rat cao (anh san pham doc). Khoa ti le bang bang
		   de mot anh le khong keo dai ca trang. */
		aspect-ratio: 16 / 6;
		object-fit: cover;
		border-radius: var(--az-template-radius);
	}

	/* ---- Luoi nhom san pham ---- */
	.az-template-groups {
		display: grid;
		grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
		gap: var(--az-template-gap);
	}

	.az-template-groupitem {
		display: block;
		padding: 10px;
		background: #fff;
		border: 1px solid var(--az-template-line);
		border-radius: var(--az-template-radius);
		text-align: center;
		transition: border-color .2s, box-shadow .2s;
	}

	.az-template-groupitem:hover {
		border-color: var(--az-template-brand);
		box-shadow: 0 3px 12px rgba(0, 0, 0, .1);
	}

	.az-template-groupitem .az-template-image {
		display: block;
		aspect-ratio: 4 / 3;
		overflow: hidden;
		background: var(--az-template-bg-soft);
		border-radius: var(--az-template-radius);
	}

	.az-template-groupitem .az-template-image img {
		width: 100%;
		height: 100%;
		object-fit: cover;
	}

	.az-template-groupitem .az-template-name {
		display: block;
		margin-top: 9px;
		font-weight: 500;
		text-transform: uppercase;
		font-size: 14px;
	}

	.az-template-groupitem .az-template-count {
		display: block;
		font-size: 12px;
		color: var(--az-template-text-soft);
	}

	/* ---- Luoi san pham ---- */
	.az-template-product {
		display: grid;
		grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
		gap: var(--az-template-gap);
		margin-bottom: 30px;
	}

	.az-template-product .az-template-item {
		padding: 10px;
		background: #fff;
		border: 1px solid var(--az-template-line);
		border-radius: var(--az-template-radius);
		transition: border-color .2s, box-shadow .2s;
	}

	.az-template-product .az-template-item:hover {
		border-color: var(--az-template-brand);
		box-shadow: 0 3px 12px rgba(0, 0, 0, .1);
	}

	.az-template-product .az-template-image {
		display: block;
		aspect-ratio: 1 / 1;
		overflow: hidden;
		background: var(--az-template-bg-soft);
		border-radius: var(--az-template-radius);
	}

	.az-template-product .az-template-image img {
		width: 100%;
		height: 100%;
		object-fit: contain;
	}

	.az-template-product .az-template-name {
		margin-top: 9px;
		min-height: 40px;
		font-weight: 500;
		font-size: 14px;
		line-height: 1.4;
	}

	.az-template-product .az-template-name a:hover { color: var(--az-template-brand); }

	.az-template-price {
		margin-top: 4px;
		font-size: 17px;
		font-weight: 700;
		color: var(--az-template-brand-dark);
	}

	.az-template-price sup { font-size: 11px; margin-left: 2px; }
	.az-template-price .az-template-contact { font-size: 15px; color: var(--az-template-brand); }

	/* ---- Gioi thieu ngan tren trang chu ---- */
	.az-template-introhome { margin: 34px 0; }

	.az-template-introitem {
		padding: 16px 0;
		border-bottom: 1px solid var(--az-template-line);
	}

	.az-template-introitem:last-child { border-bottom: 0; }
	.az-template-introitem h2 { font-size: 17px; color: var(--az-template-brand-dark); }

	/* ---- Trang 404 ---- */
	.az-template-error404 { padding: 50px 16px 30px; text-align: center; }

	.az-template-error404 .az-template-code {
		font-size: 92px;
		font-weight: 900;
		line-height: 1;
		color: var(--az-template-brand);
	}

	.az-template-error404 h1 { margin-top: 10px; }
	.az-template-error404 .az-template-title { text-align: left; }
	.az-template-error404 .az-template-groups { text-align: left; }

	/* ---- Bo suu tap (vung Collection) ---- */
	.az-template-collection { display: grid; gap: 22px; }

	.az-template-collectionitem { text-align: center; }

	.az-template-collectionitem img {
		width: 100%;
		border-radius: var(--az-template-radius);
	}

	.az-template-collectionname {
		margin-top: 10px;
		font-size: 16px;
		font-weight: 500;
		text-transform: uppercase;
		letter-spacing: 1px;
	}

	/* ---- Doi tac ---- */
	.az-template-partner {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		justify-content: center;
		gap: 26px;
	}

	.az-template-partner img { max-height: 60px; width: auto; }

	/* ---- Doan dan ---- */
	.az-template-lead {
		max-width: 760px;
		margin: 0 auto 22px;
		text-align: center;
		color: var(--az-template-text-soft);
	}

	.az-template-empty {
		padding: 40px 0;
		text-align: center;
		color: var(--az-template-text-soft);
	}

	/* ---- Thu vien anh ---- */
	.az-template-gallerysearch {
		position: relative;
		max-width: 380px;
		margin: 0 auto 26px;
	}

	.az-template-gallerysearch input[type="text"] {
		width: 100%;
		height: 40px;
		padding: 0 40px 0 16px;
		font-family: inherit;
		font-size: 14px;
		background: #fff;
		border: 1px solid var(--az-template-brand);
		border-radius: 20px;
	}

	.az-template-gallerysearch i {
		position: absolute;
		right: 16px;
		top: 50%;
		transform: translateY(-50%);
		color: var(--az-template-brand);
	}

	.az-template-gallery {
		display: grid;
		grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
		gap: 12px;
	}

	.az-template-galleryitem {
		position: relative;
		aspect-ratio: 1 / 1;
		overflow: hidden;
		background: var(--az-template-bg-soft);
		border-radius: var(--az-template-radius);
		cursor: zoom-in;
	}

	.az-template-galleryitem.off,
	.az-template-galleryitem.hide { display: none; }

	.az-template-galleryitem img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		transition: transform .3s;
	}

	.az-template-galleryitem:hover img { transform: scale(1.06); }

	.az-template-gallerylink {
		position: absolute;
		left: 0;
		right: 0;
		bottom: 0;
		padding: 7px 8px;
		background: rgba(0, 0, 0, .55);
		color: #fff;
		font-size: 12px;
		text-align: center;
		opacity: 0;
		transition: opacity .2s;
	}

	.az-template-galleryitem:hover .az-template-gallerylink { opacity: 1; }

	.az-template-gallerymore {
		margin: 24px auto 0;
		padding: 11px 26px;
		width: fit-content;
		background: var(--az-template-brand);
		color: #fff;
		font-weight: 500;
		border-radius: 22px;
		cursor: pointer;
	}

	.az-template-gallerymore.off { display: none; }
	.az-template-gallerymore:hover { background: var(--az-template-brand-dark); }

	/* ---- Duong dan phan cap ---- */
	.az-template-breadcrumb {
		margin: 20px 0 8px;
		font-size: 13px;
		color: var(--az-template-text-soft);
	}

	.az-template-breadcrumb i { margin: 0 7px; font-size: 11px; }
	.az-template-breadcrumb a:hover { color: var(--az-template-brand); }

	/* ---- Thanh loc nhom tren trang san pham ---- */
	.az-template-groupbar {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		gap: 8px;
		margin-bottom: 26px;
	}

	.az-template-groupbar a {
		padding: 8px 18px;
		font-size: 14px;
		background: #fff;
		border: 1px solid var(--az-template-line);
		border-radius: 20px;
	}

	.az-template-groupbar a:hover,
	.az-template-groupbar a.on {
		background: var(--az-template-brand);
		border-color: var(--az-template-brand);
		color: #fff;
	}

	/* ---- Chi tiet san pham ---- */
	.az-template-infoproduct {
		display: grid;
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
		gap: 34px;
		align-items: start;
		margin-bottom: 20px;
	}

	.az-template-infoimage .az-template-image {
		background: #fff;
		border: 1px solid var(--az-template-line);
		border-radius: var(--az-template-radius);
		overflow: hidden;
		cursor: zoom-in;
	}

	.az-template-infoimage .az-template-image img {
		width: 100%;
		aspect-ratio: 1 / 1;
		object-fit: contain;
	}

	.az-template-thumbnails {
		display: flex;
		flex-wrap: wrap;
		gap: 8px;
		margin-top: 10px;
	}

	.az-template-thumbnails a {
		width: 72px;
		height: 72px;
		border: 1px solid var(--az-template-line);
		border-radius: 4px;
		overflow: hidden;
	}

	.az-template-thumbnails a.on { border-color: var(--az-template-brand); }
	.az-template-thumbnails img { width: 100%; height: 100%; object-fit: cover; }

	.az-template-sku { margin-bottom: 8px; color: var(--az-template-text-soft); font-size: 14px; }
	.az-template-shortdesc { margin: 14px 0 20px; color: var(--az-template-text-soft); }

	.az-template-call {
		display: inline-flex;
		align-items: center;
		gap: 8px;
	}

	/* ---- Noi dung dai (bai viet / mo ta san pham) ---- */
	.az-template-content { max-width: 900px; margin: 0 auto; }
	.az-template-content img { height: auto; border-radius: var(--az-template-radius); }
	.az-template-content p { margin: 0 0 14px; }
	.az-template-content h2 { margin-top: 24px; font-size: 20px; color: var(--az-template-brand-dark); }
	.az-template-content h3 { margin-top: 20px; font-size: 17px; }
	.az-template-content ul, .az-template-content ol { margin: 0 0 14px; padding-left: 22px; }
	.az-template-content ul { list-style: disc; }
	.az-template-content ol { list-style: decimal; }
	.az-template-content table { width: 100%; border-collapse: collapse; margin-bottom: 14px; }
	.az-template-content td, .az-template-content th {
		padding: 8px 10px;
		border: 1px solid var(--az-template-line);
	}

	.az-template-articleimage { max-width: 900px; margin: 0 auto 20px; }
	.az-template-articleimage img { width: 100%; border-radius: var(--az-template-radius); }

	/* ---- Danh sach tin ---- */
	.az-template-news {
		display: grid;
		grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
		gap: 22px;
		margin-bottom: 30px;
	}

	.az-template-newsitem {
		background: #fff;
		border: 1px solid var(--az-template-line);
		border-radius: var(--az-template-radius);
		overflow: hidden;
		transition: border-color .2s, box-shadow .2s;
	}

	.az-template-newsitem:hover {
		border-color: var(--az-template-brand);
		box-shadow: 0 3px 12px rgba(0, 0, 0, .1);
	}

	.az-template-newsimage {
		display: block;
		aspect-ratio: 16 / 10;
		background: var(--az-template-bg-soft);
		overflow: hidden;
	}

	.az-template-newsimage img { width: 100%; height: 100%; object-fit: cover; }
	.az-template-newsbody { padding: 14px 16px 18px; }
	.az-template-newsbody h3 { font-size: 16px; line-height: 1.4; }
	.az-template-newsbody h3 a:hover { color: var(--az-template-brand); }

	.az-template-newsbody p {
		margin: 8px 0 12px;
		font-size: 14px;
		color: var(--az-template-text-soft);
	}

	.az-template-newsmore { font-size: 14px; color: var(--az-template-brand); font-weight: 500; }

	/* ---- Dai ly ---- */
	/* O tim kiem cua trang dai ly va trang ket qua tim kiem giong het nhau ->
	   dung chung rule, khong nhan ban them mot bo thu ba. */
	.az-template-searchpage,
	.az-template-dealersearch {
		position: relative;
		max-width: 420px;
		margin: 0 auto 16px;
	}

	.az-template-searchpage input[type="text"],
	.az-template-dealersearch input[type="text"] {
		width: 100%;
		height: 40px;
		padding: 0 40px 0 16px;
		font-family: inherit;
		font-size: 14px;
		background: #fff;
		border: 1px solid var(--az-template-brand);
		border-radius: 20px;
	}

	.az-template-searchpage i,
	.az-template-dealersearch i {
		position: absolute;
		right: 16px;
		top: 50%;
		transform: translateY(-50%);
		color: var(--az-template-brand);
	}

	.az-template-dealercount {
		margin-bottom: 18px;
		text-align: center;
		color: var(--az-template-text-soft);
		font-size: 14px;
	}

	.az-template-dealer {
		display: grid;
		grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
		gap: 16px;
	}

	.az-template-dealeritem {
		display: flex;
		gap: 14px;
		padding: 16px;
		background: #fff;
		border: 1px solid var(--az-template-line);
		border-radius: var(--az-template-radius);
	}

	.az-template-dealeritem.hide { display: none; }
	.az-template-dealerlogo { flex: 0 0 64px; }
	.az-template-dealerlogo img { max-width: 64px; max-height: 64px; }
	.az-template-dealerinfo { flex: 1 1 auto; min-width: 0; }
	.az-template-dealerinfo h3 { font-size: 16px; color: var(--az-template-brand-dark); }
	.az-template-dealerinfo > div { margin-bottom: 5px; font-size: 14px; }
	.az-template-dealerinfo i { width: 18px; color: var(--az-template-brand); }

	.az-template-dealermap {
		display: inline-block;
		margin-top: 6px;
		font-size: 13px;
		font-weight: 500;
		color: var(--az-template-brand);
	}

	/* ---- Phan trang ---- */
	.az-template-paging {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		gap: 6px;
		margin-top: 28px;
	}

	.az-template-paging a {
		min-width: 38px;
		padding: 8px 10px;
		text-align: center;
		background: #fff;
		border: 1px solid var(--az-template-line);
		border-radius: 4px;
	}

	.az-template-paging a.on,
	.az-template-paging a:hover {
		background: var(--az-template-brand);
		border-color: var(--az-template-brand);
		color: #fff;
	}

	/* ---- Anh bang dau trang nhom san pham ---- */
	.az-template-groupbanner {
		position: relative;
		width: 100vw;
		margin-left: calc(50% - 50vw);
		margin-right: calc(50% - 50vw);
		margin-top: calc(var(--az-template-header-h) * -1);
		margin-bottom: 26px;
		overflow: hidden;
		background: #111;
	}

	/* padding-top day phan anh nhin thay xuong duoi header trong suot; nen toi cua
	   khoi cha lo ra sau header. Truoc day rule nay bi tach lam hai khoi trung ten
	   selector — da gop lam mot. */
	/* KHONG khoa ti le: de anh hien dung ti le goc nhu ban dang chay */
	.az-template-groupbanner img {
		width: 100%;
		height: auto;
		display: block;
		padding-top: var(--az-template-header-h);
	}

	/* Chi doc bang trinh doc man hinh — van co trong ma nguon de cong cu tim kiem
	   thay <h1>, nhung khong hien vi ten nhom da nung san trong anh bang. */
	.az-template-sronly {
		position: absolute;
		width: 1px;
		height: 1px;
		margin: -1px;
		padding: 0;
		overflow: hidden;
		clip: rect(0, 0, 0, 0);
		white-space: nowrap;
		border: 0;
	}

	/* ---- Trang ke chuyen: noi dung tren anh nen toi mau ---- */
	.az-template-story {
		position: relative;
		/* Tran vien: keo ra het be ngang man hinh du dang nam trong khung 1200px.
		   50% la nua chieu rong khung cha, 50vw la nua chieu rong man hinh. */
		width: 100vw;
		margin-left: calc(50% - 50vw);
		margin-right: calc(50% - 50vw);
		/* Keo len duoi header de header trong suot co anh ma phu len.
		   Bu lai bang padding-top nen chu khong bi header che. */
		margin-top: calc(var(--az-template-header-h) * -1);
		/* Dem tren duoi chuyen xuong TUNG MAN (.az-template-storyslide), vi moi man
		   nay chiem tron mot khung nhin va tu can giua noi dung. Giu dem ngang. */
		padding: 0 6vw;
		overflow: hidden;
		/* Anh nen dat NGAY TAI KHOI nay, KHONG dat len the <body>: moi trang tu lo
		   trang minh, sua trang nay khong the lam hong trang khac.
		   Tach RIENG tung khai bao, KHONG viet gop: mau nen doc lap voi anh, anh
		   404 thi van con nen toi va chu van doc duoc.
		   BAT BUOC co background-attachment: fixed.
		     Khoi nay cao gan NAM man hinh (moi muc mot man). Khong co fixed thi
		     'cover' tinh theo chieu cao CA KHOI -> anh bi keo gian gap may lan,
		     moi man chi thay mot mau toi (ca that 13/08).
		     Co fixed thi anh phu dung mot man hinh va dung yen khi cuon - giong
		     ban dang chay. */
		background-color: var(--az-template-dark);
		background-image: url("images/bg-intro.jpg");
		background-repeat: no-repeat;
		background-position: center center;
		background-size: cover;
		background-attachment: fixed;
		color: #e8e8e8;
	}

	/* The <img> trong noi dung khong dung nua - anh nen da la nen cua khoi.
	   HCL.37 go han khoi CSDL; luat nay la chot chan phong khi chua chay. */
	.az-template-storybg { display: none; }

	.az-template-storybody {
		position: relative;
		max-width: var(--az-template-story-w);
		margin: 0 auto;
	}

	/* Chep .slide-text h3 ben ban dang chay: 40px / 55px, viet hoa, gian chu
	   0.2em, to bang dai chuyen sac, cach doan duoi 50px. */
	.az-template-storybody h2 {
		margin: 0 0 50px;
		font-size: 40px;
		line-height: 55px;
		font-weight: 700;
		text-align: center;
		text-transform: uppercase;
		letter-spacing: 0.2em;
		background: linear-gradient(to right, var(--az-template-brand-grad) 0%, var(--az-template-brand-dark) 100%);
		color: transparent;
		-webkit-background-clip: text;
		background-clip: text;
		-webkit-text-fill-color: transparent;
	}

	.az-template-storybody h2:first-child { margin-top: 0; }

	.az-template-storybody p {
		margin: 0 0 15px;
		font-size: 16px;
		line-height: 30px;
		text-align: justify;
		color: #fff;
	}

	.az-template-storybody ul {
		margin: 0 0 15px;
		padding-left: 24px;
		list-style: disc;
	}

	.az-template-storybody li { margin-bottom: 7px; line-height: 1.75; }
	.az-template-storybody strong,
	.az-template-storybody b { color: #fff; }

	/* ---- Trang lien he ----
	   Ten lop rieng: .az-template-contact da bi dung cho nhan gia "Lien he" o
	   the san pham, khong dung lai de tranh dinh nhau. */
	.az-template-contactbox {
		display: grid;
		grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
		gap: var(--az-template-gap);
		margin-bottom: 30px;
	}

	.az-template-contactrow {
		display: flex;
		align-items: flex-start;
		gap: 12px;
		padding: 18px;
		border: 1px solid var(--az-template-line);
		border-radius: var(--az-template-radius);
		background: var(--az-template-bg-dot);
	}

	.az-template-contactrow i {
		flex: 0 0 auto;
		margin-top: 3px;
		font-size: 18px;
		color: var(--az-template-brand);
	}

	.az-template-contactrow b {
		display: block;
		margin-bottom: 3px;
		font-size: 13px;
		font-weight: 600;
		color: var(--az-template-text-soft);
		text-transform: uppercase;
		letter-spacing: .4px;
	}

	.az-template-contactrow span { font-size: 15px; word-break: break-word; }

	/* ==================== DIEN THOAI / MAY TINH BANG ==================== */
	@media (max-width: 1024px) {
		:root { --az-template-header-h: 62px; }

		.az-template-logo { font-size: 16px; }
		.az-template-logo img { max-height: 42px; }

		.az-template-infoproduct { grid-template-columns: 1fr; gap: 20px; }
		/* Dien thoai: nhieu may khong ho tro fixed va rat ton tai nguyen.
		   Tra ve nen cuon theo trang, va gan anh vao dung mot man hinh de khong
		   bi keo gian nhu trinh bay o tren. */
		.az-template-story {
			padding: calc(var(--az-template-header-h) + 30px) 5vw 46px;
			background-attachment: scroll;
			background-size: auto 100vh;
		}
		.az-template-storybody h2 { font-size: 21px; letter-spacing: 2px; margin: 34px 0 16px; }
		.az-template-storybody p { font-size: 15px; text-align: left; }
		.az-template-header .az-template-menu > ul > li > a { padding: 20px 8px; font-size: 13px; }
		.az-template-footer { flex-direction: column; }
		.az-template-footermain { gap: 24px; padding: 26px var(--az-template-gap) 22px; }
		.az-template-footerbrand, .az-template-footercontact { flex: 1 1 100%; }
		.az-template-footerslogan {
			flex: 1 1 100%;
			padding: 22px var(--az-template-gap);
			clip-path: none;
		}

		/* Dien thoai: chi con logo va nut mo menu, o trong khong can gian ra */
		.az-template-headerspace { display: none; }
		.az-template-headerinner { justify-content: space-between; }

		.az-template-navfooter { left: 0; right: 0; bottom: 0; }
		.az-template-navfooter ul { flex-direction: row; }
		.az-template-navfooter li { flex: 1 1 0; }

		.az-template-navfooter a {
			justify-content: center;
			border-radius: 0;
			padding: 11px 4px;
			box-shadow: none;
			border-right: 1px solid rgba(255, 255, 255, .2);
		}

		.az-template-navfooter li:last-child a { border-right: 0; }

		body { padding-bottom: 44px; }
	}

	@media (max-width: 480px) {
		body { font-size: 14px; }
		h1 { font-size: 21px; }
		h2 { font-size: 18px; }
	}

	/* ==================== BO SUU TAP: BANG ANH LON THEO NHOM ====================
	   Ban dang chay hien khoi nay la mot bang anh lon truot ngang, moi nhom mot
	   anh (ProductGroup.Image2). Chu ten nhom nam SAN TRONG anh nen khong phu
	   chu len - phu se thanh chu doi. */
	/* Tam anh bang cua 8 nhom co ti le KHAC nhau nen bang truot nhay chieu cao.
	   Khoa mot ti le duy nhat cho moi o; JS do anh cao nhat roi ghi de bien nay.
	   Dung contain chu khong cover: chu nam san trong anh, cover se cat mat chu.
	   Nen den nen dai thua hai ben lien voi anh, khong lo vien. */
	/* Khung co dinh ti le 2/1 - dung theo ban goc: [ux_image height="50%"].
	   Cac o chong len nhau trong khung nay nen chieu cao KHONG BAO GIO nhay, va
	   truoc khi JS chay thi trang cung khong bi keo dai ra roi thut vao. */
	.az-template-showcase {
		position: relative;
		aspect-ratio: 2;
		margin-bottom: 30px;
		background: #000;
		border-radius: var(--az-template-radius);
		overflow: hidden;
	}

	.az-template-showcase > div {
		position: absolute;
		inset: 0;
		opacity: 0;
		transition: opacity .6s ease;
	}

	/* Truoc khi JS chay: hien o dau tien. Sau khi chay: theo lop 'on'.
	   Hai luat cung do uu tien nen luat dat SAU thang - dung thu tu nay. */
	.az-template-showcase > div:first-child { opacity: 1; }
	.az-template-showcaseready > div { opacity: 0; }
	.az-template-showcaseready > div.on { opacity: 1; }

	.az-template-showcaseitem {
		display: block;
		width: 100%;
		height: 100%;
	}

	/* Dung contain chu khong cover: chu nam san trong anh, cover se cat mat chu.
	   Nen den nen dai thua hai ben lien voi anh, khong lo vien. */
	.az-template-showcaseitem img {
		width: 100%;
		height: 100%;
		display: block;
		object-fit: contain;
	}

	/* Tieu de kieu ban dang chay: can giua, mau thuong hieu, gian chu rong,
	   khong co gach chan. Dat thanh bien the rieng de cac khoi khac giu nguyen. */
	/* Chep dung bo thuoc tinh cua .the-title h2 ben ban dang chay: chu vien
	   theo dai chuyen sac cam - do. Dong font-family "UTM" ben do bi gach trong
	   DevTools (tep font khong tai duoc) nen khong bung sang, giu Montserrat.
	   Chu duoc to bang anh nen cat theo hinh chu, nen phai de mau chu trong suot
	   ca o color lan -webkit-text-fill-color. */
	.az-template-title.az-template-titlecenter {
		margin: 42px 0 26px;
		padding-bottom: 0;
		font-size: 40px;
		line-height: 5.5rem;
		text-align: center;
		letter-spacing: 0.2em;
		text-transform: uppercase;
		background: linear-gradient(to right, var(--az-template-brand-grad) 0%, var(--az-template-brand-dark) 100%);
		color: transparent;
		-webkit-background-clip: text;
		background-clip: text;
		-webkit-text-fill-color: transparent;
		border-bottom: 0;
	}

	@media (max-width: 640px) {
		.az-template-title.az-template-titlecenter {
			margin: 28px 0 18px;
			font-size: 22px;
			line-height: 2.4rem;
			letter-spacing: 0.12em;
		}
	}

	/* ==================== KHOI GIOI THIEU TRAN VIEN TRANG CHU ====================
	   Ban dang chay dat khoi nay tran het be ngang, anh nen toi, tieu de can giua
	   chu trang xen cam, noi dung mot cot ben trai can deu hai bien.
	   Dung ten rieng (brandstory) chu KHONG dung lai .az-template-story: lop do
	   dang duoc :has() dung de lam trong suot header, ap vao trang chu se doi mau
	   thanh menu ngoai y muon. */
	.az-template-brandstory {
		position: relative;
		width: 100vw;
		margin: 44px 0 44px calc(50% - 50vw);
		margin-right: calc(50% - 50vw);
		padding: 50px var(--az-template-gap);
		background-color: var(--az-template-dark);
		background-position: center;
		background-size: cover;
		background-repeat: no-repeat;
		color: #fff;
	}

	.az-template-brandstory::before {
		content: '';
		position: absolute;
		inset: 0;
		background: rgba(0, 0, 0, .75);
	}

	.az-template-brandstory > * { position: relative; }

	/* Ban goc chen [gap height="100px" height__sm="30px"] giua tieu de va noi
	   dung - do la thu quyet dinh chieu cao cua ca khoi. */
	/* Chep dung .service-title h2 ben ban dang chay: ca dong tieu de to bang dai
	   chuyen sac cam, rieng phan trong the <span> doi lai thanh trang.
	   Vi the cha da dat -webkit-text-fill-color: transparent nen the con phai ghi
	   de bang chinh cach do chu khong the dat color: #fff la xong. */
	.az-template-brandstorytitle {
		margin: 0 0 100px;
		font-size: 40px;
		line-height: 5.5rem;
		text-align: center;
		letter-spacing: 0.2em;
		text-transform: uppercase;
		background: linear-gradient(to right, var(--az-template-brand-grad) 0%, var(--az-template-brand-dark) 100%);
		color: transparent;
		-webkit-background-clip: text;
		background-clip: text;
		-webkit-text-fill-color: transparent;
	}

	.az-template-brandstorytitle span {
		background: linear-gradient(to right, #ffffff 0%, #ffffff 100%);
		color: transparent;
		-webkit-background-clip: text;
		background-clip: text;
		-webkit-text-fill-color: transparent;
	}

	.az-template-brandstorybox {
		max-width: var(--az-template-width);
		margin: 0 auto;
	}

	/* Ban goc chen mot the gap sau nut Xem them: 0 tren dien thoai, 200px tu
	   550px tro len. Day la thu tao ra khoang thoang lon o day khoi. */
	@media (min-width: 550px) {
		.az-template-brandstorybox { padding-bottom: 200px; }
	}

	/* .service-content ben ban goc: width 42%, chu trang, can deu, line-height 24px */
	.az-template-brandstorybox p {
		width: 42%;
		margin: 0 0 16px;
		text-align: justify;
		line-height: 24px;
		color: #fff;
	}

	.az-template-brandstorymore {
		display: inline-block;
		margin-top: 6px;
		font-weight: 600;
		color: #fff;
	}

	.az-template-brandstorymore i { margin-left: 6px; }
	.az-template-brandstorymore:hover { color: var(--az-template-brand); }

	@media (max-width: 768px) {
		.az-template-brandstory { padding: 36px var(--az-template-gap) 42px; }
		.az-template-brandstorytitle {
			font-size: 21px;
			line-height: 2.5rem;
			margin-bottom: 30px;
		}
		.az-template-brandstorybox p { width: 100%; font-size: 14px; line-height: 25px; }
	}

	/* ==================== TRANG KE CHUYEN: CUON TUNG MAN ====================
	   Ban goc chia noi dung thanh nam muc, moi muc chiem tron mot man hinh, nen
	   dung chung mot anh, ben trai co cot cham dieu huong doc.
	   Cac luat duoi day CHI an khi script.js da boc xong tung man va gan lop
	   'az-template-storyready' - JS hong thi trang van doc duoc nhu cu. */
	.az-template-storyready {
		/* Bo overflow hidden: anh nen dung sticky, ma sticky khong chay duoc khi
		   to tien co overflow hidden. Than trang da co overflow-x hidden nen
		   khong sinh thanh cuon ngang. */
		overflow: visible;
	}

	/* Anh nen dung yen trong luc cuon qua nam man. margin am de no khong chiem
	   cho trong dong chay, noi dung chong len tren. */
	/* Can TREN chu khong can giua: khoi da co dem tren 250px theo ban goc, neu
	   con can giua trong khung cao 100vh nua thi noi dung bi day xuong gan day.
	   Voi can tren, tieu de roi dung moc 250px tinh tu dinh trang nhu ban goc. */
	/* ---- TUNG MUC KE CHUYEN ----
	   Ban dang chay: hang chua noi dung moi muc do duoc 1270 x 530, can giua ca
	   ngang lan doc (id row-114038796, lop row align-middle align-center).
	   Ta dung hai lop:
	     . MUC = tron mot khung nhin -> lam khoang cuon
	     . VUNG CHU = khuon 1270 x 530 can giua man
	   scroll-snap-align: center -> vung chu dung ngay tam man, cuon mot nhip la
	   sang bai ke tiep.
	   Chieu cao dung min-height chu KHONG co dinh: muc nao chu dai hon thi tu
	   gian ra. Ban goc dat height co dinh kem overflow: hidden nen muc 2019 cua
	   ho bi tran ra ngoai khung. */
	.az-template-storyslide {
		display: flex;
		flex-direction: column;
		/* 'safe center': can giua khi con cho, nhung noi dung CAO HON khung thi
		   tu doi ve can DAU. Neu de 'center' tran thi flex day ra CA HAI dau, phan
		   tren chui len duoi header trong suot va doc de len anh nen.
		   Dong flex-start dat truoc lam duong lui cho trinh duyet cu. */
		justify-content: flex-start;
		justify-content: safe center;
		min-height: 100vh;
		/* Dem tren chua cho header, khong thi chu chui xuong duoi thanh menu */
		padding: calc(var(--az-template-header-h) + 20px) 0 40px;
		/* Dinh vao DAU muc chu khong giua: moi nhip cuon di tron mot bai */
		scroll-snap-align: start;
		scroll-snap-stop: always;
	}

	/* Khuon cao toi thieu cua vung chu - giu khoang cach giua cac muc deu nhau */
	.az-template-storyslide > * { flex: 0 0 auto; }
	.az-template-storyslide h2 { margin-top: 0; }

	/* Muc gom nhieu dong ngan (danh sach moc thoi gian) chia HAI COT nhu ban goc.
	   Dung column-count chu khong grid: column-count dien theo COT - het cot trai
	   moi sang cot phai, dung thu tu ban goc (trai: moc dai ly, phai: moc san
	   pham). Grid se dien theo HANG, xen ke hai nhom vao nhau. */
	.az-template-storycols {
		column-count: 2;
		column-gap: 60px;
	}

	/* Doan khong duoc cat doi giua hai cot */
	.az-template-storycols p {
		break-inside: avoid;
		-webkit-column-break-inside: avoid;
		text-align: left;
	}

	/* Dat sat le trai cua cot chu, khong phai sat mep man hinh: man rong thi
	   phai dua tay ra rat xa moi bam duoc. Man hep thi lui ve 24px. */
	.az-template-storynav {
		position: fixed;
		left: max(24px, calc(50% - var(--az-template-story-w) / 2 - 58px));
		top: 50%;
		transform: translateY(-50%);
		z-index: 5;
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 14px;
	}

	/* Chep .slick-dots ben ban dang chay: cham 12px tron mau do, cham dang xem
	   dai 60px mau cam (ben do dat width 60px roi xoay ca cot 90 do). */
	.az-template-storynav a {
		display: block;
		width: 12px;
		height: 12px;
		border-radius: 99px;
		background: var(--az-template-brand-dark);
		transition: height .25s ease, background-color .25s ease;
	}

	.az-template-storynav a:hover { background: var(--az-template-brand); }

	.az-template-storynav a.on {
		height: 60px;
		background: var(--az-template-brand);
	}

	@media (max-width: 900px) {
		.az-template-storynav { display: none; }
		/* Dien thoai: khong ep tron mot man va khong bat dinh - man hep ma ep
		   chieu cao thi chu bi don lai, doc met. */
		.az-template-storyslide {
			min-height: 0;
			padding: 26px 0;
			justify-content: flex-start;
			scroll-snap-align: none;
			scroll-snap-stop: normal;
		}

		/* Man hep: tra ve mot cot cho de doc */
		.az-template-storycols { column-count: 1; }
	}

	/* ==================== TIN TUC TRANG CHU ====================
	   Ban goc: mot cot, moi bai mot hang, anh va chu doi ben so le.
	   Chi cham toi trang chu (boc trong .az-template-newsblock) - luoi tin o
	   trang Tin tuc va trang Tim kiem giu nguyen. */
	.az-template-newsblock { padding: 30px 0; }

	.az-template-newsblock .az-template-news {
		display: block;
		gap: 0;
	}

	.az-template-newsblock .az-template-newsitem {
		display: flex;
		align-items: center;
		padding: 0 0 15px;
		background: transparent;
		border: 0;
		border-radius: 0;
		box-shadow: none;
		overflow: visible;
	}

	.az-template-newsblock .az-template-newsimage {
		flex: 1 1 50%;
		display: block;
		height: 240px;
		aspect-ratio: auto;
	}

	.az-template-newsblock .az-template-newsimage img {
		width: 100%;
		height: 100%;
		object-fit: cover;
	}

	.az-template-newsblock .az-template-newsbody {
		flex: 1 1 50%;
		padding: 15px 30px;
	}

	/* Tieu de bai: cung dai chuyen sac nhu cac tieu de khac, cat con 2 dong */
	.az-template-newsblock .az-template-newsbody h3 {
		margin: 0 0 42px;
		font-size: 24px;
		line-height: 40px;
		letter-spacing: 0.1em;
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 2;
		overflow: hidden;
		background: linear-gradient(to right, var(--az-template-brand-grad) 0%, var(--az-template-brand-dark) 100%);
		color: transparent;
		-webkit-background-clip: text;
		background-clip: text;
		-webkit-text-fill-color: transparent;
	}

	.az-template-newsblock .az-template-newsbody h3 a { color: inherit; }

	.az-template-newsblock .az-template-newsbody p {
		margin: 0;
		font-size: 16px;
		line-height: 20px;
		letter-spacing: 0.1em;
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 3;
		overflow: hidden;
	}

	/* Bai chan doi ben: anh sang phai, chu sang trai */
	.az-template-newsblock .az-template-newsitem:nth-child(even) .az-template-newsimage { order: 2; }
	.az-template-newsblock .az-template-newsitem:nth-child(even) .az-template-newsbody { order: 1; }

	/* ==================== CHAN TRANG ==================== */
	/* Anh nen cat cheo: nua trai nen trang, nua phai nen cam. Vi vay KHONG dat
	   mau chu chung cho ca chan trang - menu va khoi lien he giu mau chu thuong,
	   chi cot ba (nam tren nen cam) moi doi sang trang. Dat #fff o day la hai cot
	   trai thanh chu trang tren nen trang, mat hut. */
	.az-template-footer {
		padding: 30px 0;
		background: #fff url("images/footer.png") no-repeat 65% 50%;
		background-size: cover;
	}

	/* Ban goc dung row-full-width: hang nay TRAI HET be ngang chu khong bo trong
	   khung noi dung. Nho vay cot ba roi tron vao vung cam cua anh nen - bo trong
	   khung 1270 thi cot ba bat dau o 62% man hinh, tuc van tren nen trang. */
	.az-template-footerrow {
		display: flex;
		width: 100%;
		max-width: none;
		margin: 0;
	}

	.az-template-footercol { padding: 0 30px; }

	/* Ti le 5 / 4 / 3 dung nhu ban goc */
	.az-template-footercol1 { flex: 5 1 0; }
	.az-template-footercol2 { flex: 4 1 0; }
	.az-template-footercol3 { flex: 3 1 0; }

	.az-template-footerlogo {
		display: block;
		width: 10%;
		min-width: 70px;
		margin-bottom: 16px;
	}

	.az-template-footerlogo img { width: 100%; height: auto; display: block; }

	.az-template-footermenu a {
		display: inline-block;
		margin: 0 18px 8px 0;
		font-size: 13px;
		letter-spacing: 1px;
		font-weight: 700;
	}

	.az-template-footermenu a:hover { color: var(--az-template-brand); }

	.az-template-footercol2 p {
		margin: 0 0 10px;
		font-size: 13px;
		line-height: 20px;
		letter-spacing: 1px;
		font-weight: 700;
	}

	.az-template-footercol2 p a:hover { color: var(--az-template-brand); }
	.az-template-footercol2 i { margin-right: 6px; }

	.az-template-footercol3 {
		font-size: 13px;
		line-height: 20px;
		letter-spacing: 1px;
		font-weight: 700;
		color: #fff;
	}

	.az-template-footercol3 i { font-weight: 700; }

	@media (max-width: 768px) {
		.az-template-newsblock .az-template-newsitem { display: block; }
		.az-template-newsblock .az-template-newsimage { height: 200px; }
		.az-template-newsblock .az-template-newsbody { padding: 12px 0 0; }
		.az-template-newsblock .az-template-newsbody h3 {
			margin-bottom: 0;
			font-size: 14px;
			line-height: 25px;
		}
		.az-template-newsblock .az-template-newsbody p { font-size: 12px; }

		/* Ban goc doi nen anh thanh dai mau tren man hep */
		.az-template-footer {
			background: linear-gradient(to right, var(--az-template-brand-grad) 0%, var(--az-template-brand-dark) 100%);
		}
		.az-template-footerrow { display: block; }
		.az-template-footercol { padding: 0; }
		.az-template-footerlogo { width: 30%; }
		.az-template-footermenu {
			margin-bottom: 20px;
			padding-bottom: 15px;
			border-bottom: 1px solid #fff;
		}
		/* Nen da thanh dai cam nen ca chan trang doi sang chu trang */
		.az-template-footermenu a,
		.az-template-footercol2 p { color: #fff; }
	}

	/* ==================== THANH CUON ====================
	   Chep dung tu ban dang chay: ray xam, con truot mau thuong hieu bo goc,
	   vien cung mau ray de tao khoang thut. Di chuot vao thi dam lai. */
	body::-webkit-scrollbar { width: 10px; }

	body::-webkit-scrollbar-track { background: #ccc; }

	body::-webkit-scrollbar-thumb {
		background-color: var(--az-template-brand);
		border-radius: 5px;
		border: 2px solid #ccc;
	}

	body::-webkit-scrollbar-thumb:hover { background-color: var(--az-template-brand-dark); }

	/* ==================== ANH NEN THEO TRANG ====================
	   Nguyen tac: the <body> chi giu MOT anh nen chung cho ca site (khai o luat
	   body dau tep). Trang nao can nen rieng thi dat ngay TAI KHOI cua trang do
	   - vd .az-template-story cua trang Gioi thieu. Nho vay sua mot trang khong
	   the lam hong trang khac. */

	/* ==================== TRANG SAN PHAM - NHANH 1 (/san-pham/) ====================
	   Ban goc: anh bang tran vien -> doan mo ta can giua be ngang mot nua ->
	   cac anh nhom XEP DOC moi anh mot lien ket -> tieu de dan sang trang danh
	   sach. Khong co luoi the san pham o nhanh nay. */
	.az-template-productintro {
		max-width: 50%;
		margin: 0 auto;
		padding: 30px;
		text-align: center;
	}

	/* .service-product-desc p ben ban goc */
	.az-template-productintro p {
		margin: 0;
		font-size: 14px;
		line-height: 24px;
		letter-spacing: 2px;
	}

	.az-template-grouplist {
		padding: 30px 0;
	}

	.az-template-groupimage {
		display: block;
		width: 100%;
	}

	.az-template-groupimage img {
		width: 100%;
		height: auto;
		display: block;
	}

	/* Tieu de dan sang trang khac: giu dai chuyen sac, them tro chuot ban */
	.az-template-titlelink { margin: 30px 0; }

	/* Chep dung .the-title h2 ben ban dang chay */
	.az-template-titlelink h2 {
		margin: 0;
		font-size: 40px;
		line-height: 5.5rem;
		text-align: center;
		letter-spacing: 0.2em;
		text-transform: uppercase;
		background: linear-gradient(to right, var(--az-template-brand-grad) 0%, var(--az-template-brand-dark) 100%);
		color: transparent;
		-webkit-background-clip: text;
		background-clip: text;
		-webkit-text-fill-color: transparent;
	}

	@media (max-width: 768px) {
		.az-template-titlelink h2 { font-size: 21px; line-height: 2.5rem; }
	}

	.az-template-titlelink h2 a { color: inherit; }

	@media (max-width: 768px) {
		.az-template-productintro { max-width: 100%; padding: 20px 0; }
		.az-template-grouplist { padding: 16px 0; }
	}

	/* ==================== TRANG SAN PHAM - NHANH 2 va 3 ====================
	   Ban goc: section dem 50px tren duoi; luoi ba cot (2 cot man vua, 1 cot man
	   hep); anh ti le 16/9 cat phu; ten can giua; KHONG hien gia. */
	.az-template-groupsection { padding: 50px 0; }

	.az-template-productgrid {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		gap: 20px;
	}

	.az-template-productgrid .az-template-item {
		background: transparent;
		border: 0;
		border-radius: 0;
		box-shadow: none;
		padding: 0;
	}

	.az-template-productgrid .az-template-image {
		position: relative;
		aspect-ratio: 16 / 9;
		overflow: hidden;
	}

	.az-template-productgrid .az-template-image img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		display: block;
		transition: transform .4s ease;
	}

	.az-template-productgrid .az-template-item:hover .az-template-image img { transform: scale(1.06); }

	.az-template-productgrid .az-template-name {
		padding: 12px 6px 0;
		text-align: center;
		font-weight: 600;
	}

	/* ---- Chi tiet san pham ---- */
	.az-template-infoproduct { padding: 30px 0; }

	/* Ban goc chia 7/5 */
	.az-template-infoproduct .az-template-infoimage { flex: 7 1 0; }
	.az-template-infoproduct .az-template-infosummary { flex: 5 1 0; }

	.az-template-breadcrumb {
		margin-bottom: 10px;
		font-size: 13px;
		letter-spacing: 1px;
		text-transform: uppercase;
	}

	.az-template-shortdesc { margin: 14px 0 22px; }

	/* Tab "Mo ta": ban goc ke mot duong ngang duoi ten tab */
	.az-template-tabs { margin-top: 30px; }

	.az-template-tabhead {
		padding-bottom: 10px;
		margin-bottom: 22px;
		font-size: 15px;
		font-weight: 700;
		letter-spacing: 1px;
		text-transform: uppercase;
		color: var(--az-template-brand);
		border-bottom: 1px solid var(--az-template-line);
	}

	.az-template-relatedtitle { margin-top: 40px; }

	@media (max-width: 900px) {
		.az-template-productgrid { grid-template-columns: repeat(2, 1fr); }
	}

	@media (max-width: 640px) {
		.az-template-productgrid { grid-template-columns: 1fr; }
		.az-template-groupsection { padding: 24px 0; }
	}

	/* Chep .tab-collection h4 ben ban dang chay: giong .the-title h2 nhung
	   KHONG viet hoa. */
	.az-template-collectiontitle h2 {
		margin: 0 0 26px;
		font-size: 40px;
		line-height: 5.5rem;
		text-align: center;
		letter-spacing: 0.2em;
		background: linear-gradient(to right, var(--az-template-brand-grad) 0%, var(--az-template-brand-dark) 100%);
		color: transparent;
		-webkit-background-clip: text;
		background-clip: text;
		-webkit-text-fill-color: transparent;
	}

	@media (max-width: 768px) {
		.az-template-collectiontitle h2 { font-size: 21px; line-height: 2.5rem; margin-bottom: 18px; }
	}

	/* ==================== TRANG CHI TIET BAI VIET ====================
	   Ban goc: .page-title.blog-featured-title cao toi thieu 300px, anh bia phu
	   kin, lop den 50% de len tren, tieu de trang can giua co duong ke nho ben
	   duoi. Duoi la .row-large.row-divided chia 9/3 co vach ngan giua hai cot. */
	.az-template-postcover {
		position: relative;
		width: 100vw;
		margin-left: calc(50% - 50vw);
		margin-right: calc(50% - 50vw);
		margin-top: calc(var(--az-template-header-h) * -1);
		display: flex;
		align-items: center;
		justify-content: center;
		min-height: 300px;
		padding: calc(var(--az-template-header-h) + 30px) 6vw 30px;
		background-color: var(--az-template-dark);
		background-position: center top;
		background-size: cover;
		background-repeat: no-repeat;
	}

	.az-template-postcover::before {
		content: '';
		position: absolute;
		inset: 0;
		background: rgba(0, 0, 0, .5);
	}

	.az-template-postcoverinner {
		position: relative;
		text-align: center;
	}

	.az-template-posttitle {
		margin: 0;
		font-size: 30px;
		line-height: 1.35;
		text-transform: uppercase;
		color: #fff;
	}

	/* .entry-divider is-divider small ben ban goc */
	.az-template-postdivider {
		display: block;
		width: 50px;
		height: 2px;
		margin: 16px auto 0;
		background: rgba(255, 255, 255, .5);
	}

	.az-template-postwrap {
		display: flex;
		gap: 30px;
		padding: 40px 15px;
	}

	/* Ti le 9/3 va vach ngan giua hai cot dung nhu row-divided */
	.az-template-postmain { flex: 9 1 0; min-width: 0; }

	.az-template-postside {
		flex: 3 1 0;
		min-width: 0;
		padding-left: 30px;
		border-left: 1px solid var(--az-template-line);
	}

	.az-template-sidehead {
		margin-bottom: 18px;
		padding-bottom: 10px;
		font-size: 15px;
		font-weight: 700;
		letter-spacing: 1px;
		text-transform: uppercase;
		color: var(--az-template-brand);
		border-bottom: 1px solid var(--az-template-line);
	}

	.az-template-sideitem {
		display: flex;
		gap: 12px;
		margin-bottom: 16px;
	}

	.az-template-sidethumb {
		flex: 0 0 84px;
		display: block;
		height: 62px;
		overflow: hidden;
		border-radius: var(--az-template-radius);
	}

	.az-template-sidethumb img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		display: block;
	}

	.az-template-sidetitle {
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 3;
		overflow: hidden;
		font-size: 13px;
		line-height: 20px;
		font-weight: 600;
	}

	.az-template-sidetitle:hover { color: var(--az-template-brand); }

	/* Anh trong than bai: khong tran ra ngoai cot */
	.az-template-postmain .az-template-content img {
		max-width: 100%;
		height: auto;
	}

	@media (max-width: 900px) {
		.az-template-postwrap { display: block; padding: 24px 15px; }
		.az-template-postside {
			margin-top: 30px;
			padding-left: 0;
			padding-top: 24px;
			border-left: 0;
			border-top: 1px solid var(--az-template-line);
		}
		.az-template-posttitle { font-size: 21px; }
	}

	/* ==================== THU VIEN ANH ====================
	   Ban goc: section dem 100px tren duoi; luoi ba cot 33.33%; anh cao 250px
	   cat phu, bo goc 15px, dem 10px; nut Xem them la dai chuyen sac cat vat
	   hai dau, nam giua duoi luoi. O loc hang xe ben do dang bi an. */
	.az-template-librarysection { padding: 100px 0; }

	/* Chep .the-title h2 ben ban dang chay */
	.az-template-librarytitle h1 {
		margin: 0;
		font-size: 40px;
		line-height: 5.5rem;
		text-align: center;
		letter-spacing: 0.2em;
		text-transform: uppercase;
		background: linear-gradient(to right, var(--az-template-brand-grad) 0%, var(--az-template-brand-dark) 100%);
		color: transparent;
		-webkit-background-clip: text;
		background-clip: text;
		-webkit-text-fill-color: transparent;
	}

	.az-template-library {
		position: relative;
		display: grid;
		grid-template-columns: repeat(3, 33.33%);
		margin-top: 30px;
		/* Nut tho xuong -80px nen chua san khoang trong o duoi luoi */
		margin-bottom: 110px;
	}

	.az-template-libraryitem {
		display: none;
		grid-column: span 1;
	}

	.az-template-libraryitem.on { display: block; }

	.az-template-libraryitem img {
		width: 100%;
		height: 250px;
		object-fit: cover;
		border-radius: 15px;
		padding: 10px;
		display: block;
	}

	/* Chep .loadMoreBtn ben ban dang chay. Luu y: nut KHONG can giua ma neo
	   ben phai (right: 30px) va tho xuong duoi luoi (bottom: -45px). */
	.az-template-librarymore {
		padding: 10px 30px 10px 30px;
		background: linear-gradient(to right, var(--az-template-brand-grad) 0%, var(--az-template-brand-dark) 100%);
		font-size: 16px;
		color: #fff;
		display: block;
		margin: auto;
		max-width: 250px;
		line-height: 30px;
		position: absolute;
		bottom: -80px;
		right: 30px;
		width: 100%;
		text-align: center;
		clip-path: polygon(22% 0, 100% 0%, 78% 100%, 0% 100%);
	}

	.az-template-librarymore:hover { color: #fff; }
	.az-template-librarymore:hover span { text-decoration: underline; }
	.az-template-librarymore.off { display: none; }

	@media (max-width: 768px) {
		.az-template-librarysection { padding: 40px 0; }
		.az-template-librarytitle h1 { font-size: 21px; line-height: 2.5rem; }
		.az-template-library { grid-template-columns: repeat(2, 50%); }
	}

	/* ==================== TRANG DAI LY ====================
	   Ban goc: section dem 100px; o tim kiem bo tron vien cam rong toi da 500px
	   nam TREN; danh sach xo xuong an san, nen chuyen sac, cao 300px cuon duoc;
	   tieu de "HE THONG Dai ly" nam DUOI o tim kiem. */
	.az-template-dealersection {
		padding: 100px 0;
		min-height: 75vh;
	}

	.az-template-dealersearch {
		max-width: 500px;
		margin: 0 auto 30px;
	}

	/* Chep #myInput ben ban dang chay, ke ca bieu tuong kinh lup ben phai. */
	.az-template-dealersearch input[type="text"] {
		width: 100%;
		padding: 15px 20px;
		margin-bottom: 0;
		font-size: 16px;
		text-align: center;
		color: var(--az-template-text);
		background-color: #fff;
		background-image: url("images/search.png");
		background-position: right;
		background-repeat: no-repeat;
		background-size: contain;
		border: 1px solid #f37321;
		border-radius: 99px;
	}

	.az-template-dealerlist {
		display: none;
		list-style-type: none;
		padding: 0;
		margin: 15px 0;
		background: linear-gradient(to right, var(--az-template-brand-grad) 0%, var(--az-template-brand-dark) 100%);
		border-radius: 5px;
		height: 300px;
		overflow-y: scroll;
	}

	.az-template-dealerlist.on { display: block; }

	.az-template-dealerlist li a {
		display: block;
		margin-top: -1px;
		padding: 12px 16px;
		font-size: 18px;
		text-decoration: none;
		color: #fff;
	}

	.az-template-dealerlist li a:hover { background: rgba(0, 0, 0, .12); }
	.az-template-dealerlist li.off { display: none; }

	/* Thanh cuon trong danh sach - dung nhu thanh cuon toan trang */
	.az-template-dealerlist::-webkit-scrollbar { width: 10px; }
	.az-template-dealerlist::-webkit-scrollbar-track { background: #ccc; }

	.az-template-dealerlist::-webkit-scrollbar-thumb {
		background-color: var(--az-template-brand);
		border-radius: 5px;
		border: 2px solid #ccc;
	}

	.az-template-dealerlist::-webkit-scrollbar-thumb:hover { background-color: var(--az-template-brand-dark); }

	/* Tieu de dung .the-title h2 */
	.az-template-dealertitle h1 {
		margin: 0;
		font-size: 40px;
		line-height: 5.5rem;
		text-align: center;
		letter-spacing: 0.2em;
		text-transform: uppercase;
		background: linear-gradient(to right, var(--az-template-brand-grad) 0%, var(--az-template-brand-dark) 100%);
		color: transparent;
		-webkit-background-clip: text;
		background-clip: text;
		-webkit-text-fill-color: transparent;
	}

	@media (max-width: 768px) {
		.az-template-dealersection { padding: 40px 0; }
		.az-template-dealertitle h1 { font-size: 21px; line-height: 2.5rem; }
	}

	/* ==================== ANH BANG THEO THIET BI ====================
	   Chi an nhau khi CO CA HAI anh. Vung dien thoai chua co anh thi khoi may
	   tinh khong mang lop 'slidedesktop' nen van hien o moi be ngang. */
	.az-template-slidemobile { display: none; }

	@media (max-width: 768px) {
		.az-template-slidedesktop { display: none; }
		.az-template-slidemobile { display: block; }
	}

	/* Bat dinh khi cuon - CHI o trang ke chuyen va CHI tren man rong.
	   'mandatory' + scroll-snap-stop: always -> moi nhip cuon chuyen TRON MOT
	   bai, khong luot qua hai ba muc cung luc. An toan vi moi muc da dung dung
	   mot khung nhin va noi dung khong con tran (xem 'safe center' o tren).
	   scroll-padding-top chua cho header de dau bai khong bi thanh menu che. */
	@media (min-width: 901px) {
		html:has(.az-template-story) {
			scroll-snap-type: y mandatory;
			scroll-padding-top: var(--az-template-header-h);
		}
	}
}