/* =========================
1100PX
========================= */

@media(max-width:1100px){

.hero{
min-height:auto;

padding-top:140px;
padding-bottom:80px;
}

.hero-wrapper{
gap:50px;
align-items:center;
}

.about-grid,
.contact-grid,
.pricing-grid,
.services-grid,
.feature-grid,
.footer-grid{
gap:30px;
}

}

/* =========================
992PX
========================= */

@media(max-width:992px){

/* CONTAINER */

.container{
padding:0 24px;
}

/* NAVBAR */

.navbar{
height:74px;
}

/* LEFT */

.nav-left{
display:flex;
align-items:center;
gap:16px;
}

/* LOGO */

.site-logo{
height:34px;
}

/* TOGGLE */

.menu-toggle{
display:flex;
}

/* BUTTON */

.nav-btn{
display:none;
}

/* WHATSAPP */

.nav-icon{
display:flex;

width:42px;
height:42px;

align-items:center;
justify-content:center;

flex-shrink:0;
}

/* MOBILE MENU */

.nav-menu{
position:fixed;

top:74px;
left:-100%;

width:270px;
height:calc(100vh - 74px);

padding:40px 28px;

display:flex;
flex-direction:column;
align-items:flex-start;

gap:28px;

background:
linear-gradient(
180deg,
#07111f,
#091a31
);

backdrop-filter:blur(18px);

border-right:
1px solid rgba(255,255,255,0.06);

transition:0.4s ease;

z-index:998;
}

/* ACTIVE */

.nav-menu.active{
left:0;
}

/* LINKS */

.nav-menu a{
font-size:17px;
font-weight:600;
}

/* GRID */

.hero-wrapper,
.about-grid,
.contact-grid,
.pricing-grid,
.services-grid,
.feature-grid,
.footer-grid{
grid-template-columns:1fr 1fr;
}

/* HERO */

.hero{
padding-top:140px;
padding-bottom:90px;
}

/* PRICING */

.featured{
transform:scale(1);
}

}

/* =========================
768PX
========================= */

@media(max-width:768px){

/* CONTAINER */

.container{
padding:0 20px;
}

/* NAVBAR */

.navbar{
height:70px;
}

/* LOGO */

.site-logo{
height:32px;
}

/* MENU */

.nav-menu{
top:70px;

width:260px;
height:calc(100vh - 70px);

padding:36px 24px;

gap:24px;
}

.nav-menu a{
font-size:16px;
}

/* GRID */

.hero-wrapper,
.about-grid,
.contact-grid,
.pricing-grid,
.services-grid,
.feature-grid,
.footer-grid,
.gallery-grid{
grid-template-columns:1fr;
}

/* HERO */

.hero{
padding-top:120px;
padding-bottom:70px;
}

.hero-content{
text-align:center;
}

.hero-content p{
margin-inline:auto;
}

.hero-buttons{
justify-content:center;
}

/* SECTION */

.section{
padding:80px 0;
}

/* TESTIMONIAL */

.testimonial-card{
min-width:280px;
}

}

/* =========================
480PX
========================= */

@media(max-width:480px){

/* CONTAINER */

.container{
padding:0 18px;
}

/* NAVBAR */

.navbar{
height:68px;
}

/* LEFT */

.nav-left{
gap:14px;
}

/* LOGO */

.site-logo{
height:32px;
}

/* TOGGLE */

.menu-toggle{
width:38px;
height:38px;
}

.menu-toggle span{
left:9px;

width:20px;
}

/* MENU */

.nav-menu{
top:68px;

width:240px;
height:calc(100vh - 68px);

padding:34px 22px;

gap:22px;
}

.nav-menu a{
font-size:15px;
}

/* WHATSAPP */

.nav-icon{
width:40px;
height:40px;

border-radius:10px;
}

/* HERO */

.hero{
padding-top:105px;
padding-bottom:60px;
}

.hero-content h1{
line-height:1.15;
}

/* BUTTON */

.btn{
width:100%;
}

/* CARDS */

.glass-card,
.service-card,
.pricing-card,
.contact-form,
.testimonial-card{
padding:24px;
}

/* ANALYTICS */

.analytics-grid{
grid-template-columns:1fr;
}

.large-card{
grid-column:span 1;
}

/* FOOTER */

.footer-grid{
gap:30px;
}

}