Как сверстать переход между блоками в виде волны?
svg + box-shadow
https://tympanus.net/codrops/2013/10/03/a-collecti...
https://tympanus.net/Development/SectionSeparators/
вот эту волну svg-шкой, а здание ниже и текст div2 через margin-top приподнять
ps: но ввиду особенной геморройности я бы сделал картинками :)))
Легко же. Берешь PIXI.js, добавляешь две группы, в каждой нужна картинка, создаешь маску для картинки, где одна сторона будет волной (это синус от точки на горизонтали). Далее добавляешь к нему некое изменяющееся значение,  пихаешь в ticker или в requestAnimationFrame, зацикливаешь и получаешь крутой аниммированный бэкграунд. И тот див тоже можешь двигать, ведь нужную точку ты будешь знать (выбери подходящую из тех что сгенерировал синусом), привяжи положение дива к этой точке, и получится вообще крутяк!