:root {
  color-scheme: dark;
  --bg: #030711;
  --panel: rgba(4, 8, 22, 0.88);
  --cyan: #00e5ff;
  --blue: #3d7bff;
  --violet: #8b3dff;
  --pink: #ff25c8;
  --white: #f8fbff;
  --muted: #c5cee2;
  --max: 1400px;
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  margin: 0;
  min-height: 100vh;
  color: var(--white);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background:
    radial-gradient(circle at 18% 12%, rgba(0, 181, 255, .25), transparent 26%),
    radial-gradient(circle at 82% 16%, rgba(255, 0, 207, .22), transparent 28%),
    linear-gradient(180deg, #07091a 0%, #02040a 64%, #05020b 100%);
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  opacity: .32;
  background-image: linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px);
  background-size: 42px 42px;
  mask-image: linear-gradient(to bottom, black, transparent 70%);
}

a { color: inherit; }

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.site-header {
  position: sticky;
  z-index: 20;
  top: 0;
  border-bottom: 1px solid rgba(140, 167, 226, .18);
  background: rgba(2, 5, 13, .82);
  backdrop-filter: blur(18px);
}

.nav {
  width: min(calc(100% - 36px), var(--max));
  min-height: 66px;
  margin: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
}

.brand {
  font-weight: 900;
  letter-spacing: .2em;
  text-decoration: none;
}

.nav-links { display: flex; align-items: center; gap: 26px; }
.nav-links a { color: var(--muted); font-size: .8rem; font-weight: 800; letter-spacing: .12em; text-decoration: none; text-transform: uppercase; }
.nav-links a:hover, .nav-links a:focus-visible { color: var(--cyan); }

.hero {
  width: min(calc(100% - 32px), var(--max));
  margin: auto;
  padding: 34px 0 18px;
  text-align: center;
}

.hero-logo {
  width: min(330px, 76vw);
  aspect-ratio: 1;
  object-fit: contain;
}

.hero h1 {
  margin: 4px 0 4px;
  font-size: clamp(2rem, 5vw, 4rem);
  line-height: .95;
  letter-spacing: .055em;
  text-transform: uppercase;
  text-shadow: 0 0 26px rgba(63, 130, 255, .7);
}

.hero-tagline {
  margin: 16px 0 0;
  color: #70eaff;
  font-size: clamp(.9rem, 2vw, 1.35rem);
  font-weight: 700;
  letter-spacing: .26em;
  text-transform: uppercase;
}
.home-local-intro { width:min(calc(100% - 36px),900px); margin:8px auto 28px; color:var(--muted); font-size:clamp(.88rem,1.5vw,1rem); line-height:1.65; text-align:center; }
.home-local-intro p { margin:0; }
.home-local-intro strong { color:white; }
.home-local-intro a { display:inline-block; margin-top:8px; color:var(--cyan); font-weight:900; letter-spacing:.06em; text-decoration:none; }

.scribble {
  position: absolute;
  top: 125px;
  max-width: 180px;
  color: #a35cff;
  font-family: "Comic Sans MS", "Bradley Hand", cursive;
  font-size: clamp(1rem, 2vw, 1.55rem);
  font-style: italic;
  font-weight: 800;
  line-height: 1.05;
  text-transform: uppercase;
  transform: rotate(-5deg);
}

.scribble.left { left: max(22px, calc((100vw - var(--max)) / 2)); }
.scribble.right { right: max(22px, calc((100vw - var(--max)) / 2)); transform: rotate(5deg); }

.paths {
  width: min(calc(100% - 32px), var(--max));
  margin: 0 auto 30px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.path-card {
  --card-accent: var(--cyan);
  position: relative;
  min-height: 255px;
  overflow: hidden;
  display: flex;
  align-items: flex-end;
  border: 3px solid var(--card-accent);
  border-radius: 24px;
  color: white;
  text-decoration: none;
  background-color: #080c1b;
  background-position: center;
  background-size: cover;
  box-shadow: inset 0 0 26px rgba(0,0,0,.45), 0 0 18px color-mix(in srgb, var(--card-accent) 45%, transparent);
  isolation: isolate;
  transition: transform .2s ease, box-shadow .2s ease;
}

.path-card::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(180deg, rgba(0,0,0,.02) 20%, rgba(0,0,0,.9) 88%);
}

.path-card:hover, .path-card:focus-visible { transform: translateY(-4px); box-shadow: 0 0 34px color-mix(in srgb, var(--card-accent) 70%, transparent); }
.path-card:focus-visible { outline: 3px solid white; outline-offset: 4px; }

.path-copy { width: 100%; padding: 26px 90px 22px 28px; text-align: center; }
.path-copy h2 { margin: 0; font-size: clamp(1.35rem, 3vw, 2rem); letter-spacing: .07em; text-transform: uppercase; }
.path-copy p { margin: 5px 0 0; color: #eff5ff; font-size: 1rem; letter-spacing: .08em; }
.arrow { position: absolute; right: 26px; bottom: 27px; width: 58px; height: 58px; display: grid; place-items: center; border: 3px solid var(--card-accent); border-radius: 50%; font-size: 2rem; background: rgba(3, 7, 17, .72); }

.karaoke { background-image: url('/assets/off-key-karaoke-wordmark.png'), radial-gradient(circle at center, rgba(255,0,190,.28), transparent 52%); background-size: 82% auto, cover; background-repeat: no-repeat; background-position: center 35%, center; }
.karaoke .path-copy,
.party .path-copy { padding:0 56px 20px; text-align:center; }
.karaoke .path-copy h2 { display:none; }
.karaoke .path-copy p { margin:0; }
.party {
  --card-accent: #8a5cff;
  background-image: url('/assets/party-box-card.png?v=2'), radial-gradient(circle at center, rgba(111, 45, 255, .22), transparent 64%);
  background-position: center 24%, center;
  background-repeat: no-repeat;
  background-size: auto 84%, cover;
}
.party .path-copy h2 { display:none; }
.party .path-copy p { margin:0; }
.dj { --card-accent: #23a7ff; background-image: url('/assets/dj-services-reference-dj.png?v=1'); background-position:center top; background-repeat:no-repeat; background-size:100% auto; }
.dj .path-copy h2 { display:none; }
.dj .path-copy p { margin:0; }
.crew { --card-accent: var(--pink); background-image: url('/assets/crew-card-no-nose-rings.png?v=1'); }
.crew::before { background:linear-gradient(180deg,transparent 52%,rgba(0,0,0,.22) 76%,rgba(0,0,0,.58) 100%); }
.crew .path-copy { width:min(60%,400px); margin:0 0 12px 18px; padding:0; text-align:left; background:none; backdrop-filter:none; }
.crew .path-copy h2 { font-size:clamp(.92rem,1.8vw,1.2rem); text-shadow:0 2px 8px #000,0 0 12px #000; }
.crew .path-copy p { font-size:.78rem; letter-spacing:.035em; text-shadow:0 2px 7px #000,0 0 10px #000; }

.site-footer {
  width: min(calc(100% - 32px), 1000px);
  margin: 24px auto 0;
  padding: 25px 0 34px;
  border-top: 1px solid rgba(255,255,255,.7);
  text-align: center;
}
.site-footer p { margin: 5px; letter-spacing: .18em; text-transform: uppercase; }
.site-footer .questionable { color: var(--pink); font-size: .82rem; }

.page-hero {
  min-height: 55vh;
  display: grid;
  place-items: center;
  padding: 72px 20px;
  text-align: center;
  background-position: center;
  background-size: cover;
}

.karaoke-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background:
    radial-gradient(ellipse at 18% 18%, rgba(0, 220, 255, .42), transparent 28%),
    radial-gradient(ellipse at 82% 20%, rgba(255, 0, 190, .42), transparent 30%),
    radial-gradient(ellipse at 50% 95%, rgba(117, 51, 255, .45), transparent 45%),
    linear-gradient(180deg, #090b26 0%, #03050c 100%);
}

.karaoke-hero::before,
.karaoke-hero::after {
  content: "";
  position: absolute;
  z-index: -1;
  top: -20%;
  width: 22%;
  height: 125%;
  opacity: .38;
  filter: blur(16px);
  transform: rotate(17deg);
  background: linear-gradient(to bottom, rgba(0,229,255,.95), transparent 70%);
}

.karaoke-hero::before { left: 12%; }
.karaoke-hero::after { right: 12%; transform: rotate(-17deg); background: linear-gradient(to bottom, rgba(255,37,200,.95), transparent 70%); }

.karaoke-page { background: radial-gradient(circle at 10% 12%, rgba(0,196,255,.2), transparent 26%), radial-gradient(circle at 87% 9%, rgba(255,0,196,.2), transparent 25%), #02040a; }
.karaoke-nav-logo { display: inline-flex; width: min(420px, 42vw); height: 58px; align-items: center; }
.karaoke-nav-logo img { width: 100%; max-height: 56px; object-fit: contain; object-position: left center; }
.karaoke-art-hero { position:relative; width:min(100%,1536px); margin:auto; background:#02040a; }
.karaoke-art-hero>img { display:block; width:100%; height:auto; }
.karaoke-local-intro { width:min(calc(100% - 36px),980px); margin:auto; padding:clamp(54px,7vw,88px) 0 26px; text-align:center; }
.karaoke-local-kicker { margin:0 0 12px; color:var(--pink); font-size:.78rem; font-weight:900; letter-spacing:.18em; text-transform:uppercase; }
.karaoke-local-intro h1 { margin:0; font-size:clamp(2.35rem,6vw,4.8rem); line-height:.95; text-transform:uppercase; }
.karaoke-local-intro>p:not(.karaoke-local-kicker):not(.karaoke-service-area) { max-width:820px; margin:24px auto 0; color:var(--muted); font-size:clamp(1rem,1.8vw,1.15rem); line-height:1.75; }
.karaoke-service-area { margin:24px 0 0; color:white; font-size:.92rem; font-weight:700; letter-spacing:.04em; }
.karaoke-service-area strong { color:var(--cyan); text-transform:uppercase; }
.karaoke-local-actions { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:14px; margin-top:28px; }
.karaoke-phone { padding:14px 8px; color:var(--cyan); font-weight:900; letter-spacing:.08em; text-decoration:none; }
.art-hotspot { position:absolute; z-index:3; top:70%; height:20%; border-radius:14px; }
.art-hotspot:hover { box-shadow:0 0 28px rgba(255,255,255,.5); }
.art-hotspot:focus-visible { outline:4px solid white; outline-offset:4px; }
.facebook-hotspot { left:8.6%; width:24.8%; }
.kamikaze-hotspot { left:34.8%; width:23.8%; }
.mobile-hero-actions { display:none; }
.karaoke-showcase { position: relative; min-height: 510px; overflow: hidden; display: grid; grid-template-columns: minmax(0,1.3fr) minmax(260px,.7fr); align-items: center; gap: 36px; padding: 72px max(32px,calc((100vw - var(--max))/2)); background: linear-gradient(90deg,rgba(0,0,0,.18),rgba(0,0,0,.62)), radial-gradient(circle at 72% 30%,rgba(255,0,190,.35),transparent 30%), radial-gradient(circle at 25% 35%,rgba(0,215,255,.26),transparent 34%), linear-gradient(180deg,#071228,#07030f 78%,#02040a); }
.karaoke-showcase::after { content:""; position:absolute; inset:auto 0 0; height:120px; background:linear-gradient(to top,#02040a,transparent); pointer-events:none; }
.karaoke-showcase-copy { position:relative; z-index:2; max-width:850px; }
.karaoke-showcase h1 { margin:0; font-size:clamp(3.3rem,7vw,7rem); line-height:.86; text-transform:uppercase; letter-spacing:-.035em; transform:rotate(-2deg); }
.karaoke-showcase h1 span { display:inline-block; margin-right:.12em; text-shadow:0 5px 24px rgba(0,0,0,.6); }
.karaoke-showcase h1 .cyan { color:#00efff; }
.karaoke-showcase h1 .pink { color:#ff22be; }
.karaoke-showcase h1 .yellow { display:block; color:#ffe51e; font-size:1.08em; }
.karaoke-showcase-copy>p { margin:34px 0 0; font-size:clamp(1.1rem,2vw,1.55rem); letter-spacing:.12em; }
.karaoke-actions { justify-content:flex-start; }
.facebook-button { border-color:#39a8ff; background:linear-gradient(135deg,#0a8cff,#2553ff); }
.karaoke-mic { position:relative; z-index:2; align-self:stretch; min-height:390px; }
.mic-head { position:absolute; top:34px; left:42%; width:145px; height:190px; border:7px solid #8af6ff; border-radius:48% 48% 42% 42%; transform:rotate(25deg); background:repeating-linear-gradient(0deg,#07101a 0 8px,#97f8ff 9px 11px); box-shadow:0 0 28px rgba(0,229,255,.75),inset 0 0 32px rgba(255,37,200,.5); }
.mic-handle { position:absolute; top:192px; left:50%; width:54px; height:230px; border-radius:20px; transform:rotate(25deg); background:linear-gradient(90deg,#222b38,#00d9ff 40%,#111722 62%,#ff2ac4); box-shadow:0 0 25px rgba(0,229,255,.4); }
.mic-note { position:absolute; right:0; bottom:28px; color:#efefff; font-family:"Comic Sans MS","Bradley Hand",cursive; font-size:1.25rem; line-height:1.08; transform:rotate(-8deg); }
.events-section { width:min(calc(100% - 36px),var(--max)); margin:auto; padding:58px 0 70px; }
.section-title-row { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:28px; }
.section-title-row span { height:5px; border-radius:5px; background:linear-gradient(90deg,transparent,var(--cyan)); }
.section-title-row span:last-child { background:linear-gradient(90deg,var(--pink),transparent); }
.section-title-row h2 { margin:0; font-size:clamp(2.1rem,5vw,4rem); text-align:center; text-transform:uppercase; transform:rotate(-1deg); }
.events-intro { margin:12px auto 28px; color:var(--muted); text-align:center; }
.event-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.event-card { position:relative; min-height:185px; display:grid; grid-template-columns:76px 1fr; gap:20px; align-items:start; padding:22px 64px 22px 18px; border:1px solid rgba(166,185,235,.38); border-radius:14px; background:linear-gradient(135deg,rgba(10,16,34,.96),rgba(17,6,29,.92)); box-shadow:inset 0 0 28px rgba(57,90,180,.12); }
.event-date { display:grid; place-items:center; min-height:82px; border:2px solid var(--pink); border-radius:5px; color:var(--pink); text-transform:uppercase; }
.event-card:nth-child(even) .event-date { border-color:var(--cyan); color:var(--cyan); }
.event-date span { align-self:end; font-size:.84rem; font-weight:900; letter-spacing:.08em; }
.event-date strong { align-self:start; font-size:2rem; line-height:1; }
.event-copy h3 { margin:3px 0 10px; text-transform:uppercase; }
.event-copy p { margin:4px 0; color:var(--muted); }
.event-venue-link { color:var(--cyan); font-weight:800; text-decoration-color:rgba(0,229,255,.4); text-underline-offset:3px; }
.event-venue-link:hover { color:white; }
.event-location { font-size:.86rem; }
.event-link { position:absolute; right:18px; bottom:18px; color:var(--cyan); font-size:2rem; text-decoration:none; }
.events-empty { grid-column:1/-1; padding:42px; border:1px solid rgba(150,170,220,.28); border-radius:16px; text-align:center; background:rgba(8,12,28,.72); }
.events-empty h3 { margin:0 0 8px; font-size:1.5rem; text-transform:uppercase; }
.events-empty p { margin:0; color:var(--muted); }
.events-actions { display:flex; flex-wrap:wrap; justify-content:center; gap:14px; margin-top:26px; }
.karaoke-search-section { width:min(calc(100% - 36px),980px); margin:10px auto 78px; padding:clamp(38px,6vw,64px); border:1px solid rgba(0,229,255,.3); border-radius:26px; text-align:center; background:radial-gradient(circle at 50% 0,rgba(111,38,171,.24),rgba(5,9,24,.95) 62%); box-shadow:0 24px 72px rgba(0,0,0,.34); }
.karaoke-search-section h2 { max-width:850px; margin:0 auto; font-size:clamp(2rem,5vw,3.6rem); line-height:1; text-wrap:balance; text-transform:uppercase; }
.karaoke-search-lead { max-width:790px; margin:22px auto 0; color:var(--muted); font-size:clamp(1rem,1.7vw,1.12rem); line-height:1.7; }
.karaoke-faq { max-width:820px; margin:36px auto 0; text-align:left; }
.karaoke-faq details { border-top:1px solid rgba(255,255,255,.16); }
.karaoke-faq details:last-child { border-bottom:1px solid rgba(255,255,255,.16); }
.karaoke-faq summary { padding:19px 4px; color:white; font-weight:850; cursor:pointer; }
.karaoke-faq details p { margin:-2px 4px 21px; color:var(--muted); line-height:1.7; }
.karaoke-faq a { color:var(--cyan); font-weight:800; text-underline-offset:3px; }
.karaoke-search-actions { display:flex; flex-wrap:wrap; justify-content:center; gap:14px; margin-top:32px; }
.venues-page { background:radial-gradient(circle at 15% 10%,rgba(0,218,255,.16),transparent 28%),radial-gradient(circle at 86% 8%,rgba(255,31,193,.17),transparent 30%),#02040a; }
.venues-main { width:min(calc(100% - 36px),1180px); margin:auto; }
.venues-intro { width:100%; margin:auto; padding:clamp(62px,9vw,118px) 0 60px; text-align:center; }
.venues-kicker { margin:0 0 14px; color:var(--pink); font-size:.78rem; font-weight:900; letter-spacing:.24em; text-transform:uppercase; }
.venues-intro h1 { max-width:1120px; margin:0 auto; font-size:clamp(2.65rem,6vw,5.35rem); line-height:1; text-wrap:balance; text-transform:uppercase; }
.venues-intro>p:not(.venues-kicker) { width:100%; margin:24px auto; color:var(--muted); font-size:clamp(1rem,1.5vw,1.18rem); line-height:1.75; text-wrap:pretty; }
.venue-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
.venue-card { scroll-margin-top:90px; padding:clamp(28px,4vw,46px); border:1px solid rgba(145,179,235,.35); border-radius:24px; background:linear-gradient(145deg,rgba(10,17,40,.96),rgba(23,7,36,.94)); box-shadow:0 18px 55px rgba(0,0,0,.3),inset 0 0 45px rgba(92,52,194,.08); }
.venue-card h2 { margin:0 0 18px; color:white; font-size:clamp(1.9rem,4vw,3.2rem); line-height:1; text-transform:uppercase; }
.venue-card address { color:var(--cyan); font-style:normal; font-weight:800; line-height:1.55; }
.venue-card>p:not(.venues-kicker) { margin:22px 0 0; color:var(--muted); line-height:1.7; }
.venue-actions { display:flex; flex-wrap:wrap; align-items:center; gap:18px; margin-top:28px; }
.venue-official-link { color:white; font-size:.82rem; font-weight:900; letter-spacing:.06em; text-decoration-color:var(--pink); text-underline-offset:4px; text-transform:uppercase; }
.venues-cta { max-width:940px; margin:72px auto 38px; padding:clamp(38px,6vw,68px); border:1px solid rgba(236,69,255,.42); border-radius:26px; text-align:center; background:radial-gradient(circle at center,rgba(116,31,184,.27),rgba(4,8,21,.94) 70%); }
.venues-cta h2 { margin:0; font-size:clamp(2rem,5vw,4rem); line-height:1; text-transform:uppercase; }
.venues-cta>p:not(.venues-kicker) { max-width:720px; margin:22px auto 26px; color:var(--muted); line-height:1.7; }

@media (max-width:920px) { .karaoke-showcase { grid-template-columns:1fr; min-height:auto; padding-top:58px; text-align:center; } .karaoke-actions { justify-content:center; } .karaoke-mic { display:none; } .event-grid { grid-template-columns:1fr; } }
@media (max-width:620px) { .karaoke-nav-logo { width:200px; } .karaoke-showcase { padding-inline:20px; } .karaoke-showcase h1 { font-size:clamp(2.8rem,15vw,4.6rem); } .karaoke-showcase-copy>p { letter-spacing:.04em; } .section-title-row { gap:12px; } .section-title-row h2 { font-size:2rem; } }

@media (max-width:760px) { .venue-grid { grid-template-columns:1fr; } }

@media (max-width:620px) {
  .art-hotspot { display:none; }
  .mobile-hero-actions { display:flex; flex-wrap:wrap; justify-content:center; gap:12px; padding:18px 16px 28px; }
  .mobile-hero-actions .button { min-height:46px; padding-inline:16px; font-size:.75rem; }
  .karaoke-search-section { padding:34px 20px; }
}
.page-hero-inner { width: min(760px, 100%); padding: 36px; border: 1px solid rgba(255,255,255,.22); border-radius: 28px; background: rgba(2,5,15,.75); backdrop-filter: blur(12px); box-shadow: 0 0 42px rgba(109,54,255,.28); }
.page-hero h1 { margin: 0; font-size: clamp(2.6rem, 8vw, 6rem); line-height: .92; text-transform: uppercase; }
.page-hero p { color: var(--muted); font-size: 1.15rem; line-height: 1.7; }
.page-logo { max-width: min(520px, 100%); max-height: 210px; object-fit: contain; }
.cta-row { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px; margin-top: 24px; }
.button { display: inline-flex; align-items: center; justify-content: center; min-height: 52px; padding: 0 24px; border: 2px solid var(--pink); border-radius: 12px; color: white; font-weight: 900; letter-spacing: .08em; text-decoration: none; text-transform: uppercase; background: linear-gradient(135deg, rgba(135,29,255,.8), rgba(255,20,190,.55)); box-shadow: 0 0 18px rgba(255, 37, 200, .28); }
.button.alt { border-color: var(--cyan); background: rgba(0, 180, 255, .14); }
.content { width: min(calc(100% - 36px), 1050px); margin: auto; padding: 58px 0 80px; }
.content h2 { font-size: clamp(2rem, 5vw, 3.4rem); text-transform: uppercase; }
.feature-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.feature { padding: 25px; border: 1px solid rgba(130,160,230,.25); border-radius: 18px; background: rgba(8,12,30,.7); }
.feature h3 { margin-top: 0; color: var(--cyan); text-transform: uppercase; }

.dj-services-hero {
  position: relative;
  width: min(100%, 2061px);
  aspect-ratio: 2061 / 763;
  margin: 0 auto;
  background: #02030a url('/assets/dj-services-reference-dj.png?v=1') center / 100% 100% no-repeat;
}
.dj-services-hero>p {
  position: absolute;
  left: 5.5%;
  bottom: 5.5%;
  width: 39%;
  margin: 0;
  color: #eef3ff;
  font-size: clamp(.74rem, 1.45vw, 1.28rem);
  font-weight: 700;
  line-height: 1.45;
  letter-spacing: .025em;
  text-align: center;
  text-shadow: 0 2px 8px #000, 0 0 16px #000;
}
.dj-services-actions {
  width: min(calc(100% - 36px), 1180px);
  margin: 0 auto;
  padding: 24px 0 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 14px;
}

.dj-gallery-section {
  width: min(calc(100% - 36px), 1180px);
  margin: auto;
  padding: clamp(64px, 8vw, 108px) 0 80px;
}
.dj-gallery-heading { max-width: 760px; margin: 0 auto 34px; text-align: center; }
.dj-gallery-kicker { margin: 0 0 10px; color: var(--pink); font-size: .8rem; font-weight: 900; letter-spacing: .24em; text-transform: uppercase; }
.dj-gallery-heading h2 { margin: 0; font-size: clamp(2.25rem, 6vw, 4.8rem); line-height: .95; text-transform: uppercase; }
.dj-gallery-heading>p:last-child { margin: 20px auto 0; color: var(--muted); font-size: clamp(1rem, 1.7vw, 1.18rem); line-height: 1.7; }
.dj-carousel {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(109, 214, 255, .4);
  border-radius: 26px;
  background: #02040b;
  box-shadow: 0 30px 90px rgba(0,0,0,.55), 0 0 34px rgba(65, 95, 255, .2);
  outline: none;
}
.dj-carousel:focus-visible { box-shadow: 0 0 0 4px rgba(0,229,255,.75), 0 30px 90px rgba(0,0,0,.55); }
.dj-carousel-track { position: relative; aspect-ratio: 16 / 9; min-height: 430px; }
.dj-slide {
  position: absolute;
  inset: 0;
  z-index: 0;
  margin: 0;
  opacity: 0;
  visibility: hidden;
  transition: opacity .6s ease, visibility .6s ease;
  isolation: isolate;
}
.dj-slide::before {
  position: absolute;
  inset: -36px;
  z-index: -2;
  background-image: linear-gradient(rgba(1,3,10,.27),rgba(1,3,10,.64)), var(--slide-image);
  background-position: center;
  background-size: cover;
  filter: blur(22px) saturate(.78);
  transform: scale(1.08);
  content: "";
}
.dj-slide::after { position: absolute; inset: 0; z-index: -1; background: radial-gradient(circle at center, transparent 48%, rgba(0,0,0,.55) 100%); content: ""; }
.dj-slide.is-active { z-index: 1; opacity: 1; visibility: visible; }
.dj-slide img { width: 100%; height: 100%; display: block; object-fit: contain; filter: drop-shadow(0 12px 28px rgba(0,0,0,.55)); }
.dj-slide figcaption {
  position: absolute;
  inset: auto 0 0;
  padding: 45px 95px 24px;
  color: white;
  font-size: clamp(.86rem, 1.6vw, 1.05rem);
  font-weight: 750;
  letter-spacing: .025em;
  text-align: center;
  text-shadow: 0 2px 8px #000;
  background: linear-gradient(transparent, rgba(1,3,12,.9));
}
.dj-carousel-control {
  position: absolute;
  z-index: 4;
  top: 50%;
  width: 50px;
  height: 50px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255,255,255,.58);
  border-radius: 50%;
  color: white;
  font: 800 1.5rem/1 inherit;
  background: rgba(2,5,15,.72);
  backdrop-filter: blur(10px);
  cursor: pointer;
  transform: translateY(-50%);
}
.dj-carousel-control:hover { border-color: var(--cyan); background: rgba(0,132,171,.72); }
.dj-carousel-control:focus-visible { outline: 3px solid white; outline-offset: 3px; }
.dj-carousel-prev { left: 20px; }
.dj-carousel-next { right: 20px; }
.dj-carousel-dots { position: absolute; z-index: 4; left: 50%; bottom: 61px; display: flex; gap: 10px; transform: translateX(-50%); }
.dj-carousel-dots button { width: 10px; height: 10px; padding: 0; border: 1px solid white; border-radius: 999px; background: rgba(255,255,255,.28); cursor: pointer; transition: width .2s ease, background .2s ease; }
.dj-carousel-dots button[aria-current="true"] { width: 30px; border-color: var(--pink); background: var(--pink); box-shadow: 0 0 12px rgba(255,37,200,.8); }
.dj-carousel-dots button:focus-visible { outline: 3px solid white; outline-offset: 4px; }
.dj-services-content { padding-top: 20px; padding-bottom: 12px; }
.dj-services-content h2 { margin-top: 18px; margin-bottom: 28px; }
.dj-local-section { margin-top: 64px; padding: clamp(38px, 6vw, 62px); border: 1px solid rgba(87,211,255,.3); border-radius: 26px; background: radial-gradient(circle at 50% 0,rgba(75,38,155,.24),rgba(5,9,24,.94) 62%); box-shadow: 0 22px 70px rgba(0,0,0,.32); text-align: center; }
.dj-local-kicker { margin: 0 0 12px; color: var(--pink); font-size: .78rem; font-weight: 900; letter-spacing: .24em; text-transform: uppercase; }
.dj-services-content .dj-local-section h2 { max-width: 800px; margin: 0 auto 22px; font-size: clamp(2rem,5vw,3.6rem); line-height: 1; }
.dj-local-lead { max-width: 830px; margin: 0 auto; color: var(--muted); font-size: clamp(1rem,1.7vw,1.15rem); line-height: 1.75; }
.dj-service-area { max-width: 850px; margin: 20px auto 0; color: #dae4ff; line-height: 1.65; }
.dj-service-area strong { color: var(--cyan); }
.dj-local-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; margin-top: 34px; text-align: left; }
.dj-local-grid article { padding: 24px; border: 1px solid rgba(165,124,255,.26); border-radius: 18px; background: rgba(5,9,24,.8); }
.dj-local-grid h3 { margin: 0 0 11px; color: white; font-size: 1rem; letter-spacing: .05em; text-transform: uppercase; }
.dj-local-grid p { margin: 0; color: var(--muted); line-height: 1.6; }
.dj-faq { max-width: 850px; margin: 40px auto 0; text-align: left; }
.dj-faq>h3 { margin: 0 0 16px; color: white; font-size: 1.25rem; letter-spacing: .07em; text-align: center; text-transform: uppercase; }
.dj-faq details { border-top: 1px solid rgba(255,255,255,.15); }
.dj-faq details:last-of-type { border-bottom: 1px solid rgba(255,255,255,.15); }
.dj-faq summary { padding: 18px 4px; color: white; font-weight: 800; cursor: pointer; }
.dj-faq details p { margin: -2px 0 20px; padding-right: 24px; color: var(--muted); line-height: 1.65; }
.dj-local-cta { margin-top: 30px; }

.party-box-page { background:#02030a; }
.party-box-header { display:block; }
.party-box-art { position:relative; width:min(100%,1672px); aspect-ratio:1672 / 941; overflow:hidden; margin:auto; background:#02030a; }
.party-box-art>img { position:absolute; inset:0 auto auto 0; display:block; width:100%; height:auto; }
.party-hotspot { position:absolute; z-index:3; border-radius:12px; }
.party-hotspot:hover { box-shadow:0 0 24px rgba(235,81,255,.72),inset 0 0 0 2px rgba(255,255,255,.62); }
.party-hotspot:focus-visible { outline:4px solid white; outline-offset:3px; }
.party-book { top:62.2%; left:37.1%; width:25.8%; height:9.6%; }
.party-headliner { top:75.1%; left:2.4%; width:23.5%; height:20.6%; }
.party-included { top:75.1%; left:26.7%; width:23.3%; height:20.6%; }
.party-themes { top:75.1%; left:50.5%; width:23.5%; height:20.6%; }
.party-how { top:75.1%; left:74.4%; width:23.2%; height:20.6%; }
.party-box-mobile-actions { display:none; }
.party-box-intro,.party-pricing,.party-packs,.party-process,.party-final-cta { width:min(calc(100% - 36px),1180px); margin-inline:auto; }
.party-box-intro { padding:clamp(62px,8vw,108px) 0; text-align:center; }
.party-kicker { margin:0 0 12px; color:var(--pink); font-size:.78rem; font-weight:900; letter-spacing:.24em; text-transform:uppercase; }
.party-box-intro h2,.party-section-heading h2,.party-final-cta h2 { margin:0; color:white; font-size:clamp(2.1rem,5vw,4.4rem); line-height:1; text-transform:uppercase; }
.party-box-intro h2 span { color:var(--cyan); }
.party-box-intro>p:not(.party-kicker):not(.party-mantra) { max-width:790px; margin:20px auto 0; color:var(--muted); font-size:clamp(1rem,1.6vw,1.18rem); line-height:1.75; }
.party-box-intro .party-lead { color:white!important; font-size:clamp(1.3rem,2.3vw,1.8rem)!important; font-weight:800; }
.party-box-intro .party-service-area { max-width:900px!important; color:#dce7ff!important; font-size:clamp(.9rem,1.45vw,1.04rem)!important; }
.party-service-area strong { color:var(--cyan); }
.party-mantra { margin:24px 0; color:white; font-size:clamp(1.15rem,2vw,1.5rem); font-weight:900; letter-spacing:.08em; text-transform:uppercase; }
.party-box-intro .button { display:inline-flex; margin-top:12px; }
.party-pricing { display:grid; grid-template-columns:minmax(0,1.55fr) minmax(280px,.75fr); gap:24px; padding-bottom:90px; }
.party-package,.party-addons article,.party-pack-grid article { border:1px solid rgba(179,137,255,.38); border-radius:22px; background:linear-gradient(145deg,rgba(24,8,43,.97),rgba(5,10,25,.96)); box-shadow:0 18px 56px rgba(0,0,0,.3),inset 0 0 40px rgba(196,36,255,.08); }
.party-package { scroll-margin-top:90px; overflow:hidden; }
.party-package-heading { display:grid; grid-template-columns:auto 1fr; align-items:end; gap:34px; padding:36px; border-bottom:1px solid rgba(255,255,255,.12); }
.party-package-heading h2 { margin:0; color:white; font-size:clamp(2.4rem,5vw,4rem); line-height:.9; }
.party-package-heading h2 small { display:block; margin-top:11px; color:var(--cyan); font-size:.28em; letter-spacing:.15em; text-transform:uppercase; }
.party-package-heading>p { margin:0; color:var(--muted); line-height:1.7; }
.party-includes { scroll-margin-top:90px; padding:34px 36px; }
.party-includes h3 { margin:0 0 22px; font-size:1.05rem; letter-spacing:.08em; text-transform:uppercase; }
.party-includes ul { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:13px 28px; margin:0; padding:0; list-style:none; }
.party-includes li { position:relative; padding-left:22px; color:var(--muted); line-height:1.45; }
.party-includes li::before { position:absolute; left:0; color:var(--cyan); content:'✦'; }
.party-price-footer { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:24px 36px 32px; }
.party-price-footer strong { color:white; font-size:2.4rem; }
.party-addons { display:grid; gap:24px; }
.party-addons article { padding:31px 28px; }
.party-addons h2 { margin:0 0 16px; color:white; font-size:clamp(1.35rem,2.5vw,1.8rem); line-height:1.08; text-transform:uppercase; }
.party-addons h2 strong { display:block; margin-top:9px; color:var(--cyan); font-size:.72em; }
.party-addons article>p:not(.party-kicker) { margin:0; color:var(--muted); line-height:1.65; }
.party-addons .party-fine-print { margin-top:14px!important; color:#aebbd5!important; font-size:.78rem; }
.party-packs { scroll-margin-top:90px; padding:82px 0; border-top:1px solid rgba(255,255,255,.12); }
.party-section-heading { max-width:850px; margin:0 auto 38px; text-align:center; }
.party-section-heading>p:last-child { margin:18px auto 0; color:var(--muted); line-height:1.65; }
.party-section-heading strong { color:white; }
.party-pack-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
.party-pack-grid article { position:relative; padding:36px; }
.party-pack-grid h3 { margin:0 0 8px; color:white; font-size:clamp(1.65rem,3vw,2.5rem); text-transform:uppercase; }
.party-pack-grid article>p:not(.party-pack-price):not(.party-pack-tagline) { max-width:580px; margin:18px 0 0; color:var(--muted); line-height:1.7; }
.party-pack-price { position:absolute; top:30px; right:30px; margin:0; color:var(--cyan); font-weight:900; }
.party-pack-tagline { margin:0; color:var(--pink); font-weight:900; }
.party-coming-soon { margin:25px 0 0; color:var(--muted); text-align:center; }
.party-process { scroll-margin-top:90px; padding:82px 0; border-top:1px solid rgba(255,255,255,.12); }
.party-process ol { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; margin:0; padding:0; list-style:none; }
.party-process li { display:flex; gap:16px; padding:24px; border:1px solid rgba(93,214,255,.26); border-radius:18px; background:rgba(7,13,33,.76); }
.party-process li>span { display:grid; flex:0 0 38px; height:38px; place-items:center; border:1px solid var(--pink); border-radius:50%; color:white; font-weight:900; }
.party-process h3 { margin:4px 0 10px; color:white; font-size:1rem; text-transform:uppercase; }
.party-process li p { margin:0; color:var(--muted); font-size:.9rem; line-height:1.55; }
.party-final-cta { margin-bottom:76px; padding:clamp(42px,7vw,72px); border:1px solid rgba(231,65,255,.48); border-radius:26px; text-align:center; background:radial-gradient(circle at center,rgba(112,32,188,.28),rgba(4,7,20,.96) 68%); }
.party-final-cta h2 { font-size:clamp(1.8rem,4.5vw,3.5rem); }
.party-final-cta ul { display:flex; flex-wrap:wrap; justify-content:center; gap:12px 28px; margin:28px 0; padding:0; list-style:none; color:var(--muted); }
.party-final-cta li strong { color:var(--cyan); }
.party-final-cta>.button { display:inline-flex; }
.party-final-cta>p:last-child { margin:24px 0 0; color:white; font-weight:900; letter-spacing:.12em; text-transform:uppercase; }

@media (max-width:900px) {
  .party-pricing { grid-template-columns:1fr; }
  .party-process ol { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

@media (max-width:640px) {
  .party-book,.party-headliner,.party-included,.party-themes,.party-how { display:none; }
  .party-box-mobile-actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; width:min(calc(100% - 32px),760px); margin:24px auto 0; }
  .party-box-mobile-actions a { min-height:50px; display:grid; place-items:center; padding:10px; border:1px solid rgba(116,218,255,.55); border-radius:10px; color:white; font-size:.78rem; font-weight:900; letter-spacing:.09em; text-align:center; text-decoration:none; text-transform:uppercase; background:rgba(13,8,34,.9); }
  .party-box-mobile-actions .button { grid-column:1/-1; border:2px solid var(--pink); }
}

@media (max-width:560px) {
  .party-package-heading { grid-template-columns:1fr; gap:18px; padding:28px 24px; }
  .party-includes { padding:28px 24px; }
  .party-includes ul,.party-pack-grid,.party-process ol { grid-template-columns:1fr; }
  .party-price-footer { align-items:flex-start; flex-direction:column; padding:20px 24px 28px; }
  .party-pack-grid article { padding:32px 24px; }
}

.crew-page { background: radial-gradient(circle at 12% 10%, rgba(0,211,255,.18), transparent 27%), radial-gradient(circle at 86% 8%, rgba(255,22,196,.18), transparent 30%), #02040b; }
.crew-intro { width:min(calc(100% - 36px),1080px); margin:auto; padding:clamp(64px,10vw,120px) 0 clamp(44px,7vw,78px); text-align:center; }
.crew-eyebrow { margin:0 0 16px; color:var(--cyan); font-size:.82rem; font-weight:900; letter-spacing:.3em; text-transform:uppercase; }
.crew-intro h1 { margin:0; font-size:clamp(3rem,8vw,7rem); line-height:.9; letter-spacing:-.04em; text-transform:uppercase; }
.crew-intro h1 span { display:block; color:var(--pink); text-shadow:0 0 32px rgba(255,37,200,.46); }
.crew-intro>p:last-child { max-width:700px; margin:24px auto 0; color:var(--muted); font-size:clamp(1rem,2vw,1.25rem); line-height:1.7; }
.crew-profiles { width:min(calc(100% - 36px),1180px); margin:auto; display:grid; gap:30px; }
.crew-profile { position:relative; overflow:hidden; display:grid; grid-template-columns:minmax(300px,.78fr) minmax(0,1.22fr); min-height:560px; border:1px solid rgba(157,183,236,.3); border-radius:28px; background:linear-gradient(135deg,rgba(8,14,34,.96),rgba(22,6,33,.92)); box-shadow:0 20px 70px rgba(0,0,0,.38),inset 0 0 60px rgba(89,70,255,.07); }
.crew-profile::after { content:""; position:absolute; inset:0 0 auto; height:4px; background:linear-gradient(90deg,var(--cyan),var(--pink)); }
.crew-portrait { min-height:560px; overflow:hidden; background:#090716; }
.crew-portrait img { width:100%; height:100%; display:block; object-fit:cover; object-position:var(--portrait-position,50% 42%); transform:scale(var(--portrait-scale,1)); filter:saturate(.96) contrast(1.03); }
.crew-bio { align-self:center; padding:clamp(34px,6vw,72px); }
.crew-number { margin:0 0 8px; color:var(--cyan); font-size:.86rem; font-weight:900; letter-spacing:.28em; }
.crew-bio h2 { margin:0; font-size:clamp(2.7rem,6vw,5.5rem); line-height:.9; text-transform:uppercase; }
.crew-role { margin:14px 0 30px; color:var(--pink); font-size:1rem; font-weight:900; letter-spacing:.16em; text-transform:uppercase; }
.crew-role span { color:var(--cyan); }
.crew-details { margin:0; }
.crew-details div { padding:11px 0; border-top:1px solid rgba(161,181,229,.2); }
.crew-details dt { color:var(--cyan); font-size:.74rem; font-weight:900; letter-spacing:.13em; text-transform:uppercase; }
.crew-details dd { margin:5px 0 0; color:#edf2ff; line-height:1.55; }
.crew-placeholder { max-width:520px; color:var(--muted); font-size:1.08rem; line-height:1.7; }
.crew-profile-pending { min-height:430px; }
.crew-profile-pending .crew-portrait { min-height:430px; }
.crew-cta { width:min(calc(100% - 36px),920px); margin:clamp(54px,8vw,96px) auto 40px; padding:42px; border:1px solid rgba(0,229,255,.35); border-radius:24px; text-align:center; background:radial-gradient(circle at center,rgba(119,43,255,.22),transparent 68%); }
.crew-cta p { margin:0 0 24px; font-size:clamp(1.8rem,4vw,3.3rem); font-weight:900; text-transform:uppercase; }

.contact-page { background:radial-gradient(circle at 12% 12%,rgba(0,220,255,.2),transparent 28%),radial-gradient(circle at 88% 8%,rgba(255,37,200,.22),transparent 30%),#02040b; }
.contact-main { width:min(calc(100% - 36px),1180px); margin:auto; padding:clamp(56px,8vw,100px) 0 40px; }
.contact-intro { max-width:850px; margin:0 auto 42px; text-align:center; }
.contact-eyebrow { margin:0 0 14px; color:var(--cyan); font-size:.82rem; font-weight:900; letter-spacing:.3em; text-transform:uppercase; }
.contact-intro h1 { margin:0; font-size:clamp(3rem,8vw,6.8rem); line-height:.9; text-transform:uppercase; }
.contact-intro h1 span { color:var(--pink); text-shadow:0 0 30px rgba(255,37,200,.42); }
.contact-intro>p:last-child { max-width:720px; margin:24px auto 0; color:var(--muted); font-size:1.12rem; line-height:1.7; }
.contact-card { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(250px,.5fr); gap:32px; padding:clamp(24px,4vw,48px); border:1px solid rgba(157,183,236,.3); border-radius:28px; background:linear-gradient(135deg,rgba(8,14,34,.96),rgba(22,6,33,.92)); box-shadow:0 20px 70px rgba(0,0,0,.38),inset 0 0 60px rgba(89,70,255,.07); }
.contact-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; margin-bottom:20px; }
.contact-card label { display:grid; gap:8px; color:#eef3ff; font-size:.78rem; font-weight:900; letter-spacing:.11em; text-transform:uppercase; }
.contact-card label span { color:var(--muted); font-size:.7rem; }
.contact-card input,.contact-card select,.contact-card textarea { width:100%; border:1px solid rgba(137,170,231,.42); border-radius:11px; padding:14px 15px; color:white; font:500 1rem/1.4 inherit; background:rgba(2,7,19,.86); outline:none; }
.contact-card input:focus,.contact-card select:focus,.contact-card textarea:focus { border-color:var(--cyan); box-shadow:0 0 0 3px rgba(0,229,255,.14); }
.contact-card textarea { resize:vertical; }
.contact-submit-row { display:flex; align-items:center; gap:22px; margin-top:24px; }
.contact-submit-row .button { border:2px solid var(--pink); cursor:pointer; }
.contact-submit-row p { margin:0; color:var(--muted); font-size:.84rem; line-height:1.5; }
.contact-submit-row strong { color:white; }
.contact-aside { display:flex; flex-direction:column; justify-content:center; align-items:flex-start; gap:22px; padding:28px; border-left:1px solid rgba(255,255,255,.18); }
.contact-aside>a:not(.button) { color:var(--cyan); overflow-wrap:anywhere; }
.contact-note { width:100%; max-width:100%; margin:0; color:white; font-size:clamp(1.15rem,1.65vw,1.45rem); font-weight:900; line-height:1.18; overflow-wrap:break-word; text-transform:uppercase; }

@media (max-width:800px) {
  .crew-profile { grid-template-columns:1fr; }
  .crew-portrait, .crew-profile-pending .crew-portrait { min-height:0; aspect-ratio:4 / 5; }
  .crew-bio { padding:34px 26px 42px; }
}

@media (max-width:760px) {
  .contact-card { grid-template-columns:1fr; }
  .contact-grid { grid-template-columns:1fr; }
  .contact-aside { border-top:1px solid rgba(255,255,255,.18); border-left:0; }
  .contact-submit-row { align-items:flex-start; flex-direction:column; }
}

@media (max-width: 820px) {
  body { overflow-x: hidden; }
  .nav-links { gap: 14px; }
  .nav-links a:not(.contact-link) { display: none; }
  .scribble {
    top: 128px;
    display: block;
    width: 64px;
    max-width: 64px;
    font-size: clamp(.58rem, 2.7vw, .72rem);
    line-height: 1.08;
    text-align: center;
  }
  .scribble.left { left: 7px; }
  .scribble.right { right: 7px; }
  .paths { grid-template-columns: 1fr; }
  .feature-grid { grid-template-columns: 1fr; }
  .hero { padding-top: 24px; }
}

@media (max-width: 700px) {
  .dj-services-hero>p { left: 4%; bottom: 3.5%; width: 44%; font-size: clamp(.5rem, 2.1vw, .72rem); line-height: 1.28; }
  .dj-services-actions { padding-top: 18px; }
  .dj-services-actions .button { min-height: 46px; padding-inline: 17px; font-size: .72rem; }
  .dj-local-section { margin-top: 46px; padding: 32px 20px; }
  .dj-local-grid { grid-template-columns: 1fr; }
  .dj-faq details p { padding-right: 0; }
  .dj-gallery-section { width: min(calc(100% - 24px), 1180px); padding-top: 58px; }
  .dj-carousel-track { aspect-ratio: 4 / 5; min-height: 0; }
  .dj-carousel-control { top: auto; bottom: 14px; width: 42px; height: 42px; transform: none; }
  .dj-carousel-prev { left: 14px; }
  .dj-carousel-next { right: 14px; }
  .dj-carousel-dots { bottom: 30px; gap: 7px; }
  .dj-carousel-dots button { width: 8px; height: 8px; }
  .dj-carousel-dots button[aria-current="true"] { width: 20px; }
  .dj-slide figcaption { padding: 56px 60px 68px; font-size: .8rem; }
}

@media (max-width: 520px) {
  .path-card { min-height: 215px; }
  .path-copy { padding: 22px 70px 18px 18px; }
  .karaoke .path-copy, .party .path-copy { padding:0 52px 18px; }
  .arrow { right: 16px; bottom: 20px; width: 48px; height: 48px; }
  .hero-logo { width: clamp(190px, 58vw, 240px); }
  .site-footer p { letter-spacing: .08em; font-size: .78rem; }
}

@media (prefers-reduced-motion: reduce) {
  * { scroll-behavior: auto !important; transition: none !important; }
}
