/* Content remains readable when JavaScript is unavailable. */
.js .reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity .7s ease, transform .7s ease;
}

.js .reveal.is-visible { opacity: 1; transform: none; }

/* The key art carries essential title and date information: never crop it. */
.hero { height: auto; min-height: 0; background: var(--cyan); }
.hero picture, .hero picture img { width: 100%; height: auto; object-fit: contain; }

/* Introduction: remove the editorial rule and center the opening statement. */
.intro .section-kicker { text-align: center; }
.intro-copy { margin: 0 auto; border-left: 0; text-align: center; }
.intro-line { display: block; white-space: nowrap; }

/* Make all section labels legible beside the display-scale headings. */
.section-kicker, .section-title span { font-size: clamp(1rem, 1.35vw, 1.35rem); }

/* Stage-side visual punctuation for the highlights section. */
.highlights-art { position: absolute; z-index: 0; width: clamp(220px, 19vw, 370px); opacity: .88; pointer-events: none; filter: drop-shadow(0 14px 18px #002f4170); }
.highlights-art-left { left: clamp(-3.5rem, 1.8vw, 2.5rem); bottom: -3.75rem; }
.highlights .section-title, .highlights .highlight-list { position: relative; z-index: 1; }
.story { overflow: hidden; }
.story-art { position: absolute; z-index: 0; top: -2.5rem; right: clamp(-1rem, 2vw, 3rem); width: clamp(220px, 19vw, 370px); opacity: .62; pointer-events: none; filter: drop-shadow(0 14px 18px #07546f24); }
.story .section-title, .story .story-grid { position: relative; z-index: 1; }

@media (max-width: 760px) {
  .intro-line { white-space: normal; }
  .highlights-art { display: none; }
  .story-art { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .js .reveal { opacity: 1; transform: none; }
}

/* Cast: a deliberate nine-performer ensemble rather than a single portrait. */
.cast-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(1rem, 2.6vw, 2rem);
}

.cast-grid figure { margin: 0; text-align: center; }
.cast-grid img { width: 100%; aspect-ratio: 1; object-fit: cover; padding: 7px; background: linear-gradient(135deg, var(--sun), var(--cyan), var(--mint)); box-shadow: 8px 9px 0 #0a849c; }
.cast-grid figcaption { margin-top: .85rem; font: 600 clamp(1rem, 1.6vw, 1.25rem)/1.45 var(--serif); }
.cast-grid figcaption strong, .cast-grid figcaption span { display: block; }
.cast-grid figcaption span { margin-top: .15rem; color: #087d96; font: 500 clamp(.8rem, 1.1vw, .95rem)/1.55 var(--sans); }
.cast-ensemble { margin: clamp(2rem, 4vw, 3.5rem) 0 0; text-align: center; color: #087d96; font: 600 clamp(1.15rem, 2vw, 1.55rem)/1.5 var(--serif); letter-spacing: .08em; }

/* Keep the decorative light field below actionable schedule controls. */
.schedule .section-title, .schedule .venues, .schedule .ticket-link { position: relative; z-index: 1; }
.schedule .ticket-link { z-index: 2; }

/* Let the early-bird offer breathe: message first, collectible image centered below. */
.early-bird { display: flex; flex-direction: column; align-items: center; gap: 1.15rem; padding: clamp(2rem, 5vw, 4rem); text-align: center; }
.early-bird p { font-size: clamp(1.15rem, 2vw, 1.45rem); }
.early-bird strong { max-width: 860px; font: 700 clamp(1.05rem, 1.7vw, 1.35rem)/1.7 var(--serif); }
.early-bird img { width: min(500px, 100%); margin: .8rem 0 0; }
.early-bird-link { color: var(--deep); font-weight: 700; text-underline-offset: .25em; }
.early-bird-link:hover { color: #078ca7; }

.partners img { max-height: 58px; }
.partners { grid-template-columns: 1.15fr 1fr 1fr 1.45fr; }
.partner-item { min-width: 0; }
.partner-item img { margin-top: .55rem; max-width: 100%; height: auto; }
.social-links { display: flex; align-items: center; gap: .8rem; }
.social-links a { display: grid; place-items: center; width: 2rem; height: 2rem; color: #dff4e8; transition: color .2s, transform .2s; }
.social-links a:hover { color: var(--sun); transform: translateY(-2px); }
.social-links svg { width: 1.35rem; height: 1.35rem; fill: currentColor; }

@media (max-width: 760px) {
  .cast-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem 1rem; }
  .cast-grid figure:last-child { grid-column: 1 / -1; width: calc(50% - .5rem); justify-self: center; }
  .early-bird { text-align: left; align-items: flex-start; }
  .early-bird strong { text-align: left; }
  .early-bird img { align-self: center; }
}