:root{
--bg1:#0f172a;
--bg2:#020617;
--glass:rgba(255,255,255,0.06);
--border:rgba(255,255,255,0.12);
--text:#e5e7eb;
--muted:#9ca3af;
--accent:#4facfe;
}

*{box-sizing:border-box}

body{
margin:0;
font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
color:var(--text);
background:radial-gradient(circle at top,var(--bg1),var(--bg2));
}

.glass{
background:var(--glass);
backdrop-filter:blur(8px);
border:1px solid var(--border);
border-radius:12px;
transition:.3s;
}

.glass:hover{
box-shadow:0 0 20px rgba(79,172,254,.25);
border-color:rgba(79,172,254,.4);
}

.hero{padding:80px 20px;text-align:center}
.hero-box{max-width:520px;margin:auto;padding:35px}

.avatar{width:130px;margin:auto}
.avatar svg{width:100%}

h1{margin:18px 0 10px;font-size:30px}

.typing{
font-size:18px;
color:var(--accent);
border-right:2px solid var(--accent);
white-space:nowrap;
overflow:hidden;
width:0;
margin:auto;
animation:typing 3s steps(30,end) forwards,blink 1s infinite;
}
@keyframes typing{from{width:0}to{width:260px}}
@keyframes blink{50%{border-color:transparent}}

.intro{color:var(--muted);margin-top:14px}

.cv-btn{
display:inline-block;
margin-top:18px;
padding:10px 18px;
border-radius:8px;
text-decoration:none;
color:white;
background:linear-gradient(90deg,#4facfe,#00f2fe);
font-size:14px;
transition:.25s;
}
.cv-btn:hover{
transform:translateY(-2px);
box-shadow:0 0 14px rgba(79,172,254,.5);
}

.nav{margin:20px auto;padding:10px;text-align:center;max-width:700px}
.nav a{color:var(--text);text-decoration:none;margin:0 16px}
.nav a:hover{color:var(--accent)}

main{max-width:900px;margin:auto;padding:10px 15px 30px}
.card{padding:26px;margin-bottom:18px}

h2{margin-top:0;color:var(--accent)}
h3{margin-bottom:6px;color:#cbd5e1;font-size:16px}

.skill{margin:12px 0}
.skill label{font-size:14px;color:var(--muted)}
.bar{
height:8px;
background:#020617;
border-radius:6px;
margin-top:5px;
overflow:hidden;
border:1px solid var(--border);
}
.bar div{
height:100%;
background:linear-gradient(90deg,#4facfe,#00f2fe);
}

footer{
text-align:center;
padding:20px;
color:var(--muted);
font-size:14px;
}