html:has(body.service-page) {
  height: 100%;
  overflow: hidden;
}

body.service-page {
  height: 100dvh;
  min-height: 100dvh;
  overflow: hidden;
}

.service-page-main {
  height: 100dvh;
  min-height: 100dvh;
  max-height: 100dvh;
  display: grid;
  place-items: center;
  overflow: hidden;
  padding: calc(var(--design-boundary-x, 24px) + var(--safe-area-top, 0px))
    calc(var(--design-boundary-x, 24px) + var(--safe-area-right, 0px))
    calc(var(--design-boundary-x, 24px) + var(--safe-area-bottom, 0px))
    calc(var(--design-boundary-x, 24px) + var(--safe-area-left, 0px));
}

.service-page-soon {
  display: grid;
  place-items: center;
  min-width: 6ch;
  min-height: 1.5em;
  color: var(--plaza-ink, #fff);
  font-size: clamp(1.1rem, 2vw, 1.5rem);
  line-height: 1.4;
  text-align: center;
  animation: none;
  transform: none;
  transition: none;
}