Dennis

Ваша проблема в том, что у Вас массив объектов, а Вы пытаетесь с ним работать как с единственным объектом. Прежде чем работать с объектом, нужно получить ссылку на него из массива, например по индексу.

Еще одна проблема, хоть она и не относится к вопросу, это то что у Вас присутствует бесполезная работа с localStorage (Вы каждый раз пишите туда новые, никак не зависящие от старых, данные, только ради того чтоб их тут же прочитать), а так же бесполезная сериализация/десериализация JSON.
Отношение к пользовательским ресурсам - все равно что вломится к пользователю домой и плюнуть ему в лицо.

По моему, самопроизвольно увеличивать видео без запроса пользователя -- плохое решение. Пусть пользователь сам решает увеличить или нет

Задать максимальную высоту, заранее самому высчитав её.
max-height: 500px;

При достижении высоты текст будет скролится, но вы это уже можете убрать или стилизовать самому.

В адаптиве убираем max-height, сами знаете почему.

Если просто, то нарезать картинок и решить в лоб, где каждая цифра и стрелка - отдельный блок с текстом. Можно фоном или просто картинкой с position absolute (внутри блока).

Если заморочиться, то цифры svg, стрелки тоже svg (плюс трансформ на искажение для изогнутости), так будет очень удобно адаптив делать: убрать transform и стрелки стали прямыми. С точки зрения производительности этот способ гораздо лучше первого.

.parent {
display:flex;
flex-direction:row;
}
@media (max-width:720px) {
.parent {
flex-direction:column;
}

или же

.parent {
display:flex;

}
@media (max-width:720px) {
.parent {
flex-wrap:wrap;
}
.left_block {
min-width:100%;
}