:root{
  --bg:#0a0c10;
  --bg-alt:#10131a;
  --text:#e6e6e6;
  --muted:#b8bdc7;
  --gold:#c8a960;
  --gold-2:#e6c981;
  --accent: #e9d8a6;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,'Helvetica Neue',Arial,'Apple Color Emoji','Segoe UI Emoji','Segoe UI Symbol',sans-serif;background:var(--bg);color:var(--text)}
img{max-width:100%;display:block}
a{color:var(--accent);text-decoration:none}
.container{max-width:1200px;margin:0 auto;padding:0 20px}
/* Header */
.site-header{position:sticky;top:0;z-index:50;background:rgba(10,12,16,.8);backdrop-filter:saturate(160%) blur(10px);border-bottom:1px solid rgba(255,255,255,.06)}
.nav{display:flex;align-items:center;justify-content:space-between;height:64px}
.brand{display:flex;align-items:center;gap:10px;font-weight:800;letter-spacing:.5px}
.brand img{width:34px;height:34px;border-radius:6px;object-fit:cover;border:1px solid rgba(255,255,255,.15)}
.brand span{color:var(--gold-2)}
.menu{display:flex;align-items:center;gap:18px}
.menu a{font-weight:600;color:#eaeaea;opacity:.85}
.menu a:hover{opacity:1}
.menu .cta{background:linear-gradient(135deg,var(--gold),var(--gold-2));color:#111;padding:10px 14px;border-radius:10px}
.menu .ig{font-size:20px}
.burger{display:none;background:none;border:0;cursor:pointer}
.burger span{display:block;width:24px;height:2px;background:#ddd;margin:5px 0;border-radius:1px}

/* Hero */
.hero{position:relative;min-height:84vh;display:grid;place-items:center;overflow:hidden}
.bg-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.45)}
.overlay{position:absolute;inset:0;background:radial-gradient(60% 60% at 50% 40%,rgba(200,169,96,.32),transparent 60%)}
.hero-content{position:relative;text-align:center}
.hero-logo{width:96px;height:96px;margin:0 auto 10px;border-radius:12px;border:2px solid rgba(255,255,255,.2)}
h1{font-size:40px;line-height:1.1;margin:6px 0 8px 0;color:#fff;text-shadow:0 8px 40px rgba(0,0,0,.45)}
.hero p{max-width:820px;margin:0 auto;color:var(--muted)}
.actions{margin:18px auto 12px;display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.badges{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;color:#ddd;opacity:.9;font-size:14px}
.badges span{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);padding:8px 12px;border-radius:999px}

/* Buttons */
.btn{display:inline-flex;align-items:center;gap:8px;padding:12px 16px;border-radius:12px;border:1px solid rgba(255,255,255,.12);transition:.2s all}
.btn.primary{background:linear-gradient(135deg,var(--gold),var(--gold-2));color:#121212;border:0}
.btn.outline{background:rgba(255,255,255,.04);color:#fff}
.btn.big{font-size:18px;padding:14px 22px;border-radius:14px}
.btn.sm{padding:8px 12px}

/* Sections */
.section{padding:70px 0;background:var(--bg)}
.section.alt{background:var(--bg-alt)}
.section h2{font-size:32px;margin:0 0 18px 0;color:#fff}
.section p{color:#cfd3da}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.card{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);border-radius:16px;padding:18px}
.card h3{margin:8px 0}
.card i{font-size:22px;color:var(--gold-2)}

/* Gallery */
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:10px 0 0}
.gallery img{border-radius:14px;border:1px solid rgba(255,255,255,.08);aspect-ratio:4/3;object-fit:cover;transition:transform .25s}
.gallery img:hover{transform:scale(1.02)}

.specs{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin:16px 0 0;padding:0;list-style:none}
.specs li{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.07);padding:10px 12px;border-radius:12px}

/* Why */
.why{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.why-item{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);border-radius:16px;padding:16px}
.cta-wide{display:flex;justify-content:center;margin-top:18px}

/* Reviews */
.reviews{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.rev{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);border-radius:16px;padding:16px;font-style:italic}

/* Contact */
.contact{display:grid;grid-template-columns:1.2fr 1fr;gap:18px;align-items:start}
.mini-form{display:grid;gap:8px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);border-radius:16px;padding:16px}
.mini-form input,.mini-form textarea{width:100%;padding:12px;border-radius:10px;border:1px solid rgba(255,255,255,.12);background:#0f1217;color:#fff}
.mini-form button{margin-top:4px}

/* Footer */
.site-footer{border-top:1px solid rgba(255,255,255,.06);padding:24px 0;background:var(--bg)}
.foot{display:flex;align-items:center;justify-content:space-between;color:#bfc4cf}

/* Responsive */
@media (max-width: 980px){
  .grid3{grid-template-columns:1fr}
  .gallery{grid-template-columns:repeat(2,1fr)}
  .why{grid-template-columns:1fr 1fr}
  .reviews{grid-template-columns:1fr}
  .contact{grid-template-columns:1fr}
  .menu{display:none;position:absolute;top:64px;right:12px;left:12px;background:rgba(10,12,16,.98);border:1px solid rgba(255,255,255,.06);border-radius:14px;padding:14px}
  .menu.open{display:grid;gap:10px;padding-bottom:16px}
  .burger{display:block}
}
/* Gold themed cards/lists */
.gold-card{background:linear-gradient(135deg,var(--gold),var(--gold-2)); color:#111 !important; border:0}
.gold-card h3, .gold-card p, .gold-card i{color:#111 !important}
.gold-list li{background:linear-gradient(135deg,var(--gold),var(--gold-2)); color:#111 !important; border:0}
/* Language switch flags */
.lang-switch{display:inline-flex;gap:6px;align-items:center}
.lang-switch button{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);padding:4px 6px;border-radius:8px;cursor:pointer}
.lang-switch button:hover{filter:brightness(1.1)}
/* Mobile menu language placement fix */
.menu .lang-switch{order:99;justify-content:center;margin-top:8px;flex-wrap:wrap}
.menu.open .lang-switch{display:flex}
.lang-switch button{font-size:18px;line-height:1}

/* WhatsApp green button for hero */
.btn.green{background:#25D366;color:#111;border:0}
.btn.green i{color:#111}

/* Badges: black bg with white text */
.badges span{background:#000 !important;color:#fff !important;border-color:rgba(255,255,255,.15)}

/* Mobile-visible language switch (separate from menu) */
.lang-switch.mobile{display:none}
@media (max-width: 980px){
  .lang-switch.mobile{display:inline-flex;gap:6px;margin-left:auto}
  .lang-switch.mobile button{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);padding:4px 6px;border-radius:8px;cursor:pointer;font-size:18px;line-height:1}
  .nav{gap:8px}
}


/* Fix mobile menu shifting */
@media (max-width: 980px){
  .menu{right:12px;left:12px; width:auto; max-width:calc(100% - 24px); overflow-x:hidden}
}

/* Language dropdown */
.lang-dropdown{position:relative; display:inline-block}
.lang-trigger{background:rgba(255,255,255,.10); border:1px solid rgba(255,255,255,.20); padding:6px 10px; border-radius:10px; cursor:pointer; font-size:16px}
.lang-menu{position:absolute; top:110%; left:0; display:none; background:rgba(10,12,16,.98); border:1px solid rgba(255,255,255,.10); border-radius:12px; padding:6px; min-width:180px; z-index:60; box-shadow:0 10px 28px rgba(0,0,0,.35)}
.lang-menu button{display:block; width:100%; text-align:left; background:transparent; border:0; color:#eaeaea; padding:8px 10px; border-radius:8px; cursor:pointer; font-size:14px}
.lang-menu button:hover{background:rgba(255,255,255,.06)}
/* In mobile menu opened state ensure dropdown stays within */
@media (max-width: 980px){
  .menu.open .lang-dropdown{width:100%}
  .menu.open .lang-menu{position:relative; top:auto; left:auto; width:100%}
}

/* Compact mobile language dropdown */
.lang-compact{display:none; position:relative; z-index:70}
.lang-compact .lang-trigger{background:rgba(255,255,255,.10); border:1px solid rgba(255,255,255,.20); padding:6px 8px; border-radius:10px; cursor:pointer; font-size:14px; line-height:1}
.lang-compact .lang-menu{position:absolute; top:110%; right:0; display:none; background:rgba(10,12,16,.98); border:1px solid rgba(255,255,255,.10); border-radius:12px; padding:6px; min-width:160px; box-shadow:0 10px 28px rgba(0,0,0,.35)}
.lang-compact .lang-menu button{display:block; width:100%; text-align:left; background:transparent; border:0; color:#eaeaea; padding:8px 10px; border-radius:8px; cursor:pointer; font-size:14px}
.lang-compact .lang-menu button:hover{background:rgba(255,255,255,.06)}

@media (max-width:980px){
  .lang-compact{display:inline-flex; margin-left:auto; margin-right:8px}
  .lang-dropdown{display:none} /* hide desktop dropdown on mobile */
  .nav{gap:6px}
}

/* Reservation Panel */
.rez-form{margin-top:8px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);border-radius:16px;padding:16px}
.rez-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.field{display:grid;gap:6px}
.field label{color:#d9dbe1;font-weight:600}
.field input,.field select{padding:12px;border-radius:10px;border:1px solid rgba(255,255,255,.12);background:#0f1217;color:#fff}
.rez-actions{display:flex;justify-content:flex-end;margin-top:12px}
@media (max-width:980px){
  .rez-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  .rez-grid{grid-template-columns:1fr}
}

/* Native date/time input styling */
.rez-form input[type=date], .rez-form input[type=time]{
  background:#0f1217;
  color:#fff;
  border:1px solid rgba(255,255,255,.12);
  border-radius:10px;
  padding:12px;
}

/* --- Floating Buttons --- */
.fab-group{position:fixed; right:14px; bottom:16px; display:none; flex-direction:column; gap:10px; z-index:90}
.fab{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;color:#fff;border:none;text-decoration:none;box-shadow:0 6px 18px rgba(0,0,0,.35)}
.fab i{font-size:20px}
.fab-call{background:#0ea5e9}         /* Sky blue for call */
.fab-whatsapp{background:#25D366}     /* WhatsApp green */
.fab-instagram{background:#E4405F}    /* Instagram brand */
@media (max-width:980px){ .fab-group{display:flex}}

/* --- Service cards: description navy --- */
.gold-card p{color:#0c2340 !important} /* lacivert */

/* --- Reservation panel: white themed independent card --- */
.rez-form{background:#ffffff !important; border-color:rgba(0,0,0,.08) !important}
.rez-form, .rez-form label{color:#0c2340 !important}
.rez-form .rez-grid .field input, .rez-form .rez-grid .field select{
  background:#f6f8fb; color:#0c2340; border:1px solid rgba(0,0,0,.12)
}
.rez-actions .btn.primary{background:linear-gradient(135deg,#c8a960,#e6c981); color:#111}

/* Icon visibility adjustments */
.card i{display:inline-block;margin-bottom:6px;font-size:26px}
.gold-card i{color:#111 !important}

/* Floating button icons must be white and centered */
.fab i{color:#fff !important; font-size:20px}
.fab-call i,.fab-whatsapp i,.fab-instagram i{color:#fff !important}

/* Ensure icons are clearly visible */
/* Service cards: navy icons on gold */
.gold-card i{color:#0c2340 !important}

/* Floating FAB icons: white */
.fab i{color:#fff !important}

/* FAB icon centering fix */
.fab{position:relative; line-height:1; box-shadow:0 4px 14px rgba(0,0,0,.28)}
.fab i{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); color:#fff !important; pointer-events:none; font-size:20px}