/* responsive.css */

/* =========================
TABLETS / SMALL LAPTOPS
========================= */
@media (max-width: 992px){

.container{
padding:30px 20px;
}

/* HERO */
.intro-hero{
grid-template-columns:1fr;
gap:40px;
}

.intro-hero-content{
text-align:center;
max-width:100%;
}

.intro-cta-group{
justify-content:center;
}

.intro-hero-visual{
height:300px;
}

/* METRICS */
.intro-metrics{
flex-wrap:wrap;
gap:30px;
}

.metric-divider{
display:none;
}

/* VALUES */
.intro-values{
grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
}

/* SERVICES */
.services-list{
grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
}

/* GALLERY */
.gallery-grid{
grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
}

/* ABOUT + CONTACT */
.about-content,
.contact-grid{
grid-template-columns:1fr;
}

}

/* =========================
TABLETS / LARGE PHONES
========================= */
@media (max-width:768px){

/* LOGO */
.brand-name{
font-size:36px;
letter-spacing:4px;
}

/* MENU */
.menu-grid{
grid-template-columns:repeat(auto-fit,minmax(130px,1fr));
gap:15px;
}

.menu-item{
height:135px;
}

.menu-badge{
width:50px;
height:50px;
font-size:18px;
}

/* TITLES */
.section-title{
font-size:28px;
}

/* HERO VISUAL OFF */
.intro-hero-visual{
display:none;
}

/* METRICS */
.intro-metrics{
padding:30px 25px;
}

.metric-value{
font-size:32px;
}

/* SERVICES */
.service-row{
flex-direction:column;
text-align:center;
}

.service-row-icon{
width:100%;
max-width:200px;
height:auto;
}

/* TESTIMONIALS */
.testimonials-grid{
grid-template-columns:1fr;
}

/* HEADER SMALL */
.section-header-small{
position:relative;
top:auto;
left:auto;
margin-bottom:20px;
justify-content:center;
}

/* BACK BUTTON */
.back-btn{
position:relative;
top:auto;
right:auto;
display:block;
width:fit-content;
margin:0 auto 30px;
}

/* CONTENT */
.content-section{
padding-top:20px;
}

/* PRICING */
.promo-price{
font-size:3rem;
}

.promo-card{
padding:30px;
}

/* PROCESS */
.process-steps{
flex-direction:column;
align-items:center;
}

/* STICKY CTA */
.sticky-cta{
position:fixed;
bottom:0;
left:0;
width:100%;
padding:15px;
background:rgba(10,10,18,0.95);
backdrop-filter:blur(10px);
border-top:1px solid rgba(255,255,255,0.1);
z-index:998;
display:flex;
justify-content:center;
}

.sticky-cta .promo-btn{
width:auto;
padding:10px 40px;
font-size:1rem;
margin:0;
}

.full-w-btn{
bottom:90px;
}

}

/* =========================
PHONES
========================= */
@media (max-width:480px){

/* CONTAINER */
.container{
padding:20px 15px;
}

/* LOGO */
.brand-name{
font-size:28px;
letter-spacing:3px;
}

.tagline{
font-size:10px;
letter-spacing:3px;
}

/* MENU */
.menu-grid{
grid-template-columns:repeat(auto-fit,minmax(120px,1fr));
gap:12px;
}

.menu-item{
height:120px;
}

.menu-badge{
width:45px;
height:45px;
font-size:16px;
}

.menu-title{
font-size:10px;
letter-spacing:2px;
}

/* HERO */
.intro-subtext{
font-size:15px;
}

/* CTA */
.intro-cta-group{
flex-direction:column;
align-items:center;
}

.intro-cta-primary,
.intro-cta-secondary{
width:100%;
max-width:250px;
text-align:center;
}

/* METRICS */
.intro-metrics{
flex-direction:column;
gap:25px;
}

.metric-value{
font-size:36px;
}

/* GALLERY */
.gallery-grid{
grid-template-columns:1fr;
}

/* TABS */
.tab-buttons{
flex-direction:column;
align-items:center;
}

.tab-btn{
width:100%;
max-width:250px;
}
}