/* Entrance motion never changes the dimensions of the document. */
.motion-enabled .reveal[data-motion-state=pending],.motion-enabled [data-motion-state=pending]{opacity:0}
[data-motion-state=entering]{will-change:transform,opacity}
/* The full menu remains mounted so both opening and closing can animate. */
.menu-backdrop{display:none}
.menu-toggle{min-width:44px;min-height:44px;justify-content:center}
@media(max-width:740px){
  .header{z-index:2}
  .header #navigation{display:flex;z-index:3;background:#123f32;max-height:calc(100dvh - var(--header-h));overflow-y:auto;overscroll-behavior:contain;transform-origin:50% 0;visibility:hidden;pointer-events:none;opacity:0;transform:translateY(-14px);clip-path:inset(0 0 100% 0);border-bottom:1px solid #b6936266;transition:clip-path .55s cubic-bezier(.76,0,.24,1),transform .5s var(--ease),opacity .3s,visibility 0s .55s}
  .header #navigation.open{visibility:visible;pointer-events:auto;opacity:1;transform:translateY(0);clip-path:inset(0 0 0% 0);transition:clip-path .65s cubic-bezier(.16,1,.3,1),transform .65s var(--ease),opacity .2s,visibility 0s}
  .header #navigation>a{opacity:0;transform:translate3d(0,-15px,0);transition:opacity .18s,transform .25s var(--ease)}
  .header #navigation.open>a{opacity:1;transform:translate3d(0,0,0);transition:opacity .45s var(--ease),transform .6s var(--ease);transition-delay:calc(110ms + var(--menu-order,0)*55ms)}
  .header #navigation>a:nth-child(1){--menu-order:0}.header #navigation>a:nth-child(2){--menu-order:1}.header #navigation>a:nth-child(3){--menu-order:2}.header #navigation>a:nth-child(4){--menu-order:3}.header #navigation>a:nth-child(5){--menu-order:4}
  .menu-toggle>span{transition:transform .5s var(--ease)}.menu-toggle[aria-expanded=true]>span{transform:rotate(90deg)}
  .menu-backdrop{display:block;position:absolute;top:100%;left:0;width:100%;height:calc(100dvh - var(--header-h));padding:0;background:#031e18aa;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .4s,visibility 0s .4s}
  .menu-open .menu-backdrop{opacity:1;visibility:visible;pointer-events:auto;transition:opacity .4s,visibility 0s}
  html.menu-open{overflow:hidden}
}
@media(prefers-reduced-motion:reduce){
  .motion-enabled [data-motion-state]{opacity:1!important;will-change:auto}
  .header #navigation,.header #navigation>a,.menu-toggle>span,.menu-backdrop{transition:none!important}
}
