:root {
   --novy-nav-primary: var(--primary, var(--primary-color, #2f5d50));
   --novy-nav-text: var(--text, var(--text-color, #222));
   --novy-nav-muted: var(--muted, var(--muted-color, #666));
   --novy-nav-line: var(--line, var(--border-color, #e5e8e7));
   --novy-nav-surface: var(--surface, var(--surface-color, #fff));
}

[data-site-navigation] { display: block; }

.novy-nav-fallback {
   display: block;
   padding: .75rem 1rem;
   color: var(--novy-nav-primary);
   background: var(--novy-nav-surface);
   font-weight: 700;
   text-align: center;
}

.novy-header {
   min-height: 72px;
   display: flex;
   align-items: center;
   gap: 1rem;
   padding: .8rem clamp(1rem, 3vw, 2rem);
   background: var(--novy-nav-surface);
   border-bottom: 1px solid var(--novy-nav-line);
   position: relative;
   z-index: 20;
}

.novy-header__brand {
   min-width: 0;
   display: flex;
   align-items: center;
   gap: .75rem;
   color: inherit;
   text-decoration: none;
}

.novy-header__mark {
   width: 40px;
   height: 40px;
   flex: 0 0 40px;
   display: grid;
   place-items: center;
   border-radius: 50%;
   color: var(--novy-nav-primary);
   background: color-mix(in srgb, var(--novy-nav-primary) 12%, #f0c36a 35%);
}

.novy-header__copy strong,
.novy-header__copy span { display: block; }
.novy-header__copy strong { color: var(--novy-nav-primary); font-size: 1.3rem; line-height: 1.15; }
.novy-header__copy span { margin-top: .15rem; color: var(--novy-nav-muted); font-size: .84rem; }

.novy-nav__toggle,
.novy-nav__close {
   width: 48px;
   height: 48px;
   flex: 0 0 48px;
   display: grid;
   place-items: center;
   border: 0;
   border-radius: 14px;
   color: var(--novy-nav-primary);
   background: color-mix(in srgb, var(--novy-nav-primary) 9%, transparent);
   font: inherit;
   font-size: 1.55rem;
   cursor: pointer;
}

.novy-nav__toggle:hover,
.novy-nav__close:hover,
.novy-nav__link:hover { background: color-mix(in srgb, var(--novy-nav-primary) 12%, transparent); }

.novy-nav__toggle:focus-visible,
.novy-nav__close:focus-visible,
.novy-nav__link:focus-visible,
.novy-header__brand:focus-visible {
   outline: 3px solid color-mix(in srgb, var(--novy-nav-primary) 35%, transparent);
   outline-offset: 3px;
}

.novy-nav__overlay {
   position: fixed;
   inset: 0;
   z-index: 900;
   visibility: hidden;
   opacity: 0;
   background: rgba(20, 28, 26, .48);
   transition: opacity .22s ease, visibility .22s ease;
}

.novy-nav__panel {
   position: fixed;
   inset: 0 auto 0 0;
   z-index: 910;
   width: min(340px, 88vw);
   max-height: 100dvh;
   overflow-y: auto;
   overscroll-behavior: contain;
   color: var(--novy-nav-text);
   background: var(--novy-nav-surface);
   box-shadow: 12px 0 35px rgba(0, 0, 0, .2);
   transform: translateX(-105%);
   transition: transform .23s ease;
}

.novy-nav__overlay.is-open { visibility: visible; opacity: 1; }
.novy-nav__panel.is-open { transform: translateX(0); }

.novy-nav__head {
   position: sticky;
   top: 0;
   z-index: 2;
   display: flex;
   align-items: center;
   justify-content: space-between;
   padding: 1rem;
   color: var(--novy-nav-primary);
   background: var(--novy-nav-surface);
   border-bottom: 1px solid var(--novy-nav-line);
}

.novy-nav__links { display: block; padding: .75rem 1rem 1.5rem; }
.novy-nav__group + .novy-nav__group { margin-top: 1rem; }
.novy-nav__group-title {
   margin: 0 .65rem .45rem;
   color: var(--novy-nav-muted);
   font-size: .76rem;
   font-weight: 800;
   letter-spacing: .09em;
   text-transform: uppercase;
}

.novy-nav__link,
.novy-nav__disabled {
   display: block;
   width: 100%;
   min-height: 46px;
   padding: .78rem 1rem;
   border-radius: 12px;
   font-weight: 750;
   text-decoration: none;
}

.novy-nav__link { color: var(--novy-nav-text); }
.novy-nav__link[aria-current="page"] {
   color: var(--novy-nav-primary);
   background: color-mix(in srgb, var(--novy-nav-primary) 12%, transparent);
   box-shadow: inset 3px 0 0 var(--novy-nav-primary);
}
.novy-nav__disabled { color: #888; background: #f3f3f3; cursor: not-allowed; }

body.novy-nav-open { overflow: hidden; }

@media (max-width: 600px) {
   .novy-header { gap: .75rem; }
   .novy-header__copy strong { font-size: 1.12rem; }
   .novy-header__copy span { font-size: .76rem; }
}

@media (prefers-reduced-motion: reduce) {
   .novy-nav__overlay,
   .novy-nav__panel { transition-duration: .01ms; }
}