header{position:fixed;top:0;left:0;width:100%;z-index:1000;backdrop-filter:blur(16px);background:rgba(13, 13, 20, 0.8);border-bottom:1px solid var(--line)}
.navbar{max-width:1400px;margin:auto;height:70px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(20px,4vw,50px)}
.logo{font-size:26px;font-weight:600;letter-spacing:.5px}
.logo span{color:var(--accent)}
.nav-links{display:flex;gap:36px}
.nav-links a{position:relative;padding:6px 0;color:var(--muted);font-size:15px;transition:color .25s}
.nav-links a::after{content:"";position:absolute;left:0;bottom:0;width:0;height:1.5px;background:var(--accent);transition:width .3s}
.nav-links a:hover,.nav-links a.active{color:var(--text)}
.nav-links a:hover::after,.nav-links a.active::after{width:100%}
.nav-right{display:flex;align-items:center;gap:16px}
.resume-btn{padding:9px 22px;border-radius:10px;background:var(--accent);color:var(--ink);font-size:15px;font-weight:500;transition:background .25s}
.resume-btn:hover{background:var(--accent-hover)}
.menu-btn{display:none;flex-direction:column;gap:6px;padding:6px;background:none}
.menu-btn span{width:26px;height:2px;background:var(--text);transition:.3s}
.menu-btn.open span:nth-child(1){transform:translateY(8px) rotate(45deg)}
.menu-btn.open span:nth-child(2){opacity:0}
.menu-btn.open span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}

@media(max-width:900px){
    .nav-links{position:fixed;top:70px;right:-100%;width:260px;height:calc(100vh - 70px);background:#0d0d14;flex-direction:column;padding:40px 30px;gap:28px;transition:right .4s}
    .nav-links.active{right:0}
    .menu-btn{display:flex}
}