.portal-marca {
  position: fixed;
  left: 50%;
  top: 50%;

  transform: translate(-50%, -50%);
  z-index: var(--p-z-nav);
  width: min(62vw, 720px);
  text-decoration: none;

  transform-origin: 50% 50%;
  will-change: transform;
}

.marca-svg {
  display: block;
  width: 100%;
  height: auto;

  color: var(--p-paper);
  transition: color var(--p-m-slow) var(--p-ease);

  transform: translateX(var(--p-marca-centrado));

  shape-rendering: geometricPrecision;
}

#marca { stroke-width: var(--p-marca-trazo) }
#m-s path { stroke-width: calc(var(--p-marca-trazo) / var(--p-marca-s-escala)) }

.portal-marca.viajando {
  transition: transform var(--p-intro-viaje) var(--p-ease-tela);
}

.portal-marca.asentada .marca-svg { transform: none }

.portal-marca.sigue-barra { transition: top var(--p-m) var(--p-ease) }

@media (max-width: 860px) {
  .portal-marca { width: min(84vw, 460px) }
}

.nav-hueco {
  display: block;
  width: 145.7px;

  height: 36px;
}
@media (max-width: 860px) {

  .nav-hueco { width: 113.3px; height: 28px }
}

@media (prefers-reduced-motion: reduce) {
  .portal-marca { will-change: auto }
  .portal-marca.viajando { transition: none }
}