Я бы item вынес в отдельный блок. Всё-таки слайд — самостоятельная сущность, слайды могут быть разными, в общем их содержимое к самому слайдеру мало отношения имеет.
Проблема заключается в том, что в css нельзя стилизовать предыдущие элементы.
И она не решаема в данном случае (когда стилизовать требуется и предыдущие, и последующие). Так что единственное решение, которое так же пришло в голову - то, что предложил Алексей Тен
Чтобы не загрязнять разметку, это могут быть псевдоэлементы (в принципе, даже одного хватит), которые спозиционированы абсолютом и разрисованы линейным градиентом на квадратики.
Пилите на флексах без выравнивания (приемлемо для отображения) и через директиву support прогрессивное улучшение на гридах (у них достаточно хорошая поддержка, чтобы так сделать)
RuhHost, с for..of тоже какие траблы были, не помню уже, может сейчас и нормально. Обычно этот код через бабель прогоняется. Иил пишется по старинке, без новых фич языка.