/* =========================================================
   Videozeile – Layout
   ========================================================= */
.videozeile {
  display: flex;
  width: 100%;
  gap: var(--block-margin); /* Abstand zwischen links/rechts */
  padding-top: var(--block-margin); /* Abstand vor der Linie */
  padding-bottom: var(--block-margin); /* Abstand nach unten */
  border-top: 1px solid var(--primary-color); /* Linie oben */
}

.videozeile .left {
  width: 60%;
}

.videozeile .right {
  width: 40%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}

/* =========================================================
   Video-Wrapper
   ========================================================= */
.video-wrapper {
  position: relative;
  padding-bottom: 56.25%; /* 16:9 Format */
  height: 0;
  overflow: hidden;
}

.video-wrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/* Spezifische Styles für Links innerhalb .left */
.videozeile .left div{ 
  /** background-image: none !important; */ 
  background-position: center; 
} 

/* =========================================================
   Cookie- / Blocked Content Styles (Complianz)
   ========================================================= */
.cmplz-blocked-content-container {
  /* background-color: var(--primary-color) !important; 
    box-shadow: none; border-radius: 0; */ 
  /* height auf 0, falls Content blockiert */
  height: 0 !important;
}

.cmplz-blocked-content-container .cmplz-blocked-content-notice {
  background-color: var(--primary-color) !important;
}

.cmplz-blocked-content-container .cmplz-blocked-content-notice .cmplz-accept-service {
  background-color: var(--secondary-color) !important;
  color: var(--primary-color);
}

/* =========================================================
   Überschriften
   ========================================================= */
.videozeile h2 {
  font-size: 35px !important;
  margin-bottom: 7px !important;
}

.videozeile h3 {
  font-size: 15px !important;
  font-family: var(--font-regular), sans-serif;
  font-weight: 400;
  margin-bottom: 25px !important;
}

/* =========================================================
   Responsive Anpassungen
   ========================================================= */
@media (max-width: 1100px) {
  .videozeile {
    flex-direction: column;
  }

  .videozeile .left,
  .videozeile .right {
    width: 100%;
  }
}
