@harshit-wander/component-lib 1.1.15 → 1.1.16

package/dist/index.cjs

@@ -606,6 +606,127 @@ var GalleryPhoto = react.forwardRef(
   )
 );
 GalleryPhoto.displayName = "GalleryPhoto";
+var useInViewOnce = (ref, { disabled = false, rootMargin = "200px" } = {}) => {
+  const [inView, setInView] = react.useState(disabled);
+  react.useEffect(() => {
+    if (disabled || inView) return;
+    const el = ref.current;
+    if (!el || typeof IntersectionObserver === "undefined") {
+      setInView(true);
+      return;
+    }
+    const observer = new IntersectionObserver(
+      (entries) => {
+        for (const entry of entries) {
+          if (entry.isIntersecting) {
+            setInView(true);
+            observer.disconnect();
+            break;
+          }
+        }
+      },
+      { rootMargin }
+    );
+    observer.observe(el);
+    return () => observer.disconnect();
+  }, [ref, disabled, inView, rootMargin]);
+  return inView;
+};
+var DEFAULT_HEIGHTS = [200, 260, 264];
+var DEFAULT_WIDTHS = [148, 220, 176];
+var DEFAULT_EAGER_COUNT = 6;
+var Slide = ({
+  item,
+  index,
+  size,
+  eagerCount
+}) => {
+  const ref = react.useRef(null);
+  const lazy = index >= eagerCount;
+  const visible = useInViewOnce(ref, { disabled: !lazy });
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      ref,
+      className: "shrink-0 relative rounded-sm overflow-hidden bg-track",
+      style: { width: size.width, height: size.height },
+      children: visible ? /* @__PURE__ */ jsxRuntime.jsx(
+        "img",
+        {
+          src: item.src,
+          alt: item.alt ?? "",
+          loading: "eager",
+          decoding: "async",
+          className: "w-full h-full object-cover object-center block pointer-events-none select-none"
+        }
+      ) : null
+    }
+  );
+};
+var ImageMarquee = ({
+  images,
+  durationSec = 45,
+  gap = 16,
+  fixedWidth,
+  alternatingHeights,
+  eagerImageCount = DEFAULT_EAGER_COUNT,
+  className
+}) => {
+  const sizes = react.useMemo(() => {
+    const useFixed = typeof fixedWidth === "number" && fixedWidth > 0 && Array.isArray(alternatingHeights) && alternatingHeights.length > 0;
+    return images.map((_, i) => {
+      if (useFixed) {
+        const heights = alternatingHeights;
+        return { width: fixedWidth, height: heights[i % heights.length] };
+      }
+      const v = i % 3;
+      return { width: DEFAULT_WIDTHS[v], height: DEFAULT_HEIGHTS[v] };
+    });
+  }, [images, fixedWidth, alternatingHeights]);
+  if (!images.length) return null;
+  const renderStrip = (keyPrefix, hidden = false) => /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      className: "flex flex-row items-center shrink-0",
+      style: { gap, paddingRight: gap },
+      "aria-hidden": hidden || void 0,
+      children: images.map((item, i) => {
+        const slideKey = `${keyPrefix}-${i}-${item.src}`;
+        return /* @__PURE__ */ jsxRuntime.jsx(
+          Slide,
+          {
+            item,
+            index: i,
+            size: sizes[i],
+            eagerCount: eagerImageCount
+          },
+          slideKey
+        );
+      })
+    }
+  );
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      className: cn(
+        "w-full relative overflow-hidden max-md:overflow-x-auto max-md:[scrollbar-width:none]",
+        className
+      ),
+      children: /* @__PURE__ */ jsxRuntime.jsxs(
+        "div",
+        {
+          className: "flex flex-row items-center w-max will-change-transform animate-marquee",
+          style: { animationDuration: `${durationSec}s` },
+          children: [
+            renderStrip("a"),
+            renderStrip("b", true)
+          ]
+        }
+      )
+    }
+  );
+};
+ImageMarquee.displayName = "ImageMarquee";
 var LocationCard = react.forwardRef(
   ({ location, address, logo, className, ...rest }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
     "article",
@@ -633,6 +754,55 @@ var LocationCard = react.forwardRef(
   )
 );
 LocationCard.displayName = "LocationCard";
+var ClockSvg = () => /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", "aria-hidden": "true", children: [
+  /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "1.5" }),
+  /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M12 6.5V12l4 2", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" })
+] });
+var cardClass3 = "group relative flex flex-col justify-end shrink-0 w-[275px] h-[416px] overflow-hidden bg-lux-ink-card border-[3.5px] border-lux-gold-light no-underline text-inherit focus-visible:outline-2 focus-visible:outline-lux-gold focus-visible:outline-offset-2";
+var LuxuryTripCard = react.forwardRef(
+  ({ image, alt, title, duration, href, className, ...rest }, ref) => {
+    const content = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "img",
+        {
+          src: image,
+          alt,
+          loading: "lazy",
+          decoding: "async",
+          className: "absolute inset-0 w-full h-full object-cover object-center pointer-events-none"
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "span",
+        {
+          "aria-hidden": "true",
+          className: "absolute inset-0 pointer-events-none bg-[linear-gradient(to_top,rgba(0,0,0,0.85)_0%,rgba(0,0,0,0.45)_45%,transparent_72%)]"
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative z-10 flex flex-col gap-sm px-[14px] pt-md pb-[14px]", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "m-0 font-luxury text-md font-medium leading-[18.879px] text-lux-on-dark break-words", children: title }),
+        duration ? /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "inline-flex items-center gap-xs text-[11px] font-medium text-lux-on-dark", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "inline-flex items-center justify-center text-lux-gold", children: /* @__PURE__ */ jsxRuntime.jsx(ClockSvg, {}) }),
+          duration
+        ] }) : null
+      ] })
+    ] });
+    if (href) {
+      return /* @__PURE__ */ jsxRuntime.jsx(
+        "a",
+        {
+          ref,
+          href,
+          className: cn(cardClass3, className),
+          ...rest,
+          children: content
+        }
+      );
+    }
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: cn(cardClass3, className), ...rest, children: content });
+  }
+);
+LuxuryTripCard.displayName = "LuxuryTripCard";
 var tabBase = "shrink-0 inline-flex items-center h-[34px] py-[5px] px-[17px] rounded-full font-[inherit] text-xs font-normal leading-4 whitespace-nowrap cursor-pointer transition-colors duration-150 ease-in focus-visible:outline-2 focus-visible:outline-accent focus-visible:outline-offset-2";
 var tabActive = "bg-tab-active-bg border border-text-emphasis text-text-emphasis";
 var tabInactive = "bg-transparent border border-tab-inactive-border text-text-faded";
@@ -664,7 +834,7 @@ var MonthTabs = react.forwardRef(
   ] })
 );
 MonthTabs.displayName = "MonthTabs";
-var ClockSvg = () => /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "16", height: "16", viewBox: "0 0 18 18", fill: "none", "aria-hidden": "true", children: [
+var ClockSvg2 = () => /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "16", height: "16", viewBox: "0 0 18 18", fill: "none", "aria-hidden": "true", children: [
   /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "9", cy: "9", r: "6.5", stroke: "currentColor", strokeWidth: "1.4" }),
   /* @__PURE__ */ jsxRuntime.jsx(
     "path",
@@ -699,7 +869,7 @@ var CalendarSvg = () => /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "16", he
     }
   )
 ] });
-var cardClass3 = "relative flex flex-col justify-between shrink-0 w-[264px] h-[392px] py-[12px] px-md rounded-md overflow-hidden no-underline text-inherit snap-start focus-visible:outline-2 focus-visible:outline-accent focus-visible:outline-offset-2 max-md:w-[320px]";
+var cardClass4 = "relative flex flex-col justify-between shrink-0 w-[264px] h-[392px] py-[12px] px-md rounded-md overflow-hidden no-underline text-inherit snap-start focus-visible:outline-2 focus-visible:outline-accent focus-visible:outline-offset-2 max-md:w-[320px]";
 var infoItemClass = "flex items-center gap-xs min-w-0 text-xs font-medium leading-5 text-info-on-dark";
 var infoIconClass = "inline-flex items-center justify-center w-[18px] h-[18px] shrink-0";
 var PackageCard = react.forwardRef(
@@ -745,7 +915,7 @@ var PackageCard = react.forwardRef(
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-xs min-w-0", children: [
           /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-xl min-w-0", children: [
             /* @__PURE__ */ jsxRuntime.jsxs("span", { className: cn(infoItemClass, "shrink-0"), children: [
-              /* @__PURE__ */ jsxRuntime.jsx("span", { className: infoIconClass, children: /* @__PURE__ */ jsxRuntime.jsx(ClockSvg, {}) }),
+              /* @__PURE__ */ jsxRuntime.jsx("span", { className: infoIconClass, children: /* @__PURE__ */ jsxRuntime.jsx(ClockSvg2, {}) }),
               /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate", children: duration })
             ] }),
             /* @__PURE__ */ jsxRuntime.jsxs("span", { className: cn(infoItemClass, "flex-1"), children: [
@@ -766,13 +936,13 @@ var PackageCard = react.forwardRef(
         {
           ref,
           href,
-          className: cn(cardClass3, className),
+          className: cn(cardClass4, className),
           ...rest,
           children: content
         }
       );
     }
-    return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: cn(cardClass3, className), ...rest, children: content });
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: cn(cardClass4, className), ...rest, children: content });
   }
 );
 PackageCard.displayName = "PackageCard";
@@ -901,7 +1071,7 @@ var TestimonialCard = react.forwardRef(
   }
 );
 TestimonialCard.displayName = "TestimonialCard";
-var cardClass4 = "relative flex flex-col justify-end shrink-0 w-[200px] h-[316px] p-[20px] border-2 border-surface rounded-lg overflow-hidden no-underline text-inherit snap-start focus-visible:outline-2 focus-visible:outline-accent focus-visible:outline-offset-2";
+var cardClass5 = "relative flex flex-col justify-end shrink-0 w-[200px] h-[316px] p-[20px] border-2 border-surface rounded-lg overflow-hidden no-underline text-inherit snap-start focus-visible:outline-2 focus-visible:outline-accent focus-visible:outline-offset-2";
 var TripCategoryCard = react.forwardRef(
   ({ image, mobileImage, alt, destination, startingPrice, href, className, ...rest }, ref) => {
     const content = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
@@ -936,13 +1106,13 @@ var TripCategoryCard = react.forwardRef(
         {
           ref,
           href,
-          className: cn(cardClass4, className),
+          className: cn(cardClass5, className),
           ...rest,
           children: content
         }
       );
     }
-    return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: cn(cardClass4, className), ...rest, children: content });
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: cn(cardClass5, className), ...rest, children: content });
   }
 );
 TripCategoryCard.displayName = "TripCategoryCard";
@@ -2410,6 +2580,579 @@ var HomeHero = react.forwardRef(
   }
 );
 HomeHero.displayName = "HomeHero";
+var navClass = "sticky top-0 z-30 flex w-full flex-col border-b border-lux-gold bg-white/60 backdrop-blur-[2px]";
+var scrollClass = "flex flex-1 flex-row flex-nowrap items-end justify-start gap-0 overflow-x-auto overflow-y-hidden px-md pt-3 [-webkit-overflow-scrolling:touch] [scrollbar-width:none] [&::-webkit-scrollbar]:hidden md:justify-center md:px-lg";
+var dotClass = "block size-1 shrink-0 self-center rounded-full bg-lux-gold-strong opacity-85";
+var itemClass = "shrink-0 cursor-pointer whitespace-nowrap border-b-2 px-2.5 pt-3 pb-3.5 text-center text-sm font-medium uppercase leading-button tracking-[0.12em] focus-visible:outline-2 focus-visible:outline-lux-gold md:px-3.5 md:pt-2.5 md:pb-3 md:text-xs";
+var activeItemClass = "border-lux-gold-strong text-lux-gold-strong";
+var inactiveItemClass = "border-transparent text-lux-text";
+var LuxuryCategoryNav = ({
+  items,
+  defaultActiveId,
+  onActiveChange,
+  className,
+  ...rest
+}) => {
+  const [activeId, setActiveId] = react.useState(defaultActiveId);
+  const select = react.useCallback(
+    (id) => {
+      setActiveId(id);
+      onActiveChange?.(id);
+    },
+    [onActiveChange]
+  );
+  if (!items.length) {
+    return null;
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx("nav", { "aria-label": "Luxury experience categories", className: cn(navClass, className), ...rest, children: /* @__PURE__ */ jsxRuntime.jsx("div", { role: "tablist", className: scrollClass, children: items.map((item, index) => {
+    const isActive = activeId === item.id;
+    return /* @__PURE__ */ jsxRuntime.jsxs(react.Fragment, { children: [
+      index > 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": "true", className: dotClass }) : null,
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "button",
+        {
+          type: "button",
+          role: "tab",
+          "aria-selected": isActive,
+          onClick: () => select(item.id),
+          className: cn(itemClass, isActive ? activeItemClass : inactiveItemClass),
+          children: item.label
+        }
+      )
+    ] }, item.id);
+  }) }) });
+};
+LuxuryCategoryNav.displayName = "LuxuryCategoryNav";
+var sectionClass = "relative flex w-full flex-col overflow-hidden bg-lux-ink md:mx-auto md:max-w-[1162px] md:bg-background md:px-[30px] md:pt-[64px] md:pb-[26px]";
+var innerClass = "relative z-[3] md:mx-auto md:w-full md:max-w-[1200px]";
+var badgeClass = "mb-[14px] inline-block self-start rounded-full border border-lux-gold-strong px-md py-[6px] text-2xs font-semibold uppercase leading-button tracking-[0.16em] text-lux-gold-strong md:mx-auto md:mb-[20px] md:self-center md:text-xs md:tracking-[0.14em]";
+var titleClass = "m-0 mb-sm font-luxury text-xl font-medium leading-[1.2] tracking-[0.03em] text-lux-on-dark md:mx-auto md:mb-[28px] md:text-center md:text-[40px] md:font-regular md:tracking-[0.02em] md:text-lux-heading";
+var descriptionWrapClass = "flex flex-col gap-md md:mb-[60px]";
+var paragraphClass = "m-0 text-md font-regular leading-body text-lux-on-dark md:text-justify md:text-lux-text";
+var scrollerClass = "flex flex-row flex-nowrap items-stretch gap-md overflow-x-auto overflow-y-hidden overscroll-x-contain px-[16px] pt-[12px] pb-[80px] [scrollbar-width:none] [&::-webkit-scrollbar]:hidden md:gap-[18px] md:px-0 md:pt-[4px] md:pb-md";
+var LuxuryDestinationSection = react.forwardRef(
+  ({ badge, title, description, heroImage, heroVideo, trips, className, ...rest }, ref) => {
+    const paragraphs = description ? description.split("\n").filter((p) => p.trim() !== "") : [];
+    const showHeroFrame = Boolean(heroVideo?.src || heroImage?.src);
+    const heroPoster = heroVideo?.poster ?? heroImage?.src;
+    const wrapperRef = react.useRef(null);
+    const mobileVideoRef = react.useRef(null);
+    const desktopVideoRef = react.useRef(null);
+    react.useEffect(() => {
+      const src = heroVideo?.src;
+      if (!src || typeof window === "undefined") return;
+      const wrapper = wrapperRef.current;
+      if (!wrapper) return;
+      const assign = () => {
+        const isDesktop = typeof window.matchMedia === "function" && window.matchMedia("(min-width: 768px)").matches;
+        const target = isDesktop ? desktopVideoRef.current : mobileVideoRef.current;
+        if (target && !target.src) target.src = src;
+      };
+      if (typeof IntersectionObserver === "undefined") {
+        assign();
+        return;
+      }
+      const io = new IntersectionObserver(
+        (entries) => {
+          if (entries[0]?.isIntersecting) {
+            assign();
+            io.disconnect();
+          }
+        },
+        { rootMargin: "200px" }
+      );
+      io.observe(wrapper);
+      return () => io.disconnect();
+    }, [heroVideo?.src]);
+    return /* @__PURE__ */ jsxRuntime.jsxs("section", { ref, className: cn(sectionClass, className), ...rest, children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(
+        "div",
+        {
+          ref: wrapperRef,
+          className: "absolute inset-x-0 top-0 bottom-[40vh] z-0 overflow-hidden md:hidden",
+          "aria-hidden": "true",
+          children: [
+            heroVideo?.src ? /* @__PURE__ */ jsxRuntime.jsx(
+              "video",
+              {
+                ref: mobileVideoRef,
+                autoPlay: true,
+                muted: true,
+                loop: true,
+                playsInline: true,
+                poster: heroVideo.poster ?? heroImage?.src,
+                preload: "none",
+                className: "absolute inset-0 h-full w-full object-cover object-center"
+              }
+            ) : heroPoster ? /* @__PURE__ */ jsxRuntime.jsx(
+              "img",
+              {
+                src: heroPoster,
+                alt: "",
+                loading: "lazy",
+                decoding: "async",
+                className: "absolute inset-0 h-full w-full object-cover object-center"
+              }
+            ) : null,
+            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute inset-0 bg-[linear-gradient(to_bottom,rgba(0,0,0,0)_0%,rgba(0,0,0,0.2)_30%,rgba(0,0,0,0.4)_50%,rgba(0,0,0,0.7)_70%,rgba(0,0,0,1)_100%)]" })
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: innerClass, children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-start px-[20px] pt-[20px] md:items-stretch md:px-0 md:pt-0", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: badgeClass, children: badge }),
+          /* @__PURE__ */ jsxRuntime.jsx("h2", { className: titleClass, children: title }),
+          showHeroFrame ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative mx-auto mb-[28px] hidden w-full max-w-[1162px] border border-lux-gold bg-background md:block", children: heroVideo?.src ? /* @__PURE__ */ jsxRuntime.jsx(
+            "video",
+            {
+              ref: desktopVideoRef,
+              autoPlay: true,
+              muted: true,
+              loop: true,
+              playsInline: true,
+              poster: heroVideo.poster ?? heroImage?.src,
+              preload: "none",
+              className: "block max-h-[626px] w-full object-cover object-center align-middle"
+            }
+          ) : heroImage?.src ? /* @__PURE__ */ jsxRuntime.jsx(
+            "img",
+            {
+              src: heroImage.src,
+              alt: heroImage.alt ?? "",
+              loading: "lazy",
+              decoding: "async",
+              className: "block h-[625px] w-full object-cover object-center"
+            }
+          ) : null }) : null,
+          paragraphs.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: descriptionWrapClass, children: paragraphs.map((paragraph) => /* @__PURE__ */ jsxRuntime.jsx("p", { className: paragraphClass, children: paragraph }, paragraph)) }) : null
+        ] }),
+        trips.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx("ul", { className: cn(scrollerClass, "m-0 list-none"), children: trips.map((trip, index) => /* @__PURE__ */ jsxRuntime.jsx("li", { className: "shrink-0", children: /* @__PURE__ */ jsxRuntime.jsx(LuxuryTripCard, { ...trip }) }, trip.href ?? `${trip.title}-${index}`)) }) : null
+      ] })
+    ] });
+  }
+);
+LuxuryDestinationSection.displayName = "LuxuryDestinationSection";
+var rootClass = "relative flex flex-col w-full min-h-[calc(100dvh-60px)] overflow-hidden bg-lux-ink";
+var ctaClass = "appearance-none cursor-pointer uppercase tracking-[0.14em] rounded-full px-[28px] py-md text-sm font-semibold leading-[22.154px] text-center text-[#2C2C2C] bg-lux-gold-gradient shadow-[0_0_18.461px_1.846px_rgba(153,91,18,0.3)_inset] transition-[opacity,transform] duration-200 ease-out hover:opacity-[0.92] active:scale-[0.98] focus-visible:outline-2 focus-visible:outline-lux-gold focus-visible:outline-offset-2 md:bg-none md:bg-transparent md:shadow-none md:text-lux-gold md:border md:border-lux-gold md:text-[13px] md:py-[18px] md:px-[36px] md:hover:bg-[rgba(197,160,89,0.08)] md:hover:opacity-100";
+var LuxuryHero = react.forwardRef(
+  ({
+    videoSrc,
+    videoPoster,
+    videoType: _videoType = "video/mp4",
+    title = "WanderOn Experiences",
+    subline1,
+    subline2,
+    ctaLabel = "Connect with Concierge",
+    onCtaClick,
+    homeHref = "/",
+    logoSrc,
+    showLogo = true,
+    className,
+    ...rest
+  }, ref) => {
+    const videoRef = react.useRef(null);
+    react.useEffect(() => {
+      const video = videoRef.current;
+      if (!video || !videoSrc) return;
+      video.src = videoSrc;
+    }, [videoSrc]);
+    return /* @__PURE__ */ jsxRuntime.jsxs("section", { ref, className: cn(rootClass, className), ...rest, children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "div",
+        {
+          className: "absolute inset-0 z-0 overflow-hidden pointer-events-none",
+          "aria-hidden": "true",
+          children: /* @__PURE__ */ jsxRuntime.jsx(
+            "video",
+            {
+              ref: videoRef,
+              autoPlay: true,
+              muted: true,
+              loop: true,
+              playsInline: true,
+              poster: videoPoster,
+              preload: "metadata",
+              className: "absolute top-0 left-0 w-full h-full object-cover object-center"
+            }
+          )
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "div",
+        {
+          "aria-hidden": "true",
+          className: "absolute inset-0 z-[1] bg-[linear-gradient(180deg,rgba(12,6,14,0.55)_0%,rgba(12,6,14,0.65)_45%,rgba(12,6,14,0.75)_100%)]"
+        }
+      ),
+      showLogo ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative z-[2] flex shrink-0 items-start justify-start px-[20px] pt-lg md:px-[48px] md:pt-xl", children: /* @__PURE__ */ jsxRuntime.jsx(
+        "a",
+        {
+          href: homeHref,
+          "aria-label": "WanderOn home",
+          className: "flex flex-col items-center no-underline cursor-pointer focus-visible:outline-2 focus-visible:outline-lux-gold focus-visible:outline-offset-2",
+          children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "relative block w-[44px] h-[44px] md:w-[52px] md:h-[52px]", children: logoSrc ? /* @__PURE__ */ jsxRuntime.jsx(
+            "img",
+            {
+              src: logoSrc,
+              alt: "",
+              loading: "lazy",
+              decoding: "async",
+              className: "w-full h-full object-contain"
+            }
+          ) : null })
+        }
+      ) }) : null,
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative z-[2] flex flex-1 flex-col items-center justify-center text-center min-h-0 px-[20px] pt-lg pb-xl md:px-[48px] md:pt-[40px] md:pb-[48px]", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("h1", { className: "m-0 font-luxury text-2xl font-medium leading-[38px] tracking-[0.02em] text-center text-[#F1F5F9] [text-shadow:2px_4px_15px_rgba(0,0,0,0.4)]", children: title }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "lux-gold-rule w-[160px] mx-auto mt-[20px] md:w-[96px] md:mt-lg" }),
+        subline1 ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "m-0 mt-md text-center text-sm font-regular leading-6 text-lux-on-dark md:mt-[20px]", children: subline1 }) : null,
+        subline2 ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "m-0 mt-sm text-center text-sm font-regular leading-6 text-lux-on-dark", children: subline2 }) : null
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative z-[2] flex shrink-0 justify-center px-[20px] pb-[40px] md:px-[48px] md:pb-[48px]", children: /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", onClick: () => onCtaClick?.(), className: ctaClass, children: ctaLabel }) })
+    ] });
+  }
+);
+LuxuryHero.displayName = "LuxuryHero";
+var DEFAULT_DIAL = "+91";
+var DEFAULT_DIAL_CODES = [
+  { code: "+91", label: "India (+91)" },
+  { code: "+1", label: "USA (+1)" },
+  { code: "+44", label: "UK (+44)" },
+  { code: "+971", label: "UAE (+971)" }
+];
+var sectionClass2 = "relative w-full min-w-0 bg-transparent";
+var cardClass6 = "mx-auto max-w-[1040px] rounded-sm bg-lux-on-dark px-[clamp(20px,4vw,56px)] py-[clamp(28px,5vw,52px)] text-lux-text shadow-[0_1px_0_rgba(0,0,0,0.04),0_12px_40px_rgba(0,0,0,0.12)]";
+var layoutClass = "flex min-w-0 flex-col gap-[28px] md:flex-row md:items-center md:justify-between md:gap-[clamp(32px,5vw,56px)]";
+var mainClass = "flex min-w-0 flex-1 flex-col items-stretch md:max-w-[680px]";
+var headingClass = "mb-[10px] mt-0 text-left font-luxury text-[clamp(24px,4.5vw,34px)] font-semibold leading-heading text-lux-ink";
+var subheadingClass = "mb-[28px] mt-0 text-left text-[clamp(14px,2.8vw,17px)] font-medium leading-body text-lux-heading md:mb-lg";
+var lineInputClass = "w-full rounded-none border-0 border-b border-b-[#999999] bg-lux-on-dark px-0 pb-[10px] pt-[12px] text-md font-regular text-lux-text outline-none transition-colors placeholder:text-[#A9A9A9] focus:border-b-lux-gold disabled:cursor-not-allowed disabled:opacity-60";
+var dialSelectClass = "block w-full min-w-[90px] max-w-[96px] cursor-pointer appearance-none rounded-none border-0 border-b border-b-[#999999] bg-lux-on-dark bg-[right_2px_center] bg-no-repeat py-[10px] pl-0 pr-[24px] text-[15px] font-medium text-lux-text outline-none transition-colors focus:border-b-lux-gold disabled:cursor-not-allowed disabled:opacity-60";
+var errorClass = "mt-[6px] block text-xs text-danger";
+var actionClass = "relative z-[1] inline-flex min-h-[52px] w-full items-center justify-center gap-[10px] whitespace-nowrap rounded-full border-0 bg-lux-gold-gradient px-[28px] py-md text-xs font-bold tracking-[0.06em] text-lux-text shadow-[0_2px_12px_rgba(184,134,11,0.25)] transition-[opacity,transform] hover:not-disabled:-translate-y-px focus-visible:outline-2 focus-visible:outline-lux-gold focus-visible:outline-offset-2 disabled:cursor-not-allowed disabled:opacity-75 md:w-auto md:min-w-[240px] md:px-xl";
+var spinnerClass = "h-[22px] w-[22px] animate-spin rounded-full border-2 border-lux-text/25 border-t-lux-text";
+var toastBaseClass = "fixed bottom-[18vh] left-1/2 z-20 -translate-x-1/2 rounded-md border border-lux-gold/50 bg-[linear-gradient(180deg,#F3E5AB_0%,#D4AF37_100%)] px-lg py-md text-[15px] font-medium leading-body text-lux-text shadow-[0_4px_20px_rgba(0,0,0,0.15)] transition-opacity duration-300 max-[600px]:bottom-lg max-[600px]:left-md max-[600px]:right-md max-[600px]:translate-x-0";
+var SelectChevron = () => /* @__PURE__ */ jsxRuntime.jsx(
+  "svg",
+  {
+    className: "pointer-events-none absolute right-[2px] top-1/2 -translate-y-1/2",
+    width: "12",
+    height: "12",
+    viewBox: "0 0 12 12",
+    fill: "none",
+    "aria-hidden": "true",
+    children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M6 8L1 3h10z", fill: "#666666" })
+  }
+);
+var ConciergeIcon = () => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "22", height: "22", viewBox: "0 0 24 24", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(
+  "path",
+  {
+    d: "M12 12a4 4 0 100-8 4 4 0 000 8zM4 20a8 8 0 0116 0",
+    stroke: "currentColor",
+    strokeWidth: "1.5",
+    strokeLinecap: "round"
+  }
+) });
+var LuxuryInquiryForm = ({
+  onSubmit,
+  title = "Bespoke Inquiries",
+  subheading = "Your dedicated concierge awaits to craft your unforgettable journey!",
+  namePlaceholder = "enter your name",
+  phonePlaceholder = "enter your mobile Number",
+  dialCodes = DEFAULT_DIAL_CODES,
+  className,
+  ...rest
+}) => {
+  const [name, setName] = react.useState("");
+  const [dialCode, setDialCode] = react.useState(dialCodes[0]?.code ?? DEFAULT_DIAL);
+  const [phoneLocal, setPhoneLocal] = react.useState("");
+  const [errors, setErrors] = react.useState({});
+  const [submitting, setSubmitting] = react.useState(false);
+  const [toastOn, setToastOn] = react.useState(false);
+  const fullMobile = () => {
+    const digits = phoneLocal.replace(/\D/g, "");
+    const code = dialCode.replace(/\s/g, "") || DEFAULT_DIAL;
+    return `${code}${digits}`;
+  };
+  const validate = () => {
+    const next = {};
+    if (!name.trim()) next.name = "Name is required";
+    const digits = phoneLocal.replace(/\D/g, "");
+    if (!digits) next.mobile = "Phone number is required";
+    else if (digits.length < 6 || digits.length > 15) {
+      next.mobile = "Enter a valid phone number";
+    }
+    setErrors(next);
+    return Object.keys(next).length === 0;
+  };
+  const handleSubmit = async (e) => {
+    e.preventDefault();
+    if (!validate()) return;
+    const mobile = fullMobile();
+    setSubmitting(true);
+    setErrors({});
+    try {
+      await Promise.resolve(onSubmit({ name: name.trim(), mobile }));
+      setName("");
+      setPhoneLocal("");
+      setDialCode(dialCodes[0]?.code ?? DEFAULT_DIAL);
+      setToastOn(true);
+      setTimeout(() => setToastOn(false), 4e3);
+    } catch (err) {
+      const message = err instanceof Error ? err.message : "Something went wrong. Please try again.";
+      setErrors((prev) => ({ ...prev, form: message }));
+    } finally {
+      setSubmitting(false);
+    }
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "section",
+    {
+      className: cn(sectionClass2, className),
+      "aria-labelledby": "luxury-inquiry-title",
+      ...rest,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: cardClass6, children: /* @__PURE__ */ jsxRuntime.jsx("form", { onSubmit: handleSubmit, noValidate: true, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: layoutClass, children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: mainClass, children: [
+            /* @__PURE__ */ jsxRuntime.jsx(
+              "div",
+              {
+                className: "mb-[20px] flex h-12 w-12 items-center justify-center rounded-full bg-lux-gold-light text-lux-gold-strong md:hidden",
+                "aria-hidden": "true",
+                children: /* @__PURE__ */ jsxRuntime.jsx(ConciergeIcon, {})
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsx("h2", { id: "luxury-inquiry-title", className: headingClass, children: title }),
+            /* @__PURE__ */ jsxRuntime.jsx("p", { className: subheadingClass, children: subheading }),
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex w-full min-w-0 flex-col gap-[22px]", children: [
+              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-full min-w-0", children: [
+                /* @__PURE__ */ jsxRuntime.jsx("label", { className: "sr-only", htmlFor: "luxury-inquiry-name", children: "Name" }),
+                /* @__PURE__ */ jsxRuntime.jsx(
+                  "input",
+                  {
+                    id: "luxury-inquiry-name",
+                    className: lineInputClass,
+                    type: "text",
+                    name: "name",
+                    placeholder: namePlaceholder,
+                    value: name,
+                    onChange: (e) => setName(e.target.value),
+                    disabled: submitting,
+                    autoComplete: "name",
+                    "aria-required": "true",
+                    "aria-invalid": !!errors.name
+                  }
+                ),
+                errors.name && /* @__PURE__ */ jsxRuntime.jsx("span", { className: errorClass, role: "alert", children: errors.name })
+              ] }),
+              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-full min-w-0", children: [
+                /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex w-full min-w-0 flex-row items-end gap-[12px]", children: [
+                  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative min-w-0 flex-none", children: [
+                    /* @__PURE__ */ jsxRuntime.jsx("label", { className: "sr-only", htmlFor: "luxury-inquiry-dial", children: "Country calling code" }),
+                    /* @__PURE__ */ jsxRuntime.jsx(
+                      "select",
+                      {
+                        id: "luxury-inquiry-dial",
+                        className: dialSelectClass,
+                        name: "dialCode",
+                        value: dialCode,
+                        onChange: (e) => setDialCode(e.target.value),
+                        disabled: submitting,
+                        "aria-label": "Country calling code",
+                        children: dialCodes.map((c) => /* @__PURE__ */ jsxRuntime.jsx("option", { value: c.code, children: c.label }, c.code))
+                      }
+                    ),
+                    /* @__PURE__ */ jsxRuntime.jsx(SelectChevron, {})
+                  ] }),
+                  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0 flex-1", children: [
+                    /* @__PURE__ */ jsxRuntime.jsx("label", { className: "sr-only", htmlFor: "luxury-inquiry-mobile", children: "Mobile number" }),
+                    /* @__PURE__ */ jsxRuntime.jsx(
+                      "input",
+                      {
+                        id: "luxury-inquiry-mobile",
+                        className: lineInputClass,
+                        type: "tel",
+                        name: "mobile",
+                        placeholder: phonePlaceholder,
+                        value: phoneLocal,
+                        onChange: (e) => setPhoneLocal(e.target.value),
+                        disabled: submitting,
+                        autoComplete: "tel-national",
+                        inputMode: "numeric",
+                        "aria-required": "true",
+                        "aria-invalid": !!errors.mobile
+                      }
+                    )
+                  ] })
+                ] }),
+                errors.mobile && /* @__PURE__ */ jsxRuntime.jsx("span", { className: errorClass, role: "alert", children: errors.mobile })
+              ] }),
+              errors.form && /* @__PURE__ */ jsxRuntime.jsx("span", { className: errorClass, role: "alert", children: errors.form })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-none items-center justify-center md:min-w-[220px] md:justify-end md:self-center", children: /* @__PURE__ */ jsxRuntime.jsx(
+            "button",
+            {
+              className: actionClass,
+              type: "submit",
+              disabled: submitting,
+              "aria-busy": submitting,
+              children: submitting ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+                /* @__PURE__ */ jsxRuntime.jsx("span", { className: spinnerClass, "aria-hidden": "true" }),
+                /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Connecting..." })
+              ] }) : /* @__PURE__ */ jsxRuntime.jsx("span", { children: "CONNECT WITH CONCIERGE" })
+            }
+          ) })
+        ] }) }) }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "div",
+          {
+            className: cn(toastBaseClass, toastOn ? "opacity-100" : "pointer-events-none opacity-0"),
+            role: "status",
+            children: "Thank you! Your form has been submitted successfully. We'll be in touch soon."
+          }
+        )
+      ]
+    }
+  );
+};
+LuxuryInquiryForm.displayName = "LuxuryInquiryForm";
+var sectionClass3 = "w-full bg-background px-[20px] pt-[56px] pb-[64px] md:px-[48px] md:pt-[72px] md:pb-[88px]";
+var containerClass2 = "mx-auto flex w-full max-w-[720px] flex-col items-center gap-[20px] text-center md:gap-lg";
+var badgeClass2 = "inline-block rounded-full border border-lux-gold-strong px-md py-[6px] text-xs font-medium uppercase leading-[32px] tracking-[0.14em] text-lux-gold-strong";
+var headingClass2 = "m-0 font-luxury text-xl font-medium capitalize leading-[50px] tracking-[0.02em] text-lux-heading md:text-[40px]";
+var bodyClass = "m-0 max-w-[62ch] text-md font-regular leading-body text-lux-text";
+var LuxuryIntro = react.forwardRef(
+  ({ badge = "Experience", heading, body, className, ...rest }, ref) => /* @__PURE__ */ jsxRuntime.jsx("section", { ref, className: cn(sectionClass3, className), ...rest, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: containerClass2, children: [
+    badge ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: badgeClass2, children: badge }) : null,
+    /* @__PURE__ */ jsxRuntime.jsx("h2", { className: headingClass2, children: heading }),
+    /* @__PURE__ */ jsxRuntime.jsx("p", { className: bodyClass, children: body })
+  ] }) })
+);
+LuxuryIntro.displayName = "LuxuryIntro";
+var sectionClass4 = "w-full bg-background px-[20px] py-[40px] md:px-[48px] md:py-[56px]";
+var headingStackClass = "mx-auto mb-[40px] flex w-full flex-col items-center text-center";
+var badgeClass3 = "mb-[12px] inline-block rounded-full bg-lux-gold-strong px-md py-[6px] text-xs font-semibold uppercase leading-button tracking-[0.14em] text-lux-on-dark";
+var titleClass2 = "m-0 font-luxury text-xl font-medium leading-heading tracking-[0.02em] text-lux-heading md:text-[38px]";
+var rowWrapClass = "relative mx-auto w-full max-w-[1100px]";
+var rowClass2 = "flex snap-x snap-mandatory overflow-x-auto scroll-smooth [scrollbar-width:none] [&::-webkit-scrollbar]:hidden";
+var cardClass7 = "relative w-[90%] shrink-0 snap-center px-lg py-lg md:w-[50%] max-w-[800px] mx-auto";
+var photoGridClass = "relative mb-[30px] h-[180px]";
+var jumpingPhotoClass = "absolute left-0 top-0 h-[139px] w-[100px] -rotate-2 border-2 border-lux-gold object-cover";
+var groupPhotoClass = "absolute bottom-0 left-[70px] h-[97px] w-[180px] -rotate-2 border-2 border-lux-gold object-cover";
+var quoteBaseClass = "mb-[20px] overflow-hidden text-ellipsis text-left text-sm leading-body text-lux-text [display:-webkit-box] [-webkit-box-orient:vertical] md:text-md";
+var readMoreClass = "text-sm font-semibold text-lux-gold-strong underline-offset-2 hover:underline focus-visible:outline-2 focus-visible:outline-lux-gold focus-visible:outline-offset-2";
+var nameClass = "mt-[8px] mb-0 text-right text-sm font-medium text-lux-gold-strong";
+var accentTapeBaseClass = "absolute z-[1] h-[20px] w-[100px] bg-lux-gold-light/60";
+var arrowClass = "absolute top-1/2 z-10 hidden -translate-y-1/2 items-center justify-center rounded-full border border-lux-gold bg-background text-lux-gold-strong shadow-sm md:inline-flex h-[40px] w-[40px] focus-visible:outline-2 focus-visible:outline-lux-gold focus-visible:outline-offset-2";
+var ChevronLeft3 = () => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(
+  "path",
+  {
+    d: "M15 6l-6 6 6 6",
+    stroke: "currentColor",
+    strokeWidth: "1.75",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }
+) });
+var ChevronRight3 = () => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(
+  "path",
+  {
+    d: "M9 6l6 6-6 6",
+    stroke: "currentColor",
+    strokeWidth: "1.75",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }
+) });
+var LuxuryTestimonials = react.forwardRef(
+  ({
+    reviews,
+    heading = "Unfiltered Reviews",
+    badge = "Testimonials",
+    lineClamp,
+    className,
+    ...rest
+  }, ref) => {
+    const rowRef = react.useRef(null);
+    const scrollBy = (direction) => {
+      const row = rowRef.current;
+      if (!row) return;
+      row.scrollBy({ left: direction * row.clientWidth * 0.8, behavior: "smooth" });
+    };
+    const clampStyle = lineClamp ? { WebkitLineClamp: lineClamp } : void 0;
+    return /* @__PURE__ */ jsxRuntime.jsxs("section", { ref, className: cn(sectionClass4, className), ...rest, children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: headingStackClass, children: [
+        badge ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: badgeClass3, children: badge }) : null,
+        /* @__PURE__ */ jsxRuntime.jsx("h2", { className: titleClass2, children: heading })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: rowWrapClass, children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "button",
+          {
+            type: "button",
+            "aria-label": "Previous reviews",
+            className: cn(arrowClass, "left-0"),
+            onClick: () => scrollBy(-1),
+            children: /* @__PURE__ */ jsxRuntime.jsx(ChevronLeft3, {})
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { ref: rowRef, className: rowClass2, children: reviews.map((review, index) => /* @__PURE__ */ jsxRuntime.jsxs("article", { className: cardClass7, children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "span",
+            {
+              "aria-hidden": "true",
+              className: cn(
+                accentTapeBaseClass,
+                index % 2 === 0 ? "left-[200px] top-[100px] rotate-[30deg]" : "left-0 top-[20px] -rotate-[30deg]"
+              )
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: photoGridClass, children: [
+            /* @__PURE__ */ jsxRuntime.jsx(
+              "img",
+              {
+                src: review.image1,
+                alt: `${review.name} travelling`,
+                loading: "lazy",
+                decoding: "async",
+                className: jumpingPhotoClass
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              "img",
+              {
+                src: review.image2,
+                alt: `${review.name} with the group`,
+                loading: "lazy",
+                decoding: "async",
+                className: groupPhotoClass
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsxs("p", { className: quoteBaseClass, style: clampStyle, children: [
+            "\u201C",
+            review.content,
+            "\u201D"
+          ] }),
+          review.link ? /* @__PURE__ */ jsxRuntime.jsx("a", { href: review.link, className: readMoreClass, children: /* @__PURE__ */ jsxRuntime.jsx("strong", { children: "continue reading ..." }) }) : null,
+          /* @__PURE__ */ jsxRuntime.jsx("p", { className: nameClass, children: review.name })
+        ] }, `${review.name}-${review.content.slice(0, 16)}`)) }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "button",
+          {
+            type: "button",
+            "aria-label": "Next reviews",
+            className: cn(arrowClass, "right-0"),
+            onClick: () => scrollBy(1),
+            children: /* @__PURE__ */ jsxRuntime.jsx(ChevronRight3, {})
+          }
+        )
+      ] })
+    ] });
+  }
+);
+LuxuryTestimonials.displayName = "LuxuryTestimonials";
 var SearchSvg2 = () => /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: [
   /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "9", cy: "9", r: "6.5", stroke: "currentColor", strokeWidth: "1.5" }),
   /* @__PURE__ */ jsxRuntime.jsx(
@@ -2515,7 +3258,7 @@ var OfficesSection = react.forwardRef(
   }
 );
 OfficesSection.displayName = "OfficesSection";
-var ChevronLeft3 = () => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(
+var ChevronLeft4 = () => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(
   "path",
   {
     d: "M10 12L6 8l4-4",
@@ -2525,7 +3268,7 @@ var ChevronLeft3 = () => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "16", he
     strokeLinejoin: "round"
   }
 ) });
-var ChevronRight3 = () => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(
+var ChevronRight4 = () => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(
   "path",
   {
     d: "M6 4l4 4-4 4",
@@ -2596,7 +3339,7 @@ var PackagesCarousel = react.forwardRef(
                 disabled: !canPrev,
                 "aria-label": "Previous packages",
                 className: cn(arrowBase3, "-left-2"),
-                children: /* @__PURE__ */ jsxRuntime.jsx(ChevronLeft3, {})
+                children: /* @__PURE__ */ jsxRuntime.jsx(ChevronLeft4, {})
               }
             ),
             /* @__PURE__ */ jsxRuntime.jsx(
@@ -2630,7 +3373,7 @@ var PackagesCarousel = react.forwardRef(
                 disabled: !canNext,
                 "aria-label": "Next packages",
                 className: cn(arrowBase3, "-right-2"),
-                children: /* @__PURE__ */ jsxRuntime.jsx(ChevronRight3, {})
+                children: /* @__PURE__ */ jsxRuntime.jsx(ChevronRight4, {})
               }
             )
           ] })
@@ -2713,7 +3456,7 @@ var TeamSection = react.forwardRef(
   }
 );
 TeamSection.displayName = "TeamSection";
-var ChevronLeft4 = () => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "18", height: "18", viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(
+var ChevronLeft5 = () => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "18", height: "18", viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(
   "path",
   {
     d: "M12 15l-5-5 5-5",
@@ -2723,7 +3466,7 @@ var ChevronLeft4 = () => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "18", he
     strokeLinejoin: "round"
   }
 ) });
-var ChevronRight4 = () => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "18", height: "18", viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(
+var ChevronRight5 = () => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "18", height: "18", viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(
   "path",
   {
     d: "M8 5l5 5-5 5",
@@ -2733,7 +3476,7 @@ var ChevronRight4 = () => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "18", h
     strokeLinejoin: "round"
   }
 ) });
-var arrowClass = "inline-flex items-center justify-center w-9 h-9 p-0 bg-primary border-none rounded-full text-on-dark cursor-pointer transition-opacity duration-150 ease-in disabled:opacity-40 disabled:cursor-not-allowed focus-visible:outline-2 focus-visible:outline-accent focus-visible:outline-offset-2";
+var arrowClass2 = "inline-flex items-center justify-center w-9 h-9 p-0 bg-primary border-none rounded-full text-on-dark cursor-pointer transition-opacity duration-150 ease-in disabled:opacity-40 disabled:cursor-not-allowed focus-visible:outline-2 focus-visible:outline-accent focus-visible:outline-offset-2";
 var TestimonialsCarousel = react.forwardRef(
   ({ testimonials, defaultIndex = 0, activeIndex, onActiveIndexChange, className, ...rest }, ref) => {
     const isControlled = activeIndex !== void 0;
@@ -2790,8 +3533,8 @@ var TestimonialsCarousel = react.forwardRef(
                 onClick: () => setIndex(currentIndex - 1),
                 disabled: isFirst,
                 "aria-label": "Previous testimonial",
-                className: arrowClass,
-                children: /* @__PURE__ */ jsxRuntime.jsx(ChevronLeft4, {})
+                className: arrowClass2,
+                children: /* @__PURE__ */ jsxRuntime.jsx(ChevronLeft5, {})
               }
             ),
             /* @__PURE__ */ jsxRuntime.jsx(
@@ -2824,8 +3567,8 @@ var TestimonialsCarousel = react.forwardRef(
                 onClick: () => setIndex(currentIndex + 1),
                 disabled: isLast,
                 "aria-label": "Next testimonial",
-                className: arrowClass,
-                children: /* @__PURE__ */ jsxRuntime.jsx(ChevronRight4, {})
+                className: arrowClass2,
+                children: /* @__PURE__ */ jsxRuntime.jsx(ChevronRight5, {})
               }
             )
           ] }) : null
@@ -2882,7 +3625,7 @@ var useDesktopVideoVisible = (ref, breakpointPx = 768) => {
   }, [ref, breakpointPx]);
   return shouldRender;
 };
-var ChevronLeft5 = () => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(
+var ChevronLeft6 = () => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(
   "path",
   {
     d: "M10 12L6 8l4-4",
@@ -2892,7 +3635,7 @@ var ChevronLeft5 = () => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "16", he
     strokeLinejoin: "round"
   }
 ) });
-var ChevronRight5 = () => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(
+var ChevronRight6 = () => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(
   "path",
   {
     d: "M6 4l4 4-4 4",
@@ -2987,7 +3730,7 @@ var TripsCategorySection = react.forwardRef(
                 disabled: !canPrev,
                 "aria-label": "Previous trips",
                 className: cn(arrowBase4, "left-2"),
-                children: /* @__PURE__ */ jsxRuntime.jsx(ChevronLeft5, {})
+                children: /* @__PURE__ */ jsxRuntime.jsx(ChevronLeft6, {})
               }
             ),
             /* @__PURE__ */ jsxRuntime.jsx(
@@ -3017,7 +3760,7 @@ var TripsCategorySection = react.forwardRef(
                 disabled: !canNext,
                 "aria-label": "Next trips",
                 className: cn(arrowBase4, "right-2"),
-                children: /* @__PURE__ */ jsxRuntime.jsx(ChevronRight5, {})
+                children: /* @__PURE__ */ jsxRuntime.jsx(ChevronRight6, {})
               }
             ),
             /* @__PURE__ */ jsxRuntime.jsx(
@@ -3347,9 +4090,24 @@ var layout = {
   contentWidth: "760px",
   mobileBreakpoint: "768px"
 };
+var luxury = {
+  colors: {
+    gold: "#C5A059",
+    goldStrong: "#A68411",
+    goldLight: "#F3E5AB",
+    goldSoft: "#E8D5B7",
+    heading: "#9A7B4F",
+    ink: "#0C060E",
+    inkCard: "#1A1A1A",
+    onDark: "#FFFDF9",
+    text: "#2C2C2C"
+  },
+  font: 'var(--font-luxury-family, "Playfair Display"), Georgia, serif'
+};
 var theme = {
   ...tokens,
-  layout
+  layout,
+  luxury
 };
 
 exports.BottomNav = BottomNav;
@@ -3375,7 +4133,15 @@ exports.GalleryPhoto = GalleryPhoto;
 exports.GallerySection = GallerySection;
 exports.Hero = Hero;
 exports.HomeHero = HomeHero;
+exports.ImageMarquee = ImageMarquee;
 exports.LocationCard = LocationCard;
+exports.LuxuryCategoryNav = LuxuryCategoryNav;
+exports.LuxuryDestinationSection = LuxuryDestinationSection;
+exports.LuxuryHero = LuxuryHero;
+exports.LuxuryInquiryForm = LuxuryInquiryForm;
+exports.LuxuryIntro = LuxuryIntro;
+exports.LuxuryTestimonials = LuxuryTestimonials;
+exports.LuxuryTripCard = LuxuryTripCard;
 exports.MonthTabs = MonthTabs;
 exports.Navbar = Navbar;
 exports.OfficesSection = OfficesSection;