/* ============================================================
   NAVBAR.CSS — Topbar + Navbar: stile unico per tutte le pagine
   Caricato DOPO il CSS specifico della pagina: ha precedenza
   ============================================================ */

/* ── TOPBAR ── */
.topbar {
  background: var(--navy);
  color: rgba(255,255,255,.7);
  font-size: .72rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: .55rem 3rem;
}
.topbar a { color: rgba(255,255,255,.7); text-decoration: none; transition: color var(--trans); }
.topbar a:hover { color: #d4a95a; }
.topbar span { color: rgba(255,255,255,.55); }
.topbar-left { display: flex; gap: 2rem; flex-wrap: wrap; align-items: center; }
.topbar-right { display: flex; gap: 1.2rem; align-items: center; }

/* Pulsanti lingua topbar (sia <a> che <button>) */
.lang-btn {
  background: none;
  border: 1px solid rgba(255,255,255,.25);
  color: rgba(255,255,255,.7);
  padding: .2rem .6rem;
  font-size: .68rem;
  letter-spacing: .1em;
  cursor: pointer;
  transition: all var(--trans);
  font-family: var(--sans);
  text-decoration: none;
  line-height: 1.6;
  display: inline-block;
}
.lang-btn:hover,
.lang-btn.active { border-color: #b8965a; color: #b8965a; }

/* ── NAVBAR ── */
nav {
  position: sticky;
  top: 0;
  z-index: 100;
  background: rgba(255,255,255,.98);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(184,150,90,.2);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 3rem;
  height: 72px;
  box-shadow: none;
  transition: box-shadow var(--trans);
}
nav.scrolled { box-shadow: 0 2px 20px rgba(15,31,56,.08); }

/* Logo immagine */
.logo {
  display: flex;
  align-items: center;
  gap: .6rem;
  text-decoration: none;
  flex-shrink: 0;
}
.logo-img { height: 28px; width: auto; display: block; }

/* Logo testo (fallback) */
.logo span { color: #b8965a; }
.logo-sub {
  font-family: var(--sans);
  font-size: .55rem;
  letter-spacing: .25em;
  text-transform: uppercase;
  color: var(--muted, #8a7560);
  display: block;
  margin-top: -2px;
}

/* Voci di navigazione */
.nav-links { display: flex; gap: 2.5rem; list-style: none; align-items: center; margin: 0; padding: 0; }
.nav-links a {
  text-decoration: none;
  color: var(--navy);
  font-size: .78rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  font-weight: 400;
  position: relative;
  padding-bottom: 4px;
  transition: color var(--trans);
}
.nav-links a::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0;
  width: 0; height: 1.5px;
  background: #b8965a;
  transition: width var(--trans);
}
.nav-links a:hover { color: #b8965a; }
.nav-links a:hover::after,
.nav-links a.active::after { width: 100%; }
.nav-links a.active { color: #b8965a; }

/* CTA Contattaci */
.nav-cta {
  background: #b8965a !important;
  color: #fff !important;
  padding: .5rem 1.4rem !important;
  font-size: .72rem !important;
  letter-spacing: .14em;
  border: none;
  transition: background var(--trans) !important;
}
.nav-cta::after { display: none !important; }
.nav-cta:hover { background: var(--navy) !important; color: #fff !important; }

/* Select lingua (solo mobile) */
.nav-lang-select {
  display: none;
  background: none;
  border: 1px solid rgba(184,150,90,.35);
  color: var(--navy);
  font-size: .72rem;
  padding: .3rem .5rem;
  cursor: pointer;
  font-family: var(--sans);
  letter-spacing: .08em;
  border-radius: 2px;
}
.nav-lang-select:focus { border-color: #b8965a; outline: none; }

/* Hamburger */
.menu-toggle {
  display: none;
  flex-direction: column;
  gap: 5px;
  cursor: pointer;
  background: none;
  border: none;
  padding: .4rem;
}
.menu-toggle span { width: 24px; height: 2px; background: var(--navy); display: block; transition: var(--trans); }

/* ── MOBILE ── */
@media (max-width: 768px) {
  .topbar { display: none; }   /* nascosto su mobile: la lingua è gestita dal select nella nav */
  nav { padding: 0 1.2rem; height: 64px; backdrop-filter: none; -webkit-backdrop-filter: none; }
  .menu-toggle { display: flex; }
  .nav-lang-select { display: block; }
  nav .nav-links {
    display: none;
    flex-direction: column;
    align-items: flex-start;
    gap: 0;
    position: fixed;
    top: 64px; left: 0; right: 0;
    background: rgba(255,255,255,.98);
    padding: 1rem 1.5rem 2rem;
    border-bottom: 1px solid rgba(184,150,90,.2);
    box-shadow: 0 8px 24px rgba(15,31,56,.1);
    z-index: 99;
  }
  nav .nav-links.show { display: flex; }
  nav .nav-links li { width: 100%; }
  nav .nav-links a { padding: .75rem 0; display: block; border-bottom: 1px solid rgba(184,150,90,.08); padding-bottom: .75rem; }
  nav .nav-links a::after { display: none; }
  .nav-cta { margin-top: .5rem; text-align: center; width: 100%; display: block; box-sizing: border-box; }
}
