/* Rally2Rumble - the page links (Info, Route, Agenda ...) live in one dropdown instead of a long row.
   java/menu.js wraps .nav2 in .menu and adds the button. Without JavaScript the old row still shows. */
.menu{position:relative}
.menu-btn{display:inline-flex;align-items:center;gap:10px;font:700 13px 'Space Grotesk',sans-serif;letter-spacing:.12em;text-transform:uppercase;padding:10px 14px;clip-path:none;
  background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1px var(--line)}
.menu-btn:hover,.menu-btn[aria-expanded="true"]{box-shadow:inset 0 0 0 1px var(--ink)}
.menu-btn:focus-visible{outline:2px solid var(--accent2);outline-offset:2px}
.menu-ico{position:relative;width:16px;height:2px;background:currentColor;transition:background .15s}
.menu-ico::before,.menu-ico::after{content:"";position:absolute;left:0;width:16px;height:2px;background:currentColor;transition:transform .15s}
.menu-ico::before{top:-5px}.menu-ico::after{top:5px}
.menu-btn[aria-expanded="true"] .menu-ico{background:transparent}
.menu-btn[aria-expanded="true"] .menu-ico::before{transform:translateY(5px) rotate(45deg)}
.menu-btn[aria-expanded="true"] .menu-ico::after{transform:translateY(-5px) rotate(-45deg)}
.menu .nav2{display:none;position:absolute;top:calc(100% + 8px);left:0;z-index:60;flex-direction:column;flex-wrap:nowrap;align-items:stretch;gap:0;
  min-width:230px;padding:6px;background:var(--panel);border:1px solid var(--line);border-top:3px solid var(--accent);box-shadow:0 14px 34px rgba(0,0,0,.28)}
.menu.open .nav2{display:flex}
.menu .nav2 a{padding:12px 14px;border-bottom:0;border-left:3px solid transparent;white-space:nowrap}
.menu .nav2 a:hover,.menu .nav2 a:focus-visible{background:var(--bg);border-bottom:0;outline:none}
.menu .nav2 a.on{border-left-color:var(--accent);background:var(--bg)}
@media(max-width:600px){.menu .nav2{left:auto;right:0;min-width:min(260px,calc(100vw - 40px))}}
@media print{.menu{display:none}}