* {
  padding: 0;
  margin: 0;
}
body {
  width: 100%;
  /* border:  0.1rem solid red; */
  overflow: hidden;

}
html {
  font-size: 62.5%;

  overflow-x: hidden;


}

.title {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 6rem 5rem;
  padding-top: 2.5rem;
  justify-content: space-between;
  background-color: #f4fbff;
  height: auto;
  width: 100%;
  box-sizing: border-box;
  gap: 2rem;
  padding-bottom: 0;
}
.hero-section {
  display: flex;
  align-items: center;
  padding: 0rem 5rem;
  justify-content: space-between;
  background-color: #f4fbff;
  /* height: 30vh; */
}
.hero-payments {
  width: 29.1rem;
  border-radius: 2.6rem;
  border: none;
  box-shadow: 0rem 0.1rem 0.4rem 0rem #626262;
  background-color: #23a6f0;
  color: #fff;
  display: flex;
  align-items: center;
  white-space: nowrap;
  justify-content: center;
  gap: 1rem;
  font-size: 1.6rem;
  font-family: "Poppins", sans-serif;
  font-weight: 400;
  padding: 1rem;
  /* line-height: 100%; */
  letter-spacing: 0.1rem;
  box-sizing: border-box;
}
.title h1 {
  font: 700 3.6rem "Arial", sans-serif;
  padding-bottom: 2.8rem;
  /* line-height: 100%; */
  letter-spacing: 0.2rem;
}

.title p {
  font: 400 1.6rem "Poppins", sans-serif;
  /* line-height: 100%; */
  letter-spacing: -0.06rem;
  color: #565656;
}
.get {
  display: flex;
  align-items: center;
  gap: 2rem;
  color: #fff;
  padding-right: 17rem;
}
.arrow {
  width: 45%;
}
.get img:first-child {
  width: 100%;
  transform: translateY(20px);
}
.getit span {
  font: 500 1.3rem "Inter", sans-serif;
  /* line-height: 100%; */
  letter-spacing: -0.06rem;
}
.get .hero-playstore,
.get .hero-appstore {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  background-color: #000;
  width: 45%;
  /* height: ; */
  border-radius: 0.753rem;
  padding: 1rem 1.5rem;
  gap: 0.1rem;
  box-sizing: border-box;
}
.app p {
  color: #fff;
  font: 400 1.6rem "Inter", sans-serif;
  /* line-height: 100%; */
  letter-spacing: -0.06rem;
}
.app {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
}

.licensed-nd-insured {
  display: flex;
  gap: 2rem;
  font: 400 1.6rem "Inter", sans-serif;
  /* line-height: 100%; */
  letter-spacing: -0.06rem;
  padding-bottom: 2rem;
  /* padding-right: 12rem; */
}
.licensed img {
  padding-right: 1rem;
}
.licensed,
.insured {
  display: flex;
  align-items: center;
  justify-content: center;
}
.mobile-img {
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
  /* width: 70%; */
}

.mobile-img img {
  width: 30%;
}

.img14 {
  transform: translateX(15%);
}
.img15 {
  position: relative;
  z-index: 999;
}
.img16 {
  transform: translateX(-15%);
}

.partners-section {
  background-color: #fff;
  padding: 3rem 5rem;
  /* padding-left: 0;
  padding-right: 0; */
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5rem;
  width: 100%;
  box-sizing: border-box;
  padding-bottom: 6rem;
}
/* .partners-section p {
  text-align: center;
  font: 400 2.5rem "Poppins", sans-serif;
  line-height: 3.2rem; 
  letter-spacing: 0.098rem;
} */
.partners-section-h1 {
  text-align: center;
  font: 700 3.2rem "Arial", sans-serif;
  /* line-height: 3.3rem; */
  letter-spacing: 0.1rem;
  /* padding-top: 5rem; */
}
.partners-section-p {
  font: 400 2.1rem "Poppins", sans-serif;
  /* line-height: 1.51rem; */
  letter-spacing: 0.015rem;
  color: #717171;
}
.keyframe-container, .feedbacks-container {
  width: 95%;
  /* padding: 0 5rem; */
  overflow: hidden;
  position: relative;
  margin: auto;
}
.inner {
  width: max-content;
  display: flex;
  animation: autoscroll 28s linear infinite;
  /* padding: 0 5rem; */
}
.inner.ani:hover{
  animation-play-state:paused;
}
.keyframes, .feedbacks {
  display: flex;
  align-items: center;
  
}
.keyframes img {
  width: 19.4rem;
  height: 5.7rem;
  object-fit: contain;
  margin-right: 5rem;
}

@keyframes autoscroll {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-50%);
  }
}


.Cratcash {
  background-color: #fff;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 15rem;
  padding: 5rem 0;
  width: 100%;
  box-sizing: border-box;
}

.blue {
  color: #007ecc;
}
.crat-text {
  width: 60%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  box-sizing: border-box;
}
.crat-text h1 {
  font: 700 2.8rem "Arial", sans-serif;
  /* line-height: 4.4rem; */
  color: #4d4d4d;
  letter-spacing: 0%;
  /* white-space: nowrap; */
}
.crat-text p {
  font:400 1.6rem "Poppins", sans-serif;
  
  color: #18191f;
  /* line-height: 2.4rem; */
  letter-spacing: 0%;
  padding-top: 2rem;
}

.income-container {
  display: flex;
  flex-wrap: wrap;
  /* max-width: 48rem; */
  gap: 2rem;
  box-sizing: border-box;
  width: 40%;
 
}
.income {
  display: flex;
  /* justify-content: flex-start; */
  gap: 12rem;
  /* width: 40%; */
}
.income-box {
  flex-shrink: 1;
}

.numbers {
  display: flex;
  flex: 1 1;
  align-items: flex-start;
  /* justify-content: space-between; */
  gap: 2rem;
}
.numbers img {
  background-color: #3eb1f221;
  padding: 1.2rem 1.1rem;
  border-radius: 50%;
}
.income-text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1rem;
}
.income-text h1 {
  font: 700 2.8rem "Inter", sans-serif;
  color: #4d4d4d;
  /* line-height: 3.6rem; */
  letter-spacing: 0%;
}
.income-text p {
  font: 400 1.9rem "Poppins", sans-serif;
  /* line-height: 2.4rem; */
  letter-spacing: 0%;
  color: #717171;
}

.send-share-scan {
  background-color: #f8f8f8;
  padding: 5rem;
  padding-bottom: 0;
}
.send-share-scan h1 {
  font: 700 2.8rem "Arial", sans-serif;
  /* line-height: 100%; */
  letter-spacing: 0.02rem;
  padding-bottom: 2rem;
}
.send-share-scan-container {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.send {
  background-color: #005b97;
  width: 30%;
  height: 60rem;
  border-radius: 1rem;
  padding: 2rem 1rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 0;
  /* overflow: hidden; */
}
.send-text h1 {
  font: 700 2.2rem "Arial", sans-serif;
  /* line-height: 100%; */
  letter-spacing: 0rem;
  color: #fff;
}
.send-text p {
  font: 400 1.6rem "Poppins", sans-serif;
  /* line-height: 100%; */
  letter-spacing: 0.1rem;
  color: #fff;
  /* padding-bottom: 2rem; */
}
.img-container {
  display: flex;
  align-items: center;
  justify-content: center;
}
.share {
  background-color: #4b53ab;
  width: 30%;
  height: 60rem;
  border-radius: 1rem;
  padding: 2rem 1rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 0;
}
.share-text h1 {
  font: 700 2.2rem "Arial", sans-serif;
  /* line-height: 100%; */
  letter-spacing: 0rem;
  color: #fff;
}
.share-text p {
  font: 400 1.6rem "Poppins", sans-serif;
  /* line-height: 100%; */
  letter-spacing: 0.1rem;
  color: #fff;
  padding-bottom: 2rem;
}
.scan {
  background-color: #00999f;
  width: 30%;
  height: 60rem;
  border-radius: 1rem;
  padding: 2rem 1rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 0;
  
}
.scan-text h1 {
  font: 700 2.2rem "Arial", sans-serif;
  /* line-height: 100%; */
  letter-spacing: 0rem;
  color: #fff;
}
.scan-text p {
  font: 400 1.6rem "Poppins", sans-serif;
  /* line-height: 100%; */
  letter-spacing: 0.1rem;
  color: #fff;
  padding-bottom: 2rem;
}
.img-container3 {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}
.card {
  position: absolute;
  top: 12rem;
  left: 10rem;
  bottom: 5rem;
  /* box-shadow: 0rem 0.1rem 0.13rem 0.2rem #524E4E40; */
}


.middle-man {
  background-color: #f5f9fd;
}
.middle-man,
.invest,
.debit-container,
.invest-future-money,
.tap-pay-sect,
.smart-wallet,
.stay-connected,
.your-satisfaction,
.save {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  padding: 5rem;
  gap: 5rem;
}

.right-invest,
.left-debit,
.right-invest-future-money,
.left-tap-pay-sect,
.right-smart-wallet,
.left-save {
  background-color: #3375e0;
  /* height: 43rem; */
  width: 45%;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 1rem;
  padding-top: 3rem;
  box-sizing: border-box;
  
}
.left-tap-pay-sect, 
.right-smart-wallet {
  background-color: #288ACB;
}
.left-middleman {
    background-color: #3375e0;
    /* height: 43rem; */
    padding-top: 3rem;
    width: 45%;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 1rem;
    box-sizing: border-box;
}
.right-middleman,
.left-invest,
.right-debit,
.left-invest-future-money,
.right-tap-pay-sect,
.left-smart-wallet,
.right-stay-connected,
.right-your-satisfaction,
.right {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  gap: 2rem;
  width: 50%;
  box-sizing: border-box;
}
.right-middleman h1,
.left-invest h1,
.right-debit h1,
.left-invest-future-money h1,
.right-tap-pay-sect h1,
.left-smart-wallet h1,
.right-stay-connected h1,
.right-your-satisfaction h1,
.right h1 {
  font: 700 3.2rem "Arial", sans-serif;
  /* line-height: 4.4rem; */
  letter-spacing: 0rem;
  padding-bottom: 2rem;
}
.right-middleman p,
.left-invest p,
.right-debit p,
.left-invest-future-money p,
.right-tap-pay-sect p,
.left-smart-wallet p,
.right-stay-connected p,
.right-your-satisfaction p,
.right p {
  font: 400 2.3rem "Poppins", sans-serif;
  /* line-height: 3.3rem; */
  letter-spacing: 0.1rem;
  color: #737373;
}
.right-middleman button,
.left-invest button,
.right-debit button,
.left-invest-future-money button,
.right-tap-pay-sect button,
.left-smart-wallet button,
.right button {
  background-color: #003fa3;
  padding: 0.59rem;
  border: none;
  border-radius: 2.6rem;
  width: 17.8rem;
  height: 5.6rem;
  font: 700 2.097rem "Arial", sans-serif;
  /* line-height: 100%; */
  letter-spacing: 0.012rem;
  color: #fff;
}
.left-stay-connected {
  width: 45%;
}
.left-stay-connected img {
  width: 100%;
}
.left-save {
  background-color: #4B53AB;
}
/* .left-stay-connected {
  
  height: 45rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.left-stay-connected img:first-child {
  position: absolute;
  bottom: 1rem;
  left: 5rem;
  
}
.left-stay-connected img:nth-child(2) {
  position: absolute;
  bottom: 3rem;
  left: 25rem;
}
.left-stay-connected img:nth-child(3) {
  position: absolute;
  top: 9rem;
  left: 25rem;
  z-index: 5;
  
}
.left-stay-connected img:nth-child(4) {
  position: absolute;
  top: 2rem;
  left: 20rem;

}
.left-stay-connected img:nth-child(5){
  position: absolute;
  left: 11.5rem;
  top: 2rem;
}
.stay-connected-card {
  position: relative;
  width: 100%;
  height: 100%;
} */
.left-your-satisfaction {
  width: 45%;
}
.left-your-satisfaction img{
  width: 100%;
}
/* .left-stay-connected {
  width: 45%;
}
.left-stay-connected img {
  width: 100%;
} */
.invest {
  background-color: #f8f8f8;
}

@media (max-width: 111.2rem) {
  .Cratcash {
    gap: 5rem;
  }
}

/* .invest-money-card {
  position: relative;
  height: 40rem;

  display: flex;
  align-items: flex-end;
  justify-content: center;
} */

.imc-img-div {
  width: 100%;
  max-width: 300px;
  position: relative;
}

.imc-img {
  width: 100%;
  max-width: 100%;
  /* height: 100%; */
}

.sticky1 {
  position: absolute;
  width: 190px;
  left: calc(100% - (190px / 2));
  top: calc(13%);

  /* top: 75px; */
  /* right: 0; */
  /* transform: translate(0px, -130px); */
  /* width: 50%; */
}

.sticky2 {
  position: absolute;
  width: 160px;
  left: calc((-160px / 2));
  top: calc(40%);

  /* top: 180px; */
  /* left: 0; */
  /* transform: translate(10px, -75px); */
}
.smart-wallet {
  background-color: #F2FAFF;
}
.img-card {
  position: relative;
}
.smart-card {
  position: absolute;
  right: -8rem;
  top: 15rem;
}
.debit {
  background-color: #e9f5fc;
}
.debit h1 {
  text-align: center;
  padding-top: 5rem;
  font: 700 3.2rem "Arial", sans-serif;
  /* line-height: 3.3rem; */
  letter-spacing: 0.1rem;
}

.debit-container,
.invest-future-money {
  align-items: center;
  /* padding-top: 0rem; */
}
.left-debit,
.right-invest-future-money {
  background-color: #4b53ab;
}
.tap-pay-sect {
  background-color: #eaf0ff;
}
.right-stay-connected ul {
  padding-left: 2.2rem;
}
.right-stay-connected ul li {
  font: 400 1.6rem "Arial", sans-serif;
  /* line-height: 100%; */
  letter-spacing: 0%;
  list-style-image: url(../images/Vector\ \(7\).png);
  padding-top: 2rem;
}

.how-sect h1 {
  text-align: center;
  padding-top: 6rem;
  padding-bottom: 6rem;
  font: 700 3.2rem "Arial", sans-serif;
  /* line-height: 3.3rem; */
  letter-spacing: 0.1rem;
}
.how-container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 4rem;
  padding: 0 5rem;
  min-width: 100%;
  box-sizing: border-box;
  padding-bottom: 6.7rem;
}
.left-how {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  gap: 4rem;
  /* gap: 5rem; */
  width: 50%;
  box-sizing: border-box;
}
.left-how h2 {
  font: 500 2.4rem "Poppins", sans-serif;
  /* line-height: 100%; */
  letter-spacing: 0.1rem;
}
.steps {
  display: flex;
  flex-direction: column;
  gap: 5rem;
}
.step {
  display: flex;
  align-items: flex-start;
  gap: 4rem;
}
.step-content h3 {
  font: 700 2.2rem "Arial", sans-serif;
  /* line-height: 125%; */
  letter-spacing: 0%;
  padding-bottom: 1.5rem;
}
.step-content p {
  font: 500 1.8rem "Poppins", sans-serif;
  color: #737373;
  /* line-height: 2.2rem; */
  letter-spacing: 0.015rem;
}
.left-how button {
  width: 20rem;
  height: 5.6rem;
  padding: 0.59rem;
  border: none;
  border-radius: 2.6rem;
  background-color: #007ecc;
  color: #e3eefff5;
  font: 700 2rem "Arial", sans-serif;
  /* line-height: 100%; */
  letter-spacing: 0.012rem;
}
.right-how {
  background-color: rgba(0, 91, 151, 1);
  /* height: 43rem; */
  width: 45%;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 1.5rem;
  padding-top: 2rem;
  box-sizing: border-box;
}

.users-feedbacks {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2rem;
  padding: 5rem;
}
.users-feedbacks h1 {
  font: 700 3.2rem "Arial", sans-serif;
  /* line-height: 4.4rem; */
  letter-spacing: 0%;
}
.users-feedbacks-p {
  font: 400 2.1rem "Poppins", sans-serif;
  /* line-height: 1.5rem; */
  letter-spacing: 0.015rem;
  color: #717171;
  padding-bottom: 5rem;
}

.feedbacks {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 7rem;
}
.feedback-box {
  width: 32rem;
  display: flex;
  flex-direction: column;
  gap: 2rem;
  margin-right: 5rem;
}
.feedback-box p {
  font: 400 1.5rem "Poppins", sans-serif;
  /* line-height: 100%; */
  letter-spacing: 0%;
  color: #737373;
}


.user {
  display: flex;
  gap: 1.5rem;
}
.user-details h2 {
  font: 600 1.7rem "Inter", sans-serif;
  /* line-height: 100%; */
}
.ready {
  background-image: url(../images/image\ 97.png);
  background-color: #007ecc;
  width: 100%;
  height: 21rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1rem;
}
.ready h1 {
  font: 500 2.02rem "Poppins", sans-serif;
  color: #fff;
  /* line-height: 150%; */
  letter-spacing: 0%;
  text-align: center;
}
.ready button {
  background-color: #005b97;
  color: #e3eefff5;
  font: 700 2rem "Arial", sans-serif;
  letter-spacing: 0.012rem;
  /* line-height: 100%; */
  border: none;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  border-radius: 0.5rem;
  padding: 0.59rem;
}

@media screen and (max-width: 1250px) {
  .sticky1 {
    width: 135px;
    left: calc(100% - (135px / 2));
    top: calc(15%);
  }

  .sticky2 {
    width: 130px;
    left: calc((-130px / 2));
    top: calc(40%);
  }
}

@media (max-width: 75rem) {
   .Cratcash {
    flex-direction: column;
  }
  .crat-text {
    width: 100%;
  }
  
  .income-box {
    flex: 1 1;
    width: 50%;
  }
.numbers {
  display: flex;
  justify-content: none;
}
}
@media (max-width: 65rem) {
  .send, .share {
    height: 64rem;
  }
}
@media (max-width: 66.5rem) {
  .send-share-scan-container {
    flex-wrap: wrap;
    box-sizing: border-box;
  
  }
  .send, .share {
    width: 45%;
    margin-top: 5rem;
  }

  .scan {
    margin: 5rem 0; 
    width: 100%;
  }
  
}
.img-container, .img-container3 {
  /* overflow: hidden; */
}
@media (max-width: 61rem) {
   
.how-container {
      flex-direction: column;
  }
  .left-how, .right-how {
      width: 100%;
  }
  .your-satisfaction {
    flex-direction: column;
  }
  .left-your-satisfaction {
    width: 100%;
  }
  .right-your-satisfaction {
    width: 100%;
  }
} 

@media (max-width: 51rem) {
 .middle-man,
.debit-container,
.tap-pay-sect,
.stay-connected,
.your-satisfaction,
.save {
  flex-direction: column-reverse;
 }

.invest,
.invest-future-money,
.smart-wallet {
  flex-direction: column;
  gap: 5rem;
}
.left-middleman,
.right-invest,
.left-debit,
.right-invest-future-money,
.left-tap-pay-sect,
.right-smart-wallet,
.left-stay-connected,
.right,
.left-save {
  width: 100%;
}
.right-middleman,
.left-invest,
.right-debit,
.left-invest-future-money,
.right-tap-pay-sect,
.left-smart-wallet,
.right-stay-connected,
.right-your-satisfaction {
  width: 100%;
}

.right-how img {
  width: 30%;
}
.right-smart-wallet img {
  /* width: 30%; */
}
.left-middleman img {
  /* width: 30%; */
}
}
@media (max-width: 40rem) {
 
  .get {
    padding-right: 10rem;
  }
  .send-share-scan-container {
    flex-direction: column;
  }
  .send, .scan, .share {
    width: 100%;
    margin-top: 5rem;
    height: 60rem;
    transform: translateX(-10px);
  }
  /* .card {
    width: 5rem;
    display: flex;
    flex-shrink: 1;
  } */
   .income{
      gap: 5rem;
   }
}

@media (max-width: 32.5rem) {
  body h1, body h2{
    text-align: center;
  }
   body p {
    text-align: center;
  }
  .btn {
    margin: 0 auto;
  }
  .crat-text p, 
  .right-stay-connected p,
  .steps p, 
  .feedback-box p, .app p {
    text-align: start;
  }
  .licensed-nd-insured {
    gap: 1rem;
  }
  .arrow {
    transform: translateX(2rem);
  }
  .income {
    flex-direction: column;
  }
  .income-container{
    gap: 5rem;
  }
  .img-container{
    overflow: hidden;
    width: 72%;
  }
  .img-container img {
    width: 100%;
  }
  
  .img-container3 {
    width: 72%;
  }
  .img-container3 img:first-child {
    width: 100%;
  }
  .card  {
    width: 65%!important;
    top: 15rem;
    left: 15rem;
  }
  .left-middleman, 
  .right-invest, 
  .left-debit, 
  .right-invest-future-money,
  .right{
    /* height: 43rem; */
    width: 100%;
  }

  /* .right-invest-future-money {
    display: flex;
    align-items: center;
    justify-content: flex-end;
  } */
  .left-middleman img, 
  .right-invest img,
  .left-debit img,
  .right-invest-future-money img:first-child,
  .left-tap-pay-sect img,
  .img-card img:first-child,
  .left-save img{
    width: 55%;
    /* transform: translateY(5.2rem); */
  }
  /* .right-invest-future-money img {
    width: 50%;
  } */
  .imc-img  {
    margin: 0 auto;
    transform: translateX(30%);
  }
  .sticky1 {
    width: 120px;
    left: calc(70% - (125px / 2));
    top: calc(15%);
  }

  .sticky2 {
    width: 110px;
    left: calc((-10px / 2));
    top: calc(40%);
  }
.smart-card {
  width: 30%;
  width: 100px;
    left: calc(30% - (125px / 2));
    top: calc(15%);
}
  .img-card img  {
    margin: 0 auto;
    transform: translateX(40%);
  }

  
}

@media (max-width: 34rem) {
  .arrow {
    transform: translateX(3rem);
    width: 13rem;
  }
  .getit span, .app p {
    font-size: 1rem;
  }
  .get .hero-playstore, .get .hero-appstore {
    padding: 1rem;
  }
  .app img {
    width: 25%;
  }
  .footer-scc {
    flex-wrap: wrap;
  }
}

@media (max-width: 26.5rem) {
  .your-satisfaction {
    padding: 2rem;
  }
  .card {
    top: 12rem;
    left: 10rem;
  }
   .imc-img  {
    margin: 0 auto;
    transform: translateX(40%);
  }
   .sticky1 {
    width: 80px;
    left: calc(70% - (50px / 2));
    top: calc(15%);
  }

  .sticky2 {
    width: 80px;
    left: calc((60px / 2));
    top: calc(40%);
  }
}


.ready a {
  text-decoration: none;
}

.fade-zoom {
  opacity: 0;
  transform: scale(0.9);
  transition: opacity 0.5s ease, transform 0.5s ease;
  will-change: opacity, transform;
}


@keyframes zoom {
  0% {
    opacity: 0;
    transform: scale(0.9);
  }
  50% {
    opacity: 0.5;
    transform: scale(1.02);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}

/*  Active state triggers the animation */
.fade-zoom.active {
  animation: zoom 0.7s forwards;
}

.fade-zoom:nth-child(1).active { animation-delay: 0.2s; }
.fade-zoom:nth-child(2).active { animation-delay: 0.4s; }
.fade-zoom:nth-child(3).active { animation-delay: 0.6s; }
.fade-zoom:nth-child(4).active { animation-delay: 0.8s; }

.slide-left,
.slide-right,
.slide-up {
  opacity: 0;
  will-change: transform, opacity;
  transition: transform 0.8s ease, opacity 0.8s ease;
}

/* starting positions */
.slide-left  { transform: translateX(-30px); }
.slide-right { transform: translateX(30px);  }
.slide-up    { transform: translateY(30px);  }

/* active states (explicit translateX/Y for clarity) */
.slide-left.active  { opacity: 1; transform: translateX(0); }
.slide-right.active { opacity: 1; transform: translateX(0); }
.slide-up.active    { opacity: 1; transform: translateY(0); }

/* STAGGER: use .stagger-child on the elements you want staggered */
.stagger .stagger-child {
  opacity: 0;
  transform: translateY(20px);
  transition: transform 0.6s ease, opacity 0.6s ease;
}

/* when parent gets .active, children will animate in (with JS-applied delays) */
.stagger.active .stagger-child {
  opacity: 1;
  transform: translateY(0);
}


/* .debit h1:first-child {
  padding-left: 5rem;
}
.right-debit h1 {
  padding-left: 0!important;
} */



@media (max-width:24rem) {
  .arrow img{
    transform: translateX(2.5rem)!important;
  }
  .licensed p, .insured p {
    font-size: 1.5rem;
  }
}

body p {
  font-size: 1.8rem!important;
}
.right-stay-connected ul li {
  font-size: 1.8rem!important;
}
.feedback-box p {
  font-size: 1.5rem!important;
}

@media (max-width: 1421px) {
  .hero-section {
    /* height: 30vh; */
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
  .hero-container {
  /* height: 60vh; */
  box-sizing: border-box;
}
 .mobile-img img{
    width: 13vw;
  }
  
}
@media (max-width: 1117px) {
  /* .hero-section {
    padding-bottom: 0;
    height: 45vh;
  } */

  .send-share-scan {
    padding-top: 1rem;
  }
}
 @media (max-width: 1217px) {
  .send, .scan,.share {
    height: 70rem;
    overflow: hidden;
    gap: 2rem;
  }
 }
@media (max-width: 1108px) {
  .send-share-scan h1 {
    padding-top: 0rem;
    padding-bottom: 2rem;
  }
  .send, .share {
    margin-top: 1rem;
  }
}
@media (max-width: 886px) {
  .hero-section {
    flex-direction: column;
    gap: 2rem;
  }
  .hero-container {
    height: auto;
  }
  .send-share-scan h1, .send-share-scan{
    padding-top: 2rem;
  }
  .mobile-img {
    display: none;
  }
}

@media (max-width: 505px) {
  .scan, .share, .send {
    height: auto;
  }
}