:root {
  --bg-page: #f4f6ff;
  --bg-card: #ffffff;
  --text-heading: #313131;
  --text-body: #4b5563;
  --primary: #4f46e5;
  --radius-card: 20px;
  --shadow-card: 0 18px 45px rgba(15, 23, 42, 0.08);
  --purple-color: #4D52F2;
  --light-grey-bg: #F6F6F6;
  --black-text: rgb(0, 0, 0, 0.7);
  --light-violet-clr: #F3F4FE;
  --hire-title: #403C39;
  --hire-content-clr: #626963;
}

ul,ol,p{
  margin: 0;
}

/* common inner hero banner section */
.inner-page-main-content{
  margin-top: 150px;
  font-size: 16px;
  line-height: 150%;
  color: var(--black-text);
  position: relative;
}

.inner-page-hero-wrapper{
  position: relative;
}

.inner-hero-content{
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  position: relative;
  z-index: 3;
  max-width: 1570px;
  margin: 0 auto;
  background: linear-gradient(90deg, rgba(44, 83, 248, 0.05) 0%, rgba(150, 80, 227, 0.05) 50%, rgba(221, 34, 123, 0.05) 100%);
  border-radius: 60px;
}

.inner-hero-left-side{
  padding: 60px 20px;
  color: rgba(48, 48, 48, 1);
  max-width: 660px;
  margin: 0 auto;
}

.inner-hero-left-side p{
  font-size: 18px;
  line-height: 130%;
  margin-bottom: 25px;
  font-weight: 500;
}

.inner-hero-left-side p strong{
  font-weight: 900;
}

.hero-title-label{
  border: 1px solid rgba(77, 82, 242, 1);
  background: rgba(255, 255, 255, 0.5);
  color: rgba(77, 82, 242, 1);
  border-radius: 90px;
  padding: 7px 15px;
  font-size: 16px;
  line-height: 28px;
  margin-bottom: 22px;
  display: inline-flex;
}

.hero-main-title{
  font-size: 46px;
  line-height: 56px;
  font-weight: 600;
  margin-bottom: 30px;
}

.inner-hero-left-side ol{
  display: flex;
  flex-direction: column;
  padding: 25px 0 50px 0px;
  max-width: 475px;
  list-style: decimal;
  list-style-position: inside;
}

.inner-hero-left-side li{
  font-size: 18px;
  line-height: 26px;
}

.inner-hero-left-side li:not(:last-child){
  margin-bottom: 18px;
  padding-bottom: 18px;
  border-bottom: 1px solid rgba(48, 48, 48, 1);
}

.inner-hero-review-section{
  display: inline-flex;
  align-items: stretch;
  column-gap: 15px;
}

.inner-hero-review-link{
  border: 1px solid rgba(77, 82, 242, 1);
  background: rgba(255, 255, 255, 0.5);
  transition: all .3s ease-in-out;
  border-radius: 18px;
  padding: 10px 20px;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  align-items: center;
  color: rgba(48, 48, 48, 1);
  column-gap: 15px;
  min-height: 100px;
}

.inner-hero-review-link .review-logo{
  margin-top: auto;
}

.review-left-side {
  display: flex;
  flex-direction: column;
  row-gap: 10px;
}

.reviewed-sub-title{
  font-size: 15px;
  line-height: 132%;
  display: inline-flex;
}

.inner-hero-review-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  row-gap: 6px;
}

.inner-hero-review-wrap span{
  font-size: 20px;
  line-height: 28px;
  color: rgba(48, 48, 48, 1);
  white-space: nowrap;
  font-weight: 500;
}

.inner-hero-review-wrap .inner-hero-review-ratings{
  font-size: 16px;
  color: rgba(255, 61, 46, 1);
  display: flex;
  align-items: center;
}

.inner-hero-review-numbers{
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  color: rgba(48, 48, 48, 1);
  font-size: 20px;
  line-height: 28px;
  white-space: nowrap;
  row-gap: 5px;
}

.inner-hero-right-side{
  max-width: 820px;
  width: 100%;
  background-color: rgba(223, 225, 255, 1);
  border-radius: 60px;
  display: flex;
  align-items: center;
  padding: 10px;
}

.inner-hero-right-content{
  max-width: 720px;
  margin: 0 auto;
}

.inner-hero-header{
  display: flex;
  align-items: center;
  column-gap: 20px;
  margin-bottom: 30px;
}

.inner-hero-header-logo{
  width: 70px;
  height: 70px;
  display: flex;
  justify-content: center;
  align-items: center;
  background: linear-gradient(109.83deg, rgba(255, 255, 255, .406) 12.32%, rgba(255, 255, 255, 0) 97.33%);
  border: 1px solid rgba(255, 255, 255, .35);
  border-radius: 50%;
  backdrop-filter: blur(40px);
  column-gap: 20px;
}

.inner-hero-header-logo img {
  width: 40px;
  height: 40px;
}

.form-header-title{
  color: rgba(0, 0, 0, 1);
  font-size: 36px;
  line-height: 46px;
  font-weight: 700;
  margin: 0;
  width: calc(100% - 90px);
}

.inner-hero-form-wrapper{
  position: relative;
}

.our-achievements-slider{
  border-radius: 18px;
  border: 1px solid #4E4E4E33;
  background-color: #FFFFFF4D;
  padding: 12px 0;
  margin-top: 30px;
  overflow: hidden;
}

.our-achievements-slider .swiper-wrapper{
  transition-timing-function: linear !important;
}

.our-achievements-slider .swiper-slide {
  width: 73px;
  height: 73px;
  flex-shrink: 0;
}

.banner-badge-image{
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background-color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}

.hire-input-form-wrap{
  display: flex;
  flex-wrap: wrap;
  row-gap: 15px;
  column-gap: 20px;
}

.hire-input-form-wrap .hire-contact-group:first-child{
  width: 100%;
}

.hire-input-form-wrap .hire-contact-group:nth-child(2),
.hire-input-form-wrap .hire-contact-group:nth-child(3){
  width: calc(50% - 10px);
}

.hire-input-form-wrap .hire-contact-group.hire-comment-sec{
  width: 100%;  
}

.hire-input-form-wrap .hire-contact-group .wpcf7-form-control-wrap{
  display: flex;
  flex-direction: column;
  width: 100%;
  position: relative;
}

.hire-input-form-wrap .hire-contact-group p{
  width: 100%;
}

.hire-input-form-wrap .hire-contact-group .wpcf7-form-control-wrap .iti__flag-container{
  padding: 0;
}

.hire-input-form-wrap .hire-contact-group .wpcf7-form-control-wrap .iti__selected-flag{
  background: transparent;
  padding: 0 6px;
}

.hire-input-form-wrap .hire-contact-group .wpcf7-form-control-wrap .iti__country-list {
  max-width: 350px;
  width: 350px;
  border: 0;
  margin: 0 0 0 0px;
}

.hire-input-form-wrap .hire-contact-group .wpcf7-form-control-wrap .iti__country{
  font-size: 14px;
  line-height: 20px;
}

.hire-dedicated-form .hire-contact-group .wpcf7-not-valid-tip,
.inner-hero-form-wrapper .wpcf7-form.invalid .wpcf7-response-output{
  font-size: 14px;
  line-height: 20px;
  color: #F44336;
}

.inner-hero-form-wrapper .wpcf7-form.sent .wpcf7-response-output{
  color: #399f3c;
}

.hire-contact-group.captcha-btn{
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  margin-top: 30px;
  position: relative;
}

.captcha-input-group{
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  gap: 5px;
}

.screen-reader-response p,
.screen-reader-response ul{
  display: none;
}

.wpcf7-response-output{
  font-size: 14px;
  line-height: 20px;
  font-weight: 600;
  margin-top: 15px;
}

.captcha-input-group p:first-child .wpcf7-captchac{
  min-height: auto;
  padding: 0;
  background-color: transparent;
  border: 0;
}

.captcha-input-group p:last-child {
  min-width: 200px;
}

.captcha-input-group p em{
  display: none;
}

.hire-input-form-wrap .wpcf7-form-control,
.captcha-input-group .wpcf7-form-control{
  width: 100%;
  background-color: #fff;
  border: 1px solid #E5E5E5;
  border-radius: 0;
  min-height: 53px;
  padding: 6px 16px;
  color: #000;
  font-size: 14px;
  line-height: 1.5;
  font-weight: 500;
}

.hire-input-form-wrap .wpcf7-form-control:focus,
.captcha-input-group .wpcf7-form-control:focus{
  outline: none;
  box-shadow: none;
}

.hire-input-form-wrap .wpcf7-form-control.wpcf7-textarea{
  height: 100px;
  color: rgba(78, 78, 78, 1);
  resize: none;
}

.hire-btn-wrap.common-alt-form-spinner{
  position: relative;
}

.hire-btn-wrap.common-alt-form-spinner .wpcf7-spinner{
  position: absolute;
  right: -20px;
  top: 18px;
  width: 18px !important;
  height: 18px !important;
  visibility: hidden;
}

.inner-hero-form-wrapper .wpcf7-form.submitting .hire-btn-wrap.common-alt-form-spinner .wpcf7-spinner{
  visibility: visible;
}

.hire-btn-wrap .wpcf7-form-control{
  background-color: var(--purple-color);
  color: #fff;
  border-radius: 50px;
  min-height: 56px;
  min-width: 200px;
  font-size: 18px;
  line-height: 100%;
  font-weight: 500;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 5px;
  border: 1px solid var(--purple-color);
  cursor: pointer;
  transition: all .3s ease;
}

.hire-btn-wrap .wpcf7-form-control:hover{
  background: #fff;
  color: var(--purple-color);
  border-color: var(--purple-color);
  box-shadow: 0 0 3px 2px rgba(100, 121, 205, .2);
}
/* common inner hero banner section */

/* common grid */
.capabilities-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  column-gap: 16px;
  row-gap: 20px;
  margin: 40px auto 0;
  position: relative;
  z-index: 2;
}

.capability-card {
  border-radius: var(--radius-card);
  padding: 28px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-height: 245px;
}

.capability-card-header{
  display: flex;
  align-items: center;
  justify-content: flex-start;
  column-gap: 12px;
}

.capability-card h3 {
  margin: 0;
  font-size: 28px;
  line-height: 38px;
  font-weight: 500;
  color: var(--text-heading);
}

.capability-card p {
  margin: 0;
  color: #606060;
}
/* */

/* onboard process slider */
.feature-section{
  display: flex;
  align-items: center;
  justify-content: space-between;
  column-gap: 15px;
  margin-top: 60px;
}

.feature-image{
  /* max-width: 575px; */
  width: 570px;
  height: 570px; /* room for stacked slides */
  position: relative;
  overflow: visible;
  display: flex;
  align-items: center;
  justify-content: center;
}

.feature-image .imageSwiper {
  height: 100%;
  width: 100%;
}

.feature-image .swiper-wrapper {
  align-items: center;
  height: auto;
}

.feature-image .swiper-slide{
  width: 100%;
  opacity: 0;
  /* transform: translateY(0) scale(0.8); */
  transition: all 0.45s ease;
  z-index: 1;
}

.feature-image .swiper-slide-active,
.feature-image .swiper-slide-prev,
.feature-image .swiper-slide-next,
.feature-image .swiper-slide-prev-prev,
.feature-image .swiper-slide-next-next {
  transform: none;
}

.feature-image .swiper-slide-active {
  opacity: 1;
  transform: scale(1);
  z-index: 5 !important;
}

.feature-image .swiper-slide-prev,
.feature-image .swiper-slide-next {
  opacity: 1;
  transform: translateY(0) scale(0.9);
  z-index: 4;
}

/* 2 slides above & below */
.feature-image .swiper-slide-prev-prev,
.feature-image .swiper-slide-next-next {
  opacity: 1;
  transform: translateY(0) scale(0.8);
  z-index: 3;
}

.feature-image .swiper-slide img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 30px;
}

.feature-points{
  max-width: 650px;
  display: flex;
  flex-direction: column;
  row-gap: 40px;
  position: relative;
  max-height: calc(4 * 140px); /* shows exactly 4 items */
  overflow-y: auto;
}

/* scrollbar (optional, clean look) */
.feature-points::-webkit-scrollbar {
  display: none;
}
.feature-points::-webkit-scrollbar-thumb {
  background: rgba(0,0,0,0.2);
  border-radius: 10px;
}

.feature-points .point{
  display: flex;
  align-items: flex-start;
  column-gap: 40px;
  cursor: pointer;
  position: relative;
}

.feature-points .point:not(:last-child)::before{
  content: '';
  position: absolute;
  left: 17px;
  top: 36px;
  height: calc(100% + 4px);
  width: 1px;
  border: 1px dashed rgba(32, 32, 32, 1);
}

.feature-points .point .numbering{
  width: 34px;
  height: 34px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: rgba(234, 233, 233, 1);
  color: rgba(173, 173, 173, 1);
  font-size: 20px;
  line-height: 100%;
}

.onboard-points{
  display: flex;
  flex-direction: column;
  row-gap: 10px;
  color: var(--black-text);
  width: calc(100% - 74px);
}

.onboard-points h3{
  font-size: 20px;
  line-height: 30px;
  color: rgba(0, 0, 0, 1);
  font-weight: 500;
  margin: 0px;
}

.onboard-points p{
  color: #606060;
}

.feature-points .point.active .numbering{
  background-color: var(--purple-color);
  color: #fff;
}

.feature-points .point.active .onboard-points h3{
  background: linear-gradient(113.48deg, #2C53F8 15.51%, #9650E3 50.37%, #DD227B 85.23%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
/* */

/* key benefits wrapper */
.key-benifit-section ul{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  position: relative;
  margin-top: 40px;
}

.key-benifit-section ul li{
  position: relative;
  border-radius: 20px;
  min-height: 65px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  font-size: 18px;
  line-height: 28px;
  color: #000000;
  column-gap: 10px;
  border: 1px solid #fff;
  padding: 10px 20px 10px 50px;
}

.key-benifit-section ul li:before{
  content: '';
  position: absolute;
  width: 20px;
  height: 20px;
  left: 20px;
  top: 50%;
  transform: translateY(-50%);
  background-image: url(../../images/new-web-image/listing-icon.svg);
  background-size: 20px;
  background-position: left center;
  background-repeat: no-repeat;
}

.key-benifit-section ul li:nth-child(6n + 1) {
  background-color: #E3E6F599;
}

.key-benifit-section ul li:nth-child(6n + 2) {
  background-color: #E2E6E599;
}

.key-benifit-section ul li:nth-child(6n + 3) {
  background-color: #FCE3E099;
}

.key-benifit-section ul li:nth-child(6n + 4) {
  background-color: #E4DBF499;
}

.key-benifit-section ul li:nth-child(6n + 5) {
  background-color: #F8DFED99;
}

.key-benifit-section ul li:nth-child(6n + 6) {
  background-color: #EAE4F699;
}

/* */

/* quick steps section start */
.steps-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  justify-content: center;
  z-index: 3;
  position: relative;
  margin-top: 40px;
  column-gap: 20px;
  margin-bottom: 40px;
}

.step-card {
  padding: 24px;
  text-align: center;
  position: relative;
  transition: all 0.3s ease-in-out;
  border-radius: 12px;
  box-shadow: 4px 4px 10px 0px #0000000D;
  background-color: #FFFFFF;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  border: 1px solid #DBDBDB;
}

.step-number{
  font-size: 52px;
  line-height: 62px;
  color: #313131;
  font-weight: 300;
  margin-bottom: 30px;
  display: inline-flex;
}

.step-tag-icon-wrap{
  display: flex;
  align-items: center;
  column-gap: 12px;
  margin-bottom: 12px;
}

.step-badge{
  border: 1px solid var(--purple-color);
  min-height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  line-height: 28px;
  color: var(--purple-color);
  font-weight: 500;
  padding: 2px 12px;
  min-width: 80px;
  border-radius: 30px;
  background: #FFFFFF80;
}

.step-card h3 {
  margin: 0px 0 12px 0;
  font-size: 18px;
  line-height: 30px;
  font-weight: 600;
  color: var(--hire-title);
  text-align: left;
}

.step-card p{
  color: rgba(17, 0, 0, 0.6);
  text-align: left;
}

.step-icon{
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--purple-color);
  border-radius: 50%;
}

.step-card:hover,
.step-active-hover{
  background: #2C53F81A;
}

.step-card:hover p,
.step-active-hover p{
  color: rgba(17, 0, 0, 0.6);
}

.step-card:hover h3,
.step-active-hover h3{
  background: linear-gradient(113.48deg, #2C53F8 15.51%, #9650E3 50.37%, #DD227B 85.23%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.steps-description{
  color: #606060;
}

.steps-description p + p{
  margin-top: 15px;
}
/* quick steps section ends */

/* counter css */
.tick-counter {
  display: inline-flex;
  align-items: center;
  font-size: 52px;
  line-height: 52px;
  min-height: 52px;
  font-weight: 600;
  color: #000;
  overflow: hidden;
}

.digit {
  position: relative;
  width: 34px;
  height: 52px;
  overflow: hidden;
}

.digit-inner {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  transition: transform 1.8s cubic-bezier(.16,1,.3,1);
}

.digit-inner span {
  display: block;
  height: 52px; 
  line-height: 52px;
  text-align: center;
}

.suffix {
  margin-left: 5px;
  font-size: 52px;
  line-height: 70px;
}
/* */



@media (min-width:3840px){
    .inner-hero-left-side {
        max-width: 775px;
    }

    .inner-hero-left-side p {
        font-size: 20px;
    }

    .hero-title-label{
        font-size: 18px;
    }
    .hero-main-title {
        font-size: 54px;
    }
    .hero-banner-listing{
        max-width: 575px;
        padding: 0 0 70px 0px;
    }
    .hero-banner-listing li {
        font-size: 20px;
        line-height: 28px;
    }
    .hero-banner-listing li:not(:last-child) {
        margin-bottom: 22px;
        padding-bottom: 22px;
    }
    .inner-hero-review-section {
        column-gap: 25px;
    }
    .inner-hero-review-link{
        min-width: 180px;
        min-height: 150px;
    }
    .reviewed-sub-title {
        font-size: 17px;
    }
    .inner-hero-review-wrap .inner-hero-review-ratings {
        font-size: 14px;
    }
    .inner-hero-review-wrap span {
        font-size: 18px;
    }
    .inner-hero-right-side {
        max-width: 740px;
    }
    .inner-hero-header-logo{
        width: 90px;
        height: 90px;
        top: -45px;
    }
    .inner-hero-header-logo img {
        width: 52px;
        height: 52px;
    }
    .capability-card h3{
        font-size: 22px;
    }
}

@media (max-width: 1600px){
  .inner-hero-content{
    max-width: 1360px;
  }

  .hero-main-title {
    font-size: 42px;
    line-height: 52px;
  }

  .inner-hero-review-section {
    column-gap: 10px;
  }

  .inner-hero-review-link{
    padding: 10px 14px;
    column-gap: 10px;
  }

  .inner-hero-review-link .review-logo{
    max-width: 90px;
  }

  .inner-hero-review-wrap span,
  .inner-hero-review-numbers{
    font-size: 18px;
    line-height: 26px;
  }

  .form-header-title {
    font-size: 32px;
    line-height: 42px;
  }

  .inner-hero-right-side {
    max-width: 740px;
  }

  .inner-hero-right-content {
    max-width: calc(100% - 40px);
    width: 100%;
    margin: 0 auto;
  }
}

@media(max-width:1399px){

  /* .inner-page-main-content {
    margin-top: 50px;
  } */

  .inner-hero-content{
    max-width: calc(100% - 40px);
  }

  .footer-gradient-bg .container{
    max-width: 100%;
  }

  .inner-hero-left-side{
    padding: 40px 20px;
    max-width: 500px;
  }

  .hero-main-title {
    font-size: 38px;
  }

  .inner-hero-left-side ol{
    padding: 20px 0 40px 0px;
    max-width: 375px;
  }

  .inner-hero-left-side li {
    font-size: 16px;
    line-height: 24px;
  }

  .inner-hero-left-side li:not(:last-child) {
    margin-bottom: 12px;
    padding-bottom: 12px;
  }

  .inner-hero-right-side{
    max-width: 640px;
  }

  .inner-hero-right-content {
    max-width: 580px;
  }

  .inner-hero-review-wrap .inner-hero-review-ratings {
    font-size: 14px;
  }

  .inner-hero-review-wrap span, .inner-hero-review-numbers {
    font-size: 16px;
    line-height: 24px;
  }

  .inner-hero-review-section{
    column-gap: 5px;
  }

  .inner-hero-review-link{
    padding: 10px;
  }

  .inner-hero-header-logo {
    width: 55px;
    height: 55px
  }

  .inner-hero-header-logo img {
    width: 30px;
    height: 30px;
  }

  .review-left-side {
    row-gap: 6px;
  }

  .reviewed-sub-title {
    font-size: 13px;
    line-height: 20px;
  }

  .form-header-title {
    font-size: 28px;
    line-height: 38px;
  }

  .hire-input-form-wrap .wpcf7-form-control, 
  .captcha-input-group .wpcf7-form-control{
    min-height: 46px;
    padding: 6px 12px;
  }

  .hire-btn-wrap .wpcf7-form-control{
    min-height: 50px;
    min-width: 190px;
    font-size: 16px;
    line-height: 26px;
  }

  .our-achievements-slider .swiper-slide {
    width: 60px;
    height: 60px;
  }

  .capability-card{
    padding: 22px;
  }

  .capability-card h3{
    font-size: 24px;
    line-height: 34px;
  }

  .feature-points {
    max-width: 600px;
  }
}

@media(max-width:1199px){

  .inner-page-main-content {
    margin-top: 130px;
  }

  .inner-hero-left-side{
    max-width: 45%;
  }

  .inner-hero-right-side{
    max-width: 55%;
  }

  .inner-hero-right-content{
    max-width: calc(100% - 30px);
  }

  .hero-title-label{
    padding: 6px 12px;
    font-size: 14px;
    line-height: 24px;
    margin-bottom: 22px;
  }

  .hero-main-title {
    font-size: 34px;
    line-height: 44px;
    margin-bottom: 20px;
  }

  .inner-hero-left-side ol{
    max-width: 75%;
  }

  .inner-hero-left-side li{
    font-size: 14px;
    line-height: 22px;
  }

  .inner-hero-left-side li:not(:last-child) {
    margin-bottom: 8px;
    padding-bottom: 8px;
  }

  .inner-hero-review-link .review-logo {
    max-width: 70px;
  }

  .reviewed-sub-title {
    font-size: 11px;
    line-height: 18px;
  }

  .inner-hero-review-wrap .inner-hero-review-ratings {
    font-size: 10px;
  }

  .inner-hero-review-wrap span, .inner-hero-review-numbers {
    font-size: 14px;
    line-height: 22px;
  }

  .inner-hero-review-link{
    column-gap: 5px;
  }

  .inner-hero-header {
    column-gap: 15px;
    margin-bottom: 20px;
  }

  .form-header-title {
    font-size: 24px;
    line-height: 34px;
  }

  .capability-card {
    padding: 18px;
  }

  .capability-card h3 {
    font-size: 20px;
    line-height: 30px;
  }

  .feature-image{
    width: 45%;
  }

  .feature-points{
    max-width: calc(100% - 48%);
    row-gap: 25px;
  }

  .feature-points .point{
    column-gap: 20px;
  }

  .onboard-points{
    width: calc(100% - 54px);
  }

  .onboard-points h3{
    font-size: 18px;
    line-height: 28px
  }

  .steps-grid{
    column-gap: 15px;
  }

  .step-card {
    padding: 16px 22px;
  }

  .step-number {
    font-size: 44px;
    line-height: 54px;
    margin-bottom: 20px;
  }

  .step-badge{
    font-size: 14px;
    line-height: 26px;
    min-height: 30px;
    padding: 2px 8px;
  }

  .step-icon {
    width: 38px;
    height: 38px;
  }

  .step-card h3{
    font-size: 16px;
    line-height: 28px;
  }
}

@media(max-width:991px){

  .inner-hero-content{
    flex-direction: column;
    align-items: center;
    background: transparent;
    row-gap: 20px;
    border-radius: 0px;
  }

  .inner-hero-left-side{
    background: linear-gradient(90deg, rgba(44, 83, 248, 0.05) 0%, rgba(150, 80, 227, 0.05) 50%, rgba(221, 34, 123, 0.05) 100%);
    border-radius: 60px;
    max-width: 100%;
  }

  .inner-hero-right-side {
    max-width: 100%;
    padding: 25px;
  }

  .inner-hero-left-side ol{
    padding: 15px 0 30px 0px;
    max-width: 100%;
  }

  .inner-hero-review-link{
    min-width: 240px;
  }

  .inner-hero-right-content {
    max-width: 100%;
  }

  .capabilities-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .key-benifit-section ul{
    grid-template-columns: repeat(2, 1fr);
  }

  .key-benifit-section ul li{
    font-size: 16px;
    line-height: 26px;
  }

  .feature-section{
    flex-direction: column;
    margin-top: 40px;
  }

  .feature-image{
    display: none;
  }

  .feature-points {
    max-width: 100%;
    row-gap: 25px;
    max-height: unset;
  }

  .feature-points .point .onboard-points h3{
    background: linear-gradient(113.48deg, #2C53F8 15.51%, #9650E3 50.37%, #DD227B 85.23%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
  }

  .feature-points .point .numbering{
    background-color: var(--purple-color);
    color: #fff;
  }

  .steps-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 15px;
    margin-bottom: 30px;
  }

}

@media(max-width:767px){
  .hero-main-title {
    font-size: 30px;
    line-height: 40px;
    margin-bottom: 15px;
  }

  .inner-hero-left-side ol {
    padding: 10px 0 20px 0px;
  }

  .inner-hero-review-section {
    width: 100%;
  }

  .inner-hero-review-link {
    width: 100%;
  }

  .capability-card h3 {
    font-size: 18px;
    line-height: 28px;
  }

  .key-benifit-section ul{
    gap: 10px;
  }

  .feature-points .point {
    column-gap: 15px;
  }

  .feature-points .point .numbering {
    width: 28px;
    height: 28px;
    font-size: 18px;
  }

  .feature-points .point:not(:last-child)::before{
    left: 13px;
    top: 28px;
  }

  .step-number {
    font-size: 36px;
    line-height: 44px;
    margin-bottom: 15px;
  }
}

@media(max-width:575px){
  .inner-hero-left-side,
  .inner-hero-right-side{
    border-radius: 20px;
  }

  .inner-hero-left-side {
    padding: 30px 15px;
  }

  .inner-hero-right-side{
    padding: 15px;
  }

  .inner-hero-header {
    column-gap: 10px;
    margin-bottom: 15px;
  }

  .form-header-title {
    font-size: 20px;
    line-height: 30px;
  }
  
  .inner-hero-content{
    max-width: calc(100% - 24px);
  }

  .hero-main-title {
    font-size: 28px;
    line-height: 38px;
    margin-bottom: 10px;
  }

  .inner-hero-review-section{
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    row-gap: 15px;
  }

  .inner-hero-review-link {
    width: auto;
    min-height: auto;
  }

  .inner-hero-header-logo {
    width: 45px;
    height: 45px;
  }

  .inner-hero-header-logo img {
    width: 25px;
    height: 25px;
  }

  .form-header-title {
    font-size: 22px;
    line-height: 32px;
  }

  .hire-input-form-wrap .hire-contact-group:nth-child(2), .hire-input-form-wrap .hire-contact-group:nth-child(3){
    width: 100%;
  }

  .hire-contact-group.captcha-btn{
    flex-direction: column;
    align-items: flex-start;
    row-gap: 15px;
  }

  .capabilities-grid {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }

  .capability-card{
    min-height: auto;
  }

  .footer-gradient-bg .container{
    max-width: 100%;
  }

  .steps-description {
    font-size: 14px;
    line-height: 22px;
  }

  .key-benifit-section ul{
    grid-template-columns: repeat(1, 1fr);
  }

  .key-benifit-section ul li {
    font-size: 14px;
    line-height: 24px;    
    padding: 10px 20px 10px 40px;
  }

  .key-benifit-section ul li:before {
    width: 14px;
    height: 14px;
    left: 15px;
    background-size: 14px;
  }

  .steps-grid {
    grid-template-columns: repeat(1, minmax(0, 1fr));
    gap: 10px;
  }
  .step-card p{
    font-size: 14px;
    line-height: 22px;
  }

  .step-number {
    font-size: 32px;
    line-height: 40px;
    margin-bottom: 10px;
  }

  .step-badge {
    font-size: 12px;
    line-height: 24px;
    padding: 2px 4px;
    min-width: 70px;
  }

  .step-icon {
    width: 32px;
    height: 32px;
  }

  .step-icon img{
    width: 18px;
    height: 18px;
  }
}

@media(max-width:479px){
  .hero-main-title {
    font-size: 26px;
    line-height: 34px;
    margin-bottom: 10px;
  }
}