.burger{
 display:none;
 margin-left:auto;
 width:44px;height:44px;
 padding:0;
 border:0;
 background:transparent;
 color:var(--ink);
 cursor:pointer;
 -webkit-tap-highlight-color:transparent
}
.burger__box{
 display:grid;
 place-content:center;
 gap:6px;
 width:100%;height:100%
}
.burger__bar{
 display:block;
 width:22px;height:2px;
 border-radius:2px;
 background:currentColor;
 transition:transform 320ms cubic-bezier(.16,1,.3,1),
 opacity 160ms ease-out,
 background-color 160ms ease-out
}
.burger[aria-expanded="true"]{color:var(--accent)}
.burger[aria-expanded="true"] .burger__bar:first-child{transform:translateY(4px) rotate(45deg)}
.burger[aria-expanded="true"] .burger__bar:last-child{transform:translateY(-4px) rotate(-45deg)}
.burger:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:8px}
.menu{
 position:fixed;
 inset:0;
 width:100%;max-width:none;
 height:100dvh;max-height:none;
 margin:0;
 padding:1rem clamp(1.25rem,6vw,2.5rem) 2.5rem;
 border:0;
 background:var(--paper);
 color:var(--ink);
 overflow:auto;
 flex-direction:column;
 justify-content:space-between;
 opacity:0;
 translate:0 -8px;
 transition:opacity 240ms ease-out,
 translate 320ms cubic-bezier(.16,1,.3,1),
 overlay 320ms allow-discrete,
 display 320ms allow-discrete
}
.menu:popover-open{display:flex;opacity:1;translate:0 0}
@starting-style{
 .menu:popover-open{opacity:0;translate:0 -8px}
}
.menu::backdrop{background:rgba(11,10,12,.28)}
.menu__nav{display:flex;flex-direction:column;gap:.35rem;margin-top:auto;margin-bottom:auto}
.menu__nav a{
 font-size:clamp(2rem,9vw,2.9rem);
 font-weight:var(--fw-display);
 line-height:1.08;
 letter-spacing:var(--tracking);
 text-decoration:none;
 color:var(--ink);
 padding:.28em 0;
 opacity:0;
 translate:0 14px;
 transition:opacity 260ms ease-out,translate 380ms cubic-bezier(.16,1,.3,1),color 150ms ease-out
}
.menu:popover-open .menu__nav a,
.menu:popover-open .menu__foot{
 opacity:1;
 translate:0 0;
 transition-delay:calc(60ms + var(--i,0) * 45ms)
}
.menu__nav a:active{color:var(--accent)}
.menu__nav a:focus-visible{outline:2px solid var(--accent);outline-offset:4px;border-radius:4px}
.menu__foot{
 display:flex;
 flex-direction:column;
 align-items:stretch;
 gap:1rem;
 padding-top:1.5rem;
 border-top:1px solid var(--line);
 opacity:0;
 translate:0 14px;
 transition:opacity 260ms ease-out,translate 380ms cubic-bezier(.16,1,.3,1)
}
.menu__mail{
 text-align:center;
 font-size:.95rem;
 font-weight:var(--fw-emph);
 color:var(--muted);
 text-decoration:none
}
body:has(.menu:popover-open){overflow:hidden}
@media (max-width:767px){
 .burger{display:block}
 .header__nav{display:none}
}
@media (min-width:768px){
 .menu,.menu:popover-open{display:none}
}
@media (prefers-reduced-motion:reduce){
 .burger__bar,.menu,.menu__nav a,.menu__foot{transition-duration:1ms}
 .menu,.menu__nav a,.menu__foot{translate:none}
}
.menu--fallback{display:none}
.menu--fallback.is-open{display:flex;opacity:1;translate:0 0;z-index:100}
.menu--fallback.is-open .menu__nav a,
.menu--fallback.is-open .menu__foot{opacity:1;translate:0 0}
.menu__top{
 display:flex;
 align-items:center;
 justify-content:space-between;
 min-height:44px
}
.menu__brand{
 display:flex;
 align-items:center;
 gap:.55rem;
 font-size:.98rem;
 font-weight:var(--fw-title);
 letter-spacing:var(--tracking);
 white-space:nowrap
}
.menu__brand img{width:24px;height:24px}
.burger--close{display:block;margin:0;color:var(--accent)}
.burger--close .burger__bar:first-child{transform:translateY(4px) rotate(45deg)}
.burger--close .burger__bar:last-child{transform:translateY(-4px) rotate(-45deg)}