/* RESET */

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

/* BODY */

body{

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

    min-height:100vh;

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

    background:
    linear-gradient(
        135deg,
        #0f4c81,
        #1565c0,
        #42a5f5
    );
}

/* CONTAINER */

.container{

    width:100%;
    max-width:1200px;

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

    padding:20px;
}

/* FORMULÁRIO */

.formulario{

    width:100%;
    max-width:500px;

    background:#ffffff;

    padding:40px;

    border-radius:20px;

    box-shadow:
    0 10px 30px rgba(0,0,0,0.25);
}

/* TÍTULO */

.formulario h1{

    text-align:center;

    color:#1565c0;

    margin-bottom:30px;
}

/* CAMPOS */

.campo{

    margin-bottom:20px;

    display:flex;
    flex-direction:column;
}

.campo label{

    margin-bottom:8px;

    color:#0f4c81;

    font-weight:bold;
}

.campo input,
.campo textarea{

    padding:12px;

    border:2px solid #d6e4f5;

    border-radius:10px;

    font-size:16px;

    transition:0.3s;
}

.campo input:focus,
.campo textarea:focus{

    outline:none;

    border-color:#1565c0;

    box-shadow:
    0 0 10px rgba(21,101,192,0.3);
}

/* BOTÃO */

button{

    width:100%;

    padding:15px;

    border:none;

    border-radius:10px;

    background:#1565c0;

    color:white;

    font-size:18px;

    font-weight:bold;

    cursor:pointer;

    transition:0.3s;
}

button:hover{

    background:#0f4c81;

    transform:translateY(-2px);
}

/* RESPONSIVO */

@media(max-width:600px){

    .formulario{

        padding:25px;
    }

    .formulario h1{

        font-size:24px;
    }
}