/* ===============================
   LARGE LAPTOPS
================================ */

@media (max-width: 1400px){

.container{
max-width:1150px;
}

.hero h1{
font-size:95px;
}

.gallery-grid{
grid-template-columns:repeat(3,1fr);
}

.service-container{
grid-template-columns:repeat(2,1fr);
}

}

/* ===============================
   TABLETS
================================ */

@media (max-width:992px){

header{

padding:15px 5%;

}

header.scrolled{

padding:12px 5%;

}

.section{

padding:90px 5%;

}

.about-grid{

grid-template-columns:1fr;

}

.stats-grid{

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

}

.gallery-grid{

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

}

#bookingForm{

grid-template-columns:1fr;

}

.footer-grid{

grid-template-columns:1fr;

text-align:center;

}

.hero h1{

font-size:70px;

}

.hero h2{

font-size:30px;

}

.hero-text{

font-size:18px;

}

.nav-menu{

position:fixed;

top:0;

right:-100%;

width:75%;

height:100vh;

background:#050505;

display:flex;

flex-direction:column;

justify-content:center;

align-items:center;

gap:40px;

transition:.4s;

border-left:1px solid rgba(212,175,55,.2);

}

.nav-menu.active{

right:0;

}

.mobile-menu{

display:block;

}

}

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

@media (max-width:768px){

.hero{

padding:0 5%;

}

.hero-buttons{

flex-direction:column;

align-items:flex-start;

}

.hero h1{

font-size:54px;

}

.hero h2{

font-size:24px;

}

.hero-text{

font-size:16px;

}

.gallery-grid{

grid-template-columns:1fr;

}

.service-container{

grid-template-columns:1fr;

}

.stats-grid{

grid-template-columns:1fr;

}

.about-card{

padding:28px;

}

#bookingForm{

padding:25px;

}

.float-whatsapp{

bottom:85px;

right:15px;

}

.float-book{

bottom:20px;

right:15px;

}

.brand img{

width:115px;

}

.section-heading h2{

font-size:36px;

}

}

/* ===============================
   SMALL PHONES
================================ */

@media (max-width:480px){

.section{

padding:75px 4%;

}

.hero h1{

font-size:42px;

}

.hero h2{

font-size:21px;

}

.hero-text{

font-size:15px;

}

.btn{

width:100%;

justify-content:center;

}

.card-btn{

width:100%;

}

.gallery-item img,

.gallery-item video{

height:260px;

}

#bookingForm input,

#bookingForm select,

#bookingForm textarea{

padding:14px;

}

.booking-price-box p{

font-size:24px;

}

.payment{

padding:20px;

}

.footer-grid{

gap:25px;

}

footer{

padding:50px 4%;

}

}