@font-face {
  font-family: 'icomoon';
  src: url('../assets/fonts/icomoon/icomoon.eot');

  src: url('../assets/fonts/icomoon/icomoon.eot') format('embedded-opentype'),
    url('../assets/fonts/icomoon/icomoon.ttf') format('truetype'),
    url('../assets/fonts/icomoon/icomoon.woff') format('woff'),
    url('../assets/fonts/icomoon/icomoon.svg') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: block;
}

body{
  overflow: hidden;
}


/* hero section */
.landing-header-section {
  min-height: 1200px;
  display: flex;
  align-items: center;
}

.header-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 5rem;


}

.header-text h3 {

  font-family: var(--secondary-font);
  max-width: 1147px;
  font-weight: 700;
  font-size: 48px;
  line-height: 72px;
  text-align: center;



}


.header-text p {

  font-family: var(--secondary-font);
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  text-align: center;

  color: #454552;

  max-width: 656px;
}

.blur1 {


  position: absolute;
  width: 1156px;
  height: 1404.91px;


  background: linear-gradient(180deg, rgba(2, 29, 165, 0.5) 0%, rgba(17, 227, 171, 0.5) 100%);
  opacity: 0.1;
  filter: blur(17.9px);
  transform: translate(-50%, -50%);
  left: -2rem;
  border-radius: 9999px;
  z-index: -1;
  top: 13rem;

}


.blur2 {

  position: absolute;
  width: 476px;
  height: 578.49px;

  background: rgba(2, 29, 165, 0.47);
  opacity: 0.1;
  filter: blur(23.5px);
  border-radius: 999px;
  right: 0;
  transform: translate(50%, -50%);
  top: 12rem;
  z-index: -1;
}

.swiper1-feature3{

  width: 100%;
}

.swiper1-feature1,
.swiper1-feature2,
.swiper1-feature4,
.swiper1-feature5,
.swiper1-feature6,
.swiper1-feature7,
.swiper1-feature8{
  position: absolute;
  max-width: 30vw;
}
.swiper1-feature1
{
  animation: fadeInUp 0.5s ease-in-out forwards;

  right: 8rem;
  bottom: 2rem;
}
.swiper1-feature2{
  animation: fadeInUp 1s ease-in-out forwards;
  left: -6rem;
  bottom: 5rem;

}

.swiper1-feature4{
  animation: fadeInUp 1.5s ease-in-out forwards;
  right: 0rem;
  bottom: 10rem;

}
.swiper1-feature5{
  animation: fadeInUp 2s ease-in-out forwards;

  top: 15rem;
  right: 6rem;
}
.swiper1-feature6{
  animation: fadeInUp 1s ease-in-out forwards;

  top: 16rem;
  right: -1rem;
}
.swiper1-feature7{
  animation: fadeInUp 2.5s ease-in-out forwards;

  top: 11rem;
  right: 32rem;
}
.swiper1-feature8{
  animation: fadeInUp 3s ease-in-out forwards;

  top: 1rem;
  right: 22rem;
  z-index: -1;
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(20px) scale(0);
    
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

.swiper {
  width: 100%;
  height: 100%;
}

.swiper-slide {
  text-align: center;
  font-size: 18px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.swiper-pagination-bullet-active {
  background: #6E51E0;
  transform: scale(1.5);
}

.swiper-pagination-bullet {
  width: 13px;
  height: 13px;
}

.swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet,
.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
  margin: 0 8px;
}

.star1,
.star2,
.star3,
.star4,
.star5,
.star6 {
  
  position: absolute;
  z-index: 100;

}

.star1 {
  left: 15rem;
  top: 30rem;
  transition: transform 1s ease-in-out;
}

.star2 {
  top: 15rem;
  left: 26.5rem;
  transition: transform 1s ease-in-out;
  
}
.star1:hover,
.star4:hover,
.star3:hover,
.star6:hover,
.star5:hover,
.star2:hover{
  transform: rotate(360deg);
}

.star3 {
  right: 28.5rem;
  top: 25rem;
  transition: transform 1s ease-in-out;

}

.star4 {
  right: 16rem;
  top: 37rem;
  transition: transform 1s ease-in-out;

}
.star5 {
  right: 0;
  top: 7rem;
  transition: transform 1s ease-in-out;

}
.star6 {
  right: 6rem;
  top: 27rem;
  transition: transform 1s ease-in-out;

}

.swiper2 .swiper-wrapper {
  align-items: center;

}

.swiper-container {
  position: relative;
  max-width: 100%;
  overflow: hidden;
}

.swiper-container::before,
.swiper-container::after {
  content: "";
  position: absolute;
  top: 0;
  width: 100px;
  height: 100%;
  z-index: 10;
  pointer-events: none;
}

.swiper-container::before {
  left: 0;
  background: linear-gradient(to right, rgba(255, 255, 255, 0.9) 60%, rgba(255, 255, 255, 0));
}

.swiper-container::after {
  right: 0;
  background: linear-gradient(to left, rgba(255, 255, 255, 0.9)20%, rgba(255, 255, 255, 0));
}

.swiper2 {
  height: 111px;
  margin: 3rem 0;

}



/* about section  */
.about-section {
  font-family: var(--secondary-font);
  min-height: 1200px;
  display: flex;
  justify-content: center;
  align-items: center;

}

.text-title {

  font-weight: 600;
  font-size: 40px;
  line-height: 60px;
  color: var(--font-color);
}

.text-subtitle2 {

  font-weight: 600;
  font-size: 20px;
  letter-spacing: 0.04em;

  color: #000000;


}

.about-section-text {

  font-weight: 400;
  font-size: 16px;
  line-height: 144%;
  letter-spacing: 0.05em;

  color: #454552;


}

.about-section .left-col {
  padding-right: 80px;
}

.about-section .right-col {
  padding-left: 80px;
}

.silky-btn {

  height: 40px;
  padding: 7px 30px;
  background: var(--primary-color);
  border-radius: 50px;
  color: #ffff;
}

.about-section input {

  height: 50px;


  background: #FFFFFF;
  box-shadow: 0px 0.4px 1px rgba(102, 109, 128, 0.2), inset 0px 0px 0px 1px #E9EBF1;
  border-radius: 99px;

  width: 390px;
  border: none;
  padding: 0 15px;
}

.about-right-img {
  margin-bottom: 2rem;
}

.about-left-img {
  margin-top: 6rem;
}

.about-left-img,
.about-right-img {
  position: relative;
  transform: translateX(100%); 
}

@keyframes slideFromLeft {
  0% {
    transform: translateX(-50%); 
  }
  100% {
    transform: translateX(0); 
  }
}

@keyframes slideFromRight {
  0% {
    transform: translateX(50%); 
  }
  100% {
    transform: translateX(0); 
  }
}

.about-left-img {
  animation: slideFromLeft 1.5s ease-out forwards; 
}

.about-right-img {
  animation: slideFromRight 1s ease-out forwards;
}


/* features section */

.stats-row h3 {

  font-weight: 700;
  font-size: 24px;
  line-height: 29px;
  text-align: center;

  color: var(--primary-color);


}


.stats-row p {

  font-style: normal;
  font-weight: 400;
  font-size: 14px;
  line-height: 14px;
  text-align: center;

  color: #454452;


}

.stats-row .col-md-3 {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  max-width: 252px;
  height: 98px;

  background: #FFFFFF;
  box-shadow: 0px 0px 50px #F8F8F8;
  border-radius: 500px;

}

.folder-row h3 {


  font-family: var(--secondary-font);
  font-style: normal;
  font-weight: 600;
  font-size: 24px;
  line-height: 36px;
  text-align: center;

  color: var(--font-color);
  margin: 5rem 0;

}

.swiper3 {
  width: 100%;
  height: 600px; 
  overflow: hidden; 
  perspective: 2000px;
  
}

.swiper3 .swiper-slide{
  box-shadow: 0px 10px 30px rgba(0, 0, 0, 0.1); 
  transform: rotateY(0deg);
  transition: transform 1s ease;
  box-shadow: none;
  
}
.swiper3  .swiper-slide img {
  height: auto;
  object-fit: cover; 
  border-radius: 10px; 
  max-width: 100%;
}
.swiper-slide {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%; 
}
.folder-slider {
  display: flex;
  justify-content: center;
  align-items: center;
}


.swiper3 .swiper-slide > img:first-child {

  transition: transform 0.6s ease-in-out;
}
.swiper3 .swiper-slide-prev > img:first-child {
  transform: rotateX(-90deg);
}

.swiper3 .swiper-slide-active > img:first-child {
  transform: rotateX(0deg);
}

.swiper3 .swiper-slide-next > img:first-child {
  transform: rotateX(90deg);
}

.feature1,
.feature2,
.feature3 {

  position: absolute;

}

.feature1 {
  left: 5rem;
  top: 11rem;
  transform: translate(50%, 50%);
}


.feature2 {
  right: 1rem;
  top: 16rem;
  transform: translate(-50%, 50%);
}


.feature3 {
  left: 1rem;
  top: 21rem;
  transform: translate(50%, 50%);
}

.explore-btn {

  width: 228px;
  height: 47px;


  background: #FFFFFF;
  border: 1px solid #E6E6E6;
  border-radius: 3px;
  text-decoration: none;


  font-weight: 700;
  font-size: 14px;

  text-align: center;

  color: var(--font-color);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 3rem 0;
}


/* features section */

.services-section {
  background-image: url('../assets/images/landingPage/BG.svg');
  object-fit: cover;
  padding: 3rem 0;
}

.services-section .text-title {

  font-family: var(--secondary-font);
  font-style: normal;
  font-weight: 700;
  font-size: 48px;


  color: #000000;


}

.services-section .text-subtitle2 {

  font-family: var(--secondary-font);
  font-weight: 400;
  font-size: 20px;
  color: #000000;
}

.service-item {

  display: flex;
  flex-direction: column;
  padding: 30px;
  gap: 30px;
  margin: 10px;
  max-width: 370px;
  min-height: 202px;

  background: rgba(255, 255, 255, 1);
  box-shadow: 0px 10px 60px rgba(153, 153, 153, 0.07);
  border-radius: 22px;

}

.service-item-title {
  display: flex;
  align-items: center;
  gap: 2rem;
}

.service-item-title h3 {

  font-weight: 700;
  font-size: 24px;
  color: #000000;


}

.service-item-title p {



  font-family: var(--secondary-font);

  font-weight: 500;
  font-size: 16px;
  line-height: 24px;

  color: #000000;

}

.feature-img {

  padding: 13px;

  background: #021DA5;
  border-radius: 12px;

}



[class^="icon-"],
[class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'icomoon' !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  display: inline-block;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-pen::before {

  content: "\e902";

}

.icon-layout:before {

  content: "\e901";

}

.icon-intersect:before {

  content: "\e900";

}

.icon-pen {
  font-size: 30px;
  color: #fff;
}

.icon-layout {
  font-size: 30px;
  color: #fff;
}

.icon-intersect {
  font-size: 30px;
  color: #fff;
}

.service-item:hover {
  background-color: #11E3AB;
  color: #FFFFFF;
  transition: all 0.3s ease-in-out;

}

.service-item:hover .feature-img {

  background-color: #FFFFFF;
  transition: all 0.3s ease-in-out;
}

.service-item:hover [class^="icon-"],
.service-item:hover [class*=" icon-"] {
  color: #021DA5;
  transition: all 0.3s ease-in-out;

}

.service-item:hover h3 {

  color: #FFFFFF;
  transition: all 0.3s ease-in-out;
}


/* curve line section */

.process-section {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 40px;
  margin: auto;
}

.process-content {
  max-width: 400px;
  margin-bottom: 40px;
}

.section-title {
  color: #000000;

  font-weight: 800;
  font-size: 40px;
  line-height: 48px;
}

.highlight {
  color: #021DA5;
}

.section-desc {

  width: 303px;


  font-family: var(--secondary-font);
  font-weight: 500;
  font-size: 16px;
  line-height: 30px;
  letter-spacing: -0.02em;

  color: #64607D;


}
#animated-path {
  stroke-dasharray: 1500;  
  stroke-dashoffset: 1500; 
  animation: none; 
}

@keyframes draw-line {
  from {
      stroke-dashoffset: 1500;
  }
  to {
      stroke-dashoffset: 0; 
  }
}
.process-steps {
  position: relative;
  width: 100%;
  margin: auto;
  transform: translate(0, -50%);
  z-index: -1;
}

.process-line {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  z-index: -1;
}

.step {
  position: absolute;
  display: flex;
  align-items: center;
  padding: 10px;
  border-radius: 8px;
  max-width: 290px;
  min-height: 252px;
  display: flex;
  align-items: start;
  flex-direction: column;
  gap: 2rem;
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.8s ease-in-out, transform 0.8s ease-in-out;
}

.step-1 {
  top: 75%;
  left: 11%;
}

.step-2 {
  top: 45%;
  left: 45%;
}

.step-3 {
  top: -8%;
  right: 6%;
}

.step-icon {
  position: absolute;
  width: 85px;
  height: 204px;

  font-weight: 900;
  font-size: 204px;
  line-height: 204px;
  letter-spacing: -0.02em;

  color: #000000;
  top: 0;
  opacity: 0.05;
  right: 0;
}

.step-content h4 {

  font-weight: 800;
  font-size: 16px;
  line-height: 30px;
  letter-spacing: -0.03em;

  color: #000000;


}

.step-content p,
.contact-section .col-md-4 p {


  font-weight: 500;
  font-size: 16px;
  line-height: 30px;
  letter-spacing: -0.02em;
  color: #64607D;
}

.step.visible {
  opacity: 1;
  transform: translateY(0);
}
/* contact section  */

.contact-section {
  background-image: url("../assets/images/landingPage/Vector\ 1578.svg");
  object-fit: cover;
  min-height: 1200px;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  padding: 3rem 0;

}

.services-title{

font-family: var(--secondary-font);
font-weight: 600;
font-size: 24px;

text-align: center;

color: #0D0C46;


}
.single-card-container {
  background-image: url("../assets/images/landingPage/Group99.png");
  max-width: 830px;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 400px;
  margin-bottom: 3rem;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  border-radius: 15px;
  padding: 15px;

}

.single-card-container h3 {

  font-weight: 800;
  font-size: 42px;
  line-height: 60px;
  text-align: center;
  letter-spacing: -0.03em;

  color: #FFFFFF;


}


.single-card-container p {

  font-weight: 800;
  font-size: 14px;
  letter-spacing: -0.03em;

  color: #FFFFFF;


}


.single-card-container h4 {

  font-family: var(--secondary-font);
  font-weight: 400;
  font-size: 16px;
  line-height: 30px;
  text-align: center;
  letter-spacing: -0.02em;

  color: #FFFFFF;




}

.single-card-text {
  text-align: center;
  max-width: 590px;

}
.single-card-text .btn:hover {
  color: #FFFFFF;
}
.contact-section .col-md-2 {
  max-width: 380px;
  min-height: 260px;
  background: #FFFFFF;
  border-radius: 20px;
  padding: 20px 10px;
}
.contact-section .col-md-2 {
  display: flex;
  flex-direction: column;
  align-items: start;
  justify-content: center;
  gap: 15px;
}
.contact-section .col-md-2 img {
  margin: 1rem 0;
  width: 60px;
  height: 60px;
}

.contact-section .col-md-2 h3 {

font-family: var(--secondary-font);
font-weight: 700;
font-size: 20px;

color: #000000;

  color: #16012C;
}
.contact-section .col-md-2 p {

font-weight: 500;
font-size: 14px;
color: #64607D;
}

.companies-title{

font-family: var(--secondary-font);
font-weight: 500;
font-size: 28.75px;
color: #060B13;
margin: 4rem 0;

}
.companies-wrapper{
  gap: 5rem;
}
.more-btn {

  border-radius: 10px;
  width: 260px;
  height: 60px;

  background: #021DA5;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #FFFFFF;
}

/* countries-section */

.countries-pins{
  position: relative;
margin: 4rem 0;

}
.pin1,
.pin2,
.pin3,
.pin4{
  position: absolute;
  z-index: 10000;
}

.pin1{
  left: 45%;
  top: -4rem;
}
.pin2{
  left: 56%;
  
}

.pin3{
  right: 7%;
  
}
.pin4{
  right: 37%;
  top: 5%;
}
.pin {
  position: absolute;
}

.pin.animate {
  animation: bounce 1s ease forwards infinite;
}

@keyframes bounce {
  0% {
    transform: translateY(-10px);
    opacity: 0;
  }
  60% {
    transform: translateY(30px);
    opacity: 1;
  }
  80% {
    transform: translateY(-15px);
  }
  100% {
    transform: translateY(0);
  }
}

.pin1 {
  left: 45%;
  top: -4rem;
}

.pin2 {
  left: 56%;
}

.pin3 {
  right: 7%;
}

.pin4 {
  right: 37%;
  top: 10%;
}


.country-section-feature{
  display: flex;
  align-items: center;
  gap: 30px;

}


.countries-section-row{


gap: 6rem;

}


.globe-subtitle{

font-weight: 500;
font-size: 14px;
text-align: center;

color: #0D0C46;


}

.globe-section img {
  max-width: 100%;
}
.globe-title{
 
font-weight: 700;
font-size: 36px;
text-align: center;
color: #0D0C46;


}
.article-title{
 
font-weight: 500;
font-size: 16px;
color: #0D0C46;


}
.article-description{

font-weight: 400;
font-size: 14px;
color: #454552;


}


.articles-section .col-md-4 {
 width: 330px;

background: #FFFFFF;
box-shadow: 0px 0px 50px #F8F8F8;
border-radius: 10px;
padding: 10px 20px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding-bottom: 2rem;

}
.article-card{
  display: flex;
  flex-direction: column;
}

.article-text {
  padding: 0 15px;
}
.blur4 {

position: absolute;
width: 1424px;
height: 1271px;
transform: translate(0, -50%);
background: rgba(17, 227, 171, 0.14);
opacity: 0.3;
filter: blur(47.55px);
z-index: -1;
top: 20rem;

}




@media (max-width: 1024px) {
  .process-steps svg{
    width: 100%;

  }

  .newsletter-links{
    flex-wrap: wrap;
  }
  
  .swiper1-feature1
  {
    right: 21%;
    bottom: 5%;
  }
  .swiper1-feature2{
    left: -11%;
    bottom: 11%;
  }
  
  .swiper1-feature4{
    
    right: 3%;
    bottom: 20%;

  }
  .swiper1-feature5{
    top: 34%;
    right: 28%;
  }
  
  .swiper1-feature6{
    top: 35%;
    right: 15%;
  }
  .swiper1-feature7{
    top: 21%;
    left: -12%;
  }
  .swiper1-feature8{
    top: 8.5%;
    right: 53%;
  }

.feature1,
.feature3{
  left: -7rem;
}
.feature2{
  right: -7rem;
}

}


@media (max-width: 768px) {
  

  .header-text h3{
    font-size: 35px;
  }

  .about-section .right-col,
  .about-section .left-col {
    padding: 15px;
  }
  .services-section .text-title {
    font-size: 25px;
  }
  .service-item{
    padding: 17px;
    width: 227px;

  }
  .service-item-title {
  gap: 1rem;
  }

  .service-item-title h3{
    font-size: 18px;
  }


  .step-icon{
    font-size: 144px;

  }

  .step{
    max-width: 185px;

  }

  .step-point {
  top: -4rem;
  }

  .step-1{
    top: 62%;
    left: 11%;
  }

  .step-2{
    top: 43%;
    left: 45%;
  }
  .step-3{
    top: 15%;
    right: -5%;

  }

  .country-section-feature{

    flex-wrap: wrap;
  } 
  .newsletter-right-side{
    align-items: center;
    gap: 2rem;
  }

  
.swiper1-feature1
{
  right: 24%;
  bottom: 7%;
}
.swiper1-feature2{
  left: -4%;
  bottom: 17%;
}

.swiper1-feature4{
  

  right: 6%;
  bottom: 22%;
}
.swiper1-feature5{
  top: 34%;
  right: 28%;
}

.swiper1-feature6{
  top: 35%;
  right: 15%;
}
.swiper1-feature7{
  top: 27%;
  left: -7%;
}
.swiper1-feature8{
  top: 17.5%;
  right: 62%;
}


.email-input input{
  width: 300px;
}
.email-input button{
  width: 100px;

}

}


@media (max-width: 490px) {
  .process-section{
    min-height: 980px;
  }
  .step{
    max-width: 100px;
  }

  .step-icon{
    font-size:80px
  }

  .step-point img {
    width: 50px;
  }

  .step-1 {
    top: 50%;
    left: 0%;
}

.step-2 {
  top: 43%;
  left: 35%;
}

.step-3 {
  top: 32%;
  right: 0%;
}
.single-card-container h3 {
font-size: 30px;
}

.single-card-container h4{
  font-size: 14px;

}

.service-item{
  width: 100%;
}

.country-section-feature{
  justify-content: start;
}

.email-input input{
  width: 300px;
}

.email-input button{
  width: 100px;
  right: -3rem;
  font-size: 12px;
}

.email-input input::placeholder{
  font-size: 12px;
}
.footer-row .col-md-2,
.social-icons{
  justify-content: center !important;
}

.feature1,
.feature2,
.feature3 {

  width: 160px;

}

.feature1{
  left: -5rem;
}
.feature3{
  left: -6rem;

}
.feature2 {
  right: -5rem;
}

.pin1,
.pin2,
.pin3,
.pin4{

  width: 100px;
}

.star1{
  left: 0;
}
.star4{
  right: 0;
}

.contact-section .row{
  padding: 0 1rem;
}

}


@media (max-width: 350px) {
  .step-content h4{
    font-size: 14px;
  }
  .step-content p{
  font-size: 12px;
  }

  .step-1{
    left: -8%;
  }
  .step-3{
    right: -14%;
  }
  .step-2 {
    left: 28%;
}
}