/* az-fast.css — снижение стоимости отрисовки (12.08.2026).
   Зачем: по 6673 замерам живых посетителей отклик (INP) складывается на 72% из ОТРИСОВКИ,
   а срабатывает она на наведении мыши — компьютеры 736 мс, телефоны 392 мс при пороге 200.
   Скрипты не виноваты вовсе (0%). Разбор — в памяти project-azbukafilmov-cwv.
   Подключается ПОСЛЕ az-glass.css. Отключается удалением одной строки в main.tpl.

   ⛔ Сюда НЕ добавлять `will-change: transform` по :hover — пробовали и убрали: слой
   создаётся ровно в тот момент, когда нужна скорость, и растеризация плитки с постером
   500×750 стоит дороже обычной перерисовки. Правила ниже только СНИМАЮТ работу. */

/* ---------- 1. Следим только за нужными свойствами ----------
   В all.min.css у плиток стоит `transition:.3s` без имени свойства — это значит «все
   свойства», и браузер сторожит каждое. Сужаем до тех, что реально меняются. */
.fix-sect_bg,
.fix-recom_bg,
.fix-top10_bg {
	transition: transform .3s, box-shadow .3s, border-color .3s;
}

.fix-podb_item > img,
.milkanews-item img {
	transition: transform .3s;
}

/* ---------- 2. Наведение — только там, где есть настоящая мышь ----------
   На телефоне hover срабатывает от касания: пользователь ничего не выигрывает,
   а браузер платит перерисовкой (touchend 264 мс в замерах). */
@media (hover: none), (pointer: coarse) {
	.fix-recom_bg:hover,
	.fix-sect_bg:hover,
	.fix-top10_bg:hover,
	.milkanews-item:hover img,
	.az-card-poster:hover img,
	.fix-podb_item:hover > img,
	.azb-news_item:hover {
		transform: none !important;
	}
}

/* ---------- 3. На телефонах убираем размытие фона ----------
   backdrop-filter: blur(16…24px) — самый дорогой эффект на странице: любая перерисовка
   под таким слоем требует пересчёта размытия. Взамен делаем фон плотнее, чтобы текст
   читался ровно так же. Планшетов и компьютеров правка не касается — там стекло остаётся. */
@media (max-width: 767px) {
	.az-topnav,
	.az-topnav_drop,
	.az-mmenu,
	.azb-sub-btn,
	.az-hero-box.is-ready .az-hero-strip,
	html:not(.az-light) .category-tabs-container,
	html:not(.az-light) .akf-bar,
	html:not(.az-light) .azb-rate,
	html.az-light .category-tabs-container,
	html.az-light .akf-bar,
	html.az-light .azb-rate,
	html.az-light .section_block,
	html.az-light .lastcomm-item,
	html.az-light .azbuka-faq details,
	html.az-light .category-tabs-container .tab-pane a,
	html.az-light .akf-chip,
	html.az-light #az-theme-btn {
		backdrop-filter: none !important;
		-webkit-backdrop-filter: none !important;
	}

	/* фон плотнее — вместо размытия. Тёмная тема */
	html:not(.az-light) .az-topnav {
		background: rgba(17, 21, 30, .94) !important;
	}

	html:not(.az-light) .category-tabs-container,
	html:not(.az-light) .akf-bar,
	html:not(.az-light) .azb-rate {
		background: rgba(28, 34, 46, .94) !important;
	}

	html:not(.az-light) .az-hero-box.is-ready .az-hero-strip {
		background: rgba(12, 14, 19, .92) !important;
	}

	/* светлая тема */
	html.az-light .az-topnav {
		background: rgba(255, 255, 255, .95) !important;
	}

	html.az-light .category-tabs-container,
	html.az-light .akf-bar,
	html.az-light .azb-rate {
		background: rgba(255, 255, 255, .95) !important;
	}

	html.az-light .lastcomm-item,
	html.az-light .azbuka-faq details {
		background: rgba(255, 255, 255, .95) !important;
	}
}

/* ---------- 4. Размытие на компьютерах — мягче ----------
   На широких экранах стекло оставляем, но радиус уменьшаем: стоимость размытия растёт
   примерно квадратично от радиуса, а 22px и 10px на глаз почти не различаются.
   Именно эти слои (шапка видна всегда, панель фильтра и блок оценки — на пол-экрана)
   заставляли браузер пересчитывать размытие при каждой перерисовке. */
@media (min-width: 768px) {
	.az-topnav {
		backdrop-filter: blur(8px) saturate(1.2) !important;
		-webkit-backdrop-filter: blur(8px) saturate(1.2) !important;
	}

	.az-topnav_drop,
	.az-mmenu,
	html:not(.az-light) .category-tabs-container,
	html:not(.az-light) .akf-bar,
	html:not(.az-light) .azb-rate,
	html.az-light .category-tabs-container,
	html.az-light .akf-bar,
	html.az-light .azb-rate,
	html.az-light .section_block,
	html.az-light .lastcomm-item,
	html.az-light .azbuka-faq details {
		backdrop-filter: blur(10px) saturate(1.2) !important;
		-webkit-backdrop-filter: blur(10px) saturate(1.2) !important;
	}
}

/* ---------- 5. Подпись под постером не дрожит ----------
   line-height был `normal`, то есть высота строки зависела от метрик шрифта: пока грузится
   Proxima Nova, подпись 18,5px, после подмены — 19px. Пол пикселя на каждой из 42 плиток
   давали заметный сдвиг всего каталога (в замерах — 2577 случаев за неделю).
   Фиксируем ровно ту высоту, что и сейчас, — вид не меняется. */
.fix-sect_bg .e-nowrap.rele1,
.fix-recom_bg .e-nowrap.rele1,
.fix-top10_bg .e-nowrap.rele1 {
	line-height: 19px;
	min-height: 19px;
}

/* ---------- 6. Строка панели фильтра ----------
   Внутренняя строка дорастала с 33 до 34px после скрипта и толкала каталог. */
.akf-bar .akf-cw {
	min-height: 34px;
}

/* ---------- 7. Постер не схлопывается до загрузки картинки ----------
   У <img> без src нет заменяемого содержимого — браузер раскладывает его как
   строчный элемент, а к строчным height не применяется. Поэтому пара правил
   .e-cover img{width:100%;height:100%} молча не работала: до загрузки картинка
   занимала высоту строки (40px) вместо 300px, и подпись под постером стояла
   вверху плитки, а в момент загрузки падала на 264px вниз.
   Замеры 13.08: 328 таких сдвигов за сутки только на страницах каталога.
   display:block делает высоту применимой сразу; у загруженной картинки размеры
   не меняются, уходит лишь просвет строчного выравнивания (~4px). */
.e-cover img {
	display: block;
}

/* ---------- 8. Лента премьер под слайдом не толкает главную ----------
   Лента была скрыта до наполнения, и в момент появления главная уезжала вниз
   ровно на 93px (в замерах — `div.wrapper > div#azb-cw` dy=93 на 0,5–1,1 с).
   Теперь она показана сразу и держит свою будущую высоту, а наполняется позже.
   Высоты сняты замером на живой странице: до 430px — 70, до 860px — 80, шире — 93.
   Оформление повторяет правило `.is-ready` из az-glass.css один в один, чтобы
   после наполнения ничего не менялось. */
.az-hero-strip {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 6px 44px 10px;
	background: rgba(12, 14, 19, .72);
	border-top: 1px solid rgba(255, 255, 255, .06);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
	min-height: 93px;
}

html.az-light .az-hero-strip {
	background: rgba(255, 255, 255, .72);
	border-top-color: rgba(20, 25, 40, .10);
}

/* пока лента пуста, стрелки листать нечем — иначе висят в пустой полосе */
.az-hero-box:not(.is-ready) .az-hero-arr {
	visibility: hidden;
}

@media (max-width: 860px) {
	.az-hero-strip {
		padding: 5px 16px 8px;
		gap: 8px;
		min-height: 80px;
	}
}

@media (max-width: 430px) {
	.az-hero-strip {
		padding: 4px 12px 7px;
		gap: 7px;
		min-height: 70px;
	}
}