 * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }

        body {
            font-family: 'Libre Franklin', sans-serif;
            min-height: 100vh;
            display: flex;
            flex-direction: column;
        }




        header {
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            color: white;
            padding: 1.5rem;
            text-align: center;
            box-shadow: 0 2px 10px rgba(0,0,0,0.1);
            align-items: flex-start;
        }

        header h1 {
            margin-bottom: 0.5rem;
            font-size: 2rem;
        }

        header p {
            opacity: 0.9;
            font-size: 1.1rem;
        }

        /*слоган*/

        .site-name {
            font-size: 2.3em; 
            font-weight: bold;
            /* Убираем нижний/верхний отступ, чтобы название было "чуть выше" */
            line-height: 1.1; 
        }

        /* 4. Оформление слогана */
        .slogan {
            font-size: 0.8em; /* Делаем слоган меньше, чем название */
            color: #ffffff;
            line-height: 1.1; 
            white-space: nowrap;
        }


        /* Шапка сайта */
        .header {
            background: linear-gradient(135deg, #0F52BA, #072554);
            padding: 5px 0;
            box-shadow: 0 2px 10px rgba(0,0,0,0.1);
        }

        .header-container {
            max-width: 1200px;
            margin: 0 auto;
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 0 20px;
        }

        .logo-section {
            display: flex;
            align-items: center;
            gap: 15px;
        }

        .logo {
            width: 80px;
            height: 80px;
            border-radius: 8px;
            display: flex;
            align-items: center;
            justify-content: center;
            font-weight: bold;
            color: #1e3c72;
            font-size: 20px;
        }

        .site-name {
            color: white;
            font-size: 24px;
            font-weight: bold;
        }

        .nav-menu {
            display: flex;
            gap: 30px;
        }

        .nav-menu a {
            color: white;
            text-decoration: none;
            font-size: 16px;
            padding: 8px 16px;
            border-radius: 5px;
            transition: background-color 0.3s;
        }

        .nav-menu a:hover {
            background-color: rgba(255,255,255,0.2);
        }

        /* Основной контент */
        .main-content {
            flex: 1;
            padding: 40px 20px;
            max-width: 1200px;
            margin: 0 auto;
            width: 100%;
        }

        /* Подвал сайта */
        .footer {
            background: linear-gradient(135deg, #072554, #0F52BA);
            padding: 5px 0;
            margin-top: auto;
        }

        .footer-container {
            max-width: 1200px;
            margin: 0 auto;
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 0 20px;
        }

        .footer-logo-section {
            display: flex;
            align-items: center;
            gap: 15px;
        }

        .footer-logo {
            width: 100px;
            height: 100px;
            background: rgba(255, 255, 255, 0);
            border-radius: 6px;
            display: flex;
            align-items: center;
            justify-content: center;
            font-weight: bold;
            color: #1e3c72;
            font-size: 16px;
        }

        .footer-name {
            color: white;
            font-weight: bold;
            font-size: 24px;
        }

        .footer-nav {
            display: flex;
            gap: 25px;
        }

        .footer-nav a {
            color: white;
            text-decoration: none;
            font-size: 14px;
            opacity: 0.9;
            transition: opacity 0.3s;
        }

        .footer-nav a:hover {
            opacity: 1;
        }

        .copyright {
            color: white;
            font-size: 14px;
            opacity: 0.8;
            margin-top: 10px;
        }

        /* Адаптивность */
@media (max-width: 768px) {
    
    /* 1. АДАПТАЦИЯ ШАПКИ И ПОДВАЛА */
    .header-container, 
    .footer-container {
        flex-direction: column !important;
        align-items: center !important;
        padding: 15px 10px !important;
        gap: 15px !important;
    }

    .logo-section, 
    .footer-logo-section {
        flex-direction: column !important; /* Логотип над текстом */
        text-align: center !important;
        gap: 10px !important;
    }

    .site-name, 
    .footer-name {
        font-size: 1.4rem !important; /* Уменьшаем размер названия */
        text-align: center;
        white-space: normal; /* Позволяем тексту переноситься, если нужно */
    }

    .nav-menu, 
    .footer-nav {
        display: flex !important;
        flex-wrap: wrap !important;
        justify-content: center !important;
        gap: 8px !important;
        width: 100%;
    }

    .nav-menu a, 
    .footer-nav a {
        font-size: 0.9rem !important;
        padding: 8px 12px !important;
        background-color: rgba(255,255,255,0.05); /* Легкий фон для кнопок меню на мобильных */
        border-radius: 8px;
    }


    