/* NIGHTSHOT V1.4 — desktop/tablet layout correction
   Keeps the mobile layout intact and removes the oversized, stretched desktop composition. */

@media (min-width: 761px){
  html,body{overflow-x:hidden!important}

  /* Header: stable geometry, no cut navigation, no overlap with search */
  .ns-global-header{
    padding:12px clamp(18px,2.2vw,36px) 11px!important;
  }
  .ns-global-header-spacer{height:82px!important}
  .ns-global-row{
    max-width:1440px!important;
    gap:22px!important;
  }
  .ns-global-brand span{font-size:.82rem!important}
  .ns-global-search{height:42px!important}
  .ns-global-search input{font-size:.82rem!important}
  .ns-global-nav{
    max-width:1440px!important;
    gap:clamp(14px,1.6vw,24px)!important;
  }

  /* The hero should look editorial, not like a full-screen purple landing page. */
  body{
    background:#030308!important;
  }
  .fx{
    opacity:.42!important;
  }
  .hero{
    min-height:0!important;
    height:auto!important;
    display:block!important;
    padding:clamp(64px,7vw,100px) 0 clamp(54px,6vw,82px)!important;
    background:
      radial-gradient(circle at 50% 22%,rgba(130,59,255,.16),transparent 38%),
      radial-gradient(circle at 78% 38%,rgba(255,41,202,.08),transparent 32%),
      #030308!important;
    border-bottom:1px solid rgba(255,255,255,.055);
  }
  .hero::after{display:none!important}
  .hero-stage-lights{opacity:.20!important}
  .stage-light{height:82%!important;opacity:.10!important;filter:blur(24px)!important}
  .hero-inner{
    width:min(1180px,calc(100% - 64px))!important;
    max-width:1180px!important;
    margin:0 auto!important;
    padding:0!important;
  }
  .eyebrow{
    margin:0 0 14px!important;
    font-size:.63rem!important;
    letter-spacing:.27em!important;
  }
  .hero h1{
    width:min(900px,100%)!important;
    margin:0!important;
    font-size:clamp(4.25rem,7.4vw,7.35rem)!important;
    line-height:.82!important;
    letter-spacing:-.055em!important;
  }
  .hero h1 span,.hero h1 strong{display:block!important}
  .hero h1 strong{
    color:transparent!important;
    -webkit-text-fill-color:transparent!important;
    -webkit-text-stroke:1px rgba(255,255,255,.62)!important;
    background:none!important;
    filter:none!important;
    letter-spacing:.015em!important;
  }
  .hero-subtitle{
    margin:20px 0 7px!important;
    font-size:clamp(.9rem,1.25vw,1.12rem)!important;
    line-height:1.3!important;
    letter-spacing:.18em!important;
  }
  .hero-copy{
    width:min(620px,100%)!important;
    margin:0!important;
    font-size:.88rem!important;
    line-height:1.65!important;
    color:#aaa5b4!important;
  }

  /* Filters become a compact tool bar under the intro. */
  .search-shell{
    width:min(980px,100%)!important;
    margin:30px 0 0!important;
  }
  .ns-filters-panel,
  .search-panel{
    position:relative!important;
    top:auto!important;
    left:auto!important;
    right:auto!important;
    width:100%!important;
    margin:0!important;
    padding:14px!important;
    border-radius:16px!important;
    background:rgba(7,8,14,.72)!important;
    box-shadow:0 18px 56px rgba(0,0,0,.24)!important;
    backdrop-filter:blur(14px)!important;
  }
  .filters-grid{
    grid-template-columns:minmax(220px,1.25fr) minmax(180px,.8fr) minmax(180px,.8fr)!important;
    gap:12px!important;
    margin-top:0!important;
  }
  .filter-input,.filter-select{
    height:48px!important;
    border-radius:10px!important;
    background:#090a11!important;
  }
  .filter-actions{margin-top:10px!important}

  /* Events live on black, separated clearly from the hero. */
  .events-section{
    width:min(1440px,calc(100% - 64px))!important;
    margin:0 auto!important;
    padding:clamp(54px,5vw,76px) 0 70px!important;
    background:transparent!important;
  }
  .events-section .section-head{
    align-items:flex-end!important;
    margin-bottom:24px!important;
  }
  .events-section .section-head h2{
    margin-top:7px!important;
    font-size:clamp(3.2rem,5.7vw,6.25rem)!important;
    line-height:.84!important;
  }
  .section-count{padding-bottom:8px!important}

  .events-carousel-shell{
    width:100%!important;
    max-width:100%!important;
  }
  .events-carousel-viewport{
    padding:12px 0 28px!important;
    min-height:0!important;
    height:auto!important;
    overflow:hidden!important;
  }
  .events-carousel{
    position:relative!important;
    inset:auto!important;
    width:max-content!important;
    max-width:none!important;
  }
  :root{--ns-card:min(68vw,920px)!important}
  .event-card{
    height:auto!important;
  }
  .event-media{
    aspect-ratio:16/9!important;
    border-radius:22px!important;
    background:#050508!important;
  }
  .event-media img{
    height:100%!important;
    object-fit:contain!important;
    background:#050508!important;
  }
}

/* Desktop: put brand, navigation and search on ONE deliberate row. */
@media (min-width: 1120px){
  .ns-global-header{
    display:grid!important;
    grid-template-columns:minmax(170px,220px) minmax(500px,1fr) minmax(300px,430px)!important;
    grid-template-areas:"brand nav search"!important;
    align-items:center!important;
    column-gap:clamp(20px,2vw,34px)!important;
  }
  .ns-global-row{display:contents!important}
  .ns-global-brand{grid-area:brand!important}
  .ns-global-search{grid-area:search!important;width:100%!important;max-width:430px!important;justify-self:end!important}
  .ns-global-nav{
    grid-area:nav!important;
    margin:0!important;
    padding:0!important;
    justify-content:center!important;
    overflow:visible!important;
    min-width:0!important;
  }
  .ns-global-nav a{
    font-size:.58rem!important;
    letter-spacing:.12em!important;
  }
  .ns-global-header-spacer{height:67px!important}
}

/* Tablet/small laptop: two calm rows instead of trying to squeeze everything. */
@media (min-width:761px) and (max-width:1119px){
  .ns-global-row{
    grid-template-columns:auto minmax(260px,1fr)!important;
  }
  .ns-global-nav{
    justify-content:flex-start!important;
    overflow-x:auto!important;
    margin-top:8px!important;
  }
  .ns-global-header-spacer{height:98px!important}
  .hero-inner{width:min(100% - 44px,980px)!important}
  .hero h1{font-size:clamp(4rem,9.2vw,6.5rem)!important}
  .events-section{width:min(100% - 44px,1180px)!important}
  :root{--ns-card:min(82vw,860px)!important}
}

/* Keep decorative effects behind content and avoid the solid magenta band visible in V1.3. */
@media (min-width:761px){
  .events-carousel-shell::before,
  .events-carousel-shell::after{opacity:.28!important}
  main{background:#030308!important}
}

/* NIGHTSHOT V1.5 — compact hero + clearer empty-state */
@media (min-width: 761px){
  .hero{
    padding:clamp(34px,3.8vw,54px) 0 clamp(28px,3.2vw,44px)!important;
    background:
      radial-gradient(circle at 48% 18%,rgba(130,59,255,.10),transparent 34%),
      radial-gradient(circle at 78% 30%,rgba(255,41,202,.045),transparent 26%),
      #030308!important;
  }
  .hero-stage-lights{opacity:.11!important}
  .hero-copy{margin-bottom:0!important}
  .eyebrow{margin-bottom:8px!important;font-size:.56rem!important}
  .hero h1{
    width:min(760px,100%)!important;
    font-size:clamp(3.3rem,5.6vw,5.6rem)!important;
    line-height:.84!important;
  }
  .hero-subtitle{
    margin:13px 0 5px!important;
    font-size:clamp(.78rem,1vw,.94rem)!important;
    letter-spacing:.14em!important;
  }
  .hero-copy{
    width:min(560px,100%)!important;
    font-size:.8rem!important;
    line-height:1.5!important;
  }
  .search-shell{
    width:min(860px,100%)!important;
    margin:18px 0 0!important;
  }
  .ns-filters-panel,.search-panel{
    padding:10px 12px!important;
    border-radius:14px!important;
  }
  .filters-grid{gap:9px!important}
  .filter-control label{margin-bottom:4px!important;font-size:.52rem!important}
  .filter-input,.filter-select{height:42px!important;font-size:.76rem!important}
  .filter-actions{margin-top:7px!important}
  .filter-reset{min-height:32px!important;font-size:.58rem!important}
  .events-section{padding-top:clamp(32px,3.2vw,48px)!important}
  .events-section .section-head{margin-bottom:14px!important}
  .events-section .section-head h2{font-size:clamp(2.6rem,4.7vw,5rem)!important}
}

.no-results{
  width:min(760px,calc(100% - 24px));
  margin:24px auto 0;
  padding:clamp(26px,4vw,46px);
  border:1px solid rgba(255,255,255,.08);
  border-radius:20px;
  background:linear-gradient(145deg,rgba(255,255,255,.025),rgba(255,255,255,.008));
  text-align:center;
}
.no-results span{display:block;margin-bottom:9px;color:#ff52d2;font-size:.58rem;font-weight:900;letter-spacing:.18em}
.no-results h3{margin:0;color:#fff;font-size:clamp(1.45rem,3vw,2.4rem);line-height:1;letter-spacing:-.035em}
.no-results p{max-width:560px;margin:12px auto 0;color:#aaa5b4;font-size:.84rem;line-height:1.6}
.no-results-reset{margin-top:18px;min-height:42px;padding:0 18px;border:1px solid rgba(255,255,255,.14);border-radius:999px;background:#fff;color:#050508;font-size:.62rem;font-weight:900;letter-spacing:.11em;cursor:pointer}
.events-carousel-shell.is-empty,.carousel-dots.is-empty{display:none!important}

@media (max-width:760px){
  .hero{padding-top:8px!important;padding-bottom:8px!important}
  .hero .eyebrow{margin-bottom:6px!important}
  .hero h1{font-size:clamp(2.15rem,14vw,3.7rem)!important}
  .hero-subtitle{margin:7px 0 3px!important;font-size:.72rem!important}
  .hero-copy{font-size:.76rem!important;line-height:1.45!important;max-width:34rem!important}
  .search-shell{margin-top:8px!important}
  .search-panel{padding:8px!important}
  .filters-grid{gap:6px!important}
  .filter-control label{margin-bottom:3px!important}
  .filter-input,.filter-select{height:42px!important}
  .filter-actions{margin-top:5px!important}
  .no-results{margin-top:12px;padding:24px 16px;border-radius:16px}
  .no-results h3{font-size:1.45rem}
  .no-results p{font-size:.79rem}
}

/* NIGHTSHOT V1.6 — exclusive nightlife direction */
body{background:#020204!important}
.fx{opacity:.34!important;mix-blend-mode:screen;pointer-events:none}

/* Keep colour as light, never as a large purple surface. */
.hero{
  position:relative!important;
  background:
    radial-gradient(ellipse at 18% 10%,rgba(42,88,255,.07),transparent 30%),
    radial-gradient(ellipse at 74% 18%,rgba(255,31,196,.075),transparent 28%),
    radial-gradient(ellipse at 52% 120%,rgba(108,58,255,.055),transparent 34%),
    #020204!important;
  border-bottom:1px solid rgba(255,255,255,.045)!important;
}
.hero::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(110deg,transparent 0 44%,rgba(255,255,255,.012) 50%,transparent 56%);opacity:.65}
.stage-light{opacity:.055!important;filter:blur(34px)!important}
.hero-stage-lights{opacity:.08!important}
.hero-inner{position:relative;z-index:2}
.eyebrow{color:#8d8795!important}
.hero h1 span{color:#fff!important;text-shadow:0 0 34px rgba(255,255,255,.035)}
.hero h1 strong{-webkit-text-stroke:1px rgba(255,255,255,.55)!important;text-shadow:0 0 24px rgba(255,42,203,.045)}
.hero-subtitle{color:#e9e5ec!important}
.hero-copy{color:#8f8998!important}

/* Filter bar = discreet tool, not a visual hero. */
.ns-filters-panel,.search-panel{border-color:rgba(255,255,255,.07)!important;background:linear-gradient(180deg,rgba(255,255,255,.018),rgba(255,255,255,.008)),rgba(4,4,8,.82)!important;box-shadow:0 14px 44px rgba(0,0,0,.25)!important}
.filter-input,.filter-select{border-color:rgba(255,255,255,.07)!important;background:#060609!important}
.filter-input:focus,.filter-select:focus{border-color:rgba(255,42,203,.30)!important;box-shadow:0 0 0 3px rgba(255,42,203,.035)!important}
.filter-reset{border-color:rgba(255,255,255,.09)!important;background:rgba(255,255,255,.035)!important;color:#c9c5ce!important}
.filter-reset:hover{border-color:rgba(255,42,203,.24)!important;color:#fff!important}

.events-section{position:relative;background:#020204!important}
.events-section::before{content:"";position:absolute;left:18%;right:18%;top:-1px;height:1px;background:linear-gradient(90deg,transparent,rgba(255,42,203,.18),rgba(90,103,255,.13),transparent);opacity:.7}
.section-kicker{color:#8e8796!important;letter-spacing:.24em!important}
.events-section .section-head h2{color:#fff!important;letter-spacing:-.055em!important}
.section-count{color:#77727f!important}
.event-card{filter:saturate(.96)}
.event-card .event-media{border:1px solid rgba(255,255,255,.07)!important;box-shadow:0 26px 80px rgba(0,0,0,.36)!important;transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease!important}
.event-card:hover .event-media{transform:translateY(-3px) scale(1.018)!important;border-color:rgba(255,42,203,.17)!important;box-shadow:0 32px 90px rgba(0,0,0,.44),0 0 44px rgba(255,42,203,.045)!important}
.event-info h3{color:#fff!important;letter-spacing:-.035em!important}.event-date{color:#ff59d4!important}.event-info p{color:#9b95a2!important}
.carousel-nav{border-color:rgba(255,255,255,.09)!important;background:rgba(3,3,7,.74)!important;color:#d7d2db!important;backdrop-filter:blur(10px)}
.carousel-nav:hover{border-color:rgba(255,42,203,.27)!important;color:#fff!important}

@media (min-width:761px){
  .hero{padding:clamp(26px,3vw,42px) 0 clamp(22px,2.6vw,34px)!important}
  .hero-inner{width:min(1180px,calc(100% - 64px))!important}
  .hero h1{font-size:clamp(3rem,5vw,5.05rem)!important;width:min(690px,100%)!important}
  .hero-subtitle{margin-top:11px!important}.hero-copy{font-size:.78rem!important;max-width:560px!important}
  .search-shell{margin-top:15px!important;width:min(840px,100%)!important}
  .events-section{padding-top:clamp(28px,3vw,44px)!important}
}

@media (max-width:760px){
  body .hero{padding-top:10px!important;padding-bottom:10px!important;background:radial-gradient(circle at 74% 5%,rgba(255,42,203,.055),transparent 30%),radial-gradient(circle at 14% 20%,rgba(52,87,255,.05),transparent 28%),#020204!important}
  .hero h1{font-size:clamp(2.05rem,13vw,3.45rem)!important}.hero-copy{display:none!important}
  .search-shell{margin-top:7px!important}.events-section{padding-top:24px!important}
  .event-card:hover .event-media{transform:none!important}
}

/* NIGHTSHOT V1.8 — clean, fast home. Events are the product, not the hero. */
@media (min-width:761px){
  .hero{
    padding:clamp(22px,2.2vw,34px) 0 clamp(18px,2vw,30px)!important;
    background:
      radial-gradient(ellipse at 28% 10%,rgba(255,38,202,.055),transparent 35%),
      radial-gradient(ellipse at 72% 12%,rgba(77,93,255,.05),transparent 32%),
      #030308!important;
  }
  .hero-inner{width:min(1320px,calc(100% - 64px))!important;max-width:1320px!important}
  .hero-stage-lights{opacity:.055!important}
  .eyebrow{margin-bottom:6px!important;font-size:.50rem!important;letter-spacing:.24em!important}
  .hero h1{width:min(680px,100%)!important;font-size:clamp(2.8rem,4.4vw,4.65rem)!important;line-height:.84!important}
  .hero-subtitle{margin:10px 0 0!important;font-size:clamp(.72rem,.9vw,.86rem)!important;letter-spacing:.13em!important}
  .hero-copy{display:none!important}
  .search-shell{width:min(900px,100%)!important;margin:14px 0 0!important}
  .ns-filters-panel,.search-panel{padding:9px 10px!important;background:rgba(6,7,12,.64)!important;border-color:rgba(255,255,255,.07)!important;box-shadow:none!important}
  .filter-input,.filter-select{height:40px!important}
  .events-section{padding-top:clamp(24px,2.4vw,36px)!important}
  .events-section .section-head{margin-bottom:10px!important}
  .events-section .section-head h2{font-size:clamp(2.45rem,4vw,4.4rem)!important}
  .events-carousel-viewport{padding-top:8px!important}
}
@media (max-width:760px){
  .hero{padding:18px 0 14px!important;min-height:0!important}
  .hero-inner{padding-top:0!important;padding-bottom:0!important}
  .hero-stage-lights{opacity:.05!important}
  .hero-copy{display:none!important}
  .eyebrow{margin-bottom:6px!important;font-size:.48rem!important}
  .hero h1{font-size:clamp(2.55rem,13vw,4rem)!important;line-height:.84!important}
  .hero-subtitle{margin:9px 0 0!important;font-size:.68rem!important;line-height:1.35!important}
  .search-shell{margin-top:12px!important;width:100%!important}
  .events-section{padding-top:20px!important}
}

/* =========================================================
   NIGHTSHOT V1.9 — CLEAN CLUB HOME / DESKTOP REBALANCE
   ========================================================= */
body{background:#020204!important;color:#fff!important}

/* Ambient club light: black first, colour only as light. */
main{
  position:relative!important;
  background:
    radial-gradient(900px 360px at 12% 2%,rgba(38,72,255,.055),transparent 62%),
    radial-gradient(760px 340px at 83% 1%,rgba(255,31,192,.055),transparent 60%),
    #020204!important;
}
main::before{
  content:"";
  position:absolute;inset:0 0 auto 0;height:420px;pointer-events:none;z-index:0;
  background:
    linear-gradient(112deg,transparent 0 46%,rgba(255,255,255,.018) 49%,transparent 52%),
    linear-gradient(71deg,transparent 0 58%,rgba(104,79,255,.018) 60%,transparent 62%);
  opacity:.8;
}
.hero,.events-section{position:relative!important;z-index:1!important}
.fx{opacity:.22!important}

@media (min-width:1120px){
  .hero{
    min-height:0!important;
    height:auto!important;
    padding:34px 0 28px!important;
    background:transparent!important;
    border-bottom:1px solid rgba(255,255,255,.04)!important;
  }
  .hero-inner{
    width:min(100% - 96px,1440px)!important;
    max-width:1440px!important;
    margin:0 auto!important;
    padding:0!important;
  }
  .eyebrow{
    margin:0 0 8px!important;
    color:#716d78!important;
    font-size:.52rem!important;
    letter-spacing:.28em!important;
  }
  .hero h1{
    width:auto!important;
    max-width:620px!important;
    margin:0!important;
    font-size:clamp(3rem,4vw,4.25rem)!important;
    line-height:.83!important;
    letter-spacing:-.045em!important;
    overflow:visible!important;
  }
  .hero h1 span,.hero h1 strong{display:block!important;white-space:normal!important}
  .hero h1 span{color:#fff!important}
  .hero h1 strong{
    color:transparent!important;
    -webkit-text-fill-color:transparent!important;
    -webkit-text-stroke:1px rgba(255,255,255,.52)!important;
    text-shadow:0 0 26px rgba(255,41,199,.06)!important;
  }
  .hero-subtitle{
    margin:12px 0 0!important;
    max-width:650px!important;
    color:#d9d5dd!important;
    font-size:.78rem!important;
    line-height:1.25!important;
    letter-spacing:.16em!important;
  }
  .hero-copy{display:none!important}
  .search-shell{
    width:min(860px,100%)!important;
    margin:16px 0 0!important;
  }
  .ns-filters-panel,.search-panel{
    padding:9px!important;
    border-radius:12px!important;
    border:1px solid rgba(255,255,255,.065)!important;
    background:rgba(5,5,9,.68)!important;
    box-shadow:none!important;
    backdrop-filter:blur(12px)!important;
  }
  .filters-grid{
    grid-template-columns:minmax(250px,1.2fr) minmax(170px,.8fr) minmax(170px,.8fr)!important;
    gap:8px!important;
  }
  .filter-control label{font-size:.48rem!important;letter-spacing:.18em!important;color:#77717f!important}
  .filter-input,.filter-select{height:38px!important;border-radius:9px!important;font-size:.73rem!important}
  .filter-actions{margin-top:6px!important}
  .filter-reset{min-height:29px!important;padding:0 12px!important;font-size:.50rem!important}

  .events-section{
    width:min(100% - 96px,1440px)!important;
    max-width:1440px!important;
    margin:0 auto!important;
    padding:34px 0 78px!important;
    background:transparent!important;
  }
  .events-section .section-head{margin-bottom:18px!important}
  .section-kicker{font-size:.50rem!important;color:#ff48cb!important;letter-spacing:.22em!important}
  .events-section .section-head h2{
    margin-top:5px!important;
    font-size:clamp(2.7rem,4vw,4.6rem)!important;
    line-height:.84!important;
    letter-spacing:-.055em!important;
  }
  .section-count{font-size:.52rem!important;color:#77717e!important;letter-spacing:.16em!important}

  /* Give the event rail a premium club-gallery treatment. */
  .events-carousel-shell{
    position:relative!important;
    padding:10px 0 0!important;
  }
  .events-carousel-shell::before{
    content:""!important;
    position:absolute!important;
    left:8%!important;right:8%!important;top:-1px!important;height:1px!important;
    background:linear-gradient(90deg,transparent,rgba(255,37,197,.25),rgba(79,85,255,.16),transparent)!important;
    filter:drop-shadow(0 0 8px rgba(255,42,203,.16))!important;
    opacity:.8!important;
  }
  :root{--ns-card:min(66vw,900px)!important}
  .event-media{
    border-radius:18px!important;
    background:#030305!important;
    border:1px solid rgba(255,255,255,.075)!important;
    box-shadow:0 30px 90px rgba(0,0,0,.42)!important;
  }
  .event-media::after{
    content:"";position:absolute;inset:auto 10% -1px 10%;height:1px;
    background:linear-gradient(90deg,transparent,rgba(255,42,203,.35),rgba(93,80,255,.24),transparent);
    opacity:.7;pointer-events:none;
  }
  .event-card:hover .event-media{
    transform:translateY(-4px) scale(1.012)!important;
    box-shadow:0 34px 100px rgba(0,0,0,.48),0 0 50px rgba(255,36,195,.04)!important;
  }
}

@media (min-width:761px) and (max-width:1119px){
  .hero{padding:28px 0 24px!important;background:transparent!important}
  .hero-inner{width:min(100% - 44px,1020px)!important}
  .hero h1{font-size:clamp(2.8rem,7.4vw,4.6rem)!important;max-width:620px!important}
  .hero-subtitle{font-size:.76rem!important;margin-top:10px!important}
  .search-shell{margin-top:14px!important;width:min(820px,100%)!important}
  .events-section{width:min(100% - 44px,1100px)!important;padding-top:30px!important}
}

@media (max-width:760px){
  main{background:radial-gradient(480px 220px at 78% 0%,rgba(255,31,192,.045),transparent 62%),#020204!important}
  .hero{padding:17px 0 13px!important;background:transparent!important}
  .hero-inner{width:calc(100% - 28px)!important;margin:0 auto!important}
  .hero h1{font-size:clamp(2.15rem,12vw,3.35rem)!important;line-height:.84!important;max-width:100%!important}
  .hero-subtitle{font-size:.66rem!important;letter-spacing:.12em!important;line-height:1.3!important}
  .search-shell{margin-top:10px!important}
  .events-section{padding-top:22px!important}
}
