/* Header Background */



.header {

  padding-bottom:30px;    

  background: url("./assets/banner.jpg") no-repeat center center/cover;

  position: relative;



  display: flex;

  align-items: center;

  color: white;

  /* overflow: hidden; */
  overflow: initial;
  width: 99%;

}



.animated-image {

  cursor: pointer;

  /* Interactive */

}



/* Dark overlay */

.header::before {

  content: "";

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  /* background: rgba(0, 0, 0, 0.6); */

}



/* Bottom Wave Shape */

/* .custom-shape-divider-bottom-1739101818 {

    position: absolute;

    bottom: 0;

    left: 0;

    width: 100%;

    overflow: hidden;

    line-height: 0;

  }



  .custom-shape-divider-bottom-1739101818 svg {

    position: relative;

    display: block;

    width: calc(122% + 1.3px);

    height: 177px;

    transform: rotateY(180deg);

  }



  .custom-shape-divider-bottom-1739101818 .shape-fill {

    fill: #ffffff;

  } */



.custom-shape-divider-bottom-1739616572 {

  position: absolute;

  bottom: 0;

  left: 0;

  width: 100%;

  overflow: hidden;

  line-height: 0;

  transform: rotate(180deg);

}



.custom-shape-divider-bottom-1739616572 svg {

  position: relative;

  display: block;

  width: calc(129% + 1.3px);

  height: 175px;

  transform: rotateY(180deg);
  top: -5px;

}



.custom-shape-divider-bottom-1739616572 .shape-fill {

  fill: #ffffff;

}



/* Navbar */

.navbar {

  /* background: transparent !important; */

  padding: 0;

}



.navbar-nav .nav-link {

  font-size: 16px;

  font-weight: 400;

  text-transform: capitalize;

  transition: color 0.3s ease-in-out;

}



.nav-item {

  margin: 0px 12px;

}

.logo-image {

  height: 200px;

}



@media (min-width: 992px) {

  .navbar-expand-lg .navbar-nav {

    flex-direction: row;

    display: flex;

    justify-content: center;

    align-items: center;

    height: 70px;

  }



  .know-more {

    position: relative;

    background: rgba(244, 176, 82, 1);

    text-align: center;

    font-size: 16px;

    width: 130px;

    border-bottom-left-radius: 6px;

    border-bottom-right-radius: 5px;

    margin-top: 16px;

  }



  .know-more .nav-link {

    color: #47419a;

    font-weight: 700;

    font-size: 17px;

  }



  /* Full-width bottom triangle */

  .know-more::after {

    content: "";

    position: absolute;

    bottom: 0;

    top: 66px;

    left: 0px;

    width: 128px;

    height: 0;

    border-left: 65px solid transparent;

    border-right: 65px solid transparent;

    border-top: 18px solid rgba(244, 176, 82, 1);

  }



  #navbarNav {

    background-color: #fff;

    margin-right: -25px;

    padding: 20px 125px;

    height: 50px;

    display: flex;

    align-items: center;

    position: relative;

    /* Required for absolute positioning */

  }



  /* Left-Side Triangle */

  #navbarNav::before {

    content: "";

    position: absolute;

    left: -20px;

    /* Adjust to position properly */

    top: 50%;

    transform: translateY(-50%);

    width: 0;

    height: 0;

    border-top: 25px solid transparent;

    /* Triangle height */

    border-bottom: 25px solid transparent;

    /* Triangle height */

    border-right: 20px solid #fff;

    /* Triangle color & width */

  }



  /* .navbar-brand {

      width: 40%;

    } */



  .navbar-nav {

    align-items: center;

  }

}



@media (max-width: 1200px) {

  .nav-conatct {

    position: absolute;

    right: 25% !important;

    top: 4px !important;

  }

}



.wave {

  position: absolute;

  bottom: 0;

  left: 0;

}



.navbar-collapse {

  flex-basis: 100%;

  flex-grow: 0 !important;

  background: #fff;

}



.nav-link {

  color: black;

}

.nav-conatct {

  position: absolute;

  right: 8%;

  top: 35px;

}



.nav-conatct a {

  text-decoration: none;

}



.nav-conatct i {

  color: rgba(244, 176, 82, 1);

}



.navbar-nav .nav-link:hover {

  color: #62b0a7 !important;

}



/* Responsive Navbar */

.navbar-toggler {

  border: none;

  outline: none;

}



/* Header Content */

.header-content {

  position: relative;

  z-index: 2;

  /* text-align: center; */

}



.header-content h1 {

  font-size: 220px;

  color: #a5b1ff;

  font-weight: 800;

}



.header-content p {

  font-size: 1.2rem;

  line-height: 1.6;

  color: #f8f9fa;

  padding: 0px 15px;

  position: relative;

  top: -26px;

}



@media (max-width: 600px) {

  .logo-image {

    width: 100% !important;

    margin-left: -31px;

  }

}



/* Mobile Adjustments */

@media (max-width: 768px) {

  .header-content h1 {

    font-size: 2.5rem;
    padding-left: 14px;
  }



  .header-content p {

    font-size: 1rem;
    padding-top: 20px;

  }



  .custom-shape-divider-bottom-1739101818 svg {

    height: 120px;

    /* Smaller height for mobile */

  }



  .logo-image {

    width: 50%;

    margin-left: -31px;

  }



  /* .navbar-brand {

      width: 50%;

    } */



  .know-more {

    display: none;

  }



  .nav-conatct {

    display: none;

  }

}



.navbar-toggler:focus {

  text-decoration: none;

  outline: 0;

  box-shadow: none;

}



.navbar-toggler {

  padding: var(--bs-navbar-toggler-padding-y) var(--bs-navbar-toggler-padding-x);

  font-size: var(--bs-navbar-toggler-font-size);

  line-height: 1;

  color: var(--bs-navbar-color);

  background-color: transparent;

  border: var(--bs-border-width) solid var(--bs-navbar-toggler-border-color);

  border-radius: var(--bs-navbar-toggler-border-radius);

  transition: var(--bs-navbar-toggler-transition);

  background: #4a8aa4;

}



.animated-image {

  transition: transform 0.1s ease-in-out;

}



.section {

  margin: 90px 0px;

}



/* Header Background */

.icon-border {

  border-right: 1px solid rgba(144, 144, 144, 1);

}

.grey-abt-cnt p {

  color: #8f8f8f;

}



.about {

  height: 52vh;

  margin: 135px 0px;

  background: linear-gradient(

    180deg,

    rgba(23, 20, 67, 1) 0%,

    rgba(58, 50, 169, 1) 100%

  );

}

.about .about-img-section {

  margin-top: -99px;

}



.about .about-img-section img {

  height: 680px;
  position: relative;
  left: -70px;
  top: 40px;
}



.about-tag {

  margin-bottom: -10px;

  margin-top: 25px;

  font-size: 18px;

  font-weight: 400;

  padding-left: 4px;

}



.about-heading {

  font-size: 60px;

  font-weight: 800;

}



.project {

  background-color: #5F4B82;

}



.about-p {

  width: 70%;

  border-color: rgba(23, 20, 67, 1);

      font-size: 15px;

    line-height: 28px;

}



.border-11 {

  border-bottom: 1px solid;

  width: 15%;

  margin-bottom: 3px;

  color: #929292;

}



.border-code {

  margin-top: -15px;

}



.border-21 {

  border-bottom: 1px solid;

  width: 23%;

  margin-bottom: 3px;

  color: #929292;

}



/* .about-section {

  position: relative;

  background: #0e5cab;

  padding: 100px 0;

  overflow: hidden;

}



.about-section .about-img {

  left: 0;

  width: 100%;

  height: auto;

  max-width: none;

  z-index: -1;

}



.about-section .content {

  position: relative;

  z-index: 2;

} */



.client-logo {

  max-width: 100px;

  height: auto;

  margin: auto;

}



.customer-image {

  width: 100%;

}



/* Slider */

.heading-h2 {

  color: rgba(98, 176, 167, 1);

}



.slick-slide {

  margin: 0px 20px;

}



.slick-slide img {

  width: 100%;

}



.slick-slider {

  position: relative;

  display: block;

  box-sizing: border-box;

  -webkit-user-select: none;

  -moz-user-select: none;

  -ms-user-select: none;

  user-select: none;

  -webkit-touch-callout: none;

  -khtml-user-select: none;

  -ms-touch-action: pan-y;

  touch-action: pan-y;

  -webkit-tap-highlight-color: transparent;

}



.slick-list {

  position: relative;

  display: block;

  overflow: hidden;

  margin: 0;

  padding: 0;

}



.slick-list:focus {

  outline: none;

}



.slick-list.dragging {

  cursor: pointer;

  cursor: hand;

}



.slick-slider .slick-track,

.slick-slider .slick-list {

  -webkit-transform: translate3d(0, 0, 0);

  -moz-transform: translate3d(0, 0, 0);

  -ms-transform: translate3d(0, 0, 0);

  -o-transform: translate3d(0, 0, 0);

  transform: translate3d(0, 0, 0);

}



.slick-track {

  position: relative;

  top: 0;

  left: 0;

  display: block;

}



.slick-track:before,

.slick-track:after {

  display: table;

  content: "";

}



.slick-track:after {

  clear: both;

}



.slick-loading .slick-track {

  visibility: hidden;

}



.slick-slide {

  display: none;

  float: left;

  height: 100%;

  min-height: 1px;

}



[dir="rtl"] .slick-slide {

  float: right;

}



.slick-slide img {

  display: block;

}



.slick-slide.slick-loading img {

  display: none;

}



.slick-slide.dragging img {

  pointer-events: none;

}



.slick-initialized .slick-slide {

  display: block;

}



.slick-loading .slick-slide {

  visibility: hidden;

}



.slick-vertical .slick-slide {

  display: block;

  height: auto;

  border: 1px solid transparent;

}



.slick-arrow.slick-hidden {

  display: none;

}



.footer {

  background-color: rgba(22, 22, 22, 1);

}



.footer-header {

  color: rgba(224, 155, 61, 1);

  font-family: Roboto;

  font-weight: 900;

  font-size: 24px;

  line-height: 31px;

  letter-spacing: 0%;

  text-align: left;

}



.follow {

  color: rgba(224, 155, 61, 1);

  font-size: 20px;

}



.footer-header-1 {

  color: rgba(224, 155, 61, 1);

  font-family: Roboto;

  font-weight: 900;

  font-size: 24px;

  line-height: 31px;

  letter-spacing: 0%;

}



.footer-list {

  display: flex;

  flex-wrap: wrap;

  flex-direction: column;

  align-content: left;

}



.footer-icon {

    /* background: rgba(255, 211, 151, 1);

    padding: 3px 7px;

    border-radius: 50px; */

    font-size: 16px;

    color: black;

}


.footer-icon img {

  /* background: rgba(255, 211, 151, 1);

  padding: 3px 7px;

  border-radius: 50px; */

  height: 30px;

  color: black;

}







.footer-solid-icon {

  color: rgba(224, 155, 61, 1);

}



.footer-bottom {

  background-color: rgba(33, 29, 98, 1);

  color: #ffff;

}



.footer-list .p::before {

  content: "•";

  /* Bullet point */

  color: #ffffff;

  /* Change color as needed */

  font-size: 20px;

  /* Adjust size */

  font-weight: bold;

  margin-right: 10px;

  /* Spacing between bullet and text */

}



/* image section */

.image-gallery {

  display: grid;

  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));

  /* Responsive columns */

  gap: 1rem;

  /* Adjust spacing between images */

}



.image-gallery img {

  width: 100%;

  height: 100%;

  /* Key change: Make images take full height of their container */

  object-fit: cover;

  /* Maintain aspect ratio and cover container */

  border-radius: 8px;

  /* Optional: Add rounded corners */

  transition: transform 0.3s ease;

  /* Smooth hover effect */

}



.image-gallery img:hover {

  transform: scale(1.05);

  /* Slightly enlarge on hover */

  box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);

}



.section-padding {

  padding: 4rem 0;

  /* Adjust as needed */

}



.single-image-gallery img:hover {

  transform: scale(1.05);

  /* Slightly enlarge on hover */

  box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);

}



/* Styles specifically for the single image in the right column */

.single-image-gallery {

  display: grid;

  /* Needed for height to work correctly on the image */

  height: 100%;

  /* Make the gallery take full height of column */

}



.single-image-gallery img {

  height: 100%;

  /* Image takes full height of its *parent* (the .single-image-gallery) */

  object-fit: cover;

  /* Important to keep aspect ratio and cover the available space */

}



@media (max-width: 600px) {

  .icon-border {

    border: none !important;

  }

  .about .about-img-section {

    margin-top: 15px;

  }



  .about .about-img-section img {

    width: 100%;

    height: 100%;

  }

}



/* Mobile-first adjustments */

@media (max-width: 768px) {

  .image-gallery {

    grid-template-columns: 1fr;

    /* Single column on smaller screens */

  }

  .navbar-brand {

    width: 40%;

  }

  .logo-image {

    width: 100% !important;

    height: 100% !important;

  }

  .head {

    text-align: center;

  }



  .about {

    height: 100% !important;

    margin: 30px 0px;

    background: linear-gradient(

      180deg,

      rgba(23, 20, 67, 1) 0%,

      rgba(58, 50, 169, 1) 100%

    );

  }



  .about-p {

    width: 100%;

    border-color: rgba(23, 20, 67, 1);

    font-size: 16px;

  }



  .single-image-gallery {

    display: grid;

    height: 100%;

    margin-top: 15px;

  }



  .customer-image {

    width:auto;
    text-align: center;

  }



  .client-image {

    text-align: center;

  }

}



@media (min-width: 1000px) and (max-width: 1200px) {

  .about {

    height: 60vh !important;

    margin: 135px 0px;

    background: linear-gradient(

      180deg,

      rgba(23, 20, 67, 1) 0%,

      rgba(58, 50, 169, 1) 100%

    );

  }



  .about-p {

    width: 92%;

    border-color: rgba(23, 20, 67, 1);

  }

  .about .about-img-section img {

    height: 650px;

    margin-left: -206px;

  }

}

@media (min-width: 1300px) and (max-width: 1500px) {

  .about {

    height: 96vh;

    margin: 135px 0px;

    background: linear-gradient(

      180deg,

      rgba(23, 20, 67, 1) 0%,

      rgba(58, 50, 169, 1) 100%

    );

  }

}



@media (min-width: 700px) and (max-width: 800px) {

  .about .about-img-section img {

    height: 635px;

    margin-left: -274px;

  }

  .about .about-img-section {

    margin-top: -66px;

  }

}



@media (min-width: 2200px) and (max-width: 2600px) {

  .about .about-img-section {

    margin: auto;

  }

  .about {

    height: 100%;

    margin: 135px 0px;

    background: linear-gradient(

      180deg,

      rgba(23, 20, 67, 1) 0%,

      rgba(58, 50, 169, 1) 100%

    );

  }

  .about-content {

    margin: auto;

  }

}



@media (min-width: 1024px) and (max-width: 1024px) {

  #navbarNav {

    background-color: #fff;

    margin-right: -25px;

    padding: 20px 16px !important;

    height: 50px;

    display: flex;

    align-items: center;

    position: relative;

    /* Required for absolute positioning */

  }

}