Add explanation paragraph to recovery method card (#1917)

This PR changes the recovery method card to be consistent with
the passkeys and temp keys cards:
* always show card border
* have a small explanatory text below the title

src/frontend/src/flows/manage/recoveryMethodsSection.json

@@ -2,6 +2,7 @@
   "en": {
     "security_warning": "Security Warning",
     "recovery_phrase_enabled": "You enabled a recovery phrase.",
-    "recovery_key_enabled": "You enabled a recovery device."
+    "recovery_key_enabled": "You enabled a recovery device.",
+    "enable_recovery_to_make_secure": "Enable recovery methods to make your Internet Identity more secure."
   }
 }

src/frontend/src/flows/manage/recoveryMethodsSection.ts

@@ -32,7 +32,9 @@ export const recoveryMethodsSection = ({
   const warnNoRecovery = isNullish(recoveryPhrase) && isNullish(recoveryKey);
   const wrapClasses = [
     "l-stack",
-    ...(warnNoRecovery ? ["c-card", "c-card--narrow", "c-card--warning"] : []),
+    "c-card",
+    "c-card--narrow",
+    ...(warnNoRecovery ? ["c-card--warning"] : []),
   ];
 
   return html`
@@ -54,6 +56,7 @@ export const recoveryMethodsSection = ({
       <div class="t-title">
         <h2>Recovery Methods</h2>
       </div>
+      <p class="t-paragraph t-lead">${copy.enable_recovery_to_make_secure}</p>
       <div class="c-action-list">
         <ul>
           ${isNullish(recoveryPhrase)