/* One navigation style shared by both typography variants. */
.breadcrumbs { margin-top: 0; padding-top: var(--space-4); padding-bottom: 0; font-family: var(--sans); font-size: var(--text-caption); line-height: 1.5; color: var(--muted); }
.breadcrumbs ol { display: flex; flex-wrap: wrap; align-items: center; gap: .25rem .65rem; list-style: none; padding: 0; margin: 0; }
.breadcrumbs li { display: flex; align-items: center; gap: .65rem; min-width: 0; max-width: 100%; }
.breadcrumbs a,.breadcrumbs [aria-current] { display: inline-flex; align-items: center; min-height: 32px; overflow-wrap: anywhere; min-width: 0; }
.breadcrumbs a { color: inherit; text-underline-offset: .2em; }
.breadcrumbs a:hover { color: var(--text); }
.breadcrumbs a:focus-visible { outline: var(--focus-width) solid var(--gold); outline-offset: 3px; }
.breadcrumb-separator { flex: none; }
@media (max-width: 700px) { .breadcrumbs a,.breadcrumbs [aria-current] { min-height: 44px; } }