/* ==========================================================
   RESPONSIVE
   CBK TEKNİK
========================================================== */


/* 1400px */

@media(max-width:1400px){

.container{

max-width:1140px;

}

.hero-left h1{

font-size:3.1rem;

}

}



/* 1200px */

@media(max-width:1200px){

.hero-grid{

grid-template-columns:1fr;

text-align:center;

}

.hero-left{

order:2;

}

.hero-right{

order:1;

max-width:650px;

margin:auto;

}

.hero-features{

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

}

.about-grid{

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

}

.service-grid{

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

}

.brand-grid{

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

}

.areas-grid{

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

}

.footer-grid{

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

}

.contact-grid{

grid-template-columns:1fr;

}

}



/* 992px */

@media(max-width:992px){

.header{

padding:15px 0;

}

.header .container{

height:auto;

flex-wrap:wrap;

gap:20px;

}

nav{

width:100%;

}

nav ul{

justify-content:center;

flex-wrap:wrap;

gap:20px;

}

.header-buttons{

justify-content:center;

width:100%;

}

.section{

padding:80px 0;

}

.section-title h2{

font-size:2.2rem;

}

.hero{

padding-top:150px;

}

.hero-left h1{

font-size:2.7rem;

}

.stats-grid{

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

}

.why-grid{

grid-template-columns:1fr;

}

}



/* 768px */

@media(max-width:768px){

.section{

padding:70px 0;

}

.hero-left h1{

font-size:2.2rem;

}

.hero-left p{

font-size:1rem;

}

.hero-buttons{

flex-direction:column;

}

.primary-btn,

.secondary-btn{

width:100%;

}

.hero-features{

grid-template-columns:1fr;

}

.about-grid{

grid-template-columns:1fr;

}

.service-grid{

grid-template-columns:1fr;

}

.brand-grid{

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

}

.areas-grid{

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

}

.footer-grid{

grid-template-columns:1fr;

}

.logo h2{

font-size:1.2rem;

}

.logo span{

font-size:.75rem;

}

.section-title h2{

font-size:2rem;

}

.contact-form{

padding:30px;

}

.contact-info{

padding:30px;

}

.map-box{

height:320px;

}

}



/* 576px */

@media(max-width:576px){

.container{

padding:0 18px;

}

.hero{

padding-top:135px;

}

.hero-left h1{

font-size:1.9rem;

}

.section-title h2{

font-size:1.7rem;

}

.call-btn,

.whatsapp-btn{

padding:12px 18px;

font-size:.9rem;

}

.hero-badge{

font-size:.85rem;

padding:10px 18px;

}

.brand-item{

padding:18px;

font-size:.95rem;

}

.floating-call,

.floating-whatsapp{

width:55px;

height:55px;

}

.back-to-top{

width:50px;

height:50px;

}

}



/* 400px */

@media(max-width:400px){

.hero-left h1{

font-size:1.7rem;

}

.brand-grid{

grid-template-columns:1fr;

}

.areas-grid{

grid-template-columns:1fr;

}

.stats-grid{

grid-template-columns:1fr;

}

nav ul{

gap:12px;

}

nav ul li a{

font-size:.9rem;

}

}