/* Let the supplied transparent logo sit directly on the page. */
.hero-art.hero-logo-art,
html[data-theme="light"] .hero-art.hero-logo-art,
.hero-logo-art .hero-logo-object,
.hero-logo-art .hero-logo-turn {
  background: transparent;
  border: 0;
  outline: 0;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

.hero-art.hero-logo-art {
  overflow: visible;
  isolation: auto;
  mix-blend-mode: normal;
  mask-image: none;
  -webkit-mask-image: none;
}

.hero-art.hero-logo-art::before,
.hero-art.hero-logo-art::after {
  content: none;
  display: none;
}

.hero-logo-art .hero-logo-halo,
.hero-logo-art .hero-logo-floor,
.hero-logo-art .hero-logo-orbit,
.hero-logo-art .hero-aura,
.hero-logo-art .orbit-spark {
  display: none;
}

.hero-logo-art .hero-logo-image,
html[data-theme="light"] .hero-logo-art .hero-logo-image {
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  filter: none;
}

/* Decorative motion runs only while this scene is visible on the page. */
.hero-atmosphere .field-glow,
.hero-atmosphere .orbit-group,
.hero-atmosphere .orbit-trace,
.hero-atmosphere .field-stars circle,
.hero-atmosphere .field-flare {
  animation-play-state: paused;
}

html[data-motion="on"] .hero-atmosphere.is-atmosphere-active .field-glow,
html[data-motion="on"] .hero-atmosphere.is-atmosphere-active .orbit-group,
html[data-motion="on"] .hero-atmosphere.is-atmosphere-active .orbit-trace,
html[data-motion="on"] .hero-atmosphere.is-atmosphere-active .field-stars circle,
html[data-motion="on"] .hero-atmosphere.is-atmosphere-active .field-flare {
  animation-play-state: running;
}

/* Separate float and tilt layers keep the mark readable throughout the loop. */
.hero-logo-art .hero-logo-object {
  animation: festival-logo-clean-float 7s ease-in-out infinite paused;
}

.hero-logo-art .hero-logo-turn {
  transform-origin: 50% 50%;
  transform: rotateX(3deg) rotateY(-13deg) rotateZ(-2deg);
  animation: festival-logo-clean-turn 12s ease-in-out infinite paused;
}

html[data-motion="on"] .hero-logo-art.is-logo-active .hero-logo-object,
html[data-motion="on"] .hero-logo-art.is-logo-active .hero-logo-turn {
  animation-play-state: running;
  will-change: transform;
}

@keyframes festival-logo-clean-float {
  0%, 100% { transform: translate3d(0, 7px, 0); }
  50% { transform: translate3d(0, -15px, 0); }
}

@keyframes festival-logo-clean-turn {
  0%, 100% { transform: rotateX(3deg) rotateY(-13deg) rotateZ(-2deg); }
  35% { transform: rotateX(-4deg) rotateY(11deg) rotateZ(1.5deg); }
  70% { transform: rotateX(2deg) rotateY(5deg) rotateZ(-.5deg); }
}

html[data-motion="off"] .hero-logo-art .hero-logo-object,
html[data-motion="off"] .hero-logo-art .hero-logo-turn {
  animation: none;
  transform: none;
  will-change: auto;
}

@media (prefers-reduced-motion: reduce) {
  .hero-logo-art .hero-logo-object,
  .hero-logo-art .hero-logo-turn {
    animation: none;
    transform: none;
    will-change: auto;
  }
}

/* The full festival name keeps a clear two-line hierarchy in the split cover. */
.hero h1 .hero-name.hero-name-text { font-size: clamp(52px, 5.4vw, 80px); line-height: 1.04; }
.hero-festival-name { display: block; }
.hero-edition { display: block; margin-top: 10px; font-size: .61em; line-height: 1.18; letter-spacing: -.035em; }
.hero-event-location { max-width: 510px; margin-top: 20px; color: var(--text-secondary); font-size: 14px; line-height: 1.7; letter-spacing: -.01em; text-wrap: pretty; }
@media (max-width: 900px) {
  .hero h1 .hero-name.hero-name-text { font-size: clamp(52px, 8.4vw, 76px); }
  .hero-event-location { max-width: 520px; }
}
@media (max-width: 480px) {
  .hero h1 .hero-name.hero-name-text { font-size: clamp(42px, 12vw, 58px); }
  .hero-edition { margin-top: 8px; font-size: .61em; }
  .hero-event-location { margin-top: 16px; font-size: 13px; max-width: 310px; }
}