:root {
  --header-height:105px;
  --header-space:105px
}
html {
  scroll-padding-top:calc(var(--header-height) + 12px)
}
body {
  padding-top:var(--header-space)
}
.site-header {
  position:fixed;
  inset:0 0 auto;
  width:100%;
  height:var(--header-height);
  transition:box-shadow .2s
}
.header-scrolled .site-header {
  box-shadow:0 5px 20px #37312f0d
}
.site-navigation {
  position:fixed;
  top:var(--header-height);
  max-height:calc(100vh - var(--header-height) - 12px);
  max-height:calc(100dvh - var(--header-height) - 12px);
  overflow-y:auto;
  overscroll-behavior:contain
}
.instagram-dropdown {
  max-height:calc(100vh - var(--header-height) - 24px);
  max-height:calc(100dvh - var(--header-height) - 24px);
  overflow-y:auto;
  overscroll-behavior:contain
}
.story-heading {
  top:calc(var(--header-height) + 12px)
}
.anchor,#reserve {
  scroll-margin-top:0
}
.anchor[tabindex="-1"]:focus,#reserve[tabindex="-1"]:focus {
  outline:none
}
@media(max-width:805px) {
  :root {
    --header-height:94px;
    --header-space:94px
  }
}
@media(max-width:640px) {
  :root {
    --header-height:152px;
    --header-space:152px
  }
  .site-header {
    grid-template-rows:49px 68px
  }
  :root.header-compact {
    --header-height:120px
  }
  .header-compact .site-header {
    padding:6px 18px;
    grid-template-rows:43px 60px;
    gap:4px 20px
  }
  .header-compact .brand img {
    width:72px
  }
  .header-compact .header-booking {
    height:60px;
    padding-top:4px;
    gap:3px
  }
  .header-compact .header-booking-links a {
    gap:3px
  }
  .header-compact .header-booking-links img {
    height:18px
  }
  .site-navigation {
    padding:18px 24px
  }
}
@media(prefers-reduced-motion:reduce) {
  .site-header {
    transition:none
  }
}
