docs(docs): add Approach and Explanation sections with mermaid diagrams to problem pages

apps/docs/content/(two-pointers)/125-valid-palindrome.mdx

@@ -28,6 +28,20 @@ sidebar:
 - `1 <= s.length <= 2 * 10^5`
 - `s` consists only of printable ASCII characters.
 
+## Approach
+
+```mermaid
+flowchart TD
+  S(["isPalindrome(s)"]) --> N["normal = s stripped of non-alphanumerics, lowercased"]
+  N --> I["i = 0, j = normal.length - 1"]
+  I --> W{"i < j?"}
+  W -- no --> E(["return true — the pointers met in the middle"])
+  W -- yes --> Q{"normal[i] != normal[j]?"}
+  Q -- yes --> F(["return false"])
+  Q -- no --> A["i++; j-- — step both inward"]
+  A --> W
+```
+
 ## Solution
 
 ```js
@@ -49,3 +63,7 @@ var isPalindrome = function(s) {
   return true;
 };
 ```
+
+## Explanation
+
+<YouTube id="jJXJ16kPFWg" title="Valid Palindrome - Leetcode 125 - Python" />