.work-block {row-gap: var(--size-s);}

.work-block .--thumbnail {transition: opacity 500ms;}

.work-block:not(.--hover) .--thumbnail.--pic {opacity: 1;}
.work-block:not(.--hover) .--thumbnail.--video {opacity: 0;}
.work-block.--hover .--thumbnail.--pic {opacity: 0;}
.work-block.--hover .--thumbnail.--video {opacity: 1;}

.work_b-marker {
    width: .7rem;
    height: .7rem;
    background: var(--c-red);
    transform: translateY(-.75px);
    transition: margin 500ms;
    margin-left: calc(calc(.7rem + 4px) * -1);
    margin-right: 4px;
}
.work_b-marker.--show {margin-left: 0;}

.work-block .--client-container {height: fit-content;}