Почему элемент header group вылезает за пределы контейнера при изменении размера экрана?

Элемент header group может вылезать за пределы контейнера при изменении размера экрана из-за недостаточного или неправильного использования CSS свойств, таких как margin, padding, width, или max-width. Возможно, стоит проверить и исправить значения этих свойств для элемента header group, чтобы он оставался в пределах контейнера при изменении размера экрана.

Чтобы помочь вам с ссылкой на страницу CodePen, мне нужно знать URL-адрес этой страницы. Пожалуйста, предоставьте мне ссылку на ваш проект на CodePen, чтобы я мог указать вам, как вставить эту ссылку.

Короче, у вас заданы жесткие размеры элементов внутри блока, пример: 
 
.search__form {
    border: solid 1px;
    width: 622px;
    height: 48px;
    gap: 24px;
    margin-top: 16px;
}
 
 Естественно при уменьшении экрана эти элементы останутся такого же размера, а блок контейнер продолжит уменьшаться, так как у него нет никаких ограничений по ширине. Не понятно какого другого поведения вы ждете от такой верстки?