/* ===================================
   About Page
=================================== */

.about-page{

    display:flex;

    justify-content:space-between;

    align-items:center;

    gap:60px;

    padding:80px;

}

.about-img{

    flex:1;

}

.about-img img{

    width:100%;

    border-radius:20px;

    box-shadow:0 15px 30px rgba(0,0,0,.15);

    transition:.4s;

}

.about-img img:hover{

    transform:scale(1.03);

}

.about-text{

    flex:1;

}

.about-text h2{

    color:#0d6efd;

    font-size:35px;

    margin-bottom:20px;

}

.about-text p{

    color:#555;

    line-height:2;

    font-size:18px;

    margin-bottom:20px;

}

/* ==========================
   Vision & Mission
========================== */

.vision-mission{

    display:grid;

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

    gap:30px;

    padding:40px 80px;

}

.card{

    background:#fff;

    padding:35px;

    border-radius:20px;

    text-align:center;

    box-shadow:0 10px 25px rgba(0,0,0,.08);

    transition:.4s;

}

.card:hover{

    transform:translateY(-10px);

}

.card i{

    font-size:55px;

    color:#0d6efd;

    margin-bottom:20px;

}

.card h2{

    color:#0d6efd;

    margin-bottom:15px;

}

.card p{

    color:#555;

    line-height:1.9;

}

/* ==========================
   Features
========================== */

.section-title{

    text-align:center;

    font-size:38px;

    color:#0d6efd;

    margin:70px 0 40px;

}

.features{

    padding:0 80px 80px;

}

.features-grid{

    display:grid;

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

    gap:25px;

}

.feature-box{

    background:#fff;

    padding:30px;

    border-radius:18px;

    text-align:center;

    box-shadow:0 8px 20px rgba(0,0,0,.08);

    transition:.4s;

}

.feature-box:hover{

    transform:translateY(-10px);

}

.feature-box i{

    font-size:50px;

    color:#0d6efd;

    margin-bottom:20px;

}

.feature-box h3{

    margin-bottom:15px;

}

.feature-box p{

    color:#666;

    line-height:1.8;

}



/* ==========================
   Team
========================== */

.team{

    padding:80px;

}

.team-desc{

    text-align:center;

    color:#666;

    margin-bottom:40px;

    font-size:18px;

}

.team-grid{

    display:grid;

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

    gap:30px;

}

.team-card{

    background:#fff;

    padding:35px;

    border-radius:20px;

    text-align:center;

    box-shadow:0 10px 25px rgba(0,0,0,.08);

    transition:.4s;

}

.team-card:hover{

    transform:translateY(-10px);

}

.team-card i{

    font-size:60px;

    color:#0d6efd;

    margin-bottom:20px;

}

.team-card h3{

    margin-bottom:15px;

    color:#222;

}

.team-card p{

    color:#666;

    line-height:1.8;

}

/* ==========================
   CTA
========================== */

.cta{

    background:#0d6efd;

    color:#fff;

    text-align:center;

    padding:80px 20px;

}

.cta h2{

    font-size:40px;

    margin-bottom:20px;

}

.cta p{

    max-width:700px;

    margin:0 auto 35px;

    line-height:2;

    font-size:18px;

}

.cta .btn{

    background:#fff;

    color:#0d6efd;

}

.cta .btn:hover{

    background:#e9ecef;

}

/* ==========================
   Responsive
========================== */

@media(max-width:992px){

.about-page{

flex-direction:column;

padding:40px 20px;

text-align:center;

}

.vision-mission{

grid-template-columns:1fr;

padding:40px 20px;

}

.features{

padding:40px 20px;

}

.features-grid{

grid-template-columns:1fr;

}


.team{

padding:40px 20px;

}

.team-grid{

grid-template-columns:1fr;

}

.section-title{

font-size:30px;

}

.about-text h2{

font-size:30px;

}

.cta h2{

font-size:30px;

}

}