/* Mobile menu for the marketing pages (js/marketing-nav.js). Hidden on
   desktop, where the nav links show; on phones and tablets a hamburger next
   to the header buttons opens a panel under the header. */
.marketing-menu-toggle { display: none; position: relative; width: 42px; height: 42px; flex: 0 0 auto; padding: 0; border: 1px solid #dbe4f1; border-radius: 12px; background: #fff; cursor: pointer; }
.marketing-menu-toggle span { position: absolute; left: 11px; right: 11px; height: 2px; border-radius: 2px; background: #0b1f3a; transition: transform .2s ease, opacity .2s ease, top .2s ease; }
.marketing-menu-toggle span:nth-child(1) { top: 13px; }
.marketing-menu-toggle span:nth-child(2) { top: 20px; }
.marketing-menu-toggle span:nth-child(3) { top: 27px; }
.marketing-menu-toggle.is-open span:nth-child(1) { top: 20px; transform: rotate(45deg); }
.marketing-menu-toggle.is-open span:nth-child(2) { opacity: 0; }
.marketing-menu-toggle.is-open span:nth-child(3) { top: 20px; transform: rotate(-45deg); }
.marketing-menu-toggle:focus-visible { outline: 3px solid rgba(11, 85, 255, .3); outline-offset: 2px; }

.marketing-menu-panel { position: absolute; left: 12px; right: 12px; top: calc(100% + 8px); z-index: 60; display: grid; gap: 4px; padding: 10px; border: 1px solid #dce5f1; border-radius: 18px; background: #fff; box-shadow: 0 2px 4px rgba(7, 23, 53, .04), 0 38px 86px -40px rgba(7, 23, 53, .5); animation: marketing-menu-in .18s ease; }
.marketing-menu-panel[hidden] { display: none; }
.marketing-menu-link { display: block; padding: 13px 14px; border-radius: 12px; color: #071735; font-size: 16px; font-weight: 800; text-decoration: none; }
.marketing-menu-link:hover, .marketing-menu-link:focus-visible { background: #f3f7ff; color: #0b55ff; outline: none; }
.marketing-menu-auth { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 6px; padding: 12px 14px 4px; border-top: 1px solid #edf1f6; }
.marketing-menu-auth > a:not(.btn) { color: #0b55ff; font-size: 15px; font-weight: 800; text-decoration: none; }
.marketing-menu-auth .btn { min-height: 42px; padding: 0 18px; }
.marketing-menu-backdrop { position: fixed; inset: 0; z-index: 50; background: rgba(5, 14, 32, .28); }
.marketing-menu-backdrop[hidden] { display: none; }
html.marketing-menu-open { overflow: hidden; }
@keyframes marketing-menu-in { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }

@media (max-width: 980px) {
  .topbar { position: relative; }
  .marketing-menu-toggle { display: block; }
}