Log in/out styling problem

I have a black banner (Template Part) on my website, where I want to embed the Gutenberg “Log In/Out” block.

Problem is that the styling for the “Log In/Out” block comes from definition of the Foreground Color:

a {
color: var(–wp–preset–color–foreground);
}

(using Chrome “Inspect” tool)

How do I change the color for the banner only, so that the font color is “white” to match the rest of my banner? I want to leave the foreground color for the rest of the site unchanged.

The “Log In/Out” block is wrapped by a <div> that I CAN style using the “Advanced” feature, but the styling overrides my definition for color:
<div class=”logged-out wp-block-loginout”>
Log in
</div>

The page I need help with: [log in to see the link]