.header{
    position:fixed;
    z-index:100;
    top:18px;
    left:0;
    right:0;
    padding:0;
    pointer-events:none;
    transition:transform .45s cubic-bezier(.2,.8,.2,1),opacity .35s ease;
}
.header.is-hidden{
    transform:translateY(-130%);
    opacity:0;
}
.header-inner{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:22px;
    min-height:68px;
    padding:8px 9px 8px 22px;
    border:1px solid rgba(255,255,255,.09);
    border-radius:20px;
    background:rgba(10,13,19,.70);
    box-shadow:0 20px 60px rgba(0,0,0,.22);
    backdrop-filter:blur(18px) saturate(135%);
    -webkit-backdrop-filter:blur(18px) saturate(135%);
    pointer-events:auto;
}
.logo{
    display:flex;
    align-items:center;
    gap:10px;
    
    font-size:23px;
    font-weight:300;
    letter-spacing:-.06em;
}
.logo span{
    color:var(--accent);
}
.header-center{
    font-size:13px;
    color:#9AA6B8;
    letter-spacing:.02em;
}
.header-actions{
    display:flex;
    align-items:center;
    gap:9px;
}
.header .btn{
    min-height:48px;
    padding:0 17px;
    font-size:13px;
}
.menu-toggle{
    width:48px;
    height:48px;
    display:grid;
    place-items:center;
    padding:0;
    border:1px solid rgba(255,255,255,.09);
    border-radius:14px;
    background:#121821;
    color:#fff;
    cursor:pointer;
    transition:.25s ease;
}
.menu-toggle:hover{
    background:#192231;
    border-color:rgba(79,124,255,.35);
}
.menu-toggle-lines{
    position:relative;
    width:19px;
    height:14px;
}
.menu-toggle-lines:before,.menu-toggle-lines:after{
    content:"";
    position:absolute;
    left:0;
    width:100%;
    height:1.5px;
    border-radius:5px;
    background:currentColor;
    transition:transform .35s cubic-bezier(.2,.8,.2,1),top .35s cubic-bezier(.2,.8,.2,1);
}
.menu-toggle-lines:before{
    top:3px;
}
.menu-toggle-lines:after{
    top:10px;
}
.menu-toggle[aria-expanded="true"] .menu-toggle-lines:before{
    top:7px;
    transform:rotate(45deg);
}
.menu-toggle[aria-expanded="true"] .menu-toggle-lines:after{
    top:7px;
    transform:rotate(-45deg);
}

.menu-panel{
  position:fixed;z-index:95;inset:0;
  display:grid;place-items:center;
  padding:120px 22px 40px;
  background:rgba(5,7,11,.80);
  backdrop-filter:blur(22px);
  -webkit-backdrop-filter:blur(22px);
  opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity .35s ease,visibility .35s ease;
}
.menu-panel.open{opacity:1;visibility:visible;pointer-events:auto}
.menu-shell{
  width:min(900px,100%);
  overflow:hidden;
  border:1px solid rgba(255,255,255,.09);
  border-radius:30px;
  background:linear-gradient(145deg,#111721,#0C1017);
  box-shadow:0 45px 120px rgba(0,0,0,.5);
  transform:translateY(22px) scale(.985);
  transition:transform .45s cubic-bezier(.2,.8,.2,1);
}
.menu-panel.open .menu-shell{transform:none}
.menu-nav{display:grid}
.menu-link{
  display:grid;grid-template-columns:56px 1fr auto;align-items:center;gap:20px;
  min-height:100px;padding:0 32px;border-bottom:1px solid rgba(255,255,255,.07);
  transition:.25s ease;
}
.menu-link:last-child{border-bottom:0}
.menu-link:hover{background:rgba(79,124,255,.07);padding-left:39px}
.menu-link b{color:#63708A;font-size:11px;letter-spacing:.12em}
.menu-link span{font-size:clamp(26px,4vw,48px);font-weight:300;letter-spacing:-.045em}
.menu-link i{font-style:normal;color:var(--accent);font-size:22px;transition:transform .25s ease}
.menu-link:hover i{transform:translateX(5px)}

