1. Класс hidden-xs это display: none. В свою очередь, display: none -
Временно удаляет элемент из документа. Занимаемое им место не резервируется и веб-страница формируется так, словно элемента и не было. Изменить значение и сделать вновь видимым элемент можно с помощью скриптов, обращаясь к свойствам через объектную модель. В этом случае происходит переформатирование данных на странице с учетом вновь добавленного элемента.
Следовательно пользователю изображения не прогрузятся.
2-3. Тут как душе угодно. НО!!! Ни есть хорошо, когда существует две вёрстки с одинаковым контентом. Я бы со стилями повозился. Да, это займёт больше времени, но зато и профит получишь, и код чище станет, и к карме +100 будет))