How can customized CSS on WordPress highlight the blog title in white when it’s not intended?

the code you added affect the general elements of the page the H1 ,H2 ,H3

for example from the first part of the code

h1 {
  padding: 0.5em;
  color: #010101;
  background: #eaf3ff; /*this give the light blue back ground*/
  border-bottom: solid 3px #516ab6; /*and this gives the border under it*/
}

remove the two lines I pointed and background and border will disappear .

other than this try to use clear classes and keep the # for the clear sectors