/* Banner section starts */
.banner__section {
  position: relative;
  overflow: hidden;
  height: 85vh;
}

.banner__section::after {
  content: "";
  background-image: url(../img/banner-bg.png);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: bottom;
  width: 100%;
  height: 100%;
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 2;
}

.banner-slider .swiper-wrapper {
  transition-timing-function: cubic-bezier(0.65, 0, 0.35, 1) !important;
}

.banner-slider {
  position: relative;
}

.banner-slider::before {
  content: "";
  background: #0000008c;
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
}

.banner-slider .swiper-slide {
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.banner-slider .swiper-slide img {
  width: 100%;
  height: 100%;
  max-height: 100vh;
  aspect-ratio: 16/7;
  object-fit: cover;
  display: block;
  will-change: transform, opacity;
  backface-visibility: hidden;
  transform: translateZ(0);
}

.banner-slider .swiper-pagination {
  bottom: 80px !important;
}

.banner-slider .swiper-pagination-bullet {
  width: 14px;
  height: 14px;
  opacity: 1;
  background: rgba(255, 255, 255, 0.3);
  transition: all 0.3s ease;
}

.banner-slider .swiper-pagination-bullet-active {
  background: #fff;
}

.banner__section .wrapper {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 4;
  display: flex;
  align-items: center;
}

.banner-content {
  max-width: 623px;
}

.banner-content p {
  color: #dcd8d5;
}

.banner-content h1 {
  font-size: clamp(70px, 12vw, 140px);
  line-height: clamp(70px, 12vw, 140px);
  color: var(--light);
  font-family: var(--primary-font);
  margin: 0 0 clamp(15px, 4vw, 35px);
}

.banner-content h1 span {
  font-size: clamp(40px, 4vw, 58px);
  line-height: clamp(40px, 4vw, 58px);
  display: block;
}

.two-button {
  display: flex;
  align-items: center;
  gap: 16px;
  margin: clamp(30px, 3vw, 45px) 0 0;
}

/* Banner section end */

/* Our Beginning starts */
.our-beginning__section {
  position: relative;
  overflow: hidden;
}

.our-beginning__section::before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
  background-image: var(--beginning-bg);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  opacity: 14%;
  mix-blend-mode: luminosity;
}

.top-overlay,
.bottom-overlay {
  position: absolute;
  bottom: 0;
  width: 100%;
}

.top-overlay {
  bottom: auto;
  top: 0;
  transform: rotate(180deg);
}

.top-overlay img,
.bottom-overlay img {
  width: 100%;
  height: auto;
}

.our-beginning-wrapper,
.our-approach-wrapper {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: clamp(30px, 4vw, 60px);
}

.our-beginning-wrapper .featured-image,
.our-approach-wrapper .featured-image {
  max-width: 540px;
  width: 100%;
  position: relative;
  padding-left: 24px;
  padding-bottom: 24px;
}

.our-approach-wrapper .featured-image {
  padding-left: 0;
  padding-bottom: 0;

}

.our-beginning-wrapper .featured-image img,
.our-approach-wrapper .featured-image>img {
  width: 100%;
  height: 595px;
  object-fit: cover;
}

.our-approach-wrapper .featured-image>img {
  height: 519px;
}

.our-approach-wrapper {
  align-items: start;

}

.experience {
  position: absolute;
  left: 0;
  bottom: 0;
  background-repeat: no-repeat;
  background-size: cover;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  width: 147px;
  height: 171px;
}

.experience::before {
  content: "";
  background: #2290a9e5;
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.experience div {
  position: relative;
  z-index: 1;
}

.experience span,
.experience h2 {
  font-size: clamp(36px, 4vw, 56px);
  color: var(--light);
}

.experience span {
  font-size: clamp(14px, 2vw, 18px);
}

.our-beginning-wrapper .entry-container {
  width: 100%;
  max-width: 620px;
}

.our-beginning-wrapper .entry-content {
  columns: 2;
  column-gap: clamp(20px, 2.5vw, 30px);
  margin-top: clamp(18px, 3vw, 28px);
}

/* Our Beginning end */

/* Our Service start */
.our-service__section>div {
  position: relative;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  background-attachment: fixed;
}

.our-service__section>div::before {
  content: "";
  background: #f2f2f2ed;
  position: absolute;
  inset: 0;
}

.our-service__section>div .wrapper {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: clamp(20px, 3vw, 45px);
}

.our-service__section .btn {
  font-size: 11px;
  padding: 10px 14px;
  margin: 20px 0 0;
}

.service-one .entry-container {
  max-width: 709px;
}

.our-service__section h2 {
  font-size: 30px;
  margin: 0 0 15px;
  font-family: var(--primary-font);
  text-transform: uppercase;
  color: #3A3A3A;
}

.service-one .entry-container {
  display: flex;
  flex-direction: column;
  gap: 35px;
  justify-content: space-between;
}

.our-service__section .featured-image img {
  width: 100%;
  height: 684px;
  object-fit: cover;
}

.service-one-wrapper {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(290px, 1fr));
  gap: 30px;
}

.service-one-wrapper .service__img {
  height: 224px;
  width: 100%;
  margin-bottom: 20px;
  overflow: hidden;
}

.service-one-wrapper img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  transition: var(--transition);
  -webkit-transition: var(--transition);
  -moz-transition: var(--transition);
  -ms-transition: var(--transition);
  -o-transition: var(--transition);
}

.service-one-wrapper>a:hover img {
  transform: scale(1.1);
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -o-transform: scale(1.1);
  -webkit-transform: scale(1.1);
}

.service-one-wrapper span {
  font-size: 15px;
  color: #5e5e5c;
  text-decoration: underline;
  display: block;
  margin-bottom: 12px;
}

.service-one-wrapper h3 {
  /* color: #5d5e5c; */
  color: #1A1A1A;
  font-size: 19px;
  font-family: var(--primary-font);
  line-height: 1.3;
}

.our-service__section>.service-two::before {
  background: #ffffffed;
}

.service-two .entry-container {
  background-color: var(--primary);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 40px 60px 40px 40px;
  position: relative;
  overflow: hidden;
}

.service-two .entry-container::after {
  content: url(../img/service-bg.svg);
  position: absolute;
  bottom: 0;
  right: 0;
}

.service-two .entry-container>div {
  max-width: 510px;
  position: relative;
  z-index: 1;
}

.service-one-wrapper>a span,
.service-one-wrapper>a h3 {
  transition: var(--transition);
  -webkit-transition: var(--transition);
  -moz-transition: var(--transition);
  -ms-transition: var(--transition);
  -o-transition: var(--transition);
}

.service-one-wrapper>a:hover span,
.service-one-wrapper>a:hover h3 {
  color: var(--primary);
}

.service-two h2,
.service-two p {
  color: var(--light);
}

.service-two .btn {
  color: var(--primary);
}

.our-service__section>.service-three::before {
  background: #e6e6e6f2;
}

.service-video {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: clamp(15px, 3vw, 30px);
}

.service-video img {
  height: 194px;
  width: 100%;
  object-fit: cover;
}

.service-right .entry-content {
  max-width: 658px;
  margin-top: 35px;
}

/* Our Service end */

/* Key Impact start */
.key-impact__section {
  background: #4d40380f;
  position: relative;
}

.key-impact__section::before {
  content: "";
  background-image: url(../img/key-bg.png);
  background-repeat: repeat;
  background-size: cover;
  background-position: center;
  position: absolute;
  inset: 0;
  width: 100%;
}

.key-impact__section .wrapper {
  display: flex;
  justify-content: space-between;
  gap: clamp(30px, 3vw, 40px);
}

.key-impact__section .section-wrap {
  max-width: 594px;
}

.key-impact-wrapper {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(270px, 1fr));
  gap: clamp(20px, 3vw, 30px);
  width: 100%;
  max-width: 890px;
}

.key-impact-wrapper>div {
  transition: var(--transition);
  -webkit-transition: var(--transition);
  -moz-transition: var(--transition);
  -ms-transition: var(--transition);
  -o-transition: var(--transition);
}

.key-impact-wrapper>div:hover {
  box-shadow: 0px 4px 16px 2px rgba(223, 223, 223, 0.36);
  transform: scale(1.02);
  -webkit-transform: scale(1.02);
  -moz-transform: scale(1.02);
  -ms-transform: scale(1.02);
  -o-transform: scale(1.02);
}

.key-impact {
  background-color: var(--light);
  padding: 24px 22px;
  position: relative;
  overflow: hidden;
}

.key-impact h2 {
  margin-bottom: 60px;
}

.key-impact p {
  color: #716660;
  margin: 0;
}

.key-impact .icon {
  width: 133px;
  height: 133px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #2290a94d;
  border-radius: 50%;
  position: absolute;
  top: -30px;
  right: -30px;
}

.key-impact:nth-child(n + 4):nth-child(-n + 6) .icon {
  background: #3f9e804d;
}

.key-impact:nth-child(n + 7):nth-child(-n + 9) .icon {
  background: #4d40384d;
}

.key-impact .icon img {
  margin-top: 12px;
  margin-right: 20px;
}

/* Key Impact end */

/* Our Partner start */
.our-partner__section .section-wrap.center {
  margin-bottom: 45px;
}

.our-partner-slider {
  width: 100%;
  overflow: hidden;
  border-bottom: 0.6px solid #c9c9c9;
  padding-bottom: 45px !important;
}

.our-partner-slider .swiper-slide {
  display: flex;
  align-items: center;
  justify-content: center;
  height: auto;
}

.our-partner-slider .swiper-slide img {
  display: block;
  width: auto;
  max-width: 175px;
  height: 90px;
  object-fit: contain;
}

/* Our Partner end */

/* Blogs start */
.blogs__section .wrapper {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: clamp(30px, 3vw, 40px);
}

.blogs__section .section-wrap {
  max-width: 460px;
}

.blogs-slider {
  max-width: 960px;
  padding-bottom: 2px !important;
}

.blogs-slider .swiper-slide {
  opacity: 20%;
  transition: var(--transition);
}

.blogs-slider .swiper-slide-active {
  opacity: unset;
  transition: var(--transition);
}

.blogs-item img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  transition: var(--transition);
}

.blogs-item:hover img {
  transform: scale(1.1);
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -o-transform: scale(1.1);
}

.blogs-item .blog__img {
  height: 373px;
  width: 100%;
  overflow: hidden;
}

.blogs-item .entry-content {
  margin-top: 20px;
  max-width: 374px;
}

.blogs-item .entry-content>span {
  font-size: 15px;
  color: #323232;
  text-decoration: underline;
  display: block;
  margin-bottom: 12px;
}

.blogs-item h3 {
  font-size: 21px;
  font-family: var(--primary-font);
}

.blogs-item .btn {
  color: var(--primary) !important;
  border: 1px solid var(--primary);
  margin-top: 22px;
  transition: var(--transition);
  -webkit-transition: var(--transition);
  -moz-transition: var(--transition);
  -ms-transition: var(--transition);
  -o-transition: var(--transition);
}

.blogs-item .btn:hover {
  color: white !important;
  border-color: var(--primary) !important;
  background-color: var(--primary);
}

.swiper.banner-slider {
  height: 100%;
}

/* Blogs end */

/* CTA start */
.cta__section {
  position: relative;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  padding: clamp(70px, 9vw, 130px) 0;
}

.cta__section::before {
  content: "";
  background: #08404ac9;
  position: absolute;
  inset: 0;
  width: 100%;
}

.cta__section .section-wrap.center .subtitle {
  color: var(--light);
  margin-bottom: 18px;
}

.cta__section .section-title {
  color: var(--light);
  font-size: clamp(28px, 3vw, 40px);
}

.cta__section .section-wrap .btn {
  margin-top: 36px;
}

/* CTA end */

.blog-single__section>.wrapper {
  column-gap: clamp(80px, 3vw, 160px);
}

.blog-single__section .section-wrap>h1 {
  font-size: clamp(26px, 4vw, 40px);
}

@media (max-width: 1200px) {
  .banner-slider .swiper-slide img {
    aspect-ratio: 16/10;
  }

  .key-impact__section .wrapper,
  .blogs__section .wrapper {
    flex-direction: column;
  }

  .key-impact-wrapper,
  .blogs-slider {
    max-width: 100%;
  }

  .service-page.our-service__section .service-gallery .entry-content>p {
    margin-bottom: 30px;
  }

  .blogs__section .section-wrap {
    max-width: 100%;
  }
}


@media (max-width: 1080px) {
  .blog-single__section>.wrapper {
    flex-direction: column;
  }

  .related-blogs {
    position: unset;
    /* padding: 0; */
    max-width: 100%;
    background: none;
    padding: clamp(55px, 5vw, 80px) 0;
  }

  .related-side-blog {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
  }

  .related-side-blog>div a {
    display: block;
    background: none;
    max-width: unset
  }

  .related-side-blog>div a {
    display: block;
    background: none;
    max-width: unset
  }

  .related-side-blog>div a img {
    height: 230px;
    width: 100%;
    max-width: unset;
  }

  .related-side-blog .blogs-item .blog__img {
    height: 230px;
    width: 100%;
    max-width: unset;
    min-width: unset;


  }

  .related-side-blog>div:not(:last-child) {
    border-bottom: none;
  }

  .more-videos-play i {
    margin-left: 3px;
  }

  .related-blogs .blogs-item .entry-content {
    margin-top: 20px;
  }
}

@media (max-width: 1024px) {
  .banner-slider .swiper-slide img {
    aspect-ratio: 16/14;
  }

  .banner-slider .swiper-pagination {
    display: none;
  }

  .our-beginning-wrapper .entry-content {
    columns: 1;
  }

  .experience {
    width: 130px;
    height: 154px;
  }

  .what-we-do-wrapper {
    flex-direction: column;
    align-items: start;
  }

  .video-container {
    max-width: 67%;
    height: auto;
  }

  .mission-vision-wrapper {
    margin-top: 30px;
  }

  .what-we-do-wrapper .section-title {
    width: 100%;
  }

  .contact-section>.wrapper {
    flex-direction: column;
  }

  .contact-info {
    max-width: 100%;
  }
}

@media (max-width: 960px) {
  .service-gallery .entry-content {
    position: relative;
  }

  .inner-wrapper {
    display: block;
  }

  .inner-wrapper .entry-container {
    margin-bottom: clamp(25px, 3vw, 40px);
  }

  .service-page.our-service__section .service-three .entry-container {
    position: relative;
    top: 0;
    transform: unset;
    -webkit-transform: unset;
    -moz-transform: unset;
    -ms-transform: unset;
    -o-transform: unset;
    width: 100%;
  }

  .service-page.our-service__section .entry-content {
    max-width: 100%;
  }

  .video-container {
    max-width: 100%;
    height: auto;
  }

  .gallery-masonry {
    gap: 5px;
  }

  .related-side-blog {
    grid-template-columns: repeat(2, 1fr);

  }

  .our-approach-wrapper .featured-image {
    min-width: 50%;
  }

}

@media (max-width: 782px) {
  .banner-slider .swiper-slide img {
    aspect-ratio: 12/16;
  }

  .our-beginning-wrapper,
  .our-approach-wrapper {
    flex-direction: column;
  }

  .our-service__section>div .wrapper {
    grid-template-columns: 1fr;
  }

  .our-beginning-wrapper .featured-image,
  .our-approach__section .featured-image {
    max-width: 100%;
  }

  .our-service__section .featured-image img,
  .our-approach__section .featured-image img {
    height: 100%;

  }

  .service-one .wrapper>.featured-image {
    order: -1;
  }

  .experience {
    width: 100px;
    height: 124px;
  }

  .our-service__section.service-page .featured-image img {
    height: auto !important;
  }

  .gallery-masonry {
    grid-template-columns: repeat(3, 1fr);
  }



}


@media (max-width: 670px) {

  .what-we-do-cards,
  .mission-vision-wrapper {
    flex-wrap: wrap;

  }

  .mission-vision-wrapper {
    gap: 25px;
  }

  .mission-vision-wrapper>div::before {
    display: none;
  }

  .what-we-do-cards>div {
    height: auto;
    min-width: 210px;
    width: 100%;
    padding-bottom: 30px;
  }

  .banner__section {
    position: relative;
    overflow: hidden;
    height: 65vh;
  }

  .footer-top>div {
    flex-direction: column;
    align-items: start !important;
  }

  .service-one-wrapper {
    gap: 35px;
  }

  .contact-form form {
    display: block;
  }

  .contact-form form>p {
    width: 100%;
  }

  .map {
    height: 270px;
  }
}

@media (max-width: 567px) {
  .banner-slider .swiper-slide img {
    aspect-ratio: 16/16;
    aspect-ratio: 9/16;
  }

  .our-beginning-wrapper .featured-image img {
    height: 100%;
  }

  .top-left {
    flex-direction: column;
    align-items: start !important;
  }

  .top-left>div {
    align-items: start;
  }

}

@media (max-width: 480px) {
  .related-side-blog {
    grid-template-columns: 1fr;

  }
}

/* 404-error page */
.error-404 {
  min-height: 70vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 80px 20px;
  background: #f8fafc;
}

.error-404 .page-header {
  margin-bottom: 20px;
}

.error-404 .page-title {
  margin: 0;
  color: var(--primary);
  font-size: clamp(32px, 5vw, 56px);
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -1px;
}

.error-404 .page-content {
  width: 100%;
  max-width: 600px;
  color: var(--para);
  font-size: 17px;
  line-height: 1.7;
}

.error-404 .page-content p {
  margin: 0 0 30px;
}

/* Search form */
.error-404 .search-form {
  display: flex;
  align-items: stretch;
  justify-content: center;
  width: 100%;
  max-width: 520px;
  margin: 0 auto;
}

.error-404 .search-form label {
  flex: 1;
}

.error-404 .search-field {
  width: 100%;
  height: 52px;
  padding: 0 18px;
  border: 1px solid #dbe2ea;
  border-right: 0;
  border-radius: 10px 0 0 10px;
  background: #fff;
  color: #172033;
  font-size: 15px;
  outline: none;
  box-sizing: border-box;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.error-404 .search-field::placeholder {
  color: #94a3b8;
}

.error-404 .search-field:focus {
  border-color: #2563eb;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.08);
}

.error-404 .search-submit {
  height: 52px;
  padding: 0 24px;
  border: 1px solid #5274df;
  border-radius: 0 10px 10px 0;
  background: #5274df;
  color: #fff;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.3s ease, border-color 0.3s ease;
  -webkit-transition: background 0.3s ease, border-color 0.3s ease;
  -moz-transition: background 0.3s ease, border-color 0.3s ease;
  -ms-transition: background 0.3s ease, border-color 0.3s ease;
  -o-transition: background 0.3s ease, border-color 0.3s ease;
}

.error-404 .search-submit:hover {
  background: #3B54A4;
  border-color: #3B54A4;
}

/* Mobile */
@media (max-width: 576px) {
  .error-404 {
    min-height: 70vh;
    padding: 60px 20px;
  }

  .error-404 .page-title {
    font-size: 34px;
  }

  .error-404 .page-content {
    font-size: 15px;
  }

  .blogs-item .blog__img {
    height: 215px;
  }


}

.error-code {
  margin-bottom: 10px;
  color: var(--secondary);
  font-size: clamp(80px, 15vw, 160px);
  font-weight: 800;
  line-height: 0.9;
  letter-spacing: -8px;
  opacity: 0.12;
}

/* 404-error page */