

/* Start:/local/templates/vine/css/main-page.css?17864816041789*/
/* Раскладка главной страницы (макет Figma HA2Vx4dnWPRDdb6SL7tM3y, фрейм 493:13148).
   Только сетка и вертикальный ритм самой страницы — оформление блоков живёт
   в style.css соответствующих шаблонов компонентов, базовый слой — в template_styles.css. */

/* Разделитель секций.
   В template_styles.css правило `.vine-main hr` (специфичность выше, чем у
   `.vine-divider`) перекрашивает всю полосу в #777 и оставляет от неё 1px.
   Возвращаем задуманный макетом блок: 16px высотой, линия 1px по центру,
   и по 16px воздуха сверху и снизу (16 + 16 + 16 между блоками). */
.vine-main hr.vine-divider {
	height: 16px;
	margin: var(--vine-gap, 16px) 0;
	padding: 8px 0;
	border: 0;
	background: none;
}

/* шаг между блоками внутри секции — 16px, как в макете */
.main-page__block {
	margin: 0 0 var(--vine-gap, 16px);
}

.main-page__block:last-child {
	margin-bottom: 0;
}

/* ряд «Дегустации и семинары»: лента карточек 1005px + промо-плитка 227px,
   зазор 16px (узел макета 1289:13127 — 1005 + 16 + 227 = 1248) */
.main-page__deg-row {
	display: flex;
	align-items: flex-start;
	gap: var(--vine-gap, 16px);
}

.main-page__deg-row > .events {
	flex: 1 1 auto;
	min-width: 0;
}

.main-page__deg-row > .promo-tiles {
	flex: 0 0 auto;
}

@media (max-width: 1023px) {
	.main-page__deg-row {
		flex-wrap: wrap;
	}

	.main-page__deg-row > .events {
		flex: 1 1 100%;
	}
}

/* End */


/* Start:/local/templates/vine/components/bitrix/news.list/main-banner/style.css?17865334953567*/
/* Главный баннер-слайдер. Макет Figma 493:13153 (1248x524) */
.main-banner {
	position: relative;
	width: 100%;
	max-width: 1248px;
	margin: 0 auto;
	aspect-ratio: 405 / 170;
	overflow: hidden;
}

.main-banner__slides {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	/* вертикальная прокрутка страницы остаётся за браузером, горизонталь — за свайпом */
	touch-action: pan-y;
}

/* Слайды лежат стопкой: высота баннера задана пропорцией 1248x524 и не зависит
   от длины текста конкретного слайда — смена происходит без дёрганья высоты. */
.main-banner__slide {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	opacity: 0;
	visibility: hidden;
	/* visibility снимается только после того, как затухание закончилось */
	transition: opacity .4s ease, visibility 0s linear .4s;
}

.main-banner__slide--active {
	opacity: 1;
	visibility: visible;
	transition: opacity .4s ease, visibility 0s linear 0s;
}

@media (prefers-reduced-motion: reduce) {
	.main-banner__slide,
	.main-banner__slide--active {
		transition: none;
	}
}

.main-banner__image-link {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	display: block;
}

.main-banner__image {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.main-banner__panel {
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: 8px 16px 16px;
	background: rgba(255, 255, 255, .8);
}

/* место под точки переключения */
.main-banner--slider .main-banner__panel {
	padding-bottom: 42px;
}

.main-banner__title {
	margin: 0;
	font-size: 24px;
	font-weight: 400;
	line-height: normal;
}

.main-banner__title-link {
	color: #000;
	text-decoration: none;
}

.main-banner__title-link:hover {
	text-decoration: underline;
}

.main-banner__tags {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
}

.main-banner__tag {
	font-size: 14px;
	font-style: italic;
	line-height: normal;
	color: #000;
}

.main-banner__tag--new {
	padding: 4px;
	border: 1px solid #000;
	border-radius: 4px;
	background: #FFFF00;
}

.main-banner__desc {
	margin: 0;
	font-size: 18px;
	line-height: normal;
}

.main-banner__link {
	align-self: flex-start;
	font-size: 18px;
	color: #0077FF;
	text-decoration: underline;
}

.main-banner__dots {
	position: absolute;
	right: 0;
	bottom: 16px;
	left: 0;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
}

/* В макете точки нарисованы текстом «О о о» (Roboto Bold 24px): активный слайд —
   крупная буква «О» (~18px), остальные — строчные «о» (~13px), чёрный контур без заливки. */
.main-banner__dot {
	flex-shrink: 0;
	width: 13px;
	height: 13px;
	padding: 0;
	border: 2px solid #000;
	border-radius: 50%;
	background: none;
	-webkit-appearance: none;
	appearance: none;
	cursor: pointer;
	transition: width .2s ease, height .2s ease;
}

.main-banner__dot--active {
	width: 18px;
	height: 18px;
}

.main-banner__dot:hover {
	background: rgba(0, 0, 0, .25);
}

.main-banner__dot:focus-visible {
	outline: 2px solid #0077FF;
	outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
	.main-banner__dot {
		transition: none;
	}
}

/* End */


/* Start:/local/templates/vine/components/bitrix/catalog.section/events-card/style.css?17864796352943*/
/* Карточка мероприятия — макет, узел 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;
}

.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__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;
}

@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/promo-tile/style.css?1786479950915*/
/* Узкая промо-плитка «Все дегустации». Макет Figma 1289:13154 (227x342, картинка 211x277) */
.promo-tiles {
	display: flex;
	gap: 16px;
}

.promo-tile {
	display: flex;
	flex-direction: column;
	gap: 16px;
	flex-shrink: 0;
	width: 227px;
	height: 342px;
	padding: 8px;
	border-radius: 8px;
	background: #C4C4C4;
}

.promo-tile__media {
	position: relative;
	flex: 1 1 auto;
	min-height: 0;
}

.promo-tile__media-link {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	display: block;
}

.promo-tile__image {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.promo-tile__link {
	align-self: flex-start;
	font-size: 28px;
	font-weight: 700;
	color: #0077FF;
	text-decoration: underline;
}

.promo-tile__caption {
	align-self: flex-start;
	font-size: 28px;
	font-weight: 700;
	color: #000;
}

/* End */


/* Start:/local/templates/vine/components/bitrix/news.list/recommend/style.css?17864799441182*/
/* Блок «Рекомендуем для вас». Макет Figma 1293:13352 (1248x345) */
.recommend {
	max-width: 1248px;
	margin: 0 auto;
}

.recommend__title {
	margin: 0 0 16px;
	font-size: 40px;
	font-weight: 400;
	line-height: normal;
}

.recommend__grid {
	display: flex;
	align-items: stretch;
	gap: 16px;
}

.recommend__tile {
	display: flex;
	flex-direction: column;
	gap: 16px;
	min-height: 345px;
	padding: 8px;
	border-radius: 8px;
	background: #C4C4C4;
}

.recommend__tile--narrow {
	flex: 0 0 405px;
	max-width: 405px;
}

.recommend__tile--wide {
	flex: 1 1 0;
	min-width: 0;
	justify-content: center;
}

.recommend__media {
	position: relative;
	flex: 1 1 auto;
	min-height: 0;
}

.recommend__media-link {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	display: block;
}

.recommend__image {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.recommend__text {
	margin: 0;
	font-size: 40px;
	font-weight: 400;
	line-height: normal;
	color: #000;
}

.recommend__link {
	align-self: flex-start;
	font-size: 28px;
	font-weight: 700;
	color: #0077FF;
	text-decoration: underline;
}

/* End */


/* Start:/local/templates/vine/components/bitrix/news.list/certificate/style.css?1786479947967*/
/* Сквозной блок «Сертификат в подарок». Макет Figma 2090:19128 (1248x256) */
.certificate {
	display: flex;
	flex-direction: column;
	gap: 16px;
	max-width: 1248px;
	margin: 0 auto;
}

.certificate__item {
	display: flex;
	align-items: center;
	gap: 64px;
	width: 100%;
	min-height: 256px;
	border: 1px solid #000;
	border-radius: 24px;
	background: #FFF;
	overflow: hidden;
}

.certificate__image {
	flex-shrink: 0;
	display: block;
	width: 256px;
	height: 256px;
	border-radius: 24px;
	object-fit: cover;
}

.certificate__body {
	flex: 1 1 auto;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 24px;
}

.certificate__title {
	margin: 0;
	font-size: 40px;
	font-weight: 400;
	line-height: normal;
}

.certificate__text {
	font-size: 18px;
	line-height: normal;
}

.certificate__text p {
	margin: 0;
}

.certificate__link {
	align-self: flex-start;
	font-size: 18px;
	color: #0077FF;
	text-decoration: underline;
}

/* End */


/* Start:/local/templates/vine/components/bitrix/news.list/materials/style.css?17864803713785*/
/* =========================================================================
   Лента «Полезные материалы» — bitrix:news.list / materials
   Макет Figma HA2Vx4dnWPRDdb6SL7tM3y, узел 2091:20098.
   Заголовок 40px, карточка 500px, картинка 152x152, шаг 16px, внутри 8px.
   ========================================================================= */

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

/* ------------------------------------------------------- ШАПКА СЕКЦИИ */
.materials__head {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	gap: var(--vine-gap, 16px);
}

/* двойной класс — чтобы перебить общее правило .vine-main h2 из базового слоя */
.materials .materials__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;
}

.materials__all {
	font-size: var(--vine-fz-h1, 40px);
	font-weight: 400;
	line-height: normal;
	color: var(--vine-color-link, #0077FF);
	text-decoration: underline;
	text-decoration-skip-ink: none;
	text-underline-position: from-font;
	white-space: nowrap;
}

/* ---------------------------------------------- ГОРИЗОНТАЛЬНАЯ ЛЕНТА */
/* прокрутка только средствами CSS, без скриптов */
.materials__list {
	display: flex;
	align-items: flex-start;
	gap: var(--vine-gap, 16px);
	margin: 0;
	padding: 0 0 8px;
	list-style: none;
	overflow-x: auto;
	overflow-y: hidden;
	scroll-snap-type: x proximity;
	overscroll-behavior-x: contain;
	-webkit-overflow-scrolling: touch;
}

/* ------------------------------------------------------------ КАРТОЧКА */
.materials__item {
	display: flex;
	align-items: flex-start;
	gap: var(--vine-gap, 16px);
	flex: 0 0 500px;
	width: 500px;
	scroll-snap-align: start;
}

.materials__pic {
	display: block;
	flex: 0 0 152px;
	width: 152px;
	height: 152px;
	overflow: hidden;
	background: var(--vine-color-card, #C4C4C4);
}

.materials__img {
	display: block;
	width: 152px;
	height: 152px;
	object-fit: cover;
}

.materials__body {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	gap: var(--vine-gap-sm, 8px);
	min-width: 0;
}

/* двойной класс — чтобы перебить общее правило .vine-main h3 из базового слоя */
.materials .materials__name {
	margin: 0;
	font-size: var(--vine-fz-text, 18px);
	font-weight: 700;
	line-height: normal;
	color: var(--vine-color-text, #000000);
	word-break: break-word;
}

.materials__name-link {
	color: inherit;
	text-decoration: none;
}

.materials__name-link:hover,
.materials__name-link:focus {
	color: inherit;
	text-decoration: underline;
}

.materials__date {
	margin: 0;
	font-size: var(--vine-fz-small, 14px);
	font-style: italic;
	font-weight: 400;
	line-height: normal;
	color: var(--vine-color-text, #000000);
}

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

.materials__text p {
	margin: 0;
}

.materials__more {
	align-self: flex-start;
	font-size: var(--vine-fz-text, 18px);
	line-height: normal;
	color: var(--vine-color-link, #0077FF);
	text-decoration: underline;
	text-decoration-skip-ink: none;
	text-underline-position: from-font;
	white-space: nowrap;
}

/* ------------------------------------------------------------- АДАПТИВ */
@media (max-width: 640px) {
	.materials__item {
		flex-basis: 86vw;
		width: 86vw;
	}

	.materials__pic,
	.materials__img {
		flex-basis: 96px;
		width: 96px;
		height: 96px;
	}
}

/* End */


/* Start:/local/templates/vine/components/bitrix/news.list/news-main/style.css?17864803732898*/
/* =========================================================================
   Лента новостей на главной — bitrix:news.list / news-main
   Макет Figma HA2Vx4dnWPRDdb6SL7tM3y, узел 493:13217.
   Карточка 500px, картинка 152x152, шаг 16px, внутри карточки 8px.
   ========================================================================= */

/* ---------------------------------------------- ГОРИЗОНТАЛЬНАЯ ЛЕНТА */
/* прокрутка только средствами CSS, без скриптов */
.news-main {
	display: flex;
	align-items: flex-start;
	gap: var(--vine-gap, 16px);
	margin: 0;
	padding: 0 0 8px;
	list-style: none;
	overflow-x: auto;
	overflow-y: hidden;
	scroll-snap-type: x proximity;
	overscroll-behavior-x: contain;
	-webkit-overflow-scrolling: touch;
}

/* ------------------------------------------------------------ КАРТОЧКА */
.news-main__item {
	display: flex;
	align-items: flex-start;
	gap: var(--vine-gap, 16px);
	flex: 0 0 500px;
	width: 500px;
	scroll-snap-align: start;
}

.news-main__pic {
	display: block;
	flex: 0 0 152px;
	width: 152px;
	height: 152px;
	overflow: hidden;
	background: var(--vine-color-card, #C4C4C4);
}

.news-main__img {
	display: block;
	width: 152px;
	height: 152px;
	object-fit: cover;
}

.news-main__body {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	gap: var(--vine-gap-sm, 8px);
	min-width: 0;
}

/* двойной класс — чтобы перебить общее правило .vine-main h3 из базового слоя */
.news-main .news-main__name {
	margin: 0;
	font-size: var(--vine-fz-text, 18px);
	font-weight: 700;
	line-height: normal;
	color: var(--vine-color-text, #000000);
	word-break: break-word;
}

.news-main__name-link {
	color: inherit;
	text-decoration: none;
}

.news-main__name-link:hover,
.news-main__name-link:focus {
	color: inherit;
	text-decoration: underline;
}

.news-main__date {
	margin: 0;
	font-size: var(--vine-fz-small, 14px);
	font-style: italic;
	font-weight: 400;
	line-height: normal;
	color: var(--vine-color-text, #000000);
}

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

.news-main__text p {
	margin: 0;
}

.news-main__more {
	align-self: flex-start;
	font-size: var(--vine-fz-text, 18px);
	line-height: normal;
	color: var(--vine-color-link, #0077FF);
	text-decoration: underline;
	text-decoration-skip-ink: none;
	text-underline-position: from-font;
	white-space: nowrap;
}

/* ------------------------------------------------------------- АДАПТИВ */
@media (max-width: 640px) {
	.news-main__item {
		flex-basis: 86vw;
		width: 86vw;
	}

	.news-main__pic,
	.news-main__img {
		flex-basis: 96px;
		width: 96px;
		height: 96px;
	}
}

/* End */


/* Start:/local/templates/vine/components/bitrix/news.list/promo-wide/style.css?1786479953363*/
/* Широкая врезка-картинка. Макет Figma 773:6721 (1248x360) */
.promo-wide {
	display: flex;
	flex-direction: column;
	gap: 16px;
	max-width: 1248px;
	margin: 0 auto;
}

.promo-wide__item {
	width: 100%;
}

.promo-wide__link {
	display: block;
}

.promo-wide__image {
	display: block;
	width: 100%;
	height: 360px;
	object-fit: cover;
}

/* End */


/* Start:/bitrix/components/bitrix/system.pagenavigation/templates/round/style.min.css?17864742182515*/
.bx-pagination{margin:10px 0}.bx-pagination .bx-pagination-container{text-align:center;position:relative}.bx-pagination .bx-pagination-container ul{padding:0;margin:0;list-style:none;display:inline-block}.bx-pagination .bx-pagination-container ul li{display:inline-block;margin:0 2px 15px}.bx-pagination .bx-pagination-container ul li span{-webkit-transition:color .3s ease,background-color .3s ease,border-color .3s ease;-moz-transition:color .3s ease,background-color .3s ease,border-color .3s ease;-ms-transition:color .3s ease,background-color .3s ease,border-color .3s ease;-o-transition:color .3s ease,background-color .3s ease,border-color .3s ease;transition:color .3s ease,background-color .3s ease,border-color .3s ease;background:#eff0f1;padding:0 8px;font-size:14px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.bx-pagination .bx-pagination-container ul li a,.bx-pagination .bx-pagination-container ul li span{display:block;height:32px;min-width:32px;line-height:32px;color:#444;border-radius:16px;vertical-align:middle}.bx-pagination .bx-pagination-container ul li a{text-decoration:none}.bx-pagination .bx-pagination-container ul li a:hover span{background:#dadada}.bx-pagination .bx-pagination-container ul li.bx-active span{background:#0083d1;color:#fff}.bx-pagination .bx-pagination-container ul li.bx-pag-all a span,.bx-pagination .bx-pagination-container ul li.bx-pag-next a span,.bx-pagination .bx-pagination-container ul li.bx-pag-prev a span{background:#fff;border:2px solid #eff0f1;line-height:28px;padding:0 18px;color:#444}.bx-pagination .bx-pagination-container ul li.bx-pag-all span,.bx-pagination .bx-pagination-container ul li.bx-pag-next span,.bx-pagination .bx-pagination-container ul li.bx-pag-prev span{color:#aab1b4;background:#fff;border:2px solid #eff0f1;line-height:28px;padding:0 18px}.bx-pagination .bx-pagination-container ul li.bx-pag-all a:hover span,.bx-pagination .bx-pagination-container ul li.bx-pag-next a:hover span,.bx-pagination .bx-pagination-container ul li.bx-pag-prev a:hover span{background:#fff;border-color:#dadada;color:#000}.bx-pagination.bx-green .bx-pagination-container ul li.bx-active span{background:#3bc915;color:#fff}.bx-pagination.bx-yellow .bx-pagination-container ul li.bx-active span{background:#f9a91d;color:#fff}.bx-pagination.bx-red .bx-pagination-container ul li.bx-active span{background:#e22b2b;color:#fff}.bx-pagination.bx-blue .bx-pagination-container ul li.bx-active span{background:#0083d1;color:#fff}
/* End */


/* Start:/local/templates/vine/components/bitrix/news.list/reviews/style.css?17865368237983*/
/* =========================================================================
   Отзывы — bitrix:news.list / reviews
   Макет Figma HA2Vx4dnWPRDdb6SL7tM3y, узел 773:6795.
   Заголовок 40px, подзаголовки 34px, цитата 18px курсив с чертой слева
   5px, шаг между отзывами 16px, внутри отзыва 8px.
   Плашка .ya-widget пересобрана по растровому скриншоту виджета
   Яндекс.Карт из макета (узел 775:6824): жёлтая полоса, три белые
   карточки, стрелки и полоса прокрутки.
   ========================================================================= */

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

/* двойной класс — чтобы перебить общие правила .vine-main h2/h3 из базового слоя */
.reviews .reviews__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;
}

.reviews .reviews__subtitle {
	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;
}

/* ================================================ ПЛАШКА ВИДЖЕТА ЯНДЕКСА */
/* цвета сняты пипеткой со скриншота из макета:
   полоса #FED74E, карточка #FFFFFF, блок цитаты #F6F6F6, звёзды #FACD00 */
.ya-widget {
	box-sizing: border-box;
	padding: 6px 4px 8px;
	background: #FED74E;
}

.ya-widget__track {
	display: flex;
	gap: 27px;
	align-items: stretch;
	overflow-x: auto;
	padding-bottom: 2px;
	scroll-snap-type: x proximity;
	/* положение показывает собственная полоса .ya-widget__scroll из макета,
	   нативный скроллбар был бы вторым индикатором — прячем его */
	scrollbar-width: none;
	-ms-overflow-style: none;
}

.ya-widget__track::-webkit-scrollbar {
	width: 0;
	height: 0;
}

.ya-widget__card {
	box-sizing: border-box;
	flex: 0 0 417px;
	min-width: 260px;
	display: flex;
	flex-direction: column;
	padding: 18px;
	border-radius: 12px;
	background: #FFFFFF;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.10);
	scroll-snap-align: start;
}

/* ------------------------------------------------- шапка карточки */
.ya-widget__head {
	display: flex;
	align-items: flex-start;
	gap: 14px;
}

.ya-widget__avatar {
	flex: 0 0 auto;
	width: 54px;
	height: 54px;
	border-radius: 50%;
	object-fit: cover;
}

.ya-widget__meta {
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 3px;
}

.ya-widget__name {
	font-size: 15px;
	font-weight: 700;
	line-height: 1.2;
	color: #141414;
	word-break: break-word;
}

/* звезды в макете нарисованы внутри растрового скриншота, отдельного
   векторного глифа нет — поэтому текстовый символ ★ */
.ya-widget__stars {
	font-size: 16px;
	line-height: 1.1;
	letter-spacing: 1px;
	color: #FACD00;
	white-space: nowrap;
}

.ya-widget__date {
	font-size: 13px;
	line-height: 1.2;
	color: #7F7F7F;
}

/* --------------------------------------------- серый блок с цитатой */
.ya-widget__body {
	margin-top: 24px;
	padding: 18px 12px 14px;
	border-radius: 10px;
	background: #F6F6F6;
}

.ya-widget__text {
	display: -webkit-box;
	overflow: hidden;
	margin: 0;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	font-size: 15px;
	line-height: 20px;
	color: #151515;
	word-break: break-word;
}

.ya-widget__more {
	display: block;
	margin-top: 12px;
	font-size: 13px;
	line-height: 1.2;
	color: #727272;
}

.ya-widget__source {
	align-self: flex-start;
	margin-top: 20px;
	font-size: 13px;
	line-height: 1.2;
	color: #777777;
	text-decoration: underline;
}

/* --------------------------------- стрелки и полоса прокрутки (рабочие) */
.ya-widget__nav {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-top: 14px;
	padding: 0 4px;
}

.ya-widget__arrow {
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	width: 37px;
	height: 37px;
	padding: 0;
	border: 0;
	border-radius: 8px;
	background: #F7F7F7;
	color: #141414;
	font-family: inherit;
	font-size: 22px;
	line-height: 1;
	-webkit-appearance: none;
	appearance: none;
	cursor: pointer;
}

.ya-widget__arrow:hover:not([disabled]) {
	background: #ECECEC;
}

/* на краях ленты листать некуда: плашка из макета остаётся, гаснет глиф */
.ya-widget__arrow[disabled] {
	color: #BDBDBD;
	cursor: default;
}

.ya-widget__scroll {
	position: relative;
	flex: 1 1 auto;
	height: 2px;
	margin-left: 18px;
	background: rgba(0, 0, 0, 0.14);
	cursor: pointer;
	/* вертикальную прокрутку страницы отдаём браузеру,
	   горизонтальное перетаскивание бегунка обрабатываем сами */
	touch-action: pan-y;
}

.ya-widget__scroll[aria-disabled="true"] {
	cursor: default;
}

/* полоса высотой 2px — по ней тяжело попасть; расширяем зону нажатия,
   не трогая раскладку */
.ya-widget__scroll::before {
	content: "";
	position: absolute;
	top: -9px;
	right: 0;
	bottom: -9px;
	left: 0;
}

.ya-widget__thumb {
	position: absolute;
	top: -1px;
	left: 4.7%;
	width: 5.2%;
	height: 3px;
	background: #3B7578;
}

/* --------------------------------------------- фокус с клавиатуры */
.ya-widget__arrow:focus-visible,
.ya-widget__track:focus-visible {
	outline: 2px solid #141414;
	outline-offset: 2px;
}

.ya-widget__scroll:focus-visible {
	outline: none;
}

.ya-widget__scroll:focus-visible::before {
	outline: 2px solid #141414;
	border-radius: 4px;
}

/* на узком экране карточки не ужимаются, полоса скроллится пальцем */
@media (max-width: 900px) {
	.ya-widget__card {
		flex-basis: 78%;
	}
}

/* ------------------------------------------------------------- СПИСОК */
.reviews__list {
	display: flex;
	flex-direction: column;
	gap: var(--vine-gap, 16px);
}

.reviews__item {
	display: flex;
	flex-direction: column;
	gap: var(--vine-gap-sm, 8px);
	margin: 0;
	padding-left: var(--vine-gap, 16px);
	border-left: 5px solid var(--vine-color-text, #000000);
}

.reviews__quote {
	margin: 0;
	font-size: var(--vine-fz-text, 18px);
	font-style: italic;
	font-weight: 400;
	line-height: normal;
	color: var(--vine-color-text, #000000);
	word-break: break-word;
}

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

/* ------------------------------------------ КНОПКА «ПОКАЗАТЬ ЕЩЁ» */
/* из макета: padding 9px 12px 10px, рамка 1px #000, радиус 5px, текст 18px */
.reviews__more {
	align-self: flex-start;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 9px 12px 10px;
	border: 1px solid var(--vine-color-text, #000000);
	border-radius: var(--vine-radius-btn, 5px);
	background: var(--vine-color-bg, #FFFFFF);
	color: var(--vine-color-text, #000000);
	font-size: var(--vine-fz-text, 18px);
	font-weight: 400;
	line-height: normal;
	text-align: center;
	text-decoration: none;
	white-space: nowrap;
}

.reviews__more:hover,
.reviews__more:focus {
	color: var(--vine-color-text, #000000);
	text-decoration: none;
}

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

/* End */


/* Start:/local/templates/vine/components/bitrix/form.result.new/feedback/style.css?17864808915164*/
/* Блок «Остались вопросы?» — форма обращения. Макет: 775:6826, 775:7095, 775:7072 */

/* Селекторы намеренно с префиксом .feedback (0,2,0): в template_styles.css
   заголовки описаны как «.vine-main h2» (0,1,1) и перебивают одиночный класс. */

.feedback {
	font-family: var(--vine-font, Roboto, Arial, sans-serif);
	color: var(--vine-color-text, #000);
}

/* Заголовок секции — по шкале макета 40px (--vine-fz-h1) */
.feedback .feedback__title {
	margin: 0;
	font-size: var(--vine-fz-h1, 40px);
	font-weight: 400;
	line-height: normal;
	color: var(--vine-color-text, #000);
	word-break: break-word;
}

.feedback .feedback__subtitle {
	margin: 16px 0 0;
	font-size: 18px;
	font-weight: 400;
	line-height: normal;
	color: var(--vine-color-text, #000);
}

.feedback .feedback__grid {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 16px;
	width: 544px;
	max-width: 100%;
	margin-top: 16px;
}

/* Строка «подпись — поле»: 544px, подпись и поле по 272px */
.feedback .feedback__row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
}

.feedback .feedback__label {
	flex: 1 0 0;
	min-width: 0;
	font-size: 18px;
	font-weight: 400;
	line-height: normal;
	color: var(--vine-color-text, #000);
}

.feedback .feedback__label--block {
	flex: none;
	width: 100%;
}

.feedback .feedback__field {
	flex: 1 0 0;
	min-width: 0;
}

.feedback .feedback__field--block {
	flex: none;
	width: 100%;
}

/* Поля ввода: высота 48, рамка 1px, отступ 8px */
.feedback .feedback__control {
	box-sizing: border-box;
	display: block;
	width: 100%;
	height: 48px;
	padding: 0 8px;
	border: 1px solid #000;
	border-radius: 0;
	background: #fff;
	font-family: inherit;
	font-size: 18px;
	font-weight: 400;
	line-height: normal;
	color: var(--vine-color-text, #000);
}

.feedback .feedback__control:focus {
	outline: none;
}

/* Выпадающий список: стрелка 24x24 у правого края, отступ справа 4px */
.feedback .feedback__control--select {
	padding-right: 36px;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	background-image: url(/local/templates/vine/components/bitrix/form.result.new/feedback/images/icon-select-arrow.svg);
	background-repeat: no-repeat;
	background-position: right 4px center;
	background-size: 24px 24px;
	cursor: pointer;
}

/* Многострочное поле: 544x128, отступы 5px/8px */
.feedback .feedback__control--textarea {
	height: 128px;
	padding: 5px 8px;
	resize: none;
}

.feedback .feedback__row--invalid .feedback__control,
.feedback .feedback__field--invalid .feedback__control {
	border-color: red;
}

/* Согласия */
.feedback .feedback__consent {
	display: flex;
	align-items: center;
	gap: 8px;
	cursor: pointer;
}

.feedback .feedback__checkbox {
	box-sizing: border-box;
	flex: 0 0 auto;
	width: 24px;
	height: 24px;
	margin: 0;
	padding: 0;
	border: 3px solid #000;
	border-radius: 0;
	background-color: #fff;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	cursor: pointer;
}

.feedback .feedback__checkbox:checked {
	background-image: url(/local/templates/vine/components/bitrix/form.result.new/feedback/images/icon-checkbox-check.svg);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 24px 24px;
	background-origin: border-box;
}

.feedback .feedback__consent--invalid .feedback__checkbox {
	border-color: red;
}

.feedback .feedback__consent-text {
	font-size: 18px;
	font-weight: 400;
	line-height: normal;
	color: var(--vine-color-text, #000);
}

.feedback .feedback__consent-link {
	color: var(--vine-color-link, #0077FF);
	text-decoration: none;
	cursor: pointer;
}

.feedback .feedback__consent-link--underline {
	text-decoration: underline;
	text-decoration-skip-ink: none;
	text-underline-position: from-font;
}

/* Сообщения */
.feedback .feedback__error,
.feedback .feedback__success {
	margin: 0;
	font-size: 18px;
	font-weight: 700;
	line-height: normal;
}

.feedback .feedback__error {
	color: red;
}

.feedback .feedback__success {
	margin-top: 16px;
	color: #298100;
}

/* Кнопка: в макете 115x40, обводка внутренняя (Figma рисует stroke внутрь),
   поэтому высота задана явно, а горизонтальный отступ 12px уменьшен на 1px рамки. */
.feedback .feedback__submit {
	box-sizing: border-box;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 40px;
	padding: 0 11px;
	border: 1px solid #000;
	border-radius: 5px;
	background: var(--vine-color-btn, #151515);
	font-family: inherit;
	font-size: 18px;
	font-weight: 400;
	line-height: normal;
	text-align: center;
	color: var(--vine-color-btn-text, #fff);
	cursor: pointer;
}

/* Адаптив — брейкпоинт как в template_styles.css */
@media (max-width: 640px) {
	.feedback .feedback__row {
		flex-direction: column;
		align-items: flex-start;
		gap: 8px;
	}

	.feedback .feedback__label,
	.feedback .feedback__field {
		flex: none;
		width: 100%;
	}
}

/* End */
/* /local/templates/vine/css/main-page.css?17864816041789 */
/* /local/templates/vine/components/bitrix/news.list/main-banner/style.css?17865334953567 */
/* /local/templates/vine/components/bitrix/catalog.section/events-card/style.css?17864796352943 */
/* /local/templates/vine/components/bitrix/news.list/promo-tile/style.css?1786479950915 */
/* /local/templates/vine/components/bitrix/news.list/recommend/style.css?17864799441182 */
/* /local/templates/vine/components/bitrix/news.list/certificate/style.css?1786479947967 */
/* /local/templates/vine/components/bitrix/news.list/materials/style.css?17864803713785 */
/* /local/templates/vine/components/bitrix/news.list/news-main/style.css?17864803732898 */
/* /local/templates/vine/components/bitrix/news.list/promo-wide/style.css?1786479953363 */
/* /bitrix/components/bitrix/system.pagenavigation/templates/round/style.min.css?17864742182515 */
/* /local/templates/vine/components/bitrix/news.list/reviews/style.css?17865368237983 */
/* /local/templates/vine/components/bitrix/form.result.new/feedback/style.css?17864808915164 */
