/* =============================================================
   Оптимизация под Яндекс.Браузер (Chromium/Blink).
   Сверено с макетом Figma wHMwC4tYOk01RTG3BaN3tz:
   Manrope 500/700/800, Cormorant 600/700, Primary #A67737.
   Подключается после tokens.css на всех страницах.
   ============================================================= */

/* --- Базовый рендеринг текста (кириллица, без синтетических начертаний) --- */
html {
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
	color-scheme: light;
}

body {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	font-synthesis: none;
	text-rendering: optimizeLegibility;
}

/* --- Sticky-шапка: префикс для старых сборок YaBrowser --- */
.site-topbar,
body.muzteatr-inner #masthead.site-header {
	position: -webkit-sticky;
	position: sticky;
}

/* --- Интерактив: без синей подсветки тапа, быстрый отклик --- */
:where(
	a,
	button,
	[role="button"],
	input,
	select,
	textarea,
	label,
	summary,
	.btn,
	.site-header__burger,
	.swiper-button-prev,
	.swiper-button-next
) {
	-webkit-tap-highlight-color: transparent;
	touch-action: manipulation;
}

/* --- Astra/Elementor: синие ссылки → токены Figma --- */
body.home .site-main a:not(.btn):not(.btn--card-qt):not(.btn--card-k24):not(.people-card__photo-link),
body.muzteatr-inner .site-main a:not(.btn):not(.btn--card-qt):not(.btn--card-k24):not(.people-card__photo-link):not(.site-header__founder):not(.faces-nav__link) {
	color: var(--c-text-heading);
}

body.home #masthead.site-header a:focus-visible,
body.muzteatr-inner #masthead.site-header a:focus-visible {
	outline-color: var(--c-primary);
}

/* --- line-clamp: -webkit + стандарт (YaBrowser 23+) --- */
.hero__desc,
.repertoire-card__desc,
.premiere-showcase__desc,
.home-news__grid .news-card__excerpt {
	line-clamp: 3;
}

.premiere-showcase__desc {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	overflow: hidden;
}

.hero__desc {
	line-clamp: var(--hero-desc-max-lines, 3);
}

@media (max-width: 767px) {
	.hero__desc {
		line-clamp: 1;
	}
}

/* --- backdrop-filter: fallback без blur (Turbo / слабые GPU) --- */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
	.hero__nav-btn,
	.event-modal::backdrop,
	.site-header.is-menu-open .site-header__nav-panel {
		backdrop-filter: none;
		-webkit-backdrop-filter: none;
	}

	.hero__nav-btn {
		background: rgba(10, 8, 6, 0.72);
	}

	.event-modal::backdrop {
		background: rgba(10, 8, 6, 0.82);
	}
}

/* --- Hero / Swiper: GPU-слой только на обёртке (translateZ на media размывает картинку/видео) --- */
.hero__swiper,
.hero__slide {
	transform: translateZ(0);
	-webkit-transform: translateZ(0);
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
}

/* --- Модалки: dvh с fallback для мобильного YaBrowser --- */
.event-modal dialog,
.show-lightbox dialog {
	max-height: calc(100vh - 2rem);
}

@supports (height: 100dvh) {
	.event-modal dialog,
	.show-lightbox dialog {
		max-height: calc(100dvh - 2rem);
	}
}

.event-modal dialog {
	overscroll-behavior: contain;
}

/* --- Горизонтальный скролл таблиц персон --- */
.person-bio__table-wrap {
	scrollbar-width: thin;
	scrollbar-color: var(--c-primary) var(--c-badge-light);
}

.person-bio__table-wrap::-webkit-scrollbar {
	height: 6px;
}

.person-bio__table-wrap::-webkit-scrollbar-thumb {
	background: var(--c-primary);
	border-radius: 3px;
}

/* --- Видео hero: аппаратное декодирование --- */
.hero__media--video {
	will-change: auto;
}

/* --- Галерея: превью видео не должно «проваливаться», если CDN недоступен --- */
.show-gallery__slide--video img {
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

@media (prefers-reduced-motion: reduce) {
	.hero__swiper,
	.hero__slide,
	.hero__media,
	.swiper-slide {
		transform: none;
		-webkit-transform: none;
	}
}

/* --- Шапка: YaBrowser flex/grid-баги + синхрон с header.css (Yalta ≥1800, широкая главная) --- */
@media (min-width: 1200px) {
	html.is-yabrowser body.home .site-header__inner.container,
	html.is-yabrowser body.home .site-header__inner {
		display: flex;
		align-items: center;
		flex-wrap: nowrap;
		max-width: min(var(--container-home-header, 1833px), calc(100vw - 48px));
		padding-inline: clamp(16px, 2vw, 32px);
	}

	html.is-yabrowser body.home .site-header__middle,
	html.is-yabrowser body.muzteatr-inner .site-header__middle {
		display: grid;
		grid-template-columns: minmax(0, 1fr) auto;
		align-items: center;
		column-gap: clamp(12px, 1.2vw, 24px);
		flex: 1 1 auto;
		min-width: 0;
		overflow: visible;
	}

	html.is-yabrowser body.home .site-header__nav,
	html.is-yabrowser body.muzteatr-inner .site-header__nav {
		grid-column: 1;
		min-width: 0;
		max-width: 100%;
		width: auto;
		flex: none;
		overflow: visible;
		padding-right: 0;
		box-sizing: border-box;
	}

	html.is-yabrowser body.home .site-header__yalta,
	html.is-yabrowser body.muzteatr-inner .site-header__yalta {
		grid-column: 2;
		flex-shrink: 0;
		min-width: max-content;
		margin-left: 0;
		padding-left: var(--header-yalta-line-gap);
		padding-right: var(--header-yalta-line-gap);
		border-left: 1px solid var(--c-divider-light);
		border-right: 1px solid var(--c-divider-light);
	}

	html.is-yabrowser body.home .site-header__yalta {
		border-left-color: rgba(255, 255, 255, 0.35);
		border-right-color: rgba(255, 255, 255, 0.35);
	}

	html.is-yabrowser body.home .site-header__phones,
	html.is-yabrowser body.muzteatr-inner .site-header__phones {
		min-width: max-content;
		flex-shrink: 0;
	}

	html.is-yabrowser body.home .main-menu,
	html.is-yabrowser body.muzteatr-inner .main-menu {
		gap: clamp(10px, 1.1vw, var(--header-inner-menu-gap));
		flex-wrap: nowrap;
		min-width: 0;
		max-width: 100%;
	}
}

/* Yalta только ≥1800px — иначе меню уезжает под логотип (YaBrowser) */
@media (min-width: 1200px) and (max-width: 1799px) {
	html.is-yabrowser body.home .site-header__yalta,
	html.is-yabrowser body.muzteatr-inner .site-header__yalta {
		display: none !important;
	}

	html.is-yabrowser body.home .site-header__middle,
	html.is-yabrowser body.muzteatr-inner .site-header__middle {
		display: block;
		grid-template-columns: minmax(0, 1fr);
	}
}

@media (min-width: 1800px) {
	html.is-yabrowser body.muzteatr-inner .site-header__inner.container,
	html.is-yabrowser body.muzteatr-inner .site-header__inner {
		display: flex;
		align-items: center;
		flex-wrap: nowrap;
		max-width: min(var(--container-home-header, 1833px), calc(100vw - 48px));
		padding-inline: clamp(16px, 2vw, 32px);
	}

	html.is-yabrowser body.muzteatr-inner .site-header__nav {
		overflow: visible;
	}
}

@media (min-width: 1800px) and (max-width: 1919px) {
	/* Узкий 1800–1920: на внутренних Ялту прячем — меню всё ещё не помещается */
	html.is-yabrowser body.muzteatr-inner .site-header__yalta {
		display: none !important;
	}

	html.is-yabrowser body.muzteatr-inner .site-header__middle {
		display: block;
		grid-template-columns: minmax(0, 1fr);
	}
}

@media (min-width: 1800px) {
	html.is-yabrowser body.home .main-menu,
	html.is-yabrowser body.muzteatr-inner .main-menu {
		gap: clamp(10px, 0.85vw, 18px);
	}
}

body.muzteatr-inner .site-header__middle,
body.home .site-header__middle {
	overflow: visible;
}

body.muzteatr-inner .site-header__nav {
	flex: 1 1 auto;
	min-width: 0;
	max-width: 100%;
}

@media (min-width: 1200px) {
	body.muzteatr-inner .site-header__nav {
		overflow: visible;
	}
}

body.muzteatr-inner .site-header__yalta {
	flex-shrink: 0;
	min-width: max-content;
}

/* Дубли телефонов внутри мобильного меню — не участвуют в сетке десктопа */
@media (min-width: 1200px) {
	.site-header__nav-extras .site-header__phones--menu {
		display: none !important;
	}
}

/* --- saveData / 2G: без blur и тяжёлых анимаций --- */
html.is-save-data .hero__nav-btn,
html.is-save-data .event-modal::backdrop {
	backdrop-filter: none !important;
	-webkit-backdrop-filter: none !important;
}

html.is-save-data .hero .swiper-slide-active .hero__info {
	animation: none !important;
}

html.is-save-data .hero__media--video {
	display: none !important;
}

html.is-save-data .hero__video-poster {
	opacity: 1 !important;
}

/* --- Карточки афиши: line-clamp + flex (стабильные даты в YaBrowser) --- */
.event-card__poster-link {
	aspect-ratio: var(--card-poster-ratio, 330 / 434);
	overflow: hidden;
}

.event-card__poster {
	width: 100%;
	height: 100%;
	max-width: 100%;
	object-fit: cover;
	object-position: center top;
}

.event-card__body {
	min-height: 0;
}

.event-card__title-row {
	height: calc(var(--fs-card-title, 22px) * 1.2 * 2);
	min-height: calc(var(--fs-card-title, 22px) * 1.2 * 2);
	flex: 0 0 auto;
}

.event-card__title-row .event-card__title {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	line-clamp: 2;
	overflow: hidden;
}

/* --- Карточка афиши: город + «Гастроли», кнопки билетов --- */
.event-card__place {
	min-width: 0;
}

.event-card__place-city {
	flex: 1 1 auto;
	min-width: 0;
}

.event-card__place-label {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.event-card__place-gastroli {
	flex-shrink: 0;
}

a.btn--card-qt,
a.btn--card-qt span {
	color: #fff;
}

a.btn--card-k24,
a.btn--card-k24 span {
	color: #5e421c;
}

.event-card__cta {
	min-width: 0;
}

.event-card__cta .btn--card-qt,
.event-card__cta .btn--card-k24 {
	min-width: 0;
}

.premiere-showcase__meta .badge--premiere {
	background: var(--c-primary);
	color: #fff;
}

.price-currency {
	font-weight: 400;
}

@media (max-width: 767px) {
	.event-card__place {
		gap: 8px;
	}

	.event-card__place-gastroli {
		max-width: 42%;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	.event-card__cta {
		flex-wrap: nowrap;
		gap: 8px;
	}

	.event-card__cta .btn--card-qt,
	.event-card__cta .btn--card-k24 {
		flex: 1 1 0;
		min-width: 0;
		padding: 6px;
		font-size: 10px;
	}
}

/* --- Премьеры: ряд бейджей не ломает вёрстку при 4+ метках --- */
.premiere-showcase__meta {
	flex-wrap: wrap;
	row-gap: 8px;
}

/* --- Подвал: колонки меню — выравнивание влево (Blink grid/flex) --- */
.site-footer__col,
.site-footer__col .footer-menu {
	align-items: flex-start;
	text-align: left;
}

/* --- PDF-афиша: встроенный просмотрщик Chromium / YaBrowser --- */
.afisha-pdf-dialog__embed {
	width: 100%;
	height: 100%;
	min-height: 60vh;
	border: 0;
	background: #fff;
}

@supports (height: 100dvh) {
	.afisha-pdf-dialog__embed {
		min-height: calc(100dvh - 12rem);
	}
}

.is-yabrowser .afisha-pdf-dialog__viewer {
	min-height: 70vh;
	background: #fff;
}

/* --- Hero: min-height fallback вместо только dvh --- */
.hero {
	min-height: 100vh;
}

@supports (height: 100dvh) {
	.hero {
		min-height: 100dvh;
	}
}

/* =============================================================
   Внутренние страницы: overflow, grid/flex, sticky-шапка
   ============================================================= */
body.muzteatr-inner #masthead.site-header {
	top: 0;
	overflow: visible;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

body.muzteatr-inner .inner-page,
body.muzteatr-inner .show-hero,
body.muzteatr-inner .show-hero > *,
body.muzteatr-inner .show-gallery__track,
body.muzteatr-inner .events-grid,
body.muzteatr-inner .news-grid,
body.muzteatr-inner .faces-grid,
body.muzteatr-inner .inner-link-grid,
body.muzteatr-inner .show-meta__row,
body.muzteatr-inner .show-cast__grid {
	min-width: 0;
}

body.muzteatr-inner .show-hero__title-row {
	flex-wrap: wrap;
}

body.muzteatr-inner .inner-page__wrap.container {
	box-sizing: border-box;
}

/* Lightbox на внутренних: dvh + компактные отступы на мобиле */
.show-gallery__lightbox,
.person-gallery__lightbox,
.event-modal__lightbox {
	max-height: calc(100vh - 48px);
}

.show-gallery__lightbox-figure,
.person-gallery__lightbox-figure,
.event-modal__lightbox-figure {
	min-height: min(70vh, 560px);
}

.show-gallery__lightbox-img,
.person-gallery__lightbox-img,
.event-modal__lightbox-img {
	max-height: calc(100vh - 120px);
}

@supports (height: 100dvh) {
	.show-gallery__lightbox,
	.person-gallery__lightbox,
	.event-modal__lightbox {
		max-height: calc(100dvh - 48px);
	}

	.show-gallery__lightbox-figure,
	.person-gallery__lightbox-figure,
	.event-modal__lightbox-figure {
		min-height: min(70dvh, 560px);
	}

	.show-gallery__lightbox-img,
	.person-gallery__lightbox-img,
	.event-modal__lightbox-img {
		max-height: calc(100dvh - 120px);
	}
}

@media (max-width: 767px) {
	.show-gallery__lightbox,
	.person-gallery__lightbox,
	.event-modal__lightbox {
		width: calc(100vw - 24px);
		padding: 48px 12px;
	}

	.show-gallery__lightbox-nav--prev,
	.person-gallery__lightbox-nav--prev,
	.event-modal__lightbox-nav--prev {
		left: 8px;
	}

	.show-gallery__lightbox-nav--next,
	.person-gallery__lightbox-nav--next,
	.event-modal__lightbox-nav--next {
		right: 8px;
	}
}

/* Таблицы и навигация «Лица театра» */
.person-bio__table-wrap,
.faces-nav__list {
	-webkit-overflow-scrolling: touch;
	overscroll-behavior-x: contain;
}

/* Карточки-ссылки: clip-path с запасным скруглением */
.inner-link-grid__tile {
	-webkit-clip-path: polygon(0 0, 100% 0, 100% calc(100% - 28px), calc(100% - 28px) 100%, 0 100%);
}

@supports not (clip-path: polygon(0 0)) {
	.inner-link-grid__tile {
		clip-path: none;
		border-bottom-right-radius: 0;
	}
}

/* =============================================================
   display:contents → flex-fallback только в YaBrowser
   (галереи спектаклей, репертуар/премьеры на главной)
   ============================================================= */
@media (min-width: 1024px) {
	.is-yabrowser .show-gallery__slider-wrap {
		display: flex;
		align-items: center;
		gap: var(--gallery-btn-gap);
	}

	.is-yabrowser .show-gallery__track {
		flex: 1 1 auto;
		min-width: 0;
		order: 2;
	}

	.is-yabrowser .show-gallery__btn--prev {
		order: 1;
		flex-shrink: 0;
	}

	.is-yabrowser .show-gallery__btn--next {
		order: 3;
		flex-shrink: 0;
	}
}

.is-yabrowser .repertoire__slider-wrap,
.is-yabrowser .premiere__slider-wrap {
	display: flex;
	align-items: center;
	gap: clamp(8px, 1.5vw, 20px);
}

.is-yabrowser .repertoire__swiper,
.is-yabrowser .premiere__swiper {
	flex: 1 1 auto;
	min-width: 0;
	order: 2;
}

.is-yabrowser .repertoire__nav-row .swiper-button-prev,
.is-yabrowser .premiere__nav-row .swiper-button-prev {
	order: 1;
	flex-shrink: 0;
}

.is-yabrowser .repertoire__nav-row .swiper-button-next,
.is-yabrowser .premiere__nav-row .swiper-button-next {
	order: 3;
	flex-shrink: 0;
}

/* =============================================================
   Мобильная вёрстка: шапка, меню, горизонтальный скролл
   ============================================================= */
@media (max-width: 1199px) {
	body.home,
	body.muzteatr-inner,
	body.muzteatr-faces {
		overflow-x: hidden;
	}

	.site-header__nav {
		overscroll-behavior: contain;
	}

	/* Inner mobile header: flex вместо grid + display:contents */
	html.is-yabrowser body.muzteatr-inner .site-header__inner {
		display: flex;
		align-items: center;
		justify-content: space-between;
		column-gap: 12px;
	}

	html.is-yabrowser body.muzteatr-inner .site-header__middle {
		display: flex;
		flex: 1 1 auto;
		align-items: center;
		justify-content: center;
		min-width: 0;
		order: 2;
	}

	html.is-yabrowser body.muzteatr-inner .site-header__aside {
		display: flex;
		flex: 0 0 auto;
		align-items: center;
		order: 3;
	}

	html.is-yabrowser body.muzteatr-inner .site-header__utils,
	html.is-yabrowser body.muzteatr-inner .site-header__cta {
		display: flex;
		align-items: center;
		margin-left: 0;
	}

	html.is-yabrowser body.muzteatr-inner .site-header__a11y:not(.site-header__a11y--menu) {
		order: 1;
		flex: 0 0 36px;
		grid-column: unset;
		grid-row: unset;
	}

	html.is-yabrowser body.muzteatr-inner .site-header__burger {
		flex: 0 0 48px;
		grid-column: unset;
		grid-row: unset;
	}

	html.is-yabrowser body.muzteatr-inner .site-header__brand,
	html.is-yabrowser body.muzteatr-inner .site-header__logo {
		grid-column: unset;
		grid-row: unset;
	}

	/* Home mobile: utils/cta без contents */
	html.is-yabrowser body.home .site-header__utils,
	html.is-yabrowser body.home .site-header__cta {
		display: flex;
		align-items: center;
		margin-left: 0;
	}
}

@media (max-width: 767px) {
	body.muzteatr-inner .inner-page {
		padding-top: 28px;
	}

	body.muzteatr-inner .breadcrumbs {
		font-size: 13px;
	}

	body.muzteatr-inner .inner-page__title,
	body.muzteatr-inner .show-hero__title {
		word-break: break-word;
		hyphens: auto;
		-webkit-hyphens: auto;
	}

	.contacts-map iframe,
	.contacts-map__embed {
		max-width: 100%;
	}
}

