/**
 * Homepage V2 — D-hybrid cinematic homepage ([cb_home_v2]).
 *
 * Port of .work/design-shotgun/D-hybrid.html (operator-approved 2026-08-16).
 * Scoped under .cbv2; the site header/footer keep their own styles — the
 * D-hybrid header treatment rolls out with the sitewide token phase.
 *
 * Grammar: Archivo variable (wdth 62–125 / wght 100–900) display face,
 * JetBrains Mono data face, one cinematic image grade, steel-blue confined
 * to scrims/shadows, accent #E8FF00 rationed (finder + CTA hover states).
 */

.cbv2 {
	--cbv2-base: #0D0D0F;
	--cbv2-surface: #121215;
	--cbv2-border: #2A2A33;
	--cbv2-line: #232329;
	--cbv2-line-2: #34343E;
	--cbv2-steel-scrim: rgba(16, 26, 40, 0.42);
	--cbv2-steel-edge: rgba(88, 118, 156, 0.16);
	--cbv2-text: #F0F0F2;
	--cbv2-muted: #9C9CA8;
	--cbv2-dim: #5E5E6A;
	--cbv2-accent: #E8FF00;
	--cbv2-accent-h: #F4FF66;
	--cbv2-disp: var(--wp--preset--font-family--archivo, "Archivo", sans-serif);
	--cbv2-mono: var(--wp--preset--font-family--mono, "JetBrains Mono", monospace);
	--cbv2-ease: cubic-bezier(0.22, 0.9, 0.24, 1);
	--cbv2-grade: saturate(1.12) contrast(1.1) brightness(0.82);
	--cbv2-pad-x: 48px;

	background: var(--cbv2-base);
	color: var(--cbv2-text);
	font-family: var(--cbv2-disp);
	font-weight: 400;
	font-stretch: 100%;
	line-height: 1.5;
	overflow: clip;
}

.cbv2 ::selection { background: var(--cbv2-accent); color: #0D0D0F; }

/* film grain — one material world; sits under the sticky site header */
.cbv2::before {
	content: "";
	position: fixed;
	inset: -50%;
	pointer-events: none;
	z-index: 9;
	opacity: 0.05;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='240' height='240' filter='url(%23n)' opacity='0.55'/%3E%3C/svg%3E");
	animation: cbv2-grain 9s steps(10) infinite;
}
@keyframes cbv2-grain {
	0%, 100% { transform: translate(0, 0); }
	20% { transform: translate(-3%, 2%); }
	40% { transform: translate(2%, -3%); }
	60% { transform: translate(-2%, -2%); }
	80% { transform: translate(3%, 3%); }
}

/* ---------- type ---------- */
.cbv2-mega {
	font-family: var(--cbv2-disp);
	font-stretch: 118%;
	font-weight: 900;
	text-transform: uppercase;
	letter-spacing: -0.015em;
	line-height: 0.92;
	margin: 0;
}
.cbv2-ghost { display: block; color: transparent; -webkit-text-stroke: 1.5px rgba(240, 240, 242, 0.85); }

/* the hero finder IS the picker on v2 pages — hide the header strip */
.page-template-page-home-v2 .cb-vehicle-picker-bar,
.home .cb-vehicle-picker-bar { display: none; }

.cbv2-idx {
	font-family: var(--cbv2-mono);
	font-size: 12px;
	letter-spacing: 0.3em;
	text-transform: uppercase;
	color: var(--cbv2-muted);
	display: flex;
	align-items: center;
	gap: 16px;
	margin: 0;
}
.cbv2-idx b { color: var(--cbv2-text); font-weight: 500; }
.cbv2-idx i { font-style: normal; color: var(--cbv2-dim); letter-spacing: 0.18em; }
.cbv2-idx::after { content: ""; width: 64px; height: 1px; background: var(--cbv2-line-2); }
.cbv2-idx--center { justify-content: center; }
.cbv2-idx--center::after { display: none; }

/* ---------- corner-tick panel ---------- */
.cbv2-panel {
	position: relative;
	background: rgba(15, 17, 22, 0.78);
	backdrop-filter: blur(16px);
	border: 1px solid var(--cbv2-border);
	box-shadow: 0 24px 60px -30px rgba(0, 0, 0, 0.7), inset 0 0 0 1px var(--cbv2-steel-edge);
}
.cbv2-ticks i { position: absolute; width: 10px; height: 10px; border: 0 solid #4A5568; pointer-events: none; }
.cbv2-ticks i:nth-child(1) { top: -1px; left: -1px; border-top-width: 2px; border-left-width: 2px; }
.cbv2-ticks i:nth-child(2) { top: -1px; right: -1px; border-top-width: 2px; border-right-width: 2px; }
.cbv2-ticks i:nth-child(3) { bottom: -1px; left: -1px; border-bottom-width: 2px; border-left-width: 2px; }
.cbv2-ticks i:nth-child(4) { bottom: -1px; right: -1px; border-bottom-width: 2px; border-right-width: 2px; }

.cbv2-panel-head {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 12px;
	padding: 14px 20px;
	border-bottom: 1px solid var(--cbv2-line);
	font-family: var(--cbv2-mono);
	font-size: 10.5px;
	letter-spacing: 0.24em;
	text-transform: uppercase;
	color: var(--cbv2-muted);
}
.cbv2-panel-head em { font-style: normal; color: var(--cbv2-dim); letter-spacing: 0.1em; white-space: nowrap; }
.cbv2-panel-head span { white-space: nowrap; }

.cbv2-readout { padding: 6px 20px 16px; font-feature-settings: "tnum" 1; }
.cbv2-readout--tight { padding-top: 0; }
.cbv2-ro { display: flex; justify-content: space-between; align-items: baseline; padding: 11px 0; border-bottom: 1px solid var(--cbv2-line); }
.cbv2-ro:last-child { border-bottom: 0; }
.cbv2-ro > span { font-family: var(--cbv2-mono); font-size: 10px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--cbv2-dim); }
.cbv2-ro b { font-family: var(--cbv2-mono); font-size: 16px; font-weight: 500; letter-spacing: -0.01em; color: var(--cbv2-text); }
.cbv2-ro b i { font-style: normal; font-size: 10.5px; color: var(--cbv2-dim); margin-left: 4px; letter-spacing: 0.08em; }
.cbv2-panel-foot {
	margin: 0;
	padding: 10px 20px 14px;
	border-top: 1px solid var(--cbv2-line);
	font-family: var(--cbv2-mono);
	font-size: 9.5px;
	letter-spacing: 0.14em;
	color: var(--cbv2-dim);
	text-transform: uppercase;
}

/* ---------- hero ---------- */
.cbv2-hero {
	position: relative;
	min-height: min(960px, calc(100svh - 60px));
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	overflow: hidden;
}
.cbv2-hero-photo { position: absolute; inset: 0; z-index: 0; background-size: cover; background-position: center 38%; }
.cbv2-hero-media {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center 38%;
	transform: scale(1.06);
	animation: cbv2-hero-in 2.4s var(--cbv2-ease) forwards;
	filter: var(--cbv2-grade);
}
@keyframes cbv2-hero-in { to { transform: scale(1); } }
.cbv2-hero::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	background:
		linear-gradient(90deg, rgba(13, 13, 15, 0.66) 0%, rgba(13, 13, 15, 0.28) 44%, transparent 68%),
		linear-gradient(180deg, rgba(13, 13, 15, 0.58) 0%, var(--cbv2-steel-scrim) 36%, rgba(16, 26, 40, 0.28) 62%, rgba(13, 13, 15, 0.97) 100%);
}
.cbv2-hero::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	background: radial-gradient(120% 90% at 50% 10%, transparent 55%, rgba(11, 16, 24, 0.6) 100%);
}
.cbv2-hero-inner {
	position: relative;
	z-index: 2;
	width: min(1440px, 100%);
	margin: 0 auto;
	padding: 96px var(--cbv2-pad-x) 60px;
	display: grid;
	grid-template-columns: 1.1fr 460px;
	gap: 56px;
	align-items: end;
}
.cbv2-hero .cbv2-idx { color: #C9C9D4; margin-bottom: 22px; }
.cbv2-hero h1.cbv2-mega { font-size: clamp(46px, 5.6vw, 84px); max-width: 880px; }
.cbv2-lede { max-width: 520px; margin: 24px 0 0; font-size: 17px; color: #C6C6D0; line-height: 1.65; }
.cbv2-hero-index {
	margin-top: 38px;
	display: flex;
	border-top: 1px solid rgba(240, 240, 242, 0.18);
	max-width: 560px;
	font-feature-settings: "tnum" 1;
}
.cbv2-hi { flex: 1; padding: 14px 18px 0 0; }
.cbv2-hi + .cbv2-hi { padding-left: 20px; border-left: 1px solid rgba(240, 240, 242, 0.14); }
.cbv2-hi b { display: block; font-family: var(--cbv2-mono); font-size: 21px; font-weight: 500; letter-spacing: -0.01em; }
.cbv2-hi span { display: block; margin-top: 3px; font-family: var(--cbv2-mono); font-size: 9.5px; letter-spacing: 0.16em; color: var(--cbv2-muted); text-transform: uppercase; }

/* ---------- the finder (live [cb_vehicle_picker] reskin) ---------- */
.cbv2-finder { opacity: 0; transform: translateY(24px); animation: cbv2-rise 0.9s 0.5s var(--cbv2-ease) forwards; }
@keyframes cbv2-rise { to { opacity: 1; transform: none; } }

.cbv2-finder .cb-vehicle-picker { display: block; padding: 0 0 6px; }
.cbv2-finder .cb-vp-field {
	position: relative;
	margin: 14px 20px 0;
	padding: 12px 18px 10px;
	border: 1px solid rgba(232, 255, 0, 0.35);
	background: rgba(232, 255, 0, 0.03);
	transition: border-color 0.25s, background 0.25s;
}
.cbv2-finder .cb-vp-field:hover,
.cbv2-finder .cb-vp-field:focus-within { border-color: rgba(232, 255, 0, 0.75); background: rgba(232, 255, 0, 0.05); }
.cbv2-finder .cb-vp-field:has(select:disabled) { border-color: rgba(232, 255, 0, 0.12); background: transparent; }
.cbv2-finder .cb-vp-field label {
	display: block;
	font-family: var(--cbv2-mono);
	font-size: 10.5px;
	letter-spacing: 0.18em;
	color: var(--cbv2-dim);
	text-transform: uppercase;
	margin-bottom: 9px;
}
.cbv2-finder .cb-vp-field:nth-of-type(1) label::before { content: "INPUT 01 — "; }
.cbv2-finder .cb-vp-field:nth-of-type(2) label::before { content: "INPUT 02 — "; }
.cbv2-finder .cb-vp-field:nth-of-type(3) label::before { content: "INPUT 03 — "; }
.cbv2-finder .cb-vp-select {
	width: 100%;
	appearance: none;
	background: transparent;
	border: 0;
	border-radius: 0;
	color: var(--cbv2-text);
	font-family: var(--cbv2-mono);
	font-size: 17.5px;
	font-weight: 500;
	letter-spacing: 0.01em;
	padding: 3px 30px 3px 0;
	cursor: pointer;
	outline: none;
	transition: color 0.25s;
}
.cbv2-finder .cb-vp-select:disabled { color: var(--cbv2-dim); cursor: not-allowed; }
.cbv2-finder .cb-vp-select option { background: #131316; color: var(--cbv2-text); font-size: 16px; }
.cbv2-finder .cb-vp-field::after {
	content: "";
	position: absolute;
	right: 18px;
	bottom: 18px;
	width: 8px;
	height: 8px;
	border-right: 1.5px solid var(--cbv2-dim);
	border-bottom: 1.5px solid var(--cbv2-dim);
	transform: rotate(45deg);
	pointer-events: none;
	transition: border-color 0.25s;
}
.cbv2-finder .cb-vp-field:hover::after { border-color: var(--cbv2-text); }

/* ACCENT USE — the hero viewport's single conversion action */
.cbv2-finder .cb-vp-find {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: calc(100% - 40px);
	margin: 18px 20px 14px;
	background: var(--cbv2-accent);
	border: 0;
	border-radius: 0;
	color: #0D0D0F;
	font-family: var(--cbv2-mono);
	font-weight: 700;
	font-size: 13px;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	padding: 16px 20px;
	cursor: pointer;
	transition: background 0.25s, transform 0.25s var(--cbv2-ease), box-shadow 0.25s, opacity 0.25s;
}
.cbv2-finder .cb-vp-find svg { transition: transform 0.3s var(--cbv2-ease); }
.cbv2-finder .cb-vp-find:hover:not(:disabled) { background: var(--cbv2-accent-h); transform: translateY(-2px); box-shadow: 0 12px 32px -10px rgba(232, 255, 0, 0.35); }
.cbv2-finder .cb-vp-find:hover:not(:disabled) svg { transform: translateX(5px); }
.cbv2-finder .cb-vp-find:active { transform: translateY(0); }
.cbv2-finder .cb-vp-find:disabled { opacity: 0.35; cursor: not-allowed; }
.cbv2-finder-foot {
	display: flex;
	justify-content: space-between;
	gap: 12px;
	margin: 0;
	padding: 0 20px 16px;
	font-family: var(--cbv2-mono);
	font-size: 10px;
	letter-spacing: 0.1em;
	color: var(--cbv2-dim);
	text-transform: uppercase;
}
.cbv2-finder-foot a { color: var(--cbv2-muted); border-bottom: 1px solid var(--cbv2-line-2); padding-bottom: 1px; transition: color 0.2s, border-color 0.2s; text-decoration: none; }
.cbv2-finder-foot a:hover { color: var(--cbv2-text); border-color: var(--cbv2-text); }

/* ---------- gallery modules ---------- */
.cbv2-module { position: relative; min-height: 78vh; overflow: hidden; display: flex; align-items: flex-end; }
.cbv2-bg {
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
	transform: scale(1.02);
	transition: transform 2.2s var(--cbv2-ease);
	filter: var(--cbv2-grade);
}
.cbv2-module:hover .cbv2-bg { transform: scale(1.07); }
.cbv2-module::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	background: linear-gradient(180deg, rgba(13, 13, 15, 0.72) 0%, rgba(16, 26, 40, 0.1) 30%, rgba(16, 26, 40, 0.3) 62%, rgba(13, 13, 15, 0.96) 100%);
}
.cbv2-module--left::before {
	background:
		linear-gradient(180deg, rgba(13, 13, 15, 0.72) 0%, rgba(16, 26, 40, 0.1) 30%, rgba(16, 26, 40, 0.3) 62%, rgba(13, 13, 15, 0.96) 100%),
		linear-gradient(90deg, rgba(11, 16, 24, 0.5), transparent 55%);
}
.cbv2-module--right::before {
	background:
		linear-gradient(180deg, rgba(13, 13, 15, 0.72) 0%, rgba(16, 26, 40, 0.1) 30%, rgba(16, 26, 40, 0.3) 62%, rgba(13, 13, 15, 0.96) 100%),
		linear-gradient(270deg, rgba(11, 16, 24, 0.5), transparent 55%);
}
/* lite — schematic backdrops stay readable */
.cbv2-module--lite .cbv2-bg { filter: saturate(1.05) contrast(1.05) brightness(0.98); }
.cbv2-module--lite::before {
	background:
		linear-gradient(180deg, rgba(13, 13, 15, 0.78) 0%, rgba(13, 13, 15, 0.12) 34%, rgba(16, 26, 40, 0.22) 64%, rgba(13, 13, 15, 0.94) 100%),
		linear-gradient(270deg, rgba(11, 16, 24, 0.42), transparent 55%);
}
/* studio — the product render IS the image */
.cbv2-module--studio {
	background:
		radial-gradient(64% 86% at 58% 38%, rgba(52, 72, 100, 0.55), transparent 72%),
		radial-gradient(130% 100% at 50% 100%, #161B26, var(--cbv2-base) 74%);
}
.cbv2-module--studio::before { content: none; }
.cbv2-module--studio::after {
	content: "";
	position: absolute;
	left: 50%;
	bottom: -6%;
	transform: translateX(-55%);
	width: 560px;
	height: 120px;
	border-radius: 50%;
	z-index: 0;
	background: radial-gradient(50% 50% at 50% 50%, rgba(70, 96, 132, 0.35), transparent 70%);
}
.cbv2-studio-product {
	position: absolute;
	left: 50%;
	bottom: 0;
	transform: translateX(-55%);
	height: 96%;
	width: auto;
	max-width: none;
	z-index: 1;
	filter: drop-shadow(-36px 46px 64px rgba(0, 0, 0, 0.7));
	pointer-events: none;
}
.cbv2-mod-inner {
	position: relative;
	z-index: 2;
	width: min(1440px, 100%);
	margin: 0 auto;
	padding: 72px var(--cbv2-pad-x) 56px;
	display: grid;
	grid-template-columns: 1fr auto;
	gap: 64px;
	align-items: end;
}
.cbv2-module--right .cbv2-mod-inner { grid-template-columns: auto 1fr; }
.cbv2-module--right .cbv2-mod-copy { grid-column: 2; text-align: right; justify-self: end; }
.cbv2-module--right .cbv2-mod-panel { grid-column: 1; grid-row: 1; }
.cbv2-module--right .cbv2-idx { flex-direction: row-reverse; }
.cbv2-mod-copy .cbv2-idx { margin-bottom: 18px; }
.cbv2-mod-title { font-size: clamp(64px, 9vw, 132px); transition: letter-spacing 0.8s var(--cbv2-ease); }
.cbv2-module:hover .cbv2-mod-title { letter-spacing: 0.005em; }
.cbv2-mod-sub { margin: 20px 0 0; max-width: 480px; color: #BDBDC8; font-size: 16px; line-height: 1.65; }
.cbv2-module--right .cbv2-mod-sub { margin-left: auto; }
.cbv2-mod-cta {
	margin-top: 32px;
	display: inline-flex;
	align-items: center;
	gap: 14px;
	font-family: var(--cbv2-mono);
	font-size: 13px;
	letter-spacing: 0.24em;
	text-transform: uppercase;
	color: var(--cbv2-text);
	border: 1px solid rgba(240, 240, 242, 0.35);
	padding: 16px 30px;
	text-decoration: none;
	transition: background 0.35s, color 0.35s, border-color 0.35s, gap 0.35s var(--cbv2-ease);
}
.cbv2-mod-cta .cbv2-arr { transition: transform 0.35s var(--cbv2-ease); }
.cbv2-mod-cta:hover { background: var(--cbv2-accent); border-color: var(--cbv2-accent); color: #0D0D0F; gap: 20px; }
.cbv2-mod-cta:hover .cbv2-arr { transform: translateX(4px); }
.cbv2-mod-panel { width: 340px; }
.cbv2-mod-panel--wide { width: 400px; }

/* rotor ruler */
.cbv2-ruler { padding: 18px 20px 8px; font-feature-settings: "tnum" 1; }
.cbv2-ruler-track { position: relative; height: 64px; border-top: 1px solid var(--cbv2-line-2); border-bottom: 1px solid var(--cbv2-line-2); }
.cbv2-tick { position: absolute; top: 0; bottom: 0; width: 1px; background: var(--cbv2-line); }
.cbv2-tick b { position: absolute; top: 10px; left: 50%; transform: translateX(-50%); font-family: var(--cbv2-mono); font-size: 13.5px; font-weight: 500; white-space: nowrap; transition: color 0.2s; }
.cbv2-tick span { position: absolute; bottom: 8px; left: 50%; transform: translateX(-50%); font-family: var(--cbv2-mono); font-size: 8px; color: var(--cbv2-dim); letter-spacing: 0.1em; white-space: nowrap; }
.cbv2-tick:hover b { color: var(--cbv2-accent); }

/* wheels strip */
.cbv2-wheel-strip { position: absolute; z-index: 2; top: 72px; right: var(--cbv2-pad-x); display: flex; gap: 20px; }
.cbv2-wheel-strip figure { width: 108px; margin: 0; text-align: center; opacity: 0.92; transition: opacity 0.4s, transform 0.5s var(--cbv2-ease); }
.cbv2-wheel-strip img { width: 108px; height: 108px; object-fit: contain; filter: brightness(1.04) drop-shadow(0 18px 22px rgba(0, 0, 0, 0.55)); transition: transform 0.7s var(--cbv2-ease); }
.cbv2-wheel-strip figure:hover { opacity: 1; transform: translateY(-6px); }
.cbv2-wheel-strip figure:hover img { transform: rotate(14deg); }
.cbv2-wheel-strip figcaption { margin-top: 10px; font-family: var(--cbv2-mono); font-size: 10px; letter-spacing: 0.3em; color: var(--cbv2-muted); }

/* ---------- range index spec sheet ---------- */
.cbv2-rangesec { background: var(--cbv2-base); border-top: 1px solid var(--cbv2-border); border-bottom: 1px solid var(--cbv2-border); position: relative; }
.cbv2-rangesec::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(90% 70% at 50% 0%, var(--cbv2-steel-scrim), transparent 60%); }
.cbv2-range-inner { position: relative; width: min(1440px, 100%); margin: 0 auto; padding: 88px var(--cbv2-pad-x) 96px; }
.cbv2-range-head { display: flex; justify-content: space-between; align-items: flex-end; margin-bottom: 56px; }
.cbv2-range-title { font-size: clamp(44px, 4.6vw, 72px); margin-top: 18px; }
.cbv2-range-meta { margin: 0; font-family: var(--cbv2-mono); font-size: 11px; letter-spacing: 0.2em; color: var(--cbv2-dim); text-transform: uppercase; text-align: right; line-height: 2; }

.cbv2-sheet { position: relative; border: 1px solid var(--cbv2-border); background: rgba(15, 17, 22, 0.6); }
.cbv2-sheet-cap,
.cbv2-rrow { display: grid; grid-template-columns: 64px 84px 110px 1fr 1fr 110px 140px 64px; align-items: center; padding: 0 32px; }
.cbv2-sheet-cap { padding-top: 14px; padding-bottom: 14px; border-bottom: 1px solid var(--cbv2-border); font-family: var(--cbv2-mono); font-size: 9.5px; letter-spacing: 0.18em; color: var(--cbv2-dim); text-transform: uppercase; }
.cbv2-sheet-cap .cbv2-r { text-align: right; }
.cbv2-rrow { height: 76px; border-bottom: 1px solid var(--cbv2-line); position: relative; transition: background 0.25s; text-decoration: none; color: inherit; font-feature-settings: "tnum" 1; }
.cbv2-rrow:last-of-type { border-bottom: 0; }
.cbv2-rrow::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 2px; background: var(--cbv2-accent); transform: scaleY(0); transition: transform 0.25s; }
.cbv2-rrow:hover { background: var(--cbv2-surface); z-index: 2; }
.cbv2-rrow:hover::before { transform: scaleY(1); }
.cbv2-no { font-family: var(--cbv2-mono); font-size: 11px; color: var(--cbv2-dim); }
.cbv2-th { height: 68px; display: flex; align-items: center; justify-content: center; }
.cbv2-th img { height: 62px; width: auto; transition: transform 0.35s var(--cbv2-ease); filter: drop-shadow(0 8px 14px rgba(0, 0, 0, 0.5)); }
.cbv2-rrow:hover .cbv2-th img { transform: scale(1.9); }
.cbv2-code { font-family: var(--cbv2-mono); font-size: 13px; font-weight: 500; }
.cbv2-nm { font-stretch: 110%; font-weight: 700; font-size: 15.5px; letter-spacing: 0.03em; text-transform: uppercase; }
.cbv2-use { color: var(--cbv2-muted); font-size: 12.5px; }
.cbv2-kits { font-family: var(--cbv2-mono); font-size: 13px; color: var(--cbv2-muted); text-align: right; }
.cbv2-fr { font-family: var(--cbv2-mono); font-size: 13px; color: var(--cbv2-text); text-align: right; }
.cbv2-fr i { font-style: normal; font-size: 10px; color: var(--cbv2-dim); margin-right: 5px; }
.cbv2-rrow .cbv2-arr { text-align: right; color: var(--cbv2-dim); transition: color 0.25s, transform 0.3s; }
.cbv2-rrow:hover .cbv2-arr { color: var(--cbv2-text); transform: translateX(4px); }
.cbv2-sheet-foot { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 18px 32px; border-top: 1px solid var(--cbv2-border); font-family: var(--cbv2-mono); font-size: 10.5px; letter-spacing: 0.1em; color: var(--cbv2-dim); text-transform: uppercase; }
.cbv2-sheet-foot a { color: var(--cbv2-muted); border-bottom: 1px solid var(--cbv2-line-2); padding-bottom: 2px; text-decoration: none; transition: color 0.2s, border-color 0.2s; }
.cbv2-sheet-foot a:hover { color: var(--cbv2-text); border-color: var(--cbv2-text); }

/* ---------- made-to-order band ---------- */
.cbv2-editorial { position: relative; padding: 110px var(--cbv2-pad-x); overflow: hidden; }
.cbv2-editorial .cbv2-bg { background-position: center 30%; filter: saturate(1.04) contrast(1.08) brightness(0.4); transform: none; }
.cbv2-editorial::before { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, var(--cbv2-base) 0%, var(--cbv2-steel-scrim) 30%, rgba(16, 26, 40, 0.4) 70%, var(--cbv2-base) 100%); }
.cbv2-edit-inner { position: relative; z-index: 2; width: min(1180px, 100%); margin: 0 auto; text-align: center; }
.cbv2-edit-inner .cbv2-idx { margin-bottom: 34px; }
.cbv2-quote { font-family: var(--cbv2-disp); font-stretch: 118%; font-weight: 900; text-transform: uppercase; line-height: 1.04; letter-spacing: -0.01em; font-size: clamp(36px, 4.8vw, 68px); margin: 0; }
.cbv2-quote em { font-style: normal; color: transparent; -webkit-text-stroke: 1.2px rgba(240, 240, 242, 0.8); }
.cbv2-steps { margin-top: 72px; display: grid; grid-template-columns: repeat(3, 1fr); text-align: left; border-top: 1px solid rgba(240, 240, 242, 0.16); }
.cbv2-step { padding: 30px 44px 0 0; }
.cbv2-step + .cbv2-step { padding-left: 44px; border-left: 1px solid rgba(240, 240, 242, 0.14); }
.cbv2-sn { font-family: var(--cbv2-mono); font-size: 11px; letter-spacing: 0.3em; color: var(--cbv2-muted); text-transform: uppercase; }
.cbv2-step h3 { font-family: var(--cbv2-disp); font-stretch: 114%; font-weight: 800; text-transform: uppercase; font-size: 20px; letter-spacing: 0.04em; margin: 12px 0; }
.cbv2-step p { color: #B9B9C4; font-size: 14.5px; line-height: 1.7; max-width: 340px; margin: 0; }

/* ---------- reveal on scroll ---------- */
.cbv2-reveal { opacity: 0; transform: translateY(36px); transition: opacity 1s var(--cbv2-ease), transform 1s var(--cbv2-ease); }
.cbv2-reveal.cbv2-in { opacity: 1; transform: none; }
.cbv2-d1 { transition-delay: 0.12s; }
.cbv2-d2 { transition-delay: 0.24s; }
.cbv2-d3 { transition-delay: 0.36s; }

/* no-JS / reduced motion: everything visible, nothing animates */
@media (prefers-reduced-motion: reduce) {
	.cbv2::before { animation: none; }
	.cbv2-hero-media { animation: none; transform: none; }
	.cbv2-finder { animation: none; opacity: 1; transform: none; }
	.cbv2-reveal { opacity: 1; transform: none; transition: none; }
	.cbv2-bg, .cbv2-module:hover .cbv2-bg { transition: none; transform: none; }
}
.no-js .cbv2-reveal, .cbv2-noio .cbv2-reveal { opacity: 1; transform: none; }

/* ---------- responsive ---------- */
@media (max-width: 1240px) {
	.cbv2-mod-panel, .cbv2-mod-panel--wide { width: 320px; }
	.cbv2-studio-product { opacity: 0.5; }
}
@media (max-width: 1100px) {
	.cbv2 { --cbv2-pad-x: 24px; }
	.cbv2-hero-inner { grid-template-columns: 1fr; gap: 40px; }
	.cbv2-wheel-strip, .cbv2-studio-product, .cbv2-module--studio::after { display: none; }
	.cbv2-mod-inner, .cbv2-module--right .cbv2-mod-inner { grid-template-columns: 1fr; gap: 40px; }
	.cbv2-module--right .cbv2-mod-copy { grid-column: 1; text-align: left; justify-self: start; }
	.cbv2-module--right .cbv2-mod-panel { grid-row: auto; }
	.cbv2-module--right .cbv2-mod-sub { margin-left: 0; }
	.cbv2-module--right .cbv2-idx { flex-direction: row; }
	.cbv2-mod-panel, .cbv2-mod-panel--wide { width: 100%; max-width: 400px; }
	.cbv2-range-head { flex-direction: column; align-items: flex-start; gap: 20px; }
	.cbv2-range-meta { text-align: left; }
	.cbv2-sheet-cap { display: none; }
	.cbv2-rrow { grid-template-columns: 64px 70px 1fr 120px 32px; padding: 0 20px; height: 68px; }
	.cbv2-no, .cbv2-use, .cbv2-kits { display: none; }
	.cbv2-th { height: 60px; }
	.cbv2-th img { height: 54px; }
	.cbv2-steps { grid-template-columns: 1fr; }
	.cbv2-step { padding: 26px 0; }
	.cbv2-step + .cbv2-step { padding-left: 0; border-left: 0; border-top: 1px solid rgba(240, 240, 242, 0.14); }
	.cbv2-sheet-foot { flex-direction: column; align-items: flex-start; }
}
