/* 
------------------------
step section css
------------------------
*/
 .pxa-steps{padding:35px 0 40px;
 background-color:var(--bs-white);
 background-position:center;
 background-size:cover;
 background-repeat:no-repeat
 }
 .pxa-steps .step-heading-section{
     max-width:600px;
     margin:0 auto 45px
 }
.pxa-steps .step-heading-section h2{
    color:var(--pxa-title-color);
     font-size:28px;
     font-weight:700;
     line-height:1.4;
     margin-bottom:15px
    
}
.pxa-steps .step-heading-section p{
    color:var(--pxa-text-color);
    font-size:16px;
    font-weight:400;
    line-height:1.4
}
 
.pxa-steps .step {
  position: relative;
  list-style: none;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  padding-left: 0;
}
.pxa-steps .step-item {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-preferred-size: 0;
  flex-basis: 0;
  -ms-flex: 0 0 100%;
  flex: 0 0 100%;
  max-width: 100%;
  padding-right: 0.75rem;
  padding-left: 0.75rem;
  margin-bottom: 2.25rem;
}
.pxa-steps .step-content-wrapper {
  position: relative;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
}
.pxa-steps .step-content {
  -ms-flex: 1;
  flex: 1;
}
.pxa-steps .step-content p {
            color: var(--pxa-text-color);
            font-size: 16px;
            font-style: normal;
            font-weight: 400;
            line-height: 1.4; 
            margin: 20px 0 20px;
}
.pxa-steps .step-content  h3 {
            color: var(--pxa-text-color);
            font-size: 18px;
            font-style: normal;
            font-weight: 600;
            line-height: 1.4;
            margin-bottom: 5px;
}
.pxa-steps .step-icon {
  display: -ms-inline-flexbox;
  display: inline-flex;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  font-size: 1rem;
  font-weight: 600;
  width: 3.125rem;
  height: 3.125rem;
  border-radius: 50%;
  margin-right: 1rem;
}
.pxa-steps  .step-icon::after {
  position: absolute;
  top: 3.875rem;
  left: 1.5625rem;
  height: calc(100% - 2.375rem);
  border-left: 0.125rem solid var(--pxa-border-color);
  content: "";
}
@media (min-width: 768px) {
  .step-md .step-item {
    -ms-flex-positive: 1;
    flex-grow: 1;
    -ms-flex: 1;
    flex: 1;
    margin-bottom: 0;
  }
  .step-md:not(.step-inline) .step-content-wrapper {
    display: block;
  }
  .step-md .step-icon {
    margin-bottom: 1rem;
  }
  .step-md .step-icon::after {
    top: 1.5625rem;
    left: 4.625rem;
    width: calc(100% - 4.625rem);
    height: 1.625rem;
    border-top: 0.125rem solid var(--pxa-border-color);
    border-left: none;
  }
}
@media (min-width: 768px) {
  .step-md.step-centered {
    text-align: center;
  }
  .step-md.step-centered .step-item:last-child .step-icon::after {
    display: none;
  }
  .step-md.step-centered .step-icon {
    margin-left: auto;
    margin-right: auto;
  }
  .step-md.step-centered .step-icon::after {
    width: calc(100% - 4.625rem);
    left: calc(50% + 3.0625rem);
  }
}

 .pxa-text-center{
     text-align:center;
 }
 
 .step-btn a {
        text-decoration: none;
    }

.pxa-steps .step-btn .solid-btn {
            min-width: 160px;
            min-height: 50px;
            line-height: 50px;
            border-radius: 10px;
            font-size: 16px;
            letter-spacing: 1px;
            color: var(--bs-white);
            font-weight: 500;
            display: inline-block;
            text-align: center;
            border: none;
            position: relative;
            transition: 0.3s;
            padding: 0 10px;
            background: linear-gradient(to left, var(--pxa-main) 50%, var(--pxa-secondary) 50%) right;
            transition: .5s ease-out;
            background-size: 200%;
        }
.pxa-steps .step-btn .solid-btn:hover {
            background-position: left;
}

 @media only screen and (max-width: 767px) {
           .pxa-steps .step-heading-section h2 {
                font-size: 20px;
            }

            .pxa-steps .step-heading-section p {
                font-size: 16px;
            }
            .pxa-steps .step-content h3 {
                font-size: 20px;
            }

            .pxa-steps .step-content p {
                font-size: 16px;
            } 
            
              .pxa-steps .step-btn .solid-btn {
                min-width: 150px;
                min-height: 40px;
                line-height: 40px;
                font-size: 14px;
            }
 }

/* 
------------------------
Call To Action css 
------------------------
*/
 
 .call-to-action {
  background: var(--pxa-white-color);
  background-size: cover;
  padding: 50px 30px;
  overflow: hidden;
}

.call-to-action h2 {
  color: var(--pxa-title-color);
  font-size: 28px;
  font-weight: 700;
  margin-bottom: 20px;
}

.call-to-action p {
  color: var(--pxa-text-color);
  margin-bottom: 20px;
}

.call-to-action .cta-btn {
  font-weight: 700;
  font-size: 16px;
  letter-spacing: 1px;
  display: inline-block;
  padding: 8px 36px;
  border-radius: 10px;
  transition: 0.5s;
  margin: 10px;
  background: linear-gradient(90deg, var(--pxa-main) -76.72%, var(--pxa-main)  191.51%);
  color: var(--pxa-white-color);
}

.call-to-action .cta-btn:hover {
   background: linear-gradient(90deg, var(--pxa-primary) -76.72%, var(--pxa-primary)  191.51%);
  color:var(--pxa-white-color);
}

@media only screen and (max-width: 767px) {
    .call-to-action .cta-btn {
        font-weight: 500;
        font-size: 16px;
    }
    call-to-action h2 { 
    font-size: 26px;
    } 
    } 
    @media only screen and (max-width: 575px) { 
      .call-to-action .cta-btn {
        font-weight: 500;
        font-size: 14px;
    }
    call-to-action h2 { 
    font-size: 24px;
    }    
    }
    

/* 
-------------------------------
Perks section css
-------------------------------
*/ 
.pxa-perks {
      position: relative;
      background-color: var(--bs-white);
      background-position: center;
      background-size: cover;
      background-repeat: no-repeat;
      width: 100%;
      padding: 40px 0 40px;
    }

.pxa-perks h2 {
      color: var(--bs-dark);
      font-size: 30px;
      font-style: normal;
      font-weight: 700;
      line-height: 1.2;
    }

.pxa-perks .perk-box {
  padding: 24px 20px;
  box-shadow: 0px 0 30px rgba(0, 0, 0, 0.1);
  transition: 0.3s;
  height: 100%;
}

.pxa-perks .perk-box h3 {
  font-size: 18px;
  font-weight: 700;
  margin: 0;
  color: var(--bs-dark);
}

.pxa-perks .perk-box i {
  background: color-mix(in srgb, var(--bs-primary), transparent 92%);
  color: var(--bs-primary);
  line-height: 0;
  padding: 4px;
  margin-right: 10px;
  font-size: 24px;
  border-radius: 3px;
  transition: 0.3s;
}

.pxa-perks .perk-box:hover i {
  background: var(--bs-primary);
  color: var(--bs-white);
}
/* 
-------------------------------
Service icons section css 
-------------------------------
*/
        .pxa-service-section01  {
            padding: 100px 0;
            background-color: var(--pxa-white-color);
            background-size: cover;
            background-position: center;
            background-repeat: no-repeat;
        }
        .pxa-service-section01 .pxa-service-section01-image {
            text-align: right;
            background-repeat: no-repeat;
            background-size: contain;
            padding: 25px;
            background-position: right;
        }
        .pxa-service-section01 .pxa-service-section01-image img {
            max-width: 540px;
            max-height: 416px;
            object-fit: contain;
            width: 100%;
        }
        .pxa-service-section01 .pxa-service-section01-content .pxa-title {
            font-size: 28px;
            font-weight: 700;
            color: var(--pxa-title-color);
            margin-bottom: 20px;
            line-height: 1.4;
        }
        .pxa-service-section01 .pxa-service-section01-content p {
            font-size: 16px;
            font-weight: 400;
            color: var(--pxa-text-color);
            line-height: 1.5;
        }
        .pxa-service-section01 .pxa-service-section01-content {
            margin-bottom: 35px;
        }
        .pxa-service-section01 .pxa-profile-check {
            display: grid;
            grid-template-columns: 15px 1fr;
            gap: 10px;
            margin-bottom: 25px;
        }
        .pxa-service-section01 .pxa-profile-check:last-child {
            margin-bottom: 0;
        }
        .pxa-service-section01 .pxa-profile-check .pxa-profile-Q i {
            font-size: 18px;
            color: var(--pxa-primary);
            line-height: 1.5;
        }
        .pxa-service-section01 .pxa-pricingPlan-points {
            text-align: left;
        }
        .pxa-service-section01 .pxa-service-section01-image{
            animation: 3s left infinite alternate;
        }
      
        @media only screen and (max-width: 992px) {
            .pxa-service-section01  {
                padding: 50px 0;
            }
            .pxa-service-section01 .pxa-service-section01-image {
                padding: 15px;
                max-width: 540px;
                margin: 0 auto;
            }
            .pxa-service-section01 .pxa-profile-check {
                margin-bottom: 20px;
            }
            .pxa-service-section01 .pxa-service-section01-content .pxa-title {
                font-size: 18px;
            }
            .pxa-service-section01 .pxa-service-section01-content p {
                font-size: 14px;
            }
        }
        /* service icons section css end */