/* =========================================================================
   Блок "Отзывы" — стиль по макету 941
   Подключается из header.php. Данные/разметка: include/redesign/reviews_block.php
   ========================================================================= */

.reviews-block {
	position: relative;
	width: calc(100% - (var(--redesign-page-gutter, 48px) * 2));
	max-width: none;
	margin: 0 auto;
	padding: 36px 40px 40px;
	border-radius: 28px;
	background: #ffffff;
	border: 1px solid var(--redesign-line, #e8ebef);
	box-sizing: border-box;
}

.reviews-block__head {
	display: flex;
	align-items: center;
	gap: 18px;
	flex-wrap: wrap;
	margin-bottom: 28px;
}

.reviews-block__title {
	margin: 0 !important;
	font-size: clamp(26px, 2.4vw, 40px) !important;
	font-weight: 800 !important;
	line-height: 1.05 !important;
	color: #1d1d1f !important;
	letter-spacing: -0.5px;
}

.reviews-block__widgets {
	display: flex;
	align-items: center;
	gap: 12px;
	flex-wrap: nowrap;
}

/* Обёртка для официального iframe-виджета (2ГИС / Яндекс) — рендерится как есть, без перерисовки.
   flex-shrink:0 держит фиксированный размер 150x50, чтобы виджеты стояли ровно в ряд, не сжимаясь вкривь. */
.reviews-widget-frame {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 150px;
	width: 150px;
	height: 50px;
	line-height: 0;
}

.reviews-widget-frame iframe {
	display: block;
	width: 150px;
	height: 50px;
	border: 0;
}

/* Виджет источника без официального embed (2ГИС) — иконка + рейтинг + звёзды + подпись, кликабельный.
   Высота/ширина подогнаны под соседний iframe-виджет (150x50), чтобы стояли на одной линии. */
.reviews-widget {
	display: flex;
	flex-direction: column;
	justify-content: center;
	flex: 0 0 150px;
	gap: 3px;
	width: 150px;
	height: 50px;
	padding: 0 14px;
	border-radius: 14px;
	background: #f8f9fb;
	border: 1px solid var(--redesign-line, #e8ebef);
	text-decoration: none !important;
	cursor: default;
	box-sizing: border-box;
	transition: border-color 0.2s ease, background-color 0.2s ease, transform 0.2s ease;
}

a.reviews-widget {
	cursor: pointer;
}

a.reviews-widget:hover {
	background: #fff;
	border-color: var(--src-color, #d8dce1);
	transform: translateY(-1px);
}

.reviews-widget__row {
	display: flex;
	align-items: center;
	gap: 6px;
}

.reviews-widget__icon {
	display: inline-flex;
	color: var(--src-color, #19aa3c);
}

.reviews-widget__icon svg {
	fill: currentColor;
}

.reviews-widget__rating {
	font-size: 15px;
	font-weight: 800;
	color: #1d1d1f;
	line-height: 1;
}

.reviews-widget__stars {
	position: relative;
	display: inline-block;
	font-size: 13px;
	line-height: 1;
	letter-spacing: 2px;
}

.reviews-widget__stars-bg {
	color: #d8dce1;
}

.reviews-widget__stars-fg {
	position: absolute;
	top: 0;
	left: 0;
	overflow: hidden;
	white-space: nowrap;
	color: #ffb400;
}

.reviews-widget__caption {
	font-size: 11px;
	line-height: 1.3;
	color: #8a919c;
	font-weight: 500;
	white-space: nowrap;
}

/* Слайдер (Swiper) */
.reviews-block__slider {
	overflow: hidden;
	padding-bottom: 8px;
}

.reviews-block__slider .swiper-wrapper {
	align-items: stretch;
}

.reviews-card {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	height: auto;
	padding: 0 6px;
	box-sizing: border-box;
}

.reviews-card__name {
	font-size: 18px;
	font-weight: 700;
	color: #1d1d1f;
	margin-bottom: 8px;
}

.reviews-card__stars {
	display: flex;
	gap: 3px;
	margin-bottom: 10px;
}

.reviews-star {
	font-size: 15px;
	line-height: 1;
	color: #d8dce1;
}

.reviews-star.is-on {
	color: #ffb400;
}

.reviews-card__source {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	height: 24px;
	padding: 0 12px;
	border-radius: 999px;
	background: #f5f7fa;
	color: #1d1d1f;
	font-size: 12px;
	font-weight: 700;
	margin-bottom: 16px;
}

.reviews-card__source::before {
	content: "";
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--src-color, #19aa3c);
}

.reviews-card__text {
	margin: 0;
	font-size: 14px;
	line-height: 1.55;
	color: #6f7782;
	text-align: left;
}

/* Пагинация (точки) */
.reviews-block__pagination {
	position: static;
	margin-top: 22px;
	display: flex;
	justify-content: center;
	gap: 7px;
}

.reviews-block__pagination .swiper-pagination-bullet {
	width: 7px;
	height: 7px;
	margin: 0 !important;
	background: #d8dce1;
	opacity: 1;
	transition: width 0.25s ease, background-color 0.25s ease;
}

.reviews-block__pagination .swiper-pagination-bullet-active {
	width: 22px;
	border-radius: 999px;
	background: #1d1d1f;
}

/* Стрелки навигации */
.reviews-block__nav {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 44px;
	height: 44px;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 1px solid var(--redesign-line, #e8ebef);
	border-radius: 50%;
	background: #fff;
	color: #1d1d1f;
	font-size: 22px;
	line-height: 1;
	cursor: pointer;
	box-shadow: 0 6px 18px rgba(18, 20, 23, 0.08);
	transition: background-color 0.2s ease, color 0.2s ease, transform 0.2s ease, opacity 0.2s ease;
	z-index: 3;
}

.reviews-block__nav:hover {
	background: #1d1d1f;
	color: #fff;
}

.reviews-block__nav--prev {
	left: -6px;
}

.reviews-block__nav--next {
	right: -6px;
}

.reviews-block__nav.swiper-button-disabled {
	opacity: 0;
	pointer-events: none;
}

.reviews-block__footer {
	margin-top: 28px;
	text-align: center;
}

.reviews-block__all {
	display: inline-flex;
	align-items: center;
	height: 46px;
	padding: 0 26px;
	border-radius: 999px;
	background: #1d1d1f;
	color: #fff !important;
	font-size: 14px;
	font-weight: 700;
	text-decoration: none !important;
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.reviews-block__all:hover {
	transform: translateY(-2px);
	box-shadow: 0 8px 22px rgba(18, 20, 23, 0.18);
}

/* ---------- Адаптив ---------- */
@media (max-width: 1199px) {
	.reviews-block__nav {
		display: none;
	}
}

@media (max-width: 767px) {
	.reviews-block {
		padding: 24px 18px 26px;
		border-radius: 22px;
	}

	.reviews-card {
		padding: 0;
	}

	.reviews-block__head {
		margin-bottom: 22px;
	}

	.reviews-block__widgets {
		gap: 8px;
	}
}

/* Совсем узкие экраны (iPhone SE и т.п.) — оба виджета 150px в ряд не влезают рядом с заголовком.
   Масштабируем оба вместе (сохраняя порядок и выравнивание по левому краю), не переносим на разные строки. */
@media (max-width: 380px) {
	.reviews-widget-frame,
	.reviews-widget {
		transform: scale(0.85);
		transform-origin: left center;
		margin-right: -22px;
	}
}
/*
 * Мобильные исправления блока «Отзывы».
 * Подключить после основного reviews.css или перенести правила в его конец.
 */

/* Золотые звёзды в карточках отзывов. */
.reviews-card__stars .reviews-star.is-on {
	color: #ffb400 !important;
}

/* Активная точка остаётся кругом, а не превращается в полоску. */
.reviews-block__pagination .swiper-pagination-bullet,
.reviews-block__pagination .swiper-pagination-bullet-active {
	width: 9px;
	height: 9px;
	border-radius: 50%;
}

.reviews-block__pagination .swiper-pagination-bullet-active {
	background: #1d1d1f;
}

@media (max-width: 767px) {
	/* Почти полная ширина экрана с аккуратными полями по 6px. */
	.reviews-block {
		width: calc(100% - 12px);
		padding: 24px 12px 26px;
	}

	/* Заголовок отдельно, оба рейтинга — следующей центрированной строкой. */
	.reviews-block__head {
		flex-direction: column;
		align-items: stretch;
		gap: 18px;
	}

	.reviews-block__widgets {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 150px));
		justify-content: center;
		align-items: center;
		gap: 8px;
		width: 100%;
	}

	.reviews-widget-frame,
	.reviews-widget {
		width: 100%;
		min-width: 0;
		margin: 0;
		transform: none;
	}

	.reviews-widget-frame iframe {
		width: 100%;
		max-width: 150px;
	}
}

@media (max-width: 380px) {
	/*
	 * Отменяем старое масштабирование: оно уменьшало виджеты только визуально,
	 * но сохраняло исходную ширину и из-за этого сдвигало ряд.
	 */
	.reviews-widget-frame,
	.reviews-widget {
		margin-right: 0;
		transform: none;
	}
}

