/* Brand overrides for the mapped family pages; base is the polyethylene design. */
.np-family .np-pe-hero h1 { font-size: clamp(34px, 3.9vw, 54px); }
.np-family .np-pe-hero h1 span { font-size: .53em; }
.np-family .np-pe-specs strong { font-size: 16px; }
.np-family .np-family-media { padding: 22px 22px 70px; background: #fff; }
.np-family .np-family-media img { aspect-ratio: 900 / 580; object-fit: contain; object-position: center; border-radius: 4px; }
.np-family .np-family-media figcaption { inset-inline: 22px; bottom: 15px; max-width: calc(100% - 44px); }
.np-family .np-pe-app-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.np-family .np-pe-app h3 { font-size: 21px; }
.np-family .np-pe-guide-nav nav { max-height: 58vh; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; }
.np-family-related-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.np-family-related-grid > a { display: grid; gap: 9px; padding: 25px; border: 1px solid var(--np-pe-line); border-radius: 8px; background: #fff; text-decoration: none; }
.np-family-related-grid > a:hover { border-color: #94bed6; background: #f8fcfe; }
.np-family-related-grid strong { color: var(--np-pe-ink); font-size: 22px; }
.np-family-related-grid span { font-size: 14px; }
.np-family .np-pe-article h2.has-text-color { color: var(--np-pe-ink) !important; }
.np-family .np-pe-article .np-pe-brand-cards table { border: 0 !important; }
.np-family .np-pe-article .np-pe-brand-cards tr { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); margin-block: 12px; }
.np-family .np-pe-article .np-pe-brand-cards td:empty { display: none; }
.np-family .np-pe-article .np-pe-brand-cards td p { margin: 0; }
.np-family .np-pe-article .np-pe-brand-cards td a { min-width: 0; }

/* Existing brand rows: classic HTML, Gutenberg columns and linked logo rows.
 * Match the actual logo assets so unrelated editorial columns stay untouched.
 * No brand, image or destination is added to the stored page content. */
.np-family .np-pe-article :is(
	.np-brands-row,
	div:has(> div > img[src*="/uploads/price/logo/"]),
	div:has(> div > a > img[src*="/uploads/price/logo/"]),
	.wp-block-columns:has(> .wp-block-column > figure > img[src*="/uploads/price/logo/"])
) {
	display: grid !important; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
	align-items: stretch; gap: 14px !important; width: 100%; margin: 28px 0 !important;
	padding: 20px; border: 1px solid #cfe2ec; border-radius: 14px;
	background: #f2f8fc; direction: rtl;
}
.np-family .np-pe-article .wp-block-columns:has(> .wp-block-column > figure > img[src*="/uploads/price/logo/"]) > .wp-block-column:empty { display: none; }
.np-family .np-pe-article div:has(> div:only-child > a > img[src*="/uploads/price/logo/"]) {
	grid-template-columns: minmax(0, 1fr) !important; max-width: 360px; margin-inline: auto !important;
}
.np-family .np-pe-article :is(
	.np-brands-row > a,
	div:has(> img[src*="/uploads/price/logo/"]),
	div:not(.np-brands-row):has(> a > img[src*="/uploads/price/logo/"]),
	.wp-block-column:has(> figure > img[src*="/uploads/price/logo/"])
) {
	position: relative; display: flex !important; flex-direction: column;
	align-items: center; justify-content: center; gap: 10px; min-width: 0; min-height: 232px;
	margin: 0 !important; padding: 22px 14px !important; border: 1px solid #d6e5ee;
	border-radius: 10px; background: #fff; color: var(--np-pe-ink); opacity: 1;
	font-size: 18px; font-weight: 800; line-height: 1.8; text-align: center;
	text-decoration: none; box-shadow: 0 3px 12px #123c5910;
	transition: border-color .18s ease, box-shadow .18s ease;
}
.np-family .np-pe-article :is(
	.np-brands-row > a,
	div:has(> img[src*="/uploads/price/logo/"]),
	div:not(.np-brands-row):has(> a > img[src*="/uploads/price/logo/"]),
	.wp-block-column:has(> figure > img[src*="/uploads/price/logo/"])
):is(:hover, :focus-within) { border-color: var(--np-pe-blue); box-shadow: 0 5px 18px #08699e20; }
.np-family .np-pe-article :is(.np-brands-row > a, div:has(> img[src*="/uploads/price/logo/"]), div:not(.np-brands-row):has(> a > img[src*="/uploads/price/logo/"]), .wp-block-column:has(> figure > img[src*="/uploads/price/logo/"])):focus-within {
	outline: 3px solid var(--np-pe-blue); outline-offset: 3px;
}
.np-family .np-pe-article img[src*="/uploads/price/logo/"] {
	display: block; flex-shrink: 0; width: 112px !important; height: 100px !important;
	max-width: 100% !important; margin: 0 auto !important; object-fit: contain;
}
.np-family .np-pe-article :is(
	.np-brands-row > a,
	div:has(> img[src*="/uploads/price/logo/"]),
	div:not(.np-brands-row):has(> a > img[src*="/uploads/price/logo/"]),
	.wp-block-column:has(> figure > img[src*="/uploads/price/logo/"])
) > :is(a, p, span, figure, div) {
	margin: 0 !important; padding: 0; color: inherit !important; font-size: inherit !important;
	font-weight: inherit; line-height: inherit; text-decoration: none;
}
.np-family .np-pe-article :is(
	div:has(> img[src*="/uploads/price/logo/"]),
	div:not(.np-brands-row):has(> a > img[src*="/uploads/price/logo/"]),
	.wp-block-column:has(> figure > img[src*="/uploads/price/logo/"])
) a { color: var(--np-pe-ink) !important; font-size: inherit !important; font-weight: 800; text-decoration: none; }
.np-family .np-pe-article :is(
	div:has(> img[src*="/uploads/price/logo/"]),
	div:not(.np-brands-row):has(> a > img[src*="/uploads/price/logo/"]),
	.wp-block-column:has(> figure > img[src*="/uploads/price/logo/"])
) a::after { position: absolute; inset: 0; border-radius: 10px; content: ""; }
.np-family .np-pe-article :is(
	.np-brands-row > a,
	div:has(> img[src*="/uploads/price/logo/"]),
	div:not(.np-brands-row):has(> a > img[src*="/uploads/price/logo/"]),
	.wp-block-column:has(> figure > img[src*="/uploads/price/logo/"])
)::after {
	display: block; margin-top: auto; padding-top: 6px; color: var(--np-pe-blue);
	font-size: 13px; font-weight: 600; line-height: 1.8; content: "مشاهده برند ←";
}

/* Classic Woo shortcodes are retained alongside the reference's block grids. */
body.np-family-page .np-family .np-pe-article ul.products {
	display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px;
	width: 100%; margin: 24px 0; padding: 0; list-style: none;
}
body.np-family-page .np-family .np-pe-article ul.products::before,
body.np-family-page .np-family .np-pe-article ul.products::after { display: none; }
body.np-family-page .np-family .np-pe-article ul.products li.product {
	display: flex; flex-direction: column; float: none; clear: none;
	width: 100% !important; max-width: 100%; min-width: 0; margin: 0 !important;
	padding: 16px; border: 1px solid var(--np-pe-line); border-radius: 7px; background: #fff;
	text-align: center;
}
body.np-family-page .np-family .np-pe-article ul.products li.product .astra-shop-thumbnail-wrap { width: 100%; }
body.np-family-page .np-family .np-pe-article ul.products li.product img {
	display: block; width: 100%; height: 150px; max-height: 150px; margin: 0 auto 15px; object-fit: contain;
}
body.np-family-page .np-family .np-pe-article ul.products li.product .woocommerce-loop-product__title {
	display: flex; align-items: center; justify-content: center; min-height: 3.6em;
	margin: 0 0 12px; padding: 0; border: 0; color: var(--np-pe-ink); font-size: 16px; line-height: 1.8;
}
body.np-family-page .np-family .np-pe-article ul.products li.product .astra-shop-summary-wrap {
	display: flex; flex: 1; flex-direction: column; align-items: center; width: 100%;
}
/* Astra's live loop can emit the title as a bare link instead of an H2. */
body.np-family-page .np-family .np-pe-article ul.products li.product .ast-loop-product__link {
	display: flex; align-items: center; justify-content: center; width: 100%; min-height: 3.6em;
	margin: 0 0 12px; color: var(--np-pe-ink); font-size: 16px; font-weight: 800; line-height: 1.8;
}
body.np-family-page .np-family .np-pe-article ul.products li.product .ast-woo-product-category { margin-bottom: 7px; font-size: 12px; }
body.np-family-page .np-family .np-pe-article ul.products li.product .button {
	min-height: 42px; max-width: 100%; margin-top: auto; padding: 10px 14px; border-radius: 5px;
	color: #fff; background: var(--np-pe-blue); font: 700 13px/1.7 "PeydaWeb", Tahoma, sans-serif; white-space: normal;
}
body.np-family-page .np-family .np-pe-article ul.products li.product .button:hover { background: #07517d; }
body.np-family-page .np-family .np-pe-article ul.products li.product .price { color: var(--np-pe-blue); }

@media (max-width: 1000px) {
	.np-family .np-pe-app h3 { font-size: 18px; }
}
@media (max-width: 780px) {
	.np-family .np-pe-guide-nav nav { max-height: none; overflow: visible; }
	.np-family .np-pe-hero h1 { font-size: clamp(33px, 8.8vw, 43px); }
	.np-family .np-pe-app-grid { grid-template-columns: minmax(0, 1fr); }
	.np-family .np-pe-app h3 { font-size: 21px; }
	.np-family .np-family-media { padding: 16px 16px 66px; }
	.np-family .np-family-media img { max-height: 250px; }
	.np-family-related-grid { grid-template-columns: minmax(0, 1fr); gap: 12px; }
	body.np-family-page .np-family .np-pe-article ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
	body.np-family-page .np-family .np-pe-article ul.products li.product { padding: 10px; }
	body.np-family-page .np-family .np-pe-article ul.products li.product img { height: 120px; max-height: 120px; }
	body.np-family-page .np-family .np-pe-article ul.products li.product .woocommerce-loop-product__title { font-size: 14px; }
	body.np-family-page .np-family .np-pe-article ul.products li.product .ast-loop-product__link { font-size: 14px; }
}
@media (max-width: 520px) {
	.np-family .np-pe-specs strong { font-size: 14px; }
	.np-family .np-pe-article :is(.np-brands-row, div:has(> div > img[src*="/uploads/price/logo/"]), div:has(> div > a > img[src*="/uploads/price/logo/"]), .wp-block-columns:has(> .wp-block-column > figure > img[src*="/uploads/price/logo/"])) {
		grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px !important; padding: 12px;
	}
	.np-family .np-pe-article :is(.np-brands-row > a, div:has(> img[src*="/uploads/price/logo/"]), div:not(.np-brands-row):has(> a > img[src*="/uploads/price/logo/"]), .wp-block-column:has(> figure > img[src*="/uploads/price/logo/"])) {
		min-height: 208px; padding: 18px 10px !important; font-size: 16px;
	}
	.np-family .np-pe-article img[src*="/uploads/price/logo/"] { width: 96px !important; height: 88px !important; }
}