/* Migas de pan de la biblioteca (hub, guías, «Cómo funciona» y «Próximamente»).
   Sueltas sobre el contenido, con el ancho de página de las guías; dentro de un
   hero (.sky-hero) se alinean con su columna. */
.system-breadcrumbs {
  width: min(calc(100% - 32px), var(--system-page-width, 1120px));
  margin: 0 auto;
  padding-top: 24px;
  color: var(--text-muted);
  font-size: 12px;
}

.system-breadcrumbs ol {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  list-style: none;
}

.system-breadcrumbs li + li::before {
  margin-right: 7px;
  color: var(--system-accent, var(--gold));
  content: "/";
}

.system-breadcrumbs a {
  color: inherit;
  text-underline-offset: 3px;
}

.sky-hero .system-breadcrumbs {
  width: auto;
  margin: 0;
  padding-top: 0;
}

@media (max-width: 560px) {
  .system-breadcrumbs { padding-top: 18px; }
  .sky-hero .system-breadcrumbs { padding-top: 0; }
}