/* =================================================================
   pages.css — СТИЛИ ИНФОБЛОКОВ, СТРАНИЦ И СПЕЦИАЛЬНЫХ СЕКЦИЙ
   уникальные блоки конкретных страниц
================================================================= */
/* =========================================================
   СТИЛИ ИНТЕНСИВА (Унифицированные с формами)
   ========================================================= */

/* Неоновые бейджи (Формат, Возраст) */
.badge-neon-pink, .badge-neon-blue {
    background: rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    color: #fff;
    padding: 8px 20px;
    border-radius: 50px;
    font-weight: 600;
    font-size: 14px;
}
.badge-neon-pink { border: 1px solid rgba(221, 0, 255, 0.5); box-shadow: 0 0 10px rgba(221, 0, 255, 0.2); }
.badge-neon-blue { border: 1px solid rgba(0, 255, 242, 0.5); box-shadow: 0 0 10px rgba(0, 255, 242, 0.2); }

/* Стеклянные карточки дат (Смены) */
.glass-shift-card {
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 8px;
    color: #fff;
    padding: 10px 16px;
    font-size: 14px;
    transition: all 0.3s ease;
    cursor: default;
}
.glass-shift-card:hover {
    background: rgba(255, 255, 255, 0.2);
    transform: translateY(-2px);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
}

/* Неоновые ссылки для адресов */
.link-neon {
    color: #00FFF2;
    text-decoration: none;
    margin-right: 5px;
    transition: color 0.3s ease, text-shadow 0.3s ease;
}
.link-neon:hover {
    color: #fff;
    text-shadow: 0 0 8px rgba(0, 255, 242, 0.8);
}

/* Обёртка для картинки, чтобы она светилась как наши карточки */
.image-neon-wrapper {
    position: relative;
    border-radius: 16px; /* Под размер rounded-4 в бутстрапе */
}
.image-neon-wrapper::before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: 18px;
    background: linear-gradient(135deg, #DD00FF, #00FFF2);
    z-index: -1;
    filter: blur(8px);
    opacity: 0.6;
    transition: opacity 0.3s ease;
}
.image-neon-wrapper:hover::before {
    opacity: 1;
}

/* ========================================
   КАРТОЧКИ ЦЕН: ТОЛЬКО ЛАЙОУТ (Визуал берем из vars.css)
   ======================================== */

/* --- 1. КОНТЕЙНЕР (РЯД) --- */
.pricing-scroll-wrapper {
    overflow: hidden;
}

.pricing-scroll-container {
    display: flex !important;
    align-items: center !important; 
    justify-content: flex-start;
    overflow-x: auto;
    gap: 20px !important;
    padding-left: 5px; 
    padding-top: 25px !important; 
    padding-bottom: 25px !important;
    -ms-overflow-style: none !important;
    scrollbar-width: none !important;
}

.pricing-scroll-container::-webkit-scrollbar {
    display: none !important;
}

@media (min-width: 992px) {
    .pricing-scroll-container {
        justify-content: center !important;
    }
}

/* --- 2. САМА КАРТОЧКА --- */
.price-card {
    /* Фоны и стекло УДАЛЕНЫ — они работают через класс .glass-neon-panel */
    
    /* Размеры и выравнивание */
    height: 250px !important; 
    position: relative;
    transform: none !important; 
    margin: 0 !important;
    
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important; 
    align-items: center !important;
    
    flex: 0 0 auto !important;
    min-width: 260px !important;
}

@media (min-width: 992px) {
    .price-card {
        flex: 1 1 0 !important; 
        min-width: 200px !important; 
        max-width: 280px !important;
    }
}

/* --- 3. ВЫДЕЛЕННАЯ КАРТОЧКА (8 занятий) --- */
.price-card-featured {
    /* Только делаем её выше. Никаких фонов! */
    height: 290px !important; 
}

/* --- 4. ВНУТРЕННОСТИ (Текст и отступы) --- */
.price-content-group {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
}

.price-header { padding: 0 !important; }
.price-body { padding: 0 !important; text-align: center; }

.price-header h3 {
    font-size: 24px !important;
    font-weight: 700 !important;
    color: #ffffff !important;
    margin: 0 !important;
}

.price-body h2.price-value {
    font-size: 24px !important; 
    font-weight: 700 !important; 
    color: #ffffff !important;
    margin-bottom: 2px !important;
}

.price-body p.price-per-lesson {
    font-size: 20px !important; 
    font-weight: 300 !important; 
    color: rgba(255, 255, 255, 0.6) !important; 
    margin: 0 !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
}

/* --- 5. ЖЕЛЕЗОБЕТОННАЯ ЛИНИЯ --- */
hr.price-divider {
    display: block !important;
    width: 60px !important; 
    height: 0 !important; 
    border: none !important;
    border-top: 2px solid rgba(255, 255, 255, 0.4) !important; 
    background: transparent !important;
    margin: 15px auto !important; 
    opacity: 1 !important; 
}

/* --- 6. БЕЙДЖИ --- */
.neon-badge-oldstyle {
    position: absolute;
    top: -16px !important; 
    right: 20px !important;
    background-color: #ffffff !important;
    color: #0b0d17 !important;
    padding: 4px 14px !important;
    border-radius: 4px !important;
    font-size: 14px !important; 
    font-weight: 700 !important;
    z-index: 10;
    box-shadow: 0 4px 10px rgba(0,0,0,0.2) !important;
}

/* Стили для секции FAQ */
.faq-item {
    background: rgba(255, 255, 255, 0.03); /* Легкий фон плашки */
    border: 1px solid rgba(0, 255, 242, 0.2); /* Тонкая неоновая граница */
    border-radius: 15px;
    margin-bottom: 10px;
    transition: all 0.3s ease;
    overflow: hidden;
}

.faq-header {
    width: 100%;
    padding: 20px 25px;
    background: transparent;
    border: none;
    display: flex;
    align-items: center;
    position: relative;
    cursor: pointer;
    color: #fff;
}

.faq-question {
    font-size: 18px;
    font-weight: 600;
    text-align: left;
    padding-right: 40px; /* Отступ под галочку */
}

/* Рисуем галочку через CSS */
.faq-header::after {
    content: '';
    position: absolute;
    right: 25px;
    top: 50%;
    width: 10px;
    height: 10px;
    border-right: 2px solid #DD00FF; /* Бирюзовый цвет */
    border-bottom: 2px solid #DD00FF;
    transform: translateY(-70%) rotate(45deg);
    transition: all 0.3s ease;
    box-shadow: 2px 2px 5px rgba(0, 255, 242, 0.3); /* Свечение галочки */
}

/* Состояние при открытии (active) */
/* .faq-item.active {
    background: rgba(0, 255, 242, 0.05);
    border-color: rgba(0, 255, 242, 0.5);
} */

.faq-item.active .faq-header::after {
    transform: translateY(-30%) rotate(-135deg); /* Поворот стрелки вверх */
}

/* Контент вопроса */
.faq-body {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease-in-out;
}

.faq-item.active .faq-body {
    max-height: 500px; /* Достаточная высота для текста */
}

.faq-content {
    padding: 0 25px 25px 25px;
    color: rgba(255, 255, 255, 0.8);
    line-height: 1.6;
}

.faq-content ul li {
    margin-bottom: 8px;
}
   
   /* ========================================
      КНОПКА "ПОДРОБНЕЕ" И ТЕКСТ КУРСОВ
      ======================================== */
   
   /* Та самая белая кнопка-таблетка */
   .btn-white-pill {
       display: inline-flex !important;
       align-items: center !important;
       background-color: #ffffff !important;
       color: #0b0d17 !important; /* Темный текст на белой кнопке */
       padding: 10px 24px !important;
       border-radius: 50px !important;
       font-size: 16px !important;
       font-weight: 600 !important;
       text-decoration: none !important;
       border: none !important;
       transition: all 0.3s ease !important;
   }
   
   .btn-white-pill:hover {
       transform: translateY(-2px);
       box-shadow: 0 5px 15px rgba(255, 255, 255, 0.2);
       color: var(--theme-color-main, #ba3cb3) !important;
   }
   
   .btn-white-pill i {
       font-size: 14px;
   }
   
   /* Тонкий, крупный текст для описания курсов */
   .course-thin-text {
       font-size: 20px !important;
       line-height: 1.5 !important;
       font-weight: 300 !important; /* Тот самый тонкий Montserrat */
       color: rgba(255, 255, 255, 0.9) !important;
   }
   
/* 1. Поля ввода (серые, полупрозрачные, с мягкими углами) */
.form-control-custom {
    background-color: rgba(255, 255, 255, 0.2) !important; /* Тот самый полупрозрачный серый фон */
    border: 1px solid rgba(255, 255, 255, 0.05) !important; /* Едва заметная рамка */
    border-radius: 10px !important; /* Закругляем углы */
    color: #ffffff !important; /* Белый текст при вводе */
    padding: 10px 20px !important; /* Делаем поле тоньше по высоте */
}

/* Цвет плейсхолдера (подсказки "Имя", "Email" внутри поля) */
.form-control-custom::placeholder {
    color: rgba(255, 255, 255, 0.5) !important;
}

/* Состояние при клике (фокус) */
.form-control-custom:focus {
    background-color: rgba(255, 255, 255, 0.25) !important;
    border-color: rgba(255, 255, 255, 0.3) !important;
    outline: none !important;
    box-shadow: none !important;
}

/* 2. Сжимаем форму по высоте */
.form-group-item {
    margin-bottom: 12px !important; /* Уменьшаем расстояние между блоками полей */
}

.form-group-item label {
    font-size: 14px !important; /* Чуть уменьшаем подписи над полями */
    margin-bottom: 5px !important; /* Придвигаем подпись ближе к самому полю */
    color: #ffffff !important;
}

/* 3. Делаем саму карточку компактнее (убираем лишний воздух) */
.contact-card {
    padding: 35px 40px !important; 
}

/* 4. Кнопка и текст-дисклеймер в одну строку */
.form-submit-row {
    display: flex;
    flex-direction: row !important;
    align-items: center;
    gap: 20px; 
    margin-top: 15px;
}

.form-submit-row .btn-submit {
    flex: 0 0 160px; /* Фиксируем ширину кнопки */
    padding: 12px 0;
    border-radius: 50px !important; /* Полностью круглая кнопка */
    font-weight: 700 !important;
    color: #0c284d !important;
    background-color: #ffffff !important;
    border: none !important;
}

.form-submit-row .form-disclaimer {
    font-size: 11px !important;
    line-height: 1.3 !important;
    color: rgba(255, 255, 255, 0.5) !important;
    text-align: left;
    margin: 0 !important;
}

/* ========================================
   ИСПРАВЛЕНИЕ СТРАНИЦЫ КОНТАКТОВ (КОМПАКТНОСТЬ И ИЕРАРХИЯ)
   ======================================== */

.contact-info-details {
    padding-right: 20px;
}

/* ЗАГОЛОВКИ в блоке контактов (Телефоны, Telegram и т.д.) */
.contact-info-details h3.contact-subtitle {
    font-size: 24px !important; /* Было 20px */
    line-height: 1.2 !important;
    font-weight: 700 !important; /* Жирный шрифт */
    color: #ffffff !important;
    margin-top: 0 !important;
    margin-bottom: 12px !important; /* Отступ до текста */
    text-transform: none !important;
    letter-spacing: 0;
}

/* Первый заголовок прижимаем к самому верху */
.contact-block-group:first-child h3.contact-subtitle {
    margin-top: 0 !important;
}

/* ТЕКСТ и ССЫЛКИ с иконками (ПОД СКРИНШОТ СТАРОГО САЙТА) */
.contact-info-details p, 
.contact-info-details .footer-link {
    font-size: 20px !important; /* Montserrat 20px Thin */
    line-height: 26px !important;
    font-weight: 300 !important;
    color: #ffffff !important;
    margin-bottom: 8px !important; /* Плотный отступ */
    display: flex;
    align-items: center;
    text-decoration: none !important;
}

/* Иконки — выравнивание */
.contact-info-details img.me-3 {
    width: 20px !important;
    height: auto;
    margin-right: 15px !important;
    flex-shrink: 0;
}

/* Ссылки при наведении */
.contact-info-details .footer-link:hover {
    color: var(--theme-color-main, #ba3cb3) !important;
}

/* Отступы между группами контактов */
.contact-block-group.mt-4 {
    margin-top: 25px !important; /* Плотный вертикальный отступ */
}

/* ========================================
   ИСПРАВЛЕНИЕ КАРТЫ: НЕОН И УКЛЫ
   ======================================== */

.contact-map-card {
    /* НЕ ПЕРЕЗАПИСЫВАЕМ border, чтобы работал glass-neon-panel */
    padding: 0 !important;
    border-radius: 25px !important; /* Твой радиус панелей */
    overflow: hidden !important;
    position: relative !important;
    /* Устраняем проблему "вылетания" iframe за границы скругления */
    mask-image: -webkit-radial-gradient(white, black); 
    -webkit-mask-image: -webkit-radial-gradient(white, black);
    
    /* Убираем любые фильтры, чтобы карта всегда была "сочной" */
    filter: none !important; 
}

.contact-map-card .map-container {
    width: 100% !important;
    height: 500px !important;
    border-radius: 0 !important;
    overflow: hidden !important;
}

.contact-map-card iframe {
    width: 100% !important;
    height: 500px !important;
    border: none !important;
    display: block !important;
    /* Убираем эффект задержки, чтобы карта сразу реагировала */
    pointer-events: all !important; 
}

/* Убеждаемся, что внутри нет лишних отступов от Bootstrap */
.contact-map-card.glass-neon-panel {
    background-clip: padding-box !important;
}

/* ===================================
   КАРТОЧКИ С ЦИФРАМИ И СПИСКИ (Курсы)
====================================== */

.number-feature-card {
    /* Вернул жесткую высоту и отступы, чтобы карточки были как на старом сайте */
    min-height: 270px !important; 
    padding: 30px 40px !important; 
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.number-feature-card .num-title {
    font-size: 46px; /* Оставляем в пикселях, так как для 46px нет переменной */
    font-weight: 900;
    color: #ffffff;
    margin-bottom: 15px;
    line-height: 1;
}

.number-feature-card .num-desc {
    font-size: var(--font-size-base) !important; /* Это 16px (нормальный текст) */
    line-height: 1.6 !important; 
    color: rgba(255, 255, 255, 0.9) !important;
    margin: 0 !important;
    font-weight: 400 !important; 
}

.course-text-large {
    font-size: var(--font-size-lg) !important; /* Это твои 20px */
    line-height: 26px !important;
    color: rgba(255, 255, 255, 0.9) !important;
    font-weight: 300 !important; 
}

/* Крупный шрифт для списков */
.neon-bullet-list {
    list-style: none;
    padding-left: 0;
    margin-top: 20px;
}

.neon-bullet-list li {
    font-size: var(--font-size-lg) !important; /* Это твои 20px */
    line-height: 26px !important;
    color: rgba(255, 255, 255, 0.9) !important;
    margin-bottom: 15px; 
    position: relative;
    padding-left: 25px; 
    font-weight: 300 !important;
}

.neon-bullet-list li::before {
    content: "•";
    color: var(--theme-color-main, #8A2BE2);
    font-size: 30px; 
    position: absolute;
    left: 0;
    top: -3px; 
}

/* ========================================
   Универсальный класс с неоновой рамкой
   ======================================== */
.glow-border {
    position: relative;
    width: 100%;
    display: flex;
    flex-direction: column;
    padding: 15px 30px;
    border-radius: 24px;
    
    /* Улучшенный фон с легким фиолетовым оттенком */
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.1) 0%, rgba(138, 43, 226, 0.05) 100%);
    
    /* Фиолетовая рамка (неоновый контур) */
    border: 1px solid #8A2BE2 !important;
    
    /* Неоновое свечение (внешнее и внутреннее) */
    box-shadow: 0px 0px 15px rgba(138, 43, 226, 0.6), 
                inset 0px 0px 10px rgba(138, 43, 226, 0.3);
    
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    z-index: 2;
    transition: all 0.3s ease;
}

/* Эффект при наведении */
.glow-border:hover {
    box-shadow: 0px 0px 25px rgba(138, 43, 226, 0.9), 
                inset 0px 0px 15px rgba(138, 43, 226, 0.4);
    transform: translateY(-5px);
}

/* Вариант для изображений (без внутренних отступов) */
.glow-border-img {
    position: relative;
    display: inline-block;
    border-radius: 24px;
    overflow: hidden;
    
    /* Фиолетовая рамка (неоновый контур) */
    border: 1px solid #8A2BE2 !important;
    
    /* Неоновое свечение (внешнее) */
    box-shadow: 0px 0px 15px rgba(138, 43, 226, 0.6);
    
    transition: all 0.3s ease;
}

.glow-border-img:hover {
    box-shadow: 0px 0px 25px rgba(138, 43, 226, 0.9);
    transform: translateY(-5px);
}

.glow-border-img img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 24px;
}

/* Вариант для изображений без закругления углов */
.glow-border-img-square {
    position: relative;
    display: inline-block;
    overflow: hidden;
    
    /* Фиолетовая рамка (неоновый контур) */
    border: 1px solid #8A2BE2 !important;
    
    /* Неоновое свечение (внешнее) */
    box-shadow: 0px 0px 15px rgba(138, 43, 226, 0.6);
    
    transition: all 0.3s ease;
}

.glow-border-img-square:hover {
    box-shadow: 0px 0px 25px rgba(138, 43, 226, 0.9);
    transform: translateY(-5px);
}

.glow-border-img-square img {
    display: block;
    width: 100%;
    height: auto;
}

/* Вариант с синим свечением (для разнообразия) */
.glow-border-blue {
    border-color: #007bff !important;
    box-shadow: 0px 0px 15px rgba(0, 123, 255, 0.6), 
                inset 0px 0px 10px rgba(0, 123, 255, 0.3);
}

.glow-border-blue:hover {
    box-shadow: 0px 0px 25px rgba(0, 123, 255, 0.9), 
                inset 0px 0px 15px rgba(0, 123, 255, 0.4);
}

/* Вариант с зеленым свечением */
.glow-border-green {
    border-color: #28a745 !important;
    box-shadow: 0px 0px 15px rgba(40, 167, 69, 0.6), 
                inset 0px 0px 10px rgba(40, 167, 69, 0.3);
}

.glow-border-green:hover {
    box-shadow: 0px 0px 25px rgba(40, 167, 69, 0.9), 
                inset 0px 0px 15px rgba(40, 167, 69, 0.4);
}

/* Вариант с золотым свечением */
.glow-border-gold {
    border-color: #ffc107 !important;
    box-shadow: 0px 0px 15px rgba(255, 193, 7, 0.6), 
                inset 0px 0px 10px rgba(255, 193, 7, 0.3);
}

.glow-border-gold:hover {
    box-shadow: 0px 0px 25px rgba(255, 193, 7, 0.9), 
                inset 0px 0px 15px rgba(255, 193, 7, 0.4);
}

/* ===================================
   Секция: Главный экран (Hero)
====================================== */
.hero-magic-section {
    position: relative;
    z-index: 1;
}
.hero-subtitle {
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 1px;
    text-transform: uppercase;
    opacity: 0.8;
}
.hero-title {
    color: #fff;
    font-size: 32px; 
    font-weight: 700;
    line-height: 1.2;
}
.text-gradient {
    background: linear-gradient(90deg, #FF52E8 0%, #B252FF 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    display: inline-block;
}
.hero-description {
    color: rgba(255, 255, 255, 0.8);
    font-size: 16px;
    line-height: 1.5;
    max-width: 500px;
}
.btn-magic-primary {
    background: linear-gradient(90deg, #FF52E8 0%, #B252FF 100%);
    border: none;
    color: #fff;
    padding: 12px 30px;
    border-radius: 50px;
    font-weight: 600;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    text-decoration: none;
}
.btn-magic-primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 5px 15px rgba(255, 82, 232, 0.4);
    color: #fff;
}
.btn-magic-outline {
    background: transparent;
    border: 2px solid #fff;
    color: #fff;
    padding: 10px 30px;
    border-radius: 50px;
    font-weight: 600;
    transition: all 0.3s ease;
    text-decoration: none;
}
.btn-magic-outline:hover {
    background: rgba(255, 255, 255, 0.1);
    color: #fff;
}
.hero-image {
    animation: float 6s ease-in-out infinite;
}
@keyframes float {
    0% { transform: translateY(0px); }
    50% { transform: translateY(-15px); }
    100% { transform: translateY(0px); }
}
@media (min-width: 992px) {
    .hero-title {
        font-size: 48px;
    }
}
.main-title {
    font-family: 'Montserrat', sans-serif;
    font-weight: 900;
    font-size: 45px;
    line-height: 1; 
    text-transform: uppercase;
    text-align: center;
    color: #ffffff; 
}
.main-subtitle {
    font-family: 'Montserrat', sans-serif;
    font-weight: 500;
    font-size: 20px !important;
    line-height: 1.2 !important;
    text-align: center;
    color: #ffffff;
}
@media (max-width: 767px) {
    .main-title { font-size: 32px; }
    .main-subtitle { font-size: 16px; line-height: 1.3; }
}
.info-card {
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 18px;
    padding: 12px 20px;
    display: flex;
    align-items: center;
    gap: 15px;
    backdrop-filter: blur(10px);
}
.info-card-icon-wrap {
    width: 24px;
    height: 24px;
    flex-shrink: 0;
}
.info-card-label {
    font-size: 13px;
    color: rgba(255, 255, 255, 0.6);
    font-weight: 500;
}
.info-card-value {
    font-size: 16px;
    color: #ffffff;
    font-weight: 600;
}
.floating-island {
    animation: floatingIsland 6s ease-in-out infinite;
}
@keyframes floatingIsland {
    0%, 100% { transform: translateY(0px); }
    50% { transform: translateY(-15px); }
}
@media (max-width: 991px) {
    .info-card {
        width: 100%;
        justify-content: flex-start;
    }
}
.island-image {
    width: 463px;
    height: 377px;
    border-radius: 24px;
    object-fit: cover;
}
.floating-island {
    animation: floatingIsland 6s ease-in-out infinite;
}
@keyframes floatingIsland {
    0%, 100% { transform: translateY(0px); }
    50% { transform: translateY(-15px); }
}
.info-card {
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 18px;
    padding: 12px 20px;
    display: flex;
    align-items: center;
    gap: 15px;
    backdrop-filter: blur(10px);
}
.info-card-icon-wrap {
    width: 24px;
    height: 24px;
    flex-shrink: 0;
}
.info-card-label {
    font-size: 13px;
    color: rgba(255, 255, 255, 0.6);
    font-weight: 500;
}
.info-card-value {
    font-size: 16px;
    color: #ffffff;
    font-weight: 600;
}
@media (max-width: 991px) {
    .island-image {
        width: 100%;
        height: auto;
        max-width: 463px;
    }
    .info-card {
        width: 100%;
        justify-content: flex-start;
    }
}
.btn-white-round {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 262px;
    height: 60px;
    background: #FFFFFF;
    border-radius: 32px;
    border: none;
    cursor: pointer;
    text-decoration: none !important;
    transition: all 0.3s ease;
    opacity: 1;
    font-family: 'Montserrat', sans-serif;
    font-weight: 700; 
    font-size: 24px;
    line-height: 26px;
    color: #1E1F62 !important;
    text-align: center;
    text-transform: none;
}
.btn-white-round:hover {
    background: #f0f0f0;
    transform: translateY(-2px);
    box-shadow: 0 5px 15px rgba(255, 255, 255, 0.2);
    color: #1E1F62 !important;
}
@media (max-width: 767px) {
    .btn-white-round {
        width: 100%;
        max-width: 262px;
        font-size: 20px;
    }
}
.badge-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 13px;
    position: relative;
}
.badge-label {
    font-weight: 500;
    font-size: 24px;
    color: #FFFFFF;
}
.badge-box {
    position: relative;
    padding: 0 10px;
    z-index: 1;
}
.badge-text {
    font-weight: 700;
    font-size: 32px;
    color: #FFFFFF;
    position: relative;
    z-index: 2;
    white-space: nowrap;
    display: inline-block;
}
.badge-box:before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 105%;
    height: 110%;
    z-index: 1;
}
.bg-purple:before {
    background: #DD00FF;
    transform: translate(-50%, -50%) rotate(3.33deg);
}
.bg-blue:before {
    background: #0066FF;
    transform: translate(-50%, -50%) rotate(-3.4deg);
}
.shifts-title {
    font-weight: 500;
    font-size: 24px;
    color: #FFFFFF;
}
.shift-card {
    width: 188px;
    height: 36px;
    /* Усиливаем фон для лучшего контраста */
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.1) 0%, rgba(138, 43, 226, 0.1) 100%);
    
    /* Фиолетовая рамка как на макете */
    border: 1px solid #8A2BE2; 
    
    /* Неоновое свечение: 
       1. Маленький радиус для четкого контура 
       2. Большой радиус для мягкого ореола */
    box-shadow: 0px 0px 5px rgba(138, 43, 226, 0.5), 
                inset 0px 0px 5px rgba(138, 43, 226, 0.2);
    
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px; /* На макете текст выглядит чуть компактнее */
    font-family: 'Montserrat', sans-serif;
    font-weight: 400;
    color: #FFFFFF;
    letter-spacing: -0.02em;
    transition: all 0.3s ease;
    backdrop-filter: blur(5px);
}

/* Эффект при наведении (опционально, для интерактивности) */
.shift-card:hover {
    box-shadow: 0px 0px 12px rgba(138, 43, 226, 0.8);
    transform: translateY(-2px);
    border-color: #A044FF;
}

/* Сетка для смен: добавим центрирование, если нужно как на картинке */
.shifts-grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: center; /* Центрируем карточки */
    gap: 15px; /* Увеличиваем расстояние между ними */
    max-width: 600px; /* Чтобы ложились по 3 в ряд */
    margin: 0 auto;
}
.address-line {
    font-family: 'Montserrat', sans-serif;
    font-weight: 500; 
    font-size: 16px;
    line-height: 20px;
    color: #FFFFFF;
    text-align: left;
    width: 100%;
    max-width: 653px;
    margin: 0 auto 30px auto;
}
.address-label {
    color: rgba(255, 255, 255, 0.75);
    margin-right: 4px;
}
.address-link {
    color: #FFFFFF !important;
    text-decoration: underline; /* Оставляем подчеркивание, как в макете */
    text-decoration-color: rgba(255, 255, 255, 0.4);
    transition: all 0.3s ease;
    font-family: 'Montserrat', sans-serif;
}

.address-link:hover {
    color: #8A2BE2 !important; /* Наш фиолетовый неон при наведении */
    text-decoration-color: #8A2BE2;
    text-shadow: 0px 0px 8px rgba(138, 43, 226, 0.6);
}
.address-label { color: rgba(255, 255, 255, 0.75); margin-right: 8px; }
.address-link { color: #FFFFFF; font-weight: 600; text-decoration: underline; margin: 0 5px; }
.address-sep { margin: 0 5px; }
.btn-white-main {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 262px;
    height: 60px;
    background: #FFFFFF;
    border-radius: 32px;
    color: #1E1F62 !important;
    font-weight: 700;
    font-size: 24px;
    text-decoration: none !important;
    transition: 0.3s;
}
.btn-white-main:hover { transform: scale(1.05); background: #f0f0f0; }
.intensive-main-img {
    width: 463px;
    height: 377px;
    object-fit: cover;
    border-radius: 24px;
}
@media (max-width: 767px) {
    .badge-text { font-size: 24px; }
    .badge-label { font-size: 18px; }
    .intensive-main-img { width: 100%; height: auto; }
    .shift-card { width: 48%; }
}
@media (max-width: 767px) {
    .info-content-side .d-flex[style*="padding: 0 100px"] {
        padding: 0 20px !important;
        gap: 20px;
    }
}
/* ===================================
   Адаптивность для мобильных устройств
====================================== */
@media (max-width: 991px) {
    .info-content-side {
        width: 100%;
        max-width: 100% !important;
        text-align: center !important;
    }
    .info-content-side > div[style*="max-width: 653px"] {
        max-width: 100% !important;
        margin: 0 auto !important;
    }
    .info-content-side .d-flex.justify-content-start[style] {
        justify-content: center !important;
        padding-left: 0 !important;
        gap: 20px !important;
        margin-bottom: 30px !important;
    }
    .badge-label { 
         font-size: 13px !important; 
         margin-bottom: 5px !important;
     }
    .badge-text { font-size: 16px !important; }
    .shifts-section {
        margin-bottom: 30px !important;
    }
    .shifts-grid {
         display: flex;
         flex-wrap: wrap;
         justify-content: center !important;
         gap: 10px !important;
         max-width: 400px !important;
         margin: 0 auto 30px auto !important;
     }
     .shift-card {
         width: calc(50% - 5px) !important; 
         min-width: 140px !important;
         height: 36px !important;
         font-size: 14px !important;
         padding: 0 8px !important;
         display: flex;
         align-items: center;
         justify-content: center;
         text-align: center;
     }
    .address-line {
         font-size: 12px !important;
         white-space: nowrap !important;
         overflow: hidden;
         text-overflow: ellipsis;
         margin-bottom: 30px !important;
     }
     .address-label, .address-link, .address-sep {
         display: inline !important;
         margin: 0 !important;
         letter-spacing: -0.01em !important;
     }
     .btn-white-main {
         width: 100% !important;     
         max-width: none !important;  
         height: 50px !important;    
         font-size: 18px !important; 
         margin-bottom: 30px !important; 
         display: flex !important;    
     }
    .col-12.col-xl-5.text-center.mt-5 {
        margin-top: 0 !important;
    }
    .intensive-main-img {
        width: 100% !important;
        height: auto !important;
        max-width: 463px !important;
    }
}
@media (max-width: 480px) {
    .shift-card {
        width: calc(50% - 6px) !important;
    }
}
.about-card {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    padding: 40px;
    gap: 20px;
    width: 100%;
    max-width: 1140px;
    min-height: 399px;
    margin: 0 auto;
    background: linear-gradient(360deg, rgba(5, 0, 16, 0.8) 0%, rgba(166, 67, 114, 0.8) 100%);
    box-shadow: 0px 0px 13.3px #0066FF;
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-radius: 24px;
    position: relative;
    z-index: 1; 
}
.about-card::before {
    content: "";
    position: absolute;
    inset: 0; 
    border-radius: 24px; 
    padding: 5px; 
    background: linear-gradient(180deg, #DD00FF 0%, #91CDFF 50%, #9900FF 100%);
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    z-index: -1; 
    pointer-events: none;
}
.about-card-img {
    flex: none;
    width: 340px;
    height: 319px;
    border-radius: 12px;
    overflow: hidden;
}
.about-card-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.about-card-content {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.about-title {
    font-family: 'Montserrat', sans-serif;
    font-weight: 900;
    font-size: 28px;
    line-height: 34px;
    color: #FFFFFF;
    margin: 0;
}
.about-text-blocks {
    display: flex;
    flex-direction: column;
    gap: 15px;
}
.about-text-blocks p {
    font-family: 'Montserrat', sans-serif;
    font-weight: 400;
    font-size: 18px;
    line-height: 22px;
    color: #FFFFFF;
    margin: 0;
}
.about-footer-text {
    font-weight: 600 !important; 
}
/* ===================================
   Адаптивность для блока "Об интенсиве"
   ПРИНУДИТЕЛЬНЫЙ ПЕРЕХОД НА МОБИЛЬНУЮ ВЕРСТКУ (с 980px)
====================================== */
@media (max-width: 980px) {
    .about-card {
        display: flex !important;
        flex-direction: column !important; 
        background: linear-gradient(180deg, rgba(5, 0, 16, 0.9) 0%, rgba(166, 67, 114, 0.8) 100%) !important;
        padding: 25px !important;
        gap: 20px !important;
        min-height: auto !important;
    }
    .about-card-content {
        order: 1 !important; 
        text-align: left !important; 
        width: 100% !important;
    }
    .about-card-img {
        order: 2 !important;
        width: 100% !important; 
        height: 300px !important; 
        margin-top: 15px !important;
        border-radius: 12px !important;
        object-fit: cover !important; 
        object-position: top center !important; 
    }
    .about-title {
        font-size: 24px !important;
        line-height: 1.2 !important;
        text-align: left !important;
        margin-bottom: 8px !important; 
    }
    .about-text-blocks p {
        font-size: 16px !important;
        line-height: 1.4 !important;
        text-align: left !important;
        margin-bottom: 12px !important;
    }
}
/* ===================================
     Секция "Кому подойдет" (Десктоп - FLEXBOX СЕТКА)
  ====================================== */
  .who-fits-section {
      position: relative;
      padding: 0px 0;
      margin-top: 0px;
      margin-bottom: 80px;
      width: 100%;
  }
  .custom-container {
      margin: 0 auto;
      padding: 0 0px;
      position: relative;
  }
  .section-title {
      font-family: 'Montserrat', sans-serif;
      font-weight: 900;
      font-size: 28px;
      color: #FFFFFF;
      line-height: 1.2;
      text-align: center;
      margin-bottom: 80px;
      letter-spacing: -0.5px;
  }
  .who-fits-wrapper {
      position: relative;
      display: flex;
      flex-direction: column;
      gap: 60px;          
      width: 100%;
  }
  .who-fits-row {
      display: flex;
      justify-content: center;
      gap: 24px;
      width: 100%;
      flex-wrap: wrap;
  }
  .who-card-wrapper {
      position: relative;
      width: 356px;       
      display: flex;
      z-index: 1;
  }
  .card-elevated {
      transform: translateY(-36px);
  }
  .who-card {
      position: relative;
      width: 100%;
      display: flex;
      flex-direction: column;
      padding: 15px 30px;
      border-radius: 24px;
      
      /* Улучшенный фон с легким фиолетовым оттенком */
      background: linear-gradient(180deg, rgba(255, 255, 255, 0.1) 0%, rgba(138, 43, 226, 0.05) 100%);
      
      /* Фиолетовая рамка (неоновый контур) */
      border: 1px solid #8A2BE2 !important;
      
      /* Неоновое свечение (внешнее и внутреннее) */
      box-shadow: 0px 0px 15px rgba(138, 43, 226, 0.6), 
                  inset 0px 0px 10px rgba(138, 43, 226, 0.3);
      
      backdrop-filter: blur(20px);
      -webkit-backdrop-filter: blur(20px);
      z-index: 2;
      transition: all 0.3s ease;
  }
  
  /* Эффект при наведении */
  .who-card:hover {
      box-shadow: 0px 0px 25px rgba(138, 43, 226, 0.9), 
                  inset 0px 0px 15px rgba(138, 43, 226, 0.4);
      transform: translateY(-5px);
  }
  .who-card-title {
      font-family: 'Montserrat', sans-serif;
      font-weight: 700;
      font-size: 15px; 
      text-align: center;
      color: #FFFFFF;
      margin-top: 0;
      margin-bottom: 8px;
      letter-spacing: 0; 
      white-space: nowrap; 
  }
  .who-card-list {
      list-style: none;
      padding: 0;
      margin: 0;
      padding-left: 15px;
  }
  .who-card-list li {
      display: flex;
      align-items: flex-start;
      gap: 10px;
      font-family: 'Montserrat', sans-serif;
      font-weight: 400;
      font-size: 14px;
      color: #FFFFFF;
      margin-bottom: 8px;
      line-height: 1.3;
  }
  .who-card-list li:last-child {
      margin-bottom: 0;
  }
  .who-card-list li::before {
      content: '';
      flex-shrink: 0;
      width: 4px;
      height: 4px;
      background-color: #FFFFFF;
      border-radius: 50%;
      margin-top: 7px;
  }
  /* ===================================
     ПАРЯЩИЕ ИКОНКИ (точное позиционирование по макету)
  ====================================== */
  .floating-icon {
      position: absolute;
      width: 170px;
      height: auto;
      pointer-events: none;
  }
  .icon-behind { 
      z-index: -1; 
  }
  .icon-front  { 
      z-index: 3; 
  }
 .icon-palette {
     left: 42%; 
     top: -100px; 
     transform: translateX(-50%); 
 }
  .icon-laptop {
      right: -20px; 
      bottom: -82px; 
  }
  .icon-gamepad {
      right: 25px;
      top: -100px;
      transform: rotate(-11.25deg);
  }
  .icon-robot {
      left: 60%; 
      top: -90px; 
      transform: translateX(-50%); 
  }
  .icon-rocket {
      right: -100px; 
      top: 62%;
      transform: translateY(-50%); 
      bottom: auto; 
  }
  @media (max-width: 991px) {
      .who-fits-section {
          padding: 40px 0 !important;
          margin-top: 20px !important;
          margin-bottom: 40px !important;
      }
      .section-title {
          font-size: 28px !important;
          margin-bottom: 30px !important;
      }
      .who-fits-wrapper {
          gap: 16px !important;
      }
      .who-fits-row {
          display: flex !important;
          flex-direction: column !important;
          align-items: center !important;
          gap: 16px !important;
          width: 100% !important;
      }
      .who-card-wrapper {
          width: 100% !important;
          max-width: 380px !important;
          margin: 0 auto !important;
          transform: none !important;
      }
      .card-elevated {
          transform: none !important; 
      }
      .who-card {
          width: 100% !important;
          padding: 10px 30px !important;
          border: 1px solid rgba(153, 0, 255, 0.8) !important;
          box-shadow: 0px 0px 10px rgba(153, 0, 255, 0.5) !important;
      }
      .floating-icon {
          display: none !important;
      }
      .who-card-title {
          font-size: 16px !important;
          margin-bottom: 10px !important;
          margin-top: 3px !important;
      }
      .who-card-list {
          padding-left: 10px !important;
      }
      .who-card-list li {
          font-size: 12px !important;
          line-height: 1.25 !important;
          gap: 8px !important;
          margin-bottom: 7px !important;
      }
      .who-card-list li::before {
          margin-top: 5px !important;
          width: 3px;
          height: 3px;
      }
  }
  @media (max-width: 480px) {
      .custom-container {
          padding: 0 16px;
      }
      .who-card {
          padding: 8px 20px !important;
      }
      .who-card-list li {
          font-size: 11px !important;
      }
  }
  /* ===================================
     Секция "Программа" (Универсальные блоки)
  ====================================== */
  .program-section {
      position: relative;
      width: 100%;
  }
  .program-wrapper {
      display: flex;
      flex-direction: column;
      gap: 24px; 
      width: 100%;
  }
/* ===================================
      Карточки Программы (Фиолетовый неон)
  ====================================== */
  .program-card {
      display: flex;
      flex-direction: column;
      padding: 24px;
      background: linear-gradient(180deg, rgba(255, 255, 255, 0.2) 0%, rgba(6, 0, 56, 0.2) 100%);
      
      /* ИСПРАВЛЕНО: Теперь фиолетовый неон 2px */
      border: 2px solid #8A2BE2 !important; 
      box-shadow: 0px 0px 13px rgba(138, 43, 226, 0.5); 
      
      backdrop-filter: blur(20px);
      -webkit-backdrop-filter: blur(20px);
      border-radius: 24px;
      transition: all 0.3s ease;
  }
  
  /* Эффект прыжка при наведении */
  .program-card:hover {
      transform: translateY(-10px);
      box-shadow: 0px 10px 30px rgba(138, 43, 226, 0.8);
      border-color: #A45EE5; /* Чуть светлее при наведении */
  }
  
  .program-card-header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 30px;
  }
  .program-card-info {
      flex: 1;
      max-width: 700px;
  }
  .program-title {
      font-family: 'Montserrat', sans-serif;
      font-weight: 900;
      font-size: 24px;
      line-height: 1.2;
      color: #FFFFFF;
      margin-top: 0;
      margin-bottom: 10px;
  }
  .program-desc {
      font-family: 'Montserrat', sans-serif;
      font-weight: 400;
      font-size: 18px;
      line-height: 1.2;
      color: #FFFFFF;
      margin: 0;
  }
  .program-img {
      width: 100%;
      max-width: 220px;
      height: auto;
      object-fit: contain;
  }
  /* ===================================
     Скрытый контент (Аккордеон)
  ====================================== */
  .program-card-body {
      max-height: 0;
      overflow: hidden;
      transition: max-height 0.4s ease, margin-top 0.4s ease;
  }
  .program-body-content {
      padding-top: 20px; 
      border-top: 1px solid rgba(255, 255, 255, 0.1);
      margin-top: 20px;
  }
  .program-body-text {
      font-family: 'Montserrat', sans-serif;
      font-weight: 400; 
      font-size: 18px;
      line-height: 1.4;
      color: #FFFFFF;
      margin-bottom: 12px;
  }
  .program-body-list {
      margin-top: 0;
      margin-bottom: 15px;
      padding-left: 20px;
      color: #FFFFFF;
  }
  .program-body-list li {
      font-family: 'Montserrat', sans-serif;
      font-size: 16px;
      line-height: 1.4;
      margin-bottom: 8px;
  }
  /* ===================================
     Кнопка "Подробнее"
  ====================================== */
  .program-toggle-btn {
      display: flex;
      justify-content: center;
      align-items: center;
      gap: 10px;
      width: 100%;
      background: transparent;
      border: none;
      margin-top: 20px;
      cursor: pointer;
      outline: none;
  }
  .toggle-text {
      font-family: 'Montserrat', sans-serif;
      font-weight: 600;
      font-size: 18px;
      color: #FFFFFF;
  }
  .toggle-icon {
      transition: transform 0.3s ease;
  }
  .program-card.active .program-card-body {
      max-height: 1000px; 
  }
  .program-card.active .toggle-icon {
      transform: rotate(180deg); 
  }
  /* ===================================
      Адаптивность для блока "Программа"
      (Текст слева, картинка справа)
   ====================================== */
   @media (max-width: 991px) {
       .program-section .custom-container {
           padding: 0 16px; 
       }
       .program-card {
           padding: 20px !important; 
       }
       .program-card-header {
           flex-direction: row !important; 
           align-items: center !important; 
           justify-content: space-between !important; 
           gap: 15px !important; 
       }
       .program-card-info {
           flex: 1 !important; 
           text-align: left !important; 
       }
       .program-img {
           width: 90px !important; 
           max-width: 90px !important;
           flex-shrink: 0 !important; 
           height: auto !important;
           margin: 0 !important;
       }
       .program-title {
           font-size: 16px !important; 
           margin-top: 0 !important;
           margin-bottom: 6px !important;
           text-align: left !important;
           white-space: normal !important; 
       }
       .program-desc, .program-body-text {
           font-size: 13px !important; 
           line-height: 1.3 !important;
           text-align: left !important;
           margin: 0 !important;
       }
       .program-body-content {
           margin-top: 15px !important;
           padding-top: 15px !important;
       }
   }
   
   @media (max-width: 576px) {
       /* Уменьшаем отступы самого внешнего контейнера */
       .custom-container {
           padding-left: 0px !important;
           padding-right: 0px !important;
       }
       
       /* Делаем саму карточку максимально широкой */
       .contact-card.glass-neon-panel {
           margin-left: -5px; /* Слегка расширяем за границы, если нужно */
           margin-right: -5px;
           padding-left: 15px !important; /* Внутренний отступ от рамки до текста */
           padding-right: 15px !important;
       }
   
       /* Уменьшаем размер заголовка, чтобы он не занимал много строк */
       .contact-card h2 {
           font-size: 22px !important;
       }
   }
   
   /* ===================================
      Секция "Расписание дня" (Timeline)
   ====================================== */
   .schedule-section {
       position: relative;
       width: 100%;
   }
   .timeline {
       position: relative;
       max-width: 800px; 
       margin: 0 auto;
       padding: 20px 0;
   }
   .timeline::after {
       content: '';
       position: absolute;
       width: 2px;
       background-color: rgba(255, 255, 255, 0.3);
       top: 20px;
       bottom: 20px;
       left: 50%;
       transform: translateX(-50%);
       z-index: 1;
   }
   .timeline-item {
       position: relative;
       width: 50%;
       margin-bottom: 50px;
       z-index: 2; 
   }
   .timeline-item:last-child {
       margin-bottom: 0;
   }
   .timeline-item.left {
       left: 0;
       padding-right: 60px; 
       text-align: right; 
   }
   .timeline-item.right {
       left: 50%;
       padding-left: 60px; 
       text-align: left; 
   }
   .timeline-circle {
       position: absolute;
       width: 60px;
       height: 60px;
       background-color: #9900FF; 
       border-radius: 50%;
       top: -5px; 
       display: flex;
       justify-content: center;
       align-items: center;
       font-family: 'Montserrat', sans-serif;
       font-weight: 700;
       font-size: 28px;
       color: #FFFFFF;
       z-index: 3;
   }
   .timeline-item.left .timeline-circle {
       right: -30px; 
   }
   .timeline-item.right .timeline-circle {
       left: -30px; 
   }
   .timeline-content .time {
       font-family: 'Montserrat', sans-serif;
       font-weight: 900;
       font-size: 24px;
       color: #FFFFFF;
       margin-top: 0;
       margin-bottom: 8px;
   }
   .timeline-content .desc {
       font-family: 'Montserrat', sans-serif;
       font-weight: 400;
       font-size: 16px;
       color: rgba(255, 255, 255, 0.9);
       margin: 0;
       line-height: 1.4;
   }
   @media (max-width: 991px) {
       /* ===================================
           Адаптивность "Расписание дня"
        ====================================== */
        .timeline {
            padding-left: 0;
        }
        .timeline::after {
            left: 30px; 
            transform: none; 
        }
        .timeline-item {
            width: 100%;
            margin-bottom: 40px;
        }
        .timeline-item.left, 
        .timeline-item.right {
            left: 0 !important;
            padding-left: 80px !important; 
            padding-right: 0 !important;
            text-align: left !important; 
        }
        .timeline-item.left .timeline-circle,
        .timeline-item.right .timeline-circle {
            left: 0 !important;
            right: auto !important;
        }
        .timeline-content .time {
            font-size: 20px !important;
            margin-bottom: 6px !important;
        }
        .timeline-content .desc {
            font-size: 14px !important;
        }
   }
 /* ===================================
    Секция "Результаты после смены"
 ====================================== */
 .results-section {
     position: relative;
     width: 100%;
 }
 .results-wrapper {
     display: flex;
     flex-direction: column;
     gap: 40px;
     align-items: center;
     padding-top: 50px;
     padding-bottom: 50px;
 }
 .results-row {
     display: flex;
     flex-wrap: wrap;
     justify-content: center;
     width: 100%;
     z-index: 2;
 }
 .res-row-1 {
     gap: 40px;
     margin-right: 100px; 
 }
 .res-row-1 .card-skills {
     transform: translateY(-20px); 
 }
 .res-row-2 {
     gap: 60px;
     margin-left: 150px; 
     margin-top: -20px; 
 }
 .res-row-2 .card-friends {
     transform: translateY(20px); 
 }
 .res-row-3 {
     margin-left: 200px; 
     margin-top: 10px;
 }
 .res-card-wrapper {
     position: relative;
     display: flex;
     z-index: 1;
     width: 380px; 
 }
 /* ===================================
     Карточки результатов (Фиолетовый неон)
 ====================================== */
.res-card {
      width: 100%;
      min-height: 100px; 
      display: flex;
      align-items: center;
      justify-content: center;
      background: linear-gradient(180deg, rgba(255, 255, 255, 0.15) 0%, rgba(6, 0, 56, 0.5) 100%);
      border: 2px solid #0066FF; 
      box-shadow: 0px 0px 15px #0066FF, inset 0px 0px 10px rgba(0, 102, 255, 0.2);
      backdrop-filter: blur(15px);
      -webkit-backdrop-filter: blur(15px);
      border-radius: 20px; 
      padding: 20px 30px;
      z-index: 2;
      transition: all 0.3s ease;
 }
 
/* Эффект прыжка и усиления свечения при наведении */
 .res-card:hover {
     transform: translateY(-10px); /* Прыжок вверх */
     /* Усиливаем внешнюю тень для эффекта отрыва от поверхности */
     box-shadow: 0px 15px 30px rgba(0, 102, 255, 0.6), inset 0px 0px 10px rgba(0, 102, 255, 0.3);
     border-color: #3385FF; /* Делаем рамку чуть ярче при наведении */
 }
 .res-card-title {
     font-family: 'Montserrat', sans-serif;
     font-weight: 800;
     font-size: 20px;
     color: #FFFFFF;
     margin: 0;
     text-align: center;
     line-height: 1.3;
 }
 .res-icon {
     position: absolute;
     pointer-events: none;
 }
 .res-icon-behind { z-index: -1; }
 .res-icon-front  { z-index: 3; }
 .icon-portfolio-img {
     width: 150px;
     top: -60px;
     left: -100px;
 }
 .icon-skills-img {
     width: 150px;
     top: -70px;
     right: -90px;
 }
 .icon-friends-img {
     width: 160px;
     bottom: -30px;
     left: -120px;
 }
 .icon-project-img {
     width: 150px;
     top: -65px;
     right: -110px;
 }
 .icon-impressions-img {
     width: 180px;
     bottom: -50px;
     right: -120px;
 }
 /* ===================================
    Адаптивность для мобильных устройств
 ====================================== */
 @media (max-width: 991px) {
     .results-wrapper {
         gap: 0 !important;
         padding-top: 30px !important;
         padding-bottom: 30px !important;
         display: flex;
         flex-direction: column;
     }
     .results-row {
         display: contents;
     }
     .res-row-1 .card-skills,
     .res-row-2 .card-friends {
         transform: none !important;
     }
     .res-card-wrapper {
         width: 100%;
         max-width: 270px; 
         margin-bottom: 40px;
     }
     .card-skills {
         order: 1;
         align-self: flex-start;
         margin-left: 10px; 
     }
     .card-portfolio {
         order: 2;
         align-self: flex-end;
         margin-right: 10px;
         margin-top: -10px; 
     }
     .card-project {
         order: 3;
         align-self: flex-start;
         margin-left: 10px;
         margin-top: -10px;
     }
     .card-friends {
         order: 4;
         align-self: flex-end;
         margin-right: 10px;
         margin-top: -10px;
     }
     .card-impressions {
         order: 5;
         align-self: flex-start;
         margin-left: 10px;
         margin-top: -10px;
     }
    .res-card {
         min-height: 70px; 
         padding: 12px 20px;
         border-radius: 16px !important;
         border-color: #0066FF !important; 
         box-shadow: 0px 0px 15px #0066FF, inset 0px 0px 10px rgba(0, 102, 255, 0.2) !important;
    }
     .res-card-title {
         font-size: 14px !important; 
     }
     .res-icon {
         display: block !important;
     }
     .icon-skills-img {
         width: 100px !important;
         top: -45px !important;
         right: -75px !important;
     }
     .icon-portfolio-img {
         width: 100px !important;
         top: -30px !important;
         left: -75px !important;
     }
     .icon-project-img {
         width: 90px !important;
         top: -30px !important;
         right: -70px !important;
     }
     .icon-friends-img {
         width: 110px !important;
         bottom: -15px !important;
         left: -85px !important;
     }
     .icon-impressions-img {
         width: 110px !important;
         top: -10px !important;
         bottom: auto !important;
         right: -70px !important;
     }
     .res-card:hover {
         transform: translateY(-5px) !important; /* На мобилках прыжок поменьше, чтобы не перекрывать иконки */
         box-shadow: 0px 5px 15px rgba(0, 102, 255, 0.4) !important;
     }
 }
/* ===================================
    Секция "Пребывание и питание"
 ====================================== */
 .stay-section {
     position: relative;
     width: 100%;
     overflow: hidden; 
 }
 
 .stay-section .section-title {
      margin-bottom: 20px;
  }
  
 .stay-slider-track {
     display: flex;
     gap: 20px; 
     overflow-x: auto;
     scroll-snap-type: x mandatory; 
     scroll-behavior: smooth; 
     padding: 30px 10px; /* Увеличили padding для прыжка */
     scrollbar-width: none; 
     -ms-overflow-style: none; 
 }
 
 .stay-slider-track::-webkit-scrollbar { display: none; }
 
 .stay-card {
     flex: 0 0 auto;
     width: 380px; 
     height: 380px; 
     scroll-snap-align: center; 
     border-radius: 24px;
     box-sizing: border-box;
     border: 2px solid #8A2BE2; /* Фиолетовый неон */
     box-shadow: 0px 0px 13.3px rgba(138, 43, 226, 0.5);
     background: rgba(255, 255, 255, 0.05);
     position: relative;
     overflow: hidden; 
     transition: transform 0.3s ease, box-shadow 0.3s ease;
     cursor: pointer;
 }
 
 /* Эффект прыжка при наведении */
 .stay-card:hover {
     transform: translateY(-10px);
     box-shadow: 0px 10px 25px rgba(138, 43, 226, 0.7);
 }
 
 .stay-card img {
     width: 100%;
     height: 100%;
     object-fit: cover; 
     display: block;
 }
 
 /* Затемнение при наведении */
 .stay-card::after {
     content: '';
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     background-color: rgba(0, 0, 0, 0.4);
     opacity: 0;
     transition: opacity 0.3s ease;
     pointer-events: none;
 }
 
 .stay-card:hover::after { opacity: 1; }
 
 /* Белая лупа */
 .zoom-icon-white {
     position: absolute;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%) scale(0.8);
     opacity: 0;
     transition: all 0.3s ease;
     z-index: 2;
     pointer-events: none;
 }
 
 .stay-card:hover .zoom-icon-white {
     opacity: 1;
     transform: translate(-50%, -50%) scale(1);
 }
 
 .neon-white-glow {
     filter: drop-shadow(0px 0px 5px rgba(255, 255, 255, 0.9))
             drop-shadow(0px 0px 10px rgba(138, 43, 226, 0.5));
 }
 
 /* Управление слайдером */
 .stay-slider-controls {
     display: flex;
     justify-content: center;
     align-items: center;
     gap: 25px; 
     margin-top: 10px;
 }
 
 .stay-btn {
     background: transparent;
     border: none;
     cursor: pointer;
     filter: drop-shadow(0px 0px 10px rgba(255, 255, 255, 0.3)); 
     transition: transform 0.2s ease, filter 0.2s ease;
 }
 
 .stay-btn:hover {
     transform: scale(1.1); 
     filter: drop-shadow(0px 0px 15px rgba(255, 255, 255, 0.8));
 }
 
 /* ===================================
    Адаптивность для мобильных устройств
 ====================================== */
 @media (max-width: 991px) {
     .stay-card {
         width: 280px; 
         height: 320px;
     }
     .stay-slider-track {
         gap: 15px;
         scroll-snap-type: x mandatory; 
     }
     .stay-slider-controls {
         margin-top: 10px;
         gap: 40px; 
     }
 }
 /* ===================================
    Секция "Галерея" (Слайдер)
 ====================================== */
 .gallery-section {
     position: relative;
     width: 100%;
     overflow: hidden;
 }
 
 .gallery-slider-wrapper {
     position: relative;
     margin: 0 auto;
     padding: 10px 0 20px 0;
 }
 
 .gallery-slider-track {
     display: flex;
     gap: 20px;
     overflow-x: auto;
     scroll-snap-type: x mandatory;
     scroll-behavior: smooth;
     padding: 25px 10px; /* Увеличил верхний padding, чтобы было куда "подпрыгивать" */
     scrollbar-width: none;
     -ms-overflow-style: none;
 }
 
 .gallery-slider-track::-webkit-scrollbar {
     display: none;
 }
 
 .gallery-card {
     flex: 0 0 auto;
     width: 380px; 
     height: 380px; 
     scroll-snap-align: center;
     border-radius: 24px;
     box-sizing: border-box;
     
     /* ИСПРАВЛЕНО: Теперь фиолетовый неон вместо синего */
     border: 2px solid #8A2BE2;
     box-shadow: 0px 0px 13.3px rgba(138, 43, 226, 0.5);
     
     background: rgba(255, 255, 255, 0.05);
     position: relative;
     overflow: hidden;
     transition: transform 0.3s ease, box-shadow 0.3s ease;
     cursor: pointer;
 }
 
 /* === ДОБАВЛЕНО: Эффект подпрыгивания при наведении === */
.gallery-card:hover {
     transform: translateY(-10px);
     box-shadow: 0px 10px 25px rgba(138, 43, 226, 0.7);
 }
 
 /* Изображение внутри */
 .gallery-card img {
     width: 100%;
     height: 100%;
     object-fit: cover;
     display: block;
 }
 
 /* --- Декоративные элементы при наведении (иконка и затемнение) --- */
 
 /* 1. Общие настройки для иконки и оверлея (не мешают клику) */
 .zoom-icon-white,
 .gallery-card::after {
     pointer-events: none !important;
 }
 
 /* 2. Легкое затемнение фона (::after) */
 .gallery-card::after {
     content: '';
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     background-color: rgba(0, 0, 0, 0.5); /* Чуть темнее для контраста белой лупы */
     opacity: 0;
     transition: opacity 0.3s ease;
     border-radius: 22px; /* Чуть меньше чем у самой карточки, чтобы не вылезало за border */
 }
 
 .gallery-card:hover::after {
     opacity: 1;
 }
 
 /* 3. Белая иконка лупы */
 .zoom-icon-white {
     position: absolute;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%) scale(0.8);
     opacity: 0;
     transition: transform 0.3s ease, opacity 0.3s ease;
     display: flex;
     justify-content: center;
     align-items: center;
     z-index: 2; /* Поверх затемнения */
 }
 
 .gallery-card:hover .zoom-icon-white {
     opacity: 1;
     transform: translate(-50%, -50%) scale(1);
 }
 
 /* Спецэффекты для SVG (неоновое свечение) */
.neon-white-glow {
     filter: drop-shadow(0px 0px 5px rgba(255, 255, 255, 0.9))
             drop-shadow(0px 0px 10px rgba(138, 43, 226, 0.6)); /* Фиолетовый отсвет */
 }
 
 /* ===================================
    Управление слайдером (Стрелки)
 ====================================== */
 .gallery-slider-controls {
     display: flex;
     justify-content: center;
     align-items: center;
     gap: 25px;
     margin-top: 20px; /* Добавил отступ, чтобы карточки не наезжали при прыжке */
 }
 
 .gallery-btn {
     background: transparent;
     border: none;
     cursor: pointer;
     padding: 10px 15px;
     filter: drop-shadow(0px 0px 10px rgba(255, 255, 255, 0.5));
     transition: transform 0.2s ease, filter 0.2s ease;
     display: flex;
     align-items: center;
     justify-content: center;
 }
 
 .gallery-btn:hover {
     transform: scale(1.1);
     filter: drop-shadow(0px 0px 15px rgba(255, 255, 255, 0.9));
 }
 
 /* ===================================
    Адаптив (Mobile)
 ====================================== */
 @media (max-width: 991px) {
     .gallery-card {
         width: 300px;
         height: 300px;
     }
     .gallery-slider-track {
         gap: 15px;
         padding-top: 20px; /* Чтобы на мобилке тоже было куда прыгать */
     }
     .gallery-slider-controls {
         gap: 40px;
     }
 }
 /* ===================================
    Секция "Безопасность"
 ====================================== */
 .security-section {
     position: relative;
     width: 100%;
 }
 .security-section .section-title {
     margin-top: 50px;
     margin-bottom: 40px;
 }
 .security-wrapper {
     display: flex;
     flex-wrap: wrap; 
     justify-content: center; 
     gap: 20px;
     width: 100%;
 }
/* ===================================
     Карточки Безопасности (Фиолетовый неон)
 ====================================== */
 .security-card {
     width: 210px; 
     background: rgba(10, 5, 30, 0.4); 
     
     /* ИСПРАВЛЕНО: Теперь основной фиолетовый неон */
     border: 2px solid #8A2BE2; 
     box-shadow: 0px 0px 15px rgba(138, 43, 226, 0.4); 
     
     border-radius: 16px;
     padding: 7px; 
     display: flex;
     flex-direction: column;
     align-items: center;
     backdrop-filter: blur(15px);
     -webkit-backdrop-filter: blur(15px);
     
     /* Плавный переход для трансформации и тени */
     transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
 }
 
 /* Эффект прыжка при наведении */
 .security-card:hover {
     transform: translateY(-10px); /* Увеличил до -10px для синхронизации */
     box-shadow: 0px 10px 25px rgba(138, 43, 226, 0.7);
     border-color: #A45EE5; /* Чуть светлее при наведении */
 }
 .security-img-wrap {
     width: 100%;
     height: 260px; 
     border-radius: 10px;
     overflow: hidden;
     margin-bottom: 15px; 
 }
 .security-img-wrap img {
     width: 100%;
     height: 100%;
     object-fit: cover; 
     display: block;
 }
 .security-card-title {
     font-family: 'Montserrat', sans-serif;
     font-weight: 700;
     font-size: 15px;
     color: #FFFFFF;
     text-align: center;
     line-height: 1.3;
     margin: 0 0 10px 0; 
 }
 /* ===================================
    Адаптивность для мобильных устройств (Свайп-слайдер без стрелок)
 ====================================== */
 @media (max-width: 1199px) {
     .security-wrapper {
         flex-wrap: nowrap; 
         justify-content: flex-start; 
         overflow-x: auto; 
         scroll-snap-type: x mandatory; 
         scroll-behavior: smooth;
         padding: 15px 20px; 
         scrollbar-width: none; 
         -ms-overflow-style: none; 
     }
     .security-wrapper::-webkit-scrollbar {
         display: none; 
     }
     .security-card {
         flex: 0 0 auto; 
         width: 260px; 
         max-width: none;
         scroll-snap-align: center; 
     }
 }
 @media (max-width: 767px) {
     .security-card {
         width: 240px; 
     }
     .security-img-wrap {
         height: 230px; 
     }
     .security-card-title {
         font-size: 14px;
     }
 }
 /* ===================================
    Секция "Преподаватели"
 ====================================== */
 .teachers-section {
     position: relative;
     width: 100%;
 }
 .teachers-grid {
     display: flex;
     flex-wrap: wrap;
     justify-content: space-between;
     gap: 30px; 
     width: 100%;
 }
 /* ===================================
     Карточки Преподавателей (Фиолетовый неон)
 ====================================== */
 .teacher-card {
     width: calc(50% - 15px); 
     background: linear-gradient(180deg, rgba(255, 255, 255, 0.08) 0%, rgba(10, 5, 30, 0.6) 100%);
     
     /* ИСПРАВЛЕНО: Теперь фиолетовый неон и обновленное внутреннее свечение */
     border: 2px solid #8A2BE2; 
     box-shadow: 0px 0px 15px rgba(138, 43, 226, 0.4), inset 0px 0px 10px rgba(138, 43, 226, 0.2);
     
     border-radius: 24px;
     padding: 40px 30px;
     display: flex;
     flex-direction: column;
     align-items: center;
     text-align: center;
     backdrop-filter: blur(15px);
     -webkit-backdrop-filter: blur(15px);
    transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1), 
                box-shadow 0.4s cubic-bezier(0.25, 1, 0.5, 1), 
                border-color 0.3s ease;
    
    /* Подсказываем браузеру использовать видеокарту для плавности */
    will-change: transform, box-shadow;
    backface-visibility: hidden;
 }
 
 /* Эффект прыжка при наведении */
 .teacher-card:hover {
     transform: translateY(-10px) !important;
     box-shadow: 0px 15px 30px rgba(138, 43, 226, 0.6), inset 0px 0px 10px rgba(138, 43, 226, 0.3);
     border-color: #A45EE5;
     z-index: 10; /* Чтобы прыгающая карточка была поверх остальных */
 }
 
 /* Обновляем анимацию появления, чтобы она не конфликтовала */
 .teachers-grid.expanded .hidden-teacher {
     display: flex !important;
     animation: fadeInTeacher 0.4s ease-out forwards;
 }

 .teacher-avatar {
     width: 140px;
     height: 140px;
     border-radius: 50%; 
     object-fit: cover; 
     margin-bottom: 20px;
     box-shadow: 0px 4px 15px rgba(0, 0, 0, 0.3); 
 }
 .teacher-name {
     font-family: 'Montserrat', sans-serif;
     font-weight: 800;
     font-size: 22px;
     color: #FFFFFF;
     margin: 0 0 5px 0;
 }
 .teacher-role {
     font-family: 'Montserrat', sans-serif;
     font-weight: 500;
     font-size: 16px;
     color: #FFFFFF;
     margin: 0 0 15px 0;
 }
 .teacher-desc {
     font-family: 'Montserrat', sans-serif;
     font-weight: 400;
     font-size: 14px;
     line-height: 1.5;
     color: rgba(255, 255, 255, 0.8); 
     margin: 0;
     max-width: 450px; 
 }
 .hidden-teacher {
     display: none !important; 
 }
 .teachers-grid.expanded .hidden-teacher {
     display: flex !important; 
     animation: fadeInTeacher 0.5s ease forwards; 
 }
 @keyframes fadeInTeacher {
     from { opacity: 0; transform: translateY(-15px); }
     to { opacity: 1; transform: translateY(0); }
 }
 .teachers-toggle-btn {
     display: inline-flex;
     justify-content: center;
     align-items: center;
     gap: 10px;
     background: transparent;
     border: 1px solid rgba(255, 255, 255, 0.4);
     border-radius: 30px;
     padding: 12px 30px;
     cursor: pointer;
     outline: none;
     transition: all 0.3s ease;
 }
 .teachers-toggle-btn:hover {
     background: rgba(255, 255, 255, 0.1);
     border-color: #FFFFFF;
 }
 .teachers-toggle-btn.active .toggle-icon {
     transform: rotate(180deg); 
 }
/* ===================================
    Адаптивность для мобильных (Строго по 2 карточки в ряд)
 ====================================== */
 @media (max-width: 991px) {
     .teachers-grid {
         flex-direction: row !important; 
         flex-wrap: wrap;
         gap: 10px !important; 
         justify-content: center;
     }
     .teacher-card {
         width: calc(50% - 5px) !important; 
         max-width: none !important;
         padding: 20px 10px !important; 
         border-radius: 16px !important;
     }
     .teacher-avatar {
         width: 80px !important; 
         height: 80px !important;
         margin-bottom: 12px !important;
     }
     .teacher-name {
         font-size: 14px !important; 
     }
     .teacher-role {
         font-size: 11px !important; 
         margin-bottom: 8px !important;
     }
     .teacher-desc {
         font-size: 10px !important; 
         line-height: 1.3 !important;
     }
 }
/* ===================================
    Секция "Цены и даты" (ИЗОЛИРОВАННАЯ И БРОНЕБОЙНАЯ)
 ====================================== */
 .prices-section {
     position: relative;
     width: 100%;
 }
 .prices-section .section-title {
     margin-bottom: 20px;
 }
 .prices-section .prices-slider-wrapper {
     position: relative;
     margin: 0 auto;
     padding: 10px 0 20px 0; 
 }
 .prices-section .prices-slider-track {
     display: flex !important;
     gap: 20px !important;
     overflow-x: auto !important;
     scroll-snap-type: x mandatory;
     scroll-behavior: smooth;
     padding: 15px 10px !important;
     scrollbar-width: none; 
     -ms-overflow-style: none; 
     align-items: stretch !important; 
     height: auto !important;
 }
 .prices-section .prices-slider-track::-webkit-scrollbar {
     display: none;
 }
 
 .prices-section .price-card {
     box-sizing: border-box !important; 
     flex: 0 0 auto !important;
     width: 300px !important;
     height: auto !important; 
     min-height: 440px !important;
     background: linear-gradient(180deg, rgba(10, 5, 30, 0.4) 0%, rgba(10, 5, 30, 0.8) 100%) !important;
     border: 2px solid #8A2BE2 !important; 
     box-shadow: 0px 0px 15px rgba(138, 43, 226, 0.4) !important;
     border-radius: 20px !important;
     padding: 30px 25px !important;
     display: flex !important;
     flex-direction: column !important;
     justify-content: flex-start !important;
     text-align: center !important;
     scroll-snap-align: center !important;
     backdrop-filter: blur(15px);
     -webkit-backdrop-filter: blur(15px);
     transition: transform 0.3s ease, box-shadow 0.3s ease;
     overflow: hidden !important; 
 }
 .prices-section .price-card:hover {
     transform: translateY(-5px);
     box-shadow: 0px 0px 25px rgba(138, 43, 226, 0.7) !important;
 }
 
 /* --- Шапка карточки --- */
 .prices-section .price-header {
     display: block !important;
     opacity: 1 !important;
     visibility: visible !important;
 }
 .prices-section .price-card h3, 
 .prices-section .price-card p {
     margin: 0 !important;
     padding: 0 !important;
     display: block !important;
 }
 .prices-section .price-title {
     font-family: 'Montserrat', sans-serif !important;
     font-weight: 800 !important;
     font-size: 24px !important;
     color: #FFFFFF !important;
     margin-bottom: 5px !important;
     line-height: 1.2 !important;
 }
 .prices-section .price-date {
     font-family: 'Montserrat', sans-serif !important;
     font-weight: 400 !important;
     font-size: 14px !important;
     color: rgba(255, 255, 255, 0.9) !important;
 }
 
 /* --- Разделители --- */
 .prices-section .price-divider {
     width: 100% !important;
     min-height: 1px !important; 
     background: rgba(255, 255, 255, 0.25) !important; 
     margin: 20px 0 !important;
     display: block !important;
 }
 
 /* --- Цены --- */
 .prices-section .price-cost {
     display: flex !important;
     flex-direction: column !important;
     align-items: center !important;
 }
 .prices-section .old-price {
     font-family: 'Montserrat', sans-serif !important;
     font-weight: 500 !important;
     font-size: 16px !important;
     color: rgba(255, 255, 255, 0.5) !important;
     text-decoration: line-through !important;
     margin-bottom: 5px !important;
 }
 .prices-section .new-price {
     font-family: 'Montserrat', sans-serif !important;
     font-weight: 900 !important;
     font-size: 30px !important; 
     color: #FFFFFF !important;
     margin-bottom: 5px !important;
     letter-spacing: -0.5px !important;
     line-height: 1.1 !important;
     white-space: nowrap !important; /* Защита от переноса BYN */
 }
 .prices-section .price-note {
     font-family: 'Montserrat', sans-serif !important;
     font-weight: 500 !important;
     font-size: 14px !important;
     color: #00E5FF !important; 
 }
 
 /* --- Списки --- */
 .prices-section .price-features {
     list-style: none !important;
     padding: 0 !important;
     margin: 0 auto 30px auto !important;
     text-align: left !important;
     width: 100% !important;
     max-width: 220px !important; 
     display: block !important;
 }
 .prices-section .price-features li {
     font-family: 'Montserrat', sans-serif !important;
     font-weight: 400 !important;
     font-size: 14px !important;
     color: rgba(255, 255, 255, 0.9) !important;
     margin-bottom: 10px !important; 
     position: relative !important;
     padding-left: 15px !important; 
     line-height: 1.2 !important;
     display: block !important;
 }
 .prices-section .price-features li::before {
     content: '•' !important;
     position: absolute !important;
     left: 0 !important; 
     top: 0 !important;
     color: #FFFFFF !important;
     font-size: 18px !important;
 }
 .prices-section .price-features li:last-child {
     margin-bottom: 0 !important;
 }
 
 /* --- Кнопка (Прижата к низу) --- */
 .prices-section .btn-price {
     display: inline-flex !important;
     justify-content: center !important;
     align-items: center !important;
     width: 100% !important;
     height: 48px !important;
     background: #FFFFFF !important; 
     color: #1E1F62 !important; 
     border-radius: 30px !important;
     font-family: 'Montserrat', sans-serif !important;
     font-weight: 700 !important;
     font-size: 16px !important;
     text-decoration: none !important;
     margin-top: auto !important; /* Толкает кнопку в самый низ карточки */
     transition: all 0.3s ease !important;
     border: none !important; 
     outline: none !important;
     box-sizing: border-box !important;
 }
 .prices-section .btn-price:hover {
     background: #f0f0f0 !important;
     transform: translateY(-2px) !important;
     box-shadow: 0 5px 15px rgba(255, 255, 255, 0.2) !important;
     color: #1E1F62 !important;
 }
 
 /* --- Стрелки слайдера --- */
 .prices-section .prices-slider-controls {
     display: flex;
     justify-content: center;
     align-items: center;
     gap: 25px;
     margin-top: 30px; 
 }
 .prices-section .prices-btn {
     background: transparent !important;
     border: none !important;
     cursor: pointer;
     padding: 10px 15px;
     filter: drop-shadow(0px 0px 10px rgba(255, 255, 255, 0.4));
     transition: transform 0.2s ease, filter 0.2s ease;
     display: flex;
     align-items: center;
     justify-content: center;
 }
 .prices-section .prices-btn:hover {
     transform: scale(1.1);
     filter: drop-shadow(0px 0px 15px rgba(255, 255, 255, 0.8));
 }
 
 /* ===================================
    Секция "Отзывы" (Слайдер)
 ====================================== */
 .reviews-section {
     position: relative;
     width: 100%;
     overflow: hidden;
 }
 .reviews-section .section-title {
     margin-bottom: 20px;
 }
 .reviews-slider-wrapper {
     position: relative;
     margin: 0 auto;
     padding: 10px 0 20px 0; 
 }
 .reviews-slider-track {
     display: flex;
     gap: 20px; 
     overflow-x: auto;
     scroll-snap-type: x mandatory;
     scroll-behavior: smooth;
     padding: 15px 10px; 
     scrollbar-width: none; 
     -ms-overflow-style: none; 
 }
 .reviews-slider-track::-webkit-scrollbar {
     display: none;
 }
 /* ===================================
    Карточки отзывов (Фиолетовый неон - ИСПРАВЛЕНО)
 ====================================== */
 .reviews-card {
     flex: 0 0 auto;
     width: 380px; /* Увеличили ширину, как на старом сайте (было 320) */
     min-height: 350px;
     scroll-snap-align: center;
     border-radius: 20px;
     box-sizing: border-box;
     background: linear-gradient(180deg, rgba(255, 255, 255, 0.08) 0%, rgba(10, 5, 30, 0.8) 100%);
     border: 2px solid #8A2BE2; 
     box-shadow: 0px 0px 15px rgba(138, 43, 226, 0.4);
     backdrop-filter: blur(15px);
     -webkit-backdrop-filter: blur(15px);
     padding: 25px 25px; /* Выровняли отступы внутри */
     display: flex;
     flex-direction: column;
     z-index: 2;
     transition: all 0.3s ease;
 }
 
 /* Эффект при наведении */
 .reviews-card:hover {
     transform: translateY(-10px); 
     box-shadow: 0px 10px 30px rgba(138, 43, 226, 0.7);
     border-color: #A45EE5; 
 }
 
 /* Сбрасываем глобальные отступы для заголовков и параграфов внутри карточки */
 .reviews-card h4, .reviews-card p {
     margin: 0;
     padding: 0;
 }
 
 .review-header {
     display: flex;
     align-items: center;
     gap: 15px;
     margin-bottom: 12px;
 }
 
 .review-avatar {
     width: 44px;
     height: 44px;
     border-radius: 50%;
     display: flex;
     justify-content: center;
     align-items: center;
     font-family: 'Montserrat', sans-serif;
     font-weight: 700;
     font-size: 16px;
     color: #FFFFFF;
     flex-shrink: 0; /* Не дает аватарке сжиматься */
 }
 
 .bg-review-purple { background-color: #DD00FF; } 
 .bg-review-pink   { background-color: #FF00FF; } 
 .bg-review-blue   { background-color: #0066FF; } 
 
 .review-meta {
     display: flex;
     flex-direction: column;
     justify-content: center;
 }
 
 .review-name {
     font-family: 'Montserrat', sans-serif;
     font-weight: 700;
     font-size: 15px !important; /* Защита от глобальных h4 */
     line-height: 1.2 !important;
     color: #FFFFFF !important;
     margin-bottom: 3px !important;
 }
 
 .review-date {
     font-family: 'Montserrat', sans-serif;
     font-weight: 400;
     font-size: 12px !important; /* Защита от глобальных p */
     color: #9AA0A6 !important; /* Вернули правильный серый цвет */
     line-height: 1.2 !important;
 }
 
 .review-rating {
     font-size: 15px; /* Чуть уменьшили звезды, чтобы было аккуратнее */
     color: #FFD700; 
     letter-spacing: 2px;
     margin-bottom: 12px;
 }
 
 .review-text {
     font-family: 'Montserrat', sans-serif;
     font-weight: 400;
     font-size: 13px !important; 
     line-height: 1.6 !important; /* Улучшает читаемость, как на 1 скрине */
     color: rgba(255, 255, 255, 0.85) !important;
     flex: 1; 
     text-align: left;
 }
 
 .reviews-slider-controls {
     display: flex;
     justify-content: center;
     align-items: center;
     gap: 25px;
     margin-top: 20px;
 }
 
 .reviews-btn {
     background: transparent;
     border: none;
     cursor: pointer;
     padding: 10px 15px;
     filter: drop-shadow(0px 0px 10px rgba(255, 255, 255, 0.5));
     transition: transform 0.2s ease, filter 0.2s ease;
     display: flex;
     align-items: center;
     justify-content: center;
 }
 
 .reviews-btn:hover {
     transform: scale(1.1);
     filter: drop-shadow(0px 0px 15px rgba(255, 255, 255, 0.9));
 }
 
 .reviews-slider-track {
     align-items: start; 
 }
 
 /* Адаптив для телефонов и планшетов */
 @media (max-width: 991px) {
     .reviews-card {
         width: 300px; 
     }
     .reviews-slider-track {
         gap: 15px;
         scroll-snap-type: x mandatory; 
     }
     .reviews-slider-controls {
         gap: 40px; 
     }
 }
 
 /* ===================================
     Секция "FAQ (Часто задаваемые вопросы)"
 ====================================== */
 .faq-section {
     position: relative;
     width: 100%;
 }
 
 .faq-wrapper {
     display: flex;
     flex-direction: column;
     gap: 20px;
     width: 100%;
 }
 
 .faq-item {
     background: linear-gradient(180deg, rgba(255, 255, 255, 0.08) 0%, rgba(10, 5, 30, 0.6) 100%);
     /* ИСПРАВЛЕНО: Фиолетовая обводка и свечение */
     border: 2px solid #8A2BE2; 
     box-shadow: 0px 0px 15px rgba(138, 43, 226, 0.2);
     
     border-radius: 16px;
     backdrop-filter: blur(15px);
     -webkit-backdrop-filter: blur(15px);
     overflow: hidden; 
     transition: all 0.3s ease; /* Плавность для тени и цвета */
 }
 
 .faq-item:hover {
     /* Усиливаем свечение при наведении */
     box-shadow: 0px 0px 20px rgba(138, 43, 226, 0.5); 
     border-color: #A45EE5; /* Чуть более светлый фиолетовый для эффекта "включения" */
 }
 
 .faq-header {
     display: flex;
     justify-content: space-between;
     align-items: center;
     width: 100%;
     background: transparent;
     border: none;
     padding: 24px 30px;
     cursor: pointer;
     outline: none;
     text-align: left;
 }
 
 .faq-header::after,
 .faq-header::before {
     display: none !important;
     content: none !important;
 }
 
 /* На всякий случай блокируем стрелку, если она задана фоном */
 .faq-header {
     background-image: none !important;
 }
 
 .faq-question {
     font-family: 'Montserrat', sans-serif;
     font-weight: 700;
     font-size: 18px;
     color: #FFFFFF;
     padding-right: 20px; 
     line-height: 1.3;
 }
 
 .faq-icon {
     flex-shrink: 0;
     transition: transform 0.3s ease; 
 }
 
 /* Цвет иконки (стрелочки), чтобы она тоже была в тему */
 .faq-icon path {
     stroke: #8A2BE2;
 }
 
 .faq-body {
     max-height: 0;
     overflow: hidden;
     transition: max-height 0.4s ease-out; 
 }
 
 .faq-content {
     padding: 0 30px 24px 30px; 
 }
 
 .faq-content p {
     font-family: 'Montserrat', sans-serif;
     font-weight: 400;
     font-size: 15px;
     line-height: 1.5;
     color: rgba(255, 255, 255, 0.8);
     margin: 0;
 }
 
 .faq-item.active .faq-body {
     max-height: 500px; /* Увеличил, чтобы текст точно не обрезался */
 }
 
 .faq-item.active .faq-icon {
     transform: rotate(180deg); 
 }
 
 /* ===================================
     Адаптивность для мобильных устройств
 ====================================== */
 @media (max-width: 767px) {
     .faq-wrapper {
         gap: 15px;
     }
     .faq-header {
         padding: 20px;
     }
     .faq-question {
         font-size: 15px; 
     }
     .faq-content {
         padding: 0 20px 20px 20px;
     }
     .faq-content p {
         font-size: 13px; 
     }
 }
 
/* --- 1. ОБЩИЕ ХЕЛПЕРЫ И ЭФФЕКТЫ --- */

/* Эффект поднятия любой карточки (универсальный) */
.hover-lift {
    transition: transform 0.3s ease, box-shadow 0.3s ease !important;
}
.hover-lift:hover {
    transform: translateY(-5px) !important;
    box-shadow: 0 1rem 3rem rgba(0,0,0,.12) !important;
}

/* Увеличение элементов */
.transform-scale-105 {
    transform: scale(1.02);
    z-index: 2;
}
@media (max-width: 768px) {
    .transform-scale-105 { transform: none; }
}

/* Цвета текста и фонов (из старого кода, адаптированные под vars.css) */
.text-primary { color: var(--color-primary, #0c284d) !important; }
.text-orange { color: var(--color-accent, #e67e22) !important; }

.bg-primary-soft { background-color: rgba(12, 40, 77, 0.08) !important; }
.bg-orange-light { background-color: rgba(230, 126, 34, 0.1) !important; }

/* Кнопки */
.btn-primary {
    background-color: var(--color-primary, #0c284d);
    border-color: var(--color-primary, #0c284d);
    color: #fff;
}
.btn-warning {
    background-color: var(--color-accent, #e67e22) !important;
    border-color: var(--color-accent, #e67e22) !important;
    color: #fff !important;
}
.btn-warning:hover {
    background-color: #d35400 !important;
    transform: translateY(-2px);
}

/* --- 2. ИНФОБЛОКИ (Статистика, Услуги, FAQ) --- */

/* Карточки статистики и направлений */
.stat-card, .service-card {
    background: #fff;
    border: 1px solid var(--color-gray-200, #f4eee1); /* Ушли от #DEE2E6 */
    transition: all 0.3s ease;
    padding: 20px;
    border-radius: 8px;
}
.stat-card:hover, .service-card:hover {
    border-color: var(--color-accent, #e67e22);
    transform: translateY(-5px);
    box-shadow: 0 10px 25px rgba(0,0,0,0.05);
}

/* Блок с ценами / важная инфа */
.price-box {
    background-color: #fff !important;
    border: 1px solid var(--color-gray-200, #f4eee1);
    border-left: 4px solid var(--color-accent, #e67e22) !important;
    padding: 20px;
    border-radius: 4px;
}

/* --- 3. СЕКЦИЯ ОПЛАТЫ (Стили под скриншот) --- */

.payment-info-wrapper {
    margin-top: 30px;
}

/* Сетка верхних способов */
.payment-methods-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 40px;
    margin-bottom: 50px;
}

.payment-method-card {
    flex: 1 1 350px;
}

.payment-method-header {
    display: flex;
    align-items: center;
    margin-bottom: 12px;
}

/* Круглая иконка как на скрине */
.payment-method-icon {
    width: 52px;
    height: 52px;
    background-color: #f0f5ff !important; /* Нежно-голубой фон */
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 15px;
    flex-shrink: 0;
}

.payment-method-icon svg {
    color: #3b5998; /* Цвет иконки */
}

.payment-method-title {
    font-size: 1.15rem;
    font-weight: 600;
    margin: 0;
    color: #333;
}

.payment-method-desc {
    font-size: 0.95rem;
    color: #555;
    line-height: 1.6;
    margin: 0;
}

/* Логотипы платежных систем */
.payment-systems-section {
    margin-top: 50px;
}

.payment-systems-title {
    font-size: 1.15rem;
    font-weight: 600;
    margin-bottom: 15px;
}

.payment-systems-text {
    font-size: 0.95rem;
    color: #666;
    margin-bottom: 25px;
}

.payment-logos-flex {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    margin-bottom: 35px;
}

.logo-box {
    width: 180px;
    height: 100px; 
    background: #fff;
    border: 1px solid #f0f0f0; 
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 8px; 
    transition: all 0.2s ease;
}

@media (max-width: 576px) {
    .logo-box {
        width: calc(50% - 10px);
        height: 90px;
    }
}

.logo-box:hover {
    border-color: var(--color-gray-200);
    transform: translateY(-3px);
    box-shadow: 0 5px 15px rgba(0,0,0,0.05);
}

.logo-box img {
    width: 100%;          /* Растягиваем на всю ширину блока */
    height: 100%;         /* Растягиваем на всю высоту блока */
    object-fit: contain;  /* Сохраняем пропорции, чтобы не исказить лого */
    padding: 5px;         /* Минимальный зазор, чтобы лого не липло к краям */
    display: block;
}

/* Футер */
.payment-footer-note {
    font-size: 0.9rem;
    color: #666;
    border-top: 1px solid #f0f0f0;
    padding-top: 25px;
    line-height: 1.6;
}

/* --- 4. ГЛОБАЛЬНЫЕ КОРРЕКТИРОВКИ И АДАПТИВНОСТЬ --- */

/* Основной контент страницы */
.main-content {
    background: transparent !important;
    margin-top: 155px; /* Для десктопа */
    margin-bottom: 60px;
    padding-top: 20px;
    padding-bottom: 20px;
    display: flex;
    flex-direction: column;
}

/* Адаптация отступов контента */
@media (max-width: 1024px) {
    .main-content { margin-top: 110px !important; }
}
@media (max-width: 576px) {
    .main-content { margin-top: 90px !important; }
}

/* Принудительное скрытие элементов хедера на 710px */
@media (max-width: 710px) {
    #main-header .hide-710 {
        display: none !important;
    }
    /* Центрируем логотип при скрытии боковых блоков */
    #main-header .main-logo-bar .container {
        justify-content: center !important;
    }
}

/* Исправление цвета всех рамок (убираем #DEE2E6) */
#main-header, 
#main-header .border-bottom, 
#main-header .sticky-nav {
    border-bottom-color: var(--color-gray-200, #f4eee1) !important;
}

/* --- 4. СЕКЦИЯ ДОСТАВКА (Универсальная) --- */

.delivery-info-wrapper {
    margin-top: 30px;
}

/* Используем те же переменные и сетки, что и в Оплате для единства стиля */
.delivery-methods-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
    margin-bottom: 50px;
}

.delivery-card {
    flex: 1 1 300px;
    background: #fff;
    border: 1px solid var(--color-gray-200, #f4eee1);
    border-radius: 12px;
    padding: 25px;
    transition: all 0.3s ease;
}

.delivery-card:hover {
    border-color: var(--color-accent, #e67e22);
    transform: translateY(-5px);
    box-shadow: 0 10px 25px rgba(0,0,0,0.05);
}

.delivery-icon {
    width: 52px;
    height: 52px;
    background-color: rgba(230, 126, 34, 0.1) !important; /* Мягкий оранжевый фон */
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 15px;
}

.delivery-icon i {
    color: var(--color-accent, #e67e22);
    font-size: 1.5rem;
}

.delivery-title {
    font-size: 1.2rem;
    font-weight: 600;
    margin-bottom: 10px;
    color: var(--color-primary, #0c284d);
}

.delivery-text {
    font-size: 0.95rem;
    color: #666;
    line-height: 1.6;
    margin: 0;
}

/* --- 5. СЕКЦИЯ КОНТАКТЫ --- */
.contact-page-wrapper {
 margin-top: 30px;  
}

.contact-card-item {
    background: #fff;
    border: 1px solid var(--color-gray-200, #f4eee1);
    border-radius: 12px;
    padding: 25px;
    text-align: center;
    height: 100%;
}

.contact-icon-circle {
    width: 60px;
    height: 60px;
    background-color: var(--color-primary, #0c284d);
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 15px;
    font-size: 1.5rem;
}

/* Стили для формы обратной связи */
.contact-form-wrapper {
    background: #fff;
    border: 1px solid var(--color-gray-200, #f4eee1);
    border-radius: 12px;
    padding: 30px;
}

.contact-form-wrapper .form-control {
    border: 1px solid var(--color-gray-200, #f4eee1);
    padding: 12px 15px;
    border-radius: 8px;
}

.contact-form-wrapper .form-control:focus {
    border-color: var(--color-accent, #e67e22);
    box-shadow: none;
}

/* Заглушка для карты */
.map-placeholder {
    width: 100%;
    height: 400px;
    background-color: #f8f9fa;
    border: 1px solid var(--color-gray-200, #f4eee1);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #999;
}

/* --- 6. СЕКЦИЯ О КОМПАНИИ --- */

.about-header-box {
    padding: 60px 0;
    background-color: #fff;
    border-radius: 15px;
    border: 1px solid var(--color-gray-200, #f4eee1);
    margin-bottom: 50px;
}

.about-feature-card {
    background: #fff;
    border: 1px solid var(--color-gray-200, #f4eee1);
    border-radius: 12px;
    padding: 30px;
    height: 100%;
    text-align: center;
}

.about-icon {
    font-size: 2.5rem;
    color: var(--color-accent, #e67e22);
    margin-bottom: 20px;
    display: block;
}

/* Ультра-адаптивный размер для цифр и длинных слов */
.about-stat-number {
    font-size: clamp(1.1rem, 4.5vw, 2rem);
    font-weight: 800;
    color: var(--color-primary, #0c284d);
    display: flex;           /* Меняем на flex */
    align-items: center;     /* Центрируем по вертикали */
    justify-content: center; /* Центрируем по горизонтали */
    margin-bottom: 5px;
    min-height: 2.2em;       /* Фиксируем минимальную высоту */
    line-height: 1;
}

/* Фикс для мобильных (от 480px и ниже) */
@media (max-width: 480px) {
    .about-feature-card {
        padding: 15px 10px; /* Высвобождаем еще по 5px с каждой стороны */
    }
    .about-stat-number {
        font-size: 1.2rem !important; 
    }
}

/* Для самых маленьких экранов (до 375px) */
@media (max-width: 375px) {
    .about-stat-number {
        font-size: 1.1rem !important;
    }
}

.about-text-lead {
    font-size: 1.15rem;
    line-height: 1.8;
    color: #555;
}

/* Обертка для символа бесконечности */
/* Специально для бесконечности */
.about-stat-number:has(.infinity-symbol) {
    /* Можно дополнительно скорректировать, если нужно */
}

.infinity-symbol {
    display: inline-block;
    font-size: 1.65em;
    font-weight: 800;
    line-height: 1;
    
    /* Тонкая доводка внутри flex-контейнера */
    transform: translateY(-0.02em);
}

/* ===================================
    КАТАЛОГ: СТИЛЬ МИКРОЗЕЛЕНЬ (2.php)
====================================== */

/* Заголовок раздела: меньше отступы и по центру */
.catalog-main-title {
    font-size: 2rem;
    font-weight: 800;
    color: var(--color-primary, #3E2723);
    text-align: center;
    margin-top: 0;
    margin-bottom: 25px !important;
}

/* Сетка и карточка */
.product-grid-modern { display: grid; grid-template-columns: repeat(2, 1fr); gap: 40px 30px; }
.modern-card { display: flex; flex-direction: column; }
.modern-card-title { font-size: 1.3rem; font-weight: 700; margin-bottom: 20px; text-align: left; }
.modern-card-title a { color: #333; text-decoration: none; transition: 0.2s; }
.modern-card-title a:hover { color: var(--color-accent, #D35400); }

/* БЛОК ФОТОГРАФИИ В КАТАЛОГЕ */
.modern-card-image {
    background-color: #f8f9fa;
    border-radius: 12px; 
    height: 400px;
    /* Убираем display: flex, чтобы он не мешал картинке растягиваться */
    display: block; 
    overflow: hidden; 
    position: relative;
}

/* САМА КАРТИНКА */
.modern-card-image img {
    /* Жестко привязываем картинку к краям блока */
    position: absolute; 
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /* !important заставит браузер точно заполнить весь блок, обрезав лишнее по бокам */
    object-fit: cover !important; 
    object-position: center; 
    transition: transform 0.4s ease;
}

.modern-card:hover .modern-card-image img {
    transform: scale(1.05);
}

/* Футер: разносим цену и кнопки */
.modern-card-footer {
    margin-top: auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 15px;
}

/* Красивая цена */
.modern-price-block { display: flex; align-items: baseline; gap: 4px; }
.price-from { font-size: 0.85rem; color: #999; text-transform: uppercase; font-weight: 600; }
.price-sum { font-size: 1.7rem; font-weight: 800; color: #1a1a1a; letter-spacing: -0.5px; }
.price-currency { font-size: 1.1rem; color: #777; font-weight: 600; }

/* Блок действий справа */
.modern-actions { display: flex; align-items: center; gap: 8px; }

/* Универсальная кнопка (12px) */
.action-btn {
    height: 44px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    transition: 0.2s;
    border: none;
    cursor: pointer;
    text-decoration: none !important;
}

.cart-btn {
    width: 44px;
    background: var(--color-accent, #D35400);
    /* Цвет текста/иконки для самой кнопки */
    color: #ffffff !important; 
    font-size: 1.3rem;
}

/* Принудительно красим саму иконку внутри */
.cart-btn i {
    color: #ffffff !important;
    line-height: 1;
    display: block;
}

.cart-btn:hover {
    background-color: #A04000; /* Затемнение при наведении */
    color: #ffffff !important;
}

.choose-btn {
    padding: 0 20px;
    background: #3E2723;
    color: #fff !important;
    font-size: 0.95rem;
}

.action-btn:hover { transform: translateY(-2px); opacity: 0.9; }

/* Селектор количества (12px) */
.modern-qty {
    display: flex;
    align-items: center;
    background: #f1f1f1;
    border-radius: 12px;
    padding: 4px;
    height: 44px;
}

.modern-qty button {
    width: 30px; border: none; background: none; font-size: 1.2rem; color: #666; cursor: pointer;
}

.qty-input {
    width: 35px; border: none !important; background: transparent !important;
    text-align: center; font-weight: 800; font-size: 1rem;
    -webkit-appearance: none; margin: 0; -moz-appearance: textfield;
}

/* Убираем стрелки совсем, чтобы Плюс не прыгал */
.qty-input::-webkit-outer-spin-button, 
.qty-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

/* ===================================
    КАРТОЧКА ТОВАРА: ГАЛЕРЕЯ И СТИЛИ
====================================== */

/* Главное фото */
.product-gallery-container .main-image-preview {
    background-color: #f8f9fa;
    border-radius: 24px;
    height: 550px;
    display: block; /* Убрали flex, чтобы работало абсолютное позиционирование */
    overflow: hidden;
    position: relative;
}

.main-image-preview a {
    display: block;
    width: 100%;
    height: 100%;
}

.main-image-preview img { 
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /* Если хочешь, чтобы кашпо было видно ЦЕЛИКОМ с полями - ставь contain. 
       Если хочешь без полей во весь блок - ставь cover */
    object-fit: cover !important; 
    object-position: center;
    transition: 0.3s; 
}

/* Слайдер миниатюр (Swiper) */
.productGallerySwiper {
    padding: 5px 0; /* Небольшой отступ, чтобы рамка active не обрезалась */
}

/* Стили миниатюр */
.t-node {
   display: block;
   height: 80px; 
   background: #f8f9fa; 
   border-radius: 12px;
   cursor: pointer; 
   border: 2px solid transparent; 
   overflow: hidden;
   position: relative;
   transition: 0.2s;
}
.t-node img { 
   width: 100%; height: 100%; object-fit: cover; 
   position: absolute; top: 0; left: 0;
}
/* Swiper сам добавляет этот класс активной миниатюре */
.swiper-slide-thumb-active .t-node { 
   border-color: var(--color-accent, #D35400); 
   opacity: 1 !important;
}

/* Красивые круглые стрелки поверх ГЛАВНОГО фото */
.mainProductSwiper .swiper-button-next,
.mainProductSwiper .swiper-button-prev {
   color: var(--color-accent, #D35400);
   background: rgba(255, 255, 255, 0.9);
   width: 44px; height: 44px;
   border-radius: 50%;
   box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}
.mainProductSwiper .swiper-button-next:after,
.mainProductSwiper .swiper-button-prev:after {
   font-size: 18px; font-weight: bold;
}
.mainProductSwiper .swiper-button-next:hover,
.mainProductSwiper .swiper-button-prev:hover {
   background: var(--color-accent, #D35400);
   color: #ffffff;
}

/* Адаптив высоты главного фото */
@media (max-width: 991px) {
    .product-gallery-container .main-image-preview { height: 450px; }
}
@media (max-width: 768px) {
    .product-gallery-container .main-image-preview { height: 350px; }
}

/* Варианты выбора */
.variant-chips { display: flex; flex-wrap: wrap; gap: 10px; }
.v-chip {
    padding: 10px 24px; border: 1.5px solid #eee; background: #fff;
    border-radius: 50px; font-weight: 600; color: #5D4037; transition: 0.2s;
}
.v-chip.active { border-color: #D35400; color: #D35400; background: rgba(211, 84, 0, 0.05); }

/* Таблица характеристик */
.spec-item { font-size: 1.1rem; }
.specs-table-modern .spec-item:last-child { border-bottom: none !important; }

/* ===================================
    АДАПТИВ (ПЛАНШЕТЫ И МОБИЛЬНЫЕ)
====================================== */

/* Планшеты (от 769px до 991px) */
@media (max-width: 991px) {
    .product-grid-modern { gap: 30px 20px; }
    /* Уменьшаем высоту, чтобы при узкой колонке фото не было слишком "вытянутым" */
    .modern-card-image { height: 280px; } 
    .main-image-preview { height: 400px; }
}

/* Мобильные телефоны (до 768px) */
@media (max-width: 768px) {
    /* Переводим в 1 колонку */
    .product-grid-modern { grid-template-columns: 1fr; gap: 30px; }
    /* Увеличиваем высоту обратно, так как карточка теперь на всю ширину экрана */
    .modern-card-image { height: 350px; } 
    .main-image-preview { height: 350px; }
}

/* ===================================
   ФИКС: Убираем отступ, если над контентом промо-баннер
====================================== */

main.has-promo-above .main-content,
main.has-promo-above > .main-content {
    margin-top: 0 !important;
    padding-top: 1rem !important; /* Небольшой воздух вместо 155px */
}

/* Адаптация для мобильных */
@media (max-width: 1024px) {
    main.has-promo-above .main-content {
        margin-top: 0 !important;
    }
}

@media (max-width: 576px) {
    main.has-promo-above .main-content {
        margin-top: 0 !important;
        padding-top: 0.5rem !important;
    }
}