/* ============================================================
   nav.css
   Barra de navegación fija. Fuente de verdad del nav.
   ============================================================ */

#navbar {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 100;
  min-height: 88px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 5%;
  background: #050505;
  border-bottom: 1px solid rgba(179, 138, 74, .18);
  transition: box-shadow var(--transition);
}

#navbar.scrolled {
  box-shadow: 0 14px 42px rgba(0, 0, 0, .38);
}

.nav-logo {
  display: flex;
  align-items: center;
  text-decoration: none;
}

.nav-logo img {
  display: none;
}

.nav-logo span {
  font-family: var(--font-body);
  color: var(--marfil);
  font-size: .92rem;
  font-weight: 700;
  letter-spacing: .18em;
  text-transform: uppercase;
}

.nav-links {
  display: flex;
  align-items: center;
  gap: 2rem;
  list-style: none;
}

.nav-links a {
  color: var(--marfil);
  text-decoration: none;
  font-size: .85rem;
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
  opacity: .86;
  transition: color var(--transition), opacity var(--transition), background var(--transition);
}

.nav-links a:hover {
  color: var(--dorado);
  opacity: 1;
}

.nav-cta {
  background: var(--dorado);
  color: var(--blanco);
  padding: .65rem 1.25rem;
  border: 1px solid rgba(245, 241, 234, .12);
  border-radius: var(--radius-sm);
  opacity: 1;
  box-shadow: 0 10px 24px rgba(179, 138, 74, .18);
}

.nav-cta:hover {
  background: #9f7632;
  color: var(--blanco);
}

@media (max-width: 900px) {
  #navbar {
    min-height: 74px;
    padding: .85rem 5%;
  }

  .nav-links {
    display: none;
  }
}

@media (max-width: 600px) {
  .nav-logo span {
    font-size: .82rem;
    letter-spacing: .14em;
  }
}