/* =====================================
MANOSANCHAY LANDING PAGE
===================================== */

:root{

--accent:#16E0C4;
--accent-soft:#a7fff2;

--text-dark:#0f172a;
--text-light:#6b7280;

--bg-soft:#f8fafc;

--card-shadow:0 20px 60px rgba(0,0,0,0.08);
--glow:0 0 25px rgba(22,224,196,0.45);

}


/* =====================================
GLOBAL
===================================== */

body{
font-family: 'Inter',sans-serif;
color:var(--text-dark);
background:#ffffff;
}

.ms-container{
max-width:1200px;
margin:auto;
padding:0 20px;
}

section{
padding:120px 0;
position:relative;
}


/* =====================================
HERO
===================================== */

.ms-hero{

position:relative;
height:100vh;
display:flex;
align-items:center;
overflow:hidden;

}

#ai-particles{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
z-index:1;
}

.ms-hero-bg{

position:absolute;
top:0;
left:0;
width:100%;
height:100%;
overflow:hidden;
z-index:0;

}

.ms-hero-bg img{

width:100%;
height:100%;
object-fit:cover;
opacity:.35;
transform:scale(1.05);

}

.ms-hero-inner{
position:relative;
z-index:2;
}

.ms-hero-content{

max-width:700px;

}

.ms-hero h1{

font-size:64px;
line-height:1.15;
font-weight:700;

}

.ms-hero h1 span{
color:var(--accent);
}

.ms-hero-subtext{

margin-top:25px;
font-size:18px;
line-height:1.7;
color:var(--text-light);

}

.ms-security-note{

margin-top:30px;
font-size:14px;
color:#94a3b8;

}
/* =====================================
PLATFORM INTRO
===================================== */

.ms-platform-intro{

padding:120px 0;
text-align:center;
background:#ffffff;

}

.ms-platform-intro h1{

font-size:56px;
line-height:1.2;
font-weight:700;

}

.ms-platform-intro h1 span{

color:#16E0C4;

}

.ms-intro-text{

margin-top:30px;

font-size:20px;
line-height:1.7;

max-width:820px;
margin-left:auto;
margin-right:auto;

color:#64748b;

}

.ms-intro-security{

margin-top:25px;

font-size:15px;

color:#94a3b8;

}

/* =====================================
BUTTONS
===================================== */

.ms-hero-actions{

margin-top:35px;
display:flex;
gap:20px;
flex-wrap:wrap;

}

.ms-btn-primary{

background:var(--accent);
color:#062b27;
padding:14px 32px;
border-radius:40px;
font-weight:600;
text-decoration:none;
transition:all .3s ease;
box-shadow:var(--glow);

}

.ms-btn-primary:hover{

transform:translateY(-3px);
box-shadow:0 10px 30px rgba(22,224,196,.6);

}

.ms-btn-secondary{

border:2px solid var(--accent);
padding:12px 30px;
border-radius:40px;
text-decoration:none;
color:var(--accent);
font-weight:600;
transition:.3s;

}

.ms-btn-secondary:hover{

background:var(--accent);
color:#062b27;

}


/* =====================================
MANIFESTO
===================================== */

.ms-manifesto{

background:var(--bg-soft);
text-align:center;

}

.ms-manifesto h2{

font-size:38px;
margin-bottom:20px;

}

.ms-manifesto p{

max-width:750px;
margin:auto;
font-size:18px;
color:var(--text-light);
line-height:1.7;

}


/* =====================================
GRID SYSTEM
===================================== */

.ms-context-grid,
.ms-india-grid,
.ms-ecosystem-grid,
.ms-tools-grid,
.ms-security-grid{

display:grid;
grid-template-columns:1fr 1fr;
gap:80px;
align-items:center;

}


/* =====================================
IMAGES
===================================== */

.ms-context-image img,
.ms-india-image img,
.ms-ecosystem-image img,
.ms-tools-image img,
.ms-security-image img{

width:100%;
border-radius:18px;
box-shadow:var(--card-shadow);
transition:transform .6s ease;

}

.ms-context-image img:hover,
.ms-india-image img:hover,
.ms-tools-image img:hover{

transform:scale(1.04);

}


/* =====================================
TEXT BLOCKS
===================================== */

.ms-context-text h2,
.ms-india-text h2,
.ms-ecosystem-text h2,
.ms-tools-text h2,
.ms-security-text h2{

font-size:34px;
margin-bottom:20px;

}

.ms-context-text p,
.ms-india-text p,
.ms-security-text p{

font-size:17px;
line-height:1.7;
color:var(--text-light);

}

.ms-ecosystem-text ul,
.ms-tools-text ul,
.ms-security-text ul{

margin-top:20px;
padding-left:18px;

}

.ms-ecosystem-text li,
.ms-tools-text li,
.ms-security-text li{

margin-bottom:10px;
font-size:16px;

}


/* =====================================
WORKFLOW
===================================== */

.ms-section-title{

text-align:center;
font-size:38px;
margin-bottom:60px;

}

.ms-workflow-grid{

display:grid;
grid-template-columns:repeat(4,1fr);
gap:30px;

}

.ms-step{

background:#ffffff;

padding:34px 30px;

border-radius:18px;

box-shadow:
0 6px 20px rgba(0,0,0,0.06),
0 18px 50px rgba(0,0,0,0.08);

transition:all .35s ease;

position:relative;

overflow:hidden;

}


/* subtle top glow */

.ms-step::before{

content:"";

position:absolute;

top:0;
left:0;
right:0;

height:4px;

background:linear-gradient(
90deg,
transparent,
#16E0C4,
transparent
);

opacity:.35;

}


/* hover */

.ms-step:hover{

transform:translateY(-10px) scale(1.02);

box-shadow:
0 20px 60px rgba(0,0,0,0.15),
0 0 25px rgba(22,224,196,0.35);

}
.ms-step h3{

font-size:20px;
font-weight:600;
margin-bottom:10px;

}

.ms-step p{

font-size:15px;
line-height:1.6;
color:#64748b;

}
.ms-step::after{

content:"";

position:absolute;

top:-40%;
left:-60%;

width:200%;
height:200%;

background:linear-gradient(
120deg,
transparent,
rgba(255,255,255,0.35),
transparent
);

transform:rotate(25deg);
opacity:0;
transition:opacity .6s;

}

.ms-step:hover::after{

opacity:.5;

}

/* =====================================
TOOLS SECTIONS
===================================== */

.ms-platform-tools{
background:#ffffff;
}

.ms-patient-tools{
background:var(--bg-soft);
}


/* =====================================
SECURITY
===================================== */

.ms-security{

background:#ffffff;

}

.ms-security-text ul{
margin-top:20px;
}


/* =====================================
CTA
===================================== */

.ms-final-cta{

text-align:center;
background:linear-gradient(
135deg,
rgba(22,224,196,0.12),
rgba(22,224,196,0.02)
);

}

.ms-final-cta h2{

font-size:38px;
margin-bottom:25px;

}

.ms-cta-note{

margin-top:20px;
color:#64748b;

}


/* =====================================
SCROLL REVEAL
===================================== */

.ms-context-text,
.ms-india-text,
.ms-ecosystem-text,
.ms-tools-text,
.ms-security-text,
.ms-step,
.ms-context-image,
.ms-india-image,
.ms-security-image{

opacity:0;
transform:translateY(40px);
transition:all .8s ease;

}

.ms-reveal{

opacity:1;
transform:translateY(0);

}


/* =====================================
RESPONSIVE
===================================== */

@media(max-width:1000px){

.ms-context-grid,
.ms-india-grid,
.ms-ecosystem-grid,
.ms-tools-grid,
.ms-security-grid{

grid-template-columns:1fr;

}

.ms-workflow-grid{

grid-template-columns:1fr 1fr;

}

.ms-hero h1{

font-size:44px;

}

}

@media(max-width:600px){

section{
padding:80px 0;
}

.ms-workflow-grid{
grid-template-columns:1fr;
}

}