Как правильно сделать адаптивную верстку если дизайн разный?

Привет.

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

Макет простой, обычный интернет магазин каких полно в сети, адаптивная версия понятное дело урезана, но сделано это так, что со стороны выглядит как совершенно другой дизайн.
Например взять главную страницу, на десктопе полно баннеров выложенных в сетку, блоки новостей и т.п. А в мобиле только два блока "Одежда для мальчиков" и "Одежда для девочек" и дизайн этих блоков никак не похож на те что были в десктопе. Т.е. взять и через медиа запросы видоизменять блоки не получится. Вернее это можно, но проще тогда сверстать моб. блоки и скрывать их на десктопе, а последние скрывать на мобиле.
Шапка тоже выглядит другой, вообщем мобильная версия явно не предусматривает то, как работает responsive дизайн, элементы не видоизменяются не перестраиваются в некоторых случаях, а тупо заменяются заранее подготовленными.
Например взять логотип, по десктопному макету он в одном месте, а на мобиле в другом и окружен различными элементами в виде блока соц иконок, гамбургера, поиска и т.д. То есть изначально разметка не позволяет использовать один элемент в разных разрешениях. Приходится создавать два элемента и показывать их в зависимости от разрешения.

Вопросов два, как правильно поступать в таких случаях и что делать с десктопным контентом и блоками которые "грузят" мобильную страницу?
По первому вопросу, думаю, что надо верстать с заранее стилизованными блоками, если они кардинально отличаются по дизайну и обычной заменой стилей в медиа запросе не обойтись. Вариант так себе, то что на странице (в разметке) появляются по два/три одинаковых элемента явно не правильно.
А со вторым вопросом затык.