/* Static-mirror fixes: Squarespace's ImageLoader JS is not present, so reveal
   every lazy image and recreate the banner "content-fill" cropping in pure CSS. */

img,
img.thumb-image,
.sqs-image img,
figure img,
.summary-thumbnail img,
.gallery-thumbnail img {
  opacity: 1 !important;
  filter: none !important;
}

.loading {
  opacity: 1 !important;
}

/* Banner / section background images that use figure.content-fill */
.content-fill,
.banner-thumbnail-wrapper .content-fill,
figure#thumbnail.content-fill {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.content-fill img,
figure#thumbnail img {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  width: 100% !important;
  height: 100% !important;
  transform: translate(-50%, -50%) !important;
  object-fit: cover !important;
  object-position: center center !important;
  opacity: 1 !important;
}

/* Image blocks: Squarespace reserves an intrinsic-ratio box (inline
   padding-bottom on the container) and fills it with an absolutely
   positioned image. Recreate that fill so there's no empty gap. */
.sqs-image-shape-container-element.has-aspect-ratio > img,
[data-sqsp-image-classic-block-image-container] > img {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
  opacity: 1 !important;
}

/* Plain-text social links in the footer (replacing the icon set) */
.footer-social-text {
  text-align: center;
  font-family: 'Open Sans', 'Helvetica Neue', Arial, sans-serif;
  font-size: 0.95rem;
  line-height: 1.8;
  color: #4a2e99;
}
.footer-social-text a {
  color: #4a2e99 !important; /* beat Squarespace's #footer a rule */
  text-decoration: none;
  border-bottom: 1px solid currentColor;
  padding-bottom: 1px;
}
.footer-social-text a:hover {
  opacity: 0.7;
}
.footer-social-text .sep {
  opacity: 0.5;
  border: 0;
}

/* Inline RTE images (inside text/html blocks) flow normally */
.sqs-block-html img,
.sqs-block-content > img {
  max-width: 100%;
  height: auto;
}
