/* ==========================================================================
   Product category pages (Figma "Sản phẩm" + "Sản phẩm chi tiết")
   ========================================================================== */

/* ---------- Overview: top slider ---------- */
.cat-slider { padding-top: 24px; }
.carousel--cat { --slide-w: 628px; }
.carousel--cat .carousel__slide img {
	width: 100%; aspect-ratio: 628 / 422; height: auto;
	object-fit: cover; border-radius: 24px;
}
@media (max-width: 720px) { .carousel--cat { --slide-w: 86vw; } .carousel--cat .carousel__track { gap: 12px; } }

/* ---------- Layout: sidebar 302 + main 954 ---------- */
.cat-page__grid {
	display: grid; grid-template-columns: 302px minmax(0, 954px);
	justify-content: space-between; gap: 24px; align-items: start;
}
.cat-page__main { min-width: 0; }

/* ---------- Sidebar ---------- */
.cat-nav { display: grid; gap: 16px; }
.cat-nav__group { padding: 16px; background: var(--c-bg-soft); border-radius: var(--radius); }
.cat-nav__head {
	display: flex; align-items: center; gap: 16px;
	color: var(--c-gray-90);
}
.cat-nav__head:hover { color: var(--c-primary); }
.cat-icon { flex: 0 0 80px; width: 80px; height: 80px; object-fit: contain; }
.cat-icon--svg { display: grid; place-items: center; }
.cat-icon--svg svg { width: 59px; height: 63px; }
.cat-nav__name {
	flex: 1; min-width: 0;
	font-size: 20px; font-weight: 600; line-height: 26px; text-transform: uppercase;
}
.cat-nav__caret { color: #364970; }
.cat-nav__caret.is-down svg { transform: rotate(90deg); }
.is-active > .cat-nav__head { color: var(--c-primary); }
.is-active > .cat-nav__head .cat-nav__caret { color: var(--c-primary); }

.cat-nav__children { display: grid; gap: 12px; margin-top: 16px; }
.cat-nav__children a { display: block; font-size: 18px; line-height: 1.25; letter-spacing: -0.27px; color: #404040; }
.cat-nav__children a:hover,
.cat-nav__children a[aria-current] { color: var(--c-primary); }
.cat-nav__children a[aria-current] { font-weight: 600; }

.cat-nav__others { display: grid; gap: 16px; }

/* ---------- Main column ---------- */
.cat-banner { margin-bottom: 40px; overflow: hidden; border-radius: 24px; }
.cat-banner img { width: 100%; aspect-ratio: 954 / 533; height: auto; object-fit: cover; }

.cat-gallery { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px 24px; margin-bottom: 40px; }
.cat-gallery a { display: block; overflow: hidden; border-radius: var(--radius-sm); background: #f6f6f6; }
.cat-gallery img { width: 100%; aspect-ratio: 302 / 220; height: auto; object-fit: cover; transition: transform .4s; }
.cat-gallery a:hover img { transform: scale(1.04); }

.cat-title,
.prose--product h2 {
	font-size: clamp(24px, 1.6vw + 6px, 32px); font-weight: 700; line-height: 1.25;
	letter-spacing: -0.48px; text-transform: uppercase; color: #404040;
}
.cat-title { margin-bottom: 24px; }

/* ---------- Description content ---------- */
.prose--product { font-size: 16px; line-height: 1.6; color: #5b6b7d; }
.prose--product > * + * { margin-top: 16px; }
.prose--product > h2 { margin-top: 40px; margin-bottom: 8px; }
.prose--product > h2:first-child { margin-top: 0; }
.prose--product h3 { margin-top: 24px; font-size: 20px; font-weight: 600; line-height: 1.3; letter-spacing: -0.3px; color: #2f2f2f; }
.prose--product h3 + * { margin-top: 8px; }
.prose--product ul { padding-left: 30px; }
.prose--product li { font-size: 18px; line-height: 1.4; letter-spacing: -0.3px; color: #2f2f2f; }
.prose--product li + li { margin-top: 4px; }
.prose--product strong { color: #2f2f2f; }
.prose--product a { color: var(--c-primary); text-decoration: none; }
.prose--product a:hover { text-decoration: underline; }
.prose--product .wp-caption { max-width: 100% !important; margin: 24px 0; }
.prose--product .wp-caption img,
.prose--product > p > img { width: 100%; height: auto; border-radius: var(--radius); background: #f6f6f6; }
.prose--product .wp-caption-text { margin-top: 8px; font-size: 14px; text-align: center; color: #8a96a3; }

/* Logo chứng chỉ chèn trước "Quy trình đặt hàng" */
.prose--product .cert-logos {
	justify-content: space-between; gap: 16px 24px; margin: 40px 0; padding: 0; list-style: none;
}
.prose--product .cert-logos li { margin: 0; }
.prose--product .cert-logos img { height: 80px; }

/* ---------- Responsive ---------- */
@media (max-width: 1199px) {
	.cat-page__grid { grid-template-columns: 260px minmax(0, 1fr); }
	.cat-icon { flex-basis: 56px; width: 56px; height: 56px; }
	.cat-nav__name { font-size: 16px; line-height: 22px; }
}
@media (max-width: 900px) {
	.cat-page__grid { grid-template-columns: 1fr; }
	.cat-nav { order: 2; }
	.cat-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
	.prose--product li { font-size: 16px; }
	.prose--product .cert-logos img { height: 56px; }
}