.formulario{

    width:100%;
}

/*
=====================================================
GRID FORMULÁRIO
=====================================================
*/

.grid-formulario{

    width:100%;

    display:grid;

    grid-template-columns:
        repeat(auto-fit,minmax(280px,1fr));

    gap:24px;
}

.campo{

    display:flex;

    flex-direction:column;

    min-width:0;
}

.campo-full{

    grid-column:1/-1;
}

.campo-grande{

    grid-column:span 2;
}

@media(max-width:768px){

    .campo-grande{

        grid-column:auto;
    }
}

/*
=====================================================
CAMPOS
=====================================================
*/

.campo label{

    color:var(--texto2);

    margin-bottom:10px;

    font-size:14px;

    font-weight:600;
}

.campo input,
.campo textarea,
.campo select{

    width:100%;

    min-height:56px;

    padding:0 18px;

    background:rgba(255,255,255,.03);

    border:1px solid rgba(255,255,255,.05);

    border-radius:16px;

    color:#fff;

    outline:none;

    transition:.3s;
}

.campo textarea{

    min-height:140px;

    padding-top:16px;

    resize:none;
}

.campo input:focus,
.campo textarea:focus,
.campo select:focus{

    border-color:#4f7cff;

    box-shadow:
        0 0 0 4px rgba(79,124,255,.12);
}

/*
=====================================================
BOTÕES
=====================================================
*/

.acoes-formulario{

    display:flex;

    justify-content:flex-end;

    gap:16px;

    margin-top:32px;

    flex-wrap:wrap;
}

/*
=====================================================
MÓDULOS
=====================================================
*/

.grid-modulos{

    width:100%;

    display:grid;

    grid-template-columns:
        repeat(auto-fit,minmax(260px,1fr));

    gap:24px;
}

.checkbox-modulo{

    width:100%;

    display:flex;

    align-items:center;

    gap:16px;

    padding:20px;

    min-height:82px;

    border-radius:20px;

    background:rgba(255,255,255,.03);

    border:1px solid rgba(255,255,255,.05);

    transition:.3s;

    cursor:pointer;
}

.checkbox-modulo:hover{

    border-color:#4f7cff;

    background:rgba(79,124,255,.08);
}

.checkbox-modulo input{

    width:20px;

    height:20px;

    min-width:20px;

    margin:0;

    accent-color:#4f7cff;

    flex:none;
}

.modulo-info{

    flex:1;
}

.modulo-info strong{

    display:block;

    color:#fff;

    font-size:16px;

    font-weight:700;
}
/*
=====================================================
GATEWAY CAMPOS DINÂMICOS
=====================================================
*/

.gateway-campos{

margin-top:35px;

row-gap:30px;

column-gap:24px;

}

.gateway-campos .campo{

margin-bottom:10px;

}