@layer vendor {
  .block--storyteaser {
    .block--storyteaser__content {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      grid-template-areas: "text media";

      &.content_right {
        grid-template-areas: "media text";
      }
    }

    .block--storyteaser__media {
      grid-area: media;
      justify-self: center;
      align-self: center;
      width: 100%;
    }

    .block--storyteaser__media > * {
      display: block;
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center;
    }

    .block--storyteaser__text {
      grid-area: text;
      align-self: center;
    }
  }
}