body{
margin:0;
font-family:'JetBrains Mono',monospace;
background:#020617;
color:#a7f3d0;
text-align:center;
overflow-x:hidden;
}

canvas{
position:fixed;
top:0;
left:0;
z-index:-1;
}

header{
padding-top:70px;
}

.avatar{
width:120px;
border-radius:50%;
border:2px solid #34d399;
box-shadow:0 0 20px #34d39955;
}

h1{
font-size:42px;
margin-top:20px;
}

.subtitle{
opacity:0.7;
}

.buttons{
margin-top:30px;
}

button{
margin:6px;
padding:10px 18px;
background:#020617;
color:#a7f3d0;
border:1px solid #1e293b;
border-radius:8px;
cursor:pointer;
transition:0.25s;
}

button:hover{
border-color:#34d399;
box-shadow:0 0 10px #34d39944;
}

section{
max-width:900px;
margin:auto;
padding:80px 20px;
}

.project-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
gap:20px;
}

.project-card{
border:1px solid #1e293b;
padding:20px;
border-radius:10px;
transition:0.3s;
}

.project-card:hover{
transform:translateY(-5px);
border-color:#34d399;
box-shadow:0 0 15px #34d39933;
}

.skill-list span{
display:inline-block;
border:1px solid #1e293b;
padding:8px 14px;
border-radius:8px;
margin:6px;
}

footer{
padding:30px;
opacity:0.6;
}

html{
scroll-behavior:smooth;
}