/* Start:/local/templates/escalada/css/pages/main-page.css?1791543862188597*/
/* ==========================================================================
   Главная страница клубов (Академка / Коммунарка) — стили.
   MOBILE-FIRST: сначала базовые стили для самых узких экранов (320px),
   дальше — блоки @media (min-width: …) по возрастанию ширины, каждый дополняет предыдущие.
   Ширины переключения — по макетам Figma: 356 · 466 · 591 · 705 · 897 · 1101 · 1181 · 1261 · 1321 · 1681.
   ========================================================================== */

.main-page {
    --main-page-bg: #000a0e;
    --main-page-white: #edf7fb;
    --main-page-gray: #d1d1d1;
    --main-page-blue: #00a1e6;
    --main-page-blue-400: #00b1fd;
    --main-page-blue-line: #00a0e3;
    --main-page-line: rgba(0, 160, 227, 0.25); /* обводки в макете — #00a0e3 с прозрачностью */
    --main-page-blue-50: #94dbfa;
    --main-page-blue-800: #004d6e;
    --main-page-neutral-800: #525252;
    --main-page-neutral-900: #383838;
    --main-page-card-dark: #080e19;
    --main-page-font: Tahoma, Verdana, 'Segoe UI', sans-serif;
    --main-page-font-title: 'Fedra Sans Pro', Tahoma, Verdana, sans-serif;
    --main-page-pad: 20px;
    --main-page-gap: 60px;
    --main-page-header: var(--site-header-h, 64px); /* высота шапки — css/header.css */
    display: flex;
    flex-direction: column;
    gap: var(--main-page-gap);
    padding: var(--main-page-header) 0 var(--main-page-gap);
    background: var(--main-page-bg);
    color: var(--main-page-white);
    font-family: var(--main-page-font);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.3;
    overflow: hidden;
    overflow: clip; /* clip, а не hidden: hidden делает .main-page контейнером прокрутки и ломает position: sticky (стопка зон) */
    font-feature-settings: "lnum" 1, "pnum" 1;
    --main-page-blue-200: #62cdfb;
    --main-page-blue-600: #0090ce;
    --main-page-focus: #4d85e0;
    --main-page-error: #e04d4d;
    --main-page-stroke-tag: linear-gradient(90deg, rgba(0, 160, 227, 0.2), rgba(0, 160, 227, 0));
    --main-page-stroke-dir: linear-gradient(127deg, rgba(0, 160, 227, 0) 9%, rgba(0, 160, 227, 0.3) 110%);
}

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

/* Сброс глобальных стилей шаблона (base.css задаёт h1-h3 курсив, GothemPro и отступы).
   :where() держит специфичность на уровне одного класса, чтобы main-page__классы ниже его перебивали */

.main-page :where(h1, h2, h3, p, ul) {
    margin: 0;
    padding: 0;
    font-family: var(--main-page-font); /* base.css ставит заголовкам GothemPro */
    font-style: normal;
    letter-spacing: 0;
    list-style: none;
}

.main-page img {
    display: block;
    max-width: none;
}

.main-page button {
    font-family: inherit;
}

.main-page__accent {
    color: var(--main-page-blue-400);
}

.main-page__nowrap {
    white-space: nowrap;
}

.main-page__section {
    padding: 0 var(--main-page-pad);
}

.main-page__h2 {
    font-family: var(--main-page-font-title);
    font-size: 24px;
    font-weight: 700;
    line-height: 1.3;
    color: var(--main-page-white);
    text-transform: uppercase;
}

/* ---------- Тег-плашка ---------- */

.main-page__tag {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    align-self: flex-start;
    padding: 7px 15px;
    border: 1px solid var(--main-page-line);
    border-radius: 100px;
    position: relative;
    --main-page-sw: 1px;
    --main-page-stroke: var(--main-page-stroke-tag);
}

.main-page__tag-icon {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
}

.main-page__tag-text {
    font-size: 15px;
    font-weight: 700;
    line-height: 1.3;
    color: var(--main-page-blue-line);
    text-transform: uppercase;
    white-space: nowrap;
}

/* ---------- Кнопки ---------- */

/* Кнопки: «малый» стиль, иконка в потоке */
.main-page__btn {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    padding: 7px 10px 6px 30px;
    border: 1px solid transparent;
    border-radius: 999px;
    background: var(--main-page-blue);
    color: var(--main-page-white);
    font-size: 16px;
    font-weight: 700;
    line-height: 1;
    text-transform: uppercase;
    white-space: nowrap;
    cursor: pointer;
    overflow: hidden;
}

.main-page__btn-icon {
    position: static;
    right: 14px;
    bottom: 11px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 999px;
    background: var(--main-page-white);
}

.main-page__btn-icon img {
    width: 20px;
    height: 20px;
}

.main-page__btn--outline {
    border-color: var(--main-page-blue);
    background: transparent;
    color: var(--main-page-blue-400);
}

.main-page__btn--outline .main-page__btn-icon {
    background: var(--main-page-blue);
}

.main-page__btn--wide {
    width: 100%;
}

/* Неактивные кнопки (ссылки привяжем на этапе 2) */

.main-page__btn--disabled {
    cursor: default;
}

.main-page__btn--muted {
    background: var(--main-page-neutral-900);
    color: var(--main-page-neutral-800);
}

.main-page__btn--dark {
    border-color: var(--main-page-neutral-900);
    background: #000;
    color: var(--main-page-neutral-900);
}

/* Стрелки слайдера */

/* Слайдеры: стрелки скрыты, «Все …» — под слайдером */
.main-page__arrows {
    display: none;
    gap: 20px;
}

.main-page__arrow {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 80px;
    height: 55px;
    padding: 10px 20px;
    border: 1px solid var(--main-page-blue-400);
    border-radius: 100px;
    background: transparent;
    cursor: pointer;
}

.main-page__arrow svg {
    display: block;
    width: 21px;
    height: 21px;
}

.main-page__arrow--prev svg {
    transform: scaleX(-1);
}

/* Буллиты слайдера */

.main-page__bullets {
    display: flex;
    justify-content: center;
    gap: 4px;
    max-width: 100%;
}

.main-page__bullets-item {
    position: relative;
    width: 80px;
    height: 5px;
    border-radius: 100px;
    background: var(--main-page-neutral-900);
    flex: 0 1 80px;
    min-width: 12px;
}

.main-page__bullets-item.is-active::after {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 50%;
    border-radius: 100px;
    background: linear-gradient(to right, #00a0e3, rgba(0, 160, 227, 0.4));
}

/* Светящийся вертикальный разделитель */

.main-page__divider {
    width: 7px;
    height: 52px;
    margin: -3px -3.5px;
    flex-shrink: 0;
}

/* Заголовок секции по центру */

.main-page__center-head {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 30px;
    text-align: center;
}

.main-page__center-head .main-page__tag {
    align-self: center;
}

/* Заголовок секции-слайдера: тег + строка (заголовок слева, кнопки справа) */

.main-page__block-head {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.main-page__block-head-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
}

.main-page__block-head-row--end {
    align-items: flex-end;
}

.main-page__block-head-title {
    max-width: none;
}

.main-page__block-head-actions {
    display: none;
    align-items: center;
    gap: 20px;
}

.main-page__slider-block {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.main-page__directions .main-page__block-head {
    gap: 20px;
}

/* ==========================================================================
   Hero
   ========================================================================== */

/* Hero: текст сверху, ниже рейтинг → кнопки → преимущества */
.main-page__hero {
    display: flex;
    flex-direction: column;
    gap: var(--main-page-gap);
}

.main-page__hero-main {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 1283px;
    padding: 40px 20px 20px;
}

.main-page__hero-bg {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.main-page__hero-bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.main-page__hero-bg::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(181.44deg, #000 21.237%, rgba(1, 1, 1, 0.1) 44.343%, #000 70.998%);
}

.main-page__hero-content {
    position: relative;
    display: contents;
    flex-direction: column;
    gap: 40px;
}

.main-page__hero-text {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.main-page__hero-title {
    max-width: 784px;
    font-family: var(--main-page-font-title);
    font-size: 24px;
    font-weight: 700;
    line-height: 1.3;
    color: var(--main-page-white);
    text-transform: uppercase;
}

.main-page__hero-descr {
    max-width: 610px;
    font-size: 16px;
    color: var(--main-page-gray);
}

.main-page__hero-descr p + p {
    margin-top: 10px;
}

.main-page__hero-buttons {
    display: flex;
    gap: 20px;
}

.main-page__hero-btn {
    width: 100%;
}

.main-page__hero-btn--video {
    width: 100%;
}

.main-page__hero-btn--video .main-page__btn-icon {
    right: 17px;
    bottom: 12px;
}

/* Виджет рейтинга Яндекса */

/* Компактный виджет рейтинга */
.main-page__rating {
    position: relative;
    top: auto;
    right: auto;
    width: 200px;
    height: 110px;
    padding: 16px 20px;
    border: 1px solid rgba(0, 160, 227, 0.2);
    border-radius: 20px;
    background: rgba(70, 127, 209, 0.1);
    -webkit-backdrop-filter: blur(5px) brightness(0.9);
    backdrop-filter: blur(5px) brightness(0.9);   /* подложка на 10% темнее — плашка не сливается с фото */
}

.main-page__rating-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: auto;
}

.main-page__rating-caption {
    width: 58px;
    font-size: 10px;
    color: var(--main-page-gray);
    text-align: right;
}

.main-page__rating-mark {
    display: flex;
    flex-direction: column;
    gap: 5px;
    margin-top: 12px;
}

.main-page__rating-value {
    display: flex;
    align-items: center;
    gap: 15px;
    font-size: 24px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: -0.24px;
}

.main-page__rating-reviews {
    font-size: 13px;
    color: var(--main-page-gray);
}

/* Преимущества */

.main-page__advantages {
    position: relative;
    display: grid;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 20px;
    margin-top: 60px;
    padding: 20px;
    border: 2px solid var(--main-page-line);
    border-radius: 20px;
    background: rgba(70, 127, 209, 0.1);
    -webkit-backdrop-filter: blur(5px) brightness(0.9);
    backdrop-filter: blur(5px) brightness(0.9);   /* подложка на 10% темнее — плашка не сливается с фото */
    --main-page-sw: 2px;
    --main-page-stroke: linear-gradient(94deg, rgba(0, 160, 227, 0.2) 0%, rgba(0, 160, 227, 0) 114%);
}

.main-page__advantages-item {
    display: flex;
    align-items: flex-start;
    gap: 20px;
}

.main-page__advantages-icon {
    width: 64px;
    height: 64px;
    flex-shrink: 0;
}

.main-page__advantages-text {
    display: flex;
    flex-direction: column;
    gap: 2px;
    width: auto;
}

.main-page__advantages-item--wide .main-page__advantages-text {
    width: 190px;
}

.main-page__advantages-value {
    font-size: 20px;
    font-weight: 700;
    text-transform: uppercase;
    white-space: nowrap;
}

.main-page__advantages-value sup {
    font-size: 12.9px;
    line-height: 0;
    vertical-align: 0.6em;
}

.main-page__advantages-label {
    max-width: 170px;
    font-size: 16px;
    color: var(--main-page-gray);
}

.main-page__advantages-item--wide .main-page__advantages-label {
    max-width: 170px;
}

/* ==========================================================================
   Оффер-плашка («7 дней», «Скидка до 20%»)
   ========================================================================== */

/* Офферы: заголовок и подпись в колонку, картинка меньше */
/* Офферы */
/* Оффер «7 дней» — отдельный блок, гантель свисает вниз */
.main-page__offer {
    height: auto;
    padding: 0 var(--main-page-pad) 80px;
    overflow: visible;
}

.main-page__zones .main-page__offer {
    margin: 0;
}

/* Оба оффера — колонка по центру */
.main-page__offer-card {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 260px;
    padding: 40px 20px 0;
    border: 2px solid var(--main-page-line);
    border-radius: 20px;
    background: linear-gradient(90.46deg, #162130 0.17%, #456796 175.69%);
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    --main-page-sw: 2px;
    --main-page-stroke: linear-gradient(95deg, rgba(0, 160, 227, 0.2) 5%, rgba(0, 160, 227, 0) 103%);
}

.main-page__offer-pic {
    position: absolute;
    left: -2px;
    bottom: 4px;
    width: 203px;
    height: 151px;
    overflow: hidden;
    pointer-events: none;
}

.main-page__offer-pic picture {
    display: contents;
}

.main-page__offer-pic img {
    position: absolute;
    top: -21.85%;
    left: -6.82%;
    width: 111.26%;
    height: 149.62%;
}

/* Монета: выступает над плашкой, низ срезается нижним краем плашки */

.main-page__offer--zones .main-page__offer-pic img {
    top: -16.09%;
    left: 0.01%;
    width: 100%;
    height: 133.63%;
}

.main-page__offer-text,
.main-page__offer-action {
    display: flex;
    align-items: center;
    gap: 40px;
}

.main-page__offer-label {
    display: flex;
    align-items: center;
    gap: 10px;
    text-transform: uppercase;
    white-space: normal;
}

.main-page__offer-title {
    font-size: 24px;
    font-weight: 700;
    color: var(--main-page-white);
}

.main-page__offer-sub {
    font-size: 16px;
    color: var(--main-page-gray);
}

/* ==========================================================================
   Интерактивная карта клуба
   ========================================================================== */

/* Карта: вместо подписей и линий — пины на мобильном рендере */
.main-page__map {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 40px;
    padding: 0 var(--main-page-pad);
}

.main-page__map-canvas {
    position: relative;
    width: 280px;
    height: auto;
    flex-shrink: 0;
    overflow: hidden;
}

.main-page__map-image {
    position: absolute;
    top: -33px;
    left: 50%;
    width: 852px;
    height: 852px;
    transform: translateX(-50%);
    object-fit: cover;
}

.main-page__map-line {
    position: absolute;
}

.main-page__map-line img {
    position: absolute;
    width: auto;
    height: auto;
    min-width: 100%;
    min-height: 100%;
}

.main-page__map-label {
    position: absolute;
    flex-direction: column;
    gap: 10px;
    width: 297px;
    font-size: 20px;
}

.main-page__map-label-title {
    font-weight: 700;
    color: var(--main-page-white);
    text-transform: uppercase;
    white-space: nowrap;
}

.main-page__map-label-text {
    color: var(--main-page-gray);
}

/* ==========================================================================
   Направления
   ========================================================================== */

.main-page__directions-list {
    display: flex;
    gap: 10px;
}

.main-page__dir-card {
    position: relative;
    display: flex;
    flex: 0 0 var(--main-page-card-w);
    flex-direction: column;
    justify-content: flex-end;
    gap: 10px;
    min-width: 0;
    min-height: 0;
    aspect-ratio: 315 / 460;
    padding: 30px;
    border: 2px solid rgba(0, 160, 227, 0.15);
    border-radius: 20px;
    overflow: hidden;
    transition: transform 0.3s ease-in-out, border-color 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
}

.main-page__dir-card-bg {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.main-page__dir-card-bg img {
    position: absolute;
}

.main-page__dir-card-bg::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(to bottom, rgba(8, 14, 25, 0) 39.574%, var(--main-page-card-dark) 71.596%);
}

.main-page__dir-card-title {
    position: relative;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.3;
    color: var(--main-page-white);
    text-transform: uppercase;
    transition: color 0.3s ease-in-out;
}

.main-page__dir-card-text {
    position: relative;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    font-size: 16px;
    color: var(--main-page-gray);
}

/* ==========================================================================
   Форма «Тест-драйв»
   ========================================================================== */

.main-page__form-box {
    position: relative;
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    padding: 20px;
    border: 2px solid var(--main-page-line);
    border-radius: 20px;
    background: radial-gradient(ellipse 1512px 330px at 56.4% 43%, #456796 0%, #2d4463 50%, #22334a 75%, #162130 100%);
    overflow: hidden;
}

.main-page__form-logo {
    position: absolute;
    top: -88px;
    left: auto;
    width: 585px;
    height: 402px;
    transform: none;
}

.main-page__form-person {
    position: absolute;
    top: calc(50% + 225.25px);
    left: 268px;
    width: auto;
    height: auto;
    transform: translateY(-50%);
    overflow: hidden;
    pointer-events: none;
}

.main-page__form-person img {
    position: absolute;
    left: 0;
    width: 100%;
    height: auto;
}

.main-page__form--man .main-page__form-person img {
    top: 0.72%;
}

.main-page__form--woman .main-page__form-person img {
    top: -3.5%;
}

.main-page__form-info {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 20px;
    width: 100%;
}

.main-page__form-head {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.main-page__form-sub {
    font-size: 16px;
    color: var(--main-page-white);
}

.main-page__form-benefits {
    display: flex;
    flex-wrap: wrap;
    gap: 20px 10px;
}

.main-page__form-benefit {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 205px;
    font-size: 16px;
    font-weight: 700;
    color: var(--main-page-white);
}

.main-page__form--large .main-page__form-benefit:not(:last-child) {
    font-size: 16px;
}

.main-page__form-benefit img {
    width: 64px;
    height: 64px;
    flex-shrink: 0;
}

.main-page__form-panel {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 20px;
    width: 100%;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 20px;
    background: none;
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
    --main-page-sw: 2px;
    --main-page-stroke: linear-gradient(122deg, rgba(0, 160, 227, 0.2) 0%, rgba(0, 160, 227, 0) 102%);
}

.main-page__form-inputs {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.main-page__input {
    width: 100%;
    height: 53px;
    padding: 16px 20px;
    border: 1px solid var(--main-page-blue-line);
    border-radius: 12px;
    background: var(--main-page-blue-800);
    color: var(--main-page-white);
    font-family: var(--main-page-font);
    font-size: 18px;
    line-height: 1.3;
    outline: none;
}

.main-page__input::placeholder {
    color: var(--main-page-gray);
    opacity: 1;
}

.main-page__form-connect {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.main-page__form-label {
    font-size: 18px;
    font-weight: 700;
    color: var(--main-page-blue-50);
}

.main-page__form-messengers {
    display: flex;
    gap: 10px;
}

.main-page__form-messenger {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    padding: 0;
    border: 1px solid var(--main-page-blue-400);
    border-radius: 6px;
    background: transparent;
    cursor: pointer;
    transition: background-color 0.3s ease-in-out, border-color 0.3s ease-in-out, transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
}

.main-page__form-messenger img {
    width: 20px;
    height: 20px;
    transition: filter 0.3s ease-in-out;
}

.main-page__check {
    display: flex;
    align-items: flex-start;
    gap: 20px;
    cursor: pointer;
}

/* Не <input>: шаблон навешивает jQuery formstyler на все input — рисуем чекбокс сами */

.main-page__check-box {
    position: relative;
    width: 24px;
    height: 24px;
    flex-shrink: 0;
    border: 1px solid var(--main-page-blue-line);
    border-radius: 4px;
}

.main-page__check-box[aria-checked="true"] {
    background: var(--main-page-blue-400);
}

.main-page__check-box[aria-checked="true"]::after {
    content: '✓';
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: Arial, sans-serif;
    font-size: 16px;
    color: var(--main-page-white);
}

.main-page__check-text {
    font-size: 16px;
    color: var(--main-page-blue-50);
}

/* ==========================================================================
   Зоны клуба
   ========================================================================== */

/* Зоны: одна колонка */
.main-page__zones {
    display: flex;
    flex-direction: column;
    gap: var(--main-page-gap);
}

.main-page__zones-wrap {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 30px;
}

.main-page__zones-info {
    position: static;
    top: var(--main-page-header);
    display: flex;
    flex-direction: column;
    gap: 30px;
    width: 100%;
    flex-shrink: 1;
}

.main-page__zones-head {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.main-page__zones-title {
    max-width: none;
}

.main-page__zones-text {
    max-width: none;
    font-size: 16px;
    color: var(--main-page-gray);
}

.main-page__zones-text p + p {
    margin-top: 10px;
}

.main-page__zones-info .main-page__btn {
    align-self: flex-start;
}

.main-page__zones-list {
    display: flex;
    flex-direction: column;
    gap: 30px;
    width: 100%;
    flex-shrink: 0;
}

.main-page__zone-card {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    height: auto;
    padding: 200px 20px 20px;
    border: 2px solid rgba(0, 160, 227, 0.2);
    border-radius: 20px;
    overflow: hidden;
}

.main-page__zone-card-bg {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.main-page__zone-card-bg img {
    position: absolute;
    top: 0;
    left: var(--ml, 0);
    width: var(--mw, 100%);
    height: var(--mh, 70%);
    object-fit: cover;
}

.main-page__zone-card-bg::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(to bottom, rgba(8, 14, 25, 0) 45%, var(--main-page-card-dark) 66%);
}

.main-page__zone-card-text {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: 100%;
}

.main-page__zone-card-title {
    font-size: 20px;
    font-weight: 700;
    line-height: 1.3;
    color: var(--main-page-white);
    text-transform: uppercase;
}

.main-page__zone-card-descr {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    font-size: 16px;
    color: var(--main-page-gray);
}

/* ==========================================================================
   Клубные карты
   ========================================================================== */

.main-page__cards {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 30px;
    padding: 0;
}

.main-page__cards-sub {
    font-size: 16px;
    color: var(--main-page-gray);
}

.main-page__cards-slider {
    position: relative;
    display: block;
    align-items: center;
    justify-content: center;
    gap: 20px;
    z-index: 0;
    --main-page-cs-w: 63px;
    --main-page-cs-h: 32px;
    --main-page-cm-w: 187px;
    --main-page-cm-h: 90px;
    --main-page-c-gap: 20px;
    flex-shrink: 0;
    width: calc(2 * var(--main-page-cs-w) + var(--main-page-cm-w) + 2 * var(--main-page-c-gap));
    height: var(--main-page-cm-h);
    --main-page-cards-speed: 0.9s;
    --main-page-cards-ease: cubic-bezier(0.16, 1, 0.3, 1);   /* как у лент слайдеров: разгон и долгое плавное торможение */
    touch-action: pan-y;
    user-select: none;
    -webkit-user-select: none;
    --main-page-glow-x: -28.34%;
    --main-page-glow-y: -82.22%;
    --main-page-glow-w: 232.62%;
    --main-page-glow-h: 296.67%;
}

.main-page__cards-text {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
    text-align: center;
    position: relative;
    z-index: 1;
}

.main-page__cards-title {
    font-size: 20px;
    font-weight: 700;
    line-height: 1.3;
    color: var(--main-page-white);
    text-transform: uppercase;
}

.main-page__cards-lines {
    display: flex;
    flex-direction: column;
    gap: 10px;
    font-size: 15px;
    color: var(--main-page-gray);
}

.main-page__cards-btn {
    width: 100%;
    position: relative;
    z-index: 1;
}

.main-page__cards > .main-page__arrows {
    position: absolute;
    top: 340px;
    left: 40px;
    right: 40px;
    justify-content: space-between;
    pointer-events: none;
}

.main-page__cards > .main-page__arrows .main-page__arrow {
    pointer-events: auto;
}

/* ==========================================================================
   Тренеры
   ========================================================================== */

.main-page__trainers-list {
    display: flex;
    gap: 10px;
}

/* Карточка тренера — колонка: бирка → фото (всё свободное место) → имя и должность.
   Размер карточки задан пропорцией (на мобиле — высотой), содержимое его не меняет. */

/* Тренер: фото шире, подпись ниже */
.main-page__trainer {
    position: relative;
    display: flex;
    flex-direction: column;
    flex: 0 0 var(--main-page-trainer-w, 450px);
    min-width: 0;
    aspect-ratio: auto;
    border: 1px solid rgba(0, 160, 227, 0.12);
    border-radius: 20px;
    background: linear-gradient(to bottom, #02060e 4.75%, #253448 112.56%);
    overflow: hidden;
    transition: transform 0.3s ease-in-out, border-color 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
}

/* Фото тренера: рамка — от бирки до имени (зазоры по 2px), фото (PNG без фона) вписано в неё целиком
   и стоит внизу, прямо над именем — ничего не обрезается, какие бы пропорции и поля ни были у картинки. */

.main-page__trainer-photo {
    position: relative;
    flex: 1 1 0;
    min-height: 0;
    margin: 2px 14px;
}

.main-page__trainer-photo img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center bottom;
}

.main-page__trainer .main-page__tag {
    order: -1; /* в разметке шаблона фото идёт раньше бирки — в колонке бирка всё равно сверху */
    flex-shrink: 0;
    align-self: flex-start;
    margin: 20px 0 0 20px;
}

.main-page__trainer-info {
    position: relative;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding: 0 20px 17px;
}

.main-page__trainer-name {
    font-size: 20px;
    font-weight: 700;
    line-height: 1.3;
    color: var(--main-page-white);
    text-transform: uppercase;
    transition: color 0.3s ease-in-out;
}

.main-page__trainer-role {
    font-size: 16px;
    color: var(--main-page-gray);
}

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

.main-page__news-list {
    display: flex;
    gap: 20px;
}

.main-page__news-card {
    display: flex;
    flex: 1 0 0;
    flex-direction: column;
    gap: 20px;
    min-width: 0;
}

.main-page__news-card-photo {
    height: 493px;
    border: 2px solid var(--main-page-line);
    border-radius: 20px;
    overflow: hidden;
    display: block;
    transition: border-color 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
}

.main-page__news-card-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.main-page__news-card-text {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.main-page__news-card-date {
    font-size: 16px;
    color: var(--main-page-gray);
}

.main-page__news-card-title {
    font-size: 20px;
    font-weight: 700;
    line-height: 1.3;
    color: var(--main-page-white);
    text-transform: uppercase;
    transition: color 0.3s ease-in-out;
}

/* ==========================================================================
   Контакты
   ========================================================================== */

.main-page__contacts-box {
    position: relative;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 20px;
    border-radius: 20px;
    background: radial-gradient(ellipse 1512px 330px at 56.4% 43%, #456796 0%, #2d4463 50%, #22334a 75%, #162130 100%);
    overflow: hidden;
}

.main-page__contacts-info {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: 20px;
    width: 100%;
}

.main-page__contact {
    display: flex;
    align-items: flex-start;
    gap: 15px;
}

.main-page__contact-decor {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    width: 30px;
    flex-shrink: 0;
}

.main-page__contact-decor .main-page__divider {
    margin: -3px 0;
}

.main-page__contact-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border: 1px solid rgba(0, 160, 227, 0.2);
    border-radius: 6px;
    background: rgba(70, 127, 209, 0.1);
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
}

.main-page__contact-icon img {
    width: 20px;
    height: 20px;
}

.main-page__contact-text {
    display: flex;
    flex-direction: column;
    gap: 5px;
    font-size: 16px;
}

.main-page__contact-label {
    color: var(--main-page-gray);
}

.main-page__contact-value {
    width: auto;
    color: var(--main-page-white);
}

.main-page__contact-phone {
    color: inherit;
    text-decoration: none;
    white-space: nowrap;
    transition: color 0.3s ease-in-out;
}

.main-page__contact-phone:hover {
    color: var(--main-page-blue-200);
}

.main-page__contact-value--hours {
    display: flex;
    flex-direction: column;
    gap: 10px;
    color: var(--main-page-blue-400);
}

.main-page__contacts-decor {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.main-page__contacts-glow {
    position: absolute;
    left: auto;
    bottom: auto;
    width: 150px;
    height: 129px;
    transform: rotate(-16.85deg);
}

.main-page__contacts-pin {
    position: absolute;
    left: auto;
    bottom: auto;
    width: 103px;
    height: 148px;
    object-fit: fill; /* как в макете: квадратная картинка вписана в блок целиком, без обрезки */
}

.main-page__contacts-map {
    position: relative;
    width: 100%;
    height: auto;
    flex-shrink: 0;
    border-radius: 15px;
    overflow: hidden;
}

.main-page__contacts-map > img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Яндекс-карта (JS API 3.0, тёмная тема; js/pages/main-page.js, initContactsMap) — поверх картинки-заглушки */

.main-page__contacts-ymap {
    position: absolute;
    inset: 0;
    /* свой слой: внутри у карты элементы с z-index до 1000 — без изоляции они вылезали поверх
       шапки (100) и бургер-меню (1000) */
    isolation: isolate;
}

.main-page .main-page__contacts-ymap img {
    display: inline; /* .main-page img делает картинки блочными — внутри карты Яндекса это ломает значки */
}

/* Пин клуба: остриё — в точке клуба */
.main-page__ymap-pin {
    width: 36px;
    height: 48px;
    transform: translate(-50%, -100%);
    filter: drop-shadow(0 0 10px rgba(0, 161, 230, 0.55));
    cursor: default;
}

.main-page__ymap-pin svg {
    display: block;
}

.main-page__ymap-pin path {
    fill: var(--main-page-blue-200);
    stroke: #fff;
    stroke-width: 2;
}

.main-page__ymap-pin circle {
    fill: #fff;
}

/* ==========================================================================
   Элементы, которые есть только на части брейкпоинтов
   ========================================================================== */

.main-page__map-stage {
    display: block;
}

.main-page__map-line--1440 {
    display: none;
}

.main-page__more,
.main-page__bullets--narrow {
    display: flex;
}

.main-page__only-narrow {
    display: inline;
}

.main-page__map-pin {
    position: absolute;
    width: 40px;
    height: 40px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: none;
    transform: translate(-50%, -50%);
    cursor: pointer;
}

.main-page__map-pin img {
    width: 100%;
    height: 100%;
    transition: transform 0.3s ease-in-out;
}

/* Оборот на 360° при наведении (на тач-экранах — вместе с нажатием); уводим мышь — обратно */

.main-page__map-pin:hover img,
.main-page__map-pin:focus-visible img,
.main-page__map-pin.is-active img {
    transform: rotate(360deg);
}

.main-page__map-pin.is-active {
    z-index: 2;
}

/* Тултип плюсика: название и описание зоны */

.main-page__map-tip {
    --main-page-tip-arrow: 50%;
    position: absolute;
    z-index: 3;
    display: flex;
    flex-direction: column;
    gap: 6px;
    width: max-content;
    max-width: min(260px, calc(100% - 12px));
    padding: 14px 18px;
    border: 1px solid transparent;
    border-radius: 12px;
    background: linear-gradient(#0d1726, #0d1726) padding-box,
                linear-gradient(107deg, rgba(0, 160, 227, 0.7) 1%, rgba(0, 160, 227, 0.15) 100%) border-box;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.45), 0 0 24px rgba(0, 161, 230, 0.18);
    opacity: 0;
    transform: translateY(6px) scale(0.96);
    transform-origin: var(--main-page-tip-arrow) 100%;
    transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
    pointer-events: auto;
}

.main-page__map-tip[hidden] {
    display: none;
}

.main-page__map-tip.is-below {
    transform: translateY(-6px) scale(0.96);
    transform-origin: var(--main-page-tip-arrow) 0;
}

.main-page__map-tip.is-open {
    opacity: 1;
    transform: none;
}

/* стрелка к плюсику */

.main-page__map-tip::after {
    content: '';
    position: absolute;
    top: 100%;
    left: var(--main-page-tip-arrow);
    width: 12px;
    height: 12px;
    margin: -6px 0 0 -6px;
    border-right: 1px solid rgba(0, 160, 227, 0.45);
    border-bottom: 1px solid rgba(0, 160, 227, 0.45);
    background: #0d1726;
    transform: rotate(45deg);
}

.main-page__map-tip.is-below::after {
    top: 0;
    border: 0;
    border-top: 1px solid rgba(0, 160, 227, 0.6);
    border-left: 1px solid rgba(0, 160, 227, 0.6);
}

.main-page__map-tip-title {
    font-size: 16px;
    font-weight: 700;
    line-height: 1.3;
    color: var(--main-page-white);
    text-transform: uppercase;
}

.main-page__map-tip-text {
    font-size: 15px;
    line-height: 1.3;
    color: var(--main-page-gray);
}

.main-page__scroll {
    scrollbar-width: none;
}

.main-page__scroll::-webkit-scrollbar {
    display: none;
}

/* ==========================================================================
   ≤1680 — макет 1440
   ========================================================================== */

/* ==========================================================================
   ≤1320 — макет 1200: пины на карте, монета в оффере, преимущества 2×2
   ========================================================================== */

.main-page__cards .main-page__center-head {
    position: relative;
    z-index: 1;
}

/* ==========================================================================
   ≤1100 — планшет (макет 1024)
   ========================================================================== */

/* ==========================================================================
   ≤896 — макет 768
   ========================================================================== */

/* ==========================================================================
   ≤704 — макет 640
   ========================================================================== */

/* ==========================================================================
   ≤590 — мобила (макет 540)
   ========================================================================== */

/* ==========================================================================
   ≤465 — макет 390
   ========================================================================== */

/* ==========================================================================
   ≤355 — макет 320
   ========================================================================== */

/* В макете 540 у формы «7 дней» и новостей заголовок остаётся 40px Tahoma */

/* ==========================================================================
   Формы: тексты и стили преимуществ по макету каждого брейкпоинта
   ========================================================================== */

.main-page__form-more {
    display: none;
}

/* «Более 50…» — на 1920 в обеих формах, на 1440 только во второй */

/* 1024 и уже: пункты 1–2 — 16px белый, 3–4 — 18px серый */

/* 768: свой кадр фото */

/* 540: во второй форме кнопка «Забронировать» (в первой — полный текст до 390) */

/* 390 и 320: внутренние отступы формы 20px */

/* Планшет: панель формы сразу под преимуществами (не прижимается к низу блока) */

/* 320: подзаголовок формы переносится, как в макете */

/* 390 и 320: во второй форме строки преимуществ через 10px */

/* ==========================================================================
   Плашки-офферы на мобильных — точно по макетам 640 / 540 / 390 / 320
   ========================================================================== */

/* ==========================================================================
   Пины 3D-карты: позиции из макета каждого брейкпоинта (центр кружка в % от холста)
   ========================================================================== */

/* Холст карты = мобильный рендер, вписанный по нижнему краю (object-position: bottom), пины — в % от холста */

/* Описание в hero на 640 и уже — один абзац шириной 497px, как в макете */

/* ==========================================================================
   Вертикальные отступы секций на малых экранах — по макетам
   ========================================================================== */

/* 1920: в макете карта сдвинута на -93px и верхний угол здания срезан (ошибка макета).
   Картинка прозрачная, над холстом свободное место — показываем её целиком */

/* 1440: холст карты как в макете (788px) */

/* 1440 / 1200: высоты карточек зон Академки — как в макете (400 / 376 / 422 / 377) */

/* 1200: карточки направлений 255×372 — без минимальной высоты 460 */

.main-page .main-page__dir-card {
    border-color: transparent;
    background: linear-gradient(var(--main-page-card-dark), var(--main-page-card-dark)) padding-box,
                var(--main-page-stroke-dir) border-box;
}

/* Новости на планшете/мобиле: тег → заголовок 30px */

/* В Figma обводка карточки внутри блока — в CSS вычитаем её из отступов */

.main-page .main-page__zone-card {
    position: sticky;
    top: calc(80px + var(--i, 0) * 10px);
    border-color: transparent;
    background: linear-gradient(var(--main-page-card-dark), var(--main-page-card-dark)) padding-box,
                linear-gradient(104deg, rgba(0, 160, 227, 0.3) 1%, rgba(0, 160, 227, 0) 143%) border-box;
}

/* 320: метка «Как нас найти» — как в макете: правее и ниже, чем на 390, частично за правым краем плашки
   (иначе налезает на «Режим работы» и телефон); выступающая часть обрезается по краю плашки */

/* 540: холст карты 510px — шире полей секции, как в макете */

/* 1024: в «Направлениях» тег → заголовок 30px */

/* Fedra Sans Pro: ровные (lining) цифры, как в макете — иначе «20%» выглядит как «2о%» */

/* Подпись карты и заголовок секции — над свечением браслетов (текст не «голубеет») */

/* 390 / 320: hero — кадр фона по центру, рейтинг → кнопки → преимущества как в макете */

.main-page .main-page__advantages {
    border-color: transparent;
}

/* на мобиле у карточки тренера в макете нет рамки */
.main-page .main-page__trainer {
    border-color: transparent;
    background: linear-gradient(to bottom, #02060e 4.75%, #253448 112.56%);
}

/* ==========================================================================
   Состояния элементов — по UI-kit макета (default / hover / click / disabled)
   ========================================================================== */

/* Primary */

.main-page .main-page__btn:not(.main-page__btn--outline):not(:disabled):hover {
    background: var(--main-page-blue-200);
}

.main-page .main-page__btn:not(.main-page__btn--outline):not(:disabled):active {
    background: var(--main-page-blue-600);
}

/* Secondary (обводка) */

.main-page .main-page__btn--outline:not(:disabled):hover {
    border-color: var(--main-page-blue-200);
    color: var(--main-page-blue-200);
}

.main-page .main-page__btn--outline:not(:disabled):hover .main-page__btn-icon {
    background: var(--main-page-blue-200);
}

.main-page .main-page__btn--outline:not(:disabled):active {
    border-color: var(--main-page-blue-600);
    color: var(--main-page-blue-600);
}

.main-page .main-page__btn--outline:not(:disabled):active .main-page__btn-icon {
    background: var(--main-page-blue-600);
}

/* Disabled: primary — серая заливка, secondary — чёрная с серой обводкой */

.main-page .main-page__btn:disabled {
    border-color: transparent;
    background: var(--main-page-neutral-900);
    color: var(--main-page-neutral-800);
    cursor: default;
}

.main-page .main-page__btn--outline:disabled,
.main-page .main-page__btn--dark:disabled {
    border-color: var(--main-page-neutral-900);
    background: #000;
    color: var(--main-page-neutral-900);
}

.main-page .main-page__btn--outline:disabled .main-page__btn-icon {
    background: var(--main-page-blue-400);
}

.main-page .main-page__btn:focus-visible,
.main-page .main-page__arrow:focus-visible,
.main-page .main-page__form-messenger:focus-visible,
.main-page .main-page__map-pin:focus-visible {
    outline: 2px solid var(--main-page-focus);
    outline-offset: 2px;
}

/* Поля ввода: focus / filled / error / disabled (ошибка сама гаснет через 2.5 с — main-page.js) */

.main-page .main-page__input {
    transition: border-color 0.3s ease-in-out, color 0.3s ease-in-out;
    border-color: transparent;
    background: linear-gradient(var(--main-page-blue-800), var(--main-page-blue-800)) padding-box,
                linear-gradient(99deg, rgba(0, 160, 227, 0.2) 5%, rgba(0, 160, 227, 0) 103%) border-box;
}

.main-page .main-page__check-box {
    transition: border-color 0.3s ease-in-out, color 0.3s ease-in-out;
    background: linear-gradient(#283c59, #283c59) padding-box,
                linear-gradient(139deg, rgba(0, 160, 227, 0.2) 2%, rgba(0, 160, 227, 0) 109%) border-box;
    cursor: pointer;
    border-color: transparent;
}

.main-page .main-page__form-messenger {
    transition: border-color 0.3s ease-in-out, color 0.3s ease-in-out;
}

.main-page .main-page__input:focus {
    border: 2px solid var(--main-page-focus);
    padding: 15px 19px;
}

.main-page .main-page__input:not(:placeholder-shown) {
    color: #f0f3f7;
}

.main-page .main-page__input[aria-invalid="true"],
.main-page .main-page__input.is-error {
    border: 2px solid var(--main-page-error);
    padding: 15px 19px;
    color: var(--main-page-error);
}

.main-page .main-page__input:disabled {
    opacity: 0.5;
    background: #1e2d42;
    color: #78879b;
}

/* Чекбокс: default / hover / checked / checked hover / disabled / error */

.main-page .main-page__check:hover .main-page__check-box {
    border: 2px solid var(--main-page-focus);
}

.main-page .main-page__check-box[aria-checked="true"] {
    background: var(--main-page-blue-400);
}

.main-page .main-page__check:hover .main-page__check-box[aria-checked="true"] {
    border: 2px solid #649bf0;
}

.main-page .main-page__check-box[aria-disabled="true"] {
    opacity: 0.5;
    background: #1e2d42;
    cursor: default;
}

.main-page .main-page__check-box[aria-invalid="true"] {
    border: 2px solid var(--main-page-error);
}

.main-page .main-page__check-box:focus-visible {
    outline: 2px solid var(--main-page-focus);
    outline-offset: 2px;
}

/* ==========================================================================
   Блоки из инфоблоков (этап 2)
   ========================================================================== */

a.main-page__btn,
a.main-page__btn:hover {
    text-decoration: none;
}

a.main-page__btn:not(.main-page__btn--outline) {
    color: var(--main-page-white);
}

a.main-page__btn--outline {
    color: var(--main-page-blue-400);
}

/* Карточка направления — ссылка; фото из инфоблока занимает верхние ~3/4 */

a.main-page__dir-card {
    color: inherit;
    text-decoration: none;
}

.main-page__dir-card-bg .main-page__dir-card-img {
    top: 0;
    left: 0;
    width: 100%;
    height: 75%;
    object-fit: cover;
}

@media (hover: hover) {
    a.main-page__dir-card:hover .main-page__dir-card-title {
        color: var(--main-page-blue-200);
    }
}

/* Карточка новости — ссылка */

a.main-page__news-card {
    color: inherit;
    text-decoration: none;
    transition: transform 0.3s ease-in-out;
}

@media (hover: hover) {
    a.main-page__news-card:hover .main-page__news-card-title {
        color: var(--main-page-blue-200);
    }
}

/* ==========================================================================
   Клубные карты: слайдер браслетов (js MainPageCards)
   Три места: слева / в центре / справа; остальные браслеты спрятаны за боковыми.
   Размеры мест — по макету на каждой ширине.
   ========================================================================== */

.main-page__cards-item {
    position: absolute;
    z-index: 1;
    top: calc((var(--main-page-cm-h) - var(--main-page-cs-h)) / 2);
    left: 0;
    width: var(--main-page-cs-w);
    height: var(--main-page-cs-h);
    opacity: 0;
    visibility: hidden;
    transform: scale(0.6);
    transition: left var(--main-page-cards-speed) var(--main-page-cards-ease),
                top var(--main-page-cards-speed) var(--main-page-cards-ease),
                width var(--main-page-cards-speed) var(--main-page-cards-ease),
                height var(--main-page-cards-speed) var(--main-page-cards-ease),
                transform var(--main-page-cards-speed) var(--main-page-cards-ease),
                opacity var(--main-page-cards-speed) var(--main-page-cards-ease),
                visibility var(--main-page-cards-speed);
}

.main-page__cards-item > img:not(.main-page__cards-glow) {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    pointer-events: none;
    -webkit-user-drag: none;
    transition: transform 0.3s ease-in-out;
}

.main-page__cards-item.is-prev {
    opacity: 1;
    visibility: visible;
    transform: none;
    cursor: pointer;
    z-index: 3;
}

.main-page__cards-item.is-next {
    opacity: 1;
    visibility: visible;
    transform: none;
    left: calc(var(--main-page-cs-w) + 2 * var(--main-page-c-gap) + var(--main-page-cm-w));
    cursor: pointer;
    z-index: 3;
}

.main-page__cards-item.is-active {
    opacity: 1;
    visibility: visible;
    transform: none;
    z-index: 2;
    top: 0;
    left: calc(var(--main-page-cs-w) + var(--main-page-c-gap));
    width: var(--main-page-cm-w);
    height: var(--main-page-cm-h);
}

.main-page__cards-item.is-after {
    left: calc(var(--main-page-cs-w) + 2 * var(--main-page-c-gap) + var(--main-page-cm-w));
}

/* Боковой браслет — тоже переключатель */

@media (hover: hover) {
    .main-page__cards-item.is-prev:hover > img:not(.main-page__cards-glow),
    .main-page__cards-item.is-next:hover > img:not(.main-page__cards-glow) {
        transform: scale(1.06);
    }
}

/* Свечение за браслетом — в % от его размера: вырастает и гаснет вместе с ним.
   Боковые браслеты выше свечения активного, как в макете. */

.main-page__cards-glow {
    position: absolute;
    z-index: -1;
    top: calc(var(--main-page-glow-y) - var(--main-page-glow-h) * 70 / 462);
    left: calc(var(--main-page-glow-x) - var(--main-page-glow-w) * 70 / 918);
    width: calc(var(--main-page-glow-w) * 1058 / 918);
    height: calc(var(--main-page-glow-h) * 602 / 462);
    max-width: none;
    opacity: 0;
    pointer-events: none;
    transition: opacity var(--main-page-cards-speed) var(--main-page-cards-ease);
}

.main-page__cards-item.is-active .main-page__cards-glow {
    opacity: 1;
}

.main-page__cards-text:not([hidden]) {
    animation: main-page__cards-text-in 0.5s cubic-bezier(0.45, 0, 0.2, 1);
}

.main-page__cards-text[hidden] {
    display: none;
}

a.main-page__cards-btn {
    display: inline-flex;
}

/* Буллиты сжимаются, если их больше, чем помещается (число = количеству элементов из инфоблока) */

/* ==========================================================================
   Слайдер карточек (js/pages/main-page.js)
   ========================================================================== */

/* Прокрутку и доводку до карточки ведёт js (инерция с плавным торможением), поэтому без scroll-snap;
   горизонтальный свайп пальцем тоже обрабатывает js (touch-action), вертикальный — прокручивает страницу */
[data-main-page-track] {
    overflow-x: auto;
    overscroll-behavior-x: contain;
    touch-action: pan-y;
    -webkit-user-select: none;
    user-select: none;
    scrollbar-width: none;
    margin-top: -12px;
    padding-top: 12px;
}

[data-main-page-track]::-webkit-scrollbar {
    display: none;
}

[data-main-page-track] > * {
    -webkit-user-drag: none;
    -webkit-touch-callout: none;
}

[data-main-page-track].is-dragging {
    cursor: grabbing;
}

[data-main-page-track].is-dragging > * {
    pointer-events: none;
}

/* ПК: на странице 4 карточки, остальные — за правым краем ленты */

.main-page .main-page__news-list > .main-page__news-card {
    flex: 0 0 100%;
}

/* Планшет/мобила: новости — по одной карточке на всю ширину, листаются */

/* Hover карточки направления: всплывает, рамка ярче, заголовок голубой */

a.main-page__dir-card:focus-visible {
    border-color: rgba(0, 160, 227, 0.7);
    box-shadow: 0 10px 30px rgba(0, 161, 230, 0.18);
    transform: translateY(-10px);
}

@media (hover: hover) {
    a.main-page__dir-card:hover {
        border-color: rgba(0, 160, 227, 0.7);
        box-shadow: 0 10px 30px rgba(0, 161, 230, 0.18);
        transform: translateY(-10px);
    }
}

/* Ленты слайдеров: поля под «всплытие» и свечение карточки, чтобы их не обрезал край прокрутки.
   Сбоку — не больше промежутка между карточками (20px), иначе выглядывала бы следующая. */

.main-page [data-main-page-track] {
    --main-page-room: 20px;
    --main-page-room-r: var(--main-page-room); /* поле справа — не входит в видимую ширину (js) */
    margin: -40px calc(-1 * var(--main-page-room));
    padding: 40px var(--main-page-room);
    pointer-events: none;
}

.main-page [data-main-page-track] > * {
    pointer-events: auto;
}

/* Hover карточки тренера — как у направлений: всплывает, рамка ярче, свечение */

@media (hover: hover) {
    .main-page .main-page__trainer:hover .main-page__trainer-name {
        color: var(--main-page-blue-200);
    }
}

@media (hover: hover) {
    .main-page .main-page__trainer:hover {
        border-color: rgba(0, 160, 227, 0.7);
        box-shadow: 0 10px 30px rgba(0, 161, 230, 0.18);
        transform: translateY(-10px);
    }
}

/* Hover новости: карточка с подписью всплывает, заголовок голубой (дата — нет), рамка фото ярче со свечением */

a.main-page__news-card:focus-visible {
    transform: translateY(-10px);
}

@media (hover: hover) {
    a.main-page__news-card:hover {
        transform: translateY(-10px);
    }
}

.main-page a.main-page__news-card:focus-visible .main-page__news-card-photo {
    border-color: rgba(0, 160, 227, 0.7);
    box-shadow: 0 10px 30px rgba(0, 161, 230, 0.18);
}

@media (hover: hover) {
    .main-page a.main-page__news-card:hover .main-page__news-card-photo {
        border-color: rgba(0, 160, 227, 0.7);
        box-shadow: 0 10px 30px rgba(0, 161, 230, 0.18);
    }
}

/* Последняя карточка тренеров — «Все тренеры» (макет: trainers_slider_last_card) */

a.main-page__trainer--all {
    display: block;
    color: inherit;
    text-decoration: none;
}

.main-page .main-page__trainer--all {
    background: linear-gradient(146.85deg, #162130 30.32%, #456796 104.22%) padding-box,
                linear-gradient(128deg, rgba(0, 160, 227, 0) 9%, rgba(0, 160, 227, 0.3) 109%) border-box;
}

/* Кубок — по центру между верхом карточки и кнопкой (карточка выше, чем в макете 315×400) */

.main-page__trainer-all-art {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 65px; /* кнопка 45px + отступ 20px */
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
}

.main-page__trainer-all-pic {
    position: relative;
    flex-shrink: 0;
    width: 101.3%;
    aspect-ratio: 1;
}

.main-page__trainer-all-glow {
    position: absolute;
    top: 31%;
    left: 64%;
    width: 37.5%;
    height: 50%;
    border-radius: 50%;
    background: #00a0e3;
    filter: blur(50px);
    transform: translate(-50%, -50%) rotate(18.16deg);
    pointer-events: none;
}

.main-page__trainer-all-img {
    position: relative;
    width: 100%;
    max-width: none;
    height: auto;
    pointer-events: none;
}

/* Последняя карточка ленты — «Все направления» (макет: lesson_slider_last_card) */

.main-page__dir-card-all-glow {
    position: absolute;
    top: 57%;
    left: 35%;
    width: 48%;
    height: 37%;
    border-radius: 50%;
    background: #00a0e3;
    filter: blur(50px);
    transform: translate(-50%, -50%) rotate(-2.56deg);
    pointer-events: none;
}

.main-page__dir-card-all-img {
    position: absolute;
    top: 2.2%;
    left: -6%;
    width: 112%;
    max-width: none;
    height: auto;
    pointer-events: none;
}

.main-page .main-page__all-btn {
    position: absolute;
    right: 20px;
    bottom: 20px;
    left: 20px;
    padding-right: 50px;
    padding-left: 14px;
    font-size: 14px;
}

@media (hover: hover) {
    a:hover > .main-page__all-btn {
        background: var(--main-page-blue-200);
    }
}

a:active > .main-page__all-btn {
    background: var(--main-page-blue-600);
}

/* 1200: карточки узкие (255px) — кнопка компактнее, кружок со стрелкой по центру по высоте */

/* Буллиты: все серые, активный — голубой (без анимации заполнения; автолистание — таймер в JS) */

.main-page__slider-ready .main-page__bullets-item {
    padding: 0;
    border: 0;
    cursor: pointer;
    overflow: hidden;
}

.main-page__slider-ready .main-page__bullets-item.is-active::after {
    right: auto;
    width: 100%;
}

.main-page__slider-single .main-page__bullets,
.main-page__slider-single .main-page__arrows,
.main-page__slider-static .main-page__bullets,
.main-page__slider-static .main-page__arrows,
.main-page__slider-compact .main-page__bullets {
    display: none;
}

/* ==========================================================================
   Пространство Escalada: при скролле карточки зон собираются в стопку.
   ПК: левая колонка и карточки «прилипают» под шапкой, каждая следующая на 40px ниже предыдущей.
   Планшет/мобила: заголовок уезжает, карточки прилипают со сдвигом 10px.
   ========================================================================== */

.main-page .main-page__zones-info {
    top: max(var(--main-page-header), 100px);
}

/* Якоря «Получить» → формы тест-драйва: форма встаёт под фиксированной шапкой (60px) */

.main-page__form {
    scroll-margin-top: 80px;
}

/* ==========================================================================
   Формы тест-драйва: способ связи, ошибки, отправка, успех; окно капчи
   ========================================================================== */

.main-page__form-fields {
    display: contents;
}

.main-page__form-fields[hidden],
.main-page__form-success[hidden] {
    display: none;
}

.main-page__form-label-value {
    color: var(--main-page-blue-400);
}

/* Способ связи: hover — светлее рамка; выбранный — заливка UI-kit и белая иконка */

.main-page__form-messenger:hover {
    border-color: var(--main-page-blue-200);
    background: rgba(0, 177, 253, 0.12);
}

.main-page__form-messenger[aria-checked="true"] {
    border-color: var(--main-page-blue-400);
    background: var(--main-page-blue-400);
    box-shadow: 0 0 0 3px rgba(0, 177, 253, 0.25);
    transform: scale(1.08);
}

.main-page__form-messenger[aria-checked="true"] img {
    filter: brightness(0) invert(1);
}

.main-page__form-messengers.is-error .main-page__form-messenger {
    border-color: var(--main-page-error);
}

/* Ошибки: класс input--error ставит и js/forms.js шаблона (blur телефона) */

.main-page .main-page__input.input--error {
    border: 2px solid var(--main-page-error);
    padding: 15px 19px;
}

.main-page__form-error {
    margin: 0;
    font-size: 16px;
    color: var(--main-page-error);
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
}

.main-page__check-text a {
    color: inherit;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.main-page__check-text a:hover {
    color: var(--main-page-blue-400);
}

.main-page__form.is-sending .main-page__form-submit,
.main-page__form-panel.is-sending .main-page__form-submit {
    opacity: 0.7;
    cursor: progress;
}

/* Сообщение об успешной отправке — появляется на месте полей */

.main-page__form-success {
    display: flex;
    flex: 1;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 16px;
    padding: 10px 0;
    text-align: center;
    animation: main-page__success-in 0.45s ease both;
}

.main-page__form-success-icon svg {
    display: block;
    fill: none;
    stroke: var(--main-page-blue-400);
    stroke-width: 3;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.main-page__form-success-icon circle {
    stroke-dasharray: 183;
    stroke-dashoffset: 183;
    animation: main-page__draw 0.6s 0.15s ease-out forwards;
}

.main-page__form-success-icon path {
    stroke: var(--main-page-white);
    stroke-dasharray: 40;
    stroke-dashoffset: 40;
    animation: main-page__draw 0.35s 0.7s ease-out forwards;
}

.main-page__form-success-icon {
    filter: drop-shadow(0 0 12px rgba(0, 177, 253, 0.55));
}

.main-page__form-success-title {
    font-family: var(--main-page-font-title);
    font-size: 28px;
    font-weight: 700;
    line-height: 1.2;
    color: var(--main-page-white);
    text-transform: uppercase;
    animation: main-page__success-in 0.4s 0.5s ease both;
}

.main-page__form-success-text {
    max-width: 300px;
    font-size: 18px;
    color: var(--main-page-gray);
    animation: main-page__success-in 0.4s 0.6s ease both;
}

.main-page__form-success-btn {
    margin-top: 8px;
    animation: main-page__success-in 0.4s 0.7s ease both;
}

/* Окно капчи */

.main-page__modal-open,
.main-page__modal-open body {
    overflow: hidden;
}

.main-page__modal {
    position: fixed;
    inset: 0;
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    font-family: Tahoma, Verdana, 'Segoe UI', sans-serif;
}

.main-page__modal[hidden] {
    display: none;
}

.main-page__modal-overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 10, 14, 0.8);
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
}

.main-page__modal-dialog {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
    width: 100%;
    max-width: 420px;
    padding: 40px 30px 30px;
    border: 2px solid rgba(0, 160, 227, 0.35);
    border-radius: 20px;
    background: radial-gradient(ellipse at 50% 0%, #2d4463 0%, #162130 70%);
    color: #edf7fb;
    text-align: center;
    opacity: 0;
    transform: translateY(20px) scale(0.97);
    transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
}

.main-page__modal.is-open .main-page__modal-overlay,
.main-page__modal.is-open .main-page__modal-dialog {
    opacity: 1;
    transform: none;
}

.main-page__modal-close {
    position: absolute;
    top: 10px;
    right: 14px;
    width: 36px;
    height: 36px;
    padding: 0;
    border: 0;
    background: none;
    color: #94dbfa;
    font-size: 30px;
    line-height: 1;
    cursor: pointer;
}

.main-page__modal-close:hover {
    color: #fff;
}

.main-page__modal-title {
    font-family: 'Fedra Sans Pro', Tahoma, sans-serif;
    font-size: 24px;
    font-weight: 700;
    line-height: 1.3;
    text-transform: uppercase;
}

.main-page__modal-text {
    font-size: 16px;
    color: #d1d1d1;
}

.main-page__modal-captcha {
    width: 100%;
    min-height: 102px;
    margin-top: 6px;
}

.main-page__modal-status {
    min-height: 1.3em;
    margin: 0;
    font-size: 15px;
    color: #94dbfa;
}

.main-page__modal-status.is-error {
    color: #e04d4d;
}

/* Текст ошибки формы — только для скринридеров (визуально поле подсвечивается и «вздрагивает») */

/* «Вибрация» незаполненных полей */

.main-page__shake {
    animation: main-page__shake 0.45s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;
}

/* ==========================================================================
   Обводки как в макете: градиентный stroke Figma — #00a0e3, с одной стороны
   чёткий, к противоположной затухает (углы и точки — из gradientTransform макета 1920).
   Кольцо ::before с маской — у элементов с прозрачным/полупрозрачным фоном;
   у карточек с overflow: hidden (кольцо обрезалось бы) — слой фона border-box под заливкой.
   ========================================================================== */

.main-page .main-page__tag,
.main-page .main-page__offer-card,
.main-page .main-page__form-panel {
    border-color: transparent;
}

.main-page__tag::before,
.main-page__advantages::before,
.main-page__offer-card::before {
    content: '';
    position: absolute;
    inset: calc(-1 * var(--main-page-sw));
    padding: var(--main-page-sw);
    border-radius: inherit;
    background: var(--main-page-stroke);
    -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    -webkit-mask-composite: xor;
    mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    mask-composite: exclude;
    pointer-events: none;
}

/* здесь у панели формы в макете нет рамки */
.main-page__form-panel::before {
    content: none;
    position: absolute;
    inset: calc(-1 * var(--main-page-sw));
    padding: var(--main-page-sw);
    border-radius: inherit;
    background: var(--main-page-stroke);
    -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    -webkit-mask-composite: xor;
    mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    mask-composite: exclude;
    pointer-events: none;
}

.main-page .main-page__dir-card--all {
    background: linear-gradient(142.5deg, #162130 30.32%, #456796 104.22%) padding-box,
                var(--main-page-stroke-dir) border-box;
}

.main-page .main-page__news-card-photo {
    border-color: transparent;
    background: linear-gradient(var(--main-page-card-dark), var(--main-page-card-dark)) padding-box,
                linear-gradient(107deg, rgba(0, 160, 227, 0.3) 1%, rgba(0, 160, 227, 0) 139%) border-box;
}

.main-page .main-page__form-box {
    border-color: transparent;
    background: radial-gradient(ellipse 1512px 330px at 56.4% 43%, #456796 0%, #2d4463 50%, #22334a 75%, #162130 100%) padding-box,
                linear-gradient(109deg, rgba(0, 160, 227, 0) 4%, rgba(0, 160, 227, 0.4) 103.5%) border-box;
}

/* ==========================================================================
   Модальная форма заявки (макет: Дизайн / «modal form», «*-modal»)
   Размеры окна по макетам: 860 (1920–1024) / 648 (768) / 560 (640) / 460 (540) / 337 (390) / во всю ширину (320).
   ========================================================================== */

.main-page__mform {
    position: fixed;
    inset: 0;
    z-index: 9990; /* окно капчи (.main-page__modal, 10000) — поверх */
    display: flex;
    padding: 20px 0;
    overflow-y: auto;
    overscroll-behavior: contain;
}

.main-page__mform[hidden] {
    display: none;
}

.main-page__mform-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 10, 14, 0.5);
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
}

.main-page__mform-dialog {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 30px;
    width: 100%;
    max-width: 100%;
    margin: auto;
    padding: 59px 20px;
    border: 2px solid transparent;
    border-radius: 20px;
    background: linear-gradient(#080e19, #080e19) padding-box,
                linear-gradient(107deg, rgba(0, 160, 227, 0.3) 1%, rgba(0, 160, 227, 0) 139%) border-box;
    overflow: hidden;
    opacity: 0;
    transform: translateY(24px) scale(0.97);
    transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
}

.main-page__mform.is-open .main-page__mform-overlay,
.main-page__mform.is-open .main-page__mform-dialog {
    opacity: 1;
    transform: none;
}

/* Свечение (в макете — пятна #00a0e3 с размытием 100) и гантель справа внизу */

.main-page__mform-glow {
    position: absolute;
    top: -202px;
    left: -202px;
    width: 1200px;
    height: 958px;
    max-width: none;
    pointer-events: none;
}

.main-page__mform-pic {
    position: absolute;
    top: 275px;
    left: 338px;
    width: 366px;
    height: 255px;
    max-width: none;
    pointer-events: none;
}

.main-page__mform-close {
    position: absolute;
    top: 20px;
    right: 20px;
    z-index: 2;
    display: flex;
    width: 20px;
    height: 20px;
    padding: 0;
    border: 0;
    background: none;
    color: var(--main-page-white);
    cursor: pointer;
}

.main-page__mform-close svg {
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
}

.main-page__mform-close:hover {
    color: var(--main-page-blue-200);
}

.main-page__mform-head {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 30px;
    text-align: center;
}

.main-page__mform-head .main-page__tag {
    align-self: center;
    white-space: nowrap;
}

.main-page__mform-title {
    max-width: none;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.3;
    color: var(--main-page-white);
    text-transform: uppercase;
}

/* Форма в окне: без своей рамки и фона (у страничной формы они есть) */

.main-page .main-page__mform-form {
    width: 100%;
    max-width: 100%;
    padding: 0;
    border: 0;
    background: none;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
}

.main-page__mform-form::before {
    content: none;
}

.main-page .main-page__mform .main-page__input {
    font-size: 18px;
    background: linear-gradient(#283c59, #283c59) padding-box,
                linear-gradient(99deg, rgba(0, 160, 227, 0.2) 5%, rgba(0, 160, 227, 0) 103%) border-box;
}

.main-page .main-page__mform .main-page__input::placeholder {
    color: #b7c1cf;
}

.main-page .main-page__mform .main-page__form-label {
    font-size: 18px;
    color: var(--main-page-blue-50);
}

.main-page .main-page__mform .main-page__check-text {
    font-size: 16px;
    color: var(--main-page-blue-50);
}

.main-page .main-page__mform .main-page__form-submit {
    width: 100%;
}

.main-page__mform-dialog:focus {
    outline: none;
}

/* Макет 1024: кнопка отправки в окне — как на ПК (на странице с ≤1100 кнопки в «малом» стиле) */

/* ==========================================================================
   Правки только для узких экранов: у этих свойств на более широких экранах значения нет вовсе
   (там действует более общее правило), поэтому они заданы диапазоном max-width.
   ========================================================================== */

@media (max-width: 1680px) {
    .main-page__advantages {
        column-gap: 0;
    }

    .main-page__map-label-text {
        font-size: 18px;
    }

    .main-page__advantages-item--desktop {
        display: none;
    }

    .main-page__directions .main-page__block-head-row {
        align-items: flex-end;
        gap: 20px;
    }

    .main-page__directions .main-page__block-head-title {
        flex: 1;
        max-width: none;
    }

    .main-page__news .main-page__block-head {
        gap: 20px;
    }
}

@media (max-width: 1320px) {
    .main-page__hero-btn {
        padding-left: 30px;
    }

    .main-page__hero-btn--video {
        padding-left: 60px;
    }

    .main-page__offer-card {
        padding-left: 220px;
    }

    .main-page__map-canvas {
        max-width: 100%;
    }

    .main-page__map-image,
    .main-page__map-line,
    .main-page__map-label {
        display: none !important;
    }

    .main-page__map-stage {
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        aspect-ratio: 1;
    }

    .main-page__advantages .main-page__divider {
        display: none;
    }

    .main-page__map .main-page__center-head {
        max-width: 420px;
        gap: 20px;
    }

    .main-page__map-stage-image {
        width: 100%;
        height: 100%;
    }

    .main-page__cards .main-page__arrow {
        width: 66px;
    }

    .main-page .main-page__map-stage {
        inset: 0;
        aspect-ratio: auto;
    }

    .main-page .main-page__map-stage-image {
        object-fit: cover;
        object-position: center bottom;
    }
}

@media (max-width: 1100px) {
    .main-page__btn {
        gap: 12px;
        min-height: 45px;
    }

    .main-page__btn-icon {
        flex-shrink: 0;
    }

    .main-page__btn--outline {
        padding: 15px 60px 15px 30px;
    }

    .main-page__btn--outline .main-page__btn-icon {
        position: absolute;
        top: 7px;
        right: 8px;
        bottom: 6px;
        height: auto;
    }

    .main-page__btn--muted {
        padding: 15px 60px 15px 30px;
    }

    .main-page__btn--dark {
        padding: 15px 30px;
    }

    .main-page__hero-text {
        position: relative;
        max-width: 627px;
    }

    .main-page__hero-buttons {
        position: relative;
        order: 3;
        width: 100%;
    }

    .main-page__rating {
        order: 2;
        align-self: flex-end;
        margin-top: auto;
    }

    .main-page__advantages {
        order: 4;
    }

    .main-page__offer {
        padding-top: 0;
    }

    .main-page__zones .main-page__offer {
        padding: 0;
    }

    /* Формы: одна колонка, панель под преимуществами */
    .main-page__form-box {
        flex-direction: column;
    }

    .main-page__form-person {
        bottom: auto;
        right: -34px;
        aspect-ratio: 450 / 628;
    }

    .main-page__form-head {
        width: 100%;
        max-width: 400px;   /* заголовок формы не шире 400px (Паша) */
    }

    .main-page__form-benefits {
        flex-direction: row;
        width: auto;
        max-width: 430px;
    }

    .main-page__form--large .main-page__form-benefit:not(:last-child) {
        width: 205px;
        color: var(--main-page-white);
    }

    .main-page__form-panel {
        max-width: 100%;
    }

    .main-page__zones-wrap {
        flex-direction: column;
    }

    .main-page__zones-info,
    .main-page__zones-list {
        flex: none;
    }

    /* Контакты: колонка, карта под текстом */
    .main-page__contacts-box {
        flex-direction: column;
        gap: 40px;
    }

    .main-page__contacts-map > img {
        object-position: center;
    }

    .main-page__more,
    .main-page__bullets--narrow {
        justify-content: center;
    }

    .main-page__scroll {
        margin-right: calc(-1 * var(--main-page-pad));
        padding-right: var(--main-page-pad);
        overflow-x: auto;
    }

    .main-page__form-benefit:last-child {
        width: 205px;
        font-size: 16px;
        color: var(--main-page-white);
    }

    .main-page__cards .main-page__center-head {
        max-width: none;
    }

    .main-page__btn-text {
        flex: 1;
        text-align: center;
    }

    .main-page__btn--muted .main-page__btn-icon {
        position: absolute;
        top: 7px;
        right: 8px;
        bottom: 6px;
        height: auto;
    }

    .main-page__bullets--wide {
        display: none;
    }

    .main-page__offer--top .main-page__offer-pic {
        overflow: visible;
    }

    /* Оффер «Скидка» — колонка по центру, монета справа снизу */
    .main-page__offer--zones .main-page__offer-card {
        flex-direction: column;
        align-items: center;
        gap: 20px;
        padding: 40px 40px 135px;
        background: linear-gradient(90.46deg, #162130 0.17%, #456796 175.69%);
    }

    .main-page__offer--zones .main-page__divider {
        display: none;
    }

    .main-page__offer--zones .main-page__offer-label {
        align-items: center;
    }

    .main-page__offer--zones .main-page__offer-sub {
        font-size: 16px;
    }

    .main-page__offer--zones .main-page__btn {
        width: 452px;
        max-width: 100%;
    }

    .main-page__offer--zones .main-page__offer-pic {
        left: auto;
    }

    .main-page__directions .main-page__more .main-page__btn {
        width: auto;
    }

    .main-page__news .main-page__more {
        margin-top: -10px;
    }

    .main-page__form .main-page__form-benefits .main-page__form-benefit:nth-child(n+3) {
        font-size: 18px;
        color: var(--main-page-gray);
    }

    .main-page .main-page__news .main-page__block-head {
        gap: 30px;
    }

    .main-page .main-page__news-list > .main-page__news-card {
        display: flex;
    }

    /* справа лента направлений и тренеров и так уходит до края экрана */
    .main-page .main-page__scroll[data-main-page-track] {
        --main-page-room-r: 0px;
        margin-right: calc(-1 * var(--main-page-pad));
        padding-right: var(--main-page-pad);
    }

    /* иконка в потоке (как у всех кнопок на этих ширинах), текст по центру оставшегося места */
    .main-page .main-page__all-btn {
        padding: 7px 10px 6px 20px;
    }
}

@media (max-width: 896px) {
    .main-page__hero-main {
        padding-bottom: 0;
    }

    .main-page__hero-btn--video {
        flex-basis: 340px;
    }

    .main-page__offer-card {
        flex-direction: column;
    }

    .main-page__form--man .main-page__form-person img {
        left: -22%;
        width: 157.56%;
        height: 169.35%;
    }

    .main-page__form--woman .main-page__form-person img {
        left: -16.63%;
        width: 133.3%;
        height: 143.28%;
    }

    .main-page__cards-lines {
        letter-spacing: -0.15px;
    }

    .main-page__map-btn,
    .main-page__trainers .main-page__more .main-page__btn,
    .main-page__news .main-page__more .main-page__btn {
        max-width: 100%;
    }

    .main-page__offer .main-page__divider {
        display: none;
    }

    .main-page__offer .main-page__btn {
        max-width: 100%;
    }

    .main-page__offer--top .main-page__offer-pic img {
        left: -6.57%;
    }

    /* 768 / 640: в «Направлениях» все отступы 20px */
    .main-page .main-page__directions {
        gap: 20px;
    }
}

@media (max-width: 704px) {
    .main-page__hero-bg img {
        object-position: 78% center;
    }

    .main-page__hero-buttons {
        flex-direction: column;
    }

    .main-page__hero-btn,
    .main-page__hero-btn--video {
        flex: none;
    }

    .main-page__offer-label {
        flex-direction: column;
    }

    .main-page__form-box {
        gap: 20px;
        min-height: 0;
    }

    .main-page__form-logo {
        bottom: auto;
        right: -220px;
    }

    /* Формы: человек скрыт, логотип-фон справа сверху */
    .main-page__form-person {
        display: none;
    }

    .main-page__cards-sub {
        max-width: 328px;
    }

    .main-page__offer--zones .main-page__offer-label {
        flex-direction: column;
    }

    .main-page__form--woman .main-page__form-box {
        min-height: 0;
        gap: 20px;
    }

    .main-page__hero-title .main-page__accent {
        display: block;
    }

    .main-page__zone-card-btn {
        border-color: var(--main-page-blue);
        background: transparent;
        color: var(--main-page-blue);
    }

    /* 640 */
    .main-page .main-page__offer {
        height: auto;
        overflow: visible;
    }

    .main-page .main-page__zones .main-page__offer--zones {
        margin: 0;
    }

    .main-page .main-page__offer .main-page__offer-card {
        flex-direction: column;
        align-items: center;
        justify-content: flex-start;
    }

    .main-page .main-page__offer .main-page__divider {
        display: none;
    }

    .main-page .main-page__offer .main-page__offer-text,
    .main-page .main-page__offer .main-page__offer-action {
        gap: 0;
    }

    .main-page .main-page__offer .main-page__offer-label {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    .main-page .main-page__offer .main-page__offer-sub {
        font-size: 16px;
    }

    .main-page .main-page__offer--top .main-page__offer-title {
        font-size: 40px;
    }

    .main-page .main-page__offer--top .main-page__btn {
        max-width: 100%;
    }

    .main-page .main-page__offer--top .main-page__offer-pic {
        right: auto;
    }

    /* 320: у гантели свой кадр */
    .main-page .main-page__offer--top .main-page__offer-pic img {
        left: -6.57%;
    }

    /* «Скидка до 20%» на 640 в макете — тот же блок, что и на 540 */
    .main-page .main-page__offer--zones .main-page__offer-card {
        height: auto;
        padding: 40px 40px 80px;
        background: linear-gradient(90.33deg, #162130 0.17%, #456796 175.69%);
    }

    .main-page .main-page__offer--zones .main-page__offer-title {
        font-family: var(--main-page-font-title);
        font-size: 40px;
    }

    .main-page .main-page__offer--zones .main-page__btn {
        width: 324px;
        max-width: 100%;
    }

    .main-page .main-page__offer--zones .main-page__offer-pic {
        left: auto;
        transform: none;
    }

    .main-page .main-page__offer--zones .main-page__offer-pic img {
        left: 0.01%;
        width: 100%;
    }

    .main-page .main-page__hero-descr {
        max-width: 497px;
    }

    .main-page .main-page__hero-descr p {
        display: inline;
    }

    .main-page .main-page__hero-descr p + p::before {
        content: ' ';
    }

    .main-page .main-page__cards .main-page__cards-btn,
    .main-page .main-page__cards .main-page__bullets {
        max-width: calc(100% - 2 * var(--main-page-pad));
    }
}

@media (max-width: 590px) {
    .main-page__advantages-text {
        min-width: 0;
    }

    .main-page__offer-title {
        font-family: var(--main-page-font-title);
    }

    .main-page__zone-card {
        gap: 20px;
    }

    .main-page__zone-card-text {
        max-width: 320px;
    }

    .main-page__cards-text {
        max-width: 160px;
    }

    .main-page__contacts-info {
        max-width: 467px;
    }

    .main-page__contact-value {
        max-width: 305px;
    }

    .main-page__directions {
        gap: 20px;
    }

    /* Зоны: картинка сверху карточки */
    .main-page__zones-all {
        width: 327px;
        max-width: 100%;
        background: var(--main-page-blue);
        color: var(--main-page-white);
    }

    .main-page__cards .main-page__center-head {
        gap: 20px;
    }

    .main-page__map .main-page__h2 {
        max-width: 280px;
    }

    .main-page__contacts .main-page__accent {
        display: block;
    }

    .main-page__trainers,
    .main-page__news {
        gap: 30px;
    }

    .main-page__form--woman .main-page__only-wide {
        display: none;
    }

    .main-page__form--woman .main-page__only-narrow {
        display: inline;
    }

    .main-page .main-page__offer--top .main-page__offer-card {
        height: auto;
        padding: 40px 40px 80px;
        background: linear-gradient(90.33deg, #162130 0.17%, #456796 175.69%);
    }

    .main-page .main-page__offer--top .main-page__offer-title {
        font-family: var(--main-page-font-title);
    }

    .main-page .main-page__offer--top .main-page__btn {
        width: 324px;
    }

    .main-page .main-page__zone-card {
        padding: 199px 19px 19px;
    }
}

@media (max-width: 465px) {
    .main-page {
        --main-page-card-w: 260px;
    }

    .main-page__hero-buttons {
        margin-top: 20px;
    }

    .main-page__rating-top {
        gap: 10px;
    }

    .main-page__rating-caption {
        line-height: 1.1;
        letter-spacing: -0.1px;
    }

    .main-page__rating-reviews {
        letter-spacing: -0.13px;
    }

    .main-page__advantages {
        grid-template-columns: 1fr;
    }

    /* Офферы */
    .main-page__offer {
        padding-bottom: 86px;
    }

    .main-page__offer-card {
        gap: 20px;
    }

    .main-page__offer-label {
        text-align: center;
    }

    .main-page__contacts-glow {
        top: 260px;
        right: -20px;
    }

    .main-page__contacts-pin {
        top: 287px;
        right: 13px;
    }

    .main-page__contacts-map {
        aspect-ratio: 310 / 180;
    }

    .main-page__map-btn {
        width: 100%;
    }

    .main-page__hero-descr p {
        display: inline;
    }

    .main-page__hero-descr p + p::before {
        content: ' ';
    }

    .main-page__offer--top .main-page__offer-pic {
        left: -11px;
        bottom: -86px;
        width: 224px;
        height: 155px;
        top: auto;
        transform: none;
    }

    .main-page__offer--zones .main-page__offer-card {
        padding-top: 20px;
    }

    .main-page__offer--zones .main-page__offer-pic {
        top: auto;
        right: -35px;
        bottom: -83px;
        width: 224px;
        height: 162px;
    }

    .main-page__trainers .main-page__more .main-page__btn,
    .main-page__news .main-page__more .main-page__btn,
    .main-page__offer .main-page__btn {
        width: 100%;
    }

    .main-page__only-wide {
        display: none;
    }

    .main-page__rating-top img {
        width: 61px;
        height: 18px;
    }

    .main-page__form--man .main-page__form-benefits {
        gap: 20px;
    }

    .main-page__form--woman .main-page__form-benefits {
        gap: 10px 20px;
    }

    /* 390 */
    .main-page .main-page__hero .main-page__offer--top {
        padding: 0 var(--main-page-pad);
    }

    .main-page .main-page__zones .main-page__offer--zones {
        padding: 0;
    }

    .main-page .main-page__offer .main-page__offer-card {
        gap: 20px;
        background: linear-gradient(90.26deg, #162130 0.17%, #456796 175.69%);
        height: 260px;
        padding: 40px 20px 135px;
    }

    .main-page .main-page__offer .main-page__offer-text,
    .main-page .main-page__offer .main-page__offer-action {
        width: 100%;
    }

    .main-page .main-page__offer .main-page__offer-label {
        gap: 10px;
        white-space: normal;
        width: 100%;
    }

    .main-page .main-page__offer--top .main-page__offer-pic {
        top: auto;
        bottom: -86px;
        left: -11px;
        width: 224px;
        height: 155px;
        transform: none;
    }

    .main-page .main-page__offer--zones .main-page__offer-card {
        padding-top: 20px;
    }

    .main-page .main-page__offer--zones .main-page__offer-pic {
        top: auto;
        right: -35px;
        bottom: -83px;
        width: 224px;
        height: 162px;
    }

    .main-page .main-page__offer--zones .main-page__offer-pic img {
        top: -16.09%;
        height: 133.63%;
    }

    .main-page .main-page__offer--zones .main-page__offer-label {
        white-space: normal;
    }

    .main-page .main-page__offer .main-page__offer-title {
        font-family: var(--main-page-font-title);
        font-size: 24px;
    }

    .main-page .main-page__offer .main-page__btn {
        width: 100%;
    }

    /* 390 / 320: у «Клубных карт» отступ сверху 70px */
    .main-page .main-page__cards {
        padding-top: 70px;
    }

    .main-page .main-page__hero-bg img {
        object-position: center;
    }

    /* Фото бассейна на первом экране: блок узкий и высокий, фото по высоте блока — в кадре оставались
       только стены (Академка) или потолок (Коммунарка), а вода уходила под кнопки и цифры.
       Ракурс отдалён: фото ниже блока по высоте, стены и вода — в светлой середине блока.
       Блок не меняется; выше и ниже фото — затемнение блока (там и так чёрный) */
    .main-page .main-page__hero-bg--pool-akad img {
        height: 68%;
        transform: translateY(2%);
        object-position: 55% center;
    }

    .main-page .main-page__hero-bg--pool-kom img {
        height: 62%;
        transform: translateY(15%);
        object-position: 50% center;
    }

    .main-page .main-page__hero-buttons {
        margin-top: 34px;
    }

    .main-page .main-page__advantages {
        margin-top: 21px;
    }

    .main-page .main-page__all-btn {
        gap: 8px;
    }

    .main-page__mform-pic {
        display: none;
    }
}

@media (max-width: 355px) {
    .main-page {
        --main-page-trainer-w: 280px;
    }

    .main-page__map {
        padding-top: 50px;
    }

    .main-page__map-canvas {
        aspect-ratio: 390 / 363;
    }

    .main-page__form-sub {
        white-space: normal;
    }

    .main-page__trainer {
        height: 409px;
    }

    .main-page__offer--top .main-page__offer-pic img,
    .main-page .main-page__offer--top .main-page__offer-pic img {
        top: -6.76%;
        width: 83.36%;
        height: 119.95%;
    }

    .main-page__map-pin:nth-of-type(1) {
        left: 32.14%;
        top: 24.18%;
    }

    .main-page__map-pin:nth-of-type(2) {
        left: 16.43%;
        top: 43.46%;
    }

    .main-page__map-pin:nth-of-type(3) {
        left: 23.57%;
        top: 67.39%;
    }

    .main-page__map-pin:nth-of-type(4) {
        left: 67.50%;
        top: 18.82%;
    }

    .main-page__map-pin:nth-of-type(5) {
        left: 90.00%;
        top: 42.04%;
    }

    .main-page__map-pin:nth-of-type(6) {
        left: 77.86%;
        top: 64.89%;
    }

    .main-page__map-pin:nth-of-type(7) {
        left: 48.21%;
        top: 77.04%;
    }

    .main-page .main-page__hero-main {
        min-height: 1292px;
    }

    .main-page .main-page__contacts-decor {
        overflow: hidden;
        border-radius: inherit;
    }

    .main-page .main-page__contacts-pin {
        top: 309px;
        right: -32px;
    }

    .main-page .main-page__contacts-glow {
        top: 282px;
        right: -65px;
    }
}

@media (min-width: 356px) and (max-width: 1320px) {
    .main-page__form-sub {
        white-space: nowrap;
    }
}

@media (min-width: 356px) and (max-width: 896px) {
    .main-page__offer--top .main-page__offer-pic img {
        top: -23.47%;
        width: 106.57%;
        height: 153.35%;
    }
}

@media (min-width: 356px) and (max-width: 704px) {
    .main-page .main-page__offer--top .main-page__offer-pic img {
        top: -23.47%;
        width: 106.57%;
        height: 153.35%;
    }
}

@media (min-width: 356px) and (max-width: 465px) {
    .main-page {
        --main-page-trainer-w: 260px;
    }

    .main-page__map {
        padding-top: 60px;
    }

    .main-page__map-canvas {
        aspect-ratio: 342 / 319;
    }

    .main-page__trainer {
        height: 380px;
    }

    .main-page__map-pin:nth-of-type(1) {
        left: 36.84%;
        top: 29.09%;
    }

    .main-page__map-pin:nth-of-type(2) {
        left: 18.13%;
        top: 41.96%;
    }

    .main-page__map-pin:nth-of-type(3) {
        left: 21.05%;
        top: 64.47%;
    }

    .main-page__map-pin:nth-of-type(4) {
        left: 67.54%;
        top: 23.25%;
    }

    .main-page__map-pin:nth-of-type(5) {
        left: 82.46%;
        top: 39.91%;
    }

    .main-page__map-pin:nth-of-type(6) {
        left: 75.44%;
        top: 61.55%;
    }

    .main-page__map-pin:nth-of-type(7) {
        left: 44.74%;
        top: 75.29%;
    }
}

@media (min-width: 466px) and (max-width: 1320px) {
    .main-page__advantages {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 466px) and (max-width: 1100px) {
    .main-page__offer--zones .main-page__offer-pic {
        bottom: auto;
    }
}

@media (min-width: 466px) and (max-width: 896px) {
    .main-page__offer--top .main-page__offer-pic {
        bottom: auto;
    }
}

@media (min-width: 466px) and (max-width: 704px) {
    .main-page__hero-buttons {
        margin-top: 40px;
    }

    .main-page__offer-card {
        gap: 40px;
    }

    .main-page__hero-descr p {
        display: block;
    }

    .main-page__hero-descr p + p::before {
        content: none;
    }

    .main-page__offer--top .main-page__offer-pic {
        transform: translateX(-50%);
    }

    .main-page .main-page__zones .main-page__offer--zones {
        padding: 0 0 80px;
    }

    .main-page .main-page__offer .main-page__offer-card {
        gap: 40px;
        background: linear-gradient(90.35deg, #162130 0.17%, #456796 175.69%);
    }

    .main-page .main-page__offer .main-page__offer-label {
        gap: 20px;
        white-space: nowrap;
    }

    .main-page .main-page__offer--top .main-page__offer-pic {
        bottom: auto;
        transform: translateX(-50%);
    }

    .main-page .main-page__offer--zones .main-page__offer-pic {
        top: 224px;
        right: -51px;
        bottom: auto;
        width: 283px;
        height: 195px;
    }

    .main-page .main-page__offer--zones .main-page__offer-pic img {
        top: -16.81%;
        height: 139.67%;
    }
}

@media (min-width: 466px) and (max-width: 590px) {
    .main-page {
        --main-page-card-w: 326px;
        --main-page-trainer-w: 326px;
    }

    .main-page__map {
        padding-top: 40px;
    }

    .main-page__map-canvas {
        aspect-ratio: 510 / 475;
    }

    .main-page__contacts-glow {
        top: 150px;
        right: -30px;
    }

    .main-page__contacts-pin {
        top: 189px;
        right: 3px;
    }

    .main-page__contacts-map {
        aspect-ratio: 460 / 267;
    }

    .main-page__map-btn {
        width: 326px;
    }

    .main-page__offer--top .main-page__offer-pic {
        left: calc(50% - 112.5px);
        width: 283px;
        height: 195px;
        top: 224px;
    }

    .main-page__offer--zones .main-page__offer-pic {
        top: 224px;
        right: -51px;
        width: 283px;
        height: 195px;
    }

    .main-page__trainers .main-page__more .main-page__btn,
    .main-page__news .main-page__more .main-page__btn {
        width: 326px;
    }

    .main-page__offer .main-page__btn {
        width: 324px;
    }

    .main-page__form--man .main-page__h2,
    .main-page__news .main-page__h2 {
        font-family: var(--main-page-font);
        font-size: 40px;
    }

    /* 540 */
    .main-page .main-page__hero .main-page__offer--top {
        padding: 0 var(--main-page-pad) 80px;
    }

    .main-page .main-page__offer--top .main-page__offer-pic {
        top: 224px;
        left: calc(50% - 112.5px);
        width: 283px;
        height: 195px;
    }

    .main-page__map-pin:nth-of-type(1) {
        left: 36.08%;
        top: 26.57%;
    }

    .main-page__map-pin:nth-of-type(2) {
        left: 15.88%;
        top: 39.71%;
    }

    .main-page__map-pin:nth-of-type(3) {
        left: 19.22%;
        top: 61.47%;
    }

    .main-page__map-pin:nth-of-type(4) {
        left: 64.31%;
        top: 18.73%;
    }

    .main-page__map-pin:nth-of-type(5) {
        left: 77.65%;
        top: 33.82%;
    }

    .main-page__map-pin:nth-of-type(6) {
        left: 77.65%;
        top: 61.47%;
    }

    .main-page__map-pin:nth-of-type(7) {
        left: 35.10%;
        top: 79.12%;
    }

    .main-page .main-page__map-canvas {
        width: min(510px, calc(100vw - 30px));
        max-width: none;
    }
}

@media (min-width: 591px) and (max-width: 1320px) {
    .main-page__map-canvas {
        aspect-ratio: 560 / 521;
    }
}

@media (min-width: 591px) and (max-width: 1100px) {
    .main-page__contacts-map {
        aspect-ratio: 719 / 418;
    }

    .main-page__directions {
        gap: 30px;
    }

    .main-page__offer--zones .main-page__offer-pic {
        top: 177px;
        right: -25px;
        width: 301px;
        height: 208px;
    }
}

@media (min-width: 591px) and (max-width: 896px) {
    .main-page__zone-card {
        gap: 60px;
    }

    .main-page__contacts-pin {
        right: 30px;
    }

    .main-page__offer--top .main-page__offer-pic {
        width: 301px;
        height: 208px;
    }

    .main-page__map-pin:nth-of-type(2) {
        top: 37.23%;
    }

    .main-page__map-pin:nth-of-type(3) {
        top: 58.84%;
    }

    .main-page .main-page__zone-card {
        padding: 29px;
    }
}

@media (min-width: 591px) and (max-width: 704px) {
    .main-page {
        --main-page-card-w: 367px;
        --main-page-trainer-w: 366px;
    }

    .main-page__cards-text {
        max-width: 191px;
    }

    .main-page__contacts-glow {
        top: 180px;
        right: -40px;
    }

    .main-page__contacts-pin {
        top: 229px;
    }

    .main-page__map-btn {
        width: 366px;
    }

    /* Зоны: «Подробнее» — синяя обводка */
    .main-page__zones-all {
        width: 269px;
    }

    .main-page__offer--top .main-page__offer-pic {
        left: calc(50% - 144.5px);
        top: 228px;
    }

    .main-page__trainers .main-page__more .main-page__btn,
    .main-page__news .main-page__more .main-page__btn,
    .main-page__offer .main-page__btn {
        width: 366px;
    }

    .main-page .main-page__hero .main-page__offer--top {
        padding: 0 var(--main-page-pad);
    }

    .main-page .main-page__offer--top .main-page__offer-card {
        height: 310px;
        padding: 40px 40px 135px;
    }

    .main-page .main-page__offer--top .main-page__offer-title {
        font-family: var(--main-page-font);
    }

    .main-page .main-page__offer--top .main-page__btn {
        width: 366px;
    }

    .main-page .main-page__offer--top .main-page__offer-pic {
        top: 228px;
        left: calc(50% - 144.5px);
        width: 301px;
        height: 208px;
    }

    .main-page__map-pin:nth-of-type(1) {
        left: 36.61%;
        top: 25.27%;
    }

    .main-page__map-pin:nth-of-type(2) {
        left: 16.43%;
    }

    .main-page__map-pin:nth-of-type(3) {
        left: 14.11%;
    }

    .main-page__map-pin:nth-of-type(4) {
        left: 63.57%;
        top: 18.12%;
    }

    .main-page__map-pin:nth-of-type(5) {
        left: 78.04%;
        top: 33.66%;
    }

    .main-page__map-pin:nth-of-type(6) {
        left: 78.04%;
        top: 60.62%;
    }

    .main-page__map-pin:nth-of-type(7) {
        left: 37.50%;
        top: 76.70%;
    }
}

@media (min-width: 705px) and (max-width: 1100px) {
    .main-page__hero-bg img {
        object-position: 65% center;
    }

    .main-page__hero-buttons {
        margin-top: 30px;
    }

    .main-page__hero-btn {
        flex: 1;
    }

    .main-page__hero-btn--video {
        flex: 0 0 461px;
    }

    .main-page__form-box {
        gap: 40px;
    }

    .main-page__form-logo {
        bottom: 46.75px;
    }

    .main-page__cards-sub {
        max-width: 322px;
    }

    .main-page__zones-all {
        width: auto;
    }

    .main-page__hero-descr p {
        display: inline;
    }

    .main-page__hero-descr p + p::before {
        content: ' ';
    }

    .main-page__offer--zones .main-page__offer-label {
        flex-direction: row;
    }
}

@media (min-width: 705px) and (max-width: 896px) {
    .main-page {
        --main-page-card-w: 452px;
    }

    .main-page__offer-card {
        gap: 20px;
    }

    .main-page__offer-label {
        flex-direction: row;
    }

    .main-page__form-box {
        min-height: 1078px;
    }

    .main-page__cards-text {
        max-width: 288px;
    }

    .main-page__contacts-glow {
        top: 60px;
        right: -60px;
    }

    .main-page__contacts-pin {
        top: 146px;
    }

    .main-page__map-btn {
        width: 452px;
    }

    .main-page__offer--top .main-page__offer-pic {
        left: 0;
        top: 177px;
    }

    .main-page__trainers .main-page__more .main-page__btn,
    .main-page__news .main-page__more .main-page__btn {
        width: 452px;
    }

    .main-page__form--woman .main-page__form-box {
        min-height: 1078px;
    }

    .main-page__offer .main-page__btn {
        width: 452px;
    }

    .main-page__map-pin:nth-of-type(1) {
        left: 34.11%;
        top: 23.48%;
    }

    .main-page__map-pin:nth-of-type(2) {
        left: 17.50%;
    }

    .main-page__map-pin:nth-of-type(3) {
        left: 15.18%;
    }

    .main-page__map-pin:nth-of-type(4) {
        left: 63.39%;
        top: 16.34%;
    }

    .main-page__map-pin:nth-of-type(5) {
        left: 75.54%;
        top: 30.09%;
    }

    .main-page__map-pin:nth-of-type(6) {
        left: 79.11%;
        top: 58.84%;
    }

    .main-page__map-pin:nth-of-type(7) {
        left: 36.79%;
        top: 74.91%;
    }
}

@media (min-width: 897px) and (max-width: 1320px) {
    .main-page__offer-label {
        flex-direction: column;
    }

    .main-page__cards-text {
        max-width: 720px;
    }

    .main-page__map-pin:nth-of-type(1) {
        top: 26.30%;
    }

    .main-page__map-pin:nth-of-type(2) {
        top: 41.07%;
    }

    .main-page__map-pin:nth-of-type(3) {
        top: 64.30%;
    }

    .main-page__map-pin:nth-of-type(4) {
        top: 18.62%;
    }

    .main-page__map-pin:nth-of-type(5) {
        top: 33.40%;
    }

    .main-page__map-pin:nth-of-type(6) {
        top: 64.30%;
    }

    .main-page__map-pin:nth-of-type(7) {
        top: 81.57%;
    }
}

@media (min-width: 897px) and (max-width: 1100px) {
    .main-page {
        --main-page-card-w: 462px;
    }

    .main-page__form-box {
        min-height: 959px;
    }

    .main-page__form--man .main-page__form-person img {
        left: -10.49%;
        width: 145.34%;
        height: 156.21%;
    }

    .main-page__form--woman .main-page__form-person img {
        left: -16.73%;
        width: 133.51%;
        height: 143.5%;
    }

    .main-page__contacts-glow {
        top: -53px;
        right: 36px;
    }

    .main-page__contacts-pin {
        top: 42px;
        right: 71px;
    }

    .main-page__map-btn {
        width: 300px;
    }

    .main-page__offer--top .main-page__offer-pic {
        left: -46px;
        bottom: -62px;
        width: 291px;
        height: 217px;
    }

    .main-page__trainers .main-page__more .main-page__btn,
    .main-page__news .main-page__more .main-page__btn {
        width: 300px;
    }

    .main-page__form--woman .main-page__form-box {
        min-height: 1053px;
    }

    /* 1024: под плашкой «7 дней» 60px (свисает гантель) */
    .main-page .main-page__hero .main-page__offer--top {
        padding-bottom: 60px;
    }

    .main-page__map-pin:nth-of-type(1) {
        left: 36.61%;
    }

    .main-page__map-pin:nth-of-type(2) {
        left: 20.00%;
    }

    .main-page__map-pin:nth-of-type(3) {
        left: 17.68%;
    }

    .main-page__map-pin:nth-of-type(4) {
        left: 65.89%;
    }

    .main-page__map-pin:nth-of-type(5) {
        left: 78.04%;
    }

    .main-page__map-pin:nth-of-type(6) {
        left: 81.61%;
    }

    .main-page__map-pin:nth-of-type(7) {
        left: 39.29%;
    }

    .main-page .main-page__directions .main-page__block-head {
        gap: 30px;
    }

    .main-page .main-page__mform .main-page__form-submit {
        min-height: 55px;
        padding: 16px 60px;
        font-size: 18px;
        line-height: 1.3;
    }

    .main-page .main-page__mform .main-page__form-submit .main-page__btn-text {
        flex: none;
    }

    .main-page .main-page__mform .main-page__form-submit .main-page__btn-icon {
        position: absolute;
    }
}

@media (min-width: 1101px) and (max-width: 1680px) {
    .main-page__zones-list {
        flex: 1 1 0;
    }

    .main-page--academ .main-page__zone-card:nth-child(1) {
        height: 400px;
    }

    .main-page--academ .main-page__zone-card:nth-child(2) {
        height: 376px;
    }

    .main-page--academ .main-page__zone-card:nth-child(3) {
        height: 422px;
    }

    .main-page--academ .main-page__zone-card:nth-child(4) {
        height: 377px;
    }
}

@media (min-width: 1101px) and (max-width: 1320px) {
    /* Формы */
    .main-page__form-person {
        bottom: -21.62px;
    }

    .main-page__form-head {
        width: 361px;
    }

    .main-page__form-benefits {
        flex-direction: column;
        width: 252px;
    }

    .main-page__form--large .main-page__form-benefit:not(:last-child) {
        width: 215px;
    }

    .main-page__zones-info {
        flex: 0 0 438px;
    }

    .main-page__contacts-map > img {
        object-position: 29% 50%;
    }

    .main-page__map-btn {
        width: 344px;
    }

    .main-page__directions {
        gap: 20px;
    }

    .main-page__form-benefit:last-child {
        width: 100%;
    }

    .main-page__zones-all {
        width: 322px;
    }

    /* Клубные карты */
    .main-page__cards .main-page__center-head {
        max-width: 364px;
    }

    .main-page__map-pin:nth-of-type(1) {
        left: 36.96%;
    }

    .main-page__map-pin:nth-of-type(2) {
        left: 20.36%;
    }

    .main-page__map-pin:nth-of-type(3) {
        left: 18.04%;
    }

    .main-page__map-pin:nth-of-type(4) {
        left: 66.25%;
    }

    .main-page__map-pin:nth-of-type(5) {
        left: 78.39%;
    }

    .main-page__map-pin:nth-of-type(6) {
        left: 81.96%;
    }

    .main-page__map-pin:nth-of-type(7) {
        left: 39.64%;
    }

    .main-page .main-page__dir-card {
        min-height: 0;
    }

    .main-page .main-page__all-btn {
        min-height: 47px;
        padding: 14px 46px 13px 14px;
        line-height: 1.3;
    }

    .main-page .main-page__all-btn .main-page__btn-icon {
        top: 50%;
        right: 8px;
        bottom: auto;
        transform: translateY(-50%);
    }
}

@media (min-width: 1321px) {
    .main-page__map-label {
        display: flex;
    }
}

@media (min-width: 1321px) and (max-width: 1680px) {
    .main-page__zones-info {
        flex: 1 1 0;
    }

    .main-page__map-line--1920 {
        display: none;
    }

    .main-page__map-btn {
        width: 422px;
    }

    .main-page__form--woman .main-page__form-more {
        display: inline;
    }

    .main-page .main-page__map-canvas {
        height: 788px;
    }
}

/* Порядок каскада как в исходнике: повторы, перебивающие правила выше */

.main-page__map-image {
    top: -33px;
}

.main-page__form-label {
    font-size: 18px;
}

.main-page__btn {
    font-size: 16px;
    padding: 7px 10px 6px 30px;
}

.main-page__form-benefit {
    font-size: 16px;
}

.main-page__h2 {
    font-family: var(--main-page-font-title);
    font-size: 24px;
}

.main-page__offer {
    padding: 0 var(--main-page-pad) 80px;
}

.main-page__cards-title,
.main-page__dir-card-title,
.main-page__news-card-title,
.main-page__trainer-name,
.main-page__zone-card-title {
    font-size: 20px;
}

.main-page__hero-title,
.main-page__rating-value {
    font-size: 24px;
}

.main-page__advantages {
    gap: 20px;
}

.main-page__advantages-value {
    font-size: 20px;
}

.main-page__offer-card {
    padding: 40px 20px 0;
}

.main-page__offer-title {
    font-size: 24px;
}

.main-page__offer--zones .main-page__offer-pic img {
    top: -16.09%;
}

.main-page {
    font-size: 16px;
    font-feature-settings: "lnum" 1, "pnum" 1;
}

.main-page__cards-item.is-active {
    left: calc(var(--main-page-cs-w) + var(--main-page-c-gap));
    top: 0;
}

.main-page__cards-item.is-next,
.main-page__cards-item.is-prev {
    z-index: 3;
}

[data-main-page-track] {
    margin-top: -12px;
    padding-top: 12px;
}

.main-page__trainer-all-art {
    bottom: 65px; /* кнопка 45px + отступ 20px */
}

.main-page .main-page__all-btn {
    padding-left: 14px;
}

.main-page .main-page__trainer {
    background: linear-gradient(to bottom, #02060e 4.75%, #253448 112.56%);
}

.main-page__mform-title {
    font-size: 20px;
}

/* порядок каскада как в исходнике (свойство только для этих ширин) */
@media (max-width: 1100px) {
    .main-page__btn--muted,
    .main-page__btn--outline {
        padding: 15px 60px 15px 30px;
    }

    .main-page__btn--dark {
        padding: 15px 30px;
    }
}

/* порядок каскада как в исходнике (свойство только для этих ширин) */
@media (max-width: 465px) {
    .main-page__offer {
        padding-bottom: 86px;
    }
}

/* ---------- от 356px ---------- */
@media (min-width: 356px) {
    .main-page__map-canvas {
        width: 342px;
    }

    .main-page__cards-slider {
        --main-page-cs-w: 84px;
        --main-page-cs-h: 43px;
        --main-page-cm-w: 249px;
        --main-page-cm-h: 119px;
        --main-page-glow-x: -52.81%;
        --main-page-glow-y: -79.83%;
        --main-page-glow-w: 205.62%;
        --main-page-glow-h: 263.87%;
    }

    .main-page__mform {
        padding: 20px 26px;
    }

    .main-page__mform-dialog {
        width: 337px;
        padding: 30px;
    }

    .main-page__mform-title {
        max-width: 340px;
    }
}

/* ---------- от 466px ---------- */
@media (min-width: 466px) {
    .main-page__hero-main {
        min-height: 1344px;
    }

    .main-page__hero-bg::after {
        background: linear-gradient(180.67deg, #000 25.486%, rgba(1, 1, 1, 0.1) 57.948%, #000 95.397%);
    }

    .main-page__hero-title {
        font-size: 32px;
    }

    .main-page__rating {
        padding: 20px;
        height: 140px;
        width: 280px
    }

    .main-page__rating-top {
        width: 238px;
    }

    .main-page__rating-caption {
        width: 118px;
        font-size: 16px;
    }

    .main-page__rating-mark {
        margin-top: 16px;
    }

    .main-page__rating-value {
        font-size: 30px;
        letter-spacing: -0.3px;
    }

    .main-page__rating-reviews {
        font-size: 16px;
    }

    .main-page__advantages {
        gap: 40px 20px;
    }

    .main-page__advantages-value {
        font-size: 24px;
    }

    .main-page__advantages-value sup {
        font-size: 15.48px;
    }

    .main-page__offer-card {
        height: auto;
        padding: 40px 40px 80px;
    }

    .main-page__offer--zones .main-page__offer-pic img {
        top: -16.81%;
        height: 139.67%;
    }

    .main-page__offer-label {
        gap: 20px;
        white-space: nowrap;
    }

    .main-page__offer-title {
        font-size: 40px;
    }

    .main-page__map-canvas {
        width: 510px;
    }

    /* Карточки-слайдеры */
    .main-page__directions-list {
        gap: 20px;
    }

    .main-page__form-box {
        padding: 30px;
    }

    .main-page__form-benefits {
        gap: 20px;
    }

    .main-page__cards-slider {
        --main-page-cs-w: 132px;
        --main-page-cs-h: 67px;
        --main-page-cm-w: 383px;
        --main-page-cm-h: 183px;
        --main-page-glow-x: -31.07%;
        --main-page-glow-y: -40.44%;
        --main-page-glow-w: 178.07%;
        --main-page-glow-h: 205.46%;
    }

    .main-page__cards-btn {
        width: 324px;
    }

    .main-page__trainers-list {
        gap: 20px;
    }

    .main-page__trainer {
        aspect-ratio: 315 / 460;
    }

    .main-page__trainer-photo {
        margin: 2px 44px;
    }

    .main-page__trainer .main-page__tag {
        margin: 30px 0 0 30px;
    }

    .main-page__trainer-info {
        padding: 0 30px 17px;
    }

    .main-page__contacts-glow {
        width: 250px;
        height: 215px;
    }

    .main-page__contacts-pin {
        width: 183px;
        height: 264px;
    }

    .main-page__only-narrow {
        display: none;
    }

    .main-page .main-page__trainer {
        background: linear-gradient(to bottom, #02060e 4.75%, #253448 112.56%) padding-box,
                    linear-gradient(128deg, rgba(0, 160, 227, 0) 9%, rgba(0, 160, 227, 0.3) 109%) border-box;
    }

    .main-page__trainer-all-art {
        bottom: 75px; /* кнопка 45px */
    }

    .main-page__dir-card-all-glow {
        filter: blur(75px);
    }

    .main-page .main-page__all-btn {
        right: 30px;
        bottom: 30px;
        left: 30px;
        padding-left: 20px;
        font-size: 16px;
    }

    .main-page__mform {
        padding: 20px;
    }

    .main-page__mform-dialog {
        width: 460px;
    }

    .main-page .main-page__mform-form {
        width: 315px;
    }
}

/* от 466px — порядок каскада как в исходнике: повторы, перебивающие правила выше */
@media (min-width: 466px) {
    .main-page__hero-main {
        padding: 40px 20px 20px;
    }
}

/* порядок каскада как в исходнике (свойство только для этих ширин) */
@media (min-width: 466px) and (max-width: 590px) {
    .main-page__offer-title {
        font-family: var(--main-page-font-title);
    }

    .main-page .main-page__offer--top .main-page__offer-card {
        background: linear-gradient(90.33deg, #162130 0.17%, #456796 175.69%);
    }
}

/* порядок каскада как в исходнике (свойство только для этих ширин) */
@media (min-width: 466px) and (max-width: 704px) {
    .main-page .main-page__offer--zones .main-page__offer-card {
        background: linear-gradient(90.33deg, #162130 0.17%, #456796 175.69%);
    }
}

/* порядок каскада как в исходнике (свойство только для этих ширин) */
@media (min-width: 466px) and (max-width: 1100px) {
    .main-page .main-page__all-btn {
        padding: 7px 10px 6px 20px;
    }
}

/* ---------- от 591px ---------- */
@media (min-width: 591px) {
    .main-page {
        --main-page-pad: 40px;
        --main-page-gap: 100px;
    }

    .main-page__h2 {
        font-family: var(--main-page-font);
        font-size: 40px;
    }

    .main-page__slider-block {
        gap: 30px;
    }

    .main-page__hero-main {
        padding: 40px;
    }

    .main-page__advantages {
        margin-top: 40px;
    }

    .main-page__advantages-text {
        width: 190px;
    }

    .main-page__offer {
        padding: 60px var(--main-page-pad) 0;
    }

    .main-page__offer-card {
        padding: 40px 40px 135px;
    }

    .main-page__map-canvas {
        width: 560px;
    }

    .main-page__dir-card-title {
        font-size: 24px;
    }

    .main-page__zone-card {
        padding: 30px;
    }

    .main-page__zone-card-bg img {
        left: var(--l, 17.02%);
        width: 82.98%;
        height: 100%;
    }

    .main-page__zone-card-bg::after {
        background: linear-gradient(to left, rgba(8, 14, 25, 0) 17.727%, var(--main-page-card-dark) 50%);
    }

    .main-page__zone-card-text {
        width: 327px;
    }

    .main-page__zone-card-title {
        font-size: 24px;
    }

    .main-page__cards {
        gap: 60px;
    }

    .main-page__cards-title {
        font-size: 24px;
    }

    .main-page__cards-btn {
        width: 364px;
    }

    .main-page__trainer-name {
        font-size: 24px;
    }

    .main-page__news-card-date {
        font-size: 18px;
    }

    .main-page__news-card-title {
        font-size: 24px;
    }

    .main-page__contacts-box {
        padding: 30px;
    }

    .main-page__contacts-info {
        width: 467px;
    }

    .main-page__contact-value {
        width: 305px;
    }

    .main-page__mform-dialog {
        width: 560px;
    }

    .main-page__mform-title {
        font-size: 24px;
    }
}

/* порядок каскада как в исходнике (свойство только для этих ширин) */
@media (min-width: 591px) and (max-width: 1100px) {
    .main-page__offer {
        padding-top: 0;
    }
}

/* порядок каскада как в исходнике (свойство только для этих ширин) */
@media (min-width: 591px) and (max-width: 896px) {
    .main-page__hero-main {
        padding-bottom: 0;
    }

    .main-page__map-pin:nth-of-type(2) {
        top: 37.23%;
    }

    .main-page__map-pin:nth-of-type(3) {
        top: 58.84%;
    }
}

/* порядок каскада как в исходнике (свойство только для этих ширин) */
@media (min-width: 591px) and (max-width: 704px) {
    .main-page__map-pin:nth-of-type(3) {
        left: 14.11%;
    }

    .main-page__map-pin:nth-of-type(4) {
        left: 63.57%;
        top: 18.12%;
    }

    .main-page__map-pin:nth-of-type(5) {
        left: 78.04%;
        top: 33.66%;
    }

    .main-page__map-pin:nth-of-type(6) {
        left: 78.04%;
        top: 60.62%;
    }

    .main-page__map-pin:nth-of-type(7) {
        left: 37.50%;
        top: 76.70%;
    }
}

/* ---------- от 705px ---------- */
@media (min-width: 705px) {
    .main-page__hero-main {
        min-height: 1531px;
    }

    .main-page__hero-title {
        font-size: 40px;
    }

    .main-page__hero-btn,
    .main-page__hero-btn--video {
        width: auto;
    }

    .main-page__rating-top {
        width: 230px;
    }

    .main-page__rating-caption,
    .main-page__rating-reviews {
        font-size: 20px;
    }

    .main-page__advantages {
        margin-top: 30px;
        padding: 40px;
    }

    .main-page__form-logo {
        top: auto;
        left: calc(50% - 2px);
        width: 684px;
        height: 386px;
        transform: translateX(-50%);
    }

    .main-page__form-info {
        gap: 40px;
    }

    .main-page__form-panel {
        width: 380px;
    }

    /* Клубные карты */
    .main-page__cards {
        padding: 0 var(--main-page-pad);
    }

    .main-page__cards-btn {
        width: 216px;
    }

    .main-page__contacts-glow {
        width: 330px;
        height: 283px;
    }

    .main-page__contacts-pin {
        width: 240px;
        height: 346px;
    }

    .main-page__mform-dialog {
        width: 648px;
    }
}

/* порядок каскада как в исходнике (свойство только для этих ширин) */
@media (min-width: 705px) and (max-width: 896px) {
    .main-page__rating {
        width: 280px;
    }
    .main-page__hero-btn--video {
        flex-basis: 340px;
    }

    .main-page__map-pin:nth-of-type(3) {
        left: 15.18%;
    }

    .main-page__map-pin:nth-of-type(4) {
        left: 63.39%;
        top: 16.34%;
    }

    .main-page__map-pin:nth-of-type(5) {
        left: 75.54%;
        top: 30.09%;
    }

    .main-page__map-pin:nth-of-type(6) {
        left: 79.11%;
        top: 58.84%;
    }

    .main-page__map-pin:nth-of-type(7) {
        left: 36.79%;
        top: 74.91%;
    }
}

/* ---------- от 897px ---------- */
@media (min-width: 897px) {
        .main-page__rating {
        width: 280px;
    }
    .main-page__hero-main {
        min-height: 1605px;
    }

    .main-page__advantages {
        gap: 40px 130px;
    }

    .main-page__advantages-value {
        font-size: 40px;
    }

    .main-page__advantages-value sup {
        font-size: 25.8px;
    }

    .main-page__advantages-label {
        font-size: 18px;
    }

    .main-page__offer-card {
        padding: 30px 30px 30px 300px;
        background: linear-gradient(92.52deg, #162130 0.17%, #456796 175.69%);
    }

    .main-page__offer-label {
        align-items: flex-start;
    }

    .main-page__offer-sub {
        font-size: 20px;
    }

    .main-page__form--man .main-page__form-person img {
        top: -3.09%;
    }

    .main-page__form--woman .main-page__form-person img {
        top: -10.69%;
    }

    .main-page__zone-card {
        justify-content: space-between;
        height: 360px;
    }

    .main-page__cards-lines {
        font-size: 16px;
    }

    .main-page__cards-btn {
        width: 302px;
    }

    .main-page__contacts-glow {
        width: 416px;
        height: 357px;
    }

    .main-page__contacts-pin {
        width: 303px;
        height: 437px;
    }

    .main-page__mform-dialog {
        width: 860px;
    }

    .main-page__mform-pic {
        left: 458px;
        width: 435px;
        height: 303px;
    }

    .main-page .main-page__mform-form {
        width: 387px;
    }

    .main-page .main-page__mform .main-page__check-text {
        font-size: 18px;
    }
}

/* порядок каскада как в исходнике (свойство только для этих ширин) */
@media (min-width: 897px) and (max-width: 1320px) {
    .main-page__offer-card {
        padding-left: 220px;
    }

    .main-page__map-pin:nth-of-type(2) {
        top: 41.07%;
    }

    .main-page__map-pin:nth-of-type(3) {
        top: 64.30%;
    }

    .main-page__map-pin:nth-of-type(4) {
        top: 18.62%;
    }

    .main-page__map-pin:nth-of-type(5) {
        top: 33.40%;
    }

    .main-page__map-pin:nth-of-type(6) {
        top: 64.30%;
    }

    .main-page__map-pin:nth-of-type(7) {
        top: 81.57%;
    }
}

/* порядок каскада как в исходнике (свойство только для этих ширин) */
@media (min-width: 897px) and (max-width: 1100px) {
    .main-page__map-pin:nth-of-type(3) {
        left: 17.68%;
    }

    .main-page__map-pin:nth-of-type(4) {
        left: 65.89%;
    }

    .main-page__map-pin:nth-of-type(5) {
        left: 78.04%;
    }

    .main-page__map-pin:nth-of-type(6) {
        left: 81.61%;
    }

    .main-page__map-pin:nth-of-type(7) {
        left: 39.29%;
    }
}

/* порядок каскада как в исходнике (свойство только для этих ширин) */
@media (min-width: 897px) and (max-width: 1320px) {
    .main-page__map-pin:nth-of-type(4) {
        top: 18.62%;
    }

    .main-page__map-pin:nth-of-type(5) {
        top: 33.40%;
    }

    .main-page__map-pin:nth-of-type(6) {
        top: 64.30%;
    }

    .main-page__map-pin:nth-of-type(7) {
        top: 81.57%;
    }
}

/* порядок каскада как в исходнике (свойство только для этих ширин) */
@media (min-width: 897px) and (max-width: 1100px) {
    .main-page__map-pin:nth-of-type(5) {
        left: 78.04%;
    }

    .main-page__map-pin:nth-of-type(6) {
        left: 81.61%;
    }

    .main-page__map-pin:nth-of-type(7) {
        left: 39.29%;
    }
}

/* порядок каскада как в исходнике (свойство только для этих ширин) */
@media (min-width: 897px) and (max-width: 1320px) {
    .main-page__map-pin:nth-of-type(6) {
        top: 64.30%;
    }

    .main-page__map-pin:nth-of-type(7) {
        top: 81.57%;
    }
}

/* порядок каскада как в исходнике (свойство только для этих ширин) */
@media (min-width: 897px) and (max-width: 1100px) {
    .main-page__map-pin:nth-of-type(7) {
        left: 39.29%;
    }
}

/* ---------- от 1101px ---------- */
@media (min-width: 1101px) {
    .main-page {
        --main-page-pad: 60px; /* боковые поля секций */
        --main-page-gap: 120px; /* расстояние между секциями */
        font-size: 18px;
    }

    .main-page__btn {
        padding: 16px 60px;
        font-size: 18px;
        line-height: 1.3;
    }

    .main-page__btn-icon {
        position: absolute;
    }

    .main-page__arrows {
        display: flex;
    }

    .main-page__block-head {
        gap: 30px;
    }

    .main-page__block-head-title {
        max-width: 740px;
    }

    .main-page__block-head-actions {
        display: flex;
    }

    .main-page__slider-block,
    .main-page__hero {
        gap: 60px;
    }
    
    .main-page__hero-main {
        min-height: 1184px;
        padding: 120px var(--main-page-pad);
    }

    .main-page__hero-bg::after {
        background: linear-gradient(89.92deg, #000 37.996%, rgba(1, 1, 1, 0.1) 75.975%, #010101 99.948%);
    }

    .main-page__hero-content {
        display: flex;
    }

    .main-page__hero-text {
        gap: 20px;
    }

    .main-page__hero-title {
        font-size: 50px;
    }

    .main-page__hero-descr {
        max-width: 547px;
        font-size: 18px;
    }

    .main-page__hero-btn {
        width: 255px;
    }

    .main-page__hero-btn--video {
        width: 347px;
    }

    .main-page__rating {
        position: absolute;
        top: 600px;
        right: var(--main-page-pad);
        width: 200px;
        height: 140px;
    }

    .main-page__advantages {
        margin-top: auto;
    }

    .main-page__offer {
        overflow: hidden;
    }

    .main-page__zones .main-page__offer {
        margin: 0 calc(-1 * var(--main-page-pad));
    }

    .main-page__offer-text,
    .main-page__offer-action {
        gap: 60px;
    }

    .main-page__dir-card {
        flex: 1 0 0;
        min-height: 460px;
    }

    .main-page__dir-card-text {
        font-size: 18px;
    }

    .main-page__form-box {
        justify-content: space-between;
        padding: 60px 30px;
    }

    .main-page__form-logo {
        top: 14px;
        left: calc(50% + 14.5px);
        width: 557px;
        height: 314px;
    }

    .main-page__form-person {
        top: auto;
        left: calc(50% - 76.5px);
        width: 755px;
        height: 663px;
        transform: translateX(-50%);
    }

    .main-page__form--man .main-page__form-person img {
        top: -0.06%;
    }

    .main-page__form--woman .main-page__form-person img {
        top: -6.05%;
    }

    .main-page__form-info {
        gap: 60px;
        width: auto;
    }

    .main-page__form-head {
        gap: 30px;
        max-width: 500px;   /* заголовок формы не шире 500px (Паша) */
    }

    .main-page__form-sub {
        font-size: 18px;
    }

    .main-page__form-benefit {
        width: 215px;
        font-size: 18px;
        color: var(--main-page-gray);
    }

    .main-page__form--large .main-page__form-benefit:not(:last-child) {
        font-size: 16px;
    }

    .main-page__form-panel {
        width: 451px;
        padding: 30px;
        border: 2px solid var(--main-page-line);
        background: rgba(2, 6, 14, 0.15);
    }

    .main-page__check-text {
        font-size: 18px;
    }

    /* Зоны */
    .main-page__zones {
        gap: 60px;
    }

    .main-page__zones-wrap {
        gap: 20px;
    }

    .main-page__zones-info {
        position: sticky;
        width: auto;
    }

    .main-page__zones-text {
        font-size: 18px;
    }

    .main-page__zones-list {
        width: auto;
    }

    .main-page__zone-card {
        height: 400px;
    }

    .main-page__zone-card-descr {
        font-size: 20px;
    }

    .main-page__cards-sub {
        font-size: 18px;
    }

    .main-page__cards-slider {
        gap: 60px;
        --main-page-cs-w: 181px;
        --main-page-cs-h: 92px;
        --main-page-cm-w: 467px;
        --main-page-cm-h: 223px;
        --main-page-c-gap: 60px;
        --main-page-glow-x: -32.12%;
        --main-page-glow-y: -33.36%;
        --main-page-glow-w: 176.87%;
        --main-page-glow-h: 192.38%;
    }

    .main-page__cards-lines {
        font-size: 18px;
    }

    .main-page__cards-btn {
        width: 346px;
    }

    .main-page__trainer {
        flex: 1 0 0;
    }

    .main-page__trainer-name,
    .main-page__trainer-role,
    .main-page__news-card-title {
        font-size: 20px;
    }

    .main-page__contact-text {
        font-size: 18px;
    }

    .main-page__contacts-glow {
        left: 233px;
        bottom: 86px;
    }

    .main-page__contacts-pin {
        left: 354.59px;
        bottom: -8.35px;
        width: 267px;
        height: 361px;
    }

    /* Контакты */
    .main-page__contacts-map {
        width: 415px;
        height: 450px;
    }

    .main-page__more,
    .main-page__bullets--narrow {
        display: none;
    }

    .main-page .main-page__zone-card {
        top: calc(max(var(--main-page-header), 100px) + var(--i, 0) * 40px);
    }

    .main-page .main-page__directions-list > .main-page__dir-card,
    .main-page .main-page__trainers-list > .main-page__trainer {
        flex: 0 0 calc((100% - 3 * 20px) / 4);
    }

    .main-page .main-page__news-list > .main-page__news-card {
        flex: 0 0 calc((100% - 20px) / 2);
    }

    .main-page__trainer-all-art {
        bottom: 67px; /* кнопка 47px + отступ 20px */
    }

    .main-page .main-page__all-btn {
        right: 20px;
        bottom: 20px;
        left: 20px;
        font-size: 13px;
    }

    .main-page__form-panel::before {
        content: '';
    }
}

/* от 1101px — порядок каскада как в исходнике: повторы, перебивающие правила выше */
@media (min-width: 1101px) {
    .main-page :where(h1, h2, h3, p, ul) {
        font-family: var(--main-page-font); /* base.css ставит заголовкам GothemPro */
        font-style: normal;
    }

    .main-page__rating {
        top: 600px;
        width: 280px
    }

    .main-page {
        font-feature-settings: "lnum" 1, "pnum" 1;
    }

    .main-page__mform-form::before {
        content: none;
    }
}

/* порядок каскада как в исходнике (свойство только для этих ширин) */
@media (min-width: 1101px) and (max-width: 1320px) {
    .main-page__hero-btn {
        padding-left: 30px;
    }

    .main-page__hero-btn--video {
        padding-left: 60px;
    }

    .main-page__directions {
        gap: 20px;
    }

    .main-page__map-pin:nth-of-type(3) {
        left: 18.04%;
    }

    .main-page__map-pin:nth-of-type(4) {
        left: 66.25%;
    }

    .main-page__map-pin:nth-of-type(5) {
        left: 78.39%;
    }

    .main-page__map-pin:nth-of-type(6) {
        left: 81.96%;
    }

    .main-page__map-pin:nth-of-type(7) {
        left: 39.64%;
    }

    .main-page .main-page__all-btn {
        padding: 14px 46px 13px 14px;
    }
}

/* от 1101px — порядок каскада как в исходнике: повторы, перебивающие правила выше */
@media (min-width: 1101px) {
    .main-page__h2 {
        font-family: var(--main-page-font);
        font-size: 40px;
        font-weight: 700;
    }

    .main-page__dir-card-title,
    .main-page__zone-card-title {
        font-size: 24px;
        font-weight: 700;
    }

    .main-page__cards-sub {
        font-size: 18px;
    }

    .main-page__cards-title {
        font-size: 24px;
        font-weight: 700;
    }

    .main-page__hero-title {
        font-family: var(--main-page-font-title);
        font-weight: 700;
        font-size: 50px;
    }

    .main-page__dir-card-text,
    .main-page__form-sub {
        font-size: 18px;
    }

    .main-page__news-card-title,
    .main-page__trainer-name {
        font-weight: 700;
        font-size: 20px;
    }

    .main-page__trainer-role,
    .main-page__zone-card-descr {
        font-size: 20px;
    }

    .main-page__form-error {
        font-size: 16px;
    }
}

/* порядок каскада как в исходнике (свойство только для этих ширин) */
@media (min-width: 1101px) and (max-width: 1320px) {
    .main-page__map-pin:nth-of-type(4) {
        top: 18.62%;
    }

    .main-page__map-pin:nth-of-type(5) {
        top: 33.40%;
    }

    .main-page__map-pin:nth-of-type(6) {
        top: 64.30%;
    }

    .main-page__map-pin:nth-of-type(7) {
        top: 81.57%;
    }
}

/* порядок каскада как в исходнике (свойство только для этих ширин) */
@media (min-width: 1101px) and (max-width: 1320px) {
    .main-page__map-pin:nth-of-type(5) {
        left: 78.39%;
    }

    .main-page__map-pin:nth-of-type(6) {
        left: 81.96%;
    }

    .main-page__map-pin:nth-of-type(7) {
        left: 39.64%;
    }
}

/* порядок каскада как в исходнике (свойство только для этих ширин) */
@media (min-width: 1101px) and (max-width: 1320px) {
    .main-page__map-pin:nth-of-type(6) {
        top: 64.30%;
    }

    .main-page__map-pin:nth-of-type(7) {
        top: 81.57%;
    }
}

/* порядок каскада как в исходнике (свойство только для этих ширин) */
@media (min-width: 1101px) and (max-width: 1320px) {
    .main-page__map-pin:nth-of-type(7) {
        left: 39.64%;
    }
}

/* ---------- от 1321px ---------- */
@media (min-width: 1321px) {
    .main-page__hero-main {
        min-height: 1117px;
    }

    .main-page__hero-title {
        max-width: 682px;
    }

    .main-page__hero-btn {
        width: 314px;
    }

    .main-page__hero-btn--video {
        width: 348px;
    }

    .main-page__rating {
        top: 600px;
    }

    .main-page__advantages {
        display: flex;
        gap: 40px 20px;
    }

    .main-page__advantages-item--wide .main-page__advantages-text {
        width: 217px;
    }

    .main-page__advantages-value {
        font-size: 24px;
    }

    .main-page__advantages-value sup {
        font-size: 15.48px;
    }

    .main-page__advantages-label {
        font-size: 20px;
    }

    .main-page__advantages-item--wide .main-page__advantages-label {
        max-width: none;
    }

    .main-page__offer {
        height: 200px;
    }

    .main-page__offer-card {
        height: 140px;
    }

    .main-page__offer-pic {
        bottom: -2px;
        width: 289px;
        height: 241px;
    }

    .main-page__offer-pic img {
        top: 0;
        left: -13.49%;
        width: 113.49%;
        height: 136.1%;
    }

    .main-page__offer--zones .main-page__offer-pic img {
        top: 2.5%;
        left: 0;
        height: 120%;
    }

    .main-page__offer-label {
        align-items: center;
    }

    .main-page__map {
        gap: 80px;
        padding: 0;
    }

    .main-page__map-canvas {
        width: 1440px;
        height: 825px;
    }

    .main-page__form-person {
        top: calc(50% + 54.68px);
        left: calc(50% + 47.5px);
        width: 793px;
        height: 696px;
        transform: translate(-50%, -50%);
    }

    .main-page__form--woman .main-page__form-person img {
        top: -15.42%;
    }

    .main-page__form-info {
        width: 687px;
    }

    .main-page__form-sub {
        color: var(--main-page-gray);
    }

    .main-page__form-benefit {
        width: 280px;
    }

    .main-page__input {
        font-size: 20px;
    }

    .main-page__form-label {
        font-size: 20px;
        color: var(--main-page-gray);
    }

    .main-page__zones {
        gap: 120px;
    }

    .main-page__zones-title {
        max-width: 640px;
    }

    .main-page__zones-text {
        max-width: 547px;
    }

    .main-page__zone-card {
        padding: 32px;
    }

    .main-page__zone-card-descr {
        font-size: 18px;
    }

    .main-page__cards-slider {
        gap: 120px;
        --main-page-cs-w: 215px;
        --main-page-cs-h: 109px;
        --main-page-cm-w: 391px;
        --main-page-cm-h: 187px;
        --main-page-c-gap: 120px;
        --main-page-glow-x: -32.48%;
        --main-page-glow-y: -22.99%;
        --main-page-glow-w: 168.29%;
        --main-page-glow-h: 177.01%;
    }

    .main-page__cards-btn {
        width: 284px;
    }

    .main-page__cards > .main-page__arrows {
        top: 291px;
        left: var(--main-page-pad);
        right: var(--main-page-pad);
    }

    .main-page__trainer-role {
        font-size: 18px;
    }

    .main-page__contacts-glow {
        left: 279px;
        bottom: 116px;
    }

    .main-page__contacts-pin {
        left: 380px;
        bottom: -6px;
        height: 372px;
    }

    .main-page__contacts-map {
        width: 609px;
        height: 457px;
    }

    .main-page__map-stage {
        display: none;
    }

    .main-page__map-line--1440 {
        display: block;
    }

    .main-page__trainer-all-art {
        bottom: 85px; /* кнопка 55px + отступ 30px */
    }

    .main-page .main-page__all-btn {
        right: 30px;
        bottom: 30px;
        left: 30px;
        font-size: 15px;
    }
}

/* от 1321px — порядок каскада как в исходнике: повторы, перебивающие правила выше */
@media (min-width: 1321px) {
    .main-page__cards > .main-page__arrows {
        top: 291px;
    }
}

/* порядок каскада как в исходнике (свойство только для этих ширин) */
@media (min-width: 1321px) and (max-width: 1680px) {
    .main-page__advantages {
        column-gap: 0;
    }
}

/* ---------- от 1681px ---------- */
@media (min-width: 1681px) {
    .main-page__hero-main {
        min-height: 1110px;
    }

    .main-page__hero-bg::after {
        background: linear-gradient(89.89deg, #000 35.115%, rgba(1, 1, 1, 0.1) 75.975%, #010101 99.948%);
    }

    .main-page__hero-title {
        max-width: 840px;
        font-size: 64px;
    }

    .main-page__hero-descr {
        max-width: 719px;
        font-size: 20px;
    }

    .main-page__hero-btn {
        width: 282px;
    }

    .main-page__hero-btn--video {
        width: 340px;
    }

    .main-page__rating {
        top: 600px;
    }

    .main-page__map {
        padding: 0 240px;
    }

    .main-page__map-canvas {
        height: 819px;
    }

    .main-page__map-image {
        top: -93px;
        width: 912px;
        height: 912px;
    }

    .main-page__dir-card {
        padding: 30px 38px 30px 30px;
    }

    .main-page__dir-card-text,
    .main-page__form-sub,
    .main-page__form--large .main-page__form-benefit:not(:last-child) {
        font-size: 16px;
    }

    .main-page__zones {
        gap: 60px;
    }

    .main-page__zones-wrap {
        gap: 27px;
    }

    .main-page__zones-info {
        width: 883px;
    }

    .main-page__zones-text {
        font-size: 20px;
    }

    .main-page__zones-list {
        gap: 40px;
        width: 890px;
    }

    .main-page__zone-card {
        padding: 30px;
    }

    .main-page__zone-card-descr {
        font-size: 20px;
    }

    .main-page__cards {
        padding: 0 240px;
    }

    .main-page__cards-slider {
        --main-page-cs-w: 328px; /* боковой браслет */
        --main-page-cs-h: 167px;
        --main-page-cm-w: 596px; /* центральный */
        --main-page-cm-h: 285px;
        --main-page-glow-x: -25.17%;
        --main-page-glow-y: -7.48%;
        --main-page-glow-w: 154.03%;
        --main-page-glow-h: 162.11%;
    }

    .main-page__cards > .main-page__arrows {
        top: 321px;
    }

    .main-page__trainer .main-page__tag {
        margin: 29px 0 0 29px;
    }

    .main-page__trainer-name {
        font-size: 24px;
    }

    .main-page__trainer-role {
        font-size: 20px;
    }

    .main-page__news-card-title {
        font-size: 24px;
    }

    .main-page__contact-text {
        font-size: 20px;
    }

    .main-page__contacts-glow {
        left: 385.6px;
        bottom: 205.7px;
    }

    .main-page__contacts-pin {
        left: 463px;
        bottom: 30.45px;
        width: 303px;
        height: 437px;
    }

    .main-page__contacts-map {
        width: 860px;
        height: 500px;
    }

    .main-page__map-line--1440 {
        display: none;
    }

    .main-page__form-more {
        display: inline;
    }

    .main-page .main-page__map-canvas {
        overflow: visible;
    }
}


/* ==========================================================================
   Адаптив между макетами и широкие экраны
   (всё, что ниже, — доработки поверх вёрстки по макетам; порядок: от узких к широким)
   ========================================================================== */

/* Преимущества в форме тест-драйва: на 466–1100 всегда две колонки (по макету 540/768/1024).
   Колонки сужаются вместе с экраном (не шире 205px), а не переезжают в одну колонку на 466–530 */
@media (min-width: 466px) and (max-width: 1100px) {
    .main-page .main-page__form-benefits {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 205px));
    }

    .main-page .main-page__form-benefits .main-page__form-benefit {
        width: auto;
        min-width: 0;
    }
}

/* Стопка «Пространство Escalada»: у каждой карточки в стопке виден заголовок.
   Сдвиг каждой следующей карточки (--main-page-stack) считает main-page.js по высоте заголовков;
   без JS — прежний шаг. На ≤704 картинка у карточки сверху — там стопка прежняя (сдвиг 10px). */
@media (min-width: 705px) {
    .main-page .main-page__zone-card {
        top: calc(80px + var(--main-page-stack, calc(var(--i, 0) * 10px)));
    }
}

@media (min-width: 1101px) {
    .main-page .main-page__zone-card {
        top: calc(max(var(--main-page-header), 100px) + var(--main-page-stack, calc(var(--i, 0) * 40px)));
    }
}

/* Параллакс (main-page.js): первый экран — фото медленнее страницы, фото не выходит за блок;
   плашки с формами — логотип медленнее, человек быстрее (обрезаются краем плашки) */
.main-page__hero-bg {
    overflow: hidden;
}

/* Слой (will-change) — только у картинок. У текста первого экрана слой включает main-page.js на время
   движения: постоянный слой с текстом после прокрутки перерисовывался «мыльным» */
.main-page__hero-bg img,
.main-page__form-logo,
.main-page__form-person {
    will-change: translate;   /* параллакс (main-page.js): первый экран и плашки с формами */
}

/* Статистика первого экрана: с 1321px (макеты 1440/1920) — всегда одной строкой.
   Когда места мало (1321–1380, 1681–1760), пункты сжимаются, подпись под цифрой переносится на 2 строки */
@media (min-width: 1321px) {
    .main-page .main-page__advantages {
        flex-wrap: nowrap;
    }

    .main-page .main-page__advantages-item {
        flex: 0 1 auto;
        min-width: 0;
    }

    .main-page .main-page__advantages-text {
        min-width: 0;
    }
}

/* Шире 1920px — всё как на 1920: контент 1800px по центру, по бокам растут поля.
   Фон первого экрана и фон страницы — на всю ширину окна */
@media (min-width: 1921px) {
    .main-page {
        --main-page-pad: calc((100vw - 1800px) / 2);
    }
}

@media (prefers-reduced-motion: reduce) {
    .main-page__map-pin img,
    .main-page__map-tip {
        transition: none;
    }
}

@keyframes main-page__cards-text-in {
    from { opacity: 0; transform: translateY(8px); }
    to   { opacity: 1; transform: none; }
}

@media (prefers-reduced-motion: reduce) {
    .main-page__cards-item,
    .main-page__cards-item > img,
    .main-page__cards-glow {
        transition: none;
    }

    .main-page__cards-text:not([hidden]) {
        animation: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .main-page__dir-card,
    .main-page__dir-card-title {
        transition: none;
    }
}

@keyframes main-page__draw {
    to { stroke-dashoffset: 0; }
}

@keyframes main-page__success-in {
    from { opacity: 0; transform: translateY(12px); }
    to   { opacity: 1; transform: none; }
}

@media (prefers-reduced-motion: reduce) {
    .main-page__form-success,
    .main-page__form-success *,
    .main-page__modal-overlay,
    .main-page__modal-dialog {
        animation: none !important;
        transition: none !important;
    }

    .main-page__form-success-icon circle,
    .main-page__form-success-icon path {
        stroke-dashoffset: 0;
    }
}

@keyframes main-page__shake {
    10%, 90% { transform: translateX(-1px); }
    20%, 80% { transform: translateX(3px); }
    30%, 50%, 70% { transform: translateX(-6px); }
    40%, 60% { transform: translateX(6px); }
}

@media (prefers-reduced-motion: reduce) {
    .main-page__shake {
        animation: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .main-page__mform-overlay,
    .main-page__mform-dialog {
        transition: none;
    }
}

/* ==========================================================================
   Шкала шрифтов (доводка перед выкаткой, не по макету — по ТЗ Паши).
   Размеры задаются здесь и перекрывают размеры из разделов выше.
   Мобилки — до 704px, планшет — 705–1100px, десктоп — от 1101px.
     h1                         20 / 32 / 40
     h2                         20 / 24 / 32
     h3                         16 / 18 / 20
     основной текст, поля ввода 15 / 16 / 16  (и текст кнопок, подпись у «7 дней»)
     мелкий текст               13 / 14 / 14  (согласие, дата новости, рейтинг)
     бирки раздела              12 на всех
     акцент в карточке-предложении («7 дней», «Скидка до 20%») — как h2
   Высота строк везде относительная (1.3 и т.п.) — уменьшается вместе со шрифтом.
   ========================================================================== */

.main-page {
    --main-page-fs-h1: 20px;
    --main-page-fs-h2: 20px;
    --main-page-fs-h3: 16px;
    --main-page-fs-body: 15px;
    --main-page-fs-small: 13px;
    --main-page-fs-num: 20px;      /* цифры статистики и рейтинга */
}

@media (min-width: 705px) {
    .main-page {
        --main-page-fs-h1: 32px;
        --main-page-fs-h2: 24px;
        --main-page-fs-h3: 18px;
        --main-page-fs-body: 16px;
        --main-page-fs-small: 14px;
        --main-page-fs-num: 24px;
    }
}

@media (min-width: 1101px) {
    .main-page {
        --main-page-fs-h1: 40px;
        --main-page-fs-h2: 32px;
        --main-page-fs-h3: 20px;
    }
}

.main-page .main-page__hero-title {
    font-size: var(--main-page-fs-h1);
}

.main-page .main-page__h2 {
    font-size: var(--main-page-fs-h2);
}

.main-page .main-page__zone-card-title,
.main-page .main-page__dir-card-title,
.main-page .main-page__trainer-name,
.main-page .main-page__news-card-title,
.main-page .main-page__cards-title,
.main-page .main-page__map-label-title {
    font-size: var(--main-page-fs-h3);
}

.main-page .main-page__hero-descr p,
.main-page .main-page__zones-text p,
.main-page .main-page__cards-lines p,
.main-page .main-page__cards-sub,
.main-page .main-page__zone-card-descr,
.main-page .main-page__dir-card-text,
.main-page .main-page__trainer-role,
.main-page .main-page__form-sub,
.main-page .main-page__form-label,
.main-page .main-page__advantages-label,
.main-page .main-page__map-label-text,
.main-page .main-page__contact-label,
.main-page .main-page__contact-value,
.main-page .main-page__contact-phone,
.main-page .main-page__input,
.main-page .main-page__mform .main-page__input,
.main-page .main-page__mform .main-page__form-label,
.main-page .main-page__btn:not(.main-page__all-btn) .main-page__btn-text {
    font-size: var(--main-page-fs-body);
}

/* Кнопка «Все …» в последней карточке слайдера — мельче остальных (13–15px); на 466–704 была 16px */
@media (min-width: 466px) and (max-width: 704px) {
    .main-page .main-page__all-btn .main-page__btn-text {
        font-size: var(--main-page-fs-body);
    }
}

/* Преимущества в плашках с формами: размер основного текста, полужирный 500 на всех экранах */
.main-page .main-page__form-benefit,
.main-page .main-page__form-benefit * {
    font-size: var(--main-page-fs-body);
    font-weight: 500;
}

.main-page .main-page__check-text,
.main-page .main-page__check-text a,
.main-page .main-page__mform .main-page__check-text,
.main-page .main-page__news-card-date {
    font-size: var(--main-page-fs-small);
}

.main-page .main-page__offer .main-page__offer-title {
    font-size: var(--main-page-fs-h2);
}

.main-page .main-page__offer .main-page__offer-sub {
    font-size: var(--main-page-fs-body);
}

.main-page .main-page__tag-text {
    font-size: 12px;
}

.main-page .main-page__advantages-value,
.main-page .main-page__rating-value {
    font-size: var(--main-page-fs-num);
}

.main-page .main-page__advantages-value sup {
    font-size: 0.645em;   /* «м²»: доля от цифры, как было (12.9 / 20) */
}

/* Рейтинг Яндекса: на 320–465 подписи и так мелкие (10 и 13px) — не трогаем */
@media (min-width: 466px) {
    .main-page .main-page__rating-caption,
    .main-page .main-page__rating-reviews {
        font-size: var(--main-page-fs-small);
    }
}

/* Интерактивная карта на 1321–1680: холст шире экрана — режем только по горизонтали;
   по вертикали не режем, иначе нижняя подпись («Кафе здорового питания») обрезалась на 6px.
   Пунктиры к зонам нарисованы под ширину заголовков из макета, а в браузере заголовки шире —
   горизонтальный отрезок заходил под текст. Срезаем его конец у подписи (clip-path, без искажения
   наклона), до текста — 8px */
@media (min-width: 1321px) and (max-width: 1680px) {
    .main-page .main-page__map-canvas {
        overflow: visible;
        overflow-x: clip;
    }

    .main-page .main-page__map-line--gym {
        clip-path: inset(-2px -2px -2px 79px);    /* «Тренажёрный зал»: линия заходила под текст на 71px */
    }

    .main-page .main-page__map-line--fight {
        clip-path: inset(-2px -2px -2px 52px);    /* «Бойцовский клуб»: на 44px */
    }

    .main-page .main-page__map-line--spa {
        clip-path: inset(-2px 13px -2px -2px);    /* «SPA & wellness»: на 5px */
    }

    .main-page .main-page__map-line--kids {
        clip-path: inset(-2px 8px -2px -2px);     /* «Детский клуб»: вплотную */
    }

    .main-page .main-page__map-line--pool {
        clip-path: inset(-2px 3px -2px -2px);     /* «Бассейн 25 м»: зазор 5px → 8px */
    }
}

/* С 1681px холст карты свой (1920): там вплотную только две подписи — тоже до 8px */
@media (min-width: 1681px) {
    .main-page .main-page__map-line--fight {
        clip-path: inset(-2px -2px -2px 5px);     /* «Бойцовский клуб»: зазор 3px */
    }

    .main-page .main-page__map-line--spa {
        clip-path: inset(-2px 2px -2px -2px);     /* «SPA & wellness»: зазор 6px */
    }
}

/* ==========================================================================
   Движение (доводка перед выкаткой, по ТЗ Паши):
   - переходы состояний (hover / click / focus) — 0.3s ease-in-out везде;
   - первый экран при загрузке: фото проявляется, затем слева — заголовок, текст, кнопки,
     справа — рейтинг Яндекса, снизу — плашка с преимуществами;
   - остальные блоки выезжают слева, когда до них доскроллили (один раз; main-page.js, initReveal);
     слайдеры начинают листаться только после того, как их блок выехал.
   Анимации появления задают только начальное состояние (@keyframes from) и не держат конечное —
   после них у блоков остаются их обычные стили (параллакс, sticky, transform из разделов выше).
   ========================================================================== */

.main-page {
    --main-page-t: 0.3s;                 /* переходы состояний */
    --main-page-ease: ease-in-out;
    --main-page-reveal-t: 0.6s;          /* выезд блока при прокрутке */
    --main-page-intro-t: 0.9s;           /* выезд текста и плашек первого экрана — медленнее и плавнее */
    --main-page-reveal-shift: 40px;      /* откуда выезжает блок */
}

@media (min-width: 705px) {
    .main-page {
        --main-page-reveal-shift: 60px;
    }
}

/* ---------- Состояния: кнопки ---------- */

.main-page .main-page__btn {
    transition: background-color var(--main-page-t) var(--main-page-ease),
                border-color var(--main-page-t) var(--main-page-ease),
                color var(--main-page-t) var(--main-page-ease);
}

.main-page .main-page__btn-icon {
    transition: background-color var(--main-page-t) var(--main-page-ease);
}

.main-page .main-page__check-text a {
    transition: color var(--main-page-t) var(--main-page-ease);
}

/* ---------- Состояния: стрелки слайдеров — как кнопка «Видео презентация» ---------- */

.main-page .main-page__arrow {
    color: var(--main-page-white);
    transition: border-color var(--main-page-t) var(--main-page-ease),
                color var(--main-page-t) var(--main-page-ease);
}

.main-page .main-page__arrow:hover {
    border-color: var(--main-page-blue-200);
    color: var(--main-page-blue-200);
}

.main-page .main-page__arrow:active {
    border-color: var(--main-page-blue-600);
    color: var(--main-page-blue-600);
}

/* ---------- Состояния: буллиты ----------
   Перелив заливки в сторону листания: у прежнего буллита заливка стекает в сторону хода,
   новый наполняется с противоположной стороны — с небольшой задержкой, как одна перетекающая капля.
   Вперёд (и с последнего на первый по кругу): прежний стекает вправо, новый наполняется слева;
   назад (и с первого на последний): зеркально. Направление — класс is-back на буллитах (main-page.js).
   Наведение — буллит подсвечивается, нажатие — темнее; фокус с клавиатуры — рамка, как у кнопок. */

.main-page .main-page__slider-ready .main-page__bullets-item {
    transition: background-color var(--main-page-t) var(--main-page-ease);
}

.main-page .main-page__slider-ready .main-page__bullets-item::after {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: auto;
    border-radius: 100px;
    background: linear-gradient(to right, #00a0e3, rgba(0, 160, 227, 0.4));
    transform: scaleX(0);
    transform-origin: right center;                  /* вперёд: прежний стекает вправо */
    transition: transform var(--main-page-t) var(--main-page-ease),
                opacity var(--main-page-t) var(--main-page-ease);
}

.main-page .main-page__slider-ready .main-page__bullets-item.is-active::after {
    right: 0;
    width: auto;
    transform: scaleX(1);
    transform-origin: left center;                   /* вперёд: новый наполняется слева */
    transition-delay: 0.1s;                          /* начинает наполняться, пока прежний ещё стекает */
}

.main-page .main-page__bullets.is-back .main-page__bullets-item::after {
    transform-origin: left center;                   /* назад: прежний стекает влево */
}

.main-page .main-page__bullets.is-back .main-page__bullets-item.is-active::after {
    transform-origin: right center;                  /* назад: новый наполняется справа */
}

@media (hover: hover) {
    .main-page .main-page__slider-ready .main-page__bullets-item:not(.is-active):hover {
        background-color: var(--main-page-blue-800);
    }

    .main-page .main-page__slider-ready .main-page__bullets-item.is-active:hover::after {
        opacity: 0.8;
    }
}

.main-page .main-page__slider-ready .main-page__bullets-item:not(.is-active):active {
    background-color: var(--main-page-blue-600);
}

.main-page .main-page__slider-ready .main-page__bullets-item:focus-visible {
    outline: 2px solid var(--main-page-focus);
    outline-offset: 2px;
}

/* ---------- Появление ---------- */

@keyframes main-page__fade-in {
    from { opacity: 0; }
}

@keyframes main-page__photo-in {
    from { scale: 1.1; }
}

@keyframes main-page__from-left {
    from { opacity: 0; transform: translateX(calc(-1 * var(--main-page-reveal-shift))); }
}

@keyframes main-page__from-right {
    from { opacity: 0; transform: translateX(var(--main-page-reveal-shift)); }
}

@keyframes main-page__from-bottom {
    from { opacity: 0; transform: translateY(var(--main-page-reveal-shift)); }
}

@media (prefers-reduced-motion: no-preference) {
    /* Первый экран: сразу при загрузке, по очереди.
       Фото — плавно проявляется и «отъезжает» (scale, а не transform: у фото на телефонах свой transform) */
    .main-page__hero-bg {
        animation: main-page__fade-in 1s var(--main-page-ease) backwards;
    }

    .main-page__hero-bg img {
        animation: main-page__photo-in 1.6s var(--main-page-ease) backwards;
    }

    /* интервалы: текст → кнопки 0.15s, кнопки → рейтинг 0.45s, рейтинг → преимущества 0.4s */
    .main-page__hero-text {
        animation: main-page__from-left var(--main-page-intro-t) var(--main-page-ease) 0.3s backwards;
    }

    .main-page__hero-buttons {
        animation: main-page__from-left var(--main-page-intro-t) var(--main-page-ease) 0.45s backwards;
    }

    .main-page__rating {
        animation: main-page__from-right var(--main-page-intro-t) var(--main-page-ease) 0.9s backwards;
    }

    .main-page__advantages {
        animation: main-page__from-bottom var(--main-page-intro-t) var(--main-page-ease) 1.3s backwards;
    }

    /* Остальные блоки: скрыты, пока до них не доскроллили (класс ставит main-page.js — без JS всё видно) */
    .main-page .main-page__reveal:not(.is-revealed) {
        opacity: 0;
    }

    .main-page .main-page__reveal.is-revealed {
        animation: main-page__from-left var(--main-page-reveal-t) var(--main-page-ease) var(--main-page-reveal-delay, 0s) backwards;
    }
}

/* ==========================================================================
   Карточка тренера: тёмная плашка-градиент под текстом (как нижний градиент у «Направлений»).
   Раскладка карточки прежняя (бирка → фото → имя и должность); плашка — псевдоэлемент блока текста:
   под текстом сплошной тёмный фон, выше — плавно растворяется и накрывает обрезанный низ фото.
   Слои: фото → плашка → текст. Длина растворения — по высоте фото на разных ширинах.
   ========================================================================== */

a.main-page__trainer {
    color: inherit;
    text-decoration: none;
}

.main-page .main-page__trainer {
    --main-page-trainer-fade: 60px;
}

.main-page .main-page__trainer-info {
    z-index: 1;
}

.main-page .main-page__trainer-info::before {
    content: '';
    position: absolute;
    top: calc(-1 * var(--main-page-trainer-fade));
    right: 0;
    bottom: 0;
    left: 0;
    z-index: -1;
    background: linear-gradient(to bottom, rgba(8, 14, 25, 0) 0, var(--main-page-card-dark) var(--main-page-trainer-fade));
    pointer-events: none;
}

@media (min-width: 466px) {
    .main-page .main-page__trainer {
        --main-page-trainer-fade: 90px;
    }
}

/* 1101–1320: карточки небольшие, фото ~140–240px — растворение короче */
@media (min-width: 1101px) {
    .main-page .main-page__trainer {
        --main-page-trainer-fade: 45px;
    }
}

@media (min-width: 1321px) {
    .main-page .main-page__trainer {
        --main-page-trainer-fade: 70px;
    }
}

@media (min-width: 1681px) {
    .main-page .main-page__trainer {
        --main-page-trainer-fade: 100px;
    }
}

/* ==========================================================================
   Первый экран: доводка
   ========================================================================== */

/* Заголовок — ширина в em (растёт со шрифтом): у Академки переносы прежние, у Коммунарки — как в макете
   («Escalada Коммунарка / премиум фитнес-клуб / с бассейном и SPA») */
@media (min-width: 705px) {
    .main-page .main-page__hero-title {
        max-width: 16.5em;
    }
}

/* Описание Коммунарки на широких экранах: две строки, по предложениям (без висячего «к целям») */
@media (min-width: 1681px) {
    .main-page .main-page__hero-descr--short {
        max-width: 608px;
    }
}

/* До 1100px первый экран — колонка: текст сверху, рейтинг, кнопки и преимущества прижаты к низу.
   Высота — по экрану: низ кнопок — на 90px выше низа экрана (svh — с учётом адресной строки телефона;
   90px — место под круглую кнопку чата Roistat в правом нижнем углу, чтобы не накрывала «Видео презентация»),
   преимущества — сразу под экраном. --main-page-hero-tail — высота всего, что ниже кнопок (main-page.js).
   Низкий экран: рейтинг встаёт под текст с отступом 30px */
@media (max-width: 1100px) {
    .main-page .main-page__hero-main {
        min-height: calc(100vh - var(--main-page-header) - 90px + var(--main-page-hero-tail, 0px));
        min-height: calc(100svh - var(--main-page-header) - 90px + var(--main-page-hero-tail, 0px));
    }

    .main-page .main-page__hero-text {
        margin-bottom: 30px;
    }

    /* преимущества — ровно под экраном: отступ от кнопок = место под кнопку чата */
    .main-page .main-page__advantages {
        margin-top: 90px;
    }
}

/* Низкие телефоны (экран до 740px в высоту): отступы плотнее, чтобы кнопки поместились в первый экран
   (на 320×568 весь первый экран всё равно не влезает — текст сам занимает ~400px) */
@media (max-width: 704px) and (max-height: 740px) {
    .main-page .main-page__hero-main {
        padding-top: 24px;
    }

    .main-page .main-page__hero-text {
        margin-bottom: 16px;
    }

    .main-page .main-page__hero-buttons {
        gap: 10px;
        margin-top: 16px;
    }
}

/* Плашка «Яндекс»: наклон за курсором (main-page.js, initRatingTilt) */
.main-page__rating.is-tilting {
    will-change: transform;
}

/* Первый экран, ПК: чёрный слева — до правого края кнопки «Видео презентация» + 15px (меряет main-page.js,
   --main-page-hero-dark; без JS — 43%); дальше прежний плавный переход в фото (~38% ширины, не дальше 92%) */
@media (min-width: 1101px) {
    .main-page .main-page__hero-bg::after {
        --main-page-hero-dark-at: var(--main-page-hero-dark, 43%);
        background: linear-gradient(90deg,
                    #000 var(--main-page-hero-dark-at),
                    rgba(1, 1, 1, 0.1) min(calc(var(--main-page-hero-dark-at) + 38%), 92%),
                    #010101 99.948%);
    }
}

/* ==========================================================================
   Новости: на ПК (от 1101px) — 3 карточки, на планшете и телефоне — 2.
   Фото — не фиксированной высоты, а по пропорции: карточки стали уже, фото не вытягивается в столб.
   Шрифты — прежние (шкала), длинный заголовок на узких карточках — не больше 4 строк.
   ========================================================================== */

.main-page .main-page__news-list > .main-page__news-card {
    flex: 0 0 calc((100% - var(--main-page-news-gap, 20px)) / 2);
}

.main-page .main-page__news-list {
    gap: var(--main-page-news-gap, 20px);
}

.main-page .main-page__news-card-photo {
    height: auto;
    aspect-ratio: 1 / 1;
}

.main-page .main-page__news-card-title {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    overflow: hidden;
}

@media (max-width: 465px) {
    .main-page .main-page__news-list {
        --main-page-news-gap: 10px;
    }
}

/* Телефон: карточки узкие (135–200px) — длинное слово переносится по слогам (телефонные браузеры
   знают русские переносы), а если не может — просто разрывается, но не вылезает за карточку */
@media (max-width: 465px) {
    .main-page .main-page__news-card-title {
        -webkit-hyphens: auto;
        hyphens: auto;
        overflow-wrap: break-word;
    }
}

/* 320–355: карточка ~135px — заголовок 14px, иначе «Академическая» не помещается в строку целиком */
@media (max-width: 355px) {
    .main-page .main-page__news-card-title {
        font-size: 14px;
    }
}

@media (min-width: 705px) {
    .main-page .main-page__news-card-photo {
        aspect-ratio: 4 / 3;
    }
}

@media (min-width: 1101px) {
    .main-page .main-page__news-list > .main-page__news-card {
        flex: 0 0 calc((100% - 2 * var(--main-page-news-gap, 20px)) / 3);
    }

    .main-page .main-page__news-card-photo {
        aspect-ratio: 16 / 11;
    }

    .main-page .main-page__news-card-title {
        -webkit-line-clamp: 3;
    }
}

/* Первый экран, ПК (от 1101px): верх кнопок «Посетить клуб» / «Видео презентация» — на уровне верха плашки
   «Яндекс» (она стоит абсолютно, top 600px от верха блока). Блок с текстом — не ниже этой отметки (600 − 120px
   отступ сверху + 55px высота кнопок), кнопки прижаты к его низу; текст длиннее — кнопки просто ниже */
@media (min-width: 1101px) {
    .main-page .main-page__hero-content {
        min-height: calc(600px - 120px + 55px);
    }

    .main-page .main-page__hero-buttons {
        margin-top: auto;
    }
}

/* Плашка «Яндекс» на планшетах и телефонах — компактнее (на ПК без изменений):
   планшет 466–1100px — ~220×112 (было 280×140), телефон до 465px — ~170×94 (было 200×110) */
@media (min-width: 466px) and (max-width: 1100px) {
    .main-page .main-page__rating {
        width: 220px;
        height: auto;
        padding: 14px 16px;
        border-radius: 16px;
    }

    .main-page .main-page__rating-top {
        width: auto;
        gap: 10px;
    }

    .main-page .main-page__rating-top img {
        width: 80px;
        height: 23px;
    }

    .main-page .main-page__rating-caption {
        width: 92px;
        font-size: 12px;
        line-height: 1.15;
    }

    .main-page .main-page__rating-mark {
        gap: 4px;
        margin-top: 10px;
    }

    .main-page .main-page__rating-value {
        gap: 10px;
        font-size: 20px;
    }

    .main-page .main-page__rating-value img {
        width: 72px;
        height: auto;
    }

    .main-page .main-page__rating-reviews {
        font-size: 12px;
    }
}

@media (max-width: 465px) {
    .main-page .main-page__rating {
        width: 170px;
        height: auto;
        padding: 12px 14px;
        border-radius: 14px;
    }

    .main-page .main-page__rating-top {
        gap: 8px;
    }

    .main-page .main-page__rating-top img {
        width: 52px;
        height: 15px;
    }

    .main-page .main-page__rating-caption {
        width: 54px;
        font-size: 9px;
    }

    .main-page .main-page__rating-mark {
        gap: 3px;
        margin-top: 8px;
    }

    .main-page .main-page__rating-value {
        gap: 8px;
        font-size: 17px;
    }

    .main-page .main-page__rating-value img {
        width: 62px;
        height: auto;
    }

    .main-page .main-page__rating-reviews {
        font-size: 11px;
    }
}

/* Плашка «Яндекс» со ссылкой на отзывы (заполнено свойство YANDEX_URL инфоблока main_page_rating) */
a.main-page__rating {
    display: block;
    color: inherit;
    text-decoration: none;
}

/* ==========================================================================
   «Видео презентация» — окно с плеером (js/pages/main-page.js, MainPageVideo)
   Плашка и фон — как у окна заявки (.main-page__mform), плеер — Plyr (js/vendor/plyr/plyr.css)
   ========================================================================== */

.main-page__vmodal {
    position: fixed;
    inset: 0;
    z-index: 9990;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    overflow-y: auto;
    overscroll-behavior: contain;
}

.main-page__vmodal[hidden] {
    display: none;
}

.main-page__vmodal-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 10, 14, 0.5);
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
}

.main-page__vmodal-dialog {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 20px;
    width: 100%;
    /* видео 16:9 должно влезать по высоте: экран минус отступы окна, шапка и поля плашки (~160px) */
    max-width: min(1120px, calc((100vh - 160px) * 16 / 9 + 52px));
    max-width: min(1120px, calc((100dvh - 160px) * 16 / 9 + 52px));
    margin: auto;
    padding: 24px;
    border: 2px solid transparent;
    border-radius: 20px;
    background: linear-gradient(#080e19, #080e19) padding-box,
                linear-gradient(107deg, rgba(0, 160, 227, 0.3) 1%, rgba(0, 160, 227, 0) 139%) border-box;
    outline: none;
    opacity: 0;
    transform: translateY(24px) scale(0.97);
    transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
}

.main-page__vmodal.is-open .main-page__vmodal-overlay,
.main-page__vmodal.is-open .main-page__vmodal-dialog {
    opacity: 1;
    transform: none;
}

.main-page__vmodal-head {
    display: flex;
    align-items: center;
    min-height: 20px;
    padding-right: 36px;
}

.main-page__vmodal-title {
    font-family: 'Fedra Sans Pro', Tahoma, sans-serif;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.3;
    color: var(--main-page-white);
    text-transform: uppercase;
}

.main-page__vmodal .main-page__vmodal-close {
    top: 26px;
    right: 24px;
}

/* Кадр 16:9: пока грузится — обложка и спиннер; нет ролика или ошибка — сообщение поверх */

.main-page__vmodal-frame {
    position: relative;
    aspect-ratio: 16 / 9;
    border-radius: 14px;
    overflow: hidden;
    background: #000 center / cover no-repeat;
}

.main-page__vmodal-player,
.main-page__vmodal-player .plyr {
    position: absolute;
    inset: 0;
    height: 100%;
}

.main-page__vmodal-player video {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.main-page__vmodal .plyr {
    --plyr-color-main: var(--main-page-blue-line);
    --plyr-font-family: Tahoma, Verdana, 'Segoe UI', sans-serif;
    --plyr-video-background: #000;
    --plyr-control-radius: 8px;
    --plyr-menu-background: rgba(8, 14, 25, 0.95);
    --plyr-menu-color: var(--main-page-white);
    --plyr-menu-arrow-color: var(--main-page-white);
    --plyr-tooltip-background: rgba(8, 14, 25, 0.95);
    --plyr-tooltip-color: var(--main-page-white);
}

.main-page__vmodal-spinner {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 48px;
    height: 48px;
    margin: -24px 0 0 -24px;
    border: 3px solid rgba(237, 247, 251, 0.25);
    border-top-color: var(--main-page-blue-line);
    border-radius: 50%;
    animation: main-page__vmodal-spin 0.9s linear infinite;
    display: none;
}

.main-page__vmodal-frame[data-state="loading"] .main-page__vmodal-spinner {
    display: block;
}

@keyframes main-page__vmodal-spin {
    to { transform: rotate(360deg); }
}

.main-page__vmodal-note {
    display: none;
}

.main-page__vmodal-frame[data-state="missing"],
.main-page__vmodal-frame[data-state="error"] {
    display: flex;
    aspect-ratio: auto;
    min-height: min(56.25vw, 594px);
    background-image: radial-gradient(ellipse at 50% 0%, #1d3049 0%, #0b1422 75%) !important;
}

.main-page__vmodal-frame[data-state="missing"] .main-page__vmodal-player,
.main-page__vmodal-frame[data-state="error"] .main-page__vmodal-player {
    display: none;
}

.main-page__vmodal-frame[data-state="missing"] .main-page__vmodal-note,
.main-page__vmodal-frame[data-state="error"] .main-page__vmodal-note {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 16px;
    width: 100%;
    padding: 40px 24px;
    text-align: center;
    animation: main-page__vmodal-note-in 0.4s ease both;
}

@keyframes main-page__vmodal-note-in {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: none; }
}

.main-page__vmodal-note-icon {
    width: 56px;
    height: 56px;
    fill: none;
    stroke: var(--main-page-blue-200);
    stroke-width: 2;
    stroke-linejoin: round;
}

.main-page__vmodal-note-title {
    font-family: 'Fedra Sans Pro', Tahoma, sans-serif;
    font-size: 26px;
    font-weight: 700;
    line-height: 1.25;
    color: var(--main-page-white);
    text-transform: uppercase;
}

.main-page__vmodal-note-text {
    max-width: 520px;
    font-family: Tahoma, Verdana, 'Segoe UI', sans-serif;
    font-size: 16px;
    line-height: 1.5;
    color: #d1d1d1;
}

.main-page__vmodal-note-btn {
    margin-top: 8px;
}

@media (max-width: 767px) {
    .main-page__vmodal {
        padding: 10px;
    }

    .main-page__vmodal-dialog {
        gap: 14px;
        padding: 16px;
    }

    .main-page__vmodal .main-page__vmodal-close {
        top: 16px;
        right: 16px;
    }

    .main-page__vmodal-title {
        font-size: 15px;
    }

    .main-page__vmodal-frame {
        border-radius: 10px;
    }

    .main-page__vmodal-frame[data-state="missing"],
    .main-page__vmodal-frame[data-state="error"] {
        min-height: 0;
    }

    .main-page__vmodal-frame[data-state="missing"] .main-page__vmodal-note,
    .main-page__vmodal-frame[data-state="error"] .main-page__vmodal-note {
        gap: 12px;
        padding: 32px 18px;
    }

    .main-page__vmodal-note-icon {
        width: 44px;
        height: 44px;
    }

    .main-page__vmodal-note-title {
        font-size: 19px;
    }

    .main-page__vmodal-note-text {
        font-size: 14px;
    }
}

/* End */


/* Start:/local/templates/escalada/js/vendor/jquery.formstyler.css?17915438622175*/
.jq-checkbox,
.jq-radio {
	position: relative;
	display: inline-block;
	overflow: hidden;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}
.jq-checkbox input,
.jq-radio input {
	position: absolute;
	z-index: -1;
	margin: 0;
	padding: 0;
	opacity: 0;
}
.jq-file {
	position: relative;
	display: inline-block;
	overflow: hidden;
}
.jq-file input {
	position: absolute;
	top: 0;
	right: 0;
	height: auto;
	margin: 0;
	padding: 0;
	opacity: 0;
	font-size: 100px;
	line-height: 1em;
}
.jq-file__name {
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}
.jq-selectbox,
.jq-select-multiple {
	position: relative;
	display: inline-block;
}
.jq-selectbox select,
.jq-select-multiple select {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	opacity: 0;
}
.jq-selectbox li,
.jq-select-multiple li {
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	white-space: nowrap;
}
.jq-selectbox {
	z-index: 10;
}
.jq-selectbox__select {
	position: relative;
}
.jq-selectbox__select-text {
	overflow: hidden;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	white-space: nowrap;
	text-overflow: ellipsis;
}
.jq-selectbox__dropdown {
	position: absolute;
}
.jq-selectbox__search input {
	-webkit-appearance: textfield;
}
.jq-selectbox__search input::-webkit-search-cancel-button,
.jq-selectbox__search input::-webkit-search-decoration {
	-webkit-appearance: none;
}
.jq-selectbox__dropdown ul {
	position: relative;
	overflow: auto;
	overflow-x: hidden;
	list-style: none;
	-webkit-overflow-scrolling: touch;
}
.jq-select-multiple ul {
	position: relative;
	overflow-x: hidden;
	-webkit-overflow-scrolling: touch;
}
.jq-number {
	display: inline-block;
}
.jq-number__field input {
	-moz-appearance: textfield;
	text-align: left; /* для Opera Presto */
}
.jq-number__field input::-webkit-inner-spin-button,
.jq-number__field input::-webkit-outer-spin-button {
	margin: 0; /* в каких-то браузерах присутствует отступ */
	-webkit-appearance: none;
}
/* End */


/* Start:/local/templates/escalada/js/vendor/jquery.formstyler.theme.css?179154386210882*/
.jq-checkbox,
.jq-radio {
	vertical-align: -4px;
	width: 25px;
	height: 25px;
	margin: 0 4px 0 0;
	/*border: 1px solid #C3C3C3;*/
	/*background: linear-gradient(#FFF, #E6E6E6);*/
	border: 1px solid #212328;
	background-color: #fff;
	/*box-shadow: 0 1px 1px rgba(0,0,0,.05), inset -1px -1px #FFF, inset 1px -1px #FFF;*/
	cursor: pointer;
}
.jq-checkbox.focused,
.jq-radio.focused {
	/*border: 1px solid #08C;*/
}
.jq-checkbox.disabled,
.jq-radio.disabled {
	opacity: .55;
}
.jq-checkbox {
	border-radius: 3px;
}
.jq-checkbox.checked {
	border: 1px solid #3C8CDD;
	background-color: #3C8CDD;
}
.jq-checkbox.checked .jq-checkbox__div {
	width: 16px;
	height: 8px;
	margin: 5px 0 0 4px;
	border-bottom: 2px solid #fff;
	border-left: 2px solid #fff;
	-webkit-transform: rotate(-50deg);
	transform: rotate(-50deg);
}
.jq-radio {
	border-radius: 50%;
}
.jq-radio.checked .jq-radio__div {
	width: 10px;
	height: 10px;
	margin: 3px 0 0 3px;
	border-radius: 50%;
	background: #777;
	box-shadow: inset 1px 1px 1px rgba(0,0,0,.7);
}
.jq-file {
	width: 270px;
	border-radius: 4px;
	box-shadow: 0 1px 2px rgba(0,0,0,.1);
}
.jq-file input {
	cursor: pointer;
}
.jq-file__name {
	box-sizing: border-box;
	width: 100%;
	height: 34px;
	padding: 0 80px 0 10px;
	border: 1px solid #CCC;
	border-bottom-color: #B3B3B3;
	border-radius: 4px;
	background: #FFF;
	box-shadow: inset 1px 1px #F1F1F1;
	font: 14px/32px Arial, sans-serif;
	color: #333;
}
.jq-file__browse {
	position: absolute;
	top: 1px;
	right: 1px;
	padding: 0 10px;
	border-left: 1px solid #CCC;
	border-radius: 0 4px 4px 0;
	background: linear-gradient(#FFF, #E6E6E6);
	box-shadow: inset 1px -1px #F1F1F1, inset -1px 0 #F1F1F1, 0 1px 2px rgba(0,0,0,.1);
	font: 14px/32px Arial, sans-serif;
	color: #333;
	text-shadow: 1px 1px #FFF;
}
.jq-file:hover .jq-file__browse {
	background: linear-gradient(#F6F6F6, #E6E6E6);
}
.jq-file:active .jq-file__browse {
	background: #F5F5F5;
	box-shadow: inset 1px 1px 3px #DDD;
}
.jq-file.focused .jq-file__name {
	border: 1px solid #5794BF;
}
.jq-file.disabled,
.jq-file.disabled .jq-file__name,
.jq-file.disabled .jq-file__browse {
	border-color: #CCC;
	background: #F5F5F5;
	box-shadow: none;
	color: #888;
}
.jq-number {
	position: relative;
	vertical-align: middle;
	padding: 0 36px 0 0;
}
.jq-number__field {
	width: 100px;
	border: 1px solid #CCC;
	border-bottom-color: #B3B3B3;
	border-radius: 4px;
	box-shadow: inset 1px 1px #F1F1F1, 0 1px 2px rgba(0,0,0,.1);
}
.jq-number__field:hover {
	border-color: #B3B3B3;
}
.jq-number__field input {
	box-sizing: border-box;
	width: 100%;
	padding: 8px 9px;
	border: none;
	outline: none;
	background: none;
	font: 14px Arial, sans-serif;
	color: #333;
}
.jq-number__spin {
	position: absolute;
	top: 0;
	right: 0;
	width: 32px;
	height: 14px;
	border: 1px solid #CCC;
	border-bottom-color: #B3B3B3;
	border-radius: 4px;
	background: linear-gradient(#FFF, #E6E6E6);
	box-shadow: 0 1px 2px rgba(0,0,0,.1);
	box-shadow: inset 1px -1px #F1F1F1, inset -1px 0 #F1F1F1, 0 1px 2px rgba(0,0,0,.1);
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	text-shadow: 1px 1px #FFF;
	cursor: pointer;
}
.jq-number__spin.minus {
	top: auto;
	bottom: 0;
}
.jq-number__spin:hover {
	background: linear-gradient(#F6F6F6, #E6E6E6);
}
.jq-number__spin:active {
	background: #F5F5F5;
	box-shadow: inset 1px 1px 3px #DDD;
}
.jq-number__spin:after {
	content: '';
	position: absolute;
	top: 4px;
	left: 11px;
	width: 0;
	height: 0;
	border-right: 5px solid transparent;
	border-bottom: 5px solid #999;
	border-left: 5px solid transparent;
}
.jq-number__spin.minus:after {
	top: 5px;
	border-top: 5px solid #999;
	border-right: 5px solid transparent;
	border-bottom: none;
	border-left: 5px solid transparent;
}
.jq-number__spin.minus:hover:after {
	border-top-color: #000;
}
.jq-number__spin.plus:hover:after {
	border-bottom-color: #000;
}
.jq-number.focused .jq-number__field {
	border: 1px solid #5794BF;
}
.jq-number.disabled .jq-number__field,
.jq-number.disabled .jq-number__spin {
	border-color: #CCC;
	background: #F5F5F5;
	box-shadow: none;
	color: #888;
}
.jq-number.disabled .jq-number__spin:after {
	border-bottom-color: #AAA;
}
.jq-number.disabled .jq-number__spin.minus:after {
	border-top-color: #AAA;
}
.jq-selectbox {
	vertical-align: middle;
	cursor: pointer;
}
.jq-selectbox__select {
	height: 32px;
	padding: 0 45px 0 10px;
	border: 1px solid #CCC;
	border-bottom-color: #B3B3B3;
	border-radius: 4px;
	background: linear-gradient(#FFF, #E6E6E6);
	box-shadow: inset 1px -1px #F1F1F1, inset -1px 0 #F1F1F1, 0 1px 2px rgba(0,0,0,.1);
	font: 14px/32px Arial, sans-serif;
	color: #333;
	text-shadow: 1px 1px #FFF;
}
.jq-selectbox__select:hover {
	background: linear-gradient(#F6F6F6, #E6E6E6);
}
.jq-selectbox__select:active {
	background: #F5F5F5;
	box-shadow: inset 1px 1px 3px #DDD;
}
.jq-selectbox.focused .jq-selectbox__select {
	border: 1px solid #5794BF;
}
.jq-selectbox.disabled .jq-selectbox__select {
	border-color: #CCC;
	background: #F5F5F5;
	box-shadow: none;
	color: #888;
}
.jq-selectbox__select-text {
	display: block;
	width: 100%;
}
.jq-selectbox .placeholder {
	color: #888;
}
.jq-selectbox__trigger {
	position: absolute;
	top: 0;
	right: 0;
	width: 34px;
	height: 100%;
	border-left: 1px solid #CCC;
}
.jq-selectbox__trigger-arrow {
	position: absolute;
	top: 14px;
	right: 12px;
	width: 0;
	height: 0;
	border-top: 5px solid #999;
	border-right: 5px solid transparent;
	border-left: 5px solid transparent;
}
.jq-selectbox:hover .jq-selectbox__trigger-arrow {
	border-top-color: #000;
}
.jq-selectbox.disabled .jq-selectbox__trigger-arrow {
	border-top-color: #AAA;
}
.jq-selectbox__dropdown {
	box-sizing: border-box;
	width: 100%;
	margin: 2px 0 0;
	padding: 0;
	border: 1px solid #CCC;
	border-radius: 4px;
	background: #FFF;
	box-shadow: 0 2px 10px rgba(0,0,0,.2);
	font: 14px/18px Arial, sans-serif;
}
.jq-selectbox__search {
	margin: 5px;
}
.jq-selectbox__search input {
	box-sizing: border-box;
	width: 100%;
	margin: 0;
	padding: 5px 27px 6px 8px;
	border: 1px solid #CCC;
	border-radius: 3px;
	outline: none;
	background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAMCAYAAABiDJ37AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAO1JREFUeNqU078LAXEYx/FzYfNzk5TJaFNKYjFYSQZ/hvwBsvg1UCY2xT9gM8hukQGThWRjkcFw3pdnujhfT736Xn2fPvfc3fd07V0OFDDFAnM0ENYsZRiGLSc9OpqIYIA9fMhhjCrW2h9VlMlcH/aymMGtOqEugX08PwQucUZKdTozMIqdTc9WepQD7wjY9ARx+ydwhfyXfS+S0qMcOEQJGcueB3VccFINdMgal6NzkmPjRwJXxDBB7/2RDdtAp6wb+dpphHDASG5QQ0V6u2aoSqBZD/lDrNWRJynLK2qpBn4rc6K2XB9/Nb8EGABtf1thzY6X2AAAAABJRU5ErkJggg==') no-repeat 100% 50%;
	box-shadow: inset 1px 1px #F1F1F1;
	color: #333;
}
.jq-selectbox__not-found {
	margin: 5px;
	padding: 5px 8px 6px;
	background: #F0F0F0;
	font-size: 13px;
}
.jq-selectbox ul {
	margin: 0;
	padding: 0;
}
.jq-selectbox li {
	min-height: 18px;
	padding: 5px 10px 6px;
	color: #231F20;
}
.jq-selectbox li.selected {
	background-color: #A3ABB1;
	color: #FFF;
}
.jq-selectbox li:hover {
	background-color: #08C;
	color: #FFF;
}
.jq-selectbox li.disabled {
	color: #AAA;
}
.jq-selectbox li.disabled:hover {
	background: none;
}
.jq-selectbox li.optgroup {
	font-weight: bold;
}
.jq-selectbox li.optgroup:hover {
	background: none;
	color: #231F20;
	cursor: default;
}
.jq-selectbox li.option {
	padding-left: 25px;
}
.jq-select-multiple {
	box-sizing: border-box;
	padding: 1px;
	border: 1px solid #CCC;
	border-bottom-color: #B3B3B3;
	border-radius: 4px;
	background: #FFF;
	box-shadow: inset 1px 1px #F1F1F1, 0 1px 2px rgba(0,0,0,.1);
	font: 14px/18px Arial, sans-serif;
	color: #333;
	cursor: default;
}
.jq-select-multiple.focused {
	border: 1px solid #5794BF;
}
.jq-select-multiple.disabled {
	border-color: #CCC;
	background: #F5F5F5;
	box-shadow: none;
	color: #888;
}
.jq-select-multiple ul {
	margin: 0;
	padding: 0;
}
.jq-select-multiple li {
	padding: 3px 9px 4px;
	list-style: none;
}
.jq-select-multiple li:first-child {
	border-radius: 3px 3px 0 0;
}
.jq-select-multiple li:last-child {
	border-radius: 0 0 3px 3px;
}
.jq-select-multiple li.selected {
	background: #08C;
	color: #FFF;
}
.jq-select-multiple li.disabled {
	color: #AAA;
}
.jq-select-multiple li.optgroup {
	font-weight: bold;
}
.jq-select-multiple li.option {
	padding-left: 25px;
}
.jq-select-multiple.disabled li.selected,
.jq-select-multiple li.selected.disabled {
	background: #CCC;
	color: #FFF;
}
input[type='email'].styler,
input[type='password'].styler,
input[type='search'].styler,
input[type='tel'].styler,
input[type='text'].styler,
input[type='url'].styler,
textarea.styler {
	padding: 8px 9px;
	border: 1px solid #CCC;
	border-bottom-color: #B3B3B3;
	border-radius: 4px;
	box-shadow: inset 1px 1px #F1F1F1, 0 1px 2px rgba(0,0,0,.1);
	font: 14px Arial, sans-serif;
	color: #333;
}
input[type='search'].styler {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}
textarea.styler {
	overflow: auto;
}
input[type='email'].styler:hover,
input[type='password'].styler:hover,
input[type='search'].styler:hover,
input[type='tel'].styler:hover,
input[type='text'].styler:hover,
input[type='url'].styler:hover,
textarea.styler:hover {
	border-color: #B3B3B3;
}
input[type='email'].styler:hover:focus,
input[type='password'].styler:hover:focus,
input[type='search'].styler:hover:focus,
input[type='tel'].styler:hover:focus,
input[type='text'].styler:hover:focus,
input[type='url'].styler:hover:focus,
textarea.styler:hover:focus {
	border-color: #CCC;
	border-top-color: #B3B3B3;
	outline: none;
	box-shadow: inset 0 1px 2px rgba(0,0,0,.1);
}
button.styler,
input[type='button'].styler,
input[type='submit'].styler,
input[type='reset'].styler {
	overflow: visible;
	padding: 8px 11px;
	border: 1px solid #CCC;
	border-bottom-color: #B3B3B3;
	border-radius: 4px;
	outline: none;
	background: linear-gradient(#FFF, #E6E6E6);
	box-shadow: inset 1px -1px #F1F1F1, inset -1px 0 #F1F1F1, 0 1px 2px rgba(0,0,0,.1);
	font: 14px Arial, sans-serif;
	color: #333;
	text-shadow: 1px 1px #FFF;
	cursor: pointer;
}
button.styler.styler::-moz-focus-inner,
input[type='button'].styler.styler::-moz-focus-inner,
input[type='submit'].styler.styler::-moz-focus-inner,
input[type='reset'].styler.styler::-moz-focus-inner {
	padding: 0;
	border: 0;
}
button.styler:not([disabled]):hover,
input[type='button'].styler:not([disabled]):hover,
input[type='submit'].styler:not([disabled]):hover,
input[type='reset'].styler:not([disabled]):hover,
input[type='reset'].styler:hover {
	background: linear-gradient(#F6F6F6, #E6E6E6);
}
button.styler:active,
input[type='button'].styler:active,
input[type='submit'].styler:active,
input[type='reset'].styler:active {
	background: #F5F5F5;
	box-shadow: inset 1px 1px 3px #DDD;
}
button.styler[disabled],
input[type='button'].styler[disabled],
input[type='submit'].styler[disabled] {
	border-color: #CCC;
	background: #F5F5F5;
	box-shadow: none;
	color: #888;
}
/* End */


/* Start:/local/templates/escalada/js/vendor/owl.carousel.css?17915438622880*/
.owl-carousel{display:none;width:100%;-webkit-tap-highlight-color:transparent;position:relative;z-index:1}.owl-carousel .owl-stage{position:relative;-ms-touch-action:pan-Y;-moz-backface-visibility:hidden}.owl-carousel .owl-stage:after{content:".";display:block;clear:both;visibility:hidden;line-height:0;height:0}.owl-carousel .owl-stage-outer{position:relative;overflow:hidden;-webkit-transform:translate3d(0,0,0)}.owl-carousel .owl-item,.owl-carousel .owl-wrapper{-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;-ms-backface-visibility:hidden;-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0)}.owl-carousel .owl-item{position:relative;min-height:1px;float:left;-webkit-backface-visibility:hidden;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none}.owl-carousel .owl-item img{display:block;width:100%}.owl-carousel .owl-dots.disabled,.owl-carousel .owl-nav.disabled{display:none}.owl-carousel .owl-dot,.owl-carousel .owl-nav .owl-next,.owl-carousel .owl-nav .owl-prev{cursor:pointer;cursor:hand;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.owl-carousel.owl-loaded{display:block}.owl-carousel.owl-loading{opacity:0;display:block}.owl-carousel.owl-hidden{opacity:0}.owl-carousel.owl-refresh .owl-item{visibility:hidden}.owl-carousel.owl-drag .owl-item{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.owl-carousel.owl-grab{cursor:move;cursor:grab}.owl-carousel.owl-rtl{direction:rtl}.owl-carousel.owl-rtl .owl-item{float:right}.no-js .owl-carousel{display:block}.owl-carousel .animated{animation-duration:1s;animation-fill-mode:both}.owl-carousel .owl-animated-in{z-index:0}.owl-carousel .owl-animated-out{z-index:1}.owl-carousel .fadeOut{animation-name:fadeOut}@keyframes fadeOut{0%{opacity:1}100%{opacity:0}}.owl-height{transition:height .5s ease-in-out}.owl-carousel .owl-item .owl-lazy{opacity:0;transition:opacity .4s ease}.owl-carousel .owl-item img.owl-lazy{transform-style:preserve-3d}.owl-carousel .owl-video-wrapper{position:relative;height:100%;background:#000}.owl-carousel .owl-video-play-icon{position:absolute;height:80px;width:80px;left:50%;top:50%;margin-left:-40px;margin-top:-40px;background:url(/local/templates/escalada/js/vendor/owl.video.play.png) no-repeat;cursor:pointer;z-index:1;-webkit-backface-visibility:hidden;transition:transform .1s ease}.owl-carousel .owl-video-play-icon:hover{-ms-transform:scale(1.3,1.3);transform:scale(1.3,1.3)}.owl-carousel .owl-video-playing .owl-video-play-icon,.owl-carousel .owl-video-playing .owl-video-tn{display:none}.owl-carousel .owl-video-tn{opacity:0;height:100%;background-position:center center;background-repeat:no-repeat;background-size:contain;transition:opacity .4s ease}.owl-carousel .owl-video-frame{position:relative;z-index:1;height:100%;width:100%}
/* End */


/* Start:/local/templates/escalada/js/vendor/fancybox/jquery.fancybox.css?179154386214323*/
@charset "UTF-8";.fancybox-enabled{overflow:hidden}.fancybox-enabled body{overflow:visible;height:100%}.fancybox-is-hidden{position:absolute;top:-9999px;left:-9999px;visibility:hidden}.fancybox-container{position:fixed;top:0;left:0;width:100%;height:100%;z-index:99993;-webkit-tap-highlight-color:transparent;-webkit-backface-visibility:hidden;backface-visibility:hidden;-webkit-transform:translateZ(0);transform:translateZ(0)}.fancybox-container~.fancybox-container{z-index:99992}.fancybox-bg,.fancybox-inner,.fancybox-outer,.fancybox-stage{position:absolute;top:0;right:0;bottom:0;left:0}.fancybox-outer{overflow-y:auto;-webkit-overflow-scrolling:touch}.fancybox-bg{background:#fff;opacity:0;transition-duration:inherit;transition-property:opacity;transition-timing-function:cubic-bezier(.47,0,.74,.71)}.fancybox-is-open .fancybox-bg{opacity:1;transition-timing-function:cubic-bezier(.22,.61,.36,1)}.fancybox-caption-wrap,.fancybox-infobar,.fancybox-toolbar{position:absolute;direction:ltr;z-index:99997;opacity:0;visibility:hidden;transition:opacity .25s,visibility 0s linear .25s;box-sizing:border-box}.fancybox-show-caption .fancybox-caption-wrap,.fancybox-show-infobar .fancybox-infobar,.fancybox-show-toolbar .fancybox-toolbar{opacity:1;visibility:visible;transition:opacity .25s,visibility 0s}.fancybox-infobar{top:0;left:50%;margin-left:-79px}.fancybox-infobar__body{display:inline-block;width:70px;line-height:44px;font-size:13px;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;text-align:center;color:#ddd;background-color:rgba(30,30,30,.7);pointer-events:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;-webkit-font-smoothing:subpixel-antialiased}.fancybox-toolbar{top:0;right:0}.fancybox-stage{overflow:hidden;direction:ltr;z-index:99994;-webkit-transform:translate3d(0,0,0)}.fancybox-slide{position:absolute;top:0;left:0;width:100%;height:100%;margin:0;padding:0;overflow:auto;outline:0;white-space:normal;box-sizing:border-box;text-align:center;z-index:99994;-webkit-overflow-scrolling:touch;display:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;transition-property:opacity,-webkit-transform;transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;-webkit-transform-style:preserve-3d;transform-style:preserve-3d}.fancybox-slide::before{content:'';display:inline-block;vertical-align:middle;height:100%;width:0}.fancybox-is-sliding .fancybox-slide,.fancybox-slide--current,.fancybox-slide--next,.fancybox-slide--previous{display:block}.fancybox-slide--image{overflow:visible}.fancybox-slide--image::before{display:none}.fancybox-slide--video .fancybox-content,.fancybox-slide--video iframe{background:#000}.fancybox-slide--map .fancybox-content,.fancybox-slide--map iframe{background:#e5e3df}.fancybox-slide--next{z-index:99995}.fancybox-slide>div{display:inline-block;position:relative;padding:24px;margin:44px 0 44px;border-width:0;vertical-align:middle;text-align:left;background-color:#fff;overflow:auto;box-sizing:border-box}.fancybox-slide .fancybox-image-wrap{position:absolute;top:0;left:0;margin:0;padding:0;border:0;z-index:99995;background:0 0;cursor:default;overflow:visible;-webkit-transform-origin:top left;-ms-transform-origin:top left;transform-origin:top left;background-size:100% 100%;background-repeat:no-repeat;-webkit-backface-visibility:hidden;backface-visibility:hidden;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.fancybox-can-zoomOut .fancybox-image-wrap{cursor:-webkit-zoom-out;cursor:zoom-out}.fancybox-can-zoomIn .fancybox-image-wrap{cursor:-webkit-zoom-in;cursor:zoom-in}.fancybox-can-drag .fancybox-image-wrap{cursor:-webkit-grab;cursor:grab}.fancybox-is-dragging .fancybox-image-wrap{cursor:-webkit-grabbing;cursor:grabbing}.fancybox-image,.fancybox-spaceball{position:absolute;top:0;left:0;width:100%;height:100%;margin:0;padding:0;border:0;max-width:none;max-height:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.fancybox-spaceball{z-index:1}.fancybox-slide--iframe .fancybox-content{padding:0;width:80%;height:80%;max-width:calc(100% - 100px);max-height:calc(100% - 88px);overflow:visible;background:#fff}.fancybox-iframe{display:block;margin:0;padding:0;border:0;width:100%;height:100%;background:#fff}.fancybox-error{margin:0;padding:40px;width:100%;max-width:380px;background:#fff;cursor:default}.fancybox-error p{margin:0;padding:0;color:#444;font:16px/20px "Helvetica Neue",Helvetica,Arial,sans-serif}.fancybox-close-small{position:absolute;top:0;right:0;width:44px;height:44px;padding:0;margin:0;border:0;border-radius:0;outline:0;background:0 0;z-index:10;cursor:pointer}.fancybox-close-small:after{content:'×';position:absolute;top:5px;right:5px;width:30px;height:30px;font:20px/30px Arial,"Helvetica Neue",Helvetica,sans-serif;color:#888;font-weight:300;text-align:center;border-radius:50%;border-width:0;background:#fff;transition:background .25s;box-sizing:border-box;z-index:2}.fancybox-close-small:focus:after{outline:1px dotted #888}.fancybox-close-small:hover:after{color:#555;background:#eee}.fancybox-slide--iframe .fancybox-close-small{top:0;right:-44px}.fancybox-slide--iframe .fancybox-close-small:after{background:0 0;font-size:35px;color:#aaa}.fancybox-slide--iframe .fancybox-close-small:hover:after{color:#fff}.fancybox-caption-wrap{bottom:0;left:0;right:0;padding:60px 30px 0 30px;background:linear-gradient(to bottom,transparent 0,rgba(0,0,0,.1) 20%,rgba(0,0,0,.2) 40%,rgba(0,0,0,.6) 80%,rgba(0,0,0,.8) 100%);pointer-events:none}.fancybox-caption{padding:30px 0;border-top:1px solid rgba(255,255,255,.4);font-size:14px;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;color:#fff;line-height:20px;-webkit-text-size-adjust:none}.fancybox-caption a,.fancybox-caption button,.fancybox-caption select{pointer-events:all}.fancybox-caption a{color:#fff;text-decoration:underline}.fancybox-button{display:inline-block;position:relative;margin:0;padding:0;border:0;width:44px;height:44px;line-height:44px;text-align:center;background:0 0;color:#ddd;border-radius:0;cursor:pointer;vertical-align:top;outline:0}.fancybox-button[disabled]{cursor:default;pointer-events:none}.fancybox-button,.fancybox-infobar__body{background:rgba(30,30,30,.6)}.fancybox-button:hover:not([disabled]){color:#fff;background:rgba(0,0,0,.8)}.fancybox-button::after,.fancybox-button::before{content:'';pointer-events:none;position:absolute;background-color:currentColor;color:currentColor;opacity:.9;box-sizing:border-box;display:inline-block}.fancybox-button[disabled]::after,.fancybox-button[disabled]::before{opacity:.3}.fancybox-button--left::after,.fancybox-button--right::after{top:18px;width:6px;height:6px;background:0 0;border-top:solid 2px currentColor;border-right:solid 2px currentColor}.fancybox-button--left::after{left:20px;-webkit-transform:rotate(-135deg);-ms-transform:rotate(-135deg);transform:rotate(-135deg)}.fancybox-button--right::after{right:20px;-webkit-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg)}.fancybox-button--left{border-bottom-left-radius:5px}.fancybox-button--right{border-bottom-right-radius:5px}.fancybox-button--close::after,.fancybox-button--close::before{content:'';display:inline-block;position:absolute;height:2px;width:16px;top:calc(50% - 1px);left:calc(50% - 8px)}.fancybox-button--close::before{-webkit-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg)}.fancybox-button--close::after{-webkit-transform:rotate(-45deg);-ms-transform:rotate(-45deg);transform:rotate(-45deg)}.fancybox-arrow{position:absolute;top:50%;margin:-50px 0 0 0;height:100px;width:54px;padding:0;border:0;outline:0;background:0 0;cursor:pointer;z-index:99995;opacity:0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;transition:opacity .25s}.fancybox-arrow::after{content:'';position:absolute;top:28px;width:44px;height:44px;background-color:rgba(30,30,30,.8);background-image:url(data:image/svg+xml;base64,PHN2ZyBmaWxsPSIjRkZGRkZGIiBoZWlnaHQ9IjQ4IiB2aWV3Qm94PSIwIDAgMjQgMjQiIHdpZHRoPSI0OCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4gICAgPHBhdGggZD0iTTAgMGgyNHYyNEgweiIgZmlsbD0ibm9uZSIvPiAgICA8cGF0aCBkPSJNMTIgNGwtMS40MSAxLjQxTDE2LjE3IDExSDR2MmgxMi4xN2wtNS41OCA1LjU5TDEyIDIwbDgtOHoiLz48L3N2Zz4=);background-repeat:no-repeat;background-position:center center;background-size:24px 24px}.fancybox-arrow--right{right:0}.fancybox-arrow--left{left:0;-webkit-transform:scaleX(-1);-ms-transform:scaleX(-1);transform:scaleX(-1)}.fancybox-arrow--left::after,.fancybox-arrow--right::after{left:0}.fancybox-show-nav .fancybox-arrow{opacity:.6}.fancybox-show-nav .fancybox-arrow[disabled]{opacity:.3}.fancybox-slide>.fancybox-loading{border:6px solid rgba(100,100,100,.4);border-top:6px solid rgba(255,255,255,.6);border-radius:100%;height:50px;width:50px;-webkit-animation:fancybox-rotate .8s infinite linear;animation:fancybox-rotate .8s infinite linear;background:0 0;position:absolute;top:50%;left:50%;margin-top:-25px;margin-left:-25px;z-index:99999}@-webkit-keyframes fancybox-rotate{from{-webkit-transform:rotate(0);transform:rotate(0)}to{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}@keyframes fancybox-rotate{from{-webkit-transform:rotate(0);transform:rotate(0)}to{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}.fancybox-animated{transition-timing-function:cubic-bezier(0,0,.25,1)}.fancybox-fx-slide.fancybox-slide--previous{-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0);opacity:0}.fancybox-fx-slide.fancybox-slide--next{-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0);opacity:0}.fancybox-fx-slide.fancybox-slide--current{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);opacity:1}.fancybox-fx-fade.fancybox-slide--next,.fancybox-fx-fade.fancybox-slide--previous{opacity:0;transition-timing-function:cubic-bezier(.19,1,.22,1)}.fancybox-fx-fade.fancybox-slide--current{opacity:1}.fancybox-fx-zoom-in-out.fancybox-slide--previous{-webkit-transform:scale3d(1.5,1.5,1.5);transform:scale3d(1.5,1.5,1.5);opacity:0}.fancybox-fx-zoom-in-out.fancybox-slide--next{-webkit-transform:scale3d(.5,.5,.5);transform:scale3d(.5,.5,.5);opacity:0}.fancybox-fx-zoom-in-out.fancybox-slide--current{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1);opacity:1}.fancybox-fx-rotate.fancybox-slide--previous{-webkit-transform:rotate(-360deg);-ms-transform:rotate(-360deg);transform:rotate(-360deg);opacity:0}.fancybox-fx-rotate.fancybox-slide--next{-webkit-transform:rotate(360deg);-ms-transform:rotate(360deg);transform:rotate(360deg);opacity:0}.fancybox-fx-rotate.fancybox-slide--current{-webkit-transform:rotate(0);-ms-transform:rotate(0);transform:rotate(0);opacity:1}.fancybox-fx-circular.fancybox-slide--previous{-webkit-transform:scale3d(0,0,0) translate3d(-100%,0,0);transform:scale3d(0,0,0) translate3d(-100%,0,0);opacity:0}.fancybox-fx-circular.fancybox-slide--next{-webkit-transform:scale3d(0,0,0) translate3d(100%,0,0);transform:scale3d(0,0,0) translate3d(100%,0,0);opacity:0}.fancybox-fx-circular.fancybox-slide--current{-webkit-transform:scale3d(1,1,1) translate3d(0,0,0);transform:scale3d(1,1,1) translate3d(0,0,0);opacity:1}.fancybox-fx-tube.fancybox-slide--previous{-webkit-transform:translate3d(-100%,0,0) scale(.1) skew(-10deg);transform:translate3d(-100%,0,0) scale(.1) skew(-10deg)}.fancybox-fx-tube.fancybox-slide--next{-webkit-transform:translate3d(100%,0,0) scale(.1) skew(10deg);transform:translate3d(100%,0,0) scale(.1) skew(10deg)}.fancybox-fx-tube.fancybox-slide--current{-webkit-transform:translate3d(0,0,0) scale(1);transform:translate3d(0,0,0) scale(1)}@media all and (max-width:800px){.fancybox-infobar{left:0;margin-left:0}.fancybox-button--left,.fancybox-button--right{display:none!important}.fancybox-caption{padding:20px 0;margin:0}}.fancybox-button--fullscreen::before{width:15px;height:11px;left:calc(50% - 7px);top:calc(50% - 6px);border:2px solid;background:0 0}.fancybox-button--pause::before,.fancybox-button--play::before{top:calc(50% - 6px);left:calc(50% - 4px);background:0 0}.fancybox-button--play::before{width:0;height:0;border-top:6px inset transparent;border-bottom:6px inset transparent;border-left:10px solid;border-radius:1px}.fancybox-button--pause::before{width:7px;height:11px;border-style:solid;border-width:0 2px 0 2px}.fancybox-thumbs{display:none}.fancybox-button--thumbs{display:none}@media all and (min-width:800px){.fancybox-button--thumbs{display:inline-block}.fancybox-button--thumbs span{font-size:23px}.fancybox-button--thumbs::before{width:3px;height:3px;top:calc(50% - 2px);left:calc(50% - 2px);box-shadow:0 -4px 0,-4px -4px 0,4px -4px 0,0 0 0 32px inset,-4px 0 0,4px 0 0,0 4px 0,-4px 4px 0,4px 4px 0}.fancybox-thumbs{position:absolute;top:0;right:0;bottom:0;left:auto;width:220px;margin:0;padding:5px 5px 0 0;background:#fff;word-break:normal;-webkit-tap-highlight-color:transparent;-webkit-overflow-scrolling:touch;-ms-overflow-style:-ms-autohiding-scrollbar;box-sizing:border-box;z-index:99995}.fancybox-show-thumbs .fancybox-thumbs{display:block}.fancybox-show-thumbs .fancybox-inner{right:220px}.fancybox-thumbs>ul{list-style:none;position:absolute;position:relative;width:100%;height:100%;margin:0;padding:0;overflow-x:hidden;overflow-y:auto;font-size:0}.fancybox-thumbs>ul>li{float:left;overflow:hidden;max-width:50%;padding:0;margin:0;width:105px;height:75px;position:relative;cursor:pointer;outline:0;border:5px solid transparent;border-top-width:0;border-right-width:0;-webkit-tap-highlight-color:transparent;-webkit-backface-visibility:hidden;backface-visibility:hidden;box-sizing:border-box}li.fancybox-thumbs-loading{background:rgba(0,0,0,.1)}.fancybox-thumbs>ul>li>img{position:absolute;top:0;left:0;min-width:100%;min-height:100%;max-width:none;max-height:none;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.fancybox-thumbs>ul>li:before{content:'';position:absolute;top:0;right:0;bottom:0;left:0;border-radius:2px;border:4px solid #4ea7f9;z-index:99991;opacity:0;transition:all .2s cubic-bezier(.25,.46,.45,.94)}.fancybox-thumbs>ul>li.fancybox-thumbs-active:before{opacity:1}}
/* End */


/* Start:/local/templates/escalada/css/fonts.css?17915438624828*/
/* --------------------------------------------------------------------------
  Fedra Sans Pro
   -------------------------------------------------------------------------- */
@font-face {
    font-family: 'Fedra Sans Pro';
    font-weight: 300;
    font-style: normal;
    font-display: swap;
    src: url('/local/templates/escalada/fonts/newFonts/FedraSansPro-Light.woff2') format('woff2'),
         url('/local/templates/escalada/fonts/newFonts/FedraSansPro-Light.woff') format('woff');
}

@font-face {
    font-family: 'Fedra Sans Pro';
    font-weight: 400;
    font-style: normal;
    font-display: swap;
    src: url('/local/templates/escalada/fonts/newFonts/FedraSansPro-Normal.woff2') format('woff2'),
         url('/local/templates/escalada/fonts/newFonts/FedraSansPro-Normal.woff') format('woff');
}

@font-face {
    font-family: 'Fedra Sans Pro';
    font-weight: 700;
    font-style: normal;
    font-display: swap;
    src: url('/local/templates/escalada/fonts/newFonts/FedraSansPro-Bold.woff2') format('woff2'),
         url('/local/templates/escalada/fonts/newFonts/FedraSansPro-Bold.woff') format('woff');
}
/* --------------------------------------------------------------------------
   Open Sans
   -------------------------------------------------------------------------- */
@font-face {
    font-family: 'Open Sans';
    font-weight: 300;
    font-style: normal;
    font-display: swap;
    src: url('/local/templates/escalada/fonts/OpenSans-Light.woff2') format('woff2'),
         url('/local/templates/escalada/fonts/OpenSans-Light.woff') format('woff');
    unicode-range: U+0400-04FF, U+2000-206F, U+2DE0-2DFF, U+A640-A69F; /* Cyrillic */
}

@font-face {
    font-family: 'Open Sans';
    font-weight: 400;
    font-style: normal;
    font-display: swap;
    src: url('/local/templates/escalada/fonts/OpenSans-Regular.woff2') format('woff2'),
         url('/local/templates/escalada/fonts/OpenSans-Regular.woff') format('woff');
    unicode-range: U+0400-04FF, U+2000-206F, U+2DE0-2DFF, U+A640-A69F;
}

@font-face {
    font-family: 'Open Sans';
    font-weight: 700;
    font-style: normal;
    font-display: swap;
    src: url('/local/templates/escalada/fonts/OpenSans-Bold.woff2') format('woff2'),
         url('/local/templates/escalada/fonts/OpenSans-Bold.woff') format('woff');
    unicode-range: U+0400-04FF, U+2000-206F, U+2DE0-2DFF, U+A640-A69F;
}

/* --------------------------------------------------------------------------
   Gotham Pro
   -------------------------------------------------------------------------- */
@font-face {
    font-family: 'GothemPro';
    font-weight: 300;
    font-style: normal;
    font-display: swap;
    src: url('/local/templates/escalada/fonts/GothamCyrillic/GothamPro-Light.woff') format('woff');
}

@font-face {
    font-family: 'GothemPro';
    font-weight: 400;
    font-style: normal;
    font-display: swap;
    src: url('/local/templates/escalada/fonts/GothamCyrillic/GothamPro.woff') format('woff');
}

@font-face {
    font-family: 'GothemPro';
    font-weight: 700;
    font-style: normal;
    font-display: swap;
    src: url('/local/templates/escalada/fonts/GothamCyrillic/GothamPro-Bold.woff') format('woff');
}

@font-face {
    font-family: 'GothemPro';
    font-weight: 700;
    font-style: italic;
    font-display: swap;
    src: url('/local/templates/escalada/fonts/GothamCyrillic/GothamPro-BoldItalic.woff') format('woff');
}


/* --------------------------------------------------------------------------
   Montserrat
   -------------------------------------------------------------------------- */
@font-face {
    font-family: 'Montserrat';
    font-weight: 400;
    font-style: normal;
    font-display: swap;
    src: url('/local/templates/escalada/fonts/Montserrat/Montserrat-Regular.woff2') format('woff2'),
         url('/local/templates/escalada/fonts/Montserrat/Montserrat-Regular.woff') format('woff');
}

@font-face {
    font-family: 'Montserrat';
    font-weight: 600;
    font-style: normal;
    font-display: swap;
    src: url('/local/templates/escalada/fonts/Montserrat/Montserrat-SemiBold.woff2') format('woff2'),
         url('/local/templates/escalada/fonts/Montserrat/Montserrat-SemiBold.woff') format('woff');
}

@font-face {
    font-family: 'Montserrat';
    font-weight: 700;
    font-style: normal;
    font-display: swap;
    src: url('/local/templates/escalada/fonts/Montserrat/Montserrat-Bold.woff2') format('woff2'),
         url('/local/templates/escalada/fonts/Montserrat/Montserrat-Bold.woff') format('woff');
}

.newIntro-block__text {
            position: relative;
            margin: 0;
            z-index: 0;
            font-family: 'Fedra Sans Pro';
            font-size: 320px;
            font-weight: 600;
            text-transform: uppercase;
            line-height: 200px;
        }
/* End */


/* Start:/local/templates/escalada/css/base.css?17915438629738*/
* {
    box-sizing:border-box;
    outline:none;
}
a {
    color:#fff;
    text-decoration:none;
}
a:hover {
    color:#fff;
}
img.bg-hidden{
    width:100%;
    height:auto;
    visibility:hidden;
}

.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.no-coppy, .no-coppy * {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.slider-wrapper {
    position: relative;
}

.owl-counter {
    position: absolute;
    bottom: 42px;
    width: 60px;
    left: 100px;
    color: white;
    font-size: 16px;
    border-radius: 4px;
    z-index: 2;
    pointer-events: none;
}

.marquiz__button_rounded {
	border-radius: 4px!important;
}

.page-spacer { height: 20px; }
@media (max-width: 768px) {
    .page-spacer { height: 10px; }
}
.clear{
    clear:both;
}
@media (min-width:1600px) {
    h1 {
        font-size:72px;
        line-height:100px;
    }
    h2,
    .h2 {
        font-size:52px;
        line-height:74px;
    }
}
h1, .h1,
h2, .h2,
h3, .h3{
    font-family: 'GothemPro', 'Open Sans', 'Arial', sans-serif;
    text-transform: uppercase;
    font-style: italic;
    font-weight: bold;
    color: #FFFFFF;
}
h1, .h1 {
    font-size: 54px;
    line-height: 56px;
    margin: 20px 0 20px;
}
h2, .h2 {
    font-size: 36px;
    line-height: 50px;
    margin-bottom: 18px;
    letter-spacing: 3px;
}
h3, .h3{
    font-size: 25px;
    line-height: 35px;
    letter-spacing: 3px;
    margin-bottom: 10px;
}
.h1,
.h2,
.h3 {
    margin: 0 0 30px;
}
@media (max-width: 740px) {
    h1, .h1 {
        font-size: 30px;
        line-height: 32px;
    }
    h2, .h2 {
        font-size: 19px;
        line-height: 150%;
        letter-spacing: 1px;
        margin-bottom: 20px;
    }
}
@media (max-width: 540px) {
    h1, .h1 {
        font-size:24px;
        line-height:26px;
    }
}

/* CSS variables and base utilities (moved from cards.css) */
:root {
  /* Цвета */
  --text-main: #f5f5f5;
  --text-muted: #a6a6a6;
  --text-strong: #ffffff;
  --accent: #4a9eff;
  --accent-glow: rgba(74, 158, 255, 0.35);
  --bg-card: #111111;
  --bg-soft: #0a0a0a;
  --border-subtle: #222222;
  --border-focus: #4a9eff;
  
  /* Отступы и размеры */
  --container-max: 1360px;
  --section-gap: 3rem;
  --radius: 10px;
  --transition: 0.2s ease;
}

.container {
  max-width: var(--container-max);
  margin: 0 auto;
  padding: 0 1.5rem;
  color: var(--text-main);
  line-height: 1.2;
  background: transparent; /* Наследует #000 фона сайта */
}

html {
  scroll-behavior: smooth;
}

.wrap {
    max-width: 1360px;
    padding: 0 70px;
    margin: 0 auto;
}
@media (max-width: 1024px) {
    .wrap {
        padding: 0 20px;
    }
}

/* === global utilities (moved from template styles.css) === */
.pb-80 {
    padding-bottom: 80px;
}

.wrapper {
    padding-left: 20px;
    padding-right: 20px;
}

@media screen and (max-width: 1400px) {
    .pb-80 {
        padding-bottom: 60px;
    }
}

@media screen and (max-width: 1200px) {
    .pb-80 {
        padding-bottom: 50px;
    }
}

@media screen and (max-width: 1024px) {
    .wrapper {
        padding-left: 15px;
        padding-right: 15px;
    }
}

@media screen and (max-width: 576px) {
    .wrapper {
        padding-left: 10px;
        padding-right: 10px;
    }
}

/* ============================================================
   Глобальные утилиты и template-уровень — перенесено из new.css (Батч 5)
   base.css грузится РАНЬШЕ new.css/header.css/footer.css,
   но ПОЗЖЕ page-CSS (pages/*.css) — порядок проверен по бандлу.
   ============================================================ */

/* --- Кнопки (.btn) — глобальные, использовались только в new.css --- */
.btn {
    -webkit-appearance: none;
    display: inline-block;
    vertical-align: top;
    border: 2px solid #3C8CDD;
	border-radius: 4px;
    padding: 12px 40px;
    text-transform: uppercase;
    font-family: Open Sans, Arial, sans-serif;
    font-weight: 400;
    font-size: 12px;
    line-height: 22px;
    text-align: center;
    letter-spacing: 0.07em;
    cursor: pointer;
    background: transparent;
}
.btn:hover{
    background: #3C8CDD;
    color: #fff;
}
.btn--blue{
    background: #3C8CDD;
    color: #fff;
}
.btn--blue:hover{
    background: transparent;
}

/* --- Глобальный reset body/html (перенесён из new.css; не конфликтует с html{scroll-behavior} выше) --- */
body, html {
    padding: 0;
    margin: 0;
    color: #FFFFFF;
    font-size: 16px;
    line-height: 26px;
    font-family: Open Sans, Arial, sans-serif;
    font-weight: 300;
    position: relative;
    background: #090B11;
}

/* --- Утилиты-обёртки --- */
.wrap-big {
	max-width: 1340px;
    padding: 0 70px;
    margin:0 auto;
    position:relative;
}
.has-padding{
    padding: 100px 0;
}
.content-center{
    text-align: center;
    padding-top:0;
}
.light-bg{
    background: #090B12;
}
.hide {
    display: none;
}
.video {
    display: block;
    position: relative;
    padding-top: 56.65%;
}
.video iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
@media (max-width:1024px) {
	.wrap-big{
	padding: 0 20px;
	}
}

/* --- Соц-иконки (url(/local/templates/escalada/css/) относительные ../images/, base.css в css/ — не меняются) --- */
.social a{
    display:inline-block;
    height:24px;
    width:25px;
    margin: 0 8px 0 0;
    vertical-align: middle;
    opacity: .75;
    background: no-repeat center center;
    background-size: contain;
}
.social a:hover{
    opacity: 1;
}
a.telegram {
    background-image: url("/local/templates/escalada/css/../images/social-tg.svg");
    width: 20px;
    height: 20px;
}
a.telegram:hover {
    background-image: url("/local/templates/escalada/css/../images/social-tg-h.svg");
}
a.dzen {
    background-image: url("/local/templates/escalada/css/../images/social-dzen.svg");
    width: 20px;
    height: 20px;
}
a.dzen:hover {
    background-image: url("/local/templates/escalada/css/../images/social-dzen-h.svg");
}
a.vk {
    background-image: url("/local/templates/escalada/css/../images/vk.svg");
}
a.vk:hover {
    background-image: url("/local/templates/escalada/css/../images/vk-h.svg");
}
a.fb {background:url("/local/templates/escalada/css/../images/fb.svg") no-repeat center;}
a.fb:hover {background:url("/local/templates/escalada/css/../images/fb-h.svg") no-repeat center;}
a.inst{
    background:url("/local/templates/escalada/css/../images/inst.svg") no-repeat center;
}
a.inst:hover{
    background:url("/local/templates/escalada/css/../images/inst-h.svg") no-repeat center;
}
a.rutube{
    background:url("/local/templates/escalada/css/../images/rutube.svg") no-repeat center;
	background-size: contain;
    width: 20px;
    height: 20px;
}
a.rutube:hover{
    background:url("/local/templates/escalada/css/../images/rutube-h.svg") no-repeat center;
	background-size: contain;
}
a.whatsapp {
    background-image: url("/local/templates/escalada/css/../images/social-wa.svg");
    width: 20px;
    height: 20px;
}
a.whatsapp:hover {
    background-image: url("/local/templates/escalada/css/../images/social-wa-h.svg");
}
a.max {
    background-image: url("/local/templates/escalada/css/../images/social-max.svg");
    width: 20px;
    height: 20px;
}
a.max:hover {
    background-image: url("/local/templates/escalada/css/../images/social-max-h.svg");
}

/* --- Generic fancybox-скин (нужен всем лайтбоксам глобально) --- */
.fancybox-slide,
.fancybox-slide > div:first-of-type{
    background:#090B12;
}
.fancybox-slide > div:first-of-type{
    width:100%;
    height:100%;
    margin:0;
    padding:0;
}
.fancybox-close-small:after{
    display:none;
}
.fancybox-container {
    margin-left:100%;
    margin-top:-100%;
    opacity:0;
    transition:.2s all ease-in !important;
}
.fancybox-container.fancybox-is-open {
    opacity:1;
    margin-left:0;
    margin-top:0;
}
.fancybox-bg {
    background:#000 !important;
    opacity: .5;
}
.fancybox-slide > .fancybox-loading {
    display:none;
}
.cardDetail .fancybox-slide, .fancybox-slide > div:first-of-type{
    background: transparent;
}

/* --- Template-уровень: соцсети/телефоны/конфиденциальность (footer/header/contacts) --- */
.confidentiality-link{
    display:inline-block;
    border-bottom:1px solid #fff;
}
.confidentiality{
    font-family:'Montserrat-Regular', 'Arial', sans-serif;
}
.site{
    font-weight:400;
    font-family:'Montserrat-Semi', 'Arial', sans-serif;
}

/* === Moved from new.css (Б6a) === */
@keyframes slideleft {
    0%{
        opacity:1;
        margin-left:0;
    }
    60%{
        opacity:0;
        margin-left:135px;
    }
    100%{
        opacity:1;
        margin-left:0;
    }
}

/* === J0d: rescued from former js/anime.css (live generic container utilities; used by news.list/cards component "club-cards content content--cards") === */
.content{
    /*padding: 0 70px;*/
    max-width: 1160px;
    margin: 0 auto;
}
.content--cards {
    max-width: 1360px;
}

/* ========================================
   Анимация появления изображений баннера
   ======================================== */
.js-animate-onload {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.8s cubic-bezier(0.22, 1, 0.36, 1),
                transform 0.8s cubic-bezier(0.22, 1, 0.36, 1);
    will-change: opacity, transform;
}

.js-animate-onload.is-loaded {
    opacity: 1;
    transform: translateY(0);
}

/* Каскадная задержка для иконки Play */
.main-top-banner__video-icon.js-animate-onload {
    transition-delay: 0.2s;
}

/* Уважение к настройкам пользователя */
@media (prefers-reduced-motion: reduce) {
    .js-animate-onload {
        opacity: 1;
        transform: none;
        transition: none;
    }
}
/* End */


/* Start:/local/templates/escalada/css/header.css?179154386242905*/
/* ==========================================================================
   Шапка и бургер-меню (макет Figma «Дизайн (Главная)»: header, burger menu)
   Разметка — header.php, данные клуба — local/include/site-layout.php, поведение — js/header.js.
   MOBILE-FIRST: база — телефон (390), дальше @media (min-width: …) по возрастанию:
   540 — планшетная шапка (140 px), 640 — планшетное меню, 1200 — десктоп (80 px), 1340 — пункты меню в шапке.
   ========================================================================== */

:root {
    --site-bg: #000a0e;
    --site-panel: #02060e;
    --site-card: #080e19;
    --site-black: #070c0f;
    --site-white: #edf7fb;
    --site-gray: #d1d1d1;
    --site-muted: #b7c1cf;
    --site-blue: #00a1e6;
    --site-blue-400: #00b1fd;
    --site-blue-line: #00a0e3;
    --site-blue-50: #94dbfa;
    --site-blue-200: #62cdfb;   /* наведение (UI-kit главной) */
    --site-blue-600: #0090ce;   /* нажатие */
    --site-focus: #4d85e0;      /* рамка фокуса с клавиатуры */
    --site-line: rgba(0, 160, 227, 0.25);   /* обводки карточек в макете — #00a0e3 с прозрачностью */
    --site-neutral-900: #383838;
    --site-font: Tahoma, Verdana, 'Segoe UI', sans-serif;
    --site-font-title: 'Fedra Sans Pro', Tahoma, Verdana, sans-serif;

    /* Высота шапки и сдвиг контента страниц. Внутренние страницы свёрстаны под старую фиксированную шапку
       (64 px до 1024, 68 px до 1260, 119 px дальше) — .main сдвигается на разницу, отступы страниц не трогаем. */
    --site-header-h: 72px;
    --site-header-shift: 8px;

    /* Телефон и планшет: размеры содержимого шапки (и шапки открытого меню — крестик на месте бургера).
       Меньше, чем в макете (100 / 140px, значки 44, логотип 95x60) — там шапка казалась слишком «жирной» */
    --site-hdr-icon: 36px;       /* бургер, крестик, «позвонить» */
    --site-hdr-logo-w: 76px;
    --site-hdr-logo-h: 48px;

    /* Поля по бокам на десктопе. Шире 1920 — всё как на 1920 (контент 1800 по центру), растут поля — как у главной */
    --site-pad: 60px;

    /* Движение: переходы состояний (hover / click / focus) — 0.3s ease-out везде; появление разделов бургер-меню — 0.6s */
    --site-t: 0.3s;
    --site-ease: ease-out;
    --site-reveal-t: 0.6s;
    --site-reveal-shift: 40px;

    /* Шкала шрифтов — как у главной (css/pages/main-page.css, «Шкала шрифтов»):
       телефон до 704 / планшет 705–1100 / ПК от 1101 */
    --site-fs-h3: 16px;      /* заголовки колонок подвала          16 / 18 / 20 */
    --site-fs-body: 15px;    /* ссылки, контакты, текст, кнопки    15 / 16 / 16 */
    --site-fs-small: 13px;   /* мелкий текст («Загрузите в»)       13 / 14 / 14 */
    --site-fs-tag: 12px;     /* бирки разделов                     12 на всех */
}

@media (min-width: 705px) {
    :root {
        --site-fs-h3: 18px;
        --site-fs-body: 16px;
        --site-fs-small: 14px;
        --site-reveal-shift: 60px;
    }
}

@media (min-width: 1101px) {
    :root { --site-fs-h3: 20px; }
}

@media (min-width: 1921px) {
    :root { --site-pad: calc((100vw - 1800px) / 2); }
}

@media (min-width: 540px) {
    :root {
        --site-header-h: 96px;
        --site-header-shift: 32px;
        --site-hdr-icon: 40px;
        --site-hdr-logo-w: 85px;
        --site-hdr-logo-h: 54px;
    }
}
@media (min-width: 1025px) {
    :root { --site-header-shift: 28px; }
}
@media (min-width: 1200px) {
    :root { --site-header-h: 80px; --site-header-shift: 12px; }
}
@media (min-width: 1261px) {
    :root { --site-header-shift: -39px; }
}

.main {
    margin-top: var(--site-header-shift);
}

.is-club-home .main {
    margin-top: 0;
}

/* ---------- Общие элементы ---------- */

.site-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 12px 36px;
    border: 1px solid var(--site-blue);
    border-radius: 999px;
    font-family: var(--site-font);
    font-size: var(--site-fs-body);
    font-weight: 700;
    line-height: 1.3;
    color: var(--site-blue-400);
    text-transform: uppercase;
    text-align: center;
    white-space: nowrap;
    cursor: pointer;
    transition: border-color var(--site-t) var(--site-ease), color var(--site-t) var(--site-ease);
}

/* как «Видео презентация» на главной (кнопка с обводкой): наведение — светлее, нажатие — темнее */
.site-btn:hover {
    border-color: var(--site-blue-200);
    color: var(--site-blue-200);
}

.site-btn:active {
    border-color: var(--site-blue-600);
    color: var(--site-blue-600);
}

/* Кнопка-иконка «позвонить» (мобильная шапка) */
.site-call {
    display: flex;
    align-items: center;
    justify-content: center;
    width: var(--site-hdr-icon);
    height: var(--site-hdr-icon);
    border: 1px solid rgba(0, 160, 227, 0.2);
    border-radius: 6px;
    background: rgba(70, 127, 209, 0.1);
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
    transition: border-color var(--site-t) var(--site-ease), background-color var(--site-t) var(--site-ease);
}

.site-call:hover {
    border-color: var(--site-blue-200);
    background-color: rgba(0, 177, 253, 0.12);
}

.site-call:active {
    border-color: var(--site-blue-600);
    background-color: rgba(0, 144, 206, 0.2);
}

.site-call img {
    display: block;
    width: 20px;
    height: 20px;
}

/* Тег раздела: «◯ Навигация». Обводка — затухающий градиент, как у бирок главной (.main-page__tag) */
.site-tag {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    align-self: flex-start;
    padding: 7px 15px;
    border: 1px solid transparent;
    border-radius: 100px;
    font-family: var(--site-font);
    font-size: var(--site-fs-tag);
    font-weight: 700;
    line-height: 1.3;
    color: var(--site-blue-400);
    white-space: nowrap;
}

.site-tag::before {
    content: '';
    position: absolute;
    inset: -1px;
    padding: 1px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(0, 160, 227, 0.2), rgba(0, 160, 227, 0));
    -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    -webkit-mask-composite: xor;
    mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    mask-composite: exclude;
    pointer-events: none;
}

.site-tag img {
    display: block;
    width: 20px;
    height: 20px;
}

/* Документ с меткой PDF */
.site-doc {
    display: inline-flex;
    align-items: flex-end;
    gap: 10px;
    transition: color var(--site-t) var(--site-ease);
}

.site-doc__tag {
    flex: none;
    margin-bottom: 2px;
    padding: 5px 10px;
    border: 1px solid var(--site-line);
    border-radius: 100px;
    background: rgba(0, 160, 227, 0.1);
    font-family: var(--site-font);
    font-size: 6px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: -0.06px;
    color: var(--site-blue-line);
    text-transform: uppercase;
}

/* Кнопка стора (мобильное приложение) */
.site-app {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 20px;
    border: 2px solid var(--site-line);
    border-radius: 15px;
    background: linear-gradient(to left, rgba(11, 28, 60, 0.3), rgba(8, 14, 25, 0.3));
    font-family: var(--site-font);
    line-height: 1.3;
    white-space: nowrap;
    transition: border-color var(--site-t) var(--site-ease);
}

a.site-app:hover {
    border-color: var(--site-blue-200);
}

a.site-app:active {
    border-color: var(--site-blue-600);
}

.site-app__icon {
    flex: none;
    display: block;
    width: 30px;
    height: 30px;
}

.site-app__text {
    display: flex;
    flex-direction: column;
}

.site-app__pre {
    font-size: var(--site-fs-small);
    letter-spacing: -0.15px;
    color: var(--site-gray);
    transition: color var(--site-t) var(--site-ease);
}

.site-app__name {
    font-size: var(--site-fs-body);
    font-weight: 700;
    color: var(--site-white);
    transition: color var(--site-t) var(--site-ease);
}

/* Кнопка стора «только иконка»: подпись видна лишь экранным читалкам */
.site-app--icon .site-app__text {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
}

/* ==========================================================================
   Плашка-баннер над шапкой (компонент news.list/top-banner)
   ========================================================================== */

.pre-header {
    width: 100%;
    height: 50px;
    background: #058CE3;
    text-align: center;
    padding: 0 15px;
    color: #fff;
    font-size: 15px;
    line-height: 20px;
    z-index: 10;
    display: flex;
    align-items: center;
    justify-content: center;
}
.pre-header__wrapper {
    flex: 0 0 100%;
    width: 100%;
}
.pre-header a:not(:hover) {
    text-decoration: underline;
}
.pre-header * {
    margin: 0;
    padding: 0;
}
/* пока страницу не прокрутили, фиксированная шапка стоит под плашкой */
.pre-header + .site-header:not(.is-scrolled) {
    top: 50px;
}
@media (max-width: 680px) {
    .pre-header {
        font-size: 12px;
        line-height: 17px;
    }
}
@media (max-width: 540px) {
    .pre-header {
        height: 80px;
    }
    .pre-header + .site-header:not(.is-scrolled) {
        top: 80px;
    }
}

/* ==========================================================================
   Скроллбар страницы: дорожка — на тон светлее фона главной, ползунок и стрелки — голубые, как primary-кнопки
   (наведение — светлее, нажатие — темнее). Chrome, Edge, Safari, Opera — ::-webkit-scrollbar (со стрелками);
   Firefox стрелки не рисует — ему только цвета (scrollbar-color; в Chrome он отключил бы стрелки, поэтому
   только там, где ::-webkit-scrollbar нет). Телефоны и macOS с «плавающей» полосой — как в системе.
   ========================================================================== */

:root {
    --site-scroll-track: #061218;   /* на тон светлее фона главной (#000a0e) — полоса видна, но не спорит со страницей */
    --site-scroll-w: 12px;
}

html::-webkit-scrollbar {
    width: var(--site-scroll-w);
    background: var(--site-scroll-track);
}

html::-webkit-scrollbar-track {
    background: var(--site-scroll-track);
}

/* ползунок уже дорожки: прозрачная рамка 3px по бокам */
html::-webkit-scrollbar-thumb {
    min-height: 40px;
    border: 3px solid transparent;
    border-radius: 999px;
    background: var(--site-blue) padding-box;
}

html::-webkit-scrollbar-thumb:hover {
    background-color: var(--site-blue-200);
}

html::-webkit-scrollbar-thumb:active {
    background-color: var(--site-blue-600);
}

/* стрелки: треугольники (как ▾ в шапке) на фоне дорожки */
html::-webkit-scrollbar-button:single-button:vertical {
    display: block;
    width: var(--site-scroll-w);
    height: 14px;
    background: var(--site-scroll-track) no-repeat center / 7px 6px;
}

html::-webkit-scrollbar-button:single-button:vertical:decrement {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 7 6'%3E%3Cpath d='M3.5 0 7 6H0z' fill='%2300a1e6'/%3E%3C/svg%3E");
}

html::-webkit-scrollbar-button:single-button:vertical:increment {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 7 6'%3E%3Cpath d='M0 0h7L3.5 6z' fill='%2300a1e6'/%3E%3C/svg%3E");
}

html::-webkit-scrollbar-button:single-button:vertical:decrement:hover {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 7 6'%3E%3Cpath d='M3.5 0 7 6H0z' fill='%2362cdfb'/%3E%3C/svg%3E");
}

html::-webkit-scrollbar-button:single-button:vertical:increment:hover {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 7 6'%3E%3Cpath d='M0 0h7L3.5 6z' fill='%2362cdfb'/%3E%3C/svg%3E");
}

html::-webkit-scrollbar-button:single-button:vertical:decrement:active {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 7 6'%3E%3Cpath d='M3.5 0 7 6H0z' fill='%230090ce'/%3E%3C/svg%3E");
}

html::-webkit-scrollbar-button:single-button:vertical:increment:active {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 7 6'%3E%3Cpath d='M0 0h7L3.5 6z' fill='%230090ce'/%3E%3C/svg%3E");
}

html::-webkit-scrollbar-corner {
    background: var(--site-scroll-track);
}

@supports not selector(::-webkit-scrollbar) {
    html {
        scrollbar-color: var(--site-blue) var(--site-scroll-track);
    }
}

/* Десктоп (мышь): вместо родной полосы — своя колонка .site-scroll (js/header.js) поверх правого края.
   Появляется при прокрутке и при наведении к правому краю, через секунду без дела гаснет.
   Правила выше (::-webkit-scrollbar) остаются запасным вариантом: без JS или без класса — родная полоса
   в тех же цветах. Телефоны и планшеты — системная полоса. */
html.site-scroll-custom {
    scrollbar-width: none;
}

html.site-scroll-custom::-webkit-scrollbar {
    display: none;
}

.site-scroll {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 150;                 /* над шапкой (100), под меню (1000) и окнами */
    display: flex;
    flex-direction: column;
    width: var(--site-scroll-w);
    background: var(--site-scroll-track);
    opacity: 0;
    transition: opacity 0.2s ease-out;
    user-select: none;
    touch-action: none;
}

.site-scroll[hidden] {
    display: none;
}

.site-scroll.is-on {
    opacity: 1;
}

/* стрелки: треугольники цвета ползунка */
.site-scroll__btn {
    flex: none;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 14px;
    padding: 0;
    border: 0;
    background: none;
    color: var(--site-blue);
    cursor: pointer;
    transition: color 0.2s ease-out;
}

.site-scroll__btn::before {
    content: '';
    width: 7px;
    height: 6px;
    background: currentColor;
    clip-path: polygon(50% 0, 100% 100%, 0 100%);
}

.site-scroll__btn--down::before {
    clip-path: polygon(0 0, 100% 0, 50% 100%);
}

.site-scroll__btn:hover {
    color: var(--site-blue-200);
}

.site-scroll__btn:active {
    color: var(--site-blue-600);
}

.site-scroll__track {
    position: relative;
    flex: 1;
    cursor: pointer;
}

/* ползунок уже дорожки — по 3px с боков, как у родной полосы выше */
.site-scroll__thumb {
    position: absolute;
    top: 0;
    left: 3px;
    right: 3px;
    border-radius: 999px;
    background: var(--site-blue);
    cursor: default;
    transition: background-color 0.2s ease-out;
    will-change: transform;
}

.site-scroll__thumb:hover {
    background-color: var(--site-blue-200);
}

.site-scroll.is-drag .site-scroll__thumb {
    background-color: var(--site-blue-600);
}

@media (prefers-reduced-motion: reduce) {
    .site-scroll,
    .site-scroll * {
        transition-duration: 0s !important;
    }
}

/* ==========================================================================
   Шапка
   ========================================================================== */

.site-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 100;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    height: var(--site-header-h);
    padding: 0 20px;
    font-family: var(--site-font);
    line-height: 1.3;
    color: var(--site-white);
    transition: background-color var(--site-t) var(--site-ease), top var(--site-t) var(--site-ease);
}

/* Прокрутили — у шапки появляется фон, чтобы она читалась поверх контента */
.site-header.is-scrolled {
    background-color: rgba(0, 10, 14, 0.85);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
}

/* На телефоне и планшете: [бургер] [логотип по центру] [позвонить] — группы «растворяются» в сетке */
.site-header__left,
.site-header__right {
    display: contents;
}

.site-header__logo {
    grid-column: 2;
    grid-row: 1;
    display: block;
}

.site-header__logo img {
    display: block;
    width: var(--site-hdr-logo-w);
    height: var(--site-hdr-logo-h);
}

.site-header__burger {
    grid-column: 1;
    grid-row: 1;
    justify-self: start;
    display: block;
    padding: 0;
    border: 0;
    background: none;
    color: var(--site-blue-400);
    cursor: pointer;
    transition: color var(--site-t) var(--site-ease);
}

/* значок — ассет-маска (images/layout/burger*.svg) цвета текста кнопки */
.site-header__burger-icon {
    display: block;
    width: var(--site-hdr-icon);
    height: var(--site-hdr-icon);
    background-color: currentColor;
    transition: opacity var(--site-t) var(--site-ease);
    -webkit-mask: url("/local/templates/escalada/css/../images/layout/burger-mobile.svg") no-repeat center / 100% 100%;
    mask: url("/local/templates/escalada/css/../images/layout/burger-mobile.svg") no-repeat center / 100% 100%;
}

.site-header__burger:hover {
    color: var(--site-blue-200);
}

.site-header__burger:active {
    color: var(--site-blue-600);
}

/* нажали — значок уходит в прозрачность, пока меню открыто; закрыли — проявляется обратно
   (класс .is-faded ставит и снимает js/header.js) */
.site-header__burger.is-faded .site-header__burger-icon {
    opacity: 0;
}

.site-header__call {
    grid-column: 3;
    grid-row: 1;
    justify-self: end;
}

.site-header__nav,
.site-header__phone,
.site-header__cta {
    display: none;
}

@media (min-width: 540px) {
    .site-header {
        padding: 0 40px;
    }
}

@media (min-width: 1200px) {
    .site-header {
        display: flex;
        justify-content: space-between;
        padding: 0 var(--site-pad);
    }

    .site-header__left,
    .site-header__right {
        display: flex;
        align-items: center;
        gap: 20px;
    }

    /* 95x60 вместо 120x76 из макета: по 10px до краёв шапки */
    .site-header__logo img {
        width: 95px;
        height: 60px;
    }

    /* 1200: бургер слева от логотипа */
    .site-header__burger {
        order: -1;
    }

    .site-header__burger-icon {
        width: 40px;
        height: 40px;
        -webkit-mask-image: url("/local/templates/escalada/css/../images/layout/burger.svg");
        mask-image: url("/local/templates/escalada/css/../images/layout/burger.svg");
    }

    .site-header__call {
        display: none;
    }

    /* как пункты меню шапки: белый, наведение — светло-голубой */
    .site-header__phone {
        display: block;
        font-size: var(--site-fs-body);
        color: var(--site-white);
        white-space: nowrap;
        transition: color var(--site-t) var(--site-ease);
    }

    .site-header__phone:hover {
        color: var(--site-blue-200);
    }

    .site-header__phone:active {
        color: var(--site-blue-600);
    }

    /* меньше, чем в макете (там 16px 60px и 18px): шрифт по шкале, высота ~45px вместо 55 */
    .site-header__cta {
        display: inline-flex;
    }
}

/* Пункты меню помещаются в шапку: логотип, бургер, меню */
@media (min-width: 1340px) {
    .site-header__burger {
        order: 0;
    }

    .site-header__nav {
        display: block;
    }
}

/* ---------- Меню в шапке (от 1340) ---------- */

.site-header__menu {
    display: flex;
    align-items: center;
    gap: 20px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.site-header__item {
    position: relative;
}

.site-header__link {
    display: inline-flex;
    align-items: center;
    gap: 6px;   /* как пробел между словом и стрелочкой */
    padding: 0;
    border: 0;
    background: none;
    font: inherit;
    font-size: var(--site-fs-body);
    line-height: 1.3;
    color: var(--site-white);
    white-space: nowrap;
    cursor: pointer;
    transition: color var(--site-t) var(--site-ease);
}

/* цвета — как у ссылок подвала: белый, наведение — светло-голубой */
.site-header__link:hover {
    color: var(--site-blue-200);
}

.site-header__link:active {
    color: var(--site-blue-600);
}

/* Треугольник ▾ (в макете — Polygon 7 px, повёрнутый на 180°): маска цвета текста пункта —
   белый, при наведении светло-голубой вместе с текстом */
.site-caret {
    flex: none;
    display: block;
    width: 6.06px;
    height: 5.25px;
    background-color: currentColor;
    -webkit-mask: url("/local/templates/escalada/css/../images/layout/caret-white.svg") no-repeat center / 100% 100%;
    mask: url("/local/templates/escalada/css/../images/layout/caret-white.svg") no-repeat center / 100% 100%;
    transform: rotate(180deg);
    transition: transform var(--site-t) var(--site-ease);
}

/* Выпадающий список — только по наведению (по клику не открывается, чтобы два списка не были
   открыты сразу); с клавиатуры — когда фокус (Tab) на пункте или внутри списка */
.site-header__sub {
    position: absolute;
    top: 100%;
    left: -20px;
    z-index: 2;
    min-width: 240px;
    margin: 0;
    padding: 28px 0 0;   /* «мостик» от пункта до плашки, чтобы курсор не терял наведение */
    list-style: none;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-6px);
    transition: opacity var(--site-t) var(--site-ease), transform var(--site-t) var(--site-ease), visibility 0s linear var(--site-t);
}

.site-header__sub::before {
    content: '';
    position: absolute;
    inset: 18px 0 0;
    z-index: -1;
    border: 1px solid var(--site-line);
    border-radius: 15px;
    background: var(--site-card);
    box-shadow: 0 25px 56px rgba(68, 103, 150, 0.26);
}

.site-header__sub li:last-child {
    padding-bottom: 14px;
}

.site-header__sub a {
    display: block;
    padding: 6px 20px;
    font-size: var(--site-fs-body);
    line-height: 1.3;
    color: var(--site-white);
    white-space: nowrap;
    transition: color var(--site-t) var(--site-ease);
}

.site-header__sub a:hover {
    color: var(--site-blue-200);
}

.site-header__sub a[aria-current] {
    color: var(--site-blue-400);
}

.site-header__sub a:active {
    color: var(--site-blue-600);
}

.site-header__item--drop:hover > .site-header__sub {
    opacity: 1;
    visibility: visible;
    transform: none;
    transition: opacity var(--site-t) var(--site-ease), transform var(--site-t) var(--site-ease);
}

.site-header__item--drop:hover .site-caret {
    transform: none;
}

/* пока открыт список — пункт подсвечен, даже когда курсор уже на самом списке */
.site-header__item--drop:hover > .site-header__link {
    color: var(--site-blue-200);
}

/* клавиатура (отдельными правилами: браузер без :has() пропустит только их) */
.site-header__item--drop:has(:focus-visible) > .site-header__sub {
    opacity: 1;
    visibility: visible;
    transform: none;
    transition: opacity var(--site-t) var(--site-ease), transform var(--site-t) var(--site-ease);
}

.site-header__item--drop:has(:focus-visible) .site-caret {
    transform: none;
}

/* ==========================================================================
   Бургер-меню
   Телефон: на весь экран, пункты в столбик. Планшет (640+): разделы с тегами, приложения и документы.
   Десктоп (1200+): плашка сверху поверх размытой страницы.
   ========================================================================== */

html.site-burger-open,
html.site-burger-open body {
    overflow: hidden;
}

/* Окна прячут прокрутку (меню, окна главной клуба, fancybox): вместо полосы прокрутки — отступ той же
   ширины, иначе страница и шапка на миг «растягиваются» вправо, а при закрытии — обратно.
   --site-sbw ставит js/header.js (0 там, где полоса «плавающая»: телефоны, macOS). У fancybox свой
   отступ у body — ему компенсируем только шапку. */
html.site-burger-open body,
html.main-page__modal-open body {
    padding-right: var(--site-sbw, 0px);
}

html.site-burger-open .site-header,
html.main-page__modal-open .site-header,
html.fancybox-enabled .site-header {
    right: var(--site-sbw, 0px);
}

.site-burger {
    position: fixed;
    inset: 0;
    z-index: 1000;
    font-family: var(--site-font);
    line-height: 1.3;
    color: var(--site-white);
}

.site-burger[hidden] {
    display: none;
}

.site-burger__overlay {
    display: none;
}

.site-burger__panel {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    background: var(--site-panel);
    outline: none;
    opacity: 0;
    transform: translateY(-24px);
    transition: opacity var(--site-t) var(--site-ease), transform var(--site-t) var(--site-ease);
}

.site-burger.is-open .site-burger__panel {
    opacity: 1;
    transform: none;
}

.site-burger__head {
    position: relative;
    z-index: 1;
    flex: none;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    height: var(--site-header-h);
    padding: 0 20px;
}

.site-burger__close {
    position: relative;
    justify-self: start;
    display: flex;
    align-items: center;
    justify-content: center;
    width: var(--site-hdr-icon);
    height: var(--site-hdr-icon);
    padding: 0;
    border: 0;
    background: none;
    color: var(--site-blue-400);
    cursor: pointer;
    transition: color var(--site-t) var(--site-ease);
}

/* крестик — ассет-маска (images/layout/close.svg) цвета текста кнопки */
.site-burger__close-icon {
    display: block;
    width: 60%;      /* как в ассете: крестик 26.4 в квадрате 44 */
    height: 60%;
    background-color: currentColor;
    -webkit-mask: url("/local/templates/escalada/css/../images/layout/close.svg") no-repeat center / 100% 100%;
    mask: url("/local/templates/escalada/css/../images/layout/close.svg") no-repeat center / 100% 100%;
}

.site-burger__close:hover {
    color: var(--site-blue-200);
}

.site-burger__close:active {
    color: var(--site-blue-600);
}

.site-burger__logo img {
    display: block;
    width: var(--site-hdr-logo-w);
    height: var(--site-hdr-logo-h);
}

.site-burger__call {
    justify-self: end;
}

.site-burger__body {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding: 40px 20px;
}

.site-burger__top {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.site-burger__nav,
.site-burger__contacts,
.site-burger__apps {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

/* Теги разделов и приложения — с планшета */
.site-burger .site-tag,
.site-burger__apps,
.site-burger__cta {
    display: none;
}

/* Пункты меню. На телефоне — один столбик в порядке макета (меню-списки «растворяются», порядок — order) */
.site-burger__menus {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.site-burger__menu {
    display: contents;
    margin: 0;
    padding: 0;
    list-style: none;
}

.site-burger__item--1 { order: 1; }
.site-burger__item--2 { order: 2; }
.site-burger__item--3 { order: 3; }
.site-burger__item--4 { order: 4; }
.site-burger__item--5 { order: 5; }
.site-burger__item--6 { order: 6; }
.site-burger__item--7 { order: 7; }
.site-burger__item--8 { order: 8; }

.site-burger__link {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 0;
    border: 0;
    background: none;
    font-family: var(--site-font);
    font-size: var(--site-fs-body);
    font-weight: 400;   /* как у пунктов подвала */
    line-height: 1.3;
    color: #fff;
    text-align: left;
    text-transform: uppercase;
    cursor: pointer;
    transition: color var(--site-t) var(--site-ease);
}

/* пункты-ссылки («Виртуальный тур», «Направления»…) — обычным регистром; капсом — только пункты
   с выпадающим списком («Клубы», «О клубе», «Зоны клуба») */
a.site-burger__link {
    text-transform: none;
}

.site-burger__link:hover {
    color: var(--site-blue-200);
}

.site-burger__item.is-open > .site-burger__link {
    color: var(--site-blue-line);
}

.site-burger__link:active {
    color: var(--site-blue-600);
}

/* Треугольник ▾ у раскрывающихся пунктов: белый, у раскрытого — голубой (ассеты caret-white / caret-blue) */
.site-burger__caret {
    flex: none;
    width: 10px;
    height: 10px;
    background: url("/local/templates/escalada/css/../images/layout/caret-white.svg") no-repeat center top / 8.66px 7.5px;
    transform: rotate(180deg);
    transition: transform var(--site-t) var(--site-ease);
}

.site-burger__item.is-open .site-burger__caret {
    background-image: url("/local/templates/escalada/css/../images/layout/caret-blue.svg");
}

.site-burger__sub {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin: 10px 0 0;
    padding: 0;
    list-style: none;
}

.site-burger__sub[hidden] {
    display: none;
}

.site-burger__sub a {
    font-size: var(--site-fs-body);
    font-weight: 300;
    line-height: 1.3;
    color: var(--site-muted);
    transition: color var(--site-t) var(--site-ease);
}

.site-burger__sub a:hover {
    color: var(--site-blue-200);
}

.site-burger__sub a[aria-current] {
    color: var(--site-blue-400);
}

.site-burger__sub a:active {
    color: var(--site-blue-600);
}

/* Контакты. На телефоне — под разделителем, обычным шрифтом */
.site-burger__contacts {
    padding-top: 20px;
    border-top: 1px solid #213247;
}

.site-burger__reach {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.site-burger__place {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.site-burger__phone,
.site-burger__email,
.site-burger__address {
    font-size: var(--site-fs-body);
    color: #fff;
    transition: color var(--site-t) var(--site-ease);
}

/* номер и почта — одной строкой (в номере обычные пробелы: его подменяет Roistat) */
.site-burger__phone,
.site-burger__email {
    white-space: nowrap;
}

.site-burger__phone:hover,
.site-burger__email:hover,
.site-burger__address:hover {
    color: var(--site-blue-200);
}

.site-burger__phone:active,
.site-burger__email:active,
.site-burger__address:active {
    color: var(--site-blue-600);
}

.site-burger__hours {
    font-size: var(--site-fs-body);
    color: var(--site-muted);
}

.site-burger__bottom {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.site-burger__docs {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin: 0;
    padding: 0;
    list-style: none;
}

/* как документы в подвале: тот же цвет, размер и высота строки */
.site-burger__doc {
    font-size: var(--site-fs-body);
    line-height: 1.3;
    color: var(--site-white);
    white-space: nowrap;
    transition: color var(--site-t) var(--site-ease);
}

.site-burger__doc:hover {
    color: var(--site-blue-200);
}

.site-burger__doc:active {
    color: var(--site-blue-600);
}

/* Логотип-«полосы» в углу (телефон) */
.site-burger__bg {
    position: absolute;
    right: -61px;
    bottom: 32px;
    width: 299px;
    height: 169px;
    pointer-events: none;
}

@media (min-width: 540px) {
    .site-burger__head {
        padding: 0 40px;
    }
}

/* ---------- Планшет ---------- */

@media (min-width: 640px) {
    .site-burger__body {
        gap: 40px;
        padding: 0 40px 40px;
    }

    .site-burger__top {
        display: grid;
        grid-template-columns: 334px 1fr;
        gap: 40px 20px;
    }

    .site-burger .site-tag {
        display: inline-flex;
    }

    .site-burger__contacts {
        padding-top: 0;
        border-top: 0;
    }

    .site-burger__reach {
        gap: 20px;
    }

    .site-burger__apps {
        grid-column: 1 / -1;
        display: flex;
        gap: 10px;
    }

    .site-burger__apps-list {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 20px;
    }

    .site-burger__app {
        height: 79px;
        padding: 10px 20px;   /* слева — как у остальных кнопок сторов (было 10px — иконка у самого края) */
    }

    .site-burger__docs {
        flex-direction: row;
        flex-wrap: wrap;
        gap: 10px 30px;
    }

    .site-burger__bg {
        display: none;
    }
}

/* ---------- Десктоп: плашка сверху поверх размытой страницы ---------- */

@media (min-width: 1200px) {
    .site-burger__overlay {
        display: block;
        position: absolute;
        inset: 0;
        background: rgba(8, 14, 25, 0.3);
        -webkit-backdrop-filter: blur(10px);
        backdrop-filter: blur(10px);
        opacity: 0;
        transition: opacity var(--site-t) var(--site-ease);
    }

    .site-burger.is-open .site-burger__overlay {
        opacity: 1;
    }

    .site-burger__panel {
        bottom: auto;
        max-height: 100%;
        border-radius: 0 0 30px 30px;
        box-shadow: 0 25px 56px rgba(68, 103, 150, 0.26), 0 101px 101px rgba(68, 103, 150, 0.23),
                    0 227px 136px rgba(68, 103, 150, 0.13), 0 404px 162px rgba(68, 103, 150, 0.04);
    }

    .site-burger__head {
        display: flex;
        justify-content: space-between;
        height: 68px;
        padding: 0 var(--site-pad);
    }

    /* в макете — белый крестик 24 px (Material «close») */
    .site-burger__close {
        width: 24px;
        height: 24px;
        color: #fff;
    }

    .site-burger__close-icon {
        width: 16px;
        height: 16px;
    }

    .site-burger__logo {
        position: absolute;
        top: 4px;
        left: 50%;
        transform: translateX(-50%);
        padding: 6.47px 10.97px;
    }

    .site-burger__logo img {
        width: 64.06px;
        height: 47.06px;
    }

    .site-burger__call {
        display: none;
    }

    .site-burger__body {
        gap: 60px;
        padding: 30px var(--site-pad) 60px;
    }

    .site-burger__top {
        display: flex;
        flex-direction: row;
        align-items: flex-start;
        gap: 20px;
    }

    .site-burger__nav {
        flex: none;
    }

    .site-burger__menus {
        flex-direction: row;
        gap: 20px;
    }

    .site-burger__menu {
        display: flex;
        flex-direction: column;
        gap: 20px;
        width: 250px;
    }

    .site-burger__item { order: 0; }

    .site-burger__link {
        font-family: var(--site-font-title);
    }

    .site-burger__sub a {
        font-family: var(--site-font-title);
        font-weight: 300;
        color: #fff;
    }

    .site-burger__contacts {
        flex: none;
        width: 220px;
    }

    .site-burger__address {
        max-width: 202px;
    }

    .site-burger__hours {
        max-width: 202px;
    }

    .site-burger__place {
        gap: 10px;
    }

    /* 1200–1679: кнопки сторов столбиком у правого края, с 1680 — в строку */
    .site-burger__apps {
        flex: 1;
        min-width: 0;
        align-items: flex-end;
    }

    .site-burger__apps .site-tag {
        align-self: flex-end;
    }

    .site-burger__apps-list {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
    }

    .site-burger__app {
        height: auto;
        padding: 20px;
    }

    .site-burger__bottom {
        flex-direction: row;
        align-items: flex-end;
        justify-content: space-between;
    }

    .site-burger__cta {
        display: inline-flex;
        width: 280px;
    }

    /* между документами — 30px, как на планшете (вплотную они читались одной строкой) */
    .site-burger__docs {
        flex-wrap: nowrap;
        gap: 30px;
    }
}

@media (min-width: 1680px) {
    .site-burger__menu {
        width: 282px;
    }

    .site-burger__contacts {
        width: 283px;
    }

    .site-burger__apps-list {
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: flex-end;
    }
}

/* Шире 1920 — плашка меню шириной 1920 по центру (как в макете), по бокам — размытая страница */
@media (min-width: 1921px) {
    .site-burger__panel {
        left: calc(50% - 960px);
        right: calc(50% - 960px);
        --site-pad: 60px;
    }
}

/* ==========================================================================
   Движение и фокус (как на главной: css/pages/main-page.css, «Движение»)
   - переходы состояний (hover / click / focus) — var(--site-t) var(--site-ease) = 0.3s ease-out;
   - фокус с клавиатуры — рамка 2px #4d85e0 с отступом 2px у всех ссылок и кнопок;
   - шапка и подвал — без анимаций появления (статичные); меню: пункты выезжают слева по очереди,
     раскрытые подпункты — сверху; бургер при нажатии уходит в прозрачность, крестик меню проявляется;
   - prefers-reduced-motion — без анимаций.
   ========================================================================== */

.site-header a:focus-visible,
.site-header button:focus-visible,
.site-burger a:focus-visible,
.site-burger button:focus-visible,
.site-footer a:focus-visible {
    outline: 2px solid var(--site-focus);
    outline-offset: 2px;
    border-radius: 4px;
}

.site-header .site-btn:focus-visible,
.site-burger .site-btn:focus-visible {
    border-radius: 999px;
}

.site-burger .site-app:focus-visible,
.site-footer .site-app:focus-visible {
    border-radius: 15px;
}

@keyframes site-from-left {
    from { opacity: 0; transform: translateX(calc(-1 * var(--site-reveal-shift))); }
}

@keyframes site-from-right {
    from { opacity: 0; transform: translateX(var(--site-reveal-shift)); }
}

@keyframes site-fade-down {
    from { opacity: 0; transform: translateY(-8px); }
}

@keyframes site-fade-in {
    from { opacity: 0; }
}

@media (prefers-reduced-motion: no-preference) {
    /* Меню: пункты — слева по очереди (по 40 мс), контакты, приложения и низ — следом */
    .site-burger.is-open .site-burger__item,
    .site-burger.is-open .site-tag {
        animation: site-from-left var(--site-t) var(--site-ease) backwards;
        animation-delay: calc(0.1s + var(--site-i, 0) * 0.04s);
    }

    .site-burger__item--1 { --site-i: 0; }
    .site-burger__item--2 { --site-i: 1; }
    .site-burger__item--3 { --site-i: 2; }
    .site-burger__item--4 { --site-i: 3; }
    .site-burger__item--5 { --site-i: 4; }
    .site-burger__item--6 { --site-i: 5; }
    .site-burger__item--7 { --site-i: 6; }
    .site-burger__item--8 { --site-i: 7; }

    .site-burger.is-open .site-burger__contacts,
    .site-burger.is-open .site-burger__apps,
    .site-burger.is-open .site-burger__bottom {
        animation: site-fade-in var(--site-reveal-t) var(--site-ease) 0.25s backwards;
    }

    /* ПК: приложения — справа */
    @media (min-width: 1200px) {
        .site-burger.is-open .site-burger__apps {
            animation-name: site-from-right;
        }
    }

    .site-burger.is-open .site-burger__close-icon {
        animation: site-fade-in var(--site-t) var(--site-ease) 0.1s backwards;
    }

    /* Раскрытые подпункты меню — съезжают сверху */
    .site-burger__sub:not([hidden]) {
        animation: site-fade-down var(--site-t) var(--site-ease);
    }
}

@media (prefers-reduced-motion: reduce) {
    .site-header,
    .site-header *,
    .site-burger,
    .site-burger * {
        transition-duration: 0s !important;
        animation: none !important;
    }
}

/* End */


/* Start:/local/templates/escalada/css/footer.css?179154386213813*/
/* ==========================================================================
   Подвал (макет Figma «Дизайн (Главная)»: footer)
   Разметка — footer.php, данные клуба — local/include/site-layout.php.
   Цвета, шрифты, .site-doc / .site-app — в css/header.css.
   MOBILE-FIRST: база — телефон (390), дальше 640 (планшет), 1200 и 1680 (десктоп).
   ========================================================================== */

.site-footer {
    padding-top: 40px;
    background: var(--site-bg);
    font-family: var(--site-font);
    font-size: var(--site-fs-body);
    line-height: 1.3;
    color: var(--site-white);
}

/* Переход на все свойства, которые меняются при наведении и нажатии: это правило сильнее, чем
   у отдельных кнопок (.site-app, .site-footer__filial, иконки мессенджеров) — иначе у них плавно
   менялся только цвет текста, а обводка и фон — резко */
.site-footer a {
    color: inherit;
    transition: color var(--site-t) var(--site-ease),
                border-color var(--site-t) var(--site-ease),
                background-color var(--site-t) var(--site-ease);
}

.site-footer a:hover {
    color: var(--site-blue-200);
}

.site-footer a:active {
    color: var(--site-blue-600);
}

.site-footer p,
.site-footer h3,
.site-footer ul,
.site-footer address {
    margin: 0;
    padding: 0;
    font-style: normal;
}

.site-footer ul {
    list-style: none;
}

.site-footer__container {
    padding: 0 20px;
}

/* ---------- Верх: логотип, почта, мессенджеры ---------- */

.site-footer__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding-bottom: 30px;
    border-bottom: 1px solid var(--site-neutral-900);
}

.site-footer__logo img {
    display: block;
    width: 90px;
    height: 60px;
}

.site-footer__contacts {
    display: flex;
    flex-direction: column-reverse;   /* телефон и планшет: иконки сверху, почта под ними */
    gap: 20px;
}


.site-footer__social {
    display: flex;
    gap: 10px;
}

.site-footer__social-link {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border: 1px solid var(--site-blue-400);
    border-radius: 6px;
    transition: border-color var(--site-t) var(--site-ease), background-color var(--site-t) var(--site-ease);
}

.site-footer__social-link:hover {
    border-color: var(--site-blue-200);
    background-color: rgba(0, 177, 253, 0.12);
}

.site-footer__social-link:active {
    border-color: var(--site-blue-600);
    background-color: rgba(0, 144, 206, 0.2);
}

.site-footer__social-link img {
    display: block;
    width: 20px;
    height: 20px;
}

/* Узкий телефон: шесть иконок в ряд рядом с логотипом — плотнее, как в макете 320 (шаг 4px, до логотипа 10px);
   до 359 — иконки 26px (иначе ряд вылезал за край экрана) */
@media (max-width: 419px) {
    .site-footer__top {
        gap: 10px;
    }

    .site-footer__social {
        gap: 4px;
    }
}

@media (max-width: 359px) {
    .site-footer__social-link {
        width: 26px;
        height: 26px;
    }

    .site-footer__social-link img {
        width: 18px;
        height: 18px;
    }
}

/* ---------- Середина: меню, документы, филиалы, приложение ---------- */

.site-footer__middle {
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding: 30px 0;
}

.site-footer__menu {
    display: flex;
    flex-wrap: wrap;
    gap: 20px 10px;
}

/* заголовок колонки → ссылки: 16px (телефон) / 20px — было 10px, читалось сплошным текстом */
.site-footer__col {
    display: flex;
    flex-direction: column;
    gap: var(--site-footer-title-gap);
}

.site-footer {
    --site-footer-title-gap: 16px;
}

@media (min-width: 705px) {
    .site-footer {
        --site-footer-title-gap: 20px;
    }
}

.site-footer__col--nav,
.site-footer__col--info {
    width: calc(50% - 5px);
}

.site-footer__col--more {
    width: 100%;
    gap: 20px;
}

/* Документы: метка «pdf» — у верхнего края названия (длинное название переносится в несколько строк) */
.site-footer .site-doc {
    align-items: flex-start;
}

.site-footer .site-doc__tag {
    margin: 1px 0 0;
}

.site-footer__group {
    display: flex;
    flex-direction: column;
    gap: var(--site-footer-title-gap);
}

.site-footer__title {
    margin: 0;
    font-family: var(--site-font);
    font-size: var(--site-fs-h3);
    font-style: normal;
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: 0;
    color: var(--site-white);
    text-transform: uppercase;
}

.site-footer__list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.site-footer__filial {
    display: inline-flex;
    align-self: flex-start;
    align-items: center;
    gap: 12px;
    max-width: 100%;
    padding: 12px 20px 12px 12px;   /* под шрифт 15–16px; в макете 20px со всех сторон под 18px */
    border: 2px solid var(--site-line);
    border-radius: 15px;
    background: var(--site-card);
    transition: border-color var(--site-t) var(--site-ease);
}

.site-footer a.site-footer__filial {
    color: var(--site-gray);
}

.site-footer a.site-footer__filial:hover {
    border-color: var(--site-blue-200);
    color: var(--site-white);
}

.site-footer a.site-footer__filial:active {
    border-color: var(--site-blue-600);
}

.site-footer__filial-icon {
    flex: none;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border: 1px solid rgba(0, 160, 227, 0.2);
    border-radius: 6px;
    background: rgba(70, 127, 209, 0.1);
}

.site-footer__filial-icon img {
    display: block;
    width: 20px;
    height: 20px;
}

/* название в одну строку; в узкой колонке (768, 1200–1440) — переносится, карточка не вылезает */
.site-footer__filial-name {
    min-width: 0;
}

/* Приложение */
.site-footer__apps {
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding: 20px;
    border: 2px solid var(--site-line);
    border-radius: 20px;
    background: var(--site-card);
}

.site-footer__apps-text {
    display: flex;
    flex-direction: column;
    gap: 10px;
    max-width: 320px;
}

.site-footer__apps-descr {
    color: var(--site-gray);
}

.site-footer__apps-list {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

/* Телефон: кнопки сторов — только иконки */
.site-footer__app {
    height: 79px;
}

.site-footer__app .site-app__text {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
}

/* ---------- Низ: часы, телефон, адрес, копирайт ---------- */

.site-footer__bottom {
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding: 30px 20px;
    background: var(--site-black);
    color: var(--site-gray);
}

.site-footer__company,
.site-footer__contact,
.site-footer__address {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.site-footer__contact { order: 1; }
.site-footer__company { order: 2; flex-flow: row wrap; }
.site-footer__address { order: 3; flex-flow: row wrap; }

.site-footer__phone { order: -1; }


/* ссылки внизу (телефон, «Смотреть на карте») — белые, как остальные ссылки подвала; текст вокруг — серый */
.site-footer__bottom a {
    color: var(--site-white);
}

.site-footer__phone,
.site-footer__email {
    white-space: nowrap;
}

/* ---------- Планшет ---------- */

@media (min-width: 640px) {
    .site-footer__container {
        padding: 0 40px;
    }

    .site-footer__middle {
        gap: 40px;
    }

    /* 640–899: «Навигация» и «Информация» — в два столбца, «Документы» и «Филиалы» — строкой ниже
       во всю ширину (как на телефоне): в третьей колонке длинные названия документов ломались по слову */
    .site-footer__menu {
        gap: 30px 20px;
    }

    .site-footer__col--nav,
    .site-footer__col--info {
        width: calc(50% - 10px);
    }
}

/* ---------- Широкий планшет: меню подвала — три колонки ---------- */

@media (min-width: 900px) {
    .site-footer__menu {
        flex-wrap: nowrap;
        gap: 20px;
    }

    .site-footer__col--nav,
    .site-footer__col--info,
    .site-footer__col--more {
        flex: 1;
        width: auto;
        min-width: 0;
    }
}

@media (min-width: 640px) {

    .site-footer__apps {
        gap: 30px;
        padding: 30px;
    }

    .site-footer__apps-text {
        max-width: none;
    }

    .site-footer__apps-list {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
    }

    .site-footer__app .site-app__text {
        position: static;
        width: auto;
        height: auto;
        overflow: visible;
        clip: auto;
    }

    .site-footer__bottom {
        display: grid;
        grid-template-columns: 1fr auto;
        grid-template-areas:
            "contact contact"
            "company address";
        padding: 30px 40px;
    }

    .site-footer__contact {
        grid-area: contact;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: space-between;
    }

    .site-footer__phone { order: 0; }

    .site-footer__company {
        grid-area: company;
        flex-direction: column;
    }

    .site-footer__address {
        grid-area: address;
        flex-direction: column;
        align-items: flex-end;
        text-align: right;
    }
}

/* ---------- Десктоп ---------- */

@media (min-width: 1200px) {
    .site-footer__container {
        padding: 0 var(--site-pad);
    }

    .site-footer__contacts {
        flex-direction: row;
        align-items: center;
        gap: 60px;
    }

    .site-footer__middle {
        flex-direction: row;
        align-items: flex-start;
        justify-content: space-between;
        gap: 20px;
    }

    .site-footer__menu {
        flex: 1;
        gap: 40px;
        max-width: 860px;
    }

    .site-footer__col--nav,
    .site-footer__col--info,
    .site-footer__col--more {
        flex: 0 1 auto;
    }

    .site-footer__col--info {
        max-width: 220px;
    }

    /* по содержимому: карточка «Escalada Академическая» у Коммунарки — в одну строку */
    .site-footer__col--more {
        width: auto;
        min-width: 240px;
        max-width: 283px;   /* длинные названия документов переносятся, а не растягивают колонку */
        flex: none;
    }

    /* 1200–1679: текст слева, кнопки сторов-иконки столбиком справа */
    .site-footer__apps {
        flex: none;
        flex-direction: row;
        width: 350px;
    }

    .site-footer__apps-list {
        display: flex;
        flex-direction: column;
        flex: none;
    }

    .site-footer__app {
        height: auto;
        padding: 20px;
    }

    .site-footer__app .site-app__text {
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        clip: rect(0 0 0 0);
    }

    .site-footer__bottom {
        grid-template-columns: auto auto auto;
        grid-template-areas: "contact address company";
        justify-content: space-between;
        padding: 30px var(--site-pad);
    }

    .site-footer__contact {
        flex-direction: column;
        justify-content: flex-start;
    }

    .site-footer__address {
        align-items: flex-start;
        text-align: left;
    }

    .site-footer__company {
        align-items: flex-end;
        text-align: right;
    }
}

@media (min-width: 1680px) {
    .site-footer__menu {
        gap: 20px;
        max-width: none;
    }

    .site-footer__col--nav,
    .site-footer__col--info {
        width: 284px;
        max-width: none;
        flex: none;
    }

    .site-footer__col--more {
        width: 283px;
        gap: 30px;
    }


    /* 1920: текст сверху, кнопки сторов с подписями в строку */
    .site-footer__apps {
        flex-direction: column;
        gap: 30px;
        width: auto;
        padding: 30px;
    }

    .site-footer__apps-text {
        max-width: 670px;
    }

    .site-footer__apps-list {
        flex-direction: row;
    }

    .site-footer__app {
        width: 210px;
    }

    .site-footer__app .site-app__text {
        position: static;
        width: auto;
        height: auto;
        overflow: visible;
        clip: auto;
    }

    /* 1920: копирайт слева, часы с телефоном и адрес — справа */
    .site-footer__bottom {
        grid-template-columns: 1fr 434px auto;
        grid-template-areas: "company contact address";
        column-gap: 20px;
    }

    .site-footer__bottom > .site-footer__company {
        align-items: flex-start;
        text-align: left;
    }
}

/* End */
/* /local/templates/escalada/css/pages/main-page.css?1791543862188597 */
/* /local/templates/escalada/js/vendor/jquery.formstyler.css?17915438622175 */
/* /local/templates/escalada/js/vendor/jquery.formstyler.theme.css?179154386210882 */
/* /local/templates/escalada/js/vendor/owl.carousel.css?17915438622880 */
/* /local/templates/escalada/js/vendor/fancybox/jquery.fancybox.css?179154386214323 */
/* /local/templates/escalada/css/fonts.css?17915438624828 */
/* /local/templates/escalada/css/base.css?17915438629738 */
/* /local/templates/escalada/css/header.css?179154386242905 */
/* /local/templates/escalada/css/footer.css?179154386213813 */