feat: complete MDX migration for blog, fix diagram fidelity and refactor styling architecture

apps/web/src/components/Typography.tsx

@@ -41,22 +41,22 @@ export const LeadText: React.FC<TypographyProps> = ({
   children,
   className = "",
 }) => (
-  <p
+  <div
     className={`text-sm md:text-xl font-serif italic text-slate-500 leading-relaxed ${className}`}
   >
     {children}
-  </p>
+  </div>
 );
 
 export const BodyText: React.FC<TypographyProps> = ({
   children,
   className = "",
 }) => (
-  <p
+  <div
     className={`text-sm md:text-base text-slate-500 leading-relaxed ${className}`}
   >
     {children}
-  </p>
+  </div>
 );
 
 export const Label: React.FC<TypographyProps> = ({