Update quickstart guide for new branding and flows

[rosieyohannan]

Description

• Use HTML rather than liquid template as it's easier to work with
• Update GitHub App tab for first section to represent the new onboarding flow
• Update GitHub OAuth and BB Cloud tab content
• Add third section covering iteration and troubleshooting
• I have NOT made changes to the GitLab and Bitbucket DC tab because its largely the same and I thought better to get these changes in sooner.

Reasons

We are trialling using this page as a guided tour of onboarding then troubleshooting iterations on CircleCI config

Content Checklist

Please follow our style when contributing to CircleCI docs. Our style guide is here: https://circleci.com/docs/style/style-guide-overview.

Please take a moment to check through the following items when submitting your PR (this is just a guide so will not be relevant for all PRs) 😸:

• Break up walls of text by adding paragraph breaks.
• Consider if the content could benefit from more structure, such as lists or tables, to make it easier to consume.
• Keep the title between 20 and 70 characters.
• Consider whether the content would benefit from more subsections (h2-h6 headings) to make it easier to consume.
• Check all headings h1-h6 are in sentence case (only first letter is capitalized).
• Is there a "Next steps" section at the end of the page giving the reader a clear path to what to read next?
• Include relevant backlinks to other CircleCI docs/pages.