.teaser-video {
  background: #fff;
  overflow: hidden; /* Verhindert Überlauf */
  cursor: pointer; /* Zeigt, dass die Box interaktiv ist */
}

.teaser-video .header {
  position: relative; /* Ermöglicht die Positionierung des Videos */
  height: 465px; /* Höhe des Video-Bereichs */
}

.teaser-video .video {
  width: 100%; /* Video an Teaser-Box anpassen */
  height: 100%; /* Video an Teaser-Box anpassen */
  object-fit: cover; /* Stellt sicher, dass das Video gut aussieht */
}

.teaser-video .content {
  padding: 85px 40px 65px 40px; /* Innenabstand für den Text */
}

.teaser-video .bodytext {
  color: #009FE3;
  leading-trim: both;
  text-edge: cap;
  font-family: Barlow;
  font-size: 25px;
  font-style: normal;
  font-weight: 600;
  text-transform: uppercase;
}

.transition-animation-trigger .transition-animation  {
  text-decoration: underline;            /* Unterstreichung immer aktiv */
  text-decoration-color: transparent;    /* Startfarbe: unsichtbar */
  transition: text-decoration-color 0.3s ease, text-underline-offset 0.3s ease; /* Animationen */
}

/* Bei Hover die Unterstreichung sichtbar machen und näher an den Text setzen */
.transition-animation-trigger:hover .transition-animation {
  text-decoration-color: white;            /* Unterstreichung wird rot */
}



/*
Teaser Text
 */


.teaser-text {
  background: #fff;
  overflow: hidden; /* Verhindert Überlauf */
  cursor: pointer; /* Zeigt, dass die Box interaktiv ist */
}

.teaser-text .header {
  aspect-ratio: 3 / 2;
  width: 100%;
  overflow: hidden;
}

.teaser-text .image {
  width: 100%; /* Video an Teaser-Box anpassen */
  height: 100%; /* Video an Teaser-Box anpassen */
  object-fit: cover; /* Stellt sicher, dass das Video gut aussieht */
}

.teaser-text .content {
  padding: 65px 40px 50px 40px; /* Innenabstand für den Text */
}

.teaser-text .bodytext {
  color: #000;
  leading-trim: both;
  text-edge: cap;
  /* Desktop/Headlines/H3 */
  font-family: Barlow;
  font-size: 24px;
  font-style: normal;
  font-weight: 600;
  line-height: 32px; /* 133.333% */
  margin-bottom: 40px;
}

.teaser-text:hover .bodytext {
  color:red;
  transition: color 0.3s ease; /* Dauer und Art der Animation */
}
