html {
    /* Формула расчета переменной от ширины экрана (резиновая верстка) */
    --index: calc(1vw + 1vh);

}

html {
  scroll-behavior: smooth !important; /* Заставляет все ссылки-якоря на сайте плавно скользить, а не прыгать резко */
}
body {
    margin: 0;
    padding: 0;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    background-color: #f8fafc;
    color: #1e293b;
    -webkit-font-smoothing: antialiased;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

/* Сброс для всех элементов, чтобы убрать влияние на верстку */
*,
*:before,
*:after {
    -webkit-box-sizing: inherit;
    box-sizing: inherit;
}

/* ==========================================================================
   ПОЛНЫЙ, ЕДИНЫЙ КОД ДЛЯ ШАПКИ И МЕГА-МЕНЮ (ПК + МОБИЛЬНАЯ ВЕРСИЯ)
   ========================================================================== */
.advokat-header {
    background-color: #ffffff;
    -webkit-box-shadow: 0 2px 10px rgba(0, 0, 0, 0.03);
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.03);
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    z-index: 1000;
    width: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

/* Главный контейнер шапки */
.advokat-nav-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: calc(var(--index) * 0.7) calc(var(--index) * 1);
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -webkit-box-orient: horizontal !important;
    -webkit-box-direction: normal !important;
    -ms-flex-direction: row !important;
    flex-direction: row !important;
    -webkit-box-align: center !important;
    -ms-flex-align: center !important;
    align-items: center !important;
    -webkit-box-pack: justify !important;
    -ms-flex-pack: justify !important;
    justify-content: space-between !important;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    position: relative;
}

/* Логотип кабинета */
.advokat-logo {
    font-size: calc(var(--index) * 0.85);
    font-weight: 700;
    color: #0f172a;
    text-decoration: none;
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: calc(var(--index) * 0.4);
    white-space: nowrap;
}

.logo-scale {
    font-size: calc(var(--index) * 0.95);
}

.logo-status {
    font-size: calc(var(--index) * 0.55);
    font-weight: 400;
    color: #64748b;
    background: #f1f5f9;
    padding: calc(var(--index) * 0.1) calc(var(--index) * 0.4);
    border-radius: 4px;
}

/* Блок экстренной связи (справа) */
.header-phone-block {
    text-align: right;
    white-space: nowrap;
    display: block !important;
}

.header-phone-link {
    font-size: calc(var(--index) * 0.75);
    font-weight: 700;
    color: #0f172a;
    text-decoration: none;
}

.header-phone-desc {
    display: block;
    font-size: calc(var(--index) * 0.5);
    color: #ef4444;
    font-weight: 600;
    margin-top: 2px;
}

/* Скрываем элементы мобильного бургера по умолчанию на ПК */
.menu-toggle-checkbox {
    display: none !important;
}

.menu-toggle-label {
    display: none !important;
}

/* ==========================================================================
   АДАПТИВНЫЕ ХЛЕБНЫЕ КРОШКИ (СТИЛЬ: ПРЕМИАЛЬНЫЙ МИНИМАЛИЗМ)
   ========================================================================== */

.advokat-breadcrumbs-nav {
  background-color: #ffffff !important; /* Чистый белый фон, как у меню */
  border-bottom: 1px solid #e2e8f0 !important; /* Тонкая разделительная черта */
  width: 100% !important;
  display: block !important;
  -webkit-box-sizing: border-box !important;
  box-sizing: border-box !important;
}

.breadcrumbs-container {
  max-width: 1200px !important;
  width: 100% !important;
  margin: 0 auto !important;
  padding: calc(var(--index) * 0.4) calc(var(--index) * 1.5) !important; /* Компактные резиновые отступы */
  -webkit-box-sizing: border-box !important;
  box-sizing: border-box !important;
}

.advokat-breadcrumbs-list {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display: -webkit-box !important;
  display: -ms-flexbox !important;
  display: flex !important;
  -webkit-box-align: center !important;
  -ms-flex-align: center !important;
  align-items: center !important;
  -ms-flex-wrap: wrap !important;
  flex-wrap: wrap !important; /* На телефонах крошки аккуратно перенесутся, если длинные */
  gap: calc(var(--index) * 0.4) !important;
}

.advokat-breadcrumbs-list li {
  display: -webkit-inline-box !important;
  display: -ms-inline-flexbox !important;
  display: inline-flex !important;
  -webkit-box-align: center !important;
  -ms-flex-align: center !important;
  align-items: center !important;
}

/* Стили ссылок хлебных крошек */
.advokat-breadcrumbs-list a {
  text-decoration: none !important;
  color: #64748b !important; /* Спокойный благородный серый цвет */
  font-size: calc(var(--index) * 0.65) !important; /* Компактный размер шрифта */
  font-weight: 500 !important;
  -webkit-transition: color 0.2s ease !important;
  transition: color 0.2s ease !important;
}

.advokat-breadcrumbs-list a:hover {
  color: #1e293b !important; /* Темнеет при наведении курсора */
}

/* Символ разделителя стрелочки */
.breadcrumbs-separator {
  color: #cbd5e1 !important;
  font-size: calc(var(--index) * 0.6) !important;
  -webkit-user-select: none !important;
  -moz-user-select: none !important;
  -ms-user-select: none !important;
  user-select: none !important;
  pointer-events: none !important;
}

/* Активная (последняя) страница, на которой сейчас находится человек */
.breadcrumbs-current-page {
  color: #0f172a !important; /* Контрастный глубокий цвет */
  font-size: calc(var(--index) * 0.65) !important;
  font-weight: 600 !important;
  white-space: nowrap !important;
}

/* ==========================================================================
   МОБИЛЬНАЯ АДАПТАЦИЯ (Для смартфонов менее 768px)
   ========================================================================== */
@media screen and (max-width: 768px) {
  .breadcrumbs-container {
    padding: calc(var(--index) * 0.5) calc(var(--index) * 1) !important; /* На мобилках выравниваем по левому краю контента */
  }

  .advokat-breadcrumbs-list a,
  .breadcrumbs-current-page {
    font-size: calc(var(--index) * 0.75) !important; /* Немного увеличиваем размер букв для пальцев и читаемости на экранах телефонов */
  }

  .breadcrumbs-separator {
    font-size: calc(var(--index) * 0.7) !important;
  }
}


/* ==========================================================================
   ЧАСТЬ 1. СТИЛИ СТРОГО ДЛЯ БОЛЬШИХ ЭКРАНОВ (МОНИТОРЫ И НОУТБУКИ)
   ========================================================================== */
@media screen and (min-width: 993px) {
    .advokat-menu {
        display: -webkit-box !important;
        display: -ms-flexbox !important;
        display: flex !important;
        -webkit-box-orient: horizontal !important;
        -webkit-box-direction: normal !important;
        -ms-flex-direction: row !important;
        flex-direction: row !important;
        -webkit-box-align: center !important;
        -ms-flex-align: center !important;
        align-items: center !important;
        gap: calc(var(--index) * 1.3);
        margin: 0;
        padding: 0;
    }

    .advokat-menu > a,
    .dropdown-trigger {
        text-decoration: none;
        color: #475569;
        font-size: calc(var(--index) * 0.7);
        font-weight: 500;
        -webkit-transition: all 0.3s ease;
        transition: all 0.3s ease;
        white-space: nowrap;
        padding-bottom: calc(var(--index) * 0.2);
    }

    .advokat-menu > a:hover,
    .dropdown-trigger:hover {
        color: #1e293b;
    }

    .arrow-down {
        font-size: calc(var(--index) * 0.45);
        margin-left: 4px;
        display: inline-block;
        -webkit-transition: -webkit-transform 0.3s ease;
        transition: -webkit-transform 0.3s ease;
        transition: transform 0.3s ease;
        transition: transform 0.3s ease, -webkit-transform 0.3s ease;
    }

    .menu-item-dropdown {
        position: relative;
        display: inline-block;
    }

    /* Окно выпадающего мега-меню на ПК */
    .mega-menu-content {
        display: none;
        /* ЖЕСТКО СКРЫТО на ПК по умолчанию */
        position: absolute;
        top: 100%;
        left: 50%;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%);
        background-color: #ffffff;
        width: calc(var(--index) * 45);
        max-width: 1140px;
        -webkit-box-shadow: 0 20px 40px rgba(15, 23, 42, 0.12);
        box-shadow: 0 20px 40px rgba(15, 23, 42, 0.12);
        border-radius: 8px;
        padding: calc(var(--index) * 1.5);
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        z-index: 9999;
        border: 1px solid #e2e8f0;
    }

    /* Показываем выпадающий блок только при наведении мыши */
    .menu-item-dropdown:hover .mega-menu-content {
        display: block !important;
    }

    .menu-item-dropdown:hover .arrow-down {
        -webkit-transform: rotate(180deg);
        transform: rotate(180deg);
    }

    /* Сетка на ПК строго по 3 колонки в ряд */
    .mega-menu-grid {
        display: grid !important;
        grid-template-columns: repeat(3, 1fr) !important;
        gap: calc(var(--index) * 1.2) calc(var(--index) * 2);
    }

    .mega-menu-col {
        min-width: 0;
    }

    .mega-menu-title {
        display: block;
        font-size: max(15px, calc(var(--index) * 0.75));
        font-weight: 700;
        color: #0f172a;
        border-bottom: 2px solid #f1f5f9;
        padding-bottom: calc(var(--index) * 0.4);
        margin-bottom: calc(var(--index) * 0.6);
        white-space: nowrap;
    }

    .mega-menu-list {
        list-style: none;
        padding: 0;
        margin: 0;
    }

    .mega-menu-list li {
        margin-bottom: calc(var(--index) * 0.45);
        white-space: nowrap;
    }

    .mega-menu-list a {
        text-decoration: none;
        color: #64748b;
        font-size: max(14px, calc(var(--index) * 0.68));
        font-weight: 400;
        display: block;
        -webkit-transition: all 0.2s ease;
        transition: all 0.2s ease;
    }

    .mega-menu-list a:hover {
        color: #1e293b;
        padding-left: 6px;
    }
}


/* ==========================================================================
   ЧАСТЬ 2. СТИЛИ СТРОГО ДЛЯ МОБИЛЬНЫХ И ПЛАНШЕТОВ (Экран меньше 992px, включая 416px)
   ========================================================================== */
@media screen and (max-width: 992px) {

    /* Включаем кнопку бургер-меню */
    .menu-toggle-label {
        display: -webkit-inline-box !important;
        display: -ms-inline-flexbox !important;
        display: inline-flex !important;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        gap: calc(var(--index) * 0.3);
        cursor: pointer;
        background: #f1f5f9;
        padding: calc(var(--index) * 0.4) calc(var(--index) * 0.7);
        border-radius: 6px;
        font-size: 15px;
        font-weight: 600;
        color: #334155;
        z-index: 1001;
    }

    .menu-icon-burger {
        font-size: 18px;
    }

    /* Основное мобильное меню (полностью скрыто через display: none) */
    .advokat-menu {
        display: none !important;
        -webkit-box-orient: vertical !important;
        -webkit-box-direction: normal !important;
        -ms-flex-direction: column !important;
        flex-direction: column !important;
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        background-color: #ffffff;
        -webkit-box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
        box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
        padding: 0;
        gap: 0;
        width: 100%;
        z-index: 1000;

        /* ИСПРАВЛЕНИЕ: Ограничиваем высоту меню и включаем прокрутку пальцем */
        max-height: calc(100vh - 100%);
        /* Высота меню подстраивается под экран за вычетом шапки */
        overflow-y: auto !important;
        /* Включаем вертикальный скролл */
        -webkit-overflow-scrolling: touch;
        /* Делаем прокрутку на смартфонах Apple (iOS) плавной */
    }

    /* Показываем меню только когда чекбокс нажат */
    .menu-toggle-checkbox:checked ~ .advokat-menu {
        display: -webkit-box !important;
        display: -ms-flexbox !important;
        display: flex !important;
    }

    .advokat-menu > a,
    .dropdown-trigger {
        width: 100%;
        padding: 15px 20px;
        font-size: 16px;
        border-bottom: 1px solid #f1f5f9;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        text-align: left;
        display: block;
        text-decoration: none;
        color: #475569;
    }

    /* ВНУТРЕННЕЕ МЕГА-МЕНЮ: Жестко заперто на мобильных, пока не кликнут */
    .mega-menu-content {
        display: none !important;
        position: static !important;
        -webkit-transform: none !important;
        transform: none !important;
        padding: 0 !important;
        -webkit-box-shadow: none !important;
        box-shadow: none !important;
        border: none !important;
        border-radius: 0 !important;
        width: 100%;
        background-color: #f8fafc;
        /* Светлый подслой для вложенных ссылок */
    }

    /* Раскрываем список услуг только при взаимодействии с вкладкой */
    .menu-item-dropdown:hover .mega-menu-content,
    .menu-item-dropdown:focus-within .mega-menu-content {
        display: block !important;
        padding: 10px 20px calc(var(--index) * 1) 20px !important;
    }

    /* Колонки на телефоне перестраиваются в один аккуратный вертикальный ряд */
    .mega-menu-grid {
        display: -webkit-box !important;
        display: -ms-flexbox !important;
        display: flex !important;
        -webkit-box-orient: vertical !important;
        -webkit-box-direction: normal !important;
        -ms-flex-direction: column !important;
        flex-direction: column !important;
        gap: 15px !important;
    }

    .mega-menu-col {
        width: 100% !important;
    }

    .mega-menu-title {
        display: block;
        font-size: 15px;
        font-weight: 700;
        color: #0f172a;
        margin-top: 10px;
        padding-bottom: 5px;
        border-bottom: 1px solid #e2e8f0;
        white-space: normal !important;
    }

    .mega-menu-list {
        list-style: none;
        padding: 0;
        margin: 0;
    }

    .mega-menu-list li {
        white-space: normal !important;
    }

    .mega-menu-list a {
        padding: 10px 0 10px 10px;
        font-size: 15px;
        /* Идеальный размер для прохождения мобильного теста Яндекса */
        color: #64748b;
        text-decoration: none;
        display: block;
        border-bottom: 1px dashed #e2e8f0;
    }

    .mega-menu-list li:last-child a {
        border-bottom: none;
    }
}


/* ==========================================================================
   1. ТИПОГРАФИКА И ЗАГОЛОВКИ (Масштабирование от var(--index))
   ========================================================================== */
h1 {
    font-size: calc(var(--index) * 2.2);
    font-weight: 800;
    color: #0f172a;
    line-height: 1.2;
    margin: 0 0 calc(var(--index) * 0.8) 0;
    letter-spacing: -1px;
}

h2.section-title {
    font-size: calc(var(--index) * 1.8);
    font-weight: 800;
    color: #0f172a;
    text-align: center;
    margin: 0 0 calc(var(--index) * 0.5) 0;
}

/* ==========================================================================
   2. ГЛАВНЫЙ ЭКРАН HERO (Резиновые отступы)
   ========================================================================== */
.hero-lawyer-section {
    background: linear-gradient(135deg, #ffffff 0%, #f1f5f9 100%);
    padding: calc(var(--index) * 3) 0;
    width: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.hero-lawyer-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 calc(var(--index) * 1);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    gap: calc(var(--index) * 2);
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.hero-lawyer-content {
    -webkit-box-flex: 1.2;
    -ms-flex: 1.2;
    flex: 1.2;
}

.hero-lawyer-badge {
    display: inline-block;
    background-color: #e2e8f0;
    color: #0f172a;
    font-size: calc(var(--index) * 0.55);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    padding: calc(var(--index) * 0.2) calc(var(--index) * 0.6);
    border-radius: 50px;
    margin-bottom: calc(var(--index) * 0.8);
    -webkit-animation: fadeInDown 0.6s ease forwards;
    animation: fadeInDown 0.6s ease forwards;
}

.hero-lawyer-subtitle {
    color: #475569;
    font-size: calc(var(--index) * 0.85);
    line-height: 1.6;
    margin-bottom: calc(var(--index) * 1.5);
    -webkit-animation: fadeInDown 0.8s ease forwards;
    animation: fadeInDown 0.8s ease forwards;
}

/* Оформление списков для Яндекса */
.hero-lawyer-features {
    list-style: none;
    padding: 0;
    margin: 0 0 calc(var(--index) * 1.8) 0;
    -webkit-animation: fadeInDown 1s ease forwards;
    animation: fadeInDown 1s ease forwards;
}

.hero-lawyer-features li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: calc(var(--index) * 0.6);
    margin-bottom: calc(var(--index) * 0.6);
    font-size: calc(var(--index) * 0.75);
    color: #334155;
}

/*.feature-icon {
    background: #ffffff;
    width: calc(var(--index) * 1.8);
    height: calc(var(--index) * 1.8);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border-radius: 6px;
    -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
    -ms-flex-negative: 0;
    flex-shrink: 0;
}*/

section.advokat-section, .feature-icon {
  display: -webkit-inline-box !important;
  display: -ms-inline-flexbox !important;
  display: inline-flex !important;
  -webkit-box-align: center !important;
  -ms-flex-align: center !important;
  align-items: center !important;
  -webkit-box-pack: center !important;
  -ms-flex-pack: center !important;
  justify-content: center !important;
  margin-right: calc(var(--index) * 0.4) !important;
  vertical-align: middle !important;
}
/* Резиновый размер для картинок от вашего индекса */
section.advokat-section, .feature-icon svg {
  width: calc(var(--index) * 0.9) !important;
  height: calc(var(--index) * 0.9) !important;
}


/* Кнопки первого экрана */
.hero-lawyer-actions {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: calc(var(--index) * 0.8);
    -webkit-animation: fadeInDown 1.2s ease forwards;
    animation: fadeInDown 1.2s ease forwards;
}

.btn-lawyer-primary,
.btn-lawyer-secondary {
    text-decoration: none;
    padding: calc(var(--index) * 0.7) calc(var(--index) * 1.4);
    font-size: calc(var(--index) * 0.75);
    font-weight: 600;
    border-radius: 6px;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
    text-align: center;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.btn-lawyer-primary {
    background-color: #1e293b;
    color: #ffffff !important;
    -webkit-box-shadow: 0 calc(var(--index) * 0.2) calc(var(--index) * 0.6) rgba(30, 41, 59, 0.15);
    box-shadow: 0 calc(var(--index) * 0.2) calc(var(--index) * 0.6) rgba(30, 41, 59, 0.15);
}

.btn-lawyer-primary:hover {
    background-color: #0f172a;
    -webkit-transform: translateY(-2px);
    transform: translateY(-2px);
}

.btn-lawyer-secondary {
    border: 2px solid #cbd5e1;
    color: #334155 !important;
}

.btn-lawyer-secondary:hover {
    border-color: #1e293b;
    color: #1e293b !important;
}

.hero-lawyer-image-wrap {
    -webkit-box-flex: 0.8;
    -ms-flex: 0.8;
    flex: 0.8;
    -webkit-animation: filterIn 1.4s ease forwards;
    animation: filterIn 1.4s ease forwards;
}

.hero-lawyer-img {
    width: 100%;
    max-width: calc(var(--index) * 20);
    height: auto;
    border-radius: 10px;
    -webkit-box-shadow: 0 calc(var(--index) * 0.8) calc(var(--index) * 1.8) rgba(0, 0, 0, 0.07);
    box-shadow: 0 calc(var(--index) * 0.8) calc(var(--index) * 1.8) rgba(0, 0, 0, 0.07);
}

/* ==========================================================================
   3. БЛОК ЦЕН И ТАБЛИЦА (Резиновая верстка)
   ========================================================================== */
.advokat-prices-section {
    padding: calc(var(--index) * 4) 0;
    background-color: #ffffff;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.section-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 calc(var(--index) * 1);
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.section-desc {
    text-align: center;
    color: #64748b;
    font-size: calc(var(--index) * 0.8);
    max-width: calc(var(--index) * 30);
    margin: 0 auto calc(var(--index) * 2) auto;
}

.table-responsive {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.prices-table {
    width: 100%;
    border-collapse: collapse;
    text-align: left;
    min-width: 600px;
}

.prices-table th {
    background-color: #f8fafc;
    color: #475569;
    padding: calc(var(--index) * 0.8) calc(var(--index) * 1);
    font-size: calc(var(--index) * 0.7);
    font-weight: 600;
    border-bottom: 2px solid #e2e8f0;
}

/* Обычные ячейки таблицы */
.prices-table td {
    padding: calc(var(--index) * 1);
    border-bottom: 1px solid #edf2f7;
    font-size: max(14px, calc(var(--index) * 0.75));
    /* Минимум 14px */
    vertical-align: middle;
}

.table-meta {
    font-size: max(13px, calc(var(--index) * 0.65));
    /* По закону Яндекса сноски допускаются 12-13px, но лучше перестраховаться */
    color: #64748b;
}

/* Цена */
.price-value {
    font-weight: 700;
    color: #0f172a;
    white-space: nowrap;
    font-size: max(15px, calc(var(--index) * 0.8));
    /* Крупная цена, минимум 15px */
}

/* ==========================================================================
   4. ФОРМА ОБРАТНОЙ СВЯЗИ
   ========================================================================== */
.advokat-form-section {
    padding: calc(var(--index) * 4) 0;
    background-color: #f1f5f9;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 100%;
}

.form-section-container {
    max-width: 1100px;
    margin: 0 auto;
    padding: calc(var(--index) * 2);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: calc(var(--index) * 2.5);
    background: #ffffff;
    border-radius: 12px;
    -webkit-box-shadow: 0 calc(var(--index) * 0.5) calc(var(--index) * 1.5) rgba(0, 0, 0, 0.02);
    box-shadow: 0 calc(var(--index) * 0.5) calc(var(--index) * 1.5) rgba(0, 0, 0, 0.02);
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.form-info-side {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.form-info-side h2 {
    font-size: calc(var(--index) * 1.5);
    font-weight: 800;
    color: #0f172a;
    margin-top: 0;
    margin-bottom: calc(var(--index) * 0.6);
}

.form-info-text {
    color: #475569;
    font-size: calc(var(--index) * 0.75);
    line-height: 1.6;
}

.urgency-notice {
    margin-top: calc(var(--index) * 1);
    background-color: #fff1f2;
    border-left: 4px solid #f43f5e;
    padding: calc(var(--index) * 0.8);
    color: #9f1239;
    font-size: calc(var(--index) * 0.7);
    line-height: 1.5;
    border-radius: 4px;
}

.form-fields-side {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.law-pure-form .form-group {
    margin-bottom: calc(var(--index) * 0.8);
}

.law-pure-form input,
.law-pure-form textarea {
    width: 100%;
    padding: calc(var(--index) * 0.6) calc(var(--index) * 0.8);
    border: 1px solid #cbd5e1;
    border-radius: 6px;
    font-size: max(15px, calc(var(--index) * 0.75));
    /* Жестко фиксируем минимум 15px для инпутов */
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    background-color: #f8fafc;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.law-pure-form input:focus,
.law-pure-form textarea:focus {
    outline: none;
    border-color: #1e293b;
    background-color: #ffffff;
    -webkit-box-shadow: 0 0 0 3px rgba(30, 41, 59, 0.05);
    box-shadow: 0 0 0 3px rgba(30, 41, 59, 0.05);
}

.btn-form-submit {
    width: 100%;
    background-color: #1e293b;
    color: #ffffff;
    border: none;
    padding: calc(var(--index) * 0.7);
    font-size: calc(var(--index) * 0.75);
    font-weight: 600;
    border-radius: 6px;
    cursor: pointer;
    -webkit-transition: background 0.3s ease;
    transition: background 0.3s ease;
}

.btn-form-submit:hover {
    background-color: #0f172a;
}

/* ==========================================================================
   5. ВНЕДРЕННЫЕ СТИЛИ ПРЕМИАЛЬНОГО ФУТЕРА
   ========================================================================== */
.advokat-footer {
    background-color: #0f172a;
    /* Глубокий темно-синий/графитовый фон */
    color: #94a3b8;
    padding: calc(var(--index) * 3) 0 calc(var(--index) * 1.5) 0;
    width: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.footer-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 calc(var(--index) * 1) calc(var(--index) * 2) calc(var(--index) * 1);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    gap: calc(var(--index) * 2);
    border-bottom: 1px solid #1e293b;
    /* Тонкая строгая разделительная линия */
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.footer-col-about {
    -webkit-box-flex: 1.4;
    -ms-flex: 1.4;
    flex: 1.4;
}

.footer-logo {
    font-size: calc(var(--index) * 1.1);
    font-weight: 700;
    color: #ffffff;
    display: block;
    margin-bottom: calc(var(--index) * 0.8);
}

.footer-legal-text {
    font-size: calc(var(--index) * 0.65);
    line-height: 1.6;
    color: #64748b;
    margin: 0;
}

.footer-col-links,
.footer-col-contacts {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.advokat-footer h4 {
    color: #ffffff;
    margin-top: 0;
    margin-bottom: calc(var(--index) * 0.8);
    font-size: calc(var(--index) * 0.8);
    font-weight: 600;
}

.footer-col-links a {
    display: block;
    color: #94a3b8;
    text-decoration: none;
    margin-bottom: calc(var(--index) * 0.5);
    font-size: calc(var(--index) * 0.7);
    -webkit-transition: color 0.3s ease;
    transition: color 0.3s ease;
}

.footer-col-links a:hover {
    color: #ffffff;
    /* Мягкое белое подсвечивание при наведении */
}

.footer-col-contacts p {
    font-size: calc(var(--index) * 0.7);
    margin: 0 0 calc(var(--index) * 0.5) 0;
    line-height: 1.5;
}

.footer-col-contacts a {
    color: #ffffff;
    text-decoration: none;
    font-weight: 700;
    -webkit-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease;
}

.footer-col-contacts a:hover {
    opacity: 0.8;
}

/* Нижняя техническая линия подвала */
.footer-bottom {
    max-width: 1200px;
    margin: 0 auto;
    padding: calc(var(--index) * 1) calc(var(--index) * 1) 0 calc(var(--index) * 1);
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.footer-bottom-content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    font-size: max(13px, calc(var(--index) * 0.55));
    /* Больше никаких скрытых текстов для робота */
    color: #64748b;
}

.footer-bottom-content p {
    margin: 0;
}

/* ==========================================================================
   6. КОМПЬЮТЕРНАЯ ВЕРСИЯ КНОПКИ (В нижнем правом углу)
   ========================================================================== */
.phone-btn-container {
    position: fixed;
    bottom: calc(var(--index) * 1.5);
    right: calc(var(--index) * 1.5);
    z-index: 99999;
    margin: 0 !important;
    padding: 0 !important;
    width: calc(var(--index) * 14);
}

.advokat-phone-btn {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;


    background-color: #1e293b;
    color: #ffffff !important;
    text-decoration: none !important;
    padding: calc(var(--index) * 0.6) calc(var(--index) * 1.1);
    font-size: calc(var(--index) * 0.7);
    font-weight: 600;
    border-radius: 50px;
    -webkit-box-shadow: 0 calc(var(--index) * 0.5) calc(var(--index) * 1.3) rgba(26, 54, 93, 0.25);
    box-shadow: 0 calc(var(--index) * 0.5) calc(var(--index) * 1.3) rgba(26, 54, 93, 0.25);
    -webkit-transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
    transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
    width: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    background-color: #e1dfdd;
}

.advokat-phone-btn:hover {
    background-color: #0f172a;
    -webkit-transform: translateY(-4px);
    transform: translateY(-4px);
    -webkit-box-shadow: 0 calc(var(--index) * 0.8) calc(var(--index) * 1.8) rgba(15, 23, 42, 0.4);
    box-shadow: 0 calc(var(--index) * 0.8) calc(var(--index) * 1.8) rgba(15, 23, 42, 0.4);
}

.phone-icon {
    width: calc(var(--index) * 0.8);
    height: calc(var(--index) * 0.8);
    fill: #ffffff;
    margin-right: calc(var(--index) * 0.4);
    -webkit-animation: phone-shake 2.5s infinite ease-in-out;
    animation: phone-shake 2.5s infinite ease-in-out;
}

/* Анимации трубки */
@-webkit-keyframes phone-shake {

    0%,
    100% {
        -webkit-transform: rotate(0);
        transform: rotate(0);
    }

    10%,
    30% {
        -webkit-transform: rotate(-10deg);
        transform: rotate(-10deg);
    }

    20%,
    40% {
        -webkit-transform: rotate(10deg);
        transform: rotate(10deg);
    }

    50% {
        -webkit-transform: rotate(0);
        transform: rotate(0);
    }
}
@keyframes phone-shake {

    0%,
    100% {
        -webkit-transform: rotate(0);
        transform: rotate(0);
    }

    10%,
    30% {
        -webkit-transform: rotate(-10deg);
        transform: rotate(-10deg);
    }

    20%,
    40% {
        -webkit-transform: rotate(10deg);
        transform: rotate(10deg);
    }

    50% {
        -webkit-transform: rotate(0);
        transform: rotate(0);
    }
}

@-webkit-keyframes fadeInDown {
    from {
        opacity: 0;
        -webkit-transform: translateY(-10px);
        transform: translateY(-10px);
    }

    to {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}

@keyframes fadeInDown {
    from {
        opacity: 0;
        -webkit-transform: translateY(-10px);
        transform: translateY(-10px);
    }

    to {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}

@-webkit-keyframes filterIn {
    from {
        opacity: 0;
        -webkit-transform: scale(0.97);
        transform: scale(0.97);
    }

    to {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@keyframes filterIn {
    from {
        opacity: 0;
        -webkit-transform: scale(0.97);
        transform: scale(0.97);
    }

    to {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

/* ==========================================================================
7. АДАПТИВНОСТЬ ПОД ПЛАНШЕТЫ И ТЕЛЕФОНЫ (МЕДИА-ЗАПРОСЫ)
========================================================================== */
@media screen and (max-width: 1024px) {
    .hero-lawyer-container {
        gap: calc(var(--index) * 1.5);
    }

    .form-section-container {
        gap: calc(var(--index) * 1.5);
    }

    .footer-container {
        gap: calc(var(--index) * 1.5);
    }
}

@media screen and (max-width: 768px) {
    .hero-lawyer-container {
        -webkit-box-orient: vertical;
        -webkit-box-direction: reverse;
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse;
        text-align: center;
        gap: calc(var(--index) * 1.5);
    }

    .hero-lawyer-image-wrap {
        max-width: calc(var(--index) * 12);
    }

    .hero-lawyer-features {
        display: inline-block;
        text-align: left;
        margin: 0 auto calc(var(--index) * 1.2) auto;
    }

    .hero-lawyer-actions {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        gap: calc(var(--index) * 0.5);
        width: 100%;
    }

    .btn-lawyer-primary,
    .btn-lawyer-secondary {
        width: 100%;
    }

    .form-section-container {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        gap: calc(var(--index) * 1.5);
        padding: calc(var(--index) * 1.2);
    }

    /* Перестройка футера на мобильных устройствах в одну вертикальную колонку */
    .footer-container {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        gap: calc(var(--index) * 1.8);
        text-align: center;
    }

    .footer-col-about {
        max-width: 100%;
    }

    .footer-bottom-content {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        gap: calc(var(--index) * 0.5);
        text-align: center;
    }

    /* МОБИЛЬНАЯ ВЕРСИЯ КНОПКИ: 70% ширины по центру, парящая тень */
    .phone-btn-container {
    position: fixed;
    bottom: calc(var(--index) * 1);
    left: 50% !important; /* Центрируем по экрану принудительно */
    -webkit-transform: translateX(-50%) !important;
    transform: translateX(-50%) !important;
    width: 100% !important;
    max-width: 100% !important;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
  }

    .advokat-phone-btn {
        width: 70%;
        padding: calc(var(--index) * 0.7) calc(var(--index) * 1);
        font-size: calc(var(--index) * 0.75);
        border-radius: 50px;
        -webkit-box-shadow: 0 calc(var(--index) * 0.8) calc(var(--index) * 2) rgba(30, 41, 59, 0.4);
        box-shadow: 0 calc(var(--index) * 0.8) calc(var(--index) * 2) rgba(30, 41, 59, 0.4);
    }
}

    section.advokat-text-section {
        background-color: #ffffff !important;
        width: 100% !important;
        display: block !important;
        -webkit-box-sizing: border-box !important;
        box-sizing: border-box !important;
    }


    section.advokat-text-section .lawyer-expert-text {
        display: block !important;
        max-width: 1200px !important;
        width: 100% !important;
        margin: 0 auto !important;
        /* Центрирование на ПК */
        padding: calc(var(--index) * 2) calc(var(--index) * 1.5) calc(var(--index) * 3) calc(var(--index) * 1.5) !important;
        -webkit-box-sizing: border-box !important;
        box-sizing: border-box !important;
    }

    section.advokat-text-section .lawyer-expert-text h2 {
        font-size: calc(var(--index) * 1.5) !important;
        font-weight: 800 !important;
        color: #0f172a !important;
        margin-top: 0 !important;
        margin-bottom: calc(var(--index) * 1) !important;
        text-align: left !important;
    }

    section.advokat-text-section .lawyer-expert-text p {
        font-size: calc(var(--index) * 0.75) !important;
        line-height: 1.7 !important;
        color: #334155 !important;
        margin-top: 0 !important;
        margin-bottom: calc(var(--index) * 1) !important;
        text-align: justify !important;
    }

    /* ==========================================================================
   ИЗОЛИРОВАННЫЙ БЛОК ДЛЯ МОБИЛЬНЫХ (Строго в конце)
   ========================================================================== */
    @media screen and (max-width: 768px) {
        section.advokat-text-section .lawyer-expert-text h2 {
            text-align: center !important;
        }

        section.advokat-text-section .lawyer-expert-text p {
            text-align: left !important;
            font-size: calc(var(--index) * 0.85) !important;
        }
    }
/* СТИЛИ ДЛЯ ПОП-АПА В ЮРИДИЧЕСКОМ СТИЛЕ */
.advokat-popup-overlay {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background-color: rgba(15, 23, 42, 0.6) !important; /* Темная подложка */
  -webkit-backdrop-filter: blur(8px) !important;
  backdrop-filter: blur(8px) !important; /* Элегантное размытие сайта на фоне */
  z-index: 100000 !important; /* Поверх парящей кнопки */
  display: -webkit-box !important;
  display: -ms-flexbox !important;
  display: flex !important;
  -webkit-box-align: center !important;
  -ms-flex-align: center !important;
  align-items: center !important;
  -webkit-box-pack: center !important;
  -ms-flex-pack: center !important;
  justify-content: center !important;
  opacity: 0;
  pointer-events: none;
  -webkit-transition: opacity 0.3s ease !important;
  transition: opacity 0.3s ease !important;
}

/* Класс, который активируется скриптом при клике */
.advokat-popup-overlay.active {
  opacity: 1 !important;
  pointer-events: auto !important;
}

.advokat-popup-window {
  background: #ffffff !important;
  width: 100% !important;
  max-width: calc(var(--index) * 16) !important; /* Резиновая ширина */
  padding: calc(var(--index) * 1.5) !important;
  border-radius: 8px !important;
  -webkit-box-shadow: 0 20px 40px rgba(0,0,0,0.15) !important;
  box-shadow: 0 20px 40px rgba(0,0,0,0.15) !important;
  position: relative !important;
  -webkit-transform: scale(0.9);
  transform: scale(0.9);
  -webkit-transition: -webkit-transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1) !important;
  transition: -webkit-transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1) !important;
  transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1) !important;
  transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), -webkit-transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1) !important; /* Упругая анимация */
  -webkit-box-sizing: border-box !important;
  box-sizing: border-box !important;
}

.advokat-popup-overlay.active .advokat-popup-window {
  -webkit-transform: scale(1) !important;
  transform: scale(1) !important;
}

/* Кнопка закрытия (крестик) */
.advokat-popup-close {
  position: absolute !important;
  top: calc(var(--index) * 0.4) !important;
  right: calc(var(--index) * 0.6) !important;
  background: transparent !important;
  border: none !important;
  font-size: calc(var(--index) * 1.3) !important;
  color: #64748b !important;
  cursor: pointer !important;
  line-height: 1 !important;
}
.advokat-popup-close:hover { color: #0f172a !important; }

.advokat-popup-header {
  text-align: center !important;
  margin-bottom: calc(var(--index) * 1) !important;
}

.advokat-popup-header h3 {
  font-size: calc(var(--index) * 1.2) !important;
  font-weight: 800 !important;
  color: #0f172a !important;
  margin: 0 0 calc(var(--index) * 0.4) 0 !important;
}

.advokat-popup-header p {
  font-size: calc(var(--index) * 0.65) !important;
  line-height: 1.5 !important;
  color: #475569 !important;
  margin: 0 !important;
}

/* Плашка успешной отправки */
.tg-success-message {
  background-color: #f0fdf4 !important;
  border: 1px solid #bbf7d0 !important;
  color: #166534 !important;
  padding: calc(var(--index) * 0.8) !important;
  border-radius: 6px !important;
  font-size: calc(var(--index) * 0.7) !important;
  font-weight: 600 !important;
  text-align: center !important;
  margin-top: calc(var(--index) * 0.5) !important;
}

/* Мобильная адаптация */
@media screen and (max-width: 768px) {
  .advokat-popup-window {
    width: 90% !important;
    padding: calc(var(--index) * 1.2) !important;
  }
}
/* СТИЛИ ПАРАЛЛАКСНОГО ПОП-АПА */
.advokat-popup-overlay {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background-color: rgba(15, 23, 42, 0.6) !important;
  -webkit-backdrop-filter: blur(8px) !important;
  backdrop-filter: blur(8px) !important; /* Размытие заднего фона сайта */
  z-index: 100000 !important;
  display: -webkit-box !important;
  display: -ms-flexbox !important;
  display: flex !important;
  -webkit-box-align: center !important;
  -ms-flex-align: center !important;
  align-items: center !important;
  -webkit-box-pack: center !important;
  -ms-flex-pack: center !important;
  justify-content: center !important;
  opacity: 0;
  pointer-events: none;
  -webkit-transition: opacity 0.3s ease !important;
  transition: opacity 0.3s ease !important;
}

.advokat-popup-overlay.active {
  opacity: 1 !important;
  pointer-events: auto !important;
}

.advokat-popup-window {
  background: #ffffff !important;
  width: 100% !important;
  max-width: calc(var(--index) * 16) !important; /* Резиновый размер */
  padding: calc(var(--index) * 1.5) !important;
  border-radius: 8px !important;
  -webkit-box-shadow: 0 20px 40px rgba(0,0,0,0.15) !important;
  box-shadow: 0 20px 40px rgba(0,0,0,0.15) !important;
  position: relative !important;
  -webkit-transform: scale(0.9);
  transform: scale(0.9);
  -webkit-transition: -webkit-transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1) !important;
  transition: -webkit-transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1) !important;
  transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1) !important;
  transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), -webkit-transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1) !important;
  -webkit-box-sizing: border-box !important;
  box-sizing: border-box !important;
}

.advokat-popup-overlay.active .advokat-popup-window {
  -webkit-transform: scale(1) !important;
  transform: scale(1) !important;
}

.advokat-popup-close {
  position: absolute !important;
  top: calc(var(--index) * 0.4) !important;
  right: calc(var(--index) * 0.6) !important;
  background: transparent !important;
  border: none !important;
  font-size: calc(var(--index) * 1.3) !important;
  color: #64748b !important;
  cursor: pointer !important;
  line-height: 1 !important;
}

.advokat-popup-header {
  text-align: center !important;
  margin-bottom: calc(var(--index) * 1) !important;
}

.advokat-popup-header h3 {
  font-size: calc(var(--index) * 1.2) !important;
  font-weight: 800 !important;
  color: #0f172a !important;
  margin: 0 0 calc(var(--index) * 0.4) 0 !important;
}

.advokat-popup-header p {
  font-size: calc(var(--index) * 0.65) !important;
  line-height: 1.5 !important;
  color: #475569 !important;
  margin: 0 !important;
}

.tg-success-message {
  background-color: #f0fdf4 !important;
  border: 1px solid #bbf7d0 !important;
  color: #166534 !important;
  padding: calc(var(--index) * 0.8) !important;
  border-radius: 6px !important;
  font-size: calc(var(--index) * 0.7) !important;
  font-weight: 600 !important;
  text-align: center !important;
  margin-top: calc(var(--index) * 0.5) !important;
}

@media screen and (max-width: 768px) {
  .advokat-popup-window {
    width: 90% !important;
    padding: calc(var(--index) * 1.2) !important;
  }
}
/* КНОПКА ЧАТА */
.advokat-chat-badge {
  position: fixed !important;
  bottom: calc(var(--index) * 5) !important; /* Ставим чуть выше нашей основной кнопки звонка */
  right: calc(var(--index) * 1.5) !important;
  width: calc(var(--index) * 2.5) !important;
  height: calc(var(--index) * 2.5) !important;
  background-color: #1e293b !important; /* Цвет кнопок */
  border-radius: 50% !important;
  display: -webkit-box !important;
  display: -ms-flexbox !important;
  display: flex !important;
  -webkit-box-align: center !important;
  -ms-flex-align: center !important;
  align-items: center !important;
  -webkit-box-pack: center !important;
  -ms-flex-pack: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  z-index: 99998 !important;
  -webkit-box-shadow: 0 8px 24px rgba(30, 41, 59, 0.3) !important;
  box-shadow: 0 8px 24px rgba(30, 41, 59, 0.3) !important;
  -webkit-transition: all 0.3s ease !important;
  transition: all 0.3s ease !important;
}

.advokat-chat-badge svg {
  width: 50% !important;
  height: 50% !important;
}

/* Зеленая точка "В сети" */
.chat-online-dot {
  position: absolute !important;
  top: 2px !important;
  right: 2px !important;
  width: 10px !important;
  height: 10px !important;
  background-color: #22c55e !important;
  border: 2px solid #1e293b !important;
  border-radius: 50% !important;
}

/* Эффект пульсации вокруг кнопки */
.chat-pulse-ring {
  position: absolute;
  width: 100%;
  height: 100%;
  border: 2px solid #1e293b;
  border-radius: 50%;
  -webkit-animation: chat-pulse 2s infinite;
  animation: chat-pulse 2s infinite;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

@-webkit-keyframes chat-pulse {
  0% { -webkit-transform: scale(1); transform: scale(1); opacity: 0.5; }
  100% { -webkit-transform: scale(1.4); transform: scale(1.4); opacity: 0; }
}

@keyframes chat-pulse {
  0% { -webkit-transform: scale(1); transform: scale(1); opacity: 0.5; }
  100% { -webkit-transform: scale(1.4); transform: scale(1.4); opacity: 0; }
}

/* ОКНО ЧАТА */
.advokat-chat-window {
  position: fixed !important;
  bottom: calc(var(--index) * 8) !important;
  right: calc(var(--index) * 1.5) !important;
  width: calc(var(--index) * 15) !important;
  background: #ffffff !important;
  border-radius: 10px !important;
  -webkit-box-shadow: 0 12px 40px rgba(0,0,0,0.15) !important;
  box-shadow: 0 12px 40px rgba(0,0,0,0.15) !important;
  z-index: 99999 !important;
  display: -webkit-box !important;
  display: -ms-flexbox !important;
  display: flex !important;
  -webkit-box-orient: vertical !important;
  -webkit-box-direction: normal !important;
  -ms-flex-direction: column !important;
  flex-direction: column !important;
  overflow: hidden !important;
  opacity: 0;
  pointer-events: none;
  -webkit-transform: translateY(20px) scale(0.95);
  transform: translateY(20px) scale(0.95);
  -webkit-transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1) !important;
  transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1) !important;
  -webkit-box-sizing: border-box !important;
  box-sizing: border-box !important;
}

.advokat-chat-window.active {
  opacity: 1 !important;
  pointer-events: auto !important;
  -webkit-transform: translateY(0) scale(1) !important;
  transform: translateY(0) scale(1) !important;
}

/* Шапка чата */
.chat-window-header {
  background-color: #0f172a !important;
  padding: calc(var(--index) * 0.6) calc(var(--index) * 0.8) !important;
  display: -webkit-box !important;
  display: -ms-flexbox !important;
  display: flex !important;
  -webkit-box-align: center !important;
  -ms-flex-align: center !important;
  align-items: center !important;
  gap: 12px !important;
  position: relative !important;
}

.chat-lawyer-avatar {
  width: 35px;
  height: 35px;
  background: #ffffff;
  border-radius: 50%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  font-size: 18px;
}

.chat-lawyer-status h4 {
  color: #ffffff !important;
  margin: 0 !important;
  font-size: 14px !important;
  font-weight: 600 !important;
}

.chat-lawyer-status p {
  color: #22c55e !important;
  margin: 0 !important;
  font-size: 11px !important;
  font-weight: 500 !important;
}

.chat-window-close {
  position: absolute !important;
  right: 15px !important;
  top: 50% !important;
  -webkit-transform: translateY(-50%) !important;
  transform: translateY(-50%) !important;
  background: transparent !important;
  border: none !important;
  color: #94a3b8 !important;
  font-size: 22px !important;
  cursor: pointer !important;
}

/* Тело чата */
.chat-window-body {
  padding: calc(var(--index) * 0.8) !important;
  -webkit-box-sizing: border-box !important;
  box-sizing: border-box !important;
}

.chat-welcome-bubble {
  background-color: #f1f5f9 !important;
  color: #334155 !important;
  padding: 10px 14px !important;
  border-radius: 8px !important;
  font-size: 12px !important;
  line-height: 1.5 !important;
  margin-bottom: calc(var(--index) * 0.8) !important;
}

/* Адаптивность для мобилок */
@media screen and (max-width: 768px) {
  .advokat-chat-window {
    width: 85% !important;
    right: 7.5% !important;
    bottom: calc(var(--index) * 5) !important;
  }
}
.div-success {
  position: fixed;
  bottom: 30px;
  right: 30px;
  z-index: 100000; /* Поверх абсолютно всего на сайте */
  display: flex;
  align-items: center;
  gap: 15px;
  background: #ffffff;
  border-left: 5px solid #2ecc71; /* Красивая зеленая полоса слева */
  box-shadow: 0 5px 25px rgba(0, 0, 0, 0.15);
  padding: 16px 24px;
  border-radius: 6px;
  max-width: 400px;
  font-family: Arial, sans-serif;
  cursor: pointer;
  
  /* Начальное состояние для анимации */
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.4s ease, transform 0.4s ease;
  pointer-events: none;
}

/* Класс, который делает уведомление видимым */
.div-success.show {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

/* Стиль зеленой круглой иконки галочки */
.success-icon {
  background: #e8f8f0;
  color: #2ecc71;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  font-size: 18px;
  flex-shrink: 0;
}

/* Текст сообщения */
.success-message-text {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.success-message-text strong {
  color: #2c3e50;
  font-size: 15px;
}
.success-message-text span {
  color: #7f8c8d;
  font-size: 13px;
  line-height: 1.4;
}
@media (max-width: 480px) {
  .div-success {
    /* Фиксируем в самом низу экрана на всю ширину */
    bottom: 0;
    right: 0;
    left: 0;
    max-width: 100%;
    
    /* Сглаживаем углы только сверху, чтобы плашка ровно легла на низ экрана */
    border-radius: 12px 12px 0 0; 
    border-left: none;
    border-top: 4px solid #2ecc71; /* Переносим зеленую линию наверх плашки */
    
    /* Делаем внутренние отступы чуть компактнее для мобильных */
    padding: 14px 20px; 
    box-shadow: 0 -5px 20px rgba(0, 0, 0, 0.15);
    
    /* Изменяем анимацию: на смартфонах плашка будет выезжать строго снизу вверх */
    transform: translateY(100%); 
  }

  .div-success.show {
    transform: translateY(0);
  }
  
  /* Уменьшаем размер иконки, чтобы сэкономить место */
  .success-icon {
    width: 32px;
    height: 32px;
    font-size: 16px;
  }
}