/* ===== Анимации: появление при прокрутке, ховеры карточек, стеклянная шапка, пульс кнопки, параллакс =====
   Подключается последним (inc/setup.php). Двигаем только transform и opacity.
   Всё отключается при prefers-reduced-motion: reduce; без JS (нет html.anim) контент виден сразу.
   Подробнее — README, раздел «Анимации». */

/* ---------- 1. Появление при прокрутке ----------
   Прячем только при html.anim (класс ставит скрипт в <head>, если есть IntersectionObserver и нет reduced-motion;
   main.js не стартовал за 5 с — класс снимается). Список селекторов совпадает с IN_SEL в main.js. */
.anim :is(.section-head, .svc-card, .promo-card, .svc-review, .svc-branch, .price-group, .svc-why__item, .faq-list__item, .contact-card, .about-block__main, .about-block__photo, .svc-form, .svc-cta, .reviews-block__map):not(.in) {
	opacity: 0;
}
.anim :is(.section-head, .svc-card, .promo-card, .svc-review, .svc-branch, .price-group, .svc-why__item, .faq-list__item, .contact-card, .about-block__main, .about-block__photo, .svc-form, .svc-cta, .reviews-block__map).in {
	/* backwards: после анимации действуют обычные стили элемента — ховер-transform не перебивается */
	animation: rv-in 0.56s cubic-bezier(0.22, 0.7, 0.2, 1) var(--rv-d, 0ms) backwards;
}
@keyframes rv-in {
	from {
		opacity: 0;
		transform: translateY(22px);
	}
}
@media print, (prefers-reduced-motion: reduce) {
	.anim :is(.section-head, .svc-card, .promo-card, .svc-review, .svc-branch, .price-group, .svc-why__item, .faq-list__item, .contact-card, .about-block__main, .about-block__photo, .svc-form, .svc-cta, .reviews-block__map):not(.in) {
		opacity: 1;
	}
	.anim :is(.section-head, .svc-card, .promo-card, .svc-review, .svc-branch, .price-group, .svc-why__item, .faq-list__item, .contact-card, .about-block__main, .about-block__photo, .svc-form, .svc-cta, .reviews-block__map).in {
		animation: none;
	}
}

/* ---------- 3. Ховеры карточек: подъём, тень, зум фото (только мышь) ---------- */
@media (hover: hover) and (pointer: fine) {
	body .svc-card,
	body .promo-card,
	body .svc-review,
	body .svc-branch,
	body .price-group {
		transition: transform 0.32s cubic-bezier(0.22, 0.7, 0.2, 1), box-shadow 0.32s ease, border-color 0.32s ease;
	}
	body .svc-card:hover,
	body .promo-card:hover,
	body .svc-review:hover,
	body .svc-branch:hover,
	body .price-group:hover {
		transform: translateY(-5px);
		box-shadow: 0 16px 34px rgba(10, 12, 16, 0.15);
	}
	body .svc-review:hover {
		box-shadow: 0 10px 22px rgba(10, 12, 16, 0.12);
	}
	body .price-group:hover {
		box-shadow: 0 12px 28px rgba(10, 12, 16, 0.1);
	}
	/* фото: зум внутри рамки (рамка с overflow: hidden) */
	body .svc-card__img,
	body .svc-branch__photo img,
	body .promo-card__bg img {
		transition: transform 0.6s cubic-bezier(0.22, 0.7, 0.2, 1);
	}
	body .svc-card__img {
		transform-origin: 50% 100%; /* низ фото на месте: жёлтая иконка свисает за край, зум её не затронет */
	}
	body .svc-card:hover .svc-card__img,
	body .svc-branch:hover .svc-branch__photo img,
	body .promo-card:hover .promo-card__bg img {
		transform: scale(1.05);
	}
}
.svc-branch__photo {
	overflow: hidden;
	border-radius: var(--radius);
}
/* Место под тень поднятой карточки в слайдере отзывов (иначе её режет overflow слайдера); вёрстка не меняется */
.reviews-slider .swiper {
	padding: 8px 4px 30px;
	margin: -8px -4px -30px;
}

/* ---------- 5. Стеклянная шапка ----------
   Блюр на псевдоэлементе, а не на самой шапке: backdrop-filter у шапки сделал бы её контейнером для position: fixed —
   мобильное меню (.nav) поехало бы. */
.site-header {
	background: transparent;
	isolation: isolate;
}
.site-header::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: var(--c-yellow);
	pointer-events: none;
	transition: background-color 0.3s ease, backdrop-filter 0.3s ease, -webkit-backdrop-filter 0.3s ease;
}
.site-header.is-scrolled {
	box-shadow: 0 6px 24px rgba(10, 12, 16, 0.16);
}
.site-header.is-scrolled::before {
	background: rgba(255, 214, 0, 0.82);
	-webkit-backdrop-filter: blur(14px) saturate(1.5);
	backdrop-filter: blur(14px) saturate(1.5);
}
/* телефон и планшет: шапка при прокрутке сплошная, без стекла (сквозь неё просвечивал текст) */
@media (max-width: 1023px) {
	.site-header.is-scrolled {
		box-shadow: 0 4px 16px rgba(10, 12, 16, 0.2);
	}
	.site-header.is-scrolled::before {
		background: var(--c-yellow);
		-webkit-backdrop-filter: none;
		backdrop-filter: none;
	}
}
/* открытое меню — шапка снова сплошная */
.nav-open .site-header::before {
	background: var(--c-yellow);
	-webkit-backdrop-filter: none;
	backdrop-filter: none;
}
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
	.site-header.is-scrolled::before {
		background: var(--c-yellow);
	}
}

/* ---------- 6. Пульс главной кнопки «Записаться»: кольцо-свечение раз в несколько секунд ---------- */
.hero-block__btn:not(.hero-block__btn--2),
.dock__btn--book {
	position: relative;
}
.hero-block__btn:not(.hero-block__btn--2)::after,
.dock__btn--book::after {
	content: "";
	position: absolute;
	inset: -1px;
	border-radius: inherit;
	box-shadow: 0 0 0 3px rgba(255, 214, 0, 0.7), 0 0 20px 4px rgba(255, 214, 0, 0.5);
	opacity: 0;
	pointer-events: none;
	animation: btn-pulse 4.8s ease-out 2.4s infinite;
}
@keyframes btn-pulse {
	0%,
	58% {
		opacity: 0;
		transform: scale(1);
	}
	64% {
		opacity: 0.85;
	}
	100% {
		opacity: 0;
		transform: scale(1.1, 1.32);
	}
}

/* ---------- 4. Параллакс фона первого экрана (≥1024px; transform ставит main.js) ----------
   Фон чуть выше секции: запас под сдвиг вниз при прокрутке (MAX в initParallax). */
.hero-block.is-parallax .hero-block__bg {
	top: -140px;
	will-change: transform;
}

/* ---------- 7. Слайдер: листать некуда — стрелок нет (класс ставит main.js) ---------- */
[data-slider].is-locked .slider-nav,
.slider-nav button.swiper-button-lock {
	display: none;
}

@media (prefers-reduced-motion: reduce) {
	.hero-block__btn:not(.hero-block__btn--2)::after,
	.dock__btn--book::after {
		animation: none;
		display: none;
	}
	.hero-block.is-parallax .hero-block__bg {
		top: 0;
		will-change: auto;
	}
	body .svc-card,
	body .promo-card,
	body .svc-review,
	body .svc-branch,
	body .price-group,
	body .svc-card__img,
	body .svc-branch__photo img,
	body .promo-card__bg img {
		transition: none;
	}
	body .svc-card:hover,
	body .promo-card:hover,
	body .svc-review:hover,
	body .svc-branch:hover,
	body .price-group:hover {
		transform: none;
	}
	body .svc-card:hover .svc-card__img,
	body .svc-branch:hover .svc-branch__photo img,
	body .promo-card:hover .promo-card__bg img {
		transform: none;
	}
	.site-header::before {
		transition: none;
	}
}
