/* ==========================================================================
   NTMC v2 - responsive.css
   ========================================================================== */

/* Large screens */
@media (max-width:1200px){

    :root{
        --section-space:120px;
    }

    .container{
        width:min(100%,calc(100% - 40px));
    }

    .hero__content{
        max-width:680px;
    }
}

/* Tablets */
@media (max-width:992px){

    :root{
        --section-space:100px;
    }

    .nav{
        display:none;
    }

    .hero{
        min-height:auto;
        padding:140px 0 100px;
    }

    .hero__title{
        line-height:1;
    }

    .hero__buttons{
        gap:14px;
    }

    .directions__grid,
    .features__grid,
    .stats__grid,
    .news__grid,
    .partners__grid{
        grid-template-columns:repeat(2,1fr);
    }

    .contacts__wrapper,
    .footer__top{
        grid-template-columns:1fr;
    }

    .project-banner{
        padding:60px 40px;
    }
}

/* Mobile */
@media (max-width:768px){

    :root{
        --section-space:80px;
        --container-padding:16px;
    }

    body{
        font-size:.95rem;
    }

    .header{
        height:72px;
    }

    .logo{
        font-size:1.25rem;
    }

    .hero__content{
        padding-top:60px;
    }

    .hero__subtitle{
        font-size:.85rem;
    }

    .hero__text{
        font-size:1rem;
    }

    .hero__buttons{
        flex-direction:column;
        align-items:stretch;
    }

    .btn{
        width:100%;
    }

    .directions__grid,
    .features__grid,
    .stats__grid,
    .news__grid,
    .partners__grid{
        grid-template-columns:1fr;
    }

    .direction-card{
        min-height:340px;
    }

    .project-banner{
        padding:40px 24px;
        border-radius:24px;
    }

    .project-banner h2{
        font-size:2rem;
    }

    .stat-card__number{
        font-size:2.6rem;
    }

    .news-card img{
        height:200px;
    }

    .footer{
        text-align:center;
    }

    .footer__bottom{
        flex-direction:column;
        gap:12px;
    }
}

/* Small phones */
@media (max-width:480px){

    .hero{
        padding-top:120px;
    }

    .hero__title{
        letter-spacing:-1px;
    }

    .section-title{
        margin-bottom:14px;
    }

    .direction-card__content{
        left:20px;
        right:20px;
        bottom:20px;
    }

    .contact-card{
        padding:24px;
    }
}
