Почему блок .main-nav изменяет свое положение при написание кода в “Цель 2” относительно “Цель 1” ? Т.е. почему он не остается наверху .header-top также как .header-logo. Ведь в структуре кода его никто не отталкивает, нет ни маржинов ни пэддингов, которые бы влияли на него.
Нет явно заданных отступов. В этом вы правы. Но у списка меню .main-nav есть внешние отступы по умолчанию. Их величина разнится в браузерах.
На следующем шаге вы их обнуляете.