/* Cabecera común (componente Cabecera.astro). Lleva sus propios colores para que funcione igual
   en las páginas nuevas y en las clonadas de Webflow, que tienen otra hoja de estilos. */
.nav, .menu-movil {
  --c-fondo: #f4f1ea; --c-texto: #13322b; --c-suave: #5d6b64; --c-linea: rgba(19, 50, 43, .14); --c-acento: #c67c52;
  --c-mono: 'JetBrains Mono', ui-monospace, monospace; --c-gutter: clamp(16px, 4vw, 56px);
  --logo-marca: var(--c-acento);
  box-sizing: border-box;
}
.nav *, .menu-movil * { box-sizing: border-box; }
.nav { position: fixed; inset: 0 0 auto; z-index: 30; display: flex; align-items: center; gap: 24px; padding: 14px var(--c-gutter); transition: background .3s, box-shadow .3s; }
.nav.con-fondo { background: rgba(244, 241, 234, .82); backdrop-filter: blur(10px); box-shadow: 0 1px 0 var(--c-linea); }
.nav-logo { display: block; line-height: 0; }
.nav-logo svg { height: 26px; width: auto; }
.nav nav { display: flex; gap: 2px; margin-left: 12px; }
.nav nav a, .nav-cta { font: 500 12px/1 var(--c-mono); letter-spacing: .08em; text-transform: uppercase; text-decoration: none; padding: 9px 12px; border-radius: 999px; color: var(--c-suave); transition: .2s; }
.nav nav a:hover { color: var(--c-texto); background: rgba(19,50,43,.06); }
.nav a[aria-current=page] { color: var(--c-texto); background: rgba(19,50,43,.08); }
.nav-cta { margin-left: auto; background: var(--c-texto); color: var(--c-fondo); padding: 11px 16px; }
.nav-cta:hover { background: var(--c-acento); color: #fff; }
.nav-menu { display: none; margin-left: auto; background: none; border: 0; width: 40px; height: 40px; padding: 0; cursor: pointer; }
.nav-menu span { display: block; height: 1.5px; background: var(--c-texto); margin: 7px 8px; transition: .2s; }
.nav-menu[aria-expanded=true] span:first-child { transform: translateY(4px) rotate(45deg); }
.nav-menu[aria-expanded=true] span:last-child { transform: translateY(-4px) rotate(-45deg); }
.menu-movil { position: fixed; inset: 64px 0 auto; z-index: 29; background: var(--c-fondo); border-bottom: 1px solid var(--c-linea); display: grid; padding: 8px var(--c-gutter) 20px; }
.menu-movil[hidden] { display: none; }
.menu-movil a { font: 500 14px/1 var(--c-mono); letter-spacing: .08em; text-transform: uppercase; text-decoration: none; color: var(--c-texto); padding: 16px 0; border-bottom: 1px solid var(--c-linea); }
@media (max-width: 860px) {
  .nav nav, .nav-cta { display: none; }
  .nav-menu { display: block; }
}

/* Páginas clonadas de Webflow: barra siempre con fondo, sin el menú antiguo de tres rayas */
.cabecera-fija .nav { z-index: 1000; background: rgba(244, 241, 234, .92); backdrop-filter: blur(10px); box-shadow: 0 1px 0 var(--c-linea); }
.cabecera-fija .navbar-2.w-nav { display: none !important; }
.cabecera-fija body { padding-top: 64px; }
.cabecera-fija .menu-movil { z-index: 999; }
/* donde el menú antiguo compartía bloque con el título, dejamos aire; si el bloque solo tenía el menú, fuera */
.cabecera-fija .menu-pagina:has(> .navbar-2.w-nav):not(:has(> .navbar-2.w-nav:only-child)) { padding-top: 56px; }
.cabecera-fija .section:has(> .menu-pagina > .navbar-2.w-nav:only-child) { display: none; }
.cabecera-fija .section:has(> .menu-pagina:empty) { display: none; }
.cabecera-fija .page-wrapper { margin-top: 0; }
.cabecera-fija .listing-hero { padding-top: 48px; }
