/* lb/teaser-slide-thumb-item -- Thumbs-Gallery-Item der teaser-slide-*
   Familie. Gemeinsame Swiper-Basis liegt in
   ../teaser-slide-shared/block-styles.css -- hier nur die echten
   Unterschiede: Bildhöhe (500px mobil -> 648px ab 900px, größer als
   teaser-slide-item, siehe TechDoku "Stage-Slide ThumbSlide"), weißer statt
   blauer Button-Rand/-Text (dunklerer Bildhintergrund). Referenzseite:
   Karriere.

   Alle Selektoren zusätzlich mit .swiper-slide gescoped (wie beim
   Geschwister-Block teaser-slide-item) -- .swiper-slide setzt nur save(),
   das Editor-Vorschau-Div (edit()) hat nur die auto-generierte
   wp-block-lb-teaser-slide-thumb-item-Klasse. Ohne das Scoping griff die
   feste Bildhöhe auch auf das kleine Editor-Vorschaubild und zog es
   unnötig in die Höhe. */

.wp-block-lb-teaser-slide-thumb-item.swiper-slide img {
  width: 100%;
  height: 500px;
  object-fit: cover;
}

.wp-block-lb-teaser-slide-thumb-item.swiper-slide .teaser_image_div {
  display: none;
}

/* main_desktop.css hat eine bare "h1,h2,h3,h4,h5,h6,p{padding:0 24px}"-Regel
   (site-weit, kein Scoping) -- trifft auch Heading/Text/Listen hier im Slide. */
.wp-block-lb-teaser-slide-thumb-item.swiper-slide h1,
.wp-block-lb-teaser-slide-thumb-item.swiper-slide h2,
.wp-block-lb-teaser-slide-thumb-item.swiper-slide h3,
.wp-block-lb-teaser-slide-thumb-item.swiper-slide h4,
.wp-block-lb-teaser-slide-thumb-item.swiper-slide h5,
.wp-block-lb-teaser-slide-thumb-item.swiper-slide h6,
.wp-block-lb-teaser-slide-thumb-item.swiper-slide p,
.wp-block-lb-teaser-slide-thumb-item.swiper-slide ul,
.wp-block-lb-teaser-slide-thumb-item.swiper-slide ol {
  padding: 0;
}

.wp-block-lb-teaser-slide-thumb-item.swiper-slide .text .my-block-button {
  margin: 0;
  color: #ffffff;
  border: 2px solid #ffffff;
  margin-bottom: 24px;
}

@media (min-width: 900px) {
  .wp-block-lb-teaser-slide-thumb-item.swiper-slide {
    height: 648px;
  }

  .wp-block-lb-teaser-slide-thumb-item.swiper-slide img {
    height: 648px;
  }
}