/* The homepage's fine, staggered dots, carried across the inner pages. */
.dotted-page {
  --wash-top: #d6dfd0;
  --wash-bottom: #e2e6cf;
  position: relative;
  isolation: isolate;
  min-height: 100svh;
}

.dotted-page::before {
  content: '';
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  opacity: .5;
  background: linear-gradient(155deg,
    color-mix(in srgb, var(--wash-top) 85%, #161616),
    color-mix(in srgb, var(--wash-bottom) 85%, #161616));
  -webkit-mask-image: radial-gradient(circle, #000 .75px, transparent 1.15px), radial-gradient(circle, #000 .75px, transparent 1.15px);
  mask-image: radial-gradient(circle, #000 .75px, transparent 1.15px), radial-gradient(circle, #000 .75px, transparent 1.15px);
  -webkit-mask-size: 4.5px 7.794px;
  mask-size: 4.5px 7.794px;
  -webkit-mask-position: 0 0, 2.25px 3.897px;
  mask-position: 0 0, 2.25px 3.897px;
  -webkit-mask-repeat: repeat;
  mask-repeat: repeat;
}