/* Homepage navigation: grouped discovery with a complete mobile disclosure. */
.topbar { position:relative; z-index:20; gap:32px; min-height:96px; padding:20px 0; }
.topbar .brand { flex-shrink:0; font-size:20px; font-weight:600; gap:10px; }
.site-navigation { display:flex; align-items:center; justify-content:space-between; flex:1; gap:24px; }
.topbar .nav { display:flex; gap:4px; font-size:14px; font-weight:500; color:#52647b; letter-spacing:0; }
.topbar .nav > a,.nav-group > summary { display:flex; align-items:center; gap:8px; padding:12px 13px; border-radius:8px; cursor:pointer; white-space:nowrap; list-style:none; }
.nav-group > summary::-webkit-details-marker { display:none; }
.topbar .nav > a:hover,.nav-group > summary:hover,.nav-group[open] > summary { color:#1e4677; background:#edf3fb; }
.nav-chevron { width:6px; height:6px; border-right:1.5px solid currentColor; border-bottom:1.5px solid currentColor; transform:translateY(-2px) rotate(45deg); }
.nav-group[open] .nav-chevron { transform:translateY(2px) rotate(225deg); }
.nav-panel { position:absolute; top:calc(100% - 8px); padding:12px; border:1px solid #dce4ef; background:#fff; border-radius:16px; box-shadow:0 20px 50px #132d4e1c; white-space:normal; }
.platform-panel { left:0; display:grid; grid-template-columns:240px 1fr; width:650px; gap:12px; }
.nav-panel-intro { padding:24px; background:#f2f6fc; border-radius:10px; }
.nav-eyebrow { display:block; font-size:10px; letter-spacing:.12em; font-weight:700; color:#2563eb; margin-bottom:18px; }
.nav-panel-intro > strong { display:block; font-size:23px; line-height:1.25; letter-spacing:-.04em; color:#16365e; }
.nav-panel-intro p { font-size:13px; line-height:1.65; margin:12px 0 24px; }
.nav-panel-intro a { font-size:12px; font-weight:600; color:#2563eb; }
.nav-panel-links { display:grid; gap:4px; }
.nav-panel-links a { display:block; padding:13px 16px; border-radius:9px; }
.nav-panel-links a:hover { background:#f2f6fc; }
.nav-panel-links strong { display:block; font-size:14px; font-weight:600; color:#183759; }
.nav-panel-links span { display:block; margin-top:3px; font-size:12px; line-height:1.5; color:#64748b; }
.resources-panel { width:310px; }
.topbar .top-actions { gap:18px; flex-wrap:nowrap; width:auto; font-size:13px; font-weight:600; }
.nav-github,.nav-docs { color:#52647b; white-space:nowrap; }
.nav-github span,.nav-docs span { margin-left:3px; color:#8795a8; }
.nav-contact { display:flex; align-items:center; gap:20px; padding:11px 17px; border-radius:8px; background:#1e4677; color:#fff; white-space:nowrap; }
.nav-contact:hover { background:#15365e; }
.menu-toggle { display:none; }
.topbar a:focus-visible,.topbar summary:focus-visible,.menu-toggle:focus-visible { outline:3px solid #2563eb; outline-offset:3px; }
@media(max-width:1100px) {
  .topbar { gap:18px; }
  .site-navigation { gap:12px; }
  .topbar .nav > a,.nav-group > summary { padding:12px 9px; }
  .topbar .top-actions { gap:12px; }
  .nav-github { display:none; }
}
@media(max-width:900px) {
  .topbar { flex-direction:row; align-items:center; flex-wrap:wrap; min-height:80px; gap:0; padding:16px 0; }
  .topbar .brand { font-size:19px; }
  .menu-toggle { display:flex; align-items:center; gap:12px; border:1px solid #dce4ef; border-radius:8px; background:#fff; color:#183759; padding:11px 14px; min-height:44px; font-family:inherit; font-size:14px; font-weight:500; cursor:pointer; }
  .menu-icon { width:16px; height:10px; border-top:1.5px solid; border-bottom:1.5px solid; }
  .menu-toggle[aria-expanded="true"] { background:#edf3fb; }
  .site-navigation { flex:0 0 100%; display:none; padding-top:18px; }
  .site-navigation.is-open { display:block; }
  .topbar .nav { display:flex; flex-direction:column; align-items:stretch; gap:4px; }
  .topbar .nav > a,.nav-group > summary { justify-content:space-between; min-height:48px; padding:12px 14px; font-size:15px; }
  .nav-panel { position:static; width:100%; box-shadow:none; margin:6px 0 10px; border-radius:10px; }
  .platform-panel { grid-template-columns:1fr; }
  .nav-panel-intro { padding:18px; }
  .nav-panel-intro > strong,.nav-panel-intro p { display:none; }
  .nav-eyebrow { margin-bottom:8px; }
  .topbar .top-actions { display:flex; gap:24px; padding:20px 4px 4px; margin-top:14px; border-top:1px solid #dce4ef; }
  .nav-github { display:inline; }
  .nav-contact { margin-left:auto; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }
@media print { .topbar { display:none; } }