
.service-det-banner{
  padding: 50px 0px;
  background: #FFF
  
}
.service-det-banner h1{
  font-size: 70px;
  font-weight: 700;
  
  line-height: 70px;
  padding-bottom: 10px;
}
.service-det-banner h2{ font-size: 20px; line-height: 36px; padding-bottom: 10px; padding-top: 0px;}
.ctcprimery {
  background: #1A73E8;
  color: #FFF;
  font-weight: 600;
  border-radius: 5px;
}
.ctcprimery a {
  color: #FFF;
  display: block;
  text-decoration: none;
  padding: 10px 20px;
}
.ctcsecondry {
  border: 1px solid #1A73E8;
  color: #1A73E8;
  font-weight: 600;
  margin-right: 10px;
  border-radius: 5px;
}
.ctcsecondry a {
  color: #1A73E8;
  display: block;
  text-decoration: none;
  padding: 10px 20px;
}
.service-short-det{  padding: 50px 0; background: #f6faff;}
/* Equal-height cards via flex column */
.sub-ser-list .row > [class*="col-"] {
  display: flex;
}
/* Flex column only for service box containers */
.sub-ser-list .row > [class*="col-"]:has(.sub-service-box) {
  flex-direction: column;
}
/* Flex column for heading container */
.sub-ser-list .row.justify-content-center > [class*="col-"] {
  flex-direction: column;
}
.sub-service-box {
  background: #FFF;
  padding: 35px;
  border-radius: 10px;
  margin-bottom: 30px;
  border: 1px solid #ccc;
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
}
.sub-service-box h4 {
  font-size: 22px;
  font-weight: 600;
  color: #000;
  margin-bottom: 10px;
  text-align: left;
}
/* Uniform icon size for sub-service cards */
.sub-service-box img {
  width: 46px;
  height: 46px;
  object-fit: contain;
  margin-bottom: 18px;
  display: block;
}
/* Bootstrap Icons for sub-service cards */
.sub-service-box i.bi {
  font-size: 46px;
  color: #1A73E8;
  margin-bottom: 18px;
  display: block;
}

/* Equal-height cards via flex column */
.ser-det-why .row > [class*="col-"] {
  display: flex;
}
/* Flex column only for why-choose box containers */
.ser-det-why .row > [class*="col-"]:has(.why-choo-box) {
  flex-direction: column;
}
/* Flex column for heading container */
.ser-det-why .row.justify-content-center > [class*="col-"] {
  flex-direction: column;
}
.why-choo-box {
  background: #FFF;
  padding: 35px;
  border-radius: 10px;
  margin-bottom: 30px;
  border: 1px solid #f7f1f1;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  height: 100%;
}
.why-choo-box h3 {
  font-size: 20px !important;
  font-weight: 600 !important;
  color: #000;
  margin-bottom: 10px;
  text-align: center;
}
/* Blue circular background container for why-choose icons */
.why-choo-box center {
  background: #1A73E8;
  border-radius: 50%;
  width: 80px;
  height: 80px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 14px;
}
/* White icon inside blue circle for why-choose cards */
.why-choo-box img {
  width: 40px;
  height: 40px;
  object-fit: contain;
  display: block;
  filter: brightness(0) invert(1);
  margin: 0;
}
.service-short-det h2 {
     font-size: 38px;
    font-weight: 700;
    padding-bottom: 20px;   /* reduced a bit for balance */
    text-align: center;
    
  
}
.service-short-det p {
     font-size: 18px;
    font-weight:500;    
    text-align: center;  
}

.service-short-det span{font-size: 16px;
    font-weight: 400;}
.s-list{padding-top: 80px;}
.s-list h3{font-size: 28px;
  font-weight: 700;
  padding-bottom: 10px;
  text-align: left;
  color: #333;}
  .sub-ser-list{padding: 50px 0px; }
  .sub-ser-list h2{  font-size: 38px;
    font-weight: 700;
    text-align: center;
    display: block;
    margin-bottom: 10px;
   }
    .sub-ser-list h3 {
        font-size: 18px;
    padding-bottom: 40px;
    text-align: center;
    font-weight: 300;
    display: block;
}
.ser-det-why{padding: 50px 0px; background: #f6faff;}
.ser-det-why h2{  font-size: 38px;
    font-weight: 700;
    padding-bottom: 0px;
    margin-bottom: 10px;
    text-align: center;
    display: block;
    }
    .ser-det-why h3 {
        font-size: 18px;
    padding-bottom: 40px;
    text-align: center;
    font-weight: 300;
    display: block;
}
.ser-det-why-cta{ width: 405px; display: block;margin: 0px auto;background: #1A73E8;
    color: #FFF;
    font-weight: 600;
    border-radius: 5px;}
.ser-det-why-cta a{ color: #FFF;
    display: block;
    text-decoration: none;
    padding: 10px 20px; text-align: center;}
.our-works-det{padding: 50px 0px; background: #FFF;}
.our-works-det h2 {
    font-size: 38px;
    font-weight: 700;
    padding-bottom: 40px;
    text-align: center;
}
.api{padding: 50px 0px; }
.api h2 {
    font-size: 38px;
    font-weight: 700;
    padding-bottom: 0px;
    text-align: center;
}
.api p {
    font-size: 18px;
    
    padding-bottom: 40px;
    text-align: center;
}
.allctabut {
  border: 1px solid #1A73E8;
  color: #1A73E8;
  font-weight: 600;
  margin-right: 10px;
  border-radius: 5px;
  width: auto;
  display: inline-block;
}
.allctabut a {
  color: #1A73E8;
  display: block;
  text-decoration: none;
  padding: 10px 20px;
}
.ser-det-calltoaction {
    padding: 150px 0px;
   background: url(../images/service-bottom-banner.jpg) no-repeat top center;
}
.ser-det-calltoaction h2 {
    font-size: 50px;
    font-weight: 700;
    padding-bottom: 10px;
    text-align: center;
    color: #FFF;
}
.ser-det-calltoaction h2 span{color: #5698fb;  }
.ser-det-calltoaction h3{color: #FFF; font-size: 20px; text-align: center; padding-bottom: 30px;}

.ser-talk-button1{color: #FFF;
    background: #0d6efd;
    text-decoration: none;
    padding: 10px 20px;
    border-radius: 5px;
    font-weight: 600;
    border: solid 1px #0d6efd; }
.ser-talk-button2{color: #FFF; background:transparent; text-decoration: none; padding: 10px 20px;border-radius: 5px; font-weight: 600;border: solid 1px #FFF; margin-left: 20px; }
@media (max-width: 768px) {

  /* Hero Section */
  .service-banner {
    padding: 30px 15px;
    text-align: center;
  }
  .service-banner h1 {
    font-size: 32px;
    line-height: 42px;
    padding-right: 0;
    padding-bottom: 20px;
  }

  /* Primary & Secondary Buttons */
  .ctcprimery a, .ctcsecondry a, .allctabut a {
    font-size: 16px;
    padding: 12px 20px;
  }
  .ctcprimery, .ctcsecondry, .allctabut {
    width: 100%;
    margin-bottom: 10px;
    display: block;
    text-align: center;
  }

  /* Service Listing */
  .s-list h3 {
    font-size: 20px;
    font-weight: 600;
    padding-bottom:8px;
    color: #333;
    text-align: center;
  }
  .service-listing-area {
    padding: 50px 0;
  }
  .service-box {
    padding: 20px;
    margin-bottom: 20px;
    text-align: center;
  }
  .service-box h4 {
    font-size: 18px;
    text-align: center;
  }

  /* Section Headings */
  .service-listing-area h2,
  .ser-why-choose h2,
  .our-works h2,
  .api h2 {
    font-size: 26px;
    line-height: 34px;
    padding-bottom: 20px;
  }

  /* Why Choose Us */
  .ser-why-choose {
    padding: 30px 15px;
    background: #0d6efd;
    color: #FFF;
  }
  .ser-why-choose li {
    font-size: 14px;
    padding-left: 57px;
    margin-right: 0;
    line-height: 22px;
  }
  .ser-why-choose h3 {color: #FFF;}

  /* CTA Section */
  .ser-cta1 {
    padding: 30px 15px;
  }
  .ser-cta1-box {
    height: auto !important; /* override desktop height */
    padding: 40px 20px;
    text-align: center;
  }
  .ser-cta1-box h2 {
    font-size: 26px;
    padding-top: 0;
    line-height: 34px;
  }
  .ser-cta1-box a {
    width: 100%;
    font-size: 18px;
    margin-top: 20px;
  }
  .ser-cta1-box-img-left,
  .ser-cta1-box-img-right {
    display: none; /* hide side images for clean mobile look */
  }

  /* API Section */
  .api p {
    font-size: 16px;
    padding: 0 10px 30px;
    line-height: 24px;
  }
}

/* ===== Side Enquiry Form ===== */
.side-enquiry-form {
    background: #fff;
    border: 1px solid #dde8fb;
    border-radius: 12px;
    padding: 30px 25px;
    box-shadow: 0 4px 24px rgba(26,115,232,0.08);
}
.side-enquiry-form h4 {
    font-size: 20px;
    font-weight: 700;
    color: #1A73E8;
    margin-bottom: 20px;
    text-align: center;
    border-bottom: 2px solid #e8f0fe;
    padding-bottom: 12px;
}
.side-enquiry-form .form-group {
    margin-bottom: 14px;
}
.side-enquiry-form .form-control {
    width: 100%;
    padding: 10px 14px;
    font-size: 14px;
    border: 1px solid #cdd8ea;
    border-radius: 6px;
    color: #333;
    background: #f9fbff;
    outline: none;
    transition: border-color 0.2s;
    box-sizing: border-box;
}
.side-enquiry-form .form-control:focus {
    border-color: #1A73E8;
    background: #fff;
}
.side-enquiry-form select.form-control {
    appearance: none;
    -webkit-appearance: none;
    cursor: pointer;
}
.side-enquiry-form textarea.form-control {
    resize: vertical;
    min-height: 80px;
}
.side-form-submit {
    display: block;
    width: 100%;
    padding: 12px;
    background: #1A73E8;
    color: #fff;
    font-size: 15px;
    font-weight: 600;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    text-align: center;
    transition: background 0.2s;
    letter-spacing: 0.3px;
}
.side-form-submit:hover {
    background: #1558b0;
}

/* Mobile adjustments */
@media (max-width: 768px) {
    .side-enquiry-form {
        margin-top: 30px;
        padding: 24px 18px;
    }
    .service-det-banner h1 {
        font-size: 34px;
        line-height: 42px;
    }
    .service-det-banner h2 {
        font-size: 16px;
        line-height: 26px;
    }
    .ser-det-calltoaction {
        padding: 60px 15px;
    }
    .ser-det-calltoaction h2 {
        font-size: 28px;
    }
    .ser-talk-button1, .ser-talk-button2 {
        display: block;
        width: 100%;
        text-align: center;
        margin: 8px 0;
    }
    .ser-det-why-cta {
        width: 100%;
    }
    .sub-service-box, .why-choo-box {
        padding: 20px;
    }
}

