:root {
  --header-height: 95px;
}

html {
  scroll-padding-top: calc(var(--header-height) + 12px);
}

body {
  padding-top: var(--header-height);
}

.site-header {
  position: fixed;
  inset: 0 0 auto;
  width: 100%;
  z-index: 1000;
  background: var(--bg);
}

.mobile-nav {
  max-height: calc(100dvh - var(--header-height));
  overflow-y: auto;
  overscroll-behavior: contain;
  background: var(--bg);
}

body.mobile-menu-open {
  overflow: hidden;
}

@media (max-width: 850px) {
  :root {
    --header-height: 83px;
  }
}

@media (max-width: 600px) {
  :root {
    --header-height: 78px;
  }
}