.interlude {
  position: relative;
  padding: clamp(4rem, 9vw, 7rem) clamp(1.25rem, 6vw, 6rem);
  text-align: center;
  overflow: clip;
  background:
    radial-gradient(70% 60% at 50% 0%, rgba(169, 131, 90, .12) 0%, transparent 60%),
    var(--jade-800);
  color: var(--gold-100);
}
.interlude__copy { position: relative; z-index: 1; max-width: 40rem; margin: 0 auto; opacity: 0; transform: translateY(1.25rem); transition: opacity .7s ease, transform .7s ease; }
.interlude__copy.is-visible { opacity: 1; transform: none; }
.interlude__copy p.eyebrow { color: var(--gold-400); }
.interlude__copy h2 { font-size: clamp(1.6rem, 4vw, 2.6rem); line-height: 1.15; margin: .5rem 0 0; }
.interlude__copy h2 strong { color: var(--gold-400); font-weight: inherit; }

.interlude__player {
  position: relative;
  z-index: 1;
  width: min(100%, 960px);
  aspect-ratio: 16 / 9;
  margin: clamp(2rem, 5vw, 3rem) auto 0;
  overflow: clip;
  border-radius: var(--radius-md);
  border: 1px solid rgba(169, 131, 90, .32);
  background: var(--jade-900);
  box-shadow: 0 30px 80px rgba(0, 0, 0, .45);
}
.interlude__poster,
.interlude__video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.interlude__player:not(.is-playing) .interlude__video { display: none; }
.interlude__player.is-playing .interlude__poster,
.interlude__player.is-playing .interlude__cta { display: none; }

.interlude__cta { position: absolute; z-index: 1; inset: 0; margin: auto; width: fit-content; height: fit-content; display: flex; flex-direction: column; align-items: center; gap: .85rem; }
.interlude__play {
  width: clamp(92px, 14vw, 132px);
  height: clamp(62px, 9.5vw, 90px);
  display: flex;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: clamp(14px, 2.4vw, 20px);
  background: var(--seal-red);
  color: var(--gold-100);
  cursor: pointer;
  box-shadow: 0 16px 36px rgba(0, 0, 0, .5);
  transition: transform 200ms ease, filter 200ms ease;
}
.interlude__play:hover, .interlude__play:focus-visible { transform: scale(1.06); filter: brightness(1.18); }
.interlude__play svg { width: 34%; height: 34%; margin-left: 6%; fill: currentColor; }
.interlude__play-label { font-size: .74rem; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; color: var(--gold-100); text-shadow: 0 2px 10px rgba(0, 0, 0, .6); }

@media (prefers-reduced-motion: reduce) {
  .interlude__copy { transition: none; opacity: 1; transform: none; }
  .interlude__play { transition: none; }
}