@charset "UTF-8";
/* ─────────────────────────────────────────────────────────────
 * CSS Utilities
 * Helper classes
 * ───────────────────────────────────────────────────────────── */
/* ─────────────────────────────────────────────────────────────
 * Mixins & Functions
 * Usage in any partial: @use '../mixins' as *; (or 'mixins' from root)
 * ───────────────────────────────────────────────────────────── */
/* ─────────────────────────────────────────────────────────────
 * Breakpoints (px)
 * Keep in sync with JS defaults (dynamicAdapt / spollers use 767/768)
 * ───────────────────────────────────────────────────────────── */
/* ─────────────────────────────────────────────────────────────
 * Functions
 * ───────────────────────────────────────────────────────────── */
/* Visually hidden, still read by screen readers */
.visually-hidden,
.sr-only {
  position: absolute;
  width: 0.0625rem;
  height: 0.0625rem;
  padding: 0;
  margin: -0.0625rem;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

/* Image background container */
.ibg {
  position: relative;
  overflow: hidden;
}

.ibg img {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  object-fit: cover;
}

/* Image container with aspect ratio */
.ibg--ratio {
  position: relative;
  aspect-ratio: var(--aspect-ratio, 16/9);
}

.ibg--ratio img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Readable text width */
.prose {
  max-inline-size: 75ch;
}

/* ─────────────────────────────────────────────────────────────
 * Print Styles
 * ───────────────────────────────────────────────────────────── */
@media print {
  .btn,
  .link-btn,
  .quiz__nav {
    /* stylelint-disable-next-line declaration-no-important -- intentional override */
    display: none !important;
  }
  body {
    color: #000;
    background: #fff;
  }
  a[href^=http]::after {
    content: " (" attr(href) ")";
    font-size: 0.875em;
    font-weight: normal;
  }
  img {
    /* stylelint-disable-next-line declaration-no-important -- intentional override */
    max-width: 100% !important;
    break-inside: avoid;
  }
  h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
    break-after: avoid;
  }
  p,
  li {
    orphans: 3;
    widows: 3;
  }
  .wrapper {
    display: block;
  }
}