Шапка и Flexbox

Дальше — шапка. Она превращается в тёмную полосу вверху страницы: логотип у левого края, навигация у правого, и то и другое посередине по высоте. Именно это вы делали в уроке «Flexbox»: шапка становится flex-контейнером, два её потомка, логотип и nav, — flex-элементами, а justify-content: space-between разводит их к двум краям.

Цвет полосы — #1e1b4b, глубокий индиго, как ночное небо над кинотеатром (или любой другой тёмный цвет на ваш вкус). Внутренний отступ 16px 32px даёт 16 пикселей сверху и снизу и 32 пикселя слева и справа.

На тёмном фоне синие ссылки читать трудно, поэтому ссылки в шапке будут белыми. И без подчёркивания: в навигации ссылки понятны и так. Подчёркивание задаёт свойство text-decoration, а значение none его убирает:

header a {
    color: white;
    text-decoration: none;
}

Правило для header a оформляет все ссылки в шапке, в том числе логотип. Затем логотип получает собственные размер и насыщенность шрифта в правиле для своего класса.

Наконец, две ссылки навигации стоят вплотную друг к другу. nav тоже становится flex-контейнером, а gap добавляет между ними промежуток.