.site-breadcrumb .site-breadcrumb__track {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    row-gap: 6px;
    margin: 0;
    padding: 0;
}

.site-breadcrumb .site-breadcrumb__track > li {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    margin: 0;
    padding: 0;
    line-height: 1.5;
}

.site-breadcrumb .site-breadcrumb__track > li > :is(a, span) {
    display: inline-flex;
    align-items: center;
    line-height: inherit;
}

.site-breadcrumb .site-breadcrumb__track > li:not(:last-child)::after {
    display: block;
    flex: 0 0 6px;
    width: 6px;
    height: 6px;
    margin: 0 12px;
    border-top: 1px solid #a5afa0;
    border-right: 1px solid #a5afa0;
    content: '';
    transform: rotate(45deg);
}

.site-breadcrumb .site-breadcrumb__home {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.site-breadcrumb__home svg {
    flex-shrink: 0;
}

.site-breadcrumb .site-breadcrumb__home-label {
    opacity: 1;
}

@media (max-width: 767.98px) {
    nav.site-breadcrumb {
        display: flex;
        align-items: center;
        gap: 8px;
        width: 100%;
        min-width: 0;
        padding: 0;
        overflow: visible;
        color: #687168;
        font-size: 14px;
        line-height: 1.5;
    }

    .site-breadcrumb__viewport {
        flex: 1;
        min-width: 0;
        overflow-x: auto;
        overflow-y: hidden;
        overscroll-behavior-x: contain;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
        touch-action: pan-x pan-y pinch-zoom;
    }

    .site-breadcrumb__viewport::-webkit-scrollbar {
        display: none;
    }

    .site-breadcrumb .site-breadcrumb__track {
        flex-wrap: nowrap;
        width: max-content;
        white-space: nowrap;
    }

    .site-breadcrumb .site-breadcrumb__home-label {
        display: none;
    }

    .site-breadcrumb .site-breadcrumb__track a {
        display: inline-flex;
        align-items: center;
        min-height: 40px;
        color: #354735;
        text-decoration: none;
    }

    .site-breadcrumb .site-breadcrumb__home {
        justify-content: center;
        width: 28px;
    }

    .site-breadcrumb .site-breadcrumb__track [aria-current="page"] {
        color: #687168;
        opacity: 1;
    }

    .site-breadcrumb__viewport.has-overflow {
        -webkit-mask-image: linear-gradient(to right, transparent, #000 12px, #000 calc(100% - 12px), transparent);
        mask-image: linear-gradient(to right, transparent, #000 12px, #000 calc(100% - 12px), transparent);
    }

    .site-breadcrumb__viewport.has-overflow.at-start {
        -webkit-mask-image: linear-gradient(to right, #000, #000 calc(100% - 12px), transparent);
        mask-image: linear-gradient(to right, #000, #000 calc(100% - 12px), transparent);
    }

    .site-breadcrumb__viewport.has-overflow.at-end {
        -webkit-mask-image: linear-gradient(to right, transparent, #000 12px, #000);
        mask-image: linear-gradient(to right, transparent, #000 12px, #000);
    }

    .site-breadcrumb a:focus-visible {
        outline: 2px solid #48613a;
        outline-offset: -3px;
        border-radius: 4px;
    }

    .site-breadcrumb__viewport:focus-visible {
        outline: 2px solid #48613a;
        outline-offset: 2px;
        border-radius: 4px;
    }
}
