/* ---------- 6. NAVBAR ---------- */
.nav {
  position: fixed; inset: 0 0 auto 0; z-index: 100;
  height: var(--nav-h);
  display: flex; align-items: center;
  transition: background-color .5s var(--ease), box-shadow .5s var(--ease),
              backdrop-filter .5s var(--ease), height .5s var(--ease);
}
.nav::after {
  content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 1px;
  background: var(--linea);
  opacity: 0; transition: opacity .5s var(--ease);
}
.nav.is-scrolled {
  background: rgb(var(--azul-noche) / .82);
  backdrop-filter: blur(18px) saturate(140%);
  box-shadow: 0 12px 40px -22px rgb(var(--negro));
}
.nav.is-scrolled::after { opacity: 1; }

.nav__inner {
  width: 100%; max-width: var(--ancho); margin-inline: auto;
  padding-inline: var(--gutter);
  display: flex; align-items: center; justify-content: space-between; gap: 1.5rem;
}

.marca { display: flex; flex-direction: column; line-height: 1; }
.marca__sup {
  font-size: .56rem; letter-spacing: .38em; text-transform: uppercase;
  color: rgb(var(--lavanda-suave)); margin-bottom: .34rem;
}
.marca__nombre {
  font-family: var(--serif); font-size: 1.28rem;
  letter-spacing: .22em; text-transform: uppercase; color: var(--texto-fuerte);
  transition: color .35s var(--ease);
}
.marca:hover .marca__nombre { color: var(--acento-claro); }

.nav__menu { display: flex; align-items: center; gap: clamp(.9rem, 1.7vw, 1.8rem); }
.nav__link {
  position: relative;
  font-size: .73rem; letter-spacing: .2em; text-transform: uppercase;
  white-space: nowrap;
  color: var(--texto); padding: .5rem 0;
  transition: color .35s var(--ease);
}
.nav__link::after {
  content: ''; position: absolute; left: 0; bottom: 0; height: 1px; width: 100%;
  background: var(--acento);
  transform: scaleX(0); transform-origin: right;
  transition: transform .45s var(--ease);
}
.nav__link:hover, .nav__link.is-active { color: var(--texto-fuerte); }
.nav__link:hover::after, .nav__link.is-active::after { transform: scaleX(1); transform-origin: left; }

.nav__acciones { display: flex; align-items: center; gap: .75rem; }

.nav__burger {
  display: none;
  width: 46px; height: 46px;
  align-items: center; justify-content: center;
  background: rgb(var(--blanco-puro) / .04); border: 1px solid var(--linea);
  border-radius: 50%; cursor: pointer;
  transition: border-color .35s var(--ease), background-color .35s var(--ease);
}
.nav__burger:hover { border-color: rgb(var(--lavanda)); }

/* Panel móvil */
.menu-movil {
  position: fixed; inset: 0; z-index: 99;
  display: flex; flex-direction: column; justify-content: center;
  padding: calc(var(--nav-h) + 2rem) var(--gutter) 3rem;
  background: linear-gradient(180deg, var(--fondo) 0%, rgb(var(--azul-profundo)) 100%);
  opacity: 0; visibility: hidden;
  transition: opacity .45s var(--ease), visibility .45s;
}
.menu-movil.is-open { opacity: 1; visibility: visible; }
.menu-movil__lista { display: flex; flex-direction: column; gap: .25rem; }
.menu-movil__link {
  font-family: var(--serif); font-size: clamp(1.9rem, 8vw, 2.6rem);
  color: var(--texto-fuerte); padding: .35rem 0;
  border-bottom: 1px solid var(--linea);
  display: flex; align-items: baseline; gap: 1rem;
  opacity: 0; transform: translateY(18px);
  transition: color .3s var(--ease);
}
.menu-movil.is-open .menu-movil__link { animation: subir .6s var(--ease) forwards; }
.menu-movil__link:hover { color: var(--acento-claro); }
.menu-movil__num {
  font-family: var(--sans); font-size: .62rem;
  letter-spacing: .2em; color: var(--acento); opacity: .8;
}
.menu-movil__pie { margin-top: 2.5rem; display: flex; flex-direction: column; gap: 1rem; }

@keyframes subir { to { opacity: 1; transform: none; } }


/* El botón del encabezado nunca parte en dos líneas */
.nav__acciones .btn { white-space: nowrap; }

/* ---- BOTÓN DE IDIOMA ----
   Discreto, al lado del botón de contacto. Muestra el idioma
   actual encendido y el otro apagado. */
.idioma {
  display: inline-flex; align-items: center; gap: .3rem;
  padding: .45rem .7rem; min-height: 38px;
  border: 1px solid var(--linea); border-radius: 999px;
  background: transparent; cursor: pointer;
  font-size: .64rem; letter-spacing: .14em; font-weight: 400;
  transition: border-color .35s var(--ease), background-color .35s var(--ease);
}
.idioma:hover { border-color: var(--linea-fuerte); background: rgb(var(--lavanda) / .07); }
.idioma__actual { color: var(--texto-fuerte); }
.idioma__otro { color: var(--texto-suave); }
.idioma__actual::after {
  content: '/'; margin-left: .3rem; color: var(--texto-suave); opacity: .5;
}