/* Адаптивность */
@media (max-width: 1700px) {
    .nav, .phone {
        display: none;
    }
    
    .nav-button {
        display: block;
    }
}

@media (max-width: 1200px) {
    .headerLine {
        padding: 0 20px;
    }
    
    .container-cards {
        grid-template-columns: 1fr;
        gap: 30px;
        max-width: 600px;
    }
    
    .card1, .card2, .card3, .card4 {
        height: auto; /* Автоматическая высота на мобильных */
        min-height: 600px;
    }
    
    .footerLine {
        grid-template-columns: 1fr;
        gap: 40px;
    }
}

@media (max-width: 992px) {
    .text2 {
        font-size: 2.8rem;
    }
    
    .text3 {
        font-size: 1.2rem;
        padding: 25px;
    }
    
    .text8 {
        font-size: 2.2rem;
    }
    
    .card-top, .card2-top, .card3-top, .card4-top {
        height: 250px;
    }
}

@media (max-width: 768px) {
    .header {
        padding: 0;
    }
    
    .text2 {
        font-size: 2.3rem;
        margin: 60px 0 30px;
    }
    
    .text3 {
        font-size: 1.1rem;
        padding: 20px;
    }
    
    .text8 {
        font-size: 1.8rem;
    }
    
    .cards {
        padding: 60px 0;
    }
    
    .container-cards {
        padding: 0 15px;
        gap: 25px;
    }
    
    .card-top, .card2-top, .card3-top, .card4-top {
        height: 220px;
    }
    
    .text-button-main-foot {
        padding: 15px 30px;
        font-size: 1rem;
    }
    
    .footer {
        padding: 60px 0 30px;
        margin-top: 60px;
    }
}

@media (max-width: 576px) {
    .text2 {
        font-size: 2rem;
        margin: 40px 0 20px;
    }
    
    .text3 {
        font-size: 1rem;
        padding: 15px;
    }
    
    .text8 {
        font-size: 1.5rem;
    }
    
    .container-cards {
        gap: 20px;
    }
    
    .card-top, .card2-top, .card3-top, .card4-top {
        height: 200px;
    }
    
    .card-bottom, .card2-bottom, .card3-bottom, .card4-bottom {
        padding: 20px;
    }
    
    .card-footer, .card2-footer, .card3-footer, .card4-footer {
        padding: 0 20px 20px;
    }
    
    .footer {
        padding: 40px 0 20px;
    }
    
    .footerLine {
        padding: 0 15px;
        gap: 30px;
    }
}