/* header.css - dark header, wordmark, top nav, mobile hamburger trigger */

header{border-bottom:2px solid #000;padding:26px 0 18px;background:#101216;color:#f3f4f6}
header .wrap{position:relative}
.navtoggle{all:unset;display:none;position:absolute;top:50%;right:0;transform:translateY(-50%);
  cursor:pointer;color:#f3f4f6;padding:8px;border:1px solid #2c333d;border-radius:6px;z-index:80}
.navtoggle:hover{background:#1c2230}

h1{font-size:clamp(21px,3.6vw,30px);line-height:1.25;margin:.5em 0 .2em;font-weight:700;letter-spacing:-.3px;color:#fff}
h1 .hl{background:linear-gradient(transparent 60%, rgba(120,170,230,.42) 60%);padding:0 .06em}
h1 .brand{display:block;color:#3fb950;letter-spacing:-.4px}
h1 .tagline{display:block;font-size:.6em;font-weight:600;color:#c7ccd4;margin-top:5px;line-height:1.3}
.sub{color:#aab1bd;font-size:14px}

nav.tabs2{position:sticky;top:0;z-index:30;background:var(--bg);border-bottom:2px solid var(--rule)}
nav.tabs2 .wrap{display:flex;gap:0;flex-wrap:wrap;align-items:center;
  padding-top:0;padding-bottom:0;font-size:13.5px}
.navlinks{display:flex;flex-wrap:wrap;align-items:center}
.navclose{display:none}
nav.tabs2 a{border:none;padding:9px 14px;color:var(--fg);border-right:1px solid var(--line)}
nav.tabs2 .navlinks a:first-child{padding-left:14px;margin-left:-14px;border-right:1px solid var(--line)}
nav.tabs2 a.here{background:var(--fg);color:var(--bg)}
nav.tabs2 a:hover{background:#dde1e7}
nav.tabs2 a.here:hover{background:var(--fg)}