

/* ********************************** General/Global Styles ********************************** */
/* Ensure no body margins/padding cause scroll issues */
body {
    margin: 0;
    padding: 0;
    overflow-x: hidden; /* Additional safeguard against horizontal scroll */
    /* background: #0f0f0f !important; */
      /* background: #1a1a1a !important; */
      background: linear-gradient(to bottom, #2b2b2b 0%, #2b2b2b 50%, #2b2b2b 75%, rgba(43, 43, 43, 0.85) 100%), #000000;
  
  
  
  }
   
  
  
  @media (max-width: 600px) {
    main {
      padding-top: 50px; /* equal to navbar height */
    }
  }
  
  
  
  
  
  
  
  
  
  /* ********************************** Hero Section ******************************* */
  
  .hero {
    width: 100%;
    position: relative;
    overflow: hidden;
    /* margin-top: 80px; */
  }
  
  .hero-img {
    width: 100%;
    height: auto;   /* keeps proportions */
    display: block; /* removes default inline gap */
  }
  
  /* Navigation arrow */
          .nav-arrow {
              position: absolute;
              top: 75px;
              right: 100px;
              width: 60px;
              height: 40px;
              background: #1C61BE;
              /* border: 1px solid rgba(255, 255, 255, 0.3); */
              display: flex;
              align-items: center;
              justify-content: center;
              cursor: pointer;
              transition: all 0.3s ease;
              z-index: 10;
              cursor: pointer;
          }
  
          .nav-arrow:hover {
              /* background: rgba(255, 255, 255, 0.2); */
              transform: scale(1.1);
          }
  
          .nav-arrow::after {
              content: '↗';
              color: #fff;
              font-size: 30px;
          }
  
          @media (max-width: 768px) {
               .nav-arrow {
                  right: 20px !important;
              }
          }
  
          @media (max-width: 600px) {
               .nav-arrow {
                  top: 20px;
                  right: 10px !important;
              }
          }
  
  
          @media (max-width: 480px) {
               .nav-arrow {
                  top: 20px;
                  right: 10px !important;
              }
          }
  
          @media (max-width: 349px) {
               .nav-arrow {
                  right: -10px !important;
              }
          }
  
  
  /* ********************************** End Hero Section ******************************* */
  
  /* ************************** Section - 2 (Location Carousel) ************************** */
  
  /* Base styles for 1920px */
          .rel-head {
              font-size: 4.2rem;
              color: #fff !important;
              font-weight: 400;
              line-height: 1.1;
          }
          
          .rel-content {
              font-size: 1.6rem;
              color: #FFFFFF !important;
              line-height: 1.6;
          }
          
          .image-section {
              position: relative;
              overflow-x: hidden;
          }
          
          .image-section img {
              width: 100%;
              max-width: 90%;
              height: auto;
              object-fit: cover;
              /* border-radius: 8px; */
              margin-left: 1rem;
          }
          
          .overlay-text {
              position: absolute;
              bottom: 0;
              right: 0;
              color: rgba(255, 255, 255, 0.2);
              font-size: 5rem;
              font-weight: bold;
              white-space: nowrap;
              pointer-events: none;
          }
          
          /* Large Desktop (1600px - 1919px) */
          @media (max-width: 1919px) and (min-width: 1600px) {
              .rel-head {
                  font-size: 3.8rem;
              }
              
              .rel-content {
                  font-size: 1.5rem;
              }
              
              .overlay-text {
                  font-size: 4.5rem;
              }
          }
          
          /* Medium Desktop (1200px - 1599px) */
          @media (max-width: 1599px) and (min-width: 1200px) {
              .rel-head {
                  font-size: 3rem;
              }
              
              .rel-content {
                  font-size: 1.02rem;
              }
              
              .overlay-text {
                  font-size: 4rem;
              }
              
              .mx-auto {
                  max-width: 450px !important;
              }
          }
          
          /* Small Desktop (992px - 1199px) */
          @media (max-width: 1199px) and (min-width: 992px) {
              .rel-head {
                  font-size: 1.9rem;
              }
              
              .rel-content {
                  font-size: 0.90rem;
              }
              
              .overlay-text {
                  font-size: 3.5rem;
              }
              
              .mx-auto {
                  max-width: 400px !important;
              }
          }
          
          /* Tablet (768px - 991px) */
          @media (max-width: 991px) and (min-width: 768px) {
              .rel-head {
                  font-size: 4rem;
                  text-align: center;
              }
              
              .rel-content {
                  font-size: 1.2rem;
                  text-align: center;
              }
              
              .overlay-text {
                  font-size: 3rem;
              }
              
              .mx-auto {
                  max-width: 100% !important;
                  padding: 0 2rem;
              }
              
              /* Stack columns on tablet */
              .col-md-6 {
                  width: 100%;
                  margin-bottom: 2rem;
              }
              
              .image-section {
                  max-width: 600px;
                  margin: 0 auto;
              }
  
              .image-section img {
                  max-width: 100%;
                  margin-left: 0 !important;
              }
          }
          
          /* Large Mobile (576px - 767px) */
          @media (max-width: 767px) and (min-width: 576px) {
              .rel-head {
                  font-size: 3rem;
                  text-align: center;
              }
              
              .rel-content {
                  font-size: 1rem;
                  text-align: center;
              }
              
              .overlay-text {
                  font-size: 2.5rem;
                  bottom: 10px;
                  right: 10px;
              }
              
              .mx-auto {
                  max-width: 100% !important;
                  padding: 0 1.5rem;
              }
              
              .col-md-6 {
                  width: 100%;
                  margin-bottom: 1.5rem;
              }
              
              .image-section {
                  padding: 0 1rem;
              }
  
              .container-fluid{
                  padding: 0 0.5rem;
  
              }
  
              .image-section img {
                  max-width: 100%;
                  margin-left: 0 !important;
              }
          }
          
          /* Small Mobile (400px - 575px) */
          @media (max-width: 575px) and (min-width: 400px) {
              .rel-head {
                  font-size: 3rem;
                  text-align: center;
                  line-height: 1.2;
              }
              
              .rel-content {
                  font-size: 1rem;
                  text-align: center;
              }
              
              .overlay-text {
                  font-size: 2rem;
                  bottom: 5px;
                  right: 5px;
              }
              
              .mx-auto {
                  max-width: 100% !important;
                  padding: 0 1rem;
              }
              
              .container-fluid {
                  padding: 0 0.5rem;
                  
              }
              
              .mt-5 {
                  margin-top: 2rem !important;
              }
  
              .image-section img {
                  max-width: 100%;
                  margin-left: 0 !important;
              }
          }
          
          /* Extra Small Mobile (below 400px) */
          @media (max-width: 399px) {
              .rel-head {
                  font-size: 1.5rem;
                  text-align: center;
                  line-height: 1.2;
                  br {
                      display: none;
                  }
              }
              
              .rel-content {
                  font-size: 0.875rem;
                  text-align: justify;
                  text-align-last: center;
              }
              
              .overlay-text {
                  font-size: 1.5rem;
                  bottom: 5px;
                  right: 5px;
              }
              
              .mx-auto {
                  max-width: 100% !important;
                  padding: 0 0.75rem;
              }
              
              .container-fluid {
                  padding: 0 0.25rem;
              }
              
              .mt-5 {
                  margin-top: 1.5rem !important;
              }
              
              .col-md-6 {
                  padding: 0 0.5rem;
              }
  
              .image-section img {
                  max-width: 100%;
                  margin-left: 0 !important;
              }
          }
          
          /* Hide line breaks on very small screens */
          @media (max-width: 575px) {
              .rel-head br {
                  display: none;
              }
  
              .image-section img {
                  max-width: 100%;
                  margin-left: 0 !important;
              }
          }
  
      /* @media (max-width: 768px) {
        .overlay-text {
          font-size: 3rem;
        }
      } */
  
  /* ************************** End Section - 2 ************************** */
  
  /* ************************** Section - 3 (Video Carousel) ************************** */
  
  
  /* ************************** End Section - 3 ************************** */
  
  
  
  /* ************************** Section - 4 (cta with Form) ************************** */
  
  .section-3-container {
      /* background-color: #1a1a1a !important; */
      padding: clamp(40px, 8vw, 100px) 0;
  }
  
  .sect-content {
      font-size: clamp(2.5rem, 8vw, 6rem); /* Responsive heading */
      line-height: 1.1;
  }
  
  .sect-btn {
      background-color: #609AE9;
      color: #FFFFFF;
      border-radius: clamp(0.5rem, 1.5vw, 0.75rem);
      width: clamp(12rem, 40%, 14.9375rem);
      font-family: Arial, Helvetica, sans-serif;
      font-size: 1.4rem;
      font-weight: bold !important;
      border: none;
      transition: all 0.3s ease;
  }
  
  .sect-btn:hover {
      background-color: #609ae9;
      transition: all 0.3s ease;
  }
  
  .phone-number {
      font-size: clamp(1rem, 2.5vw, 1.4rem) !important;
  }
  
  /* Form Card Styles */
  .card {
      border: none;
      max-width: clamp(350px, 90vw, 500px) !important;
      border-radius: 0 !important;
  }
  
  /* Optional custom styles */
  .btn-light {
      border-radius: clamp(15px, 3vw, 25px);
      font-weight: 500;
  }
  
  .vision-input {
      background-color: #2e2e2e !important; 
      color: #ffffff !important;
  }
  
  .vision-input::placeholder {
      color: #ffffff; /* Change to your desired color */
      opacity: 1; /* Firefox fix - Firefox reduces opacity by default */
  }
  
  .form-control, .form-select {
      border: 1px solid #ffffff;
      padding: clamp(8px, 2vw, 15px) clamp(10px, 2.5vw, 18px);
      font-size: clamp(0.875rem, 2vw, 1rem);
      border-radius: clamp(4px, 1vw, 8px);
      transition: all 0.3s ease;
  }
  
  .form-control:focus, .form-select:focus {
      border-color: #1e5cbe;
      box-shadow: 0 0 0 0.2rem rgba(30, 92, 190, 0.25);
      transform: translateY(-1px);
  }
  
  .btn-primary {
      background: linear-gradient(90deg, #1c61be 0%, #5c97e7 100%) !important;
      border-radius: 12px !important;
      font-weight: 500;
      padding: clamp(10px, 2vw, 15px);
      font-size: clamp(0.875rem, 2vw, 1rem);
      border-radius: clamp(6px, 1.5vw, 10px);
      transition: all 0.3s ease;
  }
  
  .btn-primary:hover {
      background-color: #1650a0;
      transform: translateY(-2px);
  }
  
  /* Section 3 Responsive Styles */
  
  /* Responsive adjustments */
  @media (max-width: 768px) {
      .sect-content {
          text-align: center;
          margin-bottom: 2rem;
      }
      
      .sect-btn {
          width: 100%;
          margin: 0 0 1rem 0 !important;
      }
      
      .card {
          margin: 2rem auto 0 auto !important;
      }
      
      .d-flex.flex-wrap {
          flex-direction: column;
          align-items: center;
          text-align: center;
      }
  }
  
  @media (max-width: 576px) {
      .form-control, .form-select {
          margin-bottom: 0.75rem;
      }
      
      .row.mb-3 .col-6 {
          margin-bottom: 0.5rem;
      }
  }
  
  /* Container adjustments */
  @media (min-width: 1400px) {
      .sect-content {
          font-size: 5.5rem;
      }
  }
  
  /* ************************** End Section - 4 ************************** */
  
  /* ********************************** Footer ********************************** */
  
  ul {
      margin: 0px;
      padding: 0px;
  }
  
  .footer-section {
      background: #2E2E2E;
      position: relative;
  }
  
  .footer-cta {
      /* border-bottom: 1px solid #373636; */
  }
  
  .single-cta i {
      color: #ff5e14;
      font-size: 30px;
      float: left;
      margin-top: 8px;
  }
  
  .cta-text {
      /* padding-left: 15px; */
      display: inline-block;
  }
  
  .cta-text h4 {
      color: #fff;
      font-size: 20px;
      font-weight: 600;
      margin-bottom: 2px;
  }
  
  .cta-text span {
      color: #FFFFFF;
      font-size: 1.2rem;
  }
  
  .footer-content {
      position: relative;
      z-index: 2;
      font-size: 1.2rem;
      color: #ffffff !important;
      line-height: 28px;
  }
  
  .footer-pattern img {
      position: absolute;
      top: 0;
      left: 0;
      height: 330px;
      background-size: cover;
      background-position: 100% 100%;
  }
  
  .footer-logo {
      margin-bottom: 30px;
  }
  
  .footer-text p {
      margin-bottom: 14px;
      font-size: 1.5rem;
      color: #ffffff;
      line-height: 25px;
  }
  
  .footer-social-icon {
      display: flex;
      flex-direction: column;
      gap: 1rem; /* Adjust spacing between rows */
      margin-left: 3rem;
      /* margin-top: 3rem; */
  }
  
  .footer-social-icon img {
      /* width: 75%; */
  }
  
  .footer-social-icon span {
      color: #fff;
      display: block;
      font-size: 20px;
      font-weight: 700;
      font-family: 'Poppins', sans-serif;
      margin-bottom: 20px;
  }
  
  .footer-social-icon a {
      color: #fff;
      font-size: 16px;
      margin-right: 15px;
      display: block;
  }
  
  .footer-social-icon i {
      height: 40px;
      width: 40px;
      text-align: center;
      line-height: 38px;
      border-radius: 50%;
  }
  
  .footer-widget-heading h3 {
      color: #fff;
      font-size: 20px;
      font-weight: 600;
      margin-bottom: 40px;
      position: relative;
  }
  
  .footer-widget-heading h3::before {
      content: "";
      position: absolute;
      left: 0;
      bottom: -15px;
      height: 2px;
      width: 50px;
      background: #ff5e14;
  }
  
  .footer-widget ul li {
      display: inline-block;
      float: left;
      width: 50%;
      margin-bottom: 12px;
  }
  
  .footer-widget ul li a:hover{
      color: #ff5e14;
  }
  
  .footer-widget ul li a {
      color: #878787;
      text-transform: capitalize;
  }
  
  .legacy-cta-footer {
      background: linear-gradient(to right, #1a61be, #5c96e6) !important;
      color: white !important;
      padding: 12px 140px !important;
      border: none;
      border-radius: 16px !important;
      font-size: 1.2rem !important;
      font-weight: bold;
      transition: all 0.3s ease;
      cursor: pointer;
      /* margin-left: 1rem; */
  }
  
  .legacy-cta-footer:hover {
      background: linear-gradient(to right, #1558a6, #5289d6);
      transform: translateY(-2px);
      box-shadow: 0 4px 12px rgba(37, 99, 235, 0.3);
  }
  
  /* .subscribe-form {
      position: relative;
      overflow: hidden;
  }
  
  .subscribe-form input {
      width: auto;
      padding: 14px 28px;
      background: #ffffff;
      border: 1px solid #ffffff;
      color: #fff !important;
      margin-top: 0.5rem;
  }
  
  .subscribe-form button i {
      color: #fff;
      font-size: 22px;
      transform: rotate(-6deg);
  } */
  
  .copyright-area{
      background: #202020;
      padding: 25px 0;
  }
  
  .copyright-text p {
      margin: 0;
      font-size: 1.5rem;
      color: #ffffff;
  }
  
  .copyright-text p a{
      color: #fff;
      text-decoration: none;
  }
  
  .footer-menu {
      margin-left: 2rem;
  }
  
  .footer-menu li {
      display: inline-block;
      margin-left: 20px;
      margin-bottom: 0.8rem !important;
  }
  
  .footer-menu li:hover a{
      color: #ff5e14;
  }
  
  .footer-menu li a {
      font-size: 1.5rem;
      color: #ffffff !important;
      text-decoration: none !important;
      text-transform: none !important;
  }
  
  
  
  
  /* ********************************** End Footer ********************************** */