/* Каталог подбора zap-catalog.
   Цвета и шрифты — переменные темы (--zx-*) с запасными значениями: каталог не ломается без темы. */

.zc,
.zc-hero,
.zc-cta,
.zc-article-block {
	--zc-ink: var(--zx-ink, #36425e);
	--zc-ink-2: var(--zx-ink-2, #687186);
	--zc-wine: var(--zx-wine, #ae3045);
	--zc-wine-deep: var(--zx-wine-deep, #8e2536);
	--zc-mist: var(--zx-mist, #f2f4f8);
	--zc-line: var(--zx-line, #dfe3ec);
	--zc-paper: var(--zx-paper, #ffffff);
	--zc-warn: #9a6412;
	--zc-warn-bg: #fbf3e4;
	--zc-warn-line: #efd9ae;
	--zc-f-display: var(--zx-f-display, sans-serif);
	--zc-f-body: var(--zx-f-body, sans-serif);
	--zc-f-data: var(--zx-f-data, monospace);
	--zc-r-lg: var(--zx-r-lg, 22px);
	--zc-r-md: var(--zx-r-md, 14px);
	--zc-r-sm: var(--zx-r-sm, 10px);
	--zc-shadow: var(--zx-shadow, 0 10px 30px rgba(54, 66, 94, 0.08));
}

/* ---------- заголовки ---------- */

.zc-eyebrow {
	margin: 0 0 10px;
	color: var(--zc-ink-2);
	font: 500 13px/1.35 var(--zc-f-data);
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.zc-title {
	margin: 0 0 28px;
	color: var(--zc-ink);
	font: 500 44px/1.1 var(--zc-f-display);
	letter-spacing: -0.02em;
}

.zc-h2 {
	margin: 40px 0 18px;
	color: var(--zc-ink);
	font: 500 24px/1.2 var(--zc-f-display);
}

.zc-lead {
	max-width: 640px;
	margin: 0 0 24px;
	color: var(--zc-ink-2);
	font-size: 18px;
}

/* ---------- шапка машины: заголовок и фото на подиуме ---------- */

.zc-head {
	margin: 0 0 28px;
}

.zc-head .zc-title {
	margin-bottom: 0;
}

/* Фото справа на всю высоту шапки; на телефоне — между заголовком и паспортом. */
.zc-head--photo {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	grid-template-areas: "text car" "passport car";
	grid-template-rows: auto 1fr;
	column-gap: 40px;
	align-items: start;
}

.zc-head--photo .zc-head__text {
	grid-area: text;
}

.zc-head--photo .zc-car {
	grid-area: car;
	align-self: center;
}

.zc-head--photo .zc-passport {
	grid-area: passport;
}

.zc-head--compact.zc-head--photo {
	grid-template-columns: minmax(0, 1fr) 300px;
}

/* На странице запчасти паспорта нет — заголовок по центру фото. */
.zc-head--compact .zc-head__text {
	grid-row: 1 / -1;
	align-self: center;
}

/* Паспорт машины под заголовком: строки «ключ — значение», как на карточке подбора. */
.zc-passport {
	margin: 24px 0 0;
	padding: 0;
}

.zc-passport__row {
	display: grid;
	grid-template-columns: 120px minmax(0, 1fr);
	gap: 14px;
	align-items: baseline;
	padding: 11px 0;
	border-top: 1px solid var(--zc-line);
}

.zc-passport__row:last-child {
	border-bottom: 1px solid var(--zc-line);
}

.zc-passport__key {
	margin: 0;
	color: var(--zc-ink-2);
	font: 500 12px/1.3 var(--zc-f-data);
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.zc-passport__value {
	margin: 0;
	color: var(--zc-ink);
	font-size: 16px;
	line-height: 1.45;
}

.zc-passport__code {
	margin-right: 8px;
	color: var(--zc-ink);
	font-weight: 600;
}

a.zc-passport__code {
	color: var(--zc-wine);
	text-decoration: underline;
	text-decoration-color: rgba(174, 48, 69, 0.35);
	text-underline-offset: 3px;
}

a.zc-passport__code:hover {
	color: var(--zc-wine-deep);
	text-decoration-color: currentColor;
}

/* Подиум: светлая площадка, пол чуть темнее и отделён тонкой линией горизонта.
   Картинка обрезана по машине, поэтому низ картинки — это низ колёс: ставим его на пол
   (--zc-rest над нижним краем), горизонт — чуть выше колёс, тень — эллипс цвета текста сайта. */
.zc-car {
	margin: 0;
}

.zc-car__stage {
	--zc-rest: 34px;
	position: relative;
	isolation: isolate;
	padding: 28px 36px var(--zc-rest);
	border-radius: var(--zc-r-lg);
	background: var(--zc-mist);
	overflow: hidden;
}

.zc-car__stage::before {
	content: "";
	position: absolute;
	z-index: -1;
	left: 0;
	right: 0;
	bottom: 0;
	height: calc(var(--zc-rest) + 22%);
	border-top: 1px solid var(--zc-line);
	background: #e8ecf3;
}

.zc-car__stage::after {
	content: "";
	position: absolute;
	z-index: -1;
	left: 14%;
	right: 14%;
	bottom: calc(var(--zc-rest) - 11px);
	height: 24px;
	border-radius: 50%;
	background: radial-gradient(closest-side, rgba(31, 38, 56, 0.45), rgba(31, 38, 56, 0.15) 65%, transparent);
}

.zc-car__img {
	display: block;
	width: 100%;
	height: auto;
}

.zc-car__caption {
	margin-top: 10px;
	color: var(--zc-ink-2);
	font: 500 12px/1.35 var(--zc-f-data);
	letter-spacing: 0.06em;
	text-align: center;
	text-transform: uppercase;
}

.zc-head--compact .zc-car__stage {
	--zc-rest: 20px;
	padding: 16px 20px var(--zc-rest);
	border-radius: var(--zc-r-md);
}

.zc-head--compact .zc-car__stage::after {
	bottom: calc(var(--zc-rest) - 7px);
	height: 14px;
}

/* ---------- плитки и таблетки ---------- */

.zc-tiles {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
	gap: 14px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.zc-tiles__item {
	margin: 0;
	list-style: none;
}

.zc-tile {
	display: flex;
	flex-direction: column;
	gap: 8px;
	height: 100%;
	padding: 18px 20px;
	border: 1px solid var(--zc-line);
	border-radius: var(--zc-r-md);
	color: var(--zc-ink);
	text-decoration: none;
	transition: border-color 0.15s, box-shadow 0.15s;
}

.zc-tile:hover {
	border-color: var(--zc-ink);
	box-shadow: var(--zc-shadow);
	color: var(--zc-ink);
}

.zc-tile__name {
	font: 500 19px/1.2 var(--zc-f-display);
}

.zc-tile__meta {
	flex: 1;
	color: var(--zc-ink-2);
	font-size: 14px;
	line-height: 1.45;
}

.zc-tile__more {
	color: var(--zc-wine);
	font-size: 14px;
	font-weight: 600;
}

.zc-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 36px 0 0;
	padding: 0;
	list-style: none;
}

.zc-chips li {
	margin: 0;
	list-style: none;
}

.zc-chip {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 9px 16px;
	background: var(--zc-mist);
	border-radius: 999px;
	color: var(--zc-ink);
	font-size: 15px;
	font-weight: 500;
	text-decoration: none;
}

.zc-chip:hover {
	background: var(--zc-line);
	color: var(--zc-ink);
}

.zc-chip__count {
	color: var(--zc-ink-2);
	font: 500 12px var(--zc-f-data);
}

/* ---------- этикетка: ответ подбора ---------- */

.zc-label {
	position: relative;
	display: block;
	overflow: hidden;
	background: var(--zc-paper);
	border: 1.5px solid var(--zc-ink);
	border-radius: var(--zc-r-lg);
	box-shadow: var(--zc-shadow);
	color: var(--zc-ink);
}

.zc-label + .zc-fit__period {
	margin-top: 32px;
}

.zc-label__strip {
	padding: 12px 22px;
	background: var(--zc-ink);
	color: #fff;
	font: 600 12px/1.35 var(--zc-f-data);
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.zc-label__body {
	container-type: inline-size;
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 10px 24px;
	padding: 22px 22px 18px;
}

/* Три размера (ширина, высота, толщина) — в один ряд. */
.zc-label__body--3 {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

/* Карточка без размеров: первая строка без линии сверху. */
.zc-label__body > .zc-label__row:first-child {
	padding-top: 0;
	border-top: 0;
}

.zc-label__cell {
	min-width: 0;
}

.zc-label__key {
	color: var(--zc-ink-2);
	font: 500 12px/1.2 var(--zc-f-data);
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.zc-label__value {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	column-gap: 5px;
	margin: 8px 0 8px;
	/* Размер — от ширины карточки, а не экрана: «425–430 мм» в половине карточки не вылезает за край. */
	font: 500 clamp(24px, 8.5cqi, 56px)/1 var(--zc-f-display);
	letter-spacing: -0.03em;
	white-space: nowrap;
	font-variant-numeric: tabular-nums;
}

.zc-label__unit {
	color: var(--zc-ink-2);
	font-size: max(13px, 0.4em);
	letter-spacing: 0;
}

.zc-label__row {
	grid-column: 1 / -1;
	display: grid;
	grid-template-columns: minmax(110px, auto) 1fr;
	align-items: baseline;
	gap: 14px;
	padding-top: 14px;
	border-top: 1px solid var(--zc-line);
}

.zc-label__row-value {
	font: 500 20px/1.25 var(--zc-f-display);
}

/* Значение со статьёй о нём: подчёркнуто пунктиром, как термин, у которого есть объяснение. */
.zc-label__link {
	color: inherit;
	text-decoration: underline dashed;
	text-decoration-color: var(--zc-wine);
	text-decoration-thickness: 1.5px;
	text-underline-offset: 5px;
}

.zc-label__link:hover {
	color: var(--zc-wine);
	text-decoration-style: solid;
}

/* нижняя строка: сколько источников проверено */
.zc-label__stub {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 4px 16px;
	padding: 13px 22px;
	border-top: 2px dashed var(--zc-line);
	background: var(--zc-mist);
	color: var(--zc-ink-2);
	font: 500 13px/1.4 var(--zc-f-data);
}

/* ---------- страница подбора ---------- */

/* Что ставят владельцы: список товаров с итогом по отзывам. */
.zc-picks {
	margin-top: 36px;
}

.zc-picks__title {
	margin: 0 0 4px;
	color: var(--zc-ink);
	font: 500 24px/1.2 var(--zc-f-display);
}

.zc-picks__lead {
	margin: 0 0 16px;
	color: var(--zc-ink-2);
	font-size: 15px;
}

.zc-picks__list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.zc-pick {
	margin: 0;
	padding: 16px 0;
	border-top: 1px solid var(--zc-line);
	list-style: none;
}

.zc-pick:last-child {
	border-bottom: 1px solid var(--zc-line);
}

.zc-pick__head {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: 6px 16px;
}

.zc-pick__name {
	color: var(--zc-ink);
	font: 500 19px/1.25 var(--zc-f-display);
}

.zc-pick__verdict {
	padding: 3px 10px;
	border-radius: 999px;
	background: var(--zc-mist);
	color: var(--zc-ink);
	font: 600 12px/1.4 var(--zc-f-data);
	white-space: nowrap;
}

.zc-pick--mixed .zc-pick__verdict {
	background: var(--zc-warn-bg);
	color: var(--zc-warn);
}

.zc-pick--no-fit .zc-pick__verdict {
	background: rgba(174, 48, 69, 0.1);
	color: var(--zc-wine);
}

.zc-pick__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 4px 14px;
	margin-top: 4px;
	color: var(--zc-ink-2);
	font: 500 14px/1.4 var(--zc-f-data);
}

.zc-pick__variant {
	color: var(--zc-wine);
	font-weight: 600;
}

.zc-pick__article {
	color: var(--zc-ink);
	font-weight: 600;
}

.zc-pick__text {
	margin: 6px 0 0;
	color: var(--zc-ink);
	font-size: 15px;
	line-height: 1.5;
}

.zc-picks__more {
	margin-top: 16px;
}

/* Раскрывашка выглядит кнопкой: рамка и стрелка, которая поворачивается при раскрытии. */
.zc-picks__summary {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 10px 16px;
	border: 1.5px solid var(--zc-line);
	border-radius: 999px;
	color: var(--zc-ink);
	font-size: 15px;
	font-weight: 600;
	line-height: 1.3;
	list-style: none;
	cursor: pointer;
	transition: border-color 0.15s;
}

.zc-picks__summary::-webkit-details-marker {
	display: none;
}

.zc-picks__summary::after {
	content: "";
	flex: none;
	width: 8px;
	height: 8px;
	margin-top: -4px;
	border-right: 2px solid var(--zc-wine);
	border-bottom: 2px solid var(--zc-wine);
	transform: rotate(45deg);
	transition: transform 0.15s;
}

.zc-picks__summary:hover {
	border-color: var(--zc-ink);
}

.zc-picks__more[open] .zc-picks__summary {
	margin-bottom: 8px;
}

.zc-picks__more[open] .zc-picks__summary::after {
	margin-top: 4px;
	transform: rotate(-135deg);
}

.zc-picks__hide,
.zc-picks__more[open] .zc-picks__show {
	display: none;
}

.zc-picks__more[open] .zc-picks__hide {
	display: inline;
}

/* Проверка по VIN: поле и результат. На хабе — не шире колонки текста. */
.zc-hub .zc-vin {
	max-width: 720px;
}

.zc-vin {
	margin-top: 32px;
	padding: 20px 22px;
	border: 1.5px solid var(--zc-line);
	border-radius: var(--zc-r-lg);
}

.zc-vin__title {
	margin: 0 0 10px;
	color: var(--zc-ink);
	font: 500 20px/1.25 var(--zc-f-display);
}

.zc-vin__label {
	display: block;
	margin-bottom: 8px;
	color: var(--zc-ink-2);
	font-size: 14px;
}

.zc-vin__row {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.zc-vin__input {
	flex: 1 1 260px;
	min-width: 0;
	padding: 11px 14px;
	border: 1.5px solid var(--zc-line);
	border-radius: var(--zc-r-md);
	background: var(--zc-paper);
	color: var(--zc-ink);
	font: 500 17px/1.2 var(--zc-f-data);
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.zc-vin__input:focus {
	border-color: var(--zc-ink);
	outline: none;
}

.zc-vin__btn {
	padding: 11px 20px;
	border: 0;
	border-radius: var(--zc-r-md);
	background: var(--zc-ink);
	color: #fff;
	font: 600 15px var(--zc-f-body);
	cursor: pointer;
}

.zc-vin__btn:hover {
	background: var(--zx-ink-deep, #1f2638);
}

.zc-vin__result {
	margin: 12px 0 0;
	font-size: 15px;
	line-height: 1.5;
}

.zc-vin__result:empty {
	display: none;
}

.zc-vin__result--ok {
	color: #1f6b3a;
}

.zc-vin__result--warn,
.zc-vin__result--unknown {
	color: var(--zc-warn);
}

.zc-vin__shop {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 12px;
	margin-top: 14px;
}

.zc-vin__shop[hidden] {
	display: none;
}

.zc-vin__shop .cpa-mon-ad {
	margin: 0;
}

.zc-vin__shop-btn {
	display: inline-flex;
	padding: 10px 18px;
	border-radius: 999px;
	background: var(--zc-wine);
	color: #fff;
	font-size: 15px;
	font-weight: 600;
	text-decoration: none;
}

.zc-vin__shop-btn:hover {
	background: var(--zc-wine-deep);
	color: #fff;
}

/* Кнопки «купить»: партнёрская ссылка /go/, цена с датой. */
.zc-buy {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 10px;
	margin-top: 10px;
}

.zc-buy__btn {
	display: inline-flex;
	align-items: baseline;
	gap: 8px;
	padding: 8px 14px;
	border-radius: 999px;
	background: var(--zc-wine);
	color: #fff;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.3;
	text-decoration: none;
}

.zc-buy__btn:hover {
	background: var(--zc-wine-deep);
	color: #fff;
}

.zc-buy__label {
	font-weight: 500;
	opacity: 0.85;
}

.zc-buy__price {
	font-weight: 500;
	opacity: 0.85;
}

.zc-pick--oem {
	border-top: 0;
	padding-top: 4px;
}

.zc-buy .cpa-mon-ad {
	margin: 0;
	align-self: center;
}

.zc-picks__prices {
	margin: 14px 0 0;
	color: var(--zc-ink-2);
	font-size: 12px;
	line-height: 1.4;
}

/* Фото владельцев у заметки или товара: миниатюры в ряд, по клику — полный кадр. */
.zc-photos {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin-top: 12px;
}

.zc-photo {
	width: 200px;
	max-width: calc(50% - 6px);
	margin: 0;
}

.zc-photo__link {
	display: block;
	overflow: hidden;
	border-radius: var(--zc-r-md);
	background: var(--zc-mist);
}

.zc-photo__img {
	display: block;
	width: 100%;
	height: 200px;
	object-fit: cover;
	transition: transform 0.2s;
}

.zc-photo__link:hover .zc-photo__img {
	transform: scale(1.03);
}

.zc-photo__caption {
	margin-top: 6px;
	color: var(--zc-ink-2);
	font-size: 13px;
	line-height: 1.4;
}

.zc-photo__credit {
	display: block;
	font-size: 12px;
	opacity: 0.8;
}

/* Полезно знать: короткие заметки «заголовок — текст». */
.zc-notes,
.zc-faq {
	margin-top: 36px;
}

.zc-notes__list {
	margin: 12px 0 0;
}

.zc-notes__item {
	display: grid;
	grid-template-columns: 170px minmax(0, 1fr);
	gap: 16px;
	padding: 14px 0;
	border-top: 1px solid var(--zc-line);
}

.zc-notes__item:last-child {
	border-bottom: 1px solid var(--zc-line);
}

.zc-notes__title {
	margin: 0;
	color: var(--zc-ink);
	font-weight: 600;
	font-size: 15px;
	line-height: 1.5;
}

.zc-notes__body {
	margin: 0;
	color: var(--zc-ink);
	font-size: 15px;
	line-height: 1.55;
}

.zc-notes__body a,
.zc-faq__a a {
	color: var(--zc-wine);
}

/* Вопросы и ответы: аккордеон на <details>, открыт один ответ. */
.zc-faq__item {
	border-top: 1px solid var(--zc-line);
}

.zc-faq__item:last-child {
	border-bottom: 1px solid var(--zc-line);
}

.zc-faq__q {
	position: relative;
	padding: 14px 32px 14px 0;
	color: var(--zc-ink);
	font: 500 17px/1.35 var(--zc-f-display);
	list-style: none;
	cursor: pointer;
}

.zc-faq__q::-webkit-details-marker {
	display: none;
}

.zc-faq__q::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 6px;
	width: 8px;
	height: 8px;
	margin-top: -6px;
	border-right: 2px solid var(--zc-wine);
	border-bottom: 2px solid var(--zc-wine);
	transform: rotate(45deg);
}

.zc-faq__item[open] .zc-faq__q::after {
	margin-top: -2px;
	transform: rotate(-135deg);
}

.zc-faq__a {
	padding: 0 0 16px;
	color: var(--zc-ink);
	font-size: 15px;
	line-height: 1.55;
}

.zc-picks__tip {
	margin: 16px 0 0;
	padding: 14px 18px;
	border-radius: var(--zc-r-md);
	background: var(--zc-mist);
	color: var(--zc-ink);
	font-size: 15px;
	line-height: 1.5;
}


.zc-fit {
	display: grid;
	grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
	grid-template-areas: "label aside" "main aside";
	/* Вторая строка гибкая: высокая панель справа растягивает её, а не отодвигает основное от карточки. */
	grid-template-rows: auto 1fr;
	gap: 0 32px;
	align-items: start;
}

.zc-fit__label {
	grid-area: label;
}

.zc-fit__main {
	grid-area: main;
}

.zc-fit__aside {
	grid-area: aside;
}

.zc-fit__period {
	display: flex;
	align-items: baseline;
	gap: 12px;
	margin: 0 0 14px;
	font: 500 22px/1.2 var(--zc-f-display);
}

.zc-fit__period-dates {
	color: var(--zc-ink-2);
	font: 400 14px/1.4 var(--zc-f-body);
}

.zc-fit__period {
	flex-wrap: wrap;
}

.zc-panel {
	padding: 22px 24px;
	background: var(--zc-mist);
	border-radius: var(--zc-r-lg);
}

.zc-panel + .zc-panel {
	margin-top: 16px;
}

.zc-panel__title {
	margin: 0 0 14px;
	color: var(--zc-ink);
	font: 500 18px/1.25 var(--zc-f-display);
}

.zc-panel__note {
	margin: 12px 0 0;
	color: var(--zc-ink-2);
	font-size: 13px;
}

.zc-panel--warn {
	background: var(--zc-warn-bg);
	border: 1px solid var(--zc-warn-line);
}

.zc-panel--warn .zc-panel__title {
	color: var(--zc-warn);
}

.zc-facts {
	margin: 0;
	padding: 0;
	list-style: none;
}

.zc-facts__item {
	margin: 0;
	padding: 10px 0;
	border-top: 1px solid rgba(154, 100, 18, 0.18);
	font-size: 15px;
	line-height: 1.5;
	list-style: none;
}

.zc-facts__item:first-child {
	padding-top: 0;
	border-top: 0;
}

.zc-facts__value {
	font: 600 15px var(--zc-f-data);
}

/* ---------- главная: первый экран с выбором машины ---------- */

.zc-hero {
	max-width: 820px;
	padding: 24px 0 8px;
}

.zc-hero__title {
	margin: 0;
	color: var(--zc-ink);
	font: 500 54px/1.05 var(--zc-f-display);
	letter-spacing: -0.02em;
}

.zc-hero__lead {
	max-width: 620px;
	margin: 18px 0 0;
	color: var(--zc-ink-2);
	font-size: 19px;
	line-height: 1.55;
}

.zc-picker {
	margin: 30px 0 0;
	padding: 18px;
	background: var(--zc-mist);
	border-radius: var(--zc-r-lg);
}

.zc-picker__row {
	display: grid;
	/* поколение шире: «SS11 · с 2021» не должно обрезаться */
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.3fr) auto;
	gap: 10px;
}

.zc-picker__field {
	display: flex;
	flex-direction: column;
	gap: 4px;
	min-width: 0;
	padding: 8px 14px;
	background: var(--zc-paper);
	border: 1px solid var(--zc-line);
	border-radius: var(--zc-r-md);
	cursor: pointer;
}

.zc-picker__field:focus-within {
	border-color: var(--zc-ink);
}

.zc-picker__label {
	color: var(--zc-ink-2);
	font: 500 11px/1 var(--zc-f-data);
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.zc-picker__select {
	width: 100%;
	padding: 0;
	border: 0;
	background: transparent;
	color: var(--zc-ink);
	font: 600 16px/1.4 var(--zc-f-body);
	cursor: pointer;
}

.zc-picker__select:focus {
	outline: none;
}

.zc-picker__select:disabled {
	color: var(--zc-ink-2);
	cursor: default;
}

.zc-picker__note {
	margin: 12px 0 0;
	color: var(--zc-ink-2);
	font-size: 14px;
}

.zc-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	min-height: 56px;
	padding: 0 22px;
	border: 0;
	border-radius: var(--zc-r-md);
	background: var(--zc-wine);
	color: #fff;
	font: 600 16px var(--zc-f-body);
	text-decoration: none;
	white-space: nowrap;
	cursor: pointer;
}

.zc-button:hover {
	background: var(--zc-wine-deep);
	color: #fff;
}

/* ---------- рубрика: приглашение в подбор ---------- */

.zc-cta {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	margin: 0 0 28px;
	padding: 18px 22px;
	border: 1.5px solid var(--zc-ink);
	border-radius: var(--zc-r-lg);
}

.zc-cta__text {
	margin: 0;
	color: var(--zc-ink-2);
	font-size: 16px;
	line-height: 1.45;
}

.zc-cta__title {
	display: block;
	margin-bottom: 2px;
	color: var(--zc-ink);
	font: 500 19px/1.25 var(--zc-f-display);
}

/* ---------- блок в конце статьи ---------- */

.zc-article-block {
	margin: 32px 0 8px;
	padding: 18px 22px;
	border: 1.5px solid var(--zc-ink);
	border-radius: var(--zc-r-lg);
}

.zc-article-block__title {
	margin: 0 0 8px;
	color: var(--zc-ink-2);
	font: 500 12px/1.3 var(--zc-f-data);
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.post__entry .zc-article-block__list {
	margin: 0;
	padding: 0;
}

.post__entry .zc-article-block__item {
	margin: 0;
}

.post__entry .zc-article-block__item::before {
	display: none;
}

.zc-article-block__link {
	color: var(--zc-ink);
	font: 500 19px/1.3 var(--zc-f-display);
	text-decoration: none;
}

.zc-article-block__link:hover {
	color: var(--zc-wine);
}

/* ---------- адаптив ---------- */

@media (max-width: 1100px) {
	.zc-fit {
		grid-template-columns: 1fr;
		grid-template-areas: "label" "aside" "main";
		grid-template-rows: auto;
	}

	.zc-fit__aside {
		margin-top: 20px;
	}
}

@media (max-width: 767px) {
	.zc-title {
		font-size: 32px;
	}

	.zc-head--photo,
	.zc-head--compact.zc-head--photo {
		grid-template-columns: 1fr;
		grid-template-areas: "text" "car" "passport";
		grid-template-rows: auto;
		row-gap: 20px;
	}

	.zc-head--photo .zc-passport {
		margin-top: 4px;
	}

	.zc-head--compact .zc-head__text {
		grid-area: text;
	}

	.zc-head--compact .zc-car {
		justify-self: center;
		width: 100%;
		max-width: 420px;
	}


	.zc-hero__title {
		font-size: 38px;
	}

	.zc-picker__row {
		grid-template-columns: 1fr;
	}

	.zc-cta {
		flex-direction: column;
		align-items: flex-start;
	}
}

@media (max-width: 479px) {
	.zc-title {
		font-size: 28px;
	}

	.zc-hero__title {
		font-size: 33px;
	}

	.zc-hero__lead {
		font-size: 17px;
	}

	.zc-label__body {
		padding: 18px 16px 14px;
	}

	.zc-label__row {
		grid-template-columns: 1fr;
		row-gap: 6px;
	}

	.zc-notes__item {
		grid-template-columns: 1fr;
		gap: 4px;
	}

	.zc-label__strip,
	.zc-label__stub {
		padding-left: 16px;
		padding-right: 16px;
	}

	.zc-panel {
		padding: 18px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.zc-tile,
	.zc-picks__summary,
	.zc-picks__summary::after {
		transition: none;
	}
}