/* ── VIP Gate shared stylesheet ──────────────────────────────────────
   Import via: <link rel="stylesheet" href="_shared.css">
   All pages share the same base tokens, nav, footer, cursor, reveal.
──────────────────────────────────────────────────────────────────── */
:root {
  --bg:      #07080C;
  --bg2:     #0D0F17;
  --bg3:     #12151F;
  --bg4:     #181C28;
  --gold:    #C09346;
  --gold-lt: #D4AE6A;
  --cream:   #EEE5CE;
  --white:   #F7F6F2;
  --muted:   rgba(247,246,242,.42);
  --muted2:  rgba(247,246,242,.65);
  --border:  rgba(192,147,70,.18);
  --ease:    cubic-bezier(.22,1,.36,1);
}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;overflow-x:hidden;width:100%}
body{background:var(--bg);color:var(--white);font-family:'Outfit',sans-serif;font-weight:300;overflow-x:hidden;width:100%;cursor:none}
/* Custom scrollbar — desktop only */
@media(hover:hover){
  ::-webkit-scrollbar{width:2px}
  ::-webkit-scrollbar-track{background:var(--bg)}
  ::-webkit-scrollbar-thumb{background:var(--gold)}
}
/* Mobile : no custom scrollbar, no cursor */
@media(hover:none){body{cursor:auto}#cursor,#cursor-ring{display:none}
  ::-webkit-scrollbar{display:none}
  html,body{-webkit-overflow-scrolling:touch;scrollbar-width:none}
}

/* Cursor */
#cursor{position:fixed;z-index:9999;pointer-events:none;width:7px;height:7px;background:var(--gold);border-radius:50%;transform:translate(-50%,-50%);transition:width .25s,height .25s}
#cursor-ring{position:fixed;z-index:9998;pointer-events:none;width:38px;height:38px;border:1px solid rgba(192,147,70,.55);border-radius:50%;transform:translate(-50%,-50%);transition:all .14s var(--ease);opacity:.6}

/* Animations */
@keyframes fadeUp{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:translateY(0)}}
@keyframes revealUp{from{transform:translateY(100%)}to{transform:translateY(0)}}
@keyframes drawLine{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes pulse-gold{0%,100%{box-shadow:0 0 0 0 rgba(192,147,70,.3)}50%{box-shadow:0 0 0 12px rgba(192,147,70,0)}}

/* Reveal */
.reveal{opacity:0;transform:translateY(50px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.reveal.from-left{transform:translateX(-60px)}.reveal.from-right{transform:translateX(60px)}
.reveal.visible{opacity:1;transform:translate(0,0)}
.reveal-d1.visible{transition-delay:.14s}.reveal-d2.visible{transition-delay:.28s}.reveal-d3.visible{transition-delay:.42s}
/* Mobile: no horizontal reveal (causes overflow) */
@media(max-width:768px){
  .reveal.from-left,.reveal.from-right{transform:translateY(30px)}
}

/* Nav */
nav{position:fixed;top:0;left:0;right:0;z-index:900;display:flex;align-items:center;justify-content:space-between;padding:32px 64px;transition:padding .5s var(--ease),background .5s,border-color .5s;border-bottom:1px solid transparent}
nav.sticky{padding:20px 64px;background:rgba(7,8,12,.92);backdrop-filter:blur(24px);border-bottom-color:var(--border)}
.nav-logo{display:flex;align-items:center;gap:14px;text-decoration:none}
.nav-logo svg{width:40px;height:24px}
.nav-wordmark{font-family:'Cormorant',serif;font-size:18px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--gold)}

/* Dropdown */
.nav-links{display:flex;align-items:center;gap:44px;list-style:none}
.nav-links>li{position:relative}
.nav-links a{font-size:11px;font-weight:400;letter-spacing:.16em;text-transform:uppercase;color:var(--muted2);text-decoration:none;position:relative;transition:color .3s}
.nav-links a::after{content:'';position:absolute;bottom:-5px;left:0;width:0;height:1px;background:var(--gold);transition:width .4s var(--ease)}
.nav-links a:hover,.nav-links a.active{color:var(--gold)}
.nav-links a:hover::after,.nav-links a.active::after{width:100%}
.nav-partner{color:var(--gold) !important;opacity:1 !important}
.nav-partner::before{content:'✦';font-size:7px;vertical-align:middle;margin-right:6px;color:var(--gold)}

.nav-dropdown{
  position:absolute;top:100%;left:-24px;
  padding-top:12px;
  background:transparent;min-width:220px;
  opacity:0;pointer-events:none;transform:translateY(-4px);
  transition:opacity .3s var(--ease),transform .3s var(--ease);
  z-index:100;
}
.nav-dropdown::before{
  content:'';position:absolute;top:12px;left:0;right:0;bottom:0;
  background:rgba(13,15,23,.96);backdrop-filter:blur(20px);
  border:1px solid var(--border);
  z-index:-1;
}
.nav-links>li:hover .nav-dropdown{opacity:1;pointer-events:all;transform:translateY(0)}
.nav-dropdown a{
  display:flex;align-items:center;gap:12px;
  padding:14px 24px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--muted2);text-decoration:none;
  border-bottom:1px solid var(--border);
  transition:background .2s,color .2s;
}
.nav-dropdown a:last-child{border-bottom:none}
.nav-dropdown a::after{display:none}
.nav-dropdown a:hover{background:rgba(192,147,70,.06);color:var(--gold)}
.nav-dropdown-dot{width:5px;height:5px;border-radius:50%;background:var(--gold);opacity:.5;flex-shrink:0}

.nav-actions{display:flex;gap:14px;align-items:center}
.btn-line{font-size:11px;font-weight:400;letter-spacing:.14em;text-transform:uppercase;color:var(--white);text-decoration:none;padding:10px 22px;border:1px solid rgba(247,246,242,.22);transition:border-color .3s,color .3s}
.btn-line:hover{border-color:var(--gold);color:var(--gold)}
.btn-fill{font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--bg);text-decoration:none;padding:11px 26px;background:var(--gold);transition:background .3s,transform .25s}
.btn-fill:hover{background:var(--gold-lt);transform:translateY(-1px)}

/* Hamburger */
.nav-hamburger{display:none;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:6px}
.nav-hamburger span{display:block;width:26px;height:1px;background:var(--white);transition:transform .4s var(--ease),opacity .3s;transform-origin:center}
.nav-hamburger.open span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.nav-hamburger.open span:nth-child(2){opacity:0}
.nav-hamburger.open span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
.nav-drawer{display:none;position:fixed;inset:0;z-index:850;background:rgba(7,8,12,.97);backdrop-filter:blur(24px);flex-direction:column;align-items:center;justify-content:flex-start;gap:0;opacity:0;pointer-events:none;transition:opacity .4s var(--ease);overflow-y:auto;padding:90px 24px 48px}
.nav-drawer-links li{margin-bottom:16px}
.nav-drawer.open{opacity:1;pointer-events:all}
.nav-drawer-links{list-style:none;text-align:center;width:100%}
.nav-drawer-links li{margin-bottom:16px}
.nav-drawer-links a{font-family:'Cormorant',serif;font-size:clamp(24px,6.5vw,36px);font-weight:300;letter-spacing:.04em;color:var(--white);text-decoration:none;transition:color .3s}
.nav-drawer-links a:hover{color:var(--gold)}
.nav-drawer-sub{font-size:13px !important;font-family:'Outfit',sans-serif !important;letter-spacing:.16em !important;color:var(--muted) !important;margin-top:-18px;display:block}
.nav-drawer-sub:hover{color:var(--gold-lt) !important}
.nav-drawer-actions{display:flex;flex-direction:column;gap:12px;align-items:center;margin-top:20px;width:100%}
.nav-drawer-actions .btn-fill,.nav-drawer-actions .btn-line{width:100%;max-width:280px;text-align:center;padding:14px 28px}
.drawer-controls{display:flex !important;flex-direction:row !important;align-items:center;gap:20px;margin-top:12px;padding-top:16px;border-top:1px solid var(--border);width:100%;max-width:280px;justify-content:center}
.drawer-lang{display:flex !important;flex-direction:row !important;align-items:center;gap:8px}
.drawer-lang .lang-opt{background:none;border:none;color:var(--muted);font-family:'Outfit',sans-serif;font-size:11px;font-weight:400;letter-spacing:.12em;text-transform:uppercase;cursor:pointer;transition:color .3s;padding:4px}
.drawer-lang .lang-opt:hover,.drawer-lang .lang-opt.active{color:var(--gold)}
.drawer-lang span{color:var(--border);line-height:1}

/* Section helpers */
.section-eyebrow{display:flex;align-items:center;gap:16px;margin-bottom:28px}
.section-eyebrow-line{width:36px;height:1px;background:var(--gold)}
.section-eyebrow-text{font-size:10px;letter-spacing:.4em;text-transform:uppercase;color:var(--gold)}
.section-title{font-family:'Cormorant',serif;font-size:clamp(42px,5.5vw,76px);font-weight:300;line-height:1.04;letter-spacing:-.015em}
.section-title em{font-style:italic;color:var(--gold)}

/* Buttons */
.cta-primary{display:inline-flex;align-items:center;gap:14px;font-size:12px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--bg);text-decoration:none;padding:16px 40px;background:var(--gold);transition:background .3s,transform .3s}
.cta-primary:hover{background:var(--gold-lt);transform:translateY(-2px)}
.cta-ghost{font-size:12px;font-weight:400;letter-spacing:.16em;text-transform:uppercase;color:var(--muted2);text-decoration:none;padding:15px 30px;border:1px solid var(--border);transition:border-color .3s,color .3s;display:inline-block}
.cta-ghost:hover{border-color:var(--gold);color:var(--white)}

/* Footer */
footer{padding:88px 64px 48px;border-top:1px solid var(--border)}
.footer-top{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:64px;margin-bottom:80px}
.footer-brand-name{font-family:'Cormorant',serif;font-size:30px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin-bottom:20px}
.footer-brand-desc{font-size:13px;line-height:1.85;color:var(--muted);max-width:270px}
.footer-col-head{font-size:9px;letter-spacing:.38em;text-transform:uppercase;color:var(--gold);margin-bottom:28px}
.footer-nav{list-style:none}
.footer-nav li{margin-bottom:13px}
.footer-nav a{font-size:13px;color:var(--muted);text-decoration:none;transition:color .3s}
.footer-nav a:hover{color:var(--white)}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;padding-top:32px;border-top:1px solid var(--border);font-size:11px;color:var(--muted);letter-spacing:.05em}
.footer-bottom a{color:var(--muted);text-decoration:none;transition:color .3s}
.footer-bottom a:hover{color:var(--gold)}

/* Responsive */
@media(max-width:1024px){
  nav,nav.sticky{padding-left:40px;padding-right:40px}
  footer{padding-left:40px;padding-right:40px}
  .footer-top{gap:40px}
}
@media(max-width:768px){
  .nav-links,.nav-actions{display:none}
  .nav-controls{display:flex}
  .nav-hamburger{display:flex}
  .nav-drawer{display:flex}
  nav{padding:22px 24px}
  nav.sticky{padding:16px 24px}
  footer{padding:60px 24px 40px}
  .footer-top{grid-template-columns:1fr 1fr;gap:36px}
  .footer-bottom{flex-direction:column;gap:16px;text-align:center}
}
@media(max-width:480px){
  .footer-top{grid-template-columns:1fr}
}

/* ── Light mode ───────────────────────────────────────────────────── */
[data-theme="light"]{
  --bg:    #F7F2EB;
  --bg2:   #F0E9DF;
  --bg3:   #E9E0D3;
  --bg4:   #E1D6C6;
  --white: #1C1710;
  --cream: #2E2218;
  --muted:  rgba(50,35,18,.5);
  --muted2: rgba(40,28,14,.72);
  --border: rgba(140,100,45,.2);
}
[data-theme="light"] nav.sticky{background:rgba(247,242,235,.94)}
[data-theme="light"] .nav-dropdown::before{background:rgba(240,233,223,.97)}
[data-theme="light"] .nav-drawer{background:rgba(247,242,235,.97)}
[data-theme="light"] .lang-dropdown-menu{background:rgba(240,233,223,.97)}

/* ── Nav controls (theme toggle + lang selector) ─────────────────── */
.nav-controls{display:flex;align-items:center;gap:6px;margin-right:8px}

.theme-toggle{
  display:flex;align-items:center;justify-content:center;
  width:34px;height:34px;border-radius:50%;
  background:none;border:1px solid var(--border);
  color:var(--muted2);cursor:pointer;
  transition:border-color .3s,color .3s,background .3s;
}
.theme-toggle:hover{border-color:var(--gold);color:var(--gold)}
.theme-toggle svg{width:15px;height:15px;pointer-events:none}
.icon-moon{display:none}
[data-theme="light"] .icon-sun{display:none}
[data-theme="light"] .icon-moon{display:block}

.lang-selector{position:relative}
.lang-btn{
  display:flex;align-items:center;gap:5px;
  background:none;border:1px solid var(--border);
  color:var(--muted2);cursor:pointer;
  padding:6px 10px;font-size:10px;font-weight:400;
  letter-spacing:.12em;text-transform:uppercase;
  transition:border-color .3s,color .3s;
  font-family:'Outfit',sans-serif;
}
.lang-btn:hover{border-color:var(--gold);color:var(--gold)}
.lang-btn svg{width:8px;height:6px;transition:transform .3s}
.lang-selector.open .lang-btn svg{transform:rotate(180deg)}

.lang-dropdown-menu{
  position:absolute;top:calc(100% + 8px);right:0;
  background:rgba(13,15,23,.96);backdrop-filter:blur(20px);
  border:1px solid var(--border);
  min-width:140px;z-index:1000;
  opacity:0;pointer-events:none;transform:translateY(-4px);
  transition:opacity .25s var(--ease),transform .25s var(--ease);
}
.lang-selector.open .lang-dropdown-menu{opacity:1;pointer-events:all;transform:translateY(0)}
.lang-opt{
  display:flex;align-items:center;gap:10px;width:100%;
  padding:11px 16px;background:none;border:none;border-bottom:1px solid var(--border);
  color:var(--muted2);cursor:pointer;font-size:11px;letter-spacing:.1em;
  font-family:'Outfit',sans-serif;text-align:left;
  transition:background .2s,color .2s;
}
.lang-opt:last-child{border-bottom:none}
.lang-opt:hover,.lang-opt.active{background:rgba(192,147,70,.06);color:var(--gold)}
.lang-opt .flag{font-size:14px;line-height:1}

@media(max-width:768px){
  .nav-controls{margin-right:4px}
  .lang-btn span.lang-current{display:none}
}
