/* Shared site header and navbar for adam-costa.com/tools/.
   Linked by the tool pages; per-page tweaks go in each page's own style block.
   Knobs: --header-bar-max (content width, default 1060px)
          --header-gap     (space below the bar, default 8px) */
/* ---- site header + navbar (matches adam-costa.com) ---- */
.site-header { width:100%; border-bottom:1px solid var(--border); margin-bottom:var(--header-gap, 8px); }
.site-header .bar { max-width:var(--header-bar-max, 1060px); margin:0 auto; padding:20px 20px 16px; display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:.5rem 1.5rem; }
.site-header .site-name { font-family:"Newsreader", Georgia, serif; font-weight:600; font-size:1.15rem; color:var(--fg); text-decoration:none; letter-spacing:.01em; }
.site-header .site-name:hover { color:#c2410c; }
.site-header nav { display:flex; flex-wrap:wrap; gap:1.1rem; font-family:"Inter", system-ui, sans-serif; font-size:.9rem; }
.site-header .nav-item { position:relative; }
.site-header .nav-item > a { color:var(--muted); text-decoration:none; }
.site-header .nav-item > a:hover { color:#c2410c; }
.site-header .nav-item > a.active { color:var(--fg); font-weight:500; }
.site-header .dropdown { display:none; position:absolute; top:100%; left:50%; transform:translateX(-50%); z-index:50; min-width:14rem; max-width:90vw; max-height:70vh; overflow-y:auto; background:var(--card); border:1px solid var(--border); border-radius:8px; box-shadow:0 10px 28px rgba(0,0,0,.14); padding:.45rem 0; }
.site-header .nav-item:last-child .dropdown { left:auto; right:0; transform:none; }
.site-header .nav-item:hover .dropdown, .site-header .nav-item:focus-within .dropdown { display:block; }
.site-header .dropdown a { display:block; padding:.32rem .95rem; color:var(--fg); text-decoration:none; font-size:.82rem; line-height:1.4; white-space:nowrap; }
.site-header .dropdown a:hover { background:var(--accent-soft, rgba(127,127,127,.12)); color:#c2410c; }
@media (max-width:640px) { .site-header .dropdown { display:none !important; } }