/* --------------------------------------------------------------------------
   Cabecera
   -------------------------------------------------------------------------- */
.cmr-topbar {
  position: absolute;
  inset: 0 0 auto 0;
  z-index: 40;
  display: flex;
  align-items: flex-start;
  min-height: var(--nav-alto);
}

/* Sin nada oscuro detrás, la barra pone su propio fondo: si no, los enlaces
   blancos desaparecen sobre el papel. */
.cmr-topbar.es-solida { background: var(--verde); padding-bottom: .8rem; }

.cmr-topbar.es-solida .cmr-boton-icono { background: rgba(255, 247, 235, .14); }

.cmr-topbar.es-solida .cmr-boton-icono:hover { background: rgba(255, 247, 235, .26); }

.cmr-topbar-utilidad {
  position: absolute;
  top: 1.4rem;
  left: 1.4rem;
  display: flex;
  gap: .5rem;
}

.cmr-boton-icono {
  display: grid;
  place-items: center;
  width: 2.6rem;
  height: 2.6rem;
  border-radius: 50%;
  color: var(--papel);
  background: rgba(8, 68, 56, .82);
  transition: background var(--transicion), transform var(--transicion);
}

.cmr-boton-icono:hover { background: var(--verde); transform: translateY(-1px); }

.cmr-nav {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: start;
  gap: 2rem;
  width: 100%;
  max-width: var(--ancho);
  margin-inline: auto;
  padding: 0 1.5rem;
}

.cmr-nav-lado {
  display: flex;
  align-items: center;
  gap: 2.5rem;
  padding-top: 1.6rem;
}

/* El primer enlace tiene que despejar los botones de utilidad, que van
   posicionados sobre la esquina. */
/* El hueco que se le deja a la barra de utilidad, que va posicionada en
   absoluto sobre la cabecera. Con sesión son tres botones —menú, buscar y la
   sesión— y no dos, así que ocupan hasta 163 px y el enlace de «Historia» se
   metía debajo. */
.cmr-nav-lado:first-of-type { padding-left: 6.5rem; }

/* El corte sale de la cuenta, no de tanteo: la barra mide 1180 px como mucho y
   sus enlaces empiezan a 128 px de su borde (24 de la propia barra + 104 de
   hueco). Para que no toquen los 163 px que ocupa la utilidad, la barra tiene
   que estar centrada con al menos 47 px a cada lado — es decir, a partir de
   1180 + 94 = 1274 px de ventana. Por debajo, hueco completo. */
@media (max-width: 1300px) {
  .cmr-nav-lado:first-of-type { padding-left: 10.5rem; }
}

.cmr-nav-lado:last-of-type { justify-content: flex-end; }

.cmr-nav-enlace {
  font-family: var(--sans);
  font-weight: 500;
  font-size: 1.05rem;
  letter-spacing: .08em;
  color: var(--papel);
  padding-bottom: .2rem;
  border-bottom: 1px solid transparent;
  transition: border-color var(--transicion);
}

.cmr-nav-enlace:hover,
.cmr-nav-enlace.es-actual { border-bottom-color: var(--crema); }

/* El logo cuelga de la barra en su propia caja verde, como un sello. */
/* La placa ya trae su propio fondo verde y sus esquinas, así que la caja no
   añade ninguno: solo la cuelga de la barra. */
.cmr-logo { display: grid; place-items: start center; }

.cmr-logo img { width: 7.5rem; height: auto; }