/* ======================================================
   ABOUT SECTION
====================================================== */


.about-section{

padding:100px 20px;

background:#f7f9fc;

}



.about-wrapper{

max-width:1200px;

margin:auto;

display:grid;

grid-template-columns:1fr 1fr;

gap:70px;

align-items:center;

}



/* CONTENT */


.about-content h2{

font-size:clamp(35px,4vw,52px);

line-height:1.15;

font-weight:800;

color:#0b1f3a;

margin:20px 0;

}



.about-intro{

font-size:18px;

font-weight:500;

color:#444;

}



.about-content p{

line-height:1.8;

color:#666;

}





/* FEATURES */


.about-features{

display:grid;

grid-template-columns:repeat(2,1fr);

gap:20px;

margin:35px 0;

}



.about-feature{

background:white;

padding:20px;

border-radius:18px;

display:flex;

gap:15px;

align-items:center;

box-shadow:
0 10px 30px rgba(0,0,0,.06);

}



.feature-icon{

width:50px;

height:50px;

flex-shrink:0;

border-radius:14px;

background:#0b1f3a;

color:white;

display:flex;

align-items:center;

justify-content:center;

font-size:20px;

}



.about-feature h4{

margin:0;

color:#0b1f3a;

font-size:16px;

}



.about-feature p{

margin:5px 0 0;

font-size:13px;

}




/* IMAGE */


.about-visual{

position:relative;

}



.about-image-box{

height:560px;

border-radius:35px;

overflow:hidden;

box-shadow:

0 30px 70px rgba(0,0,0,.18);

}



.about-image-box img{

width:100%;

height:100%;

object-fit:cover;

}




/* EXPERIENCE CARD */


.about-stats-card{

position:absolute;

bottom:30px;

left:-40px;

background:white;

border-radius:22px;

padding:25px;

display:flex;

gap:35px;

box-shadow:

0 20px 50px rgba(0,0,0,.15);

}



.about-stat strong{

display:block;

font-size:38px;

font-weight:800;

color:#e60000;

}



.about-stat span{

font-size:14px;

color:#555;

}




/* MOBILE */


@media(max-width:900px){


.about-wrapper{

grid-template-columns:1fr;

gap:40px;

}



.about-content{

text-align:center;

}



.about-features{

grid-template-columns:1fr;

}



.about-buttons{

justify-content:center;

}



.about-image-box{

height:380px;

}



.about-stats-card{

position:relative;

left:auto;

bottom:auto;

margin-top:20px;

justify-content:center;

}


}