/* ================= SERVICE COMMON ================= */

.service-hero{
  background: linear-gradient(135deg,#0d6efd,#084298);
  color:#fff;
  padding:80px 0;
  text-align:center;
}
.service-hero h1{
  font-size:38px;
  font-weight:700;
  margin-bottom:15px;
}
.service-hero p{
  font-size:18px;
  max-width:800px;
  margin:auto;
  opacity:.95;
}

/* ================= OVERVIEW ================= */

.service-overview{
  padding:70px 0;
}
.service-overview h2{
  font-size:30px;
  margin-bottom:15px;
}
.service-overview p{
  font-size:16px;
  color:#555;
}
.service-points{
  margin-top:20px;
}
.service-points li{
  margin-bottom:10px;
  padding-left:22px;
  position:relative;
}
.service-points li::before{
  content:"✔";
  position:absolute;
  left:0;
  color:#0d6efd;
  font-weight:600;
}

/* ================= TECHNOLOGY ================= */

.service-tech{
  background:#f8f9fa;
  padding:60px 0;
}
.tech-grid{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:15px;
  margin-top:30px;
}
.tech-grid span{
  background:#fff;
  padding:10px 18px;
  border-radius:30px;
  box-shadow:0 4px 10px rgba(0,0,0,.08);
  font-size:14px;
}

/* ================= WHY CHOOSE ================= */

.service-why{
  padding:70px 0;
}
.why-box{
  background:#fff;
  border-radius:12px;
  padding:25px;
  box-shadow:0 8px 25px rgba(0,0,0,.08);
  height:100%;
}
.why-box h5{
  margin-bottom:10px;
  font-weight:600;
}
.why-box p{
  font-size:15px;
  color:#555;
}

/* ================= CTA ================= */

.service-cta{
  background:#0d6efd;
  color:#fff;
  padding:70px 0;
}
.service-cta h2{
  font-size:32px;
  margin-bottom:10px;
}
.service-cta p{
  margin-bottom:25px;
  font-size:17px;
}
.service-cta .hero-btn{
  background:#fff;
  color:#0d6efd;
  padding:12px 28px;
  border-radius:30px;
  font-weight:600;
  text-decoration:none;
  margin:5px;
}
.service-cta .hero-btn:hover{
  background:#e9ecef;
}

/* ================= RESPONSIVE ================= */

@media(max-width:768px){
  .service-hero h1{font-size:28px;}
  .service-cta h2{font-size:26px;}
}
