/* Menú principal (tarea 10, ampliado en la sesión 11): logo y enlaces a las secciones y a la Guía de crédito claro.
   Se usa en el encabezado de la página principal y en la barra de las páginas de la guía.
   Celular y tableta: botón «Menú» (con la palabra, no solo el ícono) que despliega la lista. Pantalla ancha: enlaces en fila.
   Sin JavaScript: se ven todos los enlaces, sin botón. */
.menu-barra{max-width:60rem;margin:0 auto;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.5rem 1rem}
.menu-barra .logo{margin:0;max-width:none;font-size:1.625rem}
.menu-barra .logo a{color:inherit;text-decoration:none}
.menu ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.5rem}
.menu a{display:inline-flex;align-items:center;min-height:2.75rem;padding:.4rem 1rem;border-radius:999px;border:2px solid var(--muted);color:var(--ink);font-family:var(--font-head);font-weight:700;font-size:1.125rem;text-decoration:none;transition:background .15s ease,transform .15s ease}
.menu a:hover{background:var(--card-claro)}
.menu a:active{transform:scale(.97)}
.menu a[aria-current="page"]{background:var(--grad-tarjeta);border-color:var(--primary)}

/* Botón «Menú» (solo con JavaScript) */
.menu-boton{display:inline-flex;align-items:center;gap:.6rem;min-height:3rem;padding:.4rem 1.1rem;border-radius:999px;border:2px solid var(--ink);background:#fff;color:var(--ink);font-family:var(--font-head);font-weight:700;font-size:1.125rem;cursor:pointer;transition:background .15s ease,transform .15s ease}
.menu-boton:hover{background:var(--card-claro)}
.menu-boton:active{transform:scale(.97)}
.menu-boton[hidden]{display:none}
.menu-boton__icono{position:relative;width:1.25rem;height:.95rem}
.menu-boton__icono i{position:absolute;left:0;width:100%;height:3px;border-radius:2px;background:currentColor;transition:transform .25s ease,opacity .2s ease}
.menu-boton__icono i:nth-child(1){top:0}.menu-boton__icono i:nth-child(2){top:calc(50% - 1.5px)}.menu-boton__icono i:nth-child(3){bottom:0}
.menu-boton[aria-expanded="true"]{background:var(--grad-tarjeta);border-color:var(--primary)}
.menu-boton[aria-expanded="true"] .menu-boton__icono i:nth-child(1){transform:translateY(calc(.475rem - 1.5px)) rotate(45deg)}
.menu-boton[aria-expanded="true"] .menu-boton__icono i:nth-child(2){opacity:0}
.menu-boton[aria-expanded="true"] .menu-boton__icono i:nth-child(3){transform:translateY(calc(-.475rem + 1.5px)) rotate(-45deg)}

/* Con JavaScript, en pantallas menores a 75rem: la lista va plegada debajo de la barra */
@media (max-width:74.99rem){
  .menu-js .menu{flex-basis:100%;display:grid;grid-template-rows:0fr;transition:grid-template-rows .3s ease}
  .menu-js .menu>ul{overflow:hidden;min-height:0;flex-direction:column;flex-wrap:nowrap;gap:0}
  .menu-js.menu-abierto .menu{grid-template-rows:1fr}
  .menu-js:not(.menu-abierto) .menu>ul{visibility:hidden;transition:visibility 0s .3s}
  .menu-js .menu li{border-bottom:1px solid #EAD8BE}
  .menu-js .menu li:first-child{border-top:1px solid #EAD8BE;margin-top:.5rem}
  .menu-js .menu a{display:flex;width:100%;min-height:3.5rem;padding:.6rem .25rem;border:0;border-radius:0;font-size:1.25rem}
  .menu-js .menu a::after{content:"→";margin-left:auto;color:var(--primary-oscuro)}
  .menu-js .menu a[aria-current="page"]{background:none;color:var(--primary-oscuro)}
}
/* Pantalla ancha: enlaces en fila, sin botón */
@media (min-width:75rem){
  .menu-barra{max-width:72rem}
  .menu-boton{display:none!important}
  .menu ul{flex-wrap:nowrap}
}
/* Celular: logo un poco más pequeño para que el botón «Menú» quepa al lado, en la misma línea */
@media (max-width:30rem){
  .menu-js .logo{font-size:1.35rem}
  .menu-boton{padding:.4rem .85rem;gap:.5rem}
}
/* Barra de las páginas legales (mismo aspecto que la de la guía) */
.barra-sitio{padding:1rem 1.25rem;background:var(--bg);border-bottom:1px solid #F1E3D0}