/* Native disclosure controls work with a mouse, keyboard, and without JavaScript. */
.fairytale-list { display: block; color: #f7f4e6; }
.fairytale, .fairytale-title { border-top: 1px solid #ffffff50; }
.fairytale:last-child { border-bottom: 1px solid #ffffff50; }
.fairytale > summary, .fairytale-title {
  padding: 24px 0;
  color: inherit;
  font: inherit;
  font-size: clamp(20px, 2.3vw, 28px);
  line-height: 1.45;
}
.fairytale > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  cursor: pointer;
  list-style: none;
}
.fairytale > summary::-webkit-details-marker { display: none; }
.fairytale > summary::after { content: '+'; flex: 0 0 24px; text-align: center; font-size: 32px; font-weight: 300; }
.fairytale[open] > summary::after { content: '−'; }
.fairytale > summary:focus-visible { outline: 2px solid currentColor; outline-offset: 5px; }
.fairytale-description { padding: 0 0 28px; }
.fairytale-description .text-56-part__text { margin: 0; }
.fairytale-description img { margin-top: 20px; }
.upcoming-show .media-56-main__inner3 {
  max-width: 572px;
  padding: clamp(28px, 4vw, 56px);
  box-sizing: border-box;
}
@media (max-width: 800px) {
  .fairytale > summary, .fairytale-title { padding-block: 20px; }
  .upcoming-show .media-56-main__inner3 { padding: 28px 24px; }
}