/* 06.10.2026: правки по UX-аудиту. */

/* Чат Битрикс24 поднят над нижней панелью карточки курса, чтобы не закрывал «Забронировать место» */
@media screen and (min-width: 768px) and (max-width: 1800px) {
	body:has(.program-fixed-block) .b24-widget-button-wrapper { bottom: 130px !important; }
}
@media screen and (min-width: 768px) and (max-width: 991px) {
	body:has(.program-fixed-block) .b24-widget-button-wrapper { bottom: 150px !important; }
}
@media screen and (max-width: 767px) {
	/* закрытая панель — кнопка 61 px внизу справа: чат над ней */
	body:has(.program-fixed-block-open) .b24-widget-button-wrapper { bottom: 80px !important; }
	/* открытая панель занимает низ экрана: чат на это время прячем */
	body:has(.program-fixed-block[style*="display: block"]) .b24-widget-button-wrapper { display: none !important; }
}

/* Длинные слова в заголовках блоков программ переносятся, а не распирают страницу на телефоне */
.sp-htag, .sp-propgram-container h2, .sp-propgram-container h3 { overflow-wrap: break-word; }
@media screen and (max-width: 767px) {
	.sp-propgram-container .sp-htag { max-width: 100%; }
	/* в _style.css заголовок блока type21 задан 40px !important и мобильные 18px не срабатывают */
	.sp-propgram-type21 h2.sp-htag--left { font-size: 28px !important; line-height: 1.2; }
}

/* Ряд карточек курсов на странице тренера был шире экрана на 12 px */
@media screen and (max-width: 767px) {
	.news-list-type1__row { margin-left: 0; margin-right: 0; }
}

/* Уведомление SmartCaptcha под кнопкой формы бронирования */
.webform-captcha-note { font-size: 12px; line-height: 1.4; opacity: .75; margin: 8px 0 0; }
.webform-captcha-note a { color: inherit; text-decoration: underline; }

/* Отзывы без фото (перенесены с Яндекс Карт): первая буква имени в круге */
.reviews-list__initial { width: 100px; height: 100px; border-radius: 50%; background: #666a8f; color: #fff;
	font-size: 40px; font-weight: 500; display: flex; align-items: center; justify-content: center; margin: 0 auto 15px; }
@media screen and (max-width: 767px) { .reviews-list__initial { width: 64px; height: 64px; font-size: 28px; margin: 0 0 10px; } }

/* Плашка SmartCaptcha «Политика обработки данных» лежала поверх текста; hideShield скрипт капчи не учитывает.
   Уведомление об обработке данных выведено текстом под кнопкой формы бронирования. */
.SmartCaptcha-Shield { display: none !important; }

/* Отзывы на телефоне: фото и буквы-аватары кружком 96 px, а не на всю ширину карточки */
@media screen and (max-width: 767px) {
	.reviews-list__image img { width: 96px; height: 96px; object-fit: cover; border-radius: 50%; }
	.reviews-list__image { margin-bottom: 10px; }
}

/* Кнопка «Программа и запись» в карточках «Ближайших программ» (главная, тренеры): в одну строку и ниже.
   В шаблоне news_list_type1 у ссылки инлайн max-width:220px — из-за него текст переносился и кнопка была 68 px. */
.news-list-type1__item > .btn.btn-white-blue { max-width: none !important; width: max-content; white-space: nowrap; padding: 8px 24px; line-height: 22px; }
.news-list-type1__item > .btn.btn-white-blue:hover, .news-list-type1__item > .btn.btn-white-blue:focus { color: #fff; }
@media screen and (max-width: 767px) {
	.news-list-type1__item > .btn.btn-white-blue { padding: 8px 20px; line-height: 18px; }
}

/* Окно записи на курс (06.10.2026) */
.innlp-zapis-okno { max-width: 560px; width: 100%; padding: 28px 28px 20px; background: #fff; border-radius: 10px; }
.innlp-zapis-okno__kurs { font-size: 22px; font-weight: 500; line-height: 1.25; text-transform: uppercase; color: #333; }
.innlp-zapis-okno__meta { margin: 8px 0 16px; font-size: 15px; color: #666a8f; font-weight: 500; }
.innlp-zapis-okno .sp-propgram-type7__webform { margin: 0; }
.innlp-zapis-okno .webform-type2 { color: #333; }
.innlp-zapis-okno .webform-type2 .btn-transparent-blue { width: 100%; }
@media screen and (max-width: 767px) { .innlp-zapis-okno { padding: 20px 16px 16px; } .innlp-zapis-okno__kurs { font-size: 18px; } }
.innlp-zapis-data { display: block; font-size: 12px; font-weight: 400; opacity: .85; margin-top: 2px; }

/* Главная, телефон: в «Ближайших программах» три карточки, дальше «Посмотреть еще» (расписание) */
@media screen and (max-width: 767px) {
	.block-nearest-programs .news-list-type1 .row > *:nth-child(n+4) { display: none; }
}

/* Блок «Хотите попробовать на практике?» в статьях и техниках (06.10.2026) */
.innlp-sb { margin: 40px 0; padding: 28px; border-radius: 12px; background: #f3f4f9; }
.innlp-sb__zag { font-size: 24px; font-weight: 500; color: #333; line-height: 1.25; }
.innlp-sb__pod { margin: 6px 0 20px; font-size: 16px; color: #666a8f; }
.innlp-sb__karty { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.innlp-sb__karta { display: flex; flex-direction: column; gap: 8px; padding: 18px; background: #fff; border-radius: 10px;
	border: 1px solid #e1e3ee; color: #333; text-decoration: none !important; transition: border-color .2s, box-shadow .2s; }
.innlp-sb__karta:hover, .innlp-sb__karta:focus { border-color: #6ca4bf; box-shadow: 0 6px 18px rgba(102, 106, 143, .15); color: #333; }
.innlp-sb__metka { align-self: flex-start; font-size: 12px; font-weight: 500; color: #fff; background: #6ca4bf; border-radius: 4px; padding: 3px 8px; }
.innlp-sb__karta--kurs .innlp-sb__metka { background: #666a8f; }
.innlp-sb__nazv { font-size: 17px; font-weight: 500; line-height: 1.3; }
.innlp-sb__tekst { font-size: 14px; line-height: 1.5; color: #555; flex-grow: 1; }
.innlp-sb__knopka { margin-top: 6px; font-size: 14px; font-weight: 500; color: #666a8f; text-transform: uppercase; letter-spacing: .02em; }
.innlp-sb__knopka:after { content: " →"; }
@media screen and (max-width: 991px) { .innlp-sb__karty { grid-template-columns: minmax(0, 1fr); } }
@media screen and (max-width: 767px) { .innlp-sb { margin: 28px -5px; padding: 20px 16px; } .innlp-sb__zag { font-size: 20px; } .innlp-sb__nazv { font-size: 16px; } }

/* Таблицы в статьях и техниках: на телефоне листаются внутри себя и не растягивают страницу; отступы в ячейках */
.news-detail-type4 table, .news-detail table { border-collapse: collapse; }
.news-detail-type4 table td, .news-detail-type4 table th, .news-detail table td, .news-detail table th { padding: 6px 12px 6px 0; vertical-align: top; }
@media screen and (max-width: 767px) {
	.news-detail-type4 table, .news-detail table { display: block; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
}