.contact-banner{
    height:400px;

    background:
    linear-gradient(rgba(0,0,0,.55),
    rgba(0,0,0,.55)),
    url('../images/banner3.jpg');

    background-size:cover;
    background-position:center;

    display:flex;
    justify-content:center;
    align-items:center;
    text-align:center;
    color:white;
}

.banner-content h1{
    font-size:60px;
    margin-bottom:20px;
}

.contact-section{
    width:90%;
    max-width:1300px;
    margin:100px auto;

    display:grid;
    grid-template-columns:1fr 1fr;
    gap:60px;
}

.contact-info{
    background:#f8f9fa;
    padding:50px;
    border-radius:25px;
}

.info-box{
    display:flex;
    gap:25px;
    margin-top:35px;
}

.info-box i{
    width:70px;
    height:70px;

    background:#2E7D32;
    color:white;

    border-radius:50%;

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

    font-size:28px;
}

.contact-form{
    background:white;
    padding:50px;
    border-radius:25px;

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

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

    width:100%;
    padding:16px;
    margin-top:20px;

    border:1px solid #ddd;
    border-radius:12px;
}

.contact-form textarea{
    height:180px;
    resize:none;
}

.map-section{
    width:90%;
    margin:100px auto;
}

.map-section h2{
    text-align:center;
    margin-bottom:40px;
}

.map-section iframe{
    width:100%;
    height:450px;
    border:none;
    border-radius:25px;
}

/* Mobile Responsive */

@media(max-width:768px){

.contact-section{
    grid-template-columns:1fr;
}

.banner-content h1{
    font-size:40px;
}

.contact-info,
.contact-form{
    padding:35px;
}

}