@font-face {
	font-display: swap;
	font-family: "Barlow Condensed";
	font-style: normal;
	font-weight: 700;
	src: url("../fonts/BarlowCondensed-latin-ext-700.woff2") format("woff2");
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}


@font-face {
	font-display: swap;
	font-family: "Barlow Condensed";
	font-style: normal;
	font-weight: 700;
	src: url("../fonts/BarlowCondensed-latin-700.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-display: swap;
	font-family: "IBM Plex Mono";
	font-style: normal;
	font-weight: 500;
	src: url("../fonts/IBMPlexMono-latin-ext-500.woff2") format("woff2");
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
	font-display: swap;
	font-family: "IBM Plex Mono";
	font-style: normal;
	font-weight: 500;
	src: url("../fonts/IBMPlexMono-latin-500.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

.re-editorial-page--product {
	--re-product-navy: #0b1829;
	--re-product-copper: #c96635;
	--re-product-copper-text: #9f3e11;
	--re-product-paper: var(--wp--preset--color--paper);
	--re-product-mist: var(--wp--preset--color--surface-alt);
	--re-product-graphite: #5d6878;
	--re-product-line: #cbd4db;
	--re-product-radius: 3px;
	background: var(--re-product-paper);
	box-sizing: border-box;
	color: var(--re-product-navy);
	font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	max-width: none !important;
	overflow: visible;
	padding: 0 0 72px !important;
	width: 100%;
}

.re-editorial-page--product * {
	box-sizing: border-box;
}

/* These carried their own gutter system: 112px here, 80px under 1280 and 48px
   under 781, with a max-width equal to the 1280px `main` itself. That last
   part is why the 112 never applied at 1440 and product content sat flush at
   80, a full 56px left of every other page on the site and 32px left of the
   header logo above it. One token now drives all of it, the same clamp the
   rest of the site uses, so the gutter tracks continuously instead of
   stepping at two breakpoints. */
.re-editorial-page--product .re-product-wide {
	margin-inline: auto;
	max-width: var(--wp--style--global--wide-size) !important;
	padding-inline: var(--re-page-gutter);
	width: 100%;
}

/* Left-aligned like every other reading column, so the narrow blocks start on
   the same edge as the wide ones instead of being centred 204px to their
   right. */
.re-editorial-page--product .re-product-reading {
	margin-inline: var(--re-page-inset) auto;
	max-width: 760px !important;
	width: min(calc(100% - 2 * var(--re-page-inset)), 760px);
}

.re-editorial-page--product .re-product-shell {
	padding-block: 20px 0;
}

.re-editorial-page--product .re-breadcrumb {
	margin: 0 0 18px;
}

.re-editorial-page--product .re-breadcrumb a {
	color: var(--re-product-graphite);
}

.re-editorial-page--product .re-product-hero {
	align-items: stretch;
	background: var(--re-product-navy);
	border-radius: var(--re-product-radius);
	display: grid;
	gap: clamp(40px, 4vw, 64px);
	grid-template-columns: minmax(0, 55fr) minmax(0, 45fr);
	margin: 0;
	max-width: none !important;
	min-height: 500px;
	overflow: hidden;
	padding: clamp(44px, 5vw, 72px);
}

.re-editorial-page--product .re-product-hero__copy {
	align-self: start;
	margin: 0;
	max-width: none !important;
	padding: 0;
}

.re-editorial-page--product .re-section-kicker {
	color: var(--re-product-copper);
	font-family: "IBM Plex Mono", ui-monospace, monospace;
	font-size: 0.75rem;
	font-weight: 500;
	letter-spacing: 0.13em;
	line-height: 1.5;
	margin: 0 0 16px;
	text-transform: uppercase;
}

.re-editorial-page--product .re-product-utility {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	font-family: "IBM Plex Mono", ui-monospace, monospace;
	font-size: 0.75rem;
	font-weight: 500;
	gap: 10px;
	letter-spacing: 0.13em;
	line-height: 1.5;
	margin: 0 0 16px;
	text-transform: uppercase;
}

.re-editorial-page--product .re-product-utility__label {
	color: var(--re-product-copper);
}

.re-editorial-page--product .re-product-utility__class {
	border-left: 1px solid #657487;
	color: #dfe5ea;
	letter-spacing: 0.08em;
	padding-left: 10px;
}

.re-editorial-page--product .re-product-title {
	color: #fff;
	font-family: "Barlow Condensed", Impact, sans-serif;
	font-size: clamp(3.4rem, 6.4vw, 6.6rem);
	font-weight: 700;
	letter-spacing: -0.025em;
	line-height: 0.88;
	margin: 0;
	max-width: 11ch;
}

.re-editorial-page--product .re-product-summary {
	color: #dfe5ea;
	font-size: clamp(1rem, 1.4vw, 1.16rem);
	line-height: 1.65;
	margin: 26px 0 0;
	max-width: 52ch;
}

.re-editorial-page--product .re-product-contact {
	margin: 32px 0 0;
}

.re-editorial-page--product .re-contact-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin: 0;
}

.re-editorial-page--product .re-contact-actions .wp-block-button {
	margin: 0;
}

.re-editorial-page--product .re-contact-actions .wp-element-button {
	align-items: center;
	border: 1px solid transparent;
	border-radius: var(--re-product-radius);
	display: inline-flex;
	font-family: "IBM Plex Mono", ui-monospace, monospace;
	font-size: 0.78rem;
	font-weight: 500;
	justify-content: center;
	letter-spacing: 0.02em;
	min-height: 44px;
	min-width: 44px;
	padding: 11px 18px;
	text-decoration: none;
}

.re-editorial-page--product .re-product-contact--light .is-style-primary .wp-element-button {
	background: var(--re-product-copper);
	color: #071321;
}

.re-editorial-page--product .re-product-contact--light .is-style-secondary .wp-element-button {
	background: #fff;
	color: var(--re-product-navy);
}

.re-editorial-page--product .re-product-contact--light .is-style-ghost .wp-element-button {
	background: transparent;
	border-color: #8996a5;
	color: #fff;
}

.re-editorial-page--product .re-product-hero__media {
	align-self: start;
	aspect-ratio: 16 / 9;
	background: #17283b;
	border: 1px solid #405064;
	border-radius: var(--re-product-radius);
	display: block;
	margin: 0;
	min-height: 0;
	overflow: hidden;
	position: relative;
	width: 100%;
}

.re-editorial-page--product .re-product-hero__media:not(:has(.re-product-hero-figure))::before {
	background: linear-gradient(135deg, transparent 44%, var(--re-product-copper) 44% 47%, transparent 47%), repeating-linear-gradient(90deg, #17283b 0 31px, #26394d 31px 32px);
	content: "";
	inset: 0;
	position: absolute;
}

.re-editorial-page--product .re-product-hero-figure {
	display: grid;
	grid-template-rows: minmax(0, 1fr) auto;
	height: 100%;
	margin: 0;
	position: relative;
	width: 100%;
}

.re-editorial-page--product .re-product-hero-figure__image {
	display: block;
	height: 100%;
	min-height: 0;
	object-fit: cover;
	width: 100%;
}

.re-editorial-page--product .re-product-hero-figure figcaption {
	background: #111f30;
	border-top: 1px solid #405064;
	color: #dfe5ea;
	font-family: "IBM Plex Mono", ui-monospace, monospace;
	font-size: 0.68rem;
	line-height: 1.5;
	padding: 10px 12px;
}

.re-editorial-page--product .re-product-signals-wrap {
	margin-block: 16px 0;
}

.re-editorial-page--product .re-product-signals {
	background: var(--re-product-mist);
	border: 1px solid var(--re-product-line);
	border-radius: var(--re-product-radius);
	padding: 0;
}

.re-editorial-page--product .re-product-signals__list {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	margin: 0;
}

.re-editorial-page--product .re-product-signal {
	border-inline-end: 1px solid var(--re-product-line);
	min-width: 0;
	padding: 18px 20px;
}

.re-editorial-page--product .re-product-signal:last-child {
	border-inline-end: 0;
}

.re-editorial-page--product .re-product-signal__label {
	color: var(--re-product-copper-text);
	font-family: "IBM Plex Mono", ui-monospace, monospace;
	font-size: 0.68rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.re-editorial-page--product .re-product-signal__value {
	color: var(--re-product-navy);
	font-size: 0.92rem;
	font-weight: 650;
	line-height: 1.45;
	margin: 8px 0 0;
}

.re-editorial-page--product .re-product-fit {
	display: grid;
	gap: 16px;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	margin-block: 56px 0;
}

.re-editorial-page--product .re-product-fit:not(:has(> .re-dossier)) {
	display: none;
}

.re-editorial-page--product .re-product-fit > .re-dossier:only-child {
	grid-column: 1 / -1;
}

.re-editorial-page--product .re-product-fit .re-dossier {
	background: #fff;
	border: 1px solid var(--re-product-line);
	border-left: 4px solid var(--re-product-copper);
	border-radius: var(--re-product-radius);
	margin: 0;
	padding: 24px;
}

.re-editorial-page--product .re-product-fit .re-dossier--not-suitable {
	border-left-color: var(--re-product-graphite);
}

.re-editorial-page--product .re-product-fit h2 {
	font-family: "Barlow Condensed", Impact, sans-serif;
	font-size: 1.75rem;
	line-height: 1;
	margin: 0 0 12px;
}

.re-editorial-page--product .re-product-fit p {
	color: var(--re-product-graphite);
	line-height: 1.65;
	margin: 0;
}

.re-editorial-page--product .re-product-index {
	background: rgb(251 250 247 / 96%);
	border-block: 1px solid var(--re-product-line);
	margin-block: 56px 0;
	position: sticky;
	top: 0;
	z-index: 20;
}

.re-editorial-page--product .re-product-index ol {
	display: flex;
	gap: 4px;
	list-style: none;
	margin: 0;
	overflow-x: auto;
	padding: 8px 0;
	scrollbar-width: thin;
}

.re-editorial-page--product .re-product-index a {
	align-items: center;
	color: var(--re-product-graphite);
	display: inline-flex;
	font-family: "IBM Plex Mono", ui-monospace, monospace;
	font-size: 0.68rem;
	min-height: 44px;
	padding: 8px 12px;
	text-decoration: none;
	white-space: nowrap;
}

.re-editorial-page--product .re-product-index a:hover {
	color: var(--re-product-copper-text);
}

.re-editorial-page--product [id="genel-bakis"] {
	scroll-margin-top: 62px;
}

.re-editorial-page--product [id="kullanim-alanlari"] {
	scroll-margin-top: 62px;
}

.re-editorial-page--product [id="material-passport"] {
	scroll-margin-top: 62px;
}

.re-editorial-page--product [id="uyumluluk"] {
	scroll-margin-top: 62px;
}

.re-editorial-page--product [id="kanit"] {
	scroll-margin-top: 62px;
}

.re-editorial-page--product [id="sik-sorulan-sorular"] {
	scroll-margin-top: 62px;
}

.re-editorial-page--product .re-product-visuals-wrap {
	margin-block: 48px 0;
}

.re-editorial-page--product .re-product-visuals {
	display: grid;
	gap: 16px;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	margin: 0;
}

.re-editorial-page--product .re-product-visual {
	background: #fff;
	border: 1px solid var(--re-product-line);
	border-radius: var(--re-product-radius);
	margin: 0;
	overflow: hidden;
}

.re-editorial-page--product .re-product-visual picture {
	aspect-ratio: 4 / 3;
	display: block;
}

.re-editorial-page--product .re-product-visual__image {
	display: block;
	height: 100%;
	object-fit: cover;
	width: 100%;
}

.re-editorial-page--product .re-product-visual figcaption {
	color: var(--re-product-graphite);
	font-size: 0.82rem;
	line-height: 1.5;
	padding: 12px 14px;
}

.re-editorial-page--product .re-product-visuals--diagram {
	background: var(--re-product-navy);
	border-radius: var(--re-product-radius);
	display: block;
	padding: clamp(28px, 4vw, 48px);
}

.re-editorial-page--product .re-product-visuals--diagram .re-product-signals__list {
	gap: 1px;
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

.re-editorial-page--product .re-product-visuals--diagram .re-product-signal {
	background: #14263a;
	border: 0;
}

.re-editorial-page--product .re-product-visuals--diagram .re-product-signal__label {
	color: #e38b5b;
}

.re-editorial-page--product .re-product-visuals--diagram .re-product-signal__value {
	color: #eef2f5;
}

.re-editorial-page--product .re-product-passport {
	margin-block: 56px 0;
}

.re-editorial-page--product .re-product-passport .re-dossier {
	background: #fff;
	border: 1px solid var(--re-product-line);
	border-radius: var(--re-product-radius);
	margin: 0;
	padding: clamp(24px, 4vw, 48px);
}

.re-editorial-page--product .re-dossier h2 {
	color: var(--re-product-navy);
	font-family: "Barlow Condensed", Impact, sans-serif;
	font-size: clamp(2rem, 3.4vw, 3.2rem);
	line-height: 0.98;
	margin: 0 0 24px;
}

.re-editorial-page--product .re-table-wrap {
	max-width: 100%;
	/* The base .re-table-wrap scrolls; the product page overrode it to visible,
	   so a 263px spec table sat in a 198px wrapper and pushed the page 4px wide
	   at 320. A wrapper that does not contain its table is not a wrapper. */
	overflow-x: auto;
	overflow-y: visible;
}

.re-editorial-page--product .re-spec-table {
	border-collapse: collapse;
	display: table;
	margin: 0;
	width: 100%;
}

.re-editorial-page--product .re-spec-table caption {
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	height: 1px;
	overflow: hidden;
	position: absolute;
	white-space: nowrap;
	width: 1px;
}

.re-editorial-page--product .re-spec-table th {
	background: var(--re-product-mist);
	border: 1px solid var(--re-product-line);
	color: var(--re-product-navy);
	font-family: "IBM Plex Mono", ui-monospace, monospace;
	font-size: 0.72rem;
	font-weight: 500;
	letter-spacing: 0.04em;
	padding: 14px 16px;
	text-align: left;
	vertical-align: top;
}

.re-editorial-page--product .re-spec-table td {
	background: #fff;
	border: 1px solid var(--re-product-line);
	color: var(--re-product-graphite);
	line-height: 1.55;
	padding: 14px 16px;
	text-align: left;
	vertical-align: top;
}

.re-editorial-page--product .re-product-compatibility {
	margin-block: 16px 0;
}

.re-editorial-page--product .re-product-compatibility .re-dossier {
	background: var(--re-product-mist);
	border: 1px solid var(--re-product-line);
	border-radius: var(--re-product-radius);
	margin: 0;
	padding: clamp(24px, 4vw, 48px);
}

.re-editorial-page--product .re-product-evidence {
	counter-reset: product-claim;
	margin-block: 56px 0;
}

.re-editorial-page--product .re-product-evidence .re-dossier {
	margin: 0;
}

.re-editorial-page--product .re-product-evidence ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.re-editorial-page--product .re-dossier__claim {
	border-top: 1px solid var(--re-product-line);
	counter-increment: product-claim;
	display: grid;
	grid-template-columns: 48px minmax(0, 1fr);
	padding: 20px 0;
}

.re-editorial-page--product .re-dossier__claim::before {
	color: var(--re-product-copper-text);
	content: counter(product-claim, decimal-leading-zero);
	font-family: "IBM Plex Mono", ui-monospace, monospace;
	font-size: 0.72rem;
	grid-row: span 2;
	padding-top: 4px;
}

.re-editorial-page--product .re-dossier__claim-wording {
	color: var(--re-product-navy);
	line-height: 1.6;
}

.re-editorial-page--product .re-dossier__source {
	color: var(--re-product-graphite);
	font-size: 0.78rem;
	line-height: 1.55;
	margin: 8px 0 0;
}

.re-editorial-page--product .re-dossier__source a {
	color: var(--re-product-copper-text);
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
}

.re-editorial-page--product .re-product-story {
	border-top: 1px solid var(--re-product-line);
	margin-block: 56px 0;
	padding-block: 48px 0;
}

.re-editorial-page--product .re-product-story .wp-block-post-content {
	color: #263344;
	font-size: 1.04rem;
	line-height: 1.78;
}

.re-editorial-page--product .re-product-story h2 {
	color: var(--re-product-navy);
	font-family: "Barlow Condensed", Impact, sans-serif;
	font-size: clamp(2rem, 3.4vw, 3rem);
	line-height: 1;
	margin-block: 48px 16px;
}

.re-editorial-page--product .re-product-story h3 {
	color: var(--re-product-navy);
	font-size: 1.25rem;
	margin-block: 36px 12px;
}

.re-editorial-page--product .re-product-story a {
	color: var(--re-product-copper-text);
	font-weight: 650;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
}

.re-editorial-page--product .re-product-story img {
	border-radius: var(--re-product-radius);
	height: auto;
	max-width: 100%;
}

.re-editorial-page--product .re-product-related {
	margin-block: 56px 0;
}

.re-editorial-page--product .re-product-related .re-dossier {
	margin: 0;
}

.re-editorial-page--product .re-dossier--related ul {
	display: grid;
	gap: 16px;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	list-style: none;
	margin: 0;
	padding: 0;
}

.re-editorial-page--product .re-dossier__related-card {
	background: #fff;
	border: 1px solid var(--re-product-line);
	border-radius: var(--re-product-radius);
	min-width: 0;
	overflow: hidden;
}

.re-editorial-page--product .re-dossier__related-link {
	color: var(--re-product-navy);
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
}

.re-editorial-page--product .re-dossier__related-media {
	aspect-ratio: 16 / 9;
	background: var(--re-product-mist);
	border-bottom: 1px solid var(--re-product-line);
	display: block;
	overflow: hidden;
}

.re-editorial-page--product .re-dossier__related-image {
	display: block;
	height: 100%;
	object-fit: cover;
	width: 100%;
}

.re-editorial-page--product .re-dossier__related-body {
	display: block;
	padding: 20px;
}

.re-editorial-page--product .re-dossier__related-title {
	display: block;
	font-family: "Barlow Condensed", Impact, sans-serif;
	font-size: 1.55rem;
	font-weight: 700;
	line-height: 1.05;
}

.re-editorial-page--product .re-dossier__related-description {
	color: var(--re-product-graphite);
	font-size: 0.86rem;
	line-height: 1.6;
	margin: 12px 0 0;
}

.re-editorial-page--product .re-product-cta-wrap {
	margin-block: 64px 0;
}

.re-editorial-page--product .re-product-cta {
	background: var(--re-product-navy);
	border: 1px solid #22364c;
	border-radius: var(--re-product-radius);
	color: #fff;
	margin: 0;
	max-width: none !important;
	padding: clamp(32px, 5vw, 64px);
}

.re-editorial-page--product .re-product-cta h2 {
	color: #fff;
	font-family: "Barlow Condensed", Impact, sans-serif;
	font-size: clamp(2.5rem, 4.6vw, 4.4rem);
	line-height: 0.94;
	margin: 0;
	max-width: 16ch;
}

.re-editorial-page--product .re-product-cta > p:not(.re-section-kicker) {
	color: #d2dae2;
	line-height: 1.65;
	margin: 20px 0 0;
	max-width: 62ch;
}

.re-editorial-page--product .re-product-cta .re-contact-actions {
	margin-top: 28px;
}

.re-editorial-page--product .re-product-cta .is-style-primary .wp-element-button {
	background: var(--re-product-copper);
	color: #fff;
}

.re-editorial-page--product .re-product-cta .is-style-secondary .wp-element-button {
	background: #fff;
	color: var(--re-product-navy);
}

.re-editorial-page--product .re-product-cta .is-style-ghost .wp-element-button {
	background: transparent;
	border-color: #a8b3bf;
	color: #fff;
}

.re-editorial-page--product [data-section="material-passport"]:not(:has(.re-dossier)) {
	display: none;
}

.re-editorial-page--product [data-section="compatibility"]:not(:has(.re-dossier)) {
	display: none;
}

.re-editorial-page--product [data-section="evidence"]:not(:has(.re-dossier)) {
	display: none;
}

.re-editorial-page--product [data-section="related"]:not(:has(.re-dossier)) {
	display: none;
}

.re-editorial-page--product a:focus-visible {
	outline: 3px solid var(--re-product-copper);
	outline-offset: 3px;
}

@media (max-width: 1280px) {

}

@media (max-width: 960px) {
	.re-editorial-page--product .re-product-signals__list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.re-editorial-page--product .re-product-signal:nth-child(2) {
		border-inline-end: 0;
	}

	.re-editorial-page--product .re-product-signal:nth-child(n+3) {
		border-top: 1px solid var(--re-product-line);
	}

	.re-editorial-page--product .re-product-visuals--diagram .re-product-signals__list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.re-editorial-page--product .re-dossier--related ul {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 781px) {
	.re-editorial-page--product {
		padding-bottom: 48px !important;
	}





	.re-editorial-page--product .re-product-hero {
		gap: 32px;
		grid-template-columns: 1fr;
		min-height: 0;
		padding: 36px 28px 28px;
	}

	.re-editorial-page--product .re-product-title {
		font-size: clamp(3.2rem, 14vw, 5.2rem);
	}

	.re-editorial-page--product .re-product-hero__media {
		width: 100%;
	}

	.re-editorial-page--product .re-product-fit {
		grid-template-columns: 1fr;
		margin-top: 40px;
	}

	.re-editorial-page--product .re-product-index {
		margin-top: 40px;
		position: relative;
		top: auto;
	}

	.re-editorial-page--product .re-product-index ol {
		overscroll-behavior-inline: contain;
	}

	.re-editorial-page--product [id="genel-bakis"] {
		scroll-margin-top: 24px;
	}

	.re-editorial-page--product [id="kullanim-alanlari"] {
		scroll-margin-top: 24px;
	}

	.re-editorial-page--product [id="material-passport"] {
		scroll-margin-top: 24px;
	}

	.re-editorial-page--product [id="uyumluluk"] {
		scroll-margin-top: 24px;
	}

	.re-editorial-page--product [id="kanit"] {
		scroll-margin-top: 24px;
	}

	.re-editorial-page--product [id="sik-sorulan-sorular"] {
		scroll-margin-top: 24px;
	}

	.re-editorial-page--product .re-product-visuals {
		grid-template-columns: 1fr;
	}

	.re-editorial-page--product .re-product-passport {
		margin-top: 40px;
	}

	.re-editorial-page--product .re-product-compatibility {
		margin-top: 14px;
	}

	.re-editorial-page--product .re-dossier--compatibility .re-table-wrap {
		overflow: visible;
	}

	.re-editorial-page--product .re-dossier--compatibility .re-spec-table {
		display: block;
	}

	.re-editorial-page--product .re-dossier--compatibility .re-spec-table thead {
		clip: rect(0 0 0 0);
		clip-path: inset(50%);
		height: 1px;
		overflow: hidden;
		position: absolute;
		white-space: nowrap;
		width: 1px;
	}

	.re-editorial-page--product .re-dossier--compatibility .re-spec-table tbody {
		display: grid;
		gap: 12px;
	}

	.re-editorial-page--product .re-dossier--compatibility .re-spec-table tr {
		background: #fff;
		border: 1px solid var(--re-product-line);
		border-radius: var(--re-product-radius);
		display: grid;
		gap: 12px;
		padding: 16px;
	}

	.re-editorial-page--product .re-dossier--compatibility .re-spec-table td {
		border: 0;
		display: grid;
		grid-template-columns: minmax(94px, 35%) minmax(0, 1fr);
		padding: 0;
	}

	.re-editorial-page--product .re-dossier--compatibility .re-mobile-table-label {
		color: var(--re-product-copper-text);
		display: block;
		font-family: "IBM Plex Mono", ui-monospace, monospace;
		font-size: 0.64rem;
		letter-spacing: 0.04em;
		padding-right: 10px;
		text-transform: uppercase;
	}

	.re-editorial-page--product .re-dossier--compatibility .re-mobile-table-value {
		min-width: 0;
	}

	.re-editorial-page--product .re-product-evidence {
		margin-top: 40px;
	}

	.re-editorial-page--product .re-product-story {
		margin-top: 40px;
		padding-top: 36px;
	}

	.re-editorial-page--product .re-dossier--related ul {
		grid-template-columns: 1fr;
	}

	.re-editorial-page--product .re-product-cta-wrap {
		margin-top: 48px;
	}
}

@media (max-width: 480px) {
	.re-editorial-page--product .re-product-shell {
		padding-top: 12px;
	}

	.re-editorial-page--product .re-product-hero {
		padding: 30px 20px 20px;
	}

	.re-editorial-page--product .re-product-signals__list {
		grid-template-columns: 1fr;
	}

	.re-editorial-page--product .re-product-signal {
		border-inline-end: 0;
		border-top: 1px solid var(--re-product-line);
	}

	.re-editorial-page--product .re-product-signal:first-child {
		border-top: 0;
	}

	.re-editorial-page--product .re-product-visuals--diagram .re-product-signals__list {
		grid-template-columns: 1fr;
	}

	.re-editorial-page--product .re-product-passport .re-dossier {
		padding: 20px;
	}

	.re-editorial-page--product .re-product-compatibility .re-dossier {
		padding: 20px 14px;
	}

	.re-editorial-page--product .re-product-cta {
		padding: 32px 22px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.re-editorial-page--product * {
		scroll-behavior: auto !important;
	}
}
/* One palette, not two. This block used to redefine every token a second
   time in a cooler, whiter, rounder key, which is what made the material
   pages read as a different site from the rest. Same tokens, corrected to
   the warm system: one navy, a liner-coloured second ground, warm rules,
   and a radius small enough to stop reading as a card. */
.re-editorial-page--product {
	--re-product-navy: #10233c;
	--re-product-copper: var(--wp--preset--color--copper);
	--re-product-copper-text: var(--wp--preset--color--copper-ink);
	--re-product-paper: var(--wp--preset--color--paper);
	--re-product-mist: #efece4;
	--re-product-graphite: #5d6878;
	--re-product-line: #d5d0c4;
	--re-product-radius: 2px;
	background: var(--wp--preset--color--paper);
	color: #10233c;
	padding-bottom: 64px !important;
}

.re-editorial-page--product .re-product-shell {
	padding-block-start: 24px;
}

.re-editorial-page--product .re-product-hero {
	background: var(--re-product-mist);
	border: 1px solid var(--re-product-line);
	border-radius: var(--re-product-radius);
	box-shadow: 0 10px 30px rgb(16 32 51 / 7%);
	gap: clamp(32px, 4vw, 56px);
	min-height: 440px;
	padding: clamp(36px, 4.5vw, 60px);
}

.re-editorial-page--product .re-product-utility__label,
.re-editorial-page--product .re-section-kicker {
	color: var(--re-product-copper-text);
}

/* The dark copper above is only legible on the light page surface; the navy
   CTA panel keeps the lighter orange it was designed around. */
.re-editorial-page--product .re-product-cta .re-section-kicker {
	color: var(--wp--preset--color--copper-light);
}

.re-editorial-page--product .re-product-utility__class {
	border-left-color: var(--re-product-line);
	color: var(--re-product-graphite);
}

.re-editorial-page--product .re-product-title {
	color: #102033;
	font-size: clamp(3rem, 5.2vw, 5.25rem);
	line-height: 0.95;
	max-width: 13ch;
}

.re-editorial-page--product .re-product-summary {
	color: var(--re-product-graphite);
	margin-top: 22px;
}

.re-editorial-page--product .re-product-contact--light .is-style-primary .wp-element-button {
	background: var(--re-product-navy);
	color: #fff;
}

.re-editorial-page--product .re-product-contact--light .is-style-secondary .wp-element-button {
	border-color: var(--re-product-line);
}

.re-editorial-page--product .re-product-contact--light .is-style-ghost .wp-element-button {
	border-color: #9eabba;
	color: var(--re-product-navy);
}

.re-editorial-page--product .re-contact-actions .wp-element-button {
	border-radius: 6px;
}

.re-editorial-page--product .re-product-hero__media {
	background: #fff;
	border-color: var(--re-product-line);
	border-radius: var(--re-product-radius);
	box-shadow: 0 8px 24px rgb(16 32 51 / 8%);
}

.re-editorial-page--product .re-product-hero-figure figcaption {
	background: #fff;
	border-top-color: var(--re-product-line);
	color: var(--re-product-graphite);
}

.re-editorial-page--product :is(
	.re-product-signals,
	.re-product-fit .re-dossier,
	.re-product-visual,
	.re-product-passport .re-dossier,
	.re-product-compatibility .re-dossier,
	.re-product-related .re-related-card
) {
	border-color: var(--re-product-line);
	border-radius: var(--re-product-radius);
	box-shadow: 0 8px 24px rgb(16 32 51 / 6%);
}

.re-editorial-page--product .re-product-signals {
	background: #fff;
}

.re-editorial-page--product .re-product-index {
	background: rgb(255 255 255 / 96%);
	border-color: var(--re-product-line);
}

.re-editorial-page--product .re-product-index a {
	font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	font-size: 0.76rem;
	font-weight: 650;
}

.re-editorial-page--product :is(.re-product-passport, .re-product-compatibility, .re-product-related) {
	margin-block-start: 56px;
}

.re-editorial-page--product .re-product-story {
	color: #25374a;
}

.re-editorial-page--product .re-product-story h2 {
	color: #102033;
}

@media (max-width: 781px) {
	.re-editorial-page--product {
		padding-bottom: 48px !important;
	}

	.re-editorial-page--product .re-contact-actions .wp-element-button {
		font-size: 1rem;
		min-height: 48px;
	}

	.re-editorial-page--product .re-product-hero {
		gap: 28px;
		min-height: 0;
		padding: 28px 22px;
	}

	.re-editorial-page--product .re-product-title {
		font-size: clamp(2.75rem, 14vw, 3.8rem);
	}

	.re-editorial-page--product :is(.re-product-passport, .re-product-compatibility, .re-product-related) {
		margin-block-start: 40px;
	}
}
/* Final catalog typography layer. */
.re-editorial-page--product :is(h1, h2, h3, .re-section-kicker, .re-product-utility, .re-product-signal__label, .re-product-index a),
.re-editorial-page--product .re-contact-actions .wp-element-button {
	font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.re-editorial-page--product :is(h1, h2, h3) {
	font-weight: 750;
	letter-spacing: -0.025em;
	line-height: 1.08;
}

@media (max-width: 781px) {
	body.single-re_product .re-site-header {
		flex-wrap: nowrap;
		min-height: 64px;
	}

	body.single-re_product .re-header-cta {
		display: none;
	}
}
.re-editorial-page--product .re-product-title,
.re-editorial-page--product [data-section] :is(h2, h3),
.re-editorial-page--product .re-product-cta-wrap :is(h2, h3) {
	font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	font-weight: 750;
	letter-spacing: -0.025em;
	line-height: 1.08;
}

/* Commercial product page: classic product information plus quote sidebar. */
.re-editorial-page--product .re-product-hero {
	min-height: 0;
	padding: clamp(30px, 4vw, 48px);
}

.re-editorial-page--product .re-product-title {
	font-size: clamp(2.75rem, 4vw, 4.25rem);
}

.re-editorial-page--product .re-product-signals-wrap {
	margin-top: 24px;
}

.re-editorial-page--product .re-product-fit {
	margin-top: 24px;
}

.re-editorial-page--product .re-product-custom-production {
	margin-top: 24px;
}

.re-editorial-page--product .re-dossier--custom-production {
	background: var(--re-product-navy);
	border: 1px solid #22364c;
	border-radius: var(--re-product-radius);
	color: #fff;
	display: grid;
	gap: 14px;
	padding: clamp(24px, 4vw, 36px);
}

.re-editorial-page--product .re-dossier--custom-production .re-product-utility {
	color: #f0a27c;
	font-family: "IBM Plex Mono", monospace;
	font-size: 0.72rem;
	font-weight: 600;
	letter-spacing: 0.12em;
	margin: 0;
}

.re-editorial-page--product .re-dossier--custom-production h2 {
	color: #fff;
	font-size: clamp(2rem, 4vw, 3rem);
	line-height: 0.98;
	margin: 0;
}

.re-editorial-page--product .re-dossier--custom-production > p:not(.re-product-utility) {
	color: #d2dae2;
	line-height: 1.65;
	margin: 0;
}

.re-editorial-page--product .re-dossier--custom-production ul {
	display: grid;
	gap: 8px 24px;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	list-style: none;
	margin: 4px 0 0;
	padding: 0;
}

.re-editorial-page--product .re-dossier--custom-production li {
	border-top: 1px solid rgb(255 255 255 / 24%);
	font-size: 0.88rem;
	padding-top: 10px;
}

.re-editorial-page--product .re-product-commerce {
	display: grid;
	grid-template-columns: minmax(0, 1.65fr) minmax(300px, 0.75fr);
	gap: clamp(32px, 5vw, 72px);
	margin-top: clamp(44px, 6vw, 72px);
	width: min(1280px, calc(100% - 80px));
}

.re-editorial-page--product .re-product-commerce__main,
.re-editorial-page--product .re-product-commerce__aside {
	min-width: 0;
}

.re-editorial-page--product .re-product-commerce .re-product-story {
	border-top: 0;
	margin: 0;
	padding: 0;
	width: 100%;
}

.re-editorial-page--product .re-product-commerce .re-product-story .wp-block-post-content {
	font-size: 1rem;
	line-height: 1.75;
}

.re-editorial-page--product .re-product-commerce .re-product-story h2 {
	font-size: clamp(1.7rem, 2.4vw, 2.35rem);
	margin-top: 2.5rem;
}

.re-editorial-page--product .re-product-commerce .re-product-visuals-wrap {
	margin-top: 40px;
	width: 100%;
}

.re-editorial-page--product .re-product-commerce__aside {
	align-self: start;
	display: grid;
	gap: 20px;
	position: sticky;
	top: 20px;
}

/* The aside is a grid and this is one of its items, so its default
   min-width: auto floors it at min-content and width: 100% cannot pull it
   below that. At a 320px viewport that floor is 304.5px inside a 280px
   column, which is the site's only remaining horizontal scroll. The aside
   itself already carries min-width: 0 for the same reason; the item was
   missed. */
.re-editorial-page--product .re-product-commerce .re-product-passport {
	margin: 0;
	min-width: 0;
	width: 100%;
}

.re-editorial-page--product .re-product-commerce .re-product-passport .re-dossier,
.re-editorial-page--product .re-product-buybox {
	background: #fff;
	border: 1px solid var(--re-product-line);
	border-radius: var(--re-product-radius);
	box-shadow: 0 8px 24px rgb(16 32 51 / 6%);
	padding: 26px;
}

.re-editorial-page--product .re-product-buybox {
	background: var(--re-product-mist);
}

.re-editorial-page--product .re-product-buybox h2 {
	font-size: 1.55rem;
	margin: 0 0 10px;
}

.re-editorial-page--product .re-product-buybox p {
	color: var(--re-product-graphite);
	font-size: 0.95rem;
	line-height: 1.6;
	margin: 0 0 18px;
}

.re-editorial-page--product .re-product-buybox .re-contact-actions {
	display: grid;
	gap: 10px;
}

.re-editorial-page--product .re-product-buybox .wp-block-button,
.re-editorial-page--product .re-product-buybox .wp-element-button {
	width: 100%;
}

.re-editorial-page--product .re-product-compatibility,
.re-editorial-page--product .re-product-evidence,
.re-editorial-page--product .re-product-related {
	margin-top: clamp(44px, 6vw, 72px);
}

@media (max-width: 900px) {
	.re-editorial-page--product .re-dossier--custom-production ul {
		grid-template-columns: 1fr;
	}

	.re-editorial-page--product .re-product-commerce {
		grid-template-columns: 1fr;
		width: calc(100% - 48px);
	}

	.re-editorial-page--product .re-product-commerce__aside {
		position: static;
	}
}

@media (max-width: 480px) {
	.re-editorial-page--product .re-product-commerce {
		gap: 28px;
		margin-top: 36px;
		width: calc(100% - 40px);
	}

	.re-editorial-page--product .re-product-commerce .re-product-passport .re-dossier,
	.re-editorial-page--product .re-product-buybox {
		padding: 20px;
	}
}

/* One type scale, and the display face doing display work.
   The page ran fourteen sizes and five different H2s, the largest of which
   (59px, on the closing call to action) outshouted the 51px H1. Barlow
   Condensed was loaded on every visit but reached two elements, so every
   heading fell back to Inter - the safest, most anonymous choice available.
   Four steps now, and the condensed face carries all of them. */
.re-editorial-page--product {
	--re-t-title: clamp(2.6rem, 4.6vw, 3.4rem);
	--re-t-section: clamp(1.7rem, 2.6vw, 2.1rem);
	--re-t-prose: clamp(1.4rem, 2vw, 1.65rem);
	--re-t-sub: 1.25rem;
}

.re-editorial-page--product :is(.re-product-title, .re-dossier h2, .re-product-cta h2, .re-product-story h2, .re-product-story h3, .re-product-buybox h2) {
	font-family: "Barlow Condensed", "Arial Narrow", sans-serif;
	font-weight: 700;
	letter-spacing: -0.004em;
	text-wrap: balance;
}

.re-editorial-page--product .re-product-title {
	color: var(--re-product-navy);
	font-size: var(--re-t-title);
	line-height: 0.98;
}

.re-editorial-page--product :is(.re-dossier h2, .re-product-cta h2, .re-dossier--custom-production h2) {
	font-size: var(--re-t-section);
	line-height: 1.06;
}

.re-editorial-page--product :is(.re-product-story h2, .re-product-commerce .re-product-story h2) {
	font-size: var(--re-t-prose);
	line-height: 1.12;
}

.re-editorial-page--product :is(.re-product-buybox h2, .re-product-story h3) {
	font-size: var(--re-t-sub);
	line-height: 1.2;
}

/* Two navies survived the palette merge because they were set on the prose
   rather than through a token. */
.re-editorial-page--product :is(.re-product-story, .re-product-story p, .re-product-story li, .re-product-story h2, .re-product-story h3) {
	color: var(--re-product-navy);
}

.re-editorial-page--product .re-product-story :is(p, li) a {
	color: var(--re-product-copper-text);
}

/* Stop separating sections with containers.
   Eleven boxes stacked down one page, every one of them a 1px border round
   a white fill, is what makes a technical document read as a card grid.
   Sections are separated by a rule and by space instead. A fill is kept only
   where it carries meaning: the custom-production block, which is a
   deliberate inversion, and the buybox, which is the thing you act on. */
.re-editorial-page--product :is(
	.re-product-hero,
	.re-product-hero__media,
	.re-product-signals,
	.re-dossier--selection-reason,
	.re-dossier--not-suitable,
	.re-dossier--specs,
	.re-dossier--compatibility,
	.re-product-visual
) {
	background: transparent;
	border: 0;
	border-radius: 0;
	box-shadow: none;
}

.re-editorial-page--product :is(.re-product-signals, .re-dossier--specs, .re-dossier--compatibility) {
	border-top: 1px solid var(--re-product-line);
	padding-block-start: 28px;
}

.re-editorial-page--product .re-product-hero {
	padding-inline: 0;
}

/* The signals row is a definition list, so let it look like one: the label
   is the field name, the value is the answer. Both were bold navy before,
   which left the card with two headings and no body. */
.re-editorial-page--product .re-product-signal__label {
	color: var(--re-product-copper-text);
	font-family: "IBM Plex Mono", ui-monospace, monospace;
	font-size: 0.7rem;
	font-weight: 500;
	letter-spacing: 0.09em;
	text-transform: uppercase;
}

.re-editorial-page--product .re-product-signal__value {
	color: var(--re-product-navy);
	font-family: Inter, sans-serif;
	font-size: 0.97rem;
	font-weight: 400;
	line-height: 1.5;
}

.re-editorial-page--product .re-product-signal {
	border-top: 1px solid var(--re-product-line);
	border-inline: 0;
	display: grid;
	gap: 0.4rem;
	padding: 0.9rem 1.4rem 0 0;
}

/* The hero caption described the fact that it was an image. Let it sit
   quietly under the photo rather than banding across it. */
.re-editorial-page--product .re-product-hero__media figcaption {
	background: transparent;
	border: 0;
	color: var(--re-product-graphite);
	font-family: Inter, sans-serif;
	font-size: 0.78rem;
	letter-spacing: 0;
	padding: 0.55rem 0 0;
}

/* Three corrections to the block above.
   The fit panels kept their box because .re-product-fit .re-dossier outranks
   an :is() list - and they carried the 4px copper bar down the left edge,
   which is the single most recognisable stock-template flourish on the page.
   The signals row drew a rule, then a gap, then a second rule, leaving an
   empty strip. And its values started at whatever height their label left
   them, so nothing lined up across the four columns. */
.re-editorial-page--product .re-product-fit .re-dossier {
	background: transparent;
	border: 0;
	border-radius: 0;
	box-shadow: none;
	padding: 0;
}

.re-editorial-page--product .re-product-fit {
	column-gap: 3.5rem;
}

.re-editorial-page--product .re-product-signals {
	background: transparent;
	border-top: 0;
	padding-block-start: 0;
}

/* Line the answers up across the row. display:contents would do it at four
   columns and break at two and one, because the row each item lands in has
   to be written by hand; subgrid gets it right at any column count. Without
   subgrid the pair simply stacks, which is where it started. */
.re-editorial-page--product .re-product-signal {
	border-inline-end: 0;
	border-top: 1px solid var(--re-product-line);
	padding: 0.85rem 1.6rem 0 0;
}

.re-editorial-page--product .re-product-signal__label {
	margin: 0;
	padding: 0 0 0.5rem;
}

.re-editorial-page--product .re-product-signal__value {
	margin: 0;
	padding: 0;
}

@supports (grid-template-rows: subgrid) {
	.re-editorial-page--product .re-product-signal {
		display: grid;
		grid-row: span 2;
		grid-template-rows: subgrid;
	}
}

/* The passport and the compatibility block kept their fills from later
   rules. */
.re-editorial-page--product :is(.re-dossier--specs, .re-dossier--compatibility) {
	background: transparent;
	border: 0;
	border-radius: 0;
}

.re-editorial-page--product .re-dossier--compatibility {
	border-top: 1px solid var(--re-product-line);
}


/* The product's own identifier, set the way it is printed on the roll.
   A copper rule ties it to the title above it; the mono face is the same
   one the specification table uses, so the code reads as data wherever it
   appears on the page. */
.re-editorial-page--product .re-product-code {
	border-top: 2px solid var(--re-product-copper);
	display: grid;
	gap: 0.3rem;
	margin: 0.9rem 0 1.4rem;
	max-width: 34rem;
	padding: 0.85rem 0 0;
}

.re-editorial-page--product .re-product-code__label {
	color: var(--re-product-copper-text);
	font-family: "IBM Plex Mono", ui-monospace, monospace;
	font-size: 0.66rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.re-editorial-page--product .re-product-code__value {
	color: var(--re-product-navy);
	font-family: "IBM Plex Mono", ui-monospace, monospace;
	font-size: clamp(1.05rem, 1.6vw, 1.32rem);
	font-weight: 500;
	line-height: 1.25;
	overflow-wrap: anywhere;
}

/* Material Passport: the unenhanced document keeps every verified option and
   quote path visible; JavaScript only improves selection and disclosure. */
.re-editorial-page--product :is(.re-product-variant-choices, .re-product-variants, .re-product-faqs) {
	margin-top: clamp(40px, 6vw, 72px);
}

.re-editorial-page--product :is(.re-dossier--variant-selector, .re-dossier--variants, .re-dossier--faqs) {
	background: transparent;
	border: 0;
	border-top: 1px solid var(--re-product-line);
	border-radius: 0;
	padding: 28px 0 0;
}

.re-editorial-page--product .re-variant-choices {
	display: grid;
	gap: 10px;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	margin: 18px 0;
}

.re-editorial-page--product .re-dossier--variant-selector fieldset {
	border: 0;
	margin: 0;
	min-width: 0;
	padding: 0;
}

.re-editorial-page--product .re-dossier--variant-selector legend {
	color: var(--re-product-graphite);
	font-size: 0.9rem;
	font-weight: 650;
}

.re-editorial-page--product .re-variant-choice {
	align-items: center;
	border: 1px solid var(--re-product-line);
	cursor: pointer;
	display: flex;
	gap: 10px;
	min-height: 48px;
	padding: 10px 12px;
}

.re-editorial-page--product .re-variant-choice:has(input:checked) {
	border-color: var(--re-product-copper);
	box-shadow: inset 3px 0 0 var(--re-product-copper);
}

.re-editorial-page--product .re-variant-choice input {
	accent-color: var(--re-product-copper-text);
	block-size: 20px;
	inline-size: 20px;
}

.re-editorial-page--product .re-variant-summary {
	color: var(--re-product-graphite);
	font-size: 0.9rem;
	margin: 0 0 16px;
}

.re-editorial-page--product .re-variant-table {
	border-collapse: collapse;
	font-size: 0.88rem;
	min-width: 100%;
	width: max-content;
}

.re-editorial-page--product .re-variant-table caption {
	color: var(--re-product-graphite);
	font-size: 0.82rem;
	padding: 0 0 12px;
	text-align: left;
}

.re-editorial-page--product .re-variant-table :is(th, td) {
	border-bottom: 1px solid var(--re-product-line);
	padding: 13px 14px;
	text-align: left;
	vertical-align: top;
}

.re-editorial-page--product .re-variant-table thead th {
	background: var(--re-product-mist);
	color: var(--re-product-navy);
	font-family: "IBM Plex Mono", ui-monospace, monospace;
	font-size: 0.7rem;
	letter-spacing: 0.04em;
}

.re-editorial-page--product .re-variant-quote {
	color: var(--re-product-copper-text);
	font-weight: 650;
	white-space: nowrap;
}

.re-editorial-page--product .re-product-faq + .re-product-faq {
	border-top: 1px solid var(--re-product-line);
	margin-top: 22px;
	padding-top: 22px;
}

.re-editorial-page--product .re-product-faq h3 {
	font-family: "Barlow Condensed", "Arial Narrow", sans-serif;
	font-size: 1.25rem;
	line-height: 1.2;
	margin: 0 0 8px;
}

.re-editorial-page--product .re-product-faq p {
	color: var(--re-product-graphite);
	line-height: 1.65;
	margin: 0;
}

.re-editorial-page--product .re-variant-media__warning {
	color: var(--re-product-copper-text);
	font-size: 0.82rem;
	font-weight: 650;
}

.re-editorial-page--product .re-variant-disclosure,
.re-editorial-page--product [data-product-sticky-quote] {
	display: none;
}

@media (max-width: 781px) {
	.re-editorial-page--product .re-variant-choices {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.re-editorial-page--product .re-variant-table {
		display: block;
		min-width: 0;
		width: 100%;
	}

	.re-editorial-page--product .re-variant-table thead {
		clip: rect(0 0 0 0);
		clip-path: inset(50%);
		height: 1px;
		overflow: hidden;
		position: absolute;
		white-space: nowrap;
		width: 1px;
	}

	.re-editorial-page--product .re-variant-table :is(tbody, tr, th, td) {
		display: block;
		width: 100%;
	}

	.re-editorial-page--product .re-variant-table tr {
		border: 1px solid var(--re-product-line);
		margin-bottom: 16px;
		padding: 6px 14px;
	}

	.re-editorial-page--product .re-variant-table :is(th[scope="row"], td) {
		align-items: baseline;
		display: grid;
		gap: 14px;
		grid-template-columns: minmax(7rem, 38%) 1fr;
		padding-inline: 0;
	}

	.re-editorial-page--product .re-variant-table :is(th[scope="row"], td)::before {
		color: var(--re-product-graphite);
		content: attr(data-label);
		font-family: "IBM Plex Mono", ui-monospace, monospace;
		font-size: 0.68rem;
		letter-spacing: 0.04em;
	}

	.re-editorial-page--product.is-passport-enhanced [data-variant-secondary][hidden] {
		display: none !important;
	}

	.re-editorial-page--product .re-variant-disclosure:not([hidden]) {
		align-items: center;
		background: transparent;
		border: 1px solid var(--re-product-line);
		color: var(--re-product-navy);
		display: inline-flex;
		font-size: 0.78rem;
		justify-content: center;
		margin-top: 10px;
		min-height: 44px;
		padding: 8px 12px;
	}

	.re-editorial-page--product.has-product-sticky-quote {
		padding-bottom: calc(76px + env(safe-area-inset-bottom)) !important;
	}

	.re-editorial-page--product [data-product-sticky-quote]:not([hidden]) {
		align-items: center;
		background: var(--re-product-navy);
		bottom: 0;
		display: flex;
		inset-inline: 0;
		justify-content: center;
		padding: 10px max(16px, env(safe-area-inset-right)) calc(10px + env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));
		position: fixed;
		transition: none;
		z-index: 90;
	}

	.re-editorial-page--product [data-product-sticky-quote] a {
		align-items: center;
		display: inline-flex;
		justify-content: center;
		min-height: 48px;
		width: min(100%, 34rem);
	}
}

@media (max-width: 480px) {
	.re-editorial-page--product .re-variant-choices {
		grid-template-columns: 1fr;
	}
}

/* Blue commerce product dossier
 * Keeps the server-rendered product document intact while aligning its visual
 * hierarchy with the light, image-led catalogue system. */
.re-editorial-page--product {
	--re-product-navy: var(--foreground);
	--re-product-copper: var(--primary);
	--re-product-copper-text: var(--chart-3);
	--re-product-paper: var(--background);
	--re-product-mist: var(--muted);
	--re-product-graphite: var(--muted-foreground);
	--re-product-line: var(--border);
	--re-product-radius: 1.5rem;
	background: var(--background);
	color: var(--foreground);
	padding-bottom: clamp(3.5rem, 7vw, 6.5rem) !important;
}

.re-editorial-page--product .re-product-shell {
	padding-block: clamp(1rem, 2vw, 1.75rem) 0;
}

.re-editorial-page--product .re-breadcrumb,
.re-editorial-page--product .re-breadcrumbs {
	color: var(--muted-foreground);
	font-size: 0.82rem;
	margin: 0 0 1rem;
}

.re-editorial-page--product .re-product-hero {
	align-items: center;
	background: var(--muted);
	border: 1px solid var(--border);
	border-radius: 1.875rem;
	box-shadow: 0 1.25rem 3.5rem rgb(30 58 138 / 0.08);
	gap: clamp(1.5rem, 4vw, 3.5rem);
	grid-template-columns: minmax(0, 1.02fr) minmax(22rem, 0.98fr);
	min-height: 0;
	padding: clamp(1.25rem, 3.25vw, 3rem);
}

.re-editorial-page--product .re-product-hero__copy {
	align-self: center;
}

.re-editorial-page--product :is(.re-section-kicker, .re-product-utility) {
	color: var(--primary);
	font-family: var(--font-mono);
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.1em;
}

.re-editorial-page--product .re-product-utility__label {
	color: var(--primary);
}

.re-editorial-page--product .re-product-utility__class {
	border-color: var(--border);
	color: var(--muted-foreground);
}

.re-editorial-page--product .re-product-title {
	color: var(--foreground);
	font-size: clamp(2.75rem, 4.75vw, 4.25rem);
	letter-spacing: -0.045em;
	line-height: 0.92;
	max-width: 10ch;
}

.re-editorial-page--product .re-product-summary {
	color: var(--muted-foreground);
	font-size: clamp(1rem, 1.35vw, 1.18rem);
	line-height: 1.65;
	margin-top: 1.5rem;
}

.re-editorial-page--product .re-product-code {
	border-color: var(--primary);
}

.re-editorial-page--product .re-product-code__label {
	color: var(--chart-3);
}

.re-editorial-page--product .re-product-code__value {
	color: var(--foreground);
}

.re-editorial-page--product .re-contact-actions .wp-element-button,
.re-editorial-page--product .re-product-contact > .wp-element-button {
	background: var(--primary);
	border: 1px solid var(--primary);
	border-radius: 999px;
	color: var(--primary-foreground);
	font-family: var(--font-sans);
	font-size: 0.88rem;
	font-weight: 750;
	min-height: 46px;
	padding: 0.75rem 1.25rem;
	text-decoration: none;
}

.re-editorial-page--product .re-product-contact--light .is-style-primary .wp-element-button {
	background: var(--primary);
	color: var(--primary-foreground);
}

.re-editorial-page--product .re-product-contact--light .is-style-secondary .wp-element-button,
.re-editorial-page--product .re-product-contact--light .is-style-ghost .wp-element-button {
	background: var(--background);
	border-color: var(--border);
	color: var(--foreground);
}

.re-editorial-page--product .re-product-hero__media,
.re-editorial-page--product .re-product-hero-figure {
	background: var(--secondary);
	border-color: var(--border);
	border-radius: 1.5rem;
	overflow: hidden;
}

.re-editorial-page--product .re-product-hero__media {
	aspect-ratio: 4 / 3;
	box-shadow: 0 1rem 2.5rem rgb(30 58 138 / 0.12);
}

.re-editorial-page--product .re-product-hero-figure__image {
	object-fit: cover;
}

.re-editorial-page--product .re-product-hero-figure figcaption {
	background: rgb(255 255 255 / 0.94);
	border-color: var(--border);
	color: var(--muted-foreground);
}

.re-editorial-page--product .re-product-signals {
	background: transparent;
	border: 0;
}

.re-editorial-page--product .re-product-signals__list {
	gap: 0.75rem;
}

.re-editorial-page--product .re-product-signal {
	background: var(--background);
	border: 1px solid var(--border);
	border-radius: 1rem;
	padding: 1.1rem 1.25rem;
}

.re-editorial-page--product .re-product-signal:last-child {
	border-inline-end: 1px solid var(--border);
}

.re-editorial-page--product .re-product-signal__label {
	color: var(--chart-3);
}

.re-editorial-page--product .re-product-signal__value {
	color: var(--foreground);
}

.re-editorial-page--product .re-product-fit .re-dossier,
.re-editorial-page--product :is(.re-dossier, .re-product-story, .re-product-custom, .re-product-visuals) {
	background: var(--background);
	border-color: var(--border);
	border-radius: 1.25rem;
}

.re-editorial-page--product .re-product-fit .re-dossier {
	border-left: 1px solid var(--border);
	box-shadow: inset 4px 0 0 var(--primary);
}

.re-editorial-page--product .re-product-fit .re-dossier--not-suitable {
	box-shadow: inset 4px 0 0 var(--muted-foreground);
}

.re-editorial-page--product :is(.re-dossier--variant-selector, .re-dossier--variants, .re-dossier--faqs) {
	border-top-color: var(--border);
}

.re-editorial-page--product .re-variant-choice {
	background: var(--background);
	border-color: var(--border);
	border-radius: 0.75rem;
}

.re-editorial-page--product .re-variant-choice:has(input:checked) {
	border-color: var(--primary);
	box-shadow: inset 3px 0 0 var(--primary);
}

.re-editorial-page--product .re-variant-choice input {
	accent-color: var(--primary);
}

.re-editorial-page--product .re-table-scroll {
	border: 1px solid var(--border);
	border-radius: 1rem;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

.re-editorial-page--product :is(.re-table-scroll table, .re-variant-table) {
	background: var(--background);
	border-collapse: collapse;
	min-width: 100%;
}

.re-editorial-page--product :is(.re-table-scroll th, .re-table-scroll td, .re-variant-table th, .re-variant-table td) {
	border-color: var(--border);
	padding: 0.85rem 1rem;
}

.re-editorial-page--product :is(.re-table-scroll th, .re-variant-table thead th) {
	background: var(--muted);
	color: var(--foreground);
}

.re-editorial-page--product .re-product-faq {
	background: var(--muted);
	border: 1px solid var(--border);
	border-radius: 1rem;
	padding: 1.25rem;
}

.re-editorial-page--product .re-product-faq + .re-product-faq {
	border-top: 1px solid var(--border);
	margin-top: 0.75rem;
	padding-top: 1.25rem;
}

.re-editorial-page--product .re-product-faq h3 {
	color: var(--foreground);
}

.re-editorial-page--product .re-product-faq p,
.re-editorial-page--product .re-variant-summary {
	color: var(--muted-foreground);
}

.re-editorial-page--product .re-variant-quote,
.re-editorial-page--product .re-variant-media__warning {
	color: var(--chart-3);
}

@media (max-width: 781px) {
	.re-editorial-page--product .re-product-wide {
		padding-inline: 1rem;
	}

	.re-editorial-page--product .re-product-reading {
		margin-inline: 1rem;
		width: auto;
	}

	.re-editorial-page--product .re-product-hero {
		gap: 1.5rem;
		grid-template-columns: minmax(0, 1fr);
		padding: 1.1rem;
	}

	.re-editorial-page--product .re-product-hero__copy {
		order: 1;
		padding: 0.65rem 0.35rem 0;
	}

	.re-editorial-page--product .re-product-hero__media {
		order: 2;
	}

	.re-editorial-page--product .re-product-title {
		font-size: clamp(2.5rem, 12vw, 3rem);
	}

	.re-editorial-page--product .re-product-signals__list,
	.re-editorial-page--product .re-product-fit,
	.re-editorial-page--product .re-variant-choices {
		grid-template-columns: minmax(0, 1fr);
	}

	.re-editorial-page--product .re-product-signal {
		border: 1px solid var(--border);
	}

	.re-editorial-page--product .re-variant-table tr {
		border-color: var(--border);
		border-radius: 0.75rem;
	}

	.re-editorial-page--product [data-product-sticky-quote]:not([hidden]) {
		background: rgb(255 255 255 / 0.94);
		border-top: 1px solid var(--border);
		backdrop-filter: blur(10px);
	}
}

/* Final product-page type and media alignment with the approved storefront. */
.re-editorial-page--product :is(.re-product-title, h2, h3, .re-dossier__related-title) {
	font-family: var(--font-sans);
	letter-spacing: -0.035em;
}

/* The legacy grouped selector above carries element specificity through :is(). */
.re-editorial-page--product .re-product-hero .re-product-title,
.re-editorial-page--product [data-section] :is(h2, h3),
.re-editorial-page--product .re-product-cta-wrap :is(h2, h3) {
	font-family: var(--font-sans);
}

.re-editorial-page--product .re-product-title {
	font-size: clamp(2.5rem, 4.15vw, 3.75rem);
	font-weight: 780;
	line-height: 1;
	max-width: 14ch;
}

.re-editorial-page--product h2 {
	font-weight: 740;
	line-height: 1.08;
}

.re-editorial-page--product h3,
.re-editorial-page--product .re-dossier__related-title {
	font-weight: 700;
	line-height: 1.16;
}

.re-editorial-page--product .re-product-hero__media {
	background: linear-gradient(145deg, #ffffff 0%, #eef5ff 100%);
}

.re-editorial-page--product .re-product-hero-figure picture {
	background: #ffffff;
	display: block;
	min-height: 0;
	overflow: hidden;
}

.re-editorial-page--product .re-product-hero-figure__image {
	background: #ffffff;
	object-fit: contain;
}

@media (max-width: 781px) {
	.re-editorial-page--product .re-product-title {
		font-size: clamp(2.25rem, 10.5vw, 2.75rem);
	}
}

/* WCAG AA contrast guard for the light storefront palette. */
.re-editorial-page--product :is(.re-section-kicker, .re-product-utility__label) {
	color: #1d4ed8;
}

.re-editorial-page--product .re-contact-actions .wp-element-button,
.re-editorial-page--product .re-product-contact > .wp-element-button,
.re-editorial-page--product .re-product-contact--light .is-style-primary .wp-element-button {
	background: #2563eb !important;
	border-color: #2563eb !important;
	color: #fff !important;
}

.re-editorial-page--product .re-dossier--custom-production {
	background: #1e3a8a;
	border-color: #1e40af;
	color: #fff;
}

.re-editorial-page--product .re-dossier--custom-production .re-product-utility {
	color: #ffd0b8;
}

.re-editorial-page--product .re-dossier--custom-production > p:not(.re-product-utility) {
	color: #e5edf7;
}