/* Base header/nav shared by SMB + Off-Ramp */
header.wrap { margin: 0 auto; max-width: 1100px; padding: 16px 20px; }
header .brand { font-weight: 700; margin-right: 16px; text-decoration: none; }
header nav { display:flex; align-items:center; justify-content:space-between; gap:1rem; }
header .links { display:flex; flex-wrap:wrap; align-items:center; gap:14px; }
header .links a { text-decoration:none; }

/* Optional dropdown pattern you already use */
/* Dropdown base */
.has-sub { position: relative; display:inline-flex; align-items:center; gap:.25rem; }
.has-sub .sub-toggle { background:transparent; border:0; cursor:pointer; line-height:1; }

/* The menu */
.has-sub .sub{
  position:absolute;
  top:100%;           /* sit flush under the button (no gap) */
  left:0;
  min-width:220px;
  padding:.5rem 0;
  margin:0;           /* ← remove the old 6px gap */
  list-style:none;
  background:#fff;
  border:1px solid #E5E7EB;
  border-radius:.5rem;
  box-shadow:0 8px 24px rgba(0,0,0,.08);
  display:none;
  z-index:1000;
}

/* Invisible hover bridge to prevent flicker if any subpixel gap appears */
.has-sub .sub::before{
  content:"";
  position:absolute;
  top:-8px; left:0; right:0; height:8px;
}

/* Open states: hover, focus, or JS toggle */
.has-sub:hover .sub,
.has-sub:focus-within .sub,
.has-sub.open .sub { display:block; }

/* Small screens: keep your existing behavior */
@media (max-width: 800px){
  .has-sub .sub { position:static; box-shadow:none; border:0; margin:6px 0 0; }
}

/* Brand + tagline stacked */
.brandlockup { display:flex; flex-direction:column; }
.brandlockup .brand {
  font-weight:700; text-decoration:none; line-height:1.1;
}
.brandlockup .tagline {
  color:#64748b;           /* muted slate */
  font-size:.9rem;
  margin-top:2px;
}

/* Keep the header balanced */
header nav { display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; }
header .links { display:flex; flex-wrap:wrap; align-items:center; gap:14px; }

/* Small screens: hide tagline to reduce clutter */
@media (max-width: 760px) {
  .brandlockup .tagline { display:none; }
  header nav { align-items:center; } /* re-center vertically */
}

/* allow JS-opened menus to stay open */
.has-sub.open .sub { display:block; }
