docs: reorder SLA alert

docs/_plugins/shortcodes/renderLightDom.cjs

@@ -20,11 +20,6 @@ async function renderLightDom(content, {
 
 This element has an optional "Lightdom CSS" <em>shim</em> to help reduce <a href="https://web.dev/cls/">Cumulative Layout Shift (CLS)</a> experience before the element has fully initialized.
 
-<rh-alert state="warning">
-  <h4 slot="header">Warning</h4>
-  <p>Lightdom CSS shims are an optional, temporary solution for reducing CLS. Delcarative Shadow DOM is the better solution, and once it is more widely available, Lightdom CSS shims will no longer be needed and will become deprecated.</p>
-</rh-alert>
-
 ~~~html
 <link rel="stylesheet" href="/path/to/${docsPage.tagName}/${docsPage.tagName}-lightdom-shim.css">
 ~~~
@@ -33,6 +28,11 @@ This element has an optional "Lightdom CSS" <em>shim</em> to help reduce <a href
   <h4 slot="header">Note</h4>
   <p>Replace <code>/path/to/</code> with path to the CSS file, whether local or CDN.</p>
 </rh-alert>
+
+<rh-alert state="warning">
+  <h4 slot="header">Warning</h4>
+  <p>Lightdom CSS shims are an optional, temporary solution for reducing CLS. Delcarative Shadow DOM is the better solution, and once it is more widely available, Lightdom CSS shims will no longer be needed and will become deprecated.</p>
+</rh-alert>
 `;
   } else {
     lightdomContent = markdown`