/* Page /perekrytiya-v-stalinke/ only (body.marko-stalin-page). Redesign 23.10.2026,
 * tmp/design-qa/stalinka-redesign-20261023/plan.md. Values are copied from the two accepted references:
 * NN = marko-nizhny-novgorod-case.css (31018): navy #123752, blue #165581, line #dbe7ed, soft #f3f7f9,
 *      text #1f2933, muted #536675, hover #0d3f61, focus #7ab7dd, hero card, buttons, survey rows,
 *      team cards, dark proof block, carousel (46px controls, slide card, counter);
 * MH = marko-mariupol-house-page.css (38020): jump navigation, numbered circles #1e79b7, context note,
 *      proof card, document links, panel border rgba(22,85,130,.18) radius 18.
 * No new palette, no global tokens; shared forms and author card keep their owners. */

body.marko-stalin-page .marko-stalin {
	--st-navy: #123752;
	--st-blue: #165581;
	--st-hover: #0d3f61;
	--st-line: #dbe7ed;
	--st-soft: #f3f7f9;
	--st-text: #1f2933;
	--st-muted: #536675;
	--st-focus: #7ab7dd;
	--st-action: #1e79b7;
	--st-pale: #eef6fb;
	--st-panel-line: rgba(22, 85, 130, .18);
	box-sizing: border-box;
	width: min(1200px, calc(100% - 32px));
	margin: 18px auto 72px;
	color: var(--st-text);
	font-family: Roboto, Arial, sans-serif;
	font-size: 17px;
	line-height: 1.65;
	text-align: left;
}

body.marko-stalin-page .marko-stalin *,
body.marko-stalin-page .marko-stalin *::before,
body.marko-stalin-page .marko-stalin *::after {
	box-sizing: border-box;
}

/* The lead already offers the free calculation, so the shared strip would repeat it. */
body.marko-stalin-page #marko-trust-strip {
	display: none !important;
}

body.marko-stalin-page .marko-stalin :where(p, li) {
	letter-spacing: normal;
	text-align: left;
}

body.marko-stalin-page .marko-stalin p {
	margin: 0 0 14px;
}

body.marko-stalin-page .marko-stalin :where(h2, h3) {
	color: var(--st-navy);
	font-family: Roboto, Arial, sans-serif;
	text-align: left;
	text-transform: none;
	text-wrap: balance;
	overflow-wrap: normal;
	hyphens: manual;
}

body.marko-stalin-page .marko-stalin h2 {
	margin: 0 0 18px;
	font-size: clamp(1.55rem, 2.6vw, 2.2rem);
	font-weight: 800;
	line-height: 1.15;
	letter-spacing: -.02em;
}

body.marko-stalin-page .marko-stalin h3 {
	margin: 0 0 10px;
	font-size: 1.1rem;
	font-weight: 700;
	line-height: 1.35;
}

/* Links: explicit states, no inherited purple. */
body.marko-stalin-page .marko-stalin a:not(.marko-stalin-button) {
	color: var(--st-blue);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
}

body.marko-stalin-page .marko-stalin a:not(.marko-stalin-button):visited {
	color: var(--st-blue);
}

body.marko-stalin-page .marko-stalin a:not(.marko-stalin-button):hover,
body.marko-stalin-page .marko-stalin a:not(.marko-stalin-button):active {
	color: var(--st-hover);
}

body.marko-stalin-page .marko-stalin a:focus-visible,
body.marko-stalin-page .marko-stalin button:focus-visible {
	outline: 3px solid var(--st-focus);
	outline-offset: 3px;
	border-radius: 3px;
}

body.marko-stalin-page .marko-stalin-visually-hidden {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

/* ---------- Buttons (NN): solid and outline, equal width in one column ---------- */
body.marko-stalin-page .marko-stalin .marko-stalin-button {
	display: inline-flex;
	min-height: 46px;
	align-items: center;
	justify-content: center;
	padding: 11px 17px;
	border: 1px solid var(--st-blue);
	border-radius: 8px;
	font-size: 15px;
	font-weight: 700;
	line-height: 1.2;
	text-align: center;
	text-decoration: none;
	touch-action: manipulation;
	transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}

body.marko-stalin-page .marko-stalin .marko-stalin-button--primary,
body.marko-stalin-page .marko-stalin .marko-stalin-button--primary:visited {
	color: #fff;
	background: var(--st-blue);
}

body.marko-stalin-page .marko-stalin .marko-stalin-button--primary:hover,
body.marko-stalin-page .marko-stalin .marko-stalin-button--primary:active {
	color: #fff;
	background: var(--st-hover);
	border-color: var(--st-hover);
}

body.marko-stalin-page .marko-stalin .marko-stalin-button--secondary,
body.marko-stalin-page .marko-stalin .marko-stalin-button--secondary:visited {
	color: var(--st-blue);
	background: #fff;
	border-color: #9ab6c6;
}

body.marko-stalin-page .marko-stalin .marko-stalin-button--secondary:hover,
body.marko-stalin-page .marko-stalin .marko-stalin-button--secondary:active {
	color: var(--st-hover);
	background: #edf5f9;
}

body.marko-stalin-page .marko-stalin .marko-stalin-actions {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;
	max-width: 640px;
	margin: 24px 0 0;
}

/* Both hero buttons stay on one line and share one width and height on wide screens. */
@media (min-width: 1025px) {
	body.marko-stalin-page .marko-stalin-hero .marko-stalin-button {
		padding-inline: 14px;
		white-space: nowrap;
	}
}

/* ---------- Hero card (NN) ---------- */
body.marko-stalin-page .marko-stalin-hero {
	display: grid;
	grid-template-columns: minmax(0, 1.18fr) minmax(0, .82fr);
	gap: 32px;
	margin: 0 0 24px;
	padding: 40px;
	overflow: hidden;
	border: 1px solid var(--st-line);
	border-radius: 22px;
	background: linear-gradient(135deg, #f5f9fb, #fff);
	box-shadow: 0 16px 42px rgba(18, 55, 82, .1);
}

body.marko-stalin-page .marko-stalin-hero > * {
	min-width: 0;
}

body.marko-stalin-page .marko-stalin-hero__copy {
	align-self: start;
}

body.marko-stalin-page .marko-stalin-kicker {
	margin: 0 0 12px !important;
	color: var(--st-blue);
	font-size: .78rem;
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: .08em;
	text-transform: uppercase;
}

body.marko-stalin-page .marko-stalin-hero #marko-stalin-title {
	max-width: 20ch;
	margin: 0 0 18px;
	color: var(--st-navy);
	font-size: clamp(2rem, 3vw, 2.75rem);
	font-weight: 800;
	line-height: 1.12;
	letter-spacing: -.02em;
	text-wrap: balance;
}

body.marko-stalin-page .marko-stalin-lead {
	max-width: 62ch;
	margin: 0 0 16px !important;
	font-size: clamp(1.05rem, 1.2vw, 1.1rem);
	line-height: 1.6;
}

body.marko-stalin-page .marko-stalin-note {
	max-width: 62ch;
	margin: 0 !important;
	padding: 12px 16px;
	border: 1px solid rgba(30, 121, 183, .24);
	border-left: 5px solid var(--st-action);
	border-radius: 12px;
	color: #294354;
	background: #fff;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.5;
}

/* The photo starts on the kicker line and fills its column; no tinted band around a 4:3 frame. */
body.marko-stalin-page .marko-stalin-hero .marko-stalin-hero__photo {
	align-self: start;
	margin: 0;
	padding: 0;
}

body.marko-stalin-page .marko-stalin-hero__photo .marko-stalin-photo__img {
	border-radius: 14px;
	box-shadow: 0 12px 28px rgba(18, 55, 82, .14);
}

/* ---------- Photos: frame fitted to the image (NN survey figure) ---------- */
body.marko-stalin-page .marko-stalin-photo {
	margin: 0;
}

body.marko-stalin-page .marko-stalin-photo__img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: 8px;
}

body.marko-stalin-page .marko-stalin figcaption {
	font-style: normal;
}

body.marko-stalin-page .marko-stalin-photo figcaption {
	margin: 8px 2px 0;
	color: var(--st-muted);
	font-size: .88rem;
	line-height: 1.4;
}

body.marko-stalin-page .marko-stalin-row__photo {
	padding: 6px;
	border: 1px solid var(--st-line);
	border-radius: 12px;
	background: var(--st-soft);
}

body.marko-stalin-page .marko-stalin-row__photo figcaption {
	margin: 8px 6px 4px;
}

/* ---------- On this page (MH jump navigation) ---------- */
body.marko-stalin-page .marko-stalin-chips {
	display: flex;
	min-height: 58px;
	margin: 0 auto;
	padding: 8px;
	align-items: center;
	gap: 6px;
	border: 1px solid var(--st-panel-line);
	border-radius: 13px;
	background: #fff;
}

body.marko-stalin-page .marko-stalin .marko-stalin-chips a {
	display: inline-flex;
	min-height: 44px;
	align-items: center;
	padding: 8px 13px;
	border-radius: 8px;
	color: var(--st-blue);
	font-size: 14px;
	font-weight: 700;
	line-height: 1.25;
	text-decoration: none;
	white-space: nowrap;
}

body.marko-stalin-page .marko-stalin .marko-stalin-chips a:visited {
	color: var(--st-blue);
}

body.marko-stalin-page .marko-stalin .marko-stalin-chips a:hover,
body.marko-stalin-page .marko-stalin .marko-stalin-chips a:focus-visible {
	color: #102f49;
	background: var(--st-pale);
}

/* ---------- Sections and the reading rail ---------- */
body.marko-stalin-page .marko-stalin-section,
body.marko-stalin-page .marko-stalin-why,
body.marko-stalin-page .marko-stalin-pair-sections,
body.marko-stalin-page .marko-stalin-cta {
	max-width: 1120px;
	margin: 56px auto 0;
	scroll-margin-top: 24px;
}

body.marko-stalin-page .marko-stalin-pair-sections > .marko-stalin-section {
	margin: 0;
}

/* Running prose fills the content width of its section, as on 31018 and 38020 (owner 23.10.2026). */
body.marko-stalin-page .marko-stalin-prose {
	max-width: none;
}

body.marko-stalin-page .marko-stalin-panel {
	padding: 28px;
	border: 1px solid var(--st-panel-line);
	border-radius: 18px;
	background: linear-gradient(145deg, #f7fbfd, #edf6fb);
}

/* Text beside a photo (NN «Что показало обследование»). */
body.marko-stalin-page .marko-stalin-row {
	display: grid;
	grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr);
	gap: 32px;
	align-items: start;
	margin: 32px 0 0;
}

body.marko-stalin-page .marko-stalin-row > * {
	min-width: 0;
}

body.marko-stalin-page .marko-stalin .marko-stalin-row h3 {
	margin-top: 4px;
	font-size: clamp(1.25rem, 1.9vw, 1.55rem);
	line-height: 1.2;
}

/* Callout with a left bar (MH project context). */
body.marko-stalin-page .marko-stalin .marko-stalin-callout {
	margin: 16px 0;
	padding: 14px 18px;
	border: 1px solid rgba(30, 121, 183, .24);
	border-left: 5px solid var(--st-action);
	border-radius: 12px;
	color: #294d66;
	background: #fff;
	font-size: 16px;
	line-height: 1.55;
}

/* Square markers: a list that is not a sequence. */
body.marko-stalin-page .marko-stalin-squares {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 10px 32px;
	margin: 4px 0 0;
	padding: 0;
	list-style: none;
}

body.marko-stalin-page .marko-stalin-squares li {
	position: relative;
	margin: 0;
	padding: 0 0 0 22px;
	line-height: 1.55;
}

body.marko-stalin-page .marko-stalin-squares li::before {
	position: absolute;
	top: .55em;
	left: 2px;
	width: 8px;
	height: 8px;
	border-radius: 2px;
	background: var(--st-blue);
	content: "";
}

/* Three options (NN team cards, no numbers: these are choices, not steps). */
body.marko-stalin-page .marko-stalin-options,
body.marko-stalin-page .marko-stalin-faq__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 14px;
	margin: 20px 0;
	padding: 0;
	list-style: none;
}

body.marko-stalin-page .marko-stalin-options li,
body.marko-stalin-page .marko-stalin-faq__item,
body.marko-stalin-page .marko-stalin-region {
	min-width: 0;
	margin: 0;
	padding: 18px;
	border: 1px solid #dfe9ee;
	border-radius: 12px;
	background: var(--st-soft);
}

body.marko-stalin-page .marko-stalin-options p,
body.marko-stalin-page .marko-stalin-faq__item p,
body.marko-stalin-page .marko-stalin-region p {
	margin: 0;
	font-size: 16px;
	line-height: 1.55;
}

/* ---------- Dark block (NN «Почему этот кейс важен») ---------- */
body.marko-stalin-page .marko-stalin-why {
	max-width: 1200px;
	padding: 48px 40px;
	border-radius: 22px;
	color: #fff;
	background: var(--st-navy);
}

body.marko-stalin-page .marko-stalin-why__inner {
	max-width: 1120px;
	margin: 0 auto;
}

body.marko-stalin-page .marko-stalin .marko-stalin-why h2 {
	max-width: none;
	margin-bottom: 28px;
	color: #fff;
	font-size: clamp(1.7rem, 3vw, 2.5rem);
}

body.marko-stalin-page .marko-stalin-why__grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 32px;
	align-items: start;
}

body.marko-stalin-page .marko-stalin-why__copy p:last-child {
	margin-bottom: 0;
}

body.marko-stalin-page .marko-stalin-why__copy p {
	color: #e5f0f5;
	line-height: 1.65;
}

body.marko-stalin-page .marko-stalin .marko-stalin-why a:not(.marko-stalin-button),
body.marko-stalin-page .marko-stalin .marko-stalin-why a:not(.marko-stalin-button):visited {
	color: #bfe6fa;
}

body.marko-stalin-page .marko-stalin .marko-stalin-why a:not(.marko-stalin-button):hover {
	color: #fff;
}

body.marko-stalin-page .marko-stalin .marko-stalin-why a:focus-visible {
	outline-color: #a9d9f3;
}

body.marko-stalin-page .marko-stalin-why__cards {
	display: grid;
	gap: 14px;
	margin: 0;
	padding: 0;
	list-style: none;
}

body.marko-stalin-page .marko-stalin-why__cards li {
	margin: 0;
	padding: 20px;
	border: 1px solid rgba(255, 255, 255, .18);
	border-radius: 12px;
	background: rgba(255, 255, 255, .1);
}

body.marko-stalin-page .marko-stalin .marko-stalin-why__cards h3 {
	margin: 0 0 8px;
	color: #fff;
	font-size: 1.1rem;
}

body.marko-stalin-page .marko-stalin-why__cards p {
	margin: 0;
	color: #e5f0f5;
	font-size: 16px;
	line-height: 1.6;
}

/* ---------- Focal element: six steps, numbered circles (MH task list) ---------- */
body.marko-stalin-page .marko-stalin-how {
	padding: 32px 28px 20px;
	border: 1px solid var(--st-panel-line);
	border-radius: 18px;
	background: linear-gradient(145deg, #f7fbfd, #edf6fb);
}

/* One vertical ribbon in reading order: circles on a thin rail, text to the panel's inner edge. */
body.marko-stalin-page .marko-stalin-steps {
	max-width: none;
	margin: 28px 0 32px;
	padding: 0;
	list-style: none;
}

body.marko-stalin-page .marko-stalin-step {
	position: relative;
	display: grid;
	grid-template-columns: 44px minmax(0, 1fr);
	gap: 22px;
	margin: 0;
	padding: 0 0 26px;
}

body.marko-stalin-page .marko-stalin-step::before {
	position: absolute;
	top: 50px;
	bottom: 6px;
	left: 21px;
	width: 2px;
	border-radius: 1px;
	background: #c3d8e5;
	content: "";
}

body.marko-stalin-page .marko-stalin-step:last-child {
	padding-bottom: 0;
}

body.marko-stalin-page .marko-stalin-step:last-child::before {
	display: none;
}

body.marko-stalin-page .marko-stalin-step__body {
	max-width: none;
}

body.marko-stalin-page .marko-stalin-step p {
	font-size: 16px;
	line-height: 1.6;
}

body.marko-stalin-page .marko-stalin-step__num {
	display: grid;
	width: 44px;
	height: 44px;
	place-items: center;
	border-radius: 50%;
	color: #fff;
	background: var(--st-action);
	font-size: 16px;
	font-weight: 800;
	line-height: 1;
}

body.marko-stalin-page .marko-stalin .marko-stalin-step h3 {
	margin: 8px 0 8px;
	font-size: clamp(1.2rem, 1.7vw, 1.4rem);
	line-height: 1.25;
}

body.marko-stalin-page .marko-stalin-step p:last-child {
	margin-bottom: 0;
}

/* Document links (MH proof action). */
body.marko-stalin-page .marko-stalin .marko-stalin-docs {
	display: flex;
	flex-wrap: wrap;
	gap: 0 18px;
	margin: -6px 0 10px;
}

body.marko-stalin-page .marko-stalin .marko-stalin-doc,
body.marko-stalin-page .marko-stalin .marko-stalin-doc:visited,
body.marko-stalin-page .marko-stalin .marko-stalin-object__link,
body.marko-stalin-page .marko-stalin .marko-stalin-object__link:visited {
	display: inline-flex;
	min-height: 44px;
	align-items: center;
	color: var(--st-action);
	font-size: 16px;
	font-weight: 800;
	line-height: 1.35;
	text-decoration-thickness: 1.5px;
	text-underline-offset: 4px;
}

body.marko-stalin-page .marko-stalin .marko-stalin-doc:hover,
body.marko-stalin-page .marko-stalin .marko-stalin-object__link:hover {
	color: var(--st-hover);
}

/* ---------- Process carousel (NN media contract) ---------- */
body.marko-stalin-page .marko-stalin-carousel {
	--marko-stalin-per: 3;
	--marko-stalin-gap: 14px;
	position: relative;
	padding: 12px 58px 42px;
}

body.marko-stalin-page .marko-stalin-carousel__viewport {
	overflow: hidden;
	touch-action: pan-y;
}

body.marko-stalin-page .marko-stalin-carousel__track {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--marko-stalin-gap);
	margin: 0;
	padding: 0;
	list-style: none;
}

body.marko-stalin-page .marko-stalin-carousel.is-ready .marko-stalin-carousel__track {
	display: flex;
	transition: transform 300ms cubic-bezier(0.32, 0.72, 0, 1);
}

/* A width change repositions the track without motion (a geometry correction, not a user action);
 * while a finger drags it, the track follows the finger directly. */
body.marko-stalin-page .marko-stalin-carousel.is-resizing .marko-stalin-carousel__track,
body.marko-stalin-page .marko-stalin-carousel.is-dragging .marko-stalin-carousel__track {
	transition: none;
}

body.marko-stalin-page .marko-stalin-carousel.is-dragging {
	-webkit-user-select: none;
	user-select: none;
}

body.marko-stalin-page .marko-stalin-slide {
	display: flex;
	min-width: 0;
	margin: 0;
}

body.marko-stalin-page .marko-stalin-carousel.is-ready .marko-stalin-slide {
	flex: 0 0 calc((100% - (var(--marko-stalin-per) - 1) * var(--marko-stalin-gap)) / var(--marko-stalin-per));
}

body.marko-stalin-page .marko-stalin-slide figure {
	display: flex;
	width: 100%;
	margin: 0;
	flex-direction: column;
	overflow: hidden;
	border: 1px solid var(--st-line);
	border-radius: 14px;
	background: #fff;
}

body.marko-stalin-page .marko-stalin .marko-stalin-slide a {
	display: block;
	background: #edf3f6;
	cursor: zoom-in;
}

body.marko-stalin-page .marko-stalin-slide__img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 4 / 3;
	object-fit: cover;
}

body.marko-stalin-page .marko-stalin-slide figcaption {
	display: flex;
	min-height: 66px;
	flex: 1 1 auto;
	align-items: center;
	padding: 11px 13px;
	color: #294354;
	font-size: 14px;
	font-weight: 650;
	line-height: 1.42;
}

body.marko-stalin-page .marko-stalin .marko-stalin-carousel__btn {
	position: absolute;
	top: calc(50% - 15px);
	z-index: 2;
	display: inline-flex;
	width: 46px;
	height: 46px;
	margin: 0;
	padding: 0;
	align-items: center;
	justify-content: center;
	transform: translateY(-50%);
	border: 1px solid #a8c3d0;
	border-radius: 50%;
	color: var(--st-blue);
	background: #fff;
	box-shadow: 0 5px 14px rgba(18, 55, 82, .12);
	cursor: pointer;
	transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}

body.marko-stalin-page .marko-stalin .marko-stalin-carousel__btn[hidden] {
	display: none;
}

body.marko-stalin-page .marko-stalin .marko-stalin-carousel__btn--prev {
	left: 2px;
}

body.marko-stalin-page .marko-stalin .marko-stalin-carousel__btn--next {
	right: 2px;
}

body.marko-stalin-page .marko-stalin .marko-stalin-carousel__btn:not([aria-disabled="true"]):hover,
body.marko-stalin-page .marko-stalin .marko-stalin-carousel__btn:not([aria-disabled="true"]):focus-visible {
	color: #fff;
	background: var(--st-blue);
	border-color: var(--st-blue);
}

body.marko-stalin-page .marko-stalin .marko-stalin-carousel__btn[aria-disabled="true"] {
	opacity: .45;
	cursor: default;
	box-shadow: none;
}

body.marko-stalin-page .marko-stalin .marko-stalin-carousel__count {
	position: absolute;
	right: 58px;
	bottom: 4px;
	margin: 0;
	min-height: 30px;
	padding: 5px 10px;
	border-radius: 999px;
	color: var(--st-blue);
	background: #e6f1f6;
	font-size: 13px;
	font-weight: 800;
	line-height: 20px;
}

body.marko-stalin-page .marko-stalin .marko-stalin-carousel__count[hidden] {
	display: none;
}

/* ---------- Objects: one real photo per object ---------- */
body.marko-stalin-page .marko-stalin-objects {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 18px;
	margin: 22px 0 24px;
	padding: 0;
	list-style: none;
}

body.marko-stalin-page .marko-stalin-object {
	display: flex;
	min-width: 0;
	margin: 0;
	flex-direction: column;
	overflow: hidden;
	border: 1px solid var(--st-line);
	border-radius: 14px;
	background: #fff;
}

body.marko-stalin-page .marko-stalin-object__media {
	background: #edf3f6;
}

body.marko-stalin-page .marko-stalin-object__img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 3 / 2;
	object-fit: cover;
}

body.marko-stalin-page .marko-stalin-object__body {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	padding: 16px 18px 10px;
}

body.marko-stalin-page .marko-stalin-object__body p {
	margin: 0 0 6px;
	font-size: 16px;
	line-height: 1.55;
}

body.marko-stalin-page .marko-stalin .marko-stalin-object__link {
	margin-top: auto;
}

body.marko-stalin-page .marko-stalin .marko-stalin-muted {
	color: var(--st-muted);
	font-size: 16px;
}

/* ---------- Prepare: the closing sentence and the button ---------- */
body.marko-stalin-page .marko-stalin-panel__end {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	margin-top: 22px;
	padding-top: 20px;
	border-top: 1px solid var(--st-panel-line);
}

body.marko-stalin-page .marko-stalin-panel__end p {
	flex: 1 1 auto;
	margin: 0;
}

body.marko-stalin-page .marko-stalin-panel__end .marko-stalin-button {
	flex: 0 0 auto;
}

/* ---------- Building: callout section ---------- */
body.marko-stalin-page .marko-stalin-building {
	padding: 26px 28px;
	border: 1px solid rgba(30, 121, 183, .24);
	border-left: 5px solid var(--st-action);
	border-radius: 12px;
	background: #fff;
}

body.marko-stalin-page .marko-stalin-building p {
	max-width: none;
}

body.marko-stalin-page .marko-stalin-building p:last-child {
	margin-bottom: 0;
}

/* ---------- Price and regions side by side ---------- */
body.marko-stalin-page .marko-stalin-pair-sections {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	column-gap: 32px;
	align-items: start;
}

@supports (grid-template-rows: subgrid) {
	@media (min-width: 1025px) {
		body.marko-stalin-page .marko-stalin-pair-sections > .marko-stalin-section {
			display: grid;
			grid-row: span 2;
			grid-template-rows: subgrid;
			row-gap: 0;
			align-items: start;
		}
	}
}

body.marko-stalin-page .marko-stalin-proof {
	margin: 0 0 16px;
	padding: 17px 18px 18px;
	border: 1px solid rgba(30, 121, 183, .22);
	border-radius: 12px;
	background: linear-gradient(145deg, #f7fbfe 0%, #eaf5fb 100%);
}

body.marko-stalin-page .marko-stalin .marko-stalin-proof__figure {
	margin: 0 0 8px;
	color: #165582;
	font-size: clamp(22px, 2.1vw, 28px);
	font-weight: 900;
	line-height: 1.15;
	letter-spacing: -.02em;
}

body.marko-stalin-page .marko-stalin-proof p:last-child {
	margin: 0;
	font-size: 16px;
	line-height: 1.55;
}

body.marko-stalin-page .marko-stalin-price .marko-stalin-pair__body > p {
	font-size: 16px;
	line-height: 1.6;
}

body.marko-stalin-page .marko-stalin-region + .marko-stalin-region {
	margin-top: 14px;
}

body.marko-stalin-page .marko-stalin-region--turnkey {
	border-color: var(--st-navy);
	background: var(--st-navy);
}

body.marko-stalin-page .marko-stalin .marko-stalin-region--turnkey h3 {
	color: #fff;
}

body.marko-stalin-page .marko-stalin .marko-stalin-region--turnkey p {
	color: #e5f0f5;
}

/* ---------- FAQ: open pairs ---------- */
body.marko-stalin-page .marko-stalin-faq__grid {
	grid-template-columns: repeat(2, minmax(0, 1fr));
	margin-bottom: 0;
}

/* ---------- Closing: shared forms, then the phone line ---------- */
body.marko-stalin-page .marko-stalin-cta > h2,
body.marko-stalin-page .marko-stalin-cta > p {
	max-width: none;
}

body.marko-stalin-page .marko-stalin .marko-stalin-call {
	max-width: none;
	margin: 24px 0 0;
	color: var(--st-muted);
	font-size: 17px;
	line-height: 1.55;
}

body.marko-stalin-page .marko-stalin .marko-stalin-tel {
	font-weight: 700;
	white-space: nowrap;
}

body.marko-stalin-page .marko-stalin .marko-author-card {
	max-width: 1120px;
	margin-top: 32px !important;
}

/* ---------- Tablet ---------- */
@media (max-width: 1024px) {
	body.marko-stalin-page .marko-stalin-objects,
	body.marko-stalin-page .marko-stalin-options {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	body.marko-stalin-page .marko-stalin-why__grid,
	body.marko-stalin-page .marko-stalin-pair-sections {
		grid-template-columns: minmax(0, 1fr);
	}

	body.marko-stalin-page .marko-stalin-pair-sections {
		gap: 56px;
	}
}

@media (max-width: 900px) {
	body.marko-stalin-page .marko-stalin-hero {
		grid-template-columns: minmax(0, 1fr);
		gap: 24px;
	}

	body.marko-stalin-page .marko-stalin-hero .marko-stalin-hero__photo {
		margin: 0;
		padding: 0;
	}

	body.marko-stalin-page .marko-stalin-row {
		grid-template-columns: minmax(0, 1fr);
		gap: 18px;
	}
}

/* ---------- Mobile ---------- */
@media (max-width: 600px) {
	body.marko-stalin-page .marko-stalin {
		width: calc(100% - 24px);
		margin: 10px auto 48px;
		font-size: 16.5px;
		line-height: 1.6;
	}

	body.marko-stalin-page .marko-stalin-hero {
		padding: 20px 16px;
		border-radius: 16px;
		row-gap: 20px;
	}

	body.marko-stalin-page .marko-stalin-hero .marko-stalin-hero__photo {
		margin: 0;
		padding: 0;
	}

	body.marko-stalin-page .marko-stalin-hero #marko-stalin-title {
		margin-bottom: 14px;
		font-size: 2rem;
	}

	body.marko-stalin-page .marko-stalin .marko-stalin-actions {
		grid-template-columns: minmax(0, 1fr);
		gap: 10px;
		margin-top: 18px;
	}

	body.marko-stalin-page .marko-stalin .marko-stalin-actions .marko-stalin-button,
	body.marko-stalin-page .marko-stalin-panel__end .marko-stalin-button {
		width: 100%;
	}

	body.marko-stalin-page .marko-stalin-chips {
		overflow-x: auto;
		overscroll-behavior-x: contain;
		scrollbar-width: none;
	}

	body.marko-stalin-page .marko-stalin-chips::-webkit-scrollbar {
		display: none;
	}

	body.marko-stalin-page .marko-stalin-section,
	body.marko-stalin-page .marko-stalin-why,
	body.marko-stalin-page .marko-stalin-pair-sections,
	body.marko-stalin-page .marko-stalin-cta {
		margin-top: 40px;
	}

	body.marko-stalin-page .marko-stalin-pair-sections {
		gap: 40px;
	}

	body.marko-stalin-page .marko-stalin-panel,
	body.marko-stalin-page .marko-stalin-how,
	body.marko-stalin-page .marko-stalin-building {
		padding: 18px 16px;
		border-radius: 14px;
	}

	body.marko-stalin-page .marko-stalin-why {
		padding: 32px 18px;
		border-radius: 16px;
	}

	body.marko-stalin-page .marko-stalin-squares,
	body.marko-stalin-page .marko-stalin-options,
	body.marko-stalin-page .marko-stalin-objects,
	body.marko-stalin-page .marko-stalin-faq__grid {
		grid-template-columns: minmax(0, 1fr);
	}

	body.marko-stalin-page .marko-stalin-step {
		display: block;
		padding: 0 0 22px;
	}

	body.marko-stalin-page .marko-stalin-step::before {
		display: none;
	}

	body.marko-stalin-page .marko-stalin-step + .marko-stalin-step {
		padding-top: 18px;
		border-top: 1px solid var(--st-line);
	}

	body.marko-stalin-page .marko-stalin-step__num {
		position: absolute;
		top: 2px;
		left: 0;
	}

	body.marko-stalin-page .marko-stalin-step + .marko-stalin-step .marko-stalin-step__num {
		top: 20px;
	}

	body.marko-stalin-page .marko-stalin .marko-stalin-step h3 {
		display: flex;
		min-height: 40px;
		align-items: center;
		margin: 0 0 8px;
		padding-left: 46px;
	}

	body.marko-stalin-page .marko-stalin-step__num {
		width: 36px;
		height: 36px;
		font-size: 14px;
	}

	/* As on 31018: the carousel takes the screen width minus 10px each side, arrows in 50px gutters. */
	body.marko-stalin-page .marko-stalin-carousel {
		margin-inline: calc(50% - 50vw + 10px);
		padding: 10px 50px 42px;
	}

	body.marko-stalin-page .marko-stalin-carousel__track {
		grid-template-columns: minmax(0, 1fr);
	}

	body.marko-stalin-page .marko-stalin .marko-stalin-carousel__count {
		right: 50px;
	}

	body.marko-stalin-page .marko-stalin-slide figcaption {
		min-height: 62px;
		font-size: 13.5px;
	}

	body.marko-stalin-page .marko-stalin-panel__end {
		align-items: stretch;
		flex-direction: column;
		gap: 14px;
	}
}

@media (max-width: 359px) {
	body.marko-stalin-page .marko-stalin-hero #marko-stalin-title {
		font-size: 1.75rem;
	}

	body.marko-stalin-page .marko-stalin h2 {
		font-size: 1.45rem;
	}
}

/* Movement off; colour feedback stays. */
@media (prefers-reduced-motion: reduce) {
	body.marko-stalin-page .marko-stalin-carousel.is-ready .marko-stalin-carousel__track {
		transition: none;
	}
}
