[fix] <X> cannot appear as a descendant of <p> (#1005)

Closes #1003 

## Changes

- BetaAndLegalNotice: Refactor to avoid passing the entire content of
the notice via the `message` prop, which gets wrapped in a `<p>` in the
DSR.
- Loading: Replace `<div>` with a `<span>`

## How to test this PR

1. Start SBL Frontend: `yarn start`
2. Verify Beta/Legal notice looks the same
- `git checkout main` => `git checkout -b 1003-x-cannot-be-child-of-p`
3. Verify Loading looks the same
    - Visit http://localhost:8899/loading
- `git checkout main` => `git checkout -b 1003-x-cannot-be-child-of-p`

## Screenshots
| Before | After|
|---|---|

|Beta/Legal<br/><br/>![BetaLegal-before](https://github.com/user-attachments/assets/f7b45df0-36c8-46e5-ad03-6ddd4c1528dc)|Beta/Legal<br/><br/>![BetaLegal-after](https://github.com/user-attachments/assets/6a30873e-a990-4920-b781-94cc0098346a)|
|[Loading Video:
before](https://github.com/user-attachments/assets/ca1f3b44-e462-4e71-aa2b-99240c55c729)|[Loading
Video:
after](https://github.com/user-attachments/assets/ae7d2411-5714-4d0c-a814-221dd1983b93)|
|Console errors
![x-child-before](https://github.com/user-attachments/assets/f80ba69a-0818-49f9-84d3-c6cccb56b668)|Console
errors
![x-child-after](https://github.com/user-attachments/assets/b54ba1f0-0183-4032-addb-aa941e0d85eb)|

src/components/BetaAndLegalNotice.tsx

@@ -1,32 +1,29 @@
 import { Link } from 'components/Link';
-import { Alert, Heading, Paragraph } from 'design-system-react';
+import { Alert } from 'design-system-react';
 import type { ReactElement } from 'react';
 
 export default function BetaAndLegalNotice(): ReactElement {
   return (
     <Alert
       className='mb-[2.813rem]'
-      message={
-        <>
-          <Heading type='2' className='h4 mb-[0.313rem]'>
-            This is a beta for the Small Business Lending Data Filing Platform
-          </Heading>
-          <Paragraph>
-            Thank you for participating. The beta platform is available to
-            upload, test, and validate data. All uploaded data is for testing
-            purposes only and may be removed at any time. For questions or
-            feedback,{' '}
-            <Link href='mailto:SBLHelp@cfpb.gov?subject=[BETA] Home page: Questions or feedback'>
-              email our support staff
-            </Link>
-            .
-          </Paragraph>
-        </>
-      }
+      message='This is a beta for the Small Business Lending Data Filing Platform'
       status='warning'
       // TODO: allow setting to strip heading formatting in Alerts post-mvp
       // @ts-expect-error - See issue: https://github.com/cfpb/design-system-react/issues/351
-      headingLevel={null}
-    />
+      // headingLevel={null}
+    >
+      <span className='inline-block max-w-[41.875rem]'>
+        Thank you for participating. The beta platform is available to upload,
+        test, and validate data. All uploaded data is for testing purposes only
+        and may be removed at any time. For questions or feedback,{' '}
+        <Link
+          href='mailto:SBLHelp@cfpb.gov?subject=[BETA] Home page: Questions or feedback'
+          className='border-b-[1px]'
+        >
+          email our support staff
+        </Link>
+        .
+      </span>
+    </Alert>
   );
 }

src/components/Loading.tsx

@@ -18,7 +18,7 @@ export function LoadingContent({
   return (
     <Paragraph className='h3 mt-[25%] flex min-h-dvh justify-center text-[#43484e]'>
       <Icon isPresentational name='updating' />
-      <div className='ml-[15px]'>{message}</div>
+      <span className='ml-[15px]'>{message}</span>
     </Paragraph>
   );
 }