/*==================================================
ABOUT HERO
==================================================*/

.about-hero{

padding:180px 20px 120px;

text-align:center;

background:
linear-gradient(rgba(15,23,42,.72),
rgba(15,23,42,.72)),
url("../../images/main-about/about-bg.jpg");

background-size:cover;

background-position:center;

color:#fff;

}

.about-hero-content{

max-width:850px;

margin:auto;

}

.about-hero h1{

color:#fff;

margin:20px 0;

}

.about-hero p{

color:rgba(255,255,255,.92);

max-width:700px;

margin:auto;

}














/*==================================================
WHO WE ARE
==================================================*/

.who-we-are{

background:#fff;

}

.who-grid{

display:grid;

grid-template-columns:1fr 1fr;

gap:70px;

align-items:center;

}

.who-image{

position:relative;

}

.who-image img{

width:100%;

border-radius:24px;

box-shadow:var(--shadow-lg);

transition:var(--transition);

}

.who-image:hover img{

transform:scale(1.03);

}

.experience-badge{

position:absolute;

right:-25px;

bottom:35px;

background:#fff;

padding:24px;

border-radius:20px;

box-shadow:var(--shadow-lg);

text-align:center;

max-width:180px;

}

.experience-badge h3{

font-size:2.2rem;

color:var(--primary);

margin-bottom:8px;

}

.experience-badge span{

font-weight:600;

color:var(--text);

}

.who-content h2{

margin:18px 0 25px;

}

.who-content p{

margin-bottom:22px;

}

.who-list{

display:flex;

flex-direction:column;

gap:18px;

margin:35px 0;

}

.who-list li{

display:flex;

align-items:center;

gap:15px;

font-weight:500;

}

.who-list i{

color:var(--primary);

font-size:1.15rem;

}












/*==================================================
MISSION & VISION
==================================================*/

.mission-vision{

background:var(--light);

}

.mission-grid{

display:grid;

grid-template-columns:repeat(2,1fr);

gap:35px;

margin-top:60px;

}

.mission-card{

padding:45px;

background:rgba(255,255,255,.85);

backdrop-filter:blur(12px);

border:1px solid rgba(46,125,50,.08);

border-radius:24px;

box-shadow:var(--shadow-sm);

transition:var(--transition);

}

.mission-card:hover{

transform:translateY(-10px);

box-shadow:var(--shadow-lg);

}

.mission-icon{

width:75px;

height:75px;

display:grid;

place-items:center;

background:rgba(46,125,50,.1);

border-radius:20px;

margin-bottom:30px;

}

.mission-icon i{

font-size:2rem;

color:var(--primary);

}

.mission-card h3{

margin-bottom:18px;

}

.mission-card p{

margin:0;

}










/*==================================================
CORE VALUES
==================================================*/

.core-values{

background:#fff;

}

.values-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:30px;

margin-top:60px;

}

.value-card{

padding:40px 30px;

background:#fff;

border:1px solid rgba(46,125,50,.08);

border-radius:24px;

text-align:center;

box-shadow:var(--shadow-sm);

transition:var(--transition);

}

.value-card:hover{

transform:translateY(-10px);

box-shadow:var(--shadow-lg);

border-color:rgba(46,125,50,.25);

}

.value-icon{

width:80px;

height:80px;

margin:0 auto 25px;

display:grid;

place-items:center;

border-radius:50%;

background:rgba(46,125,50,.08);

transition:var(--transition);

}

.value-card:hover .value-icon{

background:var(--primary);

transform:rotate(10deg);

}

.value-icon i{

font-size:2rem;

color:var(--primary);

transition:var(--transition);

}

.value-card:hover .value-icon i{

color:#fff;

}

.value-card h3{

margin-bottom:18px;

}

.value-card p{

margin:0;

}










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

.why-choose{

background:var(--light);

}

.choose-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:30px;

margin-top:60px;

}

.choose-card{

padding:35px;

background:#fff;

border-radius:24px;

border:1px solid rgba(46,125,50,.08);

box-shadow:var(--shadow-sm);

transition:var(--transition);

text-align:center;

}

.choose-card:hover{

transform:translateY(-10px);

box-shadow:var(--shadow-lg);

}

.choose-icon{

width:75px;

height:75px;

margin:0 auto 25px;

display:grid;

place-items:center;

background:rgba(46,125,50,.08);

border-radius:20px;

transition:var(--transition);

}

.choose-card:hover .choose-icon{

background:var(--primary);

transform:scale(1.08);

}

.choose-icon i{

font-size:2rem;

color:var(--primary);

transition:var(--transition);

}

.choose-card:hover .choose-icon i{

color:#fff;

}

.choose-card h3{

margin-bottom:18px;

}

.choose-card p{

margin:0;

}