/* ==========================================================================
   Canny Alley v4 — signature moments
   Each page gets one idea built from the logo's three rising strokes.
   Loaded after main.css; every class here starts with x- to stay separate.
   ========================================================================== */

:root {
	--x-pink: #f4b9bb;
	--x-mid: #e8606a;
	--x-red: #d7141a;
	--x-ink: #0b0b10;
	--x-ease: cubic-bezier(.2, .75, .15, 1);
}

/* Shared ------------------------------------------------------------------ */
.x-mega {
	font-family: var(--display);
	font-weight: 800;
	letter-spacing: -.055em;
	line-height: .9;
	font-size: clamp(3rem, 1rem + 7vw, 8.4rem);
	max-width: 7.4ch;
	margin: 0;
	text-wrap: balance;
}
.x-mega em, .x-h em { font-style: normal; color: var(--x-red); }
.x-h { font-family: var(--display); font-weight: 800; letter-spacing: -.05em; line-height: .95; font-size: clamp(2.3rem, 1rem + 4vw, 5rem); margin: 0; text-wrap: balance; }
.x-note { font-family: var(--serif); font-size: clamp(1.15rem, 1rem + .5vw, 1.45rem); line-height: 1.45; color: var(--muted); max-width: 36ch; }
.x-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 32px; flex-wrap: wrap; margin-bottom: clamp(36px, 5vw, 60px); }
.x-head .eyebrow { margin-bottom: 14px; }
.x-pin { position: relative; }
.x-pin__stage { position: sticky; top: 0; height: 100vh; height: 100svh; overflow: hidden; }

/* ======================= HOME: the opening =============================== */
.x-open { height: 300vh; }
.x-open .x-pin__stage { background: #fff; }
.x-band { position: absolute; inset: 0; will-change: clip-path; clip-path: polygon(0 0, 0 0, 0 0, 0 0); }
.x-band__ph { position: absolute; inset: 0; background: center / cover no-repeat; filter: grayscale(1) contrast(1.08); transform: scale(1.18); }
.x-band__tint { position: absolute; inset: 0; mix-blend-mode: multiply; }
.x-band:nth-child(1) .x-band__tint { background: var(--x-pink); }
.x-band:nth-child(2) .x-band__tint { background: var(--x-mid); }
.x-band:nth-child(3) .x-band__tint { background: var(--x-red); }
.x-open__shade { position: absolute; inset: 0; opacity: 0; pointer-events: none; background: linear-gradient(90deg, rgba(0, 0, 0, .84), rgba(0, 0, 0, .35) 70%, rgba(0, 0, 0, .55)); }
.x-open__copy { position: absolute; inset: 0; z-index: 3; display: flex; align-items: center; pointer-events: none; }
.x-open__copy .wrap { pointer-events: auto; }
.x-open__c1 { padding-top: calc(var(--header-h) + 10px); }
.x-open__c1 .x-note { margin-top: 28px; }
.x-open__c1 .pill { background: rgba(11, 11, 16, .05); color: var(--text); border-color: rgba(11, 11, 16, .1); }
.x-open__c2 { color: #fff; opacity: 0; }
.x-open__c2 .x-h { font-size: clamp(2.6rem, 1rem + 6vw, 7.2rem); max-width: 11ch; }
.x-open__c2 .x-pills { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 34px; }
.x-open__c2 .x-pills li { padding: 10px 18px; border: 1px solid rgba(255, 255, 255, .35); border-radius: 999px; font-weight: 600; font-size: .95rem; backdrop-filter: blur(6px); }
.x-hint { position: absolute; z-index: 3; left: var(--gutter); bottom: 28px; display: flex; align-items: center; gap: 12px; font-size: .85rem; font-weight: 600; color: var(--muted); }
.x-hint span { width: 1.5px; height: 40px; background: var(--line); position: relative; overflow: hidden; }
.x-hint span::after { content: ""; position: absolute; inset: -50% 0 auto; height: 50%; background: var(--x-red); animation: x-drip 1.8s infinite; }
@keyframes x-drip { to { top: 100%; } }

/* Practices: pinned horizontal run */
.x-run { background: var(--x-ink); color: #fff; }
.x-run .x-pin__stage { display: flex; flex-direction: column; justify-content: center; }
.x-run .x-head .x-note { color: #b9b9c2; }
.x-track { display: flex; gap: 20px; padding-left: max(var(--gutter), calc((100vw - var(--wrap)) / 2)); will-change: transform; }
.x-card {
	position: relative; isolation: isolate; overflow: hidden; flex: 0 0 clamp(300px, 33vw, 500px); height: clamp(400px, 60vh, 560px);
	border-radius: 30px; background: #15151c; padding: 34px; display: flex; flex-direction: column; justify-content: space-between; text-decoration: none; color: #fff;
}
.x-card::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--accent, var(--x-red)); clip-path: circle(0% at 100% 100%); transition: clip-path .75s var(--x-ease); }
.x-card:hover::before, .x-card:focus-visible::before { clip-path: circle(150% at 100% 100%); }
.x-card::after { content: ""; position: absolute; inset: auto -20% -40% auto; width: 70%; aspect-ratio: 1; border-radius: 50%; z-index: -1; background: radial-gradient(circle, color-mix(in srgb, var(--accent, var(--x-red)) 45%, transparent), transparent 70%); transition: opacity .5s; }
.x-card:hover::after { opacity: 0; }
.x-card__art { height: 150px; display: flex; align-items: center; }
.x-card__art svg { height: 100%; width: auto; max-width: 100%; }
.x-card h3 { font-size: clamp(1.6rem, 1.2rem + 1vw, 2.1rem); letter-spacing: -.035em; line-height: 1.05; }
.x-card p { color: #a9a9b3; margin-top: 12px; transition: color .4s; }
.x-card:hover p { color: rgba(255, 255, 255, .9); }
.x-card .chips { margin-top: 18px; }
.x-card .chips li { background: rgba(255, 255, 255, .08); color: #fff; border-color: transparent; }
.x-card--intro { background: transparent; border: 1px solid rgba(255, 255, 255, .16); justify-content: flex-end; }
.x-card--intro::after { display: none; }
.x-card--intro p { font-family: var(--serif); font-size: 1.45rem; line-height: 1.35; color: #e7e7ec; margin: 0; }
.x-card .strokes { height: 150px; width: auto; }
.x-progress { margin: 44px var(--gutter) 0; height: 2px; background: rgba(255, 255, 255, .12); border-radius: 2px; overflow: hidden; max-width: var(--wrap); align-self: center; width: calc(100% - var(--gutter) * 2); }
.x-progress i { display: block; height: 100%; background: var(--x-red); transform-origin: left; transform: scaleX(0); }

/* Numbers on red */
.x-nums { position: relative; overflow: hidden; background: var(--x-red); color: #fff; padding: clamp(90px, 12vw, 170px) 0; }
.x-nums__art { position: absolute; right: -4vw; bottom: -2px; height: 118%; width: auto; opacity: .16; }
.x-nums__art path { transform: translateY(105%); transition: transform 1.4s var(--x-ease); }
.x-nums.in .x-nums__art path { transform: none; }
.x-nums__art path:nth-child(2) { transition-delay: .12s; }
.x-nums__art path:nth-child(3) { transition-delay: .24s; }
.x-nums .x-h { position: relative; margin-bottom: 60px; font-size: clamp(2rem, 1rem + 3vw, 4rem); max-width: 14ch; }
.x-nums ul { position: relative; display: grid; grid-template-columns: repeat(4, 1fr); }
.x-nums li { padding: 0 26px; border-left: 1px solid rgba(255, 255, 255, .35); }
.x-nums li:first-child { border: 0; padding-left: 0; }
.x-nums b { display: block; font-family: var(--display); font-size: clamp(3rem, 1.5rem + 4.4vw, 6.6rem); font-weight: 800; letter-spacing: -.06em; line-height: .9; font-variant-numeric: tabular-nums; }
.x-nums small { display: block; margin-top: 14px; font-size: 1rem; color: #ffdcdd; max-width: 20ch; }

/* Big portfolio rows (home + investment) */
.x-rows { border-top: 2px solid var(--ink); }
.x-rows a { position: relative; isolation: isolate; overflow: hidden; display: grid; grid-template-columns: 1fr auto 56px; align-items: center; gap: 24px; padding: 28px 8px; border-bottom: 1px solid var(--line); text-decoration: none; color: var(--ink); transition: color .4s, padding .5s var(--x-ease); }
.x-rows a::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--ink); transform: scaleY(0); transform-origin: bottom; transition: transform .55s var(--x-ease); }
.x-rows a:hover, .x-rows a:focus-visible { color: #fff; padding-left: 32px; padding-right: 24px; }
.x-rows a:hover::before, .x-rows a:focus-visible::before { transform: none; }
.x-rows__nm { font-family: var(--display); font-size: clamp(2.2rem, 1rem + 4.2vw, 5.2rem); font-weight: 800; letter-spacing: -.055em; line-height: 1; }
.x-rows__cat { text-align: right; font-weight: 600; color: var(--muted); transition: color .4s; }
.x-rows__cat small { display: block; font-weight: 500; color: var(--x-red); }
.x-rows a:hover .x-rows__cat { color: #d3d3d9; }
.x-rows .dot { width: 56px; height: 56px; }
.x-rows a:hover .dot { background: var(--x-red); color: #fff; transform: rotate(-45deg); }

/* ======================= ABOUT: the manifesto ============================ */
.x-manifesto { height: 260vh; background: var(--bg); }
.x-manifesto .x-pin__stage { display: flex; align-items: center; }
.x-manifesto .pill { background: rgba(11, 11, 16, .05); color: var(--text); border-color: rgba(11, 11, 16, .1); }
.x-manifesto h1 { font-size: clamp(1.1rem, 1rem + .4vw, 1.4rem); letter-spacing: -.01em; font-weight: 700; margin: 22px 0 18px; color: var(--muted); }
.x-manifesto__text { font-family: var(--display); font-weight: 800; letter-spacing: -.045em; line-height: 1.02; font-size: clamp(2rem, .8rem + 4.4vw, 5.4rem); max-width: 19ch; margin: 0; }
.x-manifesto__text span { color: #d9d6cf; transition: color .25s; }
.x-manifesto__text span.on { color: var(--ink); }
.x-manifesto__text span.on.hot { color: var(--x-red); }
.x-manifesto__strokes { position: absolute; right: var(--gutter); bottom: 6vh; height: 34vh; width: auto; opacity: .9; }
.x-manifesto__strokes path { transform: translateY(105%); transition: transform .9s var(--x-ease); }
.x-manifesto.done .x-manifesto__strokes path { transform: none; }
.x-manifesto__strokes path:nth-child(2) { transition-delay: .1s; }
.x-manifesto__strokes path:nth-child(3) { transition-delay: .2s; }
.x-marquee { overflow: hidden; white-space: nowrap; padding: 28px 0; border-top: 1px solid var(--line-dark); border-bottom: 1px solid var(--line-dark); margin-top: 56px; }
.x-marquee__t { display: inline-flex; gap: 48px; animation: x-marq 34s linear infinite; }
.x-marquee span { font-family: var(--display); font-weight: 800; font-size: clamp(2.2rem, 1.2rem + 3vw, 4.4rem); letter-spacing: -.045em; color: transparent; -webkit-text-stroke: 1.4px rgba(255, 255, 255, .55); display: inline-flex; align-items: center; gap: 48px; }
.x-marquee span:nth-child(even) { color: #fff; -webkit-text-stroke: 0; }
.x-marquee span::after { content: ""; width: 14px; height: 14px; border-radius: 50%; background: var(--x-red); }
@keyframes x-marq { to { transform: translateX(-50%); } }

/* ======================= INVESTMENT: the selection ======================= */
.x-select { height: 260vh; }
.x-select .x-pin__stage { background: var(--x-ink); color: #fff; display: flex; align-items: center; }
.x-select__glow { position: absolute; inset: auto -10% -30% 30%; height: 80%; background: radial-gradient(closest-side, rgba(215, 20, 26, .35), transparent); filter: blur(30px); }
.x-select__inner { position: relative; display: grid; grid-template-columns: 1fr 1fr; gap: clamp(32px, 5vw, 80px); align-items: center; width: 100%; padding-top: var(--header-h); }
.x-select h1 { font-family: var(--display); font-weight: 800; letter-spacing: -.05em; line-height: .95; font-size: clamp(2.4rem, 1rem + 4.4vw, 5.4rem); margin: 22px 0 0; text-wrap: balance; }
.x-select h1 em { font-style: normal; color: var(--x-red); }
.x-select .x-note { color: #b9b9c2; margin-top: 24px; }
.x-field { display: grid; grid-template-columns: repeat(10, 1fr); gap: clamp(6px, .8vw, 12px); }
.x-field i { aspect-ratio: 1; border-radius: 10px; background: rgba(255, 255, 255, .1); border: 1px solid rgba(255, 255, 255, .08); transition: opacity .5s, transform .6s var(--x-ease), background .5s, box-shadow .5s; }
.x-field i.out { opacity: .06; transform: scale(.6); }
.x-field i.pick { background: var(--x-red); border-color: transparent; transform: scale(1.12); box-shadow: 0 0 0 6px rgba(215, 20, 26, .2), 0 14px 40px -10px rgba(215, 20, 26, .9); }
.x-select__result { margin-top: 28px; display: flex; align-items: baseline; gap: 16px; opacity: 0; transform: translateY(14px); transition: opacity .6s, transform .6s var(--x-ease); }
.x-select__result b { font-family: var(--display); font-size: clamp(3rem, 2rem + 3vw, 5rem); font-weight: 800; letter-spacing: -.05em; color: var(--x-red); line-height: 1; }
.x-select__result span { color: #d3d3d9; max-width: 26ch; }
.x-select.done .x-select__result { opacity: 1; transform: none; }

/* ======================= PORTFOLIO: the gallery ========================== */
.x-gal { display: flex; gap: 14px; height: min(78vh, 720px); }
.x-gal__p {
	position: relative; isolation: isolate; overflow: hidden; flex: 1 1 0; min-width: 0; border-radius: 30px; background: #15151c; color: #fff; cursor: pointer;
	transition: flex-grow .8s var(--x-ease), background .6s; outline: none;
}
.x-gal__p::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(120% 80% at 100% 100%, color-mix(in srgb, var(--accent) 55%, transparent), transparent 60%); opacity: .55; transition: opacity .6s; }
.x-gal__p.is-open { flex-grow: 4.2; cursor: default; }
.x-gal__p.is-open::before { opacity: 1; }
.x-gal__p:focus-visible { box-shadow: 0 0 0 3px var(--x-red); }
.x-gal__side { position: absolute; left: 26px; bottom: 30px; writing-mode: vertical-rl; transform: rotate(180deg); font-family: var(--display); font-weight: 800; font-size: clamp(1.6rem, 1.2rem + 1.2vw, 2.4rem); letter-spacing: -.04em; white-space: nowrap; transition: opacity .4s; }
.x-gal__idx { position: absolute; top: 26px; left: 26px; font-weight: 600; color: rgba(255, 255, 255, .55); font-size: .9rem; }
.x-gal__p.is-open .x-gal__side { opacity: 0; }
.x-gal__body { position: absolute; inset: auto 0 0 0; padding: clamp(26px, 3vw, 44px); opacity: 0; transform: translateY(24px); transition: opacity .5s, transform .6s var(--x-ease); pointer-events: none; min-width: min(560px, 70vw); }
.x-gal__p.is-open .x-gal__body { opacity: 1; transform: none; transition-delay: .25s; pointer-events: auto; }
.x-gal__cat { display: inline-block; padding: 7px 14px; border-radius: 999px; background: rgba(255, 255, 255, .1); font-size: .82rem; font-weight: 600; }
.x-gal__name { font-family: var(--display); font-weight: 800; letter-spacing: -.055em; line-height: .95; font-size: clamp(2.6rem, 1.4rem + 3.4vw, 5rem); margin: 16px 0 14px; }
.x-gal__sum { color: rgba(255, 255, 255, .78); max-width: 48ch; }
.x-gal__pts { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 22px; margin: 20px 0 26px; font-size: .95rem; }
.x-gal__pts li { position: relative; padding-left: 16px; color: rgba(255, 255, 255, .85); }
.x-gal__pts li::before { content: ""; position: absolute; left: 0; top: .6em; width: 6px; height: 6px; border-radius: 50%; background: var(--accent); }

/* ======================= CONTACT: the signal ============================= */
.x-signal { position: relative; overflow: hidden; background: var(--x-ink); color: #fff; padding: calc(var(--header-h) + 70px) 0 clamp(60px, 7vw, 100px); }
.x-signal__grid { position: absolute; inset: 0; background-image: linear-gradient(rgba(255, 255, 255, .05) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .05) 1px, transparent 1px); background-size: 56px 56px; mask-image: radial-gradient(ellipse at 75% 45%, #000 10%, transparent 70%); }
.x-signal__inner { position: relative; display: grid; grid-template-columns: 1.1fr .9fr; gap: clamp(32px, 5vw, 80px); align-items: center; }
.x-signal h1 { font-family: var(--display); font-weight: 800; letter-spacing: -.05em; line-height: .95; font-size: clamp(2.6rem, 1rem + 4.8vw, 5.8rem); margin: 22px 0 0; text-wrap: balance; }
.x-signal h1 em { font-style: normal; color: var(--x-red); }
.x-signal .x-note { color: #b9b9c2; margin-top: 24px; }
.x-radar { position: relative; aspect-ratio: 1; max-width: 460px; width: 100%; justify-self: center; display: grid; place-items: center; }
.x-radar__ring { position: absolute; inset: 0; border-radius: 50%; border: 1px solid rgba(255, 255, 255, .1); }
.x-radar__ring:nth-child(2) { inset: 16%; }
.x-radar__ring:nth-child(3) { inset: 32%; }
.x-radar__pulse { position: absolute; width: 24%; aspect-ratio: 1; border-radius: 50%; border: 2px solid var(--x-red); animation: x-pulse 2.8s var(--x-ease) infinite; opacity: 0; }
.x-radar__pulse:nth-child(5) { animation-delay: 1.4s; }
@keyframes x-pulse { 0% { transform: scale(.4); opacity: .9; } 100% { transform: scale(4.2); opacity: 0; } }
.x-radar__card { position: relative; z-index: 1; text-align: center; padding: 26px 30px; border-radius: 26px; background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .12); backdrop-filter: blur(10px); }
.x-radar__city { font-size: .9rem; color: #b9b9c2; font-weight: 600; }
.x-radar__time { font-family: var(--display); font-weight: 800; font-size: clamp(2.6rem, 2rem + 2vw, 3.8rem); letter-spacing: -.05em; line-height: 1; margin: 8px 0 12px; font-variant-numeric: tabular-nums; }
.x-radar__status { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; font-size: .92rem; }
.x-radar__status i { width: 9px; height: 9px; border-radius: 50%; background: #9a9aa5; }
.x-radar__status.is-open i { background: #22c55e; box-shadow: 0 0 0 4px rgba(34, 197, 94, .25); }
.x-actions { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-top: 40px; max-width: 640px; }
.x-actions a { display: flex; flex-direction: column; gap: 6px; padding: 18px 20px; border-radius: 20px; background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .12); text-decoration: none; color: #fff; transition: background .3s, transform .3s var(--x-ease), border-color .3s; }
.x-actions a:hover { background: var(--x-red); border-color: var(--x-red); transform: translateY(-3px); }
.x-actions small { color: #b9b9c2; font-size: .8rem; font-weight: 600; transition: color .3s; }
.x-actions a:hover small { color: #ffdcdd; }
.x-actions b { font-size: .98rem; font-weight: 600; overflow-wrap: anywhere; }

/* ======================= SERVICES: three doors =========================== */
.x-doors { position: relative; }
.x-door {
	position: sticky; top: calc(var(--header-h) + 16px); min-height: min(76vh, 680px); margin-bottom: 18px; border-radius: 34px; overflow: hidden; isolation: isolate;
	background: var(--x-ink); color: #fff; display: grid; grid-template-columns: 1.1fr .9fr; align-items: center; gap: 32px; padding: clamp(32px, 5vw, 72px);
	text-decoration: none; transform-origin: 50% 0; will-change: transform;
}
.x-door::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(90% 90% at 100% 100%, color-mix(in srgb, var(--accent) 60%, transparent), transparent 62%), radial-gradient(60% 60% at 0% 0%, color-mix(in srgb, var(--accent) 22%, transparent), transparent 70%); }
.x-door__num { font-weight: 600; color: rgba(255, 255, 255, .6); }
.x-door h2 { font-family: var(--display); font-weight: 800; letter-spacing: -.05em; line-height: .95; font-size: clamp(2.4rem, 1rem + 4.4vw, 5.6rem); margin: 18px 0 20px; text-wrap: balance; }
.x-door p { color: rgba(255, 255, 255, .78); max-width: 46ch; font-size: 1.1rem; }
.x-door .chips { margin-top: 24px; }
.x-door .chips li { background: rgba(255, 255, 255, .1); color: #fff; border-color: transparent; }
.x-door__go { margin-top: 30px; display: inline-flex; align-items: center; gap: 12px; font-weight: 700; }
.x-door__go .dot { background: #fff; color: var(--ink); transition: transform .4s var(--x-ease), background .3s; }
.x-door:hover .x-door__go .dot { transform: rotate(-45deg); background: var(--accent); color: #fff; }
.x-door__art { display: grid; place-items: center; }
.x-door__art svg { width: min(100%, 420px); height: auto; filter: drop-shadow(0 30px 60px rgba(0, 0, 0, .4)); }

/* ======================= BLOG: the journal =============================== */
.x-feature { display: grid; grid-template-columns: 1.15fr .85fr; gap: clamp(24px, 4vw, 56px); align-items: center; text-decoration: none; color: inherit; margin-bottom: clamp(48px, 6vw, 80px); }
.x-feature__img { aspect-ratio: 16 / 10; border-radius: 28px; overflow: hidden; background: var(--x-ink) center / cover; }
.x-feature__img img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s var(--x-ease); }
.x-feature:hover .x-feature__img img { transform: scale(1.04); }
.x-feature__meta { color: var(--muted); font-size: .92rem; }
.x-feature h2 { font-family: var(--display); font-weight: 800; letter-spacing: -.045em; line-height: 1; font-size: clamp(2rem, 1rem + 2.6vw, 3.4rem); margin: 14px 0 16px; transition: color .3s; }
.x-feature:hover h2 { color: var(--x-red); }
.x-feature p { color: var(--muted); }
.x-readtime { display: inline-flex; align-items: center; gap: 8px; }
.x-readtime::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--x-red); }

/* ======================= Responsive ====================================== */
@media (max-width: 960px) {
	.x-select__inner, .x-signal__inner, .x-door, .x-feature { grid-template-columns: 1fr; }
	.x-field { grid-template-columns: repeat(8, 1fr); }
	.x-door { min-height: 0; position: relative; top: 0; }
	.x-door__art svg { width: min(70%, 300px); }
	.x-nums ul { grid-template-columns: 1fr 1fr; gap: 44px 0; }
	.x-nums li:nth-child(3) { border: 0; padding-left: 0; }
	.x-gal { flex-direction: column; height: auto; }
	.x-gal__p, .x-gal__p.is-open { flex: none; min-height: 0; cursor: default; }
	.x-gal__side, .x-gal__idx { display: none; }
	.x-gal__body { position: relative; opacity: 1; transform: none; pointer-events: auto; min-width: 0; }
	.x-rows a { grid-template-columns: 1fr 48px; }
	.x-rows__cat { display: none; }
	.x-radar { max-width: 320px; }
}
@media (max-width: 600px) {
	.x-actions { grid-template-columns: 1fr; }
	.x-gal__pts { grid-template-columns: 1fr; }
	.x-card { flex-basis: 82vw; }
	.x-manifesto__strokes { height: 22vh; }
}

@media (prefers-reduced-motion: reduce) {
	.x-open, .x-manifesto, .x-select { height: auto; }
	.x-pin__stage { position: relative; height: auto; min-height: 100vh; }
	.x-band { clip-path: none !important; }
	.x-open__c1 { display: none; }
	.x-open__c2, .x-open__shade { opacity: 1 !important; }
	.x-run .x-pin__stage { height: auto; padding: 100px 0; }
	.x-track { flex-wrap: wrap; transform: none !important; padding-right: var(--gutter); }
	.x-manifesto__text span { color: var(--ink); }
	.x-select__result { opacity: 1; transform: none; }
	.x-door { position: relative; top: 0; transform: none !important; }
	.x-radar__pulse, .x-marquee__t, .x-hint span::after { animation: none; }
	.x-nums__art path, .x-manifesto__strokes path { transform: none; }
}

/* Service art inside v4 surfaces takes the practice accent */
.x-door__art, .x-card__art { color: color-mix(in srgb, var(--accent, #d7141a) 70%, #fff); }

/* Legal pages: the table of contents is desktop-only, so hide its empty heading on small screens. */
@media (max-width: 960px) { .legal-layout .svc-aside { display: none; } }