/*==========================================
        LAPTOP
==========================================*/

@media(max-width:1200px){

.hero{

    gap:40px;

}

.hero-left h1{

    font-size:60px;

}

.hero-left p{

    font-size:20px;

}

.hero-right img{

    max-width:560px;

}

}


/*==========================================
        TABLET
==========================================*/

@media(max-width:991px){

header{

    flex-direction:column;
    gap:25px;

}

.hero{

    flex-direction:column-reverse;

    text-align:center;

    padding-top:20px;

}

.hero-left{

    display:flex;
    flex-direction:column;
    align-items:center;

}

.hero-left p{

    max-width:650px;

}

.email-box{

    max-width:600px;

}

.mini-features{

    justify-content:center;

}

.footer-container{

    justify-content:center;
    text-align:center;

}

.footer-item{

    width:320px;

}

}


/*==========================================
        MOBILE
==========================================*/

@media(max-width:768px){

.logo img{

    width:180px;

}

.header-right{

    flex-direction:column;

}

.hero-left h1{

    font-size:42px;

}

.hero-left h3{

    font-size:26px;

}

.hero-left p{

    font-size:17px;

}

.email-box{

    flex-direction:column;

    padding:20px;

    border-radius:30px;

}

.email-box i{

    display:none;

}

.email-box input{

    width:100%;

    text-align:center;

    margin-bottom:15px;

}

.email-box button{

    width:100%;

}

.hero-right img{

    max-width:380px;

}

.mini-card{

    width:100%;

}

.footer-social{

    flex-wrap:wrap;
    justify-content:center;

}

}


/*==========================================
        SMALL MOBILE
==========================================*/

@media(max-width:480px){

.container{

    width:92%;

}

.hero-left h1{

    font-size:34px;

}

.hero-left p{

    font-size:16px;

}

.hero-right img{

    max-width:300px;

}

.footer-item{

    flex-direction:column;

}

.footer-item i{

    margin-bottom:10px;

}

}