/* ==========================
   CONTACT HERO
========================== */

.contact-hero{
    position:relative;
    min-height:75vh;

    display:flex;
    justify-content:center;
    align-items:center;

    text-align:center;
	background:linear-gradient( rgba(11,102,35,0.60), rgba(11,102,35,0.60)), url("../images/contact-hero.jpg");
   /* background:url("images/contact-hero.jpg"); */
    background-size:cover;
    background-position:center;

    overflow:hidden;
}

.contact-hero-overlay{
    position:absolute;
    inset:0;
   /*background:  linear-gradient( rgba(11,102,35,.80), rgba(11,102,35,.75) ); */
}

.contact-hero-content{
    position:relative;
    z-index:2;

    max-width:900px;
    padding:0 20px;

    color:white;
}

.contact-hero-content h1{
    font-size:clamp(1.8rem,4vw,3rem);
    line-height:1.2;
    margin:25px 0;
}

.contact-hero-content p{
    font-size:1.2rem;
    line-height:1.8;

    max-width:750px;
    margin:auto auto 35px;
}

.hero-btn{
    display:inline-block;

    padding:16px 35px;

    border-radius:50px;

    background:white;
    color:#0b6623;

    font-weight:700;
    text-decoration:none;

    transition:.3s ease;
}

.hero-btn:hover{
    transform:translateY(-3px);
}

/* ==========================
   CONTACT INFO
========================== */

.contact-info{
    padding:6px 8%;
    background:#f8faf8;
}

.contact-cards{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:30px;
    margin-top:60px;
}

.contact-card{
    background:#fff;
    padding:40px 25px;
    border-radius:20px;
    text-align:center;
    box-shadow:0 10px 30px rgba(0,0,0,.08);
    transition:.3s ease;
}

.contact-card:hover{
    transform:translateY(-8px);
}

.contact-icon{
    width:80px;
    height:80px;
    margin:0 auto 20px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:50%;
    background:#e8f3ea;

    font-size:2rem;
}

.contact-card h3{
    color:#0b6623;
    margin-bottom:15px;
}

.contact-card p{
    color:#666;
    line-height:1.7;
}

.contact-link{
    display:inline-block;
    margin-top:15px;
    color:#0b6623;
    font-weight:600;
    text-decoration:none;
}

.whatsapp-card .contact-icon{
    background:#25D366;
    color:white;
}

@media(max-width:992px){

    .contact-cards{
        grid-template-columns:repeat(2,1fr);
    }

}

@media(max-width:576px){

    .contact-cards{
        grid-template-columns:1fr;
    }

}

/* ==========================
   LOCATION SECTION
========================== */

.location-section{
    padding:70px 8%;
    background:#f8faf8;
}

.location-wrapper{
    display:grid;
    grid-template-columns:1fr 1.2fr;
    gap:50px;
    margin-top:60px;
}

.location-info{
    display:flex;
    flex-direction:column;
    gap:25px;
}

.location-item{
    display:flex;
    gap:20px;

    background:#fff;
    padding:25px;

    border-radius:15px;

    box-shadow:0 5px 20px rgba(0,0,0,.06);
}

.location-item span{
    font-size:2rem;
}

.location-item h4{
    color:#0b6623;
    margin-bottom:8px;
}

.location-item p{
    color:#666;
}

.map-container{
    overflow:hidden;
    border-radius:20px;

    box-shadow:0 10px 30px rgba(0,0,0,.1);
}

.map-container iframe{
    width:100%;
    height:100%;
    min-height:450px;
    border:none;
}

@media(max-width:992px){

    .location-wrapper{
        grid-template-columns:1fr;
    }

}

/* ==========================
   CONTACT OPTIONS
========================== */

.contact-options{
    padding:20px 8%;
    background:#fff;
}

.contact-options-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:30px;
    margin-top:60px;
}

.option-card{
    background:#f8faf8;
    border-radius:20px;
    padding:40px 30px;
    text-align:center;
    transition:.3s ease;
}

.option-card:hover{
    transform:translateY(-8px);
    box-shadow:0 10px 30px rgba(0,0,0,.08);
}

.option-icon{
    width:80px;
    height:80px;
    margin:0 auto 20px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:50%;

    background:#e7f2e8;
    font-size:2rem;
}

.whatsapp .option-icon{
    background:#25D366;
    color:white;
}

.option-card h3{
    color:#0b6623;
    margin-bottom:15px;
}

.option-card p{
    color:#666;
    margin-bottom:25px;
    line-height:1.7;
}

.option-btn{
    display:inline-block;
    padding:12px 28px;
    border-radius:30px;

    background:#0b6623;
    color:white;

    text-decoration:none;
    font-weight:600;
}

@media(max-width:768px){

    .contact-options-grid{
        grid-template-columns:1fr;
    }

}

/* ==========================
   CONTACT CTA
========================== */

.contact-cta{

    padding:120px 8%;
    background:
    linear-gradient(
        rgba(11,102,35,.92),
        rgba(11,102,35,.92)
    ),
    url("../images/contact-cta-bg.jpg");

    background-size:cover;
    background-position:center;

    text-align:center;
    color:white;
}

.contact-cta h2{
    color:white;
    font-size:clamp(2.2rem,5vw,4rem);
    margin:25px 0;
}

.contact-cta p{
    max-width:800px;
    margin:0 auto 40px;

    font-size:1.1rem;
    line-height:1.8;

    color:rgba(255,255,255,.9);
}

.contact-cta .section-badge{
    background:rgba(255,255,255,.15);
    color:white;
}

.cta-buttons{
    display:flex;
    justify-content:center;
    gap:20px;
    flex-wrap:wrap;
}

.cta-btn{
    padding:16px 35px;
    border-radius:50px;

    text-decoration:none;
    font-weight:700;

    transition:.3s ease;
}

.cta-btn.primary{
    background:white;
    color:#0b6623;
}

.cta-btn.primary:hover{
    transform:translateY(-4px);
}

.cta-btn.secondary{
    border:2px solid white;
    color:white;
}

.cta-btn.secondary:hover{
    background:white;
    color:#0b6623;
}

.section-badge{
    display:inline-block;
    padding:12px 28px;
    background:#e7f2e8;
    color:#0b6623;
    border-radius:30px;
    font-weight:700;
    margin-bottom:20px;
}