Максим Тимофеев

Псевдоэлемент :after c повторяющейся картинкой на фоне

.navbar-brand {
    padding: 0;
}

точно сработает, если конечно Ваши стили подключены после бутстраповских.

1. шрифт явно разный
2. если Вы объявили в css шрифт это еще не значит, что он срабатывает
3. если шрифт называется одинаково, это не означает что он идентичен.
4. Веб шрифты часто отличаются от своих десктопных праотцов
5. Рендер не стандартного шрифта в каждом браузере может быть разным. Особенно если font-weight указан такой, который не присутствует в вебшрифте. Читать тут https://css-tricks.com/almanac/properties/t/text-r... может поможет
6. Без ссылки на Ваш WTF вряд ли что-то еще можно сказать

растрируйте шрифт

частично можно используя required и :valid
:valid выберет поля прошедшие валидацию, а required сделает таковыми только те поля что заполнены
www.w3schools.com/w3css/tryit.asp?filename=tryw3cs...
обратите внимание на

.w3-input:not(:valid)~.w3-validate {
    color: #f44336;
}
.w3-label {
    color: #009688;
}