.top-menu, .main-menu {
    background: #252525;
}
.top-menu .nav-link {
    color: #fff;
    font-size: .9rem;
}
.navbar-toggler-zhd {
    border-color: #fff;
}
.main-menu .nav-link {
    color: #fff;
    font-size: .9rem;
}
.main-menu .navbar-nav .nav-link.active, .navbar-nav .nav-link.show, .navbar-brand-zhd {
    color: #fff;
}
.navbar-toggler-icon-zhd {
    display: inline-block;
    width: 1.5em;
    height: 1.5em;
    vertical-align: middle;
    background-image: url('/assets/svg/logo.svg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100%;
}
.headerbg {
    background-image: url('/assets/img/header-photo.png');
    background-size: cover;
    background-position: top center;
    padding-top: 3rem;
    padding-bottom: 3rem;
}
.header-txt-row1 {
    color: #fff;
    font-size: .9rem;
}
.header-txt-row2 {
    color: #ffffff;
    font-family: verdana, geneva, sans-serif;
    font-size: 3.3rem;
}
.header-txt-row3 {
    color: #fff;
    font-size: .9rem;
}
.header-txt-row4 {
    color: #fff;
    font-size: 2rem;
}
.text-right-appear {
  position: relative; 
  animation: slideRight 4s ease-out forwards;
}

@keyframes slideRight {
  from {
    right: 100%; /* Изначально текст за пределами экрана справа */
    opacity: 0; /* Сначала делаем его прозрачным */
  }
  to {
    right: 0; /* Постепенно сдвигаем вправо и делаем видимым */
    opacity: 1;
  }
}
.text-left-appear {
  position: relative; 
  animation: slideLeft 4s ease-out forwards;
}

@keyframes slideLeft {
  from {
    left: 100%; /* Изначально текст за пределами экрана справа */
    opacity: 0; /* Сначала делаем его прозрачным */
  }
  to {
    left: 0; /* Постепенно сдвигаем вправо и делаем видимым */
    opacity: 1;
  }
}
.logo-from-appear {
    opacity: 0;
    animation: slideIn 7s forwards;
}
.text-from-appear {
    opacity: 0;
    animation: slideIn 4.5s forwards;
}
.text2-from-appear {
    opacity: 0;
    animation: slideIn 3.5s forwards;
}

@keyframes slideIn {
    0% {opacity: 0;}
  100% {opacity: 1;}
}

.long-title {
    font-size: 1.7rem;
    font-weight: bold;
    padding-top: 1rem;
}


/* === САЙДБАР (LeftMenu) === */
@media (min-width: 992px) {
    #offcanvasNavbar {
        display: flex !important;
        visibility: visible !important;
        transform: none !important;
        position: static !important;
        width: auto !important;
        height: auto !important;
        background-color: transparent !important;
        border: 0 !important;
        z-index: auto !important;
    }
    #offcanvasNavbar .offcanvas-header {
        display: none !important;
    }
    #offcanvasNavbar .offcanvas-body {
        display: flex !important;
        flex-grow: 0;
        padding: 0;
        overflow-y: visible;
    }
    .navbar-expand-lg .navbar-toggler {
        display: none !important;
    }
}

/* Сайдбар: стили для списка */
.col-12.col-lg-3 .navbar-nav .nav-link {
    font-size: .85rem;
    color: #333;
    padding: .3rem .5rem;
}
.col-12.col-lg-3 .navbar-nav .nav-link:hover {
    color: #007bff;
}


/* Service cards */
.service-card {
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  border-radius: 0.5rem;
}
.service-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 0.5rem 1.5rem rgba(0,0,0,0.4);
}
.service-card .card-body {
  padding: 1.25rem;
}

/* ==========================================
   ВЫНЕСЕННЫЕ СТИЛИ ИЗ ИНЛАЙН-АТРИБУТОВ
   ========================================== */

/* --- Типографика: размеры шрифтов --- */

/* Базовый размер текста в контенте (12pt — самый частый, 421x) */
.content-text {
    font-size: 12pt;
}

/* Средний размер шрифта Verdana (256x на страницах автосервиса) */
.content-text-verdana {
    font-family: Verdana, sans-serif;
    font-size: medium;
}

/* Шрифт Verdana 12pt (81x на страницах статей) */
.content-text-vg {
    font-family: Verdana, Geneva, sans-serif;
    font-size: 12pt;
}

/* Крупный текст 14pt (5x) */
.content-text-14pt {
    font-size: 14pt;
}

/* Крупный текст 18pt (4x) */
.content-text-18pt {
    font-size: 18pt;
}

/* Очень крупный текст 24pt (7x, страница Акции) */
.content-text-24pt {
    font-size: 24pt;
}

/* Жирный красный текст для акций (5x) */
.accent-red-bold {
    font-family: 'Arial Black', sans-serif;
    font-size: 18pt;
    color: #ff0000;
}

/* Шрифт Tahoma 12pt (8x, страница диагностики Cadillac) */
.content-text-tahoma {
    font-family: Tahoma, Arial, Helvetica, sans-serif;
    font-size: 12pt;
}

/* Крупный шрифт Verdana (3x) */
.content-text-large {
    font-family: Verdana, sans-serif;
    font-size: large;
}

/* Verdana 14pt (2x, статьи) */
.content-text-vg-14pt {
    font-family: Verdana, Geneva, sans-serif;
    font-size: 14pt;
}

/* --- Выравнивание --- */

/* Центрирование заголовков (24x) */
h1.text-center-title {
    text-align: center;
}

/* Центрирование блоков и абзацев (27x + 29x) */
.text-center-block {
    text-align: center;
}

/* Выравнивание по левому краю (8x) */
.text-left-block {
    text-align: left;
}

/* Выравнивание по правому краю (1x) */
.text-right-block {
    text-align: right;
}

/* --- Таблицы --- */

/* Полная ширина таблицы (4x) */
.table-full-width {
    width: 100%;
}

/* Фиксированная ширина ячейки 1110px (36x) */
.td-wide {
    width: 1110px;
}

/* Фиксированная ширина ячейки 166px (35x) */
.td-narrow {
    width: 166px;
}

/* --- Главная страница: карточки услуг --- */

/* Минимальная высота карточки услуги (9x) */
.service-card {
    min-height: 200px;
}

/* Контент карточки услуги */
.service-card .card-body {
    min-height: 200px;
}

/* --- Главная страница: блок преимуществ --- */

/* Иконка-кружок преимущества (6x) */
.advantage-icon {
    width: 48px;
    height: 48px;
    background: #252525;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 1.2rem;
    font-weight: bold;
    flex-shrink: 0;
}

/* --- Главная страница: CTA-блок --- */

/* Тёмный CTA-баннер */
.cta-banner {
    background-color: #252525;
    color: #fff;
    border: none;
}

/* Крупный телефон в CTA */
.cta-phone {
    font-size: 1.5rem;
    font-weight: bold;
}

/* Ссылка-телефон в CTA */
.cta-phone-link {
    color: #fff;
    text-decoration: none;
}

/* Вводный текст под H1 на главной */
.home-intro-text {
    font-size: 1.1rem;
}

/* --- Прочие стили --- */

/* Список с буквенной нумерацией (1x) */
.list-upper-alpha {
    list-style-type: upper-alpha;
}

/* ==========================================
   МОБИЛЬНАЯ АДАПТАЦИЯ
   ========================================== */

/* --- Карточки услуг на мобильном --- */
@media (max-width: 767.98px) {
    /* Карточки услуг: полная ширина, отступы */
    .service-card {
        min-height: 160px;
    }
    .service-card .card-body {
        min-height: 160px;
        padding: 1rem;
    }
    /* CTA-баннер: уменьшить отступы */
    .cta-banner {
        padding: 1rem !important;
    }
    .cta-phone {
        font-size: 1.25rem;
    }
    /* Вводный текст: уменьшить */
    .home-intro-text {
        font-size: 1rem;
    }
    /* Блок преимуществ: иконки меньше */
    .advantage-icon {
        width: 40px;
        height: 40px;
        font-size: 1rem;
    }
    /* H1 на мобильном: меньше */
    h1 {
        font-size: 1.5rem;
    }
    /* H2 на мобильном: меньше */
    h2 {
        font-size: 1.3rem;
    }
    /* Таблицы: горизонтальная прокрутка */
    .table-full-width,
    table {
        display: block;
        overflow-x: auto;
        white-space: nowrap;
        max-width: 100%;
    }
    .td-wide {
        width: auto;
        min-width: 200px;
    }
    .td-narrow {
        width: auto;
        min-width: 120px;
    }
    /* Шрифты контента: уменьшить на мобильном */
    .content-text {
        font-size: 11pt;
    }
    .content-text-24pt {
        font-size: 18pt;
    }
    .content-text-18pt {
        font-size: 15pt;
    }
    .accent-red-bold {
        font-size: 15pt;
    }
}

/* --- Очень маленькие экраны (до 575px) --- */
@media (max-width: 575.98px) {
    /* Карточки услуг: минимальная высота */
    .service-card {
        min-height: 140px;
    }
    /* CTA-кнопка: полная ширина */
    .cta-banner .btn {
        width: 100%;
    }
    /* Блок преимуществ: вертикально */
    .advantage-icon {
        width: 36px;
        height: 36px;
        font-size: 0.9rem;
    }
    /* H1 ещё меньше */
    h1 {
        font-size: 1.3rem;
    }
}

/* --- Планшеты (768px-991px) --- */
@media (min-width: 768px) and (max-width: 991.98px) {
    /* Карточки услуг: 2 в ряд */
    .service-card {
        min-height: 180px;
    }
}

/* --- Модальное окно формы --- */
@media (max-width: 575.98px) {
    .modal-dialog {
        margin: 0.5rem;
    }
    .modal-body {
        padding: 1rem;
    }
}

/* --- Шапка сайта на мобильном --- */
@media (max-width: 991.98px) {
    .header-txt-row2 {
        font-size: 2rem;
    }
    .header-txt-row4 {
        font-size: 1.5rem;
    }
    .headerbg {
        padding-top: 1.5rem;
        padding-bottom: 1.5rem;
    }
}

/* --- Футер на мобильном --- */
@media (max-width: 767.98px) {
    footer .col-12 {
        text-align: center !important;
    }
}

/* --- Контент: изображения и таблицы --- */
@media (max-width: 767.98px) {
    /* Изображения не вылазят */
    img {
        max-width: 100%;
        height: auto;
    }
    /* Таблицы с фиксированной шириной: прокрутка */
    table {
        max-width: 100%;
    }
    /* Длинные слова не ломают layout */
    .col-12 {
        word-wrap: break-word;
        overflow-wrap: break-word;
    }
}

/* Изображение с cover и top-center позиционированием */
.img-cover-top {
  background-size: cover;
  background-position: top center;
}

/* Карточка услуги с фоновым изображением (общие свойства) */
.service-card-bg {
  background-size: cover;
  background-position: center;
  min-height: 200px;
}


/* === ТАБЛИЦЫ: адаптивность === */

/* Обёртка для таблиц с горизонтальной прокруткой на мобильном */
.table-responsive-wrapper {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    max-width: 100%;
}

/* Сброс фиксированных ширин colgroup на мобильном */
@media (max-width: 767.98px) {
    colgroup {
        width: auto !important;
    }
    table {
        display: block;
        overflow-x: auto;
        white-space: nowrap;
        max-width: 100%;
        -webkit-overflow-scrolling: touch;
    }
    .td-wide {
        width: auto !important;
        min-width: 200px;
    }
    .td-narrow {
        width: auto !important;
        min-width: 120px;
    }
    /* Убираем white-space: nowrap для ячеек с текстом */
    td {
        white-space: normal !important;
    }
}

/* === Логотип в шапке === */
@media (max-width: 575.98px) {
    .header-logo {
        max-width: 70% !important;
    }
}

/* === Яндекс.Метрика информер === */
.ym-advanced-informer {
    max-width: 88px;
    width: auto !important;
}

/* === Длинные заголовки на мобильном === */
@media (max-width: 767.98px) {
    .long-title {
        font-size: 1.2rem;
    }
}

/* === Контент: отступы на мобильном === */
@media (max-width: 767.98px) {
    .col-12.col-lg-9 {
        padding: 0 0.5rem;
    }
    h1 {
        word-wrap: break-word;
        overflow-wrap: break-word;
    }
}

/* === Модальное окно: форма на мобильном === */
@media (max-width: 575.98px) {
    #contactModal .modal-dialog {
        margin: 0.25rem;
    }
    #contactModal .modal-body {
        padding: 0.75rem;
    }
    #contactModal .btn-lg {
        font-size: 1rem;
        padding: 0.5rem 1rem;
    }
}

/* === Карточки услуг: текст на маленьких экранах === */
@media (max-width: 575.98px) {
    .service-card .card-body {
        padding: 0.75rem;
    }
    .service-card h3 {
        font-size: 1rem;
    }
    .service-card p {
        font-size: 0.85rem;
    }
}


/* === ЧАНКИ: footer, header, форма === */

/* Ссылки в футере */
.footer-link {
    color: #ffffff;
    text-decoration: none;
}
.footer-link:hover {
    color: #ffffff;
    text-decoration: underline;
}

/* Подчёркнутый текст */
.text-underline {
    text-decoration: underline;
}

/* Копирайт в футере */
.footer-copyright {
    background-color: #252525;
    color: #fff;
    font-size: 14px;
}

/* Логотип в шапке */
.header-logo {
    width: 50%;
}

/* Honeypot-поле (скрытое от ботов) */
.honeypot-field {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

/* Яндекс.Метрика информер */
.ym-advanced-informer {
    max-width: 88px;
    width: auto;
}
\n/* === Dop. klassy dla chankov === */\n.menu-toggle-text {\n    padding-left: .6rem;\n}\n.modal-header-dark {\n    background-color: #252525;\n    color: #fff;\n}\n\n/* === MIGX price table === */\n.price-table-wrapper {\n    background-color: #eaeaea;\n    max-width: 100%;\n}\n.price-table-header {\n    background-color: #252525;\n    color: #fff;\n}\n.price-table-cell {\n    font-family: Verdana, Geneva, sans-serif;\n    padding: 8px;\n}\n\n/* === MIGX price table: Bootstrap responsive === */\n.price-table-header th {\n    background-color: #252525;\n    color: #fff;\n}\n.price-table-cell {\n    font-family: Verdana, Geneva, sans-serif;\n}\n.price-table-wrapper {\n    background-color: transparent;\n    max-width: 100%;\n}\n