*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}


body{

    font-family:Arial, Helvetica, sans-serif;

    background:#f4f7fb;

    color:#333;

}



/* ==========================
   TOPO
========================== */


header{

    height:80px;

    background:#063970;

    display:flex;

    align-items:center;

}


.topo{

    width:90%;

    max-width:1200px;

    margin:auto;

    display:flex;

    align-items:center;

    justify-content:space-between;

}


.topo img{

    height:60px;

}



.voltar{

    background:#1fa2ff;

    color:#fff;

    padding:10px 22px;

    border-radius:30px;

    text-decoration:none;

    font-weight:bold;

    transition:.3s;

}


.voltar:hover{

    background:#0d8be8;

}



/* ==========================
   ÁREA DO FORMULÁRIO
========================== */


.orcamento{

    min-height:calc(100vh - 80px);

    display:flex;

    align-items:center;

    justify-content:center;

    padding:50px 20px;

}



/* ==========================
   CARD
========================== */


.formulario{

    background:#fff;

    width:100%;

    max-width:650px;

    padding:45px;

    border-radius:20px;

    box-shadow:0 10px 35px rgba(0,0,0,.08);

}



.formulario h1{

    text-align:center;

    color:#063970;

    font-size:32px;

    margin-bottom:10px;

}



.formulario p{

    text-align:center;

    color:#666;

    margin-bottom:35px;

    font-size:16px;

}



/* ==========================
   CAMPOS
========================== */


.formulario label{

    display:block;

    color:#063970;

    font-weight:bold;

    margin-bottom:8px;

}



.formulario input,
.formulario textarea{


    width:100%;

    padding:14px;

    border:1px solid #d9e2ef;

    border-radius:10px;

    margin-bottom:22px;

    font-size:15px;

    font-family:Arial, Helvetica, sans-serif;

    transition:.3s;

}



.formulario input:focus,
.formulario textarea:focus{

    outline:none;

    border-color:#1fa2ff;

    box-shadow:0 0 8px rgba(31,162,255,.2);

}



.formulario textarea{

    resize:none;

}



/* ==========================
   BOTÃO
========================== */


.formulario button{

    width:100%;

    padding:15px;

    border:none;

    border-radius:30px;

    background:#063970;

    color:#fff;

    font-size:16px;

    font-weight:bold;

    cursor:pointer;

    transition:.3s;

}



.formulario button:hover{

    background:#1fa2ff;

    transform:translateY(-2px);

}



/* ==========================
   CELULAR
========================== */


@media(max-width:600px){


    header{

        height:auto;

        padding:15px 0;

    }


    .topo{

        width:92%;

    }


    .topo img{

        height:50px;

    }


    .voltar{

        padding:9px 15px;

        font-size:14px;

    }


    .formulario{

        padding:30px 22px;

    }


    .formulario h1{

        font-size:26px;

    }


}

/* ==========================
   WHATSAPP
========================== */


.whatsapp-box{

    display:flex;

    align-items:center;

    justify-content:center;

    gap:12px;

    background:#f0fff5;

    border:1px solid #d4f5df;

    padding:15px;

    border-radius:15px;

    text-decoration:none;

    margin-bottom:30px;

    transition:.3s;

}


.whatsapp-box:hover{

    transform:translateY(-3px);

}


.whatsapp-box img{

    width:42px;

    height:42px;

}


.whatsapp-box strong{

    display:block;

    color:#063970;

    font-size:20px;

}


.whatsapp-box span{

    display:block;

    color:#64748b;

    font-size:14px;

}

/* ==========================
   SUCESSO
========================== */


.sucesso-box{

    text-align:center;

}


.icone-sucesso{

    width:80px;

    height:80px;

    margin:0 auto 25px;

    border-radius:50%;

    background:#1fa2ff;

    color:#fff;

    font-size:45px;

    display:flex;

    align-items:center;

    justify-content:center;

    font-weight:bold;

}



.protocolo{

    background:#f4f7fb;

    border-left:5px solid #1fa2ff;

    padding:20px;

    margin:30px 0;

    border-radius:10px;

    color:#063970;

    font-size:18px;

}


.protocolo strong{

    font-size:22px;

}



.botao-voltar{

    display:inline-block;

    background:#063970;

    color:#fff;

    padding:14px 35px;

    border-radius:30px;

    text-decoration:none;

    font-weight:bold;

    transition:.3s;

}


.botao-voltar:hover{

    background:#1fa2ff;

}