
:root{
  --bg:#030308;--text:#f6f5fa;--muted:#9996a8;--line:rgba(255,255,255,.08);
  --violet:#7838ff;--magenta:#ff29ca;--blue:#397dff;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--bg)}
body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;overflow-x:hidden}
a{color:inherit;text-decoration:none}button,input{font:inherit}button{color:inherit}img{max-width:100%}
.fx{position:fixed;inset:0;pointer-events:none;z-index:0;overflow:hidden}
.orb{position:absolute;border-radius:50%;filter:blur(95px);opacity:.15;animation:float 18s ease-in-out infinite alternate}
.o1{width:44vw;height:44vw;left:-18vw;top:8vh;background:radial-gradient(circle,var(--magenta),transparent 70%)}
.o2{width:48vw;height:48vw;right:-19vw;top:20vh;background:radial-gradient(circle,var(--blue),transparent 70%);animation-delay:-6s}
.o3{width:35vw;height:35vw;left:35vw;bottom:-14vh;background:radial-gradient(circle,var(--violet),transparent 70%);animation-delay:-10s}
.topbar{position:fixed;top:0;left:0;right:0;z-index:50;display:flex;align-items:center;justify-content:space-between;padding:18px max(20px,env(safe-area-inset-left));border-bottom:1px solid transparent;transition:.3s}
.topbar.scrolled{background:rgba(3,3,8,.72);backdrop-filter:blur(16px);border-color:var(--line)}
.brand{display:flex;flex-direction:column;line-height:.84}.brand span{font-weight:950;letter-spacing:.18em;font-size:.86rem}.brand small{font-weight:800;letter-spacing:.34em;color:#c5b8f5;font-size:.52rem}
.topbar nav{display:flex;gap:22px}.topbar nav a{font-size:.66rem;letter-spacing:.17em;font-weight:850;color:#c3c0cd}
main,.footer{position:relative;z-index:2}
.hero{min-height:72svh;display:grid;place-items:center;padding:120px 20px 64px;text-align:center}
.hero-inner{width:min(1080px,100%)}
.eyebrow{font-size:.65rem;letter-spacing:.34em;color:#b6a9d8;font-weight:850}
.hero h1{margin:14px 0 0;font-size:clamp(3rem,8vw,7rem);line-height:.92;letter-spacing:-.055em;font-weight:950}
.hero>div>p:last-of-type{color:var(--muted)}
.search-shell{margin:40px auto 0;width:min(900px,100%)}
.search-trigger{width:100%;display:grid;grid-template-columns:34px 1fr 34px;align-items:center;gap:10px;padding:16px 18px;border-radius:20px;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.035);backdrop-filter:blur(14px);cursor:pointer;text-align:left}
.search-label{font-size:.78rem;letter-spacing:.09em;color:#d7d3de}.search-icon,.filter-icon{font-size:1.05rem;color:#b9b4c2}.filter-icon{text-align:right}
.search-panel{margin-top:10px;padding:14px 16px;border-radius:22px;border:1px solid rgba(255,255,255,.09);background:rgba(8,8,14,.88);backdrop-filter:blur(18px);box-shadow:0 18px 60px rgba(0,0,0,.35)}
.search-panel[hidden]{display:none}
.search-input-wrap{display:flex;align-items:center;gap:10px;padding-bottom:13px}.search-input-wrap input{width:100%;border:0;outline:0;background:transparent;color:#fff;font-size:.88rem}.search-input-wrap input::placeholder{color:#777382}
.filter-row{display:grid;grid-template-columns:78px minmax(0,1fr);gap:12px;align-items:center;padding:12px 0;border-top:1px solid var(--line)}
.filter-name{font-size:.62rem;letter-spacing:.18em;font-weight:850;color:#8e8999;text-align:left}
.chips{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none}.chips::-webkit-scrollbar{display:none}
.chip{flex:0 0 auto;border:1px solid rgba(255,255,255,.09);background:rgba(255,255,255,.025);border-radius:999px;padding:9px 13px;font-size:.66rem;letter-spacing:.08em;font-weight:850;cursor:pointer}
.chip.is-active{background:linear-gradient(135deg,rgba(120,56,255,.28),rgba(255,41,202,.14));border-color:rgba(255,255,255,.28);box-shadow:0 0 22px rgba(120,56,255,.14)}
.section{width:min(1560px,calc(100% - 36px));margin:0 auto;padding:64px 0}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:22px}.section-kicker{font-size:.62rem;letter-spacing:.28em;color:#8d879c;font-weight:850}.section-head h2{margin:6px 0 0;font-size:clamp(1.7rem,4vw,3.1rem);letter-spacing:-.03em}.section-count{font-size:.66rem;letter-spacing:.15em;color:#878292}
.events-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px}
.event-card{min-width:0}.event-card.is-hidden{display:none}
.event-open{display:block;width:100%;padding:0;border:0;background:transparent;text-align:left;cursor:pointer}
.event-media{
  position:relative;
  width:100%;
  aspect-ratio:16/9;
  border-radius:24px;
  overflow:hidden;
  background:#060609;
  border:1px solid rgba(255,255,255,.06);
}
.event-media img{
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
  display:block;
  background:#050508;
  transition:transform .35s ease;
}
.event-card:hover .event-media img{transform:scale(1.01)}
.event-badge,.featured-mark{position:absolute;top:14px;padding:8px 10px;border-radius:999px;font-size:.57rem;font-weight:950;letter-spacing:.1em;background:rgba(5,5,9,.78);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.12)}
.event-badge{right:14px}.featured-mark{left:14px;box-shadow:0 0 20px rgba(255,189,106,.15)}
.badge-latino{box-shadow:0 0 20px rgba(255,41,202,.2)}.badge-non_latino{box-shadow:0 0 20px rgba(57,125,255,.2)}.badge-misto{box-shadow:0 0 20px rgba(120,56,255,.22)}
.event-info{padding:14px 2px 0}.event-date{font-size:.67rem;letter-spacing:.18em;color:#c7baf0;font-weight:850}.event-info h3{margin:6px 0 4px;font-size:clamp(1.05rem,2vw,1.35rem)}.event-info p{margin:0;color:#9995a4;font-size:.78rem;letter-spacing:.08em;text-transform:uppercase}
.venue-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.venue-card{border:0;background:transparent;padding:0;text-align:left;cursor:pointer}.venue-media{aspect-ratio:16/9;position:relative;border-radius:22px;overflow:hidden;background:linear-gradient(135deg,#151025,#090b14)}.venue-media img{width:100%;height:100%;object-fit:cover}.venue-media .venue-logo{object-fit:contain;padding:42px}.venue-fallback{width:100%;height:100%;display:grid;place-items:center;font-size:5rem;font-weight:950;color:#dbd4ec;background:radial-gradient(circle at 50% 40%,rgba(120,56,255,.28),transparent 55%)}
.venue-info{padding:14px 2px}.venue-info h3{margin:0;font-size:1.15rem}.venue-info p{margin:4px 0;color:#aaa5b5}.venue-info span{font-size:.68rem;color:#797483;letter-spacing:.11em;text-transform:uppercase}
.no-results,.no-events{text-align:center;padding:100px 20px}.no-results span,.no-events span{font-size:.64rem;letter-spacing:.27em;color:#908a9c;font-weight:850}.no-results h3,.no-events h3{margin:12px 0;font-size:clamp(2rem,6vw,5rem);line-height:.92}.no-results p{color:#8d8897}
.footer{width:min(1560px,calc(100% - 36px));margin:36px auto 0;padding:32px 0 calc(32px + env(safe-area-inset-bottom));border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:20px;align-items:center}.footer-brand{font-weight:950;letter-spacing:.18em}.footer-links{display:flex;gap:18px;flex-wrap:wrap;font-size:.65rem;letter-spacing:.11em;color:#8d8996}
.modal{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:20px}.modal[hidden]{display:none}.modal-bg{position:absolute;inset:0;background:rgba(0,0,0,.94);backdrop-filter:blur(8px)}.modal figure{position:relative;z-index:2;margin:0;display:grid;place-items:center;gap:12px;max-width:min(96vw,1600px);max-height:94svh}.modal figure img{max-width:100%;max-height:84svh;object-fit:contain}.modal figcaption{text-align:center;display:flex;flex-direction:column;gap:4px}.modal figcaption strong{font-size:1rem}.modal figcaption span{font-size:.7rem;letter-spacing:.12em;color:#a9a4b4;text-transform:uppercase}.modal-close{position:fixed;top:max(18px,env(safe-area-inset-top));right:18px;z-index:3;width:48px;height:48px;border-radius:50%;border:1px solid rgba(255,255,255,.14);background:rgba(12,12,18,.66);font-size:1.7rem;cursor:pointer}
@keyframes float{from{transform:translate3d(-2vw,-1vh,0)}to{transform:translate3d(3vw,3vh,0)}}
@media(min-width:1700px){.events-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px}.event-media{min-height:0}}
@media(max-width:980px){.events-grid{grid-template-columns:1fr}.venue-grid{grid-template-columns:repeat(2,1fr)}.section{width:min(100% - 28px,1200px)}}
@media(max-width:700px){
  .topbar{padding:15px}.topbar nav{gap:12px}.topbar nav a{font-size:.55rem}.topbar nav a:last-child{display:none}
  .hero{min-height:auto;padding:96px 12px 42px}.hero h1{font-size:clamp(2.6rem,14vw,4rem)}
  .search-shell{margin-top:28px}.search-trigger{padding:14px 15px;border-radius:18px}
  .search-label{font-size:.68rem}
  .filter-row{grid-template-columns:1fr;gap:8px}.chips{margin-right:-10px;padding-right:10px}
  .section{width:calc(100% - 24px);padding:46px 0}.section-head{align-items:start;flex-direction:column;gap:8px}.section-count{display:none}
  .events-grid{grid-template-columns:1fr;gap:28px}
  .event-media{aspect-ratio:16/9;border-radius:18px}
  .venue-grid{grid-template-columns:1fr 1fr;gap:12px}.venue-media{aspect-ratio:1/1}
  .footer{width:calc(100% - 24px);align-items:flex-start;flex-direction:column}
  .orb{filter:blur(72px);opacity:.11}
}
@media(max-width:390px){.venue-grid{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}


/* V5 — Nightshot seamless carousel */
.events-section{
  background:transparent !important;
  box-shadow:none !important;
}
.events-carousel-shell{
  position:relative;
  display:grid;
  grid-template-columns:56px minmax(0,1fr) 56px;
  gap:10px;
  align-items:center;
}
.events-carousel-viewport{
  position:relative;
  height:min(66vw,690px);
  min-height:430px;
  perspective:1700px;
  overflow:visible;
}
.events-carousel{
  position:absolute;
  inset:0;
  margin:auto;
  width:min(68vw,820px);
  transform-style:preserve-3d;
  touch-action:pan-y;
}
.event-card{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  background:transparent !important;
  transition:
    transform .72s cubic-bezier(.2,.76,.18,1),
    opacity .5s ease,
    filter .5s ease;
  transform-origin:center center;
  will-change:transform,opacity;
}
.event-card.is-hidden{
  display:none !important;
}
.event-open{
  width:100%;
  height:100%;
  display:flex;
  flex-direction:column;
  justify-content:center;
  background:transparent !important;
}
.event-media{
  width:100%;
  aspect-ratio:16/9;
  border-radius:22px;
  overflow:hidden;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  display:grid;
  place-items:center;
}
.event-media img{
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
  display:block;
  background:transparent !important;
  border-radius:18px;
  box-shadow:0 26px 90px rgba(0,0,0,.42);
}
.event-card.is-active .event-media img{
  box-shadow:
    0 28px 100px rgba(0,0,0,.5),
    0 0 46px rgba(120,56,255,.10);
}
.event-info{
  padding:14px 4px 0;
  text-align:center;
  background:transparent !important;
}
.carousel-nav{
  width:46px;
  height:46px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(3,3,8,.36);
  color:#fff;
  font-size:1.8rem;
  line-height:1;
  display:grid;
  place-items:center;
  cursor:pointer;
  backdrop-filter:blur(10px);
  z-index:10;
}
.carousel-nav:hover{
  background:rgba(255,255,255,.06);
  border-color:rgba(255,255,255,.28);
}
.carousel-dots{
  display:flex;
  justify-content:center;
  gap:8px;
  margin-top:18px;
}
.carousel-dots button{
  width:7px;
  height:7px;
  padding:0;
  border:0;
  border-radius:50%;
  background:#55515f;
  cursor:pointer;
}
.carousel-dots button.is-active{
  background:#fff;
  transform:scale(1.35);
}
@media(max-width:980px){
  .events-carousel-shell{
    grid-template-columns:46px minmax(0,1fr) 46px;
  }
  .events-carousel{
    width:min(82vw,720px);
  }
  .events-carousel-viewport{
    height:min(78vw,620px);
  }
}
@media(max-width:700px){
  .events-carousel-shell{
    grid-template-columns:1fr;
  }
  .events-carousel-viewport{
    height:62svh;
    min-height:430px;
  }
  .events-carousel{
    width:min(88vw,620px);
  }
  .carousel-nav{
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    width:42px;
    height:42px;
    z-index:20;
  }
  .carousel-prev{left:4px}
  .carousel-next{right:4px}
  .event-media{
    aspect-ratio:16/9;
    border-radius:18px;
  }
  .event-media img{
    border-radius:14px;
  }
  .event-info{
    padding-inline:18px;
  }
}


/* V6 — suggerimenti città nel motore di ricerca */
.city-suggestions{
  margin:-2px 0 10px;
  padding:10px 0 12px;
  border-top:1px solid var(--line);
}
.city-suggestions[hidden]{display:none}
.suggestions-label{
  display:block;
  padding:0 2px 8px;
  font-size:.58rem;
  letter-spacing:.18em;
  font-weight:850;
  color:#7f7a8a;
  text-align:left;
}
.suggestions-list{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.city-suggestion{
  display:inline-flex;
  align-items:center;
  gap:7px;
  border:1px solid rgba(255,255,255,.09);
  background:rgba(255,255,255,.025);
  border-radius:999px;
  padding:9px 12px;
  font-size:.68rem;
  font-weight:800;
  letter-spacing:.05em;
  cursor:pointer;
  transition:.2s;
}
.city-suggestion:hover,
.city-suggestion.is-match{
  border-color:rgba(255,255,255,.25);
  background:linear-gradient(135deg,rgba(120,56,255,.22),rgba(255,41,202,.10));
  box-shadow:0 0 20px rgba(120,56,255,.10);
}
.city-pin{color:#c6b8ef}
@media(max-width:700px){
  .suggestions-list{
    flex-wrap:nowrap;
    overflow-x:auto;
    scrollbar-width:none;
    margin-right:-10px;
    padding-right:10px;
  }
  .suggestions-list::-webkit-scrollbar{display:none}
  .city-suggestion{flex:0 0 auto}
}


/* =========================================================
   V7 — NIGHTSHOT PREMIUM CLUB ATMOSPHERE
   CSS-only: no generated/static background image required.
   ========================================================= */

:root{
  --club-bg-0:#020207;
  --club-bg-1:#050615;
  --club-bg-2:#0b0717;
  --club-pink:#ff2fcf;
  --club-violet:#7a36ff;
  --club-blue:#2f7cff;
  --club-cyan:#33d7ff;
}

/* One continuous scene for the whole site */
html,
body{
  background:
    radial-gradient(1200px 720px at 50% 12%, rgba(95,28,180,.14), transparent 68%),
    radial-gradient(900px 520px at 12% 36%, rgba(255,47,207,.10), transparent 70%),
    radial-gradient(900px 560px at 90% 42%, rgba(47,124,255,.10), transparent 72%),
    linear-gradient(180deg,var(--club-bg-1) 0%,var(--club-bg-0) 35%,#03030a 68%,#020207 100%) !important;
}

main,
.hero,
.section,
.events-section,
.venues,
.footer{
  background:transparent !important;
}

/* Cinematic ambient layer */
.fx{
  z-index:0;
  isolation:isolate;
}

.fx::before{
  content:"";
  position:absolute;
  inset:-12%;
  background:
    radial-gradient(circle at 50% 26%, rgba(255,255,255,.035), transparent 24%),
    radial-gradient(circle at 38% 16%, rgba(255,47,207,.12), transparent 22%),
    radial-gradient(circle at 64% 18%, rgba(47,124,255,.11), transparent 26%);
  filter:blur(28px);
  opacity:.95;
  animation:atmosphereDrift 20s ease-in-out infinite alternate;
}

.fx::after{
  content:"";
  position:absolute;
  left:-10%;
  right:-10%;
  top:16%;
  height:52%;
  background:
    linear-gradient(112deg, transparent 0 31%, rgba(255,47,207,.055) 34%, transparent 38%),
    linear-gradient(67deg, transparent 0 52%, rgba(47,124,255,.05) 55%, transparent 59%),
    linear-gradient(96deg, transparent 0 65%, rgba(122,54,255,.04) 68%, transparent 72%);
  filter:blur(14px);
  opacity:.9;
  transform:perspective(800px) rotateX(8deg);
  mix-blend-mode:screen;
}

.orb{
  opacity:.20;
  filter:blur(110px);
  mix-blend-mode:screen;
}

.o1{
  width:54vw;height:54vw;
  left:-19vw;top:-2vh;
  background:radial-gradient(circle,rgba(255,47,207,.95) 0%,rgba(255,47,207,.45) 24%,transparent 68%);
}
.o2{
  width:58vw;height:58vw;
  right:-22vw;top:8vh;
  background:radial-gradient(circle,rgba(47,124,255,.90) 0%,rgba(47,124,255,.42) 26%,transparent 70%);
}
.o3{
  width:40vw;height:40vw;
  left:31vw;bottom:-10vh;
  background:radial-gradient(circle,rgba(122,54,255,.82) 0%,rgba(122,54,255,.36) 28%,transparent 70%);
}

/* Soft diagonal stage beams */
.beam{
  position:absolute;
  top:-12%;
  width:9vw;
  height:88vh;
  opacity:.15;
  filter:blur(12px);
  transform-origin:50% 0;
  mix-blend-mode:screen;
}
.beam::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(255,255,255,.55),rgba(255,255,255,.08) 45%,transparent 86%);
  clip-path:polygon(44% 0,56% 0,100% 100%,0 100%);
}
.beam-a{left:18%;transform:rotate(18deg);animation:beamSweepA 12s ease-in-out infinite alternate}
.beam-b{right:18%;transform:rotate(-16deg);animation:beamSweepB 14s ease-in-out infinite alternate}
.beam-c{left:48%;width:7vw;opacity:.09;transform:rotate(3deg);animation:beamPulse 8s ease-in-out infinite}
.beam-a::after{filter:drop-shadow(0 0 18px rgba(255,47,207,.8))}
.beam-b::after{filter:drop-shadow(0 0 18px rgba(47,124,255,.8))}
.beam-c::after{filter:drop-shadow(0 0 15px rgba(122,54,255,.7))}

/* Haze layers */
.haze{
  position:absolute;
  width:70vw;
  height:28vh;
  border-radius:50%;
  filter:blur(75px);
  opacity:.12;
  mix-blend-mode:screen;
}
.haze-a{
  left:-8vw;top:29vh;
  background:radial-gradient(ellipse at center,rgba(255,47,207,.75),transparent 68%);
  animation:hazeFloat 16s ease-in-out infinite alternate;
}
.haze-b{
  right:-9vw;top:37vh;
  background:radial-gradient(ellipse at center,rgba(47,124,255,.72),transparent 68%);
  animation:hazeFloat 18s ease-in-out infinite alternate-reverse;
}

/* Futuristic geometric accents */
.geo{
  position:absolute;
  width:30px;height:30px;
  border:1px solid rgba(255,255,255,.18);
  box-shadow:
    0 0 16px rgba(122,54,255,.15),
    inset 0 0 10px rgba(255,255,255,.03);
  clip-path:polygon(25% 6%,75% 6%,100% 50%,75% 94%,25% 94%,0 50%);
  opacity:.28;
  mix-blend-mode:screen;
}
.geo-a{left:10%;top:21%;transform:rotate(18deg);animation:geoFloat 9s ease-in-out infinite alternate}
.geo-b{right:12%;top:28%;width:20px;height:20px;animation:geoFloat 12s ease-in-out infinite alternate-reverse}
.geo-c{right:24%;top:15%;width:14px;height:14px;opacity:.18;animation:geoFloat 8s ease-in-out infinite}

/* Tiny light field */
.spark-field{
  position:absolute;
  width:42vw;height:36vh;
  opacity:.11;
  background-image:
    radial-gradient(circle,rgba(255,255,255,.85) 0 1px,transparent 1.4px),
    radial-gradient(circle,rgba(255,47,207,.8) 0 1px,transparent 1.5px),
    radial-gradient(circle,rgba(47,124,255,.75) 0 1px,transparent 1.5px);
  background-size:73px 73px,109px 109px,137px 137px;
  background-position:0 0,20px 35px,60px 14px;
  filter:drop-shadow(0 0 6px rgba(255,255,255,.28));
  animation:sparkDrift 22s linear infinite;
}
.spark-a{left:0;top:10%}
.spark-b{right:0;top:24%;animation-direction:reverse}

/* Abstract crowd silhouettes, CSS-only */
.crowd{
  position:absolute;
  bottom:-2vh;
  width:46vw;
  height:28vh;
  opacity:.30;
  filter:blur(.2px);
  background:
    radial-gradient(ellipse at 8% 74%, #05050a 0 7%, transparent 7.5%),
    radial-gradient(ellipse at 18% 69%, #05050a 0 8%, transparent 8.5%),
    radial-gradient(ellipse at 29% 77%, #05050a 0 9%, transparent 9.5%),
    radial-gradient(ellipse at 42% 66%, #05050a 0 8%, transparent 8.5%),
    radial-gradient(ellipse at 56% 74%, #05050a 0 9%, transparent 9.5%),
    radial-gradient(ellipse at 70% 67%, #05050a 0 8%, transparent 8.5%),
    radial-gradient(ellipse at 84% 75%, #05050a 0 9%, transparent 9.5%),
    linear-gradient(to top,#020207 0 42%,transparent 43%);
}
.crowd-left{left:-6vw;transform:scaleX(1.08)}
.crowd-right{right:-6vw;transform:scaleX(-1.08)}

/* Vignette + grain */
.vignette{
  position:absolute;
  inset:0;
  box-shadow:
    inset 0 0 170px rgba(0,0,0,.82),
    inset 0 -140px 180px rgba(0,0,0,.72);
}
.grain{
  position:absolute;
  inset:0;
  opacity:.035;
  background-image:
    radial-gradient(circle at 20% 30%,rgba(255,255,255,.7) 0 .45px,transparent .5px),
    radial-gradient(circle at 70% 50%,rgba(255,255,255,.5) 0 .45px,transparent .5px),
    radial-gradient(circle at 40% 80%,rgba(255,255,255,.45) 0 .4px,transparent .45px);
  background-size:4px 4px,6px 6px,5px 5px;
  mix-blend-mode:soft-light;
}

/* Hero integrated in the nightclub atmosphere */
.hero{
  min-height:86svh !important;
  padding-top:126px !important;
  position:relative;
  overflow:visible;
}
.hero::before{
  content:"";
  position:absolute;
  left:50%;
  top:38%;
  width:min(880px,88vw);
  height:min(420px,48vw);
  transform:translate(-50%,-50%);
  background:
    radial-gradient(ellipse at center,rgba(255,47,207,.14),transparent 44%),
    radial-gradient(ellipse at 65% 55%,rgba(47,124,255,.10),transparent 48%);
  filter:blur(28px);
  pointer-events:none;
}
.hero-inner{
  position:relative;
  z-index:3;
}
.hero h1{
  margin:12px 0 0 !important;
  line-height:.82 !important;
}
.hero h1 span,
.hero h1 strong{
  display:block;
}
.hero h1 span{
  font-size:clamp(3.15rem,9vw,7.8rem);
  font-weight:950;
  letter-spacing:-.055em;
  color:#fff;
  text-shadow:0 0 34px rgba(255,255,255,.08);
}
.hero h1 strong{
  margin-top:.06em;
  font-size:clamp(3.45rem,9.8vw,8.6rem);
  font-weight:950;
  letter-spacing:.04em;
  color:transparent;
  -webkit-text-stroke:1px rgba(255,255,255,.86);
  text-shadow:
    0 0 20px rgba(255,47,207,.16),
    0 0 52px rgba(122,54,255,.12);
}
.hero-subtitle{
  margin:24px 0 0;
  font-size:clamp(.78rem,1.7vw,1rem);
  letter-spacing:.30em;
  font-weight:900;
  color:#f2edf8;
}
.hero-copy{
  margin:10px 0 0;
  color:#aaa5b3;
  font-size:clamp(.92rem,1.8vw,1.06rem);
}

/* Search: floating neon glass, still hidden until clicked */
.search-shell{
  position:relative;
  z-index:6;
}
.search-trigger{
  border:1px solid rgba(255,255,255,.16) !important;
  background:
    linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.022)) !important;
  box-shadow:
    0 18px 55px rgba(0,0,0,.25),
    0 0 0 1px rgba(255,47,207,.035),
    0 0 34px rgba(122,54,255,.08);
  backdrop-filter:blur(16px) saturate(1.12);
}
.search-trigger:hover{
  border-color:rgba(255,255,255,.28) !important;
  box-shadow:
    0 18px 55px rgba(0,0,0,.28),
    0 0 40px rgba(255,47,207,.10);
}
.search-panel{
  background:
    linear-gradient(180deg,rgba(7,7,17,.80),rgba(3,3,10,.74)) !important;
  border:1px solid rgba(255,255,255,.13) !important;
  box-shadow:
    0 26px 80px rgba(0,0,0,.48),
    0 0 44px rgba(122,54,255,.08);
  backdrop-filter:blur(22px) saturate(1.08);
}

/* Flyer carousel suspended directly inside the scene */
.events-carousel-shell,
.events-carousel-viewport,
.events-carousel,
.event-card,
.event-open,
.event-media,
.event-info{
  background:transparent !important;
}
.event-media{
  box-shadow:none !important;
}
.event-media img{
  background:transparent !important;
  box-shadow:
    0 32px 110px rgba(0,0,0,.46) !important;
}
.event-card.is-active .event-media img{
  box-shadow:
    0 34px 120px rgba(0,0,0,.56),
    0 0 52px rgba(255,47,207,.12),
    0 0 88px rgba(122,54,255,.09) !important;
}

/* Venue section also blends into same scene */
.venue-card,
.venue-media,
.venue-info{
  background:transparent !important;
}
.venue-media{
  border:1px solid rgba(255,255,255,.06);
  box-shadow:0 22px 70px rgba(0,0,0,.24);
}
.venue-card:hover .venue-media{
  border-color:rgba(255,255,255,.12);
  box-shadow:
    0 24px 80px rgba(0,0,0,.32),
    0 0 32px rgba(122,54,255,.07);
}

/* Transparent header + translucent on scroll */
.topbar{
  background:transparent !important;
}
.topbar.scrolled{
  background:rgba(2,2,8,.55) !important;
  backdrop-filter:blur(16px) saturate(1.05);
}

/* subtle depth/parallax hooks */
.fx{
  --px:0px;
  --py:0px;
}
.fx::before{
  transform:translate3d(var(--px),var(--py),0);
}

/* Motion */
@keyframes atmosphereDrift{
  from{transform:translate3d(-1.5vw,-1vh,0) scale(1)}
  to{transform:translate3d(2vw,2vh,0) scale(1.04)}
}
@keyframes beamSweepA{
  from{transform:rotate(13deg) translateX(-1vw)}
  to{transform:rotate(22deg) translateX(1.5vw)}
}
@keyframes beamSweepB{
  from{transform:rotate(-12deg) translateX(1vw)}
  to{transform:rotate(-21deg) translateX(-1.5vw)}
}
@keyframes beamPulse{
  0%,100%{opacity:.05}
  50%{opacity:.13}
}
@keyframes hazeFloat{
  from{transform:translate3d(-2vw,-1vh,0) scale(1)}
  to{transform:translate3d(3vw,1vh,0) scale(1.06)}
}
@keyframes geoFloat{
  from{transform:translate3d(0,0,0) rotate(0)}
  to{transform:translate3d(1.4vw,-1.2vh,0) rotate(12deg)}
}
@keyframes sparkDrift{
  from{transform:translate3d(0,0,0)}
  to{transform:translate3d(22px,-18px,0)}
}

/* Tablet */
@media (max-width:1024px){
  .beam{opacity:.10}
  .spark-field{opacity:.075}
  .crowd{opacity:.22}
  .hero{min-height:78svh !important}
  .hero h1 span{font-size:clamp(3rem,10vw,6.4rem)}
  .hero h1 strong{font-size:clamp(3.3rem,11vw,7rem)}
}

/* Mobile optimization: same look, lighter rendering */
@media (max-width:700px){
  .orb{
    filter:blur(72px);
    opacity:.13;
  }
  .o3{display:none}
  .beam{
    width:15vw;
    height:66vh;
    opacity:.075;
    filter:blur(10px);
  }
  .beam-c{display:none}
  .haze{
    width:95vw;
    height:22vh;
    filter:blur(55px);
    opacity:.08;
  }
  .spark-field{
    opacity:.045;
    width:70vw;
  }
  .geo{
    opacity:.16;
  }
  .geo-c{display:none}
  .crowd{
    width:72vw;
    height:20vh;
    opacity:.17;
  }
  .vignette{
    box-shadow:
      inset 0 0 90px rgba(0,0,0,.70),
      inset 0 -100px 130px rgba(0,0,0,.64);
  }
  .hero{
    min-height:72svh !important;
    padding-top:104px !important;
  }
  .hero h1 span{
    font-size:clamp(2.8rem,14vw,4.3rem);
  }
  .hero h1 strong{
    font-size:clamp(3rem,15vw,4.7rem);
  }
  .hero-subtitle{
    letter-spacing:.20em;
  }
  .search-trigger{
    backdrop-filter:blur(12px);
  }
  .search-panel{
    backdrop-filter:blur(14px);
  }
}

/* Reduced motion */
@media (prefers-reduced-motion:reduce){
  .fx *,
  .fx::before,
  .fx::after{
    animation:none !important;
    transition:none !important;
    transform:none !important;
  }
  .event-card,
  .event-media img{
    transition:none !important;
  }
}
