
    /* Contact Page Specific CSS */
    .hero-section { 
    min-height: 70vh; 
    background: linear-gradient(rgba(10,64,12,0.7), rgba(10,64,12,0.7)), 
                url("https://wallpapers.com/images/high/glowing-contact-us-logo-qx58564q7a51etk6.jpg");
    background-size: cover;   /* makes image cover entire area */
    background-position: center; /* centers the image */
    display: flex; 
    align-items: center; 
    color: var(--white); 
    position: relative; 
}

    .hero-content h1 { font-size: 3.5rem; font-weight: bold; margin-bottom: 20px; text-shadow: 2px 2px 4px rgba(0,0,0,0.3);}
    .hero-content p { font-size: 1.3rem; margin-bottom: 30px; text-shadow: 1px 1px 2px rgba(0,0,0,0.3);}
    .section-padding { padding: 40px 0; }
    .section-title { font-size: 2.5rem; font-weight: bold; color: var(--primary-green); margin-bottom: 20px; text-align: center; }
    .section-subtitle { font-size: 1.2rem; color: var(--text-gray); text-align: center; margin-bottom: 50px; }
    .extra-left-space { padding-left:100px !important; padding-right:100px !important; }
    @media (max-width:768px){ 
        .hero-content h1{font-size:2.5rem;} 
        .hero-content p{font-size:1.1rem;} 
        .section-title{font-size:2rem;} 
    }
    @media (max-width: 768px) {
            .container, 
    .container-fluid.extra-left-space, 
    .row, 
    .col, 
    [class*="col-"] {
        margin: 0 auto !important;
        padding: 0 10px !important;  
        max-width: 100% !important;
        box-sizing: border-box !important;
    }  
       }
    /* Special layout when exactly 3 fields exist */
.contact-3fields .col-12 {
    flex: 0 0 100%;
    max-width: 100%;
}

/* Add spacing above first contact info row in the right section */
.col-lg-5.text-center > .row:first-child {
    margin-top: 20px !important;
}
/* Exactly at 768px → show 3 in one row */
@media (min-width: 760px) and (max-width: 800px) {
    .contact-3fields .col-12 {
        flex: 0 0 33.3333% !important;
        max-width: 33.3333% !important;
    }
}

