@import url('./cdn/bootstrap.min.css');
@import url('./main.css');
@import url('./blocks/header.css');
@import url('./blocks/page-banner.css');
@import url('./blocks/page-testimonals.css');
@import url('./blocks/page-shop-lid-form.css');
@import url('./blocks/page-faq.css');
@import url('./blocks/page-content.css');
@import url('./blocks/footer.css');

body {
    background-color: var(--Background, #F4F6F9);
    color: var(--Black_titles, #191A26);
}
.page-template-page-oplata main {
    display: flex;
    flex-direction: column;
}
.page-template-page-oplata .page_banner {
    order: -1;
    margin: 0;
}
.page_banner__next-screen {
    width: 100%;
    text-align: center;
    padding: 0 2.25rem;
}
.page-oplata {
    margin-bottom: 6.25rem;
}
.page-oplata__content {
    padding: 0 1.25rem;
}
.page-oplata__title {
    font-size: 1.5rem;
    font-weight: 600;
    line-height: 1.2;
    margin-bottom: 1.75rem;
}
.page-oplata__description {
    line-height: 1.5;
    margin-bottom: 3.75rem;
}
.page-oplata__description > *:not(:last-child) {
    margin-bottom: 1.25rem;
}
.page-oplata__stages {
    row-gap: 3.75rem;
    justify-content: center;
}
.page-oplata__stages__title {
    font-size: 1.5rem;
    font-weight: 600;
    line-height: 1.2;
    margin-bottom: 2.5rem;
}
.page-oplata__stage__body {
    width: min(260px, 100%);
    margin: 0 auto;
    text-align: center;
}
.page-oplata__stage__icon {
    display: inline-flex;
    margin-bottom: 1.75rem;
}
.page-oplata__stage__title {
    font-size: 1.25rem;
    line-height: 1;
    font-weight: 600;
    margin-bottom: 1rem;
}
.page-oplata__stage__description {
    color: var(--Grey_dark_texts, #393E41);
    line-height: 1.5;
}
.page-oplata__stages__line {
    display: none;
}
.page_testimonals {
    padding: 0;
    margin-bottom: 7.5rem;
}
.page-shop-lid-form {
    padding: 0;
    margin-bottom: 7.5rem;
}
.page_faq {
    padding: 0;
    margin-bottom: 7.5rem;
}
.page_faq__faqs {
    padding-bottom: 0;
}
.page_content {
    padding: 0;
    margin-bottom: 6.25rem;
}
.page-shop-lid-form__form .nf-form-title {
    margin: 0;
}
@media screen and ( max-width: 575px ) {
    .page-shop-lid-form__form div.wpcf7.js {
        margin: 0 -1.25rem;
        width: unset;
        max-width: 100vw;
    }
}
@media screen and ( max-width: 991px ) {
    .page-shop-lid-form__form div.wpcf7.js {
        padding: 2rem 1.25rem 2.5rem;
        background-color: var(--white-back-texts, #FFF);
    }
}
@media screen and ( min-width: 992px ) {
    .page-oplata {
        margin-bottom: 8.75rem;
    }
    .page-oplata__title {
        font-size: 2rem;
        margin-bottom: 2.5rem;
    }
    .page-oplata__description {
        column-count: 2;
        column-gap: 1.75rem;
        margin-bottom: 6.25rem;
    }
    .page-oplata__description > *:not(:last-child) {
        margin-bottom: 2.5rem;
    }
    .page-oplata__stages {
        gap: 0;
    }
    .page-oplata__stages__title {
        font-size: 2rem;
    }
    .page-oplata__stage.first, 
    .page-oplata__stage.third, 
    .page-oplata__stage.fifth {
        order: 1;
    }
    .page-oplata__stage.second, 
    .page-oplata__stage.fourth {
        order: 3;
    }
    .animation_run .page-oplata__stage {
        opacity: 0;
        transition: opacity 0.25s ease;
    }
    .animation_run .page-oplata__stage.visible {
        opacity: 1;
    }
    .page-oplata__stages__line {
        display: flex;
        align-items: center;
        justify-content: space-evenly;
        position: relative;
        order: 2;
        height: 2.5rem;
        margin: 3rem 0 1.5rem;
    }
    .page-oplata__stages__line .line {
        position: absolute;
        left: 0;
        width: 100%;
        height: 3px;
        background-color: var(--Red, #C11D1D);
        opacity: 0.2;
    }
    .animation_run .page-oplata__stages__line .line {
        width: 0%;
    }
    .page-oplata__stages__line .dot {
        display: flex;
        align-items: center;
        justify-content: center;        
        position: relative;
        z-index: 1;
        width: 1.25rem;
        height: 1.25rem;
        border-radius: 50%;
    }
    .page-oplata__stages__line .dot::before,
    .page-oplata__stages__line .dot::after {
        content: "";
        position: absolute;
        display: block;
        width: 1.25rem;
        height: 1.25rem;
        background-color: #EACBCD;
        border-radius: 50%;
        z-index: 2;
        transition: all 0.4s ease;
    }
    .page-oplata__stages__line .dot::after {
        background-color: var(--Background, #F4F6F9);
        z-index: 1;
    }
    .page-oplata__stages__line .dot.active::before {
        background-color: var(--Red, #C11D1D);
        width: 1.5rem;
        height: 1.5rem;
    }
    .page-oplata__stages__line .dot.active::after {
        width: 2.5rem;
        height: 2.5rem;
        box-shadow: inset 0 0 0 3px var(--Red, #C11D1D);
    }
    /*  */
    .page-shop-lid-form {
        margin-top: 0;
    }
    .page_faq {
        background-color: transparent;
    }
    .page_content {
        margin-bottom: 7.5rem;
    }
}