/* ==========================================================================
   IMS Services — utilities
   Narrow, single-purpose. Anything that grows a second responsibility should
   move to components.css instead.
   ========================================================================== */

.ims-sr-only {
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

/* Visible again on focus, for skip links and in-page shortcuts. */
.ims-sr-only--focusable:focus,
.ims-sr-only--focusable:focus-visible {
  position: static !important;
  width: auto; height: auto;
  margin: 0; overflow: visible;
  clip: auto; clip-path: none;
  white-space: normal;
}

.ims-text-centre { text-align: center; }
.ims-text-mid    { color: var(--ims-text-mid); }
.ims-mono        { font-family: var(--ims-font-mono); }
.ims-lead        { font-size: var(--ims-fs-lead); line-height: var(--ims-lh-normal); }
.ims-measure     { max-width: 58ch; }
.ims-measure-tight { max-width: 46ch; }

.ims-mt-0 { margin-top: 0; }
.ims-mb-0 { margin-bottom: 0; }
.ims-mt-4 { margin-top: var(--ims-sp-4); }
.ims-mt-6 { margin-top: var(--ims-sp-6); }
.ims-mt-8 { margin-top: var(--ims-sp-8); }

.ims-hide { display: none; }

@media (max-width: 47.9375rem) {
  .ims-hide\@sm { display: none; }
}

@media (min-width: 48rem) {
  .ims-show\@sm-only { display: none; }
}

/* Locks page scroll while the mobile nav is open. */
.ims-no-scroll { overflow: hidden; }

/* Aspect ratio helpers for media blocks. */
.ims-ratio-16-10 { aspect-ratio: 16 / 10; object-fit: cover; width: 100%; }
.ims-ratio-3-2   { aspect-ratio: 3 / 2;   object-fit: cover; width: 100%; }

/* Wide content must scroll inside its own box, never the page body. */
.ims-scroll-x {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}