/* ============================================================================
   THE BOULEVARD (BLVD) — styles.css  (v3.0 launch · dark)
   Black + purple + pink (brand). Light text for readability.
   Fraunces (serif display) + Inter (body) + Oswald (wordmark) + Dancing Script.
   Keeps the distinct editorial layout (asymmetric hero, seal, info bar, color
   blocks) — dark, not a rock-venue clone.
   ============================================================================ */

:root{
  --ink:#0A0A0F; --ink-2:#0E0C15; --panel:#15111F; --panel-2:#1C1533; --card:#171226;
  --line:rgba(255,255,255,.09); --line-2:rgba(255,255,255,.18);
  --pink:#F5347F; --pink-2:#FF6BA5; --pink-soft:rgba(245,52,127,.14);
  --violet:#9A7BFF; --violet-2:#BCA6FF; --violet-soft:rgba(154,123,255,.16);
  --bone:#F4F1F6; --smoke:#B4AEC2; --smoke-2:#7A7391;
  --disp:'Fraunces',Georgia,"Times New Roman",serif;
  --body:'Inter',system-ui,-apple-system,sans-serif;
  --cond:'Oswald',"Arial Narrow",sans-serif;
  --script:'Dancing Script',cursive;
  --r:14px; --r-lg:26px; --pill:999px; --wrap:1200px; --pad:clamp(1.25rem,5vw,2.75rem);
  --shadow:0 20px 50px rgba(0,0,0,.5); --shadow-lg:0 34px 74px rgba(0,0,0,.62);
  --glow-p:0 0 26px rgba(245,52,127,.42); --glow-v:0 0 26px rgba(154,123,255,.4);
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0; background:var(--ink); color:var(--bone); font-family:var(--body);
  font-size:clamp(1rem,.97rem + .2vw,1.08rem); line-height:1.65; -webkit-font-smoothing:antialiased; overflow-x:hidden}
img{max-width:100%; display:block}
a{color:inherit; text-decoration:none}
h1,h2,h3,h4{margin:0; line-height:1.05; font-weight:600}
p{margin:0 0 1rem}
ul{margin:0; padding:0; list-style:none}
::selection{background:var(--pink); color:#fff}

.wrap{width:100%; max-width:var(--wrap); margin-inline:auto; padding-inline:var(--pad)}
.sr,.skip{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap}
.skip:focus{position:fixed; top:12px; left:12px; width:auto; height:auto; clip:auto; padding:.6rem 1rem; background:var(--pink); color:#fff; z-index:999; border-radius:8px}
:focus-visible{outline:2px solid var(--violet-2); outline-offset:3px; border-radius:4px}

/* ---------- wordmark ---------- */
.wm{position:relative; display:inline-block; text-align:left; line-height:.9; font-size:1.5rem; padding-top:.36em}
.wm__the{position:absolute; top:-.28em; left:.02em; font-family:var(--script); font-weight:700; color:var(--pink); font-size:.66em; transform:rotate(-7deg); text-shadow:0 0 16px rgba(245,52,127,.5); z-index:2}
.wm__name{display:inline-block; font-family:var(--cond); font-weight:600; letter-spacing:.15em; color:var(--bone); border-bottom:.055em solid var(--pink); padding-bottom:.04em; white-space:nowrap}
.wm--lg{font-size:clamp(2.7rem,7vw,5.2rem)}
.wm--sm{font-size:1.3rem}

/* ---------- buttons ---------- */
.btn{--bg:transparent; --fg:var(--bone); --bd:var(--line-2);
  display:inline-flex; align-items:center; gap:.55rem; justify-content:center;
  font-family:var(--body); font-weight:600; font-size:.9rem; letter-spacing:.005em;
  padding:.85rem 1.6rem; border-radius:var(--pill); border:2px solid var(--bd); background:var(--bg); color:var(--fg);
  cursor:pointer; transition:transform .18s ease, box-shadow .25s ease, background .2s, color .2s, border-color .2s}
.btn:hover{transform:translateY(-2px)}
.btn--primary{--bg:var(--pink); --fg:#fff; --bd:var(--pink); box-shadow:var(--glow-p)}
.btn--primary:hover{--bg:var(--pink-2); --bd:var(--pink-2); box-shadow:0 0 34px rgba(245,52,127,.62)}
.btn--ghost{--bg:transparent; --fg:var(--bone); --bd:var(--line-2)}
.btn--ghost:hover{--bd:var(--violet); --fg:var(--violet-2); box-shadow:var(--glow-v)}
.btn--onpink{--bg:#fff; --fg:var(--pink); --bd:#fff}
.btn--onpink:hover{--bg:transparent; --fg:#fff; --bd:#fff}
.btn--onpink-ghost{--bg:transparent; --fg:#fff; --bd:rgba(255,255,255,.6)}
.btn--onpink-ghost:hover{--bd:#fff; --bg:rgba(255,255,255,.12)}
.btn--sm{padding:.62rem 1.15rem; font-size:.82rem}
.btn--order::before{content:""; width:8px; height:8px; border-radius:50%; background:currentColor; box-shadow:0 0 8px currentColor}
.link{font-family:var(--body); font-weight:600; font-size:.9rem; color:var(--violet-2); border-bottom:1.5px solid transparent; transition:border-color .2s}
.link:hover{border-color:var(--violet-2)}

/* ---------- eyebrow + headings ---------- */
.eyebrow{font-family:var(--body); font-weight:600; font-size:.78rem; letter-spacing:.16em; text-transform:uppercase; color:var(--pink); display:flex; align-items:center; gap:.6rem; margin:0 0 1rem}
.eyebrow::before{content:""; width:26px; height:2px; background:currentColor}
.h-sec{font-family:var(--disp); font-weight:600; font-optical-sizing:auto; font-size:clamp(2rem,5vw,3.4rem); line-height:1.04; letter-spacing:-.01em; color:var(--bone)}
.h-sec em{font-style:italic; color:var(--pink)}
.lead{font-size:clamp(1.06rem,1rem + .45vw,1.3rem); color:var(--smoke); max-width:56ch; margin-top:1rem}
.body{color:var(--smoke); max-width:58ch}

/* ---------- nav ---------- */
.nav{position:sticky; top:0; z-index:120; background:linear-gradient(to bottom,rgba(10,10,15,.82),rgba(10,10,15,0));
  border-bottom:1px solid transparent; transition:box-shadow .3s, border-color .3s, background .3s}
.nav.scrolled{background:rgba(10,10,15,.93); backdrop-filter:blur(12px); border-bottom-color:var(--line); box-shadow:0 8px 30px rgba(0,0,0,.5)}
.nav__inner{max-width:1300px; margin-inline:auto; padding:.65rem var(--pad); display:flex; align-items:center; gap:1.5rem}
.nav__brand{margin-right:auto; display:flex; align-items:center}
.nav__brand .wm{font-size:1.5rem}
.nav__menu{display:flex; align-items:center; gap:1.6rem}
.nav__menu>a{font-family:var(--body); font-weight:600; font-size:.92rem; color:var(--smoke); position:relative; padding:.35rem 0; transition:color .2s}
.nav__menu>a::after{content:""; position:absolute; left:0; right:100%; bottom:-2px; height:2px; background:var(--pink); transition:right .25s}
.nav__menu>a:hover{color:var(--bone)} .nav__menu>a:hover::after{right:0}
.nav__menu>a.is-active{color:var(--bone)} .nav__menu>a.is-active::after{right:0}
.nav__status{display:inline-flex; align-items:center; gap:.4rem; font-family:var(--body); font-weight:500; font-size:.72rem; letter-spacing:.04em; text-transform:uppercase; color:var(--smoke); padding:.32rem .7rem; border:1px solid var(--line); border-radius:var(--pill); white-space:nowrap}
.nav__status .dot{width:8px; height:8px; border-radius:50%; background:var(--smoke-2)}
.nav__status.is-open{color:var(--violet-2); border-color:rgba(154,123,255,.4)}
.nav__status.is-open .dot{background:#3ad07a; box-shadow:0 0 0 0 rgba(58,208,122,.6); animation:pulse 2s infinite}
.nav__status.is-closed .dot{background:var(--pink)}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(58,208,122,.55)}70%{box-shadow:0 0 0 7px rgba(58,208,122,0)}100%{box-shadow:0 0 0 0 rgba(58,208,122,0)}}
.nav__toggle{display:none; flex-direction:column; gap:5px; width:44px; height:44px; align-items:center; justify-content:center; background:transparent; border:1px solid var(--line); border-radius:10px; cursor:pointer}
.nav__toggle span:not(.sr){width:22px; height:2px; background:var(--bone); transition:transform .25s, opacity .25s}
.nav.is-open .nav__toggle span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav.is-open .nav__toggle span:nth-child(2){opacity:0}
.nav.is-open .nav__toggle span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* ---------- hero (asymmetric editorial) ---------- */
.hero{position:relative; overflow:hidden; padding:clamp(2.5rem,6vw,5rem) 0 clamp(3rem,6vw,4.5rem);
  background:
    radial-gradient(70% 60% at 12% 12%, rgba(245,52,127,.2), transparent 60%),
    radial-gradient(60% 60% at 100% 8%, rgba(154,123,255,.2), transparent 58%),
    linear-gradient(180deg, var(--ink-2), var(--ink) 72%)}
.hero__wrap{position:relative; z-index:1; display:grid; grid-template-columns:1.3fr .7fr; gap:clamp(2rem,5vw,4rem); align-items:center}
.hero__eyebrow{font-family:var(--body); font-weight:600; font-size:.82rem; letter-spacing:.16em; text-transform:uppercase; color:var(--pink); display:flex; align-items:center; gap:.6rem; margin-bottom:1.5rem}
.hero__eyebrow::before{content:""; width:32px; height:2px; background:var(--pink)}
.hero__wm{margin-bottom:1.5rem}
.hero__wm .wm__the{text-shadow:0 0 22px rgba(245,52,127,.7)}
.hero__head{font-family:var(--disp); font-weight:600; font-optical-sizing:auto; font-size:clamp(2.3rem,6vw,4.1rem); line-height:1.02; letter-spacing:-.015em; color:var(--bone); margin-bottom:1.1rem}
.hero__head em{font-style:italic; color:var(--pink)}
.hero__tag{font-size:clamp(1.06rem,1rem + .4vw,1.25rem); color:var(--smoke); max-width:46ch; margin-bottom:1.9rem}
.hero__cta{display:flex; flex-wrap:wrap; gap:.8rem; margin-bottom:1.7rem}
.hero__facts{display:flex; flex-wrap:wrap; align-items:center; gap:.55rem 1.2rem; font-family:var(--body); font-size:.94rem; color:var(--smoke)}
.hero__facts a{color:var(--smoke); border-bottom:1px solid var(--line-2)}
.hero__facts a:hover{color:var(--pink); border-color:var(--pink)}
.hero__facts .sep{width:5px; height:5px; border-radius:50%; background:var(--pink)}
.hero__facts .live{display:inline-flex; align-items:center; gap:.4rem; font-weight:600}
.hero__facts .live .dot{width:9px; height:9px; border-radius:50%; background:var(--smoke-2)}
.hero__facts .live.is-open{color:var(--violet-2)} .hero__facts .live.is-open .dot{background:#3ad07a; box-shadow:0 0 8px #3ad07a}
.hero__facts .live.is-closed{color:var(--pink)} .hero__facts .live.is-closed .dot{background:var(--pink)}
/* rotating seal */
.hero__aside{display:flex; justify-content:center}
.seal{position:relative; width:min(360px,78%); aspect-ratio:1; filter:drop-shadow(0 0 40px rgba(154,123,255,.25))}
.seal__svg{width:100%; height:100%; transform-origin:50% 50%; animation:spin 28s linear infinite}
.seal__svg text{font-family:var(--cond); font-weight:600; font-size:11.5px; letter-spacing:2.6px; fill:var(--bone); text-transform:uppercase}
.seal__ring{fill:none; stroke:var(--pink); stroke-width:2}
.seal__disc{fill:var(--panel)}
.seal__center{position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; gap:.15rem}
.seal__star{color:var(--pink); font-size:1.5rem; line-height:1; text-shadow:0 0 16px rgba(245,52,127,.6)}
.seal__center b{font-family:var(--disp); font-weight:600; font-size:1.7rem; color:var(--bone); letter-spacing:-.01em}
.seal__center span{font-family:var(--body); font-weight:600; font-size:.62rem; letter-spacing:.18em; text-transform:uppercase; color:var(--smoke)}
@keyframes spin{to{transform:rotate(360deg)}}

/* ---------- info bar (violet band) ---------- */
.infobar{background:linear-gradient(90deg,#1B1440,#241a52); color:var(--bone); border-top:3px solid var(--pink); border-bottom:1px solid rgba(255,255,255,.06)}
.infobar__in{display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:.35rem 1.5rem; padding:.85rem var(--pad); font-family:var(--body); font-weight:500; font-size:.92rem; text-align:center}
.infobar__item{display:inline-flex; align-items:center; gap:.5rem}
.infobar b{color:#fff; font-weight:600}
.infobar a{color:#fff; border-bottom:1px solid rgba(255,255,255,.4)}
.infobar a:hover{border-color:#fff}
.infobar__star{color:var(--pink-2)}

/* ---------- sections + color blocks ---------- */
.section{padding:clamp(3.5rem,8vw,6rem) 0; position:relative}
.section--paper2{background:var(--ink-2); border-block:1px solid var(--line)}
.section--green{position:relative; background:linear-gradient(180deg,#140F24,#1A1330 55%,#140F24); border-block:1px solid var(--line)}
.section--green::before{content:""; position:absolute; inset:0; pointer-events:none; background:radial-gradient(60% 60% at 100% 0%, rgba(154,123,255,.14), transparent 60%)}
.section--green>*{position:relative}
.section--green .eyebrow{color:var(--violet-2)}
.section--pink{position:relative; overflow:hidden; background:linear-gradient(120deg,var(--pink),#C81E76 60%,var(--violet)); color:#fff; border-block:1px solid rgba(255,255,255,.12)}

/* ---------- house favorites ---------- */
.favs{display:grid; grid-template-columns:repeat(3,1fr); gap:1.2rem; margin-top:clamp(2rem,5vw,3rem)}
.fav{position:relative; background:linear-gradient(180deg,#1C1533,#141020); color:var(--bone); border:1px solid var(--line); border-radius:var(--r-lg); padding:1.6rem 1.5rem 1.3rem; overflow:hidden; transition:transform .25s, box-shadow .25s, border-color .25s}
.fav::before{content:""; position:absolute; top:0; left:0; right:0; height:3px; background:linear-gradient(90deg,var(--pink),var(--violet))}
.fav:hover{transform:translateY(-6px); border-color:rgba(245,52,127,.5); box-shadow:var(--shadow-lg)}
.fav__num{font-family:var(--disp); font-style:italic; font-weight:500; font-size:1.05rem; color:var(--pink)}
.fav__name{font-family:var(--disp); font-weight:600; font-size:1.5rem; line-height:1.06; margin:.25rem 0 .5rem; color:var(--bone)}
.fav__desc{color:var(--smoke); font-size:.92rem; margin:0 0 1.1rem}
.fav__foot{display:flex; align-items:center; justify-content:space-between; gap:1rem; border-top:1px solid var(--line); padding-top:.85rem}
.fav__cat{font-family:var(--body); font-weight:600; font-size:.7rem; letter-spacing:.09em; text-transform:uppercase; color:var(--smoke-2)}
.fav__price{font-family:var(--disp); font-weight:600; font-size:1.2rem; color:var(--pink)}
.favs__foot{text-align:center; margin-top:2.4rem}

/* ---------- story ---------- */
.story{display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem,5vw,4rem); align-items:center}
.story__quote{font-family:var(--disp); font-style:italic; font-weight:500; font-size:clamp(1.4rem,3vw,2.05rem); line-height:1.28; color:var(--bone); margin:0}
.story__quote span{color:var(--pink)}
.stats{display:flex; gap:1.6rem; flex-wrap:wrap; margin-top:1.4rem}
.stat{flex:1; min-width:120px}
.stat b{display:block; font-family:var(--disp); font-weight:600; font-size:2.5rem; color:var(--pink); line-height:1}
.stat span{font-family:var(--body); font-weight:500; font-size:.78rem; letter-spacing:.06em; text-transform:uppercase; color:var(--smoke)}

/* ---------- pink/violet CTA band ---------- */
.ctaband{position:relative; z-index:1; text-align:center; padding:clamp(3rem,7vw,5rem) 0}
.ctaband h2{font-family:var(--disp); font-weight:600; font-size:clamp(2rem,5vw,3.4rem); color:#fff; line-height:1.05; margin-bottom:.6rem}
.ctaband h2 em{font-style:italic}
.ctaband p{color:rgba(255,255,255,.92); max-width:48ch; margin:0 auto 1.7rem}

/* ---------- gallery ---------- */
.gteaser{display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; margin-top:2.4rem}
.gallery{display:grid; grid-template-columns:repeat(3,1fr); gap:1.2rem; padding:clamp(2rem,5vw,3.5rem) 0}
.gtile{position:relative; aspect-ratio:4/3; border-radius:var(--r-lg); border:2px dashed var(--line-2); background:var(--panel);
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.55rem; text-align:center; padding:1rem; transition:border-color .2s, background .2s}
.gtile:hover{border-color:var(--pink); background:var(--pink-soft)}
.gteaser .gtile{aspect-ratio:1; border-radius:var(--r)}
.gtile svg{width:30px; height:30px; fill:none; stroke:var(--pink); stroke-width:1.6}
.gtile span{font-family:var(--body); font-weight:600; font-size:.88rem; color:var(--bone)}
.gtile small{font-family:var(--body); font-weight:500; font-size:.66rem; letter-spacing:.11em; text-transform:uppercase; color:var(--smoke-2)}
.gallery a.gtile{cursor:pointer} .gallery a.gtile img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; border-radius:inherit}

/* ---------- location ---------- */
.loc__grid{display:grid; grid-template-columns:1fr 1.1fr; gap:clamp(2rem,5vw,4rem); align-items:center}
.loc__addr{font-style:normal; font-family:var(--body); font-size:1.05rem; color:var(--bone); margin:1.1rem 0 1.4rem; line-height:1.7}
.loc__addr a{color:var(--pink)}
.hours{background:var(--panel); border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; margin-bottom:1.6rem}
.hours li{display:flex; justify-content:space-between; gap:1rem; padding:.72rem 1.2rem; border-bottom:1px solid var(--line); font-family:var(--body); font-size:.92rem}
.hours li:last-child{border-bottom:0}
.hours li span{color:var(--smoke)} .hours li b{color:var(--bone); font-weight:600}
.hours li.today{background:var(--pink-soft)} .hours li.today b, .hours li.today span{color:var(--pink-2)}
.loc__actions{display:flex; gap:.8rem; flex-wrap:wrap}
.loc__map{border-radius:var(--r-lg); overflow:hidden; border:1px solid var(--line-2); box-shadow:var(--shadow-lg); aspect-ratio:4/3; background:var(--panel)}
.loc__map iframe{width:100%; height:100%; border:0; filter:invert(.92) hue-rotate(180deg) brightness(.95) contrast(.9)}

/* ---------- page header ---------- */
.phead{position:relative; padding:clamp(6rem,11vw,8.5rem) 0 clamp(2.4rem,5vw,3.4rem); text-align:center; border-bottom:1px solid var(--line); overflow:hidden;
  background:radial-gradient(80% 130% at 50% -20%, rgba(245,52,127,.2), transparent 60%), radial-gradient(50% 90% at 92% 120%, rgba(154,123,255,.18), transparent 60%), var(--ink-2)}
.phead__in, .phead>.wrap{position:relative}
.phead .eyebrow{justify-content:center}
.phead h1{font-family:var(--disp); font-weight:600; font-size:clamp(2.4rem,7vw,4.2rem); line-height:1.0; letter-spacing:-.01em; color:var(--bone)}
.phead h1 em{font-style:italic; color:var(--pink)}
.phead p{color:var(--smoke); max-width:56ch; margin:1rem auto 0}

/* ---------- menu ---------- */
.menu-note{display:flex; align-items:flex-start; gap:.7rem; max-width:var(--wrap); margin:1.5rem auto 0; padding:.9rem 1.15rem; background:var(--panel); border:1px solid var(--line); border-left:3px solid var(--pink); border-radius:var(--r); font-family:var(--body); font-size:.86rem; color:var(--smoke)}
.menu-jump{position:sticky; top:56px; z-index:90; background:rgba(10,10,15,.92); backdrop-filter:blur(10px); border-bottom:1px solid var(--line)}
.menu-jump__in{display:flex; gap:.4rem; overflow-x:auto; padding:.7rem var(--pad); scrollbar-width:none}
.menu-jump__in::-webkit-scrollbar{display:none}
.menu-jump a{flex:0 0 auto; font-family:var(--body); font-weight:600; font-size:.8rem; color:var(--smoke); padding:.42rem .9rem; border:1px solid var(--line); border-radius:var(--pill); transition:.2s; white-space:nowrap}
.menu-jump a:hover{color:var(--bone); border-color:var(--line-2)}
.menu-jump a.active{color:#fff; background:var(--pink); border-color:var(--pink)}
.menu-cat{padding:clamp(2.2rem,6vw,3.4rem) 0; border-bottom:1px solid var(--line); scroll-margin-top:120px}
.menu-cat__head{display:flex; align-items:center; gap:1rem; margin-bottom:.4rem}
.menu-cat__head h2{font-family:var(--disp); font-weight:600; font-size:clamp(1.7rem,5vw,2.7rem); color:var(--bone)}
.menu-cat__head .rule{flex:1; height:2px; background:linear-gradient(90deg,var(--pink),transparent)}
.menu-cat__note{color:var(--smoke); font-size:.95rem; max-width:70ch; margin:0 0 1.6rem; font-style:italic}
.menu-list{display:grid; grid-template-columns:repeat(2,1fr); gap:.2rem 3rem}
.menu-item{padding:.85rem 0; border-bottom:1px dashed var(--line)}
.menu-item__top{display:flex; align-items:baseline; gap:.5rem}
.menu-item__name{font-family:var(--body); font-weight:700; font-size:1.05rem; color:var(--bone)}
.menu-item__dots{flex:1; border-bottom:1px dotted var(--smoke-2); transform:translateY(-3px); min-width:1.2rem}
.menu-item__price{font-family:var(--disp); font-weight:600; color:var(--pink); white-space:nowrap}
.menu-item__desc{color:var(--smoke); font-size:.88rem; margin:.2rem 0 0; max-width:54ch}
.menu-item.is-fav .menu-item__name::after{content:"★"; color:var(--pink); font-size:.8em; margin-left:.4rem}

.sauces{padding:clamp(2.2rem,6vw,3.4rem) 0}
.sauces__head{display:flex; align-items:center; gap:1rem; margin-bottom:.35rem}
.sauces__head h2{font-family:var(--disp); font-weight:600; font-size:clamp(1.6rem,4vw,2.3rem); color:var(--bone)}
.sauces__head .rule{flex:1; height:2px; background:linear-gradient(90deg,var(--violet),transparent)}
.sauces__note{color:var(--smoke); font-style:italic; margin-bottom:1.4rem}
.sauce-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:.35rem 1.6rem}
.sauce{display:flex; align-items:baseline; gap:.5rem; padding:.5rem 0; border-bottom:1px dashed var(--line)}
.sauce__name{font-weight:600; color:var(--bone); font-size:.95rem}
.sauce__dots{flex:1; border-bottom:1px dotted var(--smoke-2); transform:translateY(-3px)}
.sauce__price{font-family:var(--body); font-size:.8rem; color:var(--smoke)}
.sauce__price b{color:var(--pink); font-weight:600}

.advisory{max-width:var(--wrap); margin:0 auto; padding:2rem var(--pad) 0; text-align:center}
.advisory p{font-size:.78rem; color:var(--smoke-2); max-width:72ch; margin:0 auto; line-height:1.6}
.advisory b{color:var(--smoke); text-transform:uppercase; letter-spacing:.06em; font-size:.72rem; display:block; margin-bottom:.3rem}

/* ---------- events ---------- */
.about__card{position:relative; border:1px solid var(--line); border-left:3px solid var(--pink); border-radius:var(--r-lg); padding:clamp(1.5rem,4vw,2.2rem); background:var(--panel); max-width:var(--wrap); margin-inline:auto}
.week{display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:1.1rem}
.night{position:relative; padding:1.5rem; border:1px solid var(--line); border-radius:var(--r-lg); background:linear-gradient(180deg,#1A1330,#141020); transition:transform .25s, box-shadow .25s, border-color .25s}
.night:hover{transform:translateY(-4px); border-color:rgba(245,52,127,.4); box-shadow:var(--shadow-lg)}
.night__day{font-family:var(--body); font-weight:600; font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; color:var(--violet-2)}
.night__title{font-family:var(--disp); font-weight:600; font-size:1.5rem; margin:.45rem 0 .3rem; color:var(--bone)}
.night__time{font-family:var(--body); font-weight:600; font-size:.85rem; color:var(--pink)}
.night__desc{color:var(--smoke); font-size:.9rem; margin:.6rem 0 0}
.night--hl{border-color:rgba(245,52,127,.5); box-shadow:var(--glow-p)}
.callout{margin-top:2.5rem; text-align:center; padding:clamp(2rem,5vw,2.8rem) 1.5rem; border-radius:var(--r-lg); background:linear-gradient(120deg,rgba(245,52,127,.16),rgba(154,123,255,.16)); border:1px solid var(--line)}
.callout h3{font-family:var(--disp); font-weight:600; font-size:clamp(1.5rem,4vw,2.2rem); margin-bottom:.6rem; color:var(--bone)}
.callout p{color:var(--smoke); max-width:48ch; margin:0 auto 1.4rem}

/* ---------- contact ---------- */
.contact-grid{display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem,5vw,3.5rem)}
.info-card{background:var(--panel); border:1px solid var(--line); border-radius:var(--r-lg); padding:1.5rem; margin-bottom:1rem; display:flex; gap:1rem; align-items:flex-start; transition:transform .2s, border-color .2s}
.info-card:hover{transform:translateY(-3px); border-color:var(--line-2)}
.info-card__ic{flex:0 0 44px; height:44px; display:flex; align-items:center; justify-content:center; border-radius:12px; background:var(--pink-soft)}
.info-card__ic svg{width:22px; height:22px; fill:none; stroke:var(--pink); stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round}
.info-card h3{font-family:var(--body); font-weight:600; font-size:.74rem; letter-spacing:.1em; text-transform:uppercase; color:var(--smoke); margin-bottom:.35rem}
.info-card p{margin:0; color:var(--bone)} .info-card a{color:var(--pink)}
.form{border:1px solid var(--line); border-radius:var(--r-lg); padding:clamp(1.5rem,4vw,2.2rem); background:var(--panel)}
.form h2{font-family:var(--disp); font-weight:600; font-size:1.7rem; margin-bottom:1.2rem; color:var(--bone)}
.field{margin-bottom:1rem}
.field label{display:block; font-family:var(--body); font-weight:600; font-size:.74rem; letter-spacing:.05em; text-transform:uppercase; color:var(--smoke); margin-bottom:.4rem}
.field input,.field textarea{width:100%; padding:.8rem 1rem; background:var(--ink); border:1px solid var(--line-2); border-radius:12px; color:var(--bone); font-family:var(--body); font-size:1rem; transition:border-color .2s, box-shadow .2s}
.field input:focus,.field textarea:focus{outline:none; border-color:var(--pink); box-shadow:0 0 0 3px rgba(245,52,127,.2)}
.field textarea{resize:vertical; min-height:120px}

/* ---------- legal ---------- */
.legal{max-width:820px; margin:0 auto; padding:clamp(2.5rem,6vw,4rem) 0}
.legal__updated{font-family:var(--body); font-weight:600; font-size:.78rem; letter-spacing:.04em; text-transform:uppercase; color:var(--pink); margin-bottom:2rem}
.legal h2{font-family:var(--disp); font-weight:600; font-size:clamp(1.3rem,3.5vw,1.85rem); color:var(--bone); margin:2.2rem 0 .8rem}
.legal h2:first-of-type{margin-top:0}
.legal p, .legal li{color:var(--smoke); line-height:1.75}
.legal p{margin:0 0 1rem}
.legal ul{margin:0 0 1rem; padding-left:1.15rem; list-style:disc}
.legal li{margin-bottom:.4rem}
.legal a{color:var(--pink); border-bottom:1px solid transparent; transition:border-color .2s}
.legal a:hover{border-color:var(--pink)}
.legal strong{color:var(--bone)}
.legal__note{margin-top:2.5rem; padding:1.1rem 1.3rem; border:1px solid var(--line); border-left:3px solid var(--pink); border-radius:8px; background:var(--pink-soft)}
.legal__note p{margin:0; font-size:.86rem; color:var(--smoke-2)}

/* ---------- footer ---------- */
.foot{position:relative; background:var(--ink-2); color:var(--smoke); border-top:4px solid var(--pink); padding-top:clamp(3rem,6vw,4.5rem); overflow:hidden}
.foot__glow{position:absolute; top:-40%; left:50%; transform:translateX(-50%); width:80%; height:300px; background:radial-gradient(closest-side,rgba(154,123,255,.14),transparent); pointer-events:none}
.foot__grid{display:grid; grid-template-columns:1.6fr 1fr 1.2fr 1.2fr; gap:2rem; position:relative; padding-bottom:2.5rem}
.foot__wm{display:inline-block; margin-bottom:1rem}
.foot .wm__name{color:var(--bone)}
.foot__tag{color:var(--smoke); font-size:.92rem; max-width:34ch; margin:0 0 1.1rem}
.foot__social{display:flex; gap:.6rem; margin-top:1.1rem; flex-wrap:wrap}
.foot__social a{font-family:var(--body); font-weight:500; font-size:.74rem; letter-spacing:.03em; color:var(--smoke); border:1px solid var(--line); padding:.4rem .85rem; border-radius:var(--pill); transition:.2s}
.foot__social a:hover{color:var(--pink); border-color:var(--pink)}
.foot__col h4{font-family:var(--body); font-weight:600; font-size:.74rem; letter-spacing:.1em; text-transform:uppercase; color:var(--bone); margin-bottom:1rem}
.foot__col a{display:block; color:var(--smoke); font-size:.92rem; padding:.2rem 0; transition:color .2s}
.foot__col a:hover{color:var(--pink)}
.foot__col p{color:var(--smoke); font-size:.92rem; margin:0 0 .6rem}
.foot__hours li{display:flex; justify-content:space-between; gap:.8rem; font-size:.82rem; color:var(--smoke); padding:.13rem 0}
.foot__hours b{color:var(--bone); font-family:var(--body); font-size:.8rem; font-weight:600}
.foot__bar{display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap; padding:1.4rem var(--pad); border-top:1px solid var(--line)}
.foot__bar p{margin:0; font-size:.8rem; color:var(--smoke-2)}
.foot__copy{order:1} .foot__legal{order:2; display:flex; align-items:center; gap:1rem; flex-wrap:wrap; justify-content:center} .foot__credit{order:3}
.foot__legal a{font-family:var(--body); font-size:.8rem; color:var(--smoke); border-bottom:1px solid transparent; transition:.2s}
.foot__legal a:hover{color:var(--pink); border-color:var(--pink)}
.foot__age{font-family:var(--body); font-weight:700; font-size:.72rem; letter-spacing:.03em; color:#fff; background:var(--pink); padding:.15rem .5rem; border-radius:6px}
.foot__credit a{color:var(--violet-2); font-weight:600}
.totop{position:fixed; right:1.2rem; bottom:1.2rem; z-index:120; width:46px; height:46px; border-radius:50%; border:1px solid var(--line-2); background:rgba(10,10,15,.85); color:var(--bone); font-size:1.2rem; cursor:pointer; opacity:0; transform:translateY(12px); pointer-events:none; transition:.25s; backdrop-filter:blur(8px)}
.totop.show{opacity:1; transform:none; pointer-events:auto}
.totop:hover{border-color:var(--pink); color:var(--pink)}

/* ---------- age gate (only if re-enabled) ---------- */
.agegate{display:none; position:fixed; inset:0; z-index:500; padding:1.5rem; align-items:center; justify-content:center; background:rgba(6,5,9,.96); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px)}
html.age-lock, html.age-lock body{overflow:hidden}
html.age-lock #ageGate{display:flex}
.agegate__card{max-width:460px; width:100%; text-align:center; padding:clamp(2rem,5vw,2.8rem); background:var(--panel); border:1px solid var(--line-2); border-radius:var(--r-lg); box-shadow:var(--shadow-lg), var(--glow-p)}
.agegate .wm{margin-bottom:1.2rem}
.agegate__card h2{font-family:var(--disp); font-weight:600; font-size:clamp(1.5rem,5vw,2rem); color:var(--bone); margin-bottom:.5rem}
.agegate__card p{color:var(--smoke); font-size:.95rem; margin:0 0 1.4rem}
.agegate__btns{display:flex; gap:.8rem; justify-content:center; flex-wrap:wrap}
.agegate__btns .btn{min-width:132px}
.agegate__deny{color:var(--pink-2)!important; font-size:.9rem!important; margin:1.2rem 0 0!important}
.agegate__law{font-family:var(--body); font-size:.72rem!important; letter-spacing:.03em; color:var(--smoke-2)!important; margin:1.2rem 0 0!important; text-transform:uppercase}

/* ---------- lightbox ---------- */
.lb{display:none; position:fixed; inset:0; z-index:600; background:rgba(6,5,9,.94); align-items:center; justify-content:center; padding:2rem}
.lb.open{display:flex}
.lb img{max-width:90vw; max-height:86vh; border-radius:10px; box-shadow:0 30px 80px rgba(0,0,0,.7)}
.lb__btn{position:absolute; background:rgba(255,255,255,.12); color:#fff; border:none; width:52px; height:52px; border-radius:50%; font-size:1.6rem; cursor:pointer; transition:background .2s}
.lb__btn:hover{background:var(--pink)}
.lb__close{top:1.2rem; right:1.2rem} .lb__prev{left:1.2rem; top:50%; transform:translateY(-50%)} .lb__next{right:1.2rem; top:50%; transform:translateY(-50%)}

/* ---------- reveal ---------- */
[data-reveal]{opacity:0; transform:translateY(22px); transition:opacity .7s ease, transform .7s cubic-bezier(.2,.7,.2,1)}
[data-reveal].in{opacity:1; transform:none}

/* ---------- responsive ---------- */
@media(max-width:980px){
  .hero__wrap{grid-template-columns:1fr; gap:2.5rem}
  .hero__aside{order:-1; justify-content:flex-start}
  .story{grid-template-columns:1fr}
  .favs{grid-template-columns:1fr 1fr}
  .gteaser{grid-template-columns:repeat(2,1fr)}
  .gallery{grid-template-columns:1fr 1fr}
  .loc__grid{grid-template-columns:1fr} .loc__map{aspect-ratio:16/10}
  .contact-grid{grid-template-columns:1fr}
  .foot__grid{grid-template-columns:1fr 1fr}
}
@media(max-width:860px){
  .nav__toggle{display:flex}
  .nav__menu{position:fixed; inset:64px 10px auto 10px; flex-direction:column; align-items:stretch; gap:.2rem;
    padding:1rem; background:var(--ink-2); border:1px solid var(--line-2); border-radius:16px; box-shadow:var(--shadow-lg);
    transform:translateY(-14px); opacity:0; visibility:hidden; transition:.28s ease}
  .nav.is-open .nav__menu{transform:none; opacity:1; visibility:visible}
  .nav__menu>a{padding:.75rem .4rem; border-bottom:1px solid var(--line)}
  .nav__menu>a::after{display:none}
  .nav__status{justify-content:center; margin-top:.5rem}
  .menu-list{grid-template-columns:1fr; gap:0}
  .menu-jump{top:0}
}
@media(max-width:560px){
  .favs{grid-template-columns:1fr}
  .foot__grid{grid-template-columns:1fr}
  .hero__cta{flex-direction:column; width:100%} .hero__cta .btn{width:100%}
  .seal{width:min(260px,70%)}
  .foot__bar{flex-direction:column; text-align:center; gap:.9rem}
}

/* ---------- reduced motion ---------- */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important}
  [data-reveal]{opacity:1; transform:none}
  .seal__svg{animation:none}
}

/* ============================================================================
   v3.1 — real photography
   ============================================================================ */

/* photo hero */
.hero--photo{min-height:90vh; display:flex; align-items:flex-end; padding:0; background:var(--ink)}
.hero--photo .hero__photo{position:absolute; inset:0; background-size:cover; background-position:center; z-index:0}
.hero--photo .hero__scrim{position:absolute; inset:0; z-index:1;
  background:
    linear-gradient(180deg, rgba(10,10,15,.5) 0%, rgba(10,10,15,.12) 32%, rgba(10,10,15,.78) 86%, var(--ink) 100%),
    radial-gradient(80% 60% at 15% 95%, rgba(245,52,127,.24), transparent 60%),
    radial-gradient(70% 60% at 100% 0%, rgba(154,123,255,.18), transparent 55%)}
.hero--photo .hero__content{position:relative; z-index:2; width:100%; padding-top:8rem; padding-bottom:clamp(2.5rem,6vw,4.5rem)}
.hero--photo .hero__eyebrow{color:var(--pink-2)}
.hero--photo .hero__head{color:#fff; text-shadow:0 2px 30px rgba(0,0,0,.55); max-width:20ch}
.hero--photo .hero__tag{color:#ECE8F2; max-width:52ch; text-shadow:0 1px 14px rgba(0,0,0,.65)}
.hero--photo .hero__facts{color:#DAD5E4}
.hero--photo .hero__facts a{color:#ECE8F2; border-bottom-color:rgba(255,255,255,.4)}
.hero--photo .wm__name{color:#fff}

/* food favorite cards (photo) */
.favs--photo .fav{padding:0; overflow:hidden; display:flex; flex-direction:column}
.fav__img{aspect-ratio:4/3; background-size:cover; background-position:center}
.favs--photo .fav__body{padding:1.3rem 1.4rem 1.4rem; display:flex; flex-direction:column; flex:1}
.favs--photo .fav__top{display:flex; align-items:baseline; justify-content:space-between; gap:1rem; margin-bottom:.15rem}
.favs--photo .fav__name{margin:.1rem 0 .5rem}
.favs--photo .fav__desc{margin-bottom:0}

/* "what's inside" feature photo tiles */
.features{display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; margin-top:clamp(2rem,5vw,3rem)}
.feature{position:relative; aspect-ratio:3/4; border-radius:var(--r-lg); overflow:hidden; border:1px solid var(--line); display:flex; align-items:flex-end}
.feature__img{position:absolute; inset:0; background-size:cover; background-position:center; transition:transform .5s ease}
.feature:hover .feature__img{transform:scale(1.06)}
.feature__scrim{position:absolute; inset:0; background:linear-gradient(180deg, rgba(10,10,15,.08) 38%, rgba(10,10,15,.86))}
.feature__label{position:relative; z-index:1; padding:1.1rem; width:100%}
.feature__label b{display:block; font-family:var(--disp); font-weight:600; font-size:1.25rem; color:#fff; line-height:1.12}
.feature__label span{font-family:var(--body); font-size:.82rem; color:var(--smoke)}

/* private room feature */
.private{display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem,5vw,3.5rem); align-items:center}
.private__imgs{display:grid; grid-template-columns:1fr 1fr; gap:.7rem}
.private__imgs a{display:block; border-radius:var(--r); overflow:hidden; border:1px solid var(--line-2); aspect-ratio:4/3}
.private__imgs a:first-child{grid-column:1 / -1; aspect-ratio:16/8}
.private__imgs img{width:100%; height:100%; object-fit:cover; transition:transform .5s}
.private__imgs a:hover img{transform:scale(1.05)}
.private__rate{display:inline-flex; align-items:baseline; gap:.5rem; margin:.2rem 0 1.1rem}
.private__rate b{font-family:var(--disp); font-weight:600; font-size:2.4rem; color:var(--pink); line-height:1}
.private__rate span{font-family:var(--body); color:var(--smoke)}
.private__tags{display:flex; flex-wrap:wrap; gap:.5rem; margin:0 0 1.6rem}
.private__tags li{font-family:var(--body); font-size:.8rem; color:var(--bone); padding:.4rem .8rem; border:1px solid var(--line-2); border-radius:var(--pill)}

/* full-width photo band */
.photoband{position:relative; min-height:58vh; display:flex; align-items:center; overflow:hidden; border-block:1px solid var(--line)}
.photoband__img{position:absolute; inset:0; background-size:cover; background-position:center}
.photoband__scrim{position:absolute; inset:0; background:linear-gradient(90deg, rgba(10,10,15,.9), rgba(10,10,15,.55) 58%, rgba(10,10,15,.32))}
.photoband__in{position:relative; z-index:1; padding-block:clamp(3rem,7vw,5rem)}

/* gallery photo grid */
.gallery a.gtile{border-style:solid; border-color:var(--line-2); background:var(--panel)}
.gallery a.gtile img{transition:transform .5s ease}
.gallery a.gtile:hover img{transform:scale(1.06)}
.gallery a.gtile::after{content:""; position:absolute; inset:0; box-shadow:inset 0 0 0 0 var(--pink); transition:box-shadow .2s; pointer-events:none; border-radius:inherit}
.gallery a.gtile:hover::after{box-shadow:inset 0 0 0 2px var(--pink)}

@media(max-width:980px){
  .features{grid-template-columns:1fr 1fr}
  .private{grid-template-columns:1fr}
  .hero--photo{min-height:auto; padding-top:1rem}
  .hero--photo .hero__content{padding-top:3rem}
}

/* ============================================================================
   v3.2 — LED / neon (evokes the venue's RGB strips + neon signage)
   ============================================================================ */
:root{ --led1:#ff2e88; --led2:#9a7bff; --led3:#22d3ee; --led4:#3ad07a; --led5:#ffd23f; }

/* animated RGB LED strip — under the nav + as section dividers */
.nav__led, .ledstrip{
  height:3px; width:100%; border:0; margin:0; display:block;
  background:linear-gradient(90deg, var(--led1), var(--led2), var(--led3), var(--led4), var(--led5), var(--led1));
  background-size:200% 100%;
  animation:ledflow 7s linear infinite;
  box-shadow:0 0 10px rgba(245,52,127,.55), 0 0 22px rgba(154,123,255,.35);
}
.nav__led{position:relative; z-index:121}
.ledstrip{height:4px; opacity:.95}
@keyframes ledflow{ to{ background-position:200% 0 } }

/* neon-glow headline text */
.hero--photo .hero__head.neon{ color:#fff;
  text-shadow:0 0 8px rgba(255,150,195,.65), 0 0 22px rgba(245,52,127,.5), 0 0 46px rgba(245,52,127,.35), 0 2px 30px rgba(0,0,0,.55); }
.hero--photo .hero__head.neon em,
.h-sec.neon em{ color:#ff5fa0;
  text-shadow:0 0 8px rgba(255,95,160,.9), 0 0 22px rgba(245,52,127,.75), 0 0 46px rgba(245,52,127,.5);
  animation:neonbreath 3.6s ease-in-out infinite; }
.h-sec.neon{ color:#fff; text-shadow:0 0 20px rgba(245,52,127,.28); }
@keyframes neonbreath{ 0%,100%{ filter:brightness(1) } 50%{ filter:brightness(1.22) } }

/* neon script sign — echoes 'Til Death Do Us Party / Legends Lounge neon */
.neonsign{ font-family:var(--script); font-weight:400; line-height:1.05; color:#ff8ac0;
  font-size:clamp(2.1rem,5.5vw,3.5rem); display:inline-block;
  text-shadow:0 0 7px rgba(255,138,192,.95), 0 0 18px rgba(245,52,127,.8), 0 0 40px rgba(245,52,127,.55);
  animation:neonflicker 6s infinite; }
@keyframes neonflicker{
  0%,18%,22%,25%,53%,57%,100%{ opacity:1 }
  20%{ opacity:.66 } 24%{ opacity:.86 } 55%{ opacity:.78 } }

/* wordmark glow */
.wm__name{ text-shadow:0 0 10px rgba(245,52,127,.32), 0 0 22px rgba(154,123,255,.2) }
.hero--photo .wm__name{ text-shadow:0 0 12px rgba(245,52,127,.55), 0 0 26px rgba(154,123,255,.3) }

/* LED-lit primary buttons */
.btn--primary{ box-shadow:0 0 0 1px rgba(245,52,127,.5), 0 6px 22px rgba(245,52,127,.38), 0 0 26px rgba(245,52,127,.22) }
.btn--primary:hover{ box-shadow:0 0 0 1px rgba(245,52,127,.75), 0 8px 30px rgba(245,52,127,.55), 0 0 42px rgba(245,52,127,.4) }

/* neon edge on hover for tiles/cards */
.feature, .favs--photo .fav{ transition:box-shadow .3s ease, transform .5s ease }
.feature:hover, .favs--photo .fav:hover{ box-shadow:0 0 0 1px rgba(245,52,127,.5), 0 0 26px rgba(245,52,127,.26) }

@media (prefers-reduced-motion: reduce){
  .nav__led, .ledstrip{ animation:none; background-position:0 0 }
  .hero--photo .hero__head.neon em, .h-sec.neon em{ animation:none }
  .neonsign{ animation:none }
}

/* ============================================================================
   v3.3 — menu neon / LED
   ============================================================================ */
.menu-cat__head h2{ text-shadow:0 0 14px rgba(245,52,127,.3), 0 0 30px rgba(154,123,255,.18) }
.menu-cat__head .rule{ height:3px; background:linear-gradient(90deg,var(--led1),var(--led2),var(--led3),var(--led4),var(--led5),var(--led1)); background-size:200% 100%; animation:ledflow 7s linear infinite; box-shadow:0 0 8px rgba(245,52,127,.4); opacity:.92 }
.sauces__head .rule{ height:3px; background:linear-gradient(90deg,var(--led2),var(--led3),var(--led1),var(--led2)); background-size:200% 100%; animation:ledflow 8s linear infinite; box-shadow:0 0 8px rgba(154,123,255,.4); opacity:.92 }
.menu-item.is-fav{ padding-left:.9rem; border-left:2px solid var(--pink); box-shadow:-8px 0 20px -8px rgba(245,52,127,.55) }
.menu-item.is-fav .menu-item__name{ color:var(--pink-2); text-shadow:0 0 12px rgba(245,52,127,.4) }
.menu-jump__in a:hover, .menu-jump__in a.is-active{ text-shadow:0 0 10px rgba(245,52,127,.5) }
.sauce-chips{ display:flex; flex-wrap:wrap; gap:.6rem; margin:.4rem 0 1.2rem }
.sauce-chip{ font-family:var(--body); font-size:.9rem; color:var(--bone); padding:.5rem 1rem; border:1px solid var(--line-2); border-radius:var(--pill); background:var(--card); transition:box-shadow .25s, border-color .25s }
.sauce-chip:hover{ border-color:rgba(245,52,127,.6); box-shadow:0 0 16px rgba(245,52,127,.28) }
.sauces__extra{ font-family:var(--body); font-size:.85rem; color:var(--smoke) }
.specials-banner{ text-align:center; padding:clamp(2rem,5vw,3rem); border:1px solid var(--line-2); border-radius:var(--r-lg); background:radial-gradient(120% 120% at 50% 0%, rgba(245,52,127,.09), var(--card)); margin-top:clamp(2.5rem,6vw,3.5rem); box-shadow:0 0 30px rgba(245,52,127,.12) }
.specials-banner p{ font-family:var(--body); color:var(--smoke); margin:.6rem 0 0 }
@media (prefers-reduced-motion: reduce){ .menu-cat__head .rule, .sauces__head .rule{ animation:none } }

/* ============================================================================
   v3.4 — happy hour
   ============================================================================ */
.hh{ padding-top:clamp(1.4rem,3vw,2rem) }
.hh__panel{ background:radial-gradient(130% 120% at 50% 0%, rgba(154,123,255,.1), var(--panel)); border:1px solid var(--line-2); border-radius:var(--r-lg); padding:clamp(1.6rem,4vw,2.8rem); box-shadow:0 0 44px rgba(154,123,255,.12) }
.hh__head{ display:flex; align-items:flex-end; justify-content:space-between; gap:1rem; flex-wrap:wrap; margin-bottom:1.4rem; padding-bottom:1.1rem; border-bottom:1px solid var(--line) }
.hh__head .h-sec{ margin:0 }
.hh__when{ text-align:right; font-family:var(--body) }
.hh__when b{ display:block; font-family:var(--cond); text-transform:uppercase; letter-spacing:.07em; color:var(--violet-2); font-size:1.05rem; text-shadow:0 0 14px rgba(154,123,255,.5) }
.hh__when span{ color:var(--smoke); font-size:.9rem }
.hh__grid{ display:grid; grid-template-columns:1.25fr 1fr; gap:clamp(1.4rem,4vw,3rem) }
.hh__food{ border-left:1px solid var(--line); padding-left:clamp(1.4rem,4vw,3rem) }
.hh__grp{ font-family:var(--disp); font-weight:600; font-size:1.25rem; color:var(--pink-2); margin:1.5rem 0 .2rem; text-shadow:0 0 14px rgba(245,52,127,.4) }
.hh__grp:first-child{ margin-top:0 }
.hh__area{ font-family:var(--body); font-size:.78rem; color:var(--smoke); font-weight:400 }
.menu-jump__in a[href="#happy-hour"]{ color:var(--pink-2) }
@media(max-width:820px){
  .hh__grid{ grid-template-columns:1fr }
  .hh__food{ border-left:0; padding-left:0; margin-top:.4rem; border-top:1px solid var(--line); padding-top:.6rem }
}

/* ============================================================================
   v3.5 — contact "message us" (social, no form)
   ============================================================================ */
.reachcard{ background:var(--card); border:1px solid var(--line-2); border-radius:var(--r-lg); padding:clamp(1.6rem,4vw,2.4rem) }
.reachcard h2{ font-family:var(--disp); font-weight:600; font-size:clamp(1.5rem,3.5vw,2rem); color:var(--bone); margin:0 0 .5rem }
.reachcard>p{ font-family:var(--body); color:var(--smoke); margin:0 0 1.4rem; line-height:1.6 }
.social-btns{ display:flex; flex-direction:column; gap:.7rem; margin-bottom:1.1rem }
.social-btn{ display:flex; align-items:center; gap:1rem; padding:.85rem 1.05rem; border:1px solid var(--line-2); border-radius:var(--r); background:var(--panel); transition:border-color .2s, box-shadow .25s, transform .2s }
.social-btn:hover{ border-color:rgba(245,52,127,.5); box-shadow:0 0 22px rgba(245,52,127,.2); transform:translateY(-1px) }
.social-btn__ic{ flex:none; width:44px; height:44px; display:grid; place-items:center; border-radius:12px; background:var(--panel-2); border:1px solid var(--line); transition:border-color .2s, box-shadow .25s }
.social-btn__ic svg{ width:21px; height:21px }
.social-btn__ic svg.fill{ fill:var(--bone); stroke:none }
.social-btn__tx{ flex:1; display:flex; flex-direction:column; line-height:1.25 }
.social-btn__tx b{ font-family:var(--body); font-weight:600; color:var(--bone); font-size:1rem }
.social-btn__tx small{ font-family:var(--body); color:var(--smoke); font-size:.82rem }
.social-btn__arrow{ color:var(--smoke); font-size:1.15rem; transition:transform .2s, color .2s }
.social-btn:hover .social-btn__arrow{ color:var(--pink-2); transform:translateX(3px) }
.social-btn--ig:hover .social-btn__ic{ border-color:rgba(245,52,127,.55); box-shadow:0 0 16px rgba(245,52,127,.32) }
.social-btn--fb:hover .social-btn__ic{ border-color:rgba(64,120,242,.6); box-shadow:0 0 16px rgba(64,120,242,.35) }
.social-btn--gg:hover .social-btn__ic{ border-color:rgba(154,123,255,.55); box-shadow:0 0 16px rgba(154,123,255,.32) }
.social-btn--mail:hover .social-btn__ic{ border-color:rgba(58,208,122,.55); box-shadow:0 0 16px rgba(58,208,122,.32) }

/* ============================================================================
   v3.6 — beaded LED rope, hero readability, spacing, private "starting at"
   ============================================================================ */

/* LED strips rendered as individual glowing beads (like the wall rope lights) */
.nav__led, .ledstrip{
  border:0; margin:0; display:block; box-shadow:none;
  background:linear-gradient(90deg, var(--led1), var(--led2), var(--led3), var(--led4), var(--led5), var(--led1));
  background-size:200% 100%;
  animation:ledflow 7s linear infinite;
  -webkit-mask:radial-gradient(circle 2.6px at center, #000 0 68%, transparent 76%) 0 50% / 12px 100% repeat-x;
          mask:radial-gradient(circle 2.6px at center, #000 0 68%, transparent 76%) 0 50% / 12px 100% repeat-x;
  filter:drop-shadow(0 0 3px rgba(255,255,255,.4)) drop-shadow(0 0 7px rgba(245,52,127,.5));
}
.nav__led{ height:7px }
.ledstrip{ height:9px }

/* darker hero so text (esp. pink) reads clearly against the photo */
.hero--photo .hero__scrim{
  background:
    linear-gradient(90deg, rgba(6,6,10,.86) 0%, rgba(6,6,10,.56) 38%, rgba(6,6,10,.16) 70%, transparent 100%),
    linear-gradient(180deg, rgba(6,6,10,.46) 0%, rgba(6,6,10,.2) 42%, rgba(6,6,10,.82) 88%, var(--ink) 100%),
    radial-gradient(55% 55% at 100% 0%, rgba(154,123,255,.13), transparent 55%);
}
/* dark halo behind hero text for legibility, softer neon glow on top */
.hero--photo .hero__head.neon{ color:#fff;
  text-shadow:0 1px 2px rgba(0,0,0,.92), 0 2px 12px rgba(0,0,0,.72), 0 0 16px rgba(255,150,195,.36), 0 0 34px rgba(245,52,127,.26) }
.hero--photo .hero__head.neon em{ color:#ff78b4;
  text-shadow:0 1px 2px rgba(0,0,0,.92), 0 2px 10px rgba(0,0,0,.72), 0 0 12px rgba(255,120,180,.68), 0 0 28px rgba(245,52,127,.42) }
.hero--photo .wm__name{ text-shadow:0 1px 3px rgba(0,0,0,.88), 0 0 12px rgba(245,52,127,.4), 0 0 24px rgba(154,123,255,.26) }
.hero--photo .wm__the{ text-shadow:0 1px 3px rgba(0,0,0,.9), 0 0 12px rgba(245,52,127,.5) }
.hero--photo .hero__eyebrow{ text-shadow:0 1px 3px rgba(0,0,0,.85) }
.hero--photo .hero__tag{ text-shadow:0 1px 4px rgba(0,0,0,.9) }

/* menu order band: breathing room above the footer */
.orderband{ padding-bottom:clamp(3rem,7vw,4.5rem) }

/* private room "Starting at" label */
.private__pre{ font-family:var(--body); font-weight:600; text-transform:uppercase; letter-spacing:.1em; font-size:.72rem; color:var(--violet-2); margin:0 0 -.1rem; text-shadow:0 0 12px rgba(154,123,255,.4) }

/* ============================================================================
   v3.7 — contact: balanced columns + full-width stretched map
   ============================================================================ */
.contact-grid{ align-items:start }
.contact-map{ aspect-ratio:auto; height:clamp(320px,32vw,460px) }

/* ============================================================================
   v3.8 — hero slideshow, responsive <picture> images, FAQ, menu photo strip,
          magic-wand cursor  (boulevardboynton.com launch)
   ============================================================================ */

/* ---------- hero slideshow (cross-fade, loops) ---------- */
.hero--slider{ --hero-fade:1.6s; --hero-dur:5.1s }
.hero--photo .hero__slides{ position:absolute; inset:0; z-index:0; overflow:hidden; background:var(--ink) }
.hero__slide{ position:absolute; inset:0; margin:0; opacity:0; transition:opacity var(--hero-fade) ease-in-out; will-change:opacity }
.hero__slide img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; transform:scale(1.06) }
.hero__slide.is-active{ opacity:1; z-index:2 }
.hero__slide.is-prev{ opacity:1; z-index:1; transition:none }
/* slow "breathing" zoom on the visible photo — subtle, keeps the hero alive */
.hero__slide.is-active img{ animation:heroken var(--hero-dur) ease-out forwards }
@keyframes heroken{ from{ transform:scale(1.06) } to{ transform:scale(1) } }

/* dots + pause */
.hero__ctrl{ position:absolute; right:clamp(1rem,3vw,2.4rem); bottom:clamp(1.1rem,3vw,2.4rem); z-index:3; display:flex; align-items:center; gap:.5rem }
.hero__dot{ width:10px; height:10px; padding:0; border-radius:50%; border:1px solid rgba(255,255,255,.55); background:rgba(255,255,255,.16); cursor:pointer; transition:background .25s, transform .25s, box-shadow .25s, border-color .25s }
.hero__dot:hover{ background:rgba(255,255,255,.45) }
.hero__dot.is-active{ background:var(--pink); border-color:var(--pink); box-shadow:0 0 10px rgba(245,52,127,.85); transform:scale(1.2) }
.hero__pause{ margin-left:.35rem; width:30px; height:30px; border-radius:50%; border:1px solid rgba(255,255,255,.35); background:rgba(10,10,15,.5); color:#fff; display:grid; place-items:center; padding:0; cursor:pointer; backdrop-filter:blur(6px); transition:border-color .2s, background .2s }
.hero__pause:hover{ border-color:var(--pink); background:rgba(245,52,127,.25) }
.hero__pause-ic{ display:block; width:8px; height:10px; border-left:2.5px solid currentColor; border-right:2.5px solid currentColor }
.hero__pause[aria-pressed="true"] .hero__pause-ic{ width:0; height:0; border-left:9px solid currentColor; border-right:0; border-top:5.5px solid transparent; border-bottom:5.5px solid transparent; margin-left:3px }

/* H1 now wraps the eyebrow + headline (better for search engines, looks identical) */
.hero__title{ margin:0; font-weight:inherit; line-height:inherit }
.hero__title .hero__eyebrow{ margin-bottom:1.5rem }
.hero__title .hero__head{ display:block }

/* ---------- real <img>/<picture> inside the existing photo components ---------- */
picture{ display:block; line-height:0 }
.fav__img{ display:block; width:100%; height:auto; aspect-ratio:4/3; object-fit:cover }
.feature picture{ position:absolute; inset:0 }
.feature__img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover }
.private__imgs picture{ height:100% }
.loc__map picture{ height:100% }
.loc__photo{ width:100%; height:100%; object-fit:cover; display:block }
.photoband picture{ position:absolute; inset:0 }
.photoband__img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover }
.gallery a.gtile picture{ position:absolute; inset:0 }
.story__cta{ display:flex; gap:1rem; flex-wrap:wrap; margin-top:1.4rem }
.story__side{ text-align:center }
.story__side .stats{ margin-top:2.2rem }
.loc__addr strong{ color:var(--bone); font-weight:600 }
.phead p a{ color:var(--pink-2); border-bottom:1px solid rgba(255,107,165,.5) }
.phead p a:hover{ border-color:var(--pink-2) }

/* ---------- menu page: photo strip ---------- */
.menu-strip{ border-bottom:1px solid var(--line); background:var(--ink-2) }
.menu-strip__in{ max-width:var(--wrap); margin:0 auto; padding:1.3rem var(--pad) 1.2rem; display:grid; grid-template-columns:repeat(6,1fr); gap:.8rem }
.menu-strip__item{ margin:0 }
.menu-strip__item a{ display:block; aspect-ratio:4/3; border-radius:var(--r); overflow:hidden; border:1px solid var(--line-2); background:var(--panel); position:relative; transition:border-color .2s, box-shadow .25s, transform .25s }
.menu-strip__item a:hover{ border-color:rgba(245,52,127,.6); box-shadow:0 0 18px rgba(245,52,127,.28); transform:translateY(-3px) }
.menu-strip__item picture{ position:absolute; inset:0 }
.menu-strip__item img{ width:100%; height:100%; object-fit:cover; transition:transform .5s ease }
.menu-strip__item a:hover img{ transform:scale(1.06) }
.menu-strip__item figcaption{ font-family:var(--body); font-size:.76rem; font-weight:600; color:var(--smoke); margin-top:.5rem; letter-spacing:.02em; text-align:center }
@media(max-width:980px){ .menu-strip__in{ grid-template-columns:repeat(3,1fr) } }
@media(max-width:560px){
  .menu-strip__in{ display:flex; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; gap:.7rem }
  .menu-strip__in::-webkit-scrollbar{ display:none }
  .menu-strip__item{ flex:0 0 68vw; scroll-snap-align:start }
}

/* ---------- FAQ ---------- */
.faq__list{ max-width:860px; margin-top:clamp(1.6rem,4vw,2.4rem) }
.faq__item{ border:1px solid var(--line); border-radius:var(--r); background:var(--card); margin-bottom:.7rem; overflow:hidden; transition:border-color .2s, box-shadow .25s }
.faq__item[open]{ border-color:rgba(245,52,127,.45); box-shadow:0 0 22px rgba(245,52,127,.12) }
.faq__item summary{ list-style:none; cursor:pointer; padding:1rem 1.2rem; font-family:var(--body); font-weight:600; color:var(--bone); display:flex; justify-content:space-between; align-items:center; gap:1rem }
.faq__item summary::-webkit-details-marker{ display:none }
.faq__item summary::after{ content:"+"; flex:none; width:26px; height:26px; border-radius:50%; border:1px solid var(--line-2); display:grid; place-items:center; color:var(--pink); font-size:1.15rem; line-height:1; transition:transform .25s, background .2s }
.faq__item[open] summary::after{ content:"–"; background:var(--pink-soft) }
.faq__item summary:hover{ color:#fff }
.faq__a{ padding:0 1.2rem 1.1rem; color:var(--smoke); font-size:.95rem; line-height:1.65 }
.faq__a p{ margin:0 }
.faq__a a{ color:var(--pink-2); border-bottom:1px solid rgba(255,107,165,.5) }

/* ---------- contact: compact hours list + review line ---------- */
.hours--compact{ margin:.5rem 0 .9rem; border-radius:var(--r) }
.hours--compact li{ padding:.42rem .85rem; font-size:.86rem }
.info-card__addr{ font-style:normal; color:var(--bone); margin:0 0 .5rem; line-height:1.55 }
.info-card p + p{ margin-top:.35rem; color:var(--smoke); font-size:.92rem }
.info-card p + p a{ color:var(--pink) }
.reachcard__review{ margin:1rem 0 0 !important; font-size:.88rem !important; text-align:center }
.reachcard__review a{ color:var(--pink-2); border-bottom:1px solid rgba(255,107,165,.5) }

/* ---------- footer tweaks ---------- */
.foot__addr{ font-style:normal }
.foot__hh{ font-size:.8rem; color:var(--pink-2); margin-top:.7rem }

/* ---------- MAGIC-WAND CURSOR (mouse/trackpad devices only; touch keeps normal) ----------
   The real cursor is hidden and a small wand follows the pointer. The star slowly cycles
   through the LED colors while idle, and lights up (white-hot + sparkles) over links/buttons. */
html.has-wand, html.has-wand *{ cursor:none !important }
.wand{ position:fixed; left:0; top:0; width:36px; height:36px; z-index:9999; pointer-events:none; opacity:0;
  transform:translate3d(-100px,-100px,0); will-change:transform; transition:opacity .18s ease }
.wand.is-on{ opacity:1 }
.wand svg{ display:block; width:100%; height:100%; overflow:visible; transform-origin:7px 7px; transition:transform .22s cubic-bezier(.2,.7,.2,1);
  color:var(--led1); animation:wandhue 10s linear infinite }
.wand.is-lit svg{ transform:rotate(-14deg) }
.wand__outline{ stroke:rgba(10,10,15,.92) }
.wand__stick{ stroke:url(#wandStick) }
.wand__cap{ stroke:currentColor }
.wand__star{ fill:currentColor; transform-box:fill-box; transform-origin:center; transition:transform .2s ease, filter .2s ease;
  filter:drop-shadow(0 0 2px currentColor) drop-shadow(0 0 6px currentColor) }
.wand.is-lit .wand__star{ transform:scale(1.3);
  filter:drop-shadow(0 0 3px #fff) drop-shadow(0 0 9px currentColor) drop-shadow(0 0 18px currentColor) }
.wand.is-lit .wand__star path{ fill:#fff }
.wand.is-down .wand__star{ transform:scale(.8) }
.wand__spark{ fill:#fff; opacity:0; transform-box:fill-box; transform-origin:center }
.wand.is-lit .wand__spark{ animation:wandspark 1.1s ease-in-out infinite }
.wand.is-lit .wand__spark:nth-child(2){ animation-delay:.28s }
.wand.is-lit .wand__spark:nth-child(3){ animation-delay:.55s }
.wand.is-lit .wand__spark:nth-child(4){ animation-delay:.8s }
@keyframes wandhue{ 0%{color:#ff2e88} 20%{color:#9a7bff} 40%{color:#22d3ee} 60%{color:#3ad07a} 80%{color:#ffd23f} 100%{color:#ff2e88} }
@keyframes wandspark{ 0%,100%{ opacity:0; transform:scale(.3) } 50%{ opacity:1; transform:scale(1.25) } }

/* ---------- responsive ---------- */
@media(max-width:980px){
  .hero__ctrl{ right:auto; left:50%; transform:translateX(-50%); bottom:.9rem }
  .hero--photo .hero__content{ padding-bottom:4.4rem }
}

/* ---------- reduced motion ---------- */
@media (prefers-reduced-motion: reduce){
  .hero__slide, .hero__slide img{ transition:none; animation:none; transform:none }
  .wand svg{ animation:none; color:var(--pink) }
  .wand.is-lit .wand__spark{ animation:none; opacity:.9 }
}