/*
Theme Name: Monte Bianco
Description: Своя классическая тема гостиничного комплекса Monte Bianco Hotel Astana. Без конструкторов и библиотек.
Version: 0.2.0
Requires at least: 6.5
Requires PHP: 8.1
Text Domain: monte-bianco
License: Proprietary
*/

/* Токены: цвета, шрифты, отступы - только здесь */
:root {
	--c-bg: #FAF8F4;
	--c-stone: #ECE5D8;
	--c-white: #FFFFFF;
	--c-sky: #E8ECF6;
	--c-blue: #1E2A6E;
	--c-blue-dark: #141B47;
	--c-blue-hover: #2C3B8F;
	--c-text: #1B2033;
	--c-body: #2F3547;
	--c-muted: #4B5163;
	--c-line: #D6CEBF;
	--c-line-head: #E4DFD4;
	--c-card-line: #E2DACB;
	--c-row-line: #EEE8DC;
	--c-line-chip: #C9CFE3;
	--c-map: #EEF1F8;
	--c-map-grid: #E2E7F2;
	--c-map-road: #C8D0E6;
	--c-on-blue: #FFFFFF;
	--c-on-blue-2: #C9D1EE;
	--c-on-blue-3: #B9C3E6;
	--c-line-on-blue: rgba(255, 255, 255, .16);
	--c-photo-shade: linear-gradient(180deg, rgba(14, 20, 52, 0) 30%, rgba(14, 20, 52, .5) 52%, rgba(14, 20, 52, .76) 70%, rgba(14, 20, 52, .88) 100%);
	--c-photo-shade-text: linear-gradient(180deg, rgba(14, 20, 52, 0), rgba(14, 20, 52, .4) 56px);
	--c-photo-text-shadow: 0 1px 12px rgba(14, 20, 52, .35);
	--c-head-bg: rgba(250, 248, 244, .94);
	--c-tbd-bg: #FFE9A8;
	--c-tbd: #5A4300;
	--hero-veil: 0; /* 0 - нет, .2 - затемнение, -.2 - осветление */
	--c-viewer: #0E1434;
	--c-backdrop: rgba(14, 20, 52, .5);
	--c-plan: #9A6A00;
	--c-plan-bg: #FFF6DD;

	--f-sans: 'Onest', 'Onest Fallback', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
	--f-script: 'Pinyon Script', cursive;

	--radius: 2px;
	--radius-img: 6px;
	--radius-sheet: 16px;
	--wrap: 1240px;
	--gutter: clamp(20px, 5vw, 64px);
	--head-h: 84px;
	--sec: clamp(48px, 9vw, 130px);
	--bar-h: 0px;
	--ease: cubic-bezier(.2, .7, .2, 1);
}
/* Китайский /zh/ (задание 68): иероглифы - системные шрифты, латиница (Monte Bianco Hotel Astana, MB Karaoke) - Onest; веб-шрифтов для иероглифов нет. */
:root:lang(zh) {
	--f-sans: 'Onest', 'Onest Fallback', 'PingFang SC', 'Microsoft YaHei', 'Noto Sans SC', 'Hiragino Sans GB', system-ui, sans-serif;
	--f-script: 'Pinyon Script', 'PingFang SC', 'Microsoft YaHei', 'Noto Sans SC', cursive;
}

@media (max-width: 760px) {
	:root {
		--gutter: 22px;
		--head-h: 64px;
		--bar-h: calc(70px + env(safe-area-inset-bottom));
	}
}

/* База */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: calc(var(--head-h) + 12px); }
body {
	margin: 0;
	padding-bottom: var(--bar-h);
	background: var(--c-bg);
	color: var(--c-text);
	font: 400 16px/1.6 var(--f-sans);
	-webkit-font-smoothing: antialiased;
}
img, svg, video { display: block; max-width: 100%; }
img { height: auto; }
a { color: var(--c-blue); }
a:hover { color: var(--c-blue-dark); }
h1, h2, h3, p, ul, figure, table { margin: 0; }
ul { padding: 0; list-style: none; }
button, input, select { font: inherit; color: inherit; }
button { cursor: pointer; }
:focus-visible { outline: 2px solid var(--c-blue); outline-offset: 3px; }
.on-blue :focus-visible, .booking :focus-visible { outline-color: var(--c-on-blue); }
.screen-reader-text {
	position: absolute !important; width: 1px; height: 1px; overflow: hidden;
	clip: rect(0 0 0 0); white-space: nowrap; margin: -1px; padding: 0; border: 0;
}
.skip { position: absolute; left: 12px; top: -60px; z-index: 100; padding: 10px 16px; background: var(--c-blue); color: var(--c-on-blue); }
.skip:focus { top: 12px; color: var(--c-on-blue); }

main { position: relative; }
/* телефон: content-visibility ниже второго блока (TBT) */
@media (max-width: 1023px) { html:not(.cv-off) main > section:nth-of-type(n+3) { content-visibility: auto; contain-intrinsic-size: auto 700px; } }
/* главная, все ширины: блоки ниже первого экрана без якоря (id); высота до показа - замер на 390 и 1280 (задание 48). /karaoke/ - в karaoke.css */
html:not(.cv-off) .home main > :is(.about, .ways, .reviews, .faq, .final, .plan) { content-visibility: auto; contain-intrinsic-size: auto var(--cis); }
.home main > .about { --cis: 1923px; } .home main > .ways { --cis: 1612px; } .home main > .reviews { --cis: 909px; } .home main > .faq { --cis: 1439px; } .home main > .final { --cis: 762px; } .home main > .plan { --cis: 573px; }
@media (min-width: 1024px) { .home main > .about { --cis: 1460px; } .home main > .ways { --cis: 1516px; } .home main > .reviews { --cis: 745px; } .home main > .faq { --cis: 1340px; } .home main > .final { --cis: 888px; } .home main > .plan { --cis: 506px; } }
.wrap { max-width: calc(var(--wrap) + 2 * var(--gutter)); margin: 0 auto; padding: 0 var(--gutter); }
.sec { padding: var(--sec) 0; }

/* Типографика блоков */
.eyebrow { margin-bottom: 16px; font-size: 15px; font-weight: 500; letter-spacing: .01em; color: var(--c-muted); }
.h2 {
	font-weight: 400; font-size: clamp(34px, 4vw, 56px); line-height: 1.05;
	letter-spacing: -.02em; color: var(--c-blue);
}
.h2--m { font-size: clamp(28px, 3.4vw, 48px); line-height: 1.15; letter-spacing: -.025em; }
.h2--s { font-size: clamp(30px, 3vw, 40px); line-height: 1.1; }
.h2__big { display: block; }
.h2__sub { display: block; max-width: 40em; margin-top: 14px; font-size: clamp(18px, 1.8vw, 24px); line-height: 1.3; letter-spacing: -.01em; }
.lead { font-size: 17px; line-height: 1.75; color: var(--c-body); }
.num { font-weight: 400; letter-spacing: -.02em; line-height: 1; color: var(--c-blue); }
.note { font-size: 14px; color: var(--c-muted); }
.note b { color: var(--c-text); font-weight: 600; }
.head-row { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 20px; margin-bottom: 44px; }
.head-row__sub { margin-top: 14px; font-size: 17px; color: var(--c-body); }
.link-u { display: inline-flex; align-items: center; padding-bottom: 4px; border-bottom: 1px solid currentColor; font-size: 14px; letter-spacing: .04em; text-decoration: none; }
.tbd { padding: 0 .25em; border-radius: var(--radius); background: var(--c-tbd-bg); color: var(--c-tbd); font-size: .85em; letter-spacing: 0; }
.nw { white-space: nowrap; }
.count { position: relative; display: inline-block; font-variant-numeric: tabular-nums; }
.count.is-counting { color: transparent; }
.count.is-counting::after { content: var(--fx); content: var(--fx) / ""; position: absolute; top: 0; left: 0; color: var(--cc); white-space: nowrap; }

/* Кнопки и ссылки */
.btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 10px;
	padding: 17px 28px; border: 1px solid var(--c-blue); border-radius: var(--radius);
	background: var(--c-blue); color: var(--c-on-blue);
	font-size: 14px; letter-spacing: .04em; line-height: 1.2; text-decoration: none; white-space: nowrap;
	transition: background-color .25s ease, color .25s ease, border-color .25s ease, transform .25s ease;
}
.btn:hover { background: var(--c-blue-dark); border-color: var(--c-blue-dark); color: var(--c-on-blue); transform: translateY(-1px); }
.btn--ghost { background: transparent; color: var(--c-blue); }
.btn--ghost:hover { background: var(--c-blue); border-color: var(--c-blue); }
.btn--sm { padding: 11px 18px; font-size: 13px; letter-spacing: 0; }
.btn--md { padding: 15px 24px; letter-spacing: 0; }
.btn--lg { padding: 19px 34px; font-size: 15px; }
.btns { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 22px; margin-top: 34px; }
.btns--tight { gap: 10px; margin-top: 28px; }
.ico { flex: none; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linejoin: round; }

/* Шапка */
.head {
	position: sticky; top: 0; z-index: 50; height: var(--head-h);
	background: var(--c-head-bg); border-bottom: 1px solid var(--c-line-head); color: var(--c-blue);
	-webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
}
.admin-bar .head { top: var(--wp-admin--admin-bar--height, 32px); }
.head__in { height: 100%; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.head__nav, .head__end { flex: 1 1 0; display: flex; align-items: center; font-size: 14px; }
.head__nav { gap: 26px; }
.head__nav a, .head__tel { color: inherit; text-decoration: none; white-space: nowrap; }
.head__nav a:hover, .head__tel:hover { color: var(--c-blue-dark); text-decoration: underline; text-underline-offset: 6px; }
.head__end { justify-content: flex-end; gap: 22px; }
.head__menu { display: none; align-items: center; gap: 10px; min-height: 44px; padding: 0; border: 0; background: none; font-size: 14px; }
.head__lang { opacity: .85; white-space: nowrap; }
.head__lang a { color: inherit; text-decoration: none; }
.head__lang .is-draft, .menu__lang .is-draft { text-decoration: line-through; } /* язык с непереведёнными строками - только превью */
.menu__lang { margin-top: 20px; font-size: 15px; }
.menu__lang a { color: inherit; }
.head__book { padding: 13px 22px; letter-spacing: 0; }
.logo { flex: none; display: flex; flex-direction: column; align-items: center; gap: 6px; color: inherit; text-decoration: none; }
.logo:hover { color: inherit; }
.logo__mark { width: 40px; height: 36px; fill: currentColor; }
.logo__name, .logo__sub, .foot__name, .foot__sub { text-transform: uppercase; }
.logo__name { padding-left: .3em; font-weight: 500; font-size: 14px; letter-spacing: .3em; line-height: 1; }
.logo__sub { padding-left: .5em; font-size: 9px; letter-spacing: .5em; line-height: 1; opacity: .75; }
.logo__line { display: flex; align-items: center; gap: 8px; }
.logo__stars { font-size: 9px; letter-spacing: .12em; line-height: 1; color: currentColor; }

@media (max-width: 1280px) {
	.head__nav > a { display: none; }
	.head__menu { display: flex; }
	.head__tel { display: none; }
	.head__lang--multi { display: none; } /* несколько языков - в меню */
}
@media (max-width: 760px) {
	.head__in { padding: 0 14px; gap: 8px; }
	.head__menu { width: 44px; justify-content: center; }
	.head__menu span { display: none; }
	.head__book { display: none; }
	.head__end { gap: 0; }
	.head__lang { min-width: 44px; text-align: center; font-size: 13px; opacity: 1; }
	.logo { flex-direction: row; gap: 10px; }
	.logo__mark { width: 28px; height: 25px; }
	.logo__name { padding-left: 0; font-size: 12px; letter-spacing: .28em; }
	.logo__sub { display: none; }
	.logo__stars { font-size: 8px; letter-spacing: .08em; }
}

.menu {
	position: fixed; inset: var(--head-h) 0 auto 0; width: 100%; max-width: none; max-height: calc(100dvh - var(--head-h));
	margin: 0; padding: 28px var(--gutter) 36px; overflow: auto;
	border: 0; border-bottom: 1px solid var(--c-line-head); background: var(--c-bg); color: var(--c-blue);
}
.menu::backdrop { background: rgba(20, 27, 71, .25); }
.menu ul { display: grid; gap: 4px; }
.menu li a { display: block; padding: 10px 0; font-size: 26px; font-weight: 400; letter-spacing: -.02em; text-decoration: none; }
.menu__foot { display: flex; flex-wrap: wrap; gap: 12px 24px; margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--c-line); font-size: 15px; }
.menu__close { position: absolute; top: 14px; right: 14px; width: 44px; height: 44px; border: 0; background: none; font-size: 28px; font-weight: 400; line-height: 1; color: inherit; }

/* 1. Первый экран */
.hero { padding-top: 28px; }
.hero__grid { display: grid; grid-template-columns: minmax(300px, 1fr) 2fr; gap: 32px 48px; align-items: center; }
.hero__title { font-weight: 300; color: var(--c-blue); }
.hero__name, .hero__hotel { display: block; font-size: clamp(40px, 4.4vw, 64px); line-height: 1; letter-spacing: -.04em; white-space: nowrap; }
.hero__hotel { line-height: 1.05; }
.hero__city {
	display: block; margin: -2px 0 0 -4px; font: 400 clamp(52px, 6vw, 96px)/.9 var(--f-script); letter-spacing: 0;
}
.hero__sub { display: block; margin-top: 18px; font-size: 24px; font-weight: 400; line-height: 1.3; letter-spacing: -.01em; color: var(--c-blue); }
.hero__bank { display: block; }
.hero__lead { max-width: 26em; font-size: 17px; line-height: 1.55; color: var(--c-muted); }
.hero__lead::before { content: ""; display: block; width: 48px; height: 1px; margin: 22px 0; background: var(--c-blue); opacity: .4; }
.hero__links { display: flex; flex-wrap: wrap; gap: 2px 0; margin-top: 14px; font-size: 14px; line-height: 1.6; }
.hero__links a { white-space: nowrap; }
.hero__links a:not(:last-child)::after { content: "·"; display: inline-block; margin: 0 6px; }
.hero__cta { margin-top: 18px; } .hero__cta .btn { font-size: 15px; } /* задание 49: главная кнопка, остальные ссылки вторичные */
.hero__wa { margin-top: 12px; } /* задание 61, A26: ссылка на ресепшен - только телефон */
@media (min-width: 768px) { .hero__wa { display: none; } }
/* высота не зависит от шрифта */
@media (min-width: 900px) { .hero__lead { max-width: 22em; } }
@media (max-width: 480px) { .hero__lead { min-height: calc(3 * 1.5em + 33px); } }
.hero__links { min-height: calc(2 * 1.6em + 2px); } /* 1 или 2 строки - одна высота с любым шрифтом */
@media (max-width: 359px) { .hero__links { min-height: calc(3 * 1.6em + 4px); } }
.hero__frame { position: relative; aspect-ratio: 16 / 9; overflow: hidden; border-radius: var(--radius); background: var(--c-blue-dark); transform-origin: right top; }
.hero__frame img, .hero__frame video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hero__pause {
	position: absolute; right: 8px; bottom: 8px; width: 44px; height: 44px; display: flex; align-items: center; justify-content: center;
	padding: 0; border: 0; border-radius: 50%; background: none; color: var(--c-on-blue); opacity: .55; transition: opacity .2s;
}
.hero__pause::before { content: ""; position: absolute; inset: 6px; border: 1px solid currentColor; border-radius: 50%; }
.hero__pause svg { width: 10px; height: 12px; }
.hero__pause:focus-visible { opacity: 1; outline: 2px solid var(--c-on-blue); outline-offset: 0; }
@media (hover: hover) { .hero__frame:hover .hero__pause { opacity: 1; } }
.hero__pause[hidden] { display: none; }
.hero__pause .i-play, .hero__pause[aria-pressed="true"] .i-pause { display: none; }
.hero__pause[aria-pressed="true"] .i-play { display: block; }
.hero__caption { margin-top: 14px; font-size: 13px; color: var(--c-muted); }
@media (min-width: 900px) { .hero__copy { padding-bottom: 34.8px; } }

@media (max-width: 899px) {
	.hero__grid { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
	.hero { padding-top: var(--sec); }
	.hero__grid { gap: 20px; }
	.hero__name { font-size: clamp(36px, 11.3vw, 44px); white-space: normal; }
	.hero__hotel { display: inline; font-size: inherit; line-height: inherit; }
	.hero__city { margin: 0 0 0 -2px; font-size: clamp(50px, 15.4vw, 60px); line-height: .95; }
	.hero__sub { margin-top: 12px; font-size: 22px; }
	.hero__lead { font-size: 16px; line-height: 1.5; }
	@media (max-width: 374px) { .hero__lead { max-width: 19em; } }
	.hero__lead::before { margin: 16px 0; }
	.hero__media { margin: 0 -8px; }
	.hero__caption { display: none; }
}

/* Бронь */
.bron { position: relative; z-index: 5; margin-top: 44px; padding-bottom: 1px; scroll-margin-top: calc(var(--head-h) + 12px); }
.booking { padding: 26px 28px 22px; border-radius: var(--radius); background: var(--c-blue); color: var(--c-on-blue); }
.booking__row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(240px, 1.35fr); }
.booking__f { display: flex; flex-direction: column; gap: 6px; min-width: 0; padding: 6px 22px 8px; border-right: 1px solid var(--c-line-on-blue); }
.booking__f:first-child { padding-left: 4px; }
.booking__f:nth-child(3) { border-right: 0; }
.booking label { font-size: 13px; letter-spacing: .01em; color: var(--c-on-blue-3); }
.booking input, .booking select {
	width: 100%; min-height: 36px; padding: 0; border: 0; border-radius: 0; background: transparent; color: var(--c-on-blue);
	font-size: 24px; letter-spacing: -.02em; color-scheme: dark; outline-offset: 4px;
}
.booking select { appearance: none; -webkit-appearance: none; padding-right: 22px; cursor: pointer;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23B9C3E6' stroke-width='1.5'/%3E%3C/svg%3E") no-repeat right 4px center; }
.booking select option { color: var(--c-text); background: var(--c-white); }
.booking select.booking__kids { min-height: 28px; font-size: 14px; letter-spacing: 0; color: var(--c-on-blue-2); }
.booking__go { display: flex; align-items: center; padding: 6px 0 6px 6px; }
.booking__btn {
	width: 100%; min-height: 62px; border: 0; border-radius: var(--radius); background: var(--c-white); color: var(--c-blue);
	font-size: 15px; font-weight: 500; letter-spacing: .02em; transition: background-color .25s ease, transform .25s ease;
}
.booking__btn:hover { background: var(--c-sky); transform: translateY(-1px); }
.booking__foot {
	display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; margin-top: 18px; padding-top: 16px;
	border-top: 1px solid rgba(255, 255, 255, .14); font-size: 13px; color: var(--c-on-blue-2);
}
.booking__foot a { display: inline-flex; align-items: center; gap: 8px; color: var(--c-on-blue); text-decoration: none; }
.booking__foot a:hover { color: var(--c-on-blue); text-decoration: underline; }
@media (max-width: 767px) { .booking__note { display: none; } }
@media (min-width: 768px) and (max-width: 900px) { .booking__note { min-height: calc(2 * 1.6em); } }
.multi { flex: 1 1 100%; display: flex; align-items: center; gap: 10px; min-height: 28px; font-size: 14px; color: var(--c-on-blue); cursor: pointer; }
.multi[hidden] { display: none; }
.booking .multi input { flex: none; width: 18px; height: 18px; min-height: 0; accent-color: var(--c-white); }
.kform .multi { grid-column: 1 / -1; padding-top: 12px; font-size: 15px; }
.booking__many { flex: 1 1 100%; display: flex; flex-wrap: wrap; }
.booking__many[hidden] { display: none; }
.booking__many .booking__f { flex: 0 1 220px; }
.booking__many .booking__f:last-child { border-right: 0; }
@media (max-width: 760px) { .booking__many .booking__f { flex: 1 1 0; } }
.booking__many input { font-size: 20px; }

@media (max-width: 1000px) {
	.booking__row { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.booking__go { grid-column: 1 / -1; padding: 14px 0 0; }
}
@media (max-width: 760px) {
	.bron { margin-top: 16px; }
	.bron .wrap { padding: 0 14px; }
	.booking { padding: 16px 18px 14px; }
	.booking__row { grid-template-columns: 1fr 1fr; }
	.booking__f { gap: 2px; padding: 0 14px 8px 0; }
	.booking__f:nth-child(2) { padding: 0 0 8px 14px; border-right: 0; }
	.booking__f:nth-child(3) { grid-column: 1 / -1; flex-direction: row; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 4px 12px; padding: 8px 0 12px; border-top: 1px solid var(--c-line-on-blue); }
	.booking__guests { display: flex; gap: 12px; }
	.booking label { font-size: 12px; }
	.booking input { font-size: clamp(16px, 5.2vw, 20px); letter-spacing: -.02em; min-width: 0; }
	.booking input::-webkit-calendar-picker-indicator { margin: 0; padding: 0 0 0 2px; }
	.booking select { width: 117px; font-size: 18px; } /* ширина не зависит от шрифта */
	.booking select.booking__kids { width: 100px; min-height: 36px; font-size: 16px; }
	.booking__go { padding: 0; }
	.booking__btn { min-height: 50px; }
	.booking__foot { margin-top: 14px; padding-top: 12px; }
}

/* Ритм фонов: соседние разделы не совпадают */
.about { background: var(--c-stone); }
.ways { background: var(--c-white); }
.rooms, .kar, .way-to, .final { background: var(--c-bg); }
.banq, .reviews, .faq { background: var(--c-white); }

/* Линии гор */
.ridge { width: 100%; height: 70px; margin-bottom: 64px; overflow: visible; }
.ridge path, .peak path { fill: none; stroke: var(--c-blue); stroke-width: 1.3; vector-effect: non-scaling-stroke; }
.ridge--m { display: none; }
@media (max-width: 1023px) { .ridge--m { display: block; } }
@media (max-width: 760px) { .ridge { height: 40px; margin-bottom: 30px; } }

.trail { display: none; }
@media (min-width: 1024px) {
	.trail { display: block; position: absolute; z-index: 1; top: 0; left: 0; width: 140px; pointer-events: none; overflow: visible; }
	.trail path { fill: none; stroke: var(--c-blue); stroke-width: 1.5; stroke-opacity: .55; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
}

/* 2. Ответ-абзац и блок фактов */
.about { padding: clamp(40px, 8vw, 120px) 0 clamp(44px, 7.5vw, 110px); }
.about__grid { display: flex; flex-wrap: wrap; gap: 18px 80px; align-items: flex-start; }
.about__grid > :first-child { flex: 1 1 520px; }
.about__grid > :last-child { flex: 1 1 380px; padding-top: 44px; }
.about .eyebrow { margin-bottom: 22px; }
.facts {
	display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 56px;
	margin: 72px 0 0; padding: clamp(32px, 3vw, 40px);
	background: var(--c-white); border: 1px solid var(--c-card-line); border-radius: var(--radius);
}
.facts > div { padding: 16px 0; }
.facts > div:nth-child(n+3) { border-top: 1px solid var(--c-row-line); }
.facts dt { font-size: 14px; font-weight: 500; color: var(--c-muted); }
.facts dd { margin: 4px 0 0; font-size: 20px; line-height: 1.35; letter-spacing: -.01em; color: var(--c-blue); }
.facts a { text-decoration: none; }
@media (max-width: 760px) {
	.about__grid > :first-child, .about__grid > :last-child { flex-basis: 100%; padding-top: 0; }
	.about .eyebrow { margin-bottom: 14px; }
	.about .lead { font-size: 15px; line-height: 1.7; }
	.facts { margin-top: 30px; }
}
@media (max-width: 600px) {
	.facts { grid-template-columns: 1fr; }
	.facts > div:nth-child(2) { border-top: 1px solid var(--c-row-line); }
}

/* Фото и карточки */
.img { position: relative; overflow: hidden; border-radius: var(--radius); background: var(--c-stone); }
.img img { width: 100%; height: 100%; object-fit: cover; }
.card img { transition: transform .6s var(--ease); }
.card:hover img { transform: scale(1.04); }

.way__txt { text-shadow: var(--c-photo-text-shadow); }

/* 3. Зачем приезжают */
.ways { padding: var(--sec) 0; }
.ways__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.way { position: relative; display: block; height: 560px; overflow: hidden; border-radius: var(--radius); color: var(--c-on-blue); text-decoration: none; }
.way:hover { color: var(--c-on-blue); }
.way .img { position: absolute; inset: 0; border-radius: 0; }
.way::after { content: ""; position: absolute; inset: 0; background: var(--c-photo-shade); }
.way__txt { position: absolute; z-index: 1; left: 36px; right: 36px; bottom: 34px; }
.way__txt::before { content: ""; position: absolute; z-index: -1; inset: -56px -36px -34px; background: var(--c-photo-shade-text); }
.way__no { margin-bottom: 10px; font-size: 15px; font-weight: 500; }
.way h3 { font-weight: 400; font-size: 44px; line-height: 1.05; letter-spacing: -.02em; }
.way__d { max-width: 36ch; margin-top: 12px; font-size: 15px; font-weight: 500; }
.way__s { display: none; margin-top: 8px; font-size: 15px; font-weight: 500; line-height: 1.5; white-space: nowrap; }
.way__go { display: inline-flex; margin-top: 20px; padding-bottom: 4px; border-bottom: 1px solid rgba(255, 255, 255, .7); font-size: 15px; font-weight: 500; letter-spacing: .02em; }
@media (max-width: 900px) { .ways__grid { grid-template-columns: 1fr; } }
@media (max-width: 760px) {
	.ways .wrap { padding: 0 14px; }
	.ways .head-row { margin: 0 8px 22px; }
	.ways__grid { gap: 14px; }
	.way { height: 330px; }
	.way__txt { left: 22px; right: 22px; bottom: 22px; }
	.way__txt::before { inset: -56px -22px -22px; }
	.way__no { margin-bottom: 6px; }
	.way h3 { font-size: 32px; }
	.way__d { display: none; }
	.way__s { display: block; }
	@media (max-width: 379px) { .way__s { letter-spacing: -.01em; } }
	.way__go { margin-top: 12px; padding-bottom: 3px; letter-spacing: 0; }
}

/* 4. Сезон */
.season { display: grid; grid-template-columns: minmax(0, min(50%, 1200px)) minmax(0, 1fr); background: var(--c-sky); }
.season > .img { z-index: 2; min-height: 640px; border-radius: 0; }
.season > .img img { position: absolute; inset: 0; }
.season__txt { display: flex; flex-direction: column; justify-content: center; padding: 96px clamp(24px, 6vw, 96px); }
.season .eyebrow { margin-bottom: 18px; color: var(--c-blue); }
.season .h2 { font-size: clamp(32px, 3.8vw, 54px); line-height: 1.08; }
.season .lead { max-width: 46ch; margin-top: 22px; line-height: 1.7; }
.price { display: flex; align-items: baseline; gap: 12px; margin-top: 30px; }
.price .num { font-size: 40px; }
.season .note { margin: 28px 0 12px; }
@media (max-width: 900px) {
	.season { grid-template-columns: 1fr; }
	.season > .img { min-height: 0; height: clamp(230px, 50vw, 420px); }
}
@media (max-width: 760px) {
	.season__txt { padding: 30px 22px 40px; }
	.season .eyebrow { margin-bottom: 12px; }
	.season .lead { margin-top: 14px; font-size: 15px; }
	.price { margin-top: 20px; }
	.price .num { font-size: 30px; }
	.season .btns .btn { flex: 1 1 100%; min-height: 52px; font-size: 15px; letter-spacing: 0; }
}

/* 5. Номера */
.rooms__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 40px 28px; }
.room { display: flex; flex-direction: column; }
.room .img { display: block; aspect-ratio: 16 / 9; }
.room h3 { margin: 22px 0 6px; font-weight: 400; font-size: 28px; letter-spacing: -.02em; }
.room h3 a { color: var(--c-blue); text-decoration: none; }
.room__meta { font-size: 14px; color: var(--c-muted); }
.room__lead { margin: 10px 0 18px; font-size: 16px; line-height: 1.55; color: var(--c-body); }
.room__foot { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px; margin-top: auto; padding-top: 18px; border-top: 1px solid var(--c-line); }
.room__price { font-size: 15px; line-height: 1.4; }
.room__price b { font-weight: 600; }
.room__price span { display: block; }
.room__price .room__fx { display: inline; white-space: nowrap; color: var(--c-muted); }
.room__btns { display: flex; gap: 8px; }
@media (max-width: 760px) {
	.rooms__grid { grid-template-columns: 1fr; gap: 36px; }
	.room h3 { margin-top: 16px; font-size: 24px; }
	.room__lead { font-size: 15px; }
	.room__btns { flex: 1 1 100%; }
	.room__btns .btn { flex: 1 1 0; min-height: 44px; }
}

/* 6. Банкеты */
.banq__grid { display: flex; flex-wrap: wrap; gap: 48px 80px; align-items: center; }
.banq__txt { flex: 1 1 420px; }
.banq .lead { max-width: 48ch; margin-top: 24px; }
.cap { width: 100%; margin-top: 34px; border-collapse: collapse; font-size: 15px; }
.cap caption { padding-bottom: 10px; text-align: left; font-size: 14px; color: var(--c-muted); }
.cap tr { border-top: 1px solid var(--c-line); }
.cap tr:last-child { border-bottom: 1px solid var(--c-line); }
.cap th { padding: 14px 0; text-align: left; font-weight: 400; color: var(--c-body); }
.cap td { padding: 14px 0; text-align: right; font-size: 20px; letter-spacing: -.02em; color: var(--c-blue); }
.banq__pics { flex: 1 1 560px; display: flex; gap: 18px; align-items: flex-end; }
.banq__pics .img:first-child { flex: 3 1 0; height: 580px; }
.banq__pics .img:last-child { flex: 2 1 0; height: 380px; }
@media (max-width: 760px) {
	.banq__pics { flex-basis: 100%; }
	.banq__pics .img:first-child { height: 300px; }
	.banq__pics .img:last-child { display: none; }
	.banq .lead { font-size: 15px; }
}

/* 7. MB Karaoke */
.kar__grid { display: flex; flex-wrap: wrap; gap: 48px 80px; align-items: center; }
.kar__pics { flex: 1 1 600px; display: grid; grid-template-columns: 2fr 1fr; gap: 18px; align-items: end; }
.kar__fig .img { height: 560px; }
.kar__fig--s .img { height: 300px; }
.kar__fig img { position: absolute; inset: 0; }
figcaption { margin-top: 10px; font-size: 13px; line-height: 1.5; color: var(--c-muted); }
.kar__txt { flex: 1 1 380px; }
.kar .lead { margin-top: 24px; }
.vips { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 30px; }
.vips li { padding: 10px 14px; border: 1px solid var(--c-line-chip); border-radius: var(--radius); font-size: 13px; color: var(--c-blue); }
.vips li.is-big { border-color: var(--c-blue); background: var(--c-blue); color: var(--c-on-blue); }
.kar__tel { display: inline-flex; align-items: center; gap: 8px; font-size: 15px; text-decoration: none; }
@media (max-width: 760px) {
	.kar__pics { flex-basis: 100%; grid-template-columns: 1fr; gap: 14px; }
	.kar__fig .img { height: 300px; }
	.kar__fig--s { display: none; }
	.kar .lead { font-size: 15px; }
}

/* 8. Ресторан и конференц-зал */
.rest { background: var(--c-stone); }
.rest__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; }
.rest__card { display: flex; flex-direction: column; background: var(--c-bg); scroll-margin-top: calc(var(--head-h) + 12px); }
.rest__card > .img { height: 380px; border-radius: 0; }
.rest__txt { padding: 36px 40px 40px; }
.rest__txt .eyebrow { margin-bottom: 12px; }
.rest__txt p.lead { margin-top: 16px; font-size: 16px; line-height: 1.7; }
.rest__txt .btns { margin-top: 26px; }
@media (max-width: 900px) { .rest__grid { grid-template-columns: 1fr; } }
@media (max-width: 760px) {
	.rest__card > .img { height: 240px; }
	.rest__txt { padding: 26px 22px 30px; }
	.rest__txt p.lead { font-size: 15px; }
}

/* 9. Отзывы */
.rates__leave { margin-top: 28px; font-size: 15px; color: var(--c-muted); }
.bron__rate { margin-top: 14px; font-size: 14px; }
.bron__rate a { text-decoration: none; border-bottom: 1px solid currentColor; }
.rcard {
	display: flex; flex-wrap: wrap; align-items: center; gap: 16px 56px; margin-top: 28px; padding: clamp(22px, 3vw, 36px) clamp(22px, 3vw, 40px);
	background: var(--c-white); border: 1px solid var(--c-card-line); border-radius: var(--radius);
}
.rcard__main, .rcard__more { flex: 1 1 250px; min-width: 0; }
.rcard__over { font-size: 14px; font-weight: 500; color: var(--c-muted); }
.rcard__claim { margin-top: 4px; font-size: 17px; color: var(--c-text); }
.rcard__score { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 20px; margin-top: 8px; }
.rcard__num { font-size: clamp(56px, 6vw, 72px); line-height: 1; letter-spacing: -.03em; color: var(--c-blue); }
.rcard__of { font-size: 18px; color: var(--c-muted); }
.rstars { position: relative; flex: none; width: 140px; height: 28px; }
.rstars svg { position: absolute; inset: 0; width: 100%; height: 100%; fill: var(--c-line-chip); }
.rstars svg + svg { fill: var(--c-blue); }
.rcard__counts { font-size: 18px; letter-spacing: -.01em; color: var(--c-blue); }
.rcard__go { display: inline-block; padding: 10px 0; font-size: 16px; font-weight: 500; text-underline-offset: 4px; }
.rcard__date { font-size: 13px; color: var(--c-muted); }
.quote { margin-top: 28px; padding: 44px 48px; border: 1px solid var(--c-card-line); border-radius: var(--radius); background: var(--c-bg); }
.quote blockquote { margin: 18px 0 0; font-weight: 400; font-size: 26px; line-height: 1.45; letter-spacing: -.02em; }
.quote figcaption { margin-top: 22px; font-size: 14px; color: var(--c-muted); }

/* 10. Как добраться */
.way-to__grid { display: flex; flex-wrap: wrap; gap: 56px 80px; align-items: stretch; }
.way-to__txt { flex: 1 1 420px; }
.way-to__addr { margin-top: 22px; font-size: clamp(22px, 2.4vw, 30px); font-weight: 400; line-height: 1.3; letter-spacing: -.01em; color: var(--c-blue); }
.dist { margin-top: 32px; font-size: 16px; }
.dist li { display: flex; justify-content: space-between; gap: 16px; padding: 14px 0; border-top: 1px solid var(--c-line); }
.dist li:last-child { border-bottom: 1px solid var(--c-line); }
.dist span + span { color: var(--c-blue); white-space: nowrap; }
.dist__note { margin-top: 10px; font-size: 13px; color: var(--c-muted); }
.way-to__transfer { margin-top: 18px; font-size: 16px; color: var(--c-text); }
.near__t { margin-top: 28px; font-weight: 400; font-size: 22px; line-height: 1.25; letter-spacing: -.01em; color: var(--c-blue); }
.near { width: 100%; margin-top: 10px; border-collapse: collapse; font-size: 16px; }
.near th, .near td { padding: 10px 0; border-top: 1px solid var(--c-line); font-weight: 400; text-align: left; }
.near tr:last-child th, .near tr:last-child td { border-bottom: 1px solid var(--c-line); }
.near th { width: 58%; }
.near td { padding-left: 16px; color: var(--c-blue); text-align: right; }
.near thead th { font-size: 14px; color: var(--c-muted); }
.near thead th + th { padding-left: 16px; text-align: right; }
.way-to__more { margin-top: 22px; }
.map { position: relative; flex: 1 1 520px; min-height: 460px; overflow: hidden; border-radius: var(--radius); background: var(--c-map); color: var(--c-blue); text-decoration: none; }
.map svg.map__bg { position: absolute; inset: 0; width: 100%; height: 100%; fill: none; }
.m-grid { stroke: var(--c-map-grid); }
.m-road { stroke: var(--c-white); }
.m-axis { stroke: var(--c-map-road); }
.map__pin { position: absolute; left: 50%; top: 48%; transform: translate(-50%, -100%); display: flex; flex-direction: column; align-items: center; }
.map__pin span { display: flex; align-items: center; gap: 10px; padding: 12px 16px; border-radius: var(--radius); background: var(--c-blue); color: var(--c-on-blue); font-size: 14px; letter-spacing: .06em; }
.map__pin svg { fill: currentColor; }
.map__cap { position: absolute; left: 20px; right: 20px; bottom: 16px; font-size: 13px; color: var(--c-muted); }
.map__img, .map__frame { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; object-fit: cover; }
.map--img .map__cap { left: 0; right: 0; bottom: 0; padding: 10px 20px; background: var(--c-head-bg); color: var(--c-text); }
.map__tbd { position: absolute; left: 20px; right: 20px; top: 16px; font-size: 15px; }
.taxi {
	width: min(92vw, 640px); margin: auto; padding: 40px 32px 32px; border: 0; border-radius: var(--radius);
	background: var(--c-white); color: var(--c-blue); text-align: center;
}
.taxi::backdrop { background: rgba(20, 27, 71, .6); }
.taxi p { font-size: clamp(30px, 7vw, 48px); font-weight: 400; line-height: 1.15; letter-spacing: -.02em; }
.taxi small { display: block; margin-top: 14px; font-size: 16px; color: var(--c-muted); }
.taxi .btn { margin-top: 28px; }
@media (max-width: 760px) {
	.map { flex-basis: 100%; min-height: 300px; }
}

/* 11. FAQ */
.faq__grid { display: flex; flex-wrap: wrap; gap: 40px 80px; }
.faq__grid > :first-child { flex: 1 1 320px; }
.faq__list { flex: 2 1 560px; }
.faq__hint { margin-top: 20px; font-size: 15px; color: var(--c-muted); }
.faq details { padding: 4px 0; border-top: 1px solid var(--c-line); }
.faq details:last-child { border-bottom: 1px solid var(--c-line); }
.faq summary {
	display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 20px 0;
	list-style: none; cursor: pointer; font-size: 22px; letter-spacing: -.02em; color: var(--c-blue);
}
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; flex: none; font-weight: 400; font-size: 28px; line-height: 1; transition: transform .3s ease; }
.faq details[open] summary::after { transform: rotate(45deg); }
.faq details p { max-width: 64ch; margin-bottom: 22px; font-size: 16px; color: var(--c-body); }
@media (max-width: 760px) {
	.faq__list { flex-basis: 100%; }
	.faq summary { font-size: 19px; padding: 16px 0; }
	.faq details p { font-size: 15px; }
}

/* 12. Финал */
.final { padding: 40px 0 140px; overflow: hidden; text-align: center; }
.peak { width: 100%; height: 300px; }
.peak path { stroke-width: 1.4; }
.final__in { margin-top: -20px; }
.final__mark { position: relative; width: 54px; height: 48px; margin: 0 auto; color: var(--c-blue); }
.final__mark svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.final__mark .mark-line { opacity: 0; }
.final__mark .mark-line path { fill: none; stroke: currentColor; stroke-width: 22; stroke-linejoin: round; }
.final__script { margin-top: 18px; font: 400 clamp(56px, 6vw, 88px)/1 var(--f-script); color: var(--c-blue); }
.final .h2 { margin: 14px auto 0; font-size: clamp(34px, 4.4vw, 64px); letter-spacing: -.03em; }
.final .h2__big { max-width: 18ch; margin: 0 auto; }
.final .h2__sub { margin: 14px auto 0; }
.final .lead { max-width: 50ch; margin: 22px auto 0; line-height: 1.6; }
.final .btns { justify-content: center; }
@media (max-width: 760px) {
	.final { padding: 20px 0 72px; }
	.peak { height: 140px; }
	.final .lead { font-size: 15px; }
	.final .btns .btn { flex: 1 1 100%; }
}

/* «Что ещё будет на сайте» */
.plan { padding: clamp(40px, 6vw, 80px) 0; background: var(--c-white); }
.plan__box { padding: clamp(24px, 4vw, 48px); border: 1.5px dashed var(--c-plan); border-radius: var(--radius); background: var(--c-plan-bg); }
.plan__title { font-weight: 400; font-size: clamp(24px, 2.6vw, 32px); line-height: 1.2; color: var(--c-plan); }
.plan__list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 40px; margin-top: 22px; padding-left: 1.1em; list-style: disc; font-size: 16px; color: var(--c-tbd); }
.plan__list li::marker { color: var(--c-plan); }
@media (max-width: 760px) { .plan__list { grid-template-columns: 1fr; font-size: 15px; } }

/* 13. Подвал */
.foot { padding: 84px 0 40px; background: var(--c-blue); color: var(--c-on-blue); }
.foot a { color: var(--c-on-blue); text-decoration: none; }
.foot a:hover { color: var(--c-on-blue); text-decoration: underline; }
.foot__grid { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 48px 64px; }
.foot__brand { flex: 1 1 260px; display: flex; flex-direction: column; gap: 10px; }
.foot__brand svg { width: 46px; height: 41px; fill: currentColor; }
.foot__name { margin-top: 8px; font-size: 20px; letter-spacing: .28em; }
.foot__sub { font-size: 10px; letter-spacing: .5em; color: var(--c-on-blue-3); }
.foot__about { max-width: 32ch; margin-top: 18px; font-size: 14px; line-height: 1.7; color: var(--c-on-blue-2); }
.foot__col { flex: 1 1 180px; }
.foot__col h2 { margin-bottom: 16px; font-weight: 400; font-size: 13px; letter-spacing: .01em; color: var(--c-on-blue-3); }
.foot__col ul { display: flex; flex-direction: column; gap: 10px; font-size: 14px; }
.foot__col li > span { color: var(--c-on-blue-3); }
.foot__addr { color: var(--c-on-blue-2); }
.foot__bottom { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; margin-top: 64px; padding-top: 24px; border-top: 1px solid var(--c-line-on-blue); font-size: 12px; color: var(--c-on-blue-3); }
@media (max-width: 760px) { .foot { padding: 56px 0 32px; } }

.flive { display: flex; flex-wrap: wrap; align-items: center; gap: 20px 48px; margin: -44px 0 48px; padding-bottom: 28px; border-bottom: 1px solid var(--c-line-on-blue); }
.wcard { flex: 0 1 380px; display: flex; align-items: center; gap: 18px; padding: 16px 20px; border: 1px solid var(--c-line-on-blue); border-radius: var(--radius-img); }
.wcard__icon { flex: none; }
.wcard__t { display: block; font-size: 30px; line-height: 1.15; letter-spacing: -.01em; }
.wcard__s { display: block; margin-top: 2px; font-size: 14px; line-height: 1.4; color: var(--c-on-blue-2); }
.rates { flex: 1 1 520px; min-width: 0; }
.rates__t { font-size: 13px; color: var(--c-on-blue-2); }
.rates__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px 28px; margin-top: 10px; }
.rate { display: flex; align-items: center; gap: 8px; font-size: 16px; }
.rate__flag { flex: none; border-radius: 2px; }
.rate__code { color: var(--c-on-blue-2); }
.rate__val { margin-left: auto; white-space: nowrap; font-variant-numeric: tabular-nums; }
.foot__credit a { text-decoration: underline; }
.live { font-size: 14px; line-height: 1.6; }
.live__now { display: flex; flex-wrap: wrap; gap: 2px 24px; }
.live__icon { display: inline-block; margin-right: 6px; vertical-align: -3px; }
.live--menu { margin-top: 20px; color: var(--c-muted); }
@media (max-width: 760px) {
	.flive { margin: -24px 0 40px; padding-bottom: 24px; }
	.wcard { flex-basis: 100%; }
	.rates { flex-basis: 100%; }
	.rates__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 24px; }
}

/* Нижняя панель */
.mbar { display: none; }
@media (max-width: 767px) {
	.mbar {
		position: fixed; left: 0; right: 0; bottom: 0; z-index: 60; display: flex; gap: 8px;
		padding: 10px 12px calc(10px + env(safe-area-inset-bottom));
		background: rgba(250, 248, 244, .97); border-top: 1px solid var(--c-line);
		transition: transform .3s ease, visibility 0s linear 0s;
	}
	html.js .mbar:not(.is-on) { transform: translateY(110%); visibility: hidden; transition: transform .3s ease, visibility 0s linear .3s; }
	.mbar a { display: flex; align-items: center; justify-content: center; min-height: 50px; border: 1px solid var(--c-blue); border-radius: var(--radius); color: var(--c-blue); text-decoration: none; }
	.mbar a:first-child { flex: 1 1 auto; background: var(--c-blue); color: var(--c-on-blue); font-size: 15px; }
	.mbar a:not(:first-child) { flex: 0 0 50px; }
}

/* Кнопка связи */
.mbf { display: none; }
@media (min-width: 768px) {
	html.js .mbf { display: block; position: fixed; right: 24px; bottom: 24px; z-index: 45; transition: opacity .15s, visibility .15s; }
	html.js .mbf.is-away { opacity: 0; visibility: hidden; } /* панель брони в зоне кнопки (main.js) */
	.mbf__btn, .mbf__a { position: relative; display: flex; align-items: center; justify-content: center; border-radius: 50%; background: var(--c-blue); color: var(--c-on-blue); box-shadow: 0 0 0 2px var(--c-on-blue), 0 6px 18px rgba(20, 27, 71, .32); transition: background .15s; }
	.mbf__btn { width: 64px; height: 64px; padding: 0; border: 0; cursor: pointer; }
	.mbf__a { width: 52px; height: 52px; }
	.mbf__btn:hover, .mbf__a:hover { background: var(--c-blue-hover); color: var(--c-on-blue); }
	.mbf__btn:focus-visible, .mbf__a:focus-visible { outline: 2px solid var(--c-blue); outline-offset: 4px; }
	.mbf__g { fill: currentColor; }
	.mbf__btn svg { transition: opacity .15s, transform .15s; }
	.mbf__x { position: absolute; top: 20px; left: 20px; opacity: 0; transform: rotate(-90deg); }
	.mbf.is-open .mbf__btn svg:first-child { opacity: 0; transform: rotate(90deg); }
	.mbf.is-open .mbf__x { opacity: 1; transform: none; }
	.mbf__list { position: absolute; right: 6px; bottom: 78px; display: flex; flex-direction: column; gap: 14px; visibility: hidden; opacity: 0; transform: translateY(8px); transition: opacity .15s, transform .15s, visibility 0s linear .15s; }
	.mbf.is-open .mbf__list { visibility: visible; opacity: 1; transform: none; transition-delay: 0s; }
	.mbf__tip { position: absolute; right: calc(100% + 12px); top: 50%; padding: 6px 10px; border-radius: var(--radius); background: var(--c-blue-dark); color: var(--c-on-blue); font-size: 14px; white-space: nowrap; opacity: 0; transform: translateY(-50%); pointer-events: none; transition: opacity .15s; }
	.mbf__a:hover .mbf__tip, .mbf__a:focus-visible .mbf__tip { opacity: 1; }
}

/* Простые страницы */
.page { padding: var(--sec) 0; }
.page__body { max-width: 72ch; margin-top: 32px; color: var(--c-body); }
.page__body > * + * { margin-top: 1em; }
.page__body h2 { margin-top: 1.6em; }
.page__body ul { padding-left: 1.2em; list-style: disc; }
.page__body li + li { margin-top: .5em; }
.legal { margin-top: 12px; font-size: 12px; color: var(--c-on-blue-2); }
.legal a { color: inherit; }
.kform__go .legal { flex-basis: 100%; margin-top: 0; }

/* Моушн: только transform, opacity, clip-path; без scroll-driven - main.js (html.no-sda) */

@keyframes mb-draw-x { from { clip-path: inset(0 100% 0 0); } to { clip-path: inset(0); } }
@keyframes mb-draw-y { from { clip-path: inset(0 0 calc(100% - 60vh) 0); } to { clip-path: inset(0); } }
@keyframes mb-reveal { from { clip-path: inset(14% 0 0 0); opacity: .25; } to { clip-path: inset(0); opacity: 1; } }
@keyframes mb-rise { from { transform: translateY(28px); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes mb-zoom { from { scale: 1.08; } to { scale: 1; } }
@keyframes mb-hero-grow { to { transform: scale(var(--hero-s, 1)); } }
@keyframes mb-hero-out { to { transform: translateY(-48px); opacity: .15; } }

@media (prefers-reduced-motion: no-preference) {
	@supports (animation-timeline: scroll()) {
		html:not(.no-sda) .ridge { animation: mb-draw-x linear both; animation-timeline: view(); animation-range: entry 100% cover 45%; }
		html:not(.no-sda) .peak { animation: mb-draw-x linear both; animation-timeline: view(); animation-range: entry 10% cover 55%; }
		html:not(.no-sda) .reveal { animation: mb-reveal linear both; animation-timeline: view(); animation-range: entry 0% entry 85%; }
		html:not(.no-sda) .rise { animation: mb-rise linear both; animation-timeline: view(); animation-range: entry 0% entry 70%; }
		html:not(.no-sda) .trail { animation: mb-draw-y linear both; animation-timeline: scroll(root); }
	}
	@media (min-width: 1024px) {
		@supports (animation-timeline: scroll()) {
			html:not(.no-sda) .hero__frame { animation: mb-hero-grow linear both; animation-timeline: scroll(root); animation-range: 0px 400px; }
			html:not(.no-sda) .hero__copy, html:not(.no-sda) .hero__caption { animation: mb-hero-out linear both; animation-timeline: scroll(root); animation-range: 0px 400px; }
			html:not(.no-sda) main > section:not(.hero) .img > img { animation: mb-zoom linear both; animation-timeline: view(); animation-range: entry 0% cover 50%; }
		}
		html.no-sda main > section:not(.hero) .img > img { scale: 1.08; transition: scale 1.2s var(--ease); }
		html.no-sda main > section:not(.hero) .img > img.is-in { scale: 1; }
	}

	/* без scroll-driven: состояния ставит main.js */
	html.no-sda .rise { opacity: 0; transform: translateY(28px); transition: opacity .6s var(--ease), transform .6s var(--ease); }
	html.no-sda .reveal { opacity: .25; clip-path: inset(14% 0 0 0); transition: opacity .6s var(--ease), clip-path .6s var(--ease); }
	html.no-sda .ridge, html.no-sda .peak { clip-path: inset(0 100% 0 0); transition: clip-path 1.4s var(--ease); }
	html.no-sda .ridge { transition-duration: .9s; }
	html.no-sda .is-in.rise, html.no-sda .is-in.reveal { opacity: 1; transform: none; clip-path: inset(0); }
	html.no-sda .is-in.ridge, html.no-sda .is-in.peak { clip-path: inset(0); }

	html.js .h2.split .ln { display: block; overflow: hidden; padding-bottom: .08em; margin-bottom: -.08em; }
	html.js .h2.split .ln > span { display: inline-block; transform: translateY(105%); }
	html.js .h2.split.is-in .ln > span { transform: none; transition: transform .6s var(--ease) calc(var(--i) * 80ms); }
	html.js .ways__grid .way { opacity: 0; transform: translateY(24px); }
	html.js .ways__grid.is-in .way { opacity: 1; transform: none; transition: opacity .6s var(--ease) calc(var(--i) * 100ms), transform .6s var(--ease) calc(var(--i) * 100ms); }
	html.js .final__mark .mark-fill { opacity: 0; }
	html.js .final__mark .mark-line { opacity: 1; clip-path: inset(100% 0 0 0); }
	html.js .final__mark.is-in .mark-line { clip-path: inset(0); transition: clip-path .5s var(--ease); }
	html.js .final__mark.is-in .mark-fill { opacity: 1; transition: opacity .3s ease .5s; }
}

/* уже на экране - без анимации */
html .is-shown.rise, html .is-shown.reveal, html .is-shown.ridge, html .is-shown.peak {
	animation: none !important; transition: none !important; opacity: 1 !important; transform: none !important; clip-path: none !important;
}
html .img > img.is-shown { animation: none !important; transition: none !important; scale: 1 !important; }
html.js .ways__grid.is-shown .way, html.js .final__mark.is-shown .mark-line, html.js .final__mark.is-shown .mark-fill { transition: none !important; }

/* кнопка связи бьётся как сердце (задание 59б): «тук-тук» и покой, цикл 1,4 с; кольцо - на каждый цикл; только transform и opacity */
@media (min-width: 768px) and (prefers-reduced-motion: no-preference) {
	.mbf__btn { animation: mbf-beat 1.4s ease-out infinite; }
	.mbf__btn::after { content: ""; position: absolute; inset: 0; border: 3px solid var(--c-blue); border-radius: 50%; opacity: 0; pointer-events: none; animation: mbf-ring 1.4s ease-out infinite; }
	.mbf__btn:hover, .mbf__btn:focus, .mbf__btn[aria-expanded="true"], .mbf.is-open .mbf__btn,
	.mbf__btn:hover::after, .mbf__btn:focus::after, .mbf__btn[aria-expanded="true"]::after, .mbf.is-open .mbf__btn::after { animation: none; }
}
@keyframes mbf-beat {
	0%, 22%, 45%, 100% { transform: none; }
	12% { transform: scale(1.18); }
	32% { transform: scale(1.14); }
}
@keyframes mbf-ring {
	0% { opacity: .7; transform: none; }
	60%, 100% { opacity: 0; transform: scale(2.2); }
}

@media (prefers-reduced-motion: reduce) {
	html.js .mbf, .mbf *, .mbf *::after { transition: none; }
	*, *::before, *::after { transition-duration: .01ms !important; animation: none !important; }
	.card:hover img, .btn:hover, .booking__btn:hover { transform: none; }
}