/**
 * MOBILE — giao diện điện thoại/tablet (anh Khai giao 25/09, kim chỉ nam: FIle-Du-An/mobile_review.png).
 *
 * 🔴 File này CHỈ chứa luật cho màn ≤ 960px (và vài luật ẩn/hiện phần tử mobile-only như nút menu).
 *    Desktop KHÔNG đổi một pixel: mọi luật bố cục nằm trong @media (max-width: 960px) trở xuống.
 *    Nạp SAU tất cả CSS khác (functions.php, priority 20) để thắng cascade mà không cần !important.
 *
 * Ba quyết định lớn:
 *   1. Bài sản phẩm: sắp lại THỨ TỰ khối theo mockup bằng `display: contents` + `order` — cột chính và
 *      sidebar tan thành một cột, "Đánh giá nhanh" và "Hợp với ai" chạy lên ngay dưới nút mua.
 *      Không đổi HTML, không nhân đôi nội dung; bản sidebar của "Nên mua nếu" (trùng) thì ẩn.
 *   2. "Đánh giá chi tiết" gập còn 3 dòng + "Đọc tiếp" (checkbox CSS-only, chữ vẫn nằm trong HTML cho Google).
 *      Bài 13.500px xuống còn ~1/2 mà không mất chữ nào.
 *   3. Lưới sản phẩm: 2 thẻ/hàng ở điện thoại (anh Khai chốt), ảnh `contain` trong khung có overflow hidden.
 */

/* ------------------------------------------------------------------ */
/* Phần tử chỉ dùng cho mobile — ẩn ở desktop                          */
/* ------------------------------------------------------------------ */
.gyt-menu-toggle { position: absolute; opacity: 0; pointer-events: none; }
.gyt-menu-btn { display: none; }
.gyt-nav__extra { display: none; }
.gyt-review__toggle { position: absolute; opacity: 0; pointer-events: none; }
.gyt-review__more { display: none; }

/* ================================================================== */
/* ≤ 960px — tablet dọc + điện thoại                                   */
/* ================================================================== */
@media (max-width: 960px) {

	/* ---------------- Header: logo + nút menu, ô tìm trải hết dòng dưới ---------------- */
	.gyt-header__top {
		display: grid;
		grid-template-columns: minmax(0, 1fr) 44px;
		align-items: center;
		gap: 10px 12px;
		padding-block: 12px;
	}
	/* 🔴 Ghim HÀNG: nút ☰ đứng SAU ô tìm trong DOM, không ghim thì grid đẩy nó xuống hàng 3 một mình bên phải
	   (anh Khai bắt trên máy thật 25/09). Logo + ☰ hàng 1, ô tìm hàng 2 trải hết. */
	.gyt-logo { grid-column: 1; grid-row: 1; min-width: 0; }
	.gyt-logo__img { height: 40px; max-width: 170px; }
	.gyt-menu-btn {
		grid-column: 2; grid-row: 1;
		display: inline-flex; align-items: center; justify-content: center;
		width: 44px; height: 44px;
		border: 1px solid var(--gyt-border); border-radius: 10px;
		background: #fff; color: var(--gyt-text); cursor: pointer;
	}
	.gyt-menu-btn svg { display: block; }
	.gyt-menu-btn .gyt-menu-btn__close { display: none; }
	.gyt-menu-toggle:checked ~ .gyt-header__top .gyt-menu-btn .gyt-menu-btn__open { display: none; }
	.gyt-menu-toggle:checked ~ .gyt-header__top .gyt-menu-btn .gyt-menu-btn__close { display: block; }
	.gyt-search { grid-column: 1 / -1; grid-row: 2; order: 0; max-width: none; }
	.gyt-search__input { min-height: 46px; }
	/* Link phụ + danh mục gom vào MỘT bảng menu, mở bằng nút */
	.gyt-header__links { display: none; }
	.gyt-nav { display: none; border-top: 1px solid var(--gyt-border-soft); }
	.gyt-menu-toggle:checked ~ .gyt-nav { display: block; }
	.gyt-nav__list { flex-direction: column; flex-wrap: nowrap; gap: 0; padding: 4px 0 8px; overflow: visible; }
	.gyt-nav__list li { border-bottom: 1px solid var(--gyt-border-soft); }
	.gyt-nav__list li:last-child { border-bottom: 0; }
	.gyt-nav__list a { display: block; padding: 13px 4px; font-size: 16px; font-weight: 600; white-space: normal; }
	.gyt-nav__extra { display: block; }
	.gyt-nav__extra a { font-weight: 500; color: var(--gyt-text-muted); }

	/* ---------------- Bài sản phẩm: một cột, thứ tự theo mockup ---------------- */
	/* 🔴 `align-items: stretch` là BẮT BUỘC: luật desktop để `align-items: start`, mà trong cột flex thì
	   `start` = mỗi khối rộng theo max-content — hero ra 482px, mục lục ra 1.133px, tràn màn (đo 25/09). */
	.gyt-pr__grid { display: flex; flex-direction: column; align-items: stretch; gap: 0; }
	.gyt-pr__main, .gyt-pr__side { display: contents; }
	.gyt-pr__main > *, .gyt-pr__side > * { order: 0; min-width: 0; }
	.gyt-pr__main > .gyt-pr__label { order: -30; }
	.gyt-pr__main > .gyt-pr__h1   { order: -29; font-size: 24px; line-height: 1.28; letter-spacing: -.01em; }
	.gyt-pr__main > .gyt-pr__sub  { order: -28; font-size: 15.5px; line-height: 1.65; }
	.gyt-pr__main > .gyt-ameta    { order: -27; }
	.gyt-pr__main > .gyt-hero     { order: -26; }
	/* Đánh giá nhanh (sidebar) + Hợp với ai (cột chính) chạy lên ngay dưới nút mua — đúng mockup */
	.gyt-pr__side > .gyt-verdict--side { order: -25; margin-top: 18px; }
	.gyt-pr__main > .gyt-fit--full     { order: -24; margin-top: 14px; }
	.gyt-pr__main > .gyt-toc           { order: -23; margin-top: 18px; }
	/* Bản "Nên mua nếu" trong sidebar là bản LẶP của khối Hợp với ai -> ẩn, không nhân đôi chữ */
	.gyt-pr__side > .gyt-fit--side { display: none; }
	/* Mục lục: tab "Hợp với ai" (#phu-hop) nhảy lên đầu cho khớp thứ tự khối (trình duyệt không :has thì giữ thứ tự cũ) */
	.gyt-toc__list li:has(a[href="#phu-hop"]) { order: -1; }
	.gyt-toc__list li:first-child a { font-weight: 600; border-bottom-color: transparent; }
	.gyt-toc__list a { padding: 12px 10px; font-size: 14px; }

	/* Hero: ảnh trọn cột, khối quyết định thành thẻ */
	.gyt-hero { display: block; }
	.gyt-decide { margin-top: 14px; padding: 18px 16px 16px; }
	.gyt-decide__name { font-size: 22px; }
	.gyt-decide .gyt-cta { width: 100%; min-height: 54px; }
	.gyt-price--lg .gyt-price__now { font-size: 28px; }

	/* Đánh giá nhanh: thẻ nền xanh nhạt như mockup, điểm to */
	.gyt-verdict--side { padding: 16px; border-radius: 16px; }
	.gyt-verdict__score { font-size: 28px; }

	/* Hợp với ai · Ưu/Nhược: HAI cột gọn (mockup), chữ 13.5px */
	.gyt-fit--full .gyt-fit__grid, .gyt-pc { grid-template-columns: 1fr 1fr; gap: 10px; }
	.gyt-fit__col, .gyt-pc__col { padding: 12px 12px 10px; border-radius: 12px; }
	.gyt-fit__h, .gyt-pc__h { font-size: 14px; margin-bottom: 8px; }
	/* 🔴 GIỮ padding-left cho icon ✓/✕ (product.css đặt icon absolute ở left:0). Bản đầu viết `padding: 5px 0`
	   -> icon đè lên chữ đầu dòng ("✓u mức cường độ") — anh Khai bắt trên máy thật 25/09. */
	.gyt-fit__col li, .gyt-pc__col li { font-size: 13.5px; line-height: 1.45; padding: 0 0 0 24px; margin-bottom: 10px; }
	.gyt-fit__col li::before, .gyt-pc__col li::before { top: 1px; width: 17px; height: 17px; font-size: 10px; }

	/* Tiêu đề khối */
	.gyt-block { margin-top: 26px; scroll-margin-top: 62px; }
	.gyt-shead__title { font-size: 20px; }
	.gyt-shead__sub { font-size: 13px; }

	/* Đánh giá chi tiết: mỗi mục là một THẺ gập 3 dòng + "Đọc tiếp" */
	.gyt-review { display: grid; gap: 10px; }
	.gyt-review__sec {
		margin: 0; padding: 14px 16px 12px;
		border: 1px solid var(--gyt-border); border-radius: 14px; background: #fff;
	}
	.gyt-review__h { font-size: 17px; line-height: 1.35; margin: 0 0 8px; }
	.gyt-review__no { width: 24px; height: 24px; font-size: 12px; }
	.gyt-review__body { font-size: 15px; line-height: 1.7; }
	.gyt-review__body > p { margin: 0 0 10px; }
	.gyt-review__toggle:not(:checked) ~ .gyt-review__body {
		display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden;
	}
	.gyt-review__more {
		display: inline-flex; align-items: center; gap: 4px;
		margin-top: 6px; min-height: 40px;
		font-size: 14px; font-weight: 700; color: var(--gyt-brand-dark); cursor: pointer;
	}
	.gyt-review__more::after { content: "Đọc tiếp ↓"; }
	.gyt-review__toggle:checked ~ .gyt-review__more::after { content: "Thu gọn ↑"; }

	/* Người mua nói gì: trích dẫn 2 cột */
	.gyt-quotes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
	.gyt-quote { padding: 12px; font-size: 13.5px; }
	.gyt-buyer__num { font-size: 34px; }

	/* Video: 2 thẻ một hàng */
	.gyt-videos, .gyt-videos[data-count] { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
	.gyt-video__title { font-size: 13.5px; }

	/* Kết luận + FAQ */
	.gyt-final { padding: 20px 16px; }
	.gyt-final__h { font-size: 21px; }
	.gyt-final .gyt-cta { width: 100%; }
	/* 🔴 GIỮ đệm trái/phải: bản đầu viết `padding: 12px 0` -> câu hỏi dính sát viền hộp (anh Khai bắt 25/09).
	   Cùng họ lỗi icon ✓/✕ — viết tắt `padding: a b` là ghi đè cả bốn cạnh. */
	.gyt-faq summary { font-size: 15px; padding: 13px 14px; gap: 12px; }
	.gyt-faq__a { padding: 0 14px 14px; font-size: 15px; line-height: 1.65; }

	/* Sidebar còn lại (Sản phẩm cùng tầm giá, Bài liên quan, promo) — bỏ sticky, giãn như khối thường */
	.gyt-pr__side > .gyt-sbox, .gyt-pr__side > .gyt-promo { margin-top: 26px; }

	/* Thanh dính đáy: tên 1 dòng, nút to */
	.gyt-sticky-cta__name { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
	.gyt-sticky-cta .gyt-cta { min-height: 44px; padding-inline: 16px; }

	/* 26/09 (anh Khai): ẨN "Danh mục nổi bật" trên trang chủ mobile — danh mục đã có trong menu ☰ và hàng 3 thẻ dưới hero,
	   khối này chỉ lặp lại và đẩy lưới sản phẩm xuống sâu. Desktop giữ nguyên. Link vẫn nằm trong HTML (Google vẫn thấy). */
	.gyt-home #danh-muc { display: none; }

	/* 26/09: trang chủ lấy 10 mẫu cho 2 hàng desktop; điện thoại chỉ 6 (3 hàng × 2) rồi tới nút "Xem tất cả" */
	.gyt-home #san-pham .gyt-pgrid > :nth-child(n+7) { display: none; }

	/* ---------------- Footer gọn (26/09, anh Khai: "quá dài cho mobile") ----------------
	 * Hai cột link từ danh sách dọc (mỗi link một dòng 48px → 12 dòng) thành chữ chảy nối tiếp, xuống dòng
	 * tự nhiên — cùng số link, cao còn khoảng một phần ba. Vùng chạm giữ ≥ 32px bằng padding dọc.
	 */
	.gyt-footer { padding-block: 24px; font-size: 14px; }
	.gyt-footer__grid { grid-template-columns: 1fr; gap: 18px; }
	.gyt-footer__col .gyt-footer__about { margin-top: 10px !important; font-size: 13px !important; line-height: 1.55; }
	.gyt-footer__col h3 { margin-bottom: 4px; font-size: 13px; text-transform: uppercase; letter-spacing: .04em; color: var(--gyt-text-muted); }
	.gyt-footer__col ul { display: flex; flex-wrap: wrap; column-gap: 18px; }
	.gyt-footer__col li { margin: 0; }
	.gyt-footer__col a { display: inline-block; padding: 6px 0; color: var(--gyt-text); }
	.gyt-footer__note { margin-top: 18px; padding-top: 14px; font-size: 11.5px; line-height: 1.55; }

	/* ---------------- Trang chủ: hero gọn lại ---------------- */
	.gyt-hhero__panel { padding: 18px 16px 16px; gap: 14px; }
	.gyt-hhero__media img { max-height: 190px; }
	.gyt-hhero__h1 { font-size: 26px; line-height: 1.2; }
	.gyt-hhero__sub { font-size: 15px; line-height: 1.6; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; }
	.gyt-hhero__trust { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; }
	.gyt-hhero__trust li { font-size: 12.5px; padding: 6px 10px; border-radius: 999px; background: #eef8f2; }
	.gyt-hhero__cta { width: 100%; }
	/* 3 thẻ ngành đứng chung MỘT hàng — ô nhỏ, ảnh + tên, bỏ mô tả */
	.gyt-hvert { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-flow: row; gap: 8px; }
	.gyt-hvert__card { grid-template-columns: minmax(0, 1fr); min-height: 0; padding: 10px 8px; text-align: center; justify-items: center; }
	.gyt-hvert__media img { width: 56px; height: 44px; }
	.gyt-hvert__title { font-size: 13px; line-height: 1.3; }
	.gyt-hvert__sub, .gyt-hvert__go { display: none; }

	/* ---------------- Bài So sánh: hero A | VS | B đứng CẠNH nhau, không xếp chồng ---------------- */
	/* Đo 25/09: .gyt-cph__vs xếp dọc A (354) · VS · B (351) = 806px, cả hero 1.186px, nút mua đầu ở 2.149px. */
	.gyt-cph__vs { position: relative; grid-template-columns: 1fr 1fr; gap: 8px; }
	.gyt-cph__badge { position: absolute; left: 50%; top: 58px; transform: translateX(-50%); z-index: 2; }
	.gyt-cph__card { padding: 10px; min-width: 0; }
	.gyt-cph__img { display: grid; place-items: center; }
	.gyt-cph__img img { width: 120px; height: 120px; object-fit: contain; }
	.gyt-cph__name { font-size: 14px; }
	.gyt-cph__pos { display: none; }
	.gyt-cph__card .gyt-price__now { font-size: 16px; }
	.gyt-cph__review { font-size: 13px; }
	.gyt-cph__outcome { font-size: 14.5px; }
	/* Bảng A|B: ba cột ép vừa 335px, không cuộn ngang; ảnh nhỏ trong tiêu đề cột bỏ */
	.gyt-cpt { min-width: 0; width: 100%; table-layout: fixed; }
	.gyt-cpt th, .gyt-cpt td { min-width: 0; padding: 8px 6px; font-size: 13px; line-height: 1.4; word-break: break-word; }
	.gyt-cpt__prod img { display: none; }
	.gyt-cpv { padding: 14px; }
	.gyt-cpv__summary { font-size: 14.5px; }

	/* ---------------- Bài How-to: ảnh hero nhỏ lại (đang 335px vuông = 744px hero) ---------------- */
	.gyt-hth__media { max-width: 220px; margin: 0 auto; }
	.gyt-hth .gyt-pr__h1 { font-size: 24px; }
	.gyt-hth .gyt-pr__sub { font-size: 15.5px; line-height: 1.65; }

	/* ---------------- Hướng dẫn mua: hero ---------------- */
	.gyt-bghero__trust li { font-size: 12.5px; padding: 6px 10px; }

	/* ---------------- Trang danh mục: hero gọn ---------------- */
	.gyt-cathero { gap: 12px; padding: 16px; }
	.gyt-cathero__h1 { font-size: 26px; }
	.gyt-cathero__intro { font-size: 15px; line-height: 1.6; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; margin-bottom: 10px; }
	.gyt-cathero__media { padding: 12px; }
	.gyt-cathero__media img { max-height: 170px; }
	.gyt-cathero__stats { gap: 6px; margin-bottom: 10px; }
	.gyt-cathero__stats li { padding: 5px 10px; font-size: 12.5px; gap: 5px; }
	.gyt-cathero__note { font-size: 12.5px; }
	.gyt-cat .gyt-block--commerce { padding: 16px 12px; border-radius: 14px; }
	.gyt-cat .gyt-block--commerce .gyt-shead__title { font-size: 20px; }
}

/* ================================================================== */
/* ≤ 600px — điện thoại: lưới 2 thẻ/hàng (anh Khai chốt 25/09)         */
/* ================================================================== */
@media (max-width: 600px) {
	.gyt-pgrid, .gyt-cat .gyt-pgrid, .gyt-home .gyt-pgrid, .gyt-home .gyt-pgrid[data-count] {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 10px;
	}
	/* Ảnh tràn SÁT MÉP thẻ như Shopee (anh Khai 25/09: "ảnh cho full như Shopee nhìn cho đã"): thẻ bỏ padding,
	   phần chữ tự đệm. Thẻ KHÔNG ảnh giữ padding cũ của product.css. */
	.gyt-pcard--grid, .gyt-cat .gyt-pcard--grid, .gyt-home .gyt-pcard--grid { padding: 10px; min-width: 0; }
	.gyt-pcard--grid:not(.gyt-pcard--noimg), .gyt-cat .gyt-pcard--grid:not(.gyt-pcard--noimg), .gyt-home .gyt-pcard--grid:not(.gyt-pcard--noimg) { padding: 0; overflow: hidden; }
	.gyt-pcard--grid:not(.gyt-pcard--noimg) .gyt-pcard__body { padding: 8px 10px 10px; }
	/* 🔴 Ảnh thumb KHÔNG được lọt ra ngoài khung: khung overflow hidden, ảnh contain, cao cố định */
	.gyt-pcard--grid .gyt-pcard__media { display: block; margin: 0; overflow: hidden; border-radius: 0; background: #fff; }
	.gyt-pcard--grid .gyt-pcard__media img,
	.gyt-cat .gyt-pcard--grid .gyt-pcard__media img,
	.gyt-home .gyt-pcard--grid .gyt-pcard__media img {
		/* Ảnh rộng BẰNG cột chữ, khung vuông 1:1, `contain` (ảnh Shopee gần như luôn vuông nên lấp kín; không cắt).
		   Bản đầu kẹp cao 120px -> ảnh vuông chỉ còn 120px rộng, hai bên hở trắng, nhìn "lọt" (anh Khai bắt 25/09). */
		display: block; width: 100%; height: auto; max-width: 100%; border-radius: 0;
		aspect-ratio: 1 / 1; object-fit: cover; object-position: center;
		/* `cover` theo ý anh Khai (kiểu Shopee). Ảnh Shopee vốn vuông nên không mất gì; ảnh lệch tỉ lệ bị xén mép — chấp nhận ở THẺ, không áp cho gallery bài (mục 6c). */
	}
	.gyt-pcard--grid .gyt-pcard__name, .gyt-cat .gyt-pcard__name {
		margin: 8px 0 4px; font-size: 13.5px; line-height: 1.35;
		display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; min-height: 2.7em;
	}
	.gyt-pcard--grid .gyt-pcard__reason { display: none; }
	.gyt-pcard__rating { font-size: 12.5px; }
	.gyt-pcard--grid .gyt-pcard__actions { grid-template-columns: minmax(0, 1fr); gap: 6px; }
	.gyt-pcard--grid .gyt-pcard__actions .gyt-cta,
	.gyt-cat .gyt-pcard--grid .gyt-pcard__actions .gyt-cta {
		min-height: 36px; padding: 0 8px; font-size: 12.5px; white-space: nowrap;
	}
	.gyt-pcard--grid .gyt-pcard__actions .gyt-cta__icon { display: none; }

	/* Thẻ danh mục con / danh mục liên quan: 2 cột, bỏ mô tả.
	   🔴 Phải kê cả `.gyt-cat …` và `.gyt-home …` (+ [data-count]) — category.css/home.css khai với độ ưu tiên đó, viết `.gyt-catgrid` trần là thua. */
	.gyt-catgrid, .gyt-cat .gyt-catgrid, .gyt-home .gyt-catgrid,
	.gyt-cat .gyt-catgrid[data-count], .gyt-home .gyt-catgrid[data-count] { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
	/* Hàng giá trong thẻ 160px: xuống hai dòng như biến thể --sm (bẫy "giá đè lên nút", mục 10b) */
	.gyt-pcard--grid .gyt-price__row { flex-wrap: wrap; row-gap: 1px; }
	.gyt-pcard--grid .gyt-price__now { font-size: 15px; }
	.gyt-pcard--grid .gyt-price__was { font-size: 12px; }
	.gyt-pcard--grid .gyt-price__off { margin-left: auto; font-size: 11px; padding: 1px 6px; }
	.gyt-catcard { padding: 12px; }
	.gyt-catcard__name { font-size: 14px; }
	.gyt-catcard__desc { display: none; }
}

/* 26/09: ô nhu cầu trang chủ — điện thoại 2 cột */
@media (max-width: 600px) {
	.gyt-hneeds .gyt-needchips { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
	.gyt-hneeds .gyt-needchip { padding: 10px; gap: 8px; }
	.gyt-hneeds .gyt-needchip__txt strong { font-size: 13px; }
}

/* ---------------- "Tóm tắt nhanh" gọn tối đa trên điện thoại (26/09, anh Khai: "kéo trang mobile dài quá") ----------------
 * Trước: ô đứng (icon 36px trên · giá trị · nhãn), 6 ô = 3 hàng ~145px/hàng ≈ 440px.
 * Nay: ô NGANG (icon 26px trái · giá trị + nhãn phải), CHỈ 4 ô đầu = 2 hàng ~60px ≈ 125px.
 * Không mất thông tin: bảng "Thông số" ngay dưới vẫn in đủ nguyên văn mọi dòng.
 */
@media (max-width: 600px) {
	#tom-tat .gyt-shead { margin-bottom: 8px; }
	.gyt-hl__item {
		display: grid; grid-template-columns: 26px minmax(0, 1fr); column-gap: 8px; align-items: center;
		padding: 9px 10px;
	}
	.gyt-hl__item:nth-child(n+5) { display: none; }
	.gyt-hl__ico { grid-row: span 2; width: 26px; height: 26px; margin: 0; border-radius: 7px; align-self: center; }
	.gyt-hl__ico .gyt-hl__icon, .gyt-hl__ico svg, .gyt-hl__ico img { width: 16px; height: 16px; }
	.gyt-hl__val { font-size: 13px; line-height: 1.3; -webkit-line-clamp: 1; }
	.gyt-hl__lab { margin-top: 1px; font-size: 11.5px; line-height: 1.3; }
}

/* Dòng "Bởi Gợi Ý Tốt · 7 phút đọc · Cập nhật …" — MỘT dòng trên điện thoại (26/09, anh Khai). Bản desktop gap 18px
   làm nó gãy 2 dòng ở 375px. Chữ nhỏ lại, dấu chấm sát hơn; vẫn tràn thì cắt "…" chứ không xuống dòng. */
@media (max-width: 600px) {
	.gyt-ameta { flex-wrap: nowrap; gap: 7px; padding-bottom: 12px; font-size: 12.5px; white-space: nowrap; overflow: hidden; }
	.gyt-ameta > * + *::before { margin-right: 7px; }
	.gyt-ameta > :last-child { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
}

/* ======================================================================================================
 * 26/09 — TRANG REVIEW TRÊN ĐIỆN THOẠI GỌN HẾT MỨC (anh Khai: "trang review hơi dài, khó xem các sản phẩm khác")
 * Đo bài áo mưa LEZIDA ở 390px trước khi sửa: trang 10.131px, "Sản phẩm liên quan" bắt đầu ở 7.420px.
 * Nguyên tắc: KHÔNG xoá chữ khỏi HTML (Google vẫn đọc đủ) — chỉ gập / kẹp / bớt trên màn hẹp. Desktop không đổi.
 * ====================================================================================================== */
.gyt-more-t { position: absolute; opacity: 0; pointer-events: none; }
.gyt-more-b { display: none; }

@media (max-width: 600px) {
	/* Nút gập dùng chung (Thông số · Kết luận) */
	.gyt-more-b {
		display: inline-flex; align-items: center; min-height: 40px; margin-top: 6px;
		font-size: 14px; font-weight: 700; color: var(--gyt-brand-dark); cursor: pointer;
	}
	.gyt-more-b::after { content: attr(data-more); }
	.gyt-more-t:checked ~ .gyt-more-b::after { content: attr(data-less); }

	/* Mở bài: 3 dòng */
	.gyt-pr__main > .gyt-pr__sub {
		display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden;
	}
	/* Khối giá: bỏ danh sách lợi ích — đã có ở Tóm tắt nhanh + Ưu điểm; giữ giá · nút mua · công bố */
	.gyt-hero .gyt-benefits { display: none; }
	/* Đánh giá nhanh: tóm tắt 4 dòng */
	.gyt-verdict__sum { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; overflow: hidden; }
	/* Hợp với ai: 3 ý mỗi cột · Ưu/nhược: 4 ý mỗi cột (đủ nguyên văn trên desktop + trong HTML) */
	.gyt-fit__col li:nth-child(n+4) { display: none; }
	.gyt-pc__col li:nth-child(n+5) { display: none; }
	/* Người mua nói gì: 2 trích dẫn (mỗi trích dẫn đã có nút xem thêm riêng — không kẹp thêm) */
	.gyt-quotes > :nth-child(n+3) { display: none; }
	/* Thông số: 6 dòng đầu, bấm "Xem đủ" mới bung */
	.gyt-more-t:not(:checked) ~ .gyt-scroll-x .gyt-specs tr:nth-child(n+7) { display: none; }
	/* Kết luận: ~6 dòng + mờ dần, bấm "Đọc tiếp" */
	.gyt-more-t:not(:checked) ~ .gyt-final__body {
		max-height: 10.5em; overflow: hidden;
		-webkit-mask-image: linear-gradient(#000 70%, transparent); mask-image: linear-gradient(#000 70%, transparent);
	}
	.gyt-final .gyt-more-b { margin: 0 0 10px; }
	/* Cách chúng tôi đánh giá: 2 dòng */
	.gyt-source__claim { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }

	/* Sản phẩm liên quan + thay thế: HÀNG VUỐT NGANG (1 hàng thay vì 3) — xem nhiều mẫu mà trang không dài thêm */
	.gyt-prel .gyt-prel__grid, #thay-the .gyt-pgrid {
		display: flex; gap: 10px; overflow-x: auto; overscroll-behavior-x: contain;
		scroll-snap-type: x mandatory; padding-bottom: 6px; -webkit-overflow-scrolling: touch;
	}
	.gyt-prel .gyt-prel__grid > *, #thay-the .gyt-pgrid > * { flex: 0 0 44%; scroll-snap-align: start; min-width: 0; }
}

/* ---------------- /san-pham/ trên điện thoại (26/09, anh Khai: "màn này quá dài") ----------------
 * Trước: 3 nhóm chip (giá · nhu cầu · danh mục) tự xuống dòng thành ~12 hàng ≈ 1.200px, sản phẩm đầu tiên nằm ngoài màn đầu.
 * Nay: mỗi nhóm là MỘT hàng vuốt ngang, chip nhỏ lại; tiêu đề/mô tả gọn → lưới sản phẩm hiện ngay trong màn đầu.
 */
@media (max-width: 600px) {
	.gyt-parch__head { margin: 8px 0 12px; }
	.gyt-parch__h1 { font-size: 22px; margin-bottom: 4px; }
	.gyt-parch__sub { font-size: 13.5px; line-height: 1.5; }
	.gyt-parch__bands, .gyt-parch__cats {
		flex-wrap: nowrap; overflow-x: auto; gap: 6px;
		margin: 0 -16px 8px; padding: 0 16px 2px; scrollbar-width: none;
	}
	.gyt-parch__bands::-webkit-scrollbar, .gyt-parch__cats::-webkit-scrollbar { display: none; }
	.gyt-parch__cats { margin-bottom: 14px; }
	.gyt-parch__band, .gyt-parch__cat {
		flex: 0 0 auto; white-space: nowrap; min-height: 34px; padding: 0 12px; font-size: 13px;
	}
	.gyt-parch__bands--need { margin-top: 0; }
}

/* Bảng thông số trên điện thoại (26/09, anh Khai: "Thương hiệu" xuống dòng không đáng có, hàng quá cao).
   Gốc: lề trong desktop 19px × 24px → cột nhãn 34% chỉ còn ~66px chữ. Nay lề 8×10, cột nhãn 40%, chữ 14px → hàng ~36px. */
@media (max-width: 600px) {
	.gyt-specs { border-radius: 10px; }
	.gyt-specs th, .gyt-specs td { padding: 8px 10px; font-size: 14px; line-height: 1.4; }
	.gyt-specs th { width: 40%; }
	#thong-so .gyt-shead { margin-bottom: 8px; }
	#thong-so .gyt-more-b { margin-top: 2px; }
}