keystone-design-bootstrap 1.0.55 → 1.0.56

package/dist/index.js

@@ -37,7 +37,7 @@ var __objRest = (source, exclude) => {
 };
 
 // src/design_system/sections/index.tsx
-import React61 from "react";
+import React62 from "react";
 
 // src/lib/component-registry.ts
 var registry = /* @__PURE__ */ new Map();
@@ -3740,6 +3740,9 @@ function Modal({
   title,
   titleId = "modal-title",
   children,
+  footer,
+  hideHeader = false,
+  ariaLabel,
   overlayClassName,
   panelClassName,
   maxWidth = "md"
@@ -3771,7 +3774,8 @@ function Modal({
       className: overlayClassName != null ? overlayClassName : "fixed inset-0 z-[200] flex items-center justify-center p-4 bg-black/50",
       role: "dialog",
       "aria-modal": "true",
-      "aria-labelledby": title ? titleId : void 0,
+      "aria-label": ariaLabel,
+      "aria-labelledby": !ariaLabel && title && !hideHeader ? titleId : void 0,
       onClick: (e) => e.target === overlayRef.current && onClose()
     },
     /* @__PURE__ */ React13.createElement(
@@ -3780,7 +3784,7 @@ function Modal({
         className: panelClassName != null ? panelClassName : `bg-primary border border-secondary rounded-lg shadow-xl w-full overflow-hidden ${maxWidthClass} max-h-[90vh] flex flex-col`,
         onClick: (e) => e.stopPropagation()
       },
-      /* @__PURE__ */ React13.createElement("div", { className: "flex items-start justify-between gap-4 p-4 md:p-6 border-b border-secondary flex-shrink-0" }, title ? /* @__PURE__ */ React13.createElement(
+      !hideHeader && /* @__PURE__ */ React13.createElement("div", { className: "flex items-start justify-between gap-4 p-4 md:p-6 border-b border-secondary flex-shrink-0" }, title ? /* @__PURE__ */ React13.createElement(
         "h2",
         {
           id: titleId,
@@ -3816,7 +3820,8 @@ function Modal({
           )
         )
       )),
-      /* @__PURE__ */ React13.createElement("div", { className: "overflow-y-auto flex-1 p-4 md:p-6" }, children)
+      /* @__PURE__ */ React13.createElement("div", { className: "overflow-y-auto flex-1 p-4 md:p-6" }, children),
+      footer && /* @__PURE__ */ React13.createElement("div", { className: "flex-shrink-0 border-t border-secondary" }, footer)
     )
   );
 }
@@ -5977,8 +5982,7 @@ var countriesOptions = countries.map((country) => ({
 }));
 var countries_default = countries;
 
-// src/design_system/components/DynamicFormFields.tsx
-var INPUT_TYPES = ["text", "email", "tel"];
+// src/utils/phone-helpers.ts
 function getNationalMask(country) {
   if (!(country == null ? void 0 : country.phoneMask)) return "";
   const code = country.phoneCode.startsWith("+") ? country.phoneCode : `+${country.phoneCode}`;
@@ -5999,6 +6003,9 @@ function formatDigitsToMask(digits, mask) {
   }
   return out;
 }
+
+// src/design_system/components/DynamicFormFields.tsx
+var INPUT_TYPES = ["text", "email", "tel"];
 function allFieldsFlat(fields) {
   const out = [];
   for (const item of fields) {
@@ -6194,14 +6201,20 @@ function DynamicFormFields({ form, jobSlug, privacyPolicyUrl, termsOfServiceUrl
 function trackMetaLead(eventId) {
   if (typeof window === "undefined" || !eventId) return;
   const fbq = window.fbq;
-  if (fbq) fbq("track", "Lead", {}, { eventID: eventId });
+  if (!fbq) {
+    console.debug("[MetaPixel] Lead skipped \u2014 fbq not loaded", { eventId });
+    return;
+  }
+  console.debug("[MetaPixel] Lead", { eventId });
+  fbq("track", "Lead", {}, { eventID: eventId });
 }
 
 // src/next/contexts/form-definitions.tsx
 import React19, { createContext as createContext9, useContext as useContext10 } from "react";
 var FormDefinitionsContext = createContext9({
   leadFormDefinition: null,
-  jobApplicationFormDefinition: null
+  jobApplicationFormDefinition: null,
+  marketingListSignupFormDefinition: null
 });
 function useFormDefinitions() {
   return useContext10(FormDefinitionsContext);
@@ -8536,8 +8549,9 @@ function HeaderNavigation2({
   React36.useEffect(() => {
     const handleScroll = () => {
       setIsScrolled(window.scrollY > 10);
+      setActiveDropdown(null);
     };
-    window.addEventListener("scroll", handleScroll);
+    window.addEventListener("scroll", handleScroll, { passive: true });
     return () => window.removeEventListener("scroll", handleScroll);
   }, []);
   React36.useEffect(() => {
@@ -8569,6 +8583,8 @@ function HeaderNavigation2({
         setDropdownTop(rect.bottom);
       }
       setActiveDropdown(item.label);
+    } else {
+      setActiveDropdown(null);
     }
   }, [cancelCloseTimeout]);
   const handleMouseLeave = useCallback5(() => {
@@ -17646,6 +17662,8 @@ function HeaderNavigation3({
     cancelCloseTimeout();
     if (item.children && item.children.length > 0) {
       setActiveDropdown(item.label);
+    } else {
+      setActiveDropdown(null);
     }
   }, [cancelCloseTimeout]);
   const handleMouseLeave = useCallback8(() => {
@@ -18436,6 +18454,8 @@ function HeaderNavigation4({
     cancelCloseTimeout();
     if (item.children && item.children.length > 0) {
       setActiveDropdown(item.label);
+    } else {
+      setActiveDropdown(null);
     }
   }, [cancelCloseTimeout]);
   const handleMouseLeave = useCallback9(() => {
@@ -19138,12 +19158,90 @@ var FeatureTabHorizontal = ({ title, subtitle, footer, isCurrent }) => /* @__PUR
   footer
 );
 
+// src/design_system/sections/email-signup-section.tsx
+import React60, { useRef as useRef18, useState as useState30 } from "react";
+var EmailSignupSection = ({
+  title = "Stay in the loop",
+  subtitle = "Subscribe to our newsletter for updates, tips, and exclusive offers.",
+  buttonText = "Subscribe",
+  successMessage = "You're subscribed! Thank you.",
+  formDefinition
+}) => {
+  const { marketingListSignupFormDefinition } = useFormDefinitions();
+  const resolvedFormDefinition = formDefinition != null ? formDefinition : marketingListSignupFormDefinition;
+  const [isSubmitting, setIsSubmitting] = useState30(false);
+  const [submitStatus, setSubmitStatus] = useState30("idle");
+  const [statusMessage, setStatusMessage] = useState30("");
+  const formRef = useRef18(null);
+  const handleSubmit = async (e) => {
+    var _a;
+    e.preventDefault();
+    setIsSubmitting(true);
+    setSubmitStatus("idle");
+    setStatusMessage("");
+    const formData = new FormData(e.currentTarget);
+    const data = { formType: "marketing_list_signup" };
+    formData.forEach((value, key) => {
+      if (key.endsWith("_prefix")) return;
+      if (typeof value === "string") data[key] = value;
+    });
+    try {
+      const response = await fetch("/api/form/", {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify(data)
+      });
+      const result = await response.json();
+      if (result.success) {
+        setSubmitStatus("success");
+        setStatusMessage(result.message || successMessage);
+        (_a = formRef.current) == null ? void 0 : _a.reset();
+        setTimeout(() => setSubmitStatus("idle"), 6e3);
+      } else {
+        setSubmitStatus("error");
+        setStatusMessage(result.error || "Something went wrong. Please try again.");
+      }
+    } catch (e2) {
+      setSubmitStatus("error");
+      setStatusMessage("Network error. Please try again later.");
+    }
+    setIsSubmitting(false);
+  };
+  if (!resolvedFormDefinition) return null;
+  return /* @__PURE__ */ React60.createElement("section", { className: "bg-secondary py-16 md:py-20" }, /* @__PURE__ */ React60.createElement("div", { className: "mx-auto max-w-container px-4 md:px-8" }, /* @__PURE__ */ React60.createElement("div", { className: "mx-auto max-w-xl text-center" }, /* @__PURE__ */ React60.createElement("h2", { className: "font-display text-display-sm font-semibold text-primary md:text-display-md" }, title), subtitle && /* @__PURE__ */ React60.createElement("p", { className: "mt-4 font-body text-lg text-tertiary" }, subtitle), /* @__PURE__ */ React60.createElement(
+    Form2,
+    {
+      ref: formRef,
+      onSubmit: handleSubmit,
+      className: "mt-8 flex flex-col gap-6 text-left"
+    },
+    /* @__PURE__ */ React60.createElement(DynamicFormFields, { form: resolvedFormDefinition }),
+    submitStatus === "success" && /* @__PURE__ */ React60.createElement("div", { className: "rounded-lg bg-success-50 p-4 text-success-700" }, statusMessage || successMessage),
+    submitStatus === "error" && /* @__PURE__ */ React60.createElement("div", { className: "rounded-lg bg-error-50 p-4 text-error-700" }, statusMessage),
+    /* @__PURE__ */ React60.createElement(
+      Button2,
+      {
+        type: "submit",
+        color: "primary",
+        size: "xl",
+        isDisabled: isSubmitting,
+        isLoading: isSubmitting,
+        className: "w-full"
+      },
+      isSubmitting ? "Subscribing..." : buttonText
+    )
+  ))));
+};
+
 // src/design_system/sections/service-menu-section.tsx
-import React60, { useState as useState30, useEffect as useEffect11, useCallback as useCallback10, useMemo as useMemo8 } from "react";
+import React61, { useState as useState32, useEffect as useEffect12, useCallback as useCallback10 } from "react";
 import { createPortal } from "react-dom";
-var SERVICE_MENU_MODAL_ROOT_ID = "service-menu-modal-root";
+
+// src/lib/hooks/use-image-cycle.ts
+import { useState as useState31, useEffect as useEffect11, useMemo as useMemo8 } from "react";
 var CYCLE_INTERVAL_MIN_MS = 6e3;
 var CYCLE_INTERVAL_MAX_MS = 8e3;
+var CROSSFADE_DURATION_MS = 600;
 function seedToUnit(seed) {
   let h = 2166136261 >>> 0;
   for (let i = 0; i < seed.length; i++) {
@@ -19152,18 +19250,6 @@ function seedToUnit(seed) {
   }
   return (h >>> 0) / 4294967296;
 }
-function getActivePublicOffers(offers) {
-  if (!Array.isArray(offers) || offers.length === 0) return [];
-  return offers.filter((o) => o.active !== false && o.expired !== true);
-}
-function photoAttachmentDisplayUrl(pa) {
-  var _a, _b;
-  return ((_a = pa.photo) == null ? void 0 : _a.large_url) || ((_b = pa.photo) == null ? void 0 : _b.medium_url);
-}
-function photoAttachmentAlt(pa) {
-  var _a, _b;
-  return ((_a = pa.photo) == null ? void 0 : _a.alt_text) || ((_b = pa.photo) == null ? void 0 : _b.title) || "";
-}
 function shuffleWithSeed(array, seed) {
   if (array.length <= 1) return array;
   const arr = [...array];
@@ -19182,39 +19268,25 @@ function shuffleWithSeed(array, seed) {
   }
   return arr;
 }
-var CROSSFADE_DURATION_MS = 600;
-function useCycledPhotoList(photoAttachments, seed) {
-  return useMemo8(
-    () => {
-      const arr = Array.isArray(photoAttachments) && photoAttachments.length > 0 ? photoAttachments : [];
-      if (arr.length === 0) return [];
-      const shuffled = shuffleWithSeed(arr, seed);
-      return shuffled.map((pa) => {
-        var _a;
-        return { url: (_a = photoAttachmentDisplayUrl(pa)) != null ? _a : "", alt: photoAttachmentAlt(pa) };
-      }).filter((x) => x.url);
-    },
-    [photoAttachments, seed]
-  );
+function photoUrlFromAttachment(pa) {
+  var _a, _b, _c;
+  return ((_a = pa.photo) == null ? void 0 : _a.large_url) || ((_b = pa.photo) == null ? void 0 : _b.medium_url) || ((_c = pa.photo) == null ? void 0 : _c.thumbnail_url);
 }
-function GridCardWithImage({
-  photoAttachments,
-  fallbackId,
-  fallbackAlt,
-  title,
-  subtitle,
-  children,
-  onClick,
-  websitePhotos,
-  companyInformation,
-  cycleSeed,
-  hasSpecial
-}) {
-  var _a, _b, _c, _d, _e, _f, _g;
-  const seed = cycleSeed != null ? cycleSeed : String(fallbackId);
-  const list = useCycledPhotoList(photoAttachments, seed);
-  const [currentIndex, setCurrentIndex] = useState30(0);
-  const [transitioning, setTransitioning] = useState30(false);
+function photoAltFromAttachment(pa) {
+  var _a, _b;
+  return ((_a = pa.photo) == null ? void 0 : _a.alt_text) || ((_b = pa.photo) == null ? void 0 : _b.title) || "";
+}
+function useImageCycle(photoAttachments, seed) {
+  const list = useMemo8(() => {
+    const arr = Array.isArray(photoAttachments) && photoAttachments.length > 0 ? photoAttachments : [];
+    if (arr.length === 0) return [];
+    return shuffleWithSeed(arr, seed).map((pa) => {
+      var _a;
+      return { url: (_a = photoUrlFromAttachment(pa)) != null ? _a : "", alt: photoAltFromAttachment(pa) };
+    }).filter((x) => x.url);
+  }, [photoAttachments, seed]);
+  const [currentIndex, setCurrentIndex] = useState31(0);
+  const [transitioning, setTransitioning] = useState31(false);
   const intervalMs = useMemo8(
     () => CYCLE_INTERVAL_MIN_MS + Math.floor(seedToUnit(seed) * (CYCLE_INTERVAL_MAX_MS - CYCLE_INTERVAL_MIN_MS + 1)),
     [seed]
@@ -19233,24 +19305,48 @@ function GridCardWithImage({
     return () => clearTimeout(t);
   }, [transitioning, list.length]);
   const nextIndex = list.length > 1 ? (currentIndex + 1) % list.length : 0;
-  const currentItem = list[currentIndex];
-  const displayAlt = (currentItem == null ? void 0 : currentItem.alt) || fallbackAlt;
-  const singleUrl = (_a = list[0]) == null ? void 0 : _a.url;
-  return /* @__PURE__ */ React60.createElement(
+  return { list, currentIndex, nextIndex, transitioning };
+}
+
+// src/design_system/sections/service-menu-section.tsx
+var SERVICE_MENU_MODAL_ROOT_ID = "service-menu-modal-root";
+function getActivePublicOffers(offers) {
+  if (!Array.isArray(offers) || offers.length === 0) return [];
+  return offers.filter((o) => o.active !== false && o.expired !== true);
+}
+function GridCardWithImage({
+  photoAttachments,
+  fallbackId,
+  fallbackAlt,
+  title,
+  subtitle,
+  children,
+  onClick,
+  websitePhotos,
+  companyInformation,
+  cycleSeed,
+  hasSpecial
+}) {
+  var _a, _b, _c, _d, _e, _f, _g, _h;
+  const seed = cycleSeed != null ? cycleSeed : String(fallbackId);
+  const { list, currentIndex, nextIndex, transitioning } = useImageCycle(photoAttachments, seed);
+  const displayAlt = ((_a = list[currentIndex]) == null ? void 0 : _a.alt) || fallbackAlt;
+  const singleUrl = (_b = list[0]) == null ? void 0 : _b.url;
+  return /* @__PURE__ */ React61.createElement(
     "button",
     {
       type: "button",
       onClick,
       className: "flex flex-col h-full w-full text-left group block rounded-lg outline-none focus-visible:ring-2 focus-visible:ring-brand-accent focus-visible:ring-offset-2"
     },
-    /* @__PURE__ */ React60.createElement("div", { className: "w-full h-36 overflow-hidden rounded-lg mb-3 relative" }, hasSpecial ? /* @__PURE__ */ React60.createElement(
+    /* @__PURE__ */ React61.createElement("div", { className: "w-full h-36 overflow-hidden rounded-lg mb-3 relative" }, hasSpecial ? /* @__PURE__ */ React61.createElement(
       "span",
       {
         className: "absolute top-2 right-2 z-10 rounded-full border border-brand-accent/40 bg-secondary/95 px-2 py-0.5 text-[10px] font-semibold uppercase tracking-wide text-brand-accent shadow-sm backdrop-blur-sm",
         "aria-label": "Has special offer"
       },
       "Special"
-    ) : null, list.length === 0 ? /* @__PURE__ */ React60.createElement(
+    ) : null, list.length === 0 ? /* @__PURE__ */ React61.createElement(
       PhotoWithFallback2,
       {
         item: void 0,
@@ -19262,7 +19358,7 @@ function GridCardWithImage({
       }
     ) : list.length === 1 && singleUrl ? (
       // eslint-disable-next-line @next/next/no-img-element -- dynamic API URLs; next/image not configured for external host
-      /* @__PURE__ */ React60.createElement(
+      /* @__PURE__ */ React61.createElement(
         "img",
         {
           src: singleUrl,
@@ -19270,37 +19366,37 @@ function GridCardWithImage({
           className: "w-full h-full object-cover transition-transform duration-300 group-hover:scale-105"
         }
       )
-    ) : /* @__PURE__ */ React60.createElement(React60.Fragment, null, /* @__PURE__ */ React60.createElement(
+    ) : /* @__PURE__ */ React61.createElement(React61.Fragment, null, /* @__PURE__ */ React61.createElement(
       "div",
       {
         className: `absolute inset-0 ${transitioning ? "transition-opacity duration-[600ms] ease-in-out" : "transition-none"}`,
         style: { opacity: transitioning ? 0 : 1 }
       },
-      /* @__PURE__ */ React60.createElement(
+      /* @__PURE__ */ React61.createElement(
         "img",
         {
-          src: (_b = list[currentIndex]) == null ? void 0 : _b.url,
-          alt: (_d = (_c = list[currentIndex]) == null ? void 0 : _c.alt) != null ? _d : displayAlt,
+          src: (_c = list[currentIndex]) == null ? void 0 : _c.url,
+          alt: (_e = (_d = list[currentIndex]) == null ? void 0 : _d.alt) != null ? _e : displayAlt,
           className: "w-full h-full object-cover transition-transform duration-300 group-hover:scale-105"
         }
       )
-    ), /* @__PURE__ */ React60.createElement(
+    ), /* @__PURE__ */ React61.createElement(
       "div",
       {
         className: `absolute inset-0 ${transitioning ? "transition-opacity duration-[600ms] ease-in-out" : "transition-none"}`,
         style: { opacity: transitioning ? 1 : 0 }
       },
-      /* @__PURE__ */ React60.createElement(
+      /* @__PURE__ */ React61.createElement(
         "img",
         {
-          src: (_e = list[nextIndex]) == null ? void 0 : _e.url,
-          alt: (_g = (_f = list[nextIndex]) == null ? void 0 : _f.alt) != null ? _g : displayAlt,
+          src: (_f = list[nextIndex]) == null ? void 0 : _f.url,
+          alt: (_h = (_g = list[nextIndex]) == null ? void 0 : _g.alt) != null ? _h : displayAlt,
           className: "w-full h-full object-cover transition-transform duration-300 group-hover:scale-105"
         }
       )
     ))),
-    subtitle && /* @__PURE__ */ React60.createElement("p", { className: "text-xs font-medium text-fg-secondary uppercase tracking-wide line-clamp-1" }, subtitle),
-    /* @__PURE__ */ React60.createElement("h4", { className: "font-display text-base font-normal text-fg-primary mt-1 group-hover:underline line-clamp-2" }, title),
+    subtitle && /* @__PURE__ */ React61.createElement("p", { className: "text-xs font-medium text-fg-secondary uppercase tracking-wide line-clamp-1" }, subtitle),
+    /* @__PURE__ */ React61.createElement("h4", { className: "font-display text-base font-normal text-fg-primary mt-1 group-hover:underline line-clamp-2" }, title),
     children
   );
 }
@@ -19310,9 +19406,9 @@ function CarouselRow({
   renderItem
 }) {
   if (!(items == null ? void 0 : items.length)) return null;
-  return /* @__PURE__ */ React60.createElement("div", { className: "mb-12 last:mb-0" }, /* @__PURE__ */ React60.createElement(Carousel.Root, { opts: { align: "start", loop: true } }, /* @__PURE__ */ React60.createElement("div", { className: "flex items-center justify-between gap-4 mb-2" }, /* @__PURE__ */ React60.createElement("h3", { className: "font-display text-2xl font-normal text-fg-primary md:text-3xl" }, rowTitle), /* @__PURE__ */ React60.createElement("div", { className: "flex gap-2 flex-shrink-0" }, /* @__PURE__ */ React60.createElement(Carousel.PrevTrigger, { className: "rounded-full p-1.5 border border-secondary hover:bg-primary_hover transition-colors disabled:opacity-30 disabled:cursor-not-allowed" }, /* @__PURE__ */ React60.createElement("svg", { className: "w-5 h-5 text-fg-primary", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", "aria-hidden": true }, /* @__PURE__ */ React60.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M15 19l-7-7 7-7" }))), /* @__PURE__ */ React60.createElement(Carousel.NextTrigger, { className: "rounded-full p-1.5 border border-secondary hover:bg-primary_hover transition-colors disabled:opacity-30 disabled:cursor-not-allowed" }, /* @__PURE__ */ React60.createElement("svg", { className: "w-5 h-5 text-fg-primary", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", "aria-hidden": true }, /* @__PURE__ */ React60.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 5l7 7-7 7" }))))), /* @__PURE__ */ React60.createElement(Carousel.Content, { className: "-ml-3" }, items.map((item, index) => {
+  return /* @__PURE__ */ React61.createElement("div", { className: "mb-12 last:mb-0" }, /* @__PURE__ */ React61.createElement(Carousel.Root, { opts: { align: "start", loop: true } }, /* @__PURE__ */ React61.createElement("div", { className: "flex items-center justify-between gap-4 mb-2" }, /* @__PURE__ */ React61.createElement("h3", { className: "font-display text-2xl font-normal text-fg-primary md:text-3xl" }, rowTitle), /* @__PURE__ */ React61.createElement("div", { className: "flex gap-2 flex-shrink-0" }, /* @__PURE__ */ React61.createElement(Carousel.PrevTrigger, { className: "rounded-full p-1.5 border border-secondary hover:bg-primary_hover transition-colors disabled:opacity-30 disabled:cursor-not-allowed" }, /* @__PURE__ */ React61.createElement("svg", { className: "w-5 h-5 text-fg-primary", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", "aria-hidden": true }, /* @__PURE__ */ React61.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M15 19l-7-7 7-7" }))), /* @__PURE__ */ React61.createElement(Carousel.NextTrigger, { className: "rounded-full p-1.5 border border-secondary hover:bg-primary_hover transition-colors disabled:opacity-30 disabled:cursor-not-allowed" }, /* @__PURE__ */ React61.createElement("svg", { className: "w-5 h-5 text-fg-primary", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", "aria-hidden": true }, /* @__PURE__ */ React61.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 5l7 7-7 7" }))))), /* @__PURE__ */ React61.createElement(Carousel.Content, { className: "-ml-3" }, items.map((item, index) => {
     var _a;
-    return /* @__PURE__ */ React60.createElement(Carousel.Item, { key: (_a = item.id) != null ? _a : index, className: "pl-3 basis-[70%] sm:basis-1/2 md:basis-1/3 lg:basis-1/4" }, renderItem(item, index));
+    return /* @__PURE__ */ React61.createElement(Carousel.Item, { key: (_a = item.id) != null ? _a : index, className: "pl-3 basis-[70%] sm:basis-1/2 md:basis-1/3 lg:basis-1/4" }, renderItem(item, index));
   }))));
 }
 function GridRow({
@@ -19321,9 +19417,9 @@ function GridRow({
   renderItem
 }) {
   if (!(items == null ? void 0 : items.length)) return null;
-  return /* @__PURE__ */ React60.createElement("div", { className: "mb-12 last:mb-0" }, /* @__PURE__ */ React60.createElement("h3", { className: "font-display text-2xl font-normal text-fg-primary mb-3 md:text-3xl" }, rowTitle), /* @__PURE__ */ React60.createElement("div", { className: "grid grid-cols-2 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4" }, items.map((item, index) => {
+  return /* @__PURE__ */ React61.createElement("div", { className: "mb-12 last:mb-0" }, /* @__PURE__ */ React61.createElement("h3", { className: "font-display text-2xl font-normal text-fg-primary mb-3 md:text-3xl" }, rowTitle), /* @__PURE__ */ React61.createElement("div", { className: "grid grid-cols-2 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4" }, items.map((item, index) => {
     var _a;
-    return /* @__PURE__ */ React60.createElement("div", { key: (_a = item.id) != null ? _a : index, className: "min-w-0 flex" }, renderItem(item, index));
+    return /* @__PURE__ */ React61.createElement("div", { key: (_a = item.id) != null ? _a : index, className: "min-w-0 flex" }, renderItem(item, index));
   })));
 }
 function MenuBlock({
@@ -19333,27 +19429,27 @@ function MenuBlock({
   layout: layout2
 }) {
   if (!(items == null ? void 0 : items.length)) return null;
-  return layout2 === "carousel" ? /* @__PURE__ */ React60.createElement(CarouselRow, { rowTitle, items, renderItem }) : /* @__PURE__ */ React60.createElement(GridRow, { rowTitle, items, renderItem });
+  return layout2 === "carousel" ? /* @__PURE__ */ React61.createElement(CarouselRow, { rowTitle, items, renderItem }) : /* @__PURE__ */ React61.createElement(GridRow, { rowTitle, items, renderItem });
 }
 function formatPriceCents(cents) {
   if (cents == null) return null;
   return new Intl.NumberFormat("en-US", { style: "currency", currency: "USD", minimumFractionDigits: 0, maximumFractionDigits: 0 }).format(cents / 100);
 }
 function ModalSection({ title, children }) {
-  return /* @__PURE__ */ React60.createElement("div", null, /* @__PURE__ */ React60.createElement("h3", { className: "font-display text-sm font-semibold text-fg-primary uppercase tracking-wide mb-2" }, title), children);
+  return /* @__PURE__ */ React61.createElement("div", null, /* @__PURE__ */ React61.createElement("h3", { className: "font-display text-sm font-semibold text-fg-primary uppercase tracking-wide mb-2" }, title), children);
 }
 function ActiveOffersCallout({ offers }) {
   if (!offers.length) return null;
-  return /* @__PURE__ */ React60.createElement("div", { className: "rounded-xl border border-secondary bg-secondary/25 p-4 md:p-5 space-y-3 ring-1 ring-brand-accent/25" }, /* @__PURE__ */ React60.createElement("p", { className: "text-xs font-semibold uppercase tracking-wide text-brand-accent" }, "Current specials"), /* @__PURE__ */ React60.createElement("ul", { className: "space-y-3 list-none m-0 p-0" }, offers.map((o) => /* @__PURE__ */ React60.createElement(
+  return /* @__PURE__ */ React61.createElement("div", { className: "rounded-xl border border-secondary bg-secondary/25 p-4 md:p-5 space-y-3 ring-1 ring-brand-accent/25" }, /* @__PURE__ */ React61.createElement("p", { className: "text-xs font-semibold uppercase tracking-wide text-brand-accent" }, "Current specials"), /* @__PURE__ */ React61.createElement("ul", { className: "space-y-3 list-none m-0 p-0" }, offers.map((o) => /* @__PURE__ */ React61.createElement(
     "li",
     {
       key: o.id,
       className: "rounded-lg border border-secondary border-l-[3px] border-l-brand-accent bg-primary_hover/30 p-4"
     },
-    /* @__PURE__ */ React60.createElement("p", { className: "font-display text-base font-medium text-fg-primary" }, o.name),
-    o.value_terms ? /* @__PURE__ */ React60.createElement("p", { className: "font-body text-sm text-brand-accent mt-1 font-medium" }, o.value_terms) : null,
-    o.description ? /* @__PURE__ */ React60.createElement("p", { className: "font-body text-sm text-fg-secondary mt-2 leading-relaxed" }, o.description) : null,
-    o.expires_at ? /* @__PURE__ */ React60.createElement("p", { className: "text-xs text-tertiary mt-2" }, "Ends ", new Date(o.expires_at).toLocaleDateString(void 0, { dateStyle: "medium" })) : null
+    /* @__PURE__ */ React61.createElement("p", { className: "font-display text-base font-medium text-fg-primary" }, o.name),
+    o.value_terms ? /* @__PURE__ */ React61.createElement("p", { className: "font-body text-sm text-brand-accent mt-1 font-medium" }, o.value_terms) : null,
+    o.description ? /* @__PURE__ */ React61.createElement("p", { className: "font-body text-sm text-fg-secondary mt-2 leading-relaxed" }, o.description) : null,
+    o.expires_at ? /* @__PURE__ */ React61.createElement("p", { className: "text-xs text-tertiary mt-2" }, "Ends ", new Date(o.expires_at).toLocaleDateString(void 0, { dateStyle: "medium" })) : null
   ))));
 }
 function DetailModalContent({
@@ -19366,20 +19462,20 @@ function DetailModalContent({
     const categoryLine = ((_a = p.category_names) == null ? void 0 : _a.length) ? p.category_names.join(" | ") : null;
     const descriptionMarkdown2 = p.description_markdown || p.summary || p.first_service_description_markdown;
     const packageSpecials = getActivePublicOffers(p.offers);
-    return /* @__PURE__ */ React60.createElement("div", { className: "space-y-6" }, categoryLine && /* @__PURE__ */ React60.createElement("p", { className: "text-sm font-medium text-fg-secondary uppercase tracking-wide" }, categoryLine), /* @__PURE__ */ React60.createElement(ActiveOffersCallout, { offers: packageSpecials }), descriptionMarkdown2 && /* @__PURE__ */ React60.createElement(ModalSection, { title: "Package details" }, /* @__PURE__ */ React60.createElement("div", { className: "prose prose-sm font-body text-fg-primary max-w-none" }, /* @__PURE__ */ React60.createElement(MarkdownRenderer2, { content: descriptionMarkdown2 }))), p.package_items && p.package_items.length > 0 && /* @__PURE__ */ React60.createElement(ModalSection, { title: "What's included" }, /* @__PURE__ */ React60.createElement("ul", { className: "space-y-4" }, p.package_items.map((pi, i) => {
+    return /* @__PURE__ */ React61.createElement("div", { className: "space-y-6" }, categoryLine && /* @__PURE__ */ React61.createElement("p", { className: "text-sm font-medium text-fg-secondary uppercase tracking-wide" }, categoryLine), /* @__PURE__ */ React61.createElement(ActiveOffersCallout, { offers: packageSpecials }), descriptionMarkdown2 && /* @__PURE__ */ React61.createElement(ModalSection, { title: "Package details" }, /* @__PURE__ */ React61.createElement("div", { className: "prose prose-sm font-body text-fg-primary max-w-none" }, /* @__PURE__ */ React61.createElement(MarkdownRenderer2, { content: descriptionMarkdown2 }))), p.package_items && p.package_items.length > 0 && /* @__PURE__ */ React61.createElement(ModalSection, { title: "What's included" }, /* @__PURE__ */ React61.createElement("ul", { className: "space-y-4" }, p.package_items.map((pi, i) => {
       var _a2, _b, _c, _d, _e, _f, _g, _h, _i;
       const fullItem = ((_a2 = pi.service_item) == null ? void 0 : _a2.id) != null ? serviceItems.find((si2) => si2.id === pi.service_item.id) : null;
       const name = (_d = (_c = fullItem == null ? void 0 : fullItem.name) != null ? _c : (_b = pi.service_item) == null ? void 0 : _b.name) != null ? _d : "Item";
       const desc = (_g = (_e = fullItem == null ? void 0 : fullItem.summary) != null ? _e : fullItem == null ? void 0 : fullItem.description_markdown) != null ? _g : (_f = pi.service_item) == null ? void 0 : _f.summary;
-      return /* @__PURE__ */ React60.createElement("li", { key: (_i = (_h = pi.service_item) == null ? void 0 : _h.id) != null ? _i : i, className: "border border-secondary rounded-lg p-4 bg-secondary/20" }, /* @__PURE__ */ React60.createElement("p", { className: "font-display font-medium text-fg-primary" }, pi.quantity > 1 && `${pi.quantity}\xD7 `, name), desc && /* @__PURE__ */ React60.createElement("div", { className: "mt-2 prose prose-sm font-body text-fg-secondary max-w-none" }, typeof desc === "string" && !desc.includes("\n") && !desc.match(/[#*\[\]]/) ? /* @__PURE__ */ React60.createElement("p", null, desc) : /* @__PURE__ */ React60.createElement(MarkdownRenderer2, { content: desc })));
-    }))), p.pricing_info && /* @__PURE__ */ React60.createElement(ModalSection, { title: "Pricing" }, /* @__PURE__ */ React60.createElement("div", { className: "rounded-lg border border-secondary bg-secondary/40 p-4" }, /* @__PURE__ */ React60.createElement("div", { className: "prose prose-sm font-body text-fg-primary max-w-none" }, /* @__PURE__ */ React60.createElement(MarkdownRenderer2, { content: p.pricing_info })))));
+      return /* @__PURE__ */ React61.createElement("li", { key: (_i = (_h = pi.service_item) == null ? void 0 : _h.id) != null ? _i : i, className: "border border-secondary rounded-lg p-4 bg-secondary/20" }, /* @__PURE__ */ React61.createElement("p", { className: "font-display font-medium text-fg-primary" }, pi.quantity > 1 && `${pi.quantity}\xD7 `, name), desc && /* @__PURE__ */ React61.createElement("div", { className: "mt-2 prose prose-sm font-body text-fg-secondary max-w-none" }, typeof desc === "string" && !desc.includes("\n") && !desc.match(/[#*\[\]]/) ? /* @__PURE__ */ React61.createElement("p", null, desc) : /* @__PURE__ */ React61.createElement(MarkdownRenderer2, { content: desc })));
+    }))), p.pricing_info && /* @__PURE__ */ React61.createElement(ModalSection, { title: "Pricing" }, /* @__PURE__ */ React61.createElement("div", { className: "rounded-lg border border-secondary bg-secondary/40 p-4" }, /* @__PURE__ */ React61.createElement("div", { className: "prose prose-sm font-body text-fg-primary max-w-none" }, /* @__PURE__ */ React61.createElement(MarkdownRenderer2, { content: p.pricing_info })))));
   }
   const si = detail.item;
   const priceStr = formatPriceCents(si.price_cents);
   const summary = si.summary || si.service_summary;
   const descriptionMarkdown = si.description_markdown || si.service_description_markdown;
   const itemSpecials = getActivePublicOffers(si.offers);
-  return /* @__PURE__ */ React60.createElement("div", { className: "space-y-6" }, si.service_name && /* @__PURE__ */ React60.createElement("p", { className: "text-sm font-medium text-fg-secondary uppercase tracking-wide" }, si.service_name), /* @__PURE__ */ React60.createElement(ActiveOffersCallout, { offers: itemSpecials }), priceStr && /* @__PURE__ */ React60.createElement(ModalSection, { title: "Price" }, /* @__PURE__ */ React60.createElement("p", { className: "font-display text-lg font-normal text-fg-primary" }, priceStr), si.duration_minutes != null && si.duration_minutes > 0 && /* @__PURE__ */ React60.createElement("p", { className: "font-body text-sm text-fg-secondary mt-1" }, "Duration: ", si.duration_minutes, " min")), summary && /* @__PURE__ */ React60.createElement(ModalSection, { title: "Overview" }, /* @__PURE__ */ React60.createElement("p", { className: "font-body text-fg-primary" }, summary)), descriptionMarkdown && /* @__PURE__ */ React60.createElement(ModalSection, { title: "Full description" }, /* @__PURE__ */ React60.createElement("div", { className: "prose prose-sm font-body text-fg-primary max-w-none" }, /* @__PURE__ */ React60.createElement(MarkdownRenderer2, { content: descriptionMarkdown }))), si.pricing_info && /* @__PURE__ */ React60.createElement(ModalSection, { title: "Pricing details" }, /* @__PURE__ */ React60.createElement("div", { className: "rounded-lg border border-secondary bg-secondary/40 p-4" }, /* @__PURE__ */ React60.createElement("div", { className: "prose prose-sm font-body text-fg-primary max-w-none" }, /* @__PURE__ */ React60.createElement(MarkdownRenderer2, { content: si.pricing_info })))));
+  return /* @__PURE__ */ React61.createElement("div", { className: "space-y-6" }, si.service_name && /* @__PURE__ */ React61.createElement("p", { className: "text-sm font-medium text-fg-secondary uppercase tracking-wide" }, si.service_name), /* @__PURE__ */ React61.createElement(ActiveOffersCallout, { offers: itemSpecials }), priceStr && /* @__PURE__ */ React61.createElement(ModalSection, { title: "Price" }, /* @__PURE__ */ React61.createElement("p", { className: "font-display text-lg font-normal text-fg-primary" }, priceStr), si.duration_minutes != null && si.duration_minutes > 0 && /* @__PURE__ */ React61.createElement("p", { className: "font-body text-sm text-fg-secondary mt-1" }, "Duration: ", si.duration_minutes, " min")), summary && /* @__PURE__ */ React61.createElement(ModalSection, { title: "Overview" }, /* @__PURE__ */ React61.createElement("p", { className: "font-body text-fg-primary" }, summary)), descriptionMarkdown && /* @__PURE__ */ React61.createElement(ModalSection, { title: "Full description" }, /* @__PURE__ */ React61.createElement("div", { className: "prose prose-sm font-body text-fg-primary max-w-none" }, /* @__PURE__ */ React61.createElement(MarkdownRenderer2, { content: descriptionMarkdown }))), si.pricing_info && /* @__PURE__ */ React61.createElement(ModalSection, { title: "Pricing details" }, /* @__PURE__ */ React61.createElement("div", { className: "rounded-lg border border-secondary bg-secondary/40 p-4" }, /* @__PURE__ */ React61.createElement("div", { className: "prose prose-sm font-body text-fg-primary max-w-none" }, /* @__PURE__ */ React61.createElement(MarkdownRenderer2, { content: si.pricing_info })))));
 }
 function ServiceMenuSection({
   title = "Service Menu",
@@ -19393,20 +19489,20 @@ function ServiceMenuSection({
   servicesRowTitle = "Treatments",
   variant = "section"
 }) {
-  const packageList = React60.useMemo(
+  const packageList = React61.useMemo(
     () => Array.isArray(packages) ? packages : [],
     [packages]
   );
-  const serviceList = React60.useMemo(
+  const serviceList = React61.useMemo(
     () => Array.isArray(services) ? services : [],
     [services]
   );
-  const serviceItemIdToService = React60.useMemo(() => {
+  const serviceItemIdToService = React61.useMemo(() => {
     const m = /* @__PURE__ */ new Map();
     serviceList.forEach((s) => (s.service_items || []).forEach((si) => m.set(si.id, s)));
     return m;
   }, [serviceList]);
-  const packagesForMenu = React60.useMemo(
+  const packagesForMenu = React61.useMemo(
     () => packageList.map((pkg) => {
       var _a, _b, _c;
       const category_names = [
@@ -19436,9 +19532,9 @@ function ServiceMenuSection({
   const isPage = variant === "page";
   const packagesLayout = isPage ? "grid" : packagesForMenu.length >= CAROUSEL_MIN ? "carousel" : "grid";
   const serviceItemsLayout = isPage ? "grid" : serviceItemsForMenu.length >= CAROUSEL_MIN ? "carousel" : "grid";
-  const [detailItem, setDetailItem] = useState30(null);
-  const [portalTarget, setPortalTarget] = useState30(null);
-  useEffect11(() => {
+  const [detailItem, setDetailItem] = useState32(null);
+  const [portalTarget, setPortalTarget] = useState32(null);
+  useEffect12(() => {
     let el = document.getElementById(SERVICE_MENU_MODAL_ROOT_ID);
     if (!el) {
       el = document.createElement("div");
@@ -19459,7 +19555,7 @@ function ServiceMenuSection({
       const plainDesc = cardDesc ? cardDesc.replace(/[#*`\[\]]/g, "").replace(/\n+/g, " ").trim() : "";
       const descText = plainDesc.length > 120 ? plainDesc.slice(0, 120) + "\u2026" : plainDesc;
       const hasSpecial = getActivePublicOffers(pkg.offers).length > 0;
-      return /* @__PURE__ */ React60.createElement(
+      return /* @__PURE__ */ React61.createElement(
         GridCardWithImage,
         {
           photoAttachments: pkg.photo_attachments,
@@ -19473,7 +19569,7 @@ function ServiceMenuSection({
           cycleSeed: `pkg-${pkg.id}-${index}`,
           hasSpecial
         },
-        descText && /* @__PURE__ */ React60.createElement("p", { className: "font-body text-sm text-tertiary mt-1 line-clamp-2" }, descText)
+        descText && /* @__PURE__ */ React61.createElement("p", { className: "font-body text-sm text-tertiary mt-1 line-clamp-2" }, descText)
       );
     },
     [websitePhotos, companyInformation]
@@ -19481,7 +19577,7 @@ function ServiceMenuSection({
   const renderServiceItemCard = useCallback10(
     (si, index) => {
       var _a, _b, _c, _d;
-      return /* @__PURE__ */ React60.createElement(
+      return /* @__PURE__ */ React61.createElement(
         GridCardWithImage,
         {
           photoAttachments: si.photo_attachments,
@@ -19495,13 +19591,13 @@ function ServiceMenuSection({
           cycleSeed: `service-item-${si.id}-${index}`,
           hasSpecial: getActivePublicOffers(si.offers).length > 0
         },
-        formatPriceCents(si.price_cents) && /* @__PURE__ */ React60.createElement("p", { className: "font-body text-sm font-medium text-fg-primary mt-1" }, formatPriceCents(si.price_cents)),
+        formatPriceCents(si.price_cents) && /* @__PURE__ */ React61.createElement("p", { className: "font-body text-sm font-medium text-fg-primary mt-1" }, formatPriceCents(si.price_cents)),
         (() => {
           const desc = si.summary || si.description_markdown || si.service_summary || si.service_description_markdown;
           if (!desc) return null;
           const plain = desc.replace(/[#*`\[\]]/g, "").replace(/\n+/g, " ").trim();
           const text = plain.length > 120 ? plain.slice(0, 120) + "\u2026" : plain;
-          return /* @__PURE__ */ React60.createElement("p", { className: "font-body text-sm text-tertiary mt-1 line-clamp-2" }, text);
+          return /* @__PURE__ */ React61.createElement("p", { className: "font-body text-sm text-tertiary mt-1 line-clamp-2" }, text);
         })()
       );
     },
@@ -19509,7 +19605,7 @@ function ServiceMenuSection({
   );
   if (!hasAny) return null;
   const modalTitle = detailItem ? detailItem.item.name : "";
-  return /* @__PURE__ */ React60.createElement("section", { className: variant === "page" ? "py-12 md:py-20" : "py-12 md:py-16" }, /* @__PURE__ */ React60.createElement("div", { className: "mx-auto max-w-container px-4 md:px-8" }, variant === "section" && /* @__PURE__ */ React60.createElement("div", { className: "mx-auto max-w-3xl text-center mb-12 md:mb-16" }, title && /* @__PURE__ */ React60.createElement("h2", { className: "font-display text-4xl font-normal text-fg-primary md:text-5xl" }, title), subtitle && /* @__PURE__ */ React60.createElement("p", { className: "mt-4 font-display text-lg leading-relaxed text-tertiary md:text-xl max-w-3xl mx-auto" }, subtitle)), /* @__PURE__ */ React60.createElement(
+  return /* @__PURE__ */ React61.createElement("section", { className: variant === "page" ? "py-12 md:py-20" : "py-12 md:py-16" }, /* @__PURE__ */ React61.createElement("div", { className: "mx-auto max-w-container px-4 md:px-8" }, variant === "section" && /* @__PURE__ */ React61.createElement("div", { className: "mx-auto max-w-3xl text-center mb-12 md:mb-16" }, title && /* @__PURE__ */ React61.createElement("h2", { className: "font-display text-4xl font-normal text-fg-primary md:text-5xl" }, title), subtitle && /* @__PURE__ */ React61.createElement("p", { className: "mt-4 font-display text-lg leading-relaxed text-tertiary md:text-xl max-w-3xl mx-auto" }, subtitle)), /* @__PURE__ */ React61.createElement(
     MenuBlock,
     {
       rowTitle: "Packages",
@@ -19517,7 +19613,7 @@ function ServiceMenuSection({
       layout: packagesLayout,
       renderItem: renderPackageCard
     }
-  ), /* @__PURE__ */ React60.createElement(
+  ), /* @__PURE__ */ React61.createElement(
     MenuBlock,
     {
       rowTitle: servicesRowTitle,
@@ -19525,8 +19621,8 @@ function ServiceMenuSection({
       layout: serviceItemsLayout,
       renderItem: renderServiceItemCard
     }
-  ), variant === "section" && viewAllHref && viewAllText && /* @__PURE__ */ React60.createElement("div", { className: "mt-12 text-center" }, /* @__PURE__ */ React60.createElement(Button2, { href: viewAllHref, color: "primary", size: "md" }, viewAllText))), portalTarget && detailItem && createPortal(
-    /* @__PURE__ */ React60.createElement(
+  ), variant === "section" && viewAllHref && viewAllText && /* @__PURE__ */ React61.createElement("div", { className: "mt-12 text-center" }, /* @__PURE__ */ React61.createElement(Button2, { href: viewAllHref, color: "primary", size: "md" }, viewAllText))), portalTarget && detailItem && createPortal(
+    /* @__PURE__ */ React61.createElement(
       Modal,
       {
         isOpen: true,
@@ -19534,7 +19630,7 @@ function ServiceMenuSection({
         title: modalTitle,
         maxWidth: "2xl"
       },
-      /* @__PURE__ */ React60.createElement(
+      /* @__PURE__ */ React61.createElement(
         DetailModalContent,
         {
           detail: detailItem,
@@ -19554,9 +19650,9 @@ function createThemedExport2(componentName, BaseComponent) {
     const { theme } = useTheme();
     try {
       const Component2 = getThemedComponent(componentName, theme);
-      return React61.createElement(Component2, props);
+      return React62.createElement(Component2, props);
     } catch (e) {
-      return React61.createElement(BaseComponent, props);
+      return React62.createElement(BaseComponent, props);
     }
   };
 }
@@ -19599,108 +19695,65 @@ var HomeHeroComponent2 = createThemedExport2("home-hero-component", HomeHeroComp
 // src/lib/actions.ts
 var API_URL = process.env.API_URL || "http://localhost:3000/api/v1";
 var API_KEY = process.env.API_KEY || "";
-async function submitContactFormAction(formData) {
+function extractFormFields(formData) {
   var _a, _b, _c, _d, _e;
+  return {
+    firstName: ((_a = formData.get("firstName")) == null ? void 0 : _a.toString().trim()) || "",
+    lastName: ((_b = formData.get("lastName")) == null ? void 0 : _b.toString().trim()) || "",
+    email: ((_c = formData.get("email")) == null ? void 0 : _c.toString().trim()) || "",
+    phone: ((_d = formData.get("phone")) == null ? void 0 : _d.toString().trim()) || "",
+    message: ((_e = formData.get("message")) == null ? void 0 : _e.toString().trim()) || ""
+  };
+}
+async function postFormSubmission(payload) {
+  return fetch(`${API_URL}/public/form_submissions`, {
+    method: "POST",
+    headers: {
+      "Content-Type": "application/json",
+      "X-API-Key": API_KEY
+    },
+    body: JSON.stringify(payload)
+  });
+}
+async function submitContactFormAction(formData) {
+  const { firstName, lastName, email, phone, message } = extractFormFields(formData);
+  if (!firstName || !lastName || !email || !message) {
+    return { success: false, error: "Please fill in all required fields." };
+  }
   try {
-    const firstName = ((_a = formData.get("firstName")) == null ? void 0 : _a.toString().trim()) || "";
-    const lastName = ((_b = formData.get("lastName")) == null ? void 0 : _b.toString().trim()) || "";
-    const email = ((_c = formData.get("email")) == null ? void 0 : _c.toString().trim()) || "";
-    const phone = ((_d = formData.get("phone")) == null ? void 0 : _d.toString().trim()) || "";
-    const message = ((_e = formData.get("message")) == null ? void 0 : _e.toString().trim()) || "";
-    if (!firstName || !lastName || !email || !message) {
-      return {
-        success: false,
-        error: "Please fill in all required fields."
-      };
-    }
-    const name = `${firstName} ${lastName}`;
-    const payload = {
-      name,
+    const res = await postFormSubmission({
+      name: `${firstName} ${lastName}`,
       email,
       phone,
       message,
       source: "contact_form"
-    };
-    const response = await fetch(`${API_URL}/public/form_submissions`, {
-      method: "POST",
-      headers: {
-        "Content-Type": "application/json",
-        "X-API-Key": API_KEY
-      },
-      body: JSON.stringify(payload)
     });
-    const data = await response.json();
-    if (!response.ok) {
-      return {
-        success: false,
-        error: data.error || "Failed to submit contact form. Please try again."
-      };
-    }
-    return {
-      success: true,
-      message: data.message || "Thank you for contacting us! We'll get back to you soon."
-    };
-  } catch (error) {
-    console.error("Contact form submission error:", error);
-    return {
-      success: false,
-      error: "Network error. Please try again later."
-    };
+    const data = await res.json();
+    if (!res.ok) return { success: false, error: data.error || "Failed to submit. Please try again." };
+    return { success: true, message: data.message || "Thank you for contacting us! We'll get back to you soon." };
+  } catch (e) {
+    return { success: false, error: "Network error. Please try again later." };
   }
 }
 async function submitLeadFormAction(formData) {
-  var _a, _b, _c, _d, _e, _f, _g;
+  var _a, _b;
+  const { firstName, lastName, email, phone, message } = extractFormFields(formData);
+  if (!firstName || !lastName || !email || !message) {
+    return { success: false, error: "Please fill in all required fields." };
+  }
   try {
-    const firstName = ((_a = formData.get("firstName")) == null ? void 0 : _a.toString().trim()) || "";
-    const lastName = ((_b = formData.get("lastName")) == null ? void 0 : _b.toString().trim()) || "";
-    const email = ((_c = formData.get("email")) == null ? void 0 : _c.toString().trim()) || "";
-    const phone = ((_d = formData.get("phone")) == null ? void 0 : _d.toString().trim()) || "";
-    const message = ((_e = formData.get("message")) == null ? void 0 : _e.toString().trim()) || "";
-    if (!firstName || !lastName || !email || !message) {
-      return {
-        success: false,
-        error: "Please fill in all required fields."
-      };
-    }
-    const payload = {
-      formType: "lead",
-      firstName,
-      lastName,
-      email,
-      phone,
-      message
-    };
-    const response = await fetch(`${API_URL}/public/form_submissions`, {
-      method: "POST",
-      headers: {
-        "Content-Type": "application/json",
-        "X-API-Key": API_KEY
-      },
-      body: JSON.stringify(payload)
-    });
-    const data = await response.json();
-    if (!response.ok) {
-      return {
-        success: false,
-        error: data.error || "Failed to submit lead form. Please try again."
-      };
-    }
-    const eventId = (_g = (_f = data.data) == null ? void 0 : _f.event_id) != null ? _g : void 0;
-    return __spreadValues({
-      success: true,
-      message: data.message || "Thank you! We'll be in touch soon."
-    }, eventId && { eventId });
-  } catch (error) {
-    console.error("Lead form submission error:", error);
-    return {
-      success: false,
-      error: "Network error. Please try again later."
-    };
+    const res = await postFormSubmission({ formType: "lead", firstName, lastName, email, phone, message });
+    const data = await res.json();
+    if (!res.ok) return { success: false, error: data.error || "Failed to submit. Please try again." };
+    const eventId = (_b = (_a = data.data) == null ? void 0 : _a.event_id) != null ? _b : void 0;
+    return __spreadValues({ success: true, message: data.message || "Thank you! We'll be in touch soon." }, eventId && { eventId });
+  } catch (e) {
+    return { success: false, error: "Network error. Please try again later." };
   }
 }
 
 // src/design_system/components/ChatWidget.tsx
-import React62, { useState as useState31, useEffect as useEffect12, useRef as useRef18, useCallback as useCallback11 } from "react";
+import React63, { useState as useState33, useEffect as useEffect13, useRef as useRef19, useCallback as useCallback11 } from "react";
 import { X, MessageChatSquare } from "@untitledui/icons";
 var formatTime = (isoString) => {
   const date = new Date(isoString);
@@ -19721,17 +19774,19 @@ function ChatWidget({
   position = "bottom-right",
   primaryColor,
   sessionId: providedSessionId,
+  contactId,
   displayName: providedDisplayName,
   teamMembers = []
 }) {
-  const [isOpen, setIsOpen] = useState31(false);
-  const [messages, setMessages] = useState31([]);
-  const [inputValue, setInputValue] = useState31("");
-  const [isLoading, setIsLoading] = useState31(false);
-  const [sessionId, setSessionId] = useState31("");
-  const [waitingForReply, setWaitingForReply] = useState31(false);
-  const messagesEndRef = useRef18(null);
-  useEffect12(() => {
+  const [isOpen, setIsOpen] = useState33(false);
+  const [messages, setMessages] = useState33([]);
+  const [inputValue, setInputValue] = useState33("");
+  const [isLoading, setIsLoading] = useState33(false);
+  const [sessionId, setSessionId] = useState33("");
+  const [waitingForReply, setWaitingForReply] = useState33(false);
+  const messagesEndRef = useRef19(null);
+  useEffect13(() => {
+    if (contactId) return;
     if (providedSessionId) {
       setSessionId(providedSessionId);
     } else {
@@ -19739,15 +19794,17 @@ function ChatWidget({
       if (stored) {
         setSessionId(stored);
       } else {
-        const newId = `session_${Date.now()}_${Math.random().toString(36).substr(2, 9)}`;
+        const newId = `session_${Date.now()}_${Math.random().toString(36).slice(2, 11)}`;
         localStorage.setItem("keystone_chat_session_id", newId);
         setSessionId(newId);
       }
     }
-  }, [providedSessionId]);
+  }, [contactId, providedSessionId]);
   const loadMessages = useCallback11(async () => {
+    if (!contactId && !sessionId) return [];
     try {
-      const response = await fetch(`/api/chat/?identifier=${encodeURIComponent(sessionId)}`);
+      const query = contactId ? `contact_id=${encodeURIComponent(contactId)}` : `identifier=${encodeURIComponent(sessionId)}`;
+      const response = await fetch(`/api/chat/?${query}`);
       if (response.ok) {
         const result = await response.json();
         const newMessages = result.data || [];
@@ -19758,34 +19815,37 @@ function ChatWidget({
       console.error("Failed to load messages:", error);
     }
     return [];
-  }, [sessionId]);
-  useEffect12(() => {
-    if (isOpen && sessionId) {
+  }, [contactId, sessionId]);
+  useEffect13(() => {
+    if (isOpen && (contactId || sessionId)) {
       loadMessages();
     }
-  }, [isOpen, sessionId, loadMessages]);
-  useEffect12(() => {
+  }, [isOpen, contactId, sessionId, loadMessages]);
+  useEffect13(() => {
     var _a;
     (_a = messagesEndRef.current) == null ? void 0 : _a.scrollIntoView({ behavior: "smooth" });
   }, [messages]);
+  const pollIntervalRef = useRef19(null);
+  useEffect13(() => {
+    return () => {
+      if (pollIntervalRef.current !== null) {
+        clearInterval(pollIntervalRef.current);
+      }
+    };
+  }, []);
   const pollForAgentReply = () => {
     setWaitingForReply(true);
     let attempts = 0;
     const maxAttempts = 30;
-    const pollInterval = setInterval(async () => {
+    pollIntervalRef.current = setInterval(async () => {
       attempts++;
       try {
         const newMessages = await loadMessages();
         const latest = newMessages[newMessages.length - 1];
         const hasAgentReplyWithBody = (latest == null ? void 0 : latest.sender_type) === "agent" && (latest == null ? void 0 : latest.body) != null && String(latest.body).trim() !== "";
-        if (hasAgentReplyWithBody) {
-          clearInterval(pollInterval);
-          setWaitingForReply(false);
-          setIsLoading(false);
-          return;
-        }
-        if (attempts >= maxAttempts) {
-          clearInterval(pollInterval);
+        if (hasAgentReplyWithBody || attempts >= maxAttempts) {
+          clearInterval(pollIntervalRef.current);
+          pollIntervalRef.current = null;
           setWaitingForReply(false);
           setIsLoading(false);
         }
@@ -19796,7 +19856,7 @@ function ChatWidget({
   };
   const sendMessage = async () => {
     var _a, _b, _c;
-    if (!inputValue.trim() || !sessionId) return;
+    if (!inputValue.trim() || !contactId && !sessionId) return;
     const messageText = inputValue.trim();
     setInputValue("");
     setIsLoading(true);
@@ -19811,15 +19871,10 @@ function ChatWidget({
     try {
       const response = await fetch("/api/chat/", {
         method: "POST",
-        headers: {
-          "Content-Type": "application/json"
-        },
-        body: JSON.stringify({
-          identifier: sessionId,
-          body: messageText,
-          display_name: providedDisplayName,
-          page_url: window.location.href
-        })
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify(
+          contactId ? { contact_id: contactId, body: messageText, display_name: providedDisplayName, page_url: window.location.href } : { identifier: sessionId, body: messageText, display_name: providedDisplayName, page_url: window.location.href }
+        )
       });
       if (response.ok) {
         const result = await response.json();
@@ -19842,7 +19897,7 @@ function ChatWidget({
       setIsLoading(false);
     }
   };
-  const handleKeyPress = (e) => {
+  const handleKeyDown = (e) => {
     if (e.key === "Enter" && !e.shiftKey) {
       e.preventDefault();
       sendMessage();
@@ -19854,7 +19909,7 @@ function ChatWidget({
   } : void 0;
   const widgetBrandClass = primaryColor ? "bg-[var(--widget-primary)]" : "bg-brand-solid";
   const widgetBrandHoverClass = primaryColor ? "hover:bg-[var(--widget-primary-hover)]" : "hover:bg-brand-solid_hover";
-  return /* @__PURE__ */ React62.createElement(
+  return /* @__PURE__ */ React63.createElement(
     "div",
     {
       className: cx(
@@ -19863,7 +19918,7 @@ function ChatWidget({
       ),
       style: customColorVars
     },
-    !isOpen && /* @__PURE__ */ React62.createElement(
+    !isOpen && /* @__PURE__ */ React63.createElement(
       "button",
       {
         onClick: () => setIsOpen(true),
@@ -19873,15 +19928,15 @@ function ChatWidget({
         ),
         "aria-label": "Open chat"
       },
-      /* @__PURE__ */ React62.createElement(MessageChatSquare, { className: "size-6" })
+      /* @__PURE__ */ React63.createElement(MessageChatSquare, { className: "size-6" })
     ),
-    isOpen && /* @__PURE__ */ React62.createElement("div", { className: "flex h-[500px] w-[380px] flex-col overflow-hidden rounded-xl bg-primary shadow-2xl ring-1 ring-secondary ring-inset" }, /* @__PURE__ */ React62.createElement("div", { className: cx(
+    isOpen && /* @__PURE__ */ React63.createElement("div", { className: "flex h-[500px] w-[380px] flex-col overflow-hidden rounded-xl bg-primary shadow-2xl ring-1 ring-secondary ring-inset" }, /* @__PURE__ */ React63.createElement("div", { className: cx(
       "flex items-center justify-between gap-3 p-4 text-white",
       widgetBrandClass
-    ) }, /* @__PURE__ */ React62.createElement("div", { className: "flex min-w-0 flex-1 flex-col gap-2" }, /* @__PURE__ */ React62.createElement("h3", { className: "m-0 text-lg font-semibold leading-tight" }, "Chat with us"), (() => {
+    ) }, /* @__PURE__ */ React63.createElement("div", { className: "flex min-w-0 flex-1 flex-col gap-2" }, /* @__PURE__ */ React63.createElement("h3", { className: "m-0 text-lg font-semibold leading-tight" }, "Chat with us"), (() => {
       const membersWithPhotos = teamMembers.filter((m) => m.photo_url);
       if (membersWithPhotos.length === 0) return null;
-      return /* @__PURE__ */ React62.createElement("div", { className: "flex -space-x-2" }, membersWithPhotos.slice(0, 5).map((member) => /* @__PURE__ */ React62.createElement(
+      return /* @__PURE__ */ React63.createElement("div", { className: "flex -space-x-2" }, membersWithPhotos.slice(0, 5).map((member) => /* @__PURE__ */ React63.createElement(
         Avatar,
         {
           key: member.id,
@@ -19890,28 +19945,28 @@ function ChatWidget({
           alt: member.name,
           className: "bg-white ring-2 ring-white"
         }
-      )), membersWithPhotos.length > 5 && /* @__PURE__ */ React62.createElement(
+      )), membersWithPhotos.length > 5 && /* @__PURE__ */ React63.createElement(
         Avatar,
         {
           size: "xs",
           className: "bg-white ring-2 ring-white",
-          placeholder: /* @__PURE__ */ React62.createElement("span", { className: "flex items-center justify-center text-xs font-semibold text-tertiary" }, "+", membersWithPhotos.length - 5)
+          placeholder: /* @__PURE__ */ React63.createElement("span", { className: "flex items-center justify-center text-xs font-semibold text-tertiary" }, "+", membersWithPhotos.length - 5)
         }
       ));
-    })()), /* @__PURE__ */ React62.createElement(
+    })()), /* @__PURE__ */ React63.createElement(
       "button",
       {
         onClick: () => setIsOpen(false),
         className: "cursor-pointer rounded-md p-1 text-white outline-none transition-colors hover:bg-white/10 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-white",
         "aria-label": "Close chat"
       },
-      /* @__PURE__ */ React62.createElement(X, { className: "size-5" })
-    )), /* @__PURE__ */ React62.createElement("ul", { className: "flex flex-1 flex-col gap-4 overflow-y-auto px-4 py-4" }, messages.length === 0 && /* @__PURE__ */ React62.createElement("li", { className: "mt-5 text-center text-sm text-quaternary" }, "Start a conversation! We're here to help."), messages.map((message, index) => {
+      /* @__PURE__ */ React63.createElement(X, { className: "size-5" })
+    )), /* @__PURE__ */ React63.createElement("ul", { className: "flex flex-1 flex-col gap-4 overflow-y-auto px-4 py-4" }, messages.length === 0 && /* @__PURE__ */ React63.createElement("li", { className: "mt-5 text-center text-sm text-quaternary" }, "Start a conversation! We're here to help."), messages.map((message, index) => {
       var _a, _b, _c, _d;
       const isUser = message.sender_type === "contact";
       const prevMessage = index > 0 ? messages[index - 1] : null;
       const showAvatar = !isUser && (!prevMessage || prevMessage.sender_type === "contact");
-      return /* @__PURE__ */ React62.createElement(
+      return /* @__PURE__ */ React63.createElement(
         "li",
         {
           key: message.id,
@@ -19920,7 +19975,7 @@ function ChatWidget({
             isUser ? "self-end pl-10" : "pr-8"
           )
         },
-        !isUser && showAvatar && /* @__PURE__ */ React62.createElement(
+        !isUser && showAvatar && /* @__PURE__ */ React63.createElement(
           Avatar,
           {
             size: "sm",
@@ -19930,8 +19985,8 @@ function ChatWidget({
             initials: ((_c = teamMembers[0]) == null ? void 0 : _c.photo_url) ? void 0 : (((_d = teamMembers[0]) == null ? void 0 : _d.name) || message.sender_display_name).split(" ").map((n) => n[0]).join("").toUpperCase().slice(0, 2)
           }
         ),
-        !isUser && !showAvatar && /* @__PURE__ */ React62.createElement("div", { className: "size-8 shrink-0" }),
-        /* @__PURE__ */ React62.createElement("article", { className: "flex min-w-0 flex-1 flex-col gap-1" }, /* @__PURE__ */ React62.createElement("header", { className: "flex items-center gap-2 px-0.5" }, /* @__PURE__ */ React62.createElement("cite", { className: "flex-1 truncate text-xs font-medium text-tertiary not-italic" }, isUser ? providedDisplayName || "You" : message.sender_display_name), /* @__PURE__ */ React62.createElement("time", { className: "text-xs text-quaternary", dateTime: message.created_at }, formatTime(message.created_at))), /* @__PURE__ */ React62.createElement(
+        !isUser && !showAvatar && /* @__PURE__ */ React63.createElement("div", { className: "size-8 shrink-0" }),
+        /* @__PURE__ */ React63.createElement("article", { className: "flex min-w-0 flex-1 flex-col gap-1" }, /* @__PURE__ */ React63.createElement("header", { className: "flex items-center gap-2 px-0.5" }, /* @__PURE__ */ React63.createElement("cite", { className: "flex-1 truncate text-xs font-medium text-tertiary not-italic" }, isUser ? providedDisplayName || "You" : message.sender_display_name), /* @__PURE__ */ React63.createElement("time", { className: "text-xs text-quaternary", dateTime: message.created_at }, formatTime(message.created_at))), /* @__PURE__ */ React63.createElement(
           "div",
           {
             className: cx(
@@ -19945,18 +20000,18 @@ function ChatWidget({
           message.body
         ))
       );
-    }), waitingForReply && /* @__PURE__ */ React62.createElement("li", { className: "relative flex items-start gap-3 pr-8" }, /* @__PURE__ */ React62.createElement(Avatar, { size: "sm", className: "shrink-0" }), /* @__PURE__ */ React62.createElement("article", { className: "flex min-w-0 flex-1 flex-col gap-1" }, /* @__PURE__ */ React62.createElement("div", { className: "flex h-9 w-16 items-center justify-center gap-1 rounded-xl rounded-tl-none bg-secondary ring-1 ring-inset ring-secondary" }, /* @__PURE__ */ React62.createElement("div", { className: "size-1.5 animate-bounce rounded-full bg-fg-tertiary [animation-delay:-0.3s]" }), /* @__PURE__ */ React62.createElement("div", { className: "size-1.5 animate-bounce rounded-full bg-fg-quaternary [animation-delay:-0.15s]" }), /* @__PURE__ */ React62.createElement("div", { className: "size-1.5 animate-bounce rounded-full bg-fg-tertiary" })))), /* @__PURE__ */ React62.createElement("div", { ref: messagesEndRef })), /* @__PURE__ */ React62.createElement("div", { className: "flex gap-2 border-t border-secondary p-3" }, /* @__PURE__ */ React62.createElement(
+    }), waitingForReply && /* @__PURE__ */ React63.createElement("li", { className: "relative flex items-start gap-3 pr-8" }, /* @__PURE__ */ React63.createElement(Avatar, { size: "sm", className: "shrink-0" }), /* @__PURE__ */ React63.createElement("article", { className: "flex min-w-0 flex-1 flex-col gap-1" }, /* @__PURE__ */ React63.createElement("div", { className: "flex h-9 w-16 items-center justify-center gap-1 rounded-xl rounded-tl-none bg-secondary ring-1 ring-inset ring-secondary" }, /* @__PURE__ */ React63.createElement("div", { className: "size-1.5 animate-bounce rounded-full bg-fg-tertiary [animation-delay:-0.3s]" }), /* @__PURE__ */ React63.createElement("div", { className: "size-1.5 animate-bounce rounded-full bg-fg-quaternary [animation-delay:-0.15s]" }), /* @__PURE__ */ React63.createElement("div", { className: "size-1.5 animate-bounce rounded-full bg-fg-tertiary" })))), /* @__PURE__ */ React63.createElement("div", { ref: messagesEndRef })), /* @__PURE__ */ React63.createElement("div", { className: "flex gap-2 border-t border-secondary p-3" }, /* @__PURE__ */ React63.createElement(
       "input",
       {
         type: "text",
         value: inputValue,
         onChange: (e) => setInputValue(e.target.value),
-        onKeyPress: handleKeyPress,
+        onKeyDown: handleKeyDown,
         placeholder: "Type a message...",
         disabled: isLoading,
         className: "flex-1 rounded-lg border border-secondary bg-primary px-3 py-2.5 text-sm text-primary outline-none ring-brand transition-colors placeholder:text-placeholder focus:border-brand focus:ring-1 disabled:cursor-not-allowed disabled:bg-disabled"
       }
-    ), /* @__PURE__ */ React62.createElement(
+    ), /* @__PURE__ */ React63.createElement(
       "button",
       {
         onClick: sendMessage,
@@ -20009,6 +20064,7 @@ export {
   ComboBox,
   ContactHome2 as ContactHome,
   ContactSection5 as ContactSection,
+  EmailSignupSection,
   FAQGrid3 as FAQGrid,
   FAQHero3 as FAQHero,
   FAQHome4 as FAQHome,