.sxs-tftr {
    display: flex;
    align-items: center;
    gap: var(--_gtt);
    margin-top: 1em;
    --_gtt: 1.5rem;
    --_tsize: 2.5rem;

    &__stk {
        overflow: hidden;
        flex: 1;
        height: 1px;
        background-color: $accentClear6;

        &::after {
            content: "";
            display: block;
            width: 100%;
            height: 100%;
            transform: translate(-100%, 0);
            transition: transform 800ms cubic-bezier(.7, .2, .36, 0);
        }

        &::after {
            position: absolute;
            background-color: $primaryClear;
        }
    }

    &__con0 {
        display: flex;
        align-items: center;
        gap: calc(var(--_gtt) * .5);
        font-weight: 700;
        opacity: 0;
        transform: translate3d(calc(-1rem - 1vw - 1vh), 0%, 1px);
        transition: opacity 800ms 800ms, transform 800ms 800ms;
    }

    .sxs-icon {
        --_size: var(--_tsize);
    }

    &.animate {
        .sxs-tftr {
            &__stk::after {
                transform: translate(0%, 0);
            }

            &__con0 {
                opacity: 1;
                transform: translate3d(0%, 0%, 1px);
            }
        }
    }
}