*{
  margin:0;
  padding:0;
  box-sizing:border-box;
  font-family: Arial, Helvetica, sans-serif;
}

body{
  background:#f4f6f8;
  color:#222;
  line-height:1.6;
}

/* HEADER */
header{
  background:#1f2933;
  position:sticky;
  top:0;
  z-index:999;
}
.nav{
  max-width:1200px;
  margin:auto;
  padding:14px 20px;
  display:flex;
  justify-content:space-between;
  align-items:center;
}
.logo{ height:55px; }
nav a{
  color:#fff;
  text-decoration:none;
  margin-left:22px;
  font-weight:600;
}
nav a:hover{ color:#f59e0b; }

.hero{
  background:url("../assets/hero.jpg") center/cover no-repeat;
  height:70vh;
  width:100%;
}

.hero-overlay{
  background:rgba(0,0,0,0.6);
  width:100%;
  height:100%;
  display:flex;
  align-items:center;
}

.hero-content{
  max-width:1200px;
  margin:auto;
  padding:20px;
  color:#fff;
}

.hero-content h1{
  font-size:44px;
  line-height:1.2;
}

.hero-content p{
  font-size:18px;
  margin-top:12px;
}


/* COMMON */
.section{ padding:70px 20px; }
.container{ max-width:1200px; margin:auto; }
h2{ font-size:32px; margin-bottom:20px; }

/* ABOUT */
.about-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:40px;
}
.about-grid img{
  width:100%;
  border-radius:14px;
}

/* SERVICES */
.services-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:30px;
}
.service-card{
  background:#fff;
  border-radius:16px;
  overflow:hidden;
  box-shadow:0 15px 35px rgba(0,0,0,.15);
}
.service-card img{
  width:100%;
  height:220px;
  object-fit:cover;
}
.service-card h3{ padding:15px 18px 5px; }
.service-card p{ padding:0 18px 18px; font-size:14px; }

/* CONTACT */
.contact-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:40px;
}
.contact-box{
  background:#fff;
  padding:30px;
  border-radius:14px;
}
input,textarea{
  width:100%;
  padding:12px;
  margin-bottom:12px;
  border-radius:6px;
  border:1px solid #ccc;
}
button{
  padding:12px 20px;
  background:#1f2933;
  color:#fff;
  border:none;
  border-radius:6px;
  cursor:pointer;
}

/* FOOTER */
footer{
  background:#111827;
  color:#aaa;
  text-align:center;
  padding:20px;
  margin-top:40px;
}

/* MOBILE */
@media(max-width:768px){
  .about-grid,
  .contact-grid{
    grid-template-columns:1fr;
  }
  .hero h1{ font-size:30px; }
}
/* ===== PAGE HERO ===== */
.page-hero{
  background:url("../assets/hero.jpg") center/cover no-repeat;
  height:35vh;
  position:relative;
}

.page-hero-overlay{
  background:rgba(0,0,0,0.65);
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
}

.page-hero h1{
  color:#fff;
  font-size:42px;
}

/* ===== ABOUT PAGE ===== */
.about-grid{
  display:grid;
  grid-template-columns:1.2fr 1fr;
  gap:50px;
  align-items:flex-start;
}

.about-text h2{
  margin-bottom:15px;
}

.about-text h3{
  margin-top:30px;
}

.about-text ul{
  margin:12px 0 20px 20px;
}

.about-text li{
  margin-bottom:8px;
}

.about-image img{
  width:100%;
  border-radius:18px;
  box-shadow:0 20px 50px rgba(0,0,0,0.25);
}

.founder{
  margin-top:30px;
  font-weight:600;
}

/* ===== RESPONSIVE ===== */
@media(max-width:900px){
  .about-grid{
    grid-template-columns:1fr;
  }
}