.navbar{position:sticky;top:0;width:100%;background-color:#f5f5f5cc;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);z-index:1000;border-bottom:1px solid var(--color-border);transition:background-color .3s ease}.navbar.scrolled{background-color:#f5f5f5f2}.navbar-container{display:flex;justify-content:space-between;align-items:center;padding:.75rem 2rem;max-width:1200px;margin:0 auto}.navbar-logo{font-weight:700;font-size:1.35rem;letter-spacing:-.01em}.logo-link{color:var(--color-text);text-decoration:none;transition:color .3s ease}.logo-link:hover{color:var(--color-accent)}.navbar-links{display:flex;gap:1.25rem;align-items:center}.nav-link{color:var(--color-text-muted);text-decoration:none;font-size:.85rem;padding:.4rem 0;position:relative;transition:color .2s ease;white-space:nowrap;text-align:center;letter-spacing:.01em}.nav-link:hover{color:var(--color-text)}.nav-link.active{color:var(--color-accent);font-weight:500}.nav-link.active:after{content:"";position:absolute;bottom:0;left:0;width:100%;height:1.5px;background-color:var(--color-accent);border-radius:1px}.menu-toggle{display:none;background:none;border:none;cursor:pointer;padding:.5rem}.bar{display:block;width:22px;height:2px;margin:5px auto;background-color:var(--color-text-secondary);transition:all .3s ease-in-out}@media (max-width: 1200px){.navbar-container{padding:.75rem 1.5rem}}@media (max-width: 1024px){.navbar-container{padding:.75rem 1rem}.navbar-links{gap:1rem}.nav-link{font-size:.8rem}}@media (max-width: 1300px){.menu-toggle{display:block}.navbar-links{position:absolute;top:100%;left:0;flex-direction:column;width:100%;background-color:#f5f5f5f2;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--color-border);padding:0 2rem;gap:0;max-height:0;overflow:hidden;transition:max-height .2s ease-out,opacity .15s ease-out;opacity:0}.navbar-links.active{max-height:500px;opacity:1;padding:.75rem 2rem}.nav-link{width:100%;padding:.6rem 0;font-size:.9rem;border-bottom:1px solid var(--color-border-light)}.nav-link:last-child{border-bottom:none}}@media (max-width: 480px){.navbar-container{padding:.6rem 1rem}.navbar-logo{font-size:1.2rem}.navbar-links.active{padding:.75rem 1rem}}