Add interactive graph for GitLab product stages

Why is this change being made?

I've been reviewing the product categories page in the handbook as part of my onboarding task. I was having a hard time wrapping my head around the text-heavy layout on the page – I really wanted a graphic showing how the various sections, stages, and groups related to one another.

This MR adds an interactive graph for GitLab product stages to this page. It's generated directly from stages.yml via a mermaid. Some open questions:

• Is this a worthwhile addition? Are there other changes for this page incoming that would invalidate this graphic?
  • Lots of positive feedback on this so far!
• If it is worthwhile, where on the page should it live? The current location (directly below the GitLab DevSecOps diagram) probably isn't right.
  • The graphic is now split by section. It is placed directly beneath the main details for each section.
• Are there any security concerns about using an SVG with interactive elements in the handbook? The generated SVG fetches font-awesome from a Cloudflare CDN, and registers JavaScript handlers to manage click events.
  • This MR uses the built-in mermaid support from Hugo. We have explicitly enabled this functionality in our Hugo config.
• This graphic will become outdated at some point. I would love to publish the script I used to generate this image. Where should that live?
  • This MR now dynamically generates the graphic off of the latest stages.yml

Before	After

Author and Reviewer Checklist

Please verify the check list and ensure to tick them off before the MR is merged.

• Provided a concise title for this Merge Request (MR)
• Added a description to this MR explaining the reasons for the proposed change, per say why, not just what
  • Copy/paste the Slack conversation to document it for later, or upload screenshots. Verify that no confidential data is added, and the content is SAFE
• Assign reviewers for this MR to the correct Directly Responsible Individual/s (DRI)
  • If the DRI for the page/s being updated isn’t immediately clear, then assign it to one of the people listed in the Maintained by section on the page being edited
  • If your manager does not have merge rights, please ask someone to merge it AFTER it has been approved by your manager in #mr-buddies
  • The when to get approval handbook section explains the workflow in more detail
• For transparency, share this MR with the audience that will be impacted.
  • Team: For changes that affect your direct team, share in your group Slack channel
  • Department: If the update affects your department, share the MR in your department Slack channel
  • Company: If the update affects all (or the majority of) GitLab team members, post an update in #whats-happening-at-gitlab linking to this MR
    • For high-priority company-wide announcements work with the internal communications team to post the update in #company-fyi and align on a plan to circulate in additional channels like the "While You Were Iterating" Newsletter

---