/* TABLET DEVICES */

@media(max-width:992px){

.container{
width:92%;
}


nav{
gap:15px;
}


.hero h1{

font-size:42px;

}


.grid{

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

}


.two-column{

grid-template-columns:1fr;

}


.about-box{

margin-top:30px;

}


}





/* MOBILE DEVICES */

@media(max-width:768px){


.header{

position:relative;

}


.nav-container{

flex-direction:column;
height:auto;
padding:20px 0;
gap:20px;

}


nav{

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

}


.logo{

font-size:24px;

}


.hero{

height:75vh;

}


.hero h1{

font-size:32px;

}


.hero p{

font-size:16px;

}


.hero-buttons{

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

}



.btn{

padding:10px 20px;

}



.grid{

grid-template-columns:1fr;

}



.section{

padding:50px 0;

}



h2{

font-size:30px;

}



.about-box{

grid-template-columns:1fr;

}



.package-card{

padding:25px;

}


}




/* SMALL MOBILE */

@media(max-width:480px){


nav a{

font-size:14px;

}


.hero h1{

font-size:27px;

}


.logo{

font-size:21px;

}


.service-card i{

font-size:35px;

}


}