/* The shared site header (site-header.php). Everything is scoped to .sh so the theme's and the
   product pages' older CSS (#nav, a, ul, li ...) can't change it, and it can't change them. */
.sh { --sh-link:#046fb3; --sh-dark:#1f4d63; --sh-line:#d9e3ea;
      max-width:1030px; margin:0 auto 20px; padding:5px 0 0; box-sizing:border-box;
      font-family:Roboto, -apple-system, "Segoe UI", sans-serif; font-size:16px; line-height:1.25; text-align:left; }
.sh *, .sh *::before, .sh *::after { box-sizing:border-box; }
.sh a { display:inline; color:var(--sh-link); background:none; border:0; text-decoration:none; float:none; }
.sh img { border:0; display:block; max-width:none; }
.sh ul, .sh li { list-style:none; margin:0; padding:0; float:none; background:none; border:0; }

/* top row: logo left, search + social right */
.sh-top { display:flex; align-items:center; gap:16px; min-height:100px; }
.sh-logo img { width:219px; height:100px; }
.sh-tools { margin-left:auto; display:flex; align-items:center; gap:12px; }
.sh-search { display:flex; margin:0; }
.sh-search input { width:240px; margin:0; padding:8px 10px; font:inherit; font-size:15px; color:#000; background:#fff;
                   border:1px solid #bbb; border-right:0; border-radius:5px 0 0 5px; height:38px; }
.sh-search button { margin:0; padding:0 14px; height:38px; font:inherit; font-weight:700; color:#fff; background:var(--sh-dark);
                    border:0; border-radius:0 5px 5px 0; cursor:pointer; }
.sh-search button:hover { background:#163a4b; }
.sh-social { display:flex; gap:8px; }
.sh-social a { display:block; line-height:0; opacity:.85; }
.sh-social a:hover { opacity:1; }
.sh-social img { width:32px; height:32px; }

/* menu */
.sh-nav ul { display:flex; flex-wrap:wrap; align-items:center; }
.sh-nav li a { display:block; margin:0 8px; padding:2px 0; font-weight:700; color:var(--sh-link); }
.sh-nav li:first-child a { margin-left:0; }
.sh-nav li a:hover { text-decoration:underline; }

/* the menu button only exists on narrow screens */
.sh-burger { display:none; margin-left:auto; padding:4px 10px; font-size:26px; line-height:1; color:var(--sh-dark);
             background:none; border:1px solid var(--sh-line); border-radius:5px; cursor:pointer; }

@media (max-width:760px) {
  .sh { padding:6px 12px 0; margin-bottom:12px; }
  .sh-top { min-height:0; flex-wrap:wrap; gap:10px; }
  .sh-logo img { width:132px; height:60px; }
  .sh-burger { display:block; }
  .sh-tools, .sh-nav { display:none; }
  .sh.sh-open .sh-tools { display:flex; flex-wrap:wrap; width:100%; margin:0; }
  .sh.sh-open .sh-search { flex:1 1 100%; }
  .sh.sh-open .sh-search input { flex:1; width:auto; min-width:0; }
  .sh.sh-open .sh-nav { display:block; border-top:1px solid var(--sh-line); margin-top:8px; }
  .sh-nav ul { display:block; }
  .sh-nav li a { margin:0; padding:9px 0; border-bottom:1px solid #f0f0f0; }
}