/* website/site/nav.css: the drop-down menus nav.js drives, in the home page's dark look. The first
   menu opens to the right of its button and the last to the left, so neither runs off a phone. */
.menu{position:relative;display:inline-flex;pointer-events:auto}
.menu-btn{font:inherit;color:#d5d9e3;background:none;border:0;padding:10px 0;cursor:pointer;
  display:inline-flex;align-items:center;gap:7px}
.menu-btn:hover,.menu-btn[aria-expanded="true"]{color:#f0d9a8}
.menu-btn .caret{width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;
  border-top:5px solid currentColor;opacity:.75}
.drop{position:absolute;top:100%;left:-12px;z-index:40;min-width:230px;max-width:calc(100vw - 32px);
  display:flex;flex-direction:column;padding:8px;pointer-events:auto;
  background:rgba(8,12,24,.97);border:1px solid #2a3350;border-radius:12px;box-shadow:0 12px 32px rgba(0,0,0,.5)}
.menu:last-of-type .drop{left:auto;right:-12px}
.drop[hidden]{display:none}
.menu .drop a{color:#e3e6ee;text-decoration:none;padding:9px 12px;border-radius:8px;font-size:15px;line-height:1.3}
.menu .drop a:hover,.menu .drop a:focus-visible{background:#1a2238;color:#f0d9a8}
.menu .drop .soon{padding:9px 12px;color:#7a8196;font-size:15px;line-height:1.3}
.menu .drop .soon small{font:10px 'IBM Plex Mono',Consolas,monospace;letter-spacing:.08em;margin-left:6px;text-transform:uppercase}