/*
 * Product pages (parts/product-sheet/*, catalog.product-sheet), the owner's pick of round 2
 * (Showroom, 2026-10-16). Loaded after Home B's file, whose tokens, type, buttons, header,
 * footer, questions, reviews and Talk to us these pages reuse through the hdc-home-b body
 * class.
 *
 * Home B's rules hold: square corners, hairlines and type for structure, no shadows, no
 * pills or count bubbles, yellow only as the Call fill and the stars, never yellow text or
 * rules on white. Icons are the detailed set (parts/product-sheet/badges.php), colored by
 * meaning: yellow machines and loads, steel metal, blueprint blue drawings and glass, green
 * warranty and checks, red the hospital cross (owner, 2026-10-16). Section titles are words only.
 * Breakpoints 40rem, 48rem, 64rem, 80rem. Layout rules are not nested.
 */

@layer tokens {
	body.hdc-pdp {
		/* The blueprint ground of Your route, for the fit check. */
		--p-ground: #eceff3;
		--p-rule: #cfd7df;
		--p-mute: #56616c;
		--p-ok: #1b7a3a;
		--p-bad: #b42318;
		--p-jump: 3rem;
		--p-space: 3.5rem;
		/* The detailed icons' colors. */
		--bd-steel: #d9dee3;
		--bd-blue: #2f5f80;
		--bd-blue-light: #dce8f1;
		--bd-green-light: #dcefe2;
		--bd-red: #c62828;
	}

	@media (min-width: 64rem) {
		body.hdc-pdp {
			--p-jump: 3.5rem;
			--p-space: 6rem;
		}
	}
}

@layer components {
	/* Sections land under the header's bar and the jump row. */
	.hdc-pdp .hdc-pdp-sec,
	.hdc-pdp #reviews,
	.hdc-pdp details[data-hdc-b-form] {
		scroll-margin-top: calc(var(--sticky) + var(--p-jump) + 0.5rem);
	}

	/* Staging only: the variation switch above the header. */
	.hdc-pdp .hdc-pdp-preview {
		background: var(--ink);
		color: var(--white);
	}

	.hdc-pdp .hdc-pdp-preview__row {
		display: flex;
		flex-wrap: wrap;
		gap: 0 1.25rem;
		padding-block: 0.375rem;
		font-size: 0.8125rem;
		font-weight: 700;
		--link: var(--fog);
		--link-hover: var(--white);
		--link-line: none;
		--link-hover-line: underline;
	}

	.hdc-pdp .hdc-pdp-preview__link[aria-current] {
		color: var(--accent);
		text-decoration: underline;
	}

	/* ---------------------------------------------------------------- Breadcrumb */
	.hdc-pdp .hdc-pdp-crumbs__list {
		display: flex;
		flex-wrap: wrap;
		gap: 0.25rem 0;
		margin: 0;
		padding: 1rem 0 0;
		list-style: none;
		color: var(--steel);
		font-size: 0.875rem;
		--link: var(--steel);
		--link-hover: var(--ink);
		--link-line: none;
		--link-hover-line: underline;
	}

	.hdc-pdp .hdc-pdp-crumbs__item + .hdc-pdp-crumbs__item::before {
		content: "/";
		margin-inline: 0.5rem;
		color: var(--control);
	}

	.hdc-pdp .hdc-pdp-crumbs__item [aria-current] {
		color: var(--ink);
		font-weight: 600;
	}

	/* ---------------------------------------------------------------- Top */
	.hdc-pdp .hdc-pdp-top {
		padding-bottom: 3rem;
		background: var(--white);
	}

	/* Phones: photos, head, numbers, buy, from the two column wrappers. */
	.hdc-pdp .hdc-pdp-top__grid {
		display: flex;
		flex-direction: column;
		gap: 1.5rem;
		margin-top: 1rem;
	}

	.hdc-pdp .hdc-pdp-top__left,
	.hdc-pdp .hdc-pdp-top__right {
		display: contents;
	}

	.hdc-pdp .hdc-pdp-top__media {
		order: 1;
		min-width: 0;
		margin-inline: calc(-1 * var(--gutter));
	}

	.hdc-pdp .hdc-pdp-top__head {
		order: 2;
		min-width: 0;
	}

	.hdc-pdp .hdc-pdp-top__numbers {
		order: 3;
	}

	.hdc-pdp .hdc-pdp-top__buy {
		display: grid;
		order: 4;
		gap: 1.5rem;
		min-width: 0;
	}

	.hdc-pdp .hdc-pdp-top__kicker {
		margin: 0;
		font-size: 0.9375rem;
		font-weight: 700;
		--link: var(--steel);
		--link-hover: var(--ink);
		--link-line: none;
		--link-hover-line: underline;
	}

	.hdc-pdp .hdc-pdp-top__h1 {
		margin: 0.375rem 0 1.5rem;
		color: var(--ink);
		font-size: clamp(2.25rem, 1.55rem + 2.6vw, 3.75rem);
		font-stretch: 75%;
		font-weight: 800;
		letter-spacing: -0.005em;
		line-height: 0.95;
		text-wrap: balance;
	}

	/* Identity row: Availability first and widest, Brand, Model, hairlines between. */
	.hdc-pdp .hdc-pdp-id {
		display: grid;
		grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr) minmax(0, 1fr);
		margin: 0;
		border-block: 1px solid var(--line);
	}

	.hdc-pdp .hdc-pdp-id__cell {
		display: flex;
		flex-direction: column;
		gap: 0.25rem;
		min-width: 0;
		padding: 0.875rem 0.875rem 0.875rem 0;
	}

	.hdc-pdp .hdc-pdp-id__cell + .hdc-pdp-id__cell {
		padding-left: 0.875rem;
		border-left: 1px solid var(--line);
	}

	.hdc-pdp .hdc-pdp-id dt {
		color: var(--steel);
		font-size: 0.75rem;
		font-weight: 700;
		letter-spacing: 0.03em;
	}

	.hdc-pdp .hdc-pdp-id dd {
		display: flex;
		flex-direction: column;
		gap: 0.25rem;
		margin: 0;
		color: var(--ink);
		font-size: 1rem;
		font-weight: 700;
		line-height: 1.25;
		overflow-wrap: anywhere;
		--link: var(--ink);
		--link-hover: var(--ink);
		--link-line: underline;
	}

	.hdc-pdp .hdc-pdp-id__state {
		display: inline-flex;
		align-items: center;
		gap: 0.5rem;
	}

	.hdc-pdp .hdc-pdp-id__state::before {
		content: "";
		flex: none;
		width: 0.625rem;
		height: 0.625rem;
		border: 1.5px solid var(--ink);
		border-radius: 50%;
		background: var(--white);
	}

	.hdc-pdp .hdc-pdp-id__state--in_stock::before {
		border-color: var(--p-ok);
		background: var(--p-ok);
	}

	.hdc-pdp .hdc-pdp-id__state--discontinued::before {
		border-color: var(--steel);
		background: var(--steel);
	}

	.hdc-pdp .hdc-pdp-id__lead {
		color: var(--steel);
		font-size: 0.8125rem;
		font-weight: 600;
	}

	/* Key numbers: each figure under its icon and label, on a hairline grid. */
	.hdc-pdp .hdc-pdp-numbers {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 1px;
		margin: 0;
		border-block: 1px solid var(--line);
		background: var(--line);
	}

	.hdc-pdp .hdc-pdp-numbers__item {
		display: flex;
		flex-direction: column;
		gap: 0.625rem;
		padding: 1.125rem 0.875rem 1.25rem;
		background: var(--white);
	}

	.hdc-pdp .hdc-pdp-numbers__item:last-child:nth-child(odd) {
		grid-column: 1 / -1;
	}

	.hdc-pdp .hdc-pdp-numbers dt {
		display: flex;
		align-items: center;
		gap: 0.5rem;
		color: var(--steel);
		font-size: 0.8125rem;
		font-weight: 700;
	}

	.hdc-pdp .hdc-pdp-numbers__icon {
		flex: none;
		width: 1.375rem;
		height: 1.375rem;
		color: var(--ink);
	}

	.hdc-pdp .hdc-pdp-numbers dd {
		display: flex;
		flex-direction: column;
		gap: 0.25rem;
		margin: 0;
		color: var(--ink);
		font-size: clamp(1.75rem, 1.45rem + 1.1vw, 2.5rem);
		font-stretch: 75%;
		font-weight: 800;
		font-variant-numeric: tabular-nums;
		line-height: 1;
	}

	.hdc-pdp .hdc-pdp-numbers__note {
		color: var(--steel);
		font-size: 0.8125rem;
		font-stretch: 100%;
		font-weight: 600;
		line-height: 1.2;
	}

	/* The price line, in the price's place. */
	.hdc-pdp .hdc-pdp-price {
		display: grid;
		grid-template-columns: auto minmax(0, 1fr);
		column-gap: 0.875rem;
		align-items: center;
	}

	.hdc-pdp .hdc-pdp-price__icon {
		grid-row: 1 / span 2;
		width: 2rem;
		height: 2rem;
		color: var(--ink);
	}

	.hdc-pdp .hdc-pdp-price__title {
		margin: 0;
		color: var(--ink);
		font-size: clamp(1.5rem, 1.3rem + 0.8vw, 2rem);
		font-stretch: 75%;
		font-weight: 800;
		line-height: 1.05;
	}

	.hdc-pdp .hdc-pdp-price__text {
		margin: 0.25rem 0 0;
		color: var(--steel);
		font-size: 0.9375rem;
		font-weight: 600;
		line-height: 1.35;
	}

	/* The freight callout: two cells in one frame, a hairline between. */
	.hdc-pdp .hdc-pdp-ship {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		margin: -0.5rem 0 0;
		padding: 0;
		border: 1px solid var(--line);
		list-style: none;
	}

	.hdc-pdp .hdc-pdp-ship__cell {
		display: grid;
		grid-template-columns: auto minmax(0, 1fr);
		column-gap: 0.625rem;
		align-content: start;
		padding: 0.875rem;
	}

	.hdc-pdp .hdc-pdp-ship__cell + .hdc-pdp-ship__cell {
		border-left: 1px solid var(--line);
	}

	.hdc-pdp .hdc-pdp-ship__icon {
		grid-row: 1 / span 2;
		width: 1.5rem;
		height: 1.5rem;
		color: var(--ink);
	}

	.hdc-pdp .hdc-pdp-ship__title {
		color: var(--ink);
		font-size: 0.9375rem;
		font-weight: 700;
		line-height: 1.25;
	}

	.hdc-pdp .hdc-pdp-ship__text {
		margin-top: 0.125rem;
		color: var(--steel);
		font-size: 0.8125rem;
		line-height: 1.35;
	}

	/* Proof icons: two by two, each under its square, and the maker's line. */
	.hdc-pdp .hdc-pdp-proof {
		padding-block: 1.25rem;
		border-block: 1px solid var(--line);
	}

	.hdc-pdp .hdc-pdp-proof__list {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 1.25rem 1rem;
		margin: 0;
		padding: 0;
		list-style: none;
	}

	.hdc-pdp .hdc-pdp-proof__item {
		display: grid;
		grid-template-columns: auto minmax(0, 1fr);
		column-gap: 0.75rem;
		align-content: start;
	}

	.hdc-pdp .hdc-pdp-proof__mark {
		grid-row: 1 / span 2;
	}

	.hdc-pdp .hdc-pdp-proof__title {
		color: var(--ink);
		font-size: 0.9375rem;
		font-weight: 750;
		line-height: 1.2;
	}

	.hdc-pdp .hdc-pdp-proof__text {
		margin-top: 0.125rem;
		color: var(--steel);
		font-size: 0.8125rem;
		line-height: 1.35;
	}

	.hdc-pdp .hdc-pdp-proof__maker {
		margin: 1.125rem 0 0;
		padding-top: 1rem;
		border-top: 1px dashed var(--p-rule);
		color: var(--body);
		font-size: 0.9375rem;
		line-height: 1.5;
	}

	/* Parent store ratings: two even halves, a hairline between, the label under both. */
	.hdc-pdp .hdc-pdp-rates {
		border: 1px solid var(--line);
	}

	.hdc-pdp .hdc-pdp-rates__row {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.hdc-pdp .hdc-pdp-rate {
		display: grid;
		justify-items: center;
		gap: 0.375rem;
		padding: 1rem 0.75rem 0.875rem;
		color: var(--ink);
		text-align: center;
		text-decoration: none;
		transition: background-color 0.15s;
		--link: var(--ink);
		--link-hover: var(--ink);
		--link-line: none;
		--link-hover-line: none;
	}

	.hdc-pdp .hdc-pdp-rate + .hdc-pdp-rate {
		border-left: 1px solid var(--line);
	}

	.hdc-pdp .hdc-pdp-rate:hover {
		background: var(--panel);
	}

	.hdc-pdp .hdc-pdp-rate__logo {
		display: inline-flex;
		align-items: center;
		gap: 0.375rem;
		min-height: 1.5rem;
		font-size: 0.9375rem;
		font-weight: 700;
	}

	.hdc-pdp .hdc-pdp-rate__logo .hdc-rv-logo {
		width: 1.25rem;
		height: 1.25rem;
	}

	.hdc-pdp .hdc-pdp-rate__logo .hdc-rv-logo--full {
		width: auto;
		height: 1.375rem;
	}

	.hdc-pdp .hdc-pdp-rate__num {
		font-size: 2.25rem;
		font-stretch: 75%;
		font-weight: 800;
		font-variant-numeric: tabular-nums;
		line-height: 1;
	}

	.hdc-pdp .hdc-pdp-rate__stars {
		font-size: 1.125rem;
	}

	.hdc-pdp .hdc-pdp-rate__count {
		color: var(--steel);
		font-size: 0.8125rem;
		font-weight: 700;
		text-decoration: underline;
		text-underline-offset: 0.2em;
	}

	.hdc-pdp .hdc-pdp-rates__label {
		margin: 0;
		padding: 0.625rem 0.75rem;
		border-top: 1px solid var(--line);
		background: var(--panel);
		color: var(--body);
		font-size: 0.8125rem;
		font-weight: 600;
		text-align: center;
	}

	/* Stars: an unlit row under a lit row clipped to the rating (reviews-lib.php). */
	.hdc-pdp .hdc-rv-stars {
		display: inline-flex;
		position: relative;
		line-height: 0;
	}

	.hdc-pdp .hdc-rv-stars__unlit,
	.hdc-pdp .hdc-rv-stars__lit {
		display: flex;
		gap: 0.125em;
	}

	.hdc-pdp .hdc-rv-stars__unlit {
		color: var(--fog);
	}

	.hdc-pdp .hdc-rv-stars__lit {
		position: absolute;
		inset: 0 auto 0 0;
		width: calc(var(--full) * 1.125em + var(--frac) * 1em);
		overflow: hidden;
		color: var(--accent);
	}

	.hdc-pdp .hdc-rv-stars__star {
		flex: none;
		width: 1em;
		height: 1em;
		fill: currentColor;
	}

	.hdc-pdp .hdc-rv-out {
		display: inline-block;
		width: 0.875em;
		height: 0.875em;
		margin-left: 0.25em;
		vertical-align: -0.1em;
	}

	/* Actions: the quote button, then the phone box, last and largest. */
	.hdc-pdp .hdc-pdp-actions {
		display: grid;
		gap: 0.75rem;
	}

	.hdc-pdp .hdc-pdp-actions__quote {
		width: 100%;
		min-height: 3.5rem;
	}

	.hdc-pdp .hdc-pdp-call {
		display: grid;
		position: relative;
		grid-template-columns: auto minmax(0, 1fr);
		column-gap: 1rem;
		align-items: center;
		padding: 1rem 1.25rem;
		border: 2px solid var(--ink);
		background: var(--accent);
		color: var(--ink);
		transition: background-color 0.15s;
	}

	.hdc-pdp .hdc-pdp-call:hover {
		background: var(--accent-strong);
	}

	.hdc-pdp .hdc-pdp-call:focus-within {
		outline: var(--focus-ring);
		outline-offset: var(--focus-offset);
	}

	.hdc-pdp .hdc-pdp-call__icon {
		display: inline-flex;
		grid-row: 1 / span 3;
		align-items: center;
		justify-content: center;
		width: 3rem;
		height: 3rem;
		background: var(--ink);
		color: var(--accent);
	}

	.hdc-pdp .hdc-pdp-call__icon .hdc-icon {
		width: 1.5rem;
		height: 1.5rem;
	}

	.hdc-pdp .hdc-pdp-call__label {
		font-size: 0.8125rem;
		font-weight: 700;
	}

	.hdc-pdp .hdc-pdp-call__number {
		color: var(--ink);
		font-size: clamp(1.625rem, 1.35rem + 1vw, 2.125rem);
		font-stretch: 75%;
		font-weight: 800;
		font-variant-numeric: tabular-nums;
		line-height: 1.1;
		text-decoration: none;
		white-space: nowrap;
		--link: var(--ink);
		--link-hover: var(--ink);
		--link-line: none;
		--link-hover-line: none;
	}

	.hdc-pdp .hdc-pdp-call__number::after {
		content: "";
		position: absolute;
		inset: 0;
	}

	.hdc-pdp .hdc-pdp-call__number:focus-visible {
		outline: none;
	}

	.hdc-pdp .hdc-pdp-call__note {
		font-size: 0.875rem;
		font-weight: 600;
	}

	.hdc-pdp .hdc-pdp-downloads {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		gap: 0.25rem 1.25rem;
	}

	.hdc-pdp .hdc-pdp-downloads__label {
		margin: 0;
		color: var(--steel);
		font-size: 0.8125rem;
		font-weight: 700;
	}

	.hdc-pdp .hdc-pdp-downloads__list {
		display: flex;
		flex-wrap: wrap;
		gap: 0 1.25rem;
		margin: 0;
		padding: 0;
		list-style: none;
		--link: var(--ink);
		--link-hover: var(--ink);
		--link-line: underline;
	}

	.hdc-pdp .hdc-pdp-downloads__list a {
		display: inline-flex;
		align-items: center;
		gap: 0.375rem;
		min-height: 2.75rem;
		font-size: 0.9375rem;
		font-weight: 700;
		text-underline-offset: 0.2em;
	}

	.hdc-pdp .hdc-pdp-downloads__list .hdc-icon {
		width: 1.125rem;
		height: 1.125rem;
	}

	.hdc-pdp .hdc-pdp-downloads__type {
		color: var(--steel);
		font-size: 0.75rem;
	}

	/* ---------------------------------------------------------------- Gallery */
	.hdc-pdp .hdc-product-gallery {
		position: relative;
	}

	.hdc-pdp .hdc-product-gallery--empty {
		aspect-ratio: 4 / 3;
		background: var(--panel);
	}

	.hdc-pdp .hdc-product-gallery__viewport {
		overflow-x: auto;
		overscroll-behavior-x: contain;
		scroll-snap-type: x mandatory;
		scrollbar-width: none;
	}

	.hdc-pdp .hdc-product-gallery__viewport::-webkit-scrollbar {
		display: none;
	}

	.hdc-pdp .hdc-product-gallery__viewport:focus-visible {
		outline: var(--focus-ring);
		outline-offset: -3px;
	}

	.hdc-pdp .hdc-product-gallery__track {
		display: grid;
		grid-auto-columns: 88%;
		grid-auto-flow: column;
		gap: 0.5rem;
		margin: 0;
		padding: 0;
		list-style: none;
	}

	.hdc-pdp .hdc-product-gallery--one .hdc-product-gallery__track {
		grid-auto-columns: 100%;
	}

	/* Positioned, so the slides' visually hidden labels stay inside the scrolling row. */
	.hdc-pdp .hdc-product-gallery__slide {
		position: relative;
		scroll-snap-align: start;
		background: var(--panel);
	}

	.hdc-pdp .hdc-product-gallery__open {
		display: block;
		cursor: zoom-in;
	}

	.hdc-pdp .hdc-product-gallery__slide img {
		display: block;
		width: 100%;
		height: auto;
		aspect-ratio: 4 / 3;
		object-fit: contain;
		mix-blend-mode: multiply;
	}

	.hdc-pdp .hdc-product-gallery__bar {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		justify-content: space-between;
		gap: 0.75rem 1.5rem;
		padding: 0.75rem var(--gutter) 0;
	}

	.hdc-pdp .hdc-product-gallery__controls {
		display: flex;
		align-items: center;
		gap: 0.25rem;
	}

	/* Until gallery.js is ready the controls keep their space but stay invisible. */
	.hdc-pdp .hdc-product-gallery:not(.is-ready) .hdc-product-gallery__controls {
		visibility: hidden;
	}

	.hdc-pdp .hdc-product-gallery__step {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 3rem;
		height: 3rem;
		border: 2px solid var(--ink);
		border-radius: 0;
		background: var(--white);
		color: var(--ink);
		cursor: pointer;
		transition: background-color 0.15s, color 0.15s;
	}

	.hdc-pdp .hdc-product-gallery__step:hover {
		background: var(--ink);
		color: var(--white);
	}

	.hdc-pdp .hdc-product-gallery__step[aria-disabled="true"] {
		border-color: var(--line);
		background: var(--white);
		color: var(--control);
		cursor: default;
	}

	.hdc-pdp .hdc-product-gallery__step .hdc-icon {
		width: 1.375rem;
		height: 1.375rem;
	}

	.hdc-pdp .hdc-product-gallery__count {
		min-width: 4.5rem;
		margin: 0;
		color: var(--ink);
		font-size: 1rem;
		font-weight: 700;
		font-variant-numeric: tabular-nums;
		text-align: center;
	}

	.hdc-pdp .hdc-product-gallery__thumbs {
		display: none;
		gap: 0.5rem;
		margin: 0;
		padding: 0;
		list-style: none;
	}

	.hdc-pdp .hdc-product-gallery__thumb {
		display: block;
		width: 4.5rem;
		height: 4.5rem;
		border: 1px solid var(--line);
		background: var(--panel);
	}

	.hdc-pdp .hdc-product-gallery__thumb[aria-current="true"] {
		outline: 2px solid var(--ink);
		outline-offset: -2px;
	}

	.hdc-pdp .hdc-product-gallery__thumb img {
		display: block;
		width: 100%;
		height: 100%;
		object-fit: contain;
		mix-blend-mode: multiply;
	}

	/* The large photo: framed, a red close button that is easy to find, a tap outside closes. */
	.hdc-pdp .hdc-product-gallery__dialog {
		width: min(100vw - 2rem, 80rem);
		max-width: none;
		max-height: calc(100dvh - 2rem);
		padding: 0;
		border: 2px solid var(--ink);
		background: var(--white);
	}

	.hdc-pdp .hdc-product-gallery__dialog::backdrop {
		background: rgb(22 25 29 / 0.72);
	}

	.hdc-pdp .hdc-product-gallery__close {
		display: inline-flex;
		position: absolute;
		top: 0;
		right: 0;
		z-index: 1;
		align-items: center;
		justify-content: center;
		width: 3.25rem;
		height: 3.25rem;
		border: 0;
		border-radius: 0;
		background: var(--p-bad);
		color: var(--white);
		cursor: pointer;
	}

	.hdc-pdp .hdc-product-gallery__close .hdc-icon {
		width: 1.5rem;
		height: 1.5rem;
	}

	.hdc-pdp .hdc-product-gallery__large img {
		display: block;
		width: 100%;
		height: auto;
		max-height: calc(100dvh - 2.25rem);
		object-fit: contain;
	}

	/* ---------------------------------------------------------------- Jump row */
	.hdc-pdp .hdc-pdp-jump {
		position: sticky;
		top: var(--sticky);
		z-index: 30;
		border-block: 1px solid var(--line);
		background: var(--white);
	}

	.hdc-pdp .hdc-pdp-jump__row {
		display: flex;
		align-items: stretch;
		justify-content: space-between;
		overflow-x: auto;
		scrollbar-width: none;
		--link: var(--steel);
		--link-hover: var(--ink);
		--link-line: none;
		--link-hover-line: none;
	}

	.hdc-pdp .hdc-pdp-jump__row::-webkit-scrollbar {
		display: none;
	}

	.hdc-pdp .hdc-pdp-jump__link {
		display: inline-flex;
		position: relative;
		flex: none;
		align-items: center;
		min-height: var(--p-jump);
		color: var(--steel);
		font-size: 0.9375rem;
		font-weight: 700;
		white-space: nowrap;
		transition: color 0.15s;
	}

	.hdc-pdp .hdc-pdp-jump__link::after {
		content: "";
		position: absolute;
		right: 0;
		bottom: -1px;
		left: 0;
		height: 3px;
		background: var(--ink);
		transform: scaleX(0);
		transform-origin: left;
		transition: transform 0.2s ease-out;
	}

	.hdc-pdp .hdc-pdp-jump__link:hover,
	.hdc-pdp .hdc-pdp-jump__link[aria-current] {
		color: var(--ink);
	}

	.hdc-pdp .hdc-pdp-jump__link[aria-current]::after {
		transform: scaleX(1);
	}

	/* Phones show the short label, wider screens the long one, never both. */
	.hdc-pdp .hdc-pdp-jump__link--wide,
	.hdc-pdp .hdc-pdp-jump__num,
	.hdc-pdp .hdc-pdp-jump__long {
		display: none;
	}

	/* ---------------------------------------------------------------- Sections */
	.hdc-pdp .hdc-pdp-sec {
		padding-block: var(--p-space);
		background: var(--white);
	}

	.hdc-pdp .hdc-pdp-sec + .hdc-pdp-sec:not([class*="--uses"], [class*="--fit"], [class*="--service"], [class*="--get"]) {
		border-top: 1px solid var(--line);
	}

	.hdc-pdp .hdc-pdp-sec__grid {
		display: grid;
		gap: 1.5rem;
	}

	.hdc-pdp .hdc-pdp-sec__grid > * {
		min-width: 0;
	}

	.hdc-pdp .hdc-pdp-h2 {
		margin: 0 0 2rem;
		color: var(--ink);
		font-size: clamp(2.25rem, 1.6rem + 2.4vw, 3.75rem);
		font-stretch: 75%;
		font-weight: 800;
		line-height: 1;
		text-wrap: balance;
	}

	.hdc-pdp .hdc-pdp-sec__grid > .hdc-pdp-h2 {
		margin: 0;
	}

	.hdc-pdp .hdc-pdp-sec__note {
		max-width: 30rem;
		margin: 0;
		color: var(--body);
		font-size: 1.0625rem;
		line-height: 1.5;
	}

	/* Highlights (Showroom): photo cards, the line under each photo. */
	.hdc-pdp .hdc-pdp-cards {
		display: grid;
		gap: 2rem;
		margin: 0;
		padding: 0;
		list-style: none;
	}

	.hdc-pdp .hdc-pdp-cards__photo {
		display: block;
		border: 1px solid var(--line);
		background: var(--panel);
	}

	.hdc-pdp .hdc-pdp-cards__photo img {
		display: block;
		width: 100%;
		height: auto;
		aspect-ratio: 4 / 3;
		object-fit: contain;
		mix-blend-mode: multiply;
	}

	.hdc-pdp .hdc-pdp-cards__text {
		margin: 1.25rem 0 0;
		padding-top: 1rem;
		border-top: 2px solid var(--ink);
		color: var(--ink);
		font-size: clamp(1.25rem, 1.1rem + 0.5vw, 1.5rem);
		font-stretch: 85%;
		font-weight: 750;
		line-height: 1.25;
		text-wrap: pretty;
	}

	/* Where it works (Showroom): the scene photo beside the places, on the panel ground. */
	.hdc-pdp .hdc-pdp-sec--uses {
		background: var(--panel);
	}

	.hdc-pdp .hdc-pdp-uses {
		display: grid;
		gap: 2rem;
	}

	.hdc-pdp .hdc-pdp-uses__scene {
		margin: 0;
	}

	.hdc-pdp .hdc-pdp-uses__scene img {
		display: block;
		width: 100%;
		height: 100%;
		min-height: 16rem;
		aspect-ratio: 3 / 2;
		object-fit: cover;
	}

	.hdc-pdp .hdc-pdp-uses__list {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 1.75rem 1.25rem;
		align-content: center;
		margin: 0;
		padding: 0;
		list-style: none;
	}

	.hdc-pdp .hdc-pdp-uses__title {
		margin: 1rem 0 0.375rem;
		color: var(--ink);
		font-size: 1.375rem;
		font-stretch: 75%;
		font-weight: 800;
		line-height: 1.1;
	}

	.hdc-pdp .hdc-pdp-uses__text {
		margin: 0;
		color: var(--body);
		font-size: 0.9375rem;
		line-height: 1.45;
	}

	/* Specifications: titled groups, each title under its icon, label and value rows. */
	.hdc-pdp .hdc-pdp-specs {
		display: grid;
		gap: 2.25rem;
	}

	.hdc-pdp .hdc-pdp-specs__group {
		break-inside: avoid;
	}

	.hdc-pdp .hdc-pdp-specs__title {
		display: flex;
		align-items: center;
		gap: 0.625rem;
		margin: 0;
		padding-bottom: 0.75rem;
		border-bottom: 2px solid var(--ink);
		color: var(--ink);
		font-size: 1.25rem;
		font-stretch: 85%;
		font-weight: 800;
		line-height: 1.2;
	}

	.hdc-pdp .hdc-pdp-specs__title .hdc-icon {
		flex: none;
		width: 1.5rem;
		height: 1.5rem;
	}

	.hdc-pdp .hdc-pdp-specs__table {
		width: 100%;
		border-collapse: collapse;
	}

	.hdc-pdp .hdc-pdp-specs__table tr {
		border-bottom: 1px solid var(--line);
	}

	.hdc-pdp .hdc-pdp-specs__table th {
		width: 45%;
		padding: 0.75rem 1rem 0.75rem 0;
		color: var(--steel);
		font-size: 0.9375rem;
		font-weight: 500;
		line-height: 1.4;
		text-align: left;
		vertical-align: top;
	}

	.hdc-pdp .hdc-pdp-specs__table td {
		padding: 0.75rem 0;
		color: var(--ink);
		font-size: 0.9375rem;
		font-weight: 700;
		line-height: 1.4;
		overflow-wrap: anywhere;
		vertical-align: top;
		--link: var(--ink);
		--link-hover: var(--ink);
		--link-line: underline;
	}

	/* Documents: plain sheets with a folded corner. */
	.hdc-pdp .hdc-pdp-docs {
		display: grid;
		grid-template-columns: repeat(auto-fill, minmax(min(100%, 15rem), 1fr));
		gap: 1rem;
		margin: 0;
		padding: 0;
		list-style: none;
	}

	.hdc-pdp .hdc-pdp-docs__link {
		display: flex;
		position: relative;
		flex-direction: column;
		gap: 0.5rem;
		min-height: 11rem;
		height: 100%;
		padding: 1.25rem 2.5rem 1.125rem 1.25rem;
		border: 1px solid var(--line);
		background: var(--white);
		color: var(--ink);
		text-decoration: none;
		transition: border-color 0.15s;
		--link: var(--ink);
		--link-hover: var(--ink);
		--link-line: none;
		--link-hover-line: none;
	}

	.hdc-pdp .hdc-pdp-docs__link::before {
		content: "";
		position: absolute;
		top: -1px;
		right: -1px;
		width: 1.75rem;
		height: 1.75rem;
		border-bottom: 1px solid var(--line);
		border-left: 1px solid var(--line);
		background: linear-gradient(to bottom left, var(--white) 50%, var(--panel) 50%);
		transition: border-color 0.15s;
	}

	.hdc-pdp .hdc-pdp-docs__link:hover,
	.hdc-pdp .hdc-pdp-docs__link:hover::before {
		border-color: var(--ink);
	}

	.hdc-pdp .hdc-pdp-docs__link:hover .hdc-pdp-docs__title {
		text-decoration: underline;
		text-underline-offset: 0.2em;
	}

	.hdc-pdp .hdc-pdp-docs__kind {
		color: var(--steel);
		font-size: 0.8125rem;
		font-weight: 700;
	}

	.hdc-pdp .hdc-pdp-docs__title {
		font-size: 1.125rem;
		font-weight: 750;
		line-height: 1.3;
	}

	.hdc-pdp .hdc-pdp-docs__type {
		display: inline-flex;
		align-items: center;
		gap: 0.375rem;
		margin-top: auto;
		padding-top: 0.75rem;
		font-size: 0.875rem;
		font-weight: 700;
	}

	.hdc-pdp .hdc-pdp-docs__type .hdc-icon {
		width: 1.25rem;
		height: 1.25rem;
	}

	/* How we work (Showroom): five steps on a line, each under its square. */
	.hdc-pdp .hdc-pdp-steps {
		display: grid;
		gap: 1.75rem;
		margin: 0;
		padding: 0;
		list-style: none;
	}

	.hdc-pdp .hdc-pdp-steps__item {
		display: grid;
		position: relative;
		grid-template-columns: auto minmax(0, 1fr);
		column-gap: 1rem;
	}

	/* The line that joins the steps: down on phones. */
	.hdc-pdp .hdc-pdp-steps__item:not(:last-child)::before {
		content: "";
		position: absolute;
		top: 2.75rem;
		bottom: -1.75rem;
		left: 1.375rem;
		width: 1px;
		background: var(--ink);
	}

	.hdc-pdp .hdc-pdp-steps__title {
		margin: 0.5rem 0 0.25rem;
		color: var(--ink);
		font-size: 1.25rem;
		font-stretch: 85%;
		font-weight: 800;
		line-height: 1.2;
	}

	.hdc-pdp .hdc-pdp-steps__text {
		margin: 0;
		color: var(--body);
		font-size: 0.9375rem;
		line-height: 1.45;
	}

	/* Overview: reading text, clamped behind Read more when long. */
	.hdc-pdp .hdc-pdp-overview {
		max-width: 46rem;
	}

	.hdc-pdp .hdc-pdp-overview__text {
		color: var(--body);
		font-size: 1.0625rem;
		line-height: 1.65;
	}

	.hdc-pdp .hdc-pdp-overview.is-clamped .hdc-pdp-overview__text {
		max-height: 24rem;
		overflow: hidden;
		mask-image: linear-gradient(to bottom, #000 72%, transparent);
	}

	.hdc-pdp .hdc-pdp-overview__text > :first-child {
		margin-top: 0;
	}

	.hdc-pdp .hdc-pdp-overview__text p {
		margin: 0 0 1rem;
	}

	.hdc-pdp .hdc-pdp-overview__text :is(h2, h3, h4) {
		margin: 2rem 0 0.625rem;
		color: var(--ink);
		font-size: 1.375rem;
		font-stretch: 75%;
		font-weight: 750;
		line-height: 1.15;
	}

	.hdc-pdp .hdc-pdp-overview__text ul {
		display: grid;
		gap: 0.5rem;
		margin: 0 0 1rem;
		padding: 0;
		list-style: none;
	}

	.hdc-pdp .hdc-pdp-overview__text li {
		position: relative;
		padding-left: 1.375rem;
	}

	.hdc-pdp .hdc-pdp-overview__text li::before {
		content: "";
		position: absolute;
		top: 0.7rem;
		left: 0.25rem;
		width: 0.375rem;
		height: 0.375rem;
		border-radius: 50%;
		background: var(--steel);
	}

	.hdc-pdp .hdc-pdp-overview__more {
		display: inline-flex;
		align-items: center;
		min-height: 3rem;
		margin-top: 0.5rem;
		padding: 0;
		border: 0;
		background: none;
		color: var(--ink);
		font: inherit;
		font-size: 1rem;
		font-weight: 700;
		text-decoration: underline;
		text-underline-offset: 0.25em;
		cursor: pointer;
	}

	.hdc-pdp .hdc-pdp-answer > :first-child {
		margin-top: 0;
	}

	.hdc-pdp .hdc-pdp-answer > :last-child {
		margin-bottom: 0;
	}

	@media (min-width: 40rem) {
		.hdc-pdp .hdc-product-gallery__thumbs {
			display: flex;
		}

		.hdc-pdp .hdc-pdp-cards {
			grid-template-columns: repeat(2, minmax(0, 1fr));
		}

	}

	@media (min-width: 48rem) {
		.hdc-pdp .hdc-pdp-top__media {
			margin-inline: 0;
		}

		.hdc-pdp .hdc-product-gallery__track {
			grid-auto-columns: 100%;
			gap: 0;
		}

		.hdc-pdp .hdc-product-gallery__bar {
			padding-inline: 0;
		}

		.hdc-pdp .hdc-pdp-numbers {
			grid-template-columns: repeat(4, minmax(0, 1fr));
		}

		.hdc-pdp .hdc-pdp-numbers__item:last-child:nth-child(odd) {
			grid-column: auto;
		}

		.hdc-pdp .hdc-pdp-jump__row {
			justify-content: flex-start;
			gap: 2rem;
		}

		.hdc-pdp .hdc-pdp-uses__list {
			gap: 2.25rem 2rem;
		}

	}

	@media (min-width: 64rem) {
		.hdc-pdp .hdc-pdp-top {
			padding-bottom: 4.5rem;
		}

		.hdc-pdp .hdc-pdp-top__grid {
			display: grid;
			grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
			gap: 3.5rem;
			align-items: start;
			margin-top: 1.5rem;
		}

		.hdc-pdp .hdc-pdp-top__left,
		.hdc-pdp .hdc-pdp-top__right {
			display: grid;
			align-content: start;
			gap: 1.75rem;
			min-width: 0;
		}

		/* The photos and numbers stay in view while the taller buy column scrolls past. */
		.hdc-pdp .hdc-pdp-top__left {
			position: sticky;
			top: calc(var(--sticky) + 1.5rem);
		}

		.hdc-pdp .hdc-pdp-jump__link--wide {
			display: inline-flex;
		}

		.hdc-pdp .hdc-pdp-jump__short {
			display: none;
		}

		.hdc-pdp .hdc-pdp-jump__long {
			display: inline;
		}

		.hdc-pdp .hdc-pdp-jump__row {
			gap: 2.25rem;
		}

		.hdc-pdp .hdc-pdp-h2 {
			margin-bottom: 3rem;
		}

		.hdc-pdp .hdc-pdp-sec__grid {
			grid-template-columns: minmax(0, 4fr) minmax(0, 8fr);
			gap: 3rem;
		}

		.hdc-pdp .hdc-pdp-cards {
			grid-template-columns: repeat(3, minmax(0, 1fr));
			gap: 2.5rem;
		}

		.hdc-pdp .hdc-pdp-uses--scene {
			grid-template-columns: minmax(0, 6fr) minmax(0, 5fr);
			gap: 4rem;
			align-items: center;
		}

		.hdc-pdp .hdc-pdp-uses:not(.hdc-pdp-uses--scene) .hdc-pdp-uses__list {
			grid-template-columns: repeat(4, minmax(0, 1fr));
		}

		.hdc-pdp .hdc-pdp-specs {
			display: block;
			column-count: 2;
			column-gap: 4rem;
		}

		.hdc-pdp .hdc-pdp-specs__group {
			margin-bottom: 2.75rem;
		}

		/* Steps across, the joining line through the squares. */
		.hdc-pdp .hdc-pdp-steps {
			grid-template-columns: repeat(5, minmax(0, 1fr));
			gap: 2rem;
		}

		.hdc-pdp .hdc-pdp-steps__item {
			grid-template-columns: minmax(0, 1fr);
		}

		.hdc-pdp .hdc-pdp-steps__item:not(:last-child)::before {
			top: 1.375rem;
			right: -2rem;
			bottom: auto;
			left: 2.75rem;
			width: auto;
			height: 1px;
		}

		.hdc-pdp .hdc-pdp-steps__title {
			margin-top: 1.25rem;
		}

	}

	@media (min-width: 80rem) {
		.hdc-pdp .hdc-pdp-top__grid {
			grid-template-columns: minmax(0, 7fr) minmax(0, 4.75fr);
			gap: 5rem;
		}

		.hdc-pdp .hdc-pdp-jump__row {
			gap: 2.75rem;
		}
	}

	/* ---------------------------------------------------------------- Detailed icons */
	.hdc-pdp .hdc-badge {
		display: block;
		flex: none;
		width: 3rem;
		height: 3rem;
		color: var(--ink);
	}

	.hdc-pdp .hdc-badge .i { fill: var(--ink); }
	.hdc-pdp .hdc-badge .y { fill: var(--accent); }
	.hdc-pdp .hdc-badge .w { fill: var(--white); }
	.hdc-pdp .hdc-badge .g { fill: var(--bd-steel); }
	.hdc-pdp .hdc-badge .s { fill: var(--steel); }
	.hdc-pdp .hdc-badge .b { fill: var(--bd-blue); }
	.hdc-pdp .hdc-badge .bl { fill: var(--bd-blue-light); }
	.hdc-pdp .hdc-badge .gr { fill: var(--p-ok); }
	.hdc-pdp .hdc-badge .gl { fill: var(--bd-green-light); }
	.hdc-pdp .hdc-badge .r { fill: var(--bd-red); }
	.hdc-pdp .hdc-badge .ss { stroke: var(--steel); }
	.hdc-pdp .hdc-badge .sb { stroke: var(--bd-blue); }
	.hdc-pdp .hdc-badge .sgr { stroke: var(--p-ok); }
	.hdc-pdp .hdc-badge .sr { stroke: var(--bd-red); }
	.hdc-pdp .hdc-badge .sw { stroke: var(--white); }

	/* Proof icons and uses: the drawing alone, no frame. */
	.hdc-pdp .hdc-pdp-proof__mark {
		grid-row: 1 / span 2;
		width: 2.75rem;
		height: 2.75rem;
	}

	.hdc-pdp .hdc-pdp-uses__mark {
		width: 3.5rem;
		height: 3.5rem;
	}

	.hdc-pdp .hdc-pdp-uses__mark--line {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		border: 1px solid var(--ink);
	}

	.hdc-pdp .hdc-pdp-numbers__icon {
		width: 2.25rem;
		height: 2.25rem;
	}

	.hdc-pdp .hdc-pdp-price__icon {
		width: 2.75rem;
		height: 2.75rem;
	}

	.hdc-pdp .hdc-pdp-ship__icon {
		width: 2.5rem;
		height: 2.5rem;
	}

	.hdc-pdp .hdc-pdp-specs__title .hdc-badge {
		width: 2.25rem;
		height: 2.25rem;
	}

	/* How we work: the steps' drawings on the joining line. */
	.hdc-pdp .hdc-pdp-steps__mark {
		display: inline-flex;
		grid-row: 1 / span 2;
		position: relative;
		z-index: 1;
		align-items: center;
		justify-content: center;
		width: 4rem;
		height: 4rem;
		border: 1px solid var(--line);
		background: var(--white);
	}

	.hdc-pdp .hdc-pdp-steps__mark .hdc-badge {
		width: 2.75rem;
		height: 2.75rem;
	}

	.hdc-pdp .hdc-pdp-steps__item:not(:last-child)::before {
		top: 4rem;
		left: 2rem;
	}

	/* ---------------------------------------------------------------- Similar models */
	.hdc-pdp .hdc-pdp-similar {
		padding-block: 3rem;
		border-top: 1px solid var(--line);
		background: var(--panel);
	}

	.hdc-pdp .hdc-pdp-similar__head {
		display: grid;
		gap: 0.5rem;
		margin-bottom: 1.75rem;
	}

	.hdc-pdp .hdc-pdp-similar__head .hdc-pdp-h2 {
		margin: 0;
	}

	.hdc-pdp .hdc-pdp-similar__text {
		margin: 0;
		color: var(--body);
		font-size: 1.0625rem;
	}

	.hdc-pdp .hdc-pdp-similar__list {
		display: grid;
		grid-auto-columns: min(78%, 20rem);
		grid-auto-flow: column;
		gap: 1rem;
		margin: 0 calc(-1 * var(--gutter));
		padding: 0 var(--gutter) 0.25rem;
		overflow-x: auto;
		scroll-padding-inline: var(--gutter);
		scroll-snap-type: x mandatory;
		scrollbar-width: none;
		list-style: none;
	}

	.hdc-pdp .hdc-pdp-similar__list::-webkit-scrollbar {
		display: none;
	}

	.hdc-pdp .hdc-pdp-similar__item {
		scroll-snap-align: start;
	}

	.hdc-pdp .hdc-pdp-similar__card {
		display: flex;
		flex-direction: column;
		height: 100%;
		border: 1px solid var(--line);
		background: var(--white);
		color: var(--ink);
		text-decoration: none;
		transition: border-color 0.15s;
		--link: var(--ink);
		--link-hover: var(--ink);
		--link-line: none;
		--link-hover-line: none;
	}

	.hdc-pdp .hdc-pdp-similar__card:hover {
		border-color: var(--ink);
	}

	.hdc-pdp .hdc-pdp-similar__photo {
		display: block;
		border-bottom: 1px solid var(--line);
		background: var(--panel);
	}

	.hdc-pdp .hdc-pdp-similar__photo img {
		display: block;
		width: 100%;
		height: auto;
		aspect-ratio: 4 / 3;
		object-fit: contain;
		mix-blend-mode: multiply;
	}

	.hdc-pdp .hdc-pdp-similar__body {
		display: flex;
		flex: 1;
		flex-direction: column;
		gap: 0.75rem;
		padding: 1rem 1.125rem 1.125rem;
	}

	.hdc-pdp .hdc-pdp-similar__cap {
		display: grid;
		grid-template-columns: auto minmax(0, 1fr);
		column-gap: 0.625rem;
		align-items: center;
	}

	.hdc-pdp .hdc-pdp-similar__icon {
		grid-row: 1 / span 2;
		width: 2.5rem;
		height: 2.5rem;
	}

	.hdc-pdp .hdc-pdp-similar__value {
		font-size: 1.875rem;
		font-stretch: 75%;
		font-weight: 800;
		font-variant-numeric: tabular-nums;
		line-height: 1;
	}

	.hdc-pdp .hdc-pdp-similar__label {
		color: var(--steel);
		font-size: 0.8125rem;
		font-weight: 700;
	}

	.hdc-pdp .hdc-pdp-similar__name {
		font-size: 1.0625rem;
		font-weight: 750;
		line-height: 1.25;
	}

	.hdc-pdp .hdc-pdp-similar__specs {
		display: grid;
		gap: 0.25rem;
		padding-top: 0.75rem;
		border-top: 1px solid var(--line);
	}

	.hdc-pdp .hdc-pdp-similar__spec {
		display: flex;
		justify-content: space-between;
		gap: 1rem;
		color: var(--steel);
		font-size: 0.8125rem;
	}

	.hdc-pdp .hdc-pdp-similar__spec b {
		color: var(--ink);
		font-weight: 700;
		text-align: right;
	}

	.hdc-pdp .hdc-pdp-similar__foot {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		justify-content: space-between;
		gap: 0.5rem 1rem;
		margin-top: auto;
		padding-top: 0.75rem;
		font-size: 0.875rem;
		font-weight: 700;
	}

	.hdc-pdp .hdc-pdp-similar__view {
		display: inline-flex;
		align-items: center;
		gap: 0.375rem;
		text-decoration: underline;
		text-underline-offset: 0.2em;
	}

	.hdc-pdp .hdc-pdp-similar__view .hdc-icon {
		width: 1rem;
		height: 1rem;
	}

	/* ---------------------------------------------------------------- Warranty */
	.hdc-pdp .hdc-pdp-warranty {
		display: grid;
		gap: 2.5rem;
	}

	.hdc-pdp .hdc-pdp-warranty__photo {
		margin: 0;
	}

	.hdc-pdp .hdc-pdp-warranty__photo img {
		display: block;
		width: 100%;
		height: 100%;
		min-height: 18rem;
		aspect-ratio: 4 / 3;
		object-fit: cover;
	}

	.hdc-pdp .hdc-pdp-warranty__words .hdc-pdp-h2 {
		margin-bottom: 1rem;
	}

	.hdc-pdp .hdc-pdp-warranty__maker {
		display: flex;
		align-items: center;
		gap: 0.75rem;
		margin: 0 0 1.5rem;
		color: var(--ink);
		font-size: 1.125rem;
		font-weight: 750;
	}

	.hdc-pdp .hdc-pdp-warranty__seal {
		width: 2.5rem;
		height: 2.5rem;
	}

	.hdc-pdp .hdc-pdp-cover {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 1px;
		margin: 0;
		padding: 0;
		border: 1px solid var(--line);
		background: var(--line);
		list-style: none;
	}

	.hdc-pdp .hdc-pdp-cover__plate {
		display: grid;
		justify-items: start;
		gap: 0.5rem;
		padding: 1.25rem;
		background: var(--white);
	}

	.hdc-pdp .hdc-pdp-cover__icon {
		width: 3.25rem;
		height: 3.25rem;
	}

	.hdc-pdp .hdc-pdp-cover__years {
		color: var(--ink);
		font-size: clamp(2.5rem, 2rem + 2vw, 3.5rem);
		font-stretch: 75%;
		font-weight: 800;
		line-height: 0.95;
	}

	.hdc-pdp .hdc-pdp-cover__what {
		color: var(--body);
		font-size: 1rem;
		font-weight: 700;
	}

	.hdc-pdp .hdc-pdp-warranty__sub {
		margin: 2rem 0 1rem;
		color: var(--ink);
		font-size: 1.25rem;
		font-stretch: 85%;
		font-weight: 800;
	}

	.hdc-pdp .hdc-pdp-terms-list {
		display: grid;
		gap: 0.875rem;
		margin: 0;
		padding: 0;
		list-style: none;
	}

	.hdc-pdp .hdc-pdp-terms-list__item {
		display: flex;
		align-items: center;
		gap: 0.875rem;
		color: var(--body);
		font-size: 1rem;
		line-height: 1.45;
	}

	.hdc-pdp .hdc-pdp-terms-list__icon {
		width: 2.5rem;
		height: 2.5rem;
	}

	.hdc-pdp .hdc-pdp-warranty__ask {
		margin: 1.75rem 0 0;
		padding-top: 1.25rem;
		border-top: 1px solid var(--line);
		color: var(--ink);
		font-size: 1rem;
		font-weight: 700;
		--link: var(--ink);
		--link-hover: var(--ink);
		--link-line: underline;
	}

	/* Phones: the thumbnails in a row under the counter, so more photos show at a glance. */
	@media (max-width: 39.99rem) {
		.hdc-pdp .hdc-product-gallery__thumbs {
			display: flex;
			flex-basis: 100%;
			overflow-x: auto;
			scrollbar-width: none;
		}

		.hdc-pdp .hdc-product-gallery__thumbs li {
			flex: none;
		}

		.hdc-pdp .hdc-product-gallery__thumb {
			width: 3.75rem;
			height: 3.75rem;
		}
	}

	@media (min-width: 64rem) {
		.hdc-pdp .hdc-pdp-similar {
			padding-block: 4.5rem;
		}

		.hdc-pdp .hdc-pdp-similar__head {
			grid-template-columns: auto minmax(0, 1fr);
			align-items: end;
			gap: 2rem;
			margin-bottom: 2.5rem;
		}

		.hdc-pdp .hdc-pdp-similar__list {
			grid-auto-columns: auto;
			grid-auto-flow: row;
			grid-template-columns: repeat(3, minmax(0, 1fr));
			gap: 1.5rem;
			margin-inline: 0;
			padding-inline: 0;
			overflow: visible;
		}

		.hdc-pdp .hdc-pdp-warranty--photo {
			grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
			gap: 4.5rem;
			align-items: center;
		}

		.hdc-pdp .hdc-pdp-steps__item:not(:last-child)::before {
			top: 2rem;
			left: 4rem;
		}

		.hdc-pdp .hdc-pdp-steps__mark {
			grid-row: auto;
		}
	}

	@media (prefers-reduced-motion: reduce) {
		.hdc-pdp .hdc-pdp-jump__link::after {
			transition: none;
		}
	}
}
