/*
 * Шаблон афиши.
 *
 * Каркас страницы свой (index.php), сетка и утилиты — Bootstrap 5 от
 * Cassiopeia. Здесь то, чего в бутстрапе нет: шапка, лента дат, карточки
 * событий с постерами.
 */

:root {
	/* Калининградская палитра: Балтика — основной цвет ссылок и меню,
	   янтарь — тёплый акцент для «сегодня», цен и текущего города,
	   балтийский туман — холодный светлый фон страницы. */
	--af-baltic: #1b4f7a;
	--af-baltic-deep: #123655;
	--af-amber: #e79a16;
	--af-amber-ink: #3a2400;

	--af-bg: #eef2f3;
	--af-surface: #ffffff;
	--af-text: #1b2530;
	--af-muted: #5e6b76;
	--af-border: #d5dde1;
	--af-accent: var(--af-baltic);
	--af-accent-ink: #ffffff;
	--af-warm: var(--af-amber);
	--af-warm-ink: var(--af-amber-ink);
	--af-radius: 10px;
	--af-shadow: 0 1px 0 rgba(27, 37, 48, .04);

	--af-font: "Onest", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	--af-display: "Unbounded", "Onest", system-ui, sans-serif;
	--af-wrap: 1240px;
	--af-gutter: clamp(16px, 4vw, 32px);
}

@media (prefers-color-scheme: dark) {
	:root {
		--af-bg: #0e171d;
		--af-surface: #15222a;
		--af-text: #e8eef1;
		--af-muted: #94a6b0;
		--af-border: #23343e;
		--af-accent: #7fb2e0;
		--af-accent-ink: #0b1f33;
		--af-shadow: none;
	}
}

body.afisha-site {
	background: var(--af-bg);
	color: var(--af-text);
	font-family: var(--af-font);
	font-feature-settings: "kern", "liga";
	-webkit-font-smoothing: antialiased;
}

/* Своя обёртка вместо container-xxl: ширина и поля в одном месте */
.afisha-wrap {
	width: 100%;
	max-width: calc(var(--af-wrap) + 2 * var(--af-gutter));
	margin-inline: auto;
	padding-inline: var(--af-gutter);
}

a {
	color: var(--af-accent);
}

:focus-visible {
	outline: 2px solid var(--af-warm);
	outline-offset: 2px;
}

/* --- Шапка ----------------------------------------------------------------- */

/* Шапка тёмная, цвета Балтики: отделяет навигацию от светлого фона страницы
   и держит логотип на месте, пока лента разделов прокручивается вбок. */
.afisha-header {
	position: sticky;
	top: 0;
	z-index: 1030;
	background: var(--af-baltic-deep);
	color: #fff;
}

.afisha-header__bar {
	display: flex;
	align-items: center;
	gap: clamp(1rem, 2vw, 1.5rem);
	min-height: 64px;
}

/* --- Переключатель города ---------------------------------------------------- */

.afisha-city {
	position: relative;
	flex: 0 0 auto;
	margin-left: calc(-1 * clamp(.25rem, 1vw, .75rem));
}

.afisha-city__current {
	display: inline-flex;
	align-items: center;
	gap: .35rem;
	padding: .3rem .65rem;
	border: 1px solid rgba(255, 255, 255, .35);
	border-radius: 999px;
	color: #fff;
	font-size: .9rem;
	font-weight: 600;
	list-style: none;
	cursor: pointer;
	user-select: none;
}

.afisha-city__current::-webkit-details-marker {
	display: none;
}

/* Уголок рисуем рамкой: шрифтовая стрелка на разных системах разная */
.afisha-city__current::after {
	content: "";
	width: .38em;
	height: .38em;
	margin-top: -.2em;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(45deg);
	transition: transform .15s;
}

.afisha-city[open] .afisha-city__current::after {
	margin-top: .15em;
	transform: rotate(-135deg);
}

.afisha-city__current:hover,
.afisha-city[open] .afisha-city__current {
	border-color: var(--af-warm);
}

.afisha-city__current:focus-visible {
	outline: 2px solid var(--af-warm);
	outline-offset: 2px;
}

.afisha-city__list {
	position: absolute;
	z-index: 20;
	top: calc(100% + .4rem);
	left: 0;
	min-width: 11rem;
	margin: 0;
	padding: .35rem;
	border: 1px solid var(--af-border);
	border-radius: var(--af-radius);
	background: var(--af-surface);
	box-shadow: 0 8px 24px rgba(27, 37, 48, .12);
	list-style: none;
}

/* Когда разделы уходят во вторую строку, кнопка стоит у правого края
   первой — список раскрываем влево, иначе он вылезает за экран */
@media (max-width: 1319.98px) {
	.afisha-city {
		margin-left: auto;
	}

	.afisha-city__list {
		right: 0;
		left: auto;
	}
}

.afisha-city__list a,
.afisha-city__list span {
	display: block;
	padding: .5rem .7rem;
	border-radius: calc(var(--af-radius) - 4px);
	color: var(--af-text);
	text-decoration: none;
}

.afisha-city__list a:hover,
.afisha-city__list a:focus-visible {
	background: var(--af-bg);
	color: var(--af-accent);
}

.afisha-city__list span {
	color: var(--af-muted);
	font-weight: 600;
}

.afisha-logo {
	display: inline-flex;
	flex: 0 0 auto;
	align-items: center;
	gap: .55rem;
	color: inherit;
	font-family: var(--af-display);
	font-size: 1.05rem;
	font-weight: 700;
	letter-spacing: -.02em;
	text-decoration: none;
	white-space: nowrap;
}

.afisha-logo:hover {
	color: inherit;
}

/* Знак — капля янтаря: акцентный цвет с бликом, остриём вверх */
.afisha-logo__mark {
	width: 16px;
	height: 16px;
	border-radius: 0 50% 50% 50%;
	transform: rotate(45deg);
	background: radial-gradient(circle at 40% 40%, #ffd98a 0 18%, var(--af-warm) 22% 100%);
}

.afisha-nav {
	flex: 1 1 auto;
	min-width: 0;
	/* Разделов больше, чем влезает в узкий экран: лента прокручивается, а не
	   переносится в две строки */
	overflow-x: auto;
	scrollbar-width: none;
}

.afisha-nav::-webkit-scrollbar {
	display: none;
}

.afisha-nav__list {
	display: flex;
	align-items: center;
	gap: .15rem;
	margin: 0;
	padding: 0;
	list-style: none;
	white-space: nowrap;
}

.afisha-nav__link {
	display: block;
	padding: .5rem .6rem;
	border-radius: 999px;
	color: rgba(255, 255, 255, .82);
	font-size: .93rem;
	font-weight: 500;
	text-decoration: none;
	cursor: pointer;
	list-style: none;
}

.afisha-nav__link::-webkit-details-marker {
	display: none;
}

.afisha-nav__link:hover {
	background: rgba(255, 255, 255, .08);
	color: #fff;
}

.afisha-nav__item.is-active > .afisha-nav__link,
.afisha-nav__item.is-active > details > .afisha-nav__link {
	background: #fff;
	color: var(--af-baltic-deep);
}

/* Разделитель между афишей и остальными пунктами: «Места» — уже не афиша */
.afisha-nav__item--split {
	margin-left: .5rem;
	padding-left: .5rem;
	border-left: 1px solid rgba(255, 255, 255, .18);
}

.afisha-nav__group > summary::after {
	content: "";
	display: inline-block;
	width: .4em;
	height: .4em;
	margin-left: .45em;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: translateY(-.2em) rotate(45deg);
}

.afisha-nav__group[open] > summary::after {
	transform: translateY(.05em) rotate(-135deg);
}

/* Выпадающая панель позиционируется от шапки, а не от ленты: у ленты
   overflow, и внутри неё панель обрезалась бы */
.afisha-nav__panel {
	position: absolute;
	top: 100%;
	left: 0;
	right: 0;
	padding: 1.25rem 0 1.5rem;
	background: var(--af-surface);
	border-bottom: 1px solid var(--af-border);
	box-shadow: 0 18px 30px -18px rgba(18, 54, 85, .35);
}

.afisha-nav__sub {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
	gap: .25rem 1.5rem;
	width: 100%;
	max-width: calc(var(--af-wrap) + 2 * var(--af-gutter));
	margin: 0 auto;
	padding: 0 var(--af-gutter);
	list-style: none;
	white-space: normal;
}

.afisha-nav__sub a {
	display: block;
	padding: .45rem 0;
	color: var(--af-text);
	font-weight: 500;
	text-decoration: none;
}

.afisha-nav__sub a:hover,
.afisha-nav__sub a[aria-current] {
	color: var(--af-accent);
}

/* Логотип, город и девять разделов в одну строку помещаются только от
   ~1320px. Уже — лента разделов уходит второй строкой во всю ширину:
   прокрутка вбок на компьютере незаметна, и «ТВ программа» обрезалась */
@media (max-width: 1319.98px) {
	.afisha-header__bar {
		flex-wrap: wrap;
		gap: 0;
		padding-top: .6rem;
	}

	/* Лента разделов уходит под логотип во всю ширину и прокручивается
	   до края экрана */
	.afisha-nav {
		flex-basis: 100%;
		margin-inline: calc(-1 * var(--af-gutter));
		padding: .4rem var(--af-gutter) .6rem;
	}
}

/* --- Основная часть --------------------------------------------------------- */

.afisha-main {
	padding: 2rem 0 3rem;
}

.afisha-main > .container-xxl > .mod-breadcrumbs__wrapper {
	margin-bottom: 1.25rem;
}

.afisha-main h1,
.afisha-main .page-header h1 {
	font-size: clamp(1.6rem, 1.2rem + 1.8vw, 2.4rem);
	font-weight: 700;
	letter-spacing: -.02em;
	margin-bottom: 1.25rem;
}

/* --- Лента дат -------------------------------------------------------------- */

.afisha-dates {
	position: relative;
	margin-bottom: 1.75rem;
	/* Лента шире экрана прокручивается внутри себя, а не тянет страницу */
	max-width: 100%;
	overflow-x: auto;
	scrollbar-width: thin;
}

/* Компонент отдаёт даты списком ссылок — раскладываем в горизонтальную
   прокручиваемую ленту вместо вертикального столбца. */
.afisha-dates ul,
.afisha-dates .linesdate,
.afisha-dates .datestandart,
.afisha-dates > div {
	display: flex;
	flex-wrap: nowrap;
	gap: .5rem;
	margin: 0;
	padding: 0 0 .5rem;
	overflow-x: auto;
	list-style: none;
	scrollbar-width: thin;
	scroll-snap-type: x proximity;
}

.afisha-dates li {
	flex: 0 0 auto;
	scroll-snap-align: start;
}

.afisha-dates a {
	display: flex;
	flex-direction: column;
	align-items: center;
	min-width: 62px;
	padding: .5rem .7rem;
	border: 1px solid var(--af-border);
	border-radius: var(--af-radius);
	background: var(--af-surface);
	color: var(--af-text);
	font-size: .85rem;
	line-height: 1.3;
	text-decoration: none;
	white-space: nowrap;
	transition: border-color .15s ease, transform .15s ease;
}

.afisha-dates a:hover {
	border-color: var(--af-accent);
	transform: translateY(-1px);
}

.afisha-dates .active a,
.afisha-dates a.active {
	background: var(--af-accent);
	border-color: var(--af-accent);
	color: var(--af-accent-ink);
}

/* --- Сетка и заголовки ------------------------------------------------------ */

.afisha-section {
	margin-bottom: 2.5rem;
}

.afisha-section__title {
	font-size: 1.25rem;
	font-weight: 700;
	letter-spacing: -.01em;
	margin-bottom: 1rem;
}

.afisha-day {
	margin: 1.5rem 0 .75rem;
	padding-bottom: .5rem;
	border-bottom: 1px solid var(--af-border);
	color: var(--af-muted);
	font-size: .95rem;
	font-weight: 500;
}

.afisha-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
	gap: 1.25rem;
}

/* У площадок обложки горизонтальные, а не постеры */
.afisha-grid--places {
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
}

.afisha-grid--places .afisha-card__media img {
	aspect-ratio: 3 / 2;
}

.afisha-intro {
	max-width: 70ch;
	margin-bottom: 1.5rem;
	color: var(--af-muted);
}

.afisha-empty {
	padding: 3rem 0;
	color: var(--af-muted);
	text-align: center;
}

.afisha-pagination {
	display: flex;
	flex-wrap: wrap;
	gap: .35rem;
	justify-content: center;
	margin-top: 2rem;
}

.afisha-pagination a,
.afisha-pagination span {
	min-width: 38px;
	padding: .4rem .6rem;
	border: 1px solid var(--af-border);
	border-radius: 10px;
	text-align: center;
	text-decoration: none;
	color: var(--af-text);
}

.afisha-pagination span[aria-current] {
	background: var(--af-text);
	border-color: var(--af-text);
	color: var(--af-bg);
}

/* --- Карточка события ------------------------------------------------------- */

.afisha-card {
	position: relative;
	height: 100%;
	background: var(--af-surface);
	border: 1px solid var(--af-border);
	border-radius: var(--af-radius);
	overflow: hidden;
	transition: transform .18s ease, box-shadow .18s ease;
}

.afisha-card:hover {
	transform: translateY(-3px);
	box-shadow: var(--af-shadow);
}

.afisha-card__media {
	position: relative;
	display: block;
	background: color-mix(in srgb, var(--af-text) 6%, transparent);
}

/* Постеры от парсера приходят разного размера — приводим к единой пропорции,
   иначе сетка разъезжается по высоте. */
.afisha-card__media img {
	display: block;
	width: 100%;
	aspect-ratio: 2 / 3;
	object-fit: cover;
	transition: transform .35s ease;
}

.afisha-card:hover .afisha-card__media img {
	transform: scale(1.04);
}

.afisha-card__age {
	position: absolute;
	inset-block-start: .5rem;
	inset-inline-end: .5rem;
	padding: .15rem .4rem;
	border-radius: 6px;
	background: rgba(0, 0, 0, .65);
	color: #fff;
	font-size: .72rem;
	line-height: 1.4;
}

.afisha-card__body {
	display: flex;
	flex-direction: column;
	gap: .35rem;
	padding: .85rem .9rem 1rem;
}

.afisha-card__title {
	margin: 0;
	font-size: 1rem;
	font-weight: 600;
	line-height: 1.25;
	letter-spacing: -.01em;
}

.afisha-card__title a {
	color: inherit;
	text-decoration: none;
}

.afisha-card__title a::after {
	content: "";
	position: absolute;
	inset: 0;
}

.afisha-card:hover .afisha-card__title a {
	color: var(--af-accent);
}

.afisha-card__meta {
	color: var(--af-muted);
	font-size: .85rem;
}

.afisha-card__place {
	position: relative;
	z-index: 1;
	margin-top: .25rem;
	padding-top: .5rem;
	border-top: 1px solid var(--af-border);
	font-size: .85rem;
}

.afisha-card__place a {
	color: var(--af-muted);
	text-decoration: none;
}

.afisha-card__place a:hover {
	color: var(--af-accent);
}

/* --- Сеансы ----------------------------------------------------------------- */

.afisha-times {
	display: flex;
	flex-wrap: wrap;
	gap: .25rem;
	margin-top: .35rem;
}

/* Компонент помечает время классом .badge — у Bootstrap он красит текст
   в белый, и на светлой карточке время становится невидимым. */
.afisha-times a,
.afisha-times span,
.afisha-times .badge,
.seanse_time {
	color: var(--af-text);
	background: transparent;
	display: inline-block;
	padding: .1rem .4rem;
	border: 1px solid var(--af-border);
	border-radius: 6px;
	font-size: .8rem;
	font-variant-numeric: tabular-nums;
	line-height: 1.5;
	text-decoration: none;
	white-space: nowrap;
}

.afisha-times a:hover {
	border-color: var(--af-accent);
	color: var(--af-accent);
}

.inpast {
	color: color-mix(in srgb, var(--af-muted) 60%, transparent);
	text-decoration: line-through;
}

/* Сводка по прокату вместо списка сеансов: у фильма бывает полторы сотни
   кинотеатров, и перечисление растягивало карточку в пять раз выше постера */
.afisha-card__summary {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .4rem;
	margin: 0;
	color: var(--af-muted);
	font-size: .875rem;
}

/* Цена уходит на свою строку: в узкой карточке разделитель при переносе
   всё равно оставался висеть — то в конце строки, то в начале следующей */
.afisha-card__price,
.afisha-card__when {
	flex-basis: 100%;
}

/* Время подписано словом, сами часы выделены — иначе цифра читалась как
   что угодно: первый сеанс, ближайший, единственный */
.afisha-card__when b {
	color: var(--af-text);
	font-weight: 600;
	font-variant-numeric: tabular-nums;
}

.afisha-card__soon {
	padding: .15rem .45rem;
	border-radius: 6px;
	background: color-mix(in srgb, var(--af-accent) 12%, transparent);
	color: var(--af-accent);
	font-weight: 600;
	font-variant-numeric: tabular-nums;
}

@media (prefers-color-scheme: dark) {
	.afisha-card__soon {
		background: color-mix(in srgb, var(--af-accent) 22%, transparent);
		color: #ff8a99;
	}
}

/* --- Страница события ------------------------------------------------------- */

.afisha-hero {
	display: grid;
	grid-template-columns: minmax(0, 300px) minmax(0, 1fr);
	gap: 2rem;
	margin-bottom: 2.5rem;
}

@media (max-width: 767.98px) {
	.afisha-hero {
		grid-template-columns: 1fr;
		gap: 1.25rem;
	}
}

.afisha-hero__poster {
	position: relative;
	align-self: start;
	border-radius: var(--af-radius);
	overflow: hidden;
	background: color-mix(in srgb, var(--af-text) 6%, transparent);
}

.afisha-hero__poster img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 2 / 3;
	object-fit: cover;
}

@media (max-width: 767.98px) {
	/* Во всю ширину постер занимает целый экран — ограничиваем */
	.afisha-hero__poster {
		max-width: 220px;
	}
}

/* У площадок снимки горизонтальные, вертикальная пропорция постера их режет */
.afisha-hero--place .afisha-hero__poster img {
	aspect-ratio: 3 / 2;
}

.afisha-hero__title {
	font-size: clamp(1.7rem, 1.2rem + 2vw, 2.6rem);
	font-weight: 700;
	letter-spacing: -.02em;
	margin-bottom: .35rem;
}

.afisha-hero__original {
	margin-bottom: 1rem;
	color: var(--af-muted);
	font-size: 1.05rem;
}

.afisha-hero__facts {
	margin-bottom: 1rem;
	color: var(--af-muted);
}

/* Страна, год и жанр — ссылки на поиск, но выглядеть должны как часть строки */
.afisha-hero__facts .tag {
	color: inherit;
	text-decoration: none;
}

.afisha-hero__facts .tag:hover {
	color: var(--af-text);
	text-decoration: underline;
}

.afisha-sep {
	opacity: .5;
	padding: 0 .15rem;
}

.afisha-ratings {
	display: flex;
	flex-wrap: wrap;
	gap: .75rem;
	margin-bottom: 1.25rem;
}

.afisha-rating {
	display: inline-flex;
	align-items: baseline;
	gap: .4rem;
	padding: .35rem .7rem;
	border: 1px solid var(--af-border);
	border-radius: 999px;
	color: var(--af-muted);
	font-size: .85rem;
}

.afisha-rating b {
	color: var(--af-text);
	font-size: 1.05rem;
}

.afisha-rating i {
	font-style: normal;
	opacity: .65;
}

/* Роли и участники: подпись слева, список ссылок справа */
.afisha-facts {
	display: grid;
	grid-template-columns: minmax(90px, max-content) minmax(0, 1fr);
	gap: .4rem 1rem;
	margin-bottom: 1.5rem;
}

.afisha-facts dt {
	color: var(--af-muted);
	font-weight: 400;
}

.afisha-facts dd {
	margin: 0;
}

.afisha-hero__description {
	max-width: 70ch;
	margin-bottom: 1.5rem;
	line-height: 1.65;
}

.afisha-tags {
	display: flex;
	flex-wrap: wrap;
	gap: .4rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.afisha-tags a {
	display: inline-block;
	padding: .3rem .7rem;
	border-radius: 999px;
	background: color-mix(in srgb, var(--af-text) 6%, transparent);
	color: var(--af-muted);
	font-size: .85rem;
	text-decoration: none;
}

.afisha-tags a:hover {
	color: var(--af-text);
}

.afisha-trailer__frame {
	position: relative;
	max-width: 860px;
	aspect-ratio: 16 / 9;
	border-radius: var(--af-radius);
	overflow: hidden;
	background: #000;
}

.afisha-trailer__frame iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
}

.afisha-trailer__frame .afisha-embed {
	position: absolute;
	inset: 0;
	margin: 0;
	aspect-ratio: auto;
	border-radius: 0;
}

/* --- Расписание -------------------------------------------------------------- */

.afisha-schedule {
	margin: 0;
	padding: 0;
	list-style: none;
	border: 1px solid var(--af-border);
	border-radius: var(--af-radius);
	overflow: hidden;
}

.afisha-schedule__row {
	display: grid;
	grid-template-columns: minmax(0, 260px) minmax(0, 1fr);
	gap: .75rem 1.5rem;
	padding: .9rem 1rem;
	background: var(--af-surface);
}

.afisha-schedule__row + .afisha-schedule__row {
	border-top: 1px solid var(--af-border);
}

@media (max-width: 575.98px) {
	.afisha-schedule__row {
		grid-template-columns: 1fr;
	}
}

.afisha-schedule__place a {
	color: var(--af-text);
	font-weight: 500;
	text-decoration: none;
}

.afisha-schedule__place a:hover {
	color: var(--af-accent);
}

.afisha-schedule__price {
	display: block;
	margin-top: .2rem;
	color: var(--af-muted);
	font-size: .85rem;
}

/* Сеансы приходят от хелпера набором .badge — у бутстрапа они белые
   на белом фоне карточки, поэтому цвет и фон задаём сами. */
.afisha-times {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .35rem;
}

.afisha-times .badge {
	padding: .35rem .55rem;
	border: 1px solid var(--af-border);
	border-radius: 8px;
	background: transparent;
	color: var(--af-text);
	font-size: .9rem;
	font-weight: 500;
}

.afisha-times > span:not(.badge) {
	margin-inline-end: .25rem;
	color: var(--af-muted);
	font-size: .85rem;
}

.afisha-weeknav {
	display: flex;
	justify-content: space-between;
	gap: 1rem;
	margin-top: 1.25rem;
}

.afisha-weeknav a {
	color: var(--af-muted);
	font-size: .9rem;
	text-decoration: none;
}

.afisha-weeknav a:hover {
	color: var(--af-text);
}

/* --- Подвал ------------------------------------------------------------------ */

.afisha-footer {
	margin-top: 0;
	padding: 3rem 0 2rem;
	background: var(--af-baltic-deep);
	color: rgba(255, 255, 255, .72);
	font-size: .92rem;
}

.afisha-footer__cols {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
	gap: 2rem 2.5rem;
	padding-bottom: 2.5rem;
	border-bottom: 1px solid rgba(255, 255, 255, .14);
}

.afisha-footer__title {
	margin: 0 0 .8rem;
	color: #fff;
	font-family: var(--af-display);
	font-size: .95rem;
	font-weight: 600;
}

.afisha-footer__list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.afisha-footer__list li + li {
	margin-top: .35rem;
}

.afisha-footer a {
	color: rgba(255, 255, 255, .78);
	text-decoration: none;
}

.afisha-footer a:hover {
	color: #fff;
	text-decoration: underline;
	text-underline-offset: 3px;
}

.afisha-footer__bottom {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .75rem 1.5rem;
	padding-top: 1.5rem;
}

.afisha-footer__bottom .afisha-logo {
	color: #fff;
}

.afisha-footer__copy {
	flex: 1 1 320px;
	margin: 0;
}

.afisha-footer__age {
	margin: 0;
	padding: .1rem .45rem;
	border: 1px solid rgba(255, 255, 255, .45);
	border-radius: 4px;
	color: #fff;
	font-size: .8rem;
	font-weight: 600;
}

.afisha-footer__consent {
	padding: 0;
	border: 0;
	background: none;
	color: rgba(255, 255, 255, .78);
	font: inherit;
	cursor: pointer;
}

.afisha-footer__consent:hover {
	color: #fff;
	text-decoration: underline;
	text-underline-offset: 3px;
}

.afisha-footer__owner,
.afisha-footer__note {
	margin: 1rem 0 0;
	color: rgba(255, 255, 255, .6);
	font-size: .82rem;
	line-height: 1.5;
}

/* --- Видео с зарубежных сервисов: по клику ----------------------------------- */

.afisha-embed {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: .75rem;
	aspect-ratio: 16 / 9;
	max-width: 100%;
	margin: 1rem 0;
	padding: 1.5rem;
	border-radius: var(--af-radius);
	background: var(--af-baltic-deep);
	color: rgba(255, 255, 255, .8);
	text-align: center;
}

.afisha-embed.is-loaded {
	padding: 0;
	background: #000;
}

.afisha-embed iframe {
	width: 100%;
	height: 100%;
	border: 0;
	border-radius: var(--af-radius);
}

.afisha-embed__play {
	padding: .7rem 1.3rem;
	border: 0;
	border-radius: 999px;
	background: #fff;
	color: var(--af-baltic-deep);
	font: inherit;
	font-weight: 600;
	cursor: pointer;
}

.afisha-embed__play::before {
	content: "\25B6\FE0E";
	margin-right: .5rem;
}

.afisha-embed__note {
	max-width: 32rem;
	margin: 0;
	font-size: .82rem;
}

.afisha-embed__note a {
	color: #fff;
}

.afisha-registry {
	margin-top: 1.5rem;
	padding-top: .75rem;
	border-top: 1px solid var(--af-border);
	color: var(--af-muted);
	font-size: .82rem;
}

.afisha-registry p {
	margin: .25rem 0;
}

/* --- Уведомление о cookie ------------------------------------------------------ */

.cookie-consent {
	position: fixed;
	right: 1rem;
	bottom: calc(1rem + env(safe-area-inset-bottom, 0px));
	left: 1rem;
	z-index: 1000;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .75rem 1.25rem;
	max-width: 56rem;
	margin: 0 auto;
	padding: 1rem 1.25rem;
	border: 1px solid var(--af-border);
	border-radius: 12px;
	background: var(--af-surface);
	box-shadow: 0 8px 32px rgba(0, 0, 0, .18);
	color: var(--af-text);
	font-size: .9rem;
	line-height: 1.45;
}

.cookie-consent[hidden] {
	display: none;
}

.cookie-consent__text {
	flex: 1 1 22rem;
	margin: 0;
}

.cookie-consent__actions {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem;
}

.cookie-consent__btn {
	padding: .55rem 1rem;
	border: 1px solid var(--af-accent);
	border-radius: 8px;
	background: transparent;
	color: var(--af-accent);
	font: inherit;
	font-weight: 600;
	cursor: pointer;
}

.cookie-consent__btn--primary {
	background: var(--af-accent);
	color: var(--af-accent-ink);
}

.cookie-consent a {
	color: var(--af-accent);
}

/* --- Блок проданных ссылок ---------------------------------------------------- */

/* Стоит в основной колонке, на всю ширину, над подвалом — на каждой странице.
   Прятать блок нельзя: display:none, visibility:hidden, нулевой размер,
   вынос за экран и мелкий шрифт биржа считает неразмещением, а поисковик —
   обманом. Поэтому оформление только раскладывает объявления сеткой. */
.afisha-links-zone {
	padding-block: 2.5rem 3rem;
}

.afisha-links {
	padding-top: 1.75rem;
	border-top: 2px solid var(--af-text);
}

.afisha-links__title {
	margin: 0 0 1.25rem;
	color: var(--af-text);
	font-family: var(--af-display);
	font-size: 1.15rem;
	font-weight: 600;
	letter-spacing: -.01em;
}

.afisha-links__grid {
	margin: 0;
	padding: 0;
	list-style: none;
}

/* Биржа отдаёт все объявления страницы одним блоком со своей таблицей
   стилей: <div class="block_links"><ul><li class="block_links_icnt">…
   Её правила идут с !important по селектору «.block_links *», поэтому
   перекрываем их тем же весом и более длинным селектором. */
.afisha-links .block_links {
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	background: transparent !important;
}

.afisha-links .block_links ul {
	display: grid !important;
	grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)) !important;
	gap: 1rem !important;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}

.afisha-links .block_links li.block_links_icnt {
	display: block !important;
	width: auto !important;
	margin: 0 !important;
	padding: 1rem 1.1rem !important;
	border: 1px solid var(--af-border) !important;
	border-radius: var(--af-radius) !important;
	background: var(--af-surface) !important;
	float: none !important;
}

.afisha-links .block_links li.block_links_icnt:hover {
	border-color: var(--af-accent) !important;
}

.afisha-links .block_links span[onclick] {
	cursor: pointer;
}

.afisha-links .block_links .block_links_header {
	margin: 0 0 .35rem !important;
	color: var(--af-text) !important;
	font-family: var(--af-font) !important;
	font-size: 1rem !important;
	font-weight: 600 !important;
	line-height: 1.35 !important;
}

.afisha-links .block_links .block_links_text {
	margin: 0 !important;
	color: var(--af-muted) !important;
	font-family: var(--af-font) !important;
	font-size: .92rem !important;
	line-height: 1.5 !important;
}

.afisha-links .block_links .block_links_text a {
	color: var(--af-accent) !important;
	text-decoration: underline !important;
	text-underline-offset: 2px;
}

.afisha-links .block_links .block_links_url {
	margin: .5rem 0 0 !important;
	color: var(--af-muted) !important;
	font-size: .85rem !important;
}

/* Обычные текстовые ссылки (не блочный формат) — каждая отдельной плашкой */
.afisha-links__item {
	font-size: .95rem;
	line-height: 1.5;
}

.afisha-links__grid:not(:has(.block_links)) {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
	gap: 1rem;
}

.afisha-links__grid:not(:has(.block_links)) .afisha-links__item {
	padding: 1rem 1.1rem;
	border: 1px solid var(--af-border);
	border-radius: var(--af-radius);
	background: var(--af-surface);
}

/* Дни без сеансов: ссылки нет, поэтому и выглядеть должны неактивными */
.afisha-dates .is-empty span {
	display: flex;
	flex-direction: column;
	align-items: center;
	min-width: 62px;
	padding: .5rem .7rem;
	border: 1px dashed var(--af-border);
	border-radius: var(--af-radius);
	color: var(--af-muted);
	font-size: .85rem;
	line-height: 1.3;
	white-space: nowrap;
	opacity: .55;
}

/* --- Страница ошибки --------------------------------------------------------- */

.afisha-error {
	max-width: 40rem;
	margin: 0 auto;
	padding: 3rem 0 4rem;
	text-align: center;
}

.afisha-error__code {
	margin: 0;
	color: var(--af-accent);
	font-size: clamp(3.5rem, 2rem + 8vw, 6rem);
	font-weight: 800;
	line-height: 1;
	letter-spacing: -.04em;
}

.afisha-error__title {
	margin: .5rem 0 1rem;
	font-size: clamp(1.4rem, 1.1rem + 1.4vw, 2rem);
	font-weight: 700;
	letter-spacing: -.02em;
}

.afisha-error__text {
	margin-bottom: 2rem;
	color: var(--af-muted);
	line-height: 1.6;
}

/* С битого адреса человеку полезнее уйти в раздел афиши, чем на главную */
.afisha-error__links {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: .5rem;
	margin: 0 0 1.5rem;
	padding: 0;
	list-style: none;
}

.afisha-error__links a {
	display: inline-block;
	padding: .5rem 1rem;
	border: 1px solid var(--af-border);
	border-radius: 999px;
	background: var(--af-surface);
	color: var(--af-text);
	text-decoration: none;
	transition: border-color .15s ease;
}

.afisha-error__links a:hover {
	border-color: var(--af-accent);
	color: var(--af-accent);
}

.afisha-error__home a {
	color: var(--af-muted);
	font-size: .9rem;
}

/* --- Модули в потоке страницы ------------------------------------------------ */

.afisha-modules--top {
	margin-bottom: 2rem;
}

.afisha-modules--bottom {
	margin-top: 3rem;
	padding-top: 2rem;
	border-top: 1px solid var(--af-border);
	color: var(--af-muted);
	line-height: 1.65;
}

/* Ограничение строки для читаемости — на текстовых блоках, а не на всей
   позиции: сетка ссылок должна занимать ту же ширину, что и сетка событий. */
.afisha-modules--bottom > * {
	/* Здесь ленты постеров и новости, а не сплошной текст — ограничение
	   строки под чтение им только мешает */
	max-width: none;
}

.afisha-modules--bottom > .afisha-links {
	max-width: none;
}

.afisha-modules--bottom a {
	color: var(--af-text);
}

/* Сайдбар только на внутренних страницах: на главной модуль афиши идёт
   во всю ширину, делить её незачем */
.afisha-layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 260px);
	gap: 2rem;
	align-items: start;
}

/* Без min-width ячейка сетки растягивается под самое широкое содержимое —
   лента дат распирала страницу до 550 px на телефоне вместо 375 */
.afisha-layout__main,
.afisha-layout__side {
	min-width: 0;
}

@media (max-width: 991.98px) {
	.afisha-layout {
		grid-template-columns: 1fr;
	}

	.afisha-layout__side {
		order: 2;
	}
}

.afisha-layout__side .card {
	border: 1px solid var(--af-border);
	border-radius: var(--af-radius);
	background: var(--af-surface);
}

.afisha-layout__side ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.afisha-layout__side .mod-menu li + li {
	border-top: 1px solid var(--af-border);
}

.afisha-layout__side .mod-menu a {
	display: block;
	padding: .6rem .9rem;
	color: var(--af-text);
	text-decoration: none;
}

.afisha-layout__side .mod-menu a:hover {
	color: var(--af-accent);
}

/* Лента модуля на главной: карточки помельче, чем в списках раздела */
.afisha-grid--module {
	grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
	gap: 1rem;
}

/* Заголовок блока на главной со ссылкой на раздел целиком */
.afisha-block__head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 1rem;
	margin: 2.5rem 0 1rem;
}

.afisha-block__head:first-child {
	margin-top: 0;
}

.afisha-block__head .afisha-section__title {
	margin: 0;
}

.afisha-block__all {
	flex: 0 0 auto;
	color: var(--af-muted);
	font-size: .9rem;
	text-decoration: none;
	white-space: nowrap;
}

.afisha-block__all:hover {
	color: var(--af-accent);
}

/* Заголовок раздела */
.afisha-title {
	margin-bottom: 1.25rem;
	font-size: clamp(1.5rem, 1.2rem + 1.6vw, 2.2rem);
	font-weight: 700;
	letter-spacing: -.02em;
}

.afisha-title__date {
	color: var(--af-muted);
	font-weight: 400;
}

/* На телефоне карточки в две колонки: одна на всю ширину даёт постер
   в пол-экрана и заставляет листать вместо просмотра */
@media (max-width: 575.98px) {
	.afisha-grid,
	.afisha-grid--module,
	.afisha-grid--places {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: .75rem;
	}

	.afisha-card__title {
		font-size: .95rem;
	}

	.afisha-card__summary {
		font-size: .8rem;
	}
}

/* Заглушка вместо постера.
   Рисуется стилями, а не картинкой: у 1140 событий из 1536 изображения нет,
   и прежний nofoto.png весом 3,5 КБ грузился на каждой такой карточке. Здесь
   ноль запросов, живая подстройка под тёмную тему и первая буква названия
   вместо безликой иконки. */
.afisha-card__media--empty {
	display: flex;
	align-items: center;
	justify-content: center;
	aspect-ratio: 2 / 3;
	background:
		radial-gradient(120% 80% at 50% 0%,
			hsl(var(--af-hue, 0) 60% 92%) 0%,
			var(--af-surface) 70%);
	border-bottom: 1px solid var(--af-border);
	/* Карточка — ссылка, и подчёркивание от неё пробивается на букву */
	text-decoration: none;
}

@media (prefers-color-scheme: dark) {
	.afisha-card__media--empty {
		background:
			radial-gradient(120% 80% at 50% 0%,
				hsl(var(--af-hue, 0) 30% 22%) 0%,
				var(--af-surface) 70%);
	}
}

.afisha-grid--places .afisha-card__media--empty,
.afisha-hero--place .afisha-hero__poster.afisha-card__media--empty {
	aspect-ratio: 3 / 2;
}

.afisha-card__letter {
	font-size: clamp(2rem, 1rem + 6vw, 3.5rem);
	font-weight: 700;
	line-height: 1;
	letter-spacing: -.04em;
	color: hsl(var(--af-hue, 0) 35% 45% / .5);
	text-decoration: none;
	user-select: none;
}

@media (prefers-color-scheme: dark) {
	.afisha-card__letter {
		color: hsl(var(--af-hue, 0) 40% 75% / .45);
	}
}

.afisha-hero__poster.afisha-card__media--empty {
	border: 1px solid var(--af-border);
	border-radius: var(--af-radius);
}

/* Страница персоны: фото портретное, как постер */
.afisha-hero--person .afisha-hero__poster img {
	aspect-ratio: 2 / 3;
	object-fit: cover;
	width: 100%;
	display: block;
	border-radius: var(--af-radius);
}

/* Фильмография: год слева, события справа */
.afisha-facts--years dt {
	font-variant-numeric: tabular-nums;
	font-weight: 600;
	color: var(--af-text);
}

.afisha-facts--years dd {
	margin-bottom: .35rem;
	line-height: 1.6;
}

/* Подвал: свой копирайт слева, текст модуля справа — без дублирования года */
.afisha-footer__copy {
	/* Без переноса строка копирайта распирала страницу на телефоне до 566px */
	margin: 0;
	min-width: 0;
}

.afisha-footer p {
	margin: 0 0 .35rem;
}

.afisha-footer .mod-custom {
	max-width: 60ch;
	text-align: end;
}

@media (max-width: 767.98px) {
	.afisha-footer .mod-custom {
		text-align: start;
	}
}

/* --- Журнал ------------------------------------------------------------------ */

.afisha-article {
	max-width: 46rem;
}

.afisha-article__title {
	font-size: clamp(1.6rem, 1.2rem + 1.8vw, 2.4rem);
	font-weight: 700;
	letter-spacing: -.02em;
	margin-bottom: .5rem;
}

.afisha-article__date {
	margin-bottom: 1.75rem;
	color: var(--af-muted);
	font-size: .9rem;
}

/* Ширина строки под чтение: сплошной текст во всю колонку не читается */
.afisha-article__body p {
	margin-bottom: 1.1rem;
	line-height: 1.7;
}

/* Карточка материала в ленте: та же сетка, что у событий, но без постера */
.afisha-card--article .afisha-card__body {
	padding: 1.1rem 1.2rem;
}

.afisha-card__intro {
	margin-top: .5rem;
	color: var(--af-muted);
	font-size: .92rem;
	line-height: 1.55;
}

.afisha-card__intro p {
	margin: 0;
}


/* Крошки переехали под содержимое: там они служат для возврата на уровень
   выше, а не представляют страницу, — потому и выглядят скромнее. */
.afisha-crumbs {
	margin-top: 2.5rem;
	padding-top: 1.25rem;
	border-top: 1px solid var(--af-border);
	font-size: .85rem;
	color: var(--af-muted);
}

.afisha-crumbs .mod-breadcrumbs__wrapper,
.afisha-crumbs .breadcrumb {
	margin: 0;
	padding: 0;
	background: none;
}

.afisha-crumbs a {
	color: var(--af-muted);
}

.afisha-crumbs a:hover {
	color: var(--af-text);
}

/* --- Связанное в афише ------------------------------------------------------- */

.afisha-related {
	margin-top: 2.5rem;
	padding-top: 1.5rem;
	border-top: 2px solid var(--af-text);
}

.afisha-related__title {
	margin-bottom: 1rem;
	font-size: 1.15rem;
	font-weight: 700;
	letter-spacing: -.01em;
}

.afisha-related__list {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
	gap: .6rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.afisha-related__item {
	display: flex;
	flex-direction: column;
	gap: .15rem;
	padding: .7rem .9rem;
	border: 1px solid var(--af-border);
	border-radius: var(--af-radius);
	background: var(--af-surface);
	transition: border-color .15s ease, transform .15s ease;
}

.afisha-related__item:hover {
	border-color: var(--af-accent);
	transform: translateY(-1px);
}

.afisha-related__item a {
	color: var(--af-text);
	font-weight: 600;
	text-decoration: none;
}

.afisha-related__note {
	color: var(--af-muted);
	font-size: .82rem;
}

/* Ссылки внутри текста материала: заметные, но не пестрящие */
.afisha-article__body a {
	color: var(--af-text);
	text-decoration: underline;
	text-decoration-color: var(--af-accent);
	text-underline-offset: 3px;
	text-decoration-thickness: 2px;
}

.afisha-article__body a:hover {
	color: var(--af-accent);
}

/* --- Теги материала ---------------------------------------------------------- */

.afisha-tags {
	display: flex;
	flex-wrap: wrap;
	gap: .4rem;
	margin: 1.5rem 0 0;
	padding: 0;
	list-style: none;
}

.afisha-tags a {
	display: inline-block;
	padding: .3rem .75rem;
	border: 1px solid var(--af-border);
	border-radius: 999px;
	color: var(--af-muted);
	font-size: .82rem;
	text-decoration: none;
	transition: border-color .15s ease, color .15s ease;
}

.afisha-tags a:hover {
	border-color: var(--af-accent);
	color: var(--af-text);
}


/* Лента журнала: карточки пошире, чем у событий — здесь текст, а не постер */
.afisha-grid--journal {
	grid-template-columns: repeat(auto-fill, minmax(310px, 1fr));
	align-items: start;
}

.afisha-card--article {
	border: 1px solid var(--af-border);
	border-radius: var(--af-radius);
	background: var(--af-surface);
	transition: border-color .15s ease, transform .15s ease, box-shadow .15s ease;
}

.afisha-card--article:hover {
	border-color: color-mix(in srgb, var(--af-text) 25%, transparent);
	transform: translateY(-2px);
	box-shadow: var(--af-shadow);
}

.afisha-card--article .afisha-card__title {
	font-size: 1.05rem;
	line-height: 1.35;
}

.afisha-card--article .afisha-card__title a {
	color: var(--af-text);
	text-decoration: none;
}

/* Вводка обрезается по строкам, иначе карточки в ряду разной высоты
   и сетка выглядит рваной */
.afisha-card__intro p {
	display: -webkit-box;
	-webkit-line-clamp: 4;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* Список афиши в боковой колонке журнала.
   Плотная строка вместо карточки: в колонке шириной 300 px сетка карточек
   вытягивалась в столбец на полтора экрана и уводила читателя от текста. */
.afisha-side-list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.afisha-side-list__item + .afisha-side-list__item {
	border-top: 1px solid var(--af-border);
}

.afisha-side-list__link {
	display: grid;
	grid-template-columns: 48px 1fr;
	gap: .75rem;
	align-items: start;
	padding: .7rem 0;
	color: inherit;
	text-decoration: none;
}

.afisha-side-list__link:hover .afisha-side-list__title {
	color: var(--af-accent);
}

.afisha-side-list__thumb {
	display: block;
	overflow: hidden;
	aspect-ratio: 2 / 3;
	border-radius: 6px;
	background: var(--af-surface);
}

.afisha-side-list__thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* Буква-заглушка задана под постер карточки и в миниатюре занимала всю плашку */
.afisha-side-list__thumb .afisha-card__letter {
	font-size: 1.25rem;
}

.afisha-side-list__body {
	display: block;
	min-width: 0;
}

.afisha-side-list__title {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	font-size: .95rem;
	font-weight: 600;
	line-height: 1.3;
}

.afisha-side-list__meta {
	display: block;
	margin-top: .2rem;
	font-size: .8rem;
	color: var(--af-muted);
}

.afisha-side-list__all {
	display: inline-block;
	margin-top: .6rem;
	font-size: .85rem;
	font-weight: 600;
}

/* ---------------------------------------------------------------- карты */

/*
 * Высоту задаём здесь, а не в разметке: без неё Leaflet рисует карту в ноль
 * пикселей и молча ничего не показывает.
 */
.afisha-map {
	height: 380px;
	margin: 0 0 1.5rem;
	border-radius: var(--af-radius);
	overflow: hidden;
	background: var(--af-surface);
}

.afisha-map--modal {
	height: min(70vh, 520px);
	margin: 0;
}

.afisha-map__empty {
	padding: 1rem;
	color: var(--af-muted);
}

/* Подпись под картой: источник плиток требует указания авторства */
.afisha-map + .afisha-map__note {
	margin: -1rem 0 1.5rem;
	font-size: .85rem;
	color: var(--af-muted);
}

/* Адрес, открывающий карту: выглядит как ссылка, но остаётся кнопкой */
.afisha-map-link {
	padding: 0;
	border: 0;
	background: none;
	color: inherit;
	font: inherit;
	text-align: left;
	text-decoration: underline;
	text-decoration-style: dotted;
	text-underline-offset: 3px;
	cursor: pointer;
}

.afisha-map-link:hover {
	color: var(--af-accent);
}

/* ------------------------------------------------------------ окно карты */

.afisha-modal {
	position: fixed;
	inset: 0;
	z-index: 1000;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 1rem;
	background: rgba(0, 0, 0, .55);
}

.afisha-modal__box {
	position: relative;
	width: min(900px, 100%);
	padding: 1.25rem;
	border-radius: var(--af-radius);
	background: var(--af-surface);
}

.afisha-modal__title {
	margin: 0 2rem .75rem 0;
	font-size: 1.1rem;
}

.afisha-modal__close {
	position: absolute;
	top: .5rem;
	right: .75rem;
	width: 2rem;
	height: 2rem;
	border: 0;
	background: none;
	color: var(--af-muted);
	font-size: 1.6rem;
	line-height: 1;
	cursor: pointer;
}

.afisha-modal__close:hover {
	color: var(--af-text);
}

/* Прокрутку страницы под открытым окном отключаем */
body.afisha-modal-open {
	overflow: hidden;
}

/* Список станций указателя */
.afisha-metro {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem;
	margin: 0 0 1.5rem;
	padding: 0;
	list-style: none;
}

.afisha-metro__item a {
	display: inline-flex;
	align-items: baseline;
	gap: .4rem;
	padding: .35rem .7rem;
	border-radius: 999px;
	background: var(--af-surface);
	text-decoration: none;
}

.afisha-metro__item a:hover {
	background: var(--af-accent);
	color: #fff;
}

.afisha-metro__count {
	font-size: .8rem;
	opacity: .65;
}

.afisha-letter {
	margin: 0 0 .5rem;
	font-size: 1.05rem;
	color: var(--af-muted);
}

.afisha-card__meta--accent {
	color: var(--af-accent);
}

/* ------------------------------------------------ переключатель периода */

/* Подборка по стране, году или жанру: «сегодня / до конца недели / вся афиша» */
.afisha-switch {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem;
	margin: 0 0 1.25rem;
}

.afisha-switch > a,
.afisha-switch > span {
	padding: .4rem .9rem;
	border: 1px solid var(--af-border);
	border-radius: 999px;
	background: var(--af-surface);
	color: var(--af-text);
	font-size: .95rem;
	text-decoration: none;
}

.afisha-switch > a:hover {
	border-color: var(--af-accent);
	color: var(--af-accent);
}

.afisha-switch > [aria-current="page"] {
	border-color: var(--af-accent);
	background: var(--af-accent);
	color: var(--af-accent-ink);
}

/* «Вся киноафиша» — выход из подборки, отодвигаем вправо */
.afisha-switch__all {
	margin-left: auto;
}

@media (max-width: 600px) {
	.afisha-switch__all {
		margin-left: 0;
	}
}

/* Станции метро — в тёмной теме значок должен быть тёмным */
.afisha-metro__item a {
	border: 1px solid var(--af-border);
	color: var(--af-text);
}

.afisha-metro__item a:hover {
	border-color: var(--af-accent);
	color: var(--af-accent-ink);
}

/* ============================================================================
   Калининградская редакция шаблона: типографика, главная
   ============================================================================ */

/* --- Типографика -------------------------------------------------------------- */

.afisha-main h1,
.afisha-main .page-header h1,
.afisha-title {
	font-family: var(--af-display);
	font-size: clamp(1.5rem, 1.1rem + 1.6vw, 2.25rem);
	font-weight: 700;
	line-height: 1.15;
	letter-spacing: -.025em;
}

.afisha-section__title,
.afisha-main h2 {
	font-family: var(--af-display);
	font-weight: 600;
	letter-spacing: -.015em;
}

.afisha-main {
	padding: 2rem 0 0;
}

.is-home .afisha-main,
.is-day .afisha-main {
	padding-top: 0;
}

/* Страница дня: разделы идут так же, как блоки главной */
.is-day .afisha-section + .afisha-section {
	margin-top: 2.75rem;
}

/* --- Герой главной и лента дней ----------------------------------------------- */

.afisha-welcome {
	margin-bottom: 2.5rem;
	padding: clamp(1.75rem, 4vw, 3rem) 0 clamp(1.5rem, 3vw, 2.25rem);
	background: var(--af-baltic);
	color: #fff;
}

.afisha-welcome__inner {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	justify-content: space-between;
	gap: 1.75rem 3rem;
}

.afisha-welcome__text {
	flex: 1 1 22rem;
	min-width: 0;
}

.afisha-welcome__title {
	margin: 0;
	color: #fff;
	font-family: var(--af-display);
	font-size: clamp(2rem, 1.2rem + 3.6vw, 3.75rem);
	font-weight: 700;
	line-height: 1.02;
	letter-spacing: -.035em;
}

.afisha-welcome__today {
	margin: .9rem 0 0;
	color: rgba(255, 255, 255, .78);
	font-size: 1.05rem;
}

/* Главный элемент страницы: семь дней крупными числами. Сегодняшний —
   цветом янтаря, выходные чуть ярче будних. */
.afisha-days {
	display: flex;
	flex: 0 1 auto;
	gap: .35rem;
	max-width: 100%;
	overflow-x: auto;
	scrollbar-width: none;
}

.afisha-days::-webkit-scrollbar {
	display: none;
}

.afisha-days__day {
	display: flex;
	flex: 0 0 auto;
	flex-direction: column;
	align-items: center;
	min-width: 4.1rem;
	padding: .7rem .5rem .6rem;
	border-radius: var(--af-radius);
	color: rgba(255, 255, 255, .8);
	text-decoration: none;
	transition: background-color .15s ease;
}

.afisha-days__day:hover {
	background: rgba(255, 255, 255, .1);
	color: #fff;
}

.afisha-days__num {
	font-family: var(--af-display);
	font-size: clamp(1.6rem, 1.2rem + 1.4vw, 2.3rem);
	font-weight: 600;
	line-height: 1;
	font-variant-numeric: tabular-nums;
}

.afisha-days__label {
	margin-top: .35rem;
	font-size: .82rem;
}

.afisha-days__day.is-weekend .afisha-days__label {
	color: #ffd08a;
}

.afisha-days__day.is-today {
	background: var(--af-warm);
	color: var(--af-warm-ink);
}

.afisha-days__day.is-today .afisha-days__label {
	color: var(--af-warm-ink);
	font-weight: 600;
}

@media (max-width: 991.98px) {
	.afisha-days {
		margin-inline: calc(-1 * var(--af-gutter));
		padding-inline: var(--af-gutter);
	}
}

/* --- Маршрут по области ------------------------------------------------------ */

/* Города области остановками на линии — как электричка из Калининграда на
   взморье. Под названием — сколько событий на неделе: это и выбор города,
   и сводка, где что идёт. Текущий город — янтарная точка. */
.afisha-route {
	margin-top: clamp(1.5rem, 3vw, 2.25rem);
}

.afisha-route__stops {
	display: flex;
	margin: 0;
	padding: 0;
	list-style: none;
	overflow-x: auto;
	scrollbar-width: none;
}

.afisha-route__stops::-webkit-scrollbar {
	display: none;
}

.afisha-route__stop {
	position: relative;
	flex: 1 0 auto;
	min-width: 7.5rem;
	padding-top: 1.35rem;
}

/* Перегон до следующей остановки: от точки до края ячейки */
.afisha-route__stop::before {
	content: "";
	position: absolute;
	top: 5px;
	left: 6px;
	right: 0;
	height: 2px;
	background: rgba(255, 255, 255, .28);
}

.afisha-route__stop:last-child::before {
	display: none;
}

.afisha-route__stop::after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 12px;
	height: 12px;
	border: 2px solid rgba(255, 255, 255, .7);
	border-radius: 50%;
	background: var(--af-baltic);
}

.afisha-route__stop.is-here::after {
	top: -3px;
	left: -3px;
	width: 18px;
	height: 18px;
	border: 3px solid rgba(231, 154, 22, .35);
	background: var(--af-warm);
	background-clip: padding-box;
}

.afisha-route__stop a {
	display: block;
	padding-right: 1rem;
	color: #fff;
	text-decoration: none;
}

.afisha-route__name {
	display: block;
	font-weight: 600;
	font-size: 1.02rem;
	line-height: 1.25;
}

.afisha-route__stop a:hover .afisha-route__name {
	text-decoration: underline;
	text-underline-offset: .2em;
}

.afisha-route__stop.is-here .afisha-route__name {
	color: #ffd98a;
}

.afisha-route__count {
	display: block;
	margin-top: .2rem;
	color: rgba(255, 255, 255, .66);
	font-size: .82rem;
	font-variant-numeric: tabular-nums;
}

@media (max-width: 991.98px) {
	.afisha-route__stops {
		margin-inline: calc(-1 * var(--af-gutter));
		padding-inline: var(--af-gutter);
	}
}

/* --- Ряды постеров на главной -------------------------------------------------- */

/* Блоки разделов на главной — одной прокручиваемой лентой, а не сеткой в
   несколько рядов: так на экран влезает несколько разделов сразу, а не
   двадцать постеров кино подряд. */
.is-home .afisha-grid--module,
.afisha-modules--bottom .afisha-grid--module,
.afisha-grid--row {
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: minmax(150px, calc((100% - 5 * 1.25rem) / 6));
	grid-template-columns: none;
	gap: 1.25rem;
	overflow-x: auto;
	padding-bottom: .75rem;
	scroll-snap-type: x mandatory;
	scrollbar-width: thin;
	scrollbar-color: var(--af-border) transparent;
}

.is-home .afisha-grid--module > *,
.afisha-modules--bottom .afisha-grid--module > *,
.afisha-grid--row > * {
	scroll-snap-align: start;
}

@media (max-width: 767.98px) {
	.is-home .afisha-grid--module,
	.afisha-modules--bottom .afisha-grid--module,
	.afisha-grid--row {
		grid-auto-columns: 42%;
		margin-inline: calc(-1 * var(--af-gutter));
		padding-inline: var(--af-gutter);
		scroll-padding-inline: var(--af-gutter);
	}
}

.afisha-modules--top > * + * {
	margin-top: 2.75rem;
}

.afisha-block__head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 1rem;
	margin-bottom: 1.1rem;
}

.afisha-block__head .afisha-section__title {
	margin: 0;
	font-size: clamp(1.15rem, 1rem + .6vw, 1.5rem);
}

.afisha-block__all {
	flex: 0 0 auto;
	color: var(--af-accent);
	font-weight: 600;
	text-decoration: none;
}

.afisha-block__all:hover {
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* Карточка без рамки и тени: постер, под ним название и площадки */
.afisha-card {
	border: 0;
	background: transparent;
	box-shadow: none;
}

.afisha-card__media {
	border-radius: var(--af-radius);
	overflow: hidden;
}

.afisha-card__title {
	font-size: 1rem;
	font-weight: 600;
	line-height: 1.3;
}

.afisha-card__title a {
	color: var(--af-text);
	text-decoration: none;
}

.afisha-card__title a:hover {
	color: var(--af-accent);
}

.afisha-card__price {
	color: var(--af-text);
	font-weight: 600;
}

/* --- Новости на главной -------------------------------------------------------- */

.afisha-modules--bottom {
	margin-top: 3rem;
}

.afisha-news {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: 1.25rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.afisha-news__item {
	padding: 1.25rem 1.3rem;
	border-radius: var(--af-radius);
	background: var(--af-surface);
}

.afisha-news__date {
	display: block;
	margin-bottom: .4rem;
	color: var(--af-muted);
	font-size: .85rem;
}

.afisha-news__title {
	margin: 0;
	font-family: var(--af-font);
	font-size: 1.05rem;
	font-weight: 600;
	line-height: 1.35;
}

.afisha-news__title a {
	color: var(--af-text);
	text-decoration: none;
}

.afisha-news__title a:hover {
	color: var(--af-accent);
}

/* --- О сайте (статья главной) --------------------------------------------------- */

.afisha-about {
	display: grid;
	grid-template-columns: minmax(0, 16rem) minmax(0, 44rem);
	gap: 1rem 3rem;
	margin-top: 3.5rem;
	padding-top: 2rem;
	border-top: 1px solid var(--af-border);
}

.afisha-about__title {
	margin: 0;
	font-family: var(--af-display);
	font-size: 1.15rem;
	font-weight: 600;
}

.afisha-about__text {
	color: var(--af-muted);
	line-height: 1.65;
}

.afisha-about__text p:last-child {
	margin-bottom: 0;
}

@media (max-width: 767.98px) {
	.afisha-about {
		grid-template-columns: minmax(0, 1fr);
	}
}

@media (prefers-reduced-motion: reduce) {
	.afisha-days__day,
	.afisha-card,
	.afisha-links__item {
		transition: none;
	}
}

/* --- Лента дат раздела: в одном стиле с лентой дней главной ------------------- */

.afisha-dates .item a {
	min-width: 4.2rem;
	padding: .55rem .6rem;
	border: 0;
	border-radius: var(--af-radius);
	background: transparent;
	color: var(--af-text);
	transition: background-color .15s ease;
}

.afisha-dates .item a:hover {
	background: var(--af-surface);
	border-color: transparent;
	transform: none;
}

.afisha-dates .item strong {
	font-family: var(--af-display);
	font-size: 1rem;
	font-weight: 600;
}

.afisha-dates .item small {
	color: var(--af-muted);
	font-size: .8rem;
}

/* Макет компонента помечает день классом current, шаблон места — is-current */
.afisha-dates .item.is-current a,
.afisha-dates .item.current a {
	background: var(--af-warm);
	color: var(--af-warm-ink);
}

.afisha-dates .item.is-current a small,
.afisha-dates .item.current a small {
	color: var(--af-warm-ink);
}

/* Выбранный день без показов: рамка акцентная, но без заливки */
.afisha-dates .item.is-empty.is-current span,
.afisha-dates .item.is-empty.current span {
	border-style: solid;
	border-color: var(--af-warm);
	color: var(--af-text);
}

/* Карточка без подложки: текст выравниваем по краю постера */
.afisha-card__body {
	padding-inline: 0;
}

/* --- Телепрограмма ------------------------------------------------------------ */

.afisha-tv__head {
	margin-bottom: 1.75rem;
}

.afisha-tv__head .afisha-title {
	margin-bottom: .35rem;
}

.afisha-tv__date {
	margin: 0 0 1rem;
	color: var(--af-muted);
	font-size: 1.05rem;
}

.afisha-tv__date::first-letter {
	text-transform: uppercase;
}

/* Лента дней: тот же рисунок, что у дат афиши */
.afisha-tv-days {
	display: flex;
	gap: .25rem;
	overflow-x: auto;
	scrollbar-width: none;
}

.afisha-tv-days::-webkit-scrollbar {
	display: none;
}

.afisha-tv-days__day {
	display: flex;
	flex: 0 0 auto;
	flex-direction: column;
	align-items: center;
	min-width: 4.2rem;
	padding: .55rem .6rem;
	border-radius: var(--af-radius);
	color: var(--af-text);
	text-decoration: none;
}

.afisha-tv-days__day:hover {
	background: var(--af-surface);
	color: var(--af-text);
}

.afisha-tv-days__num {
	font-family: var(--af-display);
	font-size: 1.35rem;
	font-weight: 600;
	line-height: 1.1;
	font-variant-numeric: tabular-nums;
}

.afisha-tv-days__label {
	color: var(--af-muted);
	font-size: .8rem;
}

.afisha-tv-days__day.is-weekend .afisha-tv-days__label {
	color: var(--af-accent);
}

.afisha-tv-days__day.is-current {
	background: var(--af-warm);
	color: var(--af-warm-ink);
}

.afisha-tv-days__day.is-current .afisha-tv-days__label {
	color: var(--af-warm-ink);
}

/* Карточки каналов */
.afisha-tv__grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
	gap: 1.25rem;
}

.afisha-tv-card {
	display: flex;
	flex-direction: column;
	padding: 1.1rem 1.25rem 1rem;
	border-radius: var(--af-radius);
	background: var(--af-surface);
}

.afisha-tv-card__name {
	margin: 0 0 .75rem;
	font-family: var(--af-display);
	font-size: 1.05rem;
	font-weight: 600;
}

.afisha-tv-card__name a {
	color: var(--af-text);
	text-decoration: none;
}

.afisha-tv-card__name a:hover {
	color: var(--af-accent);
}

.afisha-tv-card__empty {
	flex: 1;
	margin: 0;
	color: var(--af-muted);
}

.afisha-tv-card__all {
	margin-top: auto;
	padding-top: .75rem;
	color: var(--af-accent);
	font-size: .9rem;
	font-weight: 600;
	text-decoration: none;
}

.afisha-tv-card__all:hover {
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* Список передач: время слева колонкой, название справа */
.afisha-tv-list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.afisha-tv-list__item {
	display: grid;
	grid-template-columns: 3.4rem minmax(0, 1fr);
	gap: .75rem;
	padding: .4rem 0;
	line-height: 1.4;
}

.afisha-tv-list__item + .afisha-tv-list__item {
	border-top: 1px solid var(--af-border);
}

.afisha-tv-list__time {
	color: var(--af-muted);
	font-variant-numeric: tabular-nums;
}

.afisha-tv-list__title a {
	color: var(--af-text);
	text-decoration: underline;
	text-decoration-color: var(--af-border);
	text-underline-offset: 3px;
}

.afisha-tv-list__title a:hover {
	color: var(--af-accent);
}

/* Сейчас в эфире: тёплая метка слева и полоска прошедшего времени */
.afisha-tv-list__item.is-now {
	margin-inline: -.6rem;
	padding-inline: .6rem;
	border-radius: 6px;
	background: color-mix(in srgb, var(--af-warm) 14%, transparent);
	border-top-color: transparent;
}

.afisha-tv-list__item.is-now + .afisha-tv-list__item {
	border-top-color: transparent;
}

.afisha-tv-list__item.is-now .afisha-tv-list__time {
	color: var(--af-text);
	font-weight: 600;
}

.afisha-tv-list__item.is-now .afisha-tv-list__title {
	font-weight: 600;
}

.afisha-tv-list__badge {
	display: inline-block;
	margin-left: .35rem;
	padding: .05rem .45rem;
	border-radius: 999px;
	background: var(--af-warm);
	color: var(--af-warm-ink);
	font-size: .75rem;
	font-weight: 600;
	vertical-align: .1em;
}

.afisha-tv-list__bar {
	display: block;
	height: 3px;
	margin-top: .4rem;
	border-radius: 2px;
	background: color-mix(in srgb, var(--af-warm) 25%, transparent);
	overflow: hidden;
}

.afisha-tv-list__bar > span {
	display: block;
	height: 100%;
	background: var(--af-warm);
}

.afisha-tv-list__item.is-past {
	color: var(--af-muted);
}

.afisha-tv-list__item.is-past .afisha-tv-list__title a {
	color: var(--af-muted);
}

/* Программа канала на день — части суток колонками */
.afisha-tv-day {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	gap: 1.25rem;
	align-items: start;
}

.afisha-tv-day__part {
	padding: 1.1rem 1.25rem;
	border-radius: var(--af-radius);
	background: var(--af-surface);
}

.afisha-tv-day__title {
	margin: 0 0 .5rem;
	font-family: var(--af-display);
	font-size: 1rem;
	font-weight: 600;
}

.afisha-tv-others {
	margin-top: 2.5rem;
}

.afisha-tv-others ul {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.afisha-tv-others a {
	display: block;
	padding: .45rem .9rem;
	border-radius: 999px;
	background: var(--af-surface);
	color: var(--af-text);
	font-weight: 500;
	text-decoration: none;
}

.afisha-tv-others a:hover {
	color: var(--af-accent);
}

/* Страница передачи */
.afisha-tv-program {
	display: grid;
	grid-template-columns: minmax(0, 44rem) minmax(0, 18rem);
	gap: 1.5rem 3rem;
	align-items: start;
}

.afisha-tv-program__desc {
	line-height: 1.65;
}

.afisha-tv-program__when {
	padding: 1.1rem 1.25rem;
	border-radius: var(--af-radius);
	background: var(--af-surface);
}

.afisha-tv-program__when .afisha-section__title {
	margin: 0 0 .5rem;
	font-size: 1rem;
}

.afisha-tv-program__when ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.afisha-tv-program__when li {
	display: flex;
	justify-content: space-between;
	gap: 1rem;
	padding: .35rem 0;
}

.afisha-tv-program__when li + li {
	border-top: 1px solid var(--af-border);
}

.afisha-tv-program__when time {
	font-weight: 600;
	font-variant-numeric: tabular-nums;
}

.afisha-tv-program__when li:has(.afisha-tv-program__times) {
	display: block;
	padding: .5rem 0;
}

.afisha-tv-program__when li > a {
	flex: 0 0 auto;
	color: var(--af-text);
	text-decoration: none;
}

.afisha-tv-program__when li > a:hover {
	color: var(--af-accent);
}

/* День строкой, время показов под ним в ряд */
.afisha-tv-program__times {
	display: flex;
	flex-wrap: wrap;
	gap: .25rem .9rem;
	margin-top: .25rem;
}

.afisha-tv-program__last {
	margin: 0;
	color: var(--af-muted);
}

@media (max-width: 767.98px) {
	.afisha-tv-program {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* --- Новости ------------------------------------------------------------------ */

/* Переключатель рубрик */
.afisha-tabs {
	display: flex;
	gap: .35rem;
	margin: 0 0 2rem;
	overflow-x: auto;
	scrollbar-width: none;
}

.afisha-tabs__tab {
	flex: 0 0 auto;
	padding: .45rem 1rem;
	border-radius: 999px;
	background: var(--af-surface);
	color: var(--af-text);
	font-weight: 500;
	text-decoration: none;
}

.afisha-tabs__tab:hover {
	color: var(--af-accent);
}

.afisha-tabs__tab.is-current {
	background: var(--af-baltic);
	color: #fff;
}

/* Год над группой: крупно и приглушённо — это разделитель, а не заголовок */
.afisha-news-year + .afisha-news-year {
	margin-top: 2.5rem;
}

.afisha-news-year__title {
	margin: 0 0 .5rem;
	color: var(--af-muted);
	font-family: var(--af-display);
	font-size: 1.5rem;
	font-weight: 600;
}

.afisha-news-list {
	max-width: 56rem;
}

.afisha-news-item {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 1.5rem;
	padding: 1.25rem 0;
	border-bottom: 1px solid var(--af-border);
}

.afisha-news-item.has-image {
	grid-template-columns: minmax(0, 1fr) 10rem;
}

.afisha-news-item__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .5rem .75rem;
	margin: 0 0 .4rem;
	color: var(--af-muted);
	font-size: .88rem;
}

.afisha-news-item__cat {
	padding: .1rem .55rem;
	border-radius: 999px;
	background: color-mix(in srgb, var(--af-baltic) 10%, transparent);
	color: var(--af-accent);
	font-size: .8rem;
	font-weight: 600;
}

.afisha-news-item__title {
	margin: 0 0 .4rem;
	font-family: var(--af-display);
	font-size: 1.2rem;
	font-weight: 600;
	line-height: 1.3;
}

.afisha-news-item__title a {
	color: var(--af-text);
	text-decoration: none;
}

.afisha-news-item__title a:hover {
	color: var(--af-accent);
}

.afisha-news-item__excerpt {
	margin: 0;
	color: var(--af-muted);
	line-height: 1.55;
}

.afisha-news-item__image img {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	border-radius: var(--af-radius);
}

@media (max-width: 575.98px) {
	.afisha-news-item.has-image {
		grid-template-columns: minmax(0, 1fr) 6rem;
		gap: 1rem;
	}
}

/* Статья */
.afisha-article {
	max-width: 44rem;
}

.afisha-article__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .5rem .75rem;
	margin: 0 0 .75rem;
	color: var(--af-muted);
	font-size: .9rem;
}

.afisha-article__title {
	font-family: var(--af-display);
	letter-spacing: -.025em;
}

.afisha-article__archive {
	margin: 0 0 1.5rem;
	padding: .75rem 1rem;
	border-left: 3px solid var(--af-warm);
	border-radius: 0 var(--af-radius) var(--af-radius) 0;
	background: var(--af-surface);
	color: var(--af-muted);
	font-size: .92rem;
}

.afisha-article__body {
	font-size: 1.05rem;
	line-height: 1.7;
}

/* Картинки старых заметок стоят с обтеканием и фиксированной шириной —
   на узком экране они выпирали за колонку */
.afisha-article__body img {
	max-width: 100%;
	height: auto;
	margin: .5rem 0 1rem;
	border-radius: var(--af-radius);
}

.afisha-article__body img[style*="float"],
.afisha-article__body img[align] {
	max-width: min(45%, 18rem);
	margin: .25rem 1.25rem .75rem 0;
}

.afisha-article__body::after {
	content: "";
	display: block;
	clear: both;
}

.afisha-article-more {
	max-width: 56rem;
	margin-top: 3rem;
	padding-top: 2rem;
	border-top: 1px solid var(--af-border);
}

/* Подзаголовки и списки внутри текста новости: ступенью ниже заголовка
   страницы, а не наравне с ним */
.afisha-article__body h2 {
	margin: 2rem 0 .75rem;
	font-size: 1.3rem;
	line-height: 1.3;
}

.afisha-article__body ul {
	margin: 0 0 1.25rem;
	padding-left: 1.2rem;
}

.afisha-article__body li {
	margin-bottom: .45rem;
	line-height: 1.55;
}

.afisha-article__body li::marker {
	color: var(--af-warm);
}

/* --- Архив афиши площадки ----------------------------------------------------- */

.afisha-archive__lead {
	max-width: 70ch;
	margin-bottom: 1rem;
	color: var(--af-muted);
}

.afisha-archive__more {
	margin-top: 1.5rem;
	color: var(--af-muted);
}

.afisha-archive-list {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 22rem), 1fr));
	gap: 0 2rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.afisha-archive-list__row {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: .15rem .6rem;
	padding: .55rem 0;
	border-bottom: 1px solid var(--af-border);
}

.afisha-archive-list__row a {
	font-weight: 600;
}

.afisha-archive-list__addr,
.afisha-archive-list__meta {
	color: var(--af-muted);
	font-size: .88rem;
}

.afisha-archive-list__meta {
	margin-left: auto;
	white-space: nowrap;
}

/* ============================================================================
   Портал 38i.ru «Мой Иркутск»
   ============================================================================
   Главная — новости, афиша — один из разделов. Палитра своя, не как у
   afisha-irkutsk.ru: байкальская синь в шапке и ссылках, тёплый оранжевый
   («саранка») — акцент для «сейчас», цены и выбранного дня. */

body.is-portal {
	--af-baltic: #1d5c96;
	--af-baltic-deep: #0e2d4c;
	--af-amber: #f07c2a;
	--af-amber-ink: #2f1300;
	--af-bg: #f1f4f7;
	--af-border: #d6dee6;
	--af-accent: #1d5c96;
	--af-warm: #f07c2a;
	--af-warm-ink: #2f1300;
}

@media (prefers-color-scheme: dark) {
	body.is-portal {
		--af-bg: #0c141b;
		--af-surface: #131f29;
		--af-border: #22323f;
		--af-accent: #8cbcea;
	}
}

/* --- Шапка: две строки — логотип с датой и погодой, под ними разделы ------- */

.portal-header__bar {
	min-height: 58px;
	flex-wrap: nowrap;
	padding-top: 0;
}

.portal-logo__mark {
	display: inline-grid;
	place-items: center;
	width: 34px;
	height: 34px;
	border-radius: 9px;
	background: var(--af-warm);
	color: #fff;
	font-family: var(--af-display);
	font-size: .95rem;
	font-weight: 700;
	letter-spacing: -.04em;
}

.portal-today {
	margin: 0;
	color: rgba(255, 255, 255, .7);
	font-size: .9rem;
	white-space: nowrap;
}

.portal-today::first-letter {
	text-transform: uppercase;
}

.portal-chips {
	display: flex;
	gap: .5rem;
	margin-left: auto;
}

.portal-chip {
	display: inline-flex;
	align-items: center;
	gap: .35rem;
	padding: .25rem .75rem;
	border: 1px solid rgba(255, 255, 255, .25);
	border-radius: 999px;
	color: #fff;
	font-size: .9rem;
	text-decoration: none;
	white-space: nowrap;
}

.portal-chip:hover {
	border-color: var(--af-warm);
	color: #fff;
}

.portal-chip img {
	width: 28px;
	height: 28px;
	margin: -4px -2px -4px -6px;
}

.portal-chip__temp {
	font-weight: 700;
}

.portal-chip--traffic::before {
	content: "";
	width: .6rem;
	height: .6rem;
	border-radius: 50%;
	background: conic-gradient(#e5484d 0 33%, #f5b800 0 66%, #3aa757 0);
}

/* Балл пробок: кружок цвета Яндекса вместо светофора-заглушки */
.portal-chip--traffic.is-green::before { background: #3aa757; }
.portal-chip--traffic.is-yellow::before { background: #f5b800; }
.portal-chip--traffic.is-red::before { background: #e5484d; }

.portal-header__nav {
	background: rgba(255, 255, 255, .06);
	border-top: 1px solid rgba(255, 255, 255, .08);
}

.portal-nav.afisha-nav {
	padding-block: .3rem;
	margin-inline: auto;
}

.portal-nav .afisha-nav__all a {
	font-weight: 700;
}

@media (max-width: 767.98px) {
	.portal-today,
	.portal-chip__text {
		display: none;
	}
}

@media (max-width: 1319.98px) {
	.portal-header__bar {
		flex-wrap: nowrap;
		gap: .9rem;
		padding-top: 0;
	}

	.portal-nav.afisha-nav {
		flex-basis: auto;
		margin-inline: auto;
		padding: .3rem var(--af-gutter);
	}
}

/* --- Общие блоки портала --------------------------------------------------- */

.portal-section__title {
	margin: 0 0 .9rem;
	font-family: var(--af-display);
	font-size: clamp(1.1rem, 1rem + .5vw, 1.35rem);
	font-weight: 600;
	letter-spacing: -.02em;
}

.portal-section__title a {
	color: inherit;
	text-decoration: none;
}

.portal-section__title a::after {
	content: " →";
	color: var(--af-accent);
}

.portal-meta {
	display: flex;
	flex-wrap: wrap;
	gap: .25rem .75rem;
	margin: 0 0 .5rem;
	color: var(--af-muted);
	font-size: .85rem;
}

.portal-meta__cat {
	color: var(--af-warm);
	font-weight: 600;
}

.portal-card {
	padding: 1.25rem 1.4rem;
	border: 1px solid var(--af-border);
	border-radius: var(--af-radius);
	background: var(--af-surface);
}

.portal-more {
	display: inline-block;
	margin-top: .75rem;
	font-weight: 600;
	text-decoration: none;
}

.portal-home > * + * {
	margin-top: clamp(1.75rem, 3vw, 2.75rem);
}

/* --- Главная новость и лента ---------------------------------------------- */

.portal-top {
	display: grid;
	grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr);
	gap: clamp(1.25rem, 3vw, 2.5rem);
	align-items: start;
}

@media (max-width: 899.98px) {
	.portal-top {
		grid-template-columns: minmax(0, 1fr);
	}
}

.portal-lead__image {
	display: block;
	overflow: hidden;
	aspect-ratio: 16 / 9;
	border-radius: var(--af-radius);
	background: var(--af-border);
}

.portal-lead__image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .4s;
}

.portal-lead:hover .portal-lead__image img {
	transform: scale(1.02);
}

.portal-lead__body {
	padding-top: 1rem;
}

.portal-lead__title {
	margin: 0 0 .6rem;
	font-family: var(--af-display);
	font-size: clamp(1.3rem, 1.05rem + .9vw, 1.75rem);
	font-weight: 700;
	line-height: 1.22;
	letter-spacing: -.025em;
}

.portal-lead__title a,
.portal-feed__item a,
.portal-tile__title a {
	color: var(--af-text);
	text-decoration: none;
}

.portal-lead__title a:hover,
.portal-feed__item a:hover,
.portal-tile__title a:hover {
	color: var(--af-accent);
}

.portal-lead__excerpt {
	margin: 0;
	color: var(--af-muted);
	font-size: 1.02rem;
	line-height: 1.55;
}

.portal-feed__list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.portal-feed__item {
	display: grid;
	grid-template-columns: 4.6rem minmax(0, 1fr);
	gap: .75rem;
	padding: .7rem 0;
	border-top: 1px solid var(--af-border);
	line-height: 1.35;
}

.portal-feed__item time {
	color: var(--af-muted);
	font-size: .82rem;
	padding-top: .12rem;
}

.portal-feed__item a {
	font-weight: 500;
}

/* --- Сейчас: погода и эфир ------------------------------------------------ */

.portal-now {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	gap: 1.25rem;
}

.portal-weather__now {
	display: flex;
	align-items: center;
	gap: .75rem;
}

.portal-weather__now img {
	margin: -.5rem -.25rem -.5rem -.75rem;
}

.portal-weather__temp {
	font-family: var(--af-display);
	font-size: 2.6rem;
	font-weight: 700;
	line-height: 1;
	letter-spacing: -.04em;
}

.portal-weather__text {
	line-height: 1.35;
}

.portal-weather__text::first-letter {
	text-transform: uppercase;
}

.portal-weather__text small {
	color: var(--af-muted);
}

.portal-weather__hours {
	display: flex;
	gap: .25rem;
	margin: 1rem 0 0;
	padding: 0;
	overflow-x: auto;
	list-style: none;
	scrollbar-width: thin;
}

.portal-weather__hours li {
	display: flex;
	flex: 1 0 3.6rem;
	flex-direction: column;
	align-items: center;
	padding: .35rem .2rem;
	border-radius: 8px;
	background: var(--af-bg);
	font-size: .85rem;
}

.portal-weather__time,
.portal-weather__pop {
	color: var(--af-muted);
	font-size: .78rem;
}

.portal-weather__pop {
	color: var(--af-accent);
}

.portal-weather__t {
	font-weight: 700;
}

.portal-tv__list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.portal-tv__row {
	display: grid;
	grid-template-columns: 7.5rem minmax(0, 1fr);
	gap: .75rem;
	padding: .45rem 0;
	border-top: 1px solid var(--af-border);
	font-size: .92rem;
	line-height: 1.3;
}

.portal-tv__channel {
	color: var(--af-muted);
	font-weight: 600;
}

.portal-tv__show b {
	color: var(--af-warm);
}

.portal-tv__show small {
	display: block;
	color: var(--af-muted);
}

/* --- Сервисы города ------------------------------------------------------- */

.portal-services {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(165px, 1fr));
	gap: .75rem;
}

.portal-services__item {
	display: flex;
	flex-direction: column;
	gap: .15rem;
	padding: .9rem 1rem;
	border: 1px solid var(--af-border);
	border-radius: var(--af-radius);
	background: var(--af-surface);
	color: var(--af-text);
	text-decoration: none;
	transition: border-color .15s, transform .15s;
}

.portal-services__item:hover {
	border-color: var(--af-accent);
	color: var(--af-text);
	transform: translateY(-1px);
}

.portal-services__item span {
	color: var(--af-muted);
	font-size: .85rem;
}

/* --- Полки рубрик --------------------------------------------------------- */

.portal-shelf__grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 1.25rem;
}

/* Четыре материала рубрики: в ряд на широком экране, два на два — уже */
@media (max-width: 991.98px) {
	.portal-shelf__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

.portal-tile__image {
	display: block;
	overflow: hidden;
	aspect-ratio: 16 / 10;
	margin-bottom: .6rem;
	border-radius: var(--af-radius);
	background: var(--af-border);
}

.portal-tile__image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.portal-tile__title {
	margin: 0;
	font-size: 1rem;
	font-weight: 600;
	line-height: 1.35;
}

.portal-tile__excerpt {
	margin: .4rem 0 0;
	color: var(--af-muted);
	font-size: .9rem;
	line-height: 1.45;
	display: -webkit-box;
	-webkit-line-clamp: 4;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.portal-tile:not(.has-image) {
	padding: 1rem 1.1rem;
	border: 1px solid var(--af-border);
	border-radius: var(--af-radius);
	background: var(--af-surface);
}

.portal-about {
	max-width: 52rem;
	color: var(--af-muted);
}

.portal-about h2 {
	color: var(--af-text);
}

/* --- Погода --------------------------------------------------------------- */

.portal-weather-now {
	display: grid;
	grid-template-columns: minmax(0, auto) minmax(0, 1fr);
	gap: 1rem 2.5rem;
	align-items: center;
	margin-bottom: 2rem;
}

.portal-weather-now .portal-weather__temp {
	font-size: 3.6rem;
}

.portal-weather__facts {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
	gap: .75rem 1.5rem;
	margin: 0;
}

.portal-weather__facts dt {
	color: var(--af-muted);
	font-size: .82rem;
	font-weight: 400;
}

.portal-weather__facts dd {
	margin: 0;
	font-weight: 600;
}

.portal-weather__stamp {
	grid-column: 1 / -1;
	margin: 0;
	color: var(--af-muted);
	font-size: .82rem;
}

@media (max-width: 699.98px) {
	.portal-weather-now {
		grid-template-columns: minmax(0, 1fr);
	}
}

.portal-forecast {
	display: grid;
	gap: 1rem;
}

.portal-forecast__day {
	padding: 1rem 1.2rem;
	border: 1px solid var(--af-border);
	border-radius: var(--af-radius);
	background: var(--af-surface);
}

.portal-forecast__date {
	display: flex;
	justify-content: space-between;
	margin: 0;
	font-size: 1rem;
	font-weight: 600;
}

.portal-forecast__date::first-letter {
	text-transform: uppercase;
}

.portal-forecast__date span {
	color: var(--af-muted);
	font-weight: 500;
}

/* --- Статья: картинка из поля материала ----------------------------------- */

.afisha-article__figure {
	margin: 0 0 1.5rem;
	max-width: 52rem;
}

.afisha-article__figure img {
	width: 100%;
	height: auto;
	border-radius: var(--af-radius);
}

/* Боковая колонка материалов: новости списком, без карточки на каждую */
.is-portal .afisha-layout__side .afisha-news {
	display: block;
	margin: 0;
	padding: 0;
}

.is-portal .afisha-layout__side .afisha-news__item {
	padding: .6rem 0;
	border: 0;
	border-top: 1px solid var(--af-border);
	border-radius: 0;
	background: none;
	box-shadow: none;
}

.is-portal .afisha-layout__side .afisha-news__title {
	margin: .15rem 0 0;
	font-size: .95rem;
	font-weight: 500;
	line-height: 1.35;
}

.is-portal .afisha-layout__side .afisha-news__date {
	font-size: .8rem;
}

@media (max-width: 399.98px) {
	.portal-logo .afisha-logo__text {
		font-size: .92rem;
	}

	.portal-header__bar {
		gap: .5rem;
	}

	.portal-chip {
		padding-inline: .55rem;
	}
}

/* ============================================================================
   Погода (com_jlweather 5): сейчас, по часам, 10 дней, архив, Байкал, Kp
   ============================================================================ */

.wx > * + * {
	margin-top: 1.5rem;
}

.wx-tabs {
	margin-top: .5rem;
}

.wx-now {
	display: grid;
	grid-template-columns: minmax(0, auto) minmax(0, 1fr);
	gap: 1rem 2.5rem;
	align-items: center;
}

@media (max-width: 767.98px) {
	.wx-now {
		grid-template-columns: minmax(0, 1fr);
	}
}

.wx-now__main {
	display: flex;
	align-items: center;
	gap: 1rem;
}

.wx-now__temp {
	margin: 0;
	font-family: var(--af-display);
	font-size: clamp(2.8rem, 2rem + 3vw, 4rem);
	font-weight: 700;
	line-height: 1;
	letter-spacing: -.04em;
}

.wx-now__temp small {
	color: var(--af-muted);
	font-size: .5em;
}

.wx-now__text {
	margin: .35rem 0 0;
	line-height: 1.35;
}

.wx-now__text small,
.wx-facts small {
	color: var(--af-muted);
	font-weight: 400;
}

.wx-facts {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
	gap: .8rem 1.5rem;
	margin: 0;
}

.wx-facts dt {
	color: var(--af-muted);
	font-size: .82rem;
	font-weight: 400;
}

.wx-facts dd {
	margin: 0;
	font-weight: 600;
	line-height: 1.35;
}

/* По часам — лента, прокручивается вбок */
.wx-hours {
	display: flex;
	gap: .35rem;
	margin: 0;
	padding: 0 0 .5rem;
	overflow-x: auto;
	list-style: none;
	scrollbar-width: thin;
}

.wx-hours__item {
	display: flex;
	flex: 0 0 4.4rem;
	flex-direction: column;
	align-items: center;
	gap: .1rem;
	padding: .5rem .25rem;
	border: 1px solid var(--af-border);
	border-radius: 10px;
	background: var(--af-surface);
	font-size: .85rem;
}

.wx-hours__item.is-midnight {
	border-color: var(--af-accent);
}

.wx-hours__time,
.wx-hours__p,
.wx-hours__w {
	color: var(--af-muted);
	font-size: .78rem;
	white-space: nowrap;
}

.wx-hours__p {
	color: var(--af-accent);
	min-height: 1em;
}

.wx-hours__t {
	font-weight: 700;
	font-size: 1rem;
}

/* 10 дней коротко — строками */
.wx-days {
	margin: 0;
	padding: 0;
	list-style: none;
	border-top: 1px solid var(--af-border);
}

.wx-days__item {
	display: grid;
	grid-template-columns: 11rem 3rem 6.5rem minmax(0, 1fr) 7rem 8.5rem;
	gap: .75rem;
	align-items: center;
	padding: .45rem 0;
	border-bottom: 1px solid var(--af-border);
}

.wx-days__item.is-weekend .wx-days__date b {
	color: var(--af-warm);
}

.wx-days__t span,
.wx-days__p,
.wx-days__w,
.wx-days__text {
	color: var(--af-muted);
	font-size: .9rem;
}

.wx-days__t b {
	font-size: 1.05rem;
}

@media (max-width: 767.98px) {
	.wx-days__item {
		grid-template-columns: minmax(0, 1fr) 2.8rem 5.5rem;
	}

	.wx-days__text,
	.wx-days__p,
	.wx-days__w {
		display: none;
	}
}

/* Подробно по дням: части суток таблицей */
.wx-longs {
	display: grid;
	gap: 1rem;
}

.wx-long {
	padding: 1rem 1.2rem;
	border: 1px solid var(--af-border);
	border-radius: var(--af-radius);
	background: var(--af-surface);
}

.wx-long.is-weekend .wx-long__date {
	color: var(--af-warm);
}

.wx-long__head {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	gap: .5rem 1rem;
	margin-bottom: .5rem;
}

.wx-long__date {
	margin: 0;
	font-size: 1.05rem;
}

.wx-long__sum {
	display: flex;
	align-items: center;
	gap: .4rem;
	margin: 0;
	color: var(--af-muted);
}

.wx-long__sum b {
	color: var(--af-text);
}

.wx-parts,
.wx-table {
	width: 100%;
	border-collapse: collapse;
	font-size: .9rem;
}

.wx-parts th,
.wx-parts td,
.wx-table th,
.wx-table td {
	padding: .35rem .5rem;
	border-bottom: 1px solid var(--af-border);
	text-align: center;
}

.wx-parts tbody th,
.wx-table tbody th {
	color: var(--af-muted);
	font-weight: 500;
	text-align: left;
	white-space: nowrap;
}

.wx-parts thead th,
.wx-table thead th {
	color: var(--af-muted);
	font-size: .8rem;
	font-weight: 600;
	text-transform: lowercase;
}

.wx-table__sym {
	text-align: left !important;
	white-space: nowrap;
}

.wx-table__sym img {
	vertical-align: middle;
}

.wx-block {
	overflow-x: auto;
}

.wx-note,
.wx-source {
	color: var(--af-muted);
	font-size: .85rem;
	line-height: 1.5;
}

/* Предупреждение МЧС */
.wx-warn {
	padding: 1rem 1.2rem;
	border-left: 4px solid #d9480f;
	border-radius: var(--af-radius);
	background: #fff4e6;
	color: #5c2400;
}

.wx-warn__title {
	margin: 0 0 .35rem;
	font-size: 1rem;
}

.wx-warn__list {
	margin: 0;
	padding-left: 1.1rem;
}

.wx-warn__src {
	margin: .5rem 0 0;
	font-size: .8rem;
	opacity: .8;
}

.wx-warn a {
	color: inherit;
}

@media (prefers-color-scheme: dark) {
	.wx-warn {
		background: #3a1d0b;
		color: #ffd8b8;
	}
}

/* Другие места */
.wx-places__group + .wx-places__group {
	margin-top: 1rem;
}

.wx-places__title {
	margin: 0 0 .4rem;
	color: var(--af-muted);
	font-size: .85rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .04em;
}

.wx-places__list {
	display: flex;
	flex-wrap: wrap;
	gap: .35rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.wx-places__list a {
	display: inline-block;
	padding: .3rem .7rem;
	border: 1px solid var(--af-border);
	border-radius: 999px;
	background: var(--af-surface);
	font-size: .9rem;
	text-decoration: none;
}

.wx-places__list a:hover {
	border-color: var(--af-accent);
}

/* Архив: календарь дат */
.wx-calendar {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
	gap: 1rem 1.5rem;
}

.wx-calendar h3 {
	margin: 0 0 .4rem;
	font-size: .95rem;
}

.wx-calendar ol {
	display: grid;
	grid-template-columns: repeat(7, 1fr);
	gap: 2px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.wx-calendar a {
	display: block;
	padding: .2rem 0;
	border-radius: 6px;
	font-size: .85rem;
	text-align: center;
	text-decoration: none;
}

.wx-calendar a:hover {
	background: var(--af-accent);
	color: #fff;
}

.wx-daynav {
	display: flex;
	justify-content: space-between;
}

/* Байкал */
.wx-baikal {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
	gap: 1rem;
}

.wx-bk__name {
	margin: 0 0 .4rem;
	font-size: 1.05rem;
}

.wx-bk__now {
	display: flex;
	align-items: center;
	gap: .4rem;
	margin: 0;
}

.wx-bk__wind {
	margin: .4rem 0;
	padding: .35rem .6rem;
	border-radius: 8px;
	font-size: .9rem;
	font-weight: 600;
}

.wx-bk__wind--calm { background: #e6f4ea; color: #1e6b34; }
.wx-bk__wind--mid { background: #fff7e0; color: #7a5200; }
.wx-bk__wind--warn { background: #ffe8d6; color: #9a3a00; }
.wx-bk__wind--danger { background: #ffe0e0; color: #a10d0d; }

.wx-bk__days {
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: .88rem;
}

.wx-bk__days li {
	display: flex;
	align-items: center;
	gap: .35rem;
	padding: .2rem 0;
}

.wx-bk__days span {
	width: 4.8rem;
	color: var(--af-muted);
}

/* Магнитные бури */
.wx-kp {
	display: inline-block;
	padding: .15rem .55rem;
	border-radius: 999px;
	font-weight: 600;
	text-decoration: none;
}

.wx-kp--quiet { background: #e6f4ea; color: #1e6b34; }
.wx-kp--unsettled { background: #fff7e0; color: #7a5200; }
.wx-kp--g1, .wx-kp--g2 { background: #ffe8d6; color: #9a3a00; }
.wx-kp--g3, .wx-kp--g4, .wx-kp--g5 { background: #ffe0e0; color: #a10d0d; }

.wx-kpdays {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(290px, 1fr));
	gap: 1rem;
}

.wx-kpday__date {
	margin: 0 0 .4rem;
	font-size: 1rem;
}

.wx-kpbars {
	display: flex;
	align-items: flex-end;
	gap: 4px;
	height: 120px;
	margin: .8rem 0 0;
	padding: 0;
	list-style: none;
}

.wx-kpbar {
	position: relative;
	display: flex;
	flex: 1;
	flex-direction: column;
	justify-content: flex-end;
	align-items: center;
	height: 100%;
	font-size: .7rem;
}

.wx-kpbar::before {
	content: "";
	order: 1;
	width: 100%;
	height: calc(var(--kp) / 9 * 80%);
	min-height: 3px;
	border-radius: 4px 4px 0 0;
	background: #3aa757;
}

.wx-kpbar--unsettled::before { background: #f5b800; }
.wx-kpbar--g1::before, .wx-kpbar--g2::before { background: #f07c2a; }
.wx-kpbar--g3::before, .wx-kpbar--g4::before, .wx-kpbar--g5::before { background: #e5484d; }

.wx-kpbar.is-forecast::before {
	opacity: .55;
}

.wx-kpbar__v {
	order: 0;
	font-weight: 600;
}

.wx-kpbar__t {
	order: 2;
	color: var(--af-muted);
}

/* ============================================================================
   Городские сервисы (com_jlcity): время, отключения, топливо
   ============================================================================ */

.cty > * + * {
	margin-top: 1.5rem;
}

.cty-lead {
	font-size: 1.05rem;
	line-height: 1.5;
}

.cty-note,
.cty-source {
	color: var(--af-muted);
	font-size: .85rem;
}

.cty-clock {
	display: grid;
	gap: .5rem;
}

.cty-clock__label {
	margin: 0;
	color: var(--af-muted);
	font-weight: 600;
}

.cty-clock__time {
	margin: 0;
	font-family: var(--af-display);
	font-size: clamp(3rem, 2rem + 5vw, 5.5rem);
	font-weight: 700;
	font-variant-numeric: tabular-nums;
	line-height: 1;
	letter-spacing: -.03em;
}

.cty-clock__time span {
	color: var(--af-muted);
	font-size: .45em;
	letter-spacing: 0;
}

.cty-clock__date {
	margin: 0 0 .5rem;
	font-size: 1.05rem;
}

.cty-pair {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: 1rem;
}

.cty-pair .cty-clock__time {
	font-size: clamp(2.4rem, 1.8rem + 3vw, 3.6rem);
}

.cty-cities,
.cty-places,
.cty-links {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
	gap: .35rem 1.5rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.cty-cities li,
.cty-places li {
	display: flex;
	align-items: baseline;
	gap: .5rem;
	padding: .35rem 0;
	border-bottom: 1px solid var(--af-border);
}

.cty-cities li a,
.cty-places li a {
	flex: 1 1 auto;
}

.cty-cities b {
	font-variant-numeric: tabular-nums;
}

.cty-cities span,
.cty-places span {
	min-width: 4.5em;
	color: var(--af-muted);
	font-size: .85rem;
	text-align: right;
}

.cty-places li.is-city a {
	font-weight: 600;
}

.cty-places--muted a {
	color: var(--af-muted);
}

.cty-faq h3 {
	margin: 1rem 0 .25rem;
	font-size: 1rem;
}

.cty-table-wrap {
	overflow-x: auto;
}

.cty-table {
	width: 100%;
	border-collapse: collapse;
	font-variant-numeric: tabular-nums;
}

.cty-table th,
.cty-table td {
	padding: .45rem .6rem;
	border-bottom: 1px solid var(--af-border);
	text-align: right;
	vertical-align: top;
	white-space: nowrap;
}

.cty-table th:first-child,
.cty-table td:first-child {
	text-align: left;
}

.cty-table thead th {
	color: var(--af-muted);
	font-size: .82rem;
	font-weight: 400;
}

.cty-table tbody th {
	font-weight: 600;
	white-space: normal;
}

.cty-table tbody th small {
	color: var(--af-muted);
	font-weight: 400;
}

.cty-table td.is-work {
	background: color-mix(in srgb, var(--af-warm) 14%, transparent);
}

.cty-table tr.is-home {
	background: color-mix(in srgb, var(--af-accent) 8%, transparent);
}

.cty-stations td,
.cty-stations th {
	font-size: .92rem;
}

.cty-delta {
	color: var(--af-muted);
}

.cty-delta.is-up {
	color: #c0392b;
}

.cty-delta.is-down {
	color: #2e8b57;
}

.cty-chart {
	margin: 1rem 0 0;
}

.cty-chart svg {
	width: 100%;
	height: auto;
	max-height: 260px;
}

.cty-chart__grid {
	stroke: var(--af-border);
	stroke-width: 1;
}

.cty-chart__label {
	fill: var(--af-muted);
	font-size: 11px;
}

.cty-chart figcaption span {
	margin-right: 1rem;
	font-size: .85rem;
}

.cty-chart figcaption span::before {
	content: "";
	display: inline-block;
	width: .9em;
	height: .25em;
	margin-right: .35em;
	vertical-align: middle;
	background: var(--c);
}

.cty-map {
	height: 380px;
	border-radius: var(--af-radius);
	overflow: hidden;
}

.cty-day {
	margin: 1.25rem 0 .5rem;
	font-size: 1.05rem;
}

.cty-day small {
	color: var(--af-muted);
	font-weight: 400;
}

.cty-outages {
	margin: 0;
	padding: 0;
	list-style: none;
}

.cty-outage {
	display: grid;
	grid-template-columns: 8.5rem minmax(0, 1fr);
	gap: .15rem 1rem;
	padding: .55rem 0;
	border-bottom: 1px solid var(--af-border);
}

.cty-outage__time {
	font-variant-numeric: tabular-nums;
}

.cty-outage__time b {
	display: block;
	color: #c0392b;
	font-size: .8rem;
}

.cty-outage__kind {
	display: inline-block;
	margin-right: .35rem;
	padding: 0 .4rem;
	border-radius: 4px;
	background: color-mix(in srgb, var(--af-warm) 22%, transparent);
	font-size: .75rem;
	font-weight: 600;
	vertical-align: .1em;
}

.cty-outage--heat .cty-outage__kind {
	background: color-mix(in srgb, #c0392b 18%, transparent);
}

.cty-outage__houses {
	color: var(--af-muted);
}

.cty-outage__reason {
	grid-column: 2;
	color: var(--af-muted);
	font-size: .85rem;
}

@media (max-width: 575.98px) {
	.cty-outage {
		grid-template-columns: minmax(0, 1fr);
	}

	.cty-outage__reason {
		grid-column: 1;
	}
}

/* Информеры Яндекс Расписаний в статьях транспорта: во всю ширину колонки */
.afisha-informer iframe {
	display: block;
	width: 100%;
	height: 1000px;
	border: 0;
	border-radius: var(--af-radius);
	background: #fff;
}

.cty-article h2 {
	margin: 1.5rem 0 .5rem;
	font-size: 1.15rem;
}

.cty-table td.is-cold b {
	color: #1b6fb8;
}

.cty-table td.is-warm b {
	color: #c0392b;
}

/* «Иркутск сегодня»: плитки сводки */
.cty-today__grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
	gap: 1rem;
}

.cty-tile {
	display: flex;
	flex-direction: column;
	gap: .35rem;
	color: inherit;
	text-decoration: none;
}

.cty-tile:hover {
	border-color: var(--af-accent);
}

.cty-tile__label {
	color: var(--af-muted);
	font-size: .85rem;
}

.cty-tile__value {
	display: flex;
	align-items: center;
	gap: .4rem;
	font-family: var(--af-display);
	font-size: 2rem;
	font-weight: 700;
	line-height: 1.1;
}

.cty-tile__value--small {
	font-size: 1.15rem;
}

.cty-tile__text {
	font-size: .9rem;
	line-height: 1.4;
}

.cty-traffic::before {
	content: "";
	width: .8rem;
	height: .8rem;
	border-radius: 50%;
	background: #3aa757;
}

.cty-traffic.is-yellow::before { background: #f5b800; }
.cty-traffic.is-red::before { background: #e5484d; }

/* Телепрограмма: вся сетка дня под «ещё» */
.afisha-tv-card__more {
	margin-top: .6rem;
}

.afisha-tv-card__more summary {
	color: var(--af-accent);
	font-size: .88rem;
	cursor: pointer;
}

.afisha-tv-list--compact .afisha-tv-list__item {
	padding-block: .2rem;
	font-size: .88rem;
}

.afisha-tv-list__item.is-past {
	color: var(--af-muted);
}

/* Маршруты транспорта */
.cty-route-list {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
	gap: .3rem 1.5rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.cty-route-list a {
	display: flex;
	align-items: baseline;
	gap: .6rem;
	padding: .35rem 0;
	border-bottom: 1px solid var(--af-border);
	color: inherit;
	text-decoration: none;
}

.cty-route-list a:hover {
	color: var(--af-accent);
}

.cty-route-num {
	flex: 0 0 auto;
	min-width: 2.6rem;
	padding: .1rem .4rem;
	border-radius: 6px;
	background: #1b6fb8;
	color: #fff;
	font-variant-numeric: tabular-nums;
	text-align: center;
}

.cty-route-num--tram { background: #c0392b; }
.cty-route-num--trolleybus { background: #2e8b57; }
.cty-route-num--minibus { background: #e79a16; }

.cty-dirs {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	gap: 0 2rem;
}

.cty-stops {
	margin: 0;
	padding-left: 1.6rem;
}

.cty-stops li {
	padding: .2rem 0;
}

/* Медицина */
.cty-med-cats {
	margin: 0;
	padding: 0;
	list-style: none;
}

.cty-med-list {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
	gap: .75rem 1.5rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.cty-med {
	display: flex;
	flex-direction: column;
	gap: .15rem;
	padding: .6rem 0;
	border-bottom: 1px solid var(--af-border);
	font-size: .92rem;
}

.cty-med__hours {
	color: var(--af-muted);
}

.cty-links-inline {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem 1.25rem;
}

.cty-med-org {
	padding: .75rem 0;
	border-bottom: 1px solid var(--af-border);
}

.cty-med-org h2,
.cty-med-addr h3 {
	margin: 0 0 .3rem;
	font-size: 1.05rem;
}

.cty-med-org ul {
	margin: .3rem 0 0;
}

.cty-med-addr {
	padding: .75rem 0;
	border-bottom: 1px solid var(--af-border);
}

.cty-chip {
	display: inline-block;
	margin: 0 .35rem .45rem 0;
	padding: .3rem .7rem;
	border: 1px solid var(--af-border);
	border-radius: 999px;
	background: var(--af-surface);
	font-size: .9rem;
	text-decoration: none;
}

/* Поиск авиабилетов */
.cty-avia {
	display: grid;
	gap: .9rem;
}

.cty-avia__row {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
	gap: .75rem;
}

.cty-avia label {
	display: grid;
	gap: .25rem;
	color: var(--af-muted);
	font-size: .82rem;
}

.cty-avia select,
.cty-avia input {
	padding: .55rem .6rem;
	border: 1px solid var(--af-border);
	border-radius: 8px;
	background: var(--af-surface);
	color: var(--af-text);
	font: inherit;
	font-size: 1rem;
}

.cty-avia__go {
	justify-self: start;
	padding: .75rem 1.6rem;
	border: 0;
	border-radius: 10px;
	background: var(--af-warm);
	color: var(--af-warm-ink);
	font: inherit;
	font-weight: 700;
	cursor: pointer;
}

/* Расписания (Яндекс Расписания): сегодня / завтра, ушедшие рейсы серым */
.cty-rasp-nav {
	margin: .5rem 0 1rem;
}

.cty-rasp-nav .cty-chip.is-active {
	border-color: var(--af-accent);
	background: var(--af-accent);
	color: #fff;
}

.cty-rasp-table td,
.cty-rasp-table th {
	white-space: nowrap;
}

.cty-rasp-table tbody th,
.cty-rasp-table .cty-rasp-days {
	white-space: normal;
}

.cty-rasp-table .cty-rasp-days {
	text-align: left;
	font-size: .9rem;
}

.cty-rasp-table tbody th small,
.cty-rasp-table td small {
	display: block;
	color: var(--af-muted);
	font-weight: 400;
}

.cty-rasp-table tr.is-past {
	opacity: .45;
}

@media (max-width: 480px) {
	.cty-rasp-table th,
	.cty-rasp-table td {
		padding: .4rem .35rem;
	}

	.cty-rasp-table .cty-rasp-dur {
		display: none;
	}
}

.cty-rasp-live {
	margin: 1rem 0;
}

.cty-rasp-live summary {
	cursor: pointer;
	color: var(--af-accent);
}

/* --- Новости: «Главное», карточки, страница новости -------------------------- */

.news-top {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1.25rem 1.5rem;
	margin: 0 0 2.5rem;
}

.news-card {
	display: flex;
	flex-direction: column;
	gap: .5rem;
	min-width: 0;
}

.news-card__image {
	display: block;
	overflow: hidden;
	border-radius: var(--af-radius);
	background: var(--af-border);
}

.news-card__image img {
	display: block;
	width: 100%;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	transition: transform .3s ease;
}

.news-card:hover .news-card__image img {
	transform: scale(1.03);
}

.news-card__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .4rem .6rem;
	margin: .15rem 0 0;
	color: var(--af-muted);
	font-size: .85rem;
}

.news-card__title {
	margin: 0;
	font-family: var(--af-display);
	font-size: 1.02rem;
	font-weight: 600;
	line-height: 1.35;
}

.news-card__title a {
	color: var(--af-text);
	text-decoration: none;
}

.news-card__title a:hover {
	color: var(--af-accent);
}

.news-card__excerpt {
	display: -webkit-box;
	margin: 0;
	overflow: hidden;
	color: var(--af-muted);
	line-height: 1.55;
	-webkit-line-clamp: 5;
	-webkit-box-orient: vertical;
}

/* Главная новость — на всю ширину: фото слева, текст справа */
.news-card--lead {
	grid-column: 1 / -1;
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: .9rem;
	align-items: start;
	padding-bottom: 1.5rem;
	border-bottom: 1px solid var(--af-border);
}

.news-card--lead .news-card__body {
	display: flex;
	flex-direction: column;
	gap: .6rem;
}

.news-card--lead .news-card__title {
	font-size: clamp(1.2rem, 1.8vw, 1.5rem);
	line-height: 1.25;
	letter-spacing: -.02em;
}

.news-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 15rem), 1fr));
	gap: 1.5rem;
}

@media (max-width: 767.98px) {
	.news-top,
	.news-card--lead {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* Лента: миниатюры 16:9, время вместо даты у свежих */
.afisha-news-item__image img {
	aspect-ratio: 16 / 10;
}

/* Страница новости: лид крупнее, сервис — карточкой, источник — подписью */
.afisha-article__body--news > p:first-child {
	font-size: 1.18rem;
	font-weight: 500;
	line-height: 1.6;
}

.afisha-article__body .news-service {
	margin: 1.5rem 0;
	padding: .9rem 1.1rem;
	border: 1px solid var(--af-border);
	border-left: 4px solid var(--af-warm);
	border-radius: var(--af-radius);
	background: var(--af-surface);
	font-weight: 600;
}

.afisha-article__body .news-service a {
	text-decoration: none;
}

.afisha-article__body .news-source {
	margin-top: 1.75rem;
	padding-top: .9rem;
	border-top: 1px solid var(--af-border);
	color: var(--af-muted);
	font-size: .92rem;
}

.afisha-article__figure figcaption {
	margin-top: .45rem;
	color: var(--af-muted);
	font-size: .8rem;
}

.afisha-article__figure figcaption a {
	color: inherit;
}

.afisha-article__figure--news img {
	aspect-ratio: 16 / 9;
	object-fit: cover;
}

.news-share {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .5rem;
	margin: 1.75rem 0 0;
	color: var(--af-muted);
	font-size: .9rem;
}

.news-share a {
	padding: .35rem .8rem;
	border: 1px solid var(--af-border);
	border-radius: 999px;
	background: var(--af-surface);
	color: var(--af-text);
	text-decoration: none;
}

.news-share a:hover {
	border-color: var(--af-accent);
	color: var(--af-accent);
}

/* Путеводители: блок в «Туризме», дата обновления и источники в статье */
.guides {
	margin: 2rem 0 2.5rem;
}

.afisha-article__body .guide-updated {
	margin-top: 2rem;
	padding: .75rem 1rem;
	border-radius: var(--af-radius);
	background: var(--af-surface);
	color: var(--af-muted);
	font-size: .92rem;
}

.afisha-article__body .guide-sources {
	color: var(--af-muted);
	font-size: .9rem;
}

.afisha-article__body table {
	width: 100%;
	margin: 0 0 1.25rem;
	border-collapse: collapse;
	font-size: .95rem;
}

.afisha-article__body th,
.afisha-article__body td {
	padding: .45rem .6rem;
	border-bottom: 1px solid var(--af-border);
	text-align: left;
	vertical-align: top;
}
