html {
  width: 100%;
  overflow-x: clip;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  width: 100%;
  max-width: 100%;
  overflow-x: clip;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

.site-header,
.site-header-overlay,
main,
footer {
  width: 100%;
  max-width: 100%;
}

@supports not (overflow: clip) {
  html,
  body {
    overflow-x: hidden;
  }
}

@media (max-width: 700px) {
  .site-header,
  .site-header-overlay {
    min-width: 0;
  }

  .mobile-menu {
    margin-top: -22px;
    transform: none;
  }

  .mobile-menu nav {
    position: fixed;
    z-index: 1000;
    top: calc(78px + env(safe-area-inset-top, 0px));
    left: 12px;
    right: 12px;
    width: auto;
    max-width: none;
    max-height: calc(100dvh - 90px - env(safe-area-inset-top, 0px));
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
  }

  .mobile-menu nav a {
    min-width: 0;
    overflow-wrap: anywhere;
  }

  h1,
  h2,
  h3,
  p,
  a {
    max-width: 100%;
  }
}