From 9220f70205dec3c1269d2b67144284dea4df73cc Mon Sep 17 00:00:00 2001
From: Brandonma21 <Brandonmarshall101@gmail.com>
Date: Tue, 29 Sep 2026 14:24:47 +0200
Subject: [PATCH 1/3] Make phase section patterns follow the current phase
 colour

New variable
- Add --ls-phase-accent (standard phase token) beside --ls-phase-accent-on-dark
- Set per phase from the page-slug body class in phase-journey-nav.scss
- Rebuild phase-journey-nav.css

Light-background patterns
- Introduction and Delivery Numbers: swap hardcoded phase.discover for var(--ls-phase-accent)
- Common Services, Support Focus, Deliverables And Role, Where To Go Next: point $ls_phase_accent at var(--ls-phase-accent)

Dark-background pattern
- CTA: swap phase.discover-on-dark checklist bullet for var(--ls-phase-accent-on-dark)

Not included
- Copy and links in each pattern remain Discover content per page
- Journey Nav, Services In Phase and FAQ already follow the phase
---
 assets/css/phase-journey-nav.css                  | 2 +-
 patterns/sections/phase-common-services.php       | 2 +-
 patterns/sections/phase-cta.php                   | 4 ++--
 patterns/sections/phase-deliverables-and-role.php | 2 +-
 patterns/sections/phase-delivery-numbers.php      | 4 ++--
 patterns/sections/phase-introduction.php          | 4 ++--
 patterns/sections/phase-support-focus.php         | 2 +-
 patterns/sections/phase-where-to-go-next.php      | 2 +-
 src/scss/structural/phase-journey-nav.scss        | 3 +++
 9 files changed, 14 insertions(+), 11 deletions(-)

diff --git a/assets/css/phase-journey-nav.css b/assets/css/phase-journey-nav.css
index 5da286c..9455e23 100644
--- a/assets/css/phase-journey-nav.css
+++ b/assets/css/phase-journey-nav.css
@@ -1 +1 @@
-.ls-phase-journey-nav__step--discover{--ls-phase-item-accent: var(--wp--custom--color--phase--discover-on-dark, var(--wp--custom--color--phase--discover))}.ls-phase-journey-nav__step--create{--ls-phase-item-accent: var(--wp--custom--color--phase--create-on-dark, var(--wp--custom--color--phase--create))}.ls-phase-journey-nav__step--build{--ls-phase-item-accent: var(--wp--custom--color--phase--build-on-dark, var(--wp--custom--color--phase--build))}.ls-phase-journey-nav__step--launch{--ls-phase-item-accent: var(--wp--custom--color--phase--launch-on-dark, var(--wp--custom--color--phase--launch))}.ls-phase-journey-nav__step--grow{--ls-phase-item-accent: var(--wp--custom--color--phase--grow-on-dark, var(--wp--custom--color--phase--grow))}.ls-phase-journey-nav__step--evolve{--ls-phase-item-accent: var(--wp--custom--color--phase--evolve-on-dark, var(--wp--custom--color--phase--evolve))}.ls-phase-journey-nav__link a{transition:color var(--wp--custom--animation--duration--base) var(--wp--custom--animation--easing--standard)}.ls-phase-journey-nav__link a{color:color-mix(in srgb, var(--wp--custom--color--text--on-dark-muted) 70%, transparent)}.ls-phase-journey-nav__link a:hover,.ls-phase-journey-nav__link a:focus-visible{color:var(--wp--custom--color--text--on-dark)}.ls-phase-journey-nav__dot{display:none}body.page-slug-discover{--ls-phase-accent-on-dark: var(--wp--custom--color--phase--discover-on-dark, var(--wp--custom--color--phase--discover))}body.page-slug-create{--ls-phase-accent-on-dark: var(--wp--custom--color--phase--create-on-dark, var(--wp--custom--color--phase--create))}body.page-slug-build{--ls-phase-accent-on-dark: var(--wp--custom--color--phase--build-on-dark, var(--wp--custom--color--phase--build))}body.page-slug-launch{--ls-phase-accent-on-dark: var(--wp--custom--color--phase--launch-on-dark, var(--wp--custom--color--phase--launch))}body.page-slug-grow{--ls-phase-accent-on-dark: var(--wp--custom--color--phase--grow-on-dark, var(--wp--custom--color--phase--grow))}body.page-slug-evolve{--ls-phase-accent-on-dark: var(--wp--custom--color--phase--evolve-on-dark, var(--wp--custom--color--phase--evolve))}body.page-slug-discover .ls-phase-journey-nav__step--discover .ls-phase-journey-nav__link a{color:var(--ls-phase-item-accent)}body.page-slug-discover .ls-phase-journey-nav__step--discover .ls-phase-journey-nav__link a:hover,body.page-slug-discover .ls-phase-journey-nav__step--discover .ls-phase-journey-nav__link a:focus-visible{color:var(--wp--custom--color--text--on-dark)}body.page-slug-discover .ls-phase-journey-nav__step--discover .ls-phase-journey-nav__dot{display:inline-flex}body.page-slug-create .ls-phase-journey-nav__step--create .ls-phase-journey-nav__link a{color:var(--ls-phase-item-accent)}body.page-slug-create .ls-phase-journey-nav__step--create .ls-phase-journey-nav__link a:hover,body.page-slug-create .ls-phase-journey-nav__step--create .ls-phase-journey-nav__link a:focus-visible{color:var(--wp--custom--color--text--on-dark)}body.page-slug-create .ls-phase-journey-nav__step--create .ls-phase-journey-nav__dot{display:inline-flex}body.page-slug-build .ls-phase-journey-nav__step--build .ls-phase-journey-nav__link a{color:var(--ls-phase-item-accent)}body.page-slug-build .ls-phase-journey-nav__step--build .ls-phase-journey-nav__link a:hover,body.page-slug-build .ls-phase-journey-nav__step--build .ls-phase-journey-nav__link a:focus-visible{color:var(--wp--custom--color--text--on-dark)}body.page-slug-build .ls-phase-journey-nav__step--build .ls-phase-journey-nav__dot{display:inline-flex}body.page-slug-launch .ls-phase-journey-nav__step--launch .ls-phase-journey-nav__link a{color:var(--ls-phase-item-accent)}body.page-slug-launch .ls-phase-journey-nav__step--launch .ls-phase-journey-nav__link a:hover,body.page-slug-launch .ls-phase-journey-nav__step--launch .ls-phase-journey-nav__link a:focus-visible{color:var(--wp--custom--color--text--on-dark)}body.page-slug-launch .ls-phase-journey-nav__step--launch .ls-phase-journey-nav__dot{display:inline-flex}body.page-slug-grow .ls-phase-journey-nav__step--grow .ls-phase-journey-nav__link a{color:var(--ls-phase-item-accent)}body.page-slug-grow .ls-phase-journey-nav__step--grow .ls-phase-journey-nav__link a:hover,body.page-slug-grow .ls-phase-journey-nav__step--grow .ls-phase-journey-nav__link a:focus-visible{color:var(--wp--custom--color--text--on-dark)}body.page-slug-grow .ls-phase-journey-nav__step--grow .ls-phase-journey-nav__dot{display:inline-flex}body.page-slug-evolve .ls-phase-journey-nav__step--evolve .ls-phase-journey-nav__link a{color:var(--ls-phase-item-accent)}body.page-slug-evolve .ls-phase-journey-nav__step--evolve .ls-phase-journey-nav__link a:hover,body.page-slug-evolve .ls-phase-journey-nav__step--evolve .ls-phase-journey-nav__link a:focus-visible{color:var(--wp--custom--color--text--on-dark)}body.page-slug-evolve .ls-phase-journey-nav__step--evolve .ls-phase-journey-nav__dot{display:inline-flex}.ls-phase-journey-nav__link a:focus-visible{outline:2px solid var(--wp--custom--color--text--on-dark);outline-offset:3px;border-radius:var(--wp--preset--border-radius--100)}@media(prefers-reduced-motion: reduce){.ls-phase-journey-nav__link a{transition:none}}@media(max-width: 781px){.ls-phase-journey-nav__items{overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}.ls-phase-journey-nav__items::-webkit-scrollbar{display:none}.ls-phase-journey-nav__step{flex-shrink:0}}
+.ls-phase-journey-nav__step--discover{--ls-phase-item-accent: var(--wp--custom--color--phase--discover-on-dark, var(--wp--custom--color--phase--discover))}.ls-phase-journey-nav__step--create{--ls-phase-item-accent: var(--wp--custom--color--phase--create-on-dark, var(--wp--custom--color--phase--create))}.ls-phase-journey-nav__step--build{--ls-phase-item-accent: var(--wp--custom--color--phase--build-on-dark, var(--wp--custom--color--phase--build))}.ls-phase-journey-nav__step--launch{--ls-phase-item-accent: var(--wp--custom--color--phase--launch-on-dark, var(--wp--custom--color--phase--launch))}.ls-phase-journey-nav__step--grow{--ls-phase-item-accent: var(--wp--custom--color--phase--grow-on-dark, var(--wp--custom--color--phase--grow))}.ls-phase-journey-nav__step--evolve{--ls-phase-item-accent: var(--wp--custom--color--phase--evolve-on-dark, var(--wp--custom--color--phase--evolve))}.ls-phase-journey-nav__link a{transition:color var(--wp--custom--animation--duration--base) var(--wp--custom--animation--easing--standard)}.ls-phase-journey-nav__link a{color:color-mix(in srgb, var(--wp--custom--color--text--on-dark-muted) 70%, transparent)}.ls-phase-journey-nav__link a:hover,.ls-phase-journey-nav__link a:focus-visible{color:var(--wp--custom--color--text--on-dark)}.ls-phase-journey-nav__dot{display:none}body.page-slug-discover{--ls-phase-accent-on-dark: var(--wp--custom--color--phase--discover-on-dark, var(--wp--custom--color--phase--discover));--ls-phase-accent: var(--wp--custom--color--phase--discover)}body.page-slug-create{--ls-phase-accent-on-dark: var(--wp--custom--color--phase--create-on-dark, var(--wp--custom--color--phase--create));--ls-phase-accent: var(--wp--custom--color--phase--create)}body.page-slug-build{--ls-phase-accent-on-dark: var(--wp--custom--color--phase--build-on-dark, var(--wp--custom--color--phase--build));--ls-phase-accent: var(--wp--custom--color--phase--build)}body.page-slug-launch{--ls-phase-accent-on-dark: var(--wp--custom--color--phase--launch-on-dark, var(--wp--custom--color--phase--launch));--ls-phase-accent: var(--wp--custom--color--phase--launch)}body.page-slug-grow{--ls-phase-accent-on-dark: var(--wp--custom--color--phase--grow-on-dark, var(--wp--custom--color--phase--grow));--ls-phase-accent: var(--wp--custom--color--phase--grow)}body.page-slug-evolve{--ls-phase-accent-on-dark: var(--wp--custom--color--phase--evolve-on-dark, var(--wp--custom--color--phase--evolve));--ls-phase-accent: var(--wp--custom--color--phase--evolve)}body.page-slug-discover .ls-phase-journey-nav__step--discover .ls-phase-journey-nav__link a{color:var(--ls-phase-item-accent)}body.page-slug-discover .ls-phase-journey-nav__step--discover .ls-phase-journey-nav__link a:hover,body.page-slug-discover .ls-phase-journey-nav__step--discover .ls-phase-journey-nav__link a:focus-visible{color:var(--wp--custom--color--text--on-dark)}body.page-slug-discover .ls-phase-journey-nav__step--discover .ls-phase-journey-nav__dot{display:inline-flex}body.page-slug-create .ls-phase-journey-nav__step--create .ls-phase-journey-nav__link a{color:var(--ls-phase-item-accent)}body.page-slug-create .ls-phase-journey-nav__step--create .ls-phase-journey-nav__link a:hover,body.page-slug-create .ls-phase-journey-nav__step--create .ls-phase-journey-nav__link a:focus-visible{color:var(--wp--custom--color--text--on-dark)}body.page-slug-create .ls-phase-journey-nav__step--create .ls-phase-journey-nav__dot{display:inline-flex}body.page-slug-build .ls-phase-journey-nav__step--build .ls-phase-journey-nav__link a{color:var(--ls-phase-item-accent)}body.page-slug-build .ls-phase-journey-nav__step--build .ls-phase-journey-nav__link a:hover,body.page-slug-build .ls-phase-journey-nav__step--build .ls-phase-journey-nav__link a:focus-visible{color:var(--wp--custom--color--text--on-dark)}body.page-slug-build .ls-phase-journey-nav__step--build .ls-phase-journey-nav__dot{display:inline-flex}body.page-slug-launch .ls-phase-journey-nav__step--launch .ls-phase-journey-nav__link a{color:var(--ls-phase-item-accent)}body.page-slug-launch .ls-phase-journey-nav__step--launch .ls-phase-journey-nav__link a:hover,body.page-slug-launch .ls-phase-journey-nav__step--launch .ls-phase-journey-nav__link a:focus-visible{color:var(--wp--custom--color--text--on-dark)}body.page-slug-launch .ls-phase-journey-nav__step--launch .ls-phase-journey-nav__dot{display:inline-flex}body.page-slug-grow .ls-phase-journey-nav__step--grow .ls-phase-journey-nav__link a{color:var(--ls-phase-item-accent)}body.page-slug-grow .ls-phase-journey-nav__step--grow .ls-phase-journey-nav__link a:hover,body.page-slug-grow .ls-phase-journey-nav__step--grow .ls-phase-journey-nav__link a:focus-visible{color:var(--wp--custom--color--text--on-dark)}body.page-slug-grow .ls-phase-journey-nav__step--grow .ls-phase-journey-nav__dot{display:inline-flex}body.page-slug-evolve .ls-phase-journey-nav__step--evolve .ls-phase-journey-nav__link a{color:var(--ls-phase-item-accent)}body.page-slug-evolve .ls-phase-journey-nav__step--evolve .ls-phase-journey-nav__link a:hover,body.page-slug-evolve .ls-phase-journey-nav__step--evolve .ls-phase-journey-nav__link a:focus-visible{color:var(--wp--custom--color--text--on-dark)}body.page-slug-evolve .ls-phase-journey-nav__step--evolve .ls-phase-journey-nav__dot{display:inline-flex}.ls-phase-journey-nav__link a:focus-visible{outline:2px solid var(--wp--custom--color--text--on-dark);outline-offset:3px;border-radius:var(--wp--preset--border-radius--100)}@media(prefers-reduced-motion: reduce){.ls-phase-journey-nav__link a{transition:none}}@media(max-width: 781px){.ls-phase-journey-nav__items{overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}.ls-phase-journey-nav__items::-webkit-scrollbar{display:none}.ls-phase-journey-nav__step{flex-shrink:0}}
diff --git a/patterns/sections/phase-common-services.php b/patterns/sections/phase-common-services.php
index a2acad2..30601d5 100644
--- a/patterns/sections/phase-common-services.php
+++ b/patterns/sections/phase-common-services.php
@@ -33,7 +33,7 @@
 	__( 'Early AI-readiness assessment', 'ls-theme' ),
 );
 
-$ls_phase_accent = 'var(--wp--custom--color--phase--discover)';
+$ls_phase_accent = 'var(--ls-phase-accent)';
 ?>
 <!-- wp:group {"align":"full","tagName":"section","className":"is-style-content-band","style":{"color":{"background":"var:custom|color|surface|card"},"spacing":{"padding":{"top":"var:preset|spacing|90","right":"var:preset|spacing|60","bottom":"var:preset|spacing|90","left":"var:preset|spacing|60"}}},"layout":{"type":"constrained"}} -->
 <section class="wp-block-group alignfull is-style-content-band has-background" style="background-color:var(--wp--custom--color--surface--card);padding-top:var(--wp--preset--spacing--90);padding-right:var(--wp--preset--spacing--60);padding-bottom:var(--wp--preset--spacing--90);padding-left:var(--wp--preset--spacing--60)">
diff --git a/patterns/sections/phase-cta.php b/patterns/sections/phase-cta.php
index 7da6954..a058bac 100644
--- a/patterns/sections/phase-cta.php
+++ b/patterns/sections/phase-cta.php
@@ -76,8 +76,8 @@
 					<?php foreach ( $ls_cta_checklist as $ls_checklist_item ) : ?>
 					<!-- wp:group {"style":{"spacing":{"blockGap":"var:preset|spacing|20"}},"layout":{"type":"flex","flexWrap":"nowrap","verticalAlignment":"center"}} -->
 					<div class="wp-block-group">
-						<!-- wp:group {"style":{"color":{"background":"var(--wp--custom--color--phase--discover-on-dark)"},"border":{"radius":"var:preset|border-radius|500"},"spacing":{"padding":{"top":"var:preset|spacing|10","right":"var:preset|spacing|10","bottom":"var:preset|spacing|10","left":"var:preset|spacing|10"}}},"layout":{"type":"flex","justifyContent":"center","verticalAlignment":"center"}} -->
-						<div class="wp-block-group has-background" style="border-radius:var(--wp--preset--border-radius--500);background-color:var(--wp--custom--color--phase--discover-on-dark);padding-top:var(--wp--preset--spacing--10);padding-right:var(--wp--preset--spacing--10);padding-bottom:var(--wp--preset--spacing--10);padding-left:var(--wp--preset--spacing--10)">
+						<!-- wp:group {"style":{"color":{"background":"var(--ls-phase-accent-on-dark)"},"border":{"radius":"var:preset|border-radius|500"},"spacing":{"padding":{"top":"var:preset|spacing|10","right":"var:preset|spacing|10","bottom":"var:preset|spacing|10","left":"var:preset|spacing|10"}}},"layout":{"type":"flex","justifyContent":"center","verticalAlignment":"center"}} -->
+						<div class="wp-block-group has-background" style="border-radius:var(--wp--preset--border-radius--500);background-color:var(--ls-phase-accent-on-dark);padding-top:var(--wp--preset--spacing--10);padding-right:var(--wp--preset--spacing--10);padding-bottom:var(--wp--preset--spacing--10);padding-left:var(--wp--preset--spacing--10)">
 							<!-- wp:icon {"icon":"lightspeed/check","className":"has-text-color","style":{"color":{"text":"var(--wp--custom--color--text--on-light)"},"dimensions":{"width":"11px"}}} /-->
 						</div>
 						<!-- /wp:group -->
diff --git a/patterns/sections/phase-deliverables-and-role.php b/patterns/sections/phase-deliverables-and-role.php
index 1d03d82..b0c9f8b 100644
--- a/patterns/sections/phase-deliverables-and-role.php
+++ b/patterns/sections/phase-deliverables-and-role.php
@@ -23,7 +23,7 @@
  * @package ls-theme
  */
 
-$ls_phase_accent = 'var(--wp--custom--color--phase--discover)';
+$ls_phase_accent = 'var(--ls-phase-accent)';
 
 $ls_deliverables = array(
 	__( 'A project summary with priorities, risks, and opportunities', 'ls-theme' ),
diff --git a/patterns/sections/phase-delivery-numbers.php b/patterns/sections/phase-delivery-numbers.php
index 6efaa8f..bde07d1 100644
--- a/patterns/sections/phase-delivery-numbers.php
+++ b/patterns/sections/phase-delivery-numbers.php
@@ -67,8 +67,8 @@
 			<!-- wp:group {"tagName":"article","className":"is-style-stat-segment","style":{"spacing":{"blockGap":"var:preset|spacing|5","padding":{"top":"var:preset|spacing|20","right":"var:preset|spacing|20","bottom":"var:preset|spacing|20","left":"var:preset|spacing|20"}}},"layout":{"type":"flex","orientation":"vertical","flexWrap":"nowrap","justifyContent":"center"}} -->
 			<article class="wp-block-group is-style-stat-segment" style="padding-top:var(--wp--preset--spacing--20);padding-right:var(--wp--preset--spacing--20);padding-bottom:var(--wp--preset--spacing--20);padding-left:var(--wp--preset--spacing--20)">
 			<?php endif; ?>
-				<!-- wp:paragraph {"align":"center","style":{"color":{"text":"var(--wp--custom--color--phase--discover)"},"typography":{"fontFamily":"var:preset|font-family|heading","fontWeight":"var:custom|typography|font-weight|extrabold"}},"fontSize":"600"} -->
-				<p class="has-text-align-center has-text-color has-600-font-size" style="color:var(--wp--custom--color--phase--discover);font-family:var(--wp--preset--font-family--heading);font-weight:var(--wp--custom--typography--font-weight--extrabold)"><?php echo esc_html( $ls_stat['value'] . $ls_stat['suffix'] ); ?></p>
+				<!-- wp:paragraph {"align":"center","style":{"color":{"text":"var(--ls-phase-accent)"},"typography":{"fontFamily":"var:preset|font-family|heading","fontWeight":"var:custom|typography|font-weight|extrabold"}},"fontSize":"600"} -->
+				<p class="has-text-align-center has-text-color has-600-font-size" style="color:var(--ls-phase-accent);font-family:var(--wp--preset--font-family--heading);font-weight:var(--wp--custom--typography--font-weight--extrabold)"><?php echo esc_html( $ls_stat['value'] . $ls_stat['suffix'] ); ?></p>
 				<!-- /wp:paragraph -->
 
 				<!-- wp:paragraph {"align":"center","style":{"typography":{"textTransform":"uppercase","letterSpacing":"var:custom|typography|letter-spacing|wide","fontWeight":"var:custom|typography|font-weight|semibold","lineHeight":"var:custom|line-height|heading-snug"}},"fontSize":"200"} -->
diff --git a/patterns/sections/phase-introduction.php b/patterns/sections/phase-introduction.php
index 5c0197a..7af6d45 100644
--- a/patterns/sections/phase-introduction.php
+++ b/patterns/sections/phase-introduction.php
@@ -27,8 +27,8 @@
 
 		<!-- wp:column {"verticalAlignment":"top"} -->
 		<div class="wp-block-column is-vertically-aligned-top">
-			<!-- wp:paragraph {"style":{"typography":{"textTransform":"uppercase","letterSpacing":"var:custom|typography|letter-spacing|widest","fontWeight":"var:custom|typography|font-weight|bold"},"color":{"text":"var(--wp--custom--color--phase--discover)"}},"fontSize":"100"} -->
-			<p class="has-text-color has-100-font-size" style="color:var(--wp--custom--color--phase--discover);font-weight:var(--wp--custom--typography--font-weight--bold);letter-spacing:var(--wp--custom--typography--letter-spacing--widest);text-transform:uppercase"><?php echo esc_html__( 'Introduction', 'ls-theme' ); ?></p>
+			<!-- wp:paragraph {"style":{"typography":{"textTransform":"uppercase","letterSpacing":"var:custom|typography|letter-spacing|widest","fontWeight":"var:custom|typography|font-weight|bold"},"color":{"text":"var(--ls-phase-accent)"}},"fontSize":"100"} -->
+			<p class="has-text-color has-100-font-size" style="color:var(--ls-phase-accent);font-weight:var(--wp--custom--typography--font-weight--bold);letter-spacing:var(--wp--custom--typography--letter-spacing--widest);text-transform:uppercase"><?php echo esc_html__( 'Introduction', 'ls-theme' ); ?></p>
 			<!-- /wp:paragraph -->
 
 			<!-- wp:heading {"level":2,"style":{"typography":{"fontWeight":"var:custom|typography|font-weight|bold"},"spacing":{"margin":{"top":"var:preset|spacing|10"}}},"fontSize":"500"} -->
diff --git a/patterns/sections/phase-support-focus.php b/patterns/sections/phase-support-focus.php
index cfd0bab..9e79a50 100644
--- a/patterns/sections/phase-support-focus.php
+++ b/patterns/sections/phase-support-focus.php
@@ -26,7 +26,7 @@
 	__( 'Documenting risks, constraints and recommended next steps', 'ls-theme' ),
 );
 
-$ls_phase_accent = 'var(--wp--custom--color--phase--discover)';
+$ls_phase_accent = 'var(--ls-phase-accent)';
 ?>
 <!-- wp:group {"align":"full","tagName":"section","className":"is-style-content-band","style":{"color":{"background":"var:custom|color|surface|card"},"spacing":{"padding":{"top":"var:preset|spacing|100","right":"var:preset|spacing|60","bottom":"var:preset|spacing|90","left":"var:preset|spacing|60"}}},"layout":{"type":"constrained"}} -->
 <section class="wp-block-group alignfull is-style-content-band has-background" style="background-color:var(--wp--custom--color--surface--card);padding-top:var(--wp--preset--spacing--100);padding-right:var(--wp--preset--spacing--60);padding-bottom:var(--wp--preset--spacing--90);padding-left:var(--wp--preset--spacing--60)">
diff --git a/patterns/sections/phase-where-to-go-next.php b/patterns/sections/phase-where-to-go-next.php
index 2c4d634..6d55e87 100644
--- a/patterns/sections/phase-where-to-go-next.php
+++ b/patterns/sections/phase-where-to-go-next.php
@@ -33,7 +33,7 @@
 	),
 );
 
-$ls_phase_accent = 'var(--wp--custom--color--phase--discover)';
+$ls_phase_accent = 'var(--ls-phase-accent)';
 ?>
 <!-- wp:group {"align":"full","tagName":"section","className":"is-style-content-band ls-phase-where-to-go-next","style":{"spacing":{"padding":{"top":"var:preset|spacing|90","right":"var:preset|spacing|60","bottom":"var:preset|spacing|100","left":"var:preset|spacing|60"}}},"layout":{"type":"constrained"}} -->
 <section class="wp-block-group alignfull is-style-content-band ls-phase-where-to-go-next" style="padding-top:var(--wp--preset--spacing--90);padding-right:var(--wp--preset--spacing--60);padding-bottom:var(--wp--preset--spacing--100);padding-left:var(--wp--preset--spacing--60)">
diff --git a/src/scss/structural/phase-journey-nav.scss b/src/scss/structural/phase-journey-nav.scss
index 7160c90..fa8214d 100644
--- a/src/scss/structural/phase-journey-nav.scss
+++ b/src/scss/structural/phase-journey-nav.scss
@@ -90,9 +90,12 @@
 // colour the way they did before only Discover existed. Same fallback as this file's own
 // --ls-phase-item-accent above: falls back from a phase's "-on-dark" token (only
 // phase.discover-on-dark exists yet) to the phase's normal token.
+// `--ls-phase-accent` is its light-surface counterpart: the phase's normal (non-on-dark) token, for
+// phase-coloured elements on light backgrounds (eyebrows, numbers, icons, borders).
 @each $ls-phase in discover, create, build, launch, grow, evolve {
   body.page-slug-#{$ls-phase} {
     --ls-phase-accent-on-dark: var(--wp--custom--color--phase--#{$ls-phase}-on-dark, var(--wp--custom--color--phase--#{$ls-phase}));
+    --ls-phase-accent: var(--wp--custom--color--phase--#{$ls-phase});
   }
 }
 

From f832b800a5e4338b66f9d592190ef6c71ab0d267 Mon Sep 17 00:00:00 2001
From: Brandonma21 <Brandonmarshall101@gmail.com>
Date: Tue, 29 Sep 2026 14:47:07 +0200
Subject: [PATCH 2/3] Add CHANGELOG entry for PR #73

Changelog
- Add entry for making phase section patterns follow the current phase colour
- Link to PR #73

Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
---
 CHANGELOG.md | 10 ++++++++++
 1 file changed, 10 insertions(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index eb25727..ee02330 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -7,6 +7,16 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ---
 
+## [Unreleased] — Make phase section patterns follow the current phase colour (LS-4179)
+
+### Fixed
+
+- Accent colour (eyebrows, numbers, icons, bullets, borders) in the phase section patterns no longer stays hardcoded to Discover's green on the other five phase pages. Added a light-surface `--ls-phase-accent` custom property (`src/scss/structural/phase-journey-nav.scss`), set per phase via the existing `page-slug-{phase}` body class alongside `--ls-phase-accent-on-dark`. `phase-introduction.php` and `phase-delivery-numbers.php` now use it directly, and `phase-common-services.php`, `phase-support-focus.php`, `phase-deliverables-and-role.php` and `phase-where-to-go-next.php` point their `$ls_phase_accent` variable at it. `phase-cta.php` (permanently dark) now uses `--ls-phase-accent-on-dark` for its checklist bullet.
+
+([#73](https://github.com/lightspeedwp/ls-theme/pull/73))
+
+---
+
 ## [Unreleased] — Add flatten-proof phase colour and a phase-services dynamic block (LS-4179)
 
 ### Fixed

From e64e88beb5f6168aed56cc3f177928e413e7fc68 Mon Sep 17 00:00:00 2001
From: Brandonma21 <Brandonmarshall101@gmail.com>
Date: Tue, 29 Sep 2026 15:23:01 +0200
Subject: [PATCH 3/3] Set phase accent variables in the editor canvas

Editor accent
- Add a block_editor_settings_all filter that sets --ls-phase-accent and --ls-phase-accent-on-dark for the phase page being edited
- Editor canvas never gets the page-slug-{phase} body class, so per-phase rules never matched there
- Appended after the theme's editor styles so it overrides the body default

Default fallback
- Default both variables to Discover's tokens on the base body in phase-journey-nav.scss
- Covers pages with no phase body class or no matching phase
- Per-phase page-slug rules keep overriding it on the six phase pages

Build output
- Rebuild assets/css/phase-journey-nav.css from phase-journey-nav.scss

Review
- Addresses CodeRabbit comment on PR #73
- Front-end output is unchanged
---
 assets/css/phase-journey-nav.css           |  2 +-
 inc/phase-page-body-class.php              | 37 ++++++++++++++++++++++
 src/scss/structural/phase-journey-nav.scss |  9 ++++++
 3 files changed, 47 insertions(+), 1 deletion(-)

diff --git a/assets/css/phase-journey-nav.css b/assets/css/phase-journey-nav.css
index 9455e23..91d642a 100644
--- a/assets/css/phase-journey-nav.css
+++ b/assets/css/phase-journey-nav.css
@@ -1 +1 @@
-.ls-phase-journey-nav__step--discover{--ls-phase-item-accent: var(--wp--custom--color--phase--discover-on-dark, var(--wp--custom--color--phase--discover))}.ls-phase-journey-nav__step--create{--ls-phase-item-accent: var(--wp--custom--color--phase--create-on-dark, var(--wp--custom--color--phase--create))}.ls-phase-journey-nav__step--build{--ls-phase-item-accent: var(--wp--custom--color--phase--build-on-dark, var(--wp--custom--color--phase--build))}.ls-phase-journey-nav__step--launch{--ls-phase-item-accent: var(--wp--custom--color--phase--launch-on-dark, var(--wp--custom--color--phase--launch))}.ls-phase-journey-nav__step--grow{--ls-phase-item-accent: var(--wp--custom--color--phase--grow-on-dark, var(--wp--custom--color--phase--grow))}.ls-phase-journey-nav__step--evolve{--ls-phase-item-accent: var(--wp--custom--color--phase--evolve-on-dark, var(--wp--custom--color--phase--evolve))}.ls-phase-journey-nav__link a{transition:color var(--wp--custom--animation--duration--base) var(--wp--custom--animation--easing--standard)}.ls-phase-journey-nav__link a{color:color-mix(in srgb, var(--wp--custom--color--text--on-dark-muted) 70%, transparent)}.ls-phase-journey-nav__link a:hover,.ls-phase-journey-nav__link a:focus-visible{color:var(--wp--custom--color--text--on-dark)}.ls-phase-journey-nav__dot{display:none}body.page-slug-discover{--ls-phase-accent-on-dark: var(--wp--custom--color--phase--discover-on-dark, var(--wp--custom--color--phase--discover));--ls-phase-accent: var(--wp--custom--color--phase--discover)}body.page-slug-create{--ls-phase-accent-on-dark: var(--wp--custom--color--phase--create-on-dark, var(--wp--custom--color--phase--create));--ls-phase-accent: var(--wp--custom--color--phase--create)}body.page-slug-build{--ls-phase-accent-on-dark: var(--wp--custom--color--phase--build-on-dark, var(--wp--custom--color--phase--build));--ls-phase-accent: var(--wp--custom--color--phase--build)}body.page-slug-launch{--ls-phase-accent-on-dark: var(--wp--custom--color--phase--launch-on-dark, var(--wp--custom--color--phase--launch));--ls-phase-accent: var(--wp--custom--color--phase--launch)}body.page-slug-grow{--ls-phase-accent-on-dark: var(--wp--custom--color--phase--grow-on-dark, var(--wp--custom--color--phase--grow));--ls-phase-accent: var(--wp--custom--color--phase--grow)}body.page-slug-evolve{--ls-phase-accent-on-dark: var(--wp--custom--color--phase--evolve-on-dark, var(--wp--custom--color--phase--evolve));--ls-phase-accent: var(--wp--custom--color--phase--evolve)}body.page-slug-discover .ls-phase-journey-nav__step--discover .ls-phase-journey-nav__link a{color:var(--ls-phase-item-accent)}body.page-slug-discover .ls-phase-journey-nav__step--discover .ls-phase-journey-nav__link a:hover,body.page-slug-discover .ls-phase-journey-nav__step--discover .ls-phase-journey-nav__link a:focus-visible{color:var(--wp--custom--color--text--on-dark)}body.page-slug-discover .ls-phase-journey-nav__step--discover .ls-phase-journey-nav__dot{display:inline-flex}body.page-slug-create .ls-phase-journey-nav__step--create .ls-phase-journey-nav__link a{color:var(--ls-phase-item-accent)}body.page-slug-create .ls-phase-journey-nav__step--create .ls-phase-journey-nav__link a:hover,body.page-slug-create .ls-phase-journey-nav__step--create .ls-phase-journey-nav__link a:focus-visible{color:var(--wp--custom--color--text--on-dark)}body.page-slug-create .ls-phase-journey-nav__step--create .ls-phase-journey-nav__dot{display:inline-flex}body.page-slug-build .ls-phase-journey-nav__step--build .ls-phase-journey-nav__link a{color:var(--ls-phase-item-accent)}body.page-slug-build .ls-phase-journey-nav__step--build .ls-phase-journey-nav__link a:hover,body.page-slug-build .ls-phase-journey-nav__step--build .ls-phase-journey-nav__link a:focus-visible{color:var(--wp--custom--color--text--on-dark)}body.page-slug-build .ls-phase-journey-nav__step--build .ls-phase-journey-nav__dot{display:inline-flex}body.page-slug-launch .ls-phase-journey-nav__step--launch .ls-phase-journey-nav__link a{color:var(--ls-phase-item-accent)}body.page-slug-launch .ls-phase-journey-nav__step--launch .ls-phase-journey-nav__link a:hover,body.page-slug-launch .ls-phase-journey-nav__step--launch .ls-phase-journey-nav__link a:focus-visible{color:var(--wp--custom--color--text--on-dark)}body.page-slug-launch .ls-phase-journey-nav__step--launch .ls-phase-journey-nav__dot{display:inline-flex}body.page-slug-grow .ls-phase-journey-nav__step--grow .ls-phase-journey-nav__link a{color:var(--ls-phase-item-accent)}body.page-slug-grow .ls-phase-journey-nav__step--grow .ls-phase-journey-nav__link a:hover,body.page-slug-grow .ls-phase-journey-nav__step--grow .ls-phase-journey-nav__link a:focus-visible{color:var(--wp--custom--color--text--on-dark)}body.page-slug-grow .ls-phase-journey-nav__step--grow .ls-phase-journey-nav__dot{display:inline-flex}body.page-slug-evolve .ls-phase-journey-nav__step--evolve .ls-phase-journey-nav__link a{color:var(--ls-phase-item-accent)}body.page-slug-evolve .ls-phase-journey-nav__step--evolve .ls-phase-journey-nav__link a:hover,body.page-slug-evolve .ls-phase-journey-nav__step--evolve .ls-phase-journey-nav__link a:focus-visible{color:var(--wp--custom--color--text--on-dark)}body.page-slug-evolve .ls-phase-journey-nav__step--evolve .ls-phase-journey-nav__dot{display:inline-flex}.ls-phase-journey-nav__link a:focus-visible{outline:2px solid var(--wp--custom--color--text--on-dark);outline-offset:3px;border-radius:var(--wp--preset--border-radius--100)}@media(prefers-reduced-motion: reduce){.ls-phase-journey-nav__link a{transition:none}}@media(max-width: 781px){.ls-phase-journey-nav__items{overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}.ls-phase-journey-nav__items::-webkit-scrollbar{display:none}.ls-phase-journey-nav__step{flex-shrink:0}}
+.ls-phase-journey-nav__step--discover{--ls-phase-item-accent: var(--wp--custom--color--phase--discover-on-dark, var(--wp--custom--color--phase--discover))}.ls-phase-journey-nav__step--create{--ls-phase-item-accent: var(--wp--custom--color--phase--create-on-dark, var(--wp--custom--color--phase--create))}.ls-phase-journey-nav__step--build{--ls-phase-item-accent: var(--wp--custom--color--phase--build-on-dark, var(--wp--custom--color--phase--build))}.ls-phase-journey-nav__step--launch{--ls-phase-item-accent: var(--wp--custom--color--phase--launch-on-dark, var(--wp--custom--color--phase--launch))}.ls-phase-journey-nav__step--grow{--ls-phase-item-accent: var(--wp--custom--color--phase--grow-on-dark, var(--wp--custom--color--phase--grow))}.ls-phase-journey-nav__step--evolve{--ls-phase-item-accent: var(--wp--custom--color--phase--evolve-on-dark, var(--wp--custom--color--phase--evolve))}.ls-phase-journey-nav__link a{transition:color var(--wp--custom--animation--duration--base) var(--wp--custom--animation--easing--standard)}.ls-phase-journey-nav__link a{color:color-mix(in srgb, var(--wp--custom--color--text--on-dark-muted) 70%, transparent)}.ls-phase-journey-nav__link a:hover,.ls-phase-journey-nav__link a:focus-visible{color:var(--wp--custom--color--text--on-dark)}.ls-phase-journey-nav__dot{display:none}body{--ls-phase-accent-on-dark: var(--wp--custom--color--phase--discover-on-dark, var(--wp--custom--color--phase--discover));--ls-phase-accent: var(--wp--custom--color--phase--discover)}body.page-slug-discover{--ls-phase-accent-on-dark: var(--wp--custom--color--phase--discover-on-dark, var(--wp--custom--color--phase--discover));--ls-phase-accent: var(--wp--custom--color--phase--discover)}body.page-slug-create{--ls-phase-accent-on-dark: var(--wp--custom--color--phase--create-on-dark, var(--wp--custom--color--phase--create));--ls-phase-accent: var(--wp--custom--color--phase--create)}body.page-slug-build{--ls-phase-accent-on-dark: var(--wp--custom--color--phase--build-on-dark, var(--wp--custom--color--phase--build));--ls-phase-accent: var(--wp--custom--color--phase--build)}body.page-slug-launch{--ls-phase-accent-on-dark: var(--wp--custom--color--phase--launch-on-dark, var(--wp--custom--color--phase--launch));--ls-phase-accent: var(--wp--custom--color--phase--launch)}body.page-slug-grow{--ls-phase-accent-on-dark: var(--wp--custom--color--phase--grow-on-dark, var(--wp--custom--color--phase--grow));--ls-phase-accent: var(--wp--custom--color--phase--grow)}body.page-slug-evolve{--ls-phase-accent-on-dark: var(--wp--custom--color--phase--evolve-on-dark, var(--wp--custom--color--phase--evolve));--ls-phase-accent: var(--wp--custom--color--phase--evolve)}body.page-slug-discover .ls-phase-journey-nav__step--discover .ls-phase-journey-nav__link a{color:var(--ls-phase-item-accent)}body.page-slug-discover .ls-phase-journey-nav__step--discover .ls-phase-journey-nav__link a:hover,body.page-slug-discover .ls-phase-journey-nav__step--discover .ls-phase-journey-nav__link a:focus-visible{color:var(--wp--custom--color--text--on-dark)}body.page-slug-discover .ls-phase-journey-nav__step--discover .ls-phase-journey-nav__dot{display:inline-flex}body.page-slug-create .ls-phase-journey-nav__step--create .ls-phase-journey-nav__link a{color:var(--ls-phase-item-accent)}body.page-slug-create .ls-phase-journey-nav__step--create .ls-phase-journey-nav__link a:hover,body.page-slug-create .ls-phase-journey-nav__step--create .ls-phase-journey-nav__link a:focus-visible{color:var(--wp--custom--color--text--on-dark)}body.page-slug-create .ls-phase-journey-nav__step--create .ls-phase-journey-nav__dot{display:inline-flex}body.page-slug-build .ls-phase-journey-nav__step--build .ls-phase-journey-nav__link a{color:var(--ls-phase-item-accent)}body.page-slug-build .ls-phase-journey-nav__step--build .ls-phase-journey-nav__link a:hover,body.page-slug-build .ls-phase-journey-nav__step--build .ls-phase-journey-nav__link a:focus-visible{color:var(--wp--custom--color--text--on-dark)}body.page-slug-build .ls-phase-journey-nav__step--build .ls-phase-journey-nav__dot{display:inline-flex}body.page-slug-launch .ls-phase-journey-nav__step--launch .ls-phase-journey-nav__link a{color:var(--ls-phase-item-accent)}body.page-slug-launch .ls-phase-journey-nav__step--launch .ls-phase-journey-nav__link a:hover,body.page-slug-launch .ls-phase-journey-nav__step--launch .ls-phase-journey-nav__link a:focus-visible{color:var(--wp--custom--color--text--on-dark)}body.page-slug-launch .ls-phase-journey-nav__step--launch .ls-phase-journey-nav__dot{display:inline-flex}body.page-slug-grow .ls-phase-journey-nav__step--grow .ls-phase-journey-nav__link a{color:var(--ls-phase-item-accent)}body.page-slug-grow .ls-phase-journey-nav__step--grow .ls-phase-journey-nav__link a:hover,body.page-slug-grow .ls-phase-journey-nav__step--grow .ls-phase-journey-nav__link a:focus-visible{color:var(--wp--custom--color--text--on-dark)}body.page-slug-grow .ls-phase-journey-nav__step--grow .ls-phase-journey-nav__dot{display:inline-flex}body.page-slug-evolve .ls-phase-journey-nav__step--evolve .ls-phase-journey-nav__link a{color:var(--ls-phase-item-accent)}body.page-slug-evolve .ls-phase-journey-nav__step--evolve .ls-phase-journey-nav__link a:hover,body.page-slug-evolve .ls-phase-journey-nav__step--evolve .ls-phase-journey-nav__link a:focus-visible{color:var(--wp--custom--color--text--on-dark)}body.page-slug-evolve .ls-phase-journey-nav__step--evolve .ls-phase-journey-nav__dot{display:inline-flex}.ls-phase-journey-nav__link a:focus-visible{outline:2px solid var(--wp--custom--color--text--on-dark);outline-offset:3px;border-radius:var(--wp--preset--border-radius--100)}@media(prefers-reduced-motion: reduce){.ls-phase-journey-nav__link a{transition:none}}@media(max-width: 781px){.ls-phase-journey-nav__items{overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}.ls-phase-journey-nav__items::-webkit-scrollbar{display:none}.ls-phase-journey-nav__step{flex-shrink:0}}
diff --git a/inc/phase-page-body-class.php b/inc/phase-page-body-class.php
index 89baae2..27cbcf4 100644
--- a/inc/phase-page-body-class.php
+++ b/inc/phase-page-body-class.php
@@ -35,3 +35,40 @@ function ls_theme_add_phase_page_body_class( $classes ) {
 	return $classes;
 }
 add_filter( 'body_class', 'ls_theme_add_phase_page_body_class' );
+
+/**
+ * Sets the per-phase accent custom properties inside the block editor canvas.
+ *
+ * The editor canvas never receives the `page-slug-{phase}` body class added above, so the per-phase
+ * rules in phase-journey-nav.scss never match there and every phase-coloured element would fall back
+ * to the Discover defaults on `body`. This appends the same two properties for the phase page
+ * being edited to the editor's styles (after the theme's editor stylesheets, so it wins), so the
+ * editor preview matches the front end. Front-end output is unaffected.
+ *
+ * @param array                   $settings       Block editor settings.
+ * @param WP_Block_Editor_Context $editor_context Current block editor context.
+ * @return array
+ */
+function ls_theme_add_phase_editor_accent( $settings, $editor_context ) {
+	$ls_phase_slugs = array( 'discover', 'create', 'build', 'launch', 'grow', 'evolve' );
+
+	if ( empty( $editor_context->post ) || ! $editor_context->post instanceof WP_Post ) {
+		return $settings;
+	}
+
+	if ( 'page' !== $editor_context->post->post_type || ! in_array( $editor_context->post->post_name, $ls_phase_slugs, true ) ) {
+		return $settings;
+	}
+
+	$ls_phase = $editor_context->post->post_name;
+
+	$settings['styles'][] = array(
+		'css' => sprintf(
+			'body{--ls-phase-accent-on-dark:var(--wp--custom--color--phase--%1$s-on-dark,var(--wp--custom--color--phase--%1$s));--ls-phase-accent:var(--wp--custom--color--phase--%1$s);}',
+			$ls_phase
+		),
+	);
+
+	return $settings;
+}
+add_filter( 'block_editor_settings_all', 'ls_theme_add_phase_editor_accent', 10, 2 );
diff --git a/src/scss/structural/phase-journey-nav.scss b/src/scss/structural/phase-journey-nav.scss
index fa8214d..d0da141 100644
--- a/src/scss/structural/phase-journey-nav.scss
+++ b/src/scss/structural/phase-journey-nav.scss
@@ -92,6 +92,15 @@
 // phase.discover-on-dark exists yet) to the phase's normal token.
 // `--ls-phase-accent` is its light-surface counterpart: the phase's normal (non-on-dark) token, for
 // phase-coloured elements on light backgrounds (eyebrows, numbers, icons, borders).
+// Both default to Discover's tokens on the base `body` so a pattern still resolves an accent where
+// no page-slug-{phase} class exists (notably the block editor canvas, which never gets one — WP
+// rewrites `body` to the editor wrapper for editor styles). The per-phase rules below have higher
+// specificity and override these on the six phase pages.
+body {
+  --ls-phase-accent-on-dark: var(--wp--custom--color--phase--discover-on-dark, var(--wp--custom--color--phase--discover));
+  --ls-phase-accent: var(--wp--custom--color--phase--discover);
+}
+
 @each $ls-phase in discover, create, build, launch, grow, evolve {
   body.page-slug-#{$ls-phase} {
     --ls-phase-accent-on-dark: var(--wp--custom--color--phase--#{$ls-phase}-on-dark, var(--wp--custom--color--phase--#{$ls-phase}));