.site-header { position: fixed; inset: 0 0 auto; z-index: 50; color: white; background: transparent; transition: background var(--transition-medium); }
.site-header.over-light-section { background: #000000e6; backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); }
.header-inner { display: flex; align-items: center; justify-content: space-between; gap: 35px; min-height: var(--nav-height); border-bottom: 1px solid #ffffff2b; }
.wordmark { display: flex; flex: 0 0 auto; flex-direction: column; align-items: center; line-height: 1; padding-block: 8px; }
.wordmark-name { font-family: var(--serif-font-family); font-size: 34px; letter-spacing: .13em; padding-left: .13em; }
.wordmark-caption { font-size: 10px; letter-spacing: .35em; margin-top: 12px; padding-left: .35em; text-transform: uppercase; }
.navbar-brand { flex-shrink: 1; min-width: 0; }
.navbar-logo { width: 230px; height: auto; }
.site-nav { display: flex; align-items: center; gap: clamp(24px, 2.6vw, 44px); }
.site-nav > a:not(.btn) { position: relative; padding-block: 12px; font-size: 14px; color: #f1f0e8; }
.site-nav > a:not(.btn)::after { content: ""; position: absolute; bottom: 5px; left: 0; width: 100%; height: 1px; background: var(--color-primary); transform: scaleX(0); transform-origin: left; transition: transform var(--transition-medium); }
.site-nav > a:hover::after { transform: scaleX(1); }
.menu-toggle { display: none; align-items: center; gap: 12px; min-height: 44px; border: 0; background: transparent; color: inherit; font-size: 14px; }
.menu-icon { width: 24px; display: grid; gap: 6px; }
.menu-icon span { height: 1px; background: currentColor; transition: transform var(--transition-fast); }
.menu-toggle[aria-expanded="true"] .menu-icon span:first-child { transform: translateY(3.5px) rotate(45deg); }
.menu-toggle[aria-expanded="true"] .menu-icon span:last-child { transform: translateY(-3.5px) rotate(-45deg); }
@media (max-width: 1000px) {
    :root { --nav-height: 96px; }
    .navbar-logo { width: 190px; }
    .site-nav { gap: 20px; }
    .site-nav > a:not(.btn) { font-size: 13px; }
    .wordmark-name { font-size: 29px; }
}
@media (max-width: 800px) {
    :root { --nav-height: 88px; }
    .navbar-logo { width: 170px; }
    .menu-toggle { display: inline-flex; }
    .site-nav { display: none; position: absolute; top: 100%; left: 0; width: 100%; padding: 24px var(--page-gutter) 34px; background: #171c1bf7; border-bottom: 1px solid #ffffff29; box-shadow: 0 20px 35px #0003; }
    .site-nav.is-open { display: flex; flex-direction: column; align-items: stretch; gap: 14px; }
    .site-nav > a:not(.btn) { font-size: 16px; }
    .site-nav > .btn { margin-top: 10px; }
    .wordmark-name { font-size: 27px; }
    .wordmark-caption { font-size: 9px; margin-top: 9px; }
}