.contact-cta {
	.contact-cta__panel {
		position: relative;
		overflow: hidden;
		isolation: isolate;
		display: flex;
		align-items: flex-start;
		flex-direction: column;
		gap: 48px;
		padding: clamp(34px, 6vw, 76px);
	}

	.contact-cta__dots {
		position: absolute;
		inset: 0;
		z-index: -1;
		width: 100%;
		height: 100%;
		pointer-events: none;
		mask-image: radial-gradient(circle at 100% 0%, var(--black) 0%, color-mix(in srgb, var(--black) 72%, transparent) 48%, transparent 85%);
		-webkit-mask-image: radial-gradient(circle at 100% 0%, var(--black) 0%, color-mix(in srgb, var(--black) 72%, transparent) 48%, transparent 85%);
	}

	.contact-cta__copy .meta-label {
		margin-bottom: 16px;
		font-size: 14px;
	}

	.contact-cta__copy h2 {
		max-width: 18ch;
		font-size: clamp(30px, 4vw, 52px);
		font-weight: 400;
		line-height: 1.1;
		letter-spacing: 0.04em;
		color: var(--white);
		text-wrap: balance;
	}

	.contact-cta__actions {
		display: flex;
		flex-wrap: wrap;
		gap: 12px;
	}

	@media (max-width: 760px) {
		.contact-cta__panel {
			align-items: flex-start;
			flex-direction: column;
			gap: 32px;
		}
	}
}


.difference {
	.difference__stack {
		display: flex;
		flex-direction: column;
		gap: 24px;
	}

	.difference__card {
		position: sticky;
		top: calc(96px + var(--stack-index) * 28px);
		display: grid;
		grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
		gap: clamp(28px, 5vw, 64px);
		align-items: center;
		min-height: 390px;
		padding: clamp(28px, 5vw, 56px);
		overflow: hidden;
	}

	.difference__copy h3 {
		position: relative;
		font-size: clamp(24px, 3vw, 34px);
		line-height: 1.2;
		font-weight: 400;
		letter-spacing: 0.04em;
		color: var(--white);
		margin-bottom: 24px;
		max-width: 18ch;
		text-wrap: balance;
	}

	.difference__copy .text-body-muted {
		position: relative;
		max-width: 40ch;
	}

	.difference__media {
		position: relative;
		border-radius: var(--radius-card);
		border: var(--hairline);
		aspect-ratio: 16 / 10;
	}

	.difference__media::after {
		content: '';
		position: absolute;
		inset: 0;
		border: 1px solid color-mix(in srgb, var(--teal) 15%, transparent);
		border-radius: inherit;
		pointer-events: none;
	}

	@media (max-width: 900px) {
		.difference__card {
			grid-template-columns: 1fr;
			gap: 32px;
			padding: 28px;
			top: calc(72px + var(--stack-index) * 16px);
		}
	}

	@media (max-width: 600px) {
		.difference__card {
			position: relative;
			top: auto;
			min-height: 0;
		}
	}
}


.hero {
	position: relative;
	z-index: 1;
	min-height: 100vh;
	min-height: 100svh;
	display: flex;
	flex-direction: column;
	background:
		linear-gradient(90deg,
			color-mix(in srgb, var(--black) 92%, transparent) 0%,
			color-mix(in srgb, var(--black) 55%, transparent) 45%,
			color-mix(in srgb, var(--black) 20%, transparent) 100%),
		linear-gradient(0deg, color-mix(in srgb, var(--black) 80%, transparent) 0%, transparent 40%);

	.hero-canvas {
		position: absolute;
		inset: 0;
		z-index: 0;
		pointer-events: none;
		overflow: hidden;
	}

	.lidar-canvas {
		position: absolute;
		top: 0;
		right: 0;
		width: 100%;
		height: 100%;
		mask-image: radial-gradient(circle at 100% 0%,
				var(--black) 0%,
				color-mix(in srgb, var(--black) 85%, transparent) 45%,
				transparent 80%);
		-webkit-mask-image: radial-gradient(circle at 100% 0%,
				var(--black) 0%,
				color-mix(in srgb, var(--black) 85%, transparent) 45%,
				transparent 80%);
	}

	.hero-body {
		flex: 1;
		display: flex;
		flex-direction: column;
		width: 100%;
		min-height: 0;
		overflow: hidden;
	}

	.hero-copy {
		max-width: 680px;
	}

	.hero-title {
		font-size: clamp(40px, 7vw, 64px);
		line-height: 1.05;
		font-weight: 400;
		letter-spacing: 0.1em;
		text-transform: uppercase;
		color: var(--white);
		margin-bottom: 16px;
	}

	.hero-subtitle {
		font-size: clamp(22px, 3vw, 28px);
		line-height: 1.25;
		font-weight: 400;
		letter-spacing: 0.1em;
		text-transform: uppercase;
		color: var(--white--90);
		margin-bottom: 28px;
	}

	.hero-intro {
		font-size: 18px;
		line-height: 30px;
		color: var(--white--70);
		max-width: 540px;
		margin-bottom: 20px;
	}

	.hero-banner {
		font-size: 14px;
		line-height: 22px;
		color: var(--teal);
		letter-spacing: 0.06em;
	}

	.hero-rail {
		position: relative;
		overflow: hidden;
		isolation: isolate;
		display: flex;
		flex-direction: column;
		flex: 1;
		min-height: 0;
		padding-block-start: 96px;
		padding-block-end: clamp(96px, 14vh, calc(var(--marquee-height) * 1.5));
	}

	.hero-rail__rail {
		position: relative;
		margin-top: 0;
		flex: 1;
		display: flex;
		align-items: center;
		min-height: clamp(160px, 33vh, 300px);
		pointer-events: none;
		z-index: 0;
		mask-image: linear-gradient(90deg, transparent 0%, black 10%, black 90%, transparent 100%);
		-webkit-mask-image: linear-gradient(90deg, transparent 0%, black 10%, black 90%, transparent 100%);
	}

	.hero-rail__track {
		--hero-rail-track-gap: 96px;
		display: flex;
		align-items: flex-end;
		width: max-content;
		animation: hero-rail-drift 54s linear infinite;
		will-change: transform;
	}

	.hero-rail__track-set {
		display: flex;
		align-items: flex-end;
		flex-shrink: 0;
		gap: var(--hero-rail-track-gap);
	}

	.hero-rail__track-gap {
		flex-shrink: 0;
		width: var(--hero-rail-track-gap);
	}

	.hero-rail__unit {
		margin: 0;
		flex-shrink: 0;
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 10px;
		transform-origin: center;
	}

	.hero-rail__unit img {
		display: block;
		height: clamp(110px, 16vh, 190px);
		width: auto;
	}

	.hero-rail__unit figcaption {
		font-size: 10px;
		font-weight: 500;
		letter-spacing: 0.22em;
		text-transform: uppercase;
		color: var(--white--50);
		white-space: nowrap;
	}

	.hero-rail__fade {
		position: absolute;
		inset: 0;
		background: linear-gradient(90deg, var(--black) 0%, transparent 20%, transparent 52%, var(--black) 100%);
		filter: blur(96px);
		pointer-events: none;
	}

	.hero-rail .hero-copy {
		position: relative;
		z-index: 1;
		flex-shrink: 0;
		margin-top: clamp(20px, 3vh, 40px);
	}

	@media (max-width: 900px) {
		.hero-intro {
			font-size: 16px;
			line-height: 26px;
		}

		.hero-rail__unit {
			transform: scale(1.2);
		}

		.hero-rail__track {
			--hero-rail-track-gap: 22vw;
		}
	}

	@media (prefers-reduced-motion: reduce) {
		.hero-rail__track {
			animation: none;
		}
	}

	@media (min-width: 1536px) {
		.hero-rail.wrap {
			flex-direction: row;
			align-items: center;
			max-width: none;
			margin-inline: 0;
			padding-left: var(--inset-gutter);
			padding-right: 0;
		}

		.hero-rail .hero-copy {
			flex: 0 0 auto;
			width: min(680px, 42vw);
			margin-top: 0;
		}

		.hero-rail__rail {
			flex: 1 1 auto;
			min-width: 0;
			margin-top: 0;
			min-height: clamp(200px, 36vh, 340px);
			mask-image: linear-gradient(90deg, transparent 0%, black 14%, black 100%);
			-webkit-mask-image: linear-gradient(90deg, transparent 0%, black 14%, black 100%);
		}

		.hero-rail__fade {
			background: linear-gradient(90deg, var(--black) 0%, transparent 24%, transparent 100%);
		}

		.hero-rail__unit img {
			height: clamp(130px, 18vh, 220px);
		}
	}
}

@keyframes hero-rail-drift {
	from {
		transform: translateX(-50%);
	}

	to {
		transform: translateX(0);
	}
}


.industries {
	position: relative;
	min-height: 720px;
	display: flex;
	align-items: center;
	overflow: hidden;

	.industries__bg {
		position: absolute;
		inset: 0;
		width: 100%;
		height: 100%;
		object-fit: cover;
		opacity: 0;
		transform: scale(1.12);
		transition: opacity 1s ease, transform 6s ease;
		pointer-events: none;
	}

	.industries__bg.is-active {
		opacity: 0.22;
		transform: scale(1.02);
	}

	.industries__scrim {
		position: absolute;
		inset: 0;
		background:
			linear-gradient(90deg,
				color-mix(in srgb, var(--black) 96%, transparent) 0%,
				color-mix(in srgb, var(--black) 20%, transparent) 48%,
				color-mix(in srgb, var(--black) 1%, transparent) 80%),
			linear-gradient(0deg, color-mix(in srgb, var(--black) 85%, transparent) 0%, transparent 35%);
		pointer-events: none;
	}

	.industries__inner {
		position: relative;
		width: 100%;
	}

	.industries__grid {
		display: grid;
		grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
		gap: clamp(32px, 6vw, 80px);
		align-items: center;
	}

	.industries__tabs {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
	}

	.industries__tab {
		display: flex;
		align-items: baseline;
		gap: 16px;
		background: none;
		border: 0;
		border-bottom: var(--hairline);
		padding: 20px 0;
		cursor: pointer;
		font-family: var(--font);
		text-align: left;
	}

	.industries__tab-num {
		font-size: 14px;
		letter-spacing: 0.04em;
		color: var(--white--50);
		font-variant-numeric: tabular-nums;
		transition: color 0.4s ease;
	}

	.industries__tab-label {
		font-size: clamp(18px, 2vw, 24px);
		line-height: 1.2;
		font-weight: 400;
		letter-spacing: 0.06em;
		color: var(--white--50);
		transition: color 0.4s ease, font-style 0s, transform 0.5s cubic-bezier(0.22, 1, 0.36, 1);
		display: inline-block;
	}

	.industries__tab:hover .industries__tab-label {
		color: var(--white--70);
	}

	.industries__tab.is-active .industries__tab-label {
		color: var(--white);
		transform: translateX(10px);
	}

	.industries__tab.is-active .industries__tab-num {
		color: var(--teal);
	}

	.industries__detail {
		display: grid;
		align-self: start;
	}

	.industries__detail-inner {
		grid-area: 1 / 1;
		max-width: 600px;
		padding: clamp(28px, 4vw, 48px);
		visibility: hidden;
		opacity: 0;
		pointer-events: none;
	}

	.industries__detail-inner.is-active {
		visibility: visible;
		opacity: 1;
		pointer-events: auto;
		animation: industries-in 0.6s cubic-bezier(0.22, 1, 0.36, 1) both;
	}

	.industries__detail-inner h3 {
		font-size: clamp(24px, 2.4vw, 32px);
		line-height: 1.2;
		font-weight: 400;
		letter-spacing: 0.04em;
		color: var(--white);
		margin-bottom: 16px;
		text-wrap: balance;
	}

	.industries__detail-inner .text-body-muted {
		margin-bottom: 28px;
	}

	.industries__detail-meta {
		font-size: 14px;
		font-variant-numeric: tabular-nums;
		margin-bottom: 18px;
	}

	@media (max-width: 900px) {
		min-height: 0;
		padding: 72px 0;

		.industries__grid {
			grid-template-columns: 1fr;
			gap: 36px;
		}

		.industries__detail-inner {
			padding: 28px 26px;
		}

		.industries__tab.is-active .industries__tab-label {
			transform: translateX(6px);
		}
	}
}

@keyframes industries-in {
	from {
		opacity: 0;
		transform: translateY(20px);
	}
}


.logo-marquee {
	position: relative;
	z-index: 2;
	margin-top: calc(-1 * var(--marquee-height));
	border-bottom: 1px solid var(--white--8);

	.logo-marquee__panel {
		padding: var(--marquee-padding-block) 0;
		backdrop-filter: blur(6px);
		-webkit-backdrop-filter: blur(6px);
		border-top: var(--hairline);
	}

	.logo-marquee__viewport {
		overflow: hidden;
		mask-image: linear-gradient(90deg, transparent, var(--black) 12%, var(--black) 88%, transparent);
		-webkit-mask-image: linear-gradient(90deg, transparent, var(--black) 12%, var(--black) 88%, transparent);
	}

	.logo-marquee__track {
		display: flex;
		width: max-content;
		animation: logo-marquee 48s linear infinite;
	}

	.logo-marquee__list {
		display: flex;
		align-items: center;
		gap: 72px;
		list-style: none;
		padding: 0 36px;
	}

	.logo-marquee__list img {
		display: block;
		height: var(--marquee-logo-height);
		width: auto;
		opacity: 0.55;
		filter: grayscale(1);
		transition: opacity 0.4s ease;
	}

	.logo-marquee__list img:hover {
		opacity: 0.85;
	}

	@media (prefers-reduced-motion: reduce) {
		.logo-marquee__track {
			animation: none;
			width: 100%;
			flex-wrap: wrap;
			justify-content: center;
			gap: 32px 72px;
		}

		.logo-marquee__list {
			padding: 0;
		}

		.logo-marquee__list[aria-hidden='true'] {
			display: none;
		}
	}
}

@keyframes logo-marquee {
	from {
		transform: translateX(0);
	}

	to {
		transform: translateX(-50%);
	}
}


.news {
	.news__grid {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		gap: var(--grid-gap);
		margin-bottom: 40px;
	}

	.news__card {
		display: flex;
		flex-direction: column;
		text-decoration: none;
		color: var(--white);
		overflow: hidden;
		transition: border-color 0.5s ease, transform 0.5s ease;
	}

	.news__card:hover {
		border-color: var(--white--30);
		transform: translateY(-4px);
	}

	.news__card:hover .news__img img {
		transform: scale(1.05);
	}

	.news__card:hover h3 {
		color: var(--teal);
	}

	.news__card:hover .news__arrow {
		transform: translateX(5px);
	}

	.news__card h3 {
		order: 2;
		font-size: 22px;
		line-height: 1.3;
		font-weight: 400;
		letter-spacing: 0.04em;
		color: var(--white);
		margin: 0 24px 12px;
		display: -webkit-box;
		-webkit-line-clamp: 3;
		line-clamp: 3;
		-webkit-box-orient: vertical;
		overflow: hidden;
		transition: color 0.4s ease;
	}

	.news__card p {
		order: 3;
		font-size: 13px;
		line-height: 1.6;
		color: var(--white--70);
		margin: 0 24px 20px;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		line-clamp: 2;
		-webkit-box-orient: vertical;
		overflow: hidden;
	}

	.news__img {
		aspect-ratio: 16 / 9;
	}

	.news__img img {
		transition: transform 0.6s ease;
	}

	.news__date {
		order: 1;
		margin: 24px 24px 14px;
		font-variant-numeric: tabular-nums;
	}

	.news__cta {
		order: 4;
		margin: auto 24px 24px;
		display: inline-flex;
		align-items: center;
		gap: 10px;
	}

	.news__arrow {
		transition: transform 0.3s ease;
	}

	@media (max-width: 900px) {
		.news__grid {
			grid-template-columns: 1fr;
			gap: 44px;
		}
	}
}


.product-breakdown {
	/* Prefer overflow-x clip only — overflow-y clip/hidden breaks sticky descendants */
	overflow-x: clip;
	overflow-y: visible;
	scroll-snap-align: start;

	.product-breakdown__head {
		display: flex;
		justify-content: space-between;
		align-items: flex-end;
		gap: 32px;
		margin-bottom: clamp(44px, 6vw, 72px);
	}

	.product-breakdown__head .section-title {
		margin: 0;
		max-width: 26ch;
		text-align: left;
	}

	.product-breakdown__aside {
		flex: none;
		font-family: var(--font);
		font-size: 11px;
		letter-spacing: 0.2em;
		line-height: 2;
		color: var(--white--30);
		text-align: right;
		text-transform: uppercase;
	}

	.product-breakdown__aside span {
		display: block;
	}

	.product-breakdown__bench {
		--stage-top: clamp(80px, 11vh, 120px);
		--stage-h: clamp(420px, 56svh, 560px);
		--stage-mid: calc(var(--stage-top) + var(--stage-h) / 2);
		display: grid;
		grid-template-columns: minmax(300px, 0.92fr) minmax(420px, 1.08fr);
		gap: clamp(36px, 5vw, 72px);
		align-items: start;
		font-family: var(--font);
	}

	.product-breakdown__stage {
		position: sticky;
		top: var(--stage-top);
		height: var(--stage-h);
		min-height: var(--stage-h);
		overflow: hidden;
		isolation: isolate;
		background: var(--black);
		border: var(--hairline);
		border-radius: var(--radius-card);
	}

	.product-breakdown__stage-bay {
		position: absolute;
		inset: 0;
		z-index: -1;
		background: var(--card-wash), var(--dark-2);
	}

	.product-breakdown__stage-head {
		position: absolute;
		top: 22px;
		right: 24px;
		left: 24px;
		z-index: 3;
		display: flex;
		justify-content: flex-end;
	}

	.product-breakdown__stage-counter {
		font-family: var(--font);
		font-size: 11px;
		font-weight: 500;
		letter-spacing: 0.2em;
		font-variant-numeric: tabular-nums;
		color: var(--white--30);
		text-transform: uppercase;
	}

	.product-breakdown__stage-counter span {
		margin: 0 0.35em;
		color: var(--white--15);
	}

	.product-breakdown__image-stack {
		position: absolute;
		inset: 48px 10% 108px;
	}

	.product-breakdown__stage-media {
		position: absolute;
		inset: 0;
		transform-origin: 50% 55%;
		will-change: transform, opacity;
		pointer-events: none;
	}

	.product-breakdown__stage-media .product-thumb {
		width: 100%;
		height: 100%;
	}

	.product-breakdown__stage-media img {
		position: absolute;
		inset: 0;
		width: 100%;
		height: 100%;
		object-fit: contain;
		pointer-events: none;
	}

	.product-breakdown__stage-meta {
		position: absolute;
		right: 24px;
		bottom: 28px;
		left: 24px;
		z-index: 3;
		display: flex;
		justify-content: space-between;
		align-items: flex-end;
		gap: 20px;
	}

	.product-breakdown__stage-meta strong {
		display: block;
		font-size: clamp(22px, 2.4vw, 32px);
		font-weight: 400;
		letter-spacing: 0.08em;
		text-transform: uppercase;
		text-wrap: balance;
	}

	.product-breakdown__stage-copy {
		display: grid;
		gap: 8px;
		min-width: 0;
	}

	.product-breakdown__stage-flag,
	.product-breakdown__flag {
		font-size: 11px;
		line-height: 1;
		letter-spacing: 0.2em;
		color: var(--white--50);
	}

	.product-breakdown__stage-range {
		flex: none;
		font-family: var(--font);
		font-size: 13px;
		font-weight: 500;
		letter-spacing: 0.12em;
		color: var(--teal);
		font-variant-numeric: tabular-nums;
		white-space: nowrap;
	}

	.product-breakdown__stage-progress {
		position: absolute;
		right: 0;
		bottom: 0;
		left: 0;
		height: 1px;
		background: var(--white--8);
	}

	.product-breakdown__stage-progress span {
		display: block;
		width: 100%;
		height: 100%;
		background: var(--teal);
		transform: scaleX(0);
		transform-origin: left center;
		transition: transform 0.05s linear;
	}

	.product-breakdown__list {
		border-top: var(--hairline);
	}

	.product-breakdown__axis {
		position: sticky;
		top: var(--stage-top);
		z-index: 4;
		display: grid;
		grid-template-columns: minmax(0, 1fr) minmax(180px, 42%);
		column-gap: clamp(24px, 2vw, 32px);
		align-items: end;
		padding: 14px 0 18px;
		border-bottom: var(--hairline);
		font-family: var(--font);
		font-size: 11px;
		font-weight: 500;
		letter-spacing: 0.2em;
		text-transform: uppercase;
		color: var(--white--30);
		background: var(--black);
		overflow: visible;
	}

	/* Cover the gap above the stuck axis so row titles don't scroll through. */
	.product-breakdown__axis::before {
		content: '';
		position: absolute;
		right: 0;
		bottom: 100%;
		left: 0;
		height: var(--stage-top);
		background: var(--black);
		pointer-events: none;
	}

	.product-breakdown__axis-ticks {
		position: absolute;
		right: 0;
		bottom: -18px;
		left: 0;
		height: 6px;
		pointer-events: none;
		background-image: repeating-linear-gradient(90deg, var(--white--8) 0 1px, transparent 1px calc(100% - 1px));
		background-size: calc(var(--range-w) / 4) 6px;
		background-position: left bottom;
		background-repeat: repeat no-repeat;
	}

	.product-breakdown__axis-label {
		display: block;
		line-height: 1;
		align-self: end;
	}

	.product-breakdown__axis-scale {
		position: relative;
		min-height: 1em;
		line-height: 1;
		align-self: end;
		overflow: visible;
	}

	.product-breakdown__axis-scale i {
		position: absolute;
		top: 0;
		font-family: var(--font);
		font-style: normal;
		font-size: inherit;
		font-variant-numeric: tabular-nums;
		transform: translateX(-50%);
		white-space: nowrap;
	}

	.product-breakdown__axis-scale i:first-child {
		transform: none;
	}

	.product-breakdown__row {
		position: relative;
		display: grid;
		grid-template-columns: minmax(0, 1fr) minmax(180px, 42%);
		column-gap: clamp(24px, 2vw, 32px);
		align-items: center;
		/* Match stage height so sticky pairing stays stable across products */
		min-height: var(--stage-h);
		padding: clamp(64px, 4vw, 96px) 0;
		border-bottom: var(--hairline);
		color: var(--white);
		text-decoration: none;
		scroll-margin-bottom: calc(100svh - 2 * var(--stage-mid));
		opacity: 1;
		transition: opacity 0.45s ease;
	}

	.product-breakdown__row:not(.is-active) {
		opacity: 0.4;
	}

	.product-breakdown__row:not(.is-active):hover {
		opacity: 0.7;
	}

	.product-breakdown__row::before {
		content: '';
		position: absolute;
		inset: 0;
		background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--teal) 5.5%, transparent), transparent 72%);
		opacity: 0;
		transition: opacity 0.45s ease;
	}

	.product-breakdown__row.is-active::before,
	.product-breakdown__row:hover::before {
		opacity: 1;
	}

	.product-breakdown__row.is-active .product-breakdown__flag,
	.product-breakdown__row:hover .product-breakdown__flag {
		color: var(--teal);
	}

	.product-breakdown__row:not(.is-active) .product-breakdown__flag {
		color: var(--white--30);
	}

	.product-breakdown__row:not(.is-active) h3 {
		color: var(--white--70);
	}

	.product-breakdown__row:not(.is-active) p {
		color: var(--white--30);
	}

	.product-breakdown__row.is-active .product-breakdown__spec-table,
	.product-breakdown__row:hover .product-breakdown__spec-table {
		opacity: 1;
	}

	.product-breakdown__row.is-active .product-breakdown__spec-table th,
	.product-breakdown__row:hover .product-breakdown__spec-table th {
		color: var(--white--50);
	}

	.product-breakdown__row.is-active .product-breakdown__spec-table td,
	.product-breakdown__row:hover .product-breakdown__spec-table td {
		color: var(--white--70);
	}

	.product-breakdown__row.is-active .product-breakdown__fill,
	.product-breakdown__row:hover .product-breakdown__fill {
		opacity: 1;
	}

	.product-breakdown__row.is-active .product-breakdown__fill::after,
	.product-breakdown__row:hover .product-breakdown__fill::after {
		opacity: 1;
	}

	.product-breakdown__row:not(.is-active) .product-breakdown__val {
		opacity: 0.45;
	}

	.product-breakdown__row:focus-visible {
		outline: 1px solid var(--teal);
		outline-offset: 4px;
	}

	.product-breakdown__flag {
		margin-bottom: 8px;
		transition: color 0.35s ease;
	}

	.product-breakdown__row-copy h3 {
		margin-bottom: 8px;
		font-size: clamp(22px, 2vw, 32px);
		line-height: 1.12;
		font-weight: 400;
		letter-spacing: 0.08em;
		text-transform: uppercase;
		color: var(--white);
		text-wrap: balance;
		transition: color 0.35s ease;
	}

	.product-breakdown__row-copy p {
		max-width: 46ch;
		color: var(--white--50);
		font-size: 14px;
		line-height: 1.57;
		text-wrap: balance;
		transition: color 0.35s ease;
	}

	.product-breakdown__spec-table {
		grid-column: 1 / -1;
		width: 100%;
		margin-top: 28px;
		border-collapse: collapse;
		font-family: var(--font);
		font-variant-numeric: tabular-nums;
		opacity: 0.7;
		transition: opacity 0.45s ease;
	}

	.product-breakdown__spec-table th,
	.product-breakdown__spec-table td {
		padding: 10px 0;
		border: none;
		border-bottom: var(--hairline);
		font-size: 13px;
		line-height: 1.45;
		letter-spacing: 0;
		text-align: left;
		vertical-align: baseline;
		transition: color 0.35s ease;
	}

	.product-breakdown__spec-table th {
		width: 42%;
		font-weight: 500;
		letter-spacing: 0.06em;
		color: var(--white--30);
		text-transform: uppercase;
		font-size: 11px;
		background: transparent;
	}

	.product-breakdown__spec-table td {
		font-weight: 400;
		color: var(--white--50);
	}

	.product-breakdown__spec-table tr {
		transition: opacity 0.4s cubic-bezier(0.22, 1, 0.36, 1);
		transition-delay: calc(var(--i, 0) * 30ms);
	}

	.product-breakdown__range {
		display: flex;
		flex-direction: column;
		gap: 8px;
		padding-left: 2px;
		overflow: visible;
	}

	.product-breakdown__bar {
		--indicator-size: 6px;
		position: relative;
		display: flex;
		align-items: center;
		height: 1px;
		border-left: 1px solid var(--white--30);
		/* Room for the end-cap indicator when --range is 100% */
		padding-right: calc(var(--indicator-size) / 2);
		overflow: visible;
	}

	.product-breakdown__track {
		position: absolute;
		top: 0;
		right: calc(var(--indicator-size) / 2);
		bottom: 0;
		left: 0;
		background: var(--white--15);
	}

	.product-breakdown__fill {
		position: relative;
		z-index: 1;
		width: var(--range);
		max-width: 100%;
		height: 1px;
		background: var(--teal);
		opacity: 0.35;
		transition: opacity 0.35s ease;
	}

	.product-breakdown__fill::after {
		content: '';
		position: absolute;
		top: 50%;
		right: 0;
		width: var(--indicator-size);
		height: var(--indicator-size);
		border-radius: 50%;
		background: var(--teal);
		/* Center on the fill end; padding-right on the bar keeps it on-screen at 100% */
		transform: translate(50%, -50%);
		opacity: 0;
		transition: opacity 0.35s ease;
	}

	.product-breakdown__meta {
		display: flex;
		align-items: baseline;
		justify-content: space-between;
		gap: 12px;
	}

	.product-breakdown__sub {
		font-family: var(--font);
		font-size: 11px;
		font-weight: 500;
		letter-spacing: 0.2em;
		line-height: 1;
		text-transform: uppercase;
		color: var(--white--30);
		white-space: nowrap;
	}

	.product-breakdown__val {
		font-family: var(--font);
		font-size: 13px;
		font-weight: 500;
		letter-spacing: 0.12em;
		color: var(--teal);
		white-space: nowrap;
		font-variant-numeric: tabular-nums;
		transition: opacity 0.35s ease;
	}

	@media (max-width: 900px) {
		.product-breakdown__bench {
			--stage-top: 80px;
			--stage-h: max(380px, min(52svh, 480px));
			grid-template-columns: minmax(240px, 0.85fr) minmax(340px, 1.15fr);
			gap: 28px;
		}

		.product-breakdown__stage {
			min-height: 380px;
		}

		.product-breakdown__axis-label {
			display: none;
		}

		.product-breakdown__axis,
		.product-breakdown__row {
			grid-template-columns: 1fr;
			row-gap: 14px;
		}

		.product-breakdown__axis-scale,
		.product-breakdown__range {
			width: 100%;
			margin-top: 10px;
		}

		.product-breakdown__row {
			row-gap: 28px;
			/* Keep row height locked to the stage above the mobile layout */
			min-height: var(--stage-h);
		}
	}

	@media (max-width: 700px) {
		.product-breakdown__head {
			flex-direction: column;
			align-items: flex-start;
			gap: 16px;
		}

		.product-breakdown__aside {
			text-align: left;
		}

		.product-breakdown__bench {
			--stage-h: 220px;
			--stage-stick-h: max(220px, 30vh);
			--stage-bottom-gap: 12px;
			--stage-top: calc(100svh - var(--stage-stick-h) - var(--stage-bottom-gap));
			--stage-mid: calc(var(--stage-top) + var(--stage-stick-h) / 2);
			display: block;
		}

		.product-breakdown__stage {
			top: var(--stage-top);
			z-index: 2;
			height: var(--stage-stick-h);
			min-height: 220px;
			max-height: 30vh;
			margin-bottom: 8px;
			background: color-mix(in srgb, var(--dark-2) 92%, transparent);
			backdrop-filter: blur(16px);
		}

		.product-breakdown__image-stack {
			inset: 44px 14% 96px;
		}

		.product-breakdown__stage-range {
			display: none;
		}

		.product-breakdown__list {
			position: relative;
			z-index: 1;
		}

		.product-breakdown__axis {
			position: static;
		}

		.product-breakdown__axis::before {
			display: none;
		}

		.product-breakdown__row {
			min-height: 0;
			padding: 48px 0;
		}
	}

	@media (max-width: 480px) {
		.product-breakdown__head {
			margin-bottom: 40px;
		}

		.product-breakdown__bench {
			--stage-h: 220px;
			--stage-stick-h: max(220px, 30vh);
			--stage-bottom-gap: 12px;
			--stage-top: calc(100svh - var(--stage-stick-h) - var(--stage-bottom-gap));
		}

		.product-breakdown__stage {
			height: var(--stage-stick-h);
			min-height: 220px;
			max-height: 30vh;
		}

		.product-breakdown__stage-head,
		.product-breakdown__stage-meta {
			right: 16px;
			left: 16px;
		}

		.product-breakdown__image-stack {
			inset: 40px 10% 88px;
		}
	}

	@media (prefers-reduced-motion: reduce) {

		.product-breakdown__stage-media,
		.product-breakdown__fill,
		.product-breakdown__stage-progress span,
		.product-breakdown__spec-table,
		.product-breakdown__spec-table th,
		.product-breakdown__spec-table td,
		.product-breakdown__spec-table tr {
			will-change: auto;
			transition: none;
		}

		.product-breakdown__row:not(.is-active) .product-breakdown__spec-table {
			opacity: 0.55;
		}
	}
}


.product-list {
	overflow-x: clip;

	.product-list__head {
		display: flex;
		justify-content: space-between;
		align-items: flex-end;
		gap: 32px;
		margin-bottom: clamp(44px, 6vw, 72px);
	}

	.product-list__head .section-title {
		margin: 0;
		max-width: 26ch;
		text-align: left;
	}

	.product-list__aside {
		flex: none;
		font-family: var(--font);
		font-size: 11px;
		letter-spacing: 0.2em;
		line-height: 2;
		color: var(--white--30);
		text-align: right;
		text-transform: uppercase;
	}

	.product-list__aside span {
		display: block;
	}

	.product-list__table {
		display: grid;
		grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
		column-gap: clamp(24px, 4vw, 56px);
		border-top: var(--hairline);
	}

	.product-list__table.is-in .product-list__fill {
		width: var(--range);
	}

	.product-list__axis,
	.product-list__row {
		display: grid;
		grid-template-columns: subgrid;
		grid-column: 1 / -1;
		align-items: center;
		row-gap: 16px;
	}

	.product-list__axis {
		--bench-pad-y: 14px;
		--bench-pad-b: 18px;
		--bench-stuck-h: 64px;
		position: sticky;
		top: 0;
		z-index: 3;
		align-self: start;
		box-sizing: border-box;
		padding: var(--bench-pad-y) 0 var(--bench-pad-b);
		border-bottom: var(--hairline);
		font-family: var(--font);
		font-size: 10px;
		font-weight: 500;
		letter-spacing: 0.18em;
		text-transform: uppercase;
		color: var(--white--30);
		background: transparent;
		transition: min-height 0.35s ease, padding 0.35s ease, margin 0.35s ease, background 0.35s ease, backdrop-filter 0.35s ease;
	}

	.product-list__axis.is-stuck {
		min-height: var(--bench-stuck-h);
		padding-block: 0;
		padding-inline: var(--gutter);
		margin-inline: calc(-1 * var(--gutter));
		margin-bottom: calc((var(--bench-pad-y) + 1em + var(--bench-pad-b)) - var(--bench-stuck-h));
		overflow: hidden;
		backdrop-filter: blur(6px);
		-webkit-backdrop-filter: blur(6px);
		background: color-mix(in srgb, var(--black) 55%, transparent);
	}

	.product-list__axis.is-stuck .product-list__ticks {
		margin-bottom: 0;
	}

	.product-list__ticks {
		grid-column: 1 / -1;
		grid-row: 1;
		align-self: end;
		height: 6px;
		margin-bottom: -18px;
		pointer-events: none;
		background-image: repeating-linear-gradient(90deg, var(--white--8) 0 1px, transparent 1px calc(100% - 1px));
		background-size: calc(var(--range-w) / 4) 6px;
		background-position: right bottom;
		background-repeat: repeat no-repeat;
	}

	.product-list__label {
		display: block;
		grid-column: 1;
		grid-row: 1;
		font-size: 10px;
		line-height: 1;
	}

	.product-list__scale {
		font-size: 10px;
		line-height: 1;
		position: relative;
		grid-column: 2;
		grid-row: 1;
		min-height: 1em;
	}

	.product-list__scale i {
		position: absolute;
		top: 0;
		font-family: var(--font);
		font-style: normal;
		font-size: inherit;
		font-variant-numeric: tabular-nums;
		transform: translateX(-50%);
		white-space: nowrap;
	}

	.product-list__scale i:first-child {
		transform: none;
	}

	.product-list__scale i:last-child {
		transform: translateX(-100%);
	}

	.product-list__row {
		padding: 10vh 0;
		border-bottom: var(--hairline);
		color: var(--white);
		text-decoration: none;
		position: relative;
	}

	.product-list__row::before {
		content: '';
		position: absolute;
		inset: 0;
		background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--teal) 10%, transparent), transparent 70%);
		opacity: 0;
		transition: opacity 0.45s ease;
	}

	.product-list__row:hover::before {
		opacity: 1;
	}

	.product-list__row:hover .product-list__thumb {
		transform: translateY(-2px);
	}

	.product-list__thumb {
		grid-column: 1;
		grid-row: 1 / span 2;
		display: flex;
		align-items: center;
		justify-content: center;
		min-height: 112px;
		transition: transform 0.35s ease;
	}

	.product-list__thumb .product-thumb {
		width: 100%;
		max-width: 100%;
	}

	.product-list__thumb img {
		display: block;
		width: auto;
		max-width: 100%;
		max-height: 120px;
		object-fit: contain;
	}

	.product-list__copy {
		grid-column: 2;
	}

	.product-list__copy h3 {
		font-size: clamp(22px, 2vw, 32px);
		font-weight: 500;
		letter-spacing: 0.06em;
		color: var(--white);
		margin-bottom: 8px;
		text-wrap: balance;
	}

	.product-list__copy p {
		color: var(--white--50);
		line-height: 1.55;
		font-size: 13.5px;
		text-wrap: balance;
	}

	.product-list__flag {
		font-size: 10px;
		line-height: 1;
		margin-bottom: 8px;
	}

	.product-list__range {
		grid-column: 2;
		display: flex;
		flex-direction: column;
		gap: 8px;
		padding-left: 2px;
	}

	.product-list__bar {
		--indicator-size: 8px;
		position: relative;
		display: flex;
		align-items: center;
		height: 2px;
		border-left: 1px solid var(--white--30);
		padding-right: calc(var(--indicator-size) / 2);
		overflow: visible;
	}

	.product-list__track {
		position: absolute;
		top: 0;
		right: calc(var(--indicator-size) / 2);
		bottom: 0;
		left: 0;
		background: var(--white--15);
	}

	.product-list__fill {
		position: relative;
		z-index: 1;
		width: 0;
		max-width: 100%;
		height: 2px;
		background: var(--teal);
		transition: width 1.2s cubic-bezier(0.25, 0.7, 0.2, 1);
	}

	.product-list__fill::after {
		content: '';
		position: absolute;
		top: 50%;
		right: 0;
		width: var(--indicator-size);
		height: var(--indicator-size);
		border-radius: 50%;
		background: var(--teal);
		transform: translate(50%, -50%);
		box-shadow: 0 0 12px 2px color-mix(in srgb, var(--teal) 55%, transparent);
	}

	.product-list__meta {
		display: flex;
		align-items: baseline;
		justify-content: space-between;
		gap: 12px;
	}

	.product-list__sub {
		font-family: var(--font);
		font-size: 10px;
		font-weight: 500;
		letter-spacing: var(--track-meta);
		line-height: 1;
		text-transform: uppercase;
		color: var(--white--30);
		white-space: nowrap;
	}

	.product-list__val {
		font-family: var(--font);
		font-size: var(--text-meta);
		font-weight: 500;
		letter-spacing: 0.1em;
		color: var(--teal);
		white-space: nowrap;
		font-variant-numeric: tabular-nums;
	}

	@media (prefers-reduced-motion: reduce) {
		.product-list__fill {
			transition: none;
			width: var(--range);
		}

		.product-list__thumb {
			transition: none;
		}
	}

	@media (max-width: 800px) {
		.product-list__label {
			display: none;
		}

		.product-list__table {
			grid-template-columns: 1fr;
		}

		.product-list__axis {
			row-gap: 14px;
		}

		.product-list__scale {
			grid-column: 1;
			margin-top: 24px;
		}

		.product-list__row {
			padding: 56px 0;
			row-gap: 48px;
		}

		.product-list__row:last-child {
			border-bottom: none;
		}

		.product-list__thumb,
		.product-list__copy,
		.product-list__range {
			grid-column: 1;
			grid-row: auto;
		}
	}

	@media (max-width: 520px) {
		.product-list__head {
			flex-direction: column;
			align-items: center;
			gap: 16px;
			text-align: center;
		}

		.product-list__head .section-title {
			text-align: center;
		}

		.product-list__aside {
			text-align: center;
		}

		.product-list__aside span.section-title-accent {
			display: inline;
		}
	}
}


.product-spotlight {
	height: 420vh;
	position: relative;
	border-bottom: 1px solid var(--white--8);
	background: var(--black);

	.product-spotlight__corner {
		position: absolute;
		width: 22px;
		height: 22px;
		border: 1px solid color-mix(in srgb, var(--teal) 35%, transparent);
		z-index: 1;
		pointer-events: none;
	}

	.product-spotlight__corner--tl {
		top: 26px;
		left: 26px;
		border-right: 0;
		border-bottom: 0;
	}

	.product-spotlight__corner--tr {
		top: 26px;
		right: 26px;
		border-left: 0;
		border-bottom: 0;
	}

	.product-spotlight__corner--bl {
		bottom: 26px;
		left: 26px;
		border-right: 0;
		border-top: 0;
	}

	.product-spotlight__corner--br {
		right: 26px;
		bottom: 26px;
		border-left: 0;
		border-top: 0;
	}

	.product-spotlight__sticky {
		position: sticky;
		top: 0;
		height: 100svh;
		height: 100dvh;
		min-height: 820px;
		overflow: hidden;
	}

	.product-spotlight__glow {
		position: absolute;
		inset: 0;
		background: radial-gradient(ellipse 55% 38% at 50% 48%, color-mix(in srgb, var(--teal) 8%, transparent), transparent 70%);
		pointer-events: none;
	}

	.product-spotlight__fallback,
	.product-spotlight__canvas {
		position: absolute;
		inset: 0;
		width: 100%;
		height: 100%;
	}

	.product-spotlight__fallback {
		object-fit: contain;
		box-sizing: border-box;
		padding: 27% 33%;
		transition: opacity 180ms ease-out;
	}

	.product-spotlight__fallback.is-hidden {
		opacity: 0;
	}

	.product-spotlight__canvas {
		mix-blend-mode: plus-lighter;
		pointer-events: none;
	}

	.product-spotlight__video {
		position: absolute;
		width: 1px;
		height: 1px;
		opacity: 0;
		pointer-events: none;
	}

	.product-spotlight__hud {
		position: absolute;
		inset: 0;
		max-width: none;
		width: 100%;
		height: 100%;
		pointer-events: none;
		line-height: 1;
		padding-left: var(--inset-gutter);
		padding-right: var(--inset-gutter);
	}

	.product-spotlight__hud-top {
		position: absolute;
		top: 34px;
		left: var(--inset-gutter);
		right: var(--inset-gutter);
		display: flex;
		justify-content: space-between;
		align-items: baseline;
	}

	.product-spotlight__label {
		display: inline-flex;
		align-items: center;
		gap: 12px;
		font-family: var(--font);
		font-size: 14px;
		font-weight: 500;
		letter-spacing: 0.2em;
		text-transform: uppercase;
		color: var(--white--50);
	}

	.product-spotlight__label-tick {
		width: 7px;
		height: 7px;
		background: var(--teal);
		flex-shrink: 0;
	}

	.product-spotlight__readout {
		text-align: right;
		font-family: var(--font);
		font-size: 14px;
		letter-spacing: var(--track-meta);
		color: var(--teal);
		font-variant-numeric: tabular-nums;
	}

	.product-spotlight__phase {
		position: absolute;
		will-change: opacity, transform;
	}

	.product-spotlight__phase--a {
		left: var(--inset-gutter);
		top: 16%;
		max-width: 520px;
	}

	.product-spotlight__title {
		font-family: var(--font);
		font-size: clamp(34px, 4.2vw, 58px);
		line-height: 1.05;
		font-weight: 400;
		letter-spacing: 0.06em;
		text-transform: uppercase;
		color: var(--white);
		text-wrap: balance;
		margin-bottom: 18px;
		color: var(--white);
	}

	.product-spotlight__sub {
		font-family: var(--font);
		font-size: 14px;
		letter-spacing: var(--track-meta);
		text-transform: uppercase;
		color: var(--white--70);
	}

	.product-spotlight__phase--b {
		right: var(--inset-gutter);
		top: 13%;
		max-width: 340px;
		text-align: right;
	}

	.product-spotlight__stat {
		font-variant-numeric: tabular-nums;
		line-height: 1;
	}

	.product-spotlight__stat-num {
		font-family: var(--font);
		font-size: clamp(48px, 5.5vw, 80px);
		font-weight: 400;
		letter-spacing: -0.02em;
		color: var(--white);
	}

	.product-spotlight__stat-unit {
		font-family: var(--font);
		font-size: clamp(22px, 2.4vw, 36px);
		color: var(--teal);
		margin-left: 6px;
		letter-spacing: 0.04em;
	}

	.product-spotlight__stat-label {
		font-family: var(--font);
		font-size: 14px;
		font-weight: 500;
		letter-spacing: 0.2em;
		text-transform: uppercase;
		color: var(--white--50);
		margin: 12px 0 16px;
	}

	.product-spotlight__stat-copy {
		font-size: 14px;
		line-height: 1.65;
		color: var(--white--70);
	}

	.product-spotlight__phase--c {
		left: 50%;
		bottom: 7%;
		translate: -50% 0;
		width: min(560px, calc(100vw - 2 * var(--gutter)));
		text-align: center;
	}

	.product-spotlight__c-copy {
		font-family: var(--font);
		font-size: clamp(18px, 2vw, 24px);
		line-height: 1.45;
		color: var(--white);
		margin-bottom: 28px;
		text-wrap: pretty;
	}

	@media (max-width: 900px) {
		height: 340vh;

		.product-spotlight__label-tick {
			display: none;
		}

		.product-spotlight__hud {
			padding-inline: 16px;
		}

		.product-spotlight__hud-top {
			top: 18px;
		}

		.product-spotlight__hud-top * {
			font-size: 12px;
		}

		.product-spotlight__sub,
		.product-spotlight__stat-label {
			font-size: 10px;
		}

		.product-spotlight__sticky {
			min-height: 720px;
		}

		.product-spotlight__fallback {
			padding: 30% 34%;
		}

		.product-spotlight__phase--a {
			top: 14%;
			max-width: min(60vw, 420px);
		}

		.product-spotlight__title {
			margin-bottom: 10px;
		}

		.product-spotlight__phase--b {
			top: 14%;
			max-width: 240px;
		}

		.product-spotlight__stat-copy {
			display: none;
		}

		.product-spotlight__phase--c {
			bottom: 8%;
		}

		.product-spotlight__c-copy {
			line-height: 1.5;
		}

		.product-spotlight__corner--tl,
		.product-spotlight__corner--bl {
			left: 12px;
		}

		.product-spotlight__corner--tr,
		.product-spotlight__corner--br {
			right: 12px;
		}

		.product-spotlight__corner--tl,
		.product-spotlight__corner--tr {
			top: 12px;
		}

		.product-spotlight__corner--bl,
		.product-spotlight__corner--br {
			bottom: 12px;
		}
	}

	@media (prefers-reduced-motion: reduce) {
		.product-spotlight__fallback {
			transition: none;
		}

		.product-spotlight__phase {
			will-change: auto;
			transition: none;
		}
	}
}


.product-thumb {
	position: relative;
	width: 100%;
	height: 200px;

	.product-thumb__fallback,
	.product-thumb__canvas {
		position: absolute;
		inset: 0;
		width: 100%;
		height: 100%;
		transform: scale(var(--visual-scale, 1));
		transform-origin: center center;
	}

	.product-thumb__fallback {
		object-fit: contain;
		transition: opacity 180ms ease-out;
	}

	.product-thumb__fallback.is-hidden {
		opacity: 0;
	}

	.product-thumb__canvas {
		pointer-events: none;
	}

	.product-thumb__source {
		position: absolute;
		width: 1px;
		height: 1px;
		opacity: 0;
		pointer-events: none;
	}

	@media (prefers-reduced-motion: reduce) {
		.product-thumb__fallback {
			transition: none;
		}
	}
}


.testimonials {
	.testimonials__grid {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: var(--grid-gap);
	}

	.testimonials__card {
		margin: 0;
	}

	.testimonials__icon {
		display: block;
		width: 32px;
		height: auto;
		margin-bottom: 20px;
		opacity: 0.9;
	}

	.testimonials__quote {
		font-size: var(--text-body);
		line-height: 26px;
		color: var(--white--90);
		margin-bottom: 28px;
	}

	.testimonials__author {
		display: flex;
		flex-direction: column;
		gap: 4px;
		font-style: normal;
	}

	.testimonials__name {
		font-size: var(--text-body);
		font-weight: 500;
		color: var(--teal);
		font-style: normal;
	}

	.testimonials__role,
	.testimonials__company {
		font-size: 13px;
		line-height: 20px;
		color: var(--white--50);
	}

	.section-cta {
		margin-top: var(--section-title-gap);
	}

	@media (max-width: 900px) {
		.testimonials__grid {
			grid-template-columns: 1fr;
		}
	}
}