/* The site menu, shared by the homepage and every marketing page. Tokens come from /ui.css (dark by default, light by device or choice). */
.top{position:sticky;top:0;z-index:40;background:var(--bar);-webkit-backdrop-filter:blur(14px) saturate(1.4);backdrop-filter:blur(14px) saturate(1.4);border-bottom:1px solid var(--line)}
.navrow{display:flex;align-items:center;gap:var(--s-4);min-height:64px;max-width:1240px;margin:0 auto;padding:0 clamp(20px,4vw,48px)}
.top .logo{display:inline-flex;align-items:center;gap:10px;font-weight:800;font-size:1.2rem;text-decoration:none;color:var(--text);flex:none}
.top .logo img{width:30px;height:30px;display:block;border-radius:8px}
.top .logo b,.top .logo span span{color:var(--green)}
.mainnav{display:flex;align-items:center;gap:2px;margin-left:var(--s-4);flex:1;min-width:0}
.mainnav>a,.dd>summary{display:inline-flex;align-items:center;gap:5px;padding:9px 12px;border-radius:var(--r-1);color:var(--text2);font-size:.92rem;font-weight:550;text-decoration:none;cursor:pointer;list-style:none;white-space:nowrap;transition:background var(--dur-fast) var(--ease-out),color var(--dur-fast) var(--ease-out)}
.dd>summary::-webkit-details-marker{display:none}
@media (hover:hover) and (pointer:fine){.mainnav>a:hover,.dd>summary:hover{color:var(--text);background:var(--panel2)}}
.mainnav>a[aria-current=page],.dd.on>summary{color:var(--text);box-shadow:inset 0 -2px 0 var(--green);border-radius:var(--r-1) var(--r-1) 0 0}
.dd{position:relative}
.dd>summary .chev{width:15px;height:15px;opacity:.7;transition:transform var(--dur-med) var(--ease-out)}
.dd[open]>summary{color:var(--text);background:var(--panel2)}
.dd[open]>summary .chev{transform:rotate(180deg)}
.ddpanel{position:absolute;top:calc(100% + 10px);left:-8px;z-index:50;min-width:300px;padding:var(--s-2);background:var(--panel);border:1px solid var(--line2);border-radius:var(--r-3);box-shadow:var(--elev-sheet);animation:navpop var(--dur-med) var(--ease-out)}
.ddpanel.wide{display:grid;grid-template-columns:1fr 1fr;gap:2px;min-width:600px}
.ddi{display:grid;grid-template-columns:auto 1fr;gap:var(--s-3);align-items:start;padding:var(--s-3);border-radius:var(--r-2);text-decoration:none;color:var(--text)}
@media (hover:hover) and (pointer:fine){.ddi:hover{background:var(--panel2)}}
.ddi[aria-current=page]{background:var(--panel2)}
.ddic{display:grid;place-items:center;width:36px;height:36px;border-radius:10px;background:var(--panel2);border:1px solid var(--line);color:var(--green)}
.ddic svg,.mi svg{width:18px;height:18px}
.ddi b{display:block;font-size:.93rem;font-weight:650;line-height:1.3}
.ddi small{display:block;color:var(--muted);font-size:.8rem;line-height:1.4;margin-top:2px}
.navcta{display:flex;align-items:center;gap:var(--s-2);margin-left:auto;flex:none}
.navcta .signin{color:var(--text2);font-size:.92rem;font-weight:550;text-decoration:none;padding:9px 12px;border-radius:var(--r-1)}
@media (hover:hover) and (pointer:fine){.navcta .signin:hover{color:var(--text);background:var(--panel2)}}
.navcta .btn{white-space:nowrap}
.menu{display:none;margin-left:auto}
.menu>summary{display:grid;place-items:center;width:44px;height:44px;border:1px solid var(--line2);border-radius:var(--r-2);color:var(--text);cursor:pointer;list-style:none;background:var(--panel)}
.menu>summary::-webkit-details-marker{display:none}
.menu>summary svg{width:22px;height:22px;grid-area:1/1}
.menu>summary .x{display:none}.menu[open]>summary .x{display:block}.menu[open]>summary .bars{display:none}
.menupanel{position:absolute;left:0;right:0;top:100%;max-height:calc(100vh - 64px);max-height:calc(100dvh - 64px);overflow-y:auto;overscroll-behavior:contain;background:var(--bg);border-bottom:1px solid var(--line2);box-shadow:var(--elev-sheet);padding:var(--s-3) clamp(20px,4vw,48px) calc(var(--s-5) + env(safe-area-inset-bottom,0px));animation:navpop var(--dur-med) var(--ease-out)}
.menupanel h2{font-size:.74rem;font-weight:650;color:var(--muted);letter-spacing:.02em;margin:var(--s-4) 0 var(--s-1);padding:0 var(--s-3)}
.menupanel .mi{display:flex;align-items:center;gap:var(--s-3);min-height:48px;padding:10px var(--s-3);border-radius:var(--r-2);color:var(--text);text-decoration:none;font-size:1rem;font-weight:550}
.menupanel .mi svg{color:var(--green);flex:none}
.menupanel .mi[aria-current=page]{background:var(--panel2)}
.menupanel .mcta{display:grid;gap:var(--s-2);margin-top:var(--s-5)}
.menupanel .mcta .btn{width:100%;text-align:center}
@keyframes navpop{from{opacity:0;transform:translateY(-6px)}}
@media (max-width:900px){.mainnav,.navcta{display:none}.menu{display:block}.navrow{min-height:60px}.menupanel{max-height:calc(100vh - 60px);max-height:calc(100dvh - 60px)}}
@media (min-width:901px) and (max-width:1060px){.navcta .signin{display:none}.mainnav>a,.dd>summary{padding:9px 9px}}
@media (prefers-contrast:more){.top{background:var(--bg)}}
