:root { --site-header-height: calc(6.8rem + 1px); }
html { scroll-padding-top: calc(var(--site-header-height) + 12px); }
main [id] { scroll-margin-top: 8px; }
.skip-link { position: fixed; top: 8px; left: 12px; z-index: 10001; padding: 12px 18px; color: white; background: #32164d; transform: translateY(-160%); border: 2px solid #d6b1ff; border-radius: 8px; }
.skip-link:focus { transform: none; }
.site-header, .site-header * { box-sizing: border-box; }
/* Visual reference: b6c997d, before the home/navigation package.
   6.8rem logo, centered logo/nav group, 40px logo/link gap, 1.4rem link gap. */
.site-header { display: flex; flex-direction: row; position: sticky; top: 0; width: 100%; height: auto; min-height: calc(6.8rem + 1px); padding: 0 16px; gap: 40px; align-items: center; justify-content: center; z-index: 1000; text-shadow: none; }
.site-header .site-brand { display: flex; flex: 0 0 auto; align-items: center; border-radius: 8px; border: 0; padding: 0; background: transparent; }
.site-header #logo { display: block; width: 6.8rem; height: 6.8rem; max-width: none; margin: 0; object-fit: contain; }
.site-header #main-nav { display: block; position: static; width: auto; background: transparent; }
.site-header #main-nav[hidden] { display: none !important; }
.site-header #main-nav ul { display: flex; align-items: center; gap: 1.4rem !important; margin: 0; padding: 0; list-style: none; }
.site-header #main-nav a { display: flex; align-items: center; min-height: 44px; padding: 0; font-size: 1rem !important; font-weight: 400; line-height: normal; text-decoration: none; color: #fff; border: 0; background: transparent; }
.site-header #main-nav a[aria-current="page"] { color: #d6b1ff; text-decoration: underline; text-underline-offset: 7px; }
.site-header #main-nav li:hover { animation: none; transform: none; }
.site-header a:focus-visible, #menu-toggle:focus-visible { outline: 3px solid #bdeeff; outline-offset: 4px; }
#menu-toggle { display: none; width: auto; margin: 0; box-shadow: none; transform: none; }
#menu-toggle:hover { transform: none; box-shadow: none; }
#main-content { display: block; height: 0; width: 0; }
@media(max-width:1022px) {
 .site-header { padding: 0 16px 0 0; gap: 12px; justify-content: space-between; }
 .site-header.nav-ready #menu-toggle { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-width: 94px; min-height: 44px; padding: 8px 12px; border: 1px solid #746480; border-radius: 10px; background: #251432; color: white; font: inherit; font-size: .9rem; font-weight: 650; cursor: pointer; }
 .menu-icon, .menu-icon::before, .menu-icon::after { width: 18px; height: 2px; background: currentColor; display: block; position: relative; }
 .menu-icon::before, .menu-icon::after { content: ''; position: absolute; }
 .menu-icon::before { top: -6px; } .menu-icon::after { top: 6px; }
 #menu-toggle[aria-expanded="true"] .menu-icon { background: transparent; }
 #menu-toggle[aria-expanded="true"] .menu-icon::before { top: 0; transform: rotate(45deg); }
 #menu-toggle[aria-expanded="true"] .menu-icon::after { top: 0; transform: rotate(-45deg); }
 .site-header #main-nav { width: 100%; padding: 12px 20px 20px; background: #140b20 !important; border-bottom: 1px solid #49315e; }
 .site-header.nav-ready #main-nav { position: absolute; top: 100%; left: 0; max-height: calc(100dvh - var(--site-header-height)); overflow-y: auto; overscroll-behavior: contain; box-shadow: 0 14px 24px #0006; }
 .site-header #main-nav ul { display: grid; gap: 0 !important; }
 .site-header #main-nav a { min-height: 48px; padding: 10px 12px; border-radius: 8px; font-size: 1rem !important; }
 .site-header #main-nav a:hover { background: #281638; transform: none; }
 .site-header:not(.nav-ready) { position: relative; flex-wrap: wrap; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior: auto; } }