/* ==========================================
   Popup
========================================== */

.fp-popup {
    position: fixed;
    inset: 0;

    display: flex;
    justify-content: center;
    align-items: center;

    z-index: 999999;

    opacity: 0;
    visibility: hidden;
    pointer-events: none;

    transition:
        opacity .25s ease,
        visibility .25s ease;
}

.fp-popup.fp-open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

/* ==========================================
   Overlay
========================================== */

.fp-overlay {
    position: absolute;
    inset: 0;

    background: rgba(0,0,0,.65);
    backdrop-filter: blur(3px);
}

/* ==========================================
   Modal
========================================== */

.fp-modal {

    position: relative;
    z-index: 2;

    width: calc(100% - 32px);
    max-width: 560px;

    background: #ffffff;

    border-radius: 12px;

    padding: 32px;

    box-shadow:
        0 20px 60px rgba(0,0,0,.25);

    transform:
        translateY(20px)
        scale(.96);

    opacity: 0;

    transition: .25s ease;

}

.fp-popup.fp-open .fp-modal {

    transform:
        translateY(0)
        scale(1);

    opacity: 1;

}

/* ==========================================
   Botão fechar
========================================== */

.fp-close {

    position: absolute;

    top: 12px;
    right: 12px;

    width: 36px;
    height: 36px;

    border: none !important;
    background: transparent !important;

    color: #000 !important;

    font-size: 28px !important;
    line-height: 1;

    cursor: pointer;

    padding: 0 !important;

    z-index: 10;

}

/* ==========================================
   Scroll Lock
========================================== */

body.fp-lock {
    overflow: hidden;
}

/* ==========================================
   Ajustes do widget
========================================== */

#fp-widget {

    margin-top: 10px;

}

/*
O widget possui max-width:500px.
Como nosso modal possui 560px,
fazemos ele ocupar toda a largura.
*/

#fp-widget .iaqfaz-form {

    max-width: 100% !important;

    margin: 0 !important;

    box-shadow: none !important;

    padding: 0 !important;

    border-radius: 0 !important;

}

/* ==========================================
   Mobile
========================================== */

@media (max-width:640px){

    .fp-modal{

        width: calc(100% - 20px);

        padding: 24px;

    }

}