Align props with figma

app/components/SectionHeader.tsx

@@ -1,16 +1,25 @@
 "use client";
 
 import { memo } from "react";
+import { normalizeSectionHeaderVariant } from "../../lib/propNormalization";
+
+export type SectionHeaderVariantValue = "default" | "multi-line" | "Default" | "Multi-Line";
 
 interface SectionHeaderProps {
   title: string;
   subtitle: string;
   titleLg?: string;
-  variant?: "default" | "multi-line";
+  /**
+   * Section header variant. Accepts both lowercase and PascalCase (case-insensitive).
+   * Figma uses PascalCase, codebase uses lowercase - both are supported.
+   */
+  variant?: SectionHeaderVariantValue;
 }
 
 const SectionHeader = memo<SectionHeaderProps>(
-  ({ title, subtitle, titleLg, variant = "default" }) => {
+  ({ title, subtitle, titleLg, variant: variantProp = "default" }) => {
+    // Normalize props to handle both PascalCase (Figma) and lowercase (codebase)
+    const variant = normalizeSectionHeaderVariant(variantProp);
     return (
       <div
         className={