/* footer.css - Единые стили для футера сайта «Личный Гид»: тёмный фон, сетка ссылок, адаптивность | футер, подвал, стили, CSS, ссылки, адаптив, footer, styles, links, responsive

/**
 * footer.css - Единые стили для футера сайта «Личный Гид»
 * 
 * 📌 НАЗНАЧЕНИЕ:
 * Обеспечивает единый визуальный стиль нижней части (футера) на всех страницах
 * сайта (главная, доска объявлений, документы, личные кабинеты туриста и гида).
 * Реализует тёмный дизайн с двумя колонками ссылок, информацией об авторских
 * правах и адаптивным отображением на мобильных устройствах.
 * 
 * 🎨 ОСНОВНЫЕ КЛАССЫ И ЭЛЕМЕНТЫ:
 * - .new-footer – корневой контейнер футера (тёмный фон #0a1e2f, светлый текст,
 *   отступы, margin-top для отделения от контента)
 * - .footer-inner – внутренний контейнер с max-width: 1280px, flex-распределение
 *   (justify-content: space-between), выравнивание по левому краю внутри блоков
 * - .footer-copyright – блок с копирайтом (серый цвет #94a3b8, левое выравнивание)
 * - .footer-links – блок со ссылками (заголовок + сетка)
 * - .footer-links-title – заголовок блока ссылок (белый цвет, жирный шрифт)
 * - .footer-links-grid – сетка ссылок (2 колонки, отступы между колонками и строками),
 *   ссылки имеют цвет #94a3b8, при наведении становятся белыми с подчёркиванием,
 *   white-space: nowrap для предотвращения переноса
 * 
 * 📱 АДАПТИВНОСТЬ:
 * - На экранах шире 768px: горизонтальное расположение блоков (flex-wrap: nowrap)
 * - При ширине ≤ 768px (планшеты, маленькие ноутбуки):
 *   - Блоки выстраиваются в колонку (flex-direction: column)
 *   - Уменьшаются отступы (gap: 1rem вместо 2rem)
 *   - Сетка ссылок остаётся двухколончатой
 * - При ширине ≤ 480px (телефоны):
 *   - Сетка ссылок переключается на одну колонку (grid-template-columns: 1fr)
 *   - Уменьшаются отступы между ссылками (gap: 0.3rem)
 * 
 * ⚠️ ОСОБЕННОСТИ:
 * - Используется тёмная цветовая схема, контрастирующая со светлым фоном страниц
 * - Ссылки в футере ведут на страницы документов (подключаются через PHP-инклюды
 *   в podval.html), но стили едины для всех страниц
 * - Сетка ссылок построена на CSS Grid, что обеспечивает гибкость и простоту
 *   адаптации под разные экраны
 * - white-space: nowrap у ссылок предотвращает перенос длинных названий
 * - Переходы цвета (transition) делают наведение плавным
 * - margin-top: 3rem у .new-footer создаёт визуальный отступ от основного контента
 * 
 * 📁 СВЯЗАННЫЕ ФАЙЛЫ:
 * - menu/podval.html (подключает данный CSS-файл и содержит HTML-разметку футера)
 * - menu/header.php (шапка, подключается аналогичным образом)
 * - index.php (главная страница, использует футер через podval.html)
 * - 05_doska.php (доска объявлений, использует футер через podval.html)
 * - Страница документов (использует футер через podval.html)
 * - 03_lk_turist.php (ЛК туриста, использует футер через podval.html)
 * - 04_lk_gid.php (ЛК гида, использует футер через podval.html)
 * - assets/css/footer.css (основной файл стилей, данный файл дублирует его для
 *   единообразия, но может быть использован как основной)
 * 
 * 🏷️ КЛЮЧЕВЫЕ СЛОВА ДЛЯ ПОИСКА:
 * футер, подвал, стили, CSS, ссылки, адаптив, footer, styles, links,
 * responsive, тёмная тема, сетка, grid, копирайт, copyright, навигация,
 * единый футер, личный гид, турист, гид, медиа-запросы, mobile-first
 */

/* Фактический CSS-код (ниже комментариев) ... */

/* Основные стили футера */
.new-footer {
    background: #0a1e2f;
    color: #cbd5e1;
    padding: 2rem 1.5rem;
    margin-top: 3rem;
    text-align: center;          /* резерв для очень старых браузеров */
}

.new-footer .footer-inner {
    max-width: 1280px;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
    gap: 2rem;
    text-align: left;           /* левое выравнивание внутри блоков */
}

.new-footer .footer-copyright {
    font-size: 0.9rem;
    color: #94a3b8;
    text-align: left;
}

.new-footer .footer-links {
    text-align: left;
}

.new-footer .footer-links-title {
    font-size: 1rem;
    font-weight: 600;
    margin: 0 0 0.75rem 0;
    color: #ffffff;
}

/* Сетка ссылок – две колонки */
.new-footer .footer-links-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.5rem 2rem;
}

.new-footer .footer-links-grid a {
    color: #94a3b8;
    text-decoration: none;
    font-size: 0.9rem;
    transition: color 0.2s ease;
    white-space: nowrap;        /* чтобы ссылки не переносились */
}

.new-footer .footer-links-grid a:hover {
    color: #ffffff;
    text-decoration: underline;
}

/* ===== АДАПТИВНОСТЬ ===== */

/* Планшеты и маленькие ноутбуки */
@media (max-width: 768px) {
    .new-footer .footer-inner {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }
    .new-footer .footer-copyright {
        text-align: left;
    }
    .new-footer .footer-links-grid {
        grid-template-columns: 1fr 1fr;
        gap: 0.4rem 1.5rem;
    }
}

/* Телефоны */
@media (max-width: 480px) {
    .new-footer .footer-links-grid {
        grid-template-columns: 1fr;   /* одна колонка на маленьких экранах */
        gap: 0.3rem;
    }
}