/* The site header's mobile menu: /nav.js adds a hamburger button to header.top and a panel with every link of the
   header (the nav and the sign-in / get-started buttons). Below 960px the inline nav hides and the button shows; the
   panel drops down under the header while header.top has the class "open". Every page loads this after its own CSS. */
.top .burger { display: none; margin-left: auto; width: 42px; height: 42px; padding: 0; border: 1px solid var(--line); border-radius: 10px; background: transparent; cursor: pointer; flex-direction: column; justify-content: center; align-items: center; gap: 5px; flex: none; }
.top .right + .burger { margin-left: 0; }
.top .burger span { display: block; width: 18px; height: 2px; border-radius: 2px; background: var(--fg); transition: transform .2s, opacity .2s; }
.top.open .burger span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.top.open .burger span:nth-child(2) { opacity: 0; }
.top.open .burger span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
.top .mnav { display: none; position: absolute; left: 0; right: 0; top: 100%; z-index: 1; flex-direction: column; padding: 4px 28px 16px; background: #0a0c11; border-bottom: 1px solid var(--line); box-shadow: 0 24px 40px rgba(0,0,0,.45); max-height: calc(100vh - 80px); overflow-y: auto; }
.top .mnav a { display: block; padding: 11px 4px; font-size: 15px; font-weight: 500; color: var(--fg-2, var(--fg)); border-top: 1px solid var(--line); text-decoration: none; }
.top .mnav a:first-child { border-top: none; }
.top .mnav a:hover, .top .mnav a.on { color: var(--fg); }
.top .mnav a.cta { margin-top: 10px; border-top: none; text-align: center; border-radius: 999px; background: linear-gradient(90deg, var(--teal), var(--blue)); color: #06131a; font-weight: 600; padding: 12px 18px; }
@media (max-width: 960px) {
  .top .burger { display: flex; }
  .top nav, .top .plain { display: none !important; }
  .top.open .mnav { display: flex; }
  .top .wrap { gap: 14px; }
}
@media (max-width: 420px) { .top .right .pill { display: none; } }