/* ======================================
MANOSANCHAY ABOUT PAGE
====================================== */

.ms-about{
font-family:'Inter',sans-serif;
color:#0F172A;
background:#ffffff;
line-height:1.7;
}

/* ======================================
CONTAINER
====================================== */

.ms-container{
max-width:1200px;
margin:auto;
padding:0 24px;
}

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

.ms-about-hero{
padding:140px 0 100px;
text-align:center;
background:linear-gradient(180deg,#E9FFFB,#ffffff);
}

.ms-about-hero h1{
font-size:52px;
font-weight:700;
margin-bottom:24px;
}

.ms-about-hero p{
max-width:760px;
margin:auto;
font-size:18px;
color:#475569;
}


/* ======================================
GRID LAYOUT
====================================== */

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

.ms-about-image img{
width:100%;
border-radius:16px;
box-shadow:0 25px 60px rgba(0,0,0,0.08);
}

.ms-about-text h2{
font-size:36px;
margin-bottom:18px;
}

.ms-about-text p{
font-size:17px;
color:#475569;
margin-bottom:16px;
}

.ms-about-text ul{
padding-left:18px;
margin-top:10px;
}

.ms-about-text li{
margin-bottom:10px;
font-size:16px;
color:#475569;
}


/* ======================================
CHALLENGE SECTION
====================================== */

.ms-about-challenge{
padding:120px 0;
background:#ffffff;
}


/* ======================================
WHY SECTION
====================================== */

.ms-about-why{
padding:120px 0;
background:#F8FAFC;
text-align:center;
}

.ms-about-why h2{
font-size:36px;
margin-bottom:20px;
}

.ms-about-why p{
max-width:820px;
margin:auto;
font-size:17px;
color:#475569;
margin-bottom:14px;
}


/* ======================================
PLATFORM
====================================== */

.ms-about-platform{
padding:120px 0;
background:#ffffff;
}


/* ======================================
TECHNOLOGY
====================================== */

.ms-about-technology{
padding:120px 0;
background:#F8FAFC;
}


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

.ms-about-philosophy{
padding:120px 0;
background:#ffffff;
}

.ms-about-philosophy h2{
text-align:center;
font-size:36px;
margin-bottom:60px;
}

.ms-philosophy-grid{
display:grid;
grid-template-columns:1fr 1fr;
gap:40px;
}

.ms-philosophy-card{
background:#ffffff;
padding:40px;
border-radius:16px;
border-top:4px solid #16E0C4;
box-shadow:0 15px 40px rgba(0,0,0,0.06);
transition:all 0.3s ease;
}

.ms-philosophy-card:hover{
transform:translateY(-6px);
box-shadow:0 25px 60px rgba(0,0,0,0.12);
}

.ms-philosophy-card h3{
font-size:22px;
margin-bottom:14px;
}

.ms-philosophy-card p{
font-size:16px;
color:#475569;
}


/* ======================================
SECURITY
====================================== */

.ms-about-security{
padding:120px 0;
background:#E9FFFB;
}


/* ======================================
FUTURE
====================================== */

.ms-about-future{
padding:140px 0;
text-align:center;
background:linear-gradient(135deg,#16E0C4,#2DD4BF);
color:#ffffff;
}

.ms-about-future h2{
font-size:38px;
margin-bottom:18px;
}

.ms-about-future p{
max-width:700px;
margin:auto;
font-size:18px;
line-height:1.8;
margin-bottom:10px;
}


/* ======================================
RESPONSIVE
====================================== */

@media (max-width:1000px){

.ms-about-grid{
grid-template-columns:1fr;
gap:50px;
}

.ms-philosophy-grid{
grid-template-columns:1fr;
}

}
/* ======================================
SCROLL ANIMATION
====================================== */

.ms-reveal-hidden{
opacity:0;
transform:translateY(60px);
transition:all 0.9s ease;
}

.ms-reveal-visible{
opacity:1;
transform:translateY(0);
}
@media (max-width:600px){

.ms-about-hero h1{
font-size:36px;
}

.ms-about-text h2{
font-size:28px;
}

.ms-about-future h2{
font-size:30px;
}

}