:root {
            --brand: #01a6b7;
            --brand-dark: #008d9d;
            --navy: #102542;
            --text: #596979;
            --light: #f4fbfc;
            --aqua-light: #e8f8fa;
            --line: #dcecef;
            --white: #ffffff;
        }



.our-services-section {
  padding: 50px 0;
  background: #03466e;
}

/* Section Heading */
.services-heading {
  max-width: 700px;
  margin: 0 auto 60px;
  text-align: center;
}

.services-heading > span {
  display: inline-block;
  margin-bottom: 10px;
  color: var(--brand-primary);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
}

.services-heading h2 {
  margin: 0 0 14px;
  color: var(--brand-dark);
 
  line-height: 1.2;
}

.services-heading p {
  margin: 0;
  color: var(--text-muted);
 text-align:justify!important;
}

/* Zigzag Row */
.service-zigzag-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: stretch;
  min-height: 190px;
  margin-bottom: 10px;
  overflow: hidden;
  background: var(--white);
  border: 1px solid var(--border-color);
  border-radius: 18px;
  box-shadow: 0 10px 30px rgba(3, 70, 110, 0.07);
}

/* Image Left, Text Right */
.service-zigzag-image {
  min-height: 190px;
  overflow: hidden;
  background: var(--brand-dark);
}

.service-zigzag-image img {
  display: block;
  width: 100%;
  height: 100%;


}

.service-zigzag-row:hover .service-zigzag-image img {
  
}

/* Text Area */
.service-zigzag-content {
  display: flex;
  flex-direction: column;

  padding: 30px;
  margin-top: 0px;

  border-left: 5px solid var(--brand-primary);
}

.service-zigzag-content small {
  display: inline-block;
  margin-bottom: 15px;
  color: var(--brand-primary);


  letter-spacing: 2px;
}

.service-zigzag-content h3 {
  max-width: 510px;
  margin: 0 0 17px;
  color: var(--brand-dark);
  font-size: 26px;
 

  line-height: 1.25;
}

.service-zigzag-content p {
 
  margin: 0 0 13px;
 
 
  
}

/* Text Link */
.service-read-more {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  width: fit-content;
  color: #01a6b7;
  border-bottom: 2px solid var(--brand-primary);
  font-size: 18px;
 
  text-decoration: none;
  transition: 0.3s ease;
}

.service-read-more span {
  color: var(--brand-primary);

  line-height: 1;
  transition: transform 0.3s ease;
}

.service-read-more:hover {
  color: var(--brand-primary);
}

.service-read-more:hover span {
  transform: translateX(6px);
}

/* Reverse Row: Text Left, Image Right */
.service-zigzag-row.reverse-row {
  grid-template-areas: "content image";
}

.service-zigzag-row.reverse-row .service-zigzag-image {
  grid-area: image;
}

.service-zigzag-row.reverse-row .service-zigzag-content {
  grid-area: content;
  border-right: 5px solid var(--brand-primary);
  border-left: 0;
}

/* Responsive Design */
@media (max-width: 767px) {
  .our-services-section {
    padding: 50px 0;
  }

  .services-heading {
    margin-bottom: 40px;
  }

  .service-zigzag-row,
  .service-zigzag-row.reverse-row {
    display: flex;
    flex-direction: column;
    min-height: auto;
    margin-bottom: 10px;
  }

  .service-zigzag-image,
  .service-zigzag-image img {
    width: 100%;
   
   
  }

  .service-zigzag-content,
  .service-zigzag-row.reverse-row .service-zigzag-content {
    padding: 30px 13px;
    border-top: 4px solid var(--brand-primary);
    border-right: 0;
    border-left: 0;
  }

  .service-zigzag-content h3 {
    font-size: 25px;
  }

  .service-zigzag-content p {
   
   
  }
}

       

        .section-space {
            padding: 42px 0;
            padding-bottom: 50px;
        }

        .eyebrow {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            color: var(--brand-dark);
            font-size: 12px;
            font-weight: 800;
            letter-spacing: 1.5px;
            text-transform: uppercase;
            margin-bottom: 7px;
        }

        .eyebrow::before {
            content: "";
            width: 30px;
            height: 3px;
            border-radius: 10px;
            background: var(--brand);
        }

        .section-title {
            font-size:32px;
            margin-bottom: 10px;

        }

        .section-text {
            max-width: 820px;
        }

        .btn-brand {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            color: var(--white);
            background: var(--brand);
            border: 2px solid var(--brand);
            border-radius: 5px;
            padding: 12px 23px;
            text-transform: uppercase;
         
            font-weight: 700;
            transition: 0.3s ease;
        }

        .btn-brand:hover {
            color: var(--white);
            background: var(--brand-dark);
            border-color: var(--brand-dark);
            transform: translateY(-3px);
            box-shadow: 0 12px 25px rgba(1, 166, 183, 0.22);
        }

        .btn-light-outline {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            color: var(--navy);
            border: 2px solid var(--navy);
            border-radius: 5px;
            padding: 10px 22px;
            font-size: 14px;
            font-weight: 800;
            transition: 0.3s ease;
        }

        .btn-light-outline:hover {
            color: var(--white);
            background: var(--navy);
            transform: translateY(-3px);
        }

       
        /* Compact Light Hero */
        .hero {
            position: relative;
            padding: 45px 0 45px;
            overflow: hidden;
            background:
                radial-gradient(circle at 90% 15%, rgba(1, 166, 183, 0.14), transparent 25%),
                linear-gradient(135deg, #ffffff, #f2fbfc);
        }

        .hero::before {
            content: "";
            position: absolute;
            width: 330px;
            height: 330px;
            right: -120px;
            bottom: -140px;
            border: 35px solid rgba(1, 166, 183, 0.07);
            border-radius: 50%;
        }

        .hero-content {
            position: relative;
            z-index: 2;
        }

        .hero h1 {
            max-width: 750px;
            font-size: clamp(38px, 5vw, 64px);
            letter-spacing: -1.8px;
            margin-bottom: 20px;
        }

        .hero h1 span {
            color: var(--brand);
        }

        .hero-description {
           
           
            margin-bottom: 27px;
        }

        .hero-actions {
            display: flex;
            flex-wrap: wrap;
            gap: 13px;
        }

        .hero-panel {
            position: relative;
            min-height: 350px;
            padding: 24px;
            background: var(--white);
            border: 1px solid var(--line);
            border-radius: 18px;
            box-shadow: 0 18px 50px rgba(16, 37, 66, 0.10);
        }

        .hero-image {
            height: 100%;
            min-height: 300px;
            border-radius: 13px;
            background:
                linear-gradient(rgba(1, 166, 183, 0.08), rgba(16, 37, 66, 0.10)),
                url("https://images.unsplash.com/photo-1581092160607-ee22621dd758?auto=format&fit=crop&w=1000&q=85")
                center/cover;
        }

        .floating-info {
            position: absolute;
            left: -28px;
            bottom: 35px;
            max-width: 220px;
            padding: 16px;
            color: var(--navy);
            background: var(--white);
            border-left: 4px solid var(--brand);
            border-radius: 8px;
            box-shadow: 0 12px 30px rgba(16, 37, 66, 0.15);
            font-size: 13px;
            font-weight: 800;
        }

        .floating-info i {
            color: var(--brand);
            font-size: 24px;
            display: block;
            margin-bottom: 4px;
        }

        /* Intro */
        .intro {
            background: var(--white);
        }

        .intro-box {
            padding: 35px;
            background: var(--aqua-light);
            border-radius: 15px;
            border: 1px solid rgba(1, 166, 183, 0.15);
        }

        .intro-box p:last-child {
            margin-bottom: 0;
        }

        .number-card {
            height: 100%;
            padding: 28px;
            background: var(--white);
            border: 1px solid var(--line);
            border-radius: 13px;
            transition: 0.3s ease;
        }

        .number-card:hover {
            transform: translateY(-6px);
            box-shadow: 0 15px 35px rgba(16, 37, 66, 0.09);
        }

        .number {
            color: var(--brand);
            font-size: 42px;
            font-weight: 800;
            line-height: 1;
            margin-bottom: 12px;
        }

        .number-card h3 {
            font-size: 18px;
            margin-bottom: 8px;
        }

        .number-card p {
            margin-bottom: 0;
            font-size: 14px;
        }

        /* Services */
        .services {
            background: var(--light);
        }

        .service-card {
            height: 100%;
            padding: 30px 25px;
            background: var(--white);
            border: 1px solid var(--line);
            border-radius: 13px;
            transition: 0.35s ease;
        }

        .service-card:hover {
            border-color: var(--brand);
            transform: translateY(-8px);
            box-shadow: 0 18px 35px rgba(1, 166, 183, 0.13);
        }

        .service-icon {
            width: 58px;
            height: 58px;
            display: grid;
            place-items: center;
            color: var(--white);
            background: var(--brand);
            border-radius: 12px;
            font-size: 25px;
            margin-bottom: 22px;
        }

        .service-card h3 {
            font-size: 19px;
            margin-bottom: 12px;
        }

        .service-card p {
            margin: 0;
            font-size: 14px;
        }

        /* Benefits */
        .benefits {
            background: var(--white);
        }

        .benefit-wrap {
            padding: 35px;
            background: var(--navy);
            border-radius: 16px;
            color: rgba(255, 255, 255, 0.78);
        }

        .benefit-wrap h2,
        .benefit-wrap h3 {
            color: var(--white);
        }

        .benefit-wrap p {
            color: rgba(255, 255, 255, 0.75);
        }

        .benefit-item {
            display: flex;
            align-items: center;
            gap: 12px;
            padding: 11px 0;
            border-bottom: 1px solid rgba(255, 255, 255, 0.14);
            font-size: 14px;
            font-weight: 700;
        }

        .benefit-item i {
            color: #72e8ef;
            font-size: 18px;
        }

        .benefit-image {
            min-height: 410px;
            border-radius: 16px;
            background:
                linear-gradient(rgba(1, 166, 183, 0.10), rgba(16, 37, 66, 0.12)),
                url("https://images.unsplash.com/photo-1581091226825-a6a2a5aee158?auto=format&fit=crop&w=1100&q=85")
                center/cover;
        }

        /* Industries */
        .industries {
            background: #eef0f4;
        }

        .industry-card {
            height: 100%;
            padding: 35px 15px;
            text-align: center;
            background: var(--white);
            border: 1px solid var(--line);
            border-radius: 12px;
            transition: 0.3s ease;
        }

       

        .industry-card i {
            display: block;
            color: var(--brand);
            font-size: 40px;
            margin-bottom: 9px;
        }

      
        .industry-card h4 {
            font-size: 18px;
            margin: 0;
        }

        /* FAQ */
        .faq {
            background: var(--white);
        }

        .accordion-item {
            margin-bottom: 12px;
            border: 1px solid var(--line);
            border-radius: 8px !important;
            overflow: hidden;
        }

        .accordion-button {
            color: var(--navy);
            padding: 19px 22px;
           font-size: 20px;
           font-weight: 600;
            box-shadow: none !important;
        }

        .accordion-button:not(.collapsed) {
            color: var(--brand-dark);
            background: var(--aqua-light);
        }

       

        /* CTA */
        .cta {
            padding: 65px 0;
            background:
                radial-gradient(circle at 10% 20%, rgba(255,255,255,0.22), transparent 18%),
                linear-gradient(120deg, #01a6b7, #008d9d);
        }

        .cta h2 {
            color: var(--white);
            font-size: clamp(30px, 4vw, 48px);
        }

        .cta p {
            max-width: 780px;
            margin: 0 auto 26px;
            color: rgba(255,255,255,0.9);
        }

        .cta .btn {
            color: var(--navy);
            background: var(--white);
            border: 2px solid var(--white);
            padding: 13px 25px;
            border-radius: 5px;
            font-weight: 800;
        }

        .cta .btn:hover {
            color: var(--white);
            background: transparent;
        }



        @media (max-width: 991px) {
            .nav-link {
                margin-left: 0;
                padding: 9px 0;
            }

            .hero {
                padding: 58px 0 75px;
            }

            .floating-info {
                left: 18px;
            }
        }

        @media (max-width: 575px) {
            .section-space {
                padding: 55px 0;
            }

            .hero h1 {
                font-size: 39px;
            }

            .hero-panel {
                padding: 14px;
            }

            .floating-info {
                left: 10px;
                bottom: 22px;
            }

            .intro-box,
            .benefit-wrap {
                padding: 25px;
            }
        }