/* ==========================================================
   YADOMART RESPONSIVE
   Version: 1.0
========================================================== */

/* ==========================================
   1400px
========================================== */

@media (max-width:1400px){

    :root{

        --container:1180px;

    }

}

/* ==========================================
   1200px
========================================== */

@media (max-width:1200px){

    :root{

        --section-padding:100px;

    }

    .hero-container{

        gap:60px;

    }

}

/* ==========================================
   992px
========================================== */

@media (max-width:992px){

    h1{

        font-size:4rem;

    }

    h2{

        font-size:3rem;

    }

    .hero{

        min-height:auto;

        padding-top:160px;

        padding-bottom:120px;

    }

    .hero-container{

        grid-template-columns:1fr;

        gap:70px;

    }

    .hero-left{

        text-align:center;

        align-items:center;

    }

    .hero-left p{

        margin-inline:auto;

    }

    .hero-buttons{

        justify-content:center;

    }

    .features-grid{

        grid-template-columns:repeat(2,1fr);

    }

    .mission-grid{

        grid-template-columns:1fr;

        gap:50px;

    }

}

/* ==========================================
   768px
========================================== */

@media (max-width:768px){

    :root{

        --section-padding:80px;

        --header-height:76px;

    }

    .container{

        width:min(100% - 32px,var(--container));

    }

    h1{

        font-size:3.2rem;

        letter-spacing:-1px;

    }

    h2{

        font-size:2.4rem;

    }

    p{

        font-size:1rem;

    }

    .header{

        height:var(--header-height);

    }

    .logo img{

        height:36px;

    }

    .button{

        min-height:52px;

        padding:0 1.5rem;

    }

    .hero-card{

        padding:2rem;

    }

    .features-grid{

        grid-template-columns:1fr;

    }

    .waitlist-card{

        padding:2.5rem;

    }

    .footer-links{

        flex-wrap:wrap;

        justify-content:center;

        gap:1rem;

    }

}

/* ==========================================
   576px
========================================== */

@media (max-width:576px){

    h1{

        font-size:2.6rem;

    }

    h2{

        font-size:2rem;

    }

    .hero-buttons{

        width:100%;

        flex-direction:column;

    }

    .hero-buttons .button{

        width:100%;

    }

    .hero-card{

        border-radius:24px;

    }

    .feature-card{

        padding:2rem;

    }

    .feature-icon{

        width:60px;

        height:60px;

        font-size:1.6rem;

    }

    .waitlist-card{

        padding:2rem 1.5rem;

    }

}

/* ==========================================
   420px
========================================== */

@media (max-width:420px){

    .container{

        width:min(100% - 24px,var(--container));

    }

    h1{

        font-size:2.2rem;

    }

    h2{

        font-size:1.8rem;

    }

    .section-tag{

        font-size:.75rem;

    }

    .hero-card{

        padding:1.5rem;

    }

    .button{

        font-size:.95rem;

    }

    .footer{

        padding:4rem 0;

    }

}