/* ================================================================
   SeeThru — Breadcrumbs (standalone, reusable)
   Scoped under .stx-pdp--crumb.
   ================================================================ */

.stx-pdp--crumb { display: block; }

.stx-crumb {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  font-family: var(--stx-font-mono);
  font-size: 11px;
  letter-spacing: var(--stx-ls-wide);
  text-transform: uppercase;
  color: var(--stx-ink-500);
  line-height: 1.4;
}
.stx-crumb a {
  color: var(--stx-ink-500);
  transition: color var(--stx-dur-fast) var(--stx-ease-out);
}
.stx-crumb a:hover { color: var(--stx-ink-200); }
.stx-crumb .sep { color: var(--stx-ink-700); }
.stx-crumb .here { color: var(--stx-ink-300); }

@media (max-width: 600px) {
  .stx-crumb { gap: 7px; font-size: 10px; }
}
