
.site-header{
  gap:14px;
}
.nav-burger{
  flex:0 0 auto;
  width:34px;
  height:34px;
  border-radius:8px;
  border:none;
  background:transparent;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  padding:0;
  transition:background .15s;
}
.nav-burger:hover{
  background:rgba(255,255,255,.08);
}
.nav-burger:focus-visible{
  outline:2px solid var(--color-amber);
  outline-offset:2px;
}
.nav-burger__bars{
  position:relative;
  width:18px;
  height:13px;
}
.nav-burger__bars span{
  position:absolute;
  left:0;
  width:100%;
  height:2px;
  border-radius:2px;
  background:var(--color-sand);
  transition:transform .2s ease, opacity .15s ease, top .2s ease;
}
.nav-burger__bars span:nth-child(1){ top:0; }
.nav-burger__bars span:nth-child(2){ top:5.5px; }
.nav-burger__bars span:nth-child(3){ top:11px; }

body.nav-open .nav-burger__bars span:nth-child(1){
  top:5.5px; transform:rotate(45deg);
}
body.nav-open .nav-burger__bars span:nth-child(2){
  opacity:0;
}
body.nav-open .nav-burger__bars span:nth-child(3){
  top:5.5px; transform:rotate(-45deg);
}

.site-logo{
  display:inline-flex;
  align-items:center;
  gap:0;
  height:34px;
  border-radius:8px;
  overflow:hidden;
  text-decoration:none;
  flex:0 0 auto;
}
.site-logo__mark{
  flex:0 0 auto;
  width:34px;
  height:34px;
  border-radius:8px;
  background:linear-gradient(135deg, var(--color-amber-soft) 0%, var(--color-amber) 55%, var(--color-amber-dark) 100%);
  color:#1a1208;
  font-family:'Neucha',cursive;
  font-size:16px;
  font-weight:700;
  display:flex;
  align-items:center;
  justify-content:center;
  letter-spacing:.5px;
  transition:box-shadow .25s ease;
}
.site-logo:hover .site-logo__mark,
.site-logo:focus-visible .site-logo__mark{
  box-shadow:0 0 0 3px rgba(224,161,63,.35);
}
.site-logo__full{
  display:inline-flex;
  overflow:hidden;
  max-width:0;
  opacity:0;
  white-space:nowrap;
  font-family:'Neucha',cursive;
  font-size:20px;
  color:var(--color-sand);
  letter-spacing:1px;
  transition:max-width .45s cubic-bezier(.4,0,.2,1), opacity .3s ease .05s, padding-left .45s ease;
  padding-left:0;
}
.site-logo:hover .site-logo__full,
.site-logo:focus-visible .site-logo__full{
  max-width:220px;
  opacity:1;
  padding-left:10px;
}
.site-logo__full em{
  font-style:normal;
  color:var(--color-amber-soft);
  margin-left:5px;
}
@media (prefers-reduced-motion: reduce){
  .site-logo__full{ transition:opacity .15s ease; }
}

.nav-overlay{
  position:fixed;
  inset:0;
  background:rgba(20,14,6,.5);
  opacity:0;
  pointer-events:none;
  transition:opacity .25s ease;
  z-index:998;
}
body.nav-open .nav-overlay{
  opacity:1;
  pointer-events:auto;
}

.nav-drawer{
  position:fixed;
  top:0;
  left:0;
  bottom:0;
  width:300px;
  max-width:85vw;
  background:var(--color-paper);
  border-right:1px solid var(--color-line);
  box-shadow:8px 0 30px rgba(0,0,0,.25);
  transform:translateX(-100%);
  transition:transform .3s cubic-bezier(.4,0,.2,1);
  z-index:999;
  display:flex;
  flex-direction:column;
  overflow-y:auto;
}
body.nav-open .nav-drawer{
  transform:translateX(0);
}
@media (prefers-reduced-motion: reduce){
  .nav-drawer{ transition:none; }
  .nav-overlay{ transition:none; }
}

.nav-drawer__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:18px 20px;
  background:#1a1a1a;
  border-bottom:2px solid var(--color-amber);
}
.nav-drawer__title{
  font-family:'Neucha',cursive;
  font-size:24px;
  color:var(--color-sand);
  letter-spacing:.5px;
}
.nav-drawer__title em{
  font-style:normal;
  color:var(--color-amber-soft);
}
.nav-drawer__close{
  background:none;
  border:none;
  color:#bba88a;
  font-size:22px;
  line-height:1;
  cursor:pointer;
  padding:4px 6px;
  border-radius:6px;
  transition:background .15s, color .15s;
}
.nav-drawer__close:hover{
  background:rgba(255,255,255,.08);
  color:var(--color-amber-soft);
}

.nav-drawer__body{
  padding:10px 10px 20px;
  flex:1 1 auto;
}
.nav-drawer__section-label{
  font-size:10.5px;
  font-weight:700;
  letter-spacing:1.4px;
  text-transform:uppercase;
  color:#8a7757;
  padding:14px 12px 6px;
}
.nav-drawer__section-label:first-child{ padding-top:8px; }

.nav-link{
  display:flex;
  align-items:center;
  gap:12px;
  padding:11px 12px;
  border-radius:10px;
  color:var(--color-dark);
  font-size:14.5px;
  font-weight:600;
  transition:background .15s, transform .1s;
  position:relative;
}
.nav-link:hover{
  background:var(--color-sand);
  text-decoration:none;
  transform:translateX(2px);
}
.nav-link:focus-visible{
  outline:2px solid var(--color-amber-dark);
  outline-offset:-2px;
}
.nav-link__icon{
  flex:0 0 auto;
  width:22px;
  height:22px;
  display:flex;
  align-items:center;
  justify-content:center;
}
.nav-link__icon img{
  width:18px;
  height:18px;

  filter:brightness(0) saturate(100%) invert(41%) sepia(84%) saturate(1067%) hue-rotate(2deg) brightness(94%) contrast(93%);
  transition:filter .15s ease;
}
.nav-link--disabled .nav-link__icon img{
  filter:brightness(0) saturate(0%) invert(70%);
  opacity:.7;
}
.nav-link__label{ flex:1 1 auto; }

.nav-link--disabled{
  color:#a89a7d;
  cursor:not-allowed;
  opacity:.65;
}
.nav-link--disabled:hover{
  background:none;
  transform:none;
}
.nav-link__badge{
  font-size:9.5px;
  font-weight:700;
  letter-spacing:.4px;
  text-transform:uppercase;
  background:var(--color-sand-dark);
  color:#6b5a45;
  padding:2px 7px;
  border-radius:8px;
  flex:0 0 auto;
}

@keyframes navHighlightPulse{
  0%, 100%{ box-shadow:0 0 0 0 rgba(184,114,12,.35); }
  50%{ box-shadow:0 0 0 6px rgba(184,114,12,0); }
}
.nav-link.is-tour-highlight{
  background:var(--color-sand);
  outline:2px solid var(--color-amber);
  outline-offset:-2px;
  animation:navHighlightPulse 1.4s ease-in-out infinite;
}

.nav-drawer__foot{
  padding:14px 20px 18px;
  border-top:1px dashed var(--color-line);
  font-size:11.5px;
  color:#8a7757;
  font-style:italic;
}
