/* ==========================================================================
   UTILITIES
   Single-purpose helpers. Nothing here is a component.
   ========================================================================== */

.u-container {
  width: 100%;
  max-width: var(--container);
  margin-inline: auto;
  padding-inline: var(--gutter);
}

.u-container--wide { max-width: var(--container-wide); }

.u-measure { max-width: var(--measure); }

.u-visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}

.u-nowrap { white-space: nowrap; }

/* Below-the-fold sections skip layout and paint until they are near the
   viewport. The contain-intrinsic-size keeps the scrollbar honest. */
.u-defer {
  content-visibility: auto;
  contain-intrinsic-size: auto 1200px;
}