Align props with figma

app/components/AskOrganizer/AskOrganizer.container.tsx

@@ -8,6 +8,7 @@ import type {
   AskOrganizerProps,
   AskOrganizerVariant,
 } from "./AskOrganizer.types";
+import { normalizeAskOrganizerVariant } from "../../../lib/propNormalization";
 
 const VARIANT_STYLES: Record<
   AskOrganizerVariant,
@@ -39,9 +40,11 @@ const AskOrganizerContainer = memo<AskOrganizerProps>(
     buttonText,
     buttonHref,
     className = "",
-    variant = "centered",
+    variant: variantProp = "centered",
     onContactClick,
   }) => {
+    // Normalize props to handle both PascalCase (Figma) and lowercase (codebase)
+    const variant = normalizeAskOrganizerVariant(variantProp) as AskOrganizerVariant;
     const t = useTranslation();
     const defaultButtonText = buttonText ?? t("askOrganizer.buttonText");
     const defaultButtonHref = buttonHref ?? t("askOrganizer.buttonHref");

app/components/AskOrganizer/AskOrganizer.types.ts

@@ -4,7 +4,11 @@ export type AskOrganizerVariant =
   | "centered"
   | "left-aligned"
   | "compact"
-  | "inverse";
+  | "inverse"
+  | "Centered"
+  | "Left-Aligned"
+  | "Compact"
+  | "Inverse";
 
 export interface AskOrganizerProps {
   title?: string;
@@ -13,6 +17,10 @@ export interface AskOrganizerProps {
   buttonText?: string;
   buttonHref?: string;
   className?: string;
+  /**
+   * Ask organizer variant. Accepts both lowercase and PascalCase (case-insensitive).
+   * Figma uses PascalCase, codebase uses lowercase - both are supported.
+   */
   variant?: AskOrganizerVariant;
   onContactClick?: (_data: {
     event: string;