.podcastHeader {
  position: relative;
  width: 100%;
  min-height: calc(80svh - 68.15px);
  /* min-height: 680px; */
  background-color: rgba(var(--aB), var(--aG), 255, 1);
  padding: var(--small-margin) var(--small-margin) var(--med-margin);
}

.podcastHeader figure {
  max-width: 380px;
  margin: 0 0 var(--small-margin);
  background-color: unset;
  border-width: 0;
}

.podcastHeader figure > img {
  object-fit: cover;
}

.podcastHeader > div {
  font-size: var(--base-font-size);
  padding-top: 0.285em;
}

.podcastHeader h1 {
  font-size: var(--base-font-size);
}

.podcastHeader h2,
.podcastHeader p {
  font-size: var(--tiny-font-size);
  text-transform: initial;
}

.podcastHeader > div > span {
  display: inline-block;
  font-size: var(--note);
  margin-bottom: var(--small-margin);
}

.podcastHeader .play-button {
  margin-top: var(--med-margin);
}

@media screen and (min-width: 380px) {
  .podcastHeader figure {
    background-color: unset;
  }

  .podcastHeader figure > img {
    height: 100%;
    object-fit: cover;
  }
}

@media screen and (min-width: 768px) {
  .podcastHeader {
    padding: var(--med-margin);
  }
}

@media screen and (min-width: 1024px) {
  .podcastHeader {
    display: flex;
    flex-wrap: wrap;
  }

  .podcastHeader figure {
    /* border-width: 0;
    background-color: unset; */
    /* background: linear-gradient(90deg, transparent, var(--average-color) 60%); */
    /* box-shadow: inset 0 -380px 180px var(--background); */
    width: 41.6%;
    max-width: none;
    margin: 0;
    overflow: hidden;
  }

  .podcastHeader figure > img {
    /* width: 42%; */
    width: 100%;
    aspect-ratio: 1 / 1;
    object-position: left center;
    mix-blend-mode: normal;
    /* filter: drop-shadow(rgba(10, 10, 10, 0.15) 5px 5px 0px); */
    margin-right: auto;
    overflow: hidden;
  }

  .podcastHeader > div {
    width: 58.4%;
    padding-left: var(--med-margin);
    margin-bottom: var(--small-margin);
  }
}
