

/* Start:/local/templates/vine/components/bitrix/news/vine_teachers/style.css?17871539726424*/
/* Страницы «Преподаватели» (2090:18002) и «Преподаватель» (2093:20344):
   обвязка, которую рисует сам комплексный шаблон, — панель фильтров,
   алфавит, заголовки секций, сетка мероприятий с плиткой заявки и
   заключительный текстовый блок. Карточки, детальная, материалы и форма
   лежат в style.css своих шаблонов. */

/* ------------------------------------------------ панель фильтров 2091:19669 */

.vine-teachers-intro {
	display: flex;
	flex-direction: column;
	gap: 24px;
	box-sizing: border-box;
	width: 100%;
	max-width: var(--vine-container);
	padding: var(--vine-gap);
	border-radius: var(--vine-gap);
	background: var(--vine-color-card);
}

.vine-teachers-intro__title {
	margin: 0;
	font-family: var(--vine-font);
	font-size: var(--vine-fz-h1);
	font-weight: 400;
	line-height: normal;
	color: var(--vine-color-text);
}

.vine-teachers-intro__lead {
	margin: 0;
	font-size: var(--vine-fz-text);
	line-height: normal;
}

.vine-teachers-intro__filters {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 32px;
	margin: 0;
}

/* поле поиска 2090:19335 — 344×32, белое, рамка 1px, лупа справа */

.vine-teachers-search {
	display: flex;
	align-items: center;
	gap: var(--vine-gap);
}

.vine-teachers-search__field {
	display: flex;
	align-items: center;
	box-sizing: border-box;
	width: 344px;
	max-width: 100%;
	height: 32px;
	padding: 0 4px 0 8px;
	border: 1px solid var(--vine-color-text);
	background: var(--vine-color-bg) url("/local/templates/vine/images/icon-search.svg") no-repeat right 4px center;
	background-size: 20px 20px;
}

.vine-teachers-search__input {
	flex: 1 0 0;
	min-width: 0;
	padding: 0 28px 0 0;
	border: 0;
	background: transparent;
	font-family: var(--vine-font);
	font-size: var(--vine-fz-text);
	line-height: normal;
	color: var(--vine-color-text);
}

.vine-teachers-search__input::placeholder {
	color: var(--vine-color-card);
	opacity: 1;
}

.vine-teachers-search__input:focus {
	outline: none;
}

/* кнопка «Найти» 2090:19336 */

.vine-teachers-search__submit {
	padding: 9px 12px 10px;
	border: 1px solid var(--vine-color-text);
	border-radius: var(--vine-radius-btn);
	background: var(--vine-color-btn);
	font-family: var(--vine-font);
	font-size: var(--vine-fz-text);
	line-height: normal;
	color: var(--vine-color-btn-text);
	cursor: pointer;
}

/* алфавит 2091:19606 — буквы 18px, #0077FF, подчёркивание пунктиром, шаг 16 */

.vine-teachers-alphabet {
	display: flex;
	flex-wrap: wrap;
	gap: var(--vine-gap);
}

.vine-teachers-alphabet__item {
	font-size: var(--vine-fz-text);
	line-height: normal;
	color: var(--vine-color-link);
	text-decoration: underline dotted;
	text-underline-position: from-font;
}

.vine-teachers-alphabet__item--current {
	font-weight: 700;
	text-decoration: none;
	color: var(--vine-color-text);
}

/* ------------------------------------------------------ заголовки страницы */

/* Селектор с .vine-main намеренно: общее правило шаблона сайта
   «.vine-h2, .vine-main h2 { font-size: var(--vine-fz-h2) }» специфичнее
   одного класса и сажало заголовок сетки с макетных 48px на 34px. */
.vine-main .vine-teachers-heading {
	margin: 0;
	font-family: var(--vine-font);
	font-size: 48px;
	font-weight: 400;
	line-height: normal;
	color: var(--vine-color-text);
}

.vine-main .vine-teachers-events__title,
.vine-main .vine-teacher-events__title,
.vine-main .vine-teachers-outro__title {
	margin: 0;
	font-family: var(--vine-font);
	font-size: var(--vine-fz-h1);
	font-weight: 400;
	line-height: normal;
	color: var(--vine-color-text);
}

.vine-teachers-events,
.vine-teacher-events,
.vine-teachers-outro {
	display: flex;
	flex-direction: column;
	gap: var(--vine-gap);
	width: 100%;
	max-width: var(--vine-container);
}

.vine-teachers-outro__text {
	margin: 0;
	font-size: var(--vine-fz-text);
	line-height: normal;
}

/* ------------------------- сетка мероприятий детальной + плитка 2095:21531 */

/* Плитка стоит третьей ячейкой той же сетки, что и карточки мероприятий.
   Чтобы не трогать общий шаблон events-card, его обёртки распластываются
   по нашей сетке: и .events, и .events__grid становятся display: contents,
   а их li — прямыми ячейками. */

.vine-teacher-events__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--vine-gap);
	align-items: stretch;
}

.vine-teacher-events__grid > .events--flat,
.vine-teacher-events__grid > .events--flat > .events__grid {
	display: contents;
}

.vine-teacher-request-tile {
	display: flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	width: 100%;
	height: 100%;
	padding: 9px 12px 10px;
	border: 1px solid var(--vine-color-text);
	border-radius: var(--vine-radius-btn);
	background: var(--vine-color-bg);
	font-family: var(--vine-font);
	font-size: var(--vine-fz-h1);
	font-weight: 700;
	line-height: normal;
	text-align: center;
	color: var(--vine-color-text);
	overflow-wrap: break-word;
	cursor: pointer;
}

@media (max-width: 900px) {
	.vine-teacher-events__grid {
		grid-template-columns: 1fr;
	}

	.vine-teacher-request-tile {
		font-size: var(--vine-fz-h3);
	}
}

/* Лента мероприятий: в макете обеих страниц три карточки в ряд, а общий
   шаблон events-card раскладывает их по две. Ширину колонок задаём здесь,
   через штатный модификатор SECTION_MOD_CLASS, — сам events-card
   используется и на главной и остаётся нетронутым. */
.events--cols3 .events__grid {
	grid-template-columns: repeat(3, 1fr);
}

/* End */


/* Start:/local/templates/vine/components/bitrix/news.list/vine_city_filter/style.css?1787150324988*/
/* Чип «Город» панели фильтров (макет 2090:19373):
   фон #C4C4C4, рамка 1px, радиус 16, padding 16/8, шаг 10, крестик 24×24. */

.vine-teachers-city {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 8px 16px;
	border: 1px solid var(--vine-color-text);
	border-radius: var(--vine-gap);
	background: var(--vine-color-card);
}

.vine-teachers-city__select {
	padding: 0;
	border: 0;
	background: transparent;
	font-family: var(--vine-font);
	font-size: var(--vine-fz-text);
	line-height: normal;
	color: var(--vine-color-text);
	cursor: pointer;
	appearance: none;
}

.vine-teachers-city__select:focus {
	outline: none;
}

.vine-teachers-city--active .vine-teachers-city__select {
	font-weight: 700;
}

.vine-teachers-city__reset {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 24px;
	height: 24px;
}

.vine-teachers-city__reset-icon {
	display: block;
	width: 24px;
	height: 24px;
}

/* End */


/* Start:/local/templates/vine/components/bitrix/news.list/vine_teachers/style.css?17871510618242*/
/* =========================================================================
   Сетка карточек преподавателей — bitrix:news.list / vine_teachers
   Макет Figma HA2Vx4dnWPRDdb6SL7tM3y, узел 2091:19804.

   Размеры из макета:
     сетка       — контейнер 1248, три колонки по 400px,
                   x = 0 / 424 / 848 → шаг между колонками 24px
                   (3 × 400 + 2 × 24 = 1248 ровно);
     колонка     — вертикальный шаг 16px (413 + 16 = 429, шаг карточек);
     блок о команде (2091:19805) — 400×184, рамка 1px #000, padding 8,
                   текст 18px; стоит ПЕРВЫМ во второй колонке, из-за чего
                   колонки не выровнены построчно;
     карточка (2090:18021) — 400×413, рамка 1px #000, padding 8,
                   внутренний шаг 10, содержимое по центру;
     фото        — 270×220 (x = 65 → по центру карточки), object-fit: cover;
     имя         — 18px Bold, по центру;
     должность   — 14px Regular, по левому краю, на всю ширину;
     анонс       — 18px Regular, на всю ширину, три строки с многоточием;
     «Подробнее» — 18px, #0077FF, подчёркнутая, по левому краю;
     кнопка «Показать ещё» — 143×40, белая, рамка 1px #000, радиус 5,
                   текст 18px, поля 9/12/10 (общий класс .vine-btn);
     строка «Вы посмотрели всех преподавателей» — 18px Regular без курсива,
                   в макете нарисована под кнопкой с отступом 24px.

   Кнопка (.vine-btn) и скрытая подпись (.vine-visually-hidden) живут в
   общем слое template_styles.css. Здесь только раскладка секции.
   ========================================================================= */

.vine-teachers {
	display: flex;
	flex-direction: column;
	/* расстояния между сеткой и кнопкой в предоставленных данных нет —
	   берём базовый шаг макета 16px */
	gap: var(--vine-gap, 16px);
	width: 100%;
	/* Контентная колонка макета — 1248. Без ограничения на широком экране
	   сетка растягивалась во всю страницу и колонки выходили по 445 вместо
	   400 — те же грабли, что были на детальной странице курса. */
	max-width: var(--vine-container, 1248px);
}

/* ------------------------------------------------------------------ СЕТКА */
/* Колонки равной ширины: (1248 − 2 × 24) / 3 = 400. align-items: start —
   чтобы колонки жили независимо друг от друга (раскладка masonry). */
.vine-teachers__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	column-gap: var(--vine-teachers-col-gap, 24px);
	row-gap: var(--vine-gap, 16px);
	align-items: start;
	width: 100%;
}

.vine-teachers__col {
	display: flex;
	min-width: 0;
	flex-direction: column;
	gap: var(--vine-gap, 16px);
}

/* --------------------------------------------------- БЛОК О КОМАНДЕ (2091:19805) */
.vine-teachers__intro {
	padding: var(--vine-pad-card, 8px);
	border: 1px solid var(--vine-color-text, #000000);
	background: var(--vine-color-bg, #FFFFFF);
	font-size: var(--vine-fz-text, 18px);
	font-style: normal;
	font-weight: 400;
	line-height: normal;
	color: var(--vine-color-text, #000000);
	word-break: break-word;
}

/* ---------------------------------------------------------------- КАРТОЧКА */
.vine-teachers__item {
	display: flex;
	/* в макете все карточки одной высоты — 413px */
	min-height: 413px;
	flex-direction: column;
	align-items: center;
	gap: 10px;
	padding: var(--vine-pad-card, 8px);
	border: 1px solid var(--vine-color-text, #000000);
	background: var(--vine-color-bg, #FFFFFF);
}

.vine-teachers__photo {
	flex: 0 0 auto;
	width: 270px;
	max-width: 100%;
	height: 220px;
	overflow: hidden;
}

.vine-teachers__photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* двойной класс — чтобы перебить общие правила заголовков базового слоя */
.vine-teachers .vine-teachers__name {
	margin: 0;
	font-size: var(--vine-fz-text, 18px);
	font-weight: 700;
	line-height: normal;
	text-align: center;
	color: var(--vine-color-text, #000000);
	word-break: break-word;
}

.vine-teachers__position {
	width: 100%;
	margin: 0;
	font-size: var(--vine-fz-small, 14px);
	font-style: normal;
	font-weight: 400;
	line-height: normal;
	color: var(--vine-color-text, #000000);
	word-break: break-word;
}

/* анонс в макете обрывается многоточием на третьей строке */
.vine-teachers__text {
	display: -webkit-box;
	-webkit-line-clamp: 3;
	line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
	width: 100%;
	margin: 0;
	font-size: var(--vine-fz-text, 18px);
	font-style: normal;
	font-weight: 400;
	line-height: normal;
	color: var(--vine-color-text, #000000);
	word-break: break-word;
}

.vine-teachers__link {
	width: 100%;
	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;
	word-break: break-word;
}

/* ------------------------------------------------------------------ ПОДВАЛ */
/* Кнопка и строка «Вы посмотрели всех преподавателей» нарисованы в макете
   одновременно с отступом 24px, но это два состояния одного места —
   лишнее скрыто атрибутом hidden. */
.vine-teachers__foot {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 24px;
}

.vine-teachers__foot > [hidden] {
	display: none;
}

/* «Показать ещё» — 143×40 из макета: ширина набирается текстом 18px и
   полями .vine-btn, поэтому фиксируем минимумы, а не жёсткий размер */
.vine-teachers__more {
	min-width: 143px;
	min-height: 40px;
}

.vine-teachers__more[aria-busy="true"] {
	opacity: 0.6;
	pointer-events: none;
}

.vine-teachers__end {
	margin: 0;
	font-size: var(--vine-fz-text, 18px);
	font-style: normal; /* в макете строка без курсива */
	font-weight: 400;
	line-height: normal;
	color: var(--vine-color-text, #000000);
}

/* ------------------------------------------------------------------ АДАПТИВ */
/* Мобильных раскладок в макете нет: сетка просто складывается в две, затем
   в одну колонку, чтобы карточка 400px не ломала строку на узком экране.
   display: contents убирает колонки-обёртки из раскладки, и карточки
   становятся ячейками сетки напрямую — иначе третья колонка целиком
   уехала бы под первые две. */
@media (max-width: 1024px) {
	.vine-teachers__grid {
		grid-template-columns: repeat(2, 1fr);
		column-gap: var(--vine-gap, 16px);
		align-items: stretch;
	}

	.vine-teachers__col {
		display: contents;
	}
}

@media (max-width: 640px) {
	.vine-teachers__grid {
		grid-template-columns: 1fr;
	}

	.vine-teachers__more {
		width: 100%;
	}
}

/* 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/vine_materials_cards/style.css?17871501007487*/
/* =========================================================================
   «Полезные материалы» — карточки с картинкой сверху
   bitrix:news.list / vine_materials_cards

   Макет Figma HA2Vx4dnWPRDdb6SL7tM3y:
     2091:20207 — режим GRID     (страница списка преподавателей);
     2095:21626 — режим CAROUSEL (детальная страница преподавателя).

   Общее для обоих режимов: заголовок секции 40px, карточка без фона,
   рамки и внутренних отступов; картинка высотой 152px, ниже название
   Bold 28px, дата Italic 14px, анонс 18px и ссылка «Подробнее →» 18px
   цветом #0077FF. Шаг между картинкой и текстом 16px, между текстовыми
   полями 8px.
   ========================================================================= */

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

/* двойной класс — чтобы перебить общее правило .vine-main h2 из базового слоя */
.materials-cards .materials-cards__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-cards__row {
	display: flex;
	gap: var(--vine-gap, 16px);
	min-width: 0;
}

.materials-cards__list {
	display: flex;
	gap: var(--vine-gap, 16px);
	margin: 0;
	padding: 0;
	list-style: none;
	min-width: 0;
}

/* ------------------------------------------------------------- КАРТОЧКА */
/* ни фона, ни рамки, ни padding — только колонка с шагом 16px */
.materials-cards__item {
	display: flex;
	flex-direction: column;
	gap: var(--vine-gap, 16px);
	min-width: 0;
}

.materials-cards__pic {
	display: block;
	width: 100%;
	height: 152px;
	overflow: hidden;
	background: var(--vine-color-card, #C4C4C4);
}

.materials-cards__img {
	display: block;
	width: 100%;
	height: 152px;
	object-fit: cover;
	border-radius: 0;
}

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

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

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

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

.materials-cards__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-cards__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-cards__text p {
	margin: 0;
}

.materials-cards__more {
	align-self: flex-start;
	font-size: var(--vine-fz-text, 18px);
	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;
}

/* =============================================================== РЕЖИМ GRID
   Строка карточек 300px с шагом 16, выравнивание по верху: высоты
   карточек не выравниваются. Четвёртая плитка-ссылка растянута на
   высоту строки.
   ------------------------------------------------------------------------ */
.materials-cards--grid .materials-cards__row,
.materials-cards--grid .materials-cards__list {
	align-items: flex-start;
}

.materials-cards--grid .materials-cards__list {
	flex-wrap: wrap;
}

.materials-cards--grid .materials-cards__item {
	flex: 0 0 300px;
	width: 300px;
}

/* плитка «Все полезные материалы» */
.materials-cards--grid .materials-cards__item--all {
	align-self: stretch;
}

.materials-cards__all {
	display: flex;
	flex-direction: column;
	gap: var(--vine-gap, 16px);
	box-sizing: border-box;
	width: 100%;
	height: 100%;
	padding: var(--vine-pad-card, 8px);
	background: var(--vine-color-card, #C4C4C4);
	border-radius: var(--vine-radius, 8px);
	text-decoration: none;
}

/* картинка занимает всё оставшееся место плитки */
.materials-cards__all-img {
	display: block;
	flex: 1 1 auto;
	width: 100%;
	min-height: 0;
	object-fit: cover;
}

.materials-cards__all-text {
	flex: 0 0 auto;
	font-size: var(--vine-fz-h3, 28px);
	font-weight: 700;
	line-height: normal;
	color: var(--vine-color-link, #0077FF);
	text-decoration: underline;
	text-decoration-skip-ink: none;
	text-underline-position: from-font;
	word-break: break-word;
}

/* =========================================================== РЕЖИМ CAROUSEL
   Лента карточек 373px с шагом 16, по краям кнопки-стрелки 32x32.
   Выравнивание по центру; карточки при этом одной высоты — их тянет
   align-self: stretch, поэтому центрирование на вид ничего не смещает.
   Прокрутка — overflow-x: auto, кнопки листают лентой из script.js.
   ------------------------------------------------------------------------ */
.materials-cards--carousel .materials-cards__row,
.materials-cards--carousel .materials-cards__list {
	align-items: center;
}

.materials-cards--carousel .materials-cards__list {
	flex: 1 1 auto;
	overflow-x: auto;
	overflow-y: hidden;
	scroll-behavior: smooth;
	scroll-snap-type: x proximity;
	overscroll-behavior-x: contain;
	-webkit-overflow-scrolling: touch;
}

.materials-cards--carousel .materials-cards__item {
	flex: 0 0 373px;
	width: 373px;
	align-self: stretch;
	scroll-snap-align: start;
}

/* ---------------------------------------------------------- КНОПКИ-СТРЕЛКИ */
/* скруглённый квадрат 32x32, внутри чёрный треугольник 24x24 */
.materials-cards__arrow {
	display: flex;
	flex: 0 0 32px;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	width: 32px;
	height: 32px;
	padding: 0;
	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);
	cursor: pointer;
}

.materials-cards__arrow-icon {
	display: block;
	width: 24px;
	height: 24px;
	font-size: 24px;
	line-height: 24px;
	color: var(--vine-color-text, #000000);
}

.materials-cards__arrow[disabled] {
	opacity: 0.4;
	cursor: default;
}

/* ------------------------------------------------------------- АДАПТИВ */
@media (max-width: 640px) {
	.materials-cards--grid .materials-cards__item,
	.materials-cards--carousel .materials-cards__item {
		flex-basis: 86vw;
		width: 86vw;
	}
}

/* End */


/* Start:/local/templates/vine/components/bitrix/news.list/course-reviews/style.css?17867178453611*/
/* =========================================================================
   Отзывы на детальной — bitrix:news.list / course-reviews
   Макет Figma HA2Vx4dnWPRDdb6SL7tM3y, узел 1641:11136 (очный курс),
   он же 960:12354 «Другие отзывы» на онлайн-курсе.

   Из макета: заголовок 40px; цитата Roboto Italic 18px с чёрной чертой
   слева 5px и отступом 16px; подпись «— Имя, возраст» 18px без курсива;
   шаг между отзывами 16px, внутри отзыва 8px; кнопка «Показать ещё»
   143×40; строка «Вы посмотрели все отзывы» 18px; ссылка «Оставить отзыв»
   18px синяя подчёркнутая.

   Черта, курсив и подпись живут в общем слое (.vine-quote,
   .vine-quote__author), кнопка — .vine-btn. Здесь только раскладка секции.
   ========================================================================= */

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

/* двойной класс — перебить .vine-main h2 (34px) из базового слоя */
.course-reviews .course-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;
}

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

/* .vine-quote даёт черту, отступ и курсив; здесь — только внутренний шаг */
.course-reviews__item {
	display: flex;
	flex-direction: column;
	gap: var(--vine-gap-sm, 8px);
}

.course-reviews__quote {
	margin: 0;
	font: inherit;
	color: inherit;
	word-break: break-word;
}

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

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

/* ------------------------------------------------------------- ПОДВАЛ */
/* Кнопка, строка «всё» и ссылка идут друг под другом с шагом 16px.
   В макете кнопка и строка нарисованы одновременно, но это два состояния
   одного места — лишнее скрыто атрибутом hidden. */
.course-reviews__foot {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: var(--vine-gap, 16px);
}

.course-reviews__foot > [hidden] {
	display: none;
}

/* «Показать ещё» — 143×40 из макета: ширина набирается текстом 18px
   и полями .vine-btn, поэтому фиксируем минимумы, а не жёсткий размер */
.course-reviews__more {
	min-width: 143px;
	min-height: 40px;
}

.course-reviews__more[aria-busy="true"] {
	opacity: 0.6;
	pointer-events: none;
}

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

.course-reviews__add {
	font-size: var(--vine-fz-text, 18px);
	line-height: normal;
	color: var(--vine-color-link, #0077FF);
	text-decoration: underline;
}

/* ------------------------------------------------------------- ФОРМА */
.course-reviews__form {
	margin: 0;
}

.course-reviews__form[hidden] {
	display: none;
}

/* End */
/* /local/templates/vine/components/bitrix/news/vine_teachers/style.css?17871539726424 */
/* /local/templates/vine/components/bitrix/news.list/vine_city_filter/style.css?1787150324988 */
/* /local/templates/vine/components/bitrix/news.list/vine_teachers/style.css?17871510618242 */
/* /local/templates/vine/components/bitrix/catalog.section/events-card/style.css?17864796352943 */
/* /local/templates/vine/components/bitrix/news.list/vine_materials_cards/style.css?17871501007487 */
/* /local/templates/vine/components/bitrix/news.list/course-reviews/style.css?17867178453611 */
