/* RESET */
* {margin:0;padding:0;box-sizing:border-box;font-family:'Poppins',sans-serif;}
a{text-decoration:none;}
ul{list-style:none;}

/* GLOBAL */
.container {width:85%; margin:auto;}
h1,h2,h3,h4,h5,h6{font-weight:600;color:#222;}
p{color:#555;line-height:1.6;}

/* HEADER */
.header {
  min-height:80vh;
  background: linear-gradient(rgba(0,0,0,0.35),rgba(0,0,0,0.35)), url('images/services.jpeg') center/cover no-repeat;
  display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; padding:20px;
}
nav{display:flex; justify-content:space-between; align-items:center; padding:20px 5%; position:absolute; top:0; width:90%; z-index:100;}
.logo{height:80px;width:auto;}
.nav-links ul{display:flex; gap:25px;}
.nav-links ul li a{color:#fff; font-weight:500; transition:0.3s;}
.nav-links ul li a:hover{color:#f44336;}
#menu-btn,#close-btn{display:none; font-size:28px; color:#fff; cursor:pointer;}
.textbox h1{font-size:clamp(32px,5vw,60px); color:#fff; margin-bottom:20px;}
.textbox p{font-size:clamp(14px,2vw,18px); color:#fff; margin-bottom:30px;}
.hero-btn{padding:12px 30px;font-size:16px;color:#fff;border:1px solid #fff;background:transparent;transition:0.3s;}
.hero-btn:hover{background:#f44336;border-color:#f44336;}

/* SERVICES */
.services-section {padding:100px 20px; background:#f8f9fa;}
.section-title{text-align:center;margin-bottom:60px;}
.row{display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:30px;}
.service-box{
  position:relative; height:300px; border-radius:15px; overflow:hidden; box-shadow:0 8px 25px rgba(0,0,0,0.1);
  transition: transform 0.5s ease, box-shadow 0.5s ease; cursor:pointer; background-size:cover; background-position:center;
}
.service-box:hover{transform:scale(1.05); box-shadow:0 15px 40px rgba(0,0,0,0.2);}
.overlay-text{
  position:absolute; bottom:0; left:0; right:0; background:rgba(0,0,0,0.5); color:#fff; padding:20px; text-align:center;
  transition: background 0.3s ease;
}
.service-box:hover .overlay-text{background:rgba(0,0,0,0.6);}
.service-box h3{font-size:20px; margin-bottom:10px; color:#f44336;}
.service-box p{font-size:14px; color:#fff; line-height:1.5;}

/* GALLERY */
.work-gallery{padding:80px 20px;}
.gallery-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:25px;}
.gallery-item{position:relative; overflow:hidden; border-radius:10px;}
.gallery-item img{width:100%; display:block; transition:transform 0.5s ease;}
.gallery-item:hover img{transform:scale(1.1);}
.overlay{position:absolute; bottom:0; left:0; right:0; text-align:center; background:rgba(0,0,0,0.6); color:#fff; padding:12px; font-weight:500; opacity:0; transition:0.3s;}
.gallery-item:hover .overlay{opacity:1;}

/* CTA */
.cta{padding:80px 20px; background:#6b5a5a; text-align:center; border-radius:10px; color:#fff; margin:50px 0;}
.cta h1{margin-bottom:30px;}
.cta .hero-btn{padding:15px 40px; font-size:18px; border-radius:50px; background:#fff; color:#f44336; border:none; transition:0.3s;}
.cta .hero-btn:hover{background:#ffe5e0; transform:scale(1.05);}

/* FOOTER */
.footer{padding:50px 20px; text-align:center; background:#f4f4f4; margin-top:50px;}
.footer h4{margin-bottom:20px;}
.footer p{margin-bottom:20px;color:#555;}
.footer .icons i{font-size:20px;margin:0 10px;color:#f44336;}

/* MEDIA QUERIES */
@media(max-width:900px){.nav-links ul{flex-direction:column; background:#f44336; position:fixed; top:0; right:-250px; width:250px; height:100vh; padding-top:60px; transition:0.3s;}
.nav-links ul.active{right:0;}#menu-btn{display:block;}#close-btn{display:block;}}
@media(max-width:600px){.textbox h1{font-size:28px;}.textbox p{font-size:14px;}.row,.gallery-grid{grid-template-columns:1fr;}}
