/* Phone TOP: horizontal title, right-aligned dates, venue list, hamburger navigation. */
.hero-venue-list{display:none}

/* Floating hamburger: shown once the header nav scrolls away (always on phones), opens a right drawer. */
.top-header.is-scrolled{z-index:90}
.top-menu-toggle{position:fixed;top:24px;right:clamp(24px,3.3vw,54px);z-index:2;display:flex;flex-direction:column;justify-content:center;gap:6px;width:44px;height:44px;padding:0 4px;border:0;background:none;color:#000;cursor:pointer;pointer-events:auto;opacity:0;visibility:hidden;transform:translateY(-8px);transition:opacity .25s,transform .25s,color .2s,visibility 0s .25s}
.top-menu-toggle span{display:block;height:3px;border-radius:3px;background:currentColor;transition:transform .25s,opacity .2s}
.top-menu-toggle span:nth-child(3){display:none}
.top-header.is-scrolled.is-on-dark:not(.is-menu-open) .top-menu-toggle{color:#fff;filter:drop-shadow(0 0 3px #0000004d)}
.top-header.is-scrolled .top-menu-toggle,.top-header.is-menu-open .top-menu-toggle{opacity:1;visibility:visible;transform:none;transition:opacity .25s,transform .25s,color .2s}
.is-menu-open .top-menu-toggle span:nth-child(1){transform:translateY(9px) rotate(45deg)}
.is-menu-open .top-menu-toggle span:nth-child(2){opacity:0}
.is-menu-open .top-menu-toggle span:nth-child(4){transform:translateY(-9px) rotate(-45deg)}

@media(min-width:701px){
 .top-header.is-menu-open{position:fixed;inset:0;z-index:1000;height:auto;padding:0;background:#0000002e;pointer-events:auto;animation:menu-scrim-in .25s ease-out}
 .top-header.is-menu-open .brand{visibility:hidden}
 .top-header.is-menu-open nav{position:fixed;top:0;right:0;bottom:0;display:flex;flex-direction:column;align-items:stretch;gap:4px;width:min(300px,80vw);padding:104px 40px 40px;background:#fff;border-left:1px solid #2da426;animation:menu-drawer-in .3s cubic-bezier(.2,.7,.2,1)}
 .top-header.is-menu-open nav a:nth-child(n){width:100%;height:44px;min-height:44px;padding:0;justify-content:flex-start}
 .top-header.is-menu-open nav img{width:auto;max-width:100%;height:14px;object-position:left center}
}
@keyframes menu-scrim-in{from{background:#0000}}
@keyframes menu-drawer-in{from{transform:translateX(100%)}}

@media(max-width:700px){
 .top-header{height:auto;padding:0}
 .top-header .brand{display:none}
 .top-menu-toggle{top:8px;right:8px;gap:5px;padding:0 10px;opacity:1;visibility:visible;transform:none;transition:color .2s}
 .top-menu-toggle span{height:2px}
 .is-menu-open .top-menu-toggle span:nth-child(1){transform:translateY(7px) rotate(45deg)}
 .is-menu-open .top-menu-toggle span:nth-child(4){transform:translateY(-7px) rotate(-45deg)}
 .top-header nav{display:none}
 .top-header.is-menu-open{position:fixed;inset:0;z-index:1000;height:100svh}
 .top-header.is-menu-open nav{position:fixed;inset:0;z-index:1;display:flex;flex-direction:column;justify-content:center;gap:6px;width:auto;padding:0 12vw;background:#fff}
 .top-header.is-menu-open nav a:nth-child(n){width:100%;height:56px;min-height:56px;padding:0;justify-content:flex-start}
 .top-header.is-menu-open nav img{height:20px}

 .hero-art .hero-brush{left:1vw;top:max(57vw,29svh);width:54vw;height:54vw}
 .hero-composition .hero-venue{display:none}
 .hero-composition .hero-wordmark{left:0;right:auto;top:48.2vw;bottom:auto;width:58.5vw;height:auto}
 .hero-composition .hero-dates{left:auto;right:3.6vw;top:38svh;bottom:auto;width:38vw;height:auto}

 .hero-venue-list{position:absolute;left:4vw;bottom:18svh;z-index:4;display:block;color:#000;font:400 3.33vw/1.45 'Zen Kaku Gothic Antique',sans-serif;letter-spacing:.02em}
 .hero-venue-list>div+div{margin-top:.76em}
 .hero-venue-building{display:flex;align-items:baseline;gap:.45em;margin:0 0 .15em;font-size:1.15em;font-weight:700;line-height:1.3}
 .hero-venue-list ul{margin:0;padding:0;list-style:none}
 .hero-venue-list li{display:flex;align-items:center;min-height:1.45em;white-space:nowrap}
 .hero-venue-tag{display:inline-flex;align-items:center;justify-content:center;flex:none;width:3.9em;height:1.4em;margin-right:1.1em;background:#000;color:#fff;font-size:.7em;font-weight:500;line-height:1}
 .hero-venue-floor{min-width:1.3em;margin-right:.62em}
}

@media(prefers-reduced-motion:reduce){.top-menu-toggle,.top-menu-toggle span{transition:none!important}.top-header.is-menu-open,.top-header.is-menu-open nav{animation:none}}

/* TOP background: red/blue flow particles under the green brush (handoff/fv-scroll). */
.fv-flow-particles{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none}