/**
 * Главная страница — самописная верстка (замена Elementor).
 * Значения перенесены 1:1 из сгенерированного Elementor CSS
 * (post-6 kit, post-11 page, post-15 header, post-193 footer).
 *
 * Брейкпоинты Elementor: 1366 / 1024 / 767.
 */

/* ============================ ТОКЕНЫ ============================ */

.kn-page {
	--kn-bg: #010202;
	--kn-white: #ffffff;
	--kn-accent: #00636b;
	--kn-container: 1200px;
	--kn-pad: 64px;
	--kn-section-gap: 140px;

	overflow-x: hidden;
	background-color: var(--kn-bg);
	color: var(--kn-white);
	font-family: "Noah", sans-serif;
}

.kn-page *,
.kn-page *::before,
.kn-page *::after {
	box-sizing: border-box;
}

.kn-container {
	width: 100%;
	max-width: calc(var(--kn-container) + var(--kn-pad) * 2);
	margin-inline: auto;
	padding-inline: var(--kn-pad);
}

.kn-section {
	padding-top: var(--kn-section-gap);
}

/* Заголовки: Lato 300, 56px, uppercase */
.kn-h2 {
	margin: 0;
	font-family: "Lato", sans-serif;
	font-size: 56px;
	font-weight: 300;
	line-height: 1.2em;
	text-transform: uppercase;
	color: var(--kn-white);
}

/* Лид-текст: Noah 400, 24px */
.kn-lead {
	margin: 0;
	font-family: "Noah", sans-serif;
	font-size: 24px;
	font-weight: 400;
	line-height: 1.2em;
	color: var(--kn-white);
}

/* Анимация появления (аналог elementor fadeIn).
   Контент героя всплывает уже поверх осевшего дыма, поэтому
   стартует с задержкой ~0.5s и слегка подъезжает снизу. */
.kn-fade {
	opacity: 0;
	animation: kn-fade-in 1.1s cubic-bezier(.22, .61, .36, 1) .5s both;
}

.kn-fade[data-delay="150"] { animation-delay: .8s; }
.kn-fade[data-delay="300"] { animation-delay: 1.1s; }

@keyframes kn-fade-in {
	from {
		opacity: 0;
		transform: translateY(18px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@media (prefers-reduced-motion: reduce) {
	.kn-fade {
		opacity: 1;
		animation: none;
	}
}

/* ==================== REVEAL ПРИ СКРОЛЛЕ ==================== */

[data-kn-reveal] {
	opacity: 0;
	transform: translateY(26px);
	transition:
		opacity .7s cubic-bezier(.22, .61, .36, 1),
		transform .7s cubic-bezier(.22, .61, .36, 1);
}

[data-kn-reveal].is-visible {
	opacity: 1;
	transform: none;
}

[data-kn-reveal][data-kn-reveal-delay="1"] { transition-delay: .12s; }
[data-kn-reveal][data-kn-reveal-delay="2"] { transition-delay: .24s; }

@media (prefers-reduced-motion: reduce) {

	[data-kn-reveal] {
		opacity: 1;
		transform: none;
		transition: none;
	}
}

/* ==================== ТОЛЬКО ДЛЯ СКРИНРИДЕРОВ ==================== */

.kn-sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	border: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	white-space: nowrap;
}

/* ==================== КРУГЛАЯ КНОПКА ==================== */

.kn-circle-btn {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	aspect-ratio: 1 / 1;
	width: 193px;
	padding: 0;
	border: 1px solid var(--kn-white);
	border-radius: 50%;
	background-color: transparent;
	color: var(--kn-white);
	font-family: "Noah", sans-serif;
	font-size: 18px;
	font-weight: 500;
	line-height: 1.2em;
	text-align: center;
	text-transform: uppercase;
	text-decoration: none;
	cursor: pointer;
	transition: background-color .25s ease, color .25s ease;
}

.kn-circle-btn:hover,
.kn-circle-btn:focus-visible {
	background-color: var(--kn-white);
	color: var(--kn-bg);
}

/* Вариант с иконкой (кнопки меню) — три в ряд с учётом гэпов */
.kn-circle-btn--icon {
	position: relative;
	flex: 0 0 calc((100% - var(--kn-menu-gap, 22.5px) * 2) / 3);
	width: auto;
	max-width: calc((100% - var(--kn-menu-gap, 22.5px) * 2) / 3);
}

.kn-circle-btn--icon .kn-circle-btn__icon {
	position: absolute;
	top: 0;
	right: 0;
	width: 48px;
	height: 48px;
	line-height: 0;
}

.kn-circle-btn--icon .kn-circle-btn__icon svg {
	width: 100%;
	height: 100%;
}

/* ============================ ХЕДЕР ============================ */

.kn-header {
	position: relative;
	z-index: 10;
}

.kn-header__inner {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 40px;
	padding-block: 10px;
}

.kn-header__logo {
	margin-right: 40px;
	line-height: 0;
	flex: 0 0 auto;
}

.kn-header__logo img {
	display: block;
	width: 48px;
	height: auto;
}

.kn-header__nav {
	display: flex;
	align-items: center;
	gap: 40px;
}

.kn-header__nav-link {
	color: var(--kn-white);
	font-family: "Noah", sans-serif;
	font-size: 20px;
	font-weight: 400;
	line-height: 1em;
	text-decoration: none;
	white-space: nowrap;
	transition: opacity .2s ease;
}

.kn-header__nav-link:hover {
	opacity: .75;
}

.kn-header__cta {
	flex: 0 0 auto;
	margin-left: auto;
	padding: 10px 28px;
	border: 1px solid var(--kn-white);
	border-radius: 12px;
	background-color: transparent;
	color: var(--kn-white);
	font-family: "Noah", sans-serif;
	font-size: 20px;
	font-weight: 400;
	text-align: center;
	text-transform: uppercase;
	text-decoration: none;
	white-space: nowrap;
	transition: background-color .25s ease, color .25s ease;
}

.kn-header__cta:hover,
.kn-header__cta:focus-visible {
	background-color: var(--kn-white);
	color: var(--kn-bg);
}

/* ============================= ГЕРОЙ ============================= */
/* Хедер и герой лежат на общем фоне-дыме, поэтому фон навешен
   на .kn-hero с отрицательным отступом под хедер. */

/* Хедер лежит поверх героя (position:relative + z-index), поэтому
   герой поднимаем под него на его высоту. --kn-header-h учитывается
   в min-height внутреннего блока, чтобы первый экран = ровно 100svh. */
.kn-hero {
	--kn-header-h: 80px; /* лого 60px + паддинги 2×10px */

	position: relative;
	margin-top: calc(-1 * var(--kn-header-h));
	padding-top: var(--kn-header-h);
	isolation: isolate;
}

/* Фон-дым отдельным слоем — чтобы анимировать его независимо от контента.
   Появляется медленным «наплывом»: проявляется, чуть уезжает вниз
   и уменьшает масштаб, как оседающий дым. */
.kn-hero::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background-image: var(--kn-hero-bg);
	background-position: bottom center;
	background-repeat: no-repeat;
	background-size: cover;
	transform-origin: center 65%;
	will-change: transform, opacity, filter;
	animation: kn-smoke-in 2.4s cubic-bezier(.22, .61, .36, 1) both;
}

/* Мягкое «дыхание» после появления — дым чуть живёт, а не застывает. */
.kn-hero::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background-image: var(--kn-hero-bg);
	background-position: bottom center;
	background-repeat: no-repeat;
	background-size: cover;
	mix-blend-mode: screen;
	opacity: 0;
	pointer-events: none;
	animation: kn-smoke-drift 18s ease-in-out 2.4s infinite;
}

@keyframes kn-smoke-in {
	0% {
		opacity: 0;
		transform: scale(1.18) translateY(-3%);
		filter: blur(18px) saturate(.6);
	}
	55% {
		opacity: .85;
		filter: blur(5px) saturate(.9);
	}
	100% {
		opacity: 1;
		transform: scale(1) translateY(0);
		filter: blur(0) saturate(1);
	}
}

@keyframes kn-smoke-drift {
	0%, 100% {
		opacity: 0;
		transform: scale(1) translateX(0);
	}
	50% {
		opacity: .18;
		transform: scale(1.06) translateX(1.5%);
	}
}

/* Контент героя проявляется поверх уже «осевшего» дыма */
.kn-hero__inner > * {
	position: relative;
	z-index: 1;
}

@media (prefers-reduced-motion: reduce) {

	.kn-hero::before {
		animation: none;
		opacity: 1;
	}

	.kn-hero::after { animation: none; }
}

/* Первый экран целиком помещается в окно: высота ограничена 100svh,
   а внутренние отступы «сжимаются» через clamp по высоте вьюпорта.
   svh — чтобы на мобильных не мешала адресная строка. */
.kn-hero__inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: clamp(16px, 3.2vh, 40px);
	min-height: calc(100svh - var(--kn-header-h));
	padding-top: clamp(12px, 3vh, 40px);
	padding-bottom: clamp(20px, 5vh, 64px);
}

/* H1 — обёртка вокруг лого: заголовок есть в разметке,
   но визуально страница выглядит как прежде. */
.kn-hero__h1 {
	display: contents;
	margin: 0;
	font-size: 0;
	line-height: 0;
}

.kn-hero__logo {
	display: block;
	width: clamp(220px, 32vh, 460px);
	max-width: 100%;
	height: auto;
	margin-top: 0;
}

.kn-hero__text {
	max-width: 635px;
	font-size: clamp(16px, 1.9vh, 24px);
	font-weight: 400;
	line-height: 1.2em;
	text-align: center;
}

.kn-hero__cta-wrap {
	display: flex;
	justify-content: center;
	padding-top: clamp(4px, 1.6vh, 40px);
}

/* Круглая кнопка героя тоже масштабируется по высоте экрана */
.kn-hero__cta-wrap .kn-circle-btn {
	width: clamp(130px, 17vh, 193px);
	font-size: clamp(13px, 1.5vh, 18px);
}

/* ============================= ВИДЕО ============================= */

.kn-video__titles {
	display: flex;
	flex-direction: column;
	width: 914px;
	max-width: 100%;
	margin-inline: auto;
}

.kn-video__title-1 { text-align: start; }
.kn-video__title-2 { text-align: end; }

.kn-video__box {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	aspect-ratio: 16 / 7;
	margin-top: 32px;
	border-radius: 20px;
	overflow: hidden;
}

/* Постер отдельным <img> — попадает в lazy-load и оптимизацию,
   в отличие от background-image. */
.kn-video__poster {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .6s cubic-bezier(.22, .61, .36, 1);
}

.kn-video__box:hover .kn-video__poster { transform: scale(1.03); }

.kn-video__play {
	position: relative;
	width: 113px;
	height: 113px;
	padding: 0;
	border: 0;
	background: none;
	line-height: 0;
	cursor: pointer;
	transition: transform .25s ease;
}

.kn-video__play svg {
	position: relative;
	z-index: 1;
	width: 100%;
	height: 100%;
}

.kn-video__play:hover,
.kn-video__play:focus-visible {
	transform: scale(1.06);
}

/* Пульсирующее кольцо — «живая» кнопка play */
.kn-video__pulse {
	position: absolute;
	inset: 0;
	border-radius: 50%;
	border: 1px solid rgba(255, 255, 255, .6);
	animation: kn-pulse 2.8s ease-out infinite;
	pointer-events: none;
}

@keyframes kn-pulse {
	0%   { opacity: .7; transform: scale(1); }
	70%  { opacity: 0;  transform: scale(1.45); }
	100% { opacity: 0;  transform: scale(1.45); }
}

@media (prefers-reduced-motion: reduce) {

	.kn-video__pulse { animation: none; }

	.kn-video__poster { transition: none; }
}

/* ============================ ГАЛЕРЕЯ ============================ */

.kn-gallery {
	overflow: hidden;
}

.kn-gallery__title {
	text-align: center;
}

.kn-gallery__lead {
	max-width: 710px;
	margin-inline: auto;
	padding: 40px 0 60px;
	text-align: center;
}

.kn-gallery__carousel {
	--kn-slides-per-view: 2;
	--kn-slide-gap: 30px;

	position: relative;
	display: flex;
	align-items: center;
	width: 100%;
	max-width: calc(var(--kn-container) + var(--kn-pad) * 2);
	margin-inline: auto;
	padding-inline: var(--kn-pad);
}

.kn-gallery__viewport {
	flex: 1 1 auto;
	overflow: hidden;
}

.kn-gallery__track {
	display: flex;
	align-items: center;
	gap: var(--kn-slide-gap);
	transition: transform .45s ease;
}

/* Слайдов в кадре: 2 на десктопе (--e-image-carousel-slides-to-show:2),
   1 на мобильных. JS читает --kn-slides-per-view для расчёта шага. */
.kn-gallery__slide {
	position: relative;
	flex: 0 0 calc(
		(100% - var(--kn-slide-gap) * (var(--kn-slides-per-view) - 1))
		/ var(--kn-slides-per-view)
	);
	min-width: 0;
	padding: 0;
	border: 0;
	border-radius: 12px;
	background: none;
	line-height: 0;
	cursor: zoom-in;
	overflow: hidden;
	-webkit-tap-highlight-color: transparent;
}

.kn-gallery__slide img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: 12px;
	transition: transform .6s cubic-bezier(.22, .61, .36, 1);
}

.kn-gallery__slide:hover img,
.kn-gallery__slide:focus-visible img { transform: scale(1.05); }

/* Иконка «увеличить» появляется по наведению */
.kn-gallery__zoom {
	position: absolute;
	right: 14px;
	bottom: 14px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	border-radius: 50%;
	background: rgba(1, 2, 2, .55);
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
	color: var(--kn-white);
	opacity: 0;
	transform: translateY(6px);
	transition: opacity .28s ease, transform .28s ease;
	pointer-events: none;
}

.kn-gallery__slide:hover .kn-gallery__zoom,
.kn-gallery__slide:focus-visible .kn-gallery__zoom {
	opacity: 1;
	transform: none;
}

@media (prefers-reduced-motion: reduce) {

	.kn-gallery__slide img,
	.kn-gallery__zoom { transition: none; }
}

.kn-gallery__nav {
	position: absolute;
	top: 50%;
	z-index: 2;
	width: 46px;
	height: 46px;
	padding: 0;
	border: 0;
	background: none;
	line-height: 0;
	cursor: pointer;
	transform: translateY(-50%);
	transition: opacity .2s ease;
}

.kn-gallery__nav:hover { opacity: .7; }

.kn-gallery__nav svg { width: 100%; height: 100%; }

/* left/right по кастомному CSS: -66px от контейнера */
.kn-gallery__nav--prev { left: calc(var(--kn-pad) - 66px); }
.kn-gallery__nav--next { right: calc(var(--kn-pad) - 66px); }

/* ========================== МЕРОПРИЯТИЯ ========================== */

.kn-events__title { text-align: center; }

.kn-events__lead {
	max-width: 715px;
	margin-inline: auto;
	padding: 40px 0 60px;
	text-align: center;
}

/* ============================== МЕНЮ ============================== */

.kn-menu__inner {
	display: flex;
	flex-direction: row;
	align-items: flex-start;
	justify-content: space-between;
	gap: 83px;
}

.kn-menu__col {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	flex: 0 1 50%;
	min-width: 0;
}

.kn-menu__lead {
	max-width: 715px;
	padding: 40px 0 60px;
	text-align: start;
}

.kn-menu__buttons {
	--kn-menu-gap: 22.5px;

	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: center;
	gap: var(--kn-menu-gap);
	width: 100%;
}

.kn-menu__accent {
	flex: 0 1 46%;
	min-width: 0;
	line-height: 0;
}

.kn-menu__accent img {
	display: block;
	width: 100%;
	height: auto;
}

/* ============================= БРОНЬ ============================= */

.kn-booking {
	position: relative;
	margin-top: 140px;
	padding-top: 140px;
	padding-inline: 16px;
}

/* Фон-дым как ::before — как в Elementor (background-overlay) */
.kn-booking::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 0;
	background-image: var(--kn-booking-bg);
	background-position: center center;
	background-size: cover;
	pointer-events: none;
}

.kn-booking > * {
	position: relative;
	z-index: 1;
}

.kn-booking__inner {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.kn-booking__title { text-align: center; }

.kn-booking__lead {
	max-width: 383px;
	padding: 40px 0 60px;
	text-align: center;
}

/* ---------------------------------------------------------------
   Форма брони.
   Шорткод [pg_contact_form] общий для всего сайта, поэтому его
   стили не трогаем — переопределяем только внутри этой секции.
   На фоне-дыме поля сливались, поэтому кладём форму на «стеклянную»
   подложку и делаем границы полей заметнее.
   --------------------------------------------------------------- */

.kn-booking__form {
	display: flex;
	justify-content: center;
	width: 100%;
}

.kn-booking__form .pg-contact-form {
	position: relative;
	width: 100%;
	max-width: 460px;
	padding: 40px;
}

/* Подложка без рамки: плотная под полями и полностью растворяется
   к краям — карточка не «вырезается» из фона, а проявляется из него.
   Радиальный градиент + маска гасят и цвет, и блюр по периметру. */
.kn-booking__form .pg-contact-form::before {
	content: "";
	position: absolute;
	inset: -40px -30px;
	z-index: -1;
	background: radial-gradient(
		62% 52% at 50% 48%,
		rgba(1, 2, 2, .82) 0%,
		rgba(1, 2, 2, .68) 42%,
		rgba(1, 2, 2, .34) 70%,
		rgba(1, 2, 2, 0) 100%
	);
	backdrop-filter: blur(18px) saturate(115%);
	-webkit-backdrop-filter: blur(18px) saturate(115%);
	-webkit-mask-image: radial-gradient(62% 52% at 50% 48%, #000 0%, #000 52%, transparent 100%);
	mask-image: radial-gradient(62% 52% at 50% 48%, #000 0%, #000 52%, transparent 100%);
	pointer-events: none;
}

/* Поля без заливки — только подчёркивание, как в исходном макете.
   Читаемость даёт подложка секции, а не фон самих полей. */
.kn-booking__form .pg-contact-form input[type="text"],
.kn-booking__form .pg-contact-form input[type="tel"],
.kn-booking__form .pg-contact-form input[type="email"],
.kn-booking__form .pg-contact-form textarea {
	padding: 16px 4px;
	border-bottom-color: rgba(255, 255, 255, .55);
	background: transparent;
	transition: border-color .22s ease;
}

.kn-booking__form .pg-contact-form input:hover,
.kn-booking__form .pg-contact-form textarea:hover {
	border-bottom-color: rgba(255, 255, 255, .8);
}

.kn-booking__form .pg-contact-form input:focus,
.kn-booking__form .pg-contact-form textarea:focus {
	border-bottom-color: var(--kn-white);
}

.kn-booking__form .pg-contact-form input::placeholder,
.kn-booking__form .pg-contact-form textarea::placeholder {
	color: rgba(255, 255, 255, .72);
}

.kn-booking__form .pg-contact-form textarea { min-height: 104px; }

/* --- Кастомный чекбокс согласия --- */

.kn-booking__form .pg-contact-form__consent {
	gap: 14px;
	align-items: flex-start;
	margin-top: 24px;
	color: rgba(255, 255, 255, .72);
}

/* Нативный input прячем, но оставляем доступным с клавиатуры */
.kn-booking__form .pg-contact-form__consent input[type="checkbox"] {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: 0;
	padding: 0;
	border: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	white-space: nowrap;
}

/* Рисуем свой квадрат перед текстом */
.kn-booking__form .pg-contact-form__consent > span {
	position: relative;
	padding-left: 34px;
}

.kn-booking__form .pg-contact-form__consent > span::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 20px;
	height: 20px;
	border: 1px solid rgba(255, 255, 255, .45);
	border-radius: 6px;
	background: rgba(255, 255, 255, .06);
	transition: background-color .2s ease, border-color .2s ease;
}

/* Галочка — двумя линиями через ::after */
.kn-booking__form .pg-contact-form__consent > span::after {
	content: "";
	position: absolute;
	top: 5px;
	left: 7px;
	width: 6px;
	height: 11px;
	border: solid var(--kn-bg);
	border-width: 0 2px 2px 0;
	opacity: 0;
	transform: rotate(45deg) scale(.6);
	transition: opacity .2s ease, transform .2s cubic-bezier(.22, .61, .36, 1);
}

.kn-booking__form .pg-contact-form__consent:hover > span::before {
	border-color: rgba(255, 255, 255, .75);
}

.kn-booking__form .pg-contact-form__consent input:checked + span::before {
	border-color: var(--kn-white);
	background: var(--kn-white);
}

.kn-booking__form .pg-contact-form__consent input:checked + span::after {
	opacity: 1;
	transform: rotate(45deg) scale(1);
}

.kn-booking__form .pg-contact-form__consent input:focus-visible + span::before {
	outline: 2px solid var(--kn-white);
	outline-offset: 3px;
}

.kn-booking__form .pg-contact-form__consent a { color: rgba(255, 255, 255, .9); }

.kn-booking__form .pg-contact-form__consent a:hover { color: var(--kn-white); }

@media (prefers-reduced-motion: reduce) {

	.kn-booking__form .pg-contact-form input,
	.kn-booking__form .pg-contact-form textarea,
	.kn-booking__form .pg-contact-form__consent > span::before,
	.kn-booking__form .pg-contact-form__consent > span::after { transition: none; }
}

.kn-booking__map-wrap {
	margin-top: 64px;
}

.kn-map {
	position: relative;
	line-height: 0;
	min-height: 400px;
	border: 4px solid var(--kn-white);
	border-radius: 12px;
	overflow: hidden;
}

.kn-map iframe {
	position: relative;
	z-index: 1;
	display: block;
	width: 100%;
	height: 400px;
	border: 0;
	opacity: 0;
	transition: opacity .5s ease;
}

.kn-map.is-ready iframe { opacity: 1; }

/* Плейсхолдер под картой: виден, пока грузится iframe.
   Карта показывается сама — клик не требуется. */
.kn-map__placeholder {
	position: absolute;
	inset: 0;
	z-index: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 12px;
	padding: 20px;
	background:
		radial-gradient(90% 120% at 50% 0%, rgba(0, 99, 107, .3) 0%, transparent 65%),
		rgba(255, 255, 255, .03);
	color: var(--kn-white);
	font-family: "Noah", sans-serif;
	line-height: 1.3;
	text-align: center;
}

.kn-map__pin {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 64px;
	height: 64px;
	border: 1px solid rgba(255, 255, 255, .4);
	border-radius: 50%;
	color: var(--kn-white);
	animation: kn-map-pin 2.6s ease-in-out infinite;
}

@keyframes kn-map-pin {
	0%, 100% { transform: translateY(0); opacity: .85; }
	50%      { transform: translateY(-5px); opacity: 1; }
}

.kn-map__addr {
	font-size: 14px;
	color: rgba(255, 255, 255, .6);
}

.kn-map noscript iframe { opacity: 1; }

@media (prefers-reduced-motion: reduce) {

	.kn-map__pin { animation: none; }

	.kn-map iframe { transition: none; }
}

/* ============================= ФУТЕР ============================= */

.kn-footer {
	margin-top: 120px;
}

.kn-footer__inner {
	display: flex;
	flex-direction: row;
	align-items: flex-start;
	justify-content: center;
	padding-block: 48px;
	border-top: 1px solid var(--kn-white);
}

.kn-footer__row {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: flex-start;
	justify-content: space-between;
	gap: 20px;
	width: 100%;
	max-width: var(--kn-container);
}

.kn-footer__logo {
	flex: 0 0 auto;
	margin-top: -9px;
	line-height: 0;
}

.kn-footer__logo img {
	display: block;
	width: 72px;
	height: auto;
}

.kn-footer__col {
	font-family: "Noah", sans-serif;
	font-size: 20px;
	font-weight: 400;
	line-height: 1.2em;
	color: var(--kn-white);
}

.kn-footer__col--address { width: 156px; }

.kn-footer__desc {
	margin-top: 14px;
	font-size: 18px;
	font-weight: 400;
}

.kn-footer__desc a {
	color: var(--kn-white);
	text-decoration: none;
}

.kn-footer__desc a:hover { text-decoration: underline; }

.kn-footer__social {
	display: flex;
	flex-direction: row;
	justify-content: flex-end;
	gap: 14px;
	width: 90px;
	flex: 0 0 auto;
}

.kn-footer__social a {
	line-height: 0;
	transition: opacity .2s ease;
}

.kn-footer__social a:hover { opacity: .75; }

.kn-footer__social svg {
	width: 32px;
	height: 32px;
}

/* --------- График работы (перенесён из кастомного CSS футера) --------- */

.kn-schedule {
	max-width: 280px;
	margin-top: 14px;
	font-size: 13px;
	line-height: 1.3;
	color: #fff;
}

.kn-schedule__item {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 12px;
	padding: 6px 0;
}

.kn-schedule__dot {
	display: inline-block;
	flex-shrink: 0;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: rgba(255, 255, 255, .5);
}

.kn-schedule__days {
	flex: 1;
	min-width: 80px;
	font-weight: 400;
	text-align: left;
}

.kn-schedule__time {
	flex-shrink: 0;
	min-width: 90px;
	font-weight: 500;
	text-align: right;
}

.kn-schedule__item.is-closed .kn-schedule__dot { background: rgba(255, 255, 255, .2); }

.kn-schedule__item.is-closed .kn-schedule__days,
.kn-schedule__item.is-closed .kn-schedule__time { color: rgba(255, 255, 255, .4); }

/* ====================================================================
   МОДАЛКА «ЗАЯВКА ОТПРАВЛЕНА»
   ==================================================================== */

.kn-ok {
	position: fixed;
	inset: 0;
	z-index: 10001;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 20px;
}

.kn-ok[hidden] { display: none; }

.kn-ok__backdrop {
	position: absolute;
	inset: 0;
	background:
		radial-gradient(120% 90% at 50% 0%, rgba(0, 99, 107, .3) 0%, transparent 60%),
		rgba(1, 2, 2, .9);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	opacity: 0;
	transition: opacity .3s ease;
}

.kn-ok.is-open .kn-ok__backdrop { opacity: 1; }

.kn-ok__box {
	position: relative;
	z-index: 1;
	width: 100%;
	max-width: 420px;
	padding: 44px 36px 36px;
	border: 1px solid rgba(255, 255, 255, .14);
	border-radius: 20px;
	background: #0a0f0f;
	text-align: center;
	box-shadow: 0 30px 80px rgba(0, 0, 0, .6);
	opacity: 0;
	transform: translateY(16px) scale(.97);
	transition: opacity .32s ease, transform .32s cubic-bezier(.22, .61, .36, 1);
}

.kn-ok.is-open .kn-ok__box {
	opacity: 1;
	transform: none;
}

.kn-ok__close {
	position: absolute;
	top: 14px;
	right: 14px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: transparent;
	color: rgba(255, 255, 255, .5);
	cursor: pointer;
	transition: background-color .2s ease, color .2s ease;
}

.kn-ok__close:hover,
.kn-ok__close:focus-visible {
	background: rgba(255, 255, 255, .1);
	color: var(--kn-white);
}

/* Галочка в круге — рисуется штрихом при появлении */
.kn-ok__icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 78px;
	height: 78px;
	margin: 0 auto 22px;
	border: 1px solid var(--kn-accent);
	border-radius: 50%;
	background: rgba(0, 99, 107, .16);
	color: var(--kn-accent);
}

.kn-ok__check {
	stroke-dasharray: 30;
	stroke-dashoffset: 30;
}

.kn-ok.is-open .kn-ok__check {
	animation: kn-ok-draw .5s cubic-bezier(.65, 0, .45, 1) .18s forwards;
}

@keyframes kn-ok-draw {
	to { stroke-dashoffset: 0; }
}

.kn-ok__title {
	margin: 0 0 10px;
	font-family: "Lato", sans-serif;
	font-size: 26px;
	font-weight: 300;
	line-height: 1.2;
	text-transform: uppercase;
	letter-spacing: .02em;
	color: var(--kn-white);
}

.kn-ok__text {
	margin: 0 0 26px;
	font-size: 15px;
	line-height: 1.55;
	color: rgba(255, 255, 255, .7);
}

.kn-ok__btn {
	width: 100%;
	padding: 14px 28px;
	border: 1px solid var(--kn-white);
	border-radius: 12px;
	background: transparent;
	color: var(--kn-white);
	font-family: "Noah", sans-serif;
	font-size: 15px;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: .04em;
	cursor: pointer;
	transition: background-color .25s ease, color .25s ease;
}

.kn-ok__btn:hover,
.kn-ok__btn:focus-visible {
	background: var(--kn-white);
	color: var(--kn-bg);
}

@media (max-width: 767px) {

	.kn-ok__box { padding: 36px 22px 26px; }

	.kn-ok__icon {
		width: 64px;
		height: 64px;
		margin-bottom: 18px;
	}

	.kn-ok__title { font-size: 21px; }
}

@media (prefers-reduced-motion: reduce) {

	.kn-ok__backdrop,
	.kn-ok__box { transition: none; }

	.kn-ok__check {
		animation: none;
		stroke-dashoffset: 0;
	}
}

/* ====================================================================
   ЕДИНЫЙ ЛАЙТБОКС (галерея / меню / видео)
   ==================================================================== */

/* Блокировка скролла под модалкой */
.kn-lock,
.kn-lock body {
	overflow: hidden;
}

.kn-lb {
	position: fixed;
	inset: 0;
	z-index: 10000;
	display: flex;
	align-items: center;
	justify-content: center;
}

.kn-lb[hidden] { display: none; }

/* --- Затемнение: тёмный дым + лёгкий blur --- */
.kn-lb__backdrop {
	position: absolute;
	inset: 0;
	background:
		radial-gradient(120% 90% at 50% 0%, rgba(0, 99, 107, .28) 0%, transparent 60%),
		rgba(1, 2, 2, .93);
	backdrop-filter: blur(14px) saturate(120%);
	-webkit-backdrop-filter: blur(14px) saturate(120%);
	opacity: 0;
	transition: opacity .32s ease;
}

.kn-lb.is-open .kn-lb__backdrop { opacity: 1; }

/* --- Оболочка --- */
.kn-lb__shell {
	position: relative;
	z-index: 1;
	display: grid;
	grid-template-columns: 64px minmax(0, 1fr) 64px;
	grid-template-rows: auto minmax(0, 1fr);
	grid-template-areas:
		"bar   bar   bar"
		"prev  stage next";
	align-items: center;
	width: min(100%, 1320px);
	height: 100%;
	padding: 0 24px 20px;
	opacity: 0;
	transform: translateY(14px) scale(.985);
	transition: opacity .34s ease, transform .34s cubic-bezier(.22, .61, .36, 1);
}

.kn-lb.is-open .kn-lb__shell {
	opacity: 1;
	transform: none;
}

/* --- Верхняя панель --- */
.kn-lb__bar {
	grid-area: bar;
	display: flex;
	align-items: center;
	gap: 20px;
	padding: 22px 4px 18px;
	border-bottom: 1px solid rgba(255, 255, 255, .12);
}

.kn-lb__title {
	margin: 0;
	font-family: "Lato", sans-serif;
	font-size: 26px;
	font-weight: 300;
	line-height: 1.2;
	text-transform: uppercase;
	letter-spacing: .04em;
	color: var(--kn-white);
}

.kn-lb__counter {
	margin: 0 0 0 auto;
	font-family: "Noah", sans-serif;
	font-size: 14px;
	font-weight: 500;
	letter-spacing: .08em;
	color: rgba(255, 255, 255, .55);
	font-variant-numeric: tabular-nums;
}

.kn-lb__close {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	width: 46px;
	height: 46px;
	padding: 0;
	border: 1px solid rgba(255, 255, 255, .28);
	border-radius: 50%;
	background: transparent;
	color: var(--kn-white);
	cursor: pointer;
	transition: background-color .22s ease, color .22s ease, border-color .22s ease, transform .22s ease;
}

.kn-lb__close:hover,
.kn-lb__close:focus-visible {
	background: var(--kn-white);
	border-color: var(--kn-white);
	color: var(--kn-bg);
	transform: rotate(90deg);
}

/* --- Сцена --- */
.kn-lb__stage {
	grid-area: stage;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 0;
	height: 100%;
	padding: 20px 0;
}

.kn-lb__figure {
	display: flex;
	align-items: center;
	justify-content: center;
	max-width: 100%;
	max-height: 100%;
	animation: kn-lb-pop .42s cubic-bezier(.22, .61, .36, 1) both;
}

/* --- Меню: вертикальная лента страниц вместо карусели --- */
.kn-lb[data-mode="menu"] .kn-lb__stage {
	align-items: flex-start;
	overflow-y: auto;
	overscroll-behavior: contain;
	scroll-behavior: smooth;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: thin;
	scrollbar-color: rgba(255, 255, 255, .25) transparent;
}

.kn-lb[data-mode="menu"] .kn-lb__stage::-webkit-scrollbar { width: 5px; }

.kn-lb[data-mode="menu"] .kn-lb__stage::-webkit-scrollbar-thumb {
	background: rgba(255, 255, 255, .25);
	border-radius: 3px;
}

.kn-lb__pages {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 20px;
	width: 100%;
	animation: kn-lb-pop .42s cubic-bezier(.22, .61, .36, 1) both;
}

/* width/height проставлены в разметке для резерва места —
   здесь возвращаем адаптивное масштабирование. */
.kn-lb__page {
	display: block;
	width: min(900px, 100%);
	max-width: 100%;
	height: auto;
	border-radius: 12px;
	box-shadow: 0 24px 60px rgba(0, 0, 0, .55);
	scroll-margin-top: 8px;
}

@media (prefers-reduced-motion: reduce) {

	.kn-lb[data-mode="menu"] .kn-lb__stage { scroll-behavior: auto; }

	.kn-lb__pages { animation: none; }
}

.kn-lb__img,
.kn-lb__video {
	display: block;
	max-width: 100%;
	max-height: calc(100vh - 160px);
	width: auto;
	height: auto;
	border-radius: 14px;
	box-shadow: 0 30px 80px rgba(0, 0, 0, .6);
}

.kn-lb__video {
	background: #000;
	animation: kn-lb-pop .42s cubic-bezier(.22, .61, .36, 1) both;
}

/* Видео шире остальных — можно занять чуть больше высоты */
.kn-lb[data-mode="video"] .kn-lb__video { max-height: calc(100vh - 150px); }

@keyframes kn-lb-pop {
	from { opacity: 0; transform: scale(.965); }
	to   { opacity: 1; transform: none; }
}

/* --- Стрелки --- */
.kn-lb__nav {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 52px;
	height: 52px;
	padding: 0;
	border: 1px solid rgba(255, 255, 255, .22);
	border-radius: 50%;
	background: rgba(255, 255, 255, .04);
	color: var(--kn-white);
	cursor: pointer;
	transition: background-color .22s ease, color .22s ease, border-color .22s ease;
}

.kn-lb__nav--prev { grid-area: prev; justify-self: start; }
.kn-lb__nav--next { grid-area: next; justify-self: end; }

.kn-lb__nav[hidden] { display: none; }

.kn-lb__nav:hover,
.kn-lb__nav:focus-visible {
	background: var(--kn-white);
	border-color: var(--kn-white);
	color: var(--kn-bg);
}


@media (prefers-reduced-motion: reduce) {

	.kn-lb__backdrop,
	.kn-lb__shell { transition: none; }

	.kn-lb__figure,
	.kn-lb__video { animation: none; }

	.kn-lb__close:hover { transform: none; }
}

/* ======================================================================
   БРЕЙКПОИНТ 1366
   ====================================================================== */

@media (max-width: 1366px) {

	.kn-header__inner { gap: 20px; }

	.kn-header__nav { gap: 20px; }

	.kn-header__nav-link,
	.kn-header__cta { font-size: 17px; }

	.kn-hero__logo { width: clamp(200px, 32vh, 360px); }

	.kn-video__play { width: 96px; height: 96px; }

	.kn-menu__inner { gap: 24px; }

	.kn-menu__buttons { --kn-menu-gap: 10px; }

	.kn-circle-btn--icon { font-size: 16px; }

	.kn-circle-btn--icon .kn-circle-btn__icon { width: 44px; height: 44px; }

	.kn-gallery__nav--prev { left: calc(var(--kn-pad) - 52px); }
	.kn-gallery__nav--next { right: calc(var(--kn-pad) - 52px); }
}

/* ======================================================================
   БРЕЙКПОИНТ 1024
   ====================================================================== */

@media (max-width: 1024px) {

	.kn-page { --kn-pad: 32px; }

	/* Пункты меню скрыты на планшете и мобильных
	   (в оригинале — elementor-hidden-tablet + elementor-hidden-mobile) */
	.kn-header__nav { display: none; }

	.kn-header__inner { justify-content: space-between; }

	.kn-header__logo { margin-right: 0; }

	.kn-header__cta {
		flex: 0 0 auto;
		font-size: 16px;
	}

	.kn-hero__logo {
		width: clamp(180px, 28vh, 240px);
		margin-top: 0;
	}

	.kn-hero__text { font-size: clamp(15px, 1.9vh, 22px); }

	.kn-video__titles { width: 100%; }

	.kn-video__title-1 { width: 100%; }

	.kn-h2 { font-size: 44px; }

	.kn-video__play { width: 84px; height: 84px; }

	.kn-gallery__lead,
	.kn-events__lead,
	.kn-menu__lead { font-size: 18px; }

	.kn-gallery__nav { width: 40px; height: 40px; }

	.kn-gallery__nav--prev { left: calc(var(--kn-pad) - 22px); }
	.kn-gallery__nav--next { right: calc(var(--kn-pad) - 22px); }

	.kn-menu__col { flex-basis: 65%; }

	.kn-menu__accent { flex-basis: 35%; }
}

/* ======================================================================
   БРЕЙКПОИНТ 767 (мобильные)
   ====================================================================== */

@media (max-width: 767px) {

	.kn-page { --kn-pad: 20px; }

	.kn-section { padding-top: 90px; }

	/* --- Хедер: лого + бургер-CTA, пункты скрыты --- */
	.kn-header__inner {
		flex-wrap: nowrap;
		justify-content: space-between;
		gap: 0;
	}

	.kn-header__logo { margin-right: 0; }

	.kn-header__nav { display: none; }

	.kn-header__cta {
		flex: 0 1 auto;
		margin-left: 12px;
		padding: 8px 18px;
		border-radius: 10px;
		font-size: 4vw;
	}

	/* --- Герой --- */
	.kn-hero {
		margin-top: calc(-1 * (48px + 20px));
		padding-top: calc(48px + 20px);
	}

	.kn-hero__logo {
		width: min(66%, 30vh);
		margin-top: 0;
	}

	.kn-hero__text {
		max-width: 76vw;
		font-size: min(4vw, 2vh);
	}

	.kn-hero__cta-wrap { padding-top: clamp(4px, 2vh, 30px); }

	.kn-circle-btn {
		width: 160px;
		font-size: 14px;
	}

	/* Кнопка героя подстраивается под высоту экрана */
	.kn-hero__cta-wrap .kn-circle-btn {
		width: clamp(120px, 19vh, 160px);
		font-size: clamp(11px, 1.7vh, 14px);
	}

	/* --- Видео --- */
	.kn-video__titles { gap: 4px; }

	.kn-h2 { font-size: 6vw; }

	.kn-video__box {
		aspect-ratio: 9 / 5;
		border-radius: 14px;
	}

	.kn-video__play { width: 70px; height: 70px; }

	/* --- Галерея / мероприятия --- */
	.kn-gallery__title,
	.kn-events__title,
	.kn-booking__title { font-size: 8vw; }

	.kn-gallery__lead,
	.kn-events__lead,
	.kn-menu__lead,
	.kn-booking__lead {
		max-width: 100%;
		padding: 30px 0 40px;
		font-size: 3.6vw;
	}

	.kn-gallery__carousel,
	.kn-events__slider {
		width: 95%;
		margin-inline: auto;
		padding-inline: 0;
	}

	/* На мобильных — по одному слайду в кадре */
	.kn-gallery__carousel {
		--kn-slides-per-view: 1;
		--kn-slide-gap: 12px;
	}

	.kn-gallery__nav--prev { left: -22px; }
	.kn-gallery__nav--next { right: -22px; }

	/* --- Меню --- */
	.kn-menu__inner {
		flex-wrap: wrap;
		gap: 40px;
	}

	.kn-menu__col {
		align-items: center;
		flex-basis: 100%;
	}

	.kn-menu__col .kn-h2 { font-size: 8.6vw; }

	.kn-menu__lead { text-align: center; }

	.kn-menu__buttons {
		--kn-menu-gap: 6px;

		flex-wrap: nowrap;
	}

	.kn-circle-btn--icon { font-size: 3vw; }

	.kn-circle-btn--icon .kn-circle-btn__icon { width: 28px; height: 28px; }

	.kn-menu__accent {
		flex-basis: 90%;
		margin-inline: auto;
		text-align: center;
	}

	/* --- Бронь --- */
	.kn-booking {
		margin-top: 0;
		padding-top: 90px;
		padding-inline: 20px;
	}

	.kn-booking__lead { max-width: 75%; }

	/* --- Футер --- */
	.kn-footer { margin-top: 90px; }

	.kn-footer__inner {
		align-items: center;
		padding-block: 40px;
	}

	.kn-footer__row {
		flex-direction: column;
		align-items: center;
		gap: 40px;
	}

	.kn-footer__logo { margin-top: 0; }

	.kn-footer__col {
		width: 100%;
		text-align: center;
	}

	.kn-footer__col--schedule { max-width: 245px; }

	.kn-schedule {
		max-width: 100%;
		margin-inline: auto;
	}

	.kn-footer__social {
		justify-content: center;
		width: 100%;
	}

	/* --- Лайтбокс --- */
	.kn-lb__shell {
		grid-template-columns: minmax(0, 1fr);
		grid-template-areas:
			"bar"
			"stage";
		padding: 0 12px 14px;
	}

	.kn-lb__bar {
		gap: 12px;
		padding: 14px 2px 12px;
	}

	.kn-lb__title { font-size: 18px; }

	.kn-lb__counter { font-size: 12px; }

	.kn-lb__close {
		width: 38px;
		height: 38px;
	}

	/* Стрелки уводим поверх сцены — по краям экрана */
	.kn-lb__nav {
		position: absolute;
		top: 50%;
		width: 42px;
		height: 42px;
		background: rgba(1, 2, 2, .5);
		backdrop-filter: blur(6px);
		-webkit-backdrop-filter: blur(6px);
		transform: translateY(-50%);
	}

	.kn-lb__nav--prev { left: 6px; }
	.kn-lb__nav--next { right: 6px; }

	.kn-lb__img,
	.kn-lb__video { max-height: calc(100svh - 130px); }

	.kn-lb[data-mode="video"] .kn-lb__video { max-height: calc(100svh - 120px); }

	/* --- Форма брони --- */
	.kn-booking__form .pg-contact-form { padding: 24px 14px; }

	.kn-booking__form .pg-contact-form::before { inset: -26px -18px; }

	/* --- Карта --- */
	.kn-map { min-height: 320px; }

	.kn-map iframe { height: 320px; }
}

@media (max-width: 480px) {

	.kn-schedule {
		padding: 0 15px;
		font-size: 14px;
	}

	.kn-schedule__item {
		gap: 15px;
		padding: 8px 0;
	}

	.kn-schedule__dot { width: 7px; height: 7px; }

	.kn-schedule__days { min-width: 85px; }

	.kn-schedule__time { min-width: 95px; }
}