/* Keep the campaign and navigation together while the page scrolls. */
.hb-festival-website-banner .hb-festival-banner {
  position: sticky;
  top: 0;
  z-index: 110;
  border-bottom: 1px solid color-mix(in srgb, var(--hf-accent) 35%, transparent);
}
.header { top: var(--hb-site-banner-height, 0px); }
html { scroll-padding-top: calc(var(--hb-site-header-bottom, 76px) + 20px); }
.hb-festival-frame { z-index: 120; }
.hb-festival-banner > .hf-art--banner,
.hb-festival-banner::after { display: none; }
.hb-festival-banner .hb-festival-banner-copy { flex-wrap: wrap; }
.hb-festival-banner .hb-festival-banner-title { max-width: min(32vw, 30rem); }
.hb-festival-banner .hb-festival-banner-offer { display: inline; }
/* Show the complete scene, including text, within each viewport edge. */
.hb-festival-frame .hf-art--edge-left,
.hb-festival-frame .hf-art--edge-right {
  top: calc(var(--hb-site-header-bottom, 140px) + 8px);
  width: clamp(104px, 20vw, 260px);
  height: auto;
  aspect-ratio: 600 / 220;
  transform: none;
}
.hb-festival-frame .hf-art--edge-left { left: 10px; }
.hb-festival-frame .hf-art--edge-right { right: 10px; }
/* Put complete corner scenes in the pinned banner, clear of scrolling content. */
.hb-festival-website-banner .hb-festival-frame .hf-art--edge-left,
.hb-festival-website-banner .hb-festival-frame .hf-art--edge-right {
  top: calc((var(--hb-site-banner-height, 64px) - 48.4px) / 2 - 2px);
  width: 132px;
  height: 48.4px;
}
.hb-festival-splash button { letter-spacing: normal; }
.hb-festival-splash .hb-festival-schedule { margin-top: 10px; }
.hb-festival-cta:focus-visible,
.hb-festival-close:focus-visible { outline: 2px solid var(--hf-accent); outline-offset: 4px; }
@media (min-width: 761px) {
  .hb-festival-banner { padding-inline: 164px; }
}
@media (max-width: 760px) {
  .hb-festival-website-banner .hb-festival-banner { padding-top: 44px; }
  .hb-festival-banner .hb-festival-banner-copy { flex: 1; }
  .hb-festival-banner .hb-festival-banner-title { max-width: 44vw; }
  .hb-festival-banner .hb-festival-banner-time { white-space: normal; }
  .hb-festival-frame .hf-art--edge-left,
  .hb-festival-frame .hf-art--edge-right {
    top: calc(var(--hb-site-header-bottom, 140px) + 2px);
    width: clamp(90px, 26vw, 150px);
    opacity: .7;
  }
  .hb-festival-frame .hf-art--edge-left { left: 4px; }
  .hb-festival-frame .hf-art--edge-right { right: 4px; }
  .hb-festival-website-banner .hb-festival-frame .hf-art--edge-left,
  .hb-festival-website-banner .hb-festival-frame .hf-art--edge-right {
    top: 0;
    width: 104px;
    height: auto;
    opacity: .85;
  }
}
@media (max-width: 380px) {
  .hb-festival-banner { gap: 8px; padding-inline: 10px; }
  .hb-festival-banner .hb-festival-mark { display: none; }
  .hb-festival-banner .hb-festival-cta { white-space: nowrap; }
}
