body{

margin:0;
font-family:Segoe UI;
background:#0b0c15;
color:white;

}


header{

display:flex;
justify-content:space-between;
padding:20px 60px;
background:#0f1020;

}


nav a{

margin-left:25px;
text-decoration:none;
color:white;

}


.hero{

text-align:center;
padding:120px 20px;

}


.hero h1{

font-size:60px;
color:#00f7ff;

}


.social i{

font-size:30px;
margin-top:20px;

}


section{

padding:80px 60px;

}


.skills{

display:grid;
grid-template-columns:repeat(4,1fr);
gap:20px;

}


.skills div{

background:#15172b;
padding:20px;
border-radius:10px;
text-align:center;

}


.project-card{

background:#15172b;
padding:40px;
border-radius:10px;

}


.pipeline{

display:grid;
grid-template-columns:repeat(5,1fr);
gap:20px;
text-align:center;

}


.pipeline div{

background:#1b1d35;
padding:20px;
border-radius:8px;

}


#repos{

display:grid;
grid-template-columns:repeat(3,1fr);
gap:20px;

}


.repo-card{

background:#15172b;
padding:20px;
border-radius:8px;

}


footer{

text-align:center;
padding:30px;
color:#888;

}