/* ===========================================================================
 * rush-shot.css — the homepage, REDESIGN r2 "THE CUT" (spec Part B).
 *
 * One primitive shows up in every frame: the 30° blade. It is the hero's
 * gold slab, the section edges, the marquee separators, the reel panels'
 * left edge, the Rush Hour band's draw, the closing plate, the cursor ring,
 * the underlines. Gold is a SURFACE this round (hero slab / bar, the numbers
 * scene, the ticker band, Rush Hour, the closing plate); ink on gold is the
 * text (9.9:1), paper on carbon (17:1), ink on paper (17:1).
 *
 * Every colour is a ROLE token from rush-theme.css (--t-*), so each scene
 * is designed for dark (carbon + gold glow + paper text) and light (paper +
 * ink + gold) at once. Fixed surfaces carry data-surface in the markup.
 * Mobile-first; breakpoints 768 / 1024 / 1280. Every url() to a binary
 * carries ?v= (Kinsta's 10-year asset cache).
 *
 * Scroll pins are position:sticky stages inside tall sections (never a
 * ScrollTrigger pin) so nothing records a layout shift. Type scale D2.
 * ======================================================================== */

:root {
	--rush-scene-pad: clamp(72px, 9vw, 128px);
	--rush-band-pad: clamp(40px, 5vw, 64px);
	--rush-header-h: 64px;
	--rush-dock-h: 64px;
	--rush-bar-h: 72px;
	--rush-grain: url("../img/rush-black-grain.webp?v=1.23.2");
	/* The foil texture (97 KB) is decorative and sits in the first viewport,
	 * so it would compete with the LCP image on a throttled phone. It
	 * resolves to flat gold until window.load (html.rush-loaded). */
	--rush-foil: none;
	--rush-tan30: 0.5773503;
}
html.rush-loaded { --rush-foil: url("../img/rush-gold-texture.webp?v=1.23.2"); }
@media (min-width: 768px) {
	:root { --rush-header-h: 76px; }
}
@media (min-width: 1024px) {
	:root { --rush-bar-h: 88px; }
}

/* ── Base / reset for this page ────────────────────────────────────────── */
*,
*::before,
*::after { box-sizing: border-box; }
html { scroll-padding-top: calc(var(--rush-header-h) + 8px); font-variant-numeric: tabular-nums; }
body.rush-shot-page {
	margin: 0;
	background: var(--t-bg);
	color: var(--t-fg);
	font: 400 16px/1.55 "Work Sans", "Helvetica Neue", sans-serif;
	font-variant-numeric: tabular-nums;
	overflow-x: clip;
}
@media (min-width: 768px) {
	body.rush-shot-page { font-size: 17px; }
}
@media (max-width: 767px) {
	body.rush-shot-page { padding-bottom: calc(var(--rush-dock-h) + env(safe-area-inset-bottom)); }
}
.rush-home { position: relative; }
:where(.rush-home) img { display: block; max-width: 100%; height: auto; }
:where(.rush-home) a { color: inherit; }
:where(.rush-home) button { font: inherit; color: inherit; }
:where(.rush-home) p { margin: 0; }
:where(.rush-home) h1,
:where(.rush-home) h2,
:where(.rush-home) h3 { margin: 0; }
.rush-home :focus-visible { outline: 2px solid var(--t-focus); outline-offset: 3px; }
.screen-reader-text,
.sr-only {
	position: absolute !important;
	width: 1px; height: 1px;
	padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0, 0, 0, 0);
	white-space: nowrap; border: 0;
}
.screen-reader-text:focus {
	position: fixed !important;
	top: 12px; left: 12px;
	width: auto; height: auto;
	clip: auto; margin: 0;
	padding: 12px 18px;
	background: var(--t-fg); color: var(--t-bg);
	z-index: 1000; border-radius: 999px;
	font-weight: 800; text-decoration: none;
}
[hidden] { display: none !important; }

/* Every scene: its own paint containment, a data-scene hook for the index. */
main > section[data-scene] { position: relative; contain: paint; }
.rush-licence,
.rush-journal,
.rush-faq { content-visibility: auto; contain-intrinsic-size: auto 900px; }
html.rush-loaded .rush-footer,
html.rush-loaded .rush-header.is-scrolled,
html.rush-loaded .rush-dock {
	background-image: var(--rush-grain);
	background-size: 420px 420px;
	background-blend-mode: soft-light;
}

/* ── Type scale (D2) ───────────────────────────────────────────────────── */
.rush-display-xxl {
	font-weight: 900;
	text-transform: uppercase;
	font-size: clamp(3.625rem, 15vw, 11rem);
	line-height: 0.86;
	letter-spacing: -0.025em;
	font-variant-numeric: tabular-nums;
}
.rush-display-xl {
	font-weight: 900;
	text-transform: uppercase;
	font-size: clamp(3rem, 11vw, 8rem);
	line-height: 0.88;
	letter-spacing: -0.02em;
}
.rush-display-l {
	font-weight: 900;
	text-transform: uppercase;
	font-size: clamp(2.5rem, 6vw, 5rem);
	line-height: 0.92;
	letter-spacing: -0.015em;
	text-wrap: balance;
}
.rush-gold-word { color: var(--t-gold-text); text-decoration: none; }
.rush-eyebrow {
	font-weight: 800;
	text-transform: uppercase;
	font-size: 12px;
	letter-spacing: 0.14em;
	color: var(--t-gold-text);
	margin: 0 0 14px;
}
.rush-eyebrow-gold { color: var(--t-gold-text); }
.rush-lede {
	font-size: 20px;
	line-height: 1.45;
	max-width: 52ch;
	color: var(--t-fg-2);
	margin-top: 18px;
}
.rush-scene-head { margin-bottom: clamp(32px, 4vw, 56px); }
.rush-scene-head .rush-display-l { max-width: 14ch; }
.rush-meta {
	font-size: 12px;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: var(--t-fg-2);
}

/* ── Buttons / pills ───────────────────────────────────────────────────── */
.rush-cta-gold,
.rush-cta-ghost,
.rush-btn-ink,
.rush-btn-paper,
.rush-btn-ghost,
.rush-nav-shop {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.35em;
	min-height: 48px;
	padding: 0 26px;
	border-radius: 999px;
	border: 1px solid transparent;
	font-weight: 800;
	font-size: 14px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	text-decoration: none;
	cursor: pointer;
	white-space: nowrap;
	transition: background-color 240ms var(--ease-out-cine), color 240ms var(--ease-out-cine), border-color 240ms var(--ease-out-cine), box-shadow 240ms var(--ease-out-cine);
	-webkit-tap-highlight-color: transparent;
}
.rush-cta-gold { min-height: 52px; background: var(--t-gold); color: var(--t-on-gold); border-color: var(--t-gold); box-shadow: 0 12px 32px -12px var(--t-glow); }
.rush-cta-gold:hover { background: var(--t-gold-hover); border-color: var(--t-gold-hover); }
.rush-cta-ghost { background: transparent; color: var(--t-fg); border-color: var(--t-line-strong); }
.rush-cta-ghost:hover { border-color: var(--t-gold); }
/* "Ink" / "paper" pills are the CONTRAST pill: the surface's foreground as a
 * fill with the surface colour as text (ink-on-paper, paper-on-carbon,
 * ink-with-gold-text on a gold band). */
.rush-btn-ink { min-height: 44px; background: var(--t-fg); color: var(--t-bg); border-color: var(--t-fg); }
.rush-btn-paper { background: var(--t-fg); color: var(--t-bg); border-color: var(--t-fg); }
.rush-btn-paper:hover { background: var(--t-gold); border-color: var(--t-gold); color: var(--t-on-gold); }
.rush-btn-ghost { min-height: 44px; background: transparent; color: var(--t-fg); border-color: var(--t-line-strong); }
.rush-btn-ghost:hover { border-color: var(--t-gold); }
.rush-link {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding: 0 2px;
	background: none;
	border: 0;
	font-weight: 800;
	font-size: 15px;
	text-decoration: none;
	color: var(--t-fg);
	cursor: pointer;
	position: relative;
}
.rush-link.m-ul::after { bottom: 8px; }

/* Status chip (dot + text), driven by the binder's data-open. */
.rush-status {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-weight: 800;
	font-size: 13px;
	letter-spacing: 0.02em;
	text-transform: none;
	margin-right: 10px;
}
.rush-status::before {
	content: "";
	width: 8px; height: 8px;
	border-radius: 50%;
	background: var(--t-fg-3);
	flex: none;
	transform-origin: center;
}
.rush-status[data-open="true"]::before { background: var(--t-gold); box-shadow: 0 0 0 4px var(--t-glow); }
.rush-status[data-open="false"] { color: var(--t-fg-2); }
.rush-status[data-open="true"] { color: inherit; }

/* Foil chip */
.rush-foil-chip {
	display: inline-flex;
	align-items: center;
	height: 26px;
	padding: 0 10px;
	border-radius: 999px;
	background: var(--t-gold) var(--rush-foil) center / cover;
	color: var(--t-on-gold);
	font-weight: 800;
	font-size: 12px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	box-shadow: 0 6px 16px rgba(0, 0, 0, 0.25); /* fixed: chip drop on any surface */
}

/* ══ HEADER ══════════════════════════════════════════════════════════════ */
.rush-header {
	position: fixed;
	top: 0; left: 0; right: 0;
	z-index: 800;
	height: var(--rush-header-h);
	color: var(--t-fg);
	background: var(--t-header-fade);
	transition: background-color 180ms var(--ease-out-cine), transform 400ms var(--ease-out-cine);
	padding-left: env(safe-area-inset-left);
	padding-right: env(safe-area-inset-right);
}
.rush-header::before {
	content: "";
	position: absolute;
	left: 0; right: 0;
	top: 100%;
	height: 56px;
	background: linear-gradient(to bottom, var(--t-scrim-soft), transparent);
	opacity: 0.3;
	pointer-events: none;
	transition: opacity 180ms var(--ease-out-cine);
}
.rush-header.is-scrolled::before { opacity: 0; }
.rush-header.is-scrolled {
	background-color: var(--t-header-bg);
	background-image: none;
	box-shadow: inset 0 -1px 0 var(--t-line);
}
@media (min-width: 768px) {
	html.rush-loaded .rush-header.is-scrolled { backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); }
}
html.rush-entry .rush-header,
html.rush-entry #main-content,
html.rush-entry .rush-footer,
html.rush-entry .rush-dock,
html.rush-entry .rush-progress,
html.rush-entry .rush-index { visibility: hidden; }
.rush-header-in {
	height: 100%;
	display: flex;
	align-items: center;
	gap: 12px;
}
.rush-brand { display: block; flex: none; }
.rush-brand-logo { width: 112px; height: auto; }
/* r2 fix (P1): the REAL wordmark, inked on the light theme — gold on paper is
 * 1.8:1 and gold on the gold plate vanishes. Dark keeps the gold asset. */
:root:not([data-theme="dark"]) .rush-brand-logo { filter: brightness(0); }
.rush-nav-links { display: none; }
.rush-nav-shop { display: none; }
@media (min-width: 768px) {
	.rush-brand-logo { width: 136px; }
	.rush-nav-shop {
		display: inline-flex;
		margin-left: auto;
		min-height: 44px;
		padding: 0 22px;
		background: var(--t-fg);
		color: var(--t-bg);
		border-color: var(--t-fg);
	}
	.rush-nav-shop.is-gold { background: var(--t-gold); border-color: var(--t-gold); color: var(--t-on-gold); box-shadow: 0 10px 28px -10px var(--t-glow); }
	.rush-nav-shop:hover { background: var(--t-gold-hover); border-color: var(--t-gold-hover); color: var(--t-on-gold); }
}
@media (min-width: 1024px) {
	.rush-header-in { gap: 20px; }
	.rush-header .rush-theme--header { margin-left: 4px; }
	.rush-nav-links {
		display: flex;
		align-items: center;
		gap: 26px;
		margin-left: auto;
	}
	.rush-nav-links a {
		font-weight: 800;
		font-size: 14px;
		letter-spacing: 0.08em;
		text-transform: uppercase;
		color: var(--t-fg);
		text-decoration: none;
		padding: 10px 0;
		text-shadow: var(--t-halo);
	}
	.rush-header.is-scrolled .rush-nav-links a { text-shadow: none; }
	.rush-nav-links a.m-ul::after { bottom: 6px; }
	.rush-nav-shop { margin-left: 0; }
}
.rush-header .rush-storesw { margin-left: 4px; flex: 0 1 auto; }
@media (min-width: 768px) { .rush-storesw-name { min-width: 12ch; } }

/* ══ SCENE 1 — THE CUT FIELD (§B2) ═══════════════════════════════════════
 * Theme-specific hero tokens on the same ladder rush-theme.css uses. Dark:
 * a gold STRIPE (22% alpha) and a GOLD bar with an ink pill. Light: a gold
 * PLATE behind the copy and an INK bar with a gold pill. One big gold
 * surface per fold, never both. */
.rush-shot {
	--slab-w: 100%;
	--bar-bg: #10100e; /* fixed: hero theme ladder (role VALUES per theme, mirrors rush-theme.css) */
	--bar-fg: #ffaa00;
	--bar-fg-2: rgba(251, 250, 244, 0.78);
	--bar-line: rgba(255, 255, 255, 0.14); /* fixed: hero theme ladder (role VALUES per theme, mirrors rush-theme.css) */
	--bar-dot: #ffaa00;
	--shot-eyebrow: #10100e; /* fixed: hero theme ladder (role VALUES per theme, mirrors rush-theme.css) */
	--shot-fg-2: rgba(16, 16, 14, 0.82);
	--shot-rule: #10100e; /* fixed: hero theme ladder (role VALUES per theme, mirrors rush-theme.css) */
	--shot-halo: none;
	--shot-cta-bg: #10100e; /* fixed: hero theme ladder (role VALUES per theme, mirrors rush-theme.css) */
	--shot-cta-fg: #ffaa00;
	--shot-ghost: rgba(16, 16, 14, 0.55);
}
/* r2 fix (P1): the light plate stops at 46vw (was 56) and the still sits at
 * its right edge, so the storefront — the thing the direction is named for —
 * is in the frame next to the plate. */
@media (min-width: 768px) { .rush-shot { --slab-w: 46vw; } }
@media (min-width: 768px) {
	/* The media box runs 50% past the right edge (clipped by the stage), so the
	 * still's centre — the storefront — lands at ~75vw, clear of the plate. */
	:root:not([data-theme="dark"]) .rush-shot-img,
	:root:not([data-theme="dark"]) .rush-shot-video { inset: 0 -50% 0 0; width: 150%; object-position: 50% 42%; }
}
@media (prefers-color-scheme: dark) {
	:root:not([data-theme="light"]) .rush-shot {
		--slab-w: 26vw;
		--bar-bg: #ffaa00;
		--bar-fg: #10100e; /* fixed: hero theme ladder (role VALUES per theme, mirrors rush-theme.css) */
		--bar-fg-2: rgba(16, 16, 14, 0.94);
		--bar-line: rgba(16, 16, 14, 0.18);
		--bar-dot: #10100e; /* fixed: hero theme ladder (role VALUES per theme, mirrors rush-theme.css) */
		--shot-eyebrow: #fbfaf4; /* fixed: paper kicker on the dark still (gold at 12px sampled 2.3:1) */
		--shot-fg-2: rgba(251, 250, 244, 0.74);
		--shot-rule: #ffaa00;
		--shot-halo: 0 1px 0 rgba(8, 8, 8, 0.6); /* fixed: hero theme ladder (role VALUES per theme, mirrors rush-theme.css) */
		--shot-cta-bg: #ffaa00;
		--shot-cta-fg: #10100e; /* fixed: hero theme ladder (role VALUES per theme, mirrors rush-theme.css) */
		--shot-ghost: rgba(255, 255, 255, 0.3); /* fixed: hero theme ladder (role VALUES per theme, mirrors rush-theme.css) */
	}
	@media (min-width: 768px) { :root:not([data-theme="light"]) .rush-shot { --slab-w: 18vw; } }
}
:root[data-theme="dark"] .rush-shot {
	--slab-w: 26vw;
	--bar-bg: #ffaa00;
	--bar-fg: #10100e; /* fixed: hero theme ladder (role VALUES per theme, mirrors rush-theme.css) */
	--bar-fg-2: rgba(16, 16, 14, 0.94);
	--bar-line: rgba(16, 16, 14, 0.18);
	--bar-dot: #10100e; /* fixed: hero theme ladder (role VALUES per theme, mirrors rush-theme.css) */
	--shot-eyebrow: #fbfaf4; /* fixed: paper kicker on the dark still (gold at 12px sampled 2.3:1) */
	--shot-fg-2: rgba(251, 250, 244, 0.74);
	--shot-rule: #ffaa00;
	--shot-halo: 0 1px 0 rgba(8, 8, 8, 0.6); /* fixed: hero theme ladder (role VALUES per theme, mirrors rush-theme.css) */
	--shot-cta-bg: #ffaa00;
	--shot-cta-fg: #10100e; /* fixed: hero theme ladder (role VALUES per theme, mirrors rush-theme.css) */
	--shot-ghost: rgba(255, 255, 255, 0.3); /* fixed: hero theme ladder (role VALUES per theme, mirrors rush-theme.css) */
}
@media (min-width: 768px) { :root[data-theme="dark"] .rush-shot { --slab-w: 18vw; } }

.rush-shot {
	position: relative;
	/* ≤767: the viewport minus the fixed dock that covers its bottom edge, so
	 * #rush-shot-img stays an LCP candidate (Chrome excludes a full-viewport
	 * image). The bar sits above the dock. */
	height: auto;
	min-height: calc(100svh - var(--rush-dock-h) - env(safe-area-inset-bottom));
	overflow: clip;
	isolation: isolate;
	z-index: 1;
}
.rush-shot-stage {
	position: relative;
	min-height: calc(100svh - var(--rush-dock-h) - env(safe-area-inset-bottom));
	display: flex;
	align-items: flex-end;
	overflow: clip;
}
/* Desktop with motion: the section is 160svh and the stage pins for 60svh
 * of travel while the slab widens to fill the frame. */
@media (min-width: 768px) {
	.rush-shot { min-height: 100svh; }
	.rush-shot-stage { min-height: 100svh; height: 100svh; }
	html.rush-motion .rush-shot { height: 150svh; min-height: 150svh; }
	html.rush-motion .rush-shot-stage { position: sticky; top: 0; height: 100svh; min-height: 560px; }
}
/* Layer 1: media. The image stops at the bar so the bar reads as a strip
 * under the frame and the still keeps its LCP candidacy. */
.rush-shot-media {
	position: absolute;
	inset: 0 0 var(--rush-bar-h) 0;
	z-index: 0;
	overflow: hidden;
	background: var(--t-bg-2);
}
.rush-shot-img,
.rush-shot-video {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 50% 40%;
}
.rush-shot-img { transform-origin: 50% 50%; }
.rush-shot-video {
	opacity: 0;
	transition: opacity 600ms var(--ease-out-cine);
	filter: var(--t-media-grade);
}
/* r2 §A3: one still, re-graded per theme, NEVER before html.rush-loaded. */
html.rush-loaded .rush-shot-img { filter: var(--t-media-grade); }
.rush-shot-video.is-live { opacity: 1; }
/* Phones: Ken-Burns on the still (transform only; paused when hidden). */
@media (max-width: 767px) {
	html.rush-motion.rush-loaded .rush-shot-img { animation: rushKB 14s ease-in-out infinite alternate; }
	html.rush-hidden .rush-shot-img { animation-play-state: paused; }
}
@keyframes rushKB {
	from { transform: scale(1.08) translate(0, 0); }
	to { transform: scale(1) translate(0, -2%); }
}
/* Desktop push-in on load (M1) — skipped after the match cut. */
@media (min-width: 768px) {
	html.rush-motion .rush-shot-img { transform: scale(1.06); transition: transform 1600ms var(--ease-out-cine); }
	html.rush-motion .rush-shot-img.is-in { transform: scale(1); }
}
/* Layer 2: the light sweep — a 30° band crossing the frame every 7 s. */
.rush-shot-sweep {
	position: absolute;
	inset: -20% -40%;
	background: linear-gradient(120deg, transparent 40%, var(--t-sweep) 50%, transparent 60%);
	mix-blend-mode: var(--t-sweep-blend);
	pointer-events: none;
	opacity: 0;
	transform: translateX(-60%);
}
html.rush-loaded.rush-motion .rush-shot-sweep { opacity: 1; animation: rushSweepBand 7s linear 2s infinite; }
html.rush-hidden .rush-shot-sweep { animation-play-state: paused; }
@keyframes rushSweepBand {
	from { transform: translateX(-60%); }
	to { transform: translateX(60%); }
}
/* Layer 3: grade — the theme's scrim, plus the light haze + paper fade. */
.rush-shot-grade { position: absolute; inset: 0; background: var(--t-scrim); pointer-events: none; }
@media (min-width: 1024px) { .rush-shot-grade { background: var(--t-scrim-wide); } }
.rush-shot-grade::before { content: ""; position: absolute; inset: 0; background: var(--t-media-haze); }
.rush-shot-grade::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 22%; background: linear-gradient(to top, var(--t-bg), transparent); opacity: var(--shot-fade, 0); }
.rush-shot-dust { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; opacity: 0; transition: opacity 800ms ease; }
html.rush-loaded[data-theme="dark"] .rush-shot-dust.is-live { opacity: 1; }

/* Layer 4: THE SLAB. Right edge leans 30° (top further right than bottom).
 * --slab-x 0→1 is the pin scrub: the slab grows to eat the whole frame. */
@property --slab-x { syntax: "<number>"; inherits: false; initial-value: 0; }
.rush-shot-slab {
	--slab-x: 0;
	position: absolute;
	left: 0; top: 0; bottom: 0; /* behind the bar (z 3): gold flows into the gold numbers scene once the bar fades */
	width: calc(var(--slab-w) + (160vw - var(--slab-w)) * var(--slab-x) + 57.7svh);
	background: #ffaa00 var(--rush-foil) center / cover; /* fixed: the gold surface */
	background-size: cover;
	opacity: calc(var(--t-slab-alpha) + (1 - var(--t-slab-alpha)) * var(--slab-x));
	clip-path: polygon(0 0, 100% 0, calc(100% - 57.7svh) 100%, 0 100%);
	z-index: 1;
	pointer-events: none;
	box-shadow: 40px 0 120px -40px var(--t-glow);
}
html.rush-loaded .rush-shot-slab { background-image: linear-gradient(rgba(255, 170, 0, 0.78), rgba(255, 170, 0, 0.78)), var(--rush-foil); } /* fixed: brand gold over the foil */
/* r2 fix (P1 perf): phones keep the slab FLAT gold — the 100 KB foil painting
 * at window.load made the slab the throttled LCP element (4.7 s). */
@media (max-width: 767px) {
	html.rush-loaded .rush-shot-slab { background-image: none; }
}
/* Phones, LIGHT: the slab is a bottom plate cut at 30° along its top edge. */
@media (max-width: 767px) {
	:root:not([data-theme="dark"]) .rush-shot-slab {
		top: auto;
		height: min(76%, 640px);
		width: 100%;
		clip-path: polygon(0 16%, 28% 0, 100% 0, 100% 100%, 0 100%);
	}
	@media (prefers-color-scheme: dark) {
		:root:not([data-theme="light"]) .rush-shot-slab { top: 0; height: auto; width: calc(var(--slab-w) + 57.7svh); clip-path: polygon(0 0, 100% 0, calc(100% - 57.7svh) 100%, 0 100%); }
	}
	:root[data-theme="dark"] .rush-shot-slab { top: 0; height: auto; width: calc(var(--slab-w) + 57.7svh); clip-path: polygon(0 0, 100% 0, calc(100% - 57.7svh) 100%, 0 100%); }
}
/* Load choreography rest states (motion only; the valve reveals at 3 s). */
html.rush-motion .rush-shot-slab { transform: translateX(-110%); transition: transform 700ms var(--ease-out-cine); }
html.rush-motion .rush-shot-slab.is-in { transform: none; }
@media (max-width: 767px) {
	html.rush-motion:not([data-theme="dark"]) .rush-shot-slab { transform: translateY(40%); }
	html.rush-motion:not([data-theme="dark"]) .rush-shot-slab.is-in { transform: none; }
}

/* Layer 5: copy. Bottom-anchored, above the bar. */
.rush-shot-copy {
	position: relative;
	z-index: 2;
	width: min(100% - 32px, var(--rush-max-width));
	padding-top: calc(var(--rush-header-h) + 24px);
	padding-bottom: calc(var(--rush-bar-h) + 28px);
	color: var(--t-fg);
	text-shadow: var(--shot-halo);
	--t-gold-text: var(--shot-eyebrow);
	--t-fg-2: var(--shot-fg-2);
}
.rush-shot-eyebrow { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 10px; margin-bottom: 14px; color: var(--shot-eyebrow); }
.rush-shot-eyebrow .rush-status { margin-right: 0; }
.rush-shot-eyebrow .rush-status[data-open="true"] { color: var(--t-fg); }
.rush-shot-h1:focus,
.rush-shot-h1:focus-visible { outline: 0; }
.rush-shot-h1 { display: block; font-weight: 900; letter-spacing: 0; text-transform: none; }
.rush-h1-lede {
	display: block;
	font-weight: 800;
	font-size: 17px;
	line-height: 1.3;
	color: var(--t-fg-2);
	max-width: 42ch;
	margin-bottom: 12px;
}
.rush-nameplate {
	display: block;
	color: var(--t-fg);
	max-width: 12ch;
	overflow-wrap: anywhere;
}
.rush-nameplate .rk-line { min-height: 1lh; padding-bottom: 0.08em; margin-bottom: -0.08em; }
/* The 3px foil rule under the nameplate: draws after the last word lands. */
.rush-shot-rule {
	width: 96px; height: 3px;
	margin: 18px 0 16px;
	background: var(--shot-rule) var(--rush-foil) center / cover;
	transform-origin: left center;
}
html.rush-motion .rush-shot-rule { transform: scaleX(0); transition: transform 600ms var(--ease-mark); }
html.rush-motion .rush-shot-rule.is-in { transform: scaleX(1); }
.rush-shot-meta {
	font-size: 15px;
	color: var(--t-fg-2);
	margin-bottom: 22px;
	max-width: 60ch;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px 0;
}
.rush-shot-meta a { color: inherit; text-decoration: none; display: inline-flex; align-items: center; min-height: 24px; }
.rush-shot-meta a:hover { color: var(--t-fg); text-decoration: underline; text-decoration-color: var(--t-gold); }
.rush-shot-sep { display: inline-block; width: 8px; height: 14px; margin: 0 12px; background: var(--shot-rule); transform: skewX(-30deg); opacity: 0.8; }
.rush-shot-cta { display: flex; flex-direction: column; gap: 12px; text-shadow: none; }
/* The hero primary is the INVERSION per theme: gold pill on the dark field,
 * ink pill (gold text) on the light plate. The ghost borders in the copy ink. */
.rush-shot-cta .rush-cta-gold { background: var(--shot-cta-bg); border-color: var(--shot-cta-bg); color: var(--shot-cta-fg); }
.rush-shot-cta .rush-cta-gold:hover { background: var(--shot-cta-bg); filter: brightness(1.12); }
.rush-shot-cta .rush-cta-ghost { border-color: var(--shot-ghost); color: var(--t-fg); }
.rush-shot-cta .rush-cta-ghost:hover { border-color: var(--t-fg); }
html.rush-motion .rush-shot-cta > * { opacity: 0; transform: translateY(24px); transition: opacity 500ms var(--ease-out-cine), transform 500ms var(--ease-out-cine); }
html.rush-motion .rush-shot-cta > *:nth-child(2) { transition-delay: 60ms; }
html.rush-motion .rush-shot-cta.is-in > * { opacity: 1; transform: none; }
html.rush-motion .rush-shot-meta,
html.rush-motion .rush-shot-eyebrow,
html.rush-motion .rush-h1-lede { opacity: 0; transform: translateY(18px); transition: opacity 600ms var(--ease-out-cine), transform 600ms var(--ease-out-cine); }
html.rush-motion .rush-shot-meta.is-in,
html.rush-motion .rush-shot-eyebrow.is-in,
html.rush-motion .rush-h1-lede.is-in { opacity: 1; transform: none; }
/* The scroll cue: a 30° gold tick that wipes downward (every viewport — on
 * phones it is the tick alone, bottom-right above the bar). */
.rush-shot-scroll {
	position: absolute;
	right: 16px;
	bottom: calc(var(--rush-bar-h) + 156px); /* phones: beside the address line, above the full-width pills */
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 12px;
	text-decoration: none;
	color: var(--t-fg-2);
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	min-width: 44px; min-height: 44px;
	justify-content: flex-end;
}
.rush-shot-scroll > span:last-child { display: none; }
.rush-shot-scroll-tick {
	display: block;
	width: 14px; height: 40px;
	background: linear-gradient(to bottom, var(--shot-rule) 0 4px, transparent 4px 100%);
	background-repeat: no-repeat;
	background-size: 14px 4px;
	transform: skewX(-30deg);
}
html.rush-motion .rush-shot-scroll-tick { animation: rushTickDown 1.8s var(--ease-inout-cine) infinite; }
@keyframes rushTickDown {
	0% { background-position: 0 -4px; opacity: 0; }
	20% { opacity: 1; }
	100% { background-position: 0 40px; opacity: 0; }
}
html.rush-motion .rush-shot-scroll { opacity: 0; transition: opacity 600ms ease; }
html.rush-motion .rush-shot-scroll.is-in { opacity: 1; }
@media (min-width: 768px) {
	.rush-shot-copy { padding-bottom: calc(var(--rush-bar-h) + 44px); }
	.rush-h1-lede { font-size: 18px; }
	.rush-shot-cta { flex-direction: row; align-items: center; gap: 16px; }
	.rush-shot-scroll { right: 0; bottom: calc(var(--rush-bar-h) + 44px); }
	.rush-shot-scroll > span:last-child { display: inline; }
}
@media (min-width: 1280px) {
	.rush-shot-copy { display: grid; grid-template-columns: 7fr 5fr; }
	.rush-shot-copy > * { grid-column: 1; }
	.rush-shot-scroll { grid-column: 2; justify-self: end; }
}

/* Layer 6: THE SHOP BAR — the fold's bottom edge. Roles re-declared per the
 * hero tokens above (gold/ink flip per theme). */
.rush-shot-bar {
	position: absolute;
	left: 0; right: 0; bottom: 0;
	height: var(--rush-bar-h);
	z-index: 3;
	--t-bg: var(--bar-bg);
	--t-fg: var(--bar-fg);
	--t-fg-2: var(--bar-fg-2);
	--t-line: var(--bar-line);
	--t-gold: var(--bar-dot);
	--t-glow: transparent;
	background: var(--bar-bg);
	color: var(--bar-fg);
	box-shadow: 0 -1px 0 var(--bar-line);
}
:root[data-theme="dark"] .rush-shot-bar,
html.rush-loaded .rush-shot-bar[data-foil] { background-image: linear-gradient(rgba(255, 170, 0, 0.88), rgba(255, 170, 0, 0.88)), var(--rush-foil); background-size: cover; } /* fixed: foil under the gold bar */
:root[data-theme="light"] .rush-shot-bar { background-image: none; }
html.rush-motion .rush-shot-bar { transform: translateY(100%); transition: transform 500ms var(--ease-out-cine); }
html.rush-motion .rush-shot-bar.is-in { transform: none; }
.rush-shot-bar-in {
	height: 100%;
	display: flex;
	align-items: center;
	gap: 14px;
}
.rush-shot-bar-status { display: inline-flex; align-items: center; gap: 8px; font-weight: 800; font-size: 13px; letter-spacing: 0.02em; white-space: nowrap; }
.rush-shot-bar-status .rush-status { margin: 0; }
.rush-shot-bar-status .rush-status:not([hidden]) + span { display: none; }
.rush-shot-bar-shop { margin-left: auto; min-height: 44px; padding: 0 20px; white-space: nowrap; }
/* r2 fix (P2): phones do not stack a third "Shop <name>" (hero pill + dock
 * already carry it) — the bar is status + the deal line there. */
.rush-shot-bar-deal { display: block; font-size: 13px; color: var(--t-fg-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; flex: 1 1 auto; order: 2; }
.rush-shot-bar-status { order: 1; }
@media (max-width: 767px) {
	.rush-shot-bar-shop { display: none; }
}
@media (min-width: 768px) {
	.rush-shot-bar-deal { font-size: 14px; }
	.rush-shot-bar-shop { order: 3; margin-left: 0; }
}
@media (min-width: 1024px) {
	.rush-shot-bar-in { gap: 28px; }
	.rush-shot-bar-status { font-size: 14px; }
	.rush-shot-bar-shop { min-height: 48px; padding: 0 26px; }
}

/* ══ SCENE 2 — BY THE NUMBERS (§B3, gold on both) ═══════════════════════ */
.rush-numbers {
	padding: clamp(56px, 9vh, 96px) 0 clamp(56px, 12vh, 128px);
	/* Bottom-left 30° notch into the marquee. */
	clip-path: polygon(0 0, 100% 0, 100% 100%, 10.4vw 100%, 0 calc(100% - 6vw));
	z-index: 2;
}
html.rush-loaded .rush-numbers { background-image: linear-gradient(rgba(255, 170, 0, 0.88), rgba(255, 170, 0, 0.88)), var(--rush-foil); background-size: cover; } /* fixed: gold foil */
.rush-numbers .m-rule-top::before { display: none; }
.rush-numbers-in { display: grid; gap: 40px; }
.rush-numbers-head .rush-display-l { max-width: 12ch; }
.rush-numbers-head .rush-lede { color: var(--t-fg-2); }
.rush-counters {
	list-style: none;
	margin: 0; padding: 0;
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 28px 20px;
}
.rush-counter-tile { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.rush-counter {
	display: inline-flex;
	align-items: flex-start;
	--digits: 2;
	min-width: calc(var(--digits) * 1ch);
	font-size: clamp(3rem, 11vw, 8rem);
	line-height: 0.88;
	color: var(--t-fg);
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}
.rush-counter[data-digits="1"] { --digits: 1; }
.rush-counter[data-digits="3"] { --digits: 3; }
.rush-counter[data-digits="4"] { --digits: 4; }
.rush-counter[data-suffix] { min-width: calc(var(--digits) * 1ch + 0.6ch); }
.rush-counter .rk-slot { height: 0.88em; line-height: 0.88; }
.rush-counter .rk-col > span { height: 0.88em; }
.rush-counter-k {
	align-self: flex-start;
	font-weight: 800;
	font-size: 12px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--t-on-gold-2);
	padding-bottom: 6px;
}
.rush-counter-k.m-ul::after { bottom: 0; }
html.rush-motion .rush-counter-tile.is-in .rush-counter-k.m-ul::after { transform: scaleX(1); transition-delay: 900ms; }
.rush-slate-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0;
	border-top: 1px solid var(--t-line-strong);
	padding-top: 8px;
}
.rush-slate-cell {
	position: relative;
	min-height: 64px;
	padding: 14px 14px 14px 0;
	display: flex;
	flex-direction: column;
	gap: 4px;
	justify-content: center;
}
.rush-slate-cell:nth-child(1) { order: 0; }
.rush-slate-cell:nth-child(3) { order: 1; padding-left: 14px; border-left: 1px solid var(--t-line); }
.rush-slate-cell:nth-child(2) { order: 2; grid-column: 1 / -1; border-top: 1px solid var(--t-line); }
.rush-slate-cell.rush-slate-today { order: 3; grid-column: 1 / -1; border-top: 1px solid var(--t-line); padding-left: 0; }
.rush-slate-cell [data-rush-store-field="hours"] { white-space: nowrap; }
.rush-slate-k {
	font-weight: 800;
	font-size: 12px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--t-fg-2);
}
.rush-slate-v {
	font-size: 16px;
	line-height: 1.3;
	color: var(--t-fg);
	text-decoration: none;
	display: inline-flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 4px 0;
}
a.rush-slate-v { min-height: 28px; }
a.rush-slate-v:hover { text-decoration: underline; text-decoration-color: var(--t-fg); }
@media (min-width: 768px) {
	.rush-numbers { min-height: 100svh; display: flex; align-items: center; padding-top: calc(var(--rush-header-h) + 32px); }
	.rush-numbers-in { width: min(100% - 32px, var(--rush-max-width)); }
	.rush-counters { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 32px 28px; }
	.rush-slate-row { grid-template-columns: 1fr 1fr 1fr 1.6fr; gap: 24px; padding-top: 12px; }
	.rush-slate-cell { min-height: 72px; padding: 12px 0; order: 0 !important; grid-column: auto; border-top: 0; border-left: 0; }
	/* r2 fix: matching specificity for the phone full-row cells, or Hours and
	 * Today keep spanning the row at ≥768 (0,2,0 beat 0,1,0). */
	.rush-slate-cell:nth-child(2),
	.rush-slate-cell.rush-slate-today { grid-column: auto; border-top: 0; padding-left: 0; }
	.rush-slate-cell:nth-child(3) { padding-left: 0; }
	.rush-slate-cell + .rush-slate-cell { padding-left: 24px; border-left: 1px solid var(--t-line); }
	.rush-slate-cell [data-rush-store-field="hours"] { white-space: normal; }
}
@media (min-width: 1280px) {
	.rush-numbers-in { grid-template-columns: 5fr 7fr; column-gap: 64px; align-items: start; }
	.rush-numbers-head { grid-column: 1; margin-bottom: 0; }
	/* r2 fix: three default tiles (stores / hours / days) sit on ONE row; an
	 * owner stat wraps to a second. */
	.rush-counters { grid-column: 2; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); }
	.rush-counter { font-size: clamp(5rem, 8.5vw, 9.5rem); }
	.rush-slate-row { grid-column: 1 / -1; }
}

/* ══ SCENE 3 — THE TICKER (§B4) ══════════════════════════════════════════ */
.rush-marquee {
	position: relative;
	background: var(--t-bg);
	overflow-x: clip;
	padding: 0;
	margin-block: 4vw 6vw;
	transform: skewY(-2deg);
	--vel: 0;
	z-index: 1;
}
.rush-marquee-row { overflow: hidden; padding: 14px 0; transform: skewX(calc(var(--vel) * -6deg)); transition: transform 120ms linear; }
.rush-marquee-b { padding: 10px 0; }
html.rush-loaded .rush-marquee-b { background-image: linear-gradient(rgba(255, 170, 0, 0.82), rgba(255, 170, 0, 0.82)), var(--rush-foil); background-size: cover; } /* fixed: gold foil */
.rush-marquee .rush-ticker { overflow: hidden; width: 100%; }
.rush-marquee .rush-ticker-track {
	display: flex;
	width: max-content;
	white-space: nowrap;
	/* r2 fix (P1 perf): no permanent will-change — the two 8×-viewport tracks
	 * were 31 MB of layers at rest; the running animation promotes them itself
	 * and the loop is paused off-screen (.is-offscreen, rush-shot.js). */
}
html.rush-motion .rush-marquee.is-offscreen .rush-ticker-track { animation-play-state: paused; }
.rush-marquee .rush-ticker-track > span {
	display: inline-flex;
	align-items: center;
	gap: 0.3em;
	padding-right: 0.3em;
	font-weight: 900;
	text-transform: uppercase;
	font-size: clamp(48px, 8vw, 120px);
	line-height: 1;
	letter-spacing: -0.02em;
	color: var(--t-fg);
}
.rush-marquee-b .rush-ticker-track > span {
	color: transparent;
	-webkit-text-stroke: 1.5px var(--t-stroke);
}
.rush-marquee .rush-ticker-dot {
	display: inline-block;
	width: 0.5em; height: 0.9em;
	margin: 0 0.35em;
	background: var(--t-gold) var(--rush-foil) center / cover;
	transform: skewX(-30deg);
}
.rush-marquee-b .rush-ticker-dot { background: var(--t-on-gold); }
html.rush-motion .rush-marquee-a .rush-ticker-track { animation: rushMarquee 48s linear infinite; }
html.rush-motion .rush-marquee-b .rush-ticker-track { animation: rushMarquee 64s linear infinite reverse; }
html.rush-motion .rush-marquee:hover .rush-ticker-track,
html.rush-motion .rush-marquee:focus-within .rush-ticker-track,
html.rush-motion .rush-marquee.is-paused .rush-ticker-track { animation-play-state: paused; }
@keyframes rushMarquee {
	from { transform: translate3d(0, 0, 0); }
	to { transform: translate3d(-50%, 0, 0); }
}
html:not(.rush-motion) .rush-marquee-row { overflow-x: auto; scrollbar-width: none; }

/* ── Store rows on THIS page vs rush-store-context.css ─────────────────── */
.rush-shot-page .rush-storerow.is-mine,
.rush-shot-page .rush-storerow.is-mine:focus-visible { outline: 0; box-shadow: none; border-radius: 0; }
.rush-shot-page .rush-storerow:focus-visible { outline: 2px solid var(--t-focus); outline-offset: 3px; }
.rush-shot-page .rush-storerow .rush-storerow-flags { margin: 0; min-height: 0; gap: 8px; }
.rush-shot-page .rush-storerow .rush-storerow-your { order: 2; height: 20px; padding: 0 8px; font-size: 12px; letter-spacing: 0.1em; }
.rush-shot-page .rush-storerow .rush-storerow-status { font-size: 12px; font-weight: 800; }

/* ══ SCENE 4 — THE REEL (§B5) ════════════════════════════════════════════ */
.rush-reel {
	--panel-w: 82vw;
	--panel-gap: 14px;
	--reel-travel: 0px;
	background: var(--t-bg);
	padding: var(--rush-scene-pad) 0 var(--rush-band-pad);
	overflow-x: clip;
}
.rush-reel-stage { position: relative; }
.rush-reel-head {
	width: min(100% - 32px, var(--rush-max-width));
	margin-inline: auto;
	display: grid;
	grid-template-columns: 1fr auto;
	align-items: end;
	gap: 12px 24px;
}
.rush-reel-head .rush-eyebrow { grid-column: 1 / -1; margin: 0; }
.rush-reel-head .rush-display-l { grid-column: 1; }
.rush-reel-nav { display: none; gap: 8px; grid-column: 2; align-self: end; }
.rush-reel-arrow {
	width: 48px; height: 48px;
	border-radius: 999px;
	border: 1px solid var(--t-line-strong);
	background: transparent;
	color: var(--t-fg);
	display: inline-grid;
	place-items: center;
	cursor: pointer;
	transition: border-color 200ms ease, background-color 200ms ease, color 200ms ease;
}
.rush-reel-arrow svg { width: 22px; height: 22px; }
.rush-reel-arrow:hover { background: var(--t-fg); color: var(--t-bg); border-color: var(--t-fg); }
.rush-reel-track {
	list-style: none;
	margin: 0;
	padding: 6px 16px 12px;
	display: flex;
	gap: var(--panel-gap);
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-padding-inline: 16px;
	overscroll-behavior-x: contain;
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
}
.rush-reel-track::-webkit-scrollbar { display: none; }
.rush-panel {
	position: relative;
	flex: 0 0 var(--panel-w);
	scroll-snap-align: start;
	display: grid;
	grid-template-rows: auto auto;
	isolation: isolate;
	transition: opacity 400ms var(--ease-out-cine);
}
.rush-panel-media {
	position: relative;
	margin: 0;
	aspect-ratio: 3 / 4;
	overflow: hidden;
	background: var(--t-bg-2);
	clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
}
.rush-panel-media img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 40%; transition: transform 700ms var(--ease-out-cine); }
html.rush-loaded .rush-panel-media img { filter: var(--t-media-grade); }
.rush-panel-scrim { position: absolute; inset: 0; background: linear-gradient(to top, rgba(8, 8, 8, 0.72), rgba(8, 8, 8, 0.05) 55%); pointer-events: none; } /* fixed: on the photo */
.rush-panel-num {
	position: absolute;
	left: 12px; bottom: calc(100% - 100% + 8px);
	z-index: 2;
	font-size: clamp(5rem, 22vw, 9rem);
	color: transparent;
	-webkit-text-stroke: 1.5px var(--t-stroke);
	pointer-events: none;
	line-height: 0.8;
	transform: translateY(-100%);
	opacity: 0.9;
}
.rush-panel-media + .rush-panel-num { top: auto; bottom: auto; }
.rush-panel-slab {
	position: absolute;
	left: -6%; top: -4%;
	width: 42%; height: 46%;
	background: var(--t-gold) var(--rush-foil) center / cover;
	clip-path: polygon(0 0, 100% 0, calc(100% - 26%) 100%, 0 100%);
	z-index: 0;
	opacity: 0;
	transform: translateX(-30%);
	transition: opacity 400ms var(--ease-out-cine), transform 500ms var(--ease-out-cine);
	pointer-events: none;
}
.rush-panel.is-mine .rush-panel-slab { opacity: 1; transform: none; }
.rush-panel-slate { padding: 16px 4px 0; display: flex; flex-direction: column; gap: 6px; position: relative; }
.rush-panel-name { font-weight: 800; font-size: 24px; line-height: 1.1; letter-spacing: -0.01em; }
.rush-panel-addr { font-size: 14px; color: var(--t-fg-2); }
.rush-panel-hours { font-size: 13px; color: var(--t-fg-2); display: flex; align-items: center; flex-wrap: wrap; gap: 4px 0; }
.rush-panel-actions {
	display: grid;
	grid-template-columns: auto 1fr;
	grid-template-areas: "shop dir" "pick pick";
	align-items: center;
	column-gap: 14px;
	row-gap: 2px;
	margin-top: 10px;
}
.rush-panel-actions .rush-btn-ink { grid-area: shop; padding: 0 22px; }
.rush-panel-actions > .rush-link:not(.rush-panel-pick) { grid-area: dir; justify-self: start; }
.rush-panel-pick { grid-area: pick; justify-self: start; }
.rush-panel.is-mine .rush-panel-pick { visibility: hidden; pointer-events: none; }
.rush-panel-mine { position: absolute; top: -13px; right: 0; }
.rush-panel-media .rush-panel-num { display: none; }
.rush-rail-progress {
	height: 2px;
	margin: 12px 16px 0;
	background: var(--t-line);
	overflow: hidden;
}
.rush-rail-progress i {
	display: block;
	height: 100%;
	width: 100%;
	background: var(--t-gold);
	transform: scaleX(var(--rail, 0.3));
	transform-origin: left center;
	transition: transform 120ms linear;
}
/* The numeral sits over the photo's bottom-left on every viewport. */
.rush-panel-media { display: block; }
.rush-panel > .rush-panel-num { position: absolute; left: 10px; top: 0; transform: none; }
@media (max-width: 1023px) {
	.rush-panel > .rush-panel-num { top: calc(var(--panel-w) * 4 / 3 - 0.85em); }
}
@media (min-width: 768px) {
	.rush-reel { --panel-w: 60vw; --panel-gap: 20px; }
	.rush-reel-nav { display: flex; }
	.rush-reel-track { padding-inline: max(24px, calc((100% - var(--rush-max-width)) / 2)); scroll-padding-inline: max(24px, calc((100% - var(--rush-max-width)) / 2)); }
	.rush-panel-media { aspect-ratio: 16 / 10; }
	.rush-panel-name { font-size: 28px; }
	.rush-rail-progress { margin-inline: max(24px, calc((100% - var(--rush-max-width)) / 2)); }
	@media (max-width: 1023px) { .rush-panel > .rush-panel-num { top: calc(var(--panel-w) * 10 / 16 - 0.85em); } }
}
/* ≥1024 with motion: the pinned filmstrip of blades. */
@media (min-width: 1024px) {
	html.rush-motion .rush-reel {
		--panel-w: 70vw;
		--panel-gap: 0px;
		--reel-travel: calc(var(--reel-n) * var(--panel-w) - (var(--reel-n) - 1) * 6vw - 100vw + 18vw);
		height: calc(100vh + var(--reel-travel));
		padding: 0;
	}
	/* r2 fix: panel width keys off the registry count for ANY N (70vw to 6,
	 * 60vw at 7, 42vw from 10 up) instead of an enumerated 7–12 list. */
	html.rush-motion .rush-reel { --panel-w: clamp(42vw, calc(420vw / var(--reel-n, 3)), 70vw); }
	html.rush-motion .rush-reel-stage {
		position: sticky;
		top: 0;
		height: 100vh;
		display: flex;
		flex-direction: column;
		justify-content: flex-end;
		padding-bottom: 4vh;
		overflow: clip;
		perspective: 1600px;
	}
	/* r2 fix (P1): the head owns its own band above the panels — the panels are
	 * 66vh tall so the H2 never lands on a store photo at the end of the pin. */
	html.rush-motion .rush-reel-head {
		position: absolute;
		top: calc(var(--rush-header-h) + 12px);
		left: 0; right: 0;
		z-index: 3;
		pointer-events: none;
	}
	html.rush-motion .rush-reel-head .rush-display-l { font-size: clamp(2.5rem, 5vw, 4rem); max-width: 16ch; }
	html.rush-motion .rush-reel-head .rush-reel-nav { pointer-events: auto; }
	html.rush-motion .rush-reel-track {
		overflow: visible;
		scroll-snap-type: none;
		padding: 0 0 0 6vw;
		gap: 0;
	}
	html.rush-motion .rush-panel {
		flex-basis: var(--panel-w);
		height: 66vh;
		grid-template-rows: 1fr;
		margin-left: -6vw;
		--cp: 0;
	}
	/* M7b tilt on the panels (rush-fx.js sets --rx/--ry on [data-tilt]). */
	html.rush-motion .rush-panel[data-tilt] .rush-panel-media {
		transform: rotateX(var(--ry, 0deg)) rotateY(var(--rx, 0deg));
		transform-style: preserve-3d;
		transition: transform 600ms var(--ease-out-cine);
	}
	html.rush-motion .rush-panel.is-tilting .rush-panel-media { transition: none; }
	html.rush-motion .rush-panel:first-child { margin-left: 0; }
	html.rush-motion .rush-panel-media {
		aspect-ratio: auto;
		height: 100%;
		/* A blade: the left edge leans 30°; it relaxes to near-rect at centre. */
		clip-path: polygon(calc(6vw * (1 - var(--cp))) 0, 100% 0, calc(100% - 1.5vw * var(--cp)) 100%, 0 100%);
	}
	html.rush-motion .rush-panel-media img { transform: translateX(calc(var(--px, 0) * 1%)) scale(1.12); }
	/* r2 fix (P2): the numeral is capped at 9.5rem and the slate starts 240px in,
	 * so "03" never runs under the Shop pill. */
	html.rush-motion .rush-panel > .rush-panel-num { left: 8vw; top: auto; bottom: 22px; font-size: clamp(5rem, 9.5vw, 9.5rem); -webkit-text-stroke: 1.5px rgba(251, 250, 244, 0.9); } /* fixed: over the photo's scrim */
	html.rush-motion .rush-panel.is-mine > .rush-panel-num { -webkit-text-stroke: 1.5px #10100e; color: transparent; } /* fixed: on the gold slab */
	html.rush-motion .rush-panel-slate {
		position: absolute;
		left: 8vw; right: 6vw; bottom: 22px;
		padding: 0 0 0 0;
		color: #fbfaf4; /* fixed: on the photo's scrim */
		--t-fg: #fbfaf4; --t-fg-2: rgba(251, 250, 244, 0.78); --t-bg: #10100e; --t-gold-text: #ffaa00; /* fixed */
		padding-left: 0;
		margin-left: max(12vw, 240px);
		/* r2 fix (P0): above the is-mine gold slab (z 1), which painted over the
		 * address, hours, Shop pill and the "Your store" chip. */
		z-index: 2;
	}
	html.rush-motion .rush-panel-name { font-size: 40px; text-shadow: 0 2px 12px rgba(8, 8, 8, 0.5); } /* fixed */
	html.rush-motion .rush-panel-actions .rush-btn-ink { background: #fbfaf4; color: #10100e; border-color: #fbfaf4; } /* fixed: paper pill on the photo */
	html.rush-motion .rush-panel-mine { position: static; align-self: flex-start; margin-top: 8px; }
	html.rush-motion .rush-panel-slab { left: 4vw; top: auto; bottom: 14px; width: 24vw; height: 22vh; z-index: 1; }
	html.rush-motion .rush-rail-progress { position: absolute; left: 6vw; right: 6vw; bottom: 2vh; margin: 0; }
	html.rush-motion .rush-reel-track[data-rush-reel-built] .rush-panel:not(.is-focus) { opacity: 0.72; }
	html.rush-motion .rush-reel-track:hover .rush-panel { opacity: 0.72; }
	html.rush-motion .rush-reel-track:hover .rush-panel:hover { opacity: 1; }
	html.rush-motion .rush-panel:hover .rush-panel-media img { transform: translateX(calc(var(--px, 0) * 1%)) scale(1.18); }
}
/* Reduced motion / no motion at ≥1024: the r1 grid. */
@media (min-width: 1024px) {
	html:not(.rush-motion) .rush-reel-track { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 24px; overflow: visible; width: min(100% - 32px, var(--rush-max-width)); margin-inline: auto; padding: 0; }
	html:not(.rush-motion) .rush-panel { flex: none; }
	html:not(.rush-motion) .rush-panel-media { aspect-ratio: 4 / 5; }
	html:not(.rush-motion) .rush-rail-progress { display: none; }
	html:not(.rush-motion) .rush-panel > .rush-panel-num { top: auto; bottom: 30%; font-size: 5rem; }
}

/* ══ SCENE 5 — RUSH HOUR (§B6, gold band) ═══════════════════════════════ */
.rush-hour {
	padding: clamp(72px, 12vh, 140px) 0 clamp(64px, 12vh, 140px);
	overflow: clip;
	/* Top-left and bottom-left 30° notches. */
	clip-path: polygon(0 6vw, 10.4vw 0, 100% 0, 100% 100%, 10.4vw 100%, 0 calc(100% - 6vw));
	background: transparent;
	z-index: 2;
	min-height: 90vh;
	display: flex;
	align-items: center;
}
.rush-hour-field {
	position: absolute;
	inset: 0;
	background: #ffaa00 var(--rush-foil) center / cover; /* fixed: the gold surface */
	z-index: 0;
	pointer-events: none;
}
html.rush-loaded .rush-hour-field { background-image: linear-gradient(rgba(255, 170, 0, 0.88), rgba(255, 170, 0, 0.88)), var(--rush-foil); background-size: cover; } /* fixed */
html:not(.rush-motion) .rush-hour-field,
.rush-hour-field:not([data-scrub]) { clip-path: none; }
.rush-hour-grid {
	position: relative;
	z-index: 1;
	display: grid;
	grid-template-columns: 1fr;
	gap: 40px;
	align-items: center;
	perspective: 1400px;
}
.rush-hour-copy { display: flex; flex-direction: column; align-items: flex-start; gap: 18px; }
.rush-hour-copy .rush-eyebrow { margin: 0; }
.rush-hour-word {
	font-size: clamp(3.5rem, 15vw, 5rem);
	color: var(--t-fg);
	--wr: 1;
	clip-path: inset(0 calc((1 - var(--wr)) * 100%) 0 0);
	transform-origin: left center;
	margin-bottom: 14px; /* r2 fix: air between the display word and the deal line */
}
@property --wr { syntax: "<number>"; inherits: false; initial-value: 1; }
.rush-hour-deal { font-size: 20px; line-height: 1.45; color: var(--t-fg); max-width: 42ch; margin: 0; }
.rush-hour-cta { min-height: 52px; }
/* The carbon deal chip: gold text on ink, a 30° slash in its corner. */
.rush-hour-chip {
	position: relative;
	padding: 28px 28px 32px;
	border-radius: 14px;
	overflow: hidden;
	box-shadow: var(--t-shadow-card);
	transform: rotateX(var(--ry, 0deg)) rotateY(var(--rx, 0deg));
	transform-style: preserve-3d;
	transition: transform 600ms var(--ease-out-cine);
}
.rush-hour-chip.is-tilting { transition: none; }
/* r2 fix (P1): the chip is the STORE card — kicker = the store name, the big
 * gold value = open state ("Opens 9 AM" / "Open until 9 PM"), the sub-line = the
 * hours — so "Rush Hour" is said once per fold. */
.rush-hour-chip-k { font-weight: 800; font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--t-fg-2); margin-bottom: 22px; }
.rush-hour-chip-v { color: var(--t-gold-text); font-size: clamp(2rem, 4.2vw, 3.5rem); max-width: 10ch; }
.rush-hour-chip-s { margin-top: 22px; font-size: 14px; color: var(--t-fg-2); display: flex; align-items: center; gap: 8px; }
/* The value line IS the open state; the sub-line is the authored hours only. */
.rush-hour-chip-s .rush-status { display: none; }
.rush-hour-chip-slash { position: absolute; right: -14px; top: -20%; width: 34px; height: 140%; background: var(--t-gold); transform: skewX(-30deg); opacity: 0.9; }
@media (min-width: 768px) {
	.rush-hour-word { font-size: clamp(5rem, 12vw, 11rem); }
	.rush-hour-grid { gap: 48px; }
}
@media (min-width: 1280px) {
	.rush-hour-grid { grid-template-columns: 7fr 5fr; column-gap: 64px; }
	.rush-hour-chip { padding: 36px 36px 40px; }
}

/* ══ SCENE 6 — REWARDS (§B7) ═════════════════════════════════════════════ */
.rush-rewards {
	background: var(--t-bg-2);
	padding: var(--rush-scene-pad) 0;
	min-height: 90svh;
	display: flex;
	align-items: center;
}
:root[data-theme="light"] .rush-rewards { background: var(--t-bg-3); }
.rush-rewards-grid { display: grid; gap: 40px; perspective: 1400px; }
.rush-foilcard { position: relative; width: 100%; max-width: 520px; margin: 0 auto; transform-style: preserve-3d; --fly: 1; }
.rush-rewards-dust { position: absolute; inset: -18% -12%; width: 124%; height: 136%; pointer-events: none; z-index: 0; opacity: 0; transition: opacity 800ms ease; }
html.rush-loaded[data-theme="dark"] .rush-rewards-dust.is-live { opacity: 1; }
html.rush-motion .rush-foilcard[data-fly] { transform: rotateY(calc(-28deg * (1 - var(--fly)))) translateX(calc(-12% * (1 - var(--fly)))); }
@property --fly { syntax: "<number>"; inherits: false; initial-value: 1; }
html.rush-motion .rush-foilcard:not([data-fly]) { opacity: 0; transform: translateY(40px) rotateY(-12deg); transition: opacity 900ms var(--ease-out-cine), transform 900ms var(--ease-out-cine); }
html.rush-motion .rush-foilcard:not([data-fly]).is-in { opacity: 1; transform: none; }
.rush-foilcard-in {
	position: relative;
	aspect-ratio: 3 / 2;
	border-radius: 14px;
	background: var(--t-gold) var(--rush-foil) center / cover;
	background-color: #ffaa00; /* fixed: the foil card is gold on every theme */
	box-shadow: 0 40px 80px -40px var(--t-glow), 0 30px 60px -30px rgba(0, 0, 0, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.35); /* fixed: foil edge highlight */
	color: #10100e; /* fixed: ink on foil */
	--t-fg: #10100e; --t-on-gold: #10100e; /* fixed */
	overflow: hidden;
	transform: rotateX(var(--ry, 0deg)) rotateY(var(--rx, 0deg));
	transform-style: preserve-3d;
	transition: transform 600ms var(--ease-out-cine);
	will-change: transform;
	z-index: 1;
}
.rush-foilcard-in.is-tilting { transition: none; }
/* r2 fix (P1): MEMBER and the store name ride on small ink chips (gold text,
 * 9.4:1) instead of ink at 12px on the darkest foil patches. */
.rush-foilcard-k,
.rush-foilcard-store {
	position: absolute;
	font-weight: 800;
	font-size: 12px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: #ffaa00; /* fixed: gold on the ink chip */
	background: #10100e; /* fixed: ink chip */
	padding: 6px 10px 5px;
	line-height: 1.2;
	z-index: 3;
	clip-path: polygon(0 0, 100% 0, calc(100% - 5px) 100%, 0 100%);
}
.rush-foilcard-k { top: 18px; left: 20px; }
.rush-foilcard-store { bottom: 18px; right: 20px; text-align: right; max-width: 60%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* The REAL wordmark, inked (debossed print) — gold-on-gold made "CANNABIS"
 * vanish into the foil. */
.rush-foilcard-logo {
	position: absolute;
	top: 50%; left: 50%;
	width: 60%;
	height: auto;
	transform: translate(-50%, -50%);
	filter: brightness(0); /* fixed: ink on gold, 9.9:1 */
	opacity: 0.88;
}
.rush-foilcard-sheen {
	position: absolute;
	inset: -30%;
	background: radial-gradient(circle at var(--mx, 50%) var(--my, 50%), rgba(255, 255, 255, 0.35), transparent 40%); /* fixed: foil sheen */
	mix-blend-mode: soft-light;
	pointer-events: none;
	opacity: 0;
	transition: opacity 300ms var(--ease-out-cine);
}
.rush-foilcard-in.is-tilting .rush-foilcard-sheen { opacity: 1; }
.rush-rewards-copy .rush-scene-head { margin-bottom: 28px; }
.rush-steps {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 22px;
}
.rush-steps li { display: grid; grid-template-columns: auto 1fr; gap: 6px 16px; align-items: baseline; padding-top: 18px; border-top: 1px solid var(--t-line); }
.rush-step-n { font-weight: 900; font-size: 24px; color: var(--t-gold-text); grid-row: 1 / span 2; line-height: 1; }
.rush-steps h3 { font-weight: 800; font-size: 18px; letter-spacing: 0; }
.rush-steps p { font-size: 16px; color: var(--t-fg-2); grid-column: 2; }
.rush-rewards-copy > .rush-link { margin-top: 20px; }
@media (min-width: 768px) {
	.rush-foilcard { max-width: 620px; }
}
@media (min-width: 1280px) {
	.rush-rewards-grid { grid-template-columns: 6fr 5fr; column-gap: 80px; align-items: center; }
	.rush-foilcard { max-width: none; }
}

/* ══ SCENE 7 — INSIDE (§B8) ══════════════════════════════════════════════ */
.rush-inside {
	position: relative;
	background: var(--t-bg);
	color: var(--t-fg);
	padding: 0;
	overflow-x: clip;
	--inside-mix: 0;
	border-top: 1px solid var(--t-line);
}
.rush-inside-stage {
	position: relative;
	padding: var(--rush-scene-pad) 0 var(--rush-band-pad);
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.rush-inside-stage::before {
	content: "";
	position: absolute;
	inset: 0;
	background: var(--t-bg-2);
	opacity: var(--inside-mix);
	pointer-events: none;
	z-index: 0;
}
.rush-inside-stage > * { position: relative; z-index: 1; }
.rush-inside-ghost {
	position: absolute;
	left: 0; top: 40%;
	white-space: nowrap;
	color: transparent;
	-webkit-text-stroke: 1px var(--t-stroke);
	opacity: 0.08;
	font-size: clamp(8rem, 26vw, 24rem);
	pointer-events: none;
	z-index: 0;
	transform: translateX(var(--ghost-x, 0px));
}
.rush-inside .rush-scene-head { margin-bottom: 28px; }
.rush-inside-title { position: relative; display: inline-block; }
.rush-inside-ul { position: absolute; left: 0; bottom: -10px; width: 100%; height: 4px; background: var(--t-gold); transform: scaleX(var(--ul, 0)); transform-origin: left center; }
.rush-dolly { position: relative; }
.rush-dolly-track {
	list-style: none;
	margin: 0;
	padding: 0 16px 8px;
	display: flex;
	gap: 14px;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-padding-inline: 16px;
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
}
.rush-dolly-track::-webkit-scrollbar { display: none; }
.rush-still {
	flex: 0 0 82vw;
	scroll-snap-align: start;
	position: relative;
	border-radius: 12px;
	overflow: hidden;
	aspect-ratio: 3 / 2;
	background: var(--t-bg-3);
	box-shadow: 0 0 0 1px var(--t-line), 0 40px 80px -40px var(--t-glow);
	--ci: 0;
	clip-path: polygon(calc(12% * (1 - var(--ci))) 0, 100% 0, calc(100% - 12% * (1 - var(--ci))) 100%, 0 100%);
}
html:not(.rush-motion) .rush-still { --ci: 1; clip-path: none; }
html.rush-motion .rush-still.is-in:not([data-scrub]) { --ci: 1; transition: clip-path 900ms var(--ease-out-cine); }
html.rush-loaded .rush-still img,
html.rush-loaded .rush-still video { filter: var(--t-media-grade) brightness(calc(0.7 + 0.3 * var(--ci))); }
.rush-still img,
.rush-still video {
	width: 100%; height: 100%;
	object-fit: cover;
	display: block;
	transform: scale(calc(1.15 - 0.15 * var(--ci)));
	transition: transform 700ms var(--ease-out-cine);
}
.rush-still figcaption,
.rush-still-cap {
	position: absolute;
	left: 14px; right: 14px; bottom: 12px;
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: rgba(251, 250, 244, 0.85); /* fixed: caption ON the photo */
	text-shadow: 0 1px 8px rgba(0, 0, 0, 0.8); /* fixed */
	padding-top: 8px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	transform: translateY(calc((1 - var(--ci)) * 120%));
	transition: transform 600ms var(--ease-out-cine);
}
.rush-still-cap::before {
	content: "";
	position: absolute;
	left: 0; top: 0;
	width: 40px; height: 2px;
	background: var(--t-gold);
	transform: scaleX(var(--ci));
	transform-origin: left;
	transition: transform 240ms var(--ease-mark);
}
@media (hover: hover) and (pointer: fine) {
	.rush-still:hover img,
	.rush-still:hover video { transform: scale(1.03); }
}
@media (min-width: 768px) {
	.rush-dolly-track { padding-inline: max(24px, calc((100% - var(--rush-max-width)) / 2)); scroll-padding-inline: max(24px, calc((100% - var(--rush-max-width)) / 2)); gap: 20px; }
	.rush-still { flex-basis: 60vw; }
}
@media (min-width: 1280px) {
	.rush-inside.is-pinned { height: calc(100vh + var(--inside-travel, 0px)); }
	.rush-inside.is-pinned .rush-inside-stage {
		position: sticky;
		top: 0;
		height: 100vh;
		padding: calc(var(--rush-header-h) + 24px) 0 24px;
	}
	.rush-inside.is-pinned .rush-dolly-track { overflow: visible; scroll-snap-type: none; }
	.rush-still { flex-basis: min(60vw, 900px); }
	.rush-inside.is-pinned .rush-still { max-height: calc(100vh - var(--rush-header-h) - 220px); flex-basis: min(60vw, 900px, calc((100vh - var(--rush-header-h) - 220px) * 1.5)); }
}

/* ══ SCENE 8 — LICENSED (§B9) ════════════════════════════════════════════ */
.rush-licence {
	background: var(--t-bg-2);
	padding: var(--rush-scene-pad) 0;
	overflow: clip;
}
:root[data-theme="light"] .rush-licence { background: var(--t-bg-3); }
.rush-licence-mark {
	position: absolute;
	right: -2vw; top: 8%;
	font-size: clamp(8rem, 30vw, 28rem);
	color: var(--t-fg);
	opacity: 0.05;
	pointer-events: none;
	z-index: 0;
	white-space: nowrap;
	transform: translateY(var(--wm-y, 0px));
}
.rush-licence > .rush-container { position: relative; z-index: 1; }
.rush-licence-eyebrow { display: inline-flex; align-items: center; gap: 12px; }
.rush-licence-stamp {
	display: inline-block;
	width: 48px; height: 16px;
	background: var(--t-gold) var(--rush-foil) center / cover;
	transform: skewX(-30deg);
	position: relative;
	overflow: hidden;
}
html.rush-motion .rush-licence-stamp { transform: skewX(-30deg) scale(0); transition: transform 500ms var(--ease-pop) 200ms; }
html.rush-motion .is-in .rush-licence-stamp { transform: skewX(-30deg) scale(1); }
.rush-licence-table { display: flex; flex-direction: column; }
.rush-licence-head {
	order: -2;
	position: absolute;
	width: 1px; height: 1px;
	margin: -1px; padding: 0;
	overflow: hidden; clip: rect(0, 0, 0, 0);
	white-space: nowrap; border: 0;
	grid-template-columns: 1.2fr 1fr 1.4fr 1.8fr;
	gap: 16px;
	padding: 0 0 10px 16px;
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--t-gold-text);
	border-bottom: 1px solid var(--t-gold-hover);
}
.rush-licence-row {
	display: grid;
	grid-template-columns: 1fr;
	gap: 4px;
	padding: 16px 0 16px 20px;
	border-bottom: 1px solid var(--t-line);
	font-size: 14px;
	position: relative;
	order: 0;
}
/* r2: rows slide in along the 30° axis. */
html.rush-motion .rush-licence-row.m-rise { transform: translate(-24px, 14px); clip-path: none; }
html.rush-motion .rush-licence-row.m-rise.is-in { transform: none; }
.rush-licence-row.is-mine { order: -1; background: rgba(255, 170, 0, 0.06); } /* fixed: gold tint, same on both */
.rush-licence-slab {
	position: absolute;
	left: 0; top: 0; bottom: 0;
	width: 12px;
	background: var(--t-gold) var(--rush-foil) center / cover;
	clip-path: polygon(0 0, 100% 0, 40% 100%, 0 100%);
	transform: scaleY(0);
	transform-origin: top;
	transition: transform 300ms var(--ease-mark);
}
.rush-licence-row.is-mine .rush-licence-slab { transform: scaleY(1); }
.rush-licence-store { font-weight: 800; font-size: 15px; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.rush-licence-no {
	display: inline-block;
	font-family: inherit;
	font-size: 15px;
	font-weight: 800;
	letter-spacing: 0.04em;
	font-variant-numeric: tabular-nums;
	padding: 2px 8px;
	border: 1.5px solid var(--t-gold-text);
	color: var(--t-gold-text);
	border-radius: 3px;
}
.rush-licence-holder { color: var(--t-fg-2); }
.rush-licence-more { grid-column: 1 / -1; }
.rush-licence-more > summary { cursor: pointer; padding: 14px 16px; font-weight: 800; color: var(--t-gold-text); }
.rush-licence-row .rush-storerow-flags { display: inline-flex; align-items: center; flex: none; white-space: nowrap; }
.rush-licence-row .rush-storerow-flags:empty { display: none; }
@media (min-width: 768px) {
	.rush-licence-row { grid-template-columns: 1fr 1fr; gap: 6px 24px; }
	.rush-licence-row span:nth-child(2) { grid-column: 1; }
	.rush-licence-row span:nth-child(3) { grid-column: 2; }
}
@media (min-width: 1280px) {
	.rush-licence-head {
		display: grid;
		position: static;
		width: auto; height: auto;
		margin: 0; padding: 0 0 10px 20px;
		overflow: visible; clip: auto;
		white-space: normal;
	}
	.rush-licence-row { grid-template-columns: 1.2fr 1fr 1.4fr 1.8fr; gap: 16px; align-items: center; padding: 18px 0 18px 20px; }
	.rush-licence-row span:nth-child(n) { grid-column: auto; }
}

/* ══ SCENE 9 — JOURNAL (§B10) ════════════════════════════════════════════ */
.rush-journal {
	background: var(--t-bg-2);
	padding: var(--rush-scene-pad) 0;
	overflow-x: clip;
}
:root[data-theme="light"] .rush-journal { background: var(--t-bg); }
.rush-journal-grid { display: grid; gap: 32px; }
.rush-feature { transform: rotateX(var(--ry, 0deg)) rotateY(var(--rx, 0deg)); transform-style: preserve-3d; transition: transform 600ms var(--ease-out-cine); }
.rush-feature.is-tilting { transition: none; }
.rush-feature-link { display: block; text-decoration: none; }
.rush-tile {
	position: relative;
	aspect-ratio: 16 / 9;
	border-radius: 12px;
	overflow: hidden;
	background: var(--t-bg-3);
	display: flex;
	align-items: flex-end;
	padding: 18px;
	margin-bottom: 18px;
	box-shadow: 0 0 0 1px var(--t-line), 0 40px 80px -40px var(--t-glow);
}
.rush-tile img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 40%; }
.rush-tile.is-fallback img { filter: brightness(0.7) saturate(0.85); } /* fixed: the tile is a dark photo object with a paper folio on both themes */
.rush-tile::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, rgba(8, 8, 8, 0.7), rgba(8, 8, 8, 0.05) 55%); /* fixed: on the photo */
	pointer-events: none;
}
.rush-tile-num {
	position: relative;
	z-index: 1;
	font-weight: 900;
	font-size: 22px;
	line-height: 1;
	letter-spacing: 0.04em;
	color: #fbfaf4; /* fixed: folio ON the dark tile */
}
.rush-tile-s { aspect-ratio: 16 / 9; padding: 12px; margin-bottom: 12px; }
.rush-tile-s .rush-tile-num { font-size: 16px; }
.rush-feature-title {
	font-weight: 900;
	font-size: clamp(28px, 4vw, 52px);
	line-height: 1.0;
	letter-spacing: -0.02em;
	margin: 10px 0 12px;
	text-wrap: balance;
}
.rush-feature-excerpt { font-size: 18px; color: var(--t-fg-2); margin-bottom: 8px; max-width: 56ch; }
/* r2 fix (P1): the phone rail keeps the container gutter (the -16px bleed put
 * the first card 4px off the left edge and clipped its glyphs). */
.rush-journal-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	gap: 16px;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-padding-inline: 0;
	scrollbar-width: none;
}
.rush-journal-list::-webkit-scrollbar { display: none; }
.rush-journal-item { flex: 0 0 min(78vw, 320px); scroll-snap-align: start; border-top: 1px solid var(--t-line); padding-top: 16px; }
.rush-journal-item a { display: block; text-decoration: none; }
.rush-journal-item h3 { display: inline; font-weight: 800; font-size: 20px; line-height: 1.2; letter-spacing: 0; margin: 8px 0 8px; padding-bottom: 2px; }
.rush-journal-item .rush-meta { margin-bottom: 6px; }
.rush-journal-excerpt { font-size: 15px; color: var(--t-fg-2); margin-top: 8px; }
@media (min-width: 768px) {
	.rush-journal-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; overflow: visible; padding: 0; margin-inline: 0; }
	.rush-journal-item { flex: none; }
}
@media (min-width: 1280px) {
	.rush-journal-grid { grid-template-columns: 7fr 5fr; gap: 64px; align-items: start; }
	.rush-journal-list { grid-template-columns: 1fr; gap: 0; position: sticky; top: 96px; }
	.rush-journal-item { padding: 20px 0; }
	.rush-journal-item .rush-tile-s { display: none; }
	.rush-journal-item:first-child { border-top: 0; padding-top: 0; }
}

/* ══ SCENE 10 — FAQ (§B11) ═══════════════════════════════════════════════ */
.rush-faq {
	background: var(--t-bg-2);
	padding: var(--rush-scene-pad) 0;
}
.rush-faq-grid { display: grid; gap: 24px; }
.rush-faq-head { margin-bottom: 8px; }
.rush-faq-list { display: flex; flex-direction: column; }
.rush-faq-item {
	position: relative;
	border-bottom: 1px solid var(--t-line);
	padding-left: 18px;
}
.rush-faq-item.m-rule-v::after { width: 3px; background: var(--t-gold); transform: scaleY(0); clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); }
html.rush-motion .rush-faq-item.m-rule-v::after { transform: scaleY(0) !important; }
.rush-faq-item[open].m-rule-v::after,
html.rush-motion .rush-faq-item[open].m-rule-v::after { transform: scaleY(1) !important; }
.rush-faq-item summary {
	list-style: none;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 20px 0;
	font-weight: 900;
	font-size: 20px;
	line-height: 1.2;
	letter-spacing: -0.01em;
}
.rush-faq-item summary::-webkit-details-marker { display: none; }
.rush-faq-plus { position: relative; flex: none; width: 22px; height: 22px; }
.rush-faq-plus::before,
.rush-faq-plus::after {
	content: "";
	position: absolute;
	background: var(--t-fg);
	left: 50%; top: 50%;
	transform: translate(-50%, -50%);
	transition: transform 300ms var(--ease-mark), opacity 300ms var(--ease-mark), background-color 300ms;
}
.rush-faq-plus::before { width: 16px; height: 2px; }
.rush-faq-plus::after { width: 2px; height: 16px; }
/* Open: the "+" becomes a 30° slash (one bar rotates, the other collapses). */
.rush-faq-item[open] .rush-faq-plus::after { transform: translate(-50%, -50%) rotate(30deg) scaleY(1.2); background: var(--t-gold); }
.rush-faq-item[open] .rush-faq-plus::before { transform: translate(-50%, -50%) scaleX(0); opacity: 0; }
.rush-faq-a { display: grid; grid-template-rows: 0fr; transition: grid-template-rows 280ms var(--ease-out-cine); }
.rush-faq-item[open] .rush-faq-a { grid-template-rows: 1fr; }
.rush-faq-a > div { overflow: hidden; }
.rush-faq-a p { padding: 0 0 22px; font-size: 16px; color: var(--t-fg-2); max-width: 62ch; }
@media (min-width: 1280px) {
	.rush-faq-grid { grid-template-columns: 4fr 1fr 7fr; }
	.rush-faq-head { grid-column: 1; position: sticky; top: 110px; align-self: start; }
	.rush-faq-list { grid-column: 3; }
}

/* ══ SCENE 11 — THE CLOSING CUT (§B12) ══════════════════════════════════ */
.rush-close {
	min-height: 100svh;
	overflow: clip;
	isolation: isolate;
	background: var(--t-bg);
}
.rush-close-stage {
	position: relative;
	min-height: 100svh;
	display: flex;
	align-items: center;
	overflow: clip;
}
@media (min-width: 768px) {
	html.rush-motion .rush-close { height: 200vh; }
	html.rush-motion .rush-close-stage { position: sticky; top: 0; height: 100vh; }
}
/* r2 fix (P2): phones get a pinned scene too — the plate arrives, then the
 * closing frame holds for 50svh while the footer approaches. */
@media (max-width: 767px) {
	html.rush-motion .rush-close { height: 150svh; min-height: 0; }
	html.rush-motion .rush-close-stage { position: sticky; top: 0; height: 100svh; min-height: 0; }
}
.rush-close-media { position: absolute; inset: 0; z-index: 0; overflow: hidden; }
.rush-close-img {
	position: absolute;
	inset: -10% 0;
	width: 100%; height: 120%;
	object-fit: cover;
	object-position: 50% 40%;
	filter: var(--t-media-grade);
}
.rush-close-grade { position: absolute; inset: 0; background: var(--t-scrim-flat); opacity: 0.86; }
.rush-close-grade::after { content: ""; position: absolute; inset: 0; background: var(--t-scrim); }
.rush-close-glow {
	position: absolute;
	inset: 0;
	background: radial-gradient(ellipse 50% 40% at 50% 38%, var(--t-glow), transparent 70%);
	opacity: var(--glow-o, 0);
	pointer-events: none;
	mix-blend-mode: screen;
}
:root[data-theme="light"] .rush-close-glow { display: none; }
/* The blade returns: a gold plate with a 30° left edge, from the right. */
.rush-close-slab {
	position: absolute;
	right: 0; top: 0; bottom: 0;
	/* r2 fix (P1): the plate is 57.7vh wider than the stage, so at rest its 30°
	 * edge has cleared the left side and the whole closing frame is gold — the
	 * headline is ink on the plate itself (no per-line band seams). */
	width: calc(100% + 57.7vh);
	z-index: 1;
	background: #ffaa00 var(--rush-foil) center / cover; /* fixed: the gold plate */
	clip-path: polygon(0 100%, 57.7vh 0, 100% 0, 100% 100%);
	transform: translateX(var(--close-x, 0%));
	pointer-events: none;
}
html.rush-loaded .rush-close-slab { background-image: linear-gradient(rgba(255, 170, 0, 0.88), rgba(255, 170, 0, 0.88)), var(--rush-foil); background-size: cover; } /* fixed */
@media (max-width: 767px) {
	.rush-close-slab { top: auto; height: 62%; width: 100%; clip-path: polygon(0 100%, 0 30%, 34% 0, 100% 0, 100% 100%); }
}
.rush-close-copy {
	position: relative;
	z-index: 2;
	padding: var(--rush-scene-pad) 0;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 14px;
	width: min(100% - 32px, var(--rush-max-width));
}
.rush-close-title { max-width: 12ch; font-size: clamp(3.25rem, 12vw, 9.5rem); }
.rush-close-title .rk-line { min-height: 1lh; padding-bottom: 0.08em; margin-bottom: -0.08em; }
/* Each line is its OWN gold band, cut at 30° on the left, so the headline is
 * ink on gold wherever the big plate happens to be. */
.rush-close-title .rk-line-in {
	position: relative;
	display: inline-block;
	padding: 0.04em 0.22em 0.02em 0.42em;
	margin-left: -0.2em;
	color: #10100e; /* fixed: ink on gold */
	z-index: 0;
}
/* r2 fix (P1): the band is a ::before whose opacity (--band-a, set by the
 * plate scrub) goes to 0 once the plate covers the frame — no seams on the
 * signature end frame; during the approach the lines still sit on gold. */
.rush-close-title .rk-line-in::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: #ffaa00 var(--rush-foil) center / cover; /* fixed: the band */
	clip-path: polygon(0.3em 0, 100% 0, 100% 100%, 0 100%);
	opacity: var(--band-a, 0);
}
html.rush-motion .rush-close-title .rk-line-in::before { opacity: var(--band-a, 1); }
html.rush-loaded .rush-close-title .rk-line-in::before { background-image: linear-gradient(rgba(255, 170, 0, 0.88), rgba(255, 170, 0, 0.88)), var(--rush-foil); background-size: cover; } /* fixed */
.rush-close-copy .rush-eyebrow { display: inline-flex; align-items: center; gap: 8px; margin: 0; }
.rush-close-copy .rush-eyebrow .rush-status { margin: 0; }
.rush-close-copy .rush-eyebrow .rush-status:not([hidden]) + span { display: none; }
/* The eyebrow is an ink chip (gold text) so it reads on the plate and on the
 * scrim alike. */
.rush-close-copy .rush-eyebrow { background: #10100e; color: #ffaa00; padding: 8px 12px 7px; clip-path: polygon(0 0, 100% 0, calc(100% - 6px) 100%, 0 100%); } /* fixed: ink chip */
.rush-close-copy .rush-eyebrow .rush-status { color: #ffaa00; } /* fixed */
.rush-close-copy .rush-eyebrow .rush-status::before { background: #ffaa00; } /* fixed */
/* The name line sits INSIDE the gold plate: ink on gold. */
.rush-close-plate { color: #10100e; } /* fixed: ink on the gold plate */
/* The actions ride in a chip of the page surface so they read on the plate and
 * on the scrim alike. */
.rush-close-actions { display: inline-flex; flex-direction: column; align-items: flex-start; gap: 8px; margin-top: 14px; padding: 10px 12px 10px 10px; background: var(--t-bg); border-radius: 999px; box-shadow: var(--t-shadow-card); }
.rush-close-actions .rush-cta-gold { background: #ffaa00; color: #10100e; border-color: #ffaa00; } /* fixed: gold pill, always on the chip */
.rush-close-actions .rush-cta-gold:hover { background: #de8a08; border-color: #de8a08; }
.rush-close-actions .rush-link { padding: 0 10px; }
@media (max-width: 767px) {
	.rush-close-copy { padding-bottom: 12vh; justify-content: flex-end; min-height: 100svh; }
	.rush-close-actions { border-radius: 24px; }
}
@media (min-width: 768px) {
	.rush-close-copy { padding-block: 0; }
	.rush-close-actions { flex-direction: row; align-items: center; gap: 24px; }
	.rush-close-plate { padding-right: 0.2em; }
}
@media (min-width: 1024px) {
	.rush-close-copy { align-items: flex-start; }
}

/* ══ FOOTER (§B13) ═══════════════════════════════════════════════════════ */
.rush-footer {
	position: relative;
	padding: var(--rush-band-pad) 0 var(--rush-band-pad);
	border-top: 1px solid var(--t-gold);
	font-size: 14px;
	overflow: clip;
}
.rush-footer-ghost {
	position: absolute;
	left: 50%; bottom: -12%;
	width: 90vw; height: auto;
	transform: translate(-50%, var(--ghost-y, 30%));
	opacity: 0.14;
	filter: brightness(0) saturate(100%) invert(72%) sepia(60%) saturate(2000%) hue-rotate(360deg) brightness(105%); /* fixed: the wordmark as a gold ghost */
	pointer-events: none;
	z-index: 0;
}
.rush-footer > .rush-container { position: relative; z-index: 1; }
.rush-footer-top { display: flex; flex-direction: column; gap: 16px; align-items: flex-start; margin-bottom: 32px; }
.rush-footer-logo { width: 160px; height: auto; }
.rush-footer-blurb { font-size: 16px; color: var(--t-fg-2); }
.rush-footer-legal {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 2px 22px;
	padding: 20px 0;
	border-top: 1px solid var(--t-line);
	border-bottom: 1px solid var(--t-line);
}
.rush-footer-legal a {
	display: inline-flex;
	align-items: center;
	min-height: 32px;
	color: var(--t-fg-2);
	text-decoration: none;
	font-size: 14px;
	font-weight: 400;
}
.rush-footer-legal a.m-ul::after { bottom: 4px; }
.rush-footer-legal a:hover { color: var(--t-fg); }
.rush-footer-theme { margin-left: auto; }
.rush-footer-mine { padding: 28px 0; border-bottom: 1px solid var(--t-line); }
.rush-footer-panel { display: flex; flex-direction: column; gap: 6px; align-items: flex-start; }
.rush-footer-panel .rush-eyebrow { margin-bottom: 4px; }
.rush-footer-panel-name { font-weight: 800; font-size: 20px; }
.rush-footer-panel-line { color: var(--t-fg-2); display: flex; align-items: center; flex-wrap: wrap; gap: 4px 0; }
.rush-footer-panel-line a { color: inherit; text-decoration: none; display: inline-flex; align-items: center; min-height: 28px; }
.rush-footer-panel-line a:hover { color: var(--t-fg); text-decoration: underline; text-decoration-color: var(--t-gold); }
.rush-footer-panel .rush-btn-ghost { margin-top: 12px; }
.rush-footer-panel .rush-status { color: var(--t-fg); }
.rush-footer-stores {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 20px 32px;
	padding: 28px 0;
}
.rush-footer-store {
	display: flex;
	flex-direction: column;
	gap: 4px;
	padding-left: 14px;
	position: relative;
	order: 0;
	color: var(--t-fg-2);
}
.rush-footer-store::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 6px; background: var(--t-gold); clip-path: polygon(0 0, 100% 0, 30% 100%, 0 100%); transform: scaleY(0); transform-origin: top; transition: transform 300ms var(--ease-mark); }
.rush-footer-store.is-mine { order: -1; color: var(--t-fg); }
.rush-footer-store.is-mine::before { transform: scaleY(1); }
.rush-footer-store strong {
	font-weight: 800;
	font-size: 13px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--t-fg);
}
.rush-footer-store a { color: inherit; text-decoration: none; min-height: 24px; display: inline-flex; align-items: center; }
.rush-footer-store a:hover { color: var(--t-fg); }
.rush-footer-store .rush-storerow-flags { display: flex; gap: 8px; align-items: center; min-height: 20px; }
.rush-footer-store .rush-storerow-status { color: var(--t-fg-2); }
.rush-footer-fine {
	padding-top: 20px;
	border-top: 1px solid var(--t-line);
	color: var(--t-fg-3);
	font-size: 13px;
}
@media (min-width: 768px) {
	.rush-footer-top { flex-direction: row; align-items: center; justify-content: space-between; }
}
@media (min-width: 1024px) {
	.rush-footer > .rush-container {
		display: grid;
		grid-template-columns: 5fr 7fr;
		column-gap: 48px;
		grid-template-areas: "top top" "legal legal" "mine stores" "fine fine";
	}
	.rush-footer-top { grid-area: top; }
	.rush-footer-legal { grid-area: legal; }
	.rush-footer-mine { grid-area: mine; border-bottom: 0; padding-right: 24px; border-right: 1px solid var(--t-line); }
	.rush-footer-stores { grid-area: stores; padding-left: 8px; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
	.rush-footer-fine { grid-area: fine; }
}

/* ══ Reduced motion backstops for this sheet ══════════════════════════════ */
@media (prefers-reduced-motion: reduce) {
	.rush-marquee .rush-ticker-track { animation: none !important; }
	.rush-marquee-row { overflow-x: auto; transform: none !important; }
	.rush-shot-scroll-tick,
	.rush-shot-sweep,
	.rush-shot-img { animation: none !important; }
	/* r2 fix (P0): the slab keeps its per-theme alpha (22% stripe in dark, plate
	 * in light) — forcing opacity 1 here put paper copy on solid gold (~1.9:1). */
	.rush-shot-slab { transform: none !important; transition: none !important; }
	.rush-shot-bar,
	.rush-shot-rule,
	.rush-shot-cta > *,
	.rush-shot-meta,
	.rush-shot-eyebrow,
	.rush-h1-lede,
	.rush-shot-scroll { opacity: 1 !important; transform: none !important; transition: none !important; }
	.rush-foilcard-in,
	.rush-hour-chip,
	.rush-feature { transform: none !important; transition: none; }
	.rush-foilcard { opacity: 1 !important; transform: none !important; }
	.rush-foilcard-sheen { animation: none !important; }
	.rush-faq-a { transition: none; }
	.rush-hour-word { clip-path: none !important; transform: none !important; }
	.rush-hour-field { clip-path: none !important; }
	.rush-still { clip-path: none !important; --ci: 1; }
	.rush-licence-stamp,
	.rush-licence-row { transform: none !important; transition: none !important; }
	.rush-close-slab { transform: none !important; }
	.rush-close-title .rk-line-in::before { opacity: 0 !important; }
	.rush-footer-ghost { transform: translate(-50%, 0) !important; }
}
/* r2 fix (P2): while the theme cut snapshots the page, the loops that live in
 * the root snapshot pause so the compositor has a cheap frame to capture. */
html.rush-theme-cutting .rush-shot-sweep,
html.rush-theme-cutting .rush-shot-img,
html.rush-theme-cutting .rush-marquee .rush-ticker-track,
html.rush-theme-cutting .rush-shot-scroll-tick { animation-play-state: paused; }