/* ============================================================================
   D48 MIDRAND — Midrand's Ultimate Lifestyle Lounge
   Master stylesheet. Organised in clearly-labelled sections:
     1. Fonts
     2. Design tokens (:root)   ← all colour / type / motion variables live here
     3. Reset & base
     4. Typography helpers
     5. Layout primitives (container, section)
     6. Buttons & links
     7. Hairlines, labels, badges
     8. Glow, grain & texture utilities
     9. Divider system (shared-contour layered transitions)
    10. Scroll-reveal
    11. Header & navigation shell
   Page- and component-specific styles are appended in their own sections below.
   ========================================================================== */

/* ---- 1. FONTS ------------------------------------------------------------ */
@font-face{font-family:'Anton';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/anton-400.woff2') format('woff2');}
@font-face{font-family:'Oswald';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/oswald-500.woff2') format('woff2');}
@font-face{font-family:'Oswald';font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/oswald-600.woff2') format('woff2');}
@font-face{font-family:'Oswald';font-style:normal;font-weight:700;font-display:swap;src:url('../fonts/oswald-700.woff2') format('woff2');}
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/inter-400.woff2') format('woff2');}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/inter-500.woff2') format('woff2');}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/inter-600.woff2') format('woff2');}
@font-face{font-family:'Inter';font-style:normal;font-weight:700;font-display:swap;src:url('../fonts/inter-700.woff2') format('woff2');}

/* ---- 2. DESIGN TOKENS ---------------------------------------------------- */
:root{
  /* Surfaces — layered darks so the site never reads as flat black */
  --c-void:#060608;
  --c-obsidian:#0D0D11;
  --c-graphite:#16161C;
  --c-slate:#22222A;
  --c-steel:#33333D;
  /* Accents */
  --c-electric:#4D7CFF;      /* primary conversion accent */
  --c-electric-glow:#7BA0FF;
  --c-violet:#8B5CF6;        /* secondary — events / music */
  --c-violet-deep:#5B21B6;
  --c-gold:#C9A227;          /* VIP / tables / bottles ONLY = money */
  --c-gold-light:#E0C05A;
  /* Neutrals / text */
  --c-chrome:#C9CDD6;
  --c-chrome-bright:#E8EBF0;
  --c-bone:#F0F0F4;          /* body text */
  --c-muted:#8A8A98;         /* secondary labels ONLY — never body copy */
  /* Feedback */
  --c-success:#3FA37A;
  --c-error:#E0553F;
  /* Lines & effects */
  --c-border:rgba(240,240,244,0.12);
  --c-border-strong:rgba(240,240,244,0.22);
  --shadow-deep:0 30px 80px rgba(0,0,0,0.7);
  --shadow-card:0 12px 40px rgba(0,0,0,0.5);
  --glow-electric:0 0 48px rgba(77,124,255,0.35);
  --glow-violet:0 0 44px rgba(139,92,246,0.30);
  --glow-gold:0 0 40px rgba(201,162,39,0.28);

  /* Typography */
  --font-display:'Anton', Impact, 'Arial Narrow', sans-serif;
  --font-body:'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-poster:'Oswald', 'Arial Narrow', sans-serif;

  --text-xs:clamp(0.75rem,0.72rem + 0.1vw,0.82rem);
  --text-sm:clamp(0.86rem,0.82rem + 0.15vw,0.95rem);
  --text-base:clamp(1rem,0.95rem + 0.2vw,1.08rem);
  --text-lg:clamp(1.2rem,1.08rem + 0.45vw,1.42rem);
  --text-xl:clamp(1.55rem,1.3rem + 0.9vw,2.15rem);
  --text-2xl:clamp(2.2rem,1.7rem + 2vw,3.6rem);
  --text-3xl:clamp(3.1rem,2.2rem + 3.8vw,6.2rem);
  --text-hero:clamp(3.8rem,2.3rem + 6.2vw,9.5rem);
  --leading-body:1.6;
  --leading-display:0.92;
  --tracking-label:0.18em;
  --tracking-display:-0.02em;

  /* Radii — deliberately minimal & sharp */
  --radius-xs:2px;
  --radius-sm:4px;
  --radius-md:8px;
  --radius-lg:12px;
  --radius-pill:999px;

  /* Motion — sharper & faster than the other builds in this series */
  --ease-out:cubic-bezier(0.16,1,0.3,1);
  --ease-in-out:cubic-bezier(0.65,0,0.35,1);
  --dur-fast:200ms;
  --dur-mid:320ms;
  --dur-reveal:520ms;
  --stagger:80ms;

  /* Layout */
  --max-content:1600px;
  --content:1180px;
  --gutter:clamp(1.15rem,4vw,3.5rem);
  --section-y:clamp(4rem,9vw,8rem);
  --header-h:74px;

  /* Divider depth (shared by outgoing pad / incoming pull / stroke) */
  --edge-depth:clamp(90px,9vw,150px);

  /* z-index scale */
  --z-base:1;
  --z-raise:10;
  --z-header:100;
  --z-float:150;
  --z-nav:200;
  --z-modal:300;
  --z-lightbox:400;
}

/* ---- 3. RESET & BASE ----------------------------------------------------- */
*,*::before,*::after{box-sizing:border-box;}
*{margin:0;padding:0;}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth;}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto;}}

body{
  font-family:var(--font-body);
  font-size:var(--text-base);
  line-height:var(--leading-body);
  color:var(--c-bone);
  background:var(--c-void);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
  min-height:100vh;
  min-height:100dvh;
}
body.no-scroll{overflow:hidden;}

img,video,svg,canvas{display:block;max-width:100%;}
img,video{height:auto;}
a{color:inherit;text-decoration:none;}
button,input,select,textarea{font:inherit;color:inherit;}
button{background:none;border:none;cursor:pointer;}
ul,ol{list-style:none;}
:focus-visible{outline:2px solid var(--c-electric);outline-offset:3px;border-radius:var(--radius-xs);}
::selection{background:var(--c-electric);color:#fff;}

/* Skip link */
.skip-link{
  position:absolute;left:1rem;top:-100px;z-index:var(--z-lightbox);
  background:var(--c-electric);color:#fff;padding:.7rem 1.1rem;border-radius:var(--radius-sm);
  font-weight:600;font-size:var(--text-sm);transition:top var(--dur-fast) var(--ease-out);
}
.skip-link:focus{top:1rem;}

/* ---- 4. TYPOGRAPHY HELPERS ---------------------------------------------- */
.display{
  font-family:var(--font-display);
  font-weight:400;
  line-height:var(--leading-display);
  letter-spacing:var(--tracking-display);
  text-transform:uppercase;
}
h1,h2,h3{font-family:var(--font-display);font-weight:400;line-height:var(--leading-display);
  letter-spacing:var(--tracking-display);text-transform:uppercase;}
h1{font-size:var(--text-3xl);}
h2{font-size:var(--text-2xl);}
h3{font-size:var(--text-xl);}
p{max-width:64ch;}
strong{font-weight:600;color:var(--c-chrome-bright);}
.text-muted{color:var(--c-muted);}
.text-chrome{color:var(--c-chrome);}
.tabular{font-variant-numeric:tabular-nums;}
.price{font-variant-numeric:tabular-nums;font-weight:600;}

/* Small uppercase label — a recurring signature */
.label{
  font-family:var(--font-body);
  font-size:var(--text-xs);
  letter-spacing:var(--tracking-label);
  text-transform:uppercase;
  font-weight:600;
  color:var(--c-muted);
  display:inline-flex;align-items:center;gap:.55em;
}
.label--electric{color:var(--c-electric-glow);}
.label--gold{color:var(--c-gold-light);}
.label--violet{color:var(--c-violet);}
.label::before{content:"";width:1.6em;height:1px;background:currentColor;opacity:.6;}
.label.label--nodash::before{display:none;}

/* ---- 5. LAYOUT PRIMITIVES ----------------------------------------------- */
.wrap{width:100%;max-width:var(--max-content);margin-inline:auto;padding-inline:var(--gutter);}
.wrap--narrow{max-width:var(--content);}
.section{position:relative;padding-block:var(--section-y);}
.section--flush{padding-block:0;}
.stack>*+*{margin-top:1.1rem;}
.stack-lg>*+*{margin-top:2rem;}
.eyebrow{margin-bottom:1.1rem;}
.section-head{max-width:52ch;margin-bottom:clamp(2rem,4vw,3.4rem);}
.section-head h2{margin-top:.4rem;}
.section-head p{color:var(--c-chrome);margin-top:1rem;}

/* ---- 6. BUTTONS & LINKS -------------------------------------------------- */
.btn{
  --btn-bg:var(--c-electric);
  --btn-fg:#fff;
  display:inline-flex;align-items:center;justify-content:center;gap:.6em;
  font-family:var(--font-body);font-weight:600;font-size:var(--text-sm);
  letter-spacing:.02em;
  padding:.95em 1.6em;border-radius:var(--radius-sm);
  background:var(--btn-bg);color:var(--btn-fg);
  border:1px solid transparent;
  transition:transform var(--dur-fast) var(--ease-out),
             box-shadow var(--dur-fast) var(--ease-out),
             background var(--dur-fast) var(--ease-out),
             color var(--dur-fast) var(--ease-out);
  min-height:44px;text-align:center;cursor:pointer;
}
.btn:hover{box-shadow:var(--glow-electric);}
.btn:active{transform:translateY(1px);}
.btn--gold{--btn-bg:var(--c-gold);--btn-fg:#171200;}
.btn--gold:hover{box-shadow:var(--glow-gold);}
.btn--ghost{--btn-bg:transparent;--btn-fg:var(--c-bone);border-color:var(--c-border-strong);}
.btn--ghost:hover{border-color:var(--c-chrome);box-shadow:none;background:rgba(255,255,255,.04);}
.btn--violet{--btn-bg:var(--c-violet);--btn-fg:#fff;}
.btn--violet:hover{box-shadow:var(--glow-violet);}
.btn--lg{font-size:var(--text-base);padding:1.1em 2em;}
.btn--block{display:flex;width:100%;}

/* text link with animated underline */
.link{position:relative;color:var(--c-chrome-bright);font-weight:500;display:inline-flex;align-items:center;gap:.4em;}
.link::after{content:"";position:absolute;left:0;bottom:-2px;width:100%;height:1px;background:currentColor;
  transform:scaleX(0);transform-origin:left;transition:transform var(--dur-fast) var(--ease-out);}
.link:hover::after{transform:scaleX(1);}
.link--arrow::after{display:none;}
.link--arrow span{transition:transform var(--dur-fast) var(--ease-out);}
.link--arrow:hover span{transform:translateX(4px);}

/* ---- 7. HAIRLINES, BADGES ------------------------------------------------ */
.hairline{height:1px;width:100%;background:var(--c-border);border:0;}
.hairline--chrome{background:linear-gradient(90deg,transparent,var(--c-chrome),transparent);opacity:.4;}

.badge{
  display:inline-flex;align-items:center;gap:.45em;
  font-family:var(--font-poster);font-weight:600;font-size:var(--text-xs);
  letter-spacing:.08em;text-transform:uppercase;
  padding:.4em .7em;border-radius:var(--radius-xs);
  border:1px solid var(--c-border-strong);color:var(--c-chrome-bright);
  background:rgba(255,255,255,.04);white-space:nowrap;
}
.badge::before{content:"";width:.5em;height:.5em;border-radius:50%;background:currentColor;}
.badge--live{color:var(--c-electric-glow);border-color:rgba(77,124,255,.4);}
.badge--gold{color:var(--c-gold-light);border-color:rgba(201,162,39,.4);}
.badge--hot{color:var(--c-gold-light);border-color:rgba(224,192,90,.45);}
.badge--sold{color:var(--c-error);border-color:rgba(224,85,63,.45);}
.badge--free{color:var(--c-success);border-color:rgba(63,163,122,.45);}
.badge--closed{color:var(--c-muted);border-color:var(--c-border);}
/* status carried by text + a shape dot, never colour alone (a11y) */

/* ---- 8. GLOW, GRAIN & TEXTURE ------------------------------------------- */
/* Fractal-noise grain as an inline SVG data-URI — no external asset, very low opacity */
.grain::after{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:2;opacity:.05;
  mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
.glow-electric{box-shadow:var(--glow-electric);}
.glow-gold{box-shadow:var(--glow-gold);}

/* Slow glow pulse on primary CTAs / live indicators — 3.5s cycle, disabled on reduced motion */
@keyframes glowPulse{
  0%,100%{box-shadow:0 0 0 0 rgba(77,124,255,0);}
  50%{box-shadow:0 0 34px 2px rgba(77,124,255,.35);}
}
.pulse{animation:glowPulse 3.6s var(--ease-in-out) infinite;}
.pulse--gold{animation:glowPulse 3.6s var(--ease-in-out) infinite;}
.pulse--gold{--_c:var(--c-gold);}

/* Beam sweep — a slow diagonal light pass over hero/section-break imagery */
@keyframes beamSweep{
  0%{transform:translateX(-120%) skewX(-18deg);opacity:0;}
  35%{opacity:.5;}
  100%{transform:translateX(220%) skewX(-18deg);opacity:0;}
}
.beam{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:2;}
.beam::before{content:"";position:absolute;top:-20%;left:0;width:35%;height:140%;
  background:linear-gradient(90deg,transparent,rgba(123,160,255,.14),transparent);
  animation:beamSweep 9s var(--ease-in-out) infinite;}

/* Dark scrim helpers for text over media */
.scrim{position:absolute;inset:0;pointer-events:none;}
.scrim--btm{background:linear-gradient(180deg,transparent 20%,rgba(6,6,8,.55) 62%,var(--c-void) 100%);}
.scrim--left{background:linear-gradient(90deg,var(--c-void) 8%,rgba(6,6,8,.72) 40%,transparent 78%);}
.scrim--radial{background:radial-gradient(120% 90% at 30% 40%,transparent,rgba(6,6,8,.6) 75%,var(--c-void));}

/* ---- 9. DIVIDER SYSTEM (shared-contour layered transition) --------------
   One contour, one boundary. The contour's Y values are PIXEL depths within
   the --edge-depth band (calc(var(--edge-depth) * f)), so the clip never
   scales with section height. The incoming section pulls up by --edge-depth,
   is clipped with the SAME --edge-clip as the stroke, has an OPAQUE background
   and sits above the stroke — so only the ~8px shifted sliver of the stroke
   shows: a thin animated line riding the exact contour. */
.has-edge{padding-bottom:calc(var(--section-y) + var(--edge-depth) * .6);}
/* Paint order across the boundary: outgoing < stroke < incoming, purely by
   tree order. Do NOT add z-index values here — sections chain (each one is
   incoming for the divider above and outgoing for the one below), and any
   fixed number makes a section paint over the next divider's line. */
.edge-in{
  position:relative;
  margin-top:calc(-1 * var(--edge-depth));
  padding-top:calc(var(--section-y) + var(--edge-depth));
  clip-path:var(--edge-clip,none);
  background:var(--c-void); /* MUST be opaque to own the space below the contour */
}
.section-edge{
  position:relative;height:var(--edge-depth);margin-top:calc(-1 * var(--edge-depth));
  overflow:hidden;isolation:isolate;pointer-events:none;background:transparent;
  --edge-reveal:0;
}
.section-edge__stroke{
  position:absolute;inset:0;display:block;
  clip-path:var(--edge-clip,none);
  background:var(--edge-line,linear-gradient(90deg,rgba(201,205,214,.25),var(--c-chrome),rgba(201,205,214,.25)));
  transform:translateY(-8px) scaleX(var(--edge-reveal));
  transform-origin:left center;opacity:var(--edge-reveal);
  transition:opacity 420ms ease,transform 950ms var(--ease-out);
  will-change:transform,opacity;
}
.section-edge--from-right .section-edge__stroke{transform-origin:right center;}
.section-edge.is-in .section-edge__stroke{--edge-reveal:1;}
.section-edge--electric{--edge-line:linear-gradient(90deg,rgba(77,124,255,.35),var(--c-electric-glow),rgba(77,124,255,.35));}
.section-edge--gold{--edge-line:linear-gradient(90deg,rgba(201,162,39,.35),var(--c-gold-light),rgba(201,162,39,.35));}
.section-edge--violet{--edge-line:linear-gradient(90deg,rgba(139,92,246,.35),var(--c-violet),rgba(139,92,246,.35));}
@media (max-width:720px){:root{--edge-depth:70px;}
  .section-edge__stroke{transform:translateY(-5px) scaleX(var(--edge-reveal));}}

/* ---- 10. SCROLL-REVEAL --------------------------------------------------- */
.reveal{opacity:0;transform:translateY(26px);transition:opacity var(--dur-reveal) var(--ease-out),
  transform var(--dur-reveal) var(--ease-out);will-change:opacity,transform;}
.reveal.is-in{opacity:1;transform:none;}
.reveal[data-reveal="scale"]{transform:scale(1.05);}
.reveal[data-reveal="scale"].is-in{transform:none;}
.reveal[data-reveal="left"]{transform:translateX(-30px);}
.reveal[data-reveal="left"].is-in{transform:none;}
/* staggered children */
.reveal-group>*{opacity:0;transform:translateY(24px);
  transition:opacity var(--dur-reveal) var(--ease-out),transform var(--dur-reveal) var(--ease-out);}
.reveal-group.is-in>*{opacity:1;transform:none;}
.reveal-group.is-in>*{transition-delay:calc(var(--i,0) * var(--stagger));}

/* ---- 11. GLOBAL REDUCED MOTION ------------------------------------------ */
@media (prefers-reduced-motion:reduce){
  .pulse,.pulse--gold{animation:none;}
  .beam::before{animation:none;display:none;}
  .reveal,.reveal-group>*{opacity:1 !important;transform:none !important;transition:none !important;}
  .section-edge__stroke{--edge-reveal:1;opacity:1;transform:translateY(-7px);transition:none;}
  *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;
    transition-duration:.001ms !important;scroll-behavior:auto !important;}
}

/* ===========================================================================
   12. VISUAL FX LAYER (shaders + fallbacks)
   ========================================================================= */
.fx-host{position:relative;overflow:hidden;isolation:isolate;background:var(--c-obsidian);}
.fx-canvas{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:0;opacity:.92;}
.fx-host>*:not(.fx-canvas){position:relative;z-index:2;}
/* MagnetLines grid (pointer-following lines, background layer) */
.ml-grid{position:absolute;inset:0;z-index:0;display:grid;justify-items:center;align-items:center;
  pointer-events:none;opacity:.8;}
.ml-grid span{display:block;width:2px;height:26px;border-radius:2px;transform-origin:center;
  will-change:transform;transform:rotate(var(--rotate,-10deg));}

/* static gradient fallback when reduced-motion / no WebGL */
.fx-static{background:
  radial-gradient(120% 85% at 18% 8%, rgba(77,124,255,.16), transparent 55%),
  radial-gradient(90% 70% at 88% 24%, rgba(139,92,246,.14), transparent 60%),
  var(--c-obsidian);}
.fx-static.fx-gold{background:
  radial-gradient(120% 85% at 50% 0%, rgba(201,162,39,.16), transparent 60%), var(--c-void);}

/* ===========================================================================
   13. HEADER
   ========================================================================= */
.site-header{position:fixed;top:0;left:0;right:0;z-index:var(--z-header);
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
  height:var(--header-h);padding-inline:var(--gutter);
  border-bottom:1px solid transparent;
  transition:background var(--dur-mid) var(--ease-out),border-color var(--dur-mid);}
.site-header[data-solid="true"]{background:rgba(13,13,17,.82);
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom-color:var(--c-border);}
.sh-logo{display:inline-flex;align-items:center;}
/* logo.webp carries real alpha (black keyed out at build time) — only the
   white mark renders, at a confident size. */
.sh-logo img{height:56px;width:auto;display:block;}
.camp-header img{height:44px !important;}
.sh-logo-txt{font-family:var(--font-display);font-size:1.7rem;letter-spacing:.05em;color:var(--c-bone);}
.sh-actions{display:flex;align-items:center;gap:.7rem;}
.sh-book{padding:.65em 1.1em;font-size:var(--text-sm);}
.sh-toggle{display:inline-flex;align-items:center;gap:.55rem;color:var(--c-bone);padding:.4rem;}
.sh-toggle-txt{position:relative;display:inline-block;height:1em;overflow:hidden;
  font-weight:600;font-size:var(--text-xs);letter-spacing:.14em;text-transform:uppercase;}
.sh-toggle-inner{display:flex;flex-direction:column;transition:transform var(--dur-mid) var(--ease-out);}
.sh-toggle-inner>span{height:1em;line-height:1;}
.sh-toggle.is-open .sh-toggle-inner{transform:translateY(-1em);}
.sh-icon{position:relative;width:16px;height:16px;display:inline-block;}
.sh-icon-l{position:absolute;top:50%;left:0;width:100%;height:2px;background:currentColor;border-radius:2px;
  transform:translateY(-50%);transition:transform var(--dur-mid) var(--ease-out);}
.sh-icon-l--v{transform:translateY(-50%) rotate(90deg);}
.sh-toggle.is-open .sh-icon-l{transform:translateY(-50%) rotate(135deg);}
.sh-toggle.is-open .sh-icon-l--v{transform:translateY(-50%) rotate(225deg);}
@media (max-width:420px){.sh-book{padding:.6em .8em;letter-spacing:0;}}

/* ===========================================================================
   14. NAV OVERLAY (StaggeredMenu, dark)
   ========================================================================= */
.nav-overlay{position:fixed;inset:0;z-index:var(--z-nav);pointer-events:none;visibility:hidden;}
.nav-overlay[data-open="true"]{pointer-events:auto;visibility:visible;}
.nav-prelayer,.nav-panel{position:absolute;top:0;right:0;bottom:0;width:min(100%,540px);
  transform:translateX(100%);transition:transform .34s var(--ease-in-out);will-change:transform;}
.nav-prelayer--1{background:var(--c-graphite);}
.nav-prelayer--2{background:linear-gradient(180deg,var(--c-electric),var(--c-violet));opacity:.16;}
.nav-panel{background:var(--c-void);display:flex;flex-direction:column;justify-content:center;gap:1.6rem;
  padding:calc(var(--header-h) + 1.5rem) var(--gutter) 2rem;overflow-y:auto;border-left:1px solid var(--c-border);}
.nav-overlay[data-open="true"] .nav-prelayer--1{transform:translateX(0);transition:transform .5s var(--ease-out) 0s;}
.nav-overlay[data-open="true"] .nav-prelayer--2{transform:translateX(0);transition:transform .5s var(--ease-out) .07s;}
.nav-overlay[data-open="true"] .nav-panel{transform:translateX(0);transition:transform .6s var(--ease-out) .12s;}
.nav-list{display:flex;flex-direction:column;gap:.1rem;}
.nav-item{display:flex;align-items:baseline;gap:1rem;font-family:var(--font-display);text-transform:uppercase;
  font-size:clamp(1.9rem,7vw,3rem);line-height:1.02;color:var(--c-bone);padding:.12em 0;
  opacity:0;transform:translateY(120%) rotate(5deg);}
.nav-overlay[data-open="true"] .nav-item{opacity:1;transform:none;
  transition:opacity .5s var(--ease-out),transform .7s var(--ease-out);
  transition-delay:calc(.24s + var(--i) * .055s);}
.nav-num{font-family:var(--font-poster);font-size:.85rem;letter-spacing:.1em;color:var(--c-electric);opacity:.75;}
@media (hover:hover){.nav-item:hover{color:var(--c-electric-glow);transform:translateX(6px);}}
.nav-item.is-active{color:var(--c-electric-glow);}
.nav-item.is-active .nav-num{color:var(--c-gold);}
.nav-foot{display:flex;flex-direction:column;gap:1rem;margin-top:1rem;}
.nav-social{display:flex;gap:1.4rem;}
.nav-social a{color:var(--c-chrome);font-weight:600;font-size:var(--text-sm);}
.nav-social a:hover{color:var(--c-bone);}
.nav-addr{color:var(--c-muted);font-size:var(--text-sm);}
@media (prefers-reduced-motion:reduce){
  .nav-prelayer,.nav-panel,.nav-item{transition:none !important;}
  .nav-overlay[data-open="true"] .nav-prelayer,.nav-overlay[data-open="true"] .nav-panel,
  .nav-overlay[data-open="true"] .nav-item{transform:none;opacity:1;}
}

/* ===========================================================================
   15. FLOATING WHATSAPP
   ========================================================================= */
.wa-float{position:fixed;z-index:var(--z-float);
  right:max(1rem,env(safe-area-inset-right));bottom:max(1rem,env(safe-area-inset-bottom));
  display:inline-flex;align-items:center;gap:.5rem;background:#25D366;color:#052b13;
  padding:.7rem .95rem;border-radius:var(--radius-pill);font-weight:700;font-size:var(--text-sm);
  box-shadow:0 12px 32px rgba(0,0,0,.5);transition:transform var(--dur-fast) var(--ease-out),box-shadow var(--dur-fast);}
.wa-float:hover{transform:translateY(-2px) scale(1.03);box-shadow:0 16px 40px rgba(37,211,102,.35);}
.wa-float svg{flex:none;}
@media (max-width:520px){.wa-float-label{display:none;}.wa-float{padding:.8rem;}}

/* ===========================================================================
   16. STATUS STRIP
   ========================================================================= */
.status-strip{display:inline-flex;align-items:center;gap:.55rem;flex-wrap:wrap;
  font-size:var(--text-sm);color:var(--c-chrome);border:1px solid var(--c-border);
  border-radius:var(--radius-pill);padding:.5rem .95rem;background:rgba(13,13,17,.5);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);}
.status-dot{width:.6rem;height:.6rem;border-radius:50%;flex:none;}
.status-dot.is-open{background:var(--c-success);box-shadow:0 0 10px rgba(63,163,122,.8);}
.status-dot.is-closed{background:var(--c-muted);}
.status-sep{opacity:.4;}
.status-next{color:var(--c-electric-glow);font-weight:600;}
.status-next:hover{text-decoration:underline;}

/* ===========================================================================
   17. HERO (layered: copy left · media right)
   ========================================================================= */
.hero{position:relative;min-height:94vh;min-height:94svh;display:flex;align-items:flex-end;
  overflow:hidden;isolation:isolate;padding-top:var(--header-h);}
.hero__bg{position:absolute;inset:0;z-index:0;}
.hero__media{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;}
.hero__scrim{position:absolute;inset:0;z-index:1;
  background:linear-gradient(90deg,var(--c-void) 6%,rgba(6,6,8,.72) 38%,transparent 72%),
             linear-gradient(0deg,var(--c-void) 4%,rgba(6,6,8,.35) 34%,transparent 62%);}
.hero__inner{position:relative;z-index:3;width:100%;padding-block:clamp(2.5rem,7vw,5.5rem);
  display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(1.5rem,4vw,3rem);align-items:end;}
.hero__title{font-size:var(--text-hero);margin:.3rem 0;}
.hero__tag{color:var(--c-chrome);font-size:var(--text-lg);max-width:26ch;margin-bottom:1.6rem;}
.hero__ctas{display:flex;flex-wrap:wrap;gap:.8rem;align-items:center;margin-bottom:1.4rem;}
.hero__reel{position:relative;aspect-ratio:9/16;max-height:62vh;border-radius:var(--radius-md);
  overflow:hidden;border:1px solid var(--c-border);box-shadow:var(--shadow-deep);align-self:end;margin-left:auto;width:100%;}
.hero__reel video,.hero__reel img{width:100%;height:100%;object-fit:cover;}
@media (max-width:900px){
  .hero__inner{grid-template-columns:1fr;}
  .hero__reel{display:none;}
}

/* generic full-bleed media reel wrapper */
.reel-frame{position:relative;aspect-ratio:9/16;overflow:hidden;border-radius:var(--radius-md);
  border:1px solid var(--c-border);background:var(--c-graphite);}
.reel-frame video,.reel-frame img{width:100%;height:100%;object-fit:cover;display:block;}
.reel-unmute{position:absolute;right:.6rem;bottom:.6rem;z-index:3;display:inline-flex;align-items:center;gap:.4rem;
  background:rgba(6,6,8,.7);color:var(--c-bone);border:1px solid var(--c-border);border-radius:var(--radius-pill);
  padding:.4rem .7rem;font-size:var(--text-xs);font-weight:600;}
.reel-play{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;z-index:3;
  background:rgba(6,6,8,.35);color:#fff;}
.reel-play svg{width:56px;height:56px;filter:drop-shadow(0 4px 14px rgba(0,0,0,.6));}

/* ===========================================================================
   18. CARDS / GRIDS / RAILS
   ========================================================================= */
.grid{display:grid;gap:clamp(1rem,2vw,1.4rem);}
.grid--2{grid-template-columns:repeat(2,minmax(0,1fr));}
.grid--3{grid-template-columns:repeat(3,minmax(0,1fr));}
.grid--4{grid-template-columns:repeat(4,minmax(0,1fr));}
@media (max-width:1000px){.grid--4{grid-template-columns:repeat(2,minmax(0,1fr));}.grid--3{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (max-width:600px){.grid--2,.grid--3,.grid--4{grid-template-columns:1fr;}}

.card{position:relative;display:flex;flex-direction:column;background:var(--c-graphite);
  border:1px solid var(--c-border);border-radius:var(--radius-md);overflow:hidden;}
.card__media{position:relative;aspect-ratio:4/3;overflow:hidden;}
.card__media img{width:100%;height:100%;object-fit:cover;transition:transform var(--dur-reveal) var(--ease-out);}
@media (hover:hover){.card:hover .card__media img{transform:scale(1.05);}}
.card__body{display:flex;flex-direction:column;gap:.6rem;padding:1.1rem;flex:1;}
.card__body .card-actions{margin-top:auto;padding-top:.6rem;}
.card__title{font-family:var(--font-display);text-transform:uppercase;font-size:var(--text-lg);line-height:1.02;}

/* horizontal rail */
.rail{display:flex;gap:1rem;overflow-x:auto;scroll-snap-type:x mandatory;
  padding-bottom:1rem;-webkit-overflow-scrolling:touch;scrollbar-width:thin;}
.rail>*{scroll-snap-align:start;flex:0 0 auto;}
.rail::-webkit-scrollbar{height:6px;}
.rail::-webkit-scrollbar-thumb{background:var(--c-steel);border-radius:99px;}
.rail-hint{color:var(--c-muted);font-size:var(--text-xs);letter-spacing:.14em;text-transform:uppercase;}

/* ===========================================================================
   19. THIS WEEKEND TILES
   ========================================================================= */
/* D48 trades 3 nights (Fri/Sat/Sun) — 3 tiles, not the template's 4 */
.weekend{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.1rem;}
.wk-tile{position:relative;aspect-ratio:3/4.2;border-radius:var(--radius-md);overflow:hidden;
  border:1px solid var(--c-border);display:flex;flex-direction:column;justify-content:flex-end;
  isolation:isolate;min-height:340px;}
.wk-tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;
  transition:transform var(--dur-reveal) var(--ease-out);}
/* heavy lower scrim — poster art must never fight the tile text */
.wk-tile::after{content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(0deg,var(--c-void) 0%,rgba(6,6,8,.94) 26%,rgba(6,6,8,.55) 48%,rgba(6,6,8,.12) 72%,rgba(6,6,8,.2) 100%);}
@media (hover:hover){.wk-tile:hover img{transform:scale(1.06);}}
.wk-tile__in{position:relative;z-index:2;padding:1rem;display:flex;flex-direction:column;gap:.5rem;}
.wk-tile__day{font-family:var(--font-poster);letter-spacing:.14em;text-transform:uppercase;font-size:var(--text-xs);color:var(--c-chrome);}
.wk-tile__title{font-family:var(--font-display);text-transform:uppercase;font-size:var(--text-lg);line-height:1;}
.wk-tile__meta{font-size:var(--text-sm);color:var(--c-chrome);}
.wk-tile__ctas{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:.4rem;}
.wk-tile__ctas .btn{padding:.55em .9em;font-size:var(--text-xs);}
.wk-tile--closed{background:var(--c-graphite);align-items:center;justify-content:center;text-align:center;}
.wk-tile--closed .wk-tile__in{align-items:center;}
@media (max-width:1000px){.weekend{grid-template-columns:repeat(2,1fr);}}
@media (max-width:520px){.weekend{grid-auto-flow:column;grid-auto-columns:78%;grid-template-columns:none;
  overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:1rem;}.wk-tile{scroll-snap-align:start;}}

/* ===========================================================================
   20. TABLE / VIP TIERS
   ========================================================================= */
.tier{position:relative;display:flex;flex-direction:column;background:var(--c-graphite);
  border:1px solid var(--c-border);border-radius:var(--radius-md);overflow:hidden;}
.tier__media{position:relative;aspect-ratio:16/10;overflow:hidden;}
.tier__media img{width:100%;height:100%;object-fit:cover;}
.tier__cap{position:absolute;top:.7rem;left:.7rem;z-index:2;}
.tier__body{padding:1.2rem;display:flex;flex-direction:column;gap:.7rem;flex:1;}
.tier__name{font-family:var(--font-display);text-transform:uppercase;font-size:var(--text-xl);}
.tier__loc{color:var(--c-chrome);font-size:var(--text-sm);}
.tier__incl{display:flex;flex-direction:column;gap:.35rem;font-size:var(--text-sm);color:var(--c-chrome);}
.tier__incl li{display:flex;gap:.5rem;}
.tier__incl li::before{content:"";width:.4rem;height:.4rem;margin-top:.55rem;background:var(--c-electric);flex:none;}
.tier--gold .tier__incl li::before{background:var(--c-gold);}
.tier--gold{border-color:rgba(201,162,39,.3);}
.tier__foot{margin-top:auto;padding-top:.6rem;}

/* ===========================================================================
   21. EVENT ROWS (poster-left · info-right)
   ========================================================================= */
.ev-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:clamp(1.2rem,3vw,2.4rem);
  align-items:start;padding-block:clamp(1.6rem,4vw,2.6rem);border-top:1px solid var(--c-border);}
.ev-row__poster{position:relative;border-radius:var(--radius-md);overflow:hidden;border:1px solid var(--c-border);
  box-shadow:var(--shadow-card);}
.ev-row__poster img{width:100%;height:auto;display:block;}
.ev-row__info{display:flex;flex-direction:column;gap:.7rem;}
.ev-row__meta{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;}
.ev-row__title{font-size:var(--text-2xl);}
.ev-row__acts{color:var(--c-chrome-bright);font-weight:600;}
.ev-row__desc{color:var(--c-chrome);}
.ev-row__ctas{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:.4rem;}
.ev-row--past{opacity:.72;}
@media (max-width:820px){.ev-row{grid-template-columns:1fr;}.ev-row__poster{max-width:420px;}}

/* ===========================================================================
   22. BORDERGLOW
   ========================================================================= */
.border-glow{--edge-proximity:0;--cursor-angle:45deg;--bg-glow:var(--c-electric);--bg-radius:var(--radius-md);
  position:relative;border-radius:var(--bg-radius);isolation:isolate;background:var(--c-graphite);
  border:1px solid var(--c-border);}
.border-glow.bg-gold{--bg-glow:var(--c-gold);border-color:rgba(201,162,39,.25);}
.bg-edge{position:absolute;inset:-1px;border-radius:inherit;pointer-events:none;z-index:0;
  opacity:calc(var(--edge-proximity)/100);transition:opacity .3s ease;
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--bg-glow) 90%,transparent),
             inset 0 0 14px 0 color-mix(in srgb,var(--bg-glow) 35%,transparent),
             0 0 22px 0 color-mix(in srgb,var(--bg-glow) 30%,transparent);
  -webkit-mask-image:conic-gradient(from var(--cursor-angle) at center,#000 2%,transparent 12%,transparent 88%,#000 98%);
  mask-image:conic-gradient(from var(--cursor-angle) at center,#000 2%,transparent 12%,transparent 88%,#000 98%);}
.border-glow.bg-static .bg-edge{opacity:.5;-webkit-mask-image:none;mask-image:none;
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--bg-glow) 40%,transparent),0 0 20px color-mix(in srgb,var(--bg-glow) 18%,transparent);}
.border-glow>*:not(.bg-edge){position:relative;z-index:1;}
/* Hover must always read clearly: full ring at 55%+ the moment the pointer is
   on the card, with the cursor-cone brightening it further near the edges. */
@media (hover:hover){
  .border-glow:hover .bg-edge{
    opacity:max(calc(var(--edge-proximity) / 100), .55);
    -webkit-mask-image:none;mask-image:none;
  }
  .border-glow:hover{border-color:color-mix(in srgb,var(--bg-glow) 45%,var(--c-border));}
}
/* fallback for browsers without color-mix: plain visible ring */
@supports not (color: color-mix(in srgb, red 50%, blue)){
  .bg-edge{box-shadow:inset 0 0 0 1px var(--bg-glow),0 0 22px 0 var(--bg-glow);}
}

/* ===========================================================================
   23. OPTIONWHEEL (menu category selector — rounded blocks)
   ========================================================================= */
/* Cafe-pattern wheel: slabs anchored LEFT AND RIGHT inside the column so the
   curve can never push them past the container edge — no cut-offs. */
.option-wheel{position:relative;width:100%;height:var(--wheel-h,560px);overflow:hidden;
  cursor:grab;user-select:none;touch-action:none;outline:none;
  /* soft top/bottom fade instead of a hard clipped box edge — slabs dissolve
     naturally as they travel off, no visible container line */
  -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 15%,#000 85%,transparent 100%);
  mask-image:linear-gradient(to bottom,transparent 0,#000 15%,#000 85%,transparent 100%);}
.option-wheel.is-dragging{cursor:grabbing;}
.ow-item{position:absolute;top:50%;left:8px;right:8px;transform-origin:left center;
  display:flex;align-items:center;gap:.7rem;
  padding:.7rem 1.05rem;border-radius:var(--radius-pill);
  background:#F5F3EE;color:#241812;font-family:var(--font-poster);font-weight:600;
  font-size:1.02rem;text-transform:uppercase;letter-spacing:.04em;line-height:1.15;
  border:1.5px solid rgba(36,24,18,.14);cursor:pointer;will-change:transform,opacity,filter;
  box-shadow:0 6px 18px rgba(0,0,0,.28);
  transition:background .3s ease,color .3s ease,border-color .3s ease;}
@media (hover:hover){.ow-item:hover{border-color:var(--c-gold);}}
.ow-item .ow-num{font-size:.72em;opacity:.45;font-variant-numeric:tabular-nums;}
.ow-item .ow-count{margin-left:auto;font-size:.72em;font-weight:700;opacity:.5;font-variant-numeric:tabular-nums;}
.ow-item.is-selected{background:var(--c-gold);border-color:var(--c-gold);color:#171200;
  box-shadow:0 12px 28px rgba(201,162,39,.35);}
.ow-item.is-selected .ow-count{opacity:.85;}
/* Mobile: same categories as a horizontal chip rail (cafe pattern) */
.category-rail{display:flex;gap:.5rem;overflow-x:auto;scroll-snap-type:x proximity;
  padding:.35rem 0 .75rem;-webkit-overflow-scrolling:touch;scrollbar-width:none;}
.category-rail::-webkit-scrollbar{display:none;}
.category-chip{flex:none;scroll-snap-align:start;min-height:44px;padding:.55rem 1.05rem;
  border-radius:var(--radius-pill);border:1.5px solid rgba(255,255,255,.18);
  background:#F5F3EE;color:#241812;font-family:var(--font-poster);font-weight:600;
  font-size:.9rem;text-transform:uppercase;letter-spacing:.04em;cursor:pointer;}
.category-chip.is-selected{background:var(--c-gold);border-color:var(--c-gold);color:#171200;}

/* ===========================================================================
   24. MENU (food/drinks) + DOME + MAP + FORMS + FOOTER
   ========================================================================= */
.menu-layout{display:grid;grid-template-columns:minmax(240px,.85fr) minmax(0,2fr);gap:clamp(1.4rem,4vw,3rem);align-items:start;}
.menu-layout .option-wheel{position:sticky;top:calc(var(--header-h) + 1.5rem);}
.menu-layout .category-rail{display:none;}
@media (max-width:820px){.menu-layout{grid-template-columns:1fr;}
  .menu-layout .option-wheel{display:none;}
  .menu-layout .category-rail{display:flex;}}
.menu-cat-head{display:flex;gap:1.2rem;align-items:center;margin-bottom:1.2rem;}
.menu-cat-hero{width:120px;height:120px;object-fit:cover;border-radius:var(--radius-md);border:1px solid var(--c-border);flex:none;}
@media (max-width:520px){.menu-cat-hero{width:84px;height:84px;}}
.menu-list{display:flex;flex-direction:column;}
.menu-item{display:grid;grid-template-columns:auto 1fr auto;gap:1rem;align-items:center;
  padding:1rem 0;border-top:1px solid var(--c-border);}
.menu-item__thumb{width:74px;height:74px;border-radius:var(--radius-sm);object-fit:cover;flex:none;}
.menu-item__name{font-weight:600;color:var(--c-chrome-bright);}
.menu-item__desc{color:var(--c-muted);font-size:var(--text-sm);}
.menu-item__price{font-variant-numeric:tabular-nums;font-weight:600;color:var(--c-gold-light);white-space:nowrap;}

/* DomeGallery */
.dome{position:relative;width:100%;height:clamp(420px,72vh,720px);--dome-r:640px;
  overflow:hidden;isolation:isolate;touch-action:pan-y;user-select:none;-webkit-user-select:none;cursor:grab;}
.dome:active{cursor:grabbing;}
.dome.dome-off{display:none;}
.dome-stage{position:absolute;inset:0;display:grid;place-items:center;perspective:calc(var(--dome-r) * 2);}
.dome-sphere{transform-style:preserve-3d;will-change:transform;}
/* tile size is computed in JS from radius/segments so tiles neither overlap nor gap */
.dome-item{position:absolute;transform-style:preserve-3d;backface-visibility:hidden;}
.dome-tile{display:block;width:100%;height:100%;padding:5px;background:none;border:none;cursor:pointer;}
.dome-tile img{width:100%;height:100%;object-fit:cover;border-radius:var(--radius-sm);pointer-events:none;
  backface-visibility:hidden;}
.dome-overlay{position:absolute;inset:0;pointer-events:none;z-index:2;
  background:radial-gradient(ellipse at center,transparent 52%,var(--c-void) 96%);}
.dome-viewer{position:fixed;inset:0;z-index:var(--z-lightbox);display:grid;place-items:center;padding:5vmin;}
/* CRITICAL: display:grid above would override the [hidden] UA default and leave
   an invisible full-screen scrim blocking the whole page. Never remove this. */
.dome-viewer[hidden]{display:none;}
.dome-scrim{position:absolute;inset:0;background:rgba(6,6,8,.86);border:none;cursor:pointer;
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);}
.dome-big{position:relative;z-index:1;max-width:min(92vw,560px);pointer-events:none;}
.dome-big img{max-height:82vh;width:auto;max-width:100%;border-radius:var(--radius-md);box-shadow:var(--shadow-deep);}
/* Gap between the spinning globe and the photo strip beneath it, so the strip
   reads as its own row (not fused to the dome) and clears the divider below. */
.dome{margin-bottom:clamp(1.6rem,4vw,2.8rem);}
.dome-fallback-wrap{margin-bottom:clamp(1rem,3vw,2rem);}
.dome-fallback{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:.55rem;}
.dome-fallback img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:var(--radius-md);
  border:1px solid var(--c-border);transition:transform var(--dur-fast) var(--ease-out);}
@media (hover:hover){.dome-fallback img:hover{transform:scale(1.04);}}
/* When the live dome runs, the strip is a curated "more from the floor" row;
   under reduced motion the dome hides and this strip is the gallery preview. */

/* calendar (book.html) */
.cal-bar{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1rem;}
.cal-title{font-family:var(--font-display);text-transform:uppercase;font-size:var(--text-xl);}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:.4rem;}
.cal-wd{text-align:center;font-size:var(--text-xs);letter-spacing:.1em;color:var(--c-muted);padding-bottom:.3rem;}
.cal-cell{position:relative;aspect-ratio:1/1.15;min-height:44px;border-radius:var(--radius-sm);
  background:var(--c-graphite);border:1px solid var(--c-border);display:block;overflow:hidden;}
.cal-cell--blank{background:transparent;border-color:transparent;}
.cal-num{position:absolute;top:.3rem;left:.4rem;z-index:2;font-size:var(--text-xs);font-weight:600;
  font-variant-numeric:tabular-nums;color:var(--c-chrome);text-shadow:0 1px 4px rgba(0,0,0,.8);}
.cal-cell--event img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.85;
  transition:transform var(--dur-fast) var(--ease-out);}
@media (hover:hover){.cal-cell--event:hover img{transform:scale(1.06);}}
.cal-cell--event{border-color:rgba(201,162,39,.4);}
.cal-cell--event.is-past{opacity:.5;border-color:var(--c-border);}
.cal-dot{position:absolute;right:.35rem;bottom:.35rem;z-index:2;width:.55rem;height:.55rem;border-radius:50%;
  background:var(--c-gold);box-shadow:0 0 8px rgba(201,162,39,.8);}
.cal-cell.is-today{outline:2px solid var(--c-electric);outline-offset:1px;}
.agenda{display:flex;flex-direction:column;gap:.7rem;}
.agenda-row{display:grid;grid-template-columns:72px 1fr auto;gap:1rem;align-items:center;
  background:var(--c-graphite);border:1px solid var(--c-border);border-radius:var(--radius-md);
  padding:.8rem;transition:border-color var(--dur-fast);}
@media (hover:hover){.agenda-row:hover{border-color:rgba(201,162,39,.4);}}
.agenda-row img{width:72px;height:90px;object-fit:cover;border-radius:var(--radius-sm);}
.agenda-row__in{display:flex;flex-direction:column;gap:.25rem;font-size:var(--text-sm);color:var(--c-chrome);}
.agenda-row__in strong{font-family:var(--font-poster);text-transform:uppercase;font-size:var(--text-base);color:var(--c-bone);}
.agenda-row__cta{padding:.55em 1em;font-size:var(--text-xs);}
@media (max-width:560px){.agenda-row{grid-template-columns:56px 1fr;}.agenda-row__cta{grid-column:2;justify-self:start;}
  .agenda-row img{width:56px;height:70px;}}

/* gallery nights */
.night{border:1px solid var(--c-border);border-radius:var(--radius-md);overflow:hidden;background:var(--c-graphite);margin-bottom:1.4rem;}
.night__head{display:flex;flex-wrap:wrap;gap:.8rem;align-items:center;justify-content:space-between;padding:1.1rem 1.2rem;}
.night__title{font-family:var(--font-display);text-transform:uppercase;font-size:var(--text-lg);}
.night__media{padding:0 1.2rem 1.2rem;}
.night__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.5rem;margin-top:.8rem;}
@media (max-width:700px){.night__grid{grid-template-columns:repeat(2,1fr);}}
.night__grid button{padding:0;border:none;background:none;cursor:pointer;border-radius:var(--radius-sm);overflow:hidden;}
.night__grid img{width:100%;aspect-ratio:1;object-fit:cover;transition:transform var(--dur-fast) var(--ease-out);}
@media (hover:hover){.night__grid button:hover img{transform:scale(1.05);}}
.night .reel-frame{width:min(46vw,190px);flex:0 0 auto;}
.month-head{font-family:var(--font-poster);text-transform:uppercase;letter-spacing:.14em;color:var(--c-muted);
  font-size:var(--text-sm);margin:2rem 0 1rem;}
/* lightbox */
.lightbox{position:fixed;inset:0;z-index:var(--z-lightbox);display:grid;place-items:center;padding:4vmin;}
.lightbox[hidden]{display:none;}
.lightbox__scrim{position:absolute;inset:0;background:rgba(6,6,8,.9);border:none;cursor:pointer;}
.lightbox__body{position:relative;z-index:1;max-width:min(94vw,900px);}
.lightbox__body img{max-height:84vh;width:auto;max-width:100%;border-radius:var(--radius-md);box-shadow:var(--shadow-deep);}
.lightbox__nav{position:absolute;top:50%;transform:translateY(-50%);z-index:2;width:48px;height:48px;
  display:flex;align-items:center;justify-content:center;background:rgba(13,13,17,.8);color:var(--c-bone);
  border:1px solid var(--c-border);border-radius:50%;font-size:1.3rem;cursor:pointer;}
.lightbox__nav--prev{left:-8px;}.lightbox__nav--next{right:-8px;}
.lightbox__close{position:absolute;top:-14px;right:-8px;z-index:2;width:44px;height:44px;border-radius:50%;
  background:var(--c-electric);color:#fff;font-size:1.2rem;font-weight:700;cursor:pointer;border:none;}

/* Map */
.map-frame{position:relative;width:100%;min-height:440px;border-radius:var(--radius-md);overflow:hidden;
  border:1px solid var(--c-border);background:var(--c-graphite);}
.map-frame iframe{width:100%;height:100%;min-height:440px;border:0;filter:grayscale(.3) contrast(1.05);}
@media (max-width:640px){.map-frame,.map-frame iframe{min-height:380px;}}

/* Forms */
.field{display:flex;flex-direction:column;gap:.4rem;margin-bottom:1rem;}
.field label{font-size:var(--text-sm);font-weight:600;color:var(--c-chrome-bright);}
.field .req{color:var(--c-electric);}
.input,select.input,textarea.input{width:100%;background:var(--c-graphite);border:1px solid var(--c-border);
  border-radius:var(--radius-sm);padding:.8em 1em;color:var(--c-bone);font-size:var(--text-base);
  min-height:44px;transition:border-color var(--dur-fast);}
.input:focus{outline:none;border-color:var(--c-electric);box-shadow:0 0 0 3px rgba(77,124,255,.18);}
textarea.input{min-height:110px;resize:vertical;}
.field-error{color:var(--c-error);font-size:var(--text-sm);}
.input[aria-invalid="true"]{border-color:var(--c-error);}
.form-note{color:var(--c-muted);font-size:var(--text-sm);}

/* Footer */
.site-footer{background:var(--c-obsidian);border-top:1px solid var(--c-border);
  padding-block:clamp(3rem,6vw,5rem) 2rem;margin-top:var(--section-y);}
/* footer as an incoming divider section (buildFooter injects the strip) */
.site-footer.edge-in{border-top:0;margin-top:calc(-1 * var(--edge-depth));
  padding-top:calc(clamp(3rem,6vw,5rem) + var(--edge-depth));background:var(--c-obsidian);}
.footer-grid{display:grid;grid-template-columns:1.15fr .75fr .95fr 1.35fr;gap:2rem;}
.footer-map__frame{border-radius:var(--radius-md);overflow:hidden;border:1px solid var(--c-border);
  background:var(--c-graphite);}
.footer-map__frame iframe{display:block;width:100%;height:230px;border:0;filter:grayscale(.35) contrast(1.05);}
.footer-map a.link{margin-top:.7rem;display:inline-flex;font-size:var(--text-sm);}
@media (max-width:960px){.footer-grid{grid-template-columns:1fr 1fr;}.footer-map{grid-column:1/-1;}}
.footer-grid h4{font-family:var(--font-poster);text-transform:uppercase;letter-spacing:.1em;font-size:var(--text-sm);
  color:var(--c-chrome);margin-bottom:.9rem;}
.footer-grid a{display:block;color:var(--c-chrome-bright);padding:.2rem 0;font-size:var(--text-sm);}
.footer-grid a:hover{color:var(--c-electric-glow);}
.footer-brand .display{font-size:2rem;}
.footer-bottom{display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;align-items:center;
  margin-top:2.5rem;padding-top:1.5rem;border-top:1px solid var(--c-border);color:var(--c-muted);font-size:var(--text-xs);}
@media (max-width:720px){.footer-grid{grid-template-columns:1fr 1fr;}.footer-brand{grid-column:1/-1;}}

/* shader-backed closing CTAs get a soft radial scrim so type always reads */
.big-cta.fx-host::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:radial-gradient(95% 75% at 50% 62%,rgba(6,6,8,.18),rgba(6,6,8,.68));}

/* small helpers */
.center{text-align:center;}
.mt-2{margin-top:2rem;}.mt-3{margin-top:3rem;}
.chips{display:flex;flex-wrap:wrap;gap:.5rem;}
.big-cta{position:relative;text-align:center;padding-block:clamp(4rem,10vw,8rem);}
.big-cta.edge-in{padding-top:calc(clamp(4rem,10vw,8rem) + var(--edge-depth) * .7);}
.big-cta h2{font-size:var(--text-3xl);}
.big-cta .hero__ctas{justify-content:center;}

/* social wall */
.social-wall{display:grid;grid-template-columns:repeat(4,1fr);gap:.5rem;}
@media (max-width:700px){.social-wall{grid-template-columns:repeat(2,1fr);}}
.social-tile{position:relative;aspect-ratio:1;overflow:hidden;border-radius:var(--radius-sm);isolation:isolate;}
.social-tile img{width:100%;height:100%;object-fit:cover;transition:transform var(--dur-reveal) var(--ease-out);}
@media (hover:hover){.social-tile:hover img{transform:scale(1.06);}}
.social-tile::after{content:"";position:absolute;inset:0;z-index:1;opacity:0;transition:opacity var(--dur-fast);
  background:linear-gradient(0deg,rgba(6,6,8,.55),transparent 60%);}
.social-ig{position:absolute;left:.5rem;bottom:.5rem;z-index:2;font-size:var(--text-xs);font-weight:600;color:#fff;
  opacity:0;transition:opacity var(--dur-fast);}
.social-tile:hover .social-ig,.social-tile:hover::after,.social-tile:focus-visible .social-ig{opacity:1;}

/* section intro row */
.head-row{display:flex;justify-content:space-between;align-items:flex-end;gap:1rem;flex-wrap:wrap;margin-bottom:clamp(1.6rem,3vw,2.6rem);}
.head-row h2{font-size:var(--text-2xl);}

/* strip / private */
.strip{background:var(--c-obsidian);border:1px solid var(--c-border);border-radius:var(--radius-md);
  padding:clamp(1.6rem,4vw,2.6rem);display:flex;justify-content:space-between;align-items:center;gap:1.4rem;flex-wrap:wrap;}
.strip h3{font-size:var(--text-xl);}

/* filters / empty state */
.filter-bar{display:flex;flex-wrap:wrap;gap:1.4rem 2rem;padding-bottom:1.4rem;margin-bottom:1.2rem;border-bottom:1px solid var(--c-border);}
.fgroup{display:flex;flex-wrap:wrap;gap:.4rem;align-items:center;}
.fgroup .label{margin-right:.2rem;}
.fchip{font-size:var(--text-sm);font-weight:600;padding:.45em .85em;border-radius:var(--radius-pill);
  border:1px solid var(--c-border);color:var(--c-chrome);background:transparent;transition:color var(--dur-fast),border-color var(--dur-fast),background var(--dur-fast);min-height:38px;}
@media (hover:hover){.fchip:hover{border-color:var(--c-chrome);color:var(--c-bone);}}
.fchip.is-on{background:var(--c-electric);border-color:var(--c-electric);color:#fff;}
.events-count{margin-bottom:.8rem;font-size:var(--text-sm);letter-spacing:.05em;text-transform:uppercase;}
.empty-state{text-align:center;padding:clamp(2.5rem,7vw,5rem) 1rem;border:1px dashed var(--c-border);border-radius:var(--radius-md);}
.empty-state h3{margin-bottom:.6rem;}
.empty-state .btn{margin-top:1.2rem;}

/* faq accordion */
.faq{border-top:1px solid var(--c-border);}
.faq details{border-bottom:1px solid var(--c-border);}
.faq summary{cursor:pointer;padding:1.1rem 0;font-weight:600;font-size:var(--text-lg);list-style:none;display:flex;justify-content:space-between;align-items:center;gap:1rem;}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{content:"+";font-family:var(--font-display);color:var(--c-electric);transition:transform var(--dur-fast);}
.faq details[open] summary::after{content:"–";}
.faq details>p{padding-bottom:1.1rem;color:var(--c-chrome);max-width:70ch;}

/* ===========================================================================
   25. BOOKING FLOW
   ========================================================================= */
.bk-layout{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(240px,1fr);gap:clamp(1.4rem,3vw,2.6rem);align-items:start;}
@media (max-width:900px){.bk-layout{grid-template-columns:1fr;}
  .bk-summary{position:sticky;bottom:0;top:auto;order:2;}}
.bk-summary{position:sticky;top:calc(var(--header-h) + 1rem);background:var(--c-graphite);
  border:1px solid rgba(201,162,39,.25);border-radius:var(--radius-md);padding:1.2rem;}
.bk-summary__list{display:flex;flex-direction:column;gap:.55rem;margin-top:.8rem;}
.bk-summary__list div{display:flex;justify-content:space-between;gap:1rem;font-size:var(--text-sm);}
.bk-summary__list dt{color:var(--c-muted);}
.bk-summary__list dd{color:var(--c-chrome-bright);text-align:right;font-weight:600;}
.bk-progress{display:flex;align-items:center;gap:.4rem;margin-bottom:1.4rem;flex-wrap:wrap;}
.bk-dot{width:.55rem;height:.55rem;border-radius:50%;background:var(--c-steel);}
.bk-dot.is-on{background:var(--c-gold);}
.bk-progress__txt{margin-left:.5rem;font-size:var(--text-xs);letter-spacing:.12em;text-transform:uppercase;color:var(--c-muted);}
.bk-q{font-family:var(--font-display);text-transform:uppercase;font-size:var(--text-xl);margin-bottom:1.1rem;}
.bk-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.8rem;margin-block:1rem;}
@media (max-width:760px){.bk-grid{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (max-width:480px){.bk-grid{grid-template-columns:1fr;}}
.bk-night,.bk-tier,.bk-pkg{position:relative;display:flex;flex-direction:column;text-align:left;color:var(--c-bone);
  background:var(--c-graphite);border:1px solid var(--c-border);border-radius:var(--radius-md);overflow:hidden;
  transition:border-color var(--dur-fast),box-shadow var(--dur-fast);cursor:pointer;padding:0;}
.bk-night img,.bk-tier img,.bk-pkg img{width:100%;aspect-ratio:16/9;object-fit:cover;}
.bk-night__in,.bk-tier__in,.bk-pkg__in{display:flex;flex-direction:column;gap:.3rem;padding:.8rem;font-size:var(--text-sm);}
.bk-night__in strong,.bk-tier__in strong,.bk-pkg__in strong{font-family:var(--font-poster);text-transform:uppercase;letter-spacing:.03em;font-size:var(--text-base);}
.bk-night.is-on,.bk-tier.is-on,.bk-pkg.is-on{border-color:var(--c-gold);box-shadow:var(--glow-gold);}
.bk-night.is-on::after,.bk-tier.is-on::after,.bk-pkg.is-on::after{content:"✓";position:absolute;top:.6rem;right:.6rem;
  width:1.7rem;height:1.7rem;display:flex;align-items:center;justify-content:center;background:var(--c-gold);color:#171200;
  border-radius:50%;font-weight:700;}
.bk-tier.is-off{opacity:.45;cursor:not-allowed;}
.bk-tier__why{color:var(--c-gold-light);font-size:var(--text-xs);}
.bk-nums{display:flex;flex-wrap:wrap;gap:.6rem;margin-block:1rem;}
.bk-num{width:56px;height:56px;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:var(--text-lg);
  background:var(--c-graphite);border:1px solid var(--c-border);border-radius:var(--radius-sm);color:var(--c-bone);
  transition:border-color var(--dur-fast),box-shadow var(--dur-fast);font-variant-numeric:tabular-nums;}
.bk-num--wide{width:auto;padding-inline:1.2rem;font-size:var(--text-base);}
.bk-num.is-on{border-color:var(--c-gold);box-shadow:var(--glow-gold);background:rgba(201,162,39,.12);}
.bk-nav{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-top:1.6rem;flex-wrap:wrap;}
.bk-total{margin-top:.6rem;color:var(--c-chrome);}
.bk-review{display:flex;flex-direction:column;gap:.7rem;background:var(--c-graphite);border:1px solid var(--c-border);
  border-radius:var(--radius-md);padding:1.2rem;margin-block:1rem;}
.bk-review div{display:flex;justify-content:space-between;gap:1.4rem;font-size:var(--text-sm);}
.bk-review dt{color:var(--c-muted);flex:none;}
.bk-review dd{color:var(--c-chrome-bright);text-align:right;font-weight:500;}

/* two-column info */
.split-2{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.2rem,3vw,2.4rem);}
@media (max-width:720px){.split-2{grid-template-columns:1fr;}}
.info-card{background:var(--c-graphite);border:1px solid var(--c-border);border-radius:var(--radius-md);padding:1.4rem;}
.info-card h4{font-family:var(--font-poster);text-transform:uppercase;letter-spacing:.08em;color:var(--c-chrome);margin-bottom:.7rem;font-size:var(--text-sm);}
.info-list li{display:flex;gap:.6rem;padding:.35rem 0;color:var(--c-chrome);font-size:var(--text-sm);}
.info-list li::before{content:"";width:.4rem;height:.4rem;margin-top:.55rem;background:var(--c-electric);flex:none;}
