/* ============================================================
   Secret VIP Night — Night Queen Grand Prix × HAMACLUB
   Teaser LP. Dark base, neon as accent only.
   ============================================================ */

:root{
  /* base */
  --black:        #050505;
  --ink:          #0a0a0c;
  --panel:        #111114;
  --panel-2:      #16161b;
  --line:         rgba(255,255,255,.10);

  /* neon accents */
  --pink:   #FF3FD8;
  --blue:   #00CFFF;
  --purple: #7A4DFF;
  --gold:   #C8A45D;

  /* text */
  --tx:     #ECEAF2;
  --tx-dim: #A7A3B4;
  --tx-mut: #6F6B7C;

  /* gradients */
  --neon-line: linear-gradient(90deg, var(--pink), var(--purple) 52%, var(--blue));
  --neon-line-soft: linear-gradient(90deg, rgba(255,63,216,.0), var(--pink) 18%, var(--purple) 50%, var(--blue) 82%, rgba(0,207,255,0));

  /* type */
  --serif:  "Playfair Display", "Times New Roman", serif;
  --script: "Pinyon Script", cursive;
  --mincho: "Shippori Mincho", "Hiragino Mincho ProN", serif;
  --sans:   "Noto Sans JP", system-ui, sans-serif;

  --maxw: 1180px;
  --gut: clamp(20px, 5vw, 64px);
}

*{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body{
  background:var(--black);
  color:var(--tx);
  font-family:var(--sans);
  font-weight:300;
  line-height:1.85;
  letter-spacing:.02em;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
img{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }
::selection{ background:rgba(255,63,216,.30); color:#fff; }

/* ambient grain + vignette over whole page */
body::before{
  content:""; position:fixed; inset:0; z-index:0; pointer-events:none;
  background:
    radial-gradient(120% 80% at 80% -10%, rgba(122,77,255,.10), transparent 60%),
    radial-gradient(100% 70% at 0% 110%, rgba(0,207,255,.07), transparent 55%);
  mix-blend-mode:screen;
}

/* ---------- layout helpers ---------- */
.wrap{ width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:var(--gut); position:relative; z-index:1; }
section{ position:relative; z-index:1; }

/* ---------- typographic atoms ---------- */
.script{
  font-family:var(--script);
  font-weight:400;
  line-height:1;
  padding-bottom:.12em;
  background:var(--neon-line);
  -webkit-background-clip:text; background-clip:text;
  color:transparent;
  filter:drop-shadow(0 0 14px rgba(255,63,216,.35));
}
.eyebrow{
  font-family:var(--sans);
  font-weight:400;
  font-size:.72rem;
  letter-spacing:.42em;
  text-transform:uppercase;
  color:var(--tx-mut);
}
.serif{ font-family:var(--serif); }
.mincho{ font-family:var(--mincho); font-weight:500; }

/* section label = script word + thin rule */
.sec-label{ display:flex; align-items:baseline; gap:18px; margin-bottom:8px; }
.sec-label .script{ font-size:clamp(2.1rem, 4.6vw, 3.2rem); }

.sec-head{
  font-family:var(--mincho);
  font-weight:600;
  font-size:clamp(1.5rem, 4.2vw, 2.35rem);
  line-height:1.5;
  letter-spacing:.04em;
  color:var(--tx);
}
.lede{
  color:var(--tx-dim);
  font-size:clamp(.86rem,2.6vw,.98rem);
  line-height:2.1;
  font-weight:300;
}

/* hairline divider with neon bleed */
.rule{ height:1px; background:var(--neon-line-soft); opacity:.7; border:0; }

/* ---------- neon frame (reusable) ---------- */
.neon-frame{
  position:relative;
  border:1px solid rgba(255,63,216,.40);
  border-radius:4px;
  box-shadow:
    0 0 0 1px rgba(0,207,255,.10) inset,
    0 0 18px rgba(255,63,216,.22),
    0 0 40px rgba(122,77,255,.14);
}

/* utility */
.tnum{ font-family:var(--serif); font-variant-numeric:tabular-nums; letter-spacing:.01em; }
.u-center{ text-align:center; }

/* ============================================================
   BUTTONS  — neon-framed CTA
   ============================================================ */
.btn{
  position:relative; display:inline-flex; align-items:center; justify-content:center; gap:.7em;
  font-family:var(--sans); font-weight:500; letter-spacing:.16em;
  font-size:.95rem; color:#fff;
  padding:1.15em 2.4em; border-radius:3px;
  background:linear-gradient(180deg, rgba(255,63,216,.10), rgba(122,77,255,.06));
  border:1px solid rgba(255,63,216,.55);
  box-shadow:
    0 0 0 1px rgba(0,207,255,.12) inset,
    0 0 16px rgba(255,63,216,.30),
    0 0 34px rgba(122,77,255,.18);
  cursor:pointer; overflow:hidden;
  transition:transform .35s cubic-bezier(.2,.8,.2,1), box-shadow .35s, border-color .35s;
}
.btn::after{ /* sweep */
  content:""; position:absolute; inset:0;
  background:linear-gradient(110deg, transparent 30%, rgba(255,255,255,.22) 50%, transparent 70%);
  transform:translateX(-120%); transition:transform .7s ease;
}
.btn:hover{
  transform:translateY(-2px);
  border-color:rgba(0,207,255,.7);
  box-shadow:
    0 0 0 1px rgba(0,207,255,.2) inset,
    0 0 22px rgba(255,63,216,.5),
    0 0 60px rgba(122,77,255,.3);
}
.btn:hover::after{ transform:translateX(120%); }
.btn .arr{ font-family:var(--serif); }
.btn--lg{ font-size:1.06rem; padding:1.3em 3em; width:100%; max-width:520px; margin-inline:auto; }

.btn--ghost{
  background:transparent; color:var(--tx);
  border:1px solid rgba(0,207,255,.45);
  box-shadow:0 0 14px rgba(0,207,255,.18);
  font-size:.78rem; letter-spacing:.24em; padding:.95em 1.8em;
}
.btn--ghost:hover{ border-color:var(--blue); box-shadow:0 0 22px rgba(0,207,255,.4); transform:translateY(-2px); }

/* ============================================================
   HEADER
   ============================================================ */
.site-head{
  position:fixed; top:0; left:0; right:0; z-index:60;
  display:flex; align-items:center; justify-content:space-between;
  padding:18px var(--gut);
  transition:background .4s, backdrop-filter .4s, padding .4s;
}
.site-head.scrolled{
  background:rgba(5,5,5,.72);
  backdrop-filter:blur(14px);
  padding-block:12px;
  border-bottom:1px solid var(--line);
}
.brand{ line-height:1.05; display:flex; flex-direction:column; align-items:center; gap:5px; text-align:center; }
.brand__invite{ height:26px; width:auto; display:block; }
.brand__x{ font-family:var(--serif); font-size:1rem; color:var(--tx-dim); line-height:1; }
.brand__nq{ display:block; }
.brand .bq{ font-family:var(--serif); font-size:1.18rem; letter-spacing:.02em; color:#fff; display:block; }
.brand--foot{ display:inline-flex; margin-bottom:4px; }
.brand .bs{ font-family:var(--script); font-size:1.5rem; line-height:.7; display:block;
  background:var(--neon-line); -webkit-background-clip:text; background-clip:text; color:transparent; }
.brand .bx{ font-size:.6rem; letter-spacing:.32em; color:var(--tx-dim); display:block; margin-top:4px; }
.menu-btn{
  width:46px; height:46px; display:grid; place-content:center; gap:5px; cursor:pointer;
  background:rgba(255,255,255,.03); border:1px solid var(--line); border-radius:3px;
}
.menu-btn span{ display:block; width:22px; height:1.5px; background:var(--tx); transition:.35s; }
.menu-btn.open span:nth-child(1){ transform:translateY(6.5px) rotate(45deg); }
.menu-btn.open span:nth-child(2){ opacity:0; }
.menu-btn.open span:nth-child(3){ transform:translateY(-6.5px) rotate(-45deg); }

/* nav overlay */
.nav{
  position:fixed; inset:0; z-index:55;
  background:rgba(5,5,5,.96); backdrop-filter:blur(8px);
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px;
  opacity:0; visibility:hidden; transition:opacity .5s, visibility .5s;
}
.nav.open{ opacity:1; visibility:visible; }
.nav a{
  font-family:var(--serif); font-size:clamp(1.6rem,7vw,2.4rem); color:var(--tx);
  padding:.25em .4em; position:relative; transition:color .3s; letter-spacing:.04em;
}
.nav a .n-ja{ display:block; font-family:var(--mincho); font-size:.5em; color:var(--tx-mut); letter-spacing:.2em; margin-top:-.1em; }
.nav a:hover{ color:#fff; text-shadow:0 0 22px rgba(255,63,216,.7); }

/* ============================================================
   HERO
   ============================================================ */
.hero{ position:relative; min-height:100svh; display:flex; align-items:flex-end; overflow:hidden; }
.hero__bg{ position:absolute; inset:0; z-index:0; }
.hero__bg img{ width:100%; height:100%; object-fit:cover; object-position:60% center; }
.hero__bg::after{
  content:""; position:absolute; inset:0;
  background:
    linear-gradient(180deg, rgba(5,5,5,.55) 0%, rgba(5,5,5,.10) 32%, rgba(5,5,5,.45) 62%, var(--black) 100%),
    linear-gradient(90deg, rgba(5,5,5,.85) 0%, rgba(5,5,5,.20) 50%, rgba(5,5,5,.10) 100%);
}
.hero__inner{ position:relative; z-index:2; width:100%; padding-bottom:clamp(48px,8vh,90px); padding-top:140px; }
.hero__kicker{ display:flex; align-items:center; gap:14px; margin-bottom:18px; }
.hero__kicker .line{ width:46px; height:1px; background:var(--gold); opacity:.8; }
.hero__kicker span{ font-size:.7rem; letter-spacing:.34em; color:var(--gold); }

.hero h1{ margin:0 0 .15em; }
.hero h1 .s1{ display:block; font-family:var(--script); font-weight:400;
  font-size:clamp(2.6rem,9vw,4.6rem); line-height:.8;
  background:var(--neon-line); -webkit-background-clip:text; background-clip:text; color:transparent;
  filter:drop-shadow(0 0 20px rgba(255,63,216,.4)); margin-bottom:.04em; }
.hero h1 .s2{ display:block; font-family:var(--serif); font-weight:500;
  font-size:clamp(3.2rem,13vw,7rem); line-height:.92; letter-spacing:.01em; color:#fff;
  text-shadow:0 0 40px rgba(122,77,255,.35); }

.hero__ja{ font-family:var(--mincho); font-weight:500;
  font-size:clamp(1.05rem,4.4vw,1.6rem); line-height:1.9; letter-spacing:.06em; color:var(--tx);
  margin-top:.7em; }
.hero__limit{ display:flex; align-items:center; gap:14px; margin:1.4em 0 .2em; }
.hero__limit .line{ flex:0 0 28px; height:1px; background:var(--neon-line); }
.hero__limit span{ font-family:var(--mincho); font-size:.92rem; letter-spacing:.14em; color:var(--tx-dim); }
.hero__limit em{ font-style:normal; color:var(--pink); font-family:var(--serif); font-size:1.25em; padding:0 .12em;
  text-shadow:0 0 16px rgba(255,63,216,.6); }
.hero__sub{ color:var(--tx-mut); font-size:.82rem; letter-spacing:.08em; margin-top:.5em; }

/* hero info row */
.hero__info{ display:flex; flex-wrap:wrap; gap:clamp(22px,5vw,52px); margin:2em 0 2.2em; }
.hero__info .col{ }
.hero__info .lab{ font-size:.62rem; letter-spacing:.28em; color:var(--tx-mut); margin-bottom:.5em; }
.hero__info .big{ font-family:var(--serif); font-size:clamp(1.5rem,5vw,2.1rem); color:#fff; line-height:1; }
.hero__info .small{ font-size:.72rem; color:var(--tx-dim); letter-spacing:.1em; margin-top:.35em; }
.hero__info .vline{ width:1px; align-self:stretch; background:var(--line); }
.hero__info .num, .hero__sub .num{ background:linear-gradient(150deg, #FFFFFF 0%, #F2DEB0 14%, #DDBB78 38%, #C8A45D 72%, #B68F45 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
  filter:drop-shadow(0 0 16px rgba(200,164,93,.45)); }
.hero__sub .num{ filter:drop-shadow(0 0 10px rgba(200,164,93,.4)); }
.gold-grad{ background:linear-gradient(150deg, #FFFFFF 0%, #F2DEB0 14%, #DDBB78 38%, #C8A45D 72%, #B68F45 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
  filter:drop-shadow(0 0 14px rgba(200,164,93,.35)); }

.scroll-cue{ position:absolute; left:50%; bottom:22px; transform:translateX(-50%); z-index:3;
  font-size:.58rem; letter-spacing:.3em; color:var(--tx-mut); display:flex; flex-direction:column; align-items:center; gap:10px; }
.scroll-cue .bar{ width:1px; height:46px; background:linear-gradient(var(--pink), transparent); animation:cue 2.2s ease-in-out infinite; transform-origin:top; }
@keyframes cue{ 0%,100%{ transform:scaleY(.4); opacity:.4 } 50%{ transform:scaleY(1); opacity:1 } }

/* ============================================================
   SECTION BLOCK base
   ============================================================ */
.block{ padding-block:clamp(72px,12vw,140px); }
.block--tight{ padding-block:clamp(56px,9vw,100px); }

/* ============================================================
   ABOUT — asymmetric image cluster
   ============================================================ */
.about__grid{ display:grid; grid-template-columns:1fr; gap:clamp(28px,5vw,56px); align-items:center; }
.about__grid--two{ align-items:stretch; }
.about__grid--single{ display:block; }
.about__grid--single .about__copy{ max-width:640px; }
.about__copy .lede{ margin-top:1.4em; max-width:42ch; }

/* vertical auto-scroll stage (desktop right column) */
.about__vstage{ display:none; }

/* auto-scrolling marquee slider (horizontal) */
.marquee{ margin-top:clamp(36px,6vw,64px); width:100%; overflow:hidden; position:relative;
  -webkit-mask:linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
          mask:linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); }
.marquee__track{ display:flex; gap:16px; width:max-content; will-change:transform;
  animation:marquee 48s linear infinite; }
.marquee:hover .marquee__track{ animation-play-state:paused; }
.marquee figure{ flex:0 0 auto; width:clamp(240px,26vw,340px); aspect-ratio:3/4; overflow:hidden;
  border-radius:4px; margin:0; position:relative; }
.marquee figure img{ width:100%; height:100%; object-fit:cover; display:block; }
@keyframes marquee{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }
@media (prefers-reduced-motion:reduce){ .marquee__track{ animation:none; } }
@keyframes vscroll{ from{ transform:translateY(0); } to{ transform:translateY(-50%); } }
@keyframes vscroll-rev{ from{ transform:translateY(-50%); } to{ transform:translateY(0); } }
@media (prefers-reduced-motion:reduce){ .vtrack{ animation:none !important; } }
.about__media{ display:grid; grid-template-columns:1.2fr 1fr; grid-template-rows:1fr 1fr; gap:10px; aspect-ratio:1/1; }
.about__media figure{ overflow:hidden; border-radius:3px; position:relative; min-height:0; }
.about__media figure img{ width:100%; height:100%; object-fit:cover; transition:transform 1.2s cubic-bezier(.2,.8,.2,1); }
.about__media figure:hover img{ transform:scale(1.06); }
.ph-line{ position:absolute; inset:0; box-shadow:0 0 0 1px rgba(255,63,216,.18) inset; pointer-events:none; }
.about__media .a1{ grid-row:1 / span 2; grid-column:1; }
.about__media .a2{ grid-row:1; grid-column:2; }
.about__media .a3{ grid-row:2; grid-column:2; }

/* ============================================================
   VENUE + GALLERY
   ============================================================ */
.venue__top{ display:grid; grid-template-columns:1fr; gap:clamp(24px,4vw,44px); align-items:end; margin-bottom:34px; }
.venue__name{ font-family:var(--serif); font-weight:600; font-size:clamp(2.4rem,9vw,4.2rem); letter-spacing:.04em; color:#fff; line-height:.95;
  text-shadow:0 0 30px rgba(0,207,255,.25); }
.venue__hero{ aspect-ratio:16/9; overflow:hidden; border-radius:3px; position:relative; }
.venue__hero img{ width:100%; height:100%; object-fit:cover; }
.venue__meta{ color:var(--tx-dim); font-size:.84rem; line-height:2; }
.venue__meta b{ color:var(--tx); font-weight:400; }

/* horizontal gallery */
.gallery{ position:relative; margin-top:30px; }
.gallery__track{ display:flex; gap:16px; justify-content:center; overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:18px;
  scrollbar-width:none; -webkit-overflow-scrolling:touch; }
.gallery__track::-webkit-scrollbar{ display:none; }
.gallery__track figure{ flex:1 1 0; min-width:0; aspect-ratio:4/3; scroll-snap-align:center; overflow:hidden;
  border-radius:3px; position:relative; }
.gallery__track figure img{ width:100%; height:100%; object-fit:cover; transition:transform 1s; }
.gallery__track figure:hover img{ transform:scale(1.05); }
.gallery__nav{ position:absolute; top:50%; transform:translateY(-50%); z-index:4; width:44px; height:44px; border-radius:50%;
  display:grid; place-content:center; background:rgba(5,5,5,.7); border:1px solid rgba(255,63,216,.4);
  box-shadow:0 0 16px rgba(255,63,216,.25); cursor:pointer; color:#fff; font-family:var(--serif); font-size:1.3rem;
  transition:.3s; backdrop-filter:blur(6px); }
.gallery__nav:hover{ border-color:var(--blue); box-shadow:0 0 24px rgba(0,207,255,.4); }
.gallery__nav.prev{ left:-6px; } .gallery__nav.next{ right:-6px; }
.gallery__dots{ display:flex; gap:8px; justify-content:center; margin-top:6px; }
.gallery__dots i{ width:6px; height:6px; border-radius:50%; background:rgba(255,255,255,.2); transition:.3s; }
.gallery__dots i.on{ width:22px; border-radius:3px; background:var(--neon-line); }

/* ============================================================
   EXPERIENCE cards
   ============================================================ */
.exp__track{ display:grid; grid-template-columns:repeat(5,1fr); gap:14px; }
.exp-card{ position:relative; padding:26px 20px 30px; border-radius:4px; overflow:hidden;
  background:linear-gradient(180deg, var(--panel-2), var(--ink));
  border:1px solid var(--line); transition:transform .4s, border-color .4s, box-shadow .4s; }
.exp-card::before{ content:""; position:absolute; left:0; top:0; right:0; height:2px; background:var(--neon-line); opacity:.55; transition:opacity .4s; }
.exp-card:hover{ transform:translateY(-6px); border-color:rgba(255,63,216,.4);
  box-shadow:0 18px 50px rgba(0,0,0,.5), 0 0 26px rgba(122,77,255,.18); }
.exp-card:hover::before{ opacity:1; }
.exp-card .no{ font-family:var(--serif); font-size:2.1rem; line-height:1; color:transparent;
  -webkit-text-stroke:1px rgba(255,63,216,.55); margin-bottom:auto; }
.exp-card .et{ font-family:var(--mincho); font-weight:600; font-size:1.02rem; color:#fff; margin:46px 0 .6em; letter-spacing:.04em; }
.exp-card .ed{ font-size:.76rem; color:var(--tx-dim); line-height:1.85; }

/* ============================================================
   CAMPAIGN / 特典  — the loud one
   ============================================================ */
.campaign{ padding-block:clamp(64px,10vw,120px); position:relative; }
.campaign__frame{ position:relative; padding:clamp(30px,5vw,64px); border-radius:6px; overflow:hidden;
  background:radial-gradient(120% 130% at 50% 0%, rgba(122,77,255,.16), rgba(5,5,5,.4) 55%), var(--ink); }
.campaign__frame::before{ /* animated neon border */
  content:""; position:absolute; inset:0; border-radius:6px; padding:1.5px;
  background:linear-gradient(120deg, var(--pink), var(--purple), var(--blue), var(--pink));
  background-size:300% 300%;
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude;
  animation:flow 8s linear infinite;
  box-shadow:0 0 30px rgba(255,63,216,.25);
}
@keyframes flow{ to{ background-position:300% 0; } }
.campaign__frame::after{ /* inner line — makes the border a double frame */
  content:""; position:absolute; inset:9px; border-radius:3px; pointer-events:none; z-index:1;
  border:1px solid rgba(255,255,255,.22);
  box-shadow:0 0 12px rgba(0,207,255,.18) inset, 0 0 10px rgba(255,63,216,.15);
}
.campaign__grid{ display:grid; grid-template-columns:1fr; gap:clamp(28px,4vw,48px); align-items:start; position:relative; z-index:2; }
.campaign__tag{ display:inline-flex; align-items:center; margin-bottom:1.4em;
  font-family:var(--mincho); font-weight:700; font-size:clamp(1.05rem,3.2vw,1.42rem); letter-spacing:.16em; }
.campaign__tag .ct-txt{
  background:linear-gradient(180deg,#F4E2A8 0%, #D8B860 38%, #C8A45D 55%, #9A7B34 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
  filter:drop-shadow(0 1px 1px rgba(0,0,0,.45)); }
.campaign__title{ font-family:var(--mincho); font-weight:700; font-size:clamp(1.4rem,4.6vw,2.2rem); line-height:1.5; color:#fff; }
.campaign__title .hl{ color:var(--pink); text-shadow:0 0 18px rgba(255,63,216,.55); }
.campaign__lede{ color:var(--tx-dim); margin-top:1.2em; font-size:.9rem; line-height:2.1; max-width:48ch; }
.campaign__logo-img{ display:block; width:min(56%, 232px); height:auto; margin:1.8em auto 0; }
.campaign__media{ display:flex; flex-direction:column; gap:10px; margin-top:6px; }
.campaign__media figure{ overflow:hidden; border-radius:3px; position:relative; min-height:0; margin:0; }
.campaign__media .cm-top{ aspect-ratio:16/9; }
.campaign__media .cm-bottom{ display:grid; grid-template-columns:1fr 1fr; gap:10px; align-items:stretch; }
.campaign__media .cm-left{ display:grid; grid-template-rows:1fr 1fr; gap:10px; min-height:0; }
.campaign__media .cm-left figure{ min-height:0; }
.campaign__media .cm-right{ aspect-ratio:3/4; }
.campaign__media img{ width:100%; height:100%; object-fit:cover; display:block; }

/* ============================================================
   NIGHT OUT strip
   ============================================================ */
.nightout{ display:grid; grid-template-columns:1fr; gap:clamp(22px,4vw,40px); align-items:center; }
.nightout--center{ text-align:center; }
.nightout--center .lede{ margin-inline:auto; }
.nightout__media{ display:grid; grid-template-columns:repeat(4,1fr); gap:10px; }
.nightout__media figure{ overflow:hidden; border-radius:3px; aspect-ratio:3/4; position:relative; }
.nightout__media figure img{ width:100%; height:100%; object-fit:cover; transition:transform 1.1s; }
.nightout__media figure:hover img{ transform:scale(1.06); }

/* ============================================================
   DETAILS
   ============================================================ */
.details__rows{ border-top:1px solid var(--line); }
.drow{ display:grid; grid-template-columns:160px 1fr; gap:18px; padding:22px 4px; border-bottom:1px solid var(--line);
  align-items:start; }
.drow dt{ font-size:.64rem; letter-spacing:.26em; color:var(--tx-mut); padding-top:.35em; }
.drow dd{ font-size:.92rem; color:var(--tx); line-height:1.9; }
.drow dd .sub{ display:block; font-size:.74rem; color:var(--tx-dim); margin-top:.2em; }
.drow dd a.maplink{ color:var(--blue); border-bottom:1px solid rgba(0,207,255,.4); }
.map{ position:relative; margin-top:26px; aspect-ratio:21/9; border-radius:4px; overflow:hidden; border:1px solid var(--line); }
.map iframe{ width:100%; height:100%; border:0; filter:grayscale(.3) invert(.92) hue-rotate(180deg) contrast(.9); }
.map__open{ position:absolute; right:14px; bottom:14px; z-index:2;
  font-size:.7rem; letter-spacing:.14em; color:var(--tx); padding:.7em 1.2em; border-radius:3px;
  background:rgba(5,5,5,.78); border:1px solid rgba(0,207,255,.4); backdrop-filter:blur(8px);
  box-shadow:0 0 14px rgba(0,207,255,.18); transition:border-color .3s, box-shadow .3s, color .3s; }
.map__open:hover{ color:#fff; border-color:var(--blue); box-shadow:0 0 22px rgba(0,207,255,.4); }

/* ============================================================
   FINAL CTA
   ============================================================ */
.finalcta{ position:relative; padding-block:clamp(80px,14vw,170px); padding-inline:var(--gut); text-align:center; overflow:hidden; }
.finalcta__bg{ position:absolute; inset:0; z-index:0; }
.finalcta__bg img{ width:100%; height:100%; object-fit:cover; opacity:.32; }
.finalcta__bg::after{ content:""; position:absolute; inset:0; background:radial-gradient(80% 80% at 50% 50%, rgba(5,5,5,.4), var(--black) 80%); }
.finalcta .inner{ position:relative; z-index:2; max-width:760px; margin-inline:auto; }
.finalcta .copy{ font-family:var(--mincho); font-weight:500; font-size:clamp(1rem,3.6vw,1.3rem); color:var(--tx-dim); letter-spacing:.1em; margin-bottom:.8em; }
.finalcta h2{ font-family:var(--serif); font-weight:500; font-size:clamp(2.2rem,9vw,4.6rem); line-height:1.05; letter-spacing:.03em; color:#fff;
  text-shadow:0 0 50px rgba(122,77,255,.4); margin-bottom:1.4em; }
.finalcta h2 .em{ font-style:italic; }

/* ============================================================
   FOOTER
   ============================================================ */
.foot{ border-top:1px solid var(--line); padding:54px var(--gut) 70px; text-align:center;
  display:flex; flex-direction:column; align-items:center; }
.foot .fb{ font-family:var(--serif); font-size:1.1rem; color:#fff; letter-spacing:.04em; }
.foot .fs{ font-family:var(--script); font-size:1.4rem; line-height:.8; background:var(--neon-line);
  -webkit-background-clip:text; background-clip:text; color:transparent; display:block; }
.foot .fx{ font-size:.62rem; letter-spacing:.28em; color:var(--tx-mut); margin-top:18px; }
.foot-link{ color:var(--tx-dim); border-bottom:1px solid rgba(255,255,255,.18); padding-bottom:2px; transition:color .3s, border-color .3s; }
.foot-link:hover{ color:#fff; border-color:var(--pink); }
.foot-ig{ display:flex; align-items:center; justify-content:center; width:25px; height:25px;
  margin:22px auto 6px; transition:opacity .3s, transform .3s; }
.foot-ig:hover{ opacity:.7; transform:translateY(-2px); }
.foot-ig svg{ display:block; }

/* ============================================================
   REVEAL animation
   ============================================================ */
@media (prefers-reduced-motion:no-preference){
  /* content is ALWAYS visible (opacity untouched); .in adds a gentle upward drift only.
     If a throttled/offscreen frame freezes the animation, content stays visible. */
  @keyframes revUp{ from{ transform:translateY(24px); } to{ transform:none; } }
  .reveal.in{ animation:revUp .9s cubic-bezier(.2,.8,.2,1) both; }
  .reveal.d1.in{ animation-delay:.08s } .reveal.d2.in{ animation-delay:.16s } .reveal.d3.in{ animation-delay:.24s }
  .reveal.d4.in{ animation-delay:.32s } .reveal.d5.in{ animation-delay:.4s }
}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (min-width:760px){
  .about__grid{ grid-template-columns:1fr 1.15fr; }
  .about__grid--two{ grid-template-columns:1fr 1.05fr; gap:clamp(36px,5vw,64px); }
  .about__grid--two .about__copy{ align-self:center; }
  .marquee--mobile{ display:none; }
  /* vertical 2-column auto-scroll, fills the tall right space on desktop */
  .about__vstage{ display:grid; grid-template-columns:1fr 1fr; gap:14px;
    height:clamp(460px, 50vw, 600px); overflow:hidden;
    -webkit-mask:linear-gradient(180deg, transparent, #000 9%, #000 91%, transparent);
            mask:linear-gradient(180deg, transparent, #000 9%, #000 91%, transparent); }
  .about__vstage .vcol{ overflow:hidden; }
  .about__vstage .vtrack{ display:flex; flex-direction:column; gap:14px; will-change:transform;
    animation:vscroll 60s linear infinite; }
  .about__vstage .vtrack--rev{ animation-name:vscroll-rev; animation-duration:40s; }
  .about__vstage:hover .vtrack{ animation-play-state:paused; }
  .about__vstage figure{ margin:0; aspect-ratio:3/4; overflow:hidden; border-radius:4px; }
  .about__vstage figure img{ width:100%; height:100%; object-fit:cover; display:block; }
  .venue__top{ grid-template-columns:1.4fr 1fr; }
  .campaign__grid{ grid-template-columns:1.15fr 1fr; }
  .nightout{ grid-template-columns:.8fr 1.4fr; }
  .nightout--center{ grid-template-columns:1fr; }
  /* gallery photos fill the row evenly (aligned with hero image above); arrows not needed */
  .gallery__nav{ display:none; }
}
@media (max-width:759px){
  .exp__track{ display:flex; overflow-x:auto; scroll-snap-type:x mandatory; gap:12px; padding-bottom:16px;
    scrollbar-width:none; }
  .exp__track::-webkit-scrollbar{ display:none; }
  .exp-card{ flex:0 0 76%; scroll-snap-align:center; }
  /* on small screens keep the gallery swipeable */
  .gallery__track{ justify-content:flex-start; }
  .gallery__track figure{ flex:0 0 80%; }
  .about__media{ aspect-ratio:1/1; }
  .drow{ grid-template-columns:96px 1fr; gap:12px; }
  .nightout__media{ grid-template-columns:repeat(2,1fr); }
  .campaign__media figure:first-child{ aspect-ratio:16/10; }
  /* hide decorative scroll cue so it never overlaps the hero CTA on phones */
  .scroll-cue{ display:none; }
}
@media (max-width:420px){
  .hero__info{ gap:18px; }
  .hero__info .vline{ display:none; }
}

/* ============================================================
   LEGAL / PRIVACY PAGE
   ============================================================ */
.legal{ max-width:820px; margin-inline:auto; padding:140px var(--gut) 100px; position:relative; z-index:1; }
.legal__head{ margin-bottom:48px; }
.legal__head .sec-label{ margin-bottom:14px; }
.legal__head .sec-label .script{ padding-right:.14em; }
.legal__head h1{ font-family:var(--mincho); font-weight:600; font-size:clamp(1.7rem,5vw,2.4rem); color:var(--tx); letter-spacing:.04em; }
.legal__intro{ color:var(--tx-dim); font-size:.92rem; line-height:2.1; margin-bottom:14px; }
.legal__rule{ height:1px; background:var(--neon-line-soft); opacity:.6; border:0; margin:40px 0; }
.legal section{ margin-bottom:40px; }
.legal h2{ font-family:var(--mincho); font-weight:600; font-size:clamp(1.05rem,3.2vw,1.3rem); color:#fff; letter-spacing:.04em;
  margin-bottom:14px; display:flex; align-items:baseline; gap:12px; }
.legal h2 .qn{ font-family:var(--serif); font-size:.9em; color:transparent; -webkit-text-stroke:1px rgba(255,63,216,.5); }
.legal p{ color:var(--tx-dim); font-size:.9rem; line-height:2.05; }
.legal ul{ list-style:none; margin-top:10px; display:flex; flex-direction:column; gap:8px; }
.legal ul li{ color:var(--tx-dim); font-size:.9rem; line-height:1.8; padding-left:20px; position:relative; }
.legal ul li::before{ content:""; position:absolute; left:0; top:.7em; width:7px; height:1px; background:var(--pink); }
.legal a.inline{ color:var(--blue); border-bottom:1px solid rgba(0,207,255,.4); }
.legal__meta{ color:var(--tx-mut); font-size:.78rem; letter-spacing:.06em; margin-top:8px; }
.legal__back{ display:inline-flex; align-items:center; gap:.6em; margin-top:50px;
  font-size:.78rem; letter-spacing:.2em; color:var(--tx-dim); transition:color .3s; }
.legal__back:hover{ color:#fff; }
.legal__back .arr{ font-family:var(--serif); }
.legal .dl-block dt{ color:var(--tx); font-size:.9rem; margin-top:14px; }
.legal .dl-block dd{ color:var(--tx-dim); font-size:.88rem; line-height:1.9; }