/* ================================== title page ======================= */
    /*--------------------------------------------------------------
# Global Page Titles & Breadcrumbs
--------------------------------------------------------------*/
/* title page Section */
.title-page {
  position: relative;
  background: linear-gradient(rgba(0,105,192,0.6), rgba(0,196,140,0.6)), 
              url('img/service-1.jpg') center/cover no-repeat;
  height: 25vh;
  color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
}
.title-page h1 {
  font-size: 3rem;
  font-weight: 700;
  text-shadow: 0 3px 6px rgba(0,0,0,0.3);
}
 
/*--------------------------------------------------------------
# Global Sections
--------------------------------------------------------------*/
section,
.section {
  color: var(--default-color);
  background-color: var(--background-color);
  padding: 60px 0;
  scroll-margin-top: 90px;
  overflow: clip;
}

@media (max-width: 1199px) {

  section,
  .section {
    scroll-margin-top: 76px;
  }
}

/*============================== ABOUT PAGE ====================================*/

  :root{
    --soft-blue: #e8f4ff;
    --primary: #0b6fb7;
    --muted: #6c757d;
    --max-width: 1180px;
  }

  /* PAGE HEADER */
  .about-hero{
    min-height: 260px;
    padding: 2.25rem 0;
    background: linear-gradient(180deg, #ffffff 0%, var(--soft-blue) 100%);
    position: relative;
  }
  .about-hero-bg{
    position:absolute; inset:0;
    background: linear-gradient(180deg, rgba(11,111,183,0.06), rgba(11,111,183,0.04));
    pointer-events:none;
  }
  .about-hero .hero-inner { z-index:2; }
  .about-hero h1 { color: #073b64; font-size: clamp(1.6rem, 2.6vw, 2.25rem); }
  .about-hero p { color: #557a95; }

  /* WHO WE ARE */
  .who-we-are { background: #fff; }
  .dormant-layer {
    position:absolute; inset:0; z-index:0;
    background: url('img/dormant-pattern.png') center/cover;
    opacity: 0.04; pointer-events:none;
  }
  .who-slide {
    height: 420px;
    background-size: cover;
    background-position: center;
    transition: transform .8s ease;
    /* soft fade on edges so it blends into white background */
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, black 8%, black 92%, transparent 100%);
    mask-image: linear-gradient(90deg, transparent 0%, black 8%, black 92%, transparent 100%);
  }
  @media (min-width: 992px){
    .who-slide { height: 520px; }
  }
  .about-text { z-index: 2; }

  /* SERVICES */
  .services-section { background: linear-gradient(180deg,#ffffff,#f7fbff); }
  .service-card .service-img{
    height:180px; object-fit:cover; display:block; width:100%;
    border-top-left-radius: .5rem; border-top-right-radius: .5rem;
  }
  .service-card .card-body { padding: 1.1rem; }

  /* WHY CHOOSE */
  .bg-softblue { background: linear-gradient(180deg,#f0f8ff,#ffffff); }
  .feature-card i { font-size: 28px; }
  .features-list li { margin-bottom: .6rem; color: var(--muted); }

  /* STORY */
  .story-img { height: 220px; background-size:cover; background-position:center; }

  /* FINAL CTA */
  .final-cta { background: linear-gradient(90deg, rgba(11,111,183,0.06), rgba(11,111,183,0.02)); }

  /* hover + responsive niceties */
  .service-card:hover { transform: translateY(-6px); transition: all .25s ease; }
  .feature-card:hover { transform: translateY(-4px); transition: all .25s ease; }

  @media (max-width: 767.98px) {
    .who-slide{ height: 280px; -webkit-mask-image:none; mask-image:none; }
    .about-hero { padding: 1.6rem 0; min-height: 220px; }
  }