/* ---------------------------------------------------------------------------
   Mobile nav: hamburger + panel. Matches the 599px breakpoint at which
   site-responsive.css hides the link group, so the links never vanish without
   the burger appearing in the same breath.

   One sticky chrome across every page. Theme colours come from
   data-orbit-theme (set by mobile-nav.js) so landing's dark/light pair and
   every inner page share the same rules — not landing-only [data-nav] hooks.
   --------------------------------------------------------------------------- */
.orbit-burger{ display: none; }

@media (max-width: 599px){
  /* Links and the CTA move into the panel; leaving them in the bar either
     spans half the header (CTA) or sits beside the logo (request.html's
     "Back to Orbit", which is not inside the gap:28px group). */
  nav .orbit-nav-cta:not(.orbit-menu__cta),
  nav .orbit-nav-link:not(.orbit-menu__link){ display: none !important; }

  /* Sticky on every page. fx.html and request.html ship without inline sticky,
     so without this the bar scrolls away and takes the menu with it. */
  nav[data-screen-label="Nav"]{
    position: sticky !important;
    top: 0;
    z-index: 50;
  }

  /* Opaque sticky surfaces — never let page content show through the bar or
     the open panel (FX used to probe a gradient and end up transparent). */
  [data-orbit-theme="dark"],
  [data-nav="dark"]{
    background: var(--navy-deepest) !important;
  }
  [data-orbit-theme="light"],
  [data-nav="light"]{
    background: var(--paper) !important;
  }
  [data-orbit-theme="dark"] .orbit-menu,
  [data-nav="dark"] .orbit-menu{
    background: var(--navy-deepest);
  }
  [data-orbit-theme="light"] .orbit-menu,
  [data-nav="light"] .orbit-menu{
    background: var(--paper);
  }

  /* Logo mark + word follow the bar theme, not the page's global `a {}` colour
     (FX sets a { color: ice-faint }, which washed out on light sections). */
  [data-orbit-theme="dark"] .orbit-nav-logo,
  [data-orbit-theme="dark"] .orbit-nav-logo span,
  [data-orbit-theme="dark"] .orbit-nav-logo svg,
  [data-nav="dark"] .orbit-nav-logo,
  [data-nav="dark"] .orbit-nav-logo span,
  [data-nav="dark"] .orbit-nav-logo svg{
    color: var(--ice) !important;
  }
  [data-orbit-theme="light"] .orbit-nav-logo,
  [data-orbit-theme="light"] .orbit-nav-logo span,
  [data-orbit-theme="light"] .orbit-nav-logo svg,
  [data-nav="light"] .orbit-nav-logo,
  [data-nav="light"] .orbit-nav-logo span,
  [data-nav="light"] .orbit-nav-logo svg{
    color: var(--navy-primary) !important;
  }

  /* push the burger to the far edge regardless of what else is in the row */
  .orbit-burger{ margin-left: auto !important; }

  .orbit-burger{
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
    width: 40px;
    height: 40px;
    padding: 0 9px;
    margin: -6px -8px -6px 0;   /* optical: align the bars to the edge, keep a 40px target */
    background: none;
    border: 0;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
  }
  .orbit-burger span{
    display: block;
    height: 1.5px;
    width: 100%;
    background: currentColor;
    border-radius: 2px;
    transition: transform 180ms ease, opacity 140ms ease;
  }
  /* the bars fold into a cross */
  .orbit-burger.is-open span:nth-child(1){ transform: translateY(6.5px) rotate(45deg) }
  .orbit-burger.is-open span:nth-child(2){ opacity: 0 }
  .orbit-burger.is-open span:nth-child(3){ transform: translateY(-6.5px) rotate(-45deg) }

  .orbit-menu{
    display: grid;
    padding: 6px 24px 18px;
    animation: orbit-menu-in 180ms ease both;
  }
  /* `display:grid` above outranks the UA rule that the hidden attribute relies
     on, so without this the panel is permanently open. */
  .orbit-menu[hidden]{ display: none; }
  @keyframes orbit-menu-in{ from{ opacity: 0; translate: 0 -6px } to{ opacity: 1; translate: 0 0 } }

  .orbit-menu__link{
    font-family: var(--mono);
    font-size: 13px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    text-decoration: none;
    padding: 15px 2px;             /* 46px rows — comfortable thumb targets */
    border-top: 1px solid var(--ice-edge);
  }
  .orbit-menu__cta{
    margin-top: 16px;
    padding: 15px 18px;
    border-radius: 4px;
    text-align: center;
    font-family: var(--mono);
    font-size: 12px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    text-decoration: none;
  }

  /* Shared themes — landing (data-nav) and every other page (data-orbit-theme) */
  [data-nav="dark"] .orbit-burger,
  [data-orbit-theme="dark"] .orbit-burger{ color: var(--ice) }
  [data-nav="dark"] .orbit-menu__link,
  [data-orbit-theme="dark"] .orbit-menu__link{ color: var(--ice); border-top-color: var(--ice-edge) }
  [data-nav="dark"] .orbit-menu__cta,
  [data-orbit-theme="dark"] .orbit-menu__cta{ background: var(--ice); color: var(--navy-deepest) }

  [data-nav="light"] .orbit-burger,
  [data-orbit-theme="light"] .orbit-burger{ color: var(--ink-100, #0c374b) }
  [data-nav="light"] .orbit-menu__link,
  [data-orbit-theme="light"] .orbit-menu__link{ color: var(--ink-100, #0c374b); border-top-color: rgba(12,55,75,.14) }
  [data-nav="light"] .orbit-menu__cta,
  [data-orbit-theme="light"] .orbit-menu__cta{ background: var(--navy-primary, #0c374b); color: var(--ice) }
}

@media (prefers-reduced-motion: reduce){
  .orbit-menu{ animation: none !important }
  .orbit-burger span{ transition: none !important }
}
