/*
Layer: 05-blocks
Datei: media-text.css
*/

/* ===== Media & Text (Service + Marketing: class-basiert) ===== */
/* Breite: NICHT width:100% !important – das würde sections.css überschreiben
   (Section = 100vw, Kind soll min(85%, 1200px) bleiben wie Szenario-Grid). */
.service-page-media-cards .wp-block-media-text,
.service-media-text.wp-block-media-text,
:is(body.parent-pageid-1002, body.page-id-1002, body.page-id-1023, body.page-id-1024) .wp-block-media-text {
  display: grid !important;
  width: min(var(--page-width, 85%), var(--max-width, 1200px)) !important;
  max-width: min(var(--page-width, 85%), var(--max-width, 1200px)) !important;
  margin-top: 3.5rem !important;
  margin-bottom: 3.5rem !important;
  margin-left: auto !important;
  margin-right: auto !important;
  gap: clamp(1.25rem, 3vw, 2.5rem) !important;
  align-items: center;
  box-sizing: border-box;
}

.service-page-media-cards .wp-block-media-text.has-media-on-the-right,
.service-media-text.wp-block-media-text.has-media-on-the-right,
:is(body.parent-pageid-1002, body.page-id-1002, body.page-id-1023, body.page-id-1024) .wp-block-media-text.has-media-on-the-right {
  grid-template-columns: 1fr minmax(260px, 44%) !important;
}

.service-page-media-cards .wp-block-media-text.has-media-on-the-left,
.service-page-media-cards .wp-block-media-text:not(.has-media-on-the-right),
.service-media-text.wp-block-media-text.has-media-on-the-left,
:is(body.parent-pageid-1002, body.page-id-1002, body.page-id-1023, body.page-id-1024) .wp-block-media-text.has-media-on-the-left {
  grid-template-columns: minmax(260px, 44%) 1fr !important;
}

.service-page-media-cards .wp-block-media-text.has-media-on-the-right .wp-block-media-text__media,
.service-media-text.wp-block-media-text.has-media-on-the-right .wp-block-media-text__media,
:is(body.parent-pageid-1002, body.page-id-1002, body.page-id-1023, body.page-id-1024) .wp-block-media-text.has-media-on-the-right .wp-block-media-text__media {
  grid-column: 2;
  grid-row: 1;
}

.service-page-media-cards .wp-block-media-text.has-media-on-the-right .wp-block-media-text__content,
.service-media-text.wp-block-media-text.has-media-on-the-right .wp-block-media-text__content,
:is(body.parent-pageid-1002, body.page-id-1002, body.page-id-1023, body.page-id-1024) .wp-block-media-text.has-media-on-the-right .wp-block-media-text__content {
  grid-column: 1;
  grid-row: 1;
}

.service-page-media-cards .wp-block-media-text.has-media-on-the-left .wp-block-media-text__media,
.service-media-text.wp-block-media-text.has-media-on-the-left .wp-block-media-text__media,
:is(body.parent-pageid-1002, body.page-id-1002, body.page-id-1023, body.page-id-1024) .wp-block-media-text.has-media-on-the-left .wp-block-media-text__media {
  grid-column: 1;
  grid-row: 1;
}

.service-page-media-cards .wp-block-media-text.has-media-on-the-left .wp-block-media-text__content,
.service-media-text.wp-block-media-text.has-media-on-the-left .wp-block-media-text__content,
:is(body.parent-pageid-1002, body.page-id-1002, body.page-id-1023, body.page-id-1024) .wp-block-media-text.has-media-on-the-left .wp-block-media-text__content {
  grid-column: 2;
  grid-row: 1;
}

.service-page-media-cards .wp-block-media-text__media,
.service-media-text.wp-block-media-text .wp-block-media-text__media {
  overflow: hidden;
  min-width: 0;
}

.service-page-media-cards .wp-block-media-text__media img,
.service-media-text.wp-block-media-text .wp-block-media-text__media img,
:is(body.parent-pageid-1002, body.page-id-1002, body.page-id-1023, body.page-id-1024) .wp-block-media-text__media img {
  width: 100%;
  max-width: 100%;
  height: auto;
  max-height: min(320px, 42vw);
  display: block;
  object-fit: cover;
  object-position: center;
  border-radius: 0.75rem;
  box-shadow: 0 12px 32px rgba(16, 45, 68, 0.12);
}

.service-page-media-cards .service-media-card__list {
  margin: 0.75rem 0 0;
  padding-left: 1.2rem;
  line-height: 1.55;
}

.service-page-media-cards .wp-block-media-text + .wp-block-media-text {
  margin-top: 2.5rem !important;
}

:is(body.parent-pageid-1002, body.page-id-1002, body.page-id-1023, body.page-id-1024) .wp-block-media-text__content {
  padding: 0.5rem 0;
}

:is(body.parent-pageid-1002, body.page-id-1002, body.page-id-1023, body.page-id-1024) .wp-block-media-text__content h2,
:is(body.parent-pageid-1002, body.page-id-1002, body.page-id-1023, body.page-id-1024) .wp-block-media-text__content h3 {
  margin-top: 0;
  color: var(--color-primary, #0066b3);
}

:is(body.parent-pageid-1002, body.page-id-1002, body.page-id-1023, body.page-id-1024) .wp-block-media-text__content p {
  line-height: 1.65;
  color: var(--color-dark, #1c1c1c);
}

:is(body.parent-pageid-1002, body.page-id-1002, body.page-id-1023, body.page-id-1024) .wp-block-media-text__content strong {
  color: var(--color-primary, #0066b3);
}

.service-page-feature {
  margin: 2.75rem 0 3.25rem !important;
}

.service-page-feature .wp-block-heading {
  margin-top: 0;
}

.service-page-feature .wp-block-list {
  margin: 0;
}

.service-page-feature .wp-block-list li {
  margin: 0 0 0.75rem;
}

.service-page-feature .wp-block-list li:last-child {
  margin-bottom: 0;
}

.service-stagger {
  transform: translateX(0);
}

.service-stagger--left {
  transform: translateX(-18px);
}

.service-stagger--right {
  transform: translateX(18px);
}

@media (max-width: 781px) {
  .service-page-media-cards .wp-block-media-text,
  .service-page-media-cards .wp-block-media-text.has-media-on-the-right,
  .service-page-media-cards .wp-block-media-text.has-media-on-the-left,
  .service-media-text.wp-block-media-text,
  :is(body.parent-pageid-1002, body.page-id-1002, body.page-id-1023, body.page-id-1024) .wp-block-media-text,
  :is(body.parent-pageid-1002, body.page-id-1002, body.page-id-1023, body.page-id-1024) .wp-block-media-text.has-media-on-the-right,
  :is(body.parent-pageid-1002, body.page-id-1002, body.page-id-1023, body.page-id-1024) .wp-block-media-text.has-media-on-the-left {
    grid-template-columns: 1fr !important;
  }

  .service-page-media-cards .wp-block-media-text .wp-block-media-text__media,
  .service-page-media-cards .wp-block-media-text .wp-block-media-text__content,
  .service-media-text.wp-block-media-text .wp-block-media-text__media,
  .service-media-text.wp-block-media-text .wp-block-media-text__content,
  :is(body.parent-pageid-1002, body.page-id-1002, body.page-id-1023, body.page-id-1024) .wp-block-media-text .wp-block-media-text__media,
  :is(body.parent-pageid-1002, body.page-id-1002, body.page-id-1023, body.page-id-1024) .wp-block-media-text .wp-block-media-text__content {
    grid-column: 1 !important;
    grid-row: auto !important;
  }

  .service-page-media-cards .wp-block-media-text__media img,
  .service-media-text.wp-block-media-text .wp-block-media-text__media img {
    max-height: 240px;
  }
}