/* ECO CONTACT PAGE */

.eco-contact-section{
padding:120px 20px;
background:#f7f9f4;
}

.eco-contact-container{
max-width:1200px;
margin:auto;
display:grid;
grid-template-columns:1fr 1fr;
gap:60px;
align-items:flex-start;
}

/* left side */

.eco-contact-info h2{
font-size:40px;
margin-bottom:20px;
color:#1F242E;
}

.eco-contact-info p{
color:#6E777D;
line-height:1.6;
margin-bottom:30px;
}

.eco-contact-item{
display:flex;
gap:18px;
margin-bottom:25px;
}

.eco-contact-item i{
font-size:20px;
color:#87AB42;
margin-top:4px;
}

.eco-contact-item h4{
margin:0;
font-size:16px;
color:#1F242E;
}

.eco-contact-item p{
margin:4px 0 0;
}

.eco-contact-item a{
color:#6E777D;
text-decoration:none;
}

/* form box */

.eco-contact-form-box{
background:#ffffff;
padding:40px;
border-radius:12px;
box-shadow:0 15px 35px rgba(0,0,0,0.08);
}

/* fields */

.eco-field{
margin-bottom:18px;
}

.eco-field input,
.eco-field textarea{
width:100%;
padding:14px;
border-radius:6px;
border:1px solid #ddd;
font-size:14px;
outline:none;
}

.eco-field textarea{
resize:none;
}

/* button */

.eco-submit-btn{
background:#87AB42;
color:white;
border:none;
padding:14px 28px;
border-radius:6px;
font-weight:600;
cursor:pointer;
transition:all .3s ease;
}

.eco-submit-btn:hover{
background:#1F242E;
}

/* responsive */

@media(max-width:900px){

.eco-contact-container{
grid-template-columns:1fr;
}

}



/* certificate styling starts here  */
.cert-section{
    background: #F6F9EF;

}
.cert-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
}
.cert-title {
    background: #F6F9EF;
    margin-top: 20px;
    display: block;
    text-align: center;
}
.cert-card{
    background:#F6F9EF;
    padding:20px;
    border-radius:10px;
    box-shadow:0 10px 25px rgba(0,0,0,0.08);
}

.cert-card img{
    width:100%;
    height:220px;
    object-fit:contain;
    cursor:pointer;
}

/* Modal */
.cert-modal{
    display:none;
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background:rgba(0,0,0,0.85);
    justify-content:center;
    align-items:center;
    z-index:999;
}

.cert-modal img{
    max-width:80%;
    max-height:80%;
    border-radius:10px;
}

.cert-close{
    position:absolute;
    top:40px;
    right:60px;
    font-size:40px;
    color:white;
    cursor:pointer;
}

.cert-modal{
  display:none;
  position:fixed;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background:rgba(0,0,0,0.85);
  justify-content:center;
  align-items:center;
  z-index:9999;
}

.cert-modal img{
  max-width:80%;
  max-height:80%;
}

.cert-close{
  position:absolute;
  top:40px;
  right:60px;
  font-size:40px;
  color:white;
  cursor:pointer;
}
/* ends here */


/* gallery styling starts here */
.gallery-section{
    padding:120px 20px;
    background:#f8faf4;
}

.gallery-container{
    max-width:1200px;
    margin:auto;
}

.gallery-title{
    text-align:center;
    font-size:42px;
    margin-bottom:70px;
    color:#1F242E;
}

/* Grid layout */
.gallery-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:25px;
}

/* Cards */
.gallery-card{
    height:260px;
    border-radius:10px;
    overflow:hidden;
    box-shadow:0 15px 30px rgba(0,0,0,0.08);
}

.gallery-card img{
    width:100%;
    height:100%;
    object-fit:cover;
    transition:transform .4s ease;
}

/* Hover */
.gallery-card:hover img{
    transform:scale(1.08);
}

.gallery-modal{
  display:none;
  position:fixed;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background:rgba(0,0,0,0.9);
  justify-content:center;
  align-items:center;
  z-index:9999;
}

.gallery-modal img{
  max-width:85%;
  max-height:85%;
  border-radius:10px;
}

.gallery-close{
  position:absolute;
  top:40px;
  right:60px;
  font-size:40px;
  color:white;
  cursor:pointer;
}


/* gallery style ends here */