/* ============================================================
   BEACHCLUBDXB — v2 CHROME "The Coast, Curated"
   Shared nav / overlay menu / footer / cursor / grain.
   All selectors namespaced v2* to avoid collisions with
   per-page legacy CSS. Loaded AFTER page styles.
   ============================================================ */
:root{
  --v2ink:#16211F; --v2body:#49544F; --v2muted:#8B9793;
  --v2acc:#0FA39E; --v2accd:#0B7C78; --v2gold:#C7A24A;
  --v2alt:#F2F8F7; --v2line:rgba(22,33,31,.12); --v2linel:rgba(255,255,255,.18);
  --v2dark:#0E1A18;
  --v2serif:'Marcellus',Georgia,serif; --v2sans:'Manrope',system-ui,sans-serif;
  --v2ease:cubic-bezier(.22,1,.36,1);
  --v2pad:clamp(20px,4.5vw,72px);
}
[hidden]{display:none!important}
html{scroll-padding-top:96px}

/* film grain */
.v2grain{
  position:fixed;inset:-50%;z-index:9990;pointer-events:none;opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)'/%3E%3C/svg%3E");
  animation:v2grain 9s steps(6) infinite;
}
@keyframes v2grain{
  0%,100%{transform:translate(0,0)}16%{transform:translate(-3%,2%)}
  33%{transform:translate(2%,-3%)}50%{transform:translate(-2%,-2%)}
  66%{transform:translate(3%,2%)}83%{transform:translate(-1%,3%)}
}
@media (prefers-reduced-motion:reduce){.v2grain{animation:none}}

/* ============ CURSOR ============ */
#v2cursor,#v2ring{position:fixed;top:0;left:0;pointer-events:none;z-index:9999;display:none}
@media (pointer:fine){html.v2js #v2cursor,html.v2js #v2ring{display:flex}}
#v2cursor{width:6px;height:6px;border-radius:50%;background:var(--v2acc);transform:translate(-50%,-50%)}
#v2ring{
  width:38px;height:38px;border-radius:50%;border:1px solid rgba(15,163,158,.55);
  transform:translate(-50%,-50%);align-items:center;justify-content:center;
  font:700 0px var(--v2sans);letter-spacing:.14em;text-transform:uppercase;color:#fff;
  transition:width .35s var(--v2ease),height .35s var(--v2ease),background-color .35s,font-size .2s,border-color .35s;
}
#v2ring.grow{width:86px;height:86px;background:rgba(14,26,24,.85);border-color:transparent;font-size:10px}

/* ============ NAV ============ */
.v2navspace{height:70px}
.v2nav{
  position:fixed;top:0;left:0;right:0;z-index:900;
  display:flex;align-items:center;justify-content:space-between;
  padding:13px var(--v2pad);
  background:rgba(255,255,255,.88);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
  color:var(--v2ink);box-shadow:0 1px 0 var(--v2line);
  transition:box-shadow .4s;
  font-family:var(--v2sans);
}
.v2nav.scrolled{box-shadow:0 1px 0 var(--v2line),0 18px 44px -30px rgba(16,40,38,.4)}
.v2brand{
  font:400 19px var(--v2serif);letter-spacing:.3em;text-transform:uppercase;
  display:flex;align-items:center;gap:12px;color:var(--v2ink);text-decoration:none;
}
.v2brand b{font-weight:400;color:var(--v2acc)}
.v2brand .v2dot{width:7px;height:7px;border-radius:50%;background:var(--v2gold);flex:none}
.v2links{display:flex;gap:34px;font:600 12px var(--v2sans);letter-spacing:.14em;text-transform:uppercase}
.v2links a{position:relative;padding:6px 0;color:var(--v2ink);opacity:.85;text-decoration:none}
.v2links a::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:1px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .45s var(--v2ease)}
.v2links a:hover::after,.v2links a[aria-current]::after{transform:scaleX(1);transform-origin:left}
.v2right{display:flex;align-items:center;gap:18px}
.v2cta{
  font:700 11px var(--v2sans);letter-spacing:.16em;text-transform:uppercase;
  border:1px solid var(--v2ink);border-radius:100px;padding:11px 22px;
  color:var(--v2ink);text-decoration:none;
  transition:background .4s,color .4s,border-color .4s;
}
.v2cta:hover{background:var(--v2acc);border-color:var(--v2acc);color:#fff}
.v2burger{background:none;border:0;cursor:pointer;display:flex;flex-direction:column;gap:6px;padding:8px;color:var(--v2ink)}
.v2burger span{width:26px;height:2px;background:currentColor;display:block}
@media (max-width:960px){.v2links{display:none}}

/* ============ OVERLAY MENU ============ */
#v2menu{
  position:fixed;inset:0;z-index:950;background:var(--v2dark);color:#fff;
  display:grid;grid-template-columns:1.2fr .8fr;gap:40px;
  padding:120px var(--v2pad) 60px;
  clip-path:inset(0 0 100% 0);transition:clip-path .8s var(--v2ease);
  overflow:auto;font-family:var(--v2sans);
}
#v2menu.open{clip-path:inset(0 0 0 0)}
html:not(.v2js) #v2menu{display:none}
#v2menu .v2mbig a{
  display:flex;align-items:baseline;gap:22px;
  font:400 clamp(34px,6vw,72px)/1.22 var(--v2serif);color:rgba(255,255,255,.92);
  padding:6px 0;text-decoration:none;transition:color .3s,transform .5s var(--v2ease);
}
#v2menu .v2mbig a small{font:600 11px var(--v2sans);letter-spacing:.3em;color:var(--v2muted)}
#v2menu .v2mbig a:hover{color:var(--v2acc);transform:translateX(14px)}
#v2menu .v2mside{border-left:1px solid var(--v2linel);padding-left:clamp(20px,3vw,50px);display:flex;flex-direction:column;gap:34px}
#v2menu .v2mside h5{font:600 11px var(--v2sans);letter-spacing:.3em;text-transform:uppercase;color:var(--v2muted);margin:0 0 12px}
#v2menu .v2mside a{display:block;padding:5px 0;color:rgba(255,255,255,.75);font-size:15px;text-decoration:none;transition:color .25s}
#v2menu .v2mside a:hover{color:var(--v2gold)}
#v2menu .v2mclose{
  position:absolute;top:24px;right:var(--v2pad);background:none;border:1px solid var(--v2linel);
  color:#fff;border-radius:100px;padding:12px 26px;cursor:pointer;
  font:700 11px var(--v2sans);letter-spacing:.2em;text-transform:uppercase;
}
#v2menu .v2mclose:hover{background:#fff;color:var(--v2ink)}
@media (max-width:820px){#v2menu{grid-template-columns:1fr}#v2menu .v2mside{border-left:0;padding-left:0;border-top:1px solid var(--v2linel);padding-top:30px}}

/* ============ FOOTER ============ */
.v2foot{
  background:#0B1413;color:#fff;padding:clamp(70px,10vh,120px) var(--v2pad) 40px;
  font-family:var(--v2sans);
}
.v2fgrid{display:grid;grid-template-columns:1.4fr repeat(4,1fr);gap:clamp(26px,3.5vw,60px);padding-bottom:clamp(50px,8vh,90px)}
.v2fbrand p{color:rgba(255,255,255,.55);font-size:14px;line-height:1.75;max-width:30ch;margin:18px 0 0}
.v2fsoc{display:flex;gap:10px;margin-top:20px}
.v2fsoc a{
  width:38px;height:38px;border:1px solid var(--v2linel);border-radius:50%;
  display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.7);
  transition:border-color .3s,color .3s,transform .3s var(--v2ease);
}
.v2fsoc a:hover{border-color:var(--v2gold);color:var(--v2gold);transform:translateY(-3px)}
.v2fgrid h5{font:600 10.5px var(--v2sans);letter-spacing:.3em;text-transform:uppercase;color:var(--v2muted);margin:0 0 18px}
.v2fgrid ul{list-style:none;margin:0;padding:0}
.v2fgrid li a{display:inline-block;padding:5px 0;color:rgba(255,255,255,.72);font-size:13.5px;text-decoration:none;transition:color .25s,transform .3s var(--v2ease)}
.v2fgrid li a:hover{color:var(--v2gold);transform:translateX(5px)}
.v2fword{
  font:400 clamp(54px,12.5vw,200px)/1 var(--v2serif);text-align:center;letter-spacing:.02em;
  color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.16);user-select:none;
  padding:clamp(20px,4vh,50px) 0;white-space:nowrap;overflow:hidden;
}
.v2fword b{font-weight:400;-webkit-text-stroke:0;color:rgba(15,163,158,.5)}
.v2fbottom{
  border-top:1px solid var(--v2linel);padding-top:28px;
  display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;
  font-size:12px;color:rgba(255,255,255,.4);
}
.v2fbottom a{color:rgba(255,255,255,.6);margin-left:22px;text-decoration:none}
.v2fbottom a:hover{color:var(--v2gold)}
@media (max-width:1000px){.v2fgrid{grid-template-columns:repeat(2,1fr)}.v2fbrand{grid-column:1/-1}}