Желательно подключать скрипты перед </body>, но если очень хочется подключать в head, то сделай это так
<script src="script.js" defer></script>

Предложу такую структуру

<обертка>
    <вопрос>
        <аватар></аватар>
        <обертка текстового блока></обертка текстового блока>
    </вопрос>
    <ответ>
        <аватар></аватар>
        <обертка текстового блока></обертка текстового блока>
    </ответ>
    <ответ>
        <аватар></аватар>
        <обертка текстового блока></обертка текстового блока>
    </ответ>
    <ответ>
        <аватар></аватар>
        <обертка текстового блока></обертка текстового блока>
    </ответ>
</обертка>

Стрелки и линии делаются с помощью псевдоэлементов :before и :after

.ответ .аватар:before {

}
.ответ .аватар:after {

}

Надеюсь это тебе поможет. Успехов

Родительскому блоку задаешь: display: flex; flex-direction: column. Тексту, который должен быть приклеен к низу: margin-top: auto

Оберни все элементы с классом language в один контейнер с классом container и в css укажи ему display: flex