.hero-contato{

padding:80px 20px;

text-align:center;

background:
linear-gradient(
135deg,
#1f2937,
#374151);

color:white;
}

.hero-contato h1{

font-size:52px;
margin-bottom:15px;
}

.hero-contato p{

font-size:18px;

max-width:700px;
margin:auto;
}

.contato-container{

max-width:1200px;

margin:60px auto;

padding:20px;

display:grid;

grid-template-columns:
1fr 2fr;

gap:30px;
}

.info-contato{

background:white;

padding:30px;

border-radius:20px;

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

.info-contato h2{

margin-bottom:25px;
}

.item{

display:flex;
align-items:center;

gap:15px;

margin-bottom:20px;

font-size:18px;
}

.item i{

font-size:22px;

color:#2563eb;
}

.formulario{

background:white;

padding:35px;

border-radius:20px;

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

.formulario h2{

margin-bottom:25px;
}

.formulario form{

display:flex;
flex-direction:column;
gap:15px;
}

.formulario input,
.formulario textarea{

padding:15px;

border:1px solid #ddd;

border-radius:10px;

font-size:16px;

outline:none;
}

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

border-color:#2563eb;
}

.formulario button{

padding:15px;

border:none;

border-radius:10px;

background:#2563eb;

color:white;

font-size:16px;

font-weight:bold;

cursor:pointer;

transition:.3s;
}

.formulario button:hover{

background:#1d4ed8;
}

@media(max-width:768px){

.contato-container{

grid-template-columns:1fr;
}

.hero-contato h1{

font-size:40px;
}

}