/* web/sitenav.css — the marketing pages' top bar. Brand on the left, links in
   the middle, a prominent Sign in button on the right. Under 720px the links
   fold into a menu behind a ☰ button; Sign in stays visible. */
nav.sitenav { display: flex; align-items: center; gap: 1rem; padding: 0.9rem 0; position: relative; }
nav.sitenav .brand { font-weight: 700; font-size: 1.15rem; text-decoration: none; display: flex; align-items: center; gap: 0.5rem; margin-right: auto; color: var(--ink); white-space: nowrap; }
nav.sitenav .brand img { height: 1.7rem; width: 1.7rem; }
nav.sitenav .brand .short { display: none; }
nav.sitenav .links { display: flex; gap: 1.2rem; align-items: center; }
nav.sitenav .links a { text-decoration: none; font-weight: 700; color: var(--accent2); }
nav.sitenav .signin { text-decoration: none; white-space: nowrap; min-height: 2.7rem; padding: 0.4rem 1.2rem; font-size: 1rem; }
nav.sitenav .navtoggle { display: none; font: inherit; font-weight: 700; color: var(--ink); background: var(--panel); border: 2px solid var(--line); border-radius: 12px; padding: 0.4rem 0.7rem; min-height: 2.7rem; cursor: pointer; align-items: center; gap: 0.4rem; }
nav.sitenav .navtoggle .bars { font-size: 1.4rem; line-height: 1; }
@media (max-width: 720px) {
  nav.sitenav { gap: 0.6rem; }
  nav.sitenav .brand { font-size: 1.05rem; }
  nav.sitenav .brand .full { display: none; } nav.sitenav .brand .short { display: inline; }
  nav.sitenav .navtoggle { display: inline-flex; }
  nav.sitenav .navtoggle .word { display: none; }
  nav.sitenav .links { display: none; position: absolute; left: 0; right: 0; top: 100%; flex-direction: column; align-items: stretch; gap: 0; background: var(--panel); border: 1px solid var(--line); border-radius: var(--r-md); box-shadow: var(--shadow); padding: 0.4rem; z-index: 20; }
  nav.sitenav.open .links { display: flex; }
  nav.sitenav .links a { padding: 0.9rem 1rem; border-radius: 10px; font-size: 1.15rem; }
  nav.sitenav .links a:hover, nav.sitenav .links a:focus-visible { background: var(--panel2); }
}
@media (max-width: 400px) {
  nav.sitenav .brand .short { display: none; }
}