.site-header { container: site-header / inline-size; position: relative; z-index: 5; display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 1rem; padding-block: 1.5rem; border-bottom: 1px solid var(--color-rule); }
.site-header .brand { width: clamp(15rem,20vw,18rem); max-width: 100%; align-self: center; }
.site-header .brand__logo { width: 100%; }
.site-header .brand__tagline { overflow-wrap: anywhere; }
.site-nav { grid-column: 1 / -1; min-width: 0; }
.site-nav[hidden],.site-menu-toggle[hidden] { display: none; }
.site-nav ul { display: flex; flex-direction: column; list-style: none; padding: 0; margin: 0; }
.site-nav li { min-width: 0; }
.site-nav a,.site-nav__current { display: flex; align-items: center; justify-content: space-between; gap: .75rem; padding: .875rem 1rem; min-height: 3rem; font-size: .875rem; line-height: 1.4; color: var(--color-ink); text-decoration: none; border-bottom: 1px solid #e4edf9; overflow-wrap: anywhere; }
.site-nav a:hover { color: var(--color-accent); background: #f5f9ff; }
.site-nav__current { color: var(--color-accent); background: #edf5ff; border-left: .1875rem solid var(--color-accent); padding-left: .8125rem; }
.site-nav__current small { color: #657085; font-size: .625rem; white-space: nowrap; }
.site-menu-toggle { display: grid; place-items: center; width: 2.75rem; height: 2.75rem; padding: .625rem; border: 1px solid #cddbf1; border-radius: .375rem; color: var(--color-ink); background: #ffffffee; cursor: pointer; }
.site-menu-toggle svg { width: 1.375rem; height: 1.375rem; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; }
.site-menu-toggle .menu-close { display: none; }
.site-menu-toggle[aria-expanded="true"] .menu-bars { display: none; }
.site-menu-toggle[aria-expanded="true"] .menu-close { display: block; }
.site-menu-toggle:focus-visible,.site-nav a:focus-visible { outline: 2px solid var(--color-accent); outline-offset: .25rem; }
.site-header--home { padding-top: 0; border-bottom: 0; }
.site-header--home::before { content: ''; position: absolute; z-index: -1; inset: -2.5rem calc(-1 * var(--gutter)) -.25rem; background: linear-gradient(#fffffff2 65%,#ffffffd9 88%,#ffffff00); pointer-events: none; }
.site-header--home .site-nav { background: #fff; border: 1px solid #e4edf9; border-radius: .375rem; }
.landing .scene { top: var(--site-menu-offset,0px); }
@container site-header (min-width: 70rem) {
  .site-menu-toggle { display: none; }
  .site-nav { grid-column: 2; grid-row: 1; justify-self: end; }
  .site-nav ul { flex-direction: row; align-items: center; gap: clamp(.5rem,1.2vw,1.5rem); }
  .site-nav a,.site-nav__current { padding: .75rem 0; min-height: 2.75rem; border-bottom: 2px solid transparent; font-size: .8125rem; white-space: nowrap; overflow-wrap: normal; }
  .site-nav a:hover { background: transparent; }
  .site-nav__current { background: transparent; border-left: 0; border-bottom-color: var(--color-accent); }
  .site-nav__current small { display: none; }
  .site-header--home { padding-top: 0; }
  .site-header--home .site-nav { background: transparent; border: 0; border-radius: 0; }
}
@media (forced-colors: active) { .site-menu-toggle,.site-nav__current { border: 1px solid CanvasText; } }
