/* Shared header geometry. Type settings live in design-tokens.css. */
.site-header {
  position: sticky; top: 0; z-index: 100;
  display: flex; align-items: center; justify-content: space-between;
  height: 72px; min-height: 72px; padding: 0; gap: 24px;
  border: 0; background: var(--paper);
}
.site-header::before {
  content: ""; position: fixed; z-index: -1; top: 0; left: 0; right: 0;
  height: calc(var(--navigation-offset, 88px) - 16px);
  border: 0; background: var(--paper); pointer-events: none;
}
.site-header .brand {
  display: flex; align-items: center; flex: none;
  width: auto; height: 22px; overflow: visible; text-decoration: none;
}
.site-header .brand img { width: var(--brand-width); height: auto; object-fit: contain; }
.site-header nav { display: flex; align-items: center; gap: 36px; }
.site-header nav a {
  display: inline-flex; align-items: center; min-height: 44px;
  padding: 12px 0; text-decoration: none;
}
.site-header nav a[aria-current="location"] { color: var(--accent); }
.site-header nav a::after { display: none; }
.pipeline-page .wrap { max-width: 1440px; }
html { scroll-padding-top: var(--navigation-offset, 88px); }
@media (min-width: 1450px) { .pipeline-page .wrap { padding: 0 76px; } }
@media (max-width: 640px) {
  .site-header { height: auto; min-height: 68px; flex-wrap: wrap; gap: 0; padding: 14px 0 8px; }
  .site-header .brand { height: 19px; }
  .site-header nav { width: 100%; justify-content: space-between; gap: 10px; }
  .site-header nav a { min-height: 44px; }
}
@media (max-width: 360px) { .site-header nav a { min-height: 48px; } }