/* Full-page placeholder shown while the initial document and header are being rendered. */
html.landmark-page-loading,
html.landmark-page-loading body {
  background: #f6f8fb;
}

html.landmark-page-loading body {
  overflow: hidden;
}

html.landmark-page-loading body::before,
html.landmark-page-loading body::after {
  content: "";
  inset: 0;
  pointer-events: all;
  position: fixed;
  z-index: 2147483647;
}

html.landmark-page-loading body::before {
  background:
    linear-gradient(90deg, #eef1f5 25%, #f8f9fb 37%, #eef1f5 63%) 0 0 / 100% 34px no-repeat,
    linear-gradient(90deg, #e7ebf0 25%, #f6f8fa 37%, #e7ebf0 63%) 50% 62px / min(88vw, 1120px) 74px no-repeat,
    linear-gradient(90deg, #e7ebf0 25%, #f6f8fa 37%, #e7ebf0 63%) 50% 154px / min(88vw, 1120px) min(42vh, 410px) no-repeat,
    linear-gradient(90deg, #eef1f5 25%, #f8f9fb 37%, #eef1f5 63%) 12% calc(min(42vh, 410px) + 185px) / min(35vw, 360px) 22px no-repeat,
    linear-gradient(90deg, #eef1f5 25%, #f8f9fb 37%, #eef1f5 63%) 12% calc(min(42vh, 410px) + 218px) / min(56vw, 650px) 14px no-repeat,
    linear-gradient(90deg, #eef1f5 25%, #f8f9fb 37%, #eef1f5 63%) 50% calc(min(42vh, 410px) + 265px) / min(88vw, 1120px) 220px no-repeat,
    #f6f8fb;
  animation: landmarkPageSkeletonPulse 1.2s ease-in-out infinite;
  background-size: 400% 34px, 400% 74px, 400% min(42vh, 410px), 400% 22px, 400% 14px, 400% 220px, auto;
}

html.landmark-page-loading body::after {
  border-bottom: 1px solid #e4e8ee;
  border-top: 1px solid #e4e8ee;
  height: 34px;
}

@keyframes landmarkPageSkeletonPulse {
  0% { background-position-x: 100%, 100%, 100%, 100%, 100%, 100%; }
  100% { background-position-x: -100%, -100%, -100%, -100%, -100%, -100%; }
}

@media (prefers-reduced-motion: reduce) {
  html.landmark-page-loading body::before {
    animation: none;
  }
}
