/* Force-visible: Squarespace's scroll-reveal JS doesn't run reliably once
   mirrored outside their platform, which left some sections stuck at
   opacity:0 waiting for a "revealed" class that never gets added. */
[data-animation-role],
.fluid-image-animation-wrapper,
.sqs-block-content,
.sqs-image {
  opacity: 1 !important;
  transform: none !important;
  visibility: visible !important;
}

/* Squarespace's "blog masonry" list (used on the Community Engagement /
   Product Design summary pages) is laid out entirely by a JS controller
   (BlogLayoutMasonry) that absolutely-positions each post card and sizes
   its image wrapper via a JS-computed aspect ratio. That controller never
   runs outside Squarespace's platform, so cards were stuck at
   position:absolute/opacity:0 and their image wrappers collapsed to ~1px
   tall. Replace it with a plain static grid instead. */
.blog-masonry-wrapper {
  position: static !important;
  height: auto !important;
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)) !important;
  gap: 2.5rem !important;
}
.blog-masonry-wrapper article.blog-item {
  position: static !important;
  opacity: 1 !important;
  width: auto !important;
  top: auto !important;
  left: auto !important;
}
.blog-masonry-wrapper .image-wrapper {
  height: auto !important;
  aspect-ratio: 3 / 2;
  min-height: 200px;
}
.blog-masonry-wrapper .image-wrapper img {
  position: static !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

/* Squarespace's "Slideshow"/banner list component (<ul class="slides">,
   used for text+image slide sections like the Simpu case study's "One
   dashboard..." banner) starts the whole slide list at opacity:0 and
   relies on its own carousel JS to reveal it and cycle slides. That JS
   never runs here, so the entire block -- heading, image, everything --
   was invisible despite being correctly laid out underneath. */
ul.slides {
  opacity: 1 !important;
}
/* Each slide starts life translated off-screen (transform:
   translateX(-9999px)) as the default "not the active slide" state;
   Squarespace's carousel JS is supposed to translateX(0) whichever slide
   is current. That JS never runs, so slides just stayed parked at -9999px
   forever. Cancel the offset and stack any extra slides so at least the
   first one reads normally instead of everything sitting off-canvas. */
ul.slides > li.slide {
  transform: none !important;
}
