:root {
    --blue-color: #244C7F;
    --yellow-color: #F5BE00;
    --white-color: #F6F5F2;
    --text-color: #000000;
    --text-blue-color: #1C4561;
    --border-blue-color: #1c45615d;
    --border-color: #0000001a;
    --ligt-blue-color: #BAD8FF;

    --backg-color: #FAF9F7;
    --ligt-blue-bg-color: #F6FCFF;

    --padding-block: 4rem;
}

/* popup */
#popup-card.popup__bg {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background: rgba(0, 0, 0, 0.8);
    opacity: 0;
    /*Скрываем фон и сам попап */
    pointer-events: none;
    /*Запрещаем ему быть целью событий */
    transition: 0.5s all;
    z-index: 998;
}

#popup-card.popup__bg.active {
    opacity: 1;
    pointer-events: all;
    /*Возвращаем события */
    transition: 0.5s all;
}

#popup-card .popup,
.blockMsgAwooc {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(0);
    /*Центрируем и масштабируем в 0 само окно */
    width: 44vw !important;
    max-width: unset !important;
    padding: 1vw 4vw !important;
    border-radius: 1vw !important;
    /* box-shadow: 0 16px 45px 0 #007e803f, inset 0 -25px 25px 0 #E5E5E5, inset 0 25px 25px 0 #FFFFFF !important; */
    background: #DAEAFF;
    transition: 0.5s all;
    overflow-y: unset !important;
}

#popup-card .popup.active {
    transform: translate(-50%, -50%) scale(1);
    /*Так же центрируем и плавно увеличиваем */
    transition: 0.5s all;
}

/* Далее код для стилизации формы */
#popup-card .popup .close-popup {
    position: absolute;
    top: 0;
    right: 0;
    cursor: pointer;
    width: 4.8vw;
    height: 4.8vw;
    color: #000000;
    /* background-color: #21585C; */
    border-radius: 50%;
    opacity: 1;
    z-index: 50;

}

#popup-card .close-popup::before,
#popup-card .close-popup::after {
    content: '';
    position: absolute;
    top: 48%;
    left: 33%;
    width: 1.8vw;
    height: 3px;
    background-color: var(--blue-color);
}

#popup-card .close-popup::before {
    transform: rotate(135deg);
}

#popup-card .close-popup::after {
    transform: rotate(-135deg);
}

#popup-card .popup-body {
    display: flex;
    flex-direction: column;
    align-items: center;
}

#popup-card * {
    color: var(--text-color);
}

#popup-card h3 {
    text-align: center;
    margin-bottom: 1vw;
    font-weight: 600;
    color: var(--text-color);
}


#popup-card input:focus {
    padding: 1rem 1rem;
}

.wpcf7-spinner {
    display: none;
}

#popup-card form > p{
    display: flex;
    justify-content: space-between;
    column-gap: 1rem;
}

#popup-card form > p:last-child{
    width: 100%;
}


#popup-card .btn {
    margin-top: 2vw;
    /*width: 70%;*/
    background-color: var(--blue-color);
}

#popup-card .btn:hover {
    background-color: var(--yellow-color);
}


#popup-card .popup #close-after-sending.close,
#popup-card .popup .opening-after-send {
    display: none;
}

#popup-card .popup-body .opening-after-send.active {
    display: inline-block;
}

#awooc-form-custom-order .awooc-col {
    max-width: unset;
    flex: unset;
}

#awooc-form-custom-order .awooc-row,
#awooc-form-custom-order .awooc-popup-inner {
    justify-content: center;
    align-items: center;
    padding: 0;
}

#awooc-form-custom-order h2 {
    margin-top: 2vw;
}

#popup-card .popup-btn{
    display: flex;
    justify-content: center;
}




@media (max-width: 767px) {

    #popup-card .popup,
    .blockMsgAwooc {
        width: 85vw !important;
        padding: 6vw 4vw !important;
    }

    #popup-card .popup .close-popup {
        width: 12vw;
        height: 12vw;
    }

    #popup-card .close-popup::before,
    #popup-card .close-popup::after {
        width: 4.8vw;
        left: 32%;

    }

    #popup-card .popup .logo,
    #awooc-form-custom-order .logo {
        width: 25.8vw;
    }

    #popup-card .popup h5 {
        margin-top: 4vw;
        font-size: 5.5vw;
    }

    #awooc-form-custom-order h2 {
        margin-top: 4vw;
        font-size: 4.5vw;
    }

    #popup-card .popup .deco-line,
    #awooc-form-custom-order .deco-line {
        margin: 2vw 0;
        height: 1px;
    }

    #popup-card .popup .input-form,
    #awooc-form-custom-order form p {
        flex-direction: column;
    }

    #awooc-form-custom-order form p {
        align-items: center;
    }

    #popup-card .popup input,
    #popup-card .popup textarea,
    #contact-content .right input,
    #contact-content .right textarea,
    #awooc-form-custom-order input {
        width: 90%;
        margin-top: 4vw;
        font-size: 4vw;
        border-radius: 6px;
    }

    #awooc-form-custom-order input {
        margin: 0;
    }

    #popup-card .popup textarea {
        height: 20vw;
        min-height: unset;
        margin: 7vw 0 5vw;
    }

    #popup-card .popup .wpcf7-submit {
        font-size: 3.2vw;
    }

    #popup-card .popup-consultation .wpcf7-submit {
        margin-top: 8vw;
    }

    #popup-card .popup p,
    #awooc-form-custom-order .agree {
        text-align: center;
        font-size: 2.9vw;
    }

    #popup-card .form-btn>p input {
        width: 38.4vw;
    }


    #popup-card .bottom {
        margin: 6vw -4vw -6.1vw;
        padding: 5vw 1.5vw 3.5vw;
    }

    #popup-card .bottom::before {
        top: -3.4vw;
        height: 6vw;
        width: 16vw;
        border-radius: 50%;
    }

    #popup-card .social-btn {
        column-gap: 8vw;
    }

    #popup-card .bottom a {
        padding: 2.2vw 2.2vw 2vw;
    }

    #popup-card .bottom a img {
        width: 6vw;
    }
}







.team-popup-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.6);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
}

.team-popup {
    background: #fff;
    padding: 2rem;
    border-radius: 1rem;
    max-width: 500px;
    width: 100%;
    position: relative;
    box-shadow: 0 10px 30px rgba(0,0,0,0.2);
    text-align: center;
}

.team-popup img {
    max-width: 200px;
    border-radius: 1rem;
    margin-bottom: 1rem;
}

.team-popup-close {
    position: absolute;
    top: 10px;
    right: 15px;
    background: none;
    border: none;
    font-size: 1.5rem;
    cursor: pointer;
}
