

/* Start:/local/templates/vine/css/private-event-page.css?178872591210345*/
/* =========================================================================
   Страница «Частные мероприятия» — общая раскладка и герой.
   Макет Figma Vt6Ey2QE87v6cZvDT0Ilh9, узел 605:11701 «Частное мероприятие»
   (кадр 1280x3976, контент-фрейм 605:11703 шириной 1248).

   Здесь лежит только то, что принадлежит САМОЙ странице: вертикальный ритм
   секций, герой (605:11706 / 2355:19456), надзаголовки-заголовки секций
   и карточка блока «ОФОРМИТЬ ЗАКАЗ» (2368:14946) — та её часть, что вокруг
   формы. Карточки блоков (форматы, преимущества, плашки, шаги, цифры, FAQ)
   рисуют шаблоны компонентов, стили у них свои.

   Ритм макета единый: между всеми блоками ровно 16px. Проверено по
   координатам узлов: герой заканчивается на y=382, надзаголовок ФОРМАТЫ
   на 398; карточки форматов кончаются на 1588, ПРЕИМУЩЕСТВА на 1604;
   плашки кончаются на 2222, «Как мы работаем» на 2238; шаги на 2501,
   цифры на 2517; цифры на 2628, карточка заказа на 2644.
   ========================================================================= */

/* Вся страница — колонка с шагом 16px, поэтому отдельных margin у блоков нет */
.private-page {
	display: flex;
	flex-direction: column;
	gap: var(--vine-gap, 16px);
}

/* Кнопки героя прокручивают страницу к своим секциям (заметки дизайнера
   2368:15391 и 2368:15399). Плавность — на уровне страницы; шапка сайта не
   липкая, поэтому запас сверху нужен только для воздуха. */
.private-page [id] {
	scroll-margin-top: var(--vine-gap, 16px);
}

@media (prefers-reduced-motion: no-preference) {
	html:has(.private-page) {
		scroll-behavior: smooth;
	}
}

/* ====================================================== ГЕРОЙ (2355:19456) */
/* Две колонки по 1fr, зазор 16. В макете 640 + 592, но обе объявлены
   flex: 1 0 0 — то есть равные доли, а не фиксированные ширины. */
.private-hero {
	display: flex;
	gap: var(--vine-gap, 16px);
	align-items: stretch;
}

/* Общая плашка героя: серый #C4C4C4, радиус 24, паддинг 24.
   Серый — фон карточки макета, изображений в герое нет (вопрос владельцу
   в отчёте: не подложка ли это под фотографию). */
.private-hero__plate {
	box-sizing: border-box;
	padding: 24px;
	border-radius: 24px;
	background: var(--vine-color-card, #C4C4C4);
}

/* 2355:19420 — левая плашка 640x350: заголовок сверху, абзац по центру,
   кнопки снизу (justify-content: space-between) */
.private-hero__main {
	display: flex;
	flex: 1 0 0;
	min-width: 0;
	flex-direction: column;
	justify-content: space-between;
	gap: var(--vine-gap, 16px);
}

/* 605:11706 — 48px, три строки с принудительным переносом.
   Двойной селектор нужен, чтобы перебить .vine-main h1 (40px) базового слоя. */
.vine-main .private-hero__title,
.private-hero__title {
	margin: 0;
	font-size: 48px;
	font-weight: 400;
	line-height: normal;
	color: var(--vine-color-text, #000000);
	word-break: break-word;
}

/* «вашего события» в макете серые — выделение начинается со слова «вашего» */
.private-hero__title-dim {
	color: var(--vine-color-line, #777777);
}

.private-hero__text {
	margin: 0;
	font-size: var(--vine-fz-text, 18px);
	line-height: normal;
	color: var(--vine-color-text, #000000);
}

/* 2355:19425 — зазор между кнопками в макете именно 64px (вопрос владельцу:
   не артефакт ли автолэйаута) */
.private-hero__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 64px;
}

/* 2355:19455 — правая колонка: две плашки, зазор 16 */
.private-hero__side {
	display: flex;
	flex: 1 0 0;
	min-width: 0;
	flex-direction: column;
	gap: var(--vine-gap, 16px);
}

/* внутри плашек шаг 16 (2355:19428, 2355:19438) */
.private-hero__plate--stat,
.private-hero__plate--can {
	display: flex;
	flex-direction: column;
	gap: var(--vine-gap, 16px);
}

/* «1-150» и «Что можем» — 34px обычного начертания */
.vine-main .private-hero__plate-title,
.private-hero__plate-title {
	margin: 0;
	font-size: var(--vine-fz-h2, 34px);
	font-weight: 400;
	line-height: normal;
	color: var(--vine-color-text, #000000);
}

.private-hero__plate-text {
	margin: 0;
	font-size: var(--vine-fz-text, 18px);
	line-height: normal;
	color: var(--vine-color-text, #000000);
}

/* 2355:19443 — маркированный список, отступ маркера 27px.
   Селектор двухклассовый намеренно: базовый слой гасит маркеры у любого
   списка с классом (`ul[class] { list-style: none }` в template_styles.css),
   и одного класса не хватает, чтобы это перебить. */
.private-page .private-hero__list {
	margin: 0;
	padding-left: 27px;
	list-style: disc;
	font-size: var(--vine-fz-text, 18px);
	line-height: normal;
	color: var(--vine-color-text, #000000);
}

.private-hero__list li + li {
	margin-top: 0;
}

/* ============================== НАДЗАГОЛОВОК + ЗАГОЛОВОК СЕКЦИИ (паттерн) */
/* Один и тот же паттерн у ФОРМАТЫ/2355:19465, ПРЕИМУЩЕСТВА/2362:14763 и
   ОФОРМИТЬ ЗАКАЗ/2368:14947: надзаголовок 20px #777 (высота строки 23),
   через 16px заголовок 40px чёрный (высота строки 47).
   У «Как мы работаем» (2368:14856) надзаголовка нет — так в макете. */
.private-head {
	display: flex;
	flex-direction: column;
	gap: var(--vine-gap, 16px);
}

.private-head__kicker {
	margin: 0;
	font-size: 20px;
	font-weight: 400;
	line-height: normal;
	color: var(--vine-color-line, #777777);
}

.vine-main .private-head__title,
.private-head__title {
	margin: 0;
	font-size: var(--vine-fz-h1, 40px);
	font-weight: 400;
	line-height: normal;
	color: var(--vine-color-text, #000000);
	word-break: break-word;
}

/* Секция = заголовочный блок + содержимое, тот же шаг 16 */
.private-section {
	display: flex;
	flex-direction: column;
	gap: var(--vine-gap, 16px);
}

/* ========================== КАРТОЧКА «ОФОРМИТЬ ЗАКАЗ» (2368:14946, 1248x547) */
/* Белая карточка, рамка 1px, радиус 16, паддинг 16; внутри две колонки
   с зазором 64: слева текст (2368:15012), справа форма шириной 700
   (2368:15011) — её рисует шаблон form.result.new/private_event_page. */
.private-order {
	box-sizing: border-box;
	display: flex;
	gap: 64px;
	padding: var(--vine-gap, 16px);
	border: 1px solid var(--vine-color-text, #000000);
	border-radius: 16px;
	background: var(--vine-color-bg, #FFFFFF);
}

/* левая колонка тянется, правая (форма) держит макетные 700 */
.private-order__text {
	display: flex;
	flex: 1 1 auto;
	min-width: 0;
	flex-direction: column;
}

/* между надзаголовком и группой «заголовок + абзац + список» в макете 32px */
.private-order__group {
	display: flex;
	flex-direction: column;
	gap: var(--vine-gap-sm, 8px);
	margin-top: 32px;
}

/* «Соберем смету за один день» — 34px, две строки */
.vine-main .private-order__title,
.private-order__title {
	margin: 0;
	font-size: var(--vine-fz-h2, 34px);
	font-weight: 400;
	line-height: normal;
	color: var(--vine-color-text, #000000);
}

.private-order__lead {
	margin: 0;
	font-size: var(--vine-fz-text, 18px);
	line-height: normal;
}

/* маркеры, как и в герое, приходится возвращать двухклассовым селектором */
.private-page .private-order__list {
	margin: 0;
	padding-left: 27px;
	list-style: disc;
	font-size: var(--vine-fz-text, 18px);
	line-height: normal;
}

.private-order__form {
	flex: 0 0 700px;
	max-width: 100%;
	min-width: 0;
}

/* ============================================================ FAQ (2368:15100) */
/* Шаблон news.list/faq-accordion переиспользован как есть; в его макете
   заголовок 40px, а здесь 48px — подгоняем только кегль. */
.private-page .faq .faq__title {
	font-size: 48px;
}

/* ================================================================= АДАПТИВ */
@media (max-width: 1024px) {
	.vine-main .private-hero__title,
	.private-hero__title {
		font-size: 38px;
	}

	.private-page .faq .faq__title {
		font-size: 38px;
	}

	/* 64px между кнопками на узком экране только рвут строку */
	.private-hero__actions {
		gap: var(--vine-gap, 16px);
	}

	.private-order {
		gap: 32px;
	}

	.private-order__form {
		flex: 1 1 380px;
	}
}

@media (max-width: 900px) {
	.private-hero {
		flex-direction: column;
	}

	.private-order {
		flex-direction: column;
		gap: var(--vine-gap, 16px);
	}

	.private-order__form {
		flex: 1 1 auto;
	}
}

@media (max-width: 640px) {
	.vine-main .private-hero__title,
	.private-hero__title {
		font-size: 30px;
	}

	.private-page .faq .faq__title {
		font-size: 30px;
	}

	.private-hero__plate {
		padding: var(--vine-gap, 16px);
	}
}

/* End */


/* Start:/local/templates/vine/components/bitrix/news.list/faq-accordion/style.css?17867178372833*/
/* =========================================================================
   Часто задаваемые вопросы — bitrix:news.list / faq-accordion
   Макет Figma HA2Vx4dnWPRDdb6SL7tM3y, узел 1894:8503 (1248×356).

   Из макета: заголовок 40px; вопрос 18px, цвет #0077FF, подчёркивание
   пунктирное; ответ 18px, цвет #000000; шаг между вопросами 16px,
   от вопроса до ответа 8px; иконок-переключателей нет.
   Пунктир, сброс кнопки и цвет ссылки берём из общего слоя
   (.vine-pseudo-link / .vine-pseudo-link--link в template_styles.css).
   ========================================================================= */

.faq {
	display: flex;
	flex-direction: column;
	gap: var(--vine-gap, 16px);
}

/* двойной класс — перебить .vine-main h2 (34px) из базового слоя */
.faq .faq__title {
	margin: 0;
	font-size: var(--vine-fz-h1, 40px);
	font-weight: 400;
	line-height: normal;
	color: var(--vine-color-text, #000000);
	word-break: break-word;
}

.faq__list {
	display: flex;
	flex-direction: column;
	gap: var(--vine-gap, 16px);
}

.faq__item {
	margin: 0;
}

/* -------------------------------------------------------------- ВОПРОС */
/* Сброс кнопки и пунктир уже в .vine-pseudo-link; здесь только кегль,
   перенос длинных вопросов и зона клика по всей строке. */
.faq .faq__question {
	display: inline;
	font-size: var(--vine-fz-text, 18px);
	font-weight: 400;
	line-height: normal;
	word-break: break-word;
}

/* Вопрос без ответа: цвет и кегль как в макете, но без пунктира и без
   курсора-руки — раскрывать нечего, обещать интерактив нельзя. */
.faq .faq__question--plain {
	display: block;
	margin: 0;
	color: var(--vine-color-link, #0077FF);
	text-decoration: none;
	cursor: auto;
}

/* фокус с клавиатуры виден — в макете состояний фокуса нет,
   поэтому берём системную рамку, а не свой цвет */
.faq .faq__question[data-faq-toggle]:focus-visible {
	outline: 2px solid var(--vine-color-text, #000000);
	outline-offset: 2px;
}

/* -------------------------------------------------------------- ОТВЕТ */
.faq__answer {
	margin: var(--vine-gap-sm, 8px) 0 0;
	font-size: var(--vine-fz-text, 18px);
	font-weight: 400;
	line-height: normal;
	color: var(--vine-color-text, #000000);
	word-break: break-word;
}

.faq__answer p {
	margin: 0 0 var(--vine-gap-sm, 8px);
}

.faq__answer p:last-child {
	margin-bottom: 0;
}

/* End */


/* Start:/local/templates/vine/components/bitrix/news.list/private_formats_grid/style.css?17887247585023*/
/* =========================================================================
   Карточки-форматы «Выберите настроение вечера»
   bitrix:news.list / private_formats_grid
   Макет Figma Vt6Ey2QE87v6cZvDT0Ilh9, узел 605:11701, ряды 2355:19493,
   2355:19498, 2355:19521, 2355:19542.

   Из макета: карточка — белый фон, рамка 1px #000, радиус 16, паддинг 16,
   высота 260, вертикальный flex с justify-content: space-between
   (категория сверху, «название + описание» по центру с зазором 8,
   нижняя строка прижата к низу); зазор между карточками 16.
   Типографика: категория 20px #777, название 34px, описание 18px,
   нижняя строка 14px Bold. Фотографий в секции нет вовсе.
   ========================================================================= */

/* Один контейнер с переносом вместо четырёх фреймов-рядов макета.
   Ширины из CARD_WIDTH дают ровно макетные суммы (748+16+484 = 1248 и
   600+16+632 = 1248), поэтому переносы встают там же, где ряды макета,
   а третий и четвёртый ряды остаются недобитыми — как в макете. */
.private-formats-grid {
	display: flex;
	flex-wrap: wrap;
	gap: var(--vine-gap, 16px);
	align-items: stretch;
}

.private-format-card {
	box-sizing: border-box;
	display: flex;
	/* не растём: в макете ряды 3 и 4 намеренно не добиты до 1248 */
	flex: 0 1 var(--private-card-w, 300px);
	min-width: 0;
	max-width: 100%;
	min-height: 260px;
	flex-direction: column;
	justify-content: space-between;
	gap: var(--vine-gap, 16px);
	padding: var(--vine-gap, 16px);
	border: 1px solid var(--vine-color-text, #000000);
	border-radius: 16px;
	background: var(--vine-color-bg, #FFFFFF);
}

/* категория: 20px, #777 */
.private-format-card__kicker {
	margin: 0;
	font-size: 20px;
	font-weight: 400;
	line-height: normal;
	color: var(--vine-color-line, #777777);
}

/* «название + описание» — средняя группа, зазор 8 */
.private-format-card__body {
	display: flex;
	flex-direction: column;
	gap: var(--vine-gap-sm, 8px);
}

/* Двойной селектор намеренно: общее правило «.vine-h3, .vine-main h3»
   специфичнее одного класса и сажает заголовок карточки с макетных 34px. */
.vine-main .private-format-card__title,
.private-format-card__title {
	margin: 0;
	font-size: var(--vine-fz-h2, 34px);
	font-weight: 400;
	line-height: normal;
	color: var(--vine-color-text, #000000);
	word-break: break-word;
}

.private-format-card__text {
	font-size: var(--vine-fz-text, 18px);
	line-height: normal;
	color: var(--vine-color-text, #000000);
}

.private-format-card__text p {
	margin: 0 0 var(--vine-gap-sm, 8px);
}

.private-format-card__text p:last-child {
	margin-bottom: 0;
}

/* нижняя строка: слева текст, справа кнопка, выравнивание по низу */
.private-format-card__foot {
	display: flex;
	gap: var(--vine-gap, 16px);
	align-items: flex-end;
	justify-content: space-between;
}

/* 14px Bold — единственное жирное начертание в карточке */
.private-format-card__meta {
	margin: 0;
	font-size: var(--vine-fz-small, 14px);
	font-weight: 700;
	line-height: normal;
	color: var(--vine-color-text, #000000);
}

/* кнопка-иконка 32x32: белая, рамка 1px, радиус 5, внутри стрелка 24x24 */
.private-format-card__arrow {
	display: inline-flex;
	flex: 0 0 auto;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border: 1px solid var(--vine-color-text, #000000);
	border-radius: var(--vine-radius-btn, 5px);
	background: var(--vine-color-bg, #FFFFFF);
	text-decoration: none;
}

.private-format-card__arrow img {
	display: block;
	width: 24px;
	height: 24px;
}

/* Адрес не задан: элемент макета показан, но интерактива не обещает —
   ни курсора-руки, ни фокуса, ни перехода. */
.private-format-card__arrow--off {
	cursor: default;
}

/* ================================================================= АДАПТИВ */
@media (max-width: 1024px) {
	/* макетные ширины перестают помещаться парами — раскладываем по две
	   равные, а ширину из CARD_WIDTH используем только как ориентир */
	.private-format-card {
		flex: 1 1 320px;
	}
}

@media (max-width: 640px) {
	.private-format-card {
		flex: 1 1 100%;
		min-height: 0;
	}
}

/* End */


/* Start:/local/templates/vine/components/bitrix/catalog.section/events-card/style.css?17920085053920*/
/* Карточка мероприятия — макет, узел 1675:17854 */
.events {
    --events-text: #000000;
    --events-link: #0077FF;
    --events-card-bg: #C4C4C4;
    --events-badge-bg: #FFFF00;
    font-family: "Roboto", system-ui, sans-serif;
    color: var(--events-text);
}

.events__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.events__item {
    display: flex;
    min-width: 0;
}

.events-card {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    gap: 16px;
    min-width: 0;
    box-sizing: border-box;
    padding: 8px;
    border-radius: 8px;
    background: var(--events-card-bg);
}

.events-card__title {
    margin: 0;
    font-size: 28px;
    font-weight: 700;
    line-height: normal;
    word-break: break-word;
}

.events-card__title-link {
    color: var(--events-text);
    text-decoration: none;
}

.events-card__title-link:hover {
    text-decoration: underline;
}

/* Картинка сверху во всю ширину карточки */
.events-card__media {
    display: flex;
    justify-content: center;
    width: 100%;
}

.events-card__media .events-card__pic {
    width: 389px;
    max-width: 100%;
    height: 110px;
}

/* Ряд «картинка слева 128x128 + мета» */
.events-card__row {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    width: 100%;
}

.events-card__thumb {
    flex: 0 0 128px;
    width: 128px;
    height: 128px;
    overflow: hidden;
}

.events-card__thumb .events-card__pic {
    width: 128px;
    height: 128px;
}

.events-card__pic {
    display: block;
    object-fit: cover;
}

.events-card__meta {
    display: flex;
    flex: 1 1 0;
    flex-direction: column;
    gap: 8px;
    min-width: 0;
}

.events-card__priceline {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    width: 100%;
}

.events-card__price {
    font-size: 16px;
    font-weight: 700;
    line-height: normal;
    white-space: nowrap;
}

/* Пометки карточки одной группой справа от цены: «новинка» и тег города
   (задача SHKOLA_VINA_AST-109). Без группы строка с тремя элементами
   растащила бы их по краям. */
.events-card__tags {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.events-card__badge {
    padding: 4px;
    border: 1px solid var(--events-text);
    border-radius: 4px;
    background: var(--events-badge-bg);
    font-size: 14px;
    font-style: italic;
    line-height: normal;
    white-space: nowrap;
}

/* Тег города: тот же чип, но без жёлтой заливки и без курсива. */
.events-card__city {
    padding: 4px;
    border: 1px solid var(--events-text);
    border-radius: 4px;
    font-size: 14px;
    line-height: normal;
    white-space: nowrap;
}

.events-card__date,
.events-card__address,
.events-card__announce {
    font-size: 18px;
    line-height: normal;
    word-break: break-word;
}

.events-card__announce p {
    margin: 0;
}

.events-card__more {
    align-self: flex-start;
    font-size: 18px;
    line-height: normal;
    color: var(--events-link);
    text-decoration: underline;
}

/* «Показать ещё» (143×40) — прижата к левому краю, отступ от сетки 16px, как
   у такой же кнопки партнёрской страницы. Габариты даёт .vine-more. */
.events__pager {
    display: flex;
    margin-top: 16px;
}

@media (max-width: 767px) {
    .events__grid {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 479px) {
    .events-card__row {
        flex-direction: column;
    }

    .events-card__thumb {
        flex: 0 0 auto;
    }
}

/* End */


/* Start:/local/templates/vine/components/bitrix/news.list/private_advantages/style.css?17887248362645*/
/* =========================================================================
   Четыре карточки «Идеальный вечер начинается здесь»
   bitrix:news.list / private_advantages
   Макет Figma Vt6Ey2QE87v6cZvDT0Ilh9, узел 2364:14767 (1248x240, y=1706).

   Из макета: ряд из 4 равных колонок по 300px, зазор 16, высота карточки 240;
   карточка — белый фон, рамка 1px #000, радиус 16, паддинг 16;
   внутри justify-content: space-between (номер сверху, текст снизу,
   заголовок посередине). Номер 34px обычного начертания, заголовок 28px Bold,
   текст 18px.
   ========================================================================= */

.private-advantages {
	display: flex;
	flex-wrap: wrap;
	gap: var(--vine-gap, 16px);
	align-items: stretch;
}

.private-advantage {
	box-sizing: border-box;
	display: flex;
	/* четыре равные колонки: 1248 = 4x300 + 3x16 */
	flex: 1 1 300px;
	min-width: 0;
	min-height: 240px;
	flex-direction: column;
	justify-content: space-between;
	gap: var(--vine-gap, 16px);
	padding: var(--vine-gap, 16px);
	border: 1px solid var(--vine-color-text, #000000);
	border-radius: 16px;
	background: var(--vine-color-bg, #FFFFFF);
}

/* номер «01»…«04»: 34px, начертание обычное (в макете НЕ жирный) */
.private-advantage__num {
	margin: 0;
	font-size: var(--vine-fz-h2, 34px);
	font-weight: 400;
	line-height: normal;
	color: var(--vine-color-text, #000000);
}

/* Двойной селектор намеренно: общее правило «.vine-h3, .vine-main h3»
   специфичнее одного класса и сбивает начертание заголовка карточки. */
.vine-main .private-advantage__title,
.private-advantage__title {
	margin: 0;
	font-size: var(--vine-fz-h3, 28px);
	font-weight: 700;
	line-height: normal;
	color: var(--vine-color-text, #000000);
	word-break: break-word;
}

.private-advantage__text {
	font-size: var(--vine-fz-text, 18px);
	line-height: normal;
	color: var(--vine-color-text, #000000);
}

.private-advantage__text p {
	margin: 0 0 var(--vine-gap-sm, 8px);
}

.private-advantage__text p:last-child {
	margin-bottom: 0;
}

/* ================================================================= АДАПТИВ */
@media (max-width: 1024px) {
	.private-advantage {
		flex: 1 1 260px;
	}
}

@media (max-width: 640px) {
	.private-advantage {
		flex: 1 1 100%;
		min-height: 0;
	}
}

/* End */


/* Start:/local/templates/vine/components/bitrix/news.list/private_cta/style.css?17887248833204*/
/* =========================================================================
   Две плашки с кнопками под преимуществами
   bitrix:news.list / private_cta
   Макет Figma Vt6Ey2QE87v6cZvDT0Ilh9, узел 2368:14821 (1248x260, y=1962).

   Из макета: обе плашки высотой 260, белый фон, рамка 1px #000, радиус 16,
   паддинг 16; внутри justify-content: space-between — надпись сверху,
   группа «заголовок + текст» (зазор 8) по центру, кнопка снизу.
   Левая плашка ровно 700px, правая занимает остаток (532).
   Надпись 20px #777, заголовок 34px обычного начертания, текст 18px.
   ========================================================================= */

.private-cta {
	display: flex;
	flex-wrap: wrap;
	gap: var(--vine-gap, 16px);
	align-items: stretch;
}

.private-cta__card {
	box-sizing: border-box;
	display: flex;
	/* правая плашка тянется на остаток строки */
	flex: 1 1 400px;
	min-width: 0;
	min-height: 260px;
	flex-direction: column;
	justify-content: space-between;
	gap: var(--vine-gap, 16px);
	padding: var(--vine-gap, 16px);
	border: 1px solid var(--vine-color-text, #000000);
	border-radius: 16px;
	background: var(--vine-color-bg, #FFFFFF);
}

/* Левая плашка в макете зафиксирована на 700px. Ширина задана порядком,
   а не данными: свойства CARD_WIDTH у элементов раздела private-cta нет. */
.private-cta__card:first-child {
	flex: 0 1 700px;
}

.private-cta__kicker {
	margin: 0;
	font-size: 20px;
	font-weight: 400;
	line-height: normal;
	color: var(--vine-color-line, #777777);
}

.private-cta__body {
	display: flex;
	flex-direction: column;
	gap: var(--vine-gap-sm, 8px);
}

/* Двойной селектор намеренно: перебиваем «.vine-h3, .vine-main h3» (28px),
   в макете заголовок плашки 34px и НЕ жирный. */
.vine-main .private-cta__title,
.private-cta__title {
	margin: 0;
	font-size: var(--vine-fz-h2, 34px);
	font-weight: 400;
	line-height: normal;
	color: var(--vine-color-text, #000000);
	word-break: break-word;
}

.private-cta__text {
	font-size: var(--vine-fz-text, 18px);
	line-height: normal;
	color: var(--vine-color-text, #000000);
}

.private-cta__text p {
	margin: 0 0 var(--vine-gap-sm, 8px);
}

.private-cta__text p:last-child {
	margin-bottom: 0;
}

.private-cta__actions {
	display: flex;
}

/* кнопка макета: белая, рамка 1px, радиус 5, паддинг 9/12/10, высота 40 */
.private-cta__btn {
	min-height: 40px;
}

/* адрес не задан — кнопка есть, перехода нет и курсор-рука не обещается */
.private-cta__btn--off {
	cursor: default;
}

/* ================================================================= АДАПТИВ */
@media (max-width: 900px) {
	.private-cta__card,
	.private-cta__card:first-child {
		flex: 1 1 100%;
		min-height: 0;
	}
}

/* End */


/* Start:/local/templates/vine/components/bitrix/news.list/private_steps/style.css?17887249332982*/
/* =========================================================================
   Четыре шага «Как мы работаем»
   bitrix:news.list / private_steps
   Макет Figma Vt6Ey2QE87v6cZvDT0Ilh9, узел 2368:14857 (y=2301).

   Из макета: 4 равные колонки по 300px, зазор 16; карточки выровнены по
   ВЕРХНЕМУ краю и имеют нарастающую слева направо высоту 155/170/185/200
   (лесенка); карточка — белый фон, рамка 1px #000, радиус 16, паддинг 16,
   внутри justify-content: space-between. Надпись «ШАГ N» 20px #777,
   заголовок 28px Bold, текст 18px.
   ========================================================================= */

.private-steps {
	display: flex;
	flex-wrap: wrap;
	gap: var(--vine-gap, 16px);
	/* лесенка держится только при выравнивании по верху */
	align-items: flex-start;
	/* это <ol>: снимаем нумерацию и отступ списка, номер шага рисует SUBTITLE */
	margin: 0;
	padding: 0;
	list-style: none;
}

.private-step {
	box-sizing: border-box;
	display: flex;
	flex: 1 1 300px;
	min-width: 0;
	flex-direction: column;
	justify-content: space-between;
	gap: var(--vine-gap-sm, 8px);
	padding: var(--vine-gap, 16px);
	border: 1px solid var(--vine-color-text, #000000);
	border-radius: 16px;
	background: var(--vine-color-bg, #FFFFFF);
}

/* лесенка из макета: 155 / 170 / 185 / 200 */
.private-step:nth-child(1) { min-height: 155px; }
.private-step:nth-child(2) { min-height: 170px; }
.private-step:nth-child(3) { min-height: 185px; }
.private-step:nth-child(4) { min-height: 200px; }

.private-step__kicker {
	margin: 0;
	font-size: 20px;
	font-weight: 400;
	line-height: normal;
	color: var(--vine-color-line, #777777);
}

/* Двойной селектор намеренно: перебиваем «.vine-h3, .vine-main h3». */
.vine-main .private-step__title,
.private-step__title {
	margin: 0;
	font-size: var(--vine-fz-h3, 28px);
	font-weight: 700;
	line-height: normal;
	color: var(--vine-color-text, #000000);
	word-break: break-word;
}

.private-step__text {
	font-size: var(--vine-fz-text, 18px);
	line-height: normal;
	color: var(--vine-color-text, #000000);
}

.private-step__text p {
	margin: 0 0 var(--vine-gap-sm, 8px);
}

.private-step__text p:last-child {
	margin-bottom: 0;
}

/* ================================================================= АДАПТИВ */
@media (max-width: 1024px) {
	.private-step {
		flex: 1 1 260px;
	}
}

@media (max-width: 640px) {
	.private-step,
	.private-step:nth-child(1),
	.private-step:nth-child(2),
	.private-step:nth-child(3),
	.private-step:nth-child(4) {
		flex: 1 1 100%;
		/* на одной колонке лесенка превращается в разнобой пустоты */
		min-height: 0;
	}
}

/* End */


/* Start:/local/templates/vine/components/bitrix/news.list/private_numbers/style.css?17887249841898*/
/* =========================================================================
   Полоса цифр под шагами
   bitrix:news.list / private_numbers
   Макет Figma Vt6Ey2QE87v6cZvDT0Ilh9, узел 2368:14895 (1248x111, y=2517).

   Из макета: 4 равные карточки по 300px, высота 111, зазор 16;
   карточка — белый фон, рамка 1px #000, радиус 16, паддинг 16;
   внутри колонка с зазором 16: значение 34px Bold сверху, подпись 18px снизу.
   ========================================================================= */

.private-numbers {
	display: flex;
	flex-wrap: wrap;
	gap: var(--vine-gap, 16px);
	align-items: stretch;
	/* это <dl>: снимаем браузерные отступы описательного списка */
	margin: 0;
}

.private-number {
	box-sizing: border-box;
	display: flex;
	flex: 1 1 300px;
	min-width: 0;
	min-height: 111px;
	flex-direction: column;
	gap: var(--vine-gap, 16px);
	padding: var(--vine-gap, 16px);
	border: 1px solid var(--vine-color-text, #000000);
	border-radius: 16px;
	background: var(--vine-color-bg, #FFFFFF);
}

/* значение: 34px, в этой полосе — жирное (в отличие от «01» преимуществ) */
.private-number__value {
	margin: 0;
	font-size: var(--vine-fz-h2, 34px);
	font-weight: 700;
	line-height: normal;
	color: var(--vine-color-text, #000000);
}

.private-number__caption {
	margin: 0;
	font-size: var(--vine-fz-text, 18px);
	font-weight: 400;
	line-height: normal;
	color: var(--vine-color-text, #000000);
}

/* ================================================================= АДАПТИВ */
@media (max-width: 1024px) {
	.private-number {
		flex: 1 1 260px;
	}
}

@media (max-width: 640px) {
	.private-number {
		flex: 1 1 100%;
		min-height: 0;
	}
}

/* End */


/* Start:/local/templates/vine/components/bitrix/form.result.new/private_event_page/style.css?17887250358047*/
/* =========================================================================
   Форма «Соберем смету за один день» (блок «ОФОРМИТЬ ЗАКАЗ»)
   bitrix:form.result.new / private_event_page
   Макет Figma Vt6Ey2QE87v6cZvDT0Ilh9, узел 2368:15011 (700x513).

   Раскладка макета — одна колонка с шагом 16px, где строкой может быть как
   ряд полей, так и строка ошибки. Проверено по координатам узлов:
   ряд 1 (y=0, h32) → ошибка «имя» (48) → ошибка «email» (85) → ряд 2 (122)
   → ошибки города/даты/гостей (170, 207, 244) → список форматов (281)
   → комментарий (329, h128) → кнопка (473, h40). Везде ровно 16.

   Ширины в макете: ряд 1 — 342 + 342; ряд 2 — 266,5 + 262,5 + счётчик 139;
   список форматов и комментарий во всю ширину 700.
   Поля: высота 32, рамка 1px #000, без скругления, плейсхолдеры #C4C4C4.
   Ошибки: красные, 18px, отдельными строками.
   Кнопка: чёрная #151515, радиус 5, 165x40, подпись «Оформить заказ».
   ========================================================================= */

.private-form {
	display: flex;
	flex-direction: column;
	gap: var(--vine-gap, 16px);
	font-family: var(--vine-font);
	font-size: var(--vine-fz-text, 18px);
	line-height: 21px;
	color: var(--vine-color-text, #000000);
}

/* Компонент оборачивает поля в <form>; чтобы шаг строк 16px сохранился,
   форма сама перестаёт быть блоком-контейнером. */
.private-form form {
	display: contents;
}

/* ---------------------------------------------------------------- СТРОКИ */
.private-form__row {
	display: flex;
	flex-wrap: wrap;
	gap: var(--vine-gap, 16px);
	align-items: flex-start;
}

.private-form__cell {
	display: flex;
	min-width: 0;
	flex-direction: column;
}

/* ряд 1: две равные половины (342 + 342) */
.private-form__cell--name,
.private-form__cell--contact {
	flex: 1 1 0;
}

/* ряд 2: город и дата делят остаток, счётчик держит макетные 139 */
.private-form__cell--city,
.private-form__cell--date {
	flex: 1 1 0;
}

.private-form__cell--guests {
	flex: 0 0 139px;
}

/* ----------------------------------------------------------------- ПОЛЯ */
.private-form__input {
	box-sizing: border-box;
	width: 100%;
	height: 32px;
	padding: 0 8px;
	border: 1px solid var(--vine-color-text, #000000);
	border-radius: 0;
	background: var(--vine-color-bg, #FFFFFF);
	font-family: var(--vine-font);
	font-size: var(--vine-fz-text, 18px);
	line-height: 21px;
	color: var(--vine-color-text, #000000);
}

/* плейсхолдеры макета — #C4C4C4 */
.private-form__input::placeholder {
	color: var(--vine-color-card, #C4C4C4);
	opacity: 1;
}

/* комментарий 700x128, внутренний отступ 8/5 */
.private-form__textarea {
	height: 128px;
	padding: 5px 8px;
	resize: vertical;
}

/* ------------------------------------------------------ ВЫПАДАЮЩИЕ СПИСКИ */
.private-form__select-wrap {
	position: relative;
	width: 100%;
}

/* Своя стрелка-треугольник из макета, системная снимается.
   У поля «Город» в макете стрелки нет (там нарисован свободный ввод), но
   поле формы — список Москва / Санкт-Петербург, и список обязан выглядеть
   списком. Расхождение вынесено вопросом владельцу. */
.private-form__select {
	padding-right: 36px;
	-webkit-appearance: none;
	appearance: none;
	background-image: url(/local/templates/vine/components/bitrix/form.result.new/private_event_page/images/icon-select-arrow.svg);
	background-repeat: no-repeat;
	background-position: right 4px center;
	background-size: 24px 24px;
}

/* пустой первый вариант играет роль плейсхолдера — красим как плейсхолдер */
.private-form__select:has(option[value=""]:checked) {
	color: var(--vine-color-card, #C4C4C4);
}

.private-form__select option {
	color: var(--vine-color-text, #000000);
}

/* --------------------------------------------------------------- ДАТА */
.private-form__date {
	position: relative;
	width: 100%;
}

.private-form__input--date {
	padding-right: 32px;
}

/* иконка календаря 24x24 у правого края поля — это кнопка,
   по ней открывается штатный календарь ядра (js/date-picker.js) */
.private-form__date-btn {
	position: absolute;
	top: 50%;
	right: 4px;
	width: 24px;
	height: 24px;
	margin-top: -12px;
	padding: 0;
	border: 0;
	background: none;
	line-height: 0;
	cursor: pointer;
}

.private-form__date-btn img {
	display: block;
	width: 24px;
	height: 24px;
	pointer-events: none;
}

/* ------------------------------------------------- СЧЁТЧИК ГОСТЕЙ (139x32) */
/* Классы .vine-counter общие с модалкой дегустации, но её style.css на этой
   странице не подключается — правила продублированы здесь и заужены на
   .private-form, чтобы два шаблона не спорили, если окажутся на одной
   странице. Из макета: кнопки «−» и «+» на чёрном #151515 по краям,
   поле между ними, скругление 5 только по внешним углам. */
.private-form .vine-counter {
	display: flex;
	align-items: stretch;
	width: 100%;
	height: 32px;
}

.private-form .vine-counter__btn {
	display: inline-flex;
	flex: 0 0 37px;
	align-items: center;
	justify-content: center;
	padding: 0;
	border: 1px solid var(--vine-color-text, #000000);
	background: var(--vine-color-btn, #151515);
	color: var(--vine-color-btn-text, #FFFFFF);
	font-family: var(--vine-font);
	font-weight: 700;
	line-height: 1;
	cursor: pointer;
}

.private-form .vine-counter__btn--minus {
	border-radius: var(--vine-radius-btn, 5px) 0 0 var(--vine-radius-btn, 5px);
	font-size: 32px;
}

.private-form .vine-counter__btn--plus {
	border-radius: 0 var(--vine-radius-btn, 5px) var(--vine-radius-btn, 5px) 0;
	font-size: 24px;
}

.private-form .vine-counter__value {
	box-sizing: border-box;
	flex: 1 1 auto;
	min-width: 0;
	padding: 0 4px;
	border: 1px solid var(--vine-color-text, #000000);
	border-left: 0;
	border-right: 0;
	border-radius: 0;
	background: var(--vine-color-bg, #FFFFFF);
	font-family: var(--vine-font);
	font-size: var(--vine-fz-text, 18px);
	line-height: 21px;
	text-align: center;
	color: var(--vine-color-text, #000000);
}

.private-form .vine-counter__value::placeholder {
	color: var(--vine-color-card, #C4C4C4);
	opacity: 1;
}

/* -------------------------------------------------------------- ОШИБКИ */
.private-form__error {
	margin: 0;
	color: #FF0000;
	font-size: var(--vine-fz-text, 18px);
	line-height: 21px;
}

.private-form__error[hidden] {
	display: none;
}

/* -------------------------------------------------------------- КНОПКА */
.private-form__actions {
	display: flex;
}

.private-form__submit {
	min-height: 40px;
}

/* ------------------------------------------------------------- «СПАСИБО» */
.private-form__done {
	margin: 0;
	font-size: var(--vine-fz-text, 18px);
	line-height: normal;
}

/* ------------------------------------------------------------- АДАПТИВ */
@media (max-width: 640px) {
	.private-form__cell--name,
	.private-form__cell--contact,
	.private-form__cell--city,
	.private-form__cell--date,
	.private-form__cell--guests {
		flex: 1 1 100%;
	}
}

/* End */
/* /local/templates/vine/css/private-event-page.css?178872591210345 */
/* /local/templates/vine/components/bitrix/news.list/faq-accordion/style.css?17867178372833 */
/* /local/templates/vine/components/bitrix/news.list/private_formats_grid/style.css?17887247585023 */
/* /local/templates/vine/components/bitrix/catalog.section/events-card/style.css?17920085053920 */
/* /local/templates/vine/components/bitrix/news.list/private_advantages/style.css?17887248362645 */
/* /local/templates/vine/components/bitrix/news.list/private_cta/style.css?17887248833204 */
/* /local/templates/vine/components/bitrix/news.list/private_steps/style.css?17887249332982 */
/* /local/templates/vine/components/bitrix/news.list/private_numbers/style.css?17887249841898 */
/* /local/templates/vine/components/bitrix/form.result.new/private_event_page/style.css?17887250358047 */
