@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&display=swap');
body {
      font-family: 'Lato', sans-serif;
      font-weight: 400;
    }
    h1,h2,h3,h4,h5,h6{
      font-family: 'Lato', sans-serif;
      font-weight:900!important;
    }
    h1{
      font-size: 40px;
    }
      h2{
      font-size: 30px;
    }
      h3{
      font-size: 25px;
    }
      h4{
      font-size: 20px;
    }
      h5{
      font-size: 18px;
    }
    p{
      margin-top: 20px;
      font-size: 18px;
    }
    /* Topbar */
    .topbar {
      background: #111;
      color: #fff;
      font-size: 17px;
      padding: 15px 0;
    }
    .topbar a {
      color: #fff;
      text-decoration: none;
      margin: 0 10px;
    }
a{
    
    text-decoration:none!important;
}
    /* Hide elements on mobile */
    @media (max-width: 772px) {
      .topbar {
        display: none !important;
      }
    }

    /* Navbar */
    .navbar {
      /* padding: 0; */
    }
    .navbar-nav .nav-link {
      margin: 0 5px;
      font-weight: 600;
      text-transform: uppercase;
      font-size: 15px;
      color: #000;
    }
    .navbar-nav .nav-link.active {
      color: #005c88;
    }
    .btn-quote {
      background: #005c88;
      color: #fafafa;
      border-radius: 5px;
      padding: 6px 18px;
      transition: 0.3s;
    }
    .btn-quote:hover {
      background: #069ac7;
      color: #fff;
    }
  /* Hover dropdown show */
  @media (min-width: 992px) {
    .navbar .dropdown:hover .dropdown-menu {
      display: block;
      margin-top: 0; /* fix dropdown jump */
    }
  }

  /* Dropdown styling */
  .dropdown-menu {
    background: #111 !important;
    border: none;
  }

  .dropdown-menu .dropdown-item {
    font-size: 16px;
    color: #fff !important;
    text-transform: uppercase;
  }

  .dropdown-menu .dropdown-item:hover {
    background-color: #005c88 !important;
  }

.nav-item.dropdown .dropdown-toggle::after {
  margin-left: 6px;   /* text aur caret ke beech gap */
  float: none;        /* right side chipakne se rokta hai */
  vertical-align: middle;
}
    /* Hero Section */
    .hero {
      background: url(../img/banner.png) center / cover no-repeat fixed;
    min-height: 100vh;
    position: relative;
    display: flex
;
    align-items: center;
   
    }
    .hero-overlay {
      background: rgba(0, 0, 0, 0.5);
      position: absolute;
      top: 0; left: 0;
      width: 100%;
      height: 100%;
    }
    .hero-content {
      position: relative;
      z-index: 2;
    }
    .hero h1 {
      font-size: 65px;
      font-weight: 600;
      text-transform: uppercase;
    }
    .hero h1 em {
      font-style: italic;
    }
    .hero p {
      font-size: 20px;
      margin-top: 15px;
      line-height: 1.6;
    }

     /* Form */
    .hero .card {
      text-align: center;
      border: none;
      background: #ffffffed;
      border-radius: 10px;
      box-shadow: 0 4px 10px rgba(0,0,0,0.2);
    }
    .hero .btn-discovery {
      background: #005c88;
      color: #fff;
      font-weight: 500;
    }
    .hero .btn-discovery:hover {
      background: #008bb6;
    }

    @media (max-width: 991px) {
      .hero {
        height: auto;
        padding: 60px 0;
      }
      .hero h1 {
        font-size: 32px;
      }
    }

      /* Hero Section */
    .hero-ab {
      background: url(../img/about.jpg) center / cover no-repeat fixed;
    min-height: 100vh;
    position: relative;
    display: flex
;
    align-items: center;
   
    }
    .hero-overlay-ab {
      background: rgba(0, 0, 0, 0.5);
      position: absolute;
      top: 0; left: 0;
      width: 100%;
      height: 100%;
    }
    .hero-content-ab {
      position: relative;
      z-index: 2;
    }
    .hero-ab h1 {
      font-size: 46px;
      /* font-weight: 600; */
    }
    .hero-ab h1 em {
      font-style: italic;
    }
    .hero-ab p {
      font-size: 20px;
      margin-top: 15px;
      line-height: 1.6;
    }
     /* Form */
    .hero-ab .card {
      text-align: center;
      border: none;
      background: #ffffffed;
      border-radius: 10px;
      box-shadow: 0 4px 10px rgba(0,0,0,0.2);
    }
    .hero-ab .btn-discovery {
      background: #005c88;
      color: #fff;
      font-weight: 500;
    }
    .hero-ab .btn-discovery:hover {
      background: #008bb6;
    }

    @media (max-width: 991px) {
      .hero-ab{
        height: auto;
        padding: 60px 0;
      }
      .hero-ab h1 {
        font-size: 32px;
      }
    }

     /* Hero Section */
    .hero-ga {
      background: url(../img/gallery-banner.png) center / cover no-repeat fixed;
    min-height: 100vh;
    position: relative;
    display: flex
;
    align-items: center;
   
    }
    .hero-overlay-ga {
      background: rgba(0, 0, 0, 0.5);
      position: absolute;
      top: 0; left: 0;
      width: 100%;
      height: 100%;
    }
    .hero-content-ga {
      position: relative;
      z-index: 2;
    }
    .hero-ga h1 {
      font-size: 46px;
      /* font-weight: 600; */
    }
    .hero-ga h1 em {
      font-style: italic;
    }
    .hero-ga p {
      font-size: 20px;
      margin-top: 15px;
      line-height: 1.6;
    }
     /* Form */
    .hero-ga .card {
      text-align: center;
      border: none;
      background: #ffffffed;
      border-radius: 10px;
      box-shadow: 0 4px 10px rgba(0,0,0,0.2);
    }
    .hero-ga .btn-discovery {
      background: #005c88;
      color: #fff;
      font-weight: 500;
    }
    .hero-ga .btn-discovery:hover {
      background: #008bb6;
    }

    @media (max-width: 991px) {
      .hero-ga{
        height: auto;
        padding: 60px 0;
      }
      .hero-ga h1 {
        font-size: 32px;
      }
    }

      /* Hero Section */
    .hero-rs {
      background: url(../img/residential-pool-banner.jpeg) center / cover no-repeat fixed;
    min-height: 100vh;
    position: relative;
    display: flex
;
    align-items: center;
   
    }
    .hero-overlay-rs {
      background: rgba(0, 0, 0, 0.5);
      position: absolute;
      top: 0; left: 0;
      width: 100%;
      height: 100%;
    }
    .hero-content-rs {
      position: relative;
      z-index: 2;
    }
    .hero-rs h1 {
      font-size: 46px;
      /* font-weight: 600; */
    }
    .hero-rs h1 em {
      font-style: italic;
    }
    .hero-rs p {
      font-size: 20px;
      margin-top: 15px;
      line-height: 1.6;
    }
    /* Form */
    .hero-rs .card {
      text-align: center;
      border: none;
      background: #ffffffed;
      border-radius: 10px;
      box-shadow: 0 4px 10px rgba(0,0,0,0.2);
    }
    .hero-rs .btn-discovery {
      background: #005c88;
      color: #fff;
      font-weight: 500;
    }
    .hero-rs .btn-discovery:hover {
      background: #008bb6;
    }

    @media (max-width: 991px) {
      .hero-rs {
        height: auto;
        padding: 60px 0;
      }
      .hero-rs h1 {
        font-size: 32px;
      }
    }


   /* Hero Section */
    .hero-ou {
      background: url(../img/outdoor-banner.jpg) center / cover no-repeat fixed;
    min-height: 100vh;
    position: relative;
    display: flex
;
    align-items: center;
   
    }
    .hero-overlay-ou {
      background: rgba(0, 0, 0, 0.5);
      position: absolute;
      top: 0; left: 0;
      width: 100%;
      height: 100%;
    }
    .hero-content-ou {
      position: relative;
      z-index: 2;
    }
    .hero-ou h1 {
      font-size: 46px;
      /* font-weight: 600; */
    }
    .hero-ou h1 em {
      font-style: italic;
    }
    .hero-ou p {
      font-size: 20px;
      margin-top: 15px;
      line-height: 1.6;
    }
    /* Form */
    .hero-ou .card {
      text-align: center;
      border: none;
      background: #ffffffed;
      border-radius: 10px;
      box-shadow: 0 4px 10px rgba(0,0,0,0.2);
    }
    .hero-ou .btn-discovery {
      background: #005c88;
      color: #fff;
      font-weight: 500;
    }
    .hero-ou .btn-discovery:hover {
      background: #008bb6;
    }

    @media (max-width: 991px) {
      .hero-rs {
        height: auto;
        padding: 60px 0;
      }
      .hero-rs h1 {
        font-size: 32px;
      }
    }


    /* Hero Section */
    .hero-fb {
      background: url(../img/finance-banner.jpg) center / cover no-repeat fixed;
    min-height: 100vh;
    position: relative;
    display: flex
;
    align-items: center;
   
    }
    .hero-overlay-fb {
      background: rgb(0 0 0 / 73%);
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
    }
    .hero-content-fb {
      position: relative;
      z-index: 2;
    }
    .hero-fb h1 {
      font-size: 46px;
      /* font-weight: 600; */
    }
    .hero-fb h1 em {
      font-style: italic;
    }
    .hero-fb p {
      font-size: 20px;
      margin-top: 15px;
      line-height: 1.6;
    }
    /* Form */
    .hero-fb .card {
      text-align: center;
      border: none;
      background: #ffffffed;
      border-radius: 10px;
      box-shadow: 0 4px 10px rgba(0,0,0,0.2);
    }
    .hero-fb .btn-discovery {
      background: #005c88;
      color: #fff;
      font-weight: 500;
    }
    .hero-fb .btn-discovery:hover {
      background: #008bb6;
    }

    @media (max-width: 991px) {
      .hero-fb {
        height: auto;
        padding: 60px 0;
      }
      .hero-fb h1 {
        font-size: 32px;
      }
    }


       /* Hero Section */
    .hero-va {
      background: url(../img/rs-banner.webp) center / cover no-repeat fixed;
    min-height: 100vh;
    position: relative;
    display: flex
;
    align-items: center;
   
    }
    .hero-overlay-va {
      background: rgba(0, 0, 0, 0.5);
      position: absolute;
      top: 0; left: 0;
      width: 100%;
      height: 100%;
    }
    .hero-content-va {
      position: relative;
      z-index: 2;
    }
    .hero-va h1 {
      font-size: 46px;
      /* font-weight: 600; */
    }
    .hero-va h1 em {
      font-style: italic;
    }
    .hero-va p {
      font-size: 20px;
      margin-top: 15px;
      line-height: 1.6;
    }
    /* Form */
    .hero-va .card {
      text-align: center;
      border: none;
      background: #ffffffed;
      border-radius: 10px;
      box-shadow: 0 4px 10px rgba(0,0,0,0.2);
    }
    .hero-va .btn-discovery {
      background: #005c88;
      color: #fff;
      font-weight: 500;
    }
    .hero-va .btn-discovery:hover {
      background: #008bb6;
    }

    @media (max-width: 991px) {
      .hero-va {
        height: auto;
        padding: 60px 0;
      }
      .hero-va h1 {
        font-size: 32px;
      }
    }

  /* Hero Section */
    .hero-co {
      background: url(../img/contact.png) center / cover no-repeat fixed;
    min-height: 100vh;
    position: relative;
    display: flex
;
    align-items: center;
   
    }
    .hero-overlay-co {
      background: rgba(0, 0, 0, 0.5);
      position: absolute;
      top: 0; left: 0;
      width: 100%;
      height: 100%;
    }
    .hero-content-co {
      position: relative;
      z-index: 2;
    }
    .hero-co h1 {
      font-size: 46px;
      /* font-weight: 600; */
    }
    .hero-co h1 em {
      font-style: italic;
    }
    .hero-co p {
      font-size: 20px;
      margin-top: 15px;
      line-height: 1.6;
    }
    /* Form */
    .hero-co .card {
      text-align: center;
      border: none;
      background: #ffffffed;
      border-radius: 10px;
      box-shadow: 0 4px 10px rgba(0,0,0,0.2);
    }
    .hero-co .btn-discovery {
      background: #005c88;
      color: #fff;
      font-weight: 500;
    }
    .hero-co .btn-discovery:hover {
      background: #008bb6;
    }

    @media (max-width: 991px) {
      .hero-co {
        height: auto;
        padding: 60px 0;
      }
      .hero-co h1 {
        font-size: 32px;
      }
    }

    /* Hero Section */
    .hero-sa {
      background: url(../img/comm1.jpg) center / cover no-repeat fixed;
    min-height: 100vh;
    position: relative;
    display: flex
;
    align-items: center;
   
    }
    .hero-overlay-sa {
      background: rgba(0, 0, 0, 0.5);
      position: absolute;
      top: 0; left: 0;
      width: 100%;
      height: 100%;
    }
    .hero-content-sa {
      position: relative;
      z-index: 2;
    }
    .hero-sa h1 {
      font-size: 46px;
      /* font-weight: 600; */
    }
    .hero-sa h1 em {
      font-style: italic;
    }
    .hero-sa p {
      font-size: 20px;
      margin-top: 15px;
      line-height: 1.6;
    }
    /* Form */
    .hero-sa .card {
      text-align: center;
      border: none;
      background: #ffffffed;
      border-radius: 10px;
      box-shadow: 0 4px 10px rgba(0,0,0,0.2);
    }
    .hero-sa .btn-discovery {
      background: #005c88;
      color: #fff;
      font-weight: 500;
    }
    .hero-sa .btn-discovery:hover {
      background: #008bb6;
    }

    @media (max-width: 991px) {
      .hero-sa {
        height: auto;
        padding: 60px 0;
      }
      .hero-sa h1 {
        font-size: 32px;
      }
    }

    .awards h2 em {
    font-style: italic;
    color: #000;
  }
  .awards .line {
    width: 260px;
    height: 2px;
    background: #005c88;
  }

  /* Circle Container */
  .award-box {
    background: #f7f7f7;
    border-radius: 50%;
    height: 200px;
    width: 200px;
    border: 1px solid #e3e3e3;
    margin: 0 auto;
    /* box-shadow: 0 0 12px rgba(0,0,0,0.08); */
    padding: 25px; /* spacing inside circle */
    display: flex;
    align-items: center;
    justify-content: center;
  }

  /* Image fit */
  .award-box img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
  }

  /* Responsive */
  @media (max-width: 767px) {
    .award-box {
      height: 160px;
      width: 160px;
      padding: 18px;
    }
  }
     .section-title {
      /* font-size: 2rem; */
      /* font-weight: 600; */
    }
    .section-title span {
      font-style: italic;
      font-weight: 400;
    }
    .underline {
      width: 300px;
      height: 2px;
      background-color: #005c88;
      margin: 12px 0 24px;
    }
    .custom-card {
      position: relative;
      border-radius: 12px;
      overflow: hidden;
      background: #f8f9fa;
      height: 100%;
    }
    .custom-card img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
    }
    .card-overlay {
      position: absolute;
      bottom: 0;
      left: 0;
      width: 100%;
      background: rgba(255,255,255,0.9);
      padding: 12px 16px;
      font-weight: 500;
      font-size: 1.1rem;
    }
    .arrow-btn {
      position: absolute;
      top: 12px;
      right: 12px;
      width: 32px;
      height: 32px;
      border-radius: 50%;
      background: white;
      display: flex;
      align-items: center;
      justify-content: center;
      box-shadow: 0 2px 8px rgba(0,0,0,0.15);
      cursor: pointer;
    }
    .arrow-btn:hover {
      background: #005c88;
      color: #fff;
    }
    @media (max-width: 991px) {
      .custom-card {
        margin-bottom: 20px;
      }
    }
    .hero-section {
      background: url(../img/bg-pool.png) no-repeat center center/cover;
      border-radius: 12px;
      position: relative;
      overflow: hidden;
      padding: 80px 20px;
    }

    .hero-card {
      background: rgba(255, 255, 255, 0.95);
      border-radius: 12px;
      box-shadow: 0 6px 20px rgba(0, 0, 0, 0.15);
      max-width: 800px;
      margin: auto;
      text-align: center;
      padding: 40px 30px;
    }

    .hero-card h2 {
      /* font-weight: 600; */
      margin-bottom: 15px;
    }

    .hero-card h2 em {
      font-style: italic;
      font-weight: 500;
    }

    .underline2 {
      width: 280px;
      height: 2px;
      background: #005c88;
      margin: 0 auto 20px auto;
    }

    .hero-card p {
      color: #333;
      font-size: 18px;
      margin-bottom: 20px;
    }

    .hero-card strong {
      display: block;
      font-size: 18px;
      margin: 20px 0;
    }

    .btn-custom {
      background: #005c88;
      color: #fff;
      padding: 12px 28px;
      font-weight: 500;
      border-radius: 6px;
      border: none;
      transition: 0.3s;
    }

    .btn-custom:hover {
      background: #008bbf;
    }

    .btn-custom i {
      margin-left: 6px;
      transition: 0.3s;
    }

    .btn-custom:hover i {
      margin-left: 12px;
    }
    .section-title h2 {
      /* font-weight: 600; */
      /* margin-bottom: 10px; */
    }
    .section-title em {
      /* font-style: italic; */
      color: #000000;
    }
    .underline3 {
      width: 300px;
      height: 2px;
      background: #005c88;
      margin: 0;
      margin-top: 8px;
    }
    .video-wrapper {
      position: relative;
      display: inline-block;
      width: 100%;
      border-radius: 10px;
      overflow: hidden;
      margin-top: 20px;
    }
    .video-wrapper img {
      width: 100%;
      display: block;
      border-radius: 10px;
    }
    .play-btn {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      font-size: 60px;
      color: #ff0000;
      opacity: 0.9;
      transition: 0.3s;
    }
    .play-btn:hover {
      opacity: 1;
      transform: translate(-50%, -50%) scale(1.1);
    }

        .livingwell-section {
      position: relative;
      background: url(../img/bg-pool2.png) no-repeat center center/cover;
      padding: 80px 50px;
      border-radius: 15px;
      overflow: hidden;
    }
    .livingwell-overlay {
      background: rgba(255, 255, 255, 0.92);
      border-radius: 15px;
      padding: 40px 30px;
    }
    .livingwell-title {
      font-weight: 500;
      text-align: center;
      margin-bottom: 10px;
    }
    .livingwell-title em {
      font-style: italic;
      /* font-weight: 600; */
    }
    .livingwell-underline {
      width: 230px;
      height: 2px;
      background: #005c88;
      margin: 10px auto 30px;
    }
    .livingwell-box {
      text-align: center;
      padding: 15px;
    }
    .livingwell-number {
      font-size: 50px;
      font-weight: 300;
      color: #005c88;
      font-style: italic;
      margin-bottom: 15px;
    }
    .livingwell-heading {
    
      margin-bottom: 10px;
    }
    .livingwell-text {
      font-size: 18px;
      color: #333;
    }


      /* Header */
    .slider-header {
      display:flex;
      justify-content:space-between;
      align-items:center;
      margin-bottom:15px;
    }
    .slider-header h2 {
      /* font-size:28px; */
      /* font-weight:600; */
    }
    .slider-header h2 span {font-style:italic;}
    .line {
      width:100px;height:2px;background:#005c88;margin-top:8px;
    }

    /* Buttons */
    .nav-buttons {
      display:flex;
      gap:10px;
      margin-left: -32px;
    }
    .nav-buttons button {
      background:#fff;
      border:1px solid #ddd;
      border-radius:6px;
      padding:8px 12px;
      cursor:pointer;
      transition:.3s;
    }
    .nav-buttons button:hover {
      background:#005c88;
      color:#fff;
      border-color:#005c88;
    }

  /* Slider */
.slider-container {
  position:relative;
  overflow: hidden!important; /* allow half card visible */
  max-width: 100%;
  padding-left: 120px;
}
.slider-wrapper {
  display:flex;
  transition:transform .6s ease;
}
.card {
  border: none;
  flex: 0 0 27.33%; /* 3 cards visible */
  padding-right: 10px;
  position:relative;
}
.card img {
  width:100%;
  height:400px;      /* fixed height */
  border-radius:12px;
  display:block;
  object-fit:cover;  /* important: fit properly */
}


    /* Card Content Hover */
    .card-content {
      position:absolute;
      bottom:0;left:0;
      width:100%;
      padding:12px;
      background:rgba(255,255,255,.9);
      border-radius:0 0 12px 12px;
      opacity:0;
      transform:translateY(100%);
      transition:.3s;
    }
    .card:hover .card-content {
      opacity:1;
      transform:translateY(0);
    }
    .card-content h3 {font-size:18px;font-weight:600;}
    .card-content p {font-size:14px;color:#333;margin-top:4px;}

    /* Responsive */
    @media(max-width:1024px){
      .card {flex:0 0 50%;} /* 2 cards */
    }
    @media(max-width:600px){
      .card {flex:0 0 100%;/* height:280px; */} /* 1 card + half */
        .slider-container {
  position:relative;
  overflow: hidden!important; /* allow half card visible */
  max-width: 100%;
  padding-left: 10px;
}
    }

  .testimonial-card {
    background: #f8f9fa;
    border-radius: 10px;
    padding: 25px;
    text-align: center;
    height: 100%;
  }
  .testimonial-stars {
    color: #ffc107;
    font-size: 1.2rem;
    margin-bottom: 15px;
  }
  .testimonial-text {
    font-size: 18px;
    color: #333;
    min-height: 80px;
  }
  .testimonial-profile img {
    width: 50px;
    height: 50px;
    object-fit: cover;
    border-radius: 50%;
  }
  .testimonial-name {
    font-weight: 600;
    margin: 0;
  }
  .testimonial-location {
    font-size: 0.9rem;
    color: #666;
  }
 
  
  /* Header */
.team-header {
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:15px;
}
.team-header h2 {
  /* font-size:28px; */
  /* font-weight:600; */
}
.team-header h2 span {font-style:italic;}
.underline-team {
  width: 150px;
  height:2px;
  background:#005c88;
  margin-top:8px;
}

/* Buttons */
.team-nav {
  display:flex;
  gap:10px;
  margin-left: -32px;
}
.team-nav button {
  background:#fff;
  border:1px solid #ddd;
  border-radius:6px;
  padding:8px 12px;
  cursor:pointer;
  transition:.3s;
}
.team-nav button:hover {
  background:#005c88;
  color:#fff;
  border-color:#005c88;
}

/* Slider */
.team-slider {
  position:relative;
  overflow: hidden!important;
  max-width: 100%;
  padding-left: 120px;
}
.team-wrapper {
  display:flex;
  transition:transform .6s ease;
}
.team-card {
  border: none;
  flex: 0 0 27.33%; /* 3 cards visible */
  padding-right: 10px;
  text-align: left;
}
.team-card img {
  width:100%;
  height:400px;
  border-radius:12px;
  display:block;
  object-fit:cover;
}

/* Info Always Visible */
.team-info {
  padding:10px 2px;
}
.team-info h3 {
  font-size:18px;
  font-weight:600;
}
.team-info p {
  font-size:14px;
  color:#333;
  margin-top:2px;
}

/* Responsive */
@media(max-width:1024px){
  .team-card {flex:0 0 50%;}
}
@media(max-width:600px){
  .team-card {flex:0 0 100%;height:auto;}
  .team-card img{height:280px;}
  .team-slider {
  position:relative;
  overflow: hidden!important;
  max-width: 100%;
  padding-left: 10px;
}
}
.lead{
  font-size: 20px;
  font-weight: 400;
}


    footer {
      background-color: #111;
      color: #fff;
      padding: 70px 0 20px;
      font-size: 15px;
    }
    footer .footer-logo img {
      max-width: 160px;
      margin-bottom: 15px;
    }
    footer p {
      margin: 0;
    }
    footer ul {
      list-style: none;
      padding: 0;
      margin: 0;
    }
    footer ul li {
      margin-bottom: 15px;
    }
    footer ul li a {
      color: #fff;
      text-decoration: none;
      transition: 0.3s;
    }
    footer ul li a:hover {
      color: #ccc;
    }
    .footer-bottom {
      border-top: 1px solid #444;
      margin-top: 30px;
      padding: 20px 0px;
      font-size: 14px;
      text-align: center;
    }
    .social-icons a {
      display: inline-block;
      margin-left: 15px;
      color: #fff;
      font-size: 18px;
      transition: 0.3s;
    }
    .social-icons a:hover {
      color: #ccc;
    }
    /* Card styling */
.feature-box {
  background-color: #f7f7f7;
  border-radius: 12px;
  transition: box-shadow 0.3s ease;
}

.feature-box:hover {
  box-shadow: 0 8px 20px rgba(0,0,0,0.1);
}
/* Hero background */


/* Process card */
.process-card {
  background: #fff;
}

.step-text {
  font-weight: 600;
  font-size: 14px;
}

/* Credentials badge */
.badge-box {
  text-align: center;
  max-width: 180px;
}


/* HERO */
.hero2{
  background:url(../img/tamp.png) center/cover no-repeat fixed;
  min-height:650px;position:relative;display:flex;align-items:center;
}
.hero2:after{content:'';position:absolute;inset:0;background:rgba(0,0,0,0.35);z-index:1;}
.overlay-content{position:relative;z-index:2;width:100%;padding-top: 20px;padding-bottom:80px;}
.hero-text2 h2{color:#fff;/* font-size:50px; */line-height:1.2;font-weight:400;}
.hero-text2 p{color: #ffffff;font-size:19px;font-weight: 400!important;max-width:600px;margin-top:15px;}
.form-box2{box-shadow:0 6px 20px rgba(0,0,0,0.25);background: #00000070 !important;}

/* RESPONSIVE */
@media (max-width:768px){
  .hero-text2 h2{font-size:36px;margin-top: 100px;text-align:center;}
  .hero-text2 p{text-align:center;}
 
}

.financing-sec2{
  background:url(../img/credential.png) center/cover no-repeat;
  min-height: 760px;
  display:flex;
  justify-content:center;
  align-items:center;
}
.financing-card2{
  background:#ffffffeb;
  max-width:700px;
  padding:50px 60px;
  text-align:center;
  border-radius:6px;
}
.financing-card2 h2{
  font-size:32px;
  font-weight:500;
}
.financing-card2 h2 span{font-style:italic; font-weight:600;}
.finance-btn{
  background:#24b4d5;border:none;color:#fff;padding:14px 34px;
  border-radius:4px;font-weight:500;margin-top:25px;
}
.finance-btn:hover{background:#1891ab;}

.contact-title {
  /* font-size: 28px; */
  /* font-weight: 600; */
}
.contact-title em {
  font-style: italic;
}
.contact-underline {
  width: 200px;
  height: 2px;
  background: #005c88;
  margin-top: 8px;
}

.contact-section iframe {
  margin-top: 10px;
}
/* Header */
.step-header {
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:15px;
}
.step-header h2 {
  /* font-size:28px; */
  /* font-weight:600; */
}
.step-header h2 span {font-style:italic;}
.underline-step {
  width: 300px;
  height:2px;
  background:#005c88;
  margin-top:8px;
}

/* Buttons */
.step-nav {
  display:flex;
  gap:10px;
  margin-left: -32px;
}
.step-nav button {
  background:#fff;
  border:1px solid #ddd;
  border-radius:6px;
  padding:8px 12px;
  cursor:pointer;
  transition:.3s;
}
.step-nav button:hover {
  background:#005c88;
  color:#fff;
  border-color:#005c88;
}

/* Slider */
.step-slider {
  position:relative;
  overflow: hidden!important;
  max-width: 100%;
  padding-left: 120px;
}
.step-wrapper {
  display:flex;
  transition:transform .6s ease;
}
.step-card {
  border: none;
  flex: 0 0 27.33%; /* 3 cards visible */
  padding-right: 10px;
  text-align: left;
}
.step-info {
  padding:20px;
  border: 1px solid #f1f1f1;
  border-radius:12px;
  background:#fff;
  height: 100%;
  box-shadow: 0 2px 6px rgb(0 0 0 / 7%);
}
.step-info h3 {
  font-size: 25px;
  /* font-weight:600; */
}
.step-info p {
  /* font-size:14px; */
  /* color:#333; */
  margin-top:6px;
}
.step-text {
  display:block;
  text-align:right;
  font-size: 20px;
  font-weight: 400;
  margin-top:10px;
  color:#005c88;
}

/* Responsive */
@media(max-width:1024px){
  .step-card {flex:0 0 50%;}
}
@media(max-width:600px){
  .step-card {flex:0 0 100%;height:auto;}
  .step-slider {
    position:relative;
    overflow: hidden!important;
    max-width: 100%;
    padding-left: 10px;
  }
}
.form-box{
  background: #ffffffd4;
}
  /* Indicators bottom center */
  .carousel-indicators {
    position: static;   /* default se remove kar diya */
    margin-top: 25px;   /* cards ke niche gap */
  }
  .carousel-indicators [data-bs-target] {
    background-color: #005c88;
    width: 8px;
    height: 8px;
    border-radius: 50%;
  }
  .carousel-indicators .active {
    background-color: #005c88;
    opacity: 1;
  }
  .rad{
    border-radius: 10px;
    
  }
  .acc{
    background: #f8f9fa;
   
  }
  .accordion-item {
    border: none;
    background-color: #f8f9fa!important;
    border-bottom: 1px solid #ddd;
}
      .accordion-button {
      font-weight: 600;
     background: #f8f9fa;
      box-shadow: none !important;
    }
    .accordion-button:not(.collapsed) {
      color: #000;
      background-color: #fff;
    }
    .accordion-body {
      font-size: 15px;
      color: #333;
    }
    .accordion-button:not(.collapsed) {
    color: #000;
    background-color: #f8f9fa;
}
    .accordion-item {
      border: none;
      border-bottom: 1px solid #ddd;
    }
      label {
      font-size: 14px;
      margin-bottom: 5px;
      display: block;
      color: #333;
    }
    input {
      width: 100%;
      padding: 10px;
      margin-bottom: 15px;
      border: 1px solid #ddd;
      border-radius: 6px;
      font-size: 14px;
    }
    
    .result {
      margin-top: 15px;
      text-align: center;
      font-size: 18px;
      font-weight: bold;
      color: #444;
    }
    .example-card {
      background: #fff;
      border-radius: 8px;
      padding: 20px;
      margin-bottom: 15px;
      border: 1px solid #eee;
      box-shadow: 0 1px 4px rgba(0,0,0,0.05);
    }
    .example-card strong {
      display: block;
      margin-bottom: 8px;
      font-size: 16px;
    }
    .example-card span {
      display: block;
      font-size: 14px;
      color: #ffffff;
      margin-bottom: 5px;
    }
    .example-card .price {
      font-size: 18px;
      font-weight: bold;
      color: #000;
    }
    /* 5 equal columns custom class */
  .col-5th {
    flex: 0 0 20%;
    max-width: 20%;
  }

  @media (max-width: 992px) {
    .col-5th {
      flex: 0 0 50%;
      max-width: 50%;
    }
  }

  @media (max-width: 576px) {
    .col-5th {
      flex: 0 0 100%;
      max-width: 100%;
    }
  }
  .filter-buttons {
      text-align: center;
      margin-bottom: 25px;
    }
    .filter-buttons button {
      border: 1px solid #ccc;
      background: #fff;
      padding: 10px 18px;
      margin: 5px;
      border-radius: 6px;
      cursor: pointer;
      transition: all 0.3s ease;
    }
    .filter-buttons button.active,
    .filter-buttons button:hover {
      background: #03a9f4;
      color: #fff;
      border-color: #03a9f4;
    }
    .gallery {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
      gap: 15px;
    }
     .gallery img {
  width: 100%;
  height: 250px;      
  object-fit: cover; 
  border-radius: 10px;
  cursor: pointer;
  transition: transform 0.3s;
}

    .gallery img:hover {
      transform: scale(1.05);
    }
@media (max-width: 768px) {
  .gallery img {
    height: 180px;  
  }
}

    /* Lightbox */
    .lightbox {
      display: none;
      position: fixed;
      z-index: 1000;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: rgba(0,0,0,0.8);
      justify-content: center;
      align-items: center;
    }
    .lightbox img {
      max-width: 90%;
      max-height: 80%;
      border-radius: 10px;
    }
    .lightbox .close, .lightbox .prev, .lightbox .next {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      font-size: 40px;
      color: #fff;
      background: rgba(0,0,0,0.6);
      padding: 1px 20px;
      /* border-radius: 50%; */
      cursor: pointer;
      user-select: none;
    }
    .lightbox .close {
      top: 120px;
      right: 30px;
      transform: none;
    }
    .lightbox .prev { left: 30px; }
    .lightbox .next { right: 30px; }

    .sticky-top {
    
    z-index: 100!important;
}
  .youtube-section {
    position: relative;
    width: 100%;
    height: 100vh; /* ÃƒÂ Ã‚Â¤Ã‚ÂªÃƒÂ Ã‚Â¥Ã¢â‚¬Å¡ÃƒÂ Ã‚Â¤Ã‚Â°ÃƒÂ Ã‚Â¥Ã¢â€šÂ¬ ÃƒÂ Ã‚Â¤Ã‚Â¸ÃƒÂ Ã‚Â¥Ã‚ÂÃƒÂ Ã‚Â¤Ã¢â‚¬Â¢ÃƒÂ Ã‚Â¥Ã‚ÂÃƒÂ Ã‚Â¤Ã‚Â°ÃƒÂ Ã‚Â¥Ã¢â€šÂ¬ÃƒÂ Ã‚Â¤Ã‚Â¨ ÃƒÂ Ã‚Â¤Ã¢â‚¬Â¢ÃƒÂ Ã‚Â¥Ã¢â€šÂ¬ ÃƒÂ Ã‚Â¤Ã…Â ÃƒÂ Ã‚Â¤Ã‚ÂÃƒÂ Ã‚Â¤Ã…Â¡ÃƒÂ Ã‚Â¤Ã‚Â¾ÃƒÂ Ã‚Â¤Ã‹â€  */
    overflow: hidden;
    margin: 0;
    padding: 0;
  }

  .youtube-placeholder {
    width: 100%;
    height: 100%;
    background: url("https://img.youtube.com/vi/fn2HRl-uSxE/maxresdefault.jpg") center center / cover no-repeat;
    cursor: pointer;
    position: relative;
  }

  .youtube-placeholder::before {
    content: "";
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background: rgba(0,0,0,0.2); /* ÃƒÂ Ã‚Â¤Ã‚Â¹ÃƒÂ Ã‚Â¤Ã‚Â²ÃƒÂ Ã‚Â¥Ã‚ÂÃƒÂ Ã‚Â¤Ã¢â‚¬Â¢ÃƒÂ Ã‚Â¥Ã¢â€šÂ¬ ÃƒÂ Ã‚Â¤Ã‚Â¡ÃƒÂ Ã‚Â¤Ã‚Â¾ÃƒÂ Ã‚Â¤Ã‚Â°ÃƒÂ Ã‚Â¥Ã‚ÂÃƒÂ Ã‚Â¤Ã¢â‚¬Â¢ ÃƒÂ Ã‚Â¤Ã¢â‚¬Å“ÃƒÂ Ã‚Â¤Ã‚ÂµÃƒÂ Ã‚Â¤Ã‚Â°ÃƒÂ Ã‚Â¤Ã‚Â²ÃƒÂ Ã‚Â¥Ã¢â‚¬Â¡ */
  }

  .youtube-placeholder .play-button {
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    width: 90px;
    height: 80px;
    background: url("https://img.icons8.com/ios-filled/100/ffffff/play-button-circled.png") no-repeat center center;
    background-size: contain;
    z-index: 2;
  }

  .youtube-iframe {
    position: absolute;
    top: 0; left: 0;
    width: 100%;
    height: 100%;
    border: none;
  }
  .blog-area {
  background-color: #fff;
}

.blog-heading {
  font-size: 2.5rem;
  font-weight: 700;
  line-height: 1.2;
}
.blog-heading span {
  color: #189da1;
}
.blog-divider {
  width: 80px;
  height: 4px;
  background: #189da1;
  margin-top: 10px;
  border-radius: 2px;
}

.blog-intro {
  color: #555;
  font-size: 1rem;
  line-height: 1.6;
}

/* Blog Card Styles */
.blog-item {
  position: relative;
  overflow: hidden;
  border-radius: 12px;
  box-shadow: 0 4px 15px rgba(0,0,0,0.1);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.blog-item:hover {
  transform: translateY(-6px);
  box-shadow: 0 8px 25px rgba(0,0,0,0.15);
}

.blog-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.blog-content {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0,0,0,0.55);
  color: #fff;
  padding: 20px;
  transition: background 0.3s ease;
}
.blog-item:hover .blog-content {
  background: rgba(0,0,0,0.75);
}

.blog-meta {
  font-size: 0.9rem;
  color: #ddd;
  margin-bottom: 5px;
}
.blog-title {
  margin: 0 0 10px;
  font-weight: 600;
  color: #fff;
}
.blog-btn {
  color: #189da1;
  font-weight: 600;
  text-decoration: none;
  transition: color 0.3s ease;
}
.blog-btn:hover {
  color: #fff;
}

/* Layout tweaks for large vs small cards */
.blog-large {
  height: 100%;
}
.blog-small {
  height: 48%;
}
.pool-loan-cta {
  padding: 80px 20px;
  background: linear-gradient(135deg, #0b3d44, #0e5a63);
  color: #fff;
}

.cta-container {
  max-width: 1200px;
  margin: auto;
  display: grid;
  grid-template-columns: 1.2fr 0.8fr;
  gap: 40px;
  align-items: center;
}

/* Content */
.cta-content h2 {
  font-size: 38px;
  margin-bottom: 15px;
}

.cta-content p {
  max-width: 520px;
  opacity: 0.9;
}

/* Finance Section */
.cta-finance {
  background: rgba(255,255,255,0.12);
  border-radius: 20px;
  padding: 35px;
  backdrop-filter: blur(8px);
}

.cta-finance span {
  display: block;
  text-transform: uppercase;
  font-size: 20px;
  color: #fff;
  text-align: center;
  letter-spacing: 1px;
  margin-bottom: 25px;
  opacity: 0.8;
}

.finance-card {
  background: rgba(255,255,255,0.08);
  border-radius: 16px;
  padding: 25px;
  text-align: center;
  margin-bottom: 20px;
  transition: all 0.4s ease;
}

.finance-card:hover {
  transform: translateY(-6px);
  background: rgba(255,255,255,0.18);
}

.finance-card img {
  max-height: 50px;
  margin-bottom: 18px;
  filter: brightness(0) invert(1);
}

/* Partner Button */
.partner-btn {
  display: inline-block;
  padding: 12px 26px;
  border-radius: 5px;
  background: #005c88;
  color: #ffffff;
  font-weight: 600;
  text-decoration: none;
  transition: 0.3s;
}

.partner-btn:hover {
  background: #fff;
  color: #000;
}

/* Responsive */
@media (max-width: 900px) {
  .cta-container {
    grid-template-columns: 1fr;
    text-align: center;
  }

  .cta-content p {
    margin: auto;
  }
}
/* Section Background */
#calculator{
  background: linear-gradient(135deg, #000000c2, #005c88);
  color:#fff;
}






/* Calculator Card */
#calculator .card{
  background: rgb(255 255 255 / 56%);
  border:none;
  border-radius:22px;
  padding:35px;
  backdrop-filter:blur(10px);
  box-shadow:0 20px 45px rgba(0,0,0,0.25);
}

#calculator .card h2{
  margin-bottom:25px;
  font-size:26px;
}

/* Inputs */
#calculator label{
  font-size:14px;
  margin-top:12px;
  opacity:0.9;
}

#calculator input{
  width:100%;
  padding:14px 16px;
  border-radius:14px;
  border:none;
  margin-bottom:12px;
  background:rgba(255,255,255,0.95);
  font-weight:600;
}

#calculator input:focus{
  outline:none;
  box-shadow:0 0 0 2px #00e0c6;
}

/* Button */
.btn-custom{
  background: linear-gradient(135deg, #005c88, #005c88);
  color: #ffffff;
  border:none;
  /* border-radius:50px; */
  padding:14px;
  font-weight:700;
  margin-top:15px;
  transition:0.4s;
}

.btn-custom:hover{
  transform:translateY(-3px);
  box-shadow:0 12px 25px rgba(0,0,0,0.35);
  background:#fff;
}

/* Result */
.result{
  margin-top:20px;
  padding:18px;
  background: rgb(255 255 255 / 81%);
  border-radius:16px;
  font-size:18px;
  font-weight:700;
  text-align:center;
}

/* Right Side Examples */
#calculator .example-card{
  background: rgb(0 0 0 / 47%);
  border-radius:18px;
  padding:22px;
  margin-bottom:20px;
  transition:0.4s;
  position:relative;
  overflow:hidden;
}

#calculator .example-card::before{
  content:"";
  position:absolute;
  top:0;
  left:0;
  width:4px;
  height:100%;
  background: #005c88;
}

#calculator .example-card:hover{
  transform:translateY(-6px);
  background:rgba(255,255,255,0.2);
}

#calculator .example-card strong{
  display:block;
  font-size:18px;
}

#calculator .example-card span{
  font-size:14px;
  opacity:0.85;
}

#calculator .price{
  font-size:22px;
  font-weight:800;
  color: #005c88;
  margin-top:8px;
}

/* Responsive */
@media(max-width:991px){
  #calculator .card{
    margin-bottom:30px;
  }
}
/* Section Background */
section{
  /* background: linear-gradient(135deg,#f6fbfc,#eef7f8); */
}



/* Feature Box */
.feature-box{
  background:#fff;
  border-radius:22px;
  transition:all 0.45s ease;
  position:relative;
  overflow:hidden;
}

.feature-box::before{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(135deg, #005c88, #005c88);
  opacity:0;
  transition:0.45s;
}

.feature-box img{
  margin-bottom:18px;
  transition:0.45s;
  position:relative;
  z-index:2;
}

.feature-box p{
  font-weight:600;
  font-size:17px;
  margin:0;
  position:relative;
  z-index:2;
  transition:0.45s;
}

/* Hover Effect */
.feature-box:hover::before{
  opacity:1;
}

.feature-box:hover img{
  transform:scale(1.15) rotate(6deg);
  filter:brightness(0) invert(1);
}

.feature-box:hover p{
  color:#fff;
}

/* Shadow */
.feature-box{
  box-shadow:0 15px 35px rgba(0,0,0,0.08);
}

.feature-box:hover{
  transform:translateY(-10px);
  box-shadow:0 25px 45px rgba(0,0,0,0.2);
}

/* 5 Column Responsive */
@media(max-width:1200px){
  .col-5th{width:33.33%;}
}
@media(max-width:768px){
  .col-5th{width:50%;}
}
@media(max-width:480px){
  .col-5th{width:100%;}
}
.hero-vd {
  position: relative;
  min-height: 100vh;
  overflow: hidden;
}

.video-bg {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 100%;
  transform: translate(-50%, -50%);
  z-index: -2;
}

.video-bg iframe {
  width: 100vw;
  height: 56.25vw; /* 16:9 */
  min-height: 100vh;
  min-width: 177.77vh;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  pointer-events: none; /* disable clicks */
}

.hero-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.55);
  z-index: -1;
}

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

/* Responsive tweak */
@media (max-width: 768px) {
  .hero {
    min-height: auto;
    padding: 80px 0;
  }

  .video-bg iframe {
    height: 100vh;
    width: 100vw;
  }
}
