/* Native fragment navigation uses the stable shell height, including before JS runs.
   Keeping the expanded height also clears the surface during compact transitions. */
html { scroll-behavior: smooth; --mr-header-space: 4rem; }
html:has(#wpadminbar) { --mr-header-offset: 32px; }
@media (max-width: 48.875rem) { html:has(#wpadminbar) { --mr-header-offset: 46px; } }
@media (min-width: 56.25rem) { html { --mr-header-space: 6.5rem; } }
/* The sticky shell keeps its original document height while its surface compacts. */
.mr-site-header { --mr-header-height: 4rem; --mr-header-padding: .625rem; position: relative; background: var(--mr-color-background); color: var(--mr-color-white); }
html:has(.mr-site-header[data-sticky-ready]) { scrollbar-gutter: stable; }
:where(main, main [id]) { scroll-margin-block-start: calc(var(--mr-header-offset, 0px) + var(--mr-header-space, 4rem) + 1rem); }
.mr-site-header[data-sticky-ready] { position: sticky; inset-block-start: var(--mr-header-offset, 0px); z-index: var(--mr-layer-header); block-size: var(--mr-header-height); background: transparent; pointer-events: none; }
.mr-site-header.is-compact { --mr-header-padding: .375rem; }
.mr-site-header[data-sticky-ready] .mr-header-inner { inline-size: 100%; padding-inline: max(var(--mr-gutter), calc((100% - var(--mr-container)) / 2)); }
.mr-header-inner { background: var(--mr-color-background); padding-block: var(--mr-header-padding); transition: padding-block var(--mr-transition); pointer-events: auto; }
html.mr-navigation-open { overflow: hidden; }
.mr-site-header::after { content: ''; position: absolute; inset-block-start: calc(var(--mr-touch-target) + 2 * var(--mr-header-padding) - 1px); transition: inset-block-start var(--mr-transition); inset-inline: 0; border-block-end: 1px solid var(--mr-color-border); pointer-events: none; }
.mr-header-inner { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-rows: var(--mr-touch-target) auto; align-items: center; }
.mr-brand { display: flex; align-items: center; min-inline-size: 0; min-block-size: var(--mr-touch-target); font-family: var(--mr-font-heading); }
.mr-brand a { display: inline-flex; align-items: center; min-block-size: var(--mr-touch-target); text-decoration: none; }
.mr-brand .custom-logo { --mr-header-logo-width: 8.125rem; display: block; inline-size: var(--mr-header-logo-width); block-size: auto; max-block-size: calc(var(--mr-touch-target) + 2 * var(--mr-header-padding) - 20px); transition: inline-size var(--mr-transition), max-block-size var(--mr-transition); }
.mr-site-header.is-compact .mr-brand .custom-logo { inline-size: calc(var(--mr-header-logo-width) * .8); }
.mr-menu-toggle { display: none; border: 0; background: transparent; color: inherit; padding: 0; inline-size: var(--mr-touch-target); block-size: var(--mr-touch-target); cursor: pointer; font-family: var(--mr-font-heading); }
.mr-primary-navigation { grid-column: 1 / -1; padding-block: var(--mr-space-6) var(--mr-space-10); }
.mr-primary-navigation .mr-menu { flex-direction: column; align-items: stretch; gap: var(--mr-space-2); }
.mr-primary-navigation .mr-menu a { display: flex; min-block-size: var(--mr-space-14); font-size: 1.25rem; line-height: 1.2; font-weight: var(--mr-weight-medium); text-decoration: none; }
.mr-primary-navigation a:focus-visible, .mr-primary-navigation a[aria-current] { color: var(--mr-color-accent); }
.mr-header-inner[data-navigation-ready] .mr-menu-toggle { display: inline-flex; align-items: center; justify-content: center; }
.mr-primary-navigation[hidden], .mr-menu-toggle [hidden] { display: none; }
.mr-header-inner[data-navigation-ready] .mr-primary-navigation:not([hidden]) { min-block-size: calc(100svh - var(--mr-touch-target) - 2 * var(--mr-header-padding) - var(--mr-header-offset, 0px)); max-block-size: calc(100dvh - var(--mr-touch-target) - 2 * var(--mr-header-padding) - var(--mr-header-offset, 0px)); overflow-y: auto; overscroll-behavior: contain; align-content: start; position: relative; z-index: var(--mr-layer-menu); }
/* Six approved labels and a 200px logo fit comfortably at 900px, including gutters. */
@media (min-width: 56.25rem) {
  .mr-site-header { --mr-header-height: 6.5rem; --mr-header-padding: 1.875rem; }
  .mr-site-header.is-compact { --mr-header-padding: 1.125rem; }
  .mr-header-inner { grid-template-rows: var(--mr-touch-target); gap: var(--mr-space-8); }
  .mr-brand .custom-logo { --mr-header-logo-width: 12.5rem; }
  .mr-header-inner[data-navigation-ready] .mr-menu-toggle { display: none; }
  .mr-header-inner .mr-primary-navigation, .mr-header-inner[data-navigation-ready] .mr-primary-navigation:not([hidden]) { grid-column: auto; min-block-size: 0; padding: 0; }
  .mr-primary-navigation .mr-menu { flex-direction: row; gap: 1.5625rem; }
  .mr-primary-navigation .mr-menu a { min-block-size: var(--mr-touch-target); font-size: 1rem; white-space: nowrap; }
}

.mr-primary-navigation a { transition: color var(--mr-transition); }
@media (hover: hover) and (pointer: fine) {
  .mr-primary-navigation a:hover { color: var(--mr-color-accent); }
}

.mr-menu-toggle-icon { position: relative; display: block; inline-size: 26px; block-size: 20px; }
.mr-menu-toggle-icon span { position: absolute; inset-inline: 0; inset-block-start: 9px; block-size: 2px; background: var(--mr-color-white); transition: transform var(--mr-transition), opacity var(--mr-transition); }
.mr-menu-toggle-icon span:first-child { transform: translateY(-8px); }
.mr-menu-toggle-icon span:last-child { transform: translateY(8px); }
.mr-menu-toggle[aria-expanded="true"] .mr-menu-toggle-icon span:first-child { transform: rotate(45deg); }
.mr-menu-toggle[aria-expanded="true"] .mr-menu-toggle-icon span:nth-child(2) { opacity: 0; }
.mr-menu-toggle[aria-expanded="true"] .mr-menu-toggle-icon span:last-child { transform: rotate(-45deg); }