[tiagov8]

Closes #5135

Follow-up to #5137, from @designbyalex's review. When a link in a red heading is hovered, its underline now darkens with the text. The red-link style is also limited to headings that are actually red.

What changed

• The underline matches the text on hover. Before, the text went dark red but the global a:hover rule kept the underline brand red. Both are now sswDarkRed (#8e2c2c), matching the Design System's hover pattern.

• Only red headings get the style. 🐛 Heading links - Keep red heading links red and darken on hover #5137 applied it to every .prose h2, so links in headings a page recolours turned dark red on hover too. Those pages now keep the standard link style:

  • Base pages, which use prose-h2:text-black.
  • The client story dialog, which uses prose-headings:text-foreground and prose-strong:text-foreground.

  This covers 🐛 Bug - Heading links use incorrect hover styling #5135's AC5: no other standard link styles are affected.

• Red h1 > strong headings are covered too. They're red in the typography config, the same as h2.

Risky areas

• styles.css is global. The rule excludes heading colour overrides by exact class name, so a page that recolours prose headings some other way would still get red links. The comment above the rule says to add new overrides to the :not() lists.
• Not every override is a colour. prose-h2:text-3xl/9 (a size, used by companyPageCard) is not excluded, so those red headings keep the red-link style.

---

🤖 Changes made by Claude Opus 5.5 via Claude Code

[Copilot]

🟢 Approval recommended

No active review issues were identified for the heading-link styling refinements.

No open issues 🎉

What changed in this PR

Refines red heading-link styling to address #5135: hover underlines now darken with the text, while headings with the specified colour overrides retain standard link styling.

Changes:

• Applies sswDarkRed to both link text and underlines on hover.
• Excludes the heading colour overrides used by base pages and the client story dialog.
• Extends the styling to links inside red h1 > strong headings.

File	Description
styles.css	Refines heading-link selectors, synchronizes hover colours, and documents override exclusions.

_{Review effort: Balanced}

[github-actions]

Coverage report

St.❔	Category	Percentage	Covered / Total
🔴	Statements	6.73%	3589/53363
🔴	Branches	40.96%	392/957
🔴	Functions	16.69%	100/599
🔴	Lines	6.73%	3589/53363

Test suite run success

134 tests passing in 17 suites.

Report generated by 🧪jest coverage report action from 3e5f669

[tiagov8]

/deploy

---

🤖 Comment written by Claude Opus 5.5 via Claude Code

[github-actions]

Deployed changes to https://app-sswwebsite-9eb3-pr-5146.azurewebsites.net

ℹ️ Staging slots are no longer created automatically - comment /deploy to deploy new commits.

[github-actions]

🚀 Lighthouse Report

🌐 URL	⚡ Performance	♿ Accessibility	✅ Best Practices	🔍 SEO	📦 Bundle Size	🗑️ Unused Bundle
⭐ https://app-sswwebsite-9eb3-pr-5146.azurewebsites.net/	41	100	78	69	0.00 MB	0.00 MB
https://app-sswwebsite-9eb3-pr-5146.azurewebsites.net/articles	89	97	78	61	0.00 MB	0.00 MB
https://app-sswwebsite-9eb3-pr-5146.azurewebsites.net/company/about-us	64	100	78	69	0.00 MB	0.00 MB
https://app-sswwebsite-9eb3-pr-5146.azurewebsites.net/company/clients	83	100	78	69	0.00 MB	0.00 MB
https://app-sswwebsite-9eb3-pr-5146.azurewebsites.net/company/contact-us	81	92	78	61	0.00 MB	0.00 MB
https://app-sswwebsite-9eb3-pr-5146.azurewebsites.net/consulting	88	97	78	69	0.00 MB	0.00 MB
⭐ https://app-sswwebsite-9eb3-pr-5146.azurewebsites.net/consulting/net-upgrade	84	100	74	61	0.00 MB	0.00 MB
⭐ https://app-sswwebsite-9eb3-pr-5146.azurewebsites.net/consulting/web-applications	79	100	78	61	0.00 MB	0.00 MB
https://app-sswwebsite-9eb3-pr-5146.azurewebsites.net/employment	78	95	78	69	0.00 MB	0.00 MB
https://app-sswwebsite-9eb3-pr-5146.azurewebsites.net/events/angular-superpowers-tour	70	97	74	69	0.00 MB	0.00 MB
https://app-sswwebsite-9eb3-pr-5146.azurewebsites.net/events/ai-workshop	85	92	74	61	0.00 MB	0.00 MB
https://app-sswwebsite-9eb3-pr-5146.azurewebsites.net/events/ai-workshop-essentials	70	97	78	69	0.00 MB	0.00 MB
https://app-sswwebsite-9eb3-pr-5146.azurewebsites.net/netug/sydney	79	93	74	61	0.00 MB	0.00 MB
https://app-sswwebsite-9eb3-pr-5146.azurewebsites.net/products/sophiebot	87	100	78	69	0.00 MB	0.00 MB
https://app-sswwebsite-9eb3-pr-5146.azurewebsites.net/training/internship-fullstack	78	91	78	61	0.00 MB	0.00 MB

[designbyalex]

Thanks @tiagov8. The underline now darkens with the text on hover. Text and underline are both #8e2c2c, which matches the Design System.

Figure: /company/news heading link on hover, production vs this PR

Base pages and the client story dialog now keep the standard link hover, so only red headings darken. I tested this with a link in a black h2 on /code-of-conduct, since no base page has one yet.

Figure: Test link in a black h2 on /code-of-conduct, production vs this PR