.paragraph--type--teaser-list {
  &.teaser-clickable > .field--name-field-teasers > .field__item,
  &.teaser-clickable > .field--teasers > .field__items > .field__item {
    cursor: pointer;
    &:hover {
      opacity: 0.7;
    }
  }
  .field--teasers > ul.field__items,
  .field--name-field-teasers {
    display: flex;
    flex-wrap: wrap;
    gap: var(--teasergap, 1em);
    .field--name-field-teaser-link a {
      display: inline-block;
      align-items: center;
      cursor: pointer;
      text-align: center;
      border: solid 2px currentColor;
      border-radius: var(--border-radius, 3px);
      background-color: #fff;
      font-weight: 700;
      font-size: 1.25em;
      padding: 0.5em 1em;
      text-decoration: none;
      &:hover {
        background-color: transparent;
      }
    }
  }
  & > .field--teasers > .field__items > .field__item,
  & > .field--name-field-teasers > .field__item {
    flex-grow: 0;
    flex-shrink: 1;
  }
  &.paragraph--view-mode--base-teaser-2-columns > .field--teasers > .field__items > .field__item,
  &.paragraph--view-mode--base-teaser-2-columns > .field--name-field-teasers > .field__item {
    width: calc(100% / 2 - calc(var(--teasergap, 1em)/2));
  }
  &.paragraph--view-mode--base-teaser-3-columns > .field--teasers > .field__items > .field__item,
  &.paragraph--view-mode--base-teaser-3-columns > .field--name-field-teasers > .field__item {
    width: calc(100% / 3 - calc(var(--teasergap, 1em)/3*2));
  }
  &.paragraph--view-mode--base-teaser-4-columns > .field--teasers > .field__items > .field__item,
  &.paragraph--view-mode--base-teaser-4-columns > .field--name-field-teasers > .field__item {
    width: calc(100% / 4 - calc(var(--teasergap, 1em)/4*3));
  }
}
@media screen and (max-width: 479px) {
  .paragraph--type--teaser-list {
    &.paragraph--view-mode--base-teaser-2-columns > .field--teasers > .field__items > .field__item,
    &.paragraph--view-mode--base-teaser-2-columns > .field--name-field-teasers > .field__item,
    &.paragraph--view-mode--base-teaser-3-columns > .field--teasers > .field__items > .field__item,
    &.paragraph--view-mode--base-teaser-3-columns > .field--name-field-teasers > .field__item,
    &.paragraph--view-mode--base-teaser-4-columns > .field--teasers > .field__items > .field__item,
    &.paragraph--view-mode--base-teaser-4-columns > .field--name-field-teasers > .field__item {
      width: 100%;
    }
  }
}
@media screen and (min-width: 480px) and (max-width: 979px) {
  .paragraph--type--teaser-list {
    &.paragraph--view-mode--base-teaser-2-columns > .field--teasers > .field__items > .field__item,
    &.paragraph--view-mode--base-teaser-2-columns > .field--name-field-teasers > .field__item,
    &.paragraph--view-mode--base-teaser-3-columns > .field--teasers > .field__items > .field__item,
    &.paragraph--view-mode--base-teaser-3-columns > .field--name-field-teasers > .field__item,
    &.paragraph--view-mode--base-teaser-4-columns > .field--teasers > .field__items > .field__item,
    &.paragraph--view-mode--base-teaser-4-columns > .field--name-field-teasers > .field__item {
      width: calc(100% / 2 - calc(var(--teasergap, 1em)/2));
    }
  }
}