/* Navegación y controles compartidos para las páginas interiores. */
.nav a[aria-current="page"],
.mobile-nav nav a[aria-current="page"] {
  color: var(--heading);
}

.up {
  align-items: center;
  background: #111110;
  border: 1px solid #68645e;
  border-radius: 50%;
  bottom: max(20px, env(safe-area-inset-bottom));
  color: var(--paper);
  cursor: pointer;
  display: flex;
  font-size: 17px;
  height: 44px;
  justify-content: center;
  opacity: 0;
  padding: 0;
  pointer-events: none;
  position: fixed;
  right: max(16px, env(safe-area-inset-right));
  touch-action: manipulation;
  transform: translateY(8px);
  transition: background .2s, color .2s, opacity .2s, transform .2s;
  width: 44px;
  z-index: 30;
}

.up.is-visible {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}

.up:hover,
.up:focus-visible {
  background: var(--paper);
  color: var(--ink);
}

.mobile-nav {
  display: none;
}

@media (max-width: 760px) {
  .header {
    display: grid !important;
    grid-template-columns: 1fr auto 1fr;
    grid-template-rows: 86px auto;
    min-height: 86px;
    position: relative;
    z-index: 5;
  }

  .header > nav {
    display: none;
  }

  .header > .brand {
    grid-column: 2;
    grid-row: 1;
  }

  .header > .mobile-nav {
    display: block;
    grid-column: 1 / -1;
    grid-row: 1 / span 2;
    position: relative;
    width: 100%;
  }

  .mobile-nav summary {
    cursor: pointer;
    display: grid;
    gap: 5px;
    list-style: none;
    padding: 12px 0 12px 12px;
    position: absolute;
    right: 0;
    top: 20px;
  }

  .mobile-nav summary::-webkit-details-marker {
    display: none;
  }

  .mobile-nav summary span {
    background: var(--paper);
    display: block;
    height: 1px;
    width: 20px;
  }

  .mobile-nav[open] {
    padding-top: 86px;
  }

  .mobile-nav nav {
    display: none;
  }

  .mobile-nav[open] nav {
    display: grid;
    gap: 20px;
    padding: 18px 0 32px;
    text-align: center;
  }

  .mobile-nav nav a {
    color: var(--paper);
    font-size: 12px;
    letter-spacing: .08em;
    text-transform: uppercase;
  }
}