Minimal Theme - how to have text in announcement bar be 2 colors?

Hi, see pic below. I want the circled part to be a different color.

In Minimal theme, how can I have the Announcement Bar (Header Bar?) TEXT be two different colors? Thanks in advance!!

@justink

Sorry you are facing this issue, it would be my pleasure to help you.

Welcome to the Shopify community! :blush:
Thanks for your good question.

Please share your site URL,
I will check out the issue and provide you a solution here.

https://ChemistryNotes.com

Can anybody help on this?..

@KetanKumar Thanks for the reply.

my site:

https://chemistrynotes.com

code i’m wondering about:

/================ Module-specific styles ================/
.header-bar {
@include clearfix();
font-family: $accentFontStack;
font-size: em(14px);
font-weight: $accentFontWeight;
font-style: $accentFontStyle;
background-color: $colorTopBar;
color: $colorTopBarText;
padding-top: 2px;
padding-bottom: 2px;
text-align: center;

@include at-query($min, $large) {
text-align: right;
padding-top: 8px;
padding-bottom: 8px;
}

a,
button {
color: $colorTopBarText;

&:hover,
&:active,
&:focus {
outline-color: $colorTopBarText;
}
}

@KetanKumar I feel like this might be a step in the right direction, but would change all of the text color. Not just the last part of the text:

.header-bar .header-bar__module.header-bar__message a { color: #D373A9 !important;
}

@justink

can you please share announcement bar code