.contacto{

   padding:100px 8%;

    background:#f5f8fc;


}
.section-title{

    text-align:center;

    margin-bottom:70px;

}
.section-title span{

    color:#D71920;

    font-weight:700;

    letter-spacing:2px;

    text-transform:uppercase;

}

.section-title h2{

    font-size:42px;

    color:#005EB8;

    margin:20px 0;

}

.section-title p{

    max-width:800px;

    margin:auto;

    color:#666;

    line-height:30px;

    font-size:18px;

}
.contact-grid{

    display:grid;

    grid-template-columns:1fr 1.3fr;

    gap:60px;

    margin-top:60px;

}

.contact-info{

    background:#005EB8;

    color:white;

    padding:45px;

    border-radius:18px;

}

.contact-info h3{

    margin-bottom:40px;

    font-size:30px;

}

.info-item{

    display:flex;

    gap:20px;

    margin-bottom:30px;

    align-items:flex-start;

}

.info-item i{

    font-size:28px;

    color:#FFD54F;

    margin-top:5px;

}

.contact-form{

    background:white;

    padding:45px;

    border-radius:18px;

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

}

.contact-form form{

    display:grid;

    gap:20px;

}

.contact-form input,
.contact-form select,
.contact-form textarea{

    padding:16px;

    border:1px solid #ddd;

    border-radius:8px;

    font-size:16px;

    font-family:inherit;

}

.contact-form input:focus,
.contact-form select:focus,
.contact-form textarea:focus{

    outline:none;

    border-color:#005EB8;

}

.contact-form button{

    background:#D71920;

    color:white;

    border:none;

    padding:18px;

    border-radius:8px;

    font-size:17px;

    cursor:pointer;

    transition:.3s;

}

.contact-form button:hover{

    background:#005EB8;

}

@media(max-width:900px){

.contact-grid{

grid-template-columns:1fr;

}

.contact-info{

order:2;

}

.contact-form{

order:1;

}

}