/* Общий фон для всего сайта */
body {
    font-family: 'Segoe UI', sans-serif;
    background-color: #A9C4D1; /* Серо-голубой фон */
    margin: 0;
    padding: 0;
}

/* Шрифт для заголовка на главной странице */
h1.display-5 {
    font-family: 'Roboto Slab', serif; /* Подключенный шрифт */
    font-weight: 800; /* Жирность */
    letter-spacing: -0.5px; /* Небольшое сближение букв для плотности */
    line-height: 1.2; /* Высота строки */
}

/* Убираем белый фон у навигации */
.navbar {
    background-color: #A9C4D1 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.2); /* Легкая граница для разделения */
}

/* Убираем белый фон у футера */
.footer {
    background-color: #A9C4D1 !important;
    border-top: 1px solid rgba(255, 255, 255, 0.2); /* Легкая граница для разделения */
    color: #333; /* Цвет текста в футере */
}

/* Убираем белый фон у контейнера (если он есть) */
.container {
    background-color: transparent; /* Прозрачный фон */
}

/* Стили для кнопок навигации - ОБНОВЛЕНО */
.nav-btn {
    color: #000000 !important; /* Черный цвет текста */
    font-weight: 700 !important; /* Жирный шрифт */
    background-color: #A9D1CA !important; /* Новый цвет фона кнопок */
    border: 1px solid #6B968F !important; /* Цвет границы */
    transition: all 0.2s ease-in-out; /* Плавный переход для hover и active */
}

.nav-btn:hover {
    color: #000000 !important; /* Черный цвет текста при наведении */
    background-color: #97BAB4 !important; /* Темнее фон при наведении */
    border-color: #5B7D77 !important; /* Темнее граница при наведении */
    transform: translateY(-2px); /* Легкий подъем */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15); /* Тень при наведении */
}

.nav-btn:active {
    background-color: #85ABA5 !important; /* Еще темнее при нажатии */
    transform: translateY(0); /* Возвращаем на место */
}

/* Стили для логотипа */
.navbar-brand {
    background-color: #A9C4D1 !important; /* Фон логотипа */
    padding: 5px 10px; /* Отступы */
    border-radius: 5px; /* Скругление */
}

.navbar-brand img {
    max-height: 80px; /* Увеличили в два раза */
    width: auto;
    margin-top: -5px;
    border: none;
    outline: none;
}

/* Стили для изображений на странице Электроснабжение */
.electricity-images img {
    max-width: 100%;
    height: auto;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

/* Увеличиваем отступы между изображениями */
.electricity-images img:not(:last-child) {
    margin-bottom: 15px;
}

/* Стили для изображений на странице Теплоснабжение */
.heating-images img {
    max-width: 100%;
    height: auto;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

/* Увеличиваем отступы между изображениями */
.heating-images img:not(:last-child) {
    margin-bottom: 15px;
}

/* Стили для изображений на странице Водоснабжение */
.water-images img {
    max-width: 100%;
    height: auto;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

/* Увеличиваем отступы между изображениями */
.water-images img:not(:last-child) {
    margin-bottom: 15px;
}

/* Стили для кнопки */
.btn-primary {
    background-color: #0d6efd;
    border-color: #0d6efd;
}
.btn-primary:hover {
    background-color: #0b5ed7;
    border-color: #0b5ed7;
}

/* Цвет текста в основном контенте */
.text-muted {
    color: #333 !important;
}

/* Если ты хочешь, чтобы текст выходил за пределы колонки (без обрезки), используй этот вариант вместо предыдущего */
.no-wrap-list li {
    white-space: nowrap;
    overflow: visible; /* Позволяет тексту выходить за пределы */
}