/* ==========================================================================
   1. GLOBAL & TYPOGRAPHY (Cleaned & Enlarged)
   ========================================================================== */

/* --- 1. ШРИФТЫ --- */
@font-face {
    font-family: 'Almoni';
    src: url('../fonts/almoni-regular-aaa.otf') format('opentype');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Almoni';
    src: url('../fonts/almoni-bold-aaa.otf') format('opentype');
    font-weight: 700;
    font-style: normal;
}

/* Применяем шрифт ко всем текстовым элементам корректно */
body, h1, h2, h3, h4, h5, h6, p, a, span, button, input, textarea, li {
    font-family: 'Almoni', sans-serif !important;
}


html, body {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden !important;
    margin: 0;
    padding: 0;
}


:root {
    --brand-yellow: #fcd35e;
    --brand-orange: #f18a25;
    --brand-blue-dark: #3591cf;
    --ice-bg: #eaf8ff;
    --ice-dark: #074492;
    --btn-radius: 12px;
}

/* Базовые сбросы (только для основных тегов, а не для всего подряд) */
body {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    background-color: var(--ice-bg);
    color: #333;
    font-size: 20px;
    line-height: 1.6;
    overflow-x: hidden;
}

/* Убираем точки у списков (те самые непонятные точки) */
ul { 
    list-style: none; 
    margin: 0; 
    padding: 0; 
}

a { text-decoration: none; color: inherit; }

/* --- 2. ВОЗВРАЩАЕМ ЦВЕТА АКТИВНЫХ ЭЛЕМЕНТОВ --- */

/* Синяя кнопка выбранного языка */
.main-header-right-langs .langs--active a { 
    background-color: var(--brand-blue-dark) !important; 
    color: #fff !important; 
    border-color: var(--brand-blue-dark) !important;
}

/* Фон мобильного меню (Синий градиент) */
.open-menu--links {
    background: linear-gradient(160deg, var(--brand-blue-dark), var(--ice-dark)) !important;
    padding: 0 30px 0 50px;
}

/* --- 3. КРУПНЫЕ КНОПКИ (Твой новый стиль) --- */
.btn, 
.btn-shard, 
.service-btn, 
.btn-brand-yellow-large, 
.btn-brand-call, 
.orders-book-now, 
.main-provide-permission,
.footer-yellow-btn,
.btn-step-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 26px !important; 
    font-weight: 800 !important;
    text-transform: uppercase;
    padding: 18px 35px;
    border-radius: var(--btn-radius);
    transition: all 0.3s ease;
    cursor: pointer;
    border: none;
}

/* Цвета кнопок */
.btn-primary, .main-provide-permission, .btn-shard, .orders-book-now { 
    background-color: var(--brand-blue-dark) !important;
    color: #fff !important;
}

.btn-brand-yellow-large {
    background-color: var(--brand-yellow) !important;
    color: var(--ice-dark) !important;
}

/* Квадратные карточки на главной */
.services-buttons-row {
    display: flex;
    gap: 12px !important;
    justify-content: center;
    flex-wrap: wrap;
    padding: 20px 0;
}

.service-btn {
    aspect-ratio: 1 / 1;
    min-width: 220px;
    flex: 0 1 220px;
    height: 220px !important; /* Жестко для квадрата */
}
html[dir="rtl"] .btn-brand-yellow-large,
html[dir="rtl"] .btn-permission,
html[dir="rtl"] .btn-brand-call,
html[dir="rtl"] .orders-book-now,
html[dir="rtl"] .footer-yellow-btn {
    flex-direction: row-reverse !important;
}

/* 2. Переносим отступ иконки на правильную сторону */
html[dir="rtl"] .btn-brand-yellow-large i,
html[dir="rtl"] .btn-permission i,
html[dir="rtl"] .btn-brand-call i,
html[dir="rtl"] .orders-book-now i {
    margin-right: 0 !important;
    margin-left: 15px !important; /* Отступ теперь будет справа от иконки */
}

/* Специально для маленьких кнопок (в хедере или футере), если там иконки */
html[dir="rtl"] .main-header-right-orders a {
    flex-direction: row-reverse !important;
    gap: 10px !important;
}

/* ==========================================================================
   2. HEADER (CLEAN & ENLARGED LOGO)
   ========================================================================== */
.main-header {
    display: flex; justify-content: space-between; align-items: center;
    height: 110px; padding: 0 40px;
    position: relative; z-index: 100;
    background: rgba(255, 255, 255, 0.95); /* Более плотный белый фон */
    backdrop-filter: blur(10px);
    border-bottom: 2px solid #e1efff;
}

/* ЛОГОТИПЫ: Холон больше, Федерация меньше */
.main-header-left { display: flex; align-items: center; gap: 20px; }

.main-header-left-logo img { 
    width: 180px; /* Увеличили лого Холона (было 145) */
    height: auto; 
}

.iisf-logo img { 
    height: 45px; /* Уменьшили федерацию (было 65) */
    width: auto; 
    filter: grayscale(0.2); /* Слегка приглушили, чтоб не отвлекал */
}

.main-header-right { display: flex; align-items: center; gap: 20px; }
.main-header-right-orders { display: flex; align-items: center; gap: 12px; }

/* === КНОПКИ В ХЕДЕРЕ (БЕЗ ОСКОЛКОВ) === */
.main-header-right-orders a {
    padding: 0 20px; height: 48px;
    display: flex; align-items: center; justify-content: center;
    font-size: 14px; font-weight: 800;
    text-transform: uppercase;
    clip-path: none !important;
    border-radius: 10px; /* Скругление */
    transition: all 0.3s ease;
}

/* Забронировать - Синяя */
.orders-book-now { 
    background-color: var(--brand-blue-dark) !important;
    color: #fff !important;
    border-radius: 12px !important;
}

/* Кнопка VIP День Рождения (Оранжевая — чтобы выделялась!) */
.orders-book-now.orders-vip-birthday {
    background-color: var(--brand-orange) !important;
    color: #fff !important;
    border: none !important;
    border-radius: 12px !important;
}

.orders-book-now:hover, .orders-vip-birthday:hover {
    filter: brightness(1.1);
    transform: translateY(-2px);
}

/* === ЯЗЫКИ (Langs) - Квадратные со скруглением === */
.main-header-right-langs ul { display: flex; gap: 8px; }
.main-header-right-langs a {
    width: 40px; height: 40px; 
    border: 2px solid #e1efff; 
    border-radius: 8px; /* Скругленный квадрат */
    display: flex; align-items: center; justify-content: center;
    font-size: 13px; font-weight: 800; 
    color: var(--ice-dark); 
    background: #fff;
    transition: all 0.3s;
}

.main-header-right-langs .langs--active a { 
    background: var(--ice-primary); 
    color: #fff; 
    border-color: var(--ice-primary);
}

.main-header-right-langs a:hover { 
    border-color: var(--ice-primary);
    color: var(--ice-primary);
}

/* === БУРГЕР (Синий и аккуратный) === */
.main-header-right-menus {
    display: flex; cursor: pointer; width: 45px; height: 45px;
    align-items: center; justify-content: center;
}
.main-header-right-menus span, 
.main-header-right-menus:before, 
.main-header-right-menus:after {
    content: ''; display: block; width: 30px; height: 3px;
    background: var(--ice-dark); /* Темно-синий */
    position: absolute; transition: all 0.3s ease;
    border-radius: 3px;
}
.main-header-right-menus:before { transform: translateY(-9px); }
.main-header-right-menus:after { transform: translateY(9px); }
/* ==========================================================================
   3. MOBILE MENU (REVISED)
   ========================================================================== */
.open-menu {
    position: fixed; top: 0; left: 0; width: 100%; height: 100%;
    background-color: rgba(0, 0, 0, 0.6); z-index: 1000;
    opacity: 0; visibility: hidden; transition: opacity 0.4s ease;
}

.open-menu--links {
    position: fixed; top: 0; right: 0; bottom: 0;
    width: 100%; max-width: 450px; height: 100vh;
    /* Синий градиент */
    background: linear-gradient(160deg, var(--ice-primary), var(--ice-dark));
    /* Скошенный край слева */
    clip-path: polygon(10% 0, 100% 0, 100% 100%, 0% 100%);
    
    transform: translateX(100%); 
    transition: transform 0.4s ease-in-out;
    
    display: flex; flex-direction: column; 
    z-index: 1001;
    
    /* Отступы внутри меню */
    padding: 0 30px 0 50px; 
}

body.menu-open { overflow: hidden; }
body.menu-open .open-menu { opacity: 1; visibility: visible; }
body.menu-open .open-menu--links { transform: translateX(0); }

/* --- ВЕРХНЯЯ ПАНЕЛЬ (Языки + место под крестик) --- */
.mobile-menu-top-bar {
    display: flex; 
    align-items: center; 
    justify-content: flex-start; /* Языки слева */
    height: 120px; /* Высота как у хедера, чтобы выровнять с крестиком */
    width: 100%;
    flex-shrink: 0;
}

/* Языки в мобильном меню */
.mobile-langs { display: flex; gap: 15px; }
.mobile-langs a {
    width: 45px; height: 45px; 
    border: 2px solid rgba(255,255,255,0.4); 
    border-radius: 50%; /* Сделаем круглыми для аккуратности или оставьте clip-path */
    /* Если хотите осколки - раскомментируйте строку ниже: */
    /* clip-path: polygon(20% 0%, 80% 0%, 100% 20%, 100% 80%, 80% 100%, 20% 100%, 0% 80%, 0% 20%); */
    
    display: flex; align-items: center; justify-content: center; 
    color: #fff; font-weight: 700; font-size: 14px;
    transition: all 0.3s;
}
.mobile-langs a.active { 
    background: #fff; 
    color: var(--ice-primary); 
    border-color: #fff;
    font-weight: 800;
}

/* --- ИСПРАВЛЕНИЕ КРЕСТИКА (БУРГЕРА) --- */
/* Крестик находится в main-header, но когда меню открыто, он должен быть белым */
body.menu-open .main-header-right-menus span { background: transparent !important; }

body.menu-open .main-header-right-menus:before,
body.menu-open .main-header-right-menus:after {
    background-color: #ffffff !important; /* Ярко-белый цвет */
    height: 3px !important; /* Чуть тоньше для изящности */
    box-shadow: 0 0 5px rgba(0,0,0,0.2); /* Тень чтобы видно на любом фоне */
}

/* --- СКРОЛЛ НАВИГАЦИИ --- */
.open-menu--links--scroll { 
    flex: 1; 
    overflow-y: auto; 
    padding-bottom: 50px; 
    padding-top: 20px;
    /* Тонкая линия разделения языков и меню */
    border-top: 1px solid rgba(255,255,255,0.1);
}

.open-menu--links__navigation li a {
    display: block; padding: 15px 0; color: #fff; font-size: 22px; font-weight: 700;
    border-bottom: 1px solid rgba(255,255,255,0.05);
}

.open-menu--links__navigation li a:hover { 
    padding-left: 10px; 
    color: #e0f2fe; 
    text-shadow: 0 0 10px rgba(255,255,255,0.3);
}

/* --- НИЖНЯЯ ЧАСТЬ (IISF) --- */
.mobile-menu-extras { 
    margin-top: 30px; 
    padding-top: 20px; 
    border-top: 1px solid rgba(255,255,255,0.1); 
}
.mobile-iisf img { height: 60px; width: auto; opacity: 0.8; }

/* --- ВЕРХНЯЯ ПАНЕЛЬ --- */
.mobile-menu-top-bar {
    display: flex; 
    align-items: center; 
    justify-content: space-between; /* Разносим языки и крестик по краям */
    height: 100px;
    width: 100%;
    flex-shrink: 0;
    margin-bottom: 20px;
}

/* --- ЯВНЫЙ КРЕСТИК ВНУТРИ МЕНЮ --- */
.mobile-close-btn {
    width: 45px; 
    height: 45px; 
    cursor: pointer; 
    position: relative;
    border: 2px solid rgba(255,255,255,0.3); /* Легкая рамка */
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    transition: all 0.3s ease;
}

.mobile-close-btn:hover {
    background: rgba(255,255,255,0.1);
    border-color: #fff;
    transform: rotate(90deg); /* Эффект вращения */
}

.mobile-close-btn span {
    display: block;
    width: 24px; 
    height: 2px; 
    background: #fff; 
    position: absolute;
    border-radius: 2px;
}

.mobile-close-btn span:first-child { transform: rotate(45deg); }
.mobile-close-btn span:last-child { transform: rotate(-45deg); }


/* --- ИСПРАВЛЕНИЕ: Скрываем старый бургер при открытом меню --- */
/* Чтобы он не просвечивал или не мешал */
body.menu-open .main-header-right-menus { opacity: 0; pointer-events: none; }

/* --- Видео-баннер (Уменьшили высоту до 45vh, чтобы видео влезало) --- */
.full-screen-video-container {
    width: 100%; 
    height: 45vh; /* Было 60vh */
    min-height: 300px; 
    overflow: hidden;
    position: relative;
}
.full-screen-video-container video {
    width: 100%; height: 100%; object-fit: cover;
}


@media (max-width: 900px) {
    /* 1. Уменьшаем высоту контейнера еще немного, чтобы "раскрыть" бока видео */
    .full-screen-video-container {
        height: 25vh !important; /* Было 30vh, уменьшили до 25 */
        min-height: 180px;
        background: #000;
        overflow: hidden;
    }

    .full-screen-video-container video {
        width: 100%;
        height: 100%;
        /* object-fit: cover оставляет небольшую обрезку, но заполняет экран. 
           Если хочешь ВООБЩЕ без обрезки (но будут черные полоски сверху/снизу), 
           поменяй на 'contain' */
        object-fit: cover; 
        
        /* Гарантируем отсутствие искусственного масштабирования */
        transform: scale(1); 
        object-position: center center;
    }

    /* 2. Поправим логотипы, чтобы они не жались друг к другу */
    .main-header-left {
        gap: 10px;
    }
    .main-header-left-logo img {
        max-height: 40px; /* Еще чуть компактнее */
    }
    .iisf-logo img {
        max-height: 25px;
    }
}

/* --- ГЛАВНАЯ СТРАНИЦА: ФИНАЛЬНЫЙ СТИЛЬ КАРТОЧЕК --- */

/* --- ГЛАВНАЯ СТРАНИЦА: ФИНАЛЬНЫЙ СТИЛЬ КАРТОЧЕК --- */

.services-buttons-row {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 15px; /* Отступ между карточками */
    flex-wrap: nowrap !important; /* ПРИНУДИТЕЛЬНО В ОДИН РЯД */
    width: 100%;
    margin-bottom: 40px;
}

.service-btn {
    /* ДЕСКТОП: Квадраты, которые подстраиваются под ширину контейнера */
    flex: 1 1 0 !important;      /* Позволяем карточкам равномерно сжиматься вместе */
    max-width: 240px !important; /* Больше 240px они не вырастут */
    width: 100% !important;      /* Занимают доступное пространство */
    height: auto !important;     /* Высота автоматическая... */
    aspect-ratio: 1 / 1 !important; /* ...чтобы всегда сохранять идеальный квадрат */
    
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding: 15px !important; /* Чуть уменьшили отступ, чтобы тексту было просторнее */
    border-radius: 15px;
    
    /* ШРИФТ: Адаптивный, чтобы длинные слова на иврите не вылезали за края при сжатии карточки */
    font-size: clamp(16px, 1.8vw, 24px) !important; 
    font-weight: 900 !important;
    color: #ffffff !important; 
    line-height: 1.2;
    text-transform: uppercase;
    
    box-shadow: 0 6px 15px rgba(0,0,0,0.1);
    transition: all 0.3s ease;
    border: none !important;
    text-decoration: none !important;
}
/* ЦВЕТА КАРТОЧЕК */
.btn-light-blue { background-color: #7bbce8 !important; }
.btn-pink       { background-color: #D81B60 !important; }
.btn-orange     { background-color: #f18a25 !important; }

/* ПОРЯДОК НА ПК: Массовое катание (featured) строго по центру (3-е из 5) */
.service-btn.btn-featured {
    order: 3 !important; 
    background-color: var(--brand-orange) !important;
    box-shadow: 0 10px 25px rgba(241, 138, 37, 0.4) !important;
}
.order-pc-1 { order: 1; }
.order-pc-2 { order: 2; }
.order-pc-4 { order: 4; }
.order-pc-5 { order: 5; }

.service-btn:hover {
    transform: translateY(-8px);
    box-shadow: 0 12px 30px rgba(0,0,0,0.15);
}



.permission-wrapper-new {
    display: flex !important;
    justify-content: center !important;
    width: 100%;
    margin-top: 20px;
    /* ВОТ ЭТО ДОБАВИТ МЕСТО СНИЗУ */
    margin-bottom: 60px !important; 
}

/* Дополнительно увеличим общий отступ белой секции, чтобы кнопки не жались к краям */
.strip-button-section {
    background-color: #ffffff !important;
    width: 100% !important;
    padding: 40px 0 20px 0 !important; /* Увеличили верхний отступ до 40px */
    display: block !important;
}

/* ПРАВКА: Иконка на иврите на другую сторону */
html[dir="rtl"] .main-provide-permission {
    flex-direction: row-reverse !important; /* Разворачиваем порядок иконки и текста */
}
html[dir="rtl"] .main-provide-permission i {
    margin-right: 0 !important;
    margin-left: 15px !important; /* Отступ теперь слева от иконки */
}

/* ОБЩИЙ СТИЛЬ КНОПКИ РАЗРЕШЕНИЯ */
.main-provide-permission {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    
    /* ДОБАВЛЯЕМ ОТСТУП МЕЖДУ ИКОНКОЙ И ТЕКСТОМ */
    gap: 15px !important; 
    
    background-color: var(--brand-yellow) !important;
    color: var(--ice-dark) !important;
    padding: 16px 40px;
    font-size: 23px;
    font-weight: 900;
    text-transform: uppercase;
    text-decoration: none;
    border-radius: 15px !important;
    box-shadow: 0 4px 15px rgba(252, 211, 94, 0.3);
    transition: all 0.3s ease;
}

.main-provide-permission:hover {
    background-color: var(--brand-orange) !important;
    color: #fff !important;
    transform: translateY(-3px);
    box-shadow: 0 6px 20px rgba(241, 138, 37, 0.4);
}

/* ФИКС ДЛЯ ИВРИТА (RTL) */
html[dir="rtl"] .main-provide-permission {
    /* Переставляем иконку влево, текст вправо */
    flex-direction: row-reverse !important;
}

/* Убираем старые маржины у иконки, если они были, чтобы gap работал чисто */
.main-provide-permission i {
    margin: 0 !important;
    font-size: 28px;
}

/* Тексты описаний */
p, .brand-description {
    font-size: 20px !important;
    line-height: 1.7;
}

/* === КАРТА: КОМПАКТНЫЙ И ЧИСТЫЙ СТИЛЬ === */
.main-page-map {
    padding: 60px 0;
    background-color: var(--ice-bg);
}

.main-page-map h3 {
    font-size: 32px;
    text-align: center;
    color: var(--ice-dark);
    margin-bottom: 30px;
    font-weight: 800;
}

.main-map-block {
    display: flex;
    background: #fff;
    border-radius: 20px; /* Скругление углов */
    overflow: hidden;    /* Важно: чтобы карта не вылезала за скругления */
    box-shadow: 0 10px 30px rgba(7, 68, 146, 0.1);
    max-width: 1100px;   /* Ограничиваем ширину всей карточки */
    margin: 0 auto;      /* Центрируем на странице */
    min-height: 400px;   /* Фиксированная высота всей карточки */
}

/* Блок с самой картой */
.main-map-block--frame {
    flex: 1.2; 
    height: 400px;
    line-height: 0;
}

.main-map-block--frame iframe {
    width: 100% !important;
    height: 100% !important;
    border: none !important;
}

/* Блок с текстом рядом с картой */
.main-map-block--info {
    flex: 0.8;
    padding: 40px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    background: #fff;
}

/* Фикс для иврита (RTL) */
html[dir="rtl"] .main-map-block--info {
    text-align: right !important;
}

.main-map-block--info h4 {
    font-size: 24px;
    color: var(--brand-blue-dark);
    margin-bottom: 15px;
    font-weight: 800;
}

.main-map-block--info p {
    font-size: 16px;
    color: #666;
    margin-bottom: 8px;
    line-height: 1.5;
}

/* --- КАРТА: МОБИЛЬНЫЙ ФИКС --- */
@media (max-width: 900px) {
    /* 1. Уменьшаем гигантские отступы всей секции (было 60px) */
    .main-page-map {
        padding: 30px 0 !important;
    }

    /* 2. Заголовок делаем чуть меньше */
    .main-page-map h3 {
        font-size: 24px !important;
        margin-bottom: 20px !important;
    }

    /* 3. Главный контейнер: убираем фикс. высоту и растягивание */
    .main-map-block {
        flex-direction: column !important;
        max-width: 92% !important; /* Чтобы не прилипало к краям экрана */
        min-height: 0 !important;   /* УБИРАЕМ 400px из десктопной версии */
        height: auto !important;
        margin: 0 auto !important;
    }

    /* 4. Рамка с самой картой */
    .main-map-block--frame {
        height: 220px !important; /* Чуть уменьшил высоту самой карты */
        width: 100% !important;
        flex: none !important;
    }

    /* 5. Блок с текстом под картой */
    .main-map-block--info {
        padding: 20px 15px !important; /* Компактные отступы */
        flex: none !important;          /* Запрещаем блоку растягиваться */
        text-align: center !important;
        background: #fff;
    }

    /* 6. Уплотняем строки текста */
    .main-map-block--info h4 {
        font-size: 20px !important;
        margin-bottom: 10px !important;
    }

    .main-map-block--info p {
        font-size: 15px !important;
        margin-bottom: 5px !important; /* Уменьшаем расстояние между строчками адреса */
        line-height: 1.3 !important;
    }
}

/* === 4. GALLERY (Чистая без осколков) === */
.main-block-gallery {
    padding: 30px 0 60px 0 !important; /* Уменьшили до 30px сверху */
    background: #f9fbfd;
}

.main-block-gallery h3 {
    font-size: 36px;
    text-align: center;
    color: var(--ice-dark);
    margin-bottom: 40px;
}

.gallery-container {
    width: 100%;
    max-width: 1300px;
    margin: 0 auto;
    padding: 0 20px;
}

/* Стили слайдов Swiper */
.swiper-slide {
    width: 320px !important; /* Фиксируем ширину */
    height: 240px !important;
    border-radius: 15px !important; /* Скругляем углы */
    overflow: hidden;
    clip-path: none !important; /* УБИРАЕМ ОСКОЛКИ */
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
}

.swiper-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Кнопки навигации галереи */
.swiper-button-prev, .swiper-button-next {
    color: var(--ice-dark);
}

.banner-actions-row {
    display: flex;
    gap: 15px;
    justify-content: center;
    flex-wrap: wrap;
    margin-top: 25px;
}

/* --- СОЦСЕТИ НА ГЛАВНОЙ (ФИНАЛЬНЫЙ ФИКС) --- */
.home-socials-section {
    padding: 60px 0 !important;
    background-color: #fff !important;
    width: 100% !important;
    display: block !important;
    text-align: center !important;
}

.home-socials-section h3 {
    font-size: 32px !important;
    font-weight: 800;
    color: var(--ice-dark);
    margin-bottom: 30px !important;
    text-align: center !important;
}

/* Контейнер иконок */
.home-socials-section .social-box {
    display: flex !important;
    justify-content: center !important; /* Центр по горизонтали */
    align-items: center !important;    /* Центр по вертикали */
    gap: 20px !important;
    width: 100% !important;
    max-width: 600px !important;
    margin: 0 auto !important; /* Центрируем сам контейнер */
    flex-wrap: wrap;
    /* Форсируем LTR, чтобы центрирование и порядок кнопок 
       не ломались особенностями иврита */
    direction: ltr !important; 
}

.home-socials-section .s-icon {
    width: 80px !important;
    height: 80px !important;
    font-size: 38px !important;
    border-radius: 22px !important; /* Закругляем иконки */
    display: flex !important;
    align-items: center;
    justify-content: center;
    box-shadow: 0 5px 15px rgba(0,0,0,0.15) !important;
    transition: all 0.3s ease;
    color: #fff !important; /* Сами значки всегда белые */
}

/* Официальные брендовые цвета */
.s-icon.tk { background-color: #000000 !important; } /* TikTok */
.s-icon.fb { background-color: #1877F2 !important; } /* Facebook */
.s-icon.wa { background-color: #25D366 !important; } /* WhatsApp */
.s-icon.ig { 
    background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%) !important; 
} 

.home-socials-section .s-icon:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 20px rgba(0,0,0,0.15) !important;
}



/* ==========================================================================
   ОБНОВЛЕННЫЙ КОМПАКТНЫЙ ФУТЕР
   ========================================================================== */

.main-footer {
    background-color: #3591cf;
    color: #ffffff;
    padding: 30px 0 15px 0 !important; /* ПУНКТ: Сделали футер ниже */
    width: 100%;
    clear: both;
}

.footer-container {
    max-width: 1300px;
    margin: 0 auto;
    padding: 0 20px;
}

.footer-content {
    display: flex;
    justify-content: space-between;
    align-items: flex-start !important;
    flex-wrap: nowrap; /* Запрещаем колонке с инфо падать вниз на десктопе */
    gap: 40px;
}

.footer-info {
    display: flex;
    flex-direction: column;
    align-items: flex-end !important; /* Прижимаем заголовок и кнопки к правому краю */
    min-width: 500px; /* Даем достаточно места для крупных кнопок */
}

/* Название катка на иврите */
.footer-title {
    color: #fcd35e !important;
    font-size: 24px;
    font-weight: 800;
    margin-bottom: 10px;
    text-transform: uppercase;
}

.footer-col {
    flex: 0 1 auto;
}

/* Блок с контактами */
.footer-contacts {
    text-align: left;
}
html[dir="rtl"] .footer-contacts { text-align: right; }

.footer-contact-links {
    display: flex;
    gap: 20px;
    margin-top: 10px;
}

/* На иврите зеркалим */
html[dir="rtl"] .footer-info {
    align-items: flex-start !important;
}


.footer-buttons-gap {
    display: flex !important;
    flex-direction: row !important; /* Кнопки в ряд */
    justify-content: flex-end !important;
    gap: 12px;
    margin-top: 15px;
}

html[dir="rtl"] .footer-buttons-gap {
    justify-content: flex-start !important;
}


.footer-yellow-btn {
    background-color: var(--brand-yellow) !important;
    color: var(--ice-dark) !important;
    
    /* КРУПНЫЙ СТИЛЬ */
    font-size: 18px !important; 
    font-weight: 800 !important;
    text-transform: uppercase;
    border-radius: 15px !important;
    
    /* ФИКС ПЕРЕНОСА */
    white-space: normal !important; /* Разрешаем перенос */
    text-align: center !important;
    line-height: 1.1 !important; /* Плотный межстрочный интервал для двух строк */
    
    /* ГЕОМЕТРИЯ */
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    padding: 10px 15px !important;
    width: 200px !important; /* Фиксируем ширину, чтобы кнопки были одинаковыми */
    min-height: 65px !important; /* Высота подстроится, если текст в 2 строки */
    
    transition: all 0.3s ease;
    border: none !important;
}

.footer-yellow-btn:hover {
    background-color: #f18a25;
    color: #fff !important;
    transform: translateY(-3px);
}

.footer-line {
    height: 1px;
    background: rgba(255,255,255,0.1);
    margin: 20px 0 15px 0;
}

/* --- ГЛОБАЛЬНЫЙ CTA БЛОК С ЛОГОТИПОМ --- */
.bottom-cta-wrapper {
    background-color: #ffffff;
    padding: 60px 0 100px 0 !important;
    width: 100%;
    clear: both;
    text-align: center;
}

/* Ряд: Логотип + Текст */
.cta-title-row {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    margin-bottom: 35px;
}

/* На иврите разворачиваем (логотип будет с другой стороны) */
html[dir="rtl"] .cta-title-row {
    flex-direction: row-reverse;
}

.cta-mini-logo {
    height: 60px; /* Размер логотипа в этом блоке */
    width: auto;
}

.bottom-cta-wrapper h3 {
    color: var(--brand-blue-dark);
    font-weight: 800;
    font-size: 28px;
    margin: 0;
    line-height: 1.2;
}

/* --- МОБИЛЬНАЯ АДАПТАЦИЯ (до 1024px, чтобы на планшетах не теснились) --- */
@media (max-width: 1024px) {
    .footer-content {
        flex-direction: column !important;
        align-items: center !important;
        text-align: center !important;
    }
    .footer-info {
        align-items: center !important;
        min-width: 100% !important;
    }
    .footer-buttons-gap {
        flex-direction: column !important; /* На мобилках кнопки в столбик */
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
    }
    .footer-yellow-btn {
        width: 90% !important;
        max-width: 350px !important;
    }
}

/* Официальные брендовые цвета */
.s-icon.tk { background-color: #000000; } /* TikTok */
.s-icon.fb { background-color: #1877F2; } /* Facebook */
.s-icon.yt { background-color: #FF0000; } /* YouTube */
.s-icon.wa { background-color: #25D366; } /* WhatsApp */

/* Сложный градиент для Instagram */
.s-icon.ig { 
    background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%); 
}



/* Линия и Копирайт */
.footer-line {
    height: 1px;
    background: rgba(255,255,255,0.1);
    margin: 40px 0 20px 0;
}

.copyright-text {
    text-align: center;
    font-size: 14px;
    opacity: 0.6;
}



.cookie-banner {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    background-color: rgba(7, 68, 146, 0.95); /* Темно-синий бренд */
    color: white;
    padding: 20px 0;
    z-index: 10001; /* Поверх виджета доступности */
    box-shadow: 0 -5px 15px rgba(0,0,0,0.2);
    font-family: 'Almoni', sans-serif;
}
.cookie-content {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}
.cookie-content p {
    margin: 0;
    font-size: 14px;
    line-height: 1.4;
    text-align: {{ 'right' if g.lang == 'he' else 'left' }};
}

/* Контейнер для кнопок */
.cookie-buttons {
    display: flex;
    gap: 10px;
}

/* Общий стиль кнопок баннера */
.cookie-btn {
    padding: 8px 20px;
    border-radius: 8px;
    font-weight: 800;
    cursor: pointer;
    text-transform: uppercase;
    font-size: 13px;
    transition: all 0.2s ease;
    border: 2px solid transparent;
}

/* Кнопка ПРИНЯТЬ (Желтая) */
.cookie-btn-accept {
    background-color: #fcd35e;
    color: #074492;
}

.cookie-btn-accept:hover {
    background-color: #f18a25;
    color: #fff;
    transform: translateY(-2px);
}

/* Кнопка ЗАКРЫТЬ (Контурная белая) */
.cookie-btn-close {
    background-color: transparent;
    border: 2px solid rgba(255, 255, 255, 0.5);
    color: #fff;
}

.cookie-btn-close:hover {
    border-color: #fff;
    background-color: rgba(255, 255, 255, 0.1);
    transform: translateY(-2px);
}

/* Адаптив для мобилок */
@media (max-width: 768px) {
    .cookie-content {
        flex-direction: column;
        text-align: center;
    }
    .cookie-buttons {
        width: 100%;
        justify-content: center;
    }
}


.cookie-link {
    color: #fcd35e !important; /* Желтый цвет как у кнопки */
    text-decoration: underline !important;
    font-weight: bold;
    margin: 0 5px;
}

.cookie-link:hover {
    color: #fff !important;
    text-decoration: none !important;
}

/* Кнопка закрытия в баннере (Крестик) */
.cookie-close-btn {
    position: absolute;
    top: 10px;          /* Чуть выше */
    right: 20px;        /* Чуть дальше от края */
    background: none;
    border: none;
    color: #fff;        /* Сделаем чисто белым для яркости */
    font-size: 40px;    /* Крупный размер */
    font-weight: bold;  /* Жирный */
    cursor: pointer;
    line-height: 0.8;   /* Поджимаем высоту строки, чтобы крестик был по центру */
    padding: 10px;      /* Увеличиваем область клика */
    z-index: 10005;
    opacity: 0.8;
    transition: all 0.2s ease;
}

/* Для ивритской версии (RTL) зеркалим положение */
[dir="rtl"] .cookie-close-btn {
    right: auto;
    left: 20px;
}

/* === CUSTOM MODAL STYLES === */
.custom-modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: none; /* Скрыто по умолчанию */
    align-items: center;
    justify-content: center;
    z-index: 20000; /* Самый высокий приоритет */
}

.custom-modal.active {
    display: flex;
}

.modal-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.7);
    backdrop-filter: blur(5px);
}

.modal-card {
    position: relative;
    background: #fff;
    width: 90%;
    max-width: 450px;
    padding: 40px;
    border-radius: 20px;
    box-shadow: 0 20px 50px rgba(0,0,0,0.3);
    animation: slideUp 0.3s ease-out;
}

@keyframes slideUp {
    from { transform: translateY(50px); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
}

.modal-header-title {
    color: #3591cf;
    font-weight: 800;
    margin-bottom: 25px;
    text-align: center;
}

.modal-field {
    margin-bottom: 15px;
}

.modal-field label {
    display: block;
    font-weight: bold;
    margin-bottom: 5px;
    font-size: 14px;
    color: #333;
}

.modal-field input, .modal-field textarea {
    width: 100%;
    padding: 12px;
    border: 1px solid #ddd;
    border-radius: 10px;
    font-family: inherit;
}

.modal-close {
    position: absolute;
    top: 15px;
    right: 20px;
    background: none;
    border: none;
    font-size: 30px;
    cursor: pointer;
    color: #999;
}

/* КНОПКА НАВЕРХ — ФИКСИРОВАННО СЛЕВА ВЕЗДЕ */
.back-to-top {
    position: fixed;
    /* Принудительно слева на всех языках */
    left: 30px !important;
    right: auto !important;
    
    /* Десктопная высота (приподнятая) */
    bottom: 100px; 
    
    width: 50px;
    height: 50px;
    border-radius: 50%;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    z-index: 10000;
    
    /* Цвета */
    background-color: #3591cf; /* brand-blue-dark */
    color: #ffffff !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
    
    transition: all 0.3s ease;
    opacity: 0;
    visibility: hidden;
}

/* Смена цвета в футере (логика из JS) */
.back-to-top.at-footer {
    background-color: #f18a25 !important; /* brand-orange */
}

/* Принудительно отключаем зеркальное отображение для иврита */
[dir="rtl"] .back-to-top {
    left: 30px !important;
    right: auto !important;
}

.back-to-top.show {
    opacity: 1;
    visibility: visible;
}

.back-to-top:hover {
    transform: translateY(-5px) scale(1.05);
    filter: brightness(1.1);
}

/* АДАПТАЦИЯ ДЛЯ МОБИЛОК */
@media (max-width: 768px) {
    .back-to-top {
        /* На мобилках прижимаем к низу, чтобы не мешала тексту */
        bottom: 20px !important;
        left: 15px !important;
        width: 45px;
        height: 45px;
    }
    
    /* Дублируем для иврита на мобилках */
    [dir="rtl"] .back-to-top {
        left: 15px !important;
        right: auto !important;
    }
}

.page-banner-section {
    width: 100% !important;
    background-color: #3591cf; /* Дефолтный синий */
    padding: 40px 0;
    margin: 0 !important;
    position: relative;
    display: block;
}

/* Цвета для разных страниц */
.page-banner-section.strip-blue   { background-color: #3591cf !important; }
.page-banner-section.strip-pink   { background-color: #D81B60 !important; }
.page-banner-section.strip-orange { background-color: #f18a25 !important; }

/* Внутренний ограничитель (центрует контент) */
.banner-inner-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
    display: flex;
    align-items: center; /* Центрирует фото и текст по вертикали */
    gap: 50px;           /* Расстояние между ними */
    box-sizing: border-box;
}

/* ФОТО КАРТОЧКА */
.banner-image-thumb {
    flex: 0 0 500px;     /* Ширина фото на десктопе */
    height: 350px;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 15px 40px rgba(0,0,0,0.2);
}

.banner-image-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* КОНТЕЙНЕР ДЛЯ ТЕКСТА */
.banner-title-box {
    flex: 1;
}

.banner-title-box h1 {
    color: #ffffff !important;
    font-size: clamp(32px, 4vw, 52px) !important;
    font-weight: 900;
    margin: 0;
    line-height: 1.1;
    text-transform: uppercase;
}

/* --- МОБИЛЬНАЯ АДАПТАЦИЯ (768px и ниже) --- */
@media (max-width: 768px) {
    .page-banner-section {
        padding: 30px 0;
    }

    .banner-inner-container {
        flex-direction: column !important; /* Встают друг под друга */
        gap: 20px;
        text-align: center;
    }

    .banner-image-thumb {
        flex: 0 0 auto;
        width: 100%;
        max-width: 450px;
        height: 250px;
    }

    .banner-title-box h1 {
        font-size: 32px !important;
        text-align: center !important;
    }
}

/* ==========================================================================
   БЛОК КНОПОК ПОД БАННЕРОМ
   ========================================================================== */
.strip-button-section {
    width: 100% !important;
    padding: 40px 0 !important;
    display: flex !important;
    justify-content: center !important;
    background-color: #ffffff;
}

.strip-button-container {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
    flex-wrap: wrap;
    padding: 0 20px;
}

.strip-button-section .btn-brand-yellow-large, 
.strip-button-section .btn-brand-call,
.btn-permission {
    width: 280px !important;
    height: 60px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    border-radius: 12px;
    font-size: 20px;
    font-weight: 800;
    text-decoration: none;
    transition: all 0.3s ease;
}

/* Желтая */
.btn-brand-yellow-large, .btn-permission {
    background-color: #fcd35e !important;
    color: #074492 !important;
}

/* Синяя */
.btn-brand-call {
    background-color: #3591cf !important;
    color: #ffffff !important;
}

.strip-button-section a:hover {
    transform: translateY(-3px);
    filter: brightness(1.1);
    box-shadow: 0 8px 20px rgba(0,0,0,0.15);
}

.btn-brand-yellow-large {
    /* 1. ГЛАВНОЕ: Запрещаем тексту переноситься */
    white-space: nowrap !important; 
    
    /* 2. Делаем ширину гибкой, но с минимальным порогом */
    width: auto !important;
    min-width: 280px !important;
    max-width: 90% !important; /* Чтобы на совсем мелких не вылетала за экран */
    
    height: 65px !important;
    padding: 0 35px !important; /* Даем "воздуха" по бокам текста */
    
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 15px !important; /* Расстояние между иконкой и текстом */
    
    background-color: #fcd35e !important;
    color: #074492 !important;
    border-radius: 12px !important;
    font-size: 20px !important;
    font-weight: 800 !important;
    text-decoration: none !important;
    box-shadow: 0 8px 20px rgba(252, 211, 94, 0.3);
    transition: all 0.3s ease;
}

.btn-brand-yellow-large i {
    font-size: 24px !important;
}

.btn-brand-yellow-large:hover {
    transform: translateY(-3px);
    background-color: #f18a25 !important; /* Оранжевый при наведении */
    color: #fff !important;
}

/* ЖЕСТКОЕ ЦЕНТРИРОВАНИЕ ДЛЯ ГРУПП */
.force-center {
    display: flex !important;
    flex-direction: row !important; /* В ряд на десктопе */
    justify-content: center !important; /* Стягиваем к центру по горизонтали */
    align-items: center !important;
    gap: 20px !important;
    width: 100% !important;
    margin: 40px auto !important;
    padding: 0 !important;
    left: 0 !important;
    transform: none !important; /* Убираем любые сдвиги, если они были */
}

.groups-contacts-section .btn-brand-call, 
.groups-contacts-section .btn-brand-yellow-large {
    flex: 0 1 auto !important; /* Запрещаем кнопкам растягиваться на всю ширину */
    margin: 0 !important;
}



/* Фикс для мобилок: если экран узкий, иконки встанут одна под другой */
@media (max-width: 600px) {
    .birthday-icons-set {
        gap: 30px !important;
    }
    .icon-with-text {
        width: 100% !important; /* На мобилке текст во всю ширину под иконкой */
    }
}

/* На мобилках - в столбик */
@media (max-width: 768px) {
    .force-center {
        flex-direction: column !important;
        gap: 15px !important;
    }
    .groups-contacts-section .btn-brand-call, 
    .groups-contacts-section .btn-brand-yellow-large {
        width: 100% !important;
        max-width: 300px !important;
    }
}

/* 5. АДАПТИВНОСТЬ (МОБИЛЬНАЯ ВЕРСИЯ) */
@media (max-width: 768px) {
    .permission-hero {
        height: 200px; /* Уменьшаем высоту фото на телефоне */
    }
}   
/* ВАЖНО: Убедитесь, что прямо перед этой строкой есть закрывающая скобка } от предыдущего кода! */

/* ==========================================================================
   ПОЛНОЭКРАННЫЕ БАННЕРЫ С ПОЛОСОЙ (НАДЕЖНЫЙ ФИКС)
   ========================================================================== */

.full-width-banner-img {
    width: 100%;
    height: auto; /* Для коллажей нужно auto, чтобы ничего не обрезалось */
    max-height: 70vh; /* Защита, чтобы фото не уходило в бесконечность */
    overflow: hidden;
    display: block;
    background-color: #f9f9f9;
}

.full-width-banner-img img {
    width: 100%;
    height: auto;
    object-fit: cover;
    display: block;
}

/* Сама полоса */
.page-title-strip {
    width: 100%;
    padding: 35px 20px !important;
    box-sizing: border-box;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    text-align: center !important;
}

.page-title-strip h1 {
    margin: 0 !important;
    font-size: clamp(28px, 4vw, 42px) !important;
    font-weight: 900 !important;
    text-transform: uppercase;
}

/* Цвета полос */
.strip-blue { background-color: #3591cf !important; }
.strip-blue h1 { color: #ffffff !important; }

.strip-yellow { background-color: #fcd35e !important; }
.strip-yellow h1 { color: #074492 !important; }

.strip-pink { background-color: #D81B60 !important; }
.strip-pink h1 { color: #ffffff !important; }

.strip-orange { background-color: #f18a25 !important; }
.strip-orange h1 { color: #ffffff !important; }




/* === ЧИСТАЯ СИНЯЯ СЕКЦИЯ ШАГОВ === */
.booking-steps-new {
    padding: 60px 0;
    background-color: #f8fbff; /* Сверхсветлый голубой фон */
}

/* ==========================================================================
   ПРОЦЕСС ПОКУПКИ БИЛЕТОВ (ТЕКСТ И ЗАГОЛОВКИ)
   ========================================================================== */

.steps-intro {
    text-align: center;
    margin-bottom: 40px;
}

.steps-main-title-blue {
    color: var(--brand-blue-dark) !important;
    font-weight: 900;
    /* Адаптивный размер: от 28px на мобилках до 42px на пк */
    font-size: clamp(28px, 4vw, 42px) !important; 
    margin-bottom: 15px;
    text-transform: uppercase;
}

.steps-subtitle {
    line-height: 1.5;
    font-size: 30px !important; /* Тот самый размер, который вы хотели */
    color: #475569;
    margin: 0;
}

.steps-highlight {
    font-weight: 900;
    color: var(--ice-dark);
    text-transform: uppercase;
    font-size: 34px !important; /* Главный призыв делаем еще чуть крупнее */
    display: inline-block;
    margin-top: 10px;
}

/* --- Адаптивность для мобильных экранов --- */
@media (max-width: 768px) {
    .steps-subtitle {
        font-size: 22px !important; /* Уменьшаем, чтобы влезло в телефон */
    }
    .steps-highlight {
        font-size: 26px !important;
    }
}

/* Общий стиль карточек */
.step-card-new {
    background: #ffffff;
    border-radius: 20px;
    border: 1px solid #e1efff;
    box-shadow: 0 10px 30px rgba(53, 145, 207, 0.08);
    position: relative;
    padding: 30px;
    display: flex;
    flex-direction: column;
}

/* Шаг 1: Центрированный и широкий (80%) */
.step-1-wide-wrapper {
    width: 85%; /* Оптимально для десктопа */
    margin: 0 auto 40px auto;
}

.main-step {
    border-top: 5px solid #3591cf;
}

.calendar-frame-container {
    width: 100%;
    height: 700px; /* Высота календаря */
    margin-top: 20px;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid #eee;
}

.calendar-frame-container iframe {
    width: 100%;
    height: 100%;
    border: none;
}

/* Шаги 2 и 3: Ряд */
.steps-bottom-grid {
    display: flex;
    justify-content: center;
    gap: 30px;
    width: 85%;
    margin: 0 auto;
}

.steps-bottom-grid .step-card-new {
    flex: 1;
    min-height: 220px;
    justify-content: space-between;
}

/* Декоративные номера шагов */
.step-badge {
    font-size: 48px;
    font-weight: 900;
    color: #3591cf;
    opacity: 0.15;
    position: absolute;
    top: 10px;
    right: 20px;
}

[dir="rtl"] .step-badge {
    right: auto;
    left: 20px;
}

.step-header {
    display: flex;
    align-items: center;
    gap: 15px;
}

.step-title-group h4, .step-body h4 {
    margin: 0;
    color: #074492;
    font-weight: 800;
    text-transform: uppercase;
}

.step-body p {
    margin-top: 10px;
    color: #64748b;
    font-size: 15px;
    line-height: 1.4;
}

/* Кнопки внутри шагов */
.btn-step-action {
    display: inline-block;
    margin-top: 20px;
    background-color: #3591cf;
    color: #fff !important;
    padding: 12px 25px;
    border-radius: 10px;
    text-align: center;
    font-weight: 700;
    text-decoration: none;
    transition: 0.3s;
}

.btn-step-action.btn-buy {
    background-color: #fcd35e;
    color: #074492 !important;
}

.btn-step-action:hover {
    transform: translateY(-3px);
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
}

/* АДАПТИВНОСТЬ */
@media (max-width: 992px) {
    .step-1-wide-wrapper, .steps-bottom-grid { width: 100%; }
}

@media (max-width: 768px) {
    .steps-bottom-grid { flex-direction: column; }
    .calendar-frame-container { height: 500px; }
}


/* ==========================================================================
   PAGE: BIRTHDAY (BRANDED VERSION)
   ========================================================================== */

.birthday-info-section {
    padding: 80px 0;
    /* Используем твой брендовый светло-голубой цвет */
    background-color: #eaf8ff !important; 
    width: 100%;
    /* Добавим тонкие линии сверху и снизу для аккуратности */
    border-top: 1px solid rgba(53, 145, 207, 0.1);
    border-bottom: 1px solid rgba(53, 145, 207, 0.1);
}

.birthday-intro-grid {
    display: flex !important;
    flex-direction: row !important; /* В ряд на десктопе */
    align-items: center !important;
    justify-content: center !important; /* Собираем всё к центру */
    gap: 60px; /* ПУНКТ: Группируем поближе (было слишком далеко) */
    max-width: 1200px;
    margin: 0 auto !important;
}

.birthday-text {
    flex: 0 1 700px; /* Ограничиваем ширину текста, чтобы он не "расползался" */
    text-align: left;
}

/* Выравнивание текста для Иврита */
html[dir="rtl"] .birthday-text {
    text-align: right;
}

/* --- СТИЛЬ РАЗДЕЛИТЕЛЕЙ В ЗАГОЛОВКЕ --- */

.title-sep {
    display: inline-block;
    margin: 0 15px;      /* Создает отступы по 15px слева и справа */
    color: var(--brand-blue-dark); 
    opacity: 0.5;        /* Делает полоску чуть светлее текста (по-дизайнерски) */
    font-weight: 400;    /* Чтобы разделитель не был таким же жирным, как буквы */
}

/* На мобильных устройствах немного уменьшим отступы, чтобы всё влезло */
@media (max-width: 768px) {
    .title-sep {
        margin: 0 8px;
    }
}

.birthday-icons-set {
    display: flex !important;
    flex-direction: row !important;
    gap: 20px;
    flex-shrink: 0; /* Чтобы иконки не сжимались */
}

/* Названия и описания */
.brand-title-main {
    font-size: 42px !important;
    color: var(--brand-blue-dark);
    margin-bottom: 20px !important;
    display: flex;
    flex-wrap: wrap;
    /* Убираем принудительный центр, пусть слушается родителя */
    justify-content: flex-start; 
}

html[dir="rtl"] .brand-title-main {
    justify-content: flex-end;
}

.brand-subtitle {
    font-size: 26px !important;
    color: var(--brand-orange);
    margin-bottom: 15px !important;
}

.brand-description {
    font-size: 20px !important;
    color: #555;
    line-height: 1.6;
}

/* МОБИЛЬНАЯ ВЕРСИЯ */
@media (max-width: 992px) {
    .birthday-intro-grid {
        flex-direction: column !important; /* На планшетах и мобилках — в столбик */
        text-align: center !important;
        gap: 40px;
    }
    .birthday-text {
        text-align: center !important;
        flex: 1 1 auto;
    }
    html[dir="rtl"] .birthday-text { text-align: center !important; }
    .brand-title-main { justify-content: center !important; }
}

.brand-subtitle { font-size: 24px; color: var(--brand-orange); margin-bottom: 20px; }
.brand-description { font-size: 18px; color: #555; line-height: 1.6; }

.birthday-icons-set {
    flex: 1;
    display: flex;
    gap: 20px;
    justify-content: center;
}

.icon-item {
    width: 80px; height: 80px;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-size: 35px; color: #fff !important;
    box-shadow: 0 10px 20px rgba(0,0,0,0.1);
}

/* --- ИСПРАВЛЕННАЯ СЕТКА 3 и 3 --- */
.features-grid {
    display: grid !important;
    /* 3 равные колонки, которые делят свободное место */
    grid-template-columns: repeat(3, 1fr) !important; 
    gap: 20px !important;
    /* Увеличим макс. ширину, чтобы 3 карточки по 220px + отступы влезли с запасом */
    max-width: 750px; 
    margin: 40px auto !important;
    justify-content: center;
}

.feature-card {
    /* Оставляем твои размеры, но убираем !important у ширины, 
       чтобы грид мог ими управлять */
    width: 100%; 
    max-width: 220px;
    height: 200px !important;
    
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 20px;
    padding: 5px !important;
    text-align: center;
    border: none !important;
    margin: 0 auto; /* Центрируем карточку внутри её ячейки */
}

.feature-card .icon-wrapper {
    height: 100px !important; /* Фиксированное место под иконку */
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 10px;
    width: 100%;
}

.feature-card .icon-wrapper img {
    max-width: 90%;
    max-height: 90%;
    object-fit: contain;
    /* filter: brightness(0) invert(1); — этот фильтр делает любую иконку белой */
}

/* Текст */
.feature-card p {
    font-size: 20px !important; /* Чуть уменьшил, чтобы длинные слова на иврите не вылезали */
    font-weight: 900 !important;
    color: #fff !important;
    line-height: 1.1;
    margin: 0;
}

/* АДАПТИВНОСТЬ */
@media (max-width: 768px) {
    .features-grid {
        grid-template-columns: repeat(2, 1fr) !important; /* 2 в ряд */
        max-width: 460px;
    }
}

@media (max-width: 480px) {
    .features-grid {
        grid-template-columns: 1fr !important; /* 1 в ряд */
        max-width: 240px;
    }
}

/* Иконки FontAwesome */
.feature-card i {
    font-size: 55px !important; /* Уменьшили с 75 до 55, чтобы влезло в 200px */
    color: #fff !important;
}



.bg-orange { background-color: var(--brand-orange) !important; }
.bg-blue   { background-color: var(--brand-blue-dark) !important; }
.bg-pink   { background-color: #D81B60 !important; }

/* Сетка цветных карточек */
.birthday-features { padding: 60px 0; background: #fff; }
.section-title-center { text-align: center; margin-bottom: 50px; }
.section-title-center h2 { font-size: 36px; color: var(--brand-blue-dark); }


/* Цвета карточек */
.color-orange { background-color: var(--brand-orange) !important; }
.color-blue   { background-color: var(--brand-blue-dark) !important; }
.color-pink   { background-color: #D81B60 !important; }


/* Секция доп. услуг с фоновой картинкой */
.birthday-addons-section {
    padding: 60px 0;
    background-color: #fff;
}

.addons-image-box {
    position: relative;
    width: 100%;
    max-width: 1200px; /* Можешь увеличить, если хочешь блок шире */
    margin: 0 auto;
    
    /* 1. Убираем фиксированную высоту */
    min-height: auto !important; 
    
    /* 2. Указываем пропорции картинки (Ширина / Высота) */
    /* Если картинка 1920x450, это примерно 4/1. Если 800x200, тоже 4/1. */
    aspect-ratio: 1920 / 450; 

    border-radius: 20px;
    overflow: hidden;
    
    /* 3. background-size: 100% 100% заставит картинку втиснуться целиком, 
       а aspect-ratio выше не даст ей исказиться */
    background-size: 100% 100% !important;
    background-position: center;
    background-repeat: no-repeat;
    
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    box-shadow: 0 10px 30px rgba(0,0,0,0.05);
}

.addons-content {
    position: relative;
    z-index: 2;
    padding: 20px;
    width: 100%;
}

.addons-overlay {
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    background: rgba(255, 255, 255, 0.15); /* Чуть-чуть приглушаем фон */
    z-index: 1;
}

.addons-content h3 {
    color: #3591cf; 
    /* Шрифт чуть меньше, чтобы влез в узкий блок */
    font-size: clamp(22px, 4vw, 57px) !important;
    font-weight: 800;
    margin-bottom: 10px;
    text-transform: uppercase;
    text-shadow: none !important; /* УБРАЛИ ТЕНЬ */
}

.addons-content p {
    color: #D81B60; 
    font-size: clamp(14px, 2.5vw, 32px) !important;
    font-weight: 700;
    line-height: 1.3;
    text-shadow: none !important; /* УБРАЛИ ТЕНЬ */
    max-width: 800px;
    margin: 0 auto;
}

@media (max-width: 768px) {
    .addons-image-box {
        /* Если на мобилках картинка слишком узкая, можно поменять пропорции */
        aspect-ratio: 16 / 7; 
        border-radius: 12px;
    }
}


/* Финальный блок с кнопкой на странице ДР */
.birthday-footer-cta-final {
    padding: 60px 0 80px 0;
    background-color: #f9fcff; /* Очень легкий фон, чтобы отделить от контента */
    text-align: center;
    border-top: 1px solid #e1efff;
}

.cta-content-box h3 {
    font-size: 26px;
    color: var(--ice-dark);
    margin-bottom: 30px;
    font-weight: 700;
}

/* Используем уже готовую логику для желтой кнопки */
.birthday-footer-cta-final .btn-shard-accent {
    max-width: 400px; /* Сделаем её пошире для веса */
    padding: 20px 50px;
    font-size: 20px;
    box-shadow: 0 10px 20px rgba(252, 211, 94, 0.2);
}

.birthday-footer-cta-final .btn-shard-accent i {
    margin-right: 10px;
}

/* RTL фикс для иконки в кнопке */
[dir="rtl"] .birthday-footer-cta-final .btn-shard-accent i {
    margin-right: 0;
    margin-left: 10px;
}

/* RTL Фиксы */
[dir="rtl"] .reasons-list-new li { padding-left: 0; padding-right: 35px; text-align: right; }
[dir="rtl"] .reasons-list-new li::before { left: auto; right: 0; }
[dir="rtl"] .birthday-text { text-align: right; }

/* Мобилки */
@media (max-width: 900px) {
    .birthday-intro-grid { flex-direction: column; text-align: center; }
    .features-grid { grid-template-columns: 1fr; }
    .reasons-list-new { grid-template-columns: 1fr; }
    .tabs-nav-new { flex-direction: column; }
}

/* ==========================================================================
   PAGE: GROUPS & EVENTS (BRANDED & STRAIGHT)
   ========================================================================== */

.groups-info-section {
    padding: 60px 0 20px 0 !important; /* Уменьшили до 20px снизу */
    background: #fff;
}

.participant-badge {
    width: 150px;           /* Одинаковая ширина и высота для идеального круга */
    height: 150px;
    background-color: var(--brand-orange) !important; /* Сплошной оранжевый */
    border: none !important; /* Убираем синюю полосу/рамку */
    border-radius: 50% !important;
    
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    
    /* Убираем наклон (кривизну) */
    transform: none !important; 
    
    box-shadow: 0 10px 25px rgba(241, 138, 37, 0.3);
    margin: 0 auto; /* Центрирование */
}

/* Числа внутри кружка */
.badge-number {
    font-size: 52px !important;
    color: #ffffff !important; /* Белый текст на оранжевом фоне лучше читается */
    font-weight: 900;
    line-height: 1;
    margin: 2px 0;
}

/* Надписи "Мин" и "Участников" */
.badge-label {
    font-size: 14px !important;
    font-weight: 800;
    color: #ffffff !important;
    text-transform: uppercase;
}

/* Убираем старые настройки ряда, которые могли мешать центрированию */
.groups-header-row {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}

.badge-label { font-size: 14px; font-weight: 800; color: #333; text-transform: uppercase; }

.groups-main-title {
    font-size: 42px; color: var(--brand-blue-dark); font-weight: 800;
}

.groups-accent-text {
    color: var(--brand-orange); /* Оранжевый акцент */
    font-size: 26px; margin: 40px 0;
    width: 100% !important;
    text-align: center !important;
    display: block !important;
}

.groups-info-section {
    background-color: #eaf8ff !important; /* Светло-голубой */
}
/* --- КОНТРАСТНЫЙ БЛОК КОНТАКТОВ В ГРУППАХ --- */
.groups-contacts-section {
    padding: 60px 0 100px 0;
    background-color: #f0f8ff; /* Светло-голубой фон для контраста с белым телом сайта */
    border-top: 2px solid #e1efff;
    text-align: center;
}

.contacts-intro {
    font-size: 20px;
    font-weight: 700;
    color: var(--ice-dark);
    margin-bottom: 50px;
}

.contacts-row {
    display: flex;
    justify-content: center;
    gap: 60px;
    margin-bottom: 60px;
    flex-wrap: wrap;
}

.contact-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-decoration: none;
    color: var(--ice-dark);
    transition: transform 0.3s ease;
}

.contact-item:hover { transform: translateY(-5px); }

/* Крупные иконки */
.contact-icon {
    width: 90px;
    height: 90px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 40px;
    color: #fff !important;
    margin-bottom: 20px;
    box-shadow: 0 10px 20px rgba(0,0,0,0.1);
}

.bg-blue-brand { background-color: var(--brand-blue-dark) !important; }
.bg-orange-brand { background-color: var(--brand-orange) !important; }

.contact-label { font-size: 14px; text-transform: uppercase; font-weight: 800; opacity: 0.7; margin-bottom: 5px; }
.contact-number { font-size: 24px; font-weight: 900; }

/* КНОПКА РАЗРЕШЕНИЯ (ЖЕЛТАЯ) */
.contacts-btn-wrapper {
    margin-top: 40px;
    border-top: 1px solid rgba(0,0,0,0.05);
    padding-top: 50px;
}

.btn-brand-yellow-large {
    display: inline-flex;
    align-items: center;
    gap: 15px;
    background-color: var(--brand-yellow) !important;
    color: var(--ice-dark) !important;
    padding: 20px 60px;
    border-radius: 15px;
    font-size: 22px;
    font-weight: 900;
    text-transform: uppercase;
    text-decoration: none;
    box-shadow: 0 8px 25px rgba(252, 211, 94, 0.4);
    transition: all 0.3s ease;
    clip-path: none !important;
}

.btn-brand-yellow-large:hover {
    background-color: var(--brand-orange) !important;
    color: #fff !important;
    transform: scale(1.05);
}

/* Адаптив */
@media (max-width: 768px) {
    .contacts-row { gap: 30px; }
    .contact-icon { width: 70px; height: 70px; font-size: 30px; }
    .btn-brand-yellow-large { padding: 15px 30px; font-size: 18px; width: 100%; max-width: 320px; }
}

/* Галерея без осколков */
.groups-banner-section .swiper-slide {
    clip-path: none !important;
    border-radius: 15px;
}
/* --- СТИЛИЗАЦИЯ СТРЕЛОК ГАЛЕРЕИ --- */
.swiper-button-next, .swiper-button-prev {
    color: var(--brand-blue-dark) !important; /* Синий цвет стрелки */
    background-color: #ffffff !important;     /* Белый фон кружка */
    width: 50px !important;
    height: 50px !important;
    border-radius: 50% !important;
    box-shadow: 0 5px 15px rgba(0,0,0,0.1) !important;
    transition: all 0.3s ease !important;
    z-index: 100 !important;
}

/* Делаем саму иконку-стрелку меньше и изящнее */
.swiper-button-next:after, .swiper-button-prev:after {
    font-size: 20px !important;
    font-weight: bold !important;
}

.swiper-button-next:hover, .swiper-button-prev:hover {
    background-color: var(--brand-blue-dark) !important;
    color: #ffffff !important;
    transform: scale(1.1);
}

/* Смещение стрелок, чтобы они не перекрывали фото слишком сильно */
.swiper-button-prev { left: 10px !important; }
.swiper-button-next { right: 10px !important; }

/* Фикс для иврита (RTL): Swiper сам меняет их местами, 
   но иногда нужно подправить позиционирование */
[dir="rtl"] .swiper-button-prev { left: auto !important; right: 10px !important; }
[dir="rtl"] .swiper-button-next { right: auto !important; left: 10px !important; }


/* ==========================================================================
   PAGE: SPORT / SKATING SCHOOL (STRAIGHT & BRANDED)
   ========================================================================== */


.sport-categories-section {
    padding: 80px 0;
    background-color: #f9fcff;
}

.sport-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 40px;
    max-width: 1200px;
    margin: 0 auto;
}

/* КАРТОЧКА (БЕЗ ОСКОЛКОВ) */
.sport-card {
    background-color: #fff;
    background-image: none !important; /* Убрали фон-картинку, если она мешает */
    border-radius: 20px;
    overflow: hidden;
    text-decoration: none;
    display: flex;
    flex-direction: column;
    box-shadow: 0 10px 25px rgba(0,0,0,0.05);
    border: 1px solid #eee;
    transition: all 0.4s ease;
}

.sport-card-img {
    height: 250px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 30px;
    background: #fff;
}

.sport-card-img img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    transition: transform 0.4s ease;
}

.sport-card-body {
    padding: 25px;
    text-align: center;
    background: var(--brand-blue-dark); /* Дефолтный цвет плашки */
    transition: background 0.3s ease;
}

.sport-card-body h3 {
    margin: 0;
    font-size: 22px;
    color: #ffffff;
    font-weight: 800;
    text-transform: uppercase;
}

/* === ЭФФЕКТЫ ПРИ НАВЕДЕНИИ (ИНДИВИДУАЛЬНЫЕ ЦВЕТА) === */

.sport-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 20px 40px rgba(0,0,0,0.1);
}

/* 1. Фигурное катание -> РОЗОВЫЙ */
.fs-card:hover .sport-card-body {
    background-color: #D81B60 !important;
}

/* 2. Частные уроки -> ЖЕЛТЫЙ (fcd35e) */
.pl-card:hover .sport-card-body {
    background-color: #fcd35e !important;
}
.pl-card:hover .sport-card-body h3 {
    color: var(--ice-dark) !important; /* Темный текст на желтом фоне */
}

/* 3. Хоккей -> СИНИЙ (3591cf) */
.hockey-card-item:hover .sport-card-body {
    background-color: #3591cf !important;
}

.sport-card:hover .sport-card-img img {
    transform: scale(1.1);
}

/* Финальный блок CTA */
.sport-footer-cta-final {
    padding: 80px 0;
    text-align: center;
    background: #fff;
    border-top: 1px solid #eee;
}

.sport-footer-cta-final h3 {
    font-size: 26px;
    color: var(--brand-blue-dark);
    margin-bottom: 30px;
}

/* Адаптив */
@media (max-width: 900px) {
    .sport-grid { grid-template-columns: 1fr; padding: 0 20px; }
    .sport-banner { height: 180px; }
}

/* ==========================================================================
   PAGE: SKATING CLUBS (FIXED & COMPACT)
   ========================================================================== */
/* --- ГЛАВНЫЕ ЗАГОЛОВКИ РАЗДЕЛОВ (Центрирование) --- */
.brand-title-main {
    width: 100% !important;
    display: flex !important;
    justify-content: center !important; /* ПРИНУДИТЕЛЬНЫЙ ЦЕНТР */
    text-align: center !important;
    font-size: clamp(28px, 5vw, 42px) !important;
    color: var(--brand-blue-dark);
    font-weight: 800;
    margin-bottom: 40px !important;
    line-height: 1.2;
}

/* Исключение для страницы Дня Рождения (если там всё еще нужно сбоку от иконок) */
.birthday-intro-grid .brand-title-main {
    justify-content: flex-start !important;
    text-align: left !important;
}

html[dir="rtl"] .birthday-intro-grid .brand-title-main {
    justify-content: flex-end !important;
    text-align: right !important;
}

.clubs-list-section {
    background-color: #eaf8ff !important; 
    padding: 60px 0;
}


/* --- СЕТКА КЛУБОВ (ЦЕНТРИРОВАНИЕ) --- */
.clubs-grid {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important; /* Центрируем карточки */
    gap: 30px !important;
    padding: 40px 0;
}

/* --- КАРТОЧКА КЛУБА: ФИКСИРОВАННЫЕ РАЗМЕРЫ --- */
.club-card {
    background: #fff !important;
    border: 2px solid var(--brand-orange) !important;
    border-radius: 20px !important;
    padding: 30px 20px !important;
    width: 320px !important;
    /* Убрали min-height, чтобы карточка подстраивалась под контент, 
       но логотип теперь не будет её распирать */
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    box-shadow: 0 10px 30px rgba(0,0,0,0.05);
    overflow: hidden; /* Чтобы ничего не вылезало */
}

/* ЛОГОТИП: ЖЕСТКИЕ ГРАНИЦЫ */
.club-logo {
    width: 100%;
    height: 140px !important; /* Фиксированная высота зоны логотипа */
    display: flex !important;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px !important;
    border-bottom: 1px solid #f0f0f0;
    padding-bottom: 15px;
    flex-shrink: 0; /* Чтобы не сжимался */
}

.club-logo img {
    /* Картинка никогда не станет больше этих размеров */
    max-height: 110px !important; 
    max-width: 220px !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain !important; /* Сохраняет пропорции без обрезки */
}

/* НАЗВАНИЕ И КОНТАКТЫ */
.club-name {
    font-size: 22px !important;
    color: var(--ice-dark) !important;
    font-weight: 800;
    margin-bottom: 20px !important;
}

.club-details {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.detail-row {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

/* --- БЛОК РЕГИСТРАЦИИ (СВЕТЛО-ГОЛУБОЙ НА ВСЮ ШИРИНУ) --- */
.reg-contact-box {
    /* ПУНКТ: Светло-голубой фон */
    background-color: #eaf8ff !important; 
    
    /* ПУНКТ: Убираем рамки */
    border: none !important; 
    border-top: 1px solid #d1e9f7 !important; /* Легкая линия сверху для разделения */
    border-bottom: 1px solid #d1e9f7 !important;
    
    /* Растягиваем на всю ширину, компенсируя паддинги родителя (20px) */
    width: calc(100% + 40px) !important; 
    margin-left: -20px !important;
    margin-right: -20px !important;
    
    padding: 20px 15px !important;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 20px;
    margin-bottom: 10px;
}

/* Название "Registration" в этом блоке */
.reg-contact-box .detail-label {
    color: var(--brand-blue-dark) !important; /* Сделаем его синим, так как фон голубой */
    margin-bottom: 5px;
}

/* Номер телефона в этом блоке */
.reg-phone {
    font-size: 22px !important;
    font-weight: 900;
    color: var(--ice-dark) !important;
    margin-bottom: 12px;
    text-decoration: none;
}

/* Центрируем соцсети под голубым блоком */
.club-socials {
    margin-top: auto;
    padding-top: 15px;
    display: flex;
    justify-content: center;
    gap: 15px;
}

/* Кнопка WhatsApp */
.wa-link {
    background-color: #25D366;
    color: white !important;
    width: 45px;
    height: 45px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 10px;
    font-size: 24px;
}
/* ==========================================================================
   PAGE: PRIVATE LESSONS (ULTRA COMPACT & BRANDED)
   ========================================================================== */

/* Общие отступы секций */
.staff-section { 
    padding: 60px 0; 
}

/* Фон для секции тренеров */
.coaches-bg-new { 
    background-color: #f0f8ff; 
    border-top: 1px solid #e1efff; 
    border-bottom: 1px solid #e1efff;
}

/* Фон для секции инструкторов */
.instructors-bg-new { 
    background-color: #ffffff; 
}

/* --- ЗАГОЛОВКИ СЕКЦИЙ (ТРЕНЕРЫ / ИНСТРУКТОРЫ) --- */
.section-header-branded {
    text-align: center;
    margin-bottom: 50px;
    width: 100%;
}

.section-header-branded h3 {
    font-family: 'Almoni', sans-serif !important;
    font-size: 34px;
    color: var(--brand-blue-dark);
    font-weight: 800;
    margin-bottom: 10px;
    display: flex;
    align-items: center;
    justify-content: center; /* Центрируем иконку и текст */
    gap: 12px;
}

.section-header-branded h3 i {
    color: var(--brand-blue-light);
    font-size: 28px;
}

.section-header-branded p {
    font-family: 'Almoni', sans-serif !important;
    font-size: 18px;
    color: #666;
    font-weight: 500;
}

/* --- СТРАНИЦА ТРЕНЕРОВ: КОМПАКТНЫЙ СТИЛЬ --- */

/* 1. Светло-голубой фон для всех секций персонала */
.staff-section.coaches-bg-new, 
.staff-section.instructors-bg-new {
    background-color: #eaf8ff !important;
    padding: 60px 0;
}

/* --- ОБНОВЛЕННЫЙ СТИЛЬ ТРЕНЕРОВ --- */

.staff-grid-centered {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    justify-content: center; /* Центрирует карточки, если их мало (например, 2) */
    max-width: 1200px;
    margin: 0 auto;
}

.staff-card-compact {
    background: #fff;
    border-radius: 20px;
    padding: 20px 15px;
    width: 280px; /* Уменьшенный размер квадратов */
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    box-shadow: 0 10px 25px rgba(0,0,0,0.05);
    transition: transform 0.3s ease;
}

.staff-card-compact:hover {
    transform: translateY(-5px);
}

/* Границы */
.coach-border { border: 2px solid var(--brand-blue-dark); }
.instructor-border { border: 2px solid var(--brand-orange); }

/* ИМЯ: Выделенное и очень крупное */
.staff-name-large {
    font-size: 36px !important; /* Очень крупное */
    font-weight: 900 !important;
    color: var(--ice-dark);
    margin-bottom: 5px !important; /* Минимальный отступ между линиями */
    line-height: 1;
}

/* Ряд контактов */
.staff-contact-row {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin-top: 5px;
}

/* ТЕЛЕФОН: Иконка ВСЕГДА слева от цифр */
.staff-phone-link-new {
    display: flex;
    align-items: center;
    gap: 8px;
    text-decoration: none;
    color: var(--brand-blue-dark);
    font-size: 22px;
    font-weight: 800;
    /* Принудительный порядок слева-направо для номера и иконки */
    direction: ltr !important; 
}

.staff-phone-link-new i {
    font-size: 18px;
}

/* Иконка WhatsApp рядом */
.staff-wa-icon-inline {
    background-color: #25D366;
    color: #fff !important;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    transition: 0.3s;
}

.staff-wa-icon-inline:hover {
    transform: scale(1.1);
}

/* Адаптивность */
@media (max-width: 768px) {
    .staff-card-compact {
        width: 100%;
        max-width: 320px;
    }
    .staff-name-large {
        font-size: 32px !important;
    }
}

/* --- ФИКС ИКОНОК В ЗАГОЛОВКАХ ДЛЯ ИВРИТА (RTL) --- */

html[dir="rtl"] .section-header-branded h3 {
    display: flex !important;
    flex-direction: row-reverse !important; /* Разворачиваем: текст и иконка меняются местами */
    justify-content: center !important;
    align-items: center !important;
    gap: 15px !important; /* Расстояние между иконкой и текстом */
}

/* Убираем лишние отступы у иконок в заголовках, если они были */
html[dir="rtl"] .section-header-branded h3 i {
    margin: 0 !important;
}

/* ==========================================================================
   PAGE: PRICE LIST (CLEAN & STRAIGHT)
   ========================================================================== */

/* Секция цен */
.price-list-section {
    padding: 60px 0;
    background-color: #f9fcff;
}

.narrow-container { max-width: 900px; margin: 0 auto; padding: 0 20px; }

/* КАРТОЧКА КАТЕГОРИИ */
.price-category-card {
    background: #fff;
    border-radius: 20px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
    margin-bottom: 50px;
    overflow: hidden;
    border: 2px solid #e1efff;
    clip-path: none !important;
}

.category-header {
    background: var(--brand-blue-dark); /* Корпоративный синий */
    padding: 25px;
    text-align: center;
}

.category-header h2 {
    color: #fff;
    margin: 0;
    font-size: 26px;
    font-weight: 800;
    text-transform: uppercase;
    font-family: 'Almoni', sans-serif !important;
}

/* ТАБЛИЦА */
.price-table-wrapper { padding: 10px 0; }

.modern-price-table {
    width: 100%;
    border-collapse: collapse;
}

.modern-price-table th {
    text-align: left;
    padding: 20px 30px;
    color: #888;
    font-size: 14px;
    text-transform: uppercase;
    font-weight: 700;
    border-bottom: 2px solid #f4f8fb;
}

/* RTL поддержка для иврита */
[dir="rtl"] .modern-price-table th { text-align: right; }
[dir="rtl"] .modern-price-table th.col-price { text-align: left; }
[dir="rtl"] .td-price { text-align: left; }

.modern-price-table tr {
    transition: background 0.3s;
    border-bottom: 1px solid #f4f8fb;
}
.modern-price-table tr:last-child { border-bottom: none; }
.modern-price-table tr:hover { background-color: #fafdff; }

.modern-price-table td {
    padding: 25px 30px;
    vertical-align: middle;
}

.service-title {
    font-size: 20px;
    font-weight: 800;
    color: var(--ice-dark);
    font-family: 'Almoni', sans-serif !important;
}

.service-desc {
    font-size: 15px;
    color: #666;
    margin-top: 5px;
}

.price-tag {
    font-size: 26px;
    font-weight: 900;
    color: var(--brand-blue-dark);
    white-space: nowrap;
}

/* Кнопка в баннере */
.btn-brand-yellow {
    display: inline-flex;
    background-color: var(--brand-yellow) !important;
    color: var(--ice-dark) !important;
    padding: 12px 30px;
    border-radius: 12px;
    font-weight: 800;
    text-decoration: none;
    text-transform: uppercase;
    box-shadow: 0 4px 15px rgba(0,0,0,0.2);
}

/* Финальный CTA */
.price-footer-cta-final {
    padding: 80px 0;
    text-align: center;
    background: #fff;
    border-top: 1px solid #eee;
}

.price-footer-cta-final h3 {
    font-size: 26px;
    color: var(--brand-blue-dark);
    margin-bottom: 30px;
}

/* Адаптив */
@media (max-width: 900px) {
    .modern-price-table th { display: none; }
    .modern-price-table td { padding: 20px; }
    .price-tag { font-size: 22px; }
    .service-title { font-size: 18px; }
    .category-header h2 { font-size: 20px; }
}


/* ==========================================================================
   PAGE: PRO SHOP (STRAIGHT & ICONIC)
   ========================================================================== */


/* Фикс иконки в уведомлении для Иврита (RTL) */
html[dir="rtl"] .under-construction-notice h2 {
    flex-direction: row-reverse !important;
}

/* Убираем возможный лишний отступ у самой иконки */
html[dir="rtl"] .under-construction-notice h2 i {
    margin: 0 !important;
}

.shop-section { padding: 50px 0 80px 0; background-color: #f9fcff; }

/* Описание магазина */
.shop-intro-box {
    text-align: center; max-width: 800px; margin: 0 auto 50px auto;
    background: #fff; padding: 35px; border-radius: 20px;
    border: 2px solid #e1efff;
    box-shadow: 0 10px 30px rgba(0,0,0,0.03);
}
.shop-intro-box h3 { color: var(--brand-blue-dark); font-size: 28px; margin-bottom: 10px; font-weight: 800; }

/* ТАБЫ С ИКОНКАМИ */
.shop-tabs {
    display: flex; justify-content: center; gap: 15px; margin-bottom: 60px; flex-wrap: wrap;
}

.shop-tab-btn {
    display: inline-flex; align-items: center; gap: 10px;
    padding: 12px 25px;
    background: #fff;
    border: 2px solid #e1efff;
    border-radius: 12px; /* Скругленный прямоугольник */
    color: var(--ice-dark);
    font-weight: 700;
    text-decoration: none;
    transition: all 0.3s ease;
    font-size: 16px;
}

.shop-tab-btn i { font-size: 18px; color: var(--brand-blue-medium); }

.shop-tab-btn:hover {
    border-color: var(--brand-blue-dark);
    transform: translateY(-3px);
}

.shop-tab-btn.active {
    background-color: var(--brand-blue-dark);
    color: #fff !important;
    border-color: var(--brand-blue-dark);
    box-shadow: 0 5px 15px rgba(53, 145, 207, 0.3);
}
.shop-tab-btn.active i { color: #fff; }

.shop-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 30px;
    justify-content: center; /* Центрирует карточки, если их мало в ряду */
}

/* КАРТОЧКА ТОВАРА */
.product-card {
    background: #fff;
    border-radius: 20px;
    overflow: hidden;
    border: 2px solid #eee;
    transition: all 0.3s ease;
    display: flex;
    flex-direction: column;
}

.product-card:hover {
    transform: translateY(-8px);
    border-color: var(--brand-blue-light);
    box-shadow: 0 15px 35px rgba(0,0,0,0.07);
}

.product-img-wrapper {
    height: 250px; padding: 25px;
    background: #fff; display: flex; align-items: center; justify-content: center;
    border-bottom: 1px solid #f4f8fb;
}
.product-img-wrapper img { max-width: 100%; max-height: 100%; object-fit: contain; }

.product-info { padding: 20px; text-align: center; flex-grow: 1; display: flex; flex-direction: column; justify-content: space-between; }
.product-title { font-size: 18px; font-weight: 700; color: var(--ice-dark); margin-bottom: 15px; }

.price-val { font-size: 22px; font-weight: 900; color: var(--brand-blue-dark); }

/* Кнопка "Уточнить цену" */
.call-for-price-btn {
    display: block; padding: 8px; font-size: 13px; font-weight: 800;
    color: var(--brand-orange); border: 2px solid var(--brand-orange);
    border-radius: 8px; text-transform: uppercase;
}

/* Нижний блок */
.shop-footer-cta-final { padding: 80px 0; text-align: center; background: #fff; border-top: 1px solid #eee; }

@media (max-width: 900px) {
    .shop-tabs { gap: 10px; }
    .shop-tab-btn { padding: 10px 15px; font-size: 14px; }
}

/* ==========================================================================
   PAGE: PROMOTIONS & BENEFITS (STRAIGHT & CLEAN)
   ========================================================================== */

/* --- УКАЗЫВАЮЩИЕ РУКИ (ПОЗИЦИОНИРОВАНИЕ) --- */

.promotions-title-flexible {
    display: flex !important;
    align-items: center !important; /* Центрирует по середине всей высоты */
    justify-content: center !important;
    gap: 25px;
    width: 100%;
}

.pointing-hand {
    display: inline-block;
    color: #f18a25 !important; /* Оранжевый */
    font-size: 55px !important; /* Крупный размер для десктопа */
    flex-shrink: 0;
}

/* ПУНКТ: Опускаем руки на десктопе, чтобы они смотрели в "щель" между строк */
@media (min-width: 769px) {
    .pointing-hand {
        margin-top: 15px !important; /* Регулируй это число, если нужно ниже/выше */
    }
}

/* Анимации */
@keyframes hand-bounce-ltr {
    0%, 100% { transform: translateX(0); }
    50% { transform: translateX(10px); }
}
@keyframes hand-bounce-rtl {
    0%, 100% { transform: scaleX(-1) translateX(0); }
    50% { transform: scaleX(-1) translateX(10px); }
}

/* Настройка анимации для RU/EN */
html[dir="ltr"] .hand-left  { animation: hand-bounce-ltr 1s infinite ease-in-out; }
html[dir="ltr"] .hand-right { animation: hand-bounce-ltr 1s infinite ease-in-out reverse; }

/* ФИКС ДЛЯ ИВРИТА (RTL) */
html[dir="rtl"] .pointing-hand {
    transform: scaleX(-1); /* Отзеркаливаем */
}

html[dir="rtl"] .hand-left {
    /* Добавляем !important чтобы перебить базовую анимацию */
    animation: hand-bounce-rtl 1s infinite ease-in-out !important;
}
html[dir="rtl"] .hand-right {
    animation: hand-bounce-rtl 1s infinite ease-in-out reverse !important;
}

/* Мобильная адаптация */
@media (max-width: 768px) {
    .pointing-hand {
        font-size: 35px !important;
        margin-top: 5px !important; /* На мобилке отступ меньше */
    }
    .promotions-title-flexible {
        gap: 15px;
    }
}
/* 3. Оранжевый контур и уменьшение размера карточек */
.partners-grid {
    gap: 15px; /* Уменьшили расстояние между карточками */
}

/* --- СЕТКА ПАРТНЕРОВ (БЕЗ НАЛОЖЕНИЙ) --- */
.partners-section {
    padding: 40px 0 100px 0;
    background-color: #eaf8ff !important;
}

.partners-grid {
    display: grid !important;
    /* Строго 5 колонок на десктопе */
    grid-template-columns: repeat(5, 1fr) !important; 
    gap: 20px !important;
    max-width: 1310px;
    margin: 0 auto;
    width: 100%;
}

.partner-card {
    background: #fff;
    border: 2px solid var(--brand-orange) !important;
    border-radius: 15px;
    
    /* Убираем фиксированную ширину, чтобы грид сам управлял размером */
    width: 100% !important; 
    height: 160px !important;
    
    display: flex !important;
    align-items: center;
    justify-content: center;
    
    /* Уменьшаем внутренний отступ, чтобы картинка была больше */
    padding: 10px !important; 
    
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(0,0,0,0.05);
    box-sizing: border-box !important; /* Чтобы рамка была ВНУТРИ размера */
    overflow: hidden;
}

.partner-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 10px 25px rgba(241, 138, 37, 0.2);
}

/* КАРТИНКА: РАСШИРЯЕМ ПО МАКСИМУМУ */
.partner-card img {
    width: 100% !important;
    height: 100% !important;
    /* contain — чтобы не обрезались края логотипа, 
       но при этом он займет всю высоту или ширину */
    object-fit: contain !important; 
    display: block;
}

/* --- Адаптивность --- */
@media (max-width: 1100px) {
    .partners-grid {
        grid-template-columns: repeat(3, 1fr) !important; /* 3 в ряд на планшетах */
    }
}

@media (max-width: 768px) {
    .partners-grid {
        grid-template-columns: repeat(2, 1fr) !important; /* 2 в ряд на мобилках */
        gap: 15px !important;
        padding: 0 15px;
    }
    .partner-card {
        height: 140px !important;
    }
}



/* ==========================================================================
   PERMISSION PAGE - CLEANED & STANDARDIZED
   ========================================================================== */

/* 1. Общий контейнер (Широкий по просьбе дизайнера) */
.narrow-container {
    max-width: 1200px !important;
    width: 95% !important;
    margin: 0 auto !important;
}

/* 2. Карточка формы */
.permission-card {
    background: #ffffff;
    padding: 50px;
    border-radius: 25px;
    box-shadow: 0 15px 40px rgba(53, 145, 207, 0.1);
    margin-bottom: 60px;
}

/* 3. Блок правил (Scroll Box) */
.legal-box-new {
    width: 100%;
    border-radius: 20px;
    border: 1px solid #e0e0e0;
    overflow: hidden;
    margin-bottom: 40px;
}

.legal-header-new {
    background: var(--brand-blue-dark);
    color: #fff;
    padding: 15px 25px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.legal-content-new {
    height: 400px;
    padding: 30px;
    overflow-y: auto;
    font-size: 16px;
    line-height: 1.8;
    color: #444;
    background: #fafafa;
    text-align: justify;
}

/* ==========================================================================
   ИСПРАВЛЕННАЯ СЕТКА ФОРМЫ (БЕЗ НАЛОЖЕНИЙ)
   ========================================================================== */

/* Контейнер формы */
.ice-form-new {
    display: block;
    width: 100%;
}

/* Сетка: строго 2 колонки, которые делят 100% ширины */
.form-grid {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important; 
    gap: 25px !important;
    width: 100% !important;
    margin-bottom: 25px;
}

/* Группа (Label + Input) */
.form-group-new {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important; /* Чтобы группа занимала всю ячейку сетки */
    text-align: left;
}

/* Выравнивание заголовков полей для Иврита */
html[dir="rtl"] .form-group-new {
    text-align: right !important;
}

.form-group-new label {
    font-weight: 800;
    color: var(--ice-dark);
    margin-bottom: 8px;
    font-size: 16px;
    display: block;
}

/* Сами поля ввода */
.form-input-new {
    width: 100% !important; /* ПРИНУДИТЕЛЬНО на всю ширину ячейки */
    height: 55px !important;
    padding: 0 15px !important;
    border: 2px solid #f0f4f8 !important;
    border-radius: 12px !important;
    background: #fcfdfe !important;
    font-size: 16px !important;
    box-sizing: border-box !important; /* Чтобы паддинги не расширяли поле */
}

/* Адаптив для мобилок (в одну колонку) */
@media (max-width: 768px) {
    .form-grid {
        grid-template-columns: 1fr !important;
        gap: 15px !important;
    }
}

/* 5. Блок добавления детей */
.btn-add-child {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
    padding: 15px;
    background: #f0f8ff;
    color: var(--brand-blue-dark);
    border: 2px dashed var(--brand-blue-light) !important;
    border-radius: 12px;
    font-weight: 800;
    cursor: pointer;
    margin: 10px 0 30px 0;
    font-size: 18px;
}

.child-entry {
    background: #f4f9ff;
    padding: 20px;
    border-radius: 15px;
    display: flex;
    align-items: flex-end;
    gap: 15px;
    margin-bottom: 15px;
    animation: fadeIn 0.3s ease;
}

/* 6. Чекбоксы согласия */
.checkbox-group {
    display: flex;
    flex-direction: column;
    gap: 15px;
    margin: 30px 0;
}

.checkbox-item {
    display: flex;
    align-items: flex-start;
    gap: 15px;
    cursor: pointer;
}

html[dir="rtl"] .checkbox-item {
    flex-direction: row-reverse;
    text-align: right;
}

.checkbox-item input {
    width: 22px;
    height: 22px;
    margin-top: 3px;
    accent-color: var(--brand-blue-dark);
}

.checkbox-text {
    font-size: 15px;
    color: #555;
    line-height: 1.4;
}

/* 7. МОБИЛЬНАЯ АДАПТАЦИЯ */
@media (max-width: 768px) {
    .permission-card {
        padding: 30px 15px;
    }
    
    .form-grid {
        grid-template-columns: 1fr; /* В одну колонку */
        gap: 15px;
    }
    
    .legal-content-new {
        height: 300px;
        padding: 20px;
    }

    .child-entry {
        flex-direction: column;
        align-items: stretch;
    }
}

/* ==========================================================================
   PAGE: SCHEDULE (STRAIGHT & BRANDED)
   ========================================================================== */

.schedule-section { padding: 60px 0; background-color: #f9fcff; }

.schedule-layout {
    display: flex;
    gap: 30px;
    align-items: flex-start;
}

/* КАЛЕНДАРЬ */
.calendar-card {
    flex: 1.5;
    background: #fff;
    border-radius: 25px;
    padding: 35px;
    border: 2px solid #e1efff;
    box-shadow: 0 10px 30px rgba(0,0,0,0.03);
}

.calendar-header {
    display: flex; justify-content: space-between; align-items: center; margin-bottom: 30px;
}

.brand-title-calendar { font-size: 28px; color: var(--brand-blue-dark); font-weight: 800; text-transform: capitalize; }

.cal-nav-btn {
    width: 45px; height: 45px; border-radius: 50%; border: none;
    background: #f0f8ff; color: var(--brand-blue-dark); cursor: pointer;
    transition: 0.3s; display: flex; align-items: center; justify-content: center;
}
.cal-nav-btn:hover { background: var(--brand-blue-dark); color: #fff; }

/* Прямое воздействие на ID кнопок в режиме RTL */
html[dir="rtl"] #prevMonth i, 
html[dir="rtl"] #nextMonth i {
    transform: rotate(180deg) !important;
}

html[dir="rtl"] .calendar-header {
    display: flex !important;
    justify-content: space-between !important;
    flex-direction: row-reverse !important;
}

.calendar-weekdays {
    display: grid; grid-template-columns: repeat(7, 1fr);
    text-align: center; font-weight: 800; color: #aaa; margin-bottom: 15px; font-size: 14px;
}

.calendar-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 12px; }

/* ДЕНЬ (ВЫПРЯМЛЕННЫЙ) */
.day {
    aspect-ratio: 1/1; background: #fff; border: 1px solid #f4f8fb;
    border-radius: 12px; cursor: pointer; display: flex; flex-direction: column;
    align-items: center; padding-top: 10px; transition: 0.2s; position: relative;
}

.day:not(.padding):hover { background: #f0f8ff; border-color: var(--brand-blue-light); transform: translateY(-2px); }

.day.active { background: var(--brand-blue-dark) !important; color: #fff !important; border-color: var(--brand-blue-dark); }

.day.current-day { border: 2px solid var(--brand-yellow); }

.day-number { font-weight: 800; font-size: 18px; }

/* Точки */
.event-dots { display: flex; gap: 4px; margin-top: 5px; }
.dot { width: 7px; height: 7px; border-radius: 50%; }
.day.active .dot { background-color: #fff !important; }

/* ПАНЕЛЬ СОБЫТИЙ */
.events-panel {
    flex: 1; background: #fff; border-radius: 25px; padding: 35px;
    border: 2px solid #e1efff; display: flex; flex-direction: column; min-height: 550px;
}

.events-header { margin-bottom: 25px; border-bottom: 2px solid #f4f8fb; padding-bottom: 15px; }
.selected-date-text { font-size: 24px; color: var(--brand-blue-dark); font-weight: 800; }

.event-card {
    background: #fcfdfe; border-radius: 15px; padding: 15px 20px;
    margin-bottom: 15px; display: flex; align-items: center; gap: 20px;
    border: 1px solid #f0f4f8; transition: 0.3s;
}
.event-card:hover { transform: translateX(10px); background: #f0f8ff; }

.event-time-badge { font-weight: 900; color: var(--brand-blue-dark); font-size: 18px; min-width: 65px; }
.event-info h4 { margin: 0; font-size: 17px; color: var(--ice-dark); font-weight: 800; }

/* Легенда */
.calendar-legend { display: flex; gap: 20px; margin-top: 30px; justify-content: center; font-size: 14px; font-weight: 700; color: #777; }
.legend-item { display: flex; align-items: center; gap: 8px; }
.dot.bg-blue { background: var(--brand-blue-dark); }
.dot.bg-orange { background: var(--brand-orange); }

@media (max-width: 900px) {
    .schedule-layout { flex-direction: column; }
    .calendar-card, .events-panel { width: 100%; padding: 20px; }
    .day { aspect-ratio: auto; height: 60px; }
}

/* ==========================================================================
   RTL FIXES (ИСПРАВЛЕНИЯ ДЛЯ ИВРИТА)
   ========================================================================== */

/* --- 1. Исправление КАРТЫ на главной --- */
[dir="rtl"] .main-map-block--info {
    /* Убираем отступ слева, который был для английского */
    margin-left: 0;
    
    /* Делаем наложение справа */
    margin-right: -20px;
    
    /* Зеркалим форму осколка, чтобы она стыковалась с картой */
    clip-path: polygon(0 5%, 95% 0, 100% 100%, 5% 95%);
}

/* Если на мобильном карта и текст тоже наезжают, поправим это: */
@media (max-width: 900px) {
    [dir="rtl"] .main-map-block--info {
        margin-right: 0;
        margin-top: -30px; /* На мобильном они друг под другом */
        clip-path: polygon(0 5%, 100% 0, 100% 100%, 0 95%);
    }
}


/* --- 2. Исправление СПИСКОВ (Звездочки) на Дне Рождения --- */
[dir="rtl"] .reasons-list li {
    /* Меняем отступ текста: не слева, а справа */
    padding-left: 0;
    padding-right: 30px;
}

[dir="rtl"] .reasons-list li::before {
    /* Перемещаем звездочку с левого края на правый */
    left: auto;
    right: 0;
}


/* --- 3. Исправление ТАБЛИЦЫ ЦЕН (Price List) --- */
/* Чтобы цены и названия не прилипали не к тем краям */
[dir="rtl"] .modern-price-table th { 
    text-align: right; 
}
[dir="rtl"] .modern-price-table th.col-price { 
    text-align: left; 
}
[dir="rtl"] .td-price { 
    text-align: left; 
}


/* --- 4. Исправление КАРТОЧЕК В МАГАЗИНЕ --- */
/* Бейдж "Нет в наличии" переносим налево (или направо, как удобнее) */
[dir="rtl"] .out-of-stock-badge {
    left: auto;
    right: 15px;
}

/* ==========================================================================
   ФИНАЛЬНЫЙ СТАНДАРТ КНОПОК И ОТСТУПОВ
   ========================================================================== */

/* 1. Базовый стиль всех кнопок */
.btn-call, .btn-permission, .btn-whatsapp {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 15px !important;
    
    width: auto !important;
    min-width: 300px !important;
    height: 70px !important;
    padding: 0 30px !important;
    
    border-radius: 15px !important;
    font-size: 22px !important;
    font-weight: 800;
    text-transform: uppercase;
    transition: 0.3s ease;
    box-shadow: 0 4px 15px rgba(0,0,0,0.1);
    white-space: nowrap;
    text-decoration: none !important;
    border: none !important;
}

/* 2. Принудительный показ иконок (удалены все display: none) */
.btn-call i, .btn-permission i, .btn-whatsapp i {
    display: inline-block !important;
    font-size: 24px !important;
    visibility: visible !important;
    opacity: 1 !important;
    margin: 0 !important;
}

/* 3. Цвета */
.btn-call       { background-color: var(--brand-blue-dark) !important; color: #fff !important; }
.btn-permission { background-color: var(--brand-yellow) !important; color: var(--ice-dark) !important; }
.btn-whatsapp   { background-color: #25D366 !important; color: #fff !important; }

/* 4. Поведение на Иврите (RTL) - иконка будет слева */
html[dir="rtl"] .btn-call, 
html[dir="rtl"] .btn-permission,
html[dir="rtl"] .btn-whatsapp {
    flex-direction: row-reverse !important;
}

/* 5. Контейнер для кнопок в ряд */
.strip-button-container {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 20px !important;
    width: 100% !important;
    flex-wrap: wrap !important;
}

/* 6. ФИКС ОТСТУПА ПЕРЕД ФУТЕРОМ */
.bottom-cta-wrapper {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100%;
    padding: 60px 0 120px 0 !important; /* Увеличили отступ снизу до 120px */
    background-color: #ffffff;
    clear: both;
}


/* --- КОМПАКТНАЯ КНОПКА НАЗАД --- */
.btn-back-compact {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 10px;
    
    /* УМЕНЬШЕННЫЙ РАЗМЕР */
    width: 160px !important; 
    height: 70px !important;
    
    /* СТИЛЬ: Прозрачная с синим контуром (чтобы не спорить с главной кнопкой) */
    background-color: transparent !important;
    border: 2px solid var(--brand-blue-dark) !important;
    color: var(--brand-blue-dark) !important;
    
    border-radius: 15px !important;
    font-size: 20px !important; 
    font-weight: 800 !important;
    text-transform: uppercase;
    transition: all 0.3s ease;
    cursor: pointer;
}

.btn-back-compact:hover {
    background-color: var(--brand-blue-dark) !important;
    color: #fff !important;
    transform: translateY(-3px);
}

/* Фикс стрелки для иврита (RTL) */
html[dir="rtl"] .btn-back-compact {
    flex-direction: row-reverse !important;
}

/* ==========================================================================
   ФИНАЛЬНЫЙ МОБИЛЬНЫЙ ФИКС (RTL & LTR)
   ========================================================================== */

/* ==========================================================================
   ФИНАЛЬНЫЙ МОБИЛЬНЫЙ ФИКС (LTR & RTL + КНОПКИ)
   ========================================================================== */
@media (max-width: 768px) {
    /* --- 1. ОБЩИЕ НАСТРОЙКИ --- */
    body { font-size: 18px !important; overflow-x: hidden; }

    /* --- 2. МОБИЛЬНОЕ МЕНЮ (Полный экран, без скоса) --- */
    .open-menu--links {
        box-sizing: border-box !important; /* ВАЖНО: чтобы паддинги не расширяли меню */
        width: 100% !important; 
        max-width: 100% !important;
        right: 0 !important;
        left: 0 !important;
        padding: 20px 25px !important; 
        clip-path: none !important; /* Убираем скос */
        background: linear-gradient(160deg, var(--brand-blue-dark), var(--ice-dark)) !important;
        height: 100vh !important;
        display: flex !important;
        flex-direction: column !important;
        transform: translateX(100%);
        transition: transform 0.4s ease-in-out !important;
    }

    body.menu-open .open-menu--links {
        transform: translateX(0) !important;
    }

    /* Шапка меню (Языки и Крестик) */
    .mobile-menu-top-bar {
        box-sizing: border-box !important;
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
        width: 100% !important;
        margin-bottom: 20px !important;
        flex-shrink: 0;
    }

    /* ФИКС КРЕСТИКА (Чтобы его не сдавливало) */
    .mobile-close-btn {
        flex-shrink: 0 !important; 
        width: 45px !important;
        height: 45px !important;
        border: 2px solid rgba(255,255,255,0.4) !important;
        border-radius: 50% !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        position: relative !important;
        z-index: 1050 !important;
        cursor: pointer !important;
    }
    .mobile-close-btn span {
        display: block !important;
        width: 24px !important; height: 2px !important; 
        background: #fff !important; position: absolute !important;
    }
    .mobile-close-btn span:first-child { transform: rotate(45deg) !important; }
    .mobile-close-btn span:last-child { transform: rotate(-45deg) !important; }

    /* --- 3. НАВИГАЦИЯ В МЕНЮ --- */
    .open-menu--links--scroll {
        width: 100% !important;
        padding: 10px 0 !important;
        overflow-y: auto !important;
    }

    .open-menu--links__navigation li a {
        font-size: 22px !important;
        padding: 15px 10px !important;
        width: 100% !important;
        display: block !important;
        border-bottom: 1px solid rgba(255,255,255,0.1) !important;
        white-space: normal !important; /* Разрешаем перенос текста */
        text-align: left !important;
    }

    /* Адаптация меню для Иврита (RTL) */
    html[dir="rtl"] .open-menu--links__navigation li a {
        text-align: right !important;
    }

    /* --- 4. КНОПКИ УСЛУГ НА ГЛАВНОЙ (Карточки) --- */
    .services-nav-section { padding-top: 20px !important; }

    .services-buttons-row {
        flex-direction: column !important;
        align-items: center !important;
        gap: 15px !important;
        width: 100% !important;
        padding: 0 15px !important;
        box-sizing: border-box !important;
    }

    .service-btn {
        box-sizing: border-box !important;
        width: 100% !important; /* На всю ширину контейнера */
        max-width: 350px !important; /* Но не больше 350px */
        height: auto !important;
        min-height: 65px !important; /* Вместо жесткой высоты - минимальная */
        padding: 15px 20px !important;
        font-size: 20px !important;
        aspect-ratio: auto !important; /* Отключаем квадраты */
        margin: 0 auto !important;
        border-radius: 15px !important;
    }

    .service-btn.btn-featured {
        order: -1 !important; /* Главная услуга всегда первая на мобилках */
        min-height: 75px !important;
        font-size: 22px !important;
    }

    /* --- 5. ВСЕ ОСНОВНЫЕ КНОПКИ (Чтобы влезали в экран) --- */
    .strip-button-container, .force-center {
        flex-direction: column !important;
        align-items: center !important;
        width: 100% !important;
        padding: 0 15px !important;
        box-sizing: border-box !important;
        gap: 15px !important;
    }
    
    /* Массово применяем защиту к кнопкам действий, контактов и футера */
    .btn-call, .btn-permission, .btn-whatsapp, 
    .footer-yellow-btn, .btn-brand-yellow-large, .btn-brand-call {
        box-sizing: border-box !important;
        width: 100% !important; 
        max-width: 350px !important; 
        height: auto !important;
        min-height: 60px !important;
        padding: 15px 20px !important;
        font-size: 18px !important;
        margin: 0 auto !important;
        display: flex !important;
        justify-content: center !important;
        text-align: center !important;
        white-space: normal !important; /* ВАЖНО: Разрешает перенос длинного текста! */
        line-height: 1.3 !important;
    }

    /* --- 6. ФУТЕР И НИЖНИЕ БЛОКИ --- */
    .footer-content {
        flex-direction: column !important;
        text-align: center !important;
        gap: 30px !important;
    }
    
    /* Принудительно центрируем контакты на всех языках на мобильном */
    .footer-contacts, html[dir="rtl"] .footer-contacts {
        text-align: center !important;
    }

    .footer-contact-links {
        justify-content: center !important;
        flex-wrap: wrap !important;
    }

    .footer-buttons-gap {
        flex-direction: column !important;
        align-items: center !important;
        width: 100% !important;
        gap: 15px !important;
    }

    .cta-title-row {
        flex-direction: column !important;
        text-align: center !important;
    }
}

/* Специальный фикс для Иврита (RTL) в мобильном меню */
html[dir="rtl"] .mobile-menu-top-bar {
    flex-direction: row-reverse !important; /* Меняем местами языки и крестик */
    padding: 0 10px !important; /* Даем немного воздуха от краев */
}

html[dir="rtl"] .mobile-langs {
    flex-direction: row-reverse !important; /* Разворачиваем порядок кнопок языков (EN RU HE) */
}

/* --- ГЛОБАЛЬНЫЙ ФИКС ШИРИНЫ ЭКРАНА --- */
html, body {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important; /* Жестко запрещаем горизонтальный скролл */
    position: relative;
}

/* Применяем правильный расчет ширины КО ВСЕМ элементам на сайте */
*, *:before, *:after {
    box-sizing: border-box !important;
}

/* Ограничиваем все картинки и видео, чтобы они не были шире экрана */
img, video, iframe, canvas {
    max-width: 100% !important;
    height: auto;
}

/* Фикс стандартного контейнера (обычно он виноват) */
.container {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 15px !important;
    padding-right: 15px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
}

/* Если на десктопе контейнер должен быть узким, возвращаем это через медиа-запрос */
@media (min-width: 1200px) {
    .container {
        max-width: 1140px !important;
    }
}

@media (max-width: 768px) {
    /* Чтобы меню не толкало экран вбок */
    .open-menu {
        width: 100% !important;
        overflow: hidden !important;
    }

    .open-menu--links {
        width: 100% !important;
        max-width: 100% !important;
        left: 0 !important;
        right: 0 !important;
        box-sizing: border-box !important;
    }

    /* Специфический фикс для иврита: меню должно уходить в «правильную» сторону */
    html[dir="rtl"] .open-menu--links {
        transform: translateX(-100%); /* На иврите прячем влево */
    }
    
    html[dir="rtl"].menu-open .open-menu--links {
        transform: translateX(0) !important;
    }
    
    /* Убираем любые фиксированные ширины у кнопок услуг */
    .service-btn {
        width: 100% !important;
        min-width: 0 !important;
    }
}