/* V151 — exact package assets only. No visual treatment is applied to illustrations. */

/* The illustration pixels are displayed unchanged. */
.morphd-illustration__image,
.journey-service__image img,
.journey-process__image img,
.journey-process__mobile-image img,
.services-hero-mosaic--illustrations img,
.process-phase__media--illustration img,
.studio-hero-illustration img,
.contact-page__media--illustration img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  padding: 0 !important;
  object-fit: contain !important;
  object-position: center !important;
  filter: none !important;
  mix-blend-mode: normal !important;
  transform: none !important;
  transition: none !important;
}

/* No overlays, masks, gradients or side fades. */
.journey-service__image::before,
.journey-service__image::after,
.journey-process__image::before,
.journey-process__image::after,
.services-hero-mosaic--illustrations figure::before,
.services-hero-mosaic--illustrations figure::after,
.process-phase__media--illustration::before,
.process-phase__media--illustration::after,
.studio-hero-illustration::before,
.studio-hero-illustration::after,
.contact-page__media--illustration::before,
.contact-page__media--illustration::after {
  display: none !important;
  content: none !important;
}

/* Homepage Services: one full black illustration, switching instantly. */
.journey-services__visual {
  display: block !important;
  width: min(100%, 760px) !important;
  height: auto !important;
  aspect-ratio: 1 / 1 !important;
  background: #080808 !important;
  overflow: hidden !important;
}
.journey-service__image {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  opacity: 0 !important;
  transform: none !important;
  transition: none !important;
  background: #080808 !important;
}
.journey-service__image.is-active {
  opacity: 1 !important;
}

/* Homepage Process: one full white illustration, switching instantly. */
.journey-process__visual {
  display: block !important;
  grid-template-columns: none !important;
  grid-template-rows: none !important;
  gap: 0 !important;
  width: min(100%, 760px) !important;
  height: auto !important;
  aspect-ratio: 1 / 1 !important;
  background: #f4f2ec !important;
  overflow: hidden !important;
}
.journey-process__image,
.journey-process__image.is-active {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  transform: none !important;
  transition: none !important;
  background: #f4f2ec !important;
}
.journey-process__image {
  opacity: 0 !important;
}
.journey-process__image.is-active {
  opacity: 1 !important;
}
.journey-process__mobile-image {
  background: #f4f2ec !important;
}

/* Preserve all captions as plain text, without gradient treatment. */
.journey-service__image figcaption,
.journey-process__image figcaption,
.services-hero-mosaic--illustrations figcaption {
  background: transparent !important;
  background-image: none !important;
  filter: none !important;
}

/* Services page: exact black tiles fill their existing modules. */
.services-hero-mosaic--illustrations,
.services-hero-mosaic--illustrations figure,
.services-hero-mosaic--illustrations .services-hero-mosaic__link {
  background: #080808 !important;
}

/* Process stage illustrations: exact white files, full width, no framing. */
.process-phase__media--illustration {
  padding: 0 !important;
  background: #f4f2ec !important;
  overflow: hidden !important;
}
.process-phase__media--illustration picture {
  display: block !important;
  width: 100% !important;
  height: auto !important;
}
.process-phase__media--illustration img {
  height: auto !important;
}
.process-phase__media--illustration figcaption {
  position: static !important;
  margin: 10px 0 0 !important;
  padding: 0 !important;
  background: transparent !important;
}

/* Studio and Contact: use the package ratio variants at full available width. */
.studio-hero-illustration,
.contact-page__media--illustration {
  width: 100% !important;
  max-width: none !important;
  aspect-ratio: auto !important;
  overflow: visible !important;
  background: #080808 !important;
}
.studio-hero-illustration picture,
.contact-page__media--illustration picture,
.studio-hero-illustration img,
.contact-page__media--illustration img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  aspect-ratio: auto !important;
}

@media (max-width: 680px) {
  .journey-services__visual,
  .journey-process__visual {
    width: 100% !important;
  }
}


/* Stable page geometry retained after removing the legacy illustration treatment stylesheets. */
.services-hero-mosaic--illustrations {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  grid-template-rows: repeat(2, minmax(0, 1fr)) !important;
  height: auto !important;
  gap: 1px !important;
}
.services-hero-mosaic--illustrations figure,
.services-hero-mosaic--illustrations .services-hero-mosaic__link {
  aspect-ratio: 1 / 1 !important;
  min-height: 0 !important;
}
.studio-hero-illustration figcaption {
  display: block !important;
  position: static !important;
  padding-top: 10px !important;
  background: transparent !important;
}
@media (max-width: 980px) {
  .services-hero-mosaic--illustrations {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    grid-template-rows: repeat(3, minmax(0, 1fr)) !important;
  }
}