/* responsive.css
   Дополнительная адаптация под основные типы экранов.
   Breakpoints:
   1) <= 359px       — очень маленькие смартфоны
   2) 360–479px      — стандартные смартфоны
   3) 480–767px      — крупные смартфоны / маленькие планшеты
   4) 768–1023px     — планшеты
   5) 1024–1279px    — небольшие ноутбуки
   6) 1280–1439px    — десктопы
   7) >= 1440px      — широкие экраны / большие мониторы
*/


/* 1. Очень маленькие смартфоны (примерно 320–359px) */
@media (max-width: 359px) {
    body {
        font-size: 14px;
    }
    .hero h1 {
        font-size: 22px;
    }
    .hero-lead {
        font-size: 13px;
    }
    .hero-actions {
        flex-direction: column;
        align-items: stretch;
    }
    .cards-grid {
        grid-template-columns: minmax(0, 1fr);
    }
    .bottom-nav-link span {
        font-size: 10px;
    }
}

/* 2. Стандартные смартфоны (360–479px) */
@media (min-width: 360px) and (max-width: 479px) {
    body {
        font-size: 14px;
    }
    .hero h1 {
        font-size: 24px;
    }
    .hero-lead {
        font-size: 14px;
    }
    .cards-grid {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* 3. Крупные смартфоны / маленькие планшеты (480–767px) */
@media (min-width: 480px) and (max-width: 767px) {
    .hero-inner {
        grid-template-columns: minmax(0, 1fr);
    }
    .cards-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .hero-stats {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

/* 4. Планшеты (768–1023px) */
@media (min-width: 768px) and (max-width: 1023px) {
    .hero-inner {
        grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
    }
    .cards-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .about-grid,
    .application-grid,
    .contacts-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* 5. Небольшие ноутбуки (1024–1279px) */

@media (min-width: 1024px) and (max-width: 1279px) {
    .container {
        max-width: 1120px;
    }
    .header-inner {
        flex-wrap: wrap;
        row-gap: 8px;
        align-items: flex-start;
    }
    .logo-block {
        flex-shrink: 0;
    }
    .main-nav {
        order: 3;
        width: 100%;
        margin-left: 0;
    }
    .nav-list {
        justify-content: center;
        flex-wrap: wrap;
        column-gap: 12px;
        row-gap: 4px;
    }
    .nav-list a {
        padding: 4px 8px;
    }
    .btn-header {
        flex-shrink: 0;
    }
    .cards-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}
/* 6. Десктопы (1280–1439px) */
@media (min-width: 1280px) and (max-width: 1439px) {
    .container {
        max-width: 1280px;
    }
    .cards-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

/* 7. Большие мониторы (>= 1440px) */
@media (min-width: 1440px) {
    .container {
        max-width: 1360px;
    }
    .cards-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
    .hero-inner {
        grid-template-columns: minmax(0, 1.4fr) minmax(0, 1.1fr);
    }
}