/*=====================================
CONTACT BANNER
======================================*/

.contact-banner{

    padding:180px 0 100px;

    background-image:
    linear-gradient(rgba(0,0,0,.75),rgba(0,0,0,.75)),
    url('../images/banners/contact-banner.png');

    background-size:cover;

    background-position:center;

    background-repeat:no-repeat;

    text-align:center;

}

.contact-banner h1{

    font-size:60px;

    margin-bottom:20px;

}

.contact-banner p{

    max-width:800px;

    margin:auto;

    color:#ddd;

    font-size:20px;

    line-height:1.8;

}



/*=====================================
CONTACT PAGE
======================================*/

.contact-page{

    background:#111;

    padding:120px 0;

}

.contact-grid{

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:60px;

    align-items:flex-start;

}



/*=====================================
CONTACT INFO
======================================*/

.contact-info{

    display:flex;

    flex-direction:column;

    gap:25px;

}

.info-box{

    display:flex;

    gap:20px;

    align-items:flex-start;

    background:#181818;

    padding:30px;

    border-radius:18px;

    border:1px solid rgba(255,255,255,.05);

    transition:.35s;

}

.info-box:hover{

    transform:translateY(-8px);

    border-color:#D4AF37;

    box-shadow:0 20px 40px rgba(212,175,55,.12);

}

.info-box i{

    font-size:32px;

    color:#D4AF37;

    width:60px;

    text-align:center;

}

.info-box h3{

    margin-bottom:8px;

    font-size:22px;

}

.info-box p{

    color:#cfcfcf;

    line-height:1.8;

}



/*=====================================
CONTACT FORM
======================================*/

.contact-form{

    background:#181818;

    padding:45px;

    border-radius:20px;

    border:1px solid rgba(255,255,255,.05);

}

.contact-form input,

.contact-form textarea{

    width:100%;

    margin-bottom:20px;

    padding:18px;

    background:#111;

    color:#fff;

    border:1px solid rgba(255,255,255,.08);

    border-radius:10px;

    font-size:16px;

    transition:.3s;

}

.contact-form input:focus,

.contact-form textarea:focus{

    border-color:#D4AF37;

    outline:none;

}

.contact-form textarea{

    resize:none;

}

.contact-form button{

    width:100%;

}



/*=====================================
SOCIAL
======================================*/

.social-section{

    background:#0A0A0A;

    padding:100px 0;

    text-align:center;

}

.social-icons{

    display:flex;

    justify-content:center;

    gap:25px;

    margin-top:50px;

}

.social-icons a{

    width:70px;

    height:70px;

    border-radius:50%;

    background:#181818;

    display:flex;

    justify-content:center;

    align-items:center;

    color:#D4AF37;

    font-size:28px;

    transition:.35s;

    text-decoration:none;

}

.social-icons a:hover{

    background:#D4AF37;

    color:#111;

    transform:translateY(-8px);

}



/*=====================================
MAP
======================================*/

.map-section{

    background:#111;

    padding:120px 0;

}

.map-placeholder{

    margin-top:50px;

    min-height:420px;

    background:#181818;

    border-radius:20px;

    border:2px dashed rgba(212,175,55,.35);

    display:flex;

    flex-direction:column;

    justify-content:center;

    align-items:center;

    text-align:center;

    padding:50px;

}

.map-placeholder i{

    font-size:70px;

    color:#D4AF37;

    margin-bottom:25px;

}

.map-placeholder h3{

    font-size:34px;

    margin-bottom:15px;

}

.map-placeholder p{

    color:#cfcfcf;

    max-width:650px;

    line-height:1.9;

}



/*=====================================
FAQ
======================================*/

.faq-section{

    background:#0A0A0A;

    padding:120px 0;

}

.faq-grid{

    display:grid;

    grid-template-columns:repeat(2,1fr);

    gap:30px;

    margin-top:50px;

}

.faq-card{

    background:#181818;

    border-radius:18px;

    padding:35px;

    border:1px solid rgba(255,255,255,.05);

    transition:.35s;

}

.faq-card:hover{

    transform:translateY(-8px);

    border-color:#D4AF37;

}

.faq-card h3{

    color:#D4AF37;

    margin-bottom:20px;

    font-size:24px;

}

.faq-card p{

    color:#cfcfcf;

    line-height:1.9;

}



/*=====================================
CTA
======================================*/

.contact-cta{

    background:#111;

    padding:120px 0;

    text-align:center;

}

.contact-cta h2{

    font-size:48px;

    margin-bottom:20px;

}

.contact-cta p{

    color:#ddd;

    max-width:700px;

    margin:0 auto 40px;

    line-height:1.9;

}