lololoshka2010

Зачем итерировать по кривому формату данных, если можно просто сразу его превратить в нормальный?

setItems(json[0].pizzas)
...
items.map((pizza) => <PizzaBlock key={pizza.title} {...pizza} />)

Slick - устарел.
Он не поддерживает флекс для слайдов.
А это значит, что внутри слайда нужно сделать обертку и задать ей flex.

Если открыть инструменты разработчика, то можно увидеть display у кадров. (И много чего ещё полезного)

Альтернатива: перестать оборачивать картинки в 4 в один слайд, а сделать каждую отдельным слайдом и сказать, что нужно выводить по 4 за раз.

Только RGBA
background: rgba(0,0,0,.5);

где стили для .header__arrow?
можно так:

.header__arrow{
    display: table;
    margin: 0 auto;
}