.about-banner{
background:#0b7a3b;
padding:80px 20px;
text-align:center;
color:#fff;
}

.about-banner h1{
font-size:42px;
margin-bottom:10px;
}

.about-banner p{
font-size:18px;
}

.about-section{
padding:70px 0;
}

.about-grid{
display:grid;
grid-template-columns:1fr 1fr;
gap:50px;
align-items:center;
}

.about-content h2{
font-size:34px;
margin:15px 0;
color:#0b7a3b;
}

.about-content p{
line-height:1.9;
text-align:justify;
}

.subtitle{
color:#ff9800;
font-weight:bold;
letter-spacing:2px;
}

.about-image img{
width:100%;
border-radius:15px;
box-shadow:0 10px 30px rgba(0,0,0,.15);
}

.about-boxes{
display:grid;
grid-template-columns:repeat(2,1fr);
gap:20px;
margin-top:35px;
}

.box{
background:#fff;
padding:25px;
text-align:center;
border-radius:12px;
box-shadow:0 5px 20px rgba(0,0,0,.08);
transition:.3s;
}

.box:hover{
transform:translateY(-6px);
}

.box h3{
font-size:32px;
color:#0b7a3b;
}

.vision-mission{
background:#f7f7f7;
padding:70px 0;
}

.vm-grid{
display:grid;
grid-template-columns:1fr 1fr;
gap:30px;
}

.card{
background:#fff;
padding:35px;
border-left:6px solid #0b7a3b;
box-shadow:0 5px 20px rgba(0,0,0,.08);
border-radius:10px;
}

.why-us{
padding:70px 0;
}

.why-us h2{
text-align:center;
margin-bottom:40px;
}

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

.why-grid div{
background:#fff;
padding:25px;
text-align:center;
border-radius:10px;
box-shadow:0 5px 20px rgba(0,0,0,.08);
font-weight:600;
}

@media(max-width:768px){

.about-grid,
.vm-grid,
.why-grid{
grid-template-columns:1fr;
}

.about-banner h1{
font-size:30px;
}

.about-boxes{
grid-template-columns:1fr;
}

}