.breadcrumbs {
    color: var(--rocket-color-text-primary);
    font-size: 0.75rem;
    line-height: 1.33;
    padding: 50px 0 40px;
    display: none;

    @include breakpoint(lg) {
        display: block;
    }

    &__list {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        margin: 0;
        padding: 0;
        list-style: none;
    }

    &__item {
        margin: 0;

        &:not(:last-child) {
            &::after {
                margin: 0 0.625rem;
                color: var(--rocket-color-green-100);
                content: '|';
            }
        }
    }

    &__link {
        text-decoration: none;
        opacity: 0.7;

        &:is(a) {
            @include event {
                text-decoration: underline;
            }
        }

        &:is(p) {
            opacity: 1;
            text-decoration: underline;
        }
    }
}