/*
 * GPIPL products (Phase 6): catalogue (archive + categories) and product pages.
 * Loaded only on those templates, in the "pages" layer. Print styles turn a product page into a
 * clean datasheet (name, model, description, features, specifications).
 */
@layer pages {
	/* ============================================================ Catalogue */
	.catalogue__header {
		padding-block: var(--space-l) var(--space-xl);
		background: var(--color-surface);
		border-bottom: var(--border);
	}
	.catalogue__header .breadcrumbs { margin-bottom: var(--space-l); }
	.catalogue__title { font-size: var(--step-5); max-width: 22ch; }
	.catalogue__intro { margin-top: var(--space-s); max-width: var(--measure-narrow); font-size: var(--step-1); line-height: var(--lh-snug); color: var(--color-text-muted); }

	.catalogue__body { padding-block: var(--space-xl) var(--space-2xl); }

	.catalogue-nav__list { display: flex; flex-wrap: wrap; gap: var(--space-2xs); margin: 0; padding: 0; }
	.catalogue-nav__chip {
		display: inline-flex;
		align-items: center;
		gap: 0.5em;
		min-height: var(--tap);
		padding: 0.35rem 0.9rem;
		border: 1px solid var(--color-line-strong);
		border-radius: var(--radius-s);
		color: var(--color-text);
		font-size: var(--step--1);
		font-weight: var(--wght-medium);
		font-stretch: var(--wdth-ui);
		line-height: 1.25;
		text-decoration: none;
		transition: border-color var(--dur-fast) var(--ease-out), background-color var(--dur-fast) var(--ease-out);
	}
	.catalogue-nav__chip:hover { border-color: var(--color-text); color: var(--color-text); }
	.catalogue-nav__count { color: var(--color-text-muted); font-stretch: var(--wdth-data); font-variant-numeric: tabular-nums; }
	.catalogue-nav__chip[aria-current="page"] { background: var(--color-heading); border-color: var(--color-heading); color: var(--color-bg); }
	.catalogue-nav__chip[aria-current="page"] .catalogue-nav__count { color: inherit; opacity: 0.85; }

	.catalogue__toolbar {
		display: grid;
		gap: var(--space-s);
		margin-top: var(--space-xl);
		padding-top: var(--space-l);
		border-top: var(--border);
	}
	@media (min-width: 64em) {
		.catalogue__toolbar { grid-template-columns: minmax(0, 32rem) auto; justify-content: space-between; align-items: end; }
	}
	.catalogue-search { display: grid; gap: var(--space-2xs); }
	.catalogue-search__row { display: flex; gap: var(--space-2xs); }
	.catalogue-search__row .input { flex: 1; min-width: 0; }
	.catalogue__count { display: flex; flex-wrap: wrap; align-items: center; gap: 0 var(--space-s); color: var(--color-text-muted); font-size: var(--step--1); }
	.catalogue__clear { display: inline-flex; align-items: center; min-height: var(--tap); }

	.catalogue__grid { --grid-min: 15.5rem; margin: var(--space-l) 0 0; padding: 0; }

	.catalogue__empty {
		margin-top: var(--space-l);
		padding: var(--space-xl);
		border: 1px dashed var(--color-line-strong);
		border-radius: var(--radius-m);
		display: grid;
		gap: var(--space-2xs);
		max-width: 44rem;
	}
	.catalogue__empty-title { font-size: var(--step-2); }
	.catalogue__empty p { color: var(--color-text-muted); }

	.catalogue-pagination { margin-top: var(--space-xl); }
	.catalogue-pagination .nav-links { display: flex; flex-wrap: wrap; gap: var(--space-2xs); }
	.catalogue-pagination .page-numbers {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		min-width: var(--tap);
		min-height: var(--tap);
		padding: 0 0.75rem;
		border: 1px solid var(--color-line-strong);
		border-radius: var(--radius-s);
		color: var(--color-text);
		text-decoration: none;
		font-variant-numeric: tabular-nums;
	}
	.catalogue-pagination a.page-numbers:hover { border-color: var(--color-text); }
	.catalogue-pagination .page-numbers.current { background: var(--color-heading); border-color: var(--color-heading); color: var(--color-bg); }
	.catalogue-pagination .page-numbers.dots { border-color: transparent; }

	.catalogue__cta { padding-bottom: var(--section-pad); }

	/* ============================================================ Product hero */
	.product-hero { padding-block: var(--space-m) var(--space-xl); border-bottom: var(--border); }
	.product-hero .breadcrumbs { margin-bottom: var(--space-l); }
	.product-hero__grid { display: grid; gap: var(--space-xl); }
	@media (min-width: 64em) {
		.product-hero__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--space-3xl); align-items: start; }
	}

	.product-gallery__main {
		display: grid;
		place-items: center;
		margin: 0;
		aspect-ratio: 4 / 3;
		padding: var(--space-l);
		border-radius: var(--radius-m);
		background: var(--palette-survey); /* product photos are shot on white */
		overflow: hidden;
	}
	.product-gallery__image { width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; }
	.product-gallery__placeholder { color: color-mix(in srgb, var(--palette-slate) 30%, var(--palette-survey)); }

	.product-gallery__thumbs { display: flex; flex-wrap: wrap; gap: var(--space-2xs); margin: var(--space-s) 0 0; padding: 0; }
	.product-gallery__thumb {
		display: grid;
		place-items: center;
		width: 4rem;
		height: 4rem;
		padding: 4px;
		border: 1px solid var(--color-line);
		border-radius: var(--radius-s);
		background: var(--palette-survey);
		transition: border-color var(--dur-fast) var(--ease-out);
	}
	.product-gallery__thumb img { width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; }
	.product-gallery__thumb:hover { border-color: var(--color-text); }
	.product-gallery__thumb[aria-current="true"] { border: 2px solid var(--color-accent); padding: 3px; }

	.product-hero__summary { display: grid; gap: var(--space-s); align-content: start; }
	.product-hero__category a { display: inline-flex; align-items: center; min-height: var(--tap); color: var(--color-text-muted); font-size: var(--step--1); text-decoration: none; }
	.product-hero__category a:hover { color: var(--color-link); text-decoration: underline; }
	.product-hero__title { font-size: var(--step-4); max-width: 24ch; }
	.product-hero__model {
		display: flex;
		flex-wrap: wrap;
		gap: 0.5em;
		align-items: baseline;
		padding-block: var(--space-2xs);
		border-block: var(--border);
		font-stretch: var(--wdth-data);
		font-variant-numeric: tabular-nums;
	}
	.product-hero__model span { color: var(--color-text-muted); }
	.product-hero__model strong { font-size: var(--step-1); }
	.product-hero__lead { max-width: 56ch; font-size: var(--step-1); line-height: var(--lh-snug); color: var(--color-text-muted); }
	.product-hero__actions { margin-top: var(--space-xs); }

	/* ============================================================ On this page */
	.product-toc { border-bottom: var(--border); }
	.product-toc__list { display: flex; flex-wrap: wrap; gap: 0 var(--space-l); margin: 0; padding: 0; }
	.product-toc__list a {
		display: inline-flex;
		align-items: center;
		min-height: var(--tap);
		color: var(--color-text-muted);
		font-size: var(--step--1);
		font-weight: var(--wght-medium);
		text-decoration: none;
	}
	.product-toc__list a:hover { color: var(--color-link); text-decoration: underline; }

	/* ============================================================ Sections (datasheet rows) */
	.product-section { scroll-margin-top: 6rem; }
	.product__body > .product-section + .product-section { border-top: var(--border); }
	.product-section__grid { display: grid; gap: var(--space-m); }
	@media (min-width: 64em) {
		.product-section__grid { grid-template-columns: 15rem minmax(0, 1fr); gap: var(--space-2xl); align-items: start; }
	}
	.product-section__title { font-size: var(--step-2); }

	.product-features {
		display: grid;
		gap: var(--space-xs) var(--space-xl);
		margin: 0;
		padding: 0;
	}
	@media (min-width: 48em) {
		.product-features { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	}
	.product-features li {
		position: relative;
		padding: var(--space-xs) 0 var(--space-xs) 1.25rem;
		border-bottom: var(--border);
		line-height: var(--lh-snug);
	}
	.product-features li::before {
		content: "";
		position: absolute;
		left: 0;
		top: calc(var(--space-xs) + 0.5em);
		width: 6px;
		height: 6px;
		background: var(--color-accent);
	}

	.product-applications { display: flex; flex-wrap: wrap; gap: var(--space-2xs); margin: 0; padding: 0; }
	.product-applications li {
		padding: 0.5rem 0.9rem;
		border: var(--border);
		border-radius: var(--radius-s);
		background: var(--color-surface);
		line-height: var(--lh-snug);
	}

	.product-downloads { display: grid; gap: 0; margin: 0; padding: 0; border-top: var(--border); }
	.product-download {
		display: grid;
		grid-template-columns: auto minmax(0, 1fr) auto;
		gap: var(--space-s);
		align-items: center;
		min-height: 4rem;
		padding: var(--space-s) var(--space-xs);
		border-bottom: var(--border);
		color: var(--color-text);
		text-decoration: none;
		transition: background-color var(--dur-fast) var(--ease-out);
	}
	.product-download:hover { background: var(--color-surface); color: var(--color-text); }
	.product-download:hover .product-download__title { text-decoration: underline; }
	.product-download__icon { color: var(--color-accent); }
	.product-download__text { display: grid; gap: 0.15rem; }
	.product-download__title { font-weight: var(--wght-semibold); }
	.product-download__meta { font-size: var(--step--1); color: var(--color-text-muted); font-stretch: var(--wdth-data); }
	.product-download__action { color: var(--color-link); }

	/* Video facade */
	.product-video { position: relative; aspect-ratio: 16 / 9; max-width: 56rem; border-radius: var(--radius-m); overflow: hidden; background: var(--palette-slate); }
	.product-video__facade { position: absolute; inset: 0; display: grid; place-items: center; color: var(--palette-paper); text-decoration: none; }
	.product-video__poster { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0.55; }
	.product-video__play {
		position: relative;
		display: inline-flex;
		align-items: center;
		gap: var(--space-xs);
		min-height: var(--tap);
		padding: var(--space-xs) var(--space-m);
		border-radius: var(--radius-s);
		background: var(--palette-slate);
		font-weight: var(--wght-semibold);
	}
	.product-video__play-icon { width: 0; height: 0; border-style: solid; border-width: 7px 0 7px 12px; border-color: transparent transparent transparent currentColor; }
	.product-video__facade:hover .product-video__play { text-decoration: underline; }
	.product-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

	/* Related solutions / industries */
	.product-links { display: grid; gap: var(--space-xl); }
	@media (min-width: 48em) {
		.product-links { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-2xl); }
	}
	.product-links__title { font-size: var(--step-1); margin-bottom: var(--space-xs); }
	.product-links__list { margin: 0; padding: 0; border-top: 2px solid var(--color-text); }
	.product-links__list a {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: var(--space-s);
		min-height: 3.25rem;
		border-bottom: var(--border);
		color: var(--color-heading);
		font-weight: var(--wght-semibold);
		text-decoration: none;
	}
	.product-links__list a .icon { color: var(--color-accent); }
	.product-links__list a:hover span { text-decoration: underline; }

	.product-related__title { font-size: var(--step-3); margin-bottom: var(--space-l); }
	.product-related ul { margin: 0; padding: 0; }

	/* ============================================================ Print: product datasheet */
	@media print {
		.site-header, .site-footer, .skip-link, .breadcrumbs, .product-toc, .product-gallery__thumbs,
		.product-hero__actions, .product-video, #product-video, .product-related, .product-enquiry,
		.product-links, .catalogue-nav, .catalogue__toolbar, .catalogue__cta, .gpipl-flag { display: none !important; }
		.product-hero { border: 0; padding: 0 0 12pt; }
		.product-hero__grid { grid-template-columns: 40% 1fr; gap: 18pt; }
		.product-gallery__main { background: none; padding: 0; }
		.product-section { padding-block: 10pt; break-inside: avoid-page; }
		.product-section__grid { grid-template-columns: 1fr; gap: 6pt; }
		a { color: inherit; text-decoration: none; }
	}
}

/*
 * Theme 0.28.0: catalogue filter bar (category dropdown + search) and the grouped "all products" view.
 * Layer "polish" so these win over the older toolbar rules above.
 */
@layer polish {
	.catalogue-filter {
		position: relative;
		display: grid;
		gap: var(--space-s);
		margin-top: var(--space-l);
		padding: var(--space-m);
		border: 1px solid var(--color-line);
		border-radius: 1rem;
		background: var(--color-bg);
		box-shadow: 0 18px 40px -30px rgb(16 24 40 / 0.35);
	}
	@media (min-width: 52em) {
		.catalogue-filter { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr) auto; align-items: end; padding: var(--space-m) var(--space-l); }
	}
	.catalogue-filter.is-loading { opacity: 0.7; pointer-events: none; }
	.catalogue-filter__label { display: block; margin-bottom: 0.4rem; font-size: 0.8rem; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; color: var(--color-text-muted); }
	.catalogue-filter__select,
	.catalogue-filter__search {
		position: relative;
		display: flex;
		align-items: center;
	}
	.catalogue-filter__icon { position: absolute; left: 0.95rem; width: 1.05rem; height: 1.05rem; color: var(--palette-green); pointer-events: none; }
	.catalogue-filter__chevron { position: absolute; right: 0.95rem; width: 1.1rem; height: 1.1rem; color: var(--color-text-muted); pointer-events: none; }
	.catalogue-filter select,
	.catalogue-filter input[type="search"] {
		width: 100%;
		min-height: 3.1rem;
		padding: 0 1rem 0 2.75rem;
		border: 1px solid var(--color-control-border);
		border-radius: 0.75rem;
		background: var(--palette-survey);
		color: var(--color-heading);
		font: inherit;
		font-size: var(--step-0);
		transition: border-color 200ms var(--ease-out), box-shadow 200ms var(--ease-out), background-color 200ms var(--ease-out);
	}
	.catalogue-filter select { appearance: none; padding-right: 2.6rem; font-weight: 600; cursor: pointer; text-overflow: ellipsis; }
	.catalogue-filter select:hover,
	.catalogue-filter input[type="search"]:hover { border-color: var(--palette-green); }
	.catalogue-filter select:focus-visible,
	.catalogue-filter input[type="search"]:focus-visible {
		outline: none;
		border-color: var(--palette-green);
		background: var(--palette-paper);
		box-shadow: 0 0 0 4px color-mix(in srgb, var(--palette-green) 16%, transparent);
	}
	.catalogue-filter__submit { min-height: 3.1rem; white-space: nowrap; }

	.catalogue__toolbar { margin-top: var(--space-m); padding-top: 0; border-top: 0; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-xs) var(--space-m); }
	.catalogue__toolbar .catalogue__count { margin: 0; }

	/* Jump links (grouped view) */
	.catalogue-jump {
		position: sticky;
		top: calc(var(--header-h, 4.5rem) + 0.5rem);
		z-index: 5;
		margin-top: var(--space-m);
		padding: 0.5rem;
		border: 1px solid var(--color-line);
		border-radius: 999px;
		background: color-mix(in srgb, var(--palette-paper) 92%, transparent);
		backdrop-filter: blur(8px);
	}
	.catalogue-jump__list { display: flex; gap: 0.35rem; margin: 0; padding: 0; list-style: none; overflow-x: auto; scrollbar-width: none; }
	.catalogue-jump__list::-webkit-scrollbar { display: none; }
	.catalogue-jump__list > li { flex: none; }
	.catalogue-jump a {
		display: inline-flex;
		align-items: center;
		gap: 0.4rem;
		min-height: 2.4rem;
		padding: 0 0.9rem;
		border-radius: 999px;
		color: var(--color-text);
		font-size: var(--step--1);
		font-weight: 600;
		text-decoration: none;
		white-space: nowrap;
		transition: background-color 200ms var(--ease-out), color 200ms var(--ease-out);
	}
	.catalogue-jump a span { padding: 0 0.45rem; border-radius: 999px; background: var(--palette-survey); color: var(--color-text-muted); font-size: 0.75rem; font-variant-numeric: tabular-nums; }
	.catalogue-jump a:hover { background: var(--palette-green); color: var(--on-brand); }
	.catalogue-jump a:hover span { background: rgb(255 255 255 / 0.2); color: inherit; }

	/* Category sections */
	.catalogue-group { margin-top: var(--space-2xl); scroll-margin-top: calc(var(--header-h, 4.5rem) + 5rem); }
	.catalogue-group__head {
		display: grid;
		grid-template-columns: minmax(0, 1fr) auto;
		align-items: start;
		gap: var(--space-s) var(--space-l);
		padding-bottom: var(--space-s);
		border-bottom: 2px solid var(--color-line);
		position: relative;
	}
	.catalogue-group__head::after { content: ""; position: absolute; left: 0; bottom: -2px; width: 4.5rem; height: 2px; background: var(--palette-green); }
	.catalogue-group__title { margin: 0; font-size: var(--step-2); line-height: 1.2; color: var(--color-heading); }
	.catalogue-group__count { display: inline-block; margin-left: 0.5rem; padding: 0.15rem 0.6rem; border-radius: 999px; background: color-mix(in srgb, var(--palette-green) 12%, var(--palette-paper)); color: var(--color-accent-strong); font-size: 0.8rem; font-weight: 700; vertical-align: middle; }
	.catalogue-group__subs { display: flex; flex-wrap: wrap; gap: 0.4rem; margin: 0.6rem 0 0; padding: 0; list-style: none; }
	.catalogue-group__subs a {
		display: inline-flex;
		align-items: center;
		min-height: 2rem;
		padding: 0 0.75rem;
		border: 1px solid var(--color-line);
		border-radius: 999px;
		color: var(--color-text);
		font-size: 0.8rem;
		text-decoration: none;
	}
	.catalogue-group__subs a:hover { border-color: var(--palette-green); color: var(--palette-green); }
	.catalogue-group__all { display: inline-flex; align-items: center; gap: 0.35rem; margin-top: 0.4rem; font-weight: 700; white-space: nowrap; }
	@media (max-width: 40em) {
		.catalogue-group__head { grid-template-columns: 1fr; }
		.catalogue-group__all { justify-self: start; margin-top: 0; }
	}
	.catalogue-group__all .icon { width: 1rem; height: 1rem; transition: transform 200ms var(--ease-out); }
	.catalogue-group__all:hover .icon { transform: translateX(3px); }
	.catalogue-group .catalogue__grid { margin-top: var(--space-m); }
}

/* "Browse by category" panel (theme 0.28.1): category → subcategory → product names. */
@layer polish {
	.catalogue-browse { position: static; }
	.catalogue-browse__toggle {
		position: relative;
		display: flex;
		align-items: center;
		min-height: 3.1rem;
		padding: 0 2.6rem 0 2.75rem;
		border: 1px solid var(--color-control-border);
		border-radius: 0.75rem;
		background: var(--palette-survey);
		color: var(--color-heading);
		font-weight: 600;
		cursor: pointer;
		list-style: none;
		user-select: none;
		transition: border-color 200ms var(--ease-out), box-shadow 200ms var(--ease-out), background-color 200ms var(--ease-out);
	}
	.catalogue-browse__toggle::-webkit-details-marker { display: none; }
	.catalogue-browse__toggle:hover { border-color: var(--palette-green); }
	.catalogue-browse__toggle:focus-visible { outline: none; border-color: var(--palette-green); box-shadow: 0 0 0 4px color-mix(in srgb, var(--palette-green) 16%, transparent); }
	.catalogue-browse[open] .catalogue-browse__toggle { border-color: var(--palette-green); background: var(--palette-paper); }
	.catalogue-browse[open] .catalogue-filter__chevron { transform: rotate(180deg); }
	.catalogue-filter__chevron { transition: transform 250ms var(--ease-out); }
	.catalogue-browse__current { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }

	.catalogue-browse__panel {
		position: absolute;
		z-index: 40;
		left: 0;
		right: 0;
		top: calc(100% + 0.5rem);
		max-height: min(72vh, 46rem);
		overflow: auto;
		overscroll-behavior: contain;
		padding: var(--space-m) var(--space-l) var(--space-l);
		border: 1px solid var(--color-line);
		border-radius: 1rem;
		background: var(--palette-paper);
		box-shadow: 0 40px 80px -30px rgb(16 24 40 / 0.45);
		animation: gpipl-dialog-in 260ms var(--ease-out) both;
	}
	.catalogue-browse__top {
		position: sticky;
		top: calc(var(--space-m) * -1);
		z-index: 1;
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		justify-content: space-between;
		gap: var(--space-s);
		margin: calc(var(--space-m) * -1) calc(var(--space-l) * -1) var(--space-m);
		padding: var(--space-m) var(--space-l) var(--space-s);
		border-bottom: 1px solid var(--color-line);
		background: var(--palette-paper);
	}
	.catalogue-browse__all {
		display: inline-flex;
		align-items: center;
		gap: 0.5rem;
		min-height: 2.5rem;
		padding: 0 1rem;
		border-radius: 999px;
		background: color-mix(in srgb, var(--palette-green) 10%, var(--palette-paper));
		color: var(--color-accent-strong);
		font-weight: 700;
		text-decoration: none;
	}
	.catalogue-browse__all .icon { width: 1rem; height: 1rem; }
	.catalogue-browse__all:hover, .catalogue-browse__all.is-current { background: var(--palette-green); color: var(--on-brand); }
	.catalogue-browse__find { position: relative; display: flex; align-items: center; flex: 1 1 16rem; max-width: 24rem; }
	.catalogue-browse__find .icon { position: absolute; left: 0.8rem; width: 1rem; height: 1rem; color: var(--color-text-muted); }
	.catalogue-browse__find input {
		width: 100%;
		min-height: 2.5rem;
		padding: 0 0.9rem 0 2.3rem;
		border: 1px solid var(--color-line-strong);
		border-radius: 999px;
		background: var(--palette-survey);
		font: inherit;
		font-size: var(--step--1);
	}
	.catalogue-browse__find input:focus { outline: none; border-color: var(--palette-green); background: var(--palette-paper); }

	.catalogue-browse__cols { columns: 17rem 4; column-gap: var(--space-xl); }
	.catalogue-browse__group { break-inside: avoid; margin: 0 0 var(--space-l); }
	.catalogue-browse__cat {
		display: block;
		margin-bottom: 0.45rem;
		padding-bottom: 0.4rem;
		border-bottom: 2px solid color-mix(in srgb, var(--palette-green) 35%, var(--color-line));
		color: var(--color-heading);
		font-size: var(--step-0);
		font-weight: 800;
		line-height: 1.3;
		text-decoration: none;
	}
	a.catalogue-browse__cat:hover, .catalogue-browse__cat.is-current { color: var(--palette-green); }
	.catalogue-browse__sub { break-inside: avoid; margin: 0.55rem 0 0.2rem 0.15rem; padding-left: 0.7rem; border-left: 2px solid var(--color-line); }
	.catalogue-browse__subcat { display: block; margin-bottom: 0.2rem; color: var(--color-accent-strong); font-size: 0.82rem; font-weight: 700; letter-spacing: 0.02em; text-transform: uppercase; text-decoration: none; }
	.catalogue-browse__subcat:hover, .catalogue-browse__subcat.is-current { color: var(--palette-green); text-decoration: underline; }
	.catalogue-browse__products { margin: 0; padding: 0; list-style: none; }
	.catalogue-browse__products li a {
		position: relative;
		display: block;
		padding: 0.22rem 0 0.22rem 0.9rem;
		color: var(--color-text);
		font-size: var(--step--1);
		line-height: 1.4;
		text-decoration: none;
		border-radius: 0.35rem;
	}
	.catalogue-browse__products li a::before { content: ""; position: absolute; left: 0.15rem; top: 0.72em; width: 0.32rem; height: 0.32rem; border-radius: 50%; background: var(--color-line-strong); transition: background-color 150ms; }
	.catalogue-browse__products li a:hover { color: var(--palette-green); background: color-mix(in srgb, var(--palette-green) 6%, transparent); }
	.catalogue-browse__products li a:hover::before { background: var(--palette-green); }
	.catalogue-browse__none { margin: var(--space-m) 0 0; color: var(--color-text-muted); }

	@media (max-width: 40em) {
		.catalogue-browse__panel { padding: var(--space-s) var(--space-m) var(--space-m); max-height: 70vh; }
		.catalogue-browse__top { margin: calc(var(--space-s) * -1) calc(var(--space-m) * -1) var(--space-s); padding: var(--space-s) var(--space-m); top: calc(var(--space-s) * -1); }
		.catalogue-browse__find { max-width: none; }
	}
	@media (prefers-reduced-motion: reduce) { .catalogue-browse__panel { animation: none; } }
}

/* Product datasheet card: under the enquiry button (Products → Downloads → "Datasheet (PDF)"). */
@layer polish {
	.product-datasheet {
		display: flex;
		align-items: center;
		gap: var(--space-s);
		max-width: 30rem;
		margin-top: var(--space-s);
		padding: 0.8rem 1rem;
		color: var(--color-text);
		text-decoration: none;
		background: color-mix(in srgb, var(--palette-green) 5%, var(--color-surface, #fff));
		border: 1px solid color-mix(in srgb, var(--palette-green) 28%, var(--color-line));
		border-radius: 0.85rem;
		transition: border-color 160ms, box-shadow 160ms, transform 160ms;
	}
	.product-datasheet:hover { border-color: var(--palette-green); box-shadow: 0 10px 24px -16px color-mix(in srgb, var(--palette-green) 70%, transparent); transform: translateY(-1px); }
	.product-datasheet:focus-visible { outline: 3px solid var(--color-focus, var(--palette-green)); outline-offset: 3px; }
	.product-datasheet__icon {
		position: relative;
		display: grid;
		flex: none;
		place-items: center;
		width: 2.75rem;
		height: 2.75rem;
		color: #fff;
		background: #c8372d;
		border-radius: 0.6rem;
	}
	.product-datasheet__icon svg { width: 1.35rem; height: 1.35rem; }
	.product-datasheet__icon::after { content: "PDF"; position: absolute; bottom: -0.45rem; padding: 0 0.3rem; font-size: 0.6rem; font-weight: 800; letter-spacing: 0.04em; color: #c8372d; background: #fff; border: 1px solid #c8372d; border-radius: 0.3rem; line-height: 1.35; }
	.product-datasheet__text { display: grid; flex: 1; min-width: 0; gap: 0.1rem; }
	.product-datasheet__title { font-weight: var(--wght-semibold, 600); line-height: 1.3; }
	.product-datasheet__meta { overflow: hidden; color: var(--color-text-muted); font-size: var(--step--1); white-space: nowrap; text-overflow: ellipsis; }
	.product-datasheet__go { display: grid; flex: none; place-items: center; width: 2.25rem; height: 2.25rem; color: var(--palette-green); border-radius: 50%; background: color-mix(in srgb, var(--palette-green) 12%, transparent); transition: background-color 160ms, color 160ms; }
	.product-datasheet__go svg { width: 1.1rem; height: 1.1rem; }
	.product-datasheet:hover .product-datasheet__go { color: #fff; background: var(--palette-green); }
	@media (max-width: 40em) { .product-datasheet { max-width: none; } }
	@media (prefers-reduced-motion: reduce) { .product-datasheet { transition: none; } .product-datasheet:hover { transform: none; } }
	@media print { .product-datasheet { display: none !important; } }
}
