@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=IBM+Plex+Mono:wght@400;500;600&family=Space+Grotesk:wght@400;500;700&display=swap');
:root { --black:#050505; --white:#f2f2ef; --grey:#858585; --line:rgba(242,242,239,.2); --gutter:clamp(1.2rem,3vw,3.5rem); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--black); color:var(--white); font-family:'Space Grotesk',sans-serif; overflow-x:hidden; }
body::before { content:''; position:fixed; inset:0; pointer-events:none; z-index:5; opacity:.08; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E"); mix-blend-mode:screen; }
a { color:inherit; text-decoration:none; }
button,input { font:inherit; }
button { cursor:pointer; }
.loading-screen { position:fixed; inset:0; z-index:20; display:grid; place-items:center; align-content:center; gap:1rem; background:var(--black); color:var(--grey); font:500 .65rem 'IBM Plex Mono',monospace; letter-spacing:.18em; text-transform:uppercase; transition:opacity .7s ease,visibility .7s ease; }
.loading-screen.is-hidden { opacity:0; visibility:hidden; pointer-events:none; }
.loading-mark { width:min(42vw,260px); aspect-ratio:1; }
.loading-mark img { width:100%; height:100%; object-fit:contain; filter:contrast(1.1) brightness(1.15) drop-shadow(0 15px 25px rgba(255,255,255,.15)); }
.topbar { position:absolute; top:0; left:0; z-index:10; width:100%; padding:1.4rem var(--gutter); display:grid; grid-template-columns:1fr auto 1fr; align-items:center; border-bottom:1px solid var(--line); font:600 .68rem 'IBM Plex Mono',monospace; letter-spacing:.16em; text-transform:uppercase; }
.brand { font:700 1.8rem 'Space Grotesk',sans-serif; letter-spacing:-.12em; width:fit-content; }
.topnav { display:flex; gap:2rem; color:var(--grey); }
.topnav a:hover { color:var(--white); }
.nav-cta { justify-self:end; border-bottom:1px solid var(--white); padding-bottom:.25rem; }
.hero { min-height:100svh; padding:5.7rem var(--gutter) 2rem; display:flex; flex-direction:column; justify-content:space-between; }
.hero-art { width:calc(100% + (2 * var(--gutter))); min-height:65svh; margin-left:calc(-1 * var(--gutter)); display:grid; place-items:center; position:relative; overflow:visible; }
.logo-stage { width:min(100%,1200px); height:min(70svh,900px); position:relative; display:block; filter:drop-shadow(0 25px 35px rgba(255,255,255,.12)); }
.logo-fallback { width:min(100%,1200px); height:min(70svh,900px); object-fit:contain; filter:contrast(1.12) brightness(1.12) drop-shadow(0 25px 35px rgba(255,255,255,.12)); }
.countdown { position:absolute; left:50%; bottom:clamp(.6rem,3vw,2rem); z-index:2; width:max-content; max-width:calc(100% - 2rem); transform:translateX(-50%); text-align:center; pointer-events:none; mix-blend-mode:screen; }
.countdown-label { display:block; margin-bottom:.65rem; color:var(--grey); font:500 .62rem 'IBM Plex Mono',monospace; letter-spacing:.16em; text-transform:uppercase; }
.countdown strong { display:block; color:var(--white); font:500 clamp(2rem,6vw,6rem)/.86 'IBM Plex Mono',monospace; letter-spacing:-.1em; white-space:nowrap; text-shadow:0 0 24px rgba(255,255,255,.18); }
.countdown-cta { display:none; align-items:center; justify-content:center; gap:1.5rem; margin:0 auto; padding:.9rem 1rem; border:1px solid var(--white); color:var(--white); font:600 .7rem 'IBM Plex Mono',monospace; letter-spacing:.12em; text-transform:uppercase; }
.countdown-cta:not([hidden]) { display:inline-flex; }
.countdown-cta:hover { background:var(--white); color:var(--black); }
.countdown-cta span { font-size:1rem; }
.event-countdown { display:block; margin-top:.85rem; color:var(--grey); font:500 .58rem 'IBM Plex Mono',monospace; letter-spacing:.1em; text-transform:uppercase; }
.hero-bottom { display:grid; grid-template-columns:1fr 1fr; gap:2rem; align-items:end; border-top:1px solid var(--line); padding-top:1.2rem; }
.eyebrow,.card-label,.mini-label { margin:0 0 .7rem; color:var(--grey); font:500 .66rem 'IBM Plex Mono',monospace; letter-spacing:.14em; text-transform:uppercase; }
h1,h2,h3,p { margin-top:0; }
h1 { margin-bottom:0; font-size:clamp(3.8rem,10vw,10rem); line-height:.82; letter-spacing:-.08em; font-weight:700; text-transform:uppercase; }
.hero-copy { justify-self:end; width:min(100%,24rem); color:var(--grey); font-size:.95rem; line-height:1.5; }
.hero-copy .button { margin-top:1.5rem; }
.button { display:inline-flex; justify-content:space-between; align-items:center; gap:2.5rem; border:1px solid var(--white); padding:.9rem 1rem; font:600 .7rem 'IBM Plex Mono',monospace; letter-spacing:.12em; text-transform:uppercase; transition:background .2s,color .2s; }
.button:hover { background:var(--white); color:var(--black); }
.button span { font-size:1rem; }
.marquee { overflow:hidden; border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:.65rem 0; color:var(--grey); font:500 .65rem 'IBM Plex Mono',monospace; letter-spacing:.16em; white-space:nowrap; }
.marquee-track { display:flex; width:max-content; animation:marquee 24s linear infinite; will-change:transform; }
.marquee span { padding-right:2rem; }
.artist-link { color:inherit; }
.artist-link:hover { color:var(--white); }
@keyframes marquee { to { transform:translateX(-25%); } }
.section { padding:clamp(6rem,12vw,12rem) var(--gutter); }
.info { min-height:80svh; border-bottom:1px solid var(--line); }
.info h2,.section-heading h2 { max-width:780px; font-size:clamp(3.2rem,8vw,8.5rem); line-height:.86; letter-spacing:-.08em; font-weight:700; text-transform:uppercase; }
.info-grid { margin-top:8rem; display:grid; grid-template-columns:1fr 1fr; gap:2rem; color:var(--grey); }
.info-grid>p { max-width:16rem; font-size:1.1rem; }
.info-note { margin:1.2rem 0 0; color:var(--grey); font:.62rem/1.5 'IBM Plex Mono',monospace; }
dl { margin:0; }
.info-grid dl { border-top:1px solid var(--line); }
.info-grid dl div { display:flex; justify-content:space-between; gap:1rem; padding:.9rem 0; border-bottom:1px solid var(--line); font:.72rem 'IBM Plex Mono',monospace; }
dt { color:var(--grey); text-transform:uppercase; } dd { margin:0; color:var(--white); text-align:right; }
.section-heading { margin-bottom:3rem; }
.section-heading h2 { font-size:clamp(3rem,7vw,7rem); margin-bottom:0; }
.sound { border-bottom:1px solid var(--line); display:grid; grid-template-columns:1fr 1fr; gap:2rem; align-items:end; }
.sound h2 { margin:0; font-size:clamp(3rem,7vw,7rem); line-height:.86; letter-spacing:-.08em; text-transform:uppercase; }
.sound-subtitle { margin:1.5rem 0 0; color:var(--grey); font:500 .72rem 'IBM Plex Mono',monospace; letter-spacing:.18em; text-transform:uppercase; }
.sound-subtitle a:hover { color:var(--white); }
.spotify-embed { width:100%; height:520px; border:0; border-radius:12px; background:#121212; }
.tickets { background:var(--white); color:var(--black); }
.tickets .eyebrow,.tickets .card-label,.tickets .mini-label { color:#686868; }
.tickets-layout { display:grid; grid-template-columns:1.35fr .65fr; gap:1px; background:#aaa; border:1px solid #aaa; }
.ticket-list { display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:#aaa; }
.ticket-card { border:0; background:var(--white); color:var(--black); text-align:left; padding:1.5rem; min-height:11rem; transition:background .2s,color .2s; }
.ticket-card:hover,.ticket-card.is-selected { background:var(--black); color:var(--white); }
.ticket-card__head { display:flex; justify-content:space-between; gap:1rem; }
.ticket-card__title { margin:0; font-size:1.6rem; letter-spacing:-.06em; }
.ticket-price { font:1rem 'IBM Plex Mono',monospace; }
.ticket-copy { margin:1rem 0 0; color:#686868; font-size:.8rem; }
.ticket-card.is-selected .ticket-copy,.ticket-card:hover .ticket-copy { color:#aaa; }
.checkout-panel { background:var(--black); color:var(--white); padding:1.5rem; display:flex; flex-direction:column; justify-content:space-between; min-height:100%; }
.checkout-panel h3 { margin:0 0 .5rem; font-size:2rem; }
.checkout-panel__head>p:last-child { color:var(--grey); font-size:.85rem; }
.checkout-panel__copy { color:var(--grey); font-size:.85rem; line-height:1.5; }
.checkout-button { width:100%; background:var(--white); color:var(--black); }
.checkout-button:hover { background:transparent; color:var(--white); }
.checkout-button:disabled { cursor:not-allowed; opacity:.45; }
.checkout-status { color:var(--grey); font:.65rem/1.5 'IBM Plex Mono',monospace; }
.checkout-status { min-height:1.4rem; margin:1rem 0 0; }
.checkout-status[data-tone='error'] { color:#f26b6b; }
.checkout-status[data-tone='success'] { color:#a8e0a8; }
.site-footer { display:flex; justify-content:space-between; gap:1rem; padding:1.2rem var(--gutter); color:var(--grey); font:.64rem 'IBM Plex Mono',monospace; text-transform:uppercase; }
.site-footer p { margin:0; }
.lightout-mode { --black:#080808; --white:#e8e8e4; --grey:#777; }
.lightout-mode .tickets { background:#e8e8e4; }
[data-reveal] { opacity:0; transform:translateY(18px); transition:opacity .8s ease,transform .8s ease; }
[data-reveal].is-visible { opacity:1; transform:none; }
@media (min-width:1400px) { .info { max-width:1600px; margin:0 auto; } .info h2 { max-width:900px; font-size:clamp(3.2rem,5vw,6rem); } }
@media (max-width:760px) { .topbar { grid-template-columns:1fr auto; } .topnav { display:none; } .hero { padding-top:5rem; } .hero-art { min-height:56svh; } .hero-bottom,.info-grid,.sound,.tickets-layout,.ticket-list { grid-template-columns:1fr; } .hero-copy { justify-self:start; } .info-grid { margin-top:4rem; } .site-footer { flex-direction:column; } .countdown { bottom:1rem; } .countdown strong { font-size:clamp(1.35rem,8vw,2.8rem); letter-spacing:-.09em; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } .marquee-track { animation-play-state:paused; } [data-reveal] { opacity:1; transform:none; transition:none; } }