.teaser-container {
  border-top: 0.5px solid var(--black-40);
  display: flex;
  flex-direction: column;
  padding: var(--spacer-md) 0;
  gap: var(--spacer-xs);
  position: relative;
  overflow: hidden;
}

/* Bottom Border only two last childs */
.teaser-container:nth-last-child(1),
.teaser-container:nth-last-child(2) {
  border-bottom: 0.5px solid var(--black-40);
}

/* Mobile */
@media (max-width: 834px) {
  .teaser-container:nth-last-child(2) {
    border-bottom: 0;
  }
  .teaser-container:last-child {
    border-bottom: 0.5px solid var(--black-40);
  }
}

.teaser-container h3 {
  margin: 0;
  font-weight: 400;
}

/* Chevron */
.teaser-container::after {
  position: absolute;
  bottom: 1.25rem;
  right: 0;
  padding-bottom: var(--spacer-md);
  transform: translateY(15px);
  opacity: 0;
  transition: all 0.3s ease;
}

.teaser-container:hover::after {
  transform: translateY(0);
  opacity: 1;
}

/* Artist Specific */
.teaser-container.teaser-artist {
  gap: var(--spacer-md);
  width: 100%;
}

/* Exhibition Specific */
.teaser-exhibition h3 {
  --max-lines: 1;

  height: calc(var(--max-lines) * var(--line-lg));
  width: 75%;

  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.teaser-exhibition .title {
  height: var(--line-lg);
  overflow: hidden;
}

.teaser-exhibition:hover .exhibition-date.tag {
  background-color: var(--black);
  color: var(--white);
}

.teaser-exhibition .location {
  opacity: 0.5;
  transition: opacity 0.3s ease;
}

.teaser-exhibition:hover .location {
  opacity: 1;
}

.teaser-artist img {
  aspect-ratio: 1/1;
}

/* Marquee Effect */
.teaser-container .marquee {
  animation-play-state: paused;
  animation: none;
}
.teaser-container:hover .marquee {
  animation-play-state: running;
  animation: marquee-small linear infinite 3s;
}

.teaser-container .marquee span {
  opacity: 0;
}
.teaser-container:hover .marquee span {
  opacity: 1;
}

/* Mobile & Tablet */
@media (max-width: 1440px) {
  .teaser-exhibition .title {
    width: 100%;
    position: relative;
    height: auto;
  }

  .teaser-exhibition h3 {
    width: 100%;

    height: auto;
    -webkit-line-clamp: unset;
    display: block;
    overflow: unset;
    text-wrap: wrap;
  }

  .teaser-exhibition .location {
    opacity: 1;
  }

  .teaser-container::after {
    transform: translateY(0);
    opacity: 1;
  }

  .teaser-container:hover .marquee {
    animation: unset;
  }

  .teaser-container .marquee span {
    display: none !important;
  }

  .teaser-container:hover .marquee span {
    opacity: 0;
  }

  .teaser-exhibition:hover .exhibition-date.tag {
    background: inherit;
    color: inherit;
  }
}

.post-date {
  margin-bottom: var(--spacer-xs);
  opacity: 0.7;
}
