/* Адаптивные стили для планшетов и небольших ноутбуков */
@media screen and (max-width: 1024px) {
    
    /* Общие корректировки */
    .container {
        padding: 0 30px; /* Слегка увеличиваем боковые отступы для безопасности */
    }
    
    /* Главный экран (Hero) */
    .hero {
        padding: 160px 0 120px;
    }
    
    .hero h1 {
        font-size: 38px; /* Уменьшаем размер заголовка, чтобы он не переносился хаотично */
    }
    
    .hero p {
        font-size: 16px;
    }

    /* Секция программ обучения */
    .programs-section {
        padding: 80px 0;
    }
    
    .programs-grid {
        grid-template-columns: repeat(2, 1fr); /* Держим 2 колонки, но оптимизируем внутренности */
        gap: 20px;
    }
    
    .program-card {
        padding: 25px; /* Уменьшаем внутренние паддинги карточек */
    }
    
    .program-card h3 {
        font-size: 19px;
        min-height: 48px;
        padding-right: 0; /* Убираем отступ справа, так как бейдж на планшетах будет вести себя иначе */
    }
    
    .card-badge {
        position: relative;
        top: 0;
        right: 0;
        display: inline-block;
        margin-bottom: 15px;
        align-self: flex-start;
    }

    /* Требования к документам */
    .requirements-section {
        padding: 80px 0;
    }
    
    .requirements-wrapper {
        grid-template-columns: 1fr; /* Перестраиваем из 2 колонок в 1 для удобства чтения сверху вниз */
        gap: 40px;
    }
    
    .requirements-notice {
        position: static; /* Отменяем липкое позиционирование, так как боковой колонки больше нет */
    }

    /* Официальные документы и Нормативная база */
    .documents-section {
        padding: 80px 0;
    }
    
    .docs-grid {
        grid-template-columns: 1fr; /* Положения и Договоры теперь идут друг за другом на всю ширину */
        gap: 25px;
    }
    
    .docs-category-card {
        padding: 30px;
    }

    /* Форма обратной связи */
    .form-section {
        padding: 80px 0;
    }
    
    .form-grid {
        grid-template-columns: 1fr; /* Схлопываем левую инфо-панель и саму форму в одну вертикальную ленту */
    }
    
    .form-info-side {
        padding: 40px;
        text-align: center;
        align-items: center;
    }
    
    .form-info-side p {
        margin-bottom: 25px;
    }
    
    .contact-item {
        width: 100%;
        max-width: 400px;
        justify-content: center;
    }
    
    .form-wrapper-side {
        padding: 40px;
    }
    
    .file-grid {
        grid-template-columns: repeat(2, 1fr); /* Сохраняем сетку файлов 2х3 */
    }
}

/* Промежуточный брейкпоинт для крупных мобильных / мини-планшетов */
@media screen and (max-width: 768px) {
    
    /* Шапка и навигация */
    .navbar-container {
        height: 70px;
    }
    
    .burger-menu {
        display: block; /* Показываем иконку бургера */
        background: none;
        border: none;
        color: var(--primary-color);
        font-size: 24px;
        cursor: pointer;
        z-index: 1001;
        transition: var(--transition);
    }
    
    /* Скрываем ссылки и превращаем их в выпадающую панель */
    .nav-links {
        position: fixed;
        top: 0;
        right: -100%; /* Изначально спрятано за правым краем экрана */
        width: 280px;
        height: 100vh;
        background-color: var(--bg-white);
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 35px;
        box-shadow: -5px 0 30px rgba(0,0,0,0.1);
        transition: right 0.4s ease-in-out;
        padding: 40px;
    }
    
    /* Класс, который JS будет добавлять при клике на бургер */
    .nav-links.active {
        right: 0;
    }
    
    .nav-links a {
        font-size: 18px;
        width: 100%;
        text-align: center;
    }
    
    .nav-links .btn {
        width: 100%;
    }
    
    /* Переключатели табов */
    .tabs-container {
        flex-direction: column; /* На мини-планшетах выстраиваем кнопки категорий друг под друга */
        align-items: center;
        gap: 10px;
    }
    
    .tab-btn {
        width: 100%;
        max-width: 400px;
        text-align: center;
    }
    
    /* Перевод сетки программ в одну колонку */
    .programs-grid {
        grid-template-columns: 1fr;
        max-width: 550px;
        margin: 0 auto;
    }
    
    /* Изменение структуры полей формы */
    .form-row {
        grid-template-columns: 1fr; /* Поля Телефон и Email теперь стоят вертикально */
        gap: 0;
    }
}