/* ================================================
   HGW Colombia · nav.css
   Barra de navegación fija + menú móvil
   ================================================ */

nav#navbar {
  position:fixed; top:0; left:0; right:0; z-index:500;
  display:flex; align-items:center; justify-content:space-between;
  padding:18px var(--gap);
  transition:background 0.4s,padding 0.3s,box-shadow 0.3s;
}
nav#navbar.scrolled {
  background:rgba(14,14,11,0.95);
  backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px);
  padding:12px var(--gap);
  box-shadow:0 1px 0 var(--border);
}

.nav-logo {
  font-family:var(--serif); font-size:clamp(18px,4vw,22px);
  font-weight:700; color:var(--cream); text-decoration:none; flex-shrink:0;
}
.nav-logo span { color:var(--gold); }

.nav-links { display:flex; align-items:center; gap:clamp(16px,3vw,36px); list-style:none; }
.nav-links a {
  font-size:12px; font-weight:400; letter-spacing:1px;
  text-transform:uppercase; color:var(--text2); text-decoration:none;
  transition:color 0.2s; position:relative; white-space:nowrap;
}
.nav-links a::after {
  content:''; position:absolute; bottom:-4px; left:0; right:0;
  height:1px; background:var(--gold);
  transform:scaleX(0); transform-origin:left; transition:transform 0.3s;
}
.nav-links a:hover,.nav-links a.active { color:var(--gold); }
.nav-links a:hover::after { transform:scaleX(1); }

.nav-cta {
  background:var(--gold)!important; color:var(--ink)!important;
  padding:8px 18px; border-radius:2px;
  font-weight:600!important; white-space:nowrap;
}
.nav-cta::after { display:none!important; }
.nav-cta:hover  { background:var(--gold2)!important; }

/* Hamburger */
.nav-ham {
  display:none; flex-direction:column; justify-content:center; gap:5px;
  background:none; border:none; cursor:pointer; padding:8px;
  -webkit-tap-highlight-color:transparent;
}
.nav-ham span {
  display:block; width:22px; height:2px;
  background:var(--cream); border-radius:2px; transition:all 0.3s;
}
.nav-ham.open span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
.nav-ham.open span:nth-child(2) { opacity:0; }
.nav-ham.open span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }

/* Menú móvil */
.mobile-menu {
  display:none; position:fixed; inset:0; z-index:499;
  background:rgba(10,10,8,0.98); backdrop-filter:blur(20px);
  flex-direction:column; align-items:center; justify-content:center;
  gap:clamp(20px,5vh,36px); opacity:0; transition:opacity 0.3s;
}
.mobile-menu.open { display:flex; opacity:1; }
.mobile-menu a {
  font-family:var(--serif); font-size:clamp(26px,6vw,38px);
  font-weight:700; color:var(--cream); text-decoration:none;
  letter-spacing:-0.5px; transition:color 0.2s;
}
.mobile-menu a:hover { color:var(--gold); }
.mobile-menu .m-cta {
  background:var(--gold); color:var(--ink)!important;
  padding:14px 40px; border-radius:2px;
  font-family:var(--sans); font-size:16px;
  font-weight:600; letter-spacing:1px; text-transform:uppercase; margin-top:8px;
}

/* Responsive */
@media (max-width:768px) {
  .nav-links { display:none; }
  .nav-ham   { display:flex; }
}
