берешь блок (inline-block или через флексы Вам решить), ему % ширину, снизу бордер там 2-3px, на before вешаешь 1px черный бордер. Иконки, светлую серую линию через position:absolute. Число/текст внизу в div с text-align: center.
саб меню внутри списка li? тогда проблем не должно быть, при наведении на li и перемещение курсора на submenu hover не должен сбрасываться и страницу можно прокручивать.
если не заморачиваться со скриптом, то в каждой секции повесить элемент с position:absolute; top: 80px и на ссылку вешать якорь не index.php#portfolio, а уже index.php#portfolio__scroll Например )