/* Homepage hierarchy, anchor and rendering refinements. */
html {
  scroll-padding-top: clamp(5.5rem, 9vw, 8.25rem);
}

body {
  overflow-x: clip;
}

main > section[id] {
  scroll-margin-top: clamp(5.5rem, 9vw, 8.25rem);
}

/* Keep lower sections inexpensive until they approach the viewport. */
main > section:not(.hero):not(.story):not(.menu-showcase) {
  content-visibility: auto;
  contain-intrinsic-size: auto 900px;
}

.story {
  isolation: isolate;
}

.story .section-heading h2,
.menu-heading h2 {
  overflow-wrap: anywhere;
}

@media (max-width: 760px) {
  html {
    scroll-padding-top: 5.25rem;
  }

  main > section[id] {
    scroll-margin-top: 5.25rem;
  }

  .story .section-heading h2,
  .menu-heading h2 {
    max-width: 100%;
    line-height: 0.98;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
}