Ask Organizer variant added

app/components/AskOrganizer.js

@@ -52,6 +52,10 @@ const AskOrganizer = ({
       container: "text-center",
       buttonContainer: "flex justify-center",
     },
+    inverse: {
+      container: "text-center",
+      buttonContainer: "flex justify-center",
+    },
   };
 
   const styles = variantStyles[variant] || variantStyles.centered;
@@ -81,7 +85,7 @@ const AskOrganizer = ({
           title={title}
           subtitle={subtitle}
           description={description}
-          variant="ask"
+          variant={variant === "inverse" ? "ask-inverse" : "ask"}
           alignment={variant === "left-aligned" ? "left" : "center"}
         />
 
@@ -90,7 +94,7 @@ const AskOrganizer = ({
           <Button
             href={buttonHref}
             size="large"
-            variant="default"
+            variant={variant === "inverse" ? "primary" : "default"}
             className="xl:!px-[var(--spacing-scale-020)] xl:!py-[var(--spacing-scale-012)] xl:!text-[24px] xl:!leading-[28px]"
             onClick={handleContactClick}
             aria-label={`${buttonText} - Contact an organizer for help`}

app/components/ContentLockup.js

@@ -59,13 +59,25 @@ const ContentLockup = ({
       shape:
         "w-[16px] h-[16px] md:w-[20px] md:h-[20px] lg:w-[24px] lg:h-[24px]",
     },
+    "ask-inverse": {
+      container: "flex flex-col gap-[var(--spacing-scale-008)] relative z-10",
+      textContainer: "flex flex-col gap-[var(--spacing-scale-008)]",
+      titleGroup: "flex flex-col gap-[var(--spacing-scale-008)]",
+      titleContainer: "flex gap-[var(--spacing-scale-008)] items-center",
+      title:
+        "font-bricolage-grotesque font-medium text-[36px] leading-[110%] tracking-[0] md:text-[44px] md:leading-[110%] xl:text-[52px] xl:leading-[110%] text-[var(--color-content-inverse-primary)]",
+      subtitle:
+        "font-inter font-normal text-[18px] leading-[130%] tracking-[0] md:text-[24px] md:leading-[32px] text-[var(--color-content-inverse-primary)]",
+      shape:
+        "w-[16px] h-[16px] md:w-[20px] md:h-[20px] lg:w-[24px] lg:h-[24px]",
+    },
   };
 
   const styles = variantStyles[variant] || variantStyles.hero;
 
   return (
     <div className={styles.container}>
-      {variant === "ask" ? (
+      {variant === "ask" || variant === "ask-inverse" ? (
         /* Simplified structure for ask variant */
         <div
           className={`${styles.titleGroup} ${