A new block formatting context is created on your .header-actions element due to display: flex.

Since neither .header-actions nor header::before has a specified z-index, .header-actions stays in front. You can add z-index: 1 to your header::before to make .header-actions appear behind it.