Виталий

Обычны в заказах по лендингах такое пишут, имеют виду видимую область экрана ... например 1360x768px ... один слайд полноэкранный

Все кнопки одинаковые, но поп-апы разные, поэтому привязываться по id к каждому не вариант(их может быть и 10 и 50 штук).

что значит - нельзя ? что мешает тем же JS гененировать ID или data атрибут с каким то параметром.
Потом использовать один шаблон попапа и туда передавать аяксом данные которые надо там выводить.

Если меню - какой нить псевдокласс :after и на него в CSS повесить фигуру
* https://habrahabr.ru/post/126207/ - тут примеры фигур

1. - сходите на собеседование - получите точный ответ, что от вас хочет конкретная контора
2. - весь интерактив на стороне клиента
3-4. - может пол месяца, может пол года - зависит от ваших способностей

Имхо. Без JS верстальщик нужен только на 5$ проекты на фриласне - подправить туда, дописать сюда ... что то серьёзно - сразу JS нужен.

Нужно смотреть рабочий ихсодник ... я бы смотрел в JS , то, куда должно вставятся value при выборе опции

.class-name-1.class-name-2{color: red;}
		.class-name-2{color: green;font-weight: bold;}

для некоторых случаем можно и так ...

Такое впечатление, что сдаётся норматив по бегу.
У вас слишком много переменных, чтобы иметь какие то данные. Тут главное, чтобы вы в срок укладывались. Я обычно накидываю 30% времени на всякие неприятности. И в итоге почти всегда успеваю вовремя. Клиент доволен - все довольны.
Качество верстки - со стороны исполнителя - как максимум валидатор, как минимум корректная кроссбраузерность.
Со стороны клиента - чтобы вложения в сайт окупились как можно быстрее: чтобы клиент не ушел, из-за того, что у него как то криво тут и страница грузится 10 минут.

Как вариант - юзать php класс для определения устройства и в зависимости от результат выдавать тот или иной шаблон

Вангую, что какое то свойство из CSS 3 , возможно box-shadow/text-shadow бажит

картинкой

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

Заходите на themeforest.net ( или какой другой сайт с шаблонами ... открываете шаблон .... смотрите на него, можете сриншот страницы сделать.
Режете в PS и верстаете, что то не понятно - смотрите как сделано на уже готовом шаблоне.

Да и зачем вам сразу уроки по адаптив, sass/susy и т.д , если обычный шаблон сверстать пока не можете. Все делать нужно поэтапно и размеренно. Что то не ясно - потратьте время, чтобы разобраться самому почему и как.

Чтобы научиться что то делать - нужно это делать, много делать. Постоянно что то новое появляется - надо следить на этим, помогать другим , например тут.

Если вы сможете реализовать ее же с нуля, но используйте bootstrap или еще что, дабы сэкономить время клиента и деньги - то заказчик должен быть рад этому.

но используете ли вы эти сторонние модули, или это не совместимо с понятием "хороший специалист" и нужно использовать только то, что придумали сами?

если это не подразумевается проектом - использую чужие, обращая внимания на лицензию. Опять же - экономия ресурсов

Находите подходящий по структуре шаблон и переделываете
Если есть время разобраться - берете за базу:
- gantry-framework.org
- www.t3-framework.org
- https://yootheme.com/themes/warp-framework
.. или какой другой фреймфорк и на основе него делаете свою тему.