.alert{
    padding:15px;
    margin-bottom:20px;
    border-radius:4px;
    font-weight:600;
}

.success{
    background:#e8f8ee;
    color:#0f7a35;
    border:1px solid #9fd8b4;
}

.error{
    background:#fff0f0;
    color:#c62828;
    border:1px solid #f3b3b3;
}

.form-response {
    display: none;
    margin: 20px 0;
    padding: 14px 18px;
    border-radius: 6px;
    font-size: 15px;
    line-height: 1.6;
}

.form-response.success {
    background: #eaf7ee;
    color: #216e39;
    border: 1px solid #b8dfc4;
}

.form-response.error {
    background: #fff0f0;
    color: #a52828;
    border: 1px solid #edb5b5;
}

#submitBtn:disabled {
    opacity: 0.7;
    cursor: not-allowed;
}

.hp-field {
    position: absolute !important;
    left: -9999px !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
}



/* ==========================================
   CONTACT HERO
========================================== */


.contact-hero{
    position:relative;
    min-height:550px;
    display:flex;
    align-items:center;
    background:
    linear-gradient(
        rgba(0,33,71,.90),
        rgba(0,33,71,.75)
    ),
    url('../images/contact-hero.jpg')
    center/cover;
    color:#fff;
}

.hero-content{
    max-width:800px;
}

.hero-content h1{
    font-size:clamp(3rem,5vw,5rem);
    line-height:1.1;
    margin-bottom:20px;
}

.hero-content p{
    font-size:1.15rem;
    max-width:650px;
    line-height:1.8;
    opacity:.9;
}


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

.contact-info-section{
    padding:90px 0;
    background:#f7f9fc;
}

.contact-info-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:25px;
}

.info-card{
    background:#fff;
    padding:35px;
    text-align:center;
    border-radius:6px;
    box-shadow:0 8px 25px rgba(0,0,0,.05);
}

.info-card .icon{
    width:70px;
    height:70px;
    margin:auto;
    margin-bottom:20px;
    color:#000;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:1.4rem;
    border: 2px solid var(--navy);
}

.info-card h3{
    margin-bottom:10px;
    color:#002147;
}

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

.contact-form-section{
    padding:110px 0;
}

.contact-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:70px;
    align-items:start;
}

.contact-content h2{
    font-size:3rem;
    margin-bottom:20px;
    color:#002147;
}

.contact-content p{
    color:#555;
    line-height:1.8;
    margin-bottom:30px;
}

.contact-features{
    display:grid;
    gap:18px;
}

.contact-features div{
    font-weight:600;
}

.contact-features i{
    color:#d4af37;
    margin-right:10px;
}

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

.contact-form-wrapper{
    background:#fff;
    padding:45px;
    border-radius:6px;
    box-shadow:0 15px 40px rgba(0,0,0,.08);
}

.form-row{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:15px;
}

.contact-form input,
.contact-form select,
.contact-form textarea{
    width:100%;
    padding:15px;
    margin-bottom:15px;
    border:1px solid #ddd;
    border-radius:4px;
    font-size:15px;
}

.contact-form input:focus,
.contact-form select:focus,
.contact-form textarea:focus{
    outline:none;
    border-color:#002147;
}

.submit-btn{
    width:100%;
    border:none;
    background:#002147;
    color:#fff;
    padding:16px;
    font-size:16px;
    font-weight:700;
    cursor:pointer;
    transition:.3s;
}

.submit-btn:hover{
    background:#003b68;
}

/* ==========================================
   WHY CHOOSE US
========================================== */

.why-contact-section{
    background:#f7f9fc;
    padding:100px 0;
}

.section-header{
    text-align:center;
    margin-bottom:60px;
}

.section-header h2{
    font-size:3rem;
    color:#002147;
}

.reasons-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:25px;
}

.reason-card{
    background:#fff;
    padding:35px;
    text-align:center;
    border-radius:6px;
}

.reason-card i{
    font-size:2rem;
    color:#d4af37;
    margin-bottom:20px;
}

.reason-card h3{
    color:#002147;
    margin-bottom:10px;
}

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

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

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

.contact-cta{
    background:#002147;
    color:#fff;
    text-align:center;
    padding:100px 0;
}

.contact-cta h2{
    font-size:3rem;
    margin-bottom:20px;
}

.contact-cta p{
    max-width:700px;
    margin:auto;
    margin-bottom:30px;
    opacity:.9;
    color: rgba(255, 255, 255, .75)
}

.cta-btn{
    display:inline-block;
    background:#d4af37;
    color:#002147;
    padding:15px 35px;
    font-weight:700;
    text-decoration:none;
}

/* ==========================================
   RESPONSIVE
========================================== */

@media(max-width:992px){

    .contact-info-grid,
    .reasons-grid{
        grid-template-columns:repeat(2,1fr);
    }

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

@media(max-width:768px){

    .contact-info-grid,
    .reasons-grid,
    .form-row{
        grid-template-columns:1fr;
    }

    .hero-content h1{
        font-size:2.8rem;
    }

    .contact-content h2,
    .section-header h2,
    .contact-cta h2{
        font-size:2.2rem;
    }

    .contact-form-wrapper{
        padding:30px;
    }
}