/* This file is used as dependency in:
   ../../modules/sub-steps.module/module.html 
   ../../modules/sec-steps.module/module.html */

.pwr-step {
    display: inline-block;
    float: left;
    margin: 10px 10px 40px;
    padding-right: 20px;
    position: relative;
    width: calc( 25% - 20px );
}

.pwr-step--3-col {
    width: calc( 33% - 20px );
}

.pwr-step__count {
    background-color: var(--clr-primary);
    border-radius: 999px;
    color: var(--clr-text-dk);
    display: block;
    font-family: var(--ff-accent);
    font-size: 18px;
    font-weight: 700;
    height: 50px;
    line-height: 50px;
    margin-bottom: 35px;
    text-align: center;
    width: 50px;
}

.pwr-step__img,
.pwr-step__lottie-wrapper {
    display: inline-block;
    height: auto;
}    
.pwr-step__img {
    margin-bottom: 35px;
}
.pwr-step__lottie-wrapper {
    margin-bottom: 20px;
}

.pwr-step__icon {
    color: var(--clr-primary);
    display: inline-block;
    fill: currentColor;
    font-size: 35px;
    margin: 0 auto 20px;
}

.pwr-step__icon .hs_cos_wrapper_type_icon {
    display: block;
    line-height: 0;
}

.pwr-step__title {
    display: block;
    font-family: var(--ff-accent);
    font-size: 19px;
    font-weight: 700;
    text-transform: var(--tt-title);
}

.pwr-step__desc {
    display: inline-block;
    margin-left: auto;
    margin-right: auto;
}

.pwr-step__title + .pwr-step__desc {
    margin-top: 20px;
}
.pwr-step__title--has-desc {
    padding-bottom: 15px;
}

.pwr-step__cta {
    margin-top: 20px;
}

.swiper .pwr-step {
    padding: 0;
    margin: 0;
}

@media (max-width: 991px ) {
    .pwr-step {
        width: calc( 50% - 20px );
    }

    .pwr-step--3-col {
        width: calc( 33% - 20px);
    }
}

@media (max-width: 767px ) {
    .pwr-step__title {
        font-size: 19px;
        font-size: max(var(--fs-min), calc(19px * var(--fs-reduction-factor)));
    }
}

@media (max-width: 575px ) {
    .pwr-steps.pwr--neg-margin-lr-10 {
        margin-left: 0;
        margin-right: 0;
    }

    .pwr-step {
        margin-left: 0;
        margin-right: 0;
    }

    .pwr-step {
        float: none;
        width: 100%;
    }

    .pwr-step__count {
        margin-bottom: max(var(--fs-min), calc(35px * var(--fs-reduction-factor)));
    }

    .pwr-step__title + .pwr-step__desc {
        margin-top: max(var(--fs-min), calc(20px * var(--fs-reduction-factor)));
    }
    .pwr-step__title--has-desc {
        padding-bottom: max(var(--fs-min), calc(15px * var(--fs-reduction-factor)));
    }
}