feat: update light banner style

Author: thomasguillot

src/content-gate/content-banner.scss

@@ -90,16 +90,25 @@ body.newspack-has-countdown-banner .site {
 				}
 			}
 
+			&__message {
+				color: var(--newspack-content-banner-message-color, inherit);
+			}
+
 			.newspack-ui__button {
 				width: 100%;
 
 				@include mixins.media( mobile ) {
 					width: auto;
 				}
 			}
+
+			strong {
+				font-weight: 600;
+			}
 		}
 
 		&.is-style-light {
+			--newspack-content-banner-message-color: var(--newspack-ui-color-neutral-60);
 			background: var(--newspack-ui-color-neutral-0);
 			color: var(--newspack-ui-color-neutral-90);
 		}
@@ -112,6 +121,7 @@ body.newspack-has-countdown-banner .site {
 		.newspack-wizard & {
 			box-shadow: none;
 			position: relative;
+			z-index: 0;
 
 			&-preview {
 				border: 1px solid var(--wp-components-color-gray-600, #{wp-colors.$gray-600});

src/wizards/audience/views/setup/countdown-banner.js

@@ -83,10 +83,10 @@ export default function CountdownBanner( { config, setConfig, updateConfig } ) {
 													<span className="newspack-countdown-banner__cta__content__countdown newspack-ui__font--s">
 														<strong>{ __( '1/10 free articles this month', 'newspack-plugin' ) }</strong>
 													</span>
-													<span className="newspack-countdown-banner__cta__content__message newspack-ui__font--s">
+													<span className="newspack-countdown-banner__cta__content__message newspack-ui__font--xs">
 														{ config.countdown_banner.cta_label ||
 															__( 'Subscribe now and get unlimited access.', 'newspack-plugin' ) }{ ' ' }
-														<a href="#signin_modal">{ __( 'Sign in to an existing account', 'newspack-plugin' ) }</a>
+														<a href="#signin_modal">{ __( 'Sign in to an existing account', 'newspack-plugin' ) }</a>.
 													</span>
 												</div>
 												<button