
.about-hero{padding:90px 0;background:linear-gradient(135deg,#f4f9ff,#fff)}
.about-hero h1{font-size:clamp(2rem,4vw,3.4rem);font-weight:800;color:#083f70}
.about-hero p{font-size:1.15rem;color:#555;max-width:600px}
.about-badge,.section-label{color:#00a6c8;font-weight:700;letter-spacing:1px}
.about-logo-box{background:#fff;border-radius:30px;padding:40px;box-shadow:0 20px 50px rgba(0,0,0,.12)}
.about-logo-box img{max-width:100%;height:auto}
.about-btn{background:#083f70;color:#fff;padding:13px 28px;border-radius:30px}
.about-btn:hover{background:#00a6c8;color:#fff}
.about-btn-outline{border:2px solid #083f70;padding:11px 26px;border-radius:30px;color:#083f70}
.about-story h2,.about-values h2{font-weight:800;color:#083f70}
.story-list div{margin:12px 0;font-weight:600}
.story-list i{color:#00a6c8;margin-right:10px}
.mission-box{padding:35px;background:#f8fbff;border-radius:25px;border-left:5px solid #00a6c8}
.about-card,.about-stat{height:100%;background:#fff;border-radius:22px;padding:30px;text-align:center;box-shadow:0 10px 35px rgba(0,0,0,.08);transition:.3s}
.about-card:hover{transform:translateY(-8px)}
.about-card i{font-size:40px;color:#00a6c8}
.about-card h3{color:#083f70;margin-top:15px}
.about-stat strong{display:block;font-size:42px;color:#083f70}
.about-stat span{color:#666}
@media(max-width:768px){.about-hero{padding:50px 0}.about-btn,.about-btn-outline{width:100%;text-align:center}}
