/* Адаптация Шапки и Логотипа */
@media (max-width: 768px) {
    .header {
        flex-direction: column; /* Складываем элементы вертикально */
        padding: 15px 20px;
        min-height: auto;
        gap: 15px;
    }

    #lineCanvas {
        display: none; /* Скрываем холст на мобильных, он ломает ширину */
    }

    .logo {
        margin-bottom: 5px; /* Уменьшаем отступ для мобильной версии */
        animation: none; /* Отключаем вибрацию на мобилках (повышает стабильность интерфейса) */
    }

    .logo span {
        font-size: 24px; /* Уменьшаем размер шрифта логотипа */
        letter-spacing: 1px;
    }

    .menu {
        gap: 20px; /* Уменьшаем расстояние между ссылками */
        width: 100%;
        justify-content: center; /* Центрируем меню */
    }

    .menu a {
        font-size: 14px;
        padding: 8px 0; /* Увеличиваем зону клика */
    }

    /* Делаем подчеркивание активной ссылки чуть заметнее на мобильных */
    .menu a.active::after {
        width: 100%;
        height: 2px;
    }
}

@media (max-width: 480px) {
    .header {
        padding: 15px 10px;
    }

    .menu {
        gap: 15px;
    }

    .logo span {
        font-size: 20px;
    }
}