@planetaexo/design-system 0.37.3 → 0.37.4

package/dist/index.js

@@ -1,10 +1,10 @@
-import * as React8 from 'react';
+import * as React28 from 'react';
 import { useState, useRef, useCallback, useEffect } from 'react';
 import { cva } from 'class-variance-authority';
 import { clsx } from 'clsx';
 import { twMerge } from 'tailwind-merge';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import { XIcon, ChevronDownIcon, CalendarIcon, SearchIcon, ChevronRightIcon, ArrowLeftIcon, CheckCircle2Icon, MapIcon, LogOutIcon, UsersIcon, CreditCardIcon, AlertCircleIcon, MinusIcon, PlusIcon, CircleCheckIcon, ChevronLeftIcon, HomeIcon, SailboatIcon, CarIcon, WavesIcon, FootprintsIcon, InfoIcon, ClockIcon, CheckIcon, ChevronUpIcon, UserIcon, MenuIcon, SunIcon, MoonIcon, MapPinIcon, PackageIcon, SparklesIcon, BackpackIcon, BedDoubleIcon, UtensilsIcon, ReceiptIcon, Loader2Icon, SendIcon, CheckCircleIcon, MailIcon, PhoneIcon, MessageCircleIcon, CompassIcon, UserPlusIcon, ExternalLinkIcon, CopyIcon, PencilIcon, Trash2Icon, UserMinusIcon, AlertTriangleIcon, ZoomInIcon, StarIcon, LayoutGridIcon } from 'lucide-react';
+import { XIcon, ChevronDownIcon, CalendarIcon, SearchIcon, ChevronRightIcon, ArrowLeftIcon, CheckCircle2Icon, MapIcon, LogOutIcon, UsersIcon, CreditCardIcon, AlertCircleIcon, MinusIcon, PlusIcon, CircleCheckIcon, SlidersHorizontalIcon, ChevronLeftIcon, HomeIcon, SailboatIcon, CarIcon, WavesIcon, FootprintsIcon, InfoIcon, ClockIcon, CheckIcon, ChevronUpIcon, MenuIcon, UserIcon, SunIcon, MoonIcon, MapPinIcon, PackageIcon, BedDoubleIcon, UtensilsIcon, CompassIcon, BackpackIcon, CherryIcon, ReceiptIcon, Loader2Icon, SendIcon, CheckCircleIcon, MailIcon, PhoneIcon, MessageCircleIcon, UserPlusIcon, ExternalLinkIcon, CopyIcon, PencilIcon, Trash2Icon, UserMinusIcon, AlertTriangleIcon, ZoomInIcon, StarIcon, TwitterIcon, YoutubeIcon, LinkedinIcon, InstagramIcon, FacebookIcon, ArrowRightIcon, LayoutGridIcon } from 'lucide-react';
 import { Separator as Separator$1 } from '@base-ui/react/separator';
 import { Dialog as Dialog$1 } from '@base-ui/react/dialog';
 import { Button as Button$1 } from '@base-ui/react/button';
@@ -81,7 +81,7 @@ var buttonVariants = cva(
     }
   }
 );
-var Button = React8.forwardRef(
+var Button = React28.forwardRef(
   (_a, ref) => {
     var _b = _a, { className, variant, size } = _b, props = __objRest(_b, ["className", "variant", "size"]);
     return /* @__PURE__ */ jsx(
@@ -165,6 +165,10 @@ function Dialog(_a) {
   var props = __objRest(_a, []);
   return /* @__PURE__ */ jsx(Dialog$1.Root, __spreadValues({ "data-slot": "dialog" }, props));
 }
+function DialogTrigger(_a) {
+  var props = __objRest(_a, []);
+  return /* @__PURE__ */ jsx(Dialog$1.Trigger, __spreadValues({ "data-slot": "dialog-trigger" }, props));
+}
 function DialogPortal(_a) {
   var props = __objRest(_a, []);
   return /* @__PURE__ */ jsx(Dialog$1.Portal, __spreadValues({ "data-slot": "dialog-portal" }, props));
@@ -302,10 +306,10 @@ function DialogDescription(_a) {
     }, props)
   );
 }
-var FloatingInput = React8.forwardRef(
+var FloatingInput = React28.forwardRef(
   (_a, ref) => {
     var _b = _a, { label, error, id, className, required } = _b, props = __objRest(_b, ["label", "error", "id", "className", "required"]);
-    const inputId = id != null ? id : React8.useId();
+    const inputId = id != null ? id : React28.useId();
     return /* @__PURE__ */ jsxs("div", { className: cn("relative", className), children: [
       /* @__PURE__ */ jsx(
         "input",
@@ -345,10 +349,10 @@ var FloatingInput = React8.forwardRef(
   }
 );
 FloatingInput.displayName = "FloatingInput";
-var FloatingSelect = React8.forwardRef(
+var FloatingSelect = React28.forwardRef(
   (_a, ref) => {
     var _b = _a, { label, error, id, className, required, children, value } = _b, props = __objRest(_b, ["label", "error", "id", "className", "required", "children", "value"]);
-    const inputId = id != null ? id : React8.useId();
+    const inputId = id != null ? id : React28.useId();
     const hasValue = typeof value === "string" ? value !== "" : value !== void 0 && value !== null;
     return /* @__PURE__ */ jsxs("div", { className: cn("relative", className), children: [
       /* @__PURE__ */ jsx(
@@ -612,11 +616,11 @@ function PhoneCountrySelect({
   disabled
 }) {
   var _a;
-  const [open, setOpen] = React8.useState(false);
-  const containerRef = React8.useRef(null);
-  const listRef = React8.useRef(null);
+  const [open, setOpen] = React28.useState(false);
+  const containerRef = React28.useRef(null);
+  const listRef = React28.useRef(null);
   const selected = (_a = PHONE_COUNTRIES.find((c) => c.code === value)) != null ? _a : PHONE_COUNTRIES[0];
-  React8.useEffect(() => {
+  React28.useEffect(() => {
     if (!open) return;
     const handler = (e) => {
       var _a2;
@@ -627,7 +631,7 @@ function PhoneCountrySelect({
     document.addEventListener("mousedown", handler);
     return () => document.removeEventListener("mousedown", handler);
   }, [open]);
-  React8.useEffect(() => {
+  React28.useEffect(() => {
     if (!open || !listRef.current) return;
     const activeEl = listRef.current.querySelector("[data-selected=true]");
     activeEl == null ? void 0 : activeEl.scrollIntoView({ block: "nearest" });
@@ -897,8 +901,8 @@ function CalendarDayButton(_a) {
     "locale"
   ]);
   const defaultClassNames = getDefaultClassNames();
-  const ref = React8.useRef(null);
-  React8.useEffect(() => {
+  const ref = React28.useRef(null);
+  React28.useEffect(() => {
     var _a2;
     if (modifiers.focused) (_a2 = ref.current) == null ? void 0 : _a2.focus();
   }, [modifiers.focused]);
@@ -929,16 +933,16 @@ function BirthDateField({
   className,
   disabled
 }) {
-  const [open, setOpen] = React8.useState(false);
-  const [text, setText] = React8.useState(
+  const [open, setOpen] = React28.useState(false);
+  const [text, setText] = React28.useState(
     value ? format(value, "dd/MM/yyyy") : ""
   );
-  const containerRef = React8.useRef(null);
-  const inputId = React8.useId();
-  React8.useEffect(() => {
+  const containerRef = React28.useRef(null);
+  const inputId = React28.useId();
+  React28.useEffect(() => {
     setText(value ? format(value, "dd/MM/yyyy") : "");
   }, [value]);
-  React8.useEffect(() => {
+  React28.useEffect(() => {
     if (!open) return;
     const handler = (e) => {
       var _a;
@@ -1147,14 +1151,14 @@ function CountrySearchField({
 }) {
   var _a;
   const list = countries != null ? countries : COUNTRIES;
-  const [query, setQuery] = React8.useState("");
-  const [open, setOpen] = React8.useState(false);
-  const containerRef = React8.useRef(null);
-  const searchRef = React8.useRef(null);
+  const [query, setQuery] = React28.useState("");
+  const [open, setOpen] = React28.useState(false);
+  const containerRef = React28.useRef(null);
+  const searchRef = React28.useRef(null);
   const selected = list.find((c) => c.code === value);
   const isFloated = open || !!selected;
   const filtered = query.trim() ? list.filter((c) => c.name.toLowerCase().includes(query.toLowerCase())) : list;
-  React8.useEffect(() => {
+  React28.useEffect(() => {
     if (!open) return;
     const handler = (e) => {
       var _a2;
@@ -1268,7 +1272,7 @@ function AdventureCard({
 }) {
   var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k;
   const isControlled = (_b = (_a = adventure.optionals) == null ? void 0 : _a.some((o) => o.onCheckedChange !== void 0)) != null ? _b : false;
-  const [checkedInternal, setCheckedInternal] = React8.useState(
+  const [checkedInternal, setCheckedInternal] = React28.useState(
     new Set((_d = (_c = adventure.optionals) == null ? void 0 : _c.filter((o) => o.defaultChecked).map((o) => o.id)) != null ? _d : [])
   );
   const isChecked = (opt) => {
@@ -1666,7 +1670,7 @@ function BookingShell({
   return /* @__PURE__ */ jsxs("div", { className: "rounded-2xl border border-border bg-card overflow-hidden", children: [
     /* @__PURE__ */ jsxs("div", { className: "border-b border-border px-5 py-4 bg-muted/20", children: [
       /* @__PURE__ */ jsx("h3", { className: "text-base font-bold text-foreground font-heading mb-2", children: title }),
-      /* @__PURE__ */ jsx("div", { className: "flex items-center gap-1.5 flex-wrap", children: steps.map((label, i) => /* @__PURE__ */ jsxs(React8.Fragment, { children: [
+      /* @__PURE__ */ jsx("div", { className: "flex items-center gap-1.5 flex-wrap", children: steps.map((label, i) => /* @__PURE__ */ jsxs(React28.Fragment, { children: [
         /* @__PURE__ */ jsx(
           "span",
           {
@@ -1865,7 +1869,7 @@ function TermsSection({
   termsContent
 }) {
   var _a;
-  const [modalOpen, setModalOpen] = React8.useState(false);
+  const [modalOpen, setModalOpen] = React28.useState(false);
   const i18n = (_a = TERMS_I18N[locale]) != null ? _a : TERMS_I18N.en;
   return /* @__PURE__ */ jsxs("div", { className: "rounded-xl border border-border p-4 flex flex-col gap-3", children: [
     /* @__PURE__ */ jsx("p", { className: "text-xs font-bold text-muted-foreground font-heading uppercase tracking-widest", children: title }),
@@ -2003,9 +2007,9 @@ function BookingWizard({
 }) {
   var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _A, _B, _C, _D, _E, _F, _G, _H, _I, _J, _K, _L, _M, _N, _O, _P, _Q, _R, _S, _T;
   const wizardSteps = WIZARD_STEPS_FN(labels);
-  const [step, setStep] = React8.useState("responsible");
-  const [error, setError] = React8.useState(null);
-  const [responsible, setResponsible] = React8.useState({
+  const [step, setStep] = React28.useState("responsible");
+  const [error, setError] = React28.useState(null);
+  const [responsible, setResponsible] = React28.useState({
     firstName: "",
     lastName: "",
     email: "",
@@ -2024,7 +2028,7 @@ function BookingWizard({
     return s + ((_b2 = (_a2 = a.slots) == null ? void 0 : _a2.children) != null ? _b2 : 0);
   }, 0);
   const totalPax = totalAdults + totalChildren;
-  const [travellers, setTravellers] = React8.useState(
+  const [travellers, setTravellers] = React28.useState(
     Array.from({ length: Math.max(totalPax, 1) }, () => ({
       firstName: "",
       lastName: "",
@@ -2032,9 +2036,9 @@ function BookingWizard({
       email: ""
     }))
   );
-  const [payAmount, setPayAmount] = React8.useState("full");
-  const [payMethod, setPayMethod] = React8.useState("stripe");
-  const [termsAccepted, setTermsAccepted] = React8.useState(false);
+  const [payAmount, setPayAmount] = React28.useState("full");
+  const [payMethod, setPayMethod] = React28.useState("stripe");
+  const [termsAccepted, setTermsAccepted] = React28.useState(false);
   const setR = (k, v) => setResponsible((p) => __spreadProps(__spreadValues({}, p), { [k]: v }));
   const setT = (i, k, v) => setTravellers((prev) => prev.map((t, idx) => idx === i ? __spreadProps(__spreadValues({}, t), { [k]: v }) : t));
   const setTDob = (i, v) => setTravellers((prev) => prev.map((t, idx) => idx === i ? __spreadProps(__spreadValues({}, t), { dateOfBirth: v }) : t));
@@ -2262,7 +2266,7 @@ function Offer({
   className
 }) {
   var _a, _b, _c;
-  const [showBooking, setShowBooking] = React8.useState(false);
+  const [showBooking, setShowBooking] = React28.useState(false);
   const isShowingCheckout = !confirmedState && (!!checkoutSlot || internalDemoCheckout && showBooking);
   const handleBook = () => {
     if (!checkoutSlot && !externalBookingFlow && internalDemoCheckout) {
@@ -2629,7 +2633,7 @@ function AdventureSection({
   labels
 }) {
   var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r;
-  const [detailsOpen, setDetailsOpen] = React8.useState(false);
+  const [detailsOpen, setDetailsOpen] = React28.useState(false);
   const handleCopyUrl = (url) => {
     if (onCopyFormLink) {
       onCopyFormLink(url);
@@ -3141,8 +3145,8 @@ function AddTravellerDialog({
   errorMessage
 }) {
   var _a, _b, _c, _d, _e;
-  const [form, setForm] = React8.useState(() => createInitialAddFormData(config));
-  React8.useEffect(() => {
+  const [form, setForm] = React28.useState(() => createInitialAddFormData(config));
+  React28.useEffect(() => {
     if (open) {
       setForm(createInitialAddFormData(config));
     }
@@ -3202,7 +3206,7 @@ function EditTravellerDialog({
   errorMessage
 }) {
   var _a, _b, _c, _d, _e;
-  const [form, setForm] = React8.useState(() => ({
+  const [form, setForm] = React28.useState(() => ({
     firstName: "",
     lastName: "",
     email: "",
@@ -3211,7 +3215,7 @@ function EditTravellerDialog({
     birthDate: "",
     personType: "ADULT"
   }));
-  React8.useEffect(() => {
+  React28.useEffect(() => {
     var _a2, _b2, _c2, _d2, _e2, _f;
     if (open && traveller) {
       setForm({
@@ -3546,48 +3550,48 @@ function BookingDetails({
   const hasSubmitAddTraveller = !!onSubmitAddTraveller;
   const hasSubmitEditTraveller = !!onSubmitEditTraveller;
   const hasConfirmRemoveTraveller = !!onConfirmRemoveTraveller;
-  const [addModalState, setAddModalState] = React8.useState({
+  const [addModalState, setAddModalState] = React28.useState({
     open: false,
     adventureId: null
   });
-  const [editModalState, setEditModalState] = React8.useState({ open: false, adventureId: null, traveller: null });
-  const [deleteModalState, setDeleteModalState] = React8.useState({ open: false, adventureId: null, traveller: null });
-  const [resendInviteDialogState, setResendInviteDialogState] = React8.useState({ open: false, traveller: null });
-  const handleRequestOpenAddModal = React8.useCallback((adventureId) => {
+  const [editModalState, setEditModalState] = React28.useState({ open: false, adventureId: null, traveller: null });
+  const [deleteModalState, setDeleteModalState] = React28.useState({ open: false, adventureId: null, traveller: null });
+  const [resendInviteDialogState, setResendInviteDialogState] = React28.useState({ open: false, traveller: null });
+  const handleRequestOpenAddModal = React28.useCallback((adventureId) => {
     setAddModalState({ open: true, adventureId });
   }, []);
-  const handleRequestOpenEditModal = React8.useCallback(
+  const handleRequestOpenEditModal = React28.useCallback(
     (adventureId, traveller) => {
       setEditModalState({ open: true, adventureId, traveller });
     },
     []
   );
-  const handleRequestOpenDeleteModal = React8.useCallback(
+  const handleRequestOpenDeleteModal = React28.useCallback(
     (adventureId, traveller) => {
       setDeleteModalState({ open: true, adventureId, traveller });
     },
     []
   );
-  const handleRequestOpenResendInviteDialog = React8.useCallback(
+  const handleRequestOpenResendInviteDialog = React28.useCallback(
     (traveller) => {
       setResendInviteDialogState({ open: true, traveller });
     },
     []
   );
-  const closeAddModal = React8.useCallback(() => {
+  const closeAddModal = React28.useCallback(() => {
     setAddModalState({ open: false, adventureId: null });
   }, []);
-  const closeEditModal = React8.useCallback(() => {
+  const closeEditModal = React28.useCallback(() => {
     setEditModalState({ open: false, adventureId: null, traveller: null });
   }, []);
-  const closeDeleteModal = React8.useCallback(() => {
+  const closeDeleteModal = React28.useCallback(() => {
     setDeleteModalState({ open: false, adventureId: null, traveller: null });
   }, []);
-  const closeResendInviteDialog = React8.useCallback(() => {
+  const closeResendInviteDialog = React28.useCallback(() => {
     setResendInviteDialogState({ open: false, traveller: null });
   }, []);
-  const submitInFlightRef = React8.useRef(false);
-  const handleAddSubmit = React8.useCallback(
+  const submitInFlightRef = React28.useRef(false);
+  const handleAddSubmit = React28.useCallback(
     async (adventureId, data) => {
       if (!onSubmitAddTraveller) return;
       if (submitInFlightRef.current) return;
@@ -3602,7 +3606,7 @@ function BookingDetails({
     },
     [onSubmitAddTraveller, closeAddModal]
   );
-  const handleEditSubmit = React8.useCallback(
+  const handleEditSubmit = React28.useCallback(
     async (adventureId, travellerId, data) => {
       if (!onSubmitEditTraveller) return;
       if (submitInFlightRef.current) return;
@@ -3617,7 +3621,7 @@ function BookingDetails({
     },
     [onSubmitEditTraveller, closeEditModal]
   );
-  const handleDeleteConfirm = React8.useCallback(
+  const handleDeleteConfirm = React28.useCallback(
     async (adventureId, travellerId) => {
       if (!onConfirmRemoveTraveller) return;
       if (submitInFlightRef.current) return;
@@ -5091,7 +5095,7 @@ function BookingCreatedEmail({
             }, children: i + 1 }) }),
             /* @__PURE__ */ jsx("td", { style: { verticalAlign: "top" }, children: /* @__PURE__ */ jsx("p", { style: { fontSize: "14px", color: emailTokens.bodyText, lineHeight: "1.6", margin: 0 }, children: step }) })
           ] }) }) }, i)) }),
-          nextStepsImportant && nextStepsImportant.trim().length > 0 && /* @__PURE__ */ jsx("p", { style: { marginBottom: "32px", fontSize: "14px", color: emailTokens.foreground, lineHeight: "1.6" }, children: nextStepsImportant.split("\n").map((line, idx, arr) => /* @__PURE__ */ jsxs(React8.Fragment, { children: [
+          nextStepsImportant && nextStepsImportant.trim().length > 0 && /* @__PURE__ */ jsx("p", { style: { marginBottom: "32px", fontSize: "14px", color: emailTokens.foreground, lineHeight: "1.6" }, children: nextStepsImportant.split("\n").map((line, idx, arr) => /* @__PURE__ */ jsxs(React28.Fragment, { children: [
             idx === 0 ? /* @__PURE__ */ jsx("strong", { children: line }) : line,
             idx < arr.length - 1 ? /* @__PURE__ */ jsx("br", {}) : null
           ] }, idx)) })
@@ -6460,11 +6464,11 @@ function DatePickerField({
   fromDate,
   className
 }) {
-  const [open, setOpen] = React8.useState(false);
-  const containerRef = React8.useRef(null);
-  const [calendarWidth, setCalendarWidth] = React8.useState();
+  const [open, setOpen] = React28.useState(false);
+  const containerRef = React28.useRef(null);
+  const [calendarWidth, setCalendarWidth] = React28.useState();
   const hasValue = !!value;
-  React8.useEffect(() => {
+  React28.useEffect(() => {
     if (!containerRef.current) return;
     const observer = new ResizeObserver(([entry]) => {
       setCalendarWidth(entry.contentRect.width);
@@ -6573,7 +6577,7 @@ function BookingForm({
   subtitle = "Free enquiry \u2013 no commitment",
   className
 }) {
-  const [values, setValues] = React8.useState(__spreadValues(__spreadValues({}, defaultInitial), defaultValues));
+  const [values, setValues] = React28.useState(__spreadValues(__spreadValues({}, defaultInitial), defaultValues));
   const set = (key, value) => setValues((prev) => __spreadProps(__spreadValues({}, prev), { [key]: value }));
   const handleSubmit = (e) => {
     e.preventDefault();
@@ -7110,11 +7114,11 @@ function FloatingTextarea({
 }
 function SelectField({ field, value, onChange, error, disabled }) {
   var _a, _b, _c;
-  const [open, setOpen] = React8.useState(false);
-  const containerRef = React8.useRef(null);
+  const [open, setOpen] = React28.useState(false);
+  const containerRef = React28.useRef(null);
   const options = (_a = field.options) != null ? _a : [];
   const selectedOpt = (_b = options.find((o) => o.value === value)) != null ? _b : null;
-  React8.useEffect(() => {
+  React28.useEffect(() => {
     if (!open) return;
     const handleOutside = (e) => {
       if (containerRef.current && !containerRef.current.contains(e.target)) {
@@ -7503,11 +7507,11 @@ function RegistrationForm({
   readOnly = false
 }) {
   var _a;
-  const L = React8.useMemo(
+  const L = React28.useMemo(
     () => __spreadValues(__spreadValues({}, DEFAULT_LABELS9), labels != null ? labels : {}),
     [labels]
   );
-  const sortedFields = React8.useMemo(
+  const sortedFields = React28.useMemo(
     () => [...fields].sort((a, b) => {
       var _a2, _b;
       return ((_a2 = a.order) != null ? _a2 : 0) - ((_b = b.order) != null ? _b : 0);
@@ -7515,7 +7519,7 @@ function RegistrationForm({
     [fields]
   );
   const isControlled = values !== void 0;
-  const [internal, setInternal] = React8.useState(
+  const [internal, setInternal] = React28.useState(
     () => initializeValues(
       sortedFields,
       defaultValues != null ? defaultValues : {},
@@ -7523,9 +7527,9 @@ function RegistrationForm({
       includeTerms
     )
   );
-  const [submitAttempted, setSubmitAttempted] = React8.useState(false);
-  const [validationErrors, setValidationErrors] = React8.useState({});
-  React8.useEffect(() => {
+  const [submitAttempted, setSubmitAttempted] = React28.useState(false);
+  const [validationErrors, setValidationErrors] = React28.useState({});
+  React28.useEffect(() => {
     if (isControlled) return;
     setInternal((prev) => {
       const next = initializeValues(
@@ -7582,7 +7586,7 @@ function RegistrationForm({
   const termsError = submitAttempted && termsEnabled && !termsAccepted;
   const firstErrorFieldId = Object.keys(fieldErrors)[0];
   const scrollTargetId = firstErrorFieldId ? `rf-${firstErrorFieldId}` : termsError ? "rf-terms" : null;
-  React8.useEffect(() => {
+  React28.useEffect(() => {
     if (!submitAttempted || !scrollTargetId) return;
     const timer = setTimeout(() => {
       const elem = document.getElementById(scrollTargetId);
@@ -8044,10 +8048,10 @@ var OTPCodeInput = ({
   id,
   required
 }) => {
-  const baseId = id != null ? id : React8.useId();
-  const inputRef = React8.useRef(null);
-  const [focused, setFocused] = React8.useState(false);
-  const digits = React8.useMemo(() => {
+  const baseId = id != null ? id : React28.useId();
+  const inputRef = React28.useRef(null);
+  const [focused, setFocused] = React28.useState(false);
+  const digits = React28.useMemo(() => {
     const arr = value.split("").slice(0, length);
     while (arr.length < length) arr.push("");
     return arr;
@@ -8145,7 +8149,7 @@ function Checkbox(_a) {
     __spreadProps(__spreadValues({
       "data-slot": "checkbox",
       className: cn(
-        "peer relative flex size-4 shrink-0 items-center justify-center rounded-[4px] border border-input transition-colors outline-none group-has-disabled/field:opacity-50 after:absolute after:-inset-x-3 after:-inset-y-2 focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 aria-invalid:aria-checked:border-primary dark:bg-input/30 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 data-checked:border-primary data-checked:bg-primary data-checked:text-primary-foreground dark:data-checked:bg-primary",
+        "peer relative flex size-4 shrink-0 items-center justify-center rounded-[4px] border border-input transition-colors outline-none group-has-disabled/field:opacity-50 after:absolute after:-inset-x-3 after:-inset-y-2 focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 aria-invalid:aria-checked:border-primary dark:bg-input/30 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 data-checked:border-primary data-checked:bg-primary data-checked:text-primary-foreground data-indeterminate:border-primary data-indeterminate:bg-primary data-indeterminate:text-primary-foreground dark:data-checked:bg-primary",
         className
       )
     }, props), {
@@ -8154,16 +8158,13 @@ function Checkbox(_a) {
         {
           "data-slot": "checkbox-indicator",
           className: "grid place-content-center text-current transition-none [&>svg]:size-3.5",
-          children: /* @__PURE__ */ jsx(
-            CheckIcon,
-            {}
-          )
+          children: props.indeterminate ? /* @__PURE__ */ jsx(MinusIcon, {}) : /* @__PURE__ */ jsx(CheckIcon, {})
         }
       )
     })
   );
 }
-var AccordionVariantContext = React8.createContext("default");
+var AccordionVariantContext = React28.createContext("default");
 function Accordion(_a) {
   var _b = _a, { className, variant = "default" } = _b, props = __objRest(_b, ["className", "variant"]);
   return /* @__PURE__ */ jsx(AccordionVariantContext.Provider, { value: variant, children: /* @__PURE__ */ jsx(
@@ -8181,7 +8182,7 @@ function Accordion(_a) {
 }
 function AccordionItem(_a) {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  const variant = React8.useContext(AccordionVariantContext);
+  const variant = React28.useContext(AccordionVariantContext);
   return /* @__PURE__ */ jsx(
     Accordion$1.Item,
     __spreadValues({
@@ -8202,7 +8203,7 @@ function AccordionTrigger(_a) {
     "className",
     "children"
   ]);
-  const variant = React8.useContext(AccordionVariantContext);
+  const variant = React28.useContext(AccordionVariantContext);
   return /* @__PURE__ */ jsx(Accordion$1.Header, { className: "flex", children: /* @__PURE__ */ jsxs(
     Accordion$1.Trigger,
     __spreadProps(__spreadValues({
@@ -8256,7 +8257,7 @@ function AccordionContent(_a) {
     "className",
     "children"
   ]);
-  const variant = React8.useContext(AccordionVariantContext);
+  const variant = React28.useContext(AccordionVariantContext);
   return /* @__PURE__ */ jsx(
     Accordion$1.Panel,
     __spreadProps(__spreadValues({
@@ -8279,6 +8280,187 @@ function AccordionContent(_a) {
     })
   );
 }
+function getLeafIds(item) {
+  var _a;
+  if (!((_a = item.children) == null ? void 0 : _a.length)) return [item.id];
+  return item.children.flatMap(getLeafIds);
+}
+function getDefaultExpandedIds(items) {
+  const out = [];
+  const walk = (list) => {
+    var _a;
+    for (const i of list) {
+      if ((_a = i.children) == null ? void 0 : _a.length) {
+        if (i.defaultExpanded) out.push(i.id);
+        walk(i.children);
+      }
+    }
+  };
+  walk(items);
+  return out;
+}
+function getAllItemIds(items) {
+  return items.flatMap(
+    (i) => {
+      var _a;
+      return ((_a = i.children) == null ? void 0 : _a.length) ? [i.id, ...getAllItemIds(i.children)] : [i.id];
+    }
+  );
+}
+function findItemById(items, id) {
+  var _a;
+  for (const item of items) {
+    if (item.id === id) return item;
+    if ((_a = item.children) == null ? void 0 : _a.length) {
+      const found = findItemById(item.children, id);
+      if (found) return found;
+    }
+  }
+  return void 0;
+}
+function resolveGroups(groups) {
+  return groups.map((g) => {
+    var _a;
+    if (!g.scopeItemId) return g;
+    const node = findItemById(g.items, g.scopeItemId);
+    return __spreadProps(__spreadValues({}, g), { items: (_a = node == null ? void 0 : node.children) != null ? _a : [] });
+  }).filter((g) => g.items.length > 0);
+}
+function FilterItemsList({
+  items,
+  groupId,
+  groupSelected,
+  onToggle,
+  onBulkToggle,
+  idPrefix,
+  depth = 0,
+  parentAsHeader = false,
+  expandedItems,
+  onToggleExpanded
+}) {
+  return /* @__PURE__ */ jsx(
+    "ul",
+    {
+      className: cn(
+        "flex flex-col gap-0.5",
+        !parentAsHeader && depth > 0 && "mt-0.5 ml-6 border-l border-border pl-3"
+      ),
+      children: items.map((item) => {
+        var _a, _b;
+        const isParent = !!((_a = item.children) == null ? void 0 : _a.length);
+        const checkboxId = `${idPrefix}-${groupId}-${item.id}`;
+        if (!isParent) {
+          const checked = groupSelected.includes(item.id);
+          return /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs(
+            "label",
+            {
+              htmlFor: checkboxId,
+              className: "flex cursor-pointer items-center gap-3 rounded-md px-1 py-2 transition-colors hover:bg-muted/50",
+              children: [
+                /* @__PURE__ */ jsx(
+                  Checkbox,
+                  {
+                    id: checkboxId,
+                    checked,
+                    onCheckedChange: () => onToggle(item.id),
+                    className: "shrink-0"
+                  }
+                ),
+                /* @__PURE__ */ jsx("span", { className: "flex-1 text-sm text-foreground font-ui", children: item.label }),
+                item.count !== void 0 && /* @__PURE__ */ jsxs("span", { className: "text-xs font-medium text-primary font-ui", children: [
+                  "(",
+                  item.count,
+                  ")"
+                ] })
+              ]
+            }
+          ) }, item.id);
+        }
+        if (parentAsHeader) {
+          return /* @__PURE__ */ jsxs("li", { className: cn(depth > 0 && "mt-1"), children: [
+            /* @__PURE__ */ jsx("p", { className: "px-1 pt-2 pb-1 text-[11px] font-semibold uppercase tracking-wider text-muted-foreground", children: item.label }),
+            /* @__PURE__ */ jsx(
+              FilterItemsList,
+              {
+                items: item.children,
+                groupId,
+                groupSelected,
+                onToggle,
+                onBulkToggle,
+                idPrefix,
+                depth: depth + 1,
+                parentAsHeader: true,
+                expandedItems,
+                onToggleExpanded
+              }
+            )
+          ] }, item.id);
+        }
+        const leafIds = item.children.flatMap(getLeafIds);
+        const selectedLeaves = leafIds.filter((id) => groupSelected.includes(id));
+        const allSelected = leafIds.length > 0 && selectedLeaves.length === leafIds.length;
+        const someSelected = selectedLeaves.length > 0 && !allSelected;
+        const isExpanded = (_b = expandedItems == null ? void 0 : expandedItems.has(item.id)) != null ? _b : false;
+        const panelId = `${checkboxId}-children`;
+        return /* @__PURE__ */ jsxs("li", { children: [
+          /* @__PURE__ */ jsxs("div", { className: "group/parent flex items-center gap-3 rounded-md px-1 py-2 transition-colors hover:bg-muted/50", children: [
+            /* @__PURE__ */ jsx(
+              Checkbox,
+              {
+                id: checkboxId,
+                checked: allSelected,
+                indeterminate: someSelected,
+                onCheckedChange: () => onBulkToggle(leafIds, !allSelected),
+                className: "shrink-0"
+              }
+            ),
+            /* @__PURE__ */ jsxs(
+              "button",
+              {
+                type: "button",
+                onClick: () => onToggleExpanded == null ? void 0 : onToggleExpanded(item.id),
+                "aria-expanded": isExpanded,
+                "aria-controls": panelId,
+                className: "flex flex-1 items-center gap-2 text-left focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring rounded-sm cursor-pointer",
+                children: [
+                  /* @__PURE__ */ jsx("span", { className: "flex-1 text-sm font-bold text-foreground font-ui", children: item.label }),
+                  item.count !== void 0 && /* @__PURE__ */ jsxs("span", { className: "text-xs font-medium text-primary font-ui", children: [
+                    "(",
+                    item.count,
+                    ")"
+                  ] }),
+                  /* @__PURE__ */ jsx(
+                    ChevronDownIcon,
+                    {
+                      className: cn(
+                        "h-4 w-4 text-muted-foreground transition-transform",
+                        isExpanded && "rotate-180"
+                      )
+                    }
+                  )
+                ]
+              }
+            )
+          ] }),
+          isExpanded && /* @__PURE__ */ jsx("div", { id: panelId, children: /* @__PURE__ */ jsx(
+            FilterItemsList,
+            {
+              items: item.children,
+              groupId,
+              groupSelected,
+              onToggle,
+              onBulkToggle,
+              idPrefix,
+              depth: depth + 1,
+              expandedItems,
+              onToggleExpanded
+            }
+          ) })
+        ] }, item.id);
+      })
+    }
+  );
+}
 function FilterPanel({
   groups,
   value,
@@ -8286,15 +8468,32 @@ function FilterPanel({
   onClearAll,
   alwaysShowClear = false,
   title = "Filters",
-  className
+  className,
+  variant = "sidebar",
+  sortOptions,
+  sort,
+  onSortChange
 }) {
-  const [internalValue, setInternalValue] = React8.useState(
+  var _a, _b;
+  const resolvedGroups = React28.useMemo(() => resolveGroups(groups), [groups]);
+  const [internalValue, setInternalValue] = React28.useState(
     () => Object.fromEntries(groups.map((g) => [g.id, []]))
   );
   const selected = value != null ? value : internalValue;
+  const [expandedItems, setExpandedItems] = React28.useState(
+    () => new Set(groups.flatMap((g) => getDefaultExpandedIds(g.items)))
+  );
+  const toggleExpanded = React28.useCallback((id) => {
+    setExpandedItems((prev) => {
+      const next = new Set(prev);
+      if (next.has(id)) next.delete(id);
+      else next.add(id);
+      return next;
+    });
+  }, []);
   const handleToggle = (groupId, itemId) => {
-    var _a;
-    const current = (_a = selected[groupId]) != null ? _a : [];
+    var _a2;
+    const current = (_a2 = selected[groupId]) != null ? _a2 : [];
     const next = current.includes(itemId) ? current.filter((id) => id !== itemId) : [...current, itemId];
     const nextValue = __spreadProps(__spreadValues({}, selected), { [groupId]: next });
     if (onChange) {
@@ -8303,8 +8502,24 @@ function FilterPanel({
       setInternalValue(nextValue);
     }
   };
+  const handleBulkToggle = (groupId, itemIds, select) => {
+    var _a2;
+    const current = (_a2 = selected[groupId]) != null ? _a2 : [];
+    const next = select ? Array.from(/* @__PURE__ */ new Set([...current, ...itemIds])) : current.filter((id) => !itemIds.includes(id));
+    const nextValue = __spreadProps(__spreadValues({}, selected), { [groupId]: next });
+    if (onChange) {
+      onChange(nextValue);
+    } else {
+      setInternalValue(nextValue);
+    }
+  };
   const handleClearAll = () => {
-    const cleared = Object.fromEntries(groups.map((g) => [g.id, []]));
+    var _a2;
+    const cleared = __spreadValues({}, selected);
+    for (const g of resolvedGroups) {
+      const visible = new Set(getAllItemIds(g.items));
+      cleared[g.id] = ((_a2 = selected[g.id]) != null ? _a2 : []).filter((id) => !visible.has(id));
+    }
     if (onChange) {
       onChange(cleared);
     } else {
@@ -8312,9 +8527,289 @@ function FilterPanel({
     }
     onClearAll == null ? void 0 : onClearAll();
   };
-  const totalSelected = Object.values(selected).flat().length;
+  const totalSelected = resolvedGroups.reduce((sum, g) => {
+    var _a2;
+    const visible = new Set(getAllItemIds(g.items));
+    return sum + ((_a2 = selected[g.id]) != null ? _a2 : []).filter((id) => visible.has(id)).length;
+  }, 0);
   const showClear = alwaysShowClear || totalSelected > 0;
-  const defaultOpenValues = groups.filter((g) => g.defaultOpen).map((g) => g.id);
+  const defaultOpenValues = resolvedGroups.filter((g) => g.defaultOpen).map((g) => g.id);
+  if (resolvedGroups.length === 0) return null;
+  if (variant === "horizontal") {
+    const activeSort = (_a = sortOptions == null ? void 0 : sortOptions.find((o) => o.id === sort)) != null ? _a : sortOptions == null ? void 0 : sortOptions[0];
+    const drawerGroups = /* @__PURE__ */ jsx(Accordion, { defaultValue: defaultOpenValues, className: "flex flex-col gap-2", children: resolvedGroups.map((group) => {
+      var _a2;
+      const groupSelected = (_a2 = selected[group.id]) != null ? _a2 : [];
+      return /* @__PURE__ */ jsxs(
+        AccordionItem,
+        {
+          value: group.id,
+          className: "border-0 border-b border-border last:border-b-0",
+          children: [
+            /* @__PURE__ */ jsx(AccordionTrigger, { className: "px-0 py-3.5 hover:no-underline transition-colors", children: /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-2.5", children: [
+              group.icon && /* @__PURE__ */ jsx("span", { className: "text-primary shrink-0", children: group.icon }),
+              /* @__PURE__ */ jsx("span", { className: "text-sm font-bold text-foreground font-ui", children: group.label }),
+              groupSelected.length > 0 && /* @__PURE__ */ jsx("span", { className: "ml-1 inline-flex h-4 w-4 items-center justify-center rounded-full bg-primary text-[9px] font-bold text-primary-foreground", children: groupSelected.length })
+            ] }) }),
+            /* @__PURE__ */ jsx(AccordionContent, { className: "px-4 pb-3 pt-1", children: /* @__PURE__ */ jsx(
+              FilterItemsList,
+              {
+                items: group.items,
+                groupId: group.id,
+                groupSelected,
+                onToggle: (id) => handleToggle(group.id, id),
+                onBulkToggle: (ids, select) => handleBulkToggle(group.id, ids, select),
+                idPrefix: "mobile-filter",
+                expandedItems,
+                onToggleExpanded: toggleExpanded
+              }
+            ) })
+          ]
+        },
+        group.id
+      );
+    }) });
+    return /* @__PURE__ */ jsxs("div", { className: cn("contents", className), children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex sm:hidden items-center gap-2", children: [
+        /* @__PURE__ */ jsxs(Dialog, { children: [
+          /* @__PURE__ */ jsxs(
+            DialogTrigger,
+            {
+              render: /* @__PURE__ */ jsx(
+                "button",
+                {
+                  type: "button",
+                  className: cn(
+                    "flex-1 inline-flex items-center justify-between gap-2 rounded-xl border-2 border-foreground bg-background px-4 py-3",
+                    "text-sm font-ui font-bold text-foreground transition-colors hover:bg-muted",
+                    "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
+                  )
+                }
+              ),
+              children: [
+                /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-2", children: [
+                  title,
+                  totalSelected > 0 && /* @__PURE__ */ jsx("span", { className: "inline-flex h-5 min-w-[20px] items-center justify-center rounded-full bg-primary px-1.5 text-[10px] font-bold text-primary-foreground", children: totalSelected })
+                ] }),
+                /* @__PURE__ */ jsx(SlidersHorizontalIcon, { className: "h-4 w-4 text-foreground" })
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            DialogContent,
+            {
+              className: cn(
+                "p-0 sm:max-w-md",
+                "max-w-none w-screen h-screen sm:h-auto sm:max-h-[90vh] rounded-none sm:rounded-2xl"
+              ),
+              children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col h-full max-h-[90vh]", children: [
+                /* @__PURE__ */ jsx(DialogTitle, { className: "px-5 py-4 text-lg font-bold font-heading border-b border-border", children: title }),
+                /* @__PURE__ */ jsx("div", { className: "flex-1 overflow-y-auto px-5 py-3", children: drawerGroups }),
+                /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-3 px-5 py-4 border-t border-border", children: [
+                  /* @__PURE__ */ jsx(
+                    "button",
+                    {
+                      type: "button",
+                      onClick: handleClearAll,
+                      className: "text-sm font-ui font-semibold text-muted-foreground underline underline-offset-2 hover:text-foreground",
+                      children: "Clear all"
+                    }
+                  ),
+                  /* @__PURE__ */ jsxs(
+                    DialogClose,
+                    {
+                      render: /* @__PURE__ */ jsx(
+                        "button",
+                        {
+                          type: "button",
+                          className: "inline-flex items-center justify-center rounded-full bg-foreground text-background px-6 py-2.5 text-sm font-ui font-bold hover:bg-foreground/90 transition-colors"
+                        }
+                      ),
+                      children: [
+                        "Show ",
+                        totalSelected > 0 ? `(${totalSelected})` : "",
+                        " results"
+                      ]
+                    }
+                  )
+                ] })
+              ] })
+            }
+          )
+        ] }),
+        sortOptions && sortOptions.length > 0 && /* @__PURE__ */ jsxs(Popover, { children: [
+          /* @__PURE__ */ jsxs(
+            PopoverTrigger,
+            {
+              render: /* @__PURE__ */ jsx(
+                "button",
+                {
+                  type: "button",
+                  className: cn(
+                    "inline-flex items-center gap-1.5 rounded-xl border border-border bg-background px-4 py-3",
+                    "text-sm font-ui font-bold text-foreground transition-colors hover:bg-muted",
+                    "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
+                  )
+                }
+              ),
+              children: [
+                "Sort",
+                /* @__PURE__ */ jsx(ChevronDownIcon, { className: "h-4 w-4 text-muted-foreground" })
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsx(PopoverContent, { align: "end", sideOffset: 6, className: "w-52", children: /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-0.5 p-0.5", children: sortOptions.map((opt) => /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              onClick: () => onSortChange == null ? void 0 : onSortChange(opt.id),
+              className: cn(
+                "flex items-center px-2 py-1.5 rounded-md text-sm text-left",
+                opt.id === (activeSort == null ? void 0 : activeSort.id) ? "bg-muted text-foreground font-semibold" : "text-foreground/80 hover:bg-muted"
+              ),
+              children: opt.label
+            },
+            opt.id
+          )) }) })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "hidden sm:flex items-center gap-2 flex-wrap", children: [
+        resolvedGroups.map((group) => {
+          var _a2, _b2;
+          const selectedCount = ((_a2 = selected[group.id]) != null ? _a2 : []).length;
+          const isActive = selectedCount > 0;
+          return /* @__PURE__ */ jsxs(Popover, { children: [
+            /* @__PURE__ */ jsxs(
+              PopoverTrigger,
+              {
+                render: /* @__PURE__ */ jsx(
+                  "button",
+                  {
+                    type: "button",
+                    className: cn(
+                      "inline-flex items-center gap-1.5 rounded-full border px-3.5 py-1.5",
+                      "text-sm font-ui font-semibold transition-colors",
+                      "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+                      isActive ? "border-foreground bg-foreground text-background" : "border-border bg-background text-foreground hover:bg-muted"
+                    )
+                  }
+                ),
+                children: [
+                  group.icon && /* @__PURE__ */ jsx(
+                    "span",
+                    {
+                      className: cn(
+                        "[&>svg]:h-3.5 [&>svg]:w-3.5",
+                        isActive ? "" : "text-muted-foreground"
+                      ),
+                      children: group.icon
+                    }
+                  ),
+                  group.label,
+                  selectedCount > 0 && /* @__PURE__ */ jsx(
+                    "span",
+                    {
+                      className: cn(
+                        "inline-flex items-center justify-center rounded-full text-[10px] font-bold px-1.5 min-w-[18px] h-[18px]",
+                        isActive ? "bg-background text-foreground" : "bg-foreground text-background"
+                      ),
+                      children: selectedCount
+                    }
+                  ),
+                  /* @__PURE__ */ jsx(
+                    ChevronDownIcon,
+                    {
+                      className: cn(
+                        "h-3.5 w-3.5",
+                        isActive ? "text-background/70" : "text-muted-foreground"
+                      )
+                    }
+                  )
+                ]
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              PopoverContent,
+              {
+                align: "start",
+                sideOffset: 6,
+                className: "w-72 max-h-[60vh] overflow-y-auto",
+                children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-0.5 p-2", children: [
+                  /* @__PURE__ */ jsx("p", { className: "px-1 py-1 text-[11px] font-semibold uppercase tracking-wider text-muted-foreground", children: group.label }),
+                  /* @__PURE__ */ jsx(
+                    FilterItemsList,
+                    {
+                      items: group.items,
+                      groupId: group.id,
+                      groupSelected: (_b2 = selected[group.id]) != null ? _b2 : [],
+                      onToggle: (id) => handleToggle(group.id, id),
+                      onBulkToggle: (ids, select) => handleBulkToggle(group.id, ids, select),
+                      idPrefix: "popover-filter",
+                      parentAsHeader: true,
+                      expandedItems,
+                      onToggleExpanded: toggleExpanded
+                    }
+                  )
+                ] })
+              }
+            )
+          ] }, group.id);
+        }),
+        totalSelected > 0 && /* @__PURE__ */ jsxs(
+          "button",
+          {
+            type: "button",
+            onClick: handleClearAll,
+            className: "inline-flex items-center gap-1 rounded-full px-3 py-1.5 text-xs font-ui font-semibold text-muted-foreground hover:text-foreground transition-colors",
+            children: [
+              /* @__PURE__ */ jsx(XIcon, { className: "h-3 w-3" }),
+              "Clear all (",
+              totalSelected,
+              ")"
+            ]
+          }
+        ),
+        sortOptions && sortOptions.length > 0 && /* @__PURE__ */ jsxs("div", { className: "ml-auto flex items-center gap-2", children: [
+          /* @__PURE__ */ jsx("span", { className: "text-xs text-muted-foreground font-ui hidden sm:inline", children: "Sort by" }),
+          /* @__PURE__ */ jsxs(Popover, { children: [
+            /* @__PURE__ */ jsxs(
+              PopoverTrigger,
+              {
+                render: /* @__PURE__ */ jsx(
+                  "button",
+                  {
+                    type: "button",
+                    className: cn(
+                      "inline-flex items-center gap-1.5 rounded-full border border-border bg-background px-3.5 py-1.5",
+                      "text-sm font-ui font-semibold text-foreground hover:bg-muted transition-colors",
+                      "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
+                    )
+                  }
+                ),
+                children: [
+                  (_b = activeSort == null ? void 0 : activeSort.label) != null ? _b : "Default",
+                  /* @__PURE__ */ jsx(ChevronDownIcon, { className: "h-3.5 w-3.5 text-muted-foreground" })
+                ]
+              }
+            ),
+            /* @__PURE__ */ jsx(PopoverContent, { align: "end", sideOffset: 6, className: "w-52", children: /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-0.5 p-0.5", children: sortOptions.map((opt) => /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                onClick: () => onSortChange == null ? void 0 : onSortChange(opt.id),
+                className: cn(
+                  "flex items-center px-2 py-1.5 rounded-md text-sm text-left",
+                  opt.id === (activeSort == null ? void 0 : activeSort.id) ? "bg-muted text-foreground font-semibold" : "text-foreground/80 hover:bg-muted"
+                ),
+                children: opt.label
+              },
+              opt.id
+            )) }) })
+          ] })
+        ] })
+      ] })
+    ] });
+  }
   return /* @__PURE__ */ jsxs("div", { className: cn("flex flex-col gap-4", className), children: [
     /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
       /* @__PURE__ */ jsx("h3", { className: "text-base font-bold text-foreground font-ui", children: title }),
@@ -8325,9 +8820,9 @@ function FilterPanel({
       {
         defaultValue: defaultOpenValues,
         className: "flex flex-col gap-2",
-        children: groups.map((group) => {
-          var _a;
-          const groupSelected = (_a = selected[group.id]) != null ? _a : [];
+        children: resolvedGroups.map((group) => {
+          var _a2;
+          const groupSelected = (_a2 = selected[group.id]) != null ? _a2 : [];
           return /* @__PURE__ */ jsxs(
             AccordionItem,
             {
@@ -8339,34 +8834,19 @@ function FilterPanel({
                   /* @__PURE__ */ jsx("span", { className: "text-sm font-bold text-foreground font-ui", children: group.label }),
                   groupSelected.length > 0 && /* @__PURE__ */ jsx("span", { className: "ml-1 inline-flex h-4 w-4 items-center justify-center rounded-full bg-primary text-[9px] font-bold text-primary-foreground", children: groupSelected.length })
                 ] }) }),
-                /* @__PURE__ */ jsx(AccordionContent, { className: "px-4 pb-3 pt-1", children: /* @__PURE__ */ jsx("ul", { className: "flex flex-col gap-0.5", children: group.items.map((item) => {
-                  const checked = groupSelected.includes(item.id);
-                  const checkboxId = `filter-${group.id}-${item.id}`;
-                  return /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs(
-                    "label",
-                    {
-                      htmlFor: checkboxId,
-                      className: "flex cursor-pointer items-center gap-3 rounded-md px-1 py-2 transition-colors hover:bg-muted/50",
-                      children: [
-                        /* @__PURE__ */ jsx(
-                          Checkbox,
-                          {
-                            id: checkboxId,
-                            checked,
-                            onCheckedChange: () => handleToggle(group.id, item.id),
-                            className: "shrink-0"
-                          }
-                        ),
-                        /* @__PURE__ */ jsx("span", { className: "flex-1 text-sm text-foreground font-ui", children: item.label }),
-                        item.count !== void 0 && /* @__PURE__ */ jsxs("span", { className: "text-xs font-medium text-primary font-ui", children: [
-                          "(",
-                          item.count,
-                          ")"
-                        ] })
-                      ]
-                    }
-                  ) }, item.id);
-                }) }) })
+                /* @__PURE__ */ jsx(AccordionContent, { className: "px-4 pb-3 pt-1", children: /* @__PURE__ */ jsx(
+                  FilterItemsList,
+                  {
+                    items: group.items,
+                    groupId: group.id,
+                    groupSelected,
+                    onToggle: (id) => handleToggle(group.id, id),
+                    onBulkToggle: (ids, select) => handleBulkToggle(group.id, ids, select),
+                    idPrefix: "filter",
+                    expandedItems,
+                    onToggleExpanded: toggleExpanded
+                  }
+                ) })
               ]
             },
             group.id
@@ -8387,70 +8867,182 @@ function FilterPanel({
 var TRUSTPILOT_SCRIPT_SRC = "https://widget.trustpilot.com/bootstrap/v5/tp.widget.bootstrap.min.js";
 function TrustpilotEmbed({ config }) {
   var _a, _b, _c, _d, _e, _f;
-  const ref = React8.useRef(null);
-  React8.useEffect(() => {
+  const ref = React28.useRef(null);
+  const [widgetReady, setWidgetReady] = React28.useState(false);
+  const [delayPassed, setDelayPassed] = React28.useState(false);
+  const showFallback = delayPassed && !widgetReady;
+  React28.useEffect(() => {
+    var _a2;
     if (typeof document === "undefined" || !ref.current) return;
+    const node = ref.current;
     let cancelled = false;
+    const checkRendered = () => {
+      if (!node) return false;
+      if (node.querySelector("iframe")) return true;
+      if (node.innerHTML.length > 200) return true;
+      return false;
+    };
+    const observer = new MutationObserver(() => {
+      if (cancelled) return;
+      if (checkRendered()) setWidgetReady(true);
+    });
+    observer.observe(node, { childList: true, subtree: true });
+    if (checkRendered()) setWidgetReady(true);
     const initWidget = () => {
-      if (cancelled || !ref.current) return;
+      if (cancelled || !node) return;
       const tp = window.Trustpilot;
       if (tp == null ? void 0 : tp.loadFromElement) {
-        tp.loadFromElement(ref.current, true);
+        tp.loadFromElement(node, true);
       }
     };
     const existing = document.querySelector(
       `script[src="${TRUSTPILOT_SCRIPT_SRC}"]`
     );
+    let cleanupScriptListener;
     if (existing) {
       const tp = window.Trustpilot;
       if (tp == null ? void 0 : tp.loadFromElement) {
         initWidget();
       } else {
         existing.addEventListener("load", initWidget, { once: true });
+        cleanupScriptListener = () => existing.removeEventListener("load", initWidget);
       }
-      return () => {
-        cancelled = true;
-        existing.removeEventListener("load", initWidget);
-      };
+    } else {
+      const s = document.createElement("script");
+      s.src = TRUSTPILOT_SCRIPT_SRC;
+      s.async = true;
+      s.addEventListener("load", initWidget, { once: true });
+      document.body.appendChild(s);
+      cleanupScriptListener = () => s.removeEventListener("load", initWidget);
     }
-    const s = document.createElement("script");
-    s.src = TRUSTPILOT_SCRIPT_SRC;
-    s.async = true;
-    s.addEventListener("load", initWidget, { once: true });
-    document.body.appendChild(s);
+    const delay = (_a2 = config.fallbackDelayMs) != null ? _a2 : 3e3;
+    const timeout = setTimeout(() => {
+      if (!cancelled) setDelayPassed(true);
+    }, delay);
     return () => {
       cancelled = true;
-      s.removeEventListener("load", initWidget);
+      clearTimeout(timeout);
+      observer.disconnect();
+      cleanupScriptListener == null ? void 0 : cleanupScriptListener();
     };
   }, [config]);
   const sku = Array.isArray(config.sku) ? config.sku.join(",") : config.sku;
-  return /* @__PURE__ */ jsx(
-    "div",
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref,
+        className: "trustpilot-widget",
+        "data-locale": (_a = config.locale) != null ? _a : "en-US",
+        "data-template-id": (_b = config.templateId) != null ? _b : "5763bccae0a06d08e809ecbb",
+        "data-businessunit-id": config.businessUnitId,
+        "data-style-height": (_c = config.styleHeight) != null ? _c : "700px",
+        "data-style-width": (_d = config.styleWidth) != null ? _d : "100%",
+        "data-sku": sku,
+        "data-no-reviews": (_e = config.noReviews) != null ? _e : "hide",
+        "data-fullwidth": "true",
+        "data-theme": config.theme,
+        "data-token": config.token,
+        "data-scroll-to-list": config.scrollToList ? "true" : void 0,
+        "data-style-alignment": config.styleAlignment,
+        "data-star-color": config.starColor,
+        children: /* @__PURE__ */ jsx(
+          "a",
+          {
+            href: (_f = config.fallbackHref) != null ? _f : "https://www.trustpilot.com/",
+            target: "_blank",
+            rel: "noopener noreferrer",
+            children: "Trustpilot"
+          }
+        )
+      }
+    ),
+    showFallback && /* @__PURE__ */ jsx(TrustpilotFallback, { config })
+  ] });
+}
+function FallbackStar({ filled, className }) {
+  return /* @__PURE__ */ jsx(
+    "span",
     {
-      ref,
-      className: "trustpilot-widget",
-      "data-locale": (_a = config.locale) != null ? _a : "en-US",
-      "data-template-id": (_b = config.templateId) != null ? _b : "5763bccae0a06d08e809ecbb",
-      "data-businessunit-id": config.businessUnitId,
-      "data-style-height": (_c = config.styleHeight) != null ? _c : "700px",
-      "data-style-width": (_d = config.styleWidth) != null ? _d : "100%",
-      "data-sku": sku,
-      "data-no-reviews": (_e = config.noReviews) != null ? _e : "hide",
-      "data-fullwidth": "true",
-      "data-theme": config.theme,
-      "data-token": config.token,
-      "data-scroll-to-list": config.scrollToList ? "true" : void 0,
-      "data-style-alignment": config.styleAlignment,
-      "data-star-color": config.starColor,
-      children: /* @__PURE__ */ jsx(
-        "a",
-        {
-          href: (_f = config.fallbackHref) != null ? _f : "https://www.trustpilot.com/",
-          target: "_blank",
-          rel: "noopener noreferrer",
-          children: "Trustpilot"
-        }
-      )
+      "aria-hidden": true,
+      className: cn(
+        "inline-flex items-center justify-center",
+        filled ? "bg-[#00b67a] text-white" : "bg-muted text-muted-foreground",
+        className
+      ),
+      children: /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", className: "h-[60%] w-[60%]", fill: "currentColor", children: /* @__PURE__ */ jsx("path", { d: "M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z" }) })
+    }
+  );
+}
+function TrustpilotFallback({ config }) {
+  var _a, _b, _c, _d, _e, _f;
+  const score = (_a = config.fallbackScore) != null ? _a : 4.8;
+  const count = (_b = config.fallbackCount) != null ? _b : 0;
+  const label = (_c = config.fallbackLabel) != null ? _c : "Excellent";
+  const href = (_d = config.fallbackHref) != null ? _d : "https://www.trustpilot.com/";
+  const isDark = config.theme === "dark";
+  const styleHeightPx = parseInt((_e = config.styleHeight) != null ? _e : "", 10);
+  const autoVariant = Number.isFinite(styleHeightPx) && styleHeightPx > 0 && styleHeightPx < 120 ? "mini" : "card";
+  const variant = (_f = config.fallbackVariant) != null ? _f : autoVariant;
+  const filledStars = Math.round(score);
+  if (variant === "mini") {
+    return /* @__PURE__ */ jsxs(
+      "a",
+      {
+        href,
+        target: "_blank",
+        rel: "noopener noreferrer",
+        className: cn(
+          "inline-flex items-center gap-2 text-sm font-ui no-underline hover:opacity-80 transition-opacity",
+          isDark ? "text-white" : "text-foreground"
+        ),
+        children: [
+          /* @__PURE__ */ jsx("div", { className: "flex items-center gap-0.5", children: Array.from({ length: 5 }).map((_, i) => /* @__PURE__ */ jsx(FallbackStar, { filled: i < filledStars, className: "h-4 w-4 rounded-[2px]" }, i)) }),
+          /* @__PURE__ */ jsx("span", { className: "font-bold", children: score.toFixed(1) }),
+          count > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx("span", { className: cn(isDark ? "text-white/60" : "text-muted-foreground"), children: "\xB7" }),
+            /* @__PURE__ */ jsxs("span", { className: cn("text-xs", isDark ? "text-white/80" : "text-muted-foreground"), children: [
+              count.toLocaleString(),
+              " reviews"
+            ] })
+          ] }),
+          /* @__PURE__ */ jsx("span", { className: cn("text-xs", isDark ? "text-white/60" : "text-muted-foreground"), children: "on Trustpilot" })
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs(
+    "a",
+    {
+      href,
+      target: "_blank",
+      rel: "noopener noreferrer",
+      className: "block max-w-md mx-auto rounded-2xl border border-border bg-card p-8 text-center no-underline shadow-sm hover:shadow-md transition-shadow",
+      children: [
+        /* @__PURE__ */ jsx("div", { className: "flex justify-center items-center gap-1 mb-3", children: Array.from({ length: 5 }).map((_, i) => /* @__PURE__ */ jsx(FallbackStar, { filled: i < filledStars, className: "h-7 w-7 rounded-[3px]" }, i)) }),
+        /* @__PURE__ */ jsxs("p", { className: "text-2xl font-bold text-foreground font-heading", children: [
+          label,
+          " ",
+          /* @__PURE__ */ jsxs("span", { className: "text-muted-foreground font-normal", children: [
+            "\xB7 ",
+            score.toFixed(1),
+            " / 5"
+          ] })
+        ] }),
+        count > 0 && /* @__PURE__ */ jsxs("p", { className: "text-sm text-muted-foreground mt-2", children: [
+          "Based on ",
+          /* @__PURE__ */ jsx("span", { className: "font-semibold text-foreground", children: count.toLocaleString() }),
+          " reviews"
+        ] }),
+        /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground mt-4", children: "Reviews powered by Trustpilot" }),
+        /* @__PURE__ */ jsxs("span", { className: "mt-5 inline-flex items-center gap-1.5 text-sm font-semibold text-primary border-b border-primary/40 pb-0.5", children: [
+          "Read all reviews on Trustpilot",
+          /* @__PURE__ */ jsxs("svg", { className: "h-3.5 w-3.5", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.2", strokeLinecap: "round", strokeLinejoin: "round", children: [
+            /* @__PURE__ */ jsx("line", { x1: "5", y1: "12", x2: "19", y2: "12" }),
+            /* @__PURE__ */ jsx("polyline", { points: "12 5 19 12 12 19" })
+          ] })
+        ] })
+      ]
     }
   );
 }
@@ -8520,11 +9112,11 @@ function ItineraryModal({
   onNext
 }) {
   var _a, _b, _c;
-  const [imgIndex, setImgIndex] = React8.useState(0);
+  const [imgIndex, setImgIndex] = React28.useState(0);
   const images = stop ? [stop.coverImage, ...(_a = stop.images) != null ? _a : []] : [];
   const isFirst = (stop == null ? void 0 : stop.dayNumber) === ((_b = allStops[0]) == null ? void 0 : _b.dayNumber);
   const isLast = (stop == null ? void 0 : stop.dayNumber) === ((_c = allStops[allStops.length - 1]) == null ? void 0 : _c.dayNumber);
-  React8.useEffect(() => {
+  React28.useEffect(() => {
     setImgIndex(0);
   }, [stop == null ? void 0 : stop.dayNumber]);
   if (!stop) return null;
@@ -8651,8 +9243,8 @@ function ItineraryModal({
   ) });
 }
 function Itinerary({ title, subtitle, stops, className }) {
-  const [activeIndex, setActiveIndex] = React8.useState(null);
-  const scrollRef = React8.useRef(null);
+  const [activeIndex, setActiveIndex] = React28.useState(null);
+  const scrollRef = React28.useRef(null);
   const activeStop = activeIndex !== null ? stops[activeIndex] : null;
   const scrollBy = (dir) => {
     if (!scrollRef.current) return;
@@ -8744,18 +9336,18 @@ function Lightbox({
   onClose
 }) {
   var _a;
-  const [index, setIndex] = React8.useState(initialIndex);
+  const [index, setIndex] = React28.useState(initialIndex);
   const total = photos.length;
   const photo = photos[index];
-  const prev = React8.useCallback(
+  const prev = React28.useCallback(
     () => setIndex((i) => (i - 1 + total) % total),
     [total]
   );
-  const next = React8.useCallback(
+  const next = React28.useCallback(
     () => setIndex((i) => (i + 1) % total),
     [total]
   );
-  React8.useEffect(() => {
+  React28.useEffect(() => {
     const onKey = (e) => {
       if (e.key === "Escape") onClose();
       if (e.key === "ArrowLeft") prev();
@@ -8921,7 +9513,7 @@ function GridGallery({
   initialVisible,
   onOpen
 }) {
-  const [expanded, setExpanded] = React8.useState(false);
+  const [expanded, setExpanded] = React28.useState(false);
   const cols = gridCols(photos.length);
   const hasMore = photos.length > initialVisible;
   const visible = expanded || !hasMore ? photos : photos.slice(0, initialVisible);
@@ -8946,12 +9538,41 @@ function GridGallery({
     )
   ] });
 }
+function CompactGridGallery({
+  photos,
+  initialVisible,
+  onOpen
+}) {
+  const [expanded, setExpanded] = React28.useState(false);
+  const hasMore = photos.length > initialVisible;
+  const visible = expanded || !hasMore ? photos : photos.slice(0, initialVisible);
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx("div", { className: "grid grid-cols-2 lg:grid-cols-4", children: visible.map((p, i) => /* @__PURE__ */ jsx(
+      PhotoTile,
+      {
+        photo: p,
+        index: i,
+        className: "aspect-[4/3]",
+        onClick: () => onOpen(i)
+      },
+      i
+    )) }),
+    hasMore && /* @__PURE__ */ jsx(
+      ShowMoreButton,
+      {
+        count: photos.length - initialVisible,
+        expanded,
+        onClick: () => setExpanded((v) => !v)
+      }
+    )
+  ] });
+}
 function MasonryGallery({
   photos,
   initialVisible,
   onOpen
 }) {
-  const [expanded, setExpanded] = React8.useState(false);
+  const [expanded, setExpanded] = React28.useState(false);
   const hasMore = photos.length > initialVisible;
   const visible = expanded || !hasMore ? photos : photos.slice(0, initialVisible);
   return /* @__PURE__ */ jsxs(Fragment, { children: [
@@ -9024,7 +9645,7 @@ function FeaturedGallery({
   photos,
   onOpen
 }) {
-  const [expanded, setExpanded] = React8.useState(false);
+  const [expanded, setExpanded] = React28.useState(false);
   const featured = photos.slice(0, 3);
   const extra = photos.slice(3);
   return /* @__PURE__ */ jsxs(Fragment, { children: [
@@ -9191,9 +9812,9 @@ function PhotoGallery({
   onPhotoClick,
   className
 }) {
-  const [lightboxIndex, setLightboxIndex] = React8.useState(null);
-  const [carouselIndex, setCarouselIndex] = React8.useState(0);
-  const normalised = React8.useMemo(() => photos.map(normalise), [photos]);
+  const [lightboxIndex, setLightboxIndex] = React28.useState(null);
+  const [carouselIndex, setCarouselIndex] = React28.useState(0);
+  const normalised = React28.useMemo(() => photos.map(normalise), [photos]);
   const handleOpen = (index) => {
     setLightboxIndex(index);
     onPhotoClick == null ? void 0 : onPhotoClick(normalised[index].src, index);
@@ -9235,6 +9856,14 @@ function PhotoGallery({
         onOpen: handleOpen
       }
     ),
+    variant === "gridCompact" && /* @__PURE__ */ jsx(
+      CompactGridGallery,
+      {
+        photos: normalised,
+        initialVisible,
+        onOpen: handleOpen
+      }
+    ),
     variant === "masonry" && /* @__PURE__ */ jsx(
       MasonryGallery,
       {
@@ -9269,7 +9898,7 @@ function ItineraryDay({
   photoLayout = "rounded",
   className
 }) {
-  const photoList = React8.useMemo(() => normalisePhotos(photos), [photos]);
+  const photoList = React28.useMemo(() => normalisePhotos(photos), [photos]);
   const isFullBleed = photoLayout === "fullBleed" || photoLayout === "fullBleedBottom";
   const photoPosition = photoLayout === "fullBleedBottom" ? "bottom" : "top";
   const gallery = photoList.length > 0 && /* @__PURE__ */ jsx(
@@ -9288,13 +9917,16 @@ function ItineraryDay({
     specs && specs.length > 0 && /* @__PURE__ */ jsx("ul", { className: "flex flex-col gap-3 sm:gap-2.5", children: specs.map((spec, i) => /* @__PURE__ */ jsxs(
       "li",
       {
-        className: "flex flex-col text-base text-foreground font-ui",
+        className: "flex items-start gap-3 text-base text-foreground font-ui",
         children: [
-          /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-baseline gap-x-2", children: [
-            /* @__PURE__ */ jsx("span", { className: "font-semibold", children: spec.label }),
-            spec.detail && /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: spec.detail })
-          ] }),
-          spec.subdetail && /* @__PURE__ */ jsx("span", { className: "text-sm text-muted-foreground", children: spec.subdetail })
+          /* @__PURE__ */ jsx("span", { className: "mt-0.5 shrink-0 text-foreground", "aria-hidden": true, children: spec.icon }),
+          /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-baseline gap-x-2", children: [
+              /* @__PURE__ */ jsx("span", { className: "font-semibold", children: spec.label }),
+              spec.detail && /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: spec.detail })
+            ] }),
+            spec.subdetail && /* @__PURE__ */ jsx("span", { className: "text-sm text-muted-foreground", children: spec.subdetail })
+          ] })
         ]
       },
       i
@@ -9321,8 +9953,8 @@ function MenuTrip({
   bold = true,
   className
 }) {
-  const scrollRef = React8.useRef(null);
-  React8.useEffect(() => {
+  const scrollRef = React28.useRef(null);
+  React28.useEffect(() => {
     if (!scrollRef.current || !activeSection) return;
     const container = scrollRef.current;
     const btn = container.querySelector(
@@ -9513,8 +10145,8 @@ function PricingTrip({
   className
 }) {
   const rOuter = sharp ? "rounded-none" : "rounded-2xl";
-  const [showEstimates, setShowEstimates] = React8.useState(false);
-  const [showPriceInfo, setShowPriceInfo] = React8.useState(false);
+  const [showEstimates, setShowEstimates] = React28.useState(false);
+  const [showPriceInfo, setShowPriceInfo] = React28.useState(false);
   if (variant === "compact") {
     const showOverlay = showPriceInfo && (!!priceInfo || !!currencyEstimates && currencyEstimates.length > 0);
     return /* @__PURE__ */ jsxs("div", { className: cn("flex flex-col gap-2", className), children: [
@@ -9798,8 +10430,7 @@ var VARIANT = {
     mobileLink: "text-white hover:text-primary-400 border-b border-white/10",
     mobileSub: "text-white/70 font-bold hover:text-primary-400 border-b border-white/8",
     mobileLangActive: "text-primary-400 font-semibold",
-    mobileLangIdle: "text-white/40 hover:text-primary-400",
-    logoBlend: "mix-blend-screen"
+    mobileLangIdle: "text-white/40 hover:text-primary-400"
   },
   white: {
     header: "bg-white border-b border-border shadow-sm",
@@ -9815,8 +10446,7 @@ var VARIANT = {
     mobileLink: "text-foreground/80 hover:text-foreground border-b border-border",
     mobileSub: "text-foreground/50 font-bold hover:text-foreground border-b border-border/40",
     mobileLangActive: "text-primary font-semibold",
-    mobileLangIdle: "text-muted-foreground hover:text-foreground",
-    logoBlend: "invert mix-blend-multiply"
+    mobileLangIdle: "text-muted-foreground hover:text-foreground"
   },
   dark: {
     header: "bg-neutral-950 border-b border-white/10",
@@ -9832,8 +10462,7 @@ var VARIANT = {
     mobileLink: "text-white/80 hover:text-white border-b border-white/8",
     mobileSub: "text-white/45 font-bold hover:text-white border-b border-white/5",
     mobileLangActive: "text-white font-semibold",
-    mobileLangIdle: "text-white/35 hover:text-white/60",
-    logoBlend: "mix-blend-screen"
+    mobileLangIdle: "text-white/35 hover:text-white/60"
   }
 };
 var DEFAULT_HEADER_LINKS = [
@@ -9943,7 +10572,9 @@ function LangDropdown({
 function SiteHeader({
   variant = "transparent",
   links = DEFAULT_HEADER_LINKS,
-  logoSrc = "/logo-planetaexo.png",
+  logoSrcLight = "/logo-planetaexo-white.png",
+  logoSrcDark = "/logo-planetaexo-green.png",
+  logoSrc,
   logoAlt = "Planeta Exo",
   languages = DEFAULT_LANGUAGES,
   currentLanguage = "EN",
@@ -9954,14 +10585,15 @@ function SiteHeader({
   className
 }) {
   const t = VARIANT[variant];
-  const [openMenu, setOpenMenu] = React8.useState(null);
-  const [langOpen, setLangOpen] = React8.useState(false);
-  const [mobileOpen, setMobileOpen] = React8.useState(false);
-  const [openMobileSection, setOpenMobileSection] = React8.useState(null);
-  const [activeLang, setActiveLang] = React8.useState(currentLanguage);
+  const resolvedLogo = logoSrc != null ? logoSrc : variant === "white" ? logoSrcDark : logoSrcLight;
+  const [openMenu, setOpenMenu] = React28.useState(null);
+  const [langOpen, setLangOpen] = React28.useState(false);
+  const [mobileOpen, setMobileOpen] = React28.useState(false);
+  const [openMobileSection, setOpenMobileSection] = React28.useState(null);
+  const [activeLang, setActiveLang] = React28.useState(currentLanguage);
   const toggleMobileSection = (label) => setOpenMobileSection((prev) => prev === label ? null : label);
-  const menuCloseTimer = React8.useRef(void 0);
-  const langCloseTimer = React8.useRef(void 0);
+  const menuCloseTimer = React28.useRef(void 0);
+  const langCloseTimer = React28.useRef(void 0);
   const handleMenuEnter = (label) => {
     clearTimeout(menuCloseTimer.current);
     setOpenMenu(label);
@@ -9982,7 +10614,7 @@ function SiteHeader({
     setOpenMenu(null);
     setLangOpen(false);
   };
-  React8.useEffect(() => () => {
+  React28.useEffect(() => () => {
     clearTimeout(menuCloseTimer.current);
     clearTimeout(langCloseTimer.current);
   }, []);
@@ -10002,17 +10634,41 @@ function SiteHeader({
         className
       ),
       children: [
-        variant === "transparent" && /* @__PURE__ */ jsx("div", { className: "absolute inset-x-0 top-0 h-52 bg-gradient-to-b from-black/55 via-black/20 to-transparent pointer-events-none" }),
+        variant === "transparent" && /* @__PURE__ */ jsx("div", { className: "absolute inset-x-0 top-0 h-52 bg-gradient-to-b from-black/70 via-black/30 to-transparent pointer-events-none" }),
         /* @__PURE__ */ jsxs("div", { className: "relative flex items-center gap-2 px-6 sm:px-10 h-[72px]", children: [
-          /* @__PURE__ */ jsx("a", { href: "#", className: "shrink-0 flex items-center mr-4", children: /* @__PURE__ */ jsx(
-            "img",
+          /* @__PURE__ */ jsx(
+            "button",
             {
-              src: logoSrc,
-              alt: logoAlt,
-              className: cn("h-11 w-auto select-none", t.logoBlend),
-              draggable: false
+              type: "button",
+              onClick: () => setMobileOpen(true),
+              "aria-label": "Open menu",
+              className: cn(
+                "flex lg:hidden h-9 w-9 items-center justify-center rounded-full transition-colors -ml-1.5",
+                t.mobileTrigger
+              ),
+              children: /* @__PURE__ */ jsx(MenuIcon, { className: "h-[18px] w-[18px]" })
             }
-          ) }),
+          ),
+          /* @__PURE__ */ jsx(
+            "a",
+            {
+              href: "#",
+              className: cn(
+                "shrink-0 flex items-center",
+                "absolute left-1/2 -translate-x-1/2",
+                "lg:static lg:translate-x-0 lg:mr-4"
+              ),
+              children: /* @__PURE__ */ jsx(
+                "img",
+                {
+                  src: resolvedLogo,
+                  alt: logoAlt,
+                  className: "h-14 w-auto select-none",
+                  draggable: false
+                }
+              )
+            }
+          ),
           /* @__PURE__ */ jsx("nav", { className: "hidden lg:flex items-center gap-0.5 mx-auto", children: links.map((link) => {
             var _a, _b;
             const hasDropdown = !!((_a = link.items) == null ? void 0 : _a.length);
@@ -10136,19 +10792,6 @@ function SiteHeader({
                 ),
                 children: /* @__PURE__ */ jsx(UserIcon, { className: "h-[18px] w-[18px]" })
               }
-            ),
-            /* @__PURE__ */ jsx(
-              "button",
-              {
-                type: "button",
-                onClick: () => setMobileOpen(true),
-                "aria-label": "Open menu",
-                className: cn(
-                  "flex lg:hidden h-9 w-9 items-center justify-center rounded-full transition-colors ml-0.5",
-                  t.mobileTrigger
-                ),
-                children: /* @__PURE__ */ jsx(MenuIcon, { className: "h-[18px] w-[18px]" })
-              }
             )
           ] })
         ] }),
@@ -10164,9 +10807,9 @@ function SiteHeader({
                 /* @__PURE__ */ jsx("a", { href: "#", className: "shrink-0 flex items-center", onClick: () => setMobileOpen(false), children: /* @__PURE__ */ jsx(
                   "img",
                   {
-                    src: logoSrc,
+                    src: resolvedLogo,
                     alt: logoAlt,
-                    className: cn("h-11 w-auto select-none", t.logoBlend),
+                    className: "h-14 w-auto select-none",
                     draggable: false
                   }
                 ) }),
@@ -10247,7 +10890,7 @@ function SiteHeader({
               ), children: [
                 /* @__PURE__ */ jsx("div", { className: "flex items-center gap-1.5 flex-wrap", children: languages.map((lang, i) => {
                   const isActive = lang.code === activeLang;
-                  return /* @__PURE__ */ jsxs(React8.Fragment, { children: [
+                  return /* @__PURE__ */ jsxs(React28.Fragment, { children: [
                     i > 0 && /* @__PURE__ */ jsx("span", { className: cn(
                       "text-xs select-none",
                       variant === "white" ? "text-border" : "text-white/15"
@@ -10309,8 +10952,8 @@ function SiteHeader({
   );
 }
 function ThemeToggle({ className }) {
-  const [dark, setDark] = React8.useState(false);
-  React8.useEffect(() => {
+  const [dark, setDark] = React28.useState(false);
+  React28.useEffect(() => {
     const saved = localStorage.getItem("theme");
     const prefersDark = window.matchMedia("(prefers-color-scheme: dark)").matches;
     const isDark = saved === "dark" || !saved && prefersDark;
@@ -10339,6 +10982,44 @@ function ThemeToggle({ className }) {
     }
   );
 }
+var chipVariants = cva(
+  "inline-flex items-center rounded-full font-ui font-medium transition-colors whitespace-nowrap",
+  {
+    variants: {
+      variant: {
+        glass: "border border-white/15 bg-black/30 text-white/85 backdrop-blur-sm hover:bg-white/10 hover:border-white/50 hover:text-white",
+        solid: "bg-muted text-foreground/80 hover:bg-primary hover:text-primary-foreground",
+        outline: "border border-border text-foreground/80 hover:bg-primary hover:border-primary hover:text-primary-foreground"
+      },
+      size: {
+        sm: "px-2.5 py-0.5 text-[11px] leading-5",
+        md: "px-3 py-1 text-xs leading-5",
+        lg: "px-4 py-1.5 text-sm leading-5"
+      }
+    },
+    defaultVariants: {
+      variant: "glass",
+      size: "sm"
+    }
+  }
+);
+var Chip = React28.forwardRef(function Chip2(_a, ref) {
+  var _b = _a, { className, variant, size, href, children } = _b, props = __objRest(_b, ["className", "variant", "size", "href", "children"]);
+  const classes = cn(chipVariants({ variant, size }), className);
+  if (href) {
+    return /* @__PURE__ */ jsx(
+      "a",
+      __spreadProps(__spreadValues({
+        ref,
+        href,
+        className: classes
+      }, props), {
+        children
+      })
+    );
+  }
+  return /* @__PURE__ */ jsx("span", __spreadProps(__spreadValues({ ref, className: classes }, props), { children }));
+});
 function CalendarIcon6() {
   return /* @__PURE__ */ jsxs("svg", { width: "13", height: "13", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.2", strokeLinecap: "round", strokeLinejoin: "round", children: [
     /* @__PURE__ */ jsx("rect", { x: "3", y: "4", width: "18", height: "18", rx: "2" }),
@@ -10389,19 +11070,125 @@ var statusConfig = {
     icon: /* @__PURE__ */ jsx(TrendingIcon, {})
   }
 };
-function TripCard({
-  image,
-  imageAlt = "",
-  status,
-  nights,
-  period,
-  title,
-  description,
-  cta,
-  price,
-  size = "md",
-  className
-}) {
+function HeartIcon({ filled = false }) {
+  return /* @__PURE__ */ jsx(
+    "svg",
+    {
+      width: "16",
+      height: "16",
+      viewBox: "0 0 24 24",
+      fill: filled ? "currentColor" : "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      children: /* @__PURE__ */ jsx("path", { d: "M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 0 0 0-7.78z" })
+    }
+  );
+}
+function TripCardEditorial(props) {
+  const {
+    image,
+    imageAlt = "",
+    title,
+    description,
+    nights,
+    price,
+    href,
+    className,
+    favoritable,
+    favorited: favoritedProp,
+    onFavoriteToggle,
+    location,
+    difficulty,
+    tag
+  } = props;
+  const [internalFav, setInternalFav] = React28.useState(false);
+  const favorited = favoritedProp != null ? favoritedProp : internalFav;
+  const handleFav = (e) => {
+    e.preventDefault();
+    e.stopPropagation();
+    const next = !favorited;
+    if (favoritedProp === void 0) setInternalFav(next);
+    onFavoriteToggle == null ? void 0 : onFavoriteToggle(next);
+  };
+  const body = /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs("div", { className: "relative aspect-[4/3] overflow-hidden bg-muted", children: [
+      /* @__PURE__ */ jsx(
+        "img",
+        {
+          src: image,
+          alt: imageAlt,
+          loading: "lazy",
+          className: "absolute inset-0 h-full w-full object-cover transition-transform duration-500 group-hover:scale-105"
+        }
+      ),
+      /* @__PURE__ */ jsx("div", { className: "absolute inset-0 bg-gradient-to-t from-black/85 via-black/20 to-transparent" }),
+      tag && /* @__PURE__ */ jsx("div", { className: "absolute top-3 left-3 z-10 max-w-[calc(100%-4.5rem)]", children: /* @__PURE__ */ jsx(Chip, { variant: "glass", size: "sm", children: tag }) }),
+      favoritable && /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          "aria-label": favorited ? "Remove from favorites" : "Add to favorites",
+          "aria-pressed": favorited,
+          onClick: handleFav,
+          className: cn(
+            "absolute top-3 right-3 flex h-9 w-9 items-center justify-center rounded-full",
+            "border border-white/15 bg-black/30 backdrop-blur-sm",
+            "transition-colors hover:bg-white/10 hover:border-white/50",
+            favorited ? "text-white" : "text-white/85 hover:text-white"
+          ),
+          children: /* @__PURE__ */ jsx(HeartIcon, { filled: favorited })
+        }
+      ),
+      /* @__PURE__ */ jsx("div", { className: "absolute inset-x-0 bottom-0 p-5 text-white", children: /* @__PURE__ */ jsx("h3", { className: "text-lg sm:text-xl font-bold font-heading leading-tight", children: title }) })
+    ] }),
+    (description || price || nights || location || difficulty) && /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4 bg-card p-6", children: [
+      (location || difficulty) && /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-3", children: [
+        location ? /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5 text-foreground/85", children: [
+          /* @__PURE__ */ jsx(MapPinIcon, { className: "h-4 w-4 shrink-0 text-muted-foreground" }),
+          /* @__PURE__ */ jsx("span", { className: "text-sm font-ui font-semibold", children: location })
+        ] }) : /* @__PURE__ */ jsx("span", {}),
+        difficulty && /* @__PURE__ */ jsx(Chip, { variant: "outline", size: "sm", className: "capitalize text-muted-foreground", children: difficulty })
+      ] }),
+      description && /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground leading-relaxed line-clamp-3", children: description }),
+      (nights || price) && /* @__PURE__ */ jsxs("div", { className: "mt-auto flex items-center justify-between gap-3", children: [
+        nights ? /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5 text-foreground/80", children: [
+          /* @__PURE__ */ jsx(MoonIcon, { className: "h-4 w-4 shrink-0 text-muted-foreground" }),
+          /* @__PURE__ */ jsxs("span", { className: "text-sm font-ui font-semibold", children: [
+            nights,
+            " ",
+            nights === 1 ? "night" : "nights"
+          ] })
+        ] }) : /* @__PURE__ */ jsx("span", {}),
+        price && /* @__PURE__ */ jsx("p", { className: "text-base font-bold text-foreground font-ui", children: price })
+      ] })
+    ] })
+  ] });
+  const baseClasses = cn(
+    "group relative flex flex-col overflow-hidden rounded-2xl bg-card border border-border/50",
+    "shadow-md transition-shadow duration-300 hover:shadow-xl",
+    className
+  );
+  return href ? /* @__PURE__ */ jsx("a", { href, className: baseClasses, "aria-label": title, children: body }) : /* @__PURE__ */ jsx("div", { className: baseClasses, children: body });
+}
+function TripCard(props) {
+  if (props.variant === "editorial") {
+    return /* @__PURE__ */ jsx(TripCardEditorial, __spreadValues({}, props));
+  }
+  const {
+    image,
+    imageAlt = "",
+    status,
+    nights,
+    period,
+    title,
+    description,
+    cta,
+    price,
+    size = "md",
+    className
+  } = props;
   const s = sizeConfig[size];
   const statusInfo = status ? statusConfig[status] : null;
   const meta = [
@@ -10461,7 +11248,7 @@ function TripCard({
   );
 }
 function useHlsVideo(videoRef, src) {
-  React8.useEffect(() => {
+  React28.useEffect(() => {
     if (!src || !videoRef.current) return;
     const video = videoRef.current;
     if (!src.includes(".m3u8")) return;
@@ -10498,17 +11285,18 @@ function TripHeader({
   destination,
   duration,
   tagline,
+  chips,
   belowMeta,
   siteHeader,
   uiVariant = "v1",
   className
 }) {
   var _a;
-  const [heroIndex, setHeroIndex] = React8.useState(0);
-  const [videoReady, setVideoReady] = React8.useState(false);
-  const videoRef = React8.useRef(null);
+  const [heroIndex, setHeroIndex] = React28.useState(0);
+  const [videoReady, setVideoReady] = React28.useState(false);
+  const videoRef = React28.useRef(null);
   const isHls = !!(videoUrl == null ? void 0 : videoUrl.includes(".m3u8"));
-  const validImages = React8.useMemo(
+  const validImages = React28.useMemo(
     () => images.map((u) => u == null ? void 0 : u.trim()).filter(Boolean),
     [images]
   );
@@ -10523,7 +11311,7 @@ function TripHeader({
   const nights = duration ? (_a = duration.nights) != null ? _a : Math.max(duration.days - 1, 1) : null;
   const hasMeta = !!(destination || duration);
   useHlsVideo(videoRef, isHls ? videoUrl : void 0);
-  React8.useEffect(() => {
+  React28.useEffect(() => {
     if (!videoUrl) return;
     const el = videoRef.current;
     if (!el) return;
@@ -10657,15 +11445,15 @@ function TripHeader({
             ]
           }
         ),
-        /* @__PURE__ */ jsx("div", { className: "mx-auto w-full max-w-5xl px-4 sm:px-6", children: /* @__PURE__ */ jsxs(
+        /* @__PURE__ */ jsx("div", { className: "mx-auto w-full max-w-6xl px-6 sm:px-8", children: /* @__PURE__ */ jsxs(
           "div",
           {
             className: cn(
               "relative z-10 pb-10",
-              siteHeader ? "-mt-44" : "-mt-36"
+              chips && chips.length > 0 ? siteHeader ? "-mt-[200px] sm:-mt-[214px]" : "-mt-[168px] sm:-mt-[182px]" : siteHeader ? "-mt-44" : "-mt-36"
             ),
             children: [
-              breadcrumb && breadcrumb.length > 0 && /* @__PURE__ */ jsx("div", { className: "mb-3 flex items-center gap-1.5 flex-wrap", children: breadcrumb.map((crumb, i) => /* @__PURE__ */ jsxs(React8.Fragment, { children: [
+              breadcrumb && breadcrumb.length > 0 && /* @__PURE__ */ jsx("div", { className: "mb-3 flex items-center gap-1.5 flex-wrap", children: breadcrumb.map((crumb, i) => /* @__PURE__ */ jsxs(React28.Fragment, { children: [
                 i > 0 && /* @__PURE__ */ jsx(ChevronRightIcon, { className: "h-3 w-3 text-white/50 shrink-0" }),
                 /* @__PURE__ */ jsx("span", { className: "text-xs text-white/70 font-ui hover:text-white/90 cursor-default", children: crumb.label })
               ] }, i)) }),
@@ -10691,6 +11479,7 @@ function TripHeader({
                   ] })
                 ] })
               ] }) : tagline ? /* @__PURE__ */ jsx("p", { className: "mt-2 text-sm sm:text-base text-white/80 font-ui", children: tagline }) : null,
+              chips && chips.length > 0 && /* @__PURE__ */ jsx("div", { className: "mt-3 flex flex-wrap items-center gap-1.5", children: chips.map((chip, i) => /* @__PURE__ */ jsx(Chip, { href: chip.href, children: chip.label }, i)) }),
               belowMeta && /* @__PURE__ */ jsx("div", { className: "mt-3", children: belowMeta })
             ]
           }
@@ -10699,6 +11488,427 @@ function TripHeader({
     }
   );
 }
+var VARIANT2 = {
+  light: {
+    footer: "bg-primary-50 text-foreground",
+    heading: "text-foreground",
+    body: "text-foreground/75",
+    muted: "text-foreground/60",
+    link: "text-foreground/85 hover:text-primary-800 underline decoration-foreground/25 underline-offset-4 hover:decoration-primary-800",
+    badgeStroke: "text-foreground/80",
+    /** Inverts white logos so they read on the light background. */
+    badgeFilter: "[filter:invert(1)_brightness(0.2)]",
+    socialBtn: "bg-foreground text-white hover:bg-primary-800",
+    langTrigger: "text-foreground hover:bg-white",
+    langOpen: "text-foreground bg-white",
+    langChevron: "text-foreground/40",
+    bottomBar: "border-t border-foreground/10",
+    bottomText: "text-foreground/60",
+    bottomLink: "text-foreground/80 hover:text-foreground underline decoration-foreground/20 underline-offset-4 hover:decoration-foreground"
+  },
+  dark: {
+    footer: "bg-brand-charcoal text-white",
+    heading: "text-white",
+    body: "text-white/75",
+    muted: "text-white/55",
+    link: "text-white/85 hover:text-primary-400 underline decoration-white/20 underline-offset-4 hover:decoration-primary-400",
+    badgeStroke: "text-white",
+    badgeFilter: "",
+    socialBtn: "bg-white/10 text-white hover:bg-primary-400 hover:text-primary-900",
+    langTrigger: "text-white/85 hover:bg-white/10",
+    langOpen: "text-white bg-white/10",
+    langChevron: "text-white/40",
+    bottomBar: "border-t border-white/10",
+    bottomText: "text-white/55",
+    bottomLink: "text-white/80 hover:text-white underline decoration-white/20 underline-offset-4 hover:decoration-white"
+  }
+};
+var DEFAULT_FOOTER_THEMES = [
+  { label: "Roadtrips", href: "#" },
+  { label: "Saf\xE1ri", href: "#" },
+  { label: "Trilhas", href: "#" },
+  { label: "Caiaque & Canoa", href: "#" },
+  { label: "Aurora boreal", href: "#" },
+  { label: "Micro-aventuras", href: "#" },
+  { label: "Packrafting", href: "#" },
+  { label: "Glamping", href: "#" },
+  { label: "Surf", href: "#" },
+  { label: "Viagens em fam\xEDlia", href: "#" }
+];
+var DEFAULT_FOOTER_DESTINATIONS = [
+  { label: "Brasil", href: "#" },
+  { label: "Patag\xF4nia", href: "#" },
+  { label: "Argentina", href: "#" },
+  { label: "Chile", href: "#" },
+  { label: "Bol\xEDvia", href: "#" },
+  { label: "Peru", href: "#" },
+  { label: "Equador", href: "#" },
+  { label: "Col\xF4mbia", href: "#" },
+  { label: "Costa Rica", href: "#" },
+  { label: "Filipinas", href: "#" }
+];
+var DEFAULT_FOOTER_PAGES = [
+  { label: "Contato", href: "#" },
+  { label: "Pol\xEDtica de cookies", href: "#" },
+  { label: "FAQ", href: "#" },
+  { label: "Sobre n\xF3s", href: "#" }
+];
+var DEFAULT_FOOTER_LEGAL = [
+  { label: "Termos e condi\xE7\xF5es", href: "#" },
+  { label: "Mapa do site", href: "#" }
+];
+var DEFAULT_FOOTER_LANGUAGES = [
+  { code: "PT", label: "Portugu\xEAs" },
+  { code: "EN", label: "English" },
+  { code: "NL", label: "Nederlands" },
+  { code: "DE", label: "Deutsch" },
+  { code: "FR", label: "Fran\xE7ais" },
+  { code: "ES", label: "Espa\xF1ol" }
+];
+var DEFAULT_FOOTER_SOCIALS = [
+  { network: "facebook", href: "#" },
+  { network: "instagram", href: "#" },
+  { network: "linkedin", href: "#" }
+];
+var DEFAULT_FOOTER_BADGES = [
+  {
+    src: "https://static.planetaexo.com/trips/wp-content/uploads/2025/04/member_of_TLR-white-1.png",
+    alt: "Member of The Long Run",
+    height: 80
+  },
+  {
+    src: "https://static.planetaexo.com/trips/wp-content/uploads/2025/04/atta-member_white.png",
+    alt: "Member \xB7 Adventure Travel Trade Association",
+    height: 56
+  }
+];
+var SOCIAL_ICON = {
+  facebook: FacebookIcon,
+  instagram: InstagramIcon,
+  linkedin: LinkedinIcon,
+  youtube: YoutubeIcon,
+  twitter: TwitterIcon
+};
+var SOCIAL_LABEL = {
+  facebook: "Facebook",
+  instagram: "Instagram",
+  linkedin: "LinkedIn",
+  youtube: "YouTube",
+  twitter: "Twitter"
+};
+function ColumnHeading({
+  children,
+  className
+}) {
+  return /* @__PURE__ */ jsx(
+    "h3",
+    {
+      className: cn(
+        "font-heading font-black text-base mb-5 tracking-tight",
+        className
+      ),
+      children
+    }
+  );
+}
+function LanguagePicker({
+  variant,
+  languages,
+  currentLanguage,
+  onChange
+}) {
+  var _a;
+  const t = VARIANT2[variant];
+  const [open, setOpen] = React28.useState(false);
+  const ref = React28.useRef(null);
+  const active = (_a = languages.find((l) => l.code === currentLanguage)) != null ? _a : languages[0];
+  React28.useEffect(() => {
+    if (!open) return;
+    const onDocClick = (e) => {
+      if (ref.current && !ref.current.contains(e.target)) {
+        setOpen(false);
+      }
+    };
+    document.addEventListener("mousedown", onDocClick);
+    return () => document.removeEventListener("mousedown", onDocClick);
+  }, [open]);
+  return /* @__PURE__ */ jsxs("div", { ref, className: "relative inline-block", children: [
+    /* @__PURE__ */ jsxs(
+      "button",
+      {
+        type: "button",
+        onClick: () => setOpen((v) => !v),
+        "aria-haspopup": "listbox",
+        "aria-expanded": open,
+        className: cn(
+          "inline-flex items-center gap-1 px-3 py-1.5 rounded-full text-sm font-ui transition-colors",
+          t.langTrigger,
+          open && t.langOpen
+        ),
+        children: [
+          active == null ? void 0 : active.code,
+          /* @__PURE__ */ jsx(
+            ChevronDownIcon,
+            {
+              className: cn(
+                "h-3 w-3 transition-transform duration-150",
+                t.langChevron,
+                open && "rotate-180"
+              )
+            }
+          )
+        ]
+      }
+    ),
+    open && /* @__PURE__ */ jsx(
+      "div",
+      {
+        role: "listbox",
+        className: "absolute left-0 bottom-[calc(100%+8px)] min-w-[180px] rounded-xl bg-white shadow-2xl border border-black/8 py-1.5 z-10",
+        children: languages.map((lang) => {
+          const isActive = lang.code === (active == null ? void 0 : active.code);
+          return /* @__PURE__ */ jsxs(
+            "button",
+            {
+              type: "button",
+              role: "option",
+              "aria-selected": isActive,
+              onClick: () => {
+                onChange == null ? void 0 : onChange(lang.code);
+                setOpen(false);
+              },
+              className: cn(
+                "flex items-center gap-3 w-full px-5 py-2.5 text-sm font-ui text-left transition-colors hover:bg-muted",
+                isActive ? "text-primary font-semibold" : "text-foreground"
+              ),
+              children: [
+                /* @__PURE__ */ jsx("span", { className: "font-semibold w-8 shrink-0", children: lang.code }),
+                /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: lang.label })
+              ]
+            },
+            lang.code
+          );
+        })
+      }
+    )
+  ] });
+}
+function SiteFooter({
+  variant = "dark",
+  brandTitle = "PlanetaEXO",
+  logoSrcLight = "/logo-planetaexo-white.png",
+  logoSrcDark = "/logo-planetaexo-green.png",
+  logoSrc,
+  logoAlt = "PlanetaEXO",
+  logoHref = "#",
+  brandDescription = /* @__PURE__ */ jsxs(Fragment, { children: [
+    "A PlanetaEXO \xE9 uma ag\xEAncia brasileira especializada em viagens de ecoturismo e aventura. Operamos com guias locais credenciados e parceiros que respeitam comunidades e ecossistemas.",
+    " ",
+    /* @__PURE__ */ jsx(
+      "a",
+      {
+        href: "#",
+        className: "font-bold underline decoration-current/30 underline-offset-4 hover:decoration-current",
+        children: "Pol\xEDtica de privacidade"
+      }
+    )
+  ] }),
+  badges = DEFAULT_FOOTER_BADGES,
+  languages = DEFAULT_FOOTER_LANGUAGES,
+  currentLanguage = "PT",
+  onLanguageChange,
+  address = {
+    title: "Basecamp S\xE3o Paulo",
+    lines: ["Av. Paulista, 1234", "01310-100 S\xE3o Paulo \xB7 Brasil"]
+  },
+  phone = "+55 11 9999-0000",
+  email = "ola@planetaexo.com",
+  socials = DEFAULT_FOOTER_SOCIALS,
+  themesTitle = "Temas",
+  themes = DEFAULT_FOOTER_THEMES,
+  destinationsTitle = "Destinos",
+  destinations = DEFAULT_FOOTER_DESTINATIONS,
+  destinationsMore = { label: "Ver todos os destinos", href: "#" },
+  pagesTitle = "P\xE1ginas",
+  pages = DEFAULT_FOOTER_PAGES,
+  cta = {
+    title: "Colaborar?",
+    label: "parceiros@planetaexo.com",
+    href: "mailto:parceiros@planetaexo.com"
+  },
+  copyright,
+  legalLinks = DEFAULT_FOOTER_LEGAL,
+  className
+}) {
+  const t = VARIANT2[variant];
+  const resolvedLogo = logoSrc != null ? logoSrc : variant === "light" ? logoSrcDark : logoSrcLight;
+  const year = (/* @__PURE__ */ new Date()).getFullYear();
+  const copy = copyright != null ? copyright : `\xA9 ${year} ${brandTitle}. Todos os direitos reservados.`;
+  return /* @__PURE__ */ jsxs("footer", { className: cn(t.footer, className), children: [
+    /* @__PURE__ */ jsx("div", { className: "max-w-7xl mx-auto px-6 sm:px-10 pt-16 pb-10", children: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-12 gap-x-8 gap-y-12", children: [
+      /* @__PURE__ */ jsxs("div", { className: "lg:col-span-4 space-y-6", children: [
+        /* @__PURE__ */ jsx(
+          "a",
+          {
+            href: logoHref,
+            className: "inline-flex items-center",
+            "aria-label": logoAlt,
+            children: /* @__PURE__ */ jsx(
+              "img",
+              {
+                src: resolvedLogo,
+                alt: logoAlt,
+                className: "h-16 w-auto select-none",
+                draggable: false
+              }
+            )
+          }
+        ),
+        brandDescription && /* @__PURE__ */ jsx("p", { className: cn("font-sans text-sm leading-relaxed", t.body), children: brandDescription }),
+        address && /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+          /* @__PURE__ */ jsx("h4", { className: cn("font-heading font-black text-base", t.heading), children: address.title }),
+          /* @__PURE__ */ jsx("address", { className: cn("not-italic text-sm leading-relaxed font-sans", t.body), children: address.lines.map((line, i) => /* @__PURE__ */ jsx("div", { children: line }, i)) })
+        ] }),
+        (phone || email) && /* @__PURE__ */ jsxs("div", { className: "space-y-1.5 text-sm font-ui font-bold", children: [
+          phone && /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx("a", { href: `tel:${phone.replace(/\s+/g, "")}`, className: t.link, children: phone }) }),
+          email && /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx("a", { href: `mailto:${email}`, className: t.link, children: email }) })
+        ] }),
+        socials.length > 0 && /* @__PURE__ */ jsx("div", { className: "flex items-center gap-2", children: socials.map((s) => {
+          var _a;
+          const Icon = SOCIAL_ICON[s.network];
+          const label = (_a = s.label) != null ? _a : SOCIAL_LABEL[s.network];
+          return /* @__PURE__ */ jsx(
+            "a",
+            {
+              href: s.href,
+              "aria-label": label,
+              className: cn(
+                "flex h-9 w-9 items-center justify-center rounded-full transition-colors",
+                t.socialBtn
+              ),
+              children: /* @__PURE__ */ jsx(Icon, { className: "h-4 w-4", strokeWidth: 2.25 })
+            },
+            s.network + s.href
+          );
+        }) }),
+        badges && badges.length > 0 && /* @__PURE__ */ jsx("div", { className: "flex flex-wrap items-center gap-5 pt-2", children: badges.map((b, i) => {
+          var _a, _b;
+          const content = (_b = b.node) != null ? _b : /* @__PURE__ */ jsx(
+            "img",
+            {
+              src: b.src,
+              alt: b.alt,
+              style: { height: (_a = b.height) != null ? _a : 56 },
+              className: "block w-auto object-contain",
+              draggable: false
+            }
+          );
+          const wrapper = /* @__PURE__ */ jsx(
+            "span",
+            {
+              className: cn(
+                "inline-flex items-center",
+                t.badgeStroke,
+                t.badgeFilter
+              ),
+              children: content
+            }
+          );
+          return b.href ? /* @__PURE__ */ jsx(
+            "a",
+            {
+              href: b.href,
+              "aria-label": b.alt,
+              className: "hover:opacity-80 transition-opacity",
+              children: wrapper
+            },
+            b.alt + i
+          ) : /* @__PURE__ */ jsx(React28.Fragment, { children: wrapper }, b.alt + i);
+        }) })
+      ] }),
+      themes.length > 0 && /* @__PURE__ */ jsxs("div", { className: "lg:col-span-3", children: [
+        /* @__PURE__ */ jsx(ColumnHeading, { className: t.heading, children: themesTitle }),
+        /* @__PURE__ */ jsx("ul", { className: "space-y-2.5", children: themes.map((c) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
+          "a",
+          {
+            href: c.href,
+            className: cn("text-sm font-ui font-bold", t.link),
+            children: c.label
+          }
+        ) }, c.label)) })
+      ] }),
+      destinations.length > 0 && /* @__PURE__ */ jsxs("div", { className: "lg:col-span-3", children: [
+        /* @__PURE__ */ jsx(ColumnHeading, { className: t.heading, children: destinationsTitle }),
+        /* @__PURE__ */ jsx("ul", { className: "space-y-2.5", children: destinations.map((c) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
+          "a",
+          {
+            href: c.href,
+            className: cn("text-sm font-ui font-bold", t.link),
+            children: c.label
+          }
+        ) }, c.label)) }),
+        destinationsMore && /* @__PURE__ */ jsxs(
+          "a",
+          {
+            href: destinationsMore.href,
+            className: cn(
+              "inline-flex items-center gap-1.5 mt-5 text-sm font-ui font-bold",
+              t.link
+            ),
+            children: [
+              destinationsMore.label,
+              /* @__PURE__ */ jsx(ArrowRightIcon, { className: "h-3.5 w-3.5 no-underline" })
+            ]
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "lg:col-span-2 space-y-8", children: [
+        pages.length > 0 && /* @__PURE__ */ jsxs("div", { children: [
+          /* @__PURE__ */ jsx(ColumnHeading, { className: t.heading, children: pagesTitle }),
+          /* @__PURE__ */ jsx("ul", { className: "space-y-2.5", children: pages.map((p) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
+            "a",
+            {
+              href: p.href,
+              className: cn("text-sm font-ui font-bold", t.link),
+              children: p.label
+            }
+          ) }, p.label)) })
+        ] }),
+        cta && /* @__PURE__ */ jsxs("div", { children: [
+          /* @__PURE__ */ jsx(ColumnHeading, { className: t.heading, children: cta.title }),
+          /* @__PURE__ */ jsx(
+            "a",
+            {
+              href: cta.href,
+              className: cn("text-sm font-ui font-bold break-all", t.link),
+              children: cta.label
+            }
+          )
+        ] })
+      ] })
+    ] }) }),
+    /* @__PURE__ */ jsx("div", { className: cn(t.bottomBar), children: /* @__PURE__ */ jsxs("div", { className: "max-w-7xl mx-auto px-6 sm:px-10 py-4 flex flex-wrap items-center gap-x-6 gap-y-3", children: [
+      languages.length > 0 && /* @__PURE__ */ jsx(
+        LanguagePicker,
+        {
+          variant,
+          languages,
+          currentLanguage,
+          onChange: onLanguageChange
+        }
+      ),
+      /* @__PURE__ */ jsx("p", { className: cn("text-xs font-ui", t.bottomText), children: copy }),
+      legalLinks.length > 0 && /* @__PURE__ */ jsx("ul", { className: "flex flex-wrap items-center gap-x-6 gap-y-2", children: legalLinks.map((l) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
+        "a",
+        {
+          href: l.href,
+          className: cn("text-xs font-ui font-bold", t.bottomLink),
+          children: l.label
+        }
+      ) }, l.label)) })
+    ] }) })
+  ] });
+}
 function Stars({ count = 5 }) {
   return /* @__PURE__ */ jsx("span", { className: "flex gap-0.5", children: Array.from({ length: 5 }).map((_, i) => /* @__PURE__ */ jsx(
     StarIcon,
@@ -10742,9 +11952,9 @@ function TripPage({
   images,
   videoUrl,
   breadcrumb,
+  chips,
   highlights,
-  infoGroups,
-  keyInfo,
+  howToGetThere,
   recommendedFor,
   overview,
   overviewHighlights,
@@ -10762,6 +11972,7 @@ function TripPage({
   meetingPoints,
   meetingPoint,
   faqs,
+  faqInitialCount = 5,
   sectionIcons,
   reviews,
   trustpilot,
@@ -10781,11 +11992,12 @@ function TripPage({
   features,
   className
 }) {
-  const [activeSection, setActiveSection] = React8.useState("");
-  const [accordionValue, setAccordionValue] = React8.useState([]);
-  const accordionSectionIds = React8.useMemo(
+  const [activeSection, setActiveSection] = React28.useState("");
+  const [accordionValue, setAccordionValue] = React28.useState([]);
+  const [faqsExpanded, setFaqsExpanded] = React28.useState(false);
+  const accordionSectionIds = React28.useMemo(
     () => /* @__PURE__ */ new Set([
-      "key-info",
+      "how-to-get-there",
       "what-to-bring",
       "weather",
       "optional-extras",
@@ -10796,18 +12008,18 @@ function TripPage({
     ]),
     []
   );
-  const [navFloating, setNavFloating] = React8.useState(false);
-  const [navHidden, setNavHidden] = React8.useState(false);
-  const [isFloating, setIsFloating] = React8.useState(false);
-  const [sidebarPos, setSidebarPos] = React8.useState(null);
-  const [pricingBarVisible, setPricingBarVisible] = React8.useState(false);
-  const navRef = React8.useRef(null);
-  const navSentinelRef = React8.useRef(null);
-  const sentinelRef = React8.useRef(null);
-  const sidebarPlaceholderRef = React8.useRef(null);
-  const pricingBarRef = React8.useRef(null);
-  const galleryRef = React8.useRef(null);
-  const sections = React8.useMemo(
+  const [navFloating, setNavFloating] = React28.useState(false);
+  const [navHidden, setNavHidden] = React28.useState(false);
+  const [isFloating, setIsFloating] = React28.useState(false);
+  const [sidebarPos, setSidebarPos] = React28.useState(null);
+  const [pricingBarVisible, setPricingBarVisible] = React28.useState(false);
+  const navRef = React28.useRef(null);
+  const navSentinelRef = React28.useRef(null);
+  const sentinelRef = React28.useRef(null);
+  const sidebarPlaceholderRef = React28.useRef(null);
+  const pricingBarRef = React28.useRef(null);
+  const galleryRef = React28.useRef(null);
+  const sections = React28.useMemo(
     () => [
       { id: "overview", label: "Overview", show: !!(overview || (overviewHighlights == null ? void 0 : overviewHighlights.length)) },
       {
@@ -10825,7 +12037,7 @@ function TripPage({
     // eslint-disable-next-line react-hooks/exhaustive-deps
     []
   );
-  React8.useEffect(() => {
+  React28.useEffect(() => {
     const sentinel = navSentinelRef.current;
     if (!sentinel) return;
     const update = () => setNavFloating(sentinel.getBoundingClientRect().top < 1);
@@ -10833,7 +12045,7 @@ function TripPage({
     update();
     return () => document.removeEventListener("scroll", update, { capture: true });
   }, []);
-  React8.useEffect(() => {
+  React28.useEffect(() => {
     const sentinel = sentinelRef.current;
     if (!sentinel) return;
     const update = () => setIsFloating(sentinel.getBoundingClientRect().top < 1);
@@ -10841,7 +12053,7 @@ function TripPage({
     update();
     return () => document.removeEventListener("scroll", update, { capture: true });
   }, []);
-  React8.useEffect(() => {
+  React28.useEffect(() => {
     const measure = () => {
       if (!sidebarPlaceholderRef.current) return;
       const rect = sidebarPlaceholderRef.current.getBoundingClientRect();
@@ -10851,7 +12063,7 @@ function TripPage({
     window.addEventListener("resize", measure);
     return () => window.removeEventListener("resize", measure);
   }, [isFloating]);
-  React8.useEffect(() => {
+  React28.useEffect(() => {
     const check = () => {
       var _a;
       const target = (_a = galleryRef.current) != null ? _a : pricingBarRef.current;
@@ -10862,7 +12074,7 @@ function TripPage({
     check();
     return () => document.removeEventListener("scroll", check, { capture: true });
   }, []);
-  React8.useEffect(() => {
+  React28.useEffect(() => {
     const check = () => {
       if (!pricingBarRef.current) return;
       setNavHidden(pricingBarRef.current.getBoundingClientRect().top < window.innerHeight * 0.92);
@@ -10871,7 +12083,7 @@ function TripPage({
     check();
     return () => document.removeEventListener("scroll", check, { capture: true });
   }, []);
-  React8.useEffect(() => {
+  React28.useEffect(() => {
     if (sections.length === 0) return;
     setActiveSection(sections[0].id);
     const update = () => {
@@ -10946,6 +12158,7 @@ function TripPage({
             destination,
             duration,
             tagline,
+            chips,
             siteHeader,
             uiVariant,
             belowMeta: trustpilotHero ? /* @__PURE__ */ jsx(TrustpilotEmbed, { config: trustpilotHero }) : void 0
@@ -10979,10 +12192,7 @@ function TripPage({
           /* @__PURE__ */ jsxs("div", { className: "flex flex-col lg:flex-row gap-8 mt-4", children: [
             /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0 space-y-12 pb-12", children: [
               (overview || (overviewHighlights == null ? void 0 : overviewHighlights.length)) && /* @__PURE__ */ jsxs("section", { id: "trip-section-overview", className: "scroll-mt-20", children: [
-                /* @__PURE__ */ jsxs("h2", { className: "text-xl font-bold text-foreground font-heading mb-4 flex items-center gap-2", children: [
-                  (sectionIcons == null ? void 0 : sectionIcons.overview) ? /* @__PURE__ */ jsx("span", { className: "text-primary [&>svg]:h-5 [&>svg]:w-5", children: sectionIcons.overview }) : /* @__PURE__ */ jsx(InfoIcon, { className: "h-5 w-5 text-primary" }),
-                  "Overview"
-                ] }),
+                /* @__PURE__ */ jsx("h2", { className: "text-xl font-bold text-foreground font-heading mb-4", children: "Overview" }),
                 overview && /* @__PURE__ */ jsx("div", { className: "text-lg text-foreground leading-relaxed space-y-3 [&_strong]:font-semibold [&_a]:text-primary [&_a]:underline", children: overview }),
                 overviewHighlights && overviewHighlights.length > 0 && /* @__PURE__ */ jsx("ul", { className: cn("flex flex-col gap-5", overview && "mt-8"), children: overviewHighlights.map((h, i) => /* @__PURE__ */ jsxs("li", { className: "flex items-start gap-4", children: [
                   h.icon && /* @__PURE__ */ jsx("span", { className: "flex h-10 w-10 shrink-0 items-center justify-center text-foreground [&_svg]:h-8 [&_svg]:w-8", children: h.icon }),
@@ -11029,7 +12239,7 @@ function TripPage({
                   }
                 )
               ] }),
-              ((infoGroups == null ? void 0 : infoGroups.length) || keyInfo || (whatToBring == null ? void 0 : whatToBring.length) || weather || optionalExtras || accommodation || food || (meetingPoints == null ? void 0 : meetingPoints.length) || meetingPoint || termsAndConditions) && /* @__PURE__ */ jsxs(
+              (howToGetThere || (whatToBring == null ? void 0 : whatToBring.length) || weather || optionalExtras || accommodation || food || (meetingPoints == null ? void 0 : meetingPoints.length) || meetingPoint || termsAndConditions) && /* @__PURE__ */ jsxs(
                 Accordion,
                 {
                   multiple: false,
@@ -11037,25 +12247,33 @@ function TripPage({
                   onValueChange: setAccordionValue,
                   className: "border-t border-border",
                   children: [
-                    (keyInfo || infoGroups && infoGroups.length > 0) && /* @__PURE__ */ jsxs(
+                    accommodation && /* @__PURE__ */ jsxs(
+                      AccordionItem,
+                      {
+                        value: "accommodation",
+                        id: "trip-section-accommodation",
+                        className: "scroll-mt-20 border-b border-border",
+                        children: [
+                          /* @__PURE__ */ jsx(AccordionTrigger, { className: "py-5 text-xl font-bold text-foreground font-heading hover:no-underline", children: /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-2", children: [
+                            (sectionIcons == null ? void 0 : sectionIcons.accommodation) ? /* @__PURE__ */ jsx("span", { className: "text-primary [&>svg]:h-5 [&>svg]:w-5", children: sectionIcons.accommodation }) : /* @__PURE__ */ jsx(BedDoubleIcon, { className: "h-5 w-5 text-primary" }),
+                            "Accommodation"
+                          ] }) }),
+                          /* @__PURE__ */ jsx(AccordionContent, { className: "pb-6", children: /* @__PURE__ */ jsx("div", { className: "text-base text-foreground leading-relaxed space-y-3 [&_strong]:font-semibold [&_a]:text-primary [&_a]:underline", children: accommodation }) })
+                        ]
+                      }
+                    ),
+                    food && /* @__PURE__ */ jsxs(
                       AccordionItem,
                       {
-                        value: "key-info",
-                        id: "trip-section-key-info",
+                        value: "food",
+                        id: "trip-section-food",
                         className: "scroll-mt-20 border-b border-border",
                         children: [
                           /* @__PURE__ */ jsx(AccordionTrigger, { className: "py-5 text-xl font-bold text-foreground font-heading hover:no-underline", children: /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-2", children: [
-                            (sectionIcons == null ? void 0 : sectionIcons.keyInfo) ? /* @__PURE__ */ jsx("span", { className: "text-primary [&>svg]:h-5 [&>svg]:w-5", children: sectionIcons.keyInfo }) : /* @__PURE__ */ jsx(InfoIcon, { className: "h-5 w-5 text-primary" }),
-                            "Key info"
+                            (sectionIcons == null ? void 0 : sectionIcons.food) ? /* @__PURE__ */ jsx("span", { className: "text-primary [&>svg]:h-5 [&>svg]:w-5", children: sectionIcons.food }) : /* @__PURE__ */ jsx(UtensilsIcon, { className: "h-5 w-5 text-primary" }),
+                            "Food"
                           ] }) }),
-                          /* @__PURE__ */ jsx(AccordionContent, { className: "pb-6", children: keyInfo ? /* @__PURE__ */ jsx("div", { className: "text-base text-foreground leading-relaxed space-y-3 [&_strong]:font-semibold [&_a]:text-primary [&_a]:underline", children: keyInfo }) : /* @__PURE__ */ jsx("div", { className: "space-y-6", children: infoGroups.map((group, i) => /* @__PURE__ */ jsxs("div", { children: [
-                            /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 mb-3", children: [
-                              group.icon && /* @__PURE__ */ jsx("span", { className: "text-primary", children: group.icon }),
-                              /* @__PURE__ */ jsx("h3", { className: "text-base font-bold text-foreground font-heading", children: group.title })
-                            ] }),
-                            /* @__PURE__ */ jsx(Checklist, { items: group.items }),
-                            i < infoGroups.length - 1 && /* @__PURE__ */ jsx(Separator, { className: "mt-6" })
-                          ] }, i)) }) })
+                          /* @__PURE__ */ jsx(AccordionContent, { className: "pb-6", children: /* @__PURE__ */ jsx("div", { className: "text-base text-foreground leading-relaxed space-y-3 [&_strong]:font-semibold [&_a]:text-primary [&_a]:underline", children: food }) })
                         ]
                       }
                     ),
@@ -11081,78 +12299,63 @@ function TripPage({
                         ]
                       }
                     ),
-                    optionalExtras && /* @__PURE__ */ jsxs(
+                    howToGetThere && /* @__PURE__ */ jsxs(
                       AccordionItem,
                       {
-                        value: "optional-extras",
-                        id: "trip-section-optional-extras",
+                        value: "how-to-get-there",
+                        id: "trip-section-how-to-get-there",
                         className: "scroll-mt-20 border-b border-border",
                         children: [
                           /* @__PURE__ */ jsx(AccordionTrigger, { className: "py-5 text-xl font-bold text-foreground font-heading hover:no-underline", children: /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-2", children: [
-                            (sectionIcons == null ? void 0 : sectionIcons.optionalExtras) ? /* @__PURE__ */ jsx("span", { className: "text-primary [&>svg]:h-5 [&>svg]:w-5", children: sectionIcons.optionalExtras }) : /* @__PURE__ */ jsx(SparklesIcon, { className: "h-5 w-5 text-primary" }),
-                            "Optional extras"
+                            (sectionIcons == null ? void 0 : sectionIcons.howToGetThere) ? /* @__PURE__ */ jsx("span", { className: "text-primary [&>svg]:h-5 [&>svg]:w-5", children: sectionIcons.howToGetThere }) : /* @__PURE__ */ jsx(CompassIcon, { className: "h-5 w-5 text-primary" }),
+                            "How to get there"
                           ] }) }),
-                          /* @__PURE__ */ jsx(AccordionContent, { className: "pb-6", children: /* @__PURE__ */ jsx("div", { className: "text-base text-foreground leading-relaxed space-y-3 [&_strong]:font-semibold [&_a]:text-primary [&_a]:underline", children: optionalExtras }) })
+                          /* @__PURE__ */ jsx(AccordionContent, { className: "pb-6", children: /* @__PURE__ */ jsx("div", { className: "text-base text-foreground leading-relaxed space-y-3 [&_strong]:font-semibold [&_a]:text-primary [&_a]:underline", children: howToGetThere }) })
                         ]
                       }
                     ),
-                    whatToBring && whatToBring.length > 0 && /* @__PURE__ */ jsxs(
-                      AccordionItem,
-                      {
-                        value: "what-to-bring",
-                        id: "trip-section-what-to-bring",
-                        className: "scroll-mt-20 border-b border-border",
-                        children: [
-                          /* @__PURE__ */ jsx(AccordionTrigger, { className: "py-5 text-xl font-bold text-foreground font-heading hover:no-underline", children: /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-2", children: [
-                            (sectionIcons == null ? void 0 : sectionIcons.whatToBring) ? /* @__PURE__ */ jsx("span", { className: "text-primary [&>svg]:h-5 [&>svg]:w-5", children: sectionIcons.whatToBring }) : /* @__PURE__ */ jsx(BackpackIcon, { className: "h-5 w-5 text-primary" }),
-                            "What to bring"
-                          ] }) }),
-                          /* @__PURE__ */ jsx(AccordionContent, { className: "pb-6", children: /* @__PURE__ */ jsx(Checklist, { items: whatToBring, icon: /* @__PURE__ */ jsx(InfoIcon, { className: "h-4 w-4" }) }) })
-                        ]
-                      }
-                    ),
-                    accommodation && /* @__PURE__ */ jsxs(
+                    weather && /* @__PURE__ */ jsxs(
                       AccordionItem,
                       {
-                        value: "accommodation",
-                        id: "trip-section-accommodation",
+                        value: "weather",
+                        id: "trip-section-weather",
                         className: "scroll-mt-20 border-b border-border",
                         children: [
                           /* @__PURE__ */ jsx(AccordionTrigger, { className: "py-5 text-xl font-bold text-foreground font-heading hover:no-underline", children: /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-2", children: [
-                            (sectionIcons == null ? void 0 : sectionIcons.accommodation) ? /* @__PURE__ */ jsx("span", { className: "text-primary [&>svg]:h-5 [&>svg]:w-5", children: sectionIcons.accommodation }) : /* @__PURE__ */ jsx(BedDoubleIcon, { className: "h-5 w-5 text-primary" }),
-                            "Accommodation"
+                            (sectionIcons == null ? void 0 : sectionIcons.weather) ? /* @__PURE__ */ jsx("span", { className: "text-primary [&>svg]:h-5 [&>svg]:w-5", children: sectionIcons.weather }) : /* @__PURE__ */ jsx(SunIcon, { className: "h-5 w-5 text-primary" }),
+                            "Weather"
                           ] }) }),
-                          /* @__PURE__ */ jsx(AccordionContent, { className: "pb-6", children: /* @__PURE__ */ jsx("div", { className: "text-base text-foreground leading-relaxed space-y-3 [&_strong]:font-semibold [&_a]:text-primary [&_a]:underline", children: accommodation }) })
+                          /* @__PURE__ */ jsx(AccordionContent, { className: "pb-6", children: /* @__PURE__ */ jsx("div", { className: "flex items-start gap-3 rounded-xl bg-muted/60 border border-border p-5", children: /* @__PURE__ */ jsx("div", { className: "text-base text-foreground leading-relaxed space-y-2 [&_strong]:font-semibold", children: weather }) }) })
                         ]
                       }
                     ),
-                    food && /* @__PURE__ */ jsxs(
+                    whatToBring && whatToBring.length > 0 && /* @__PURE__ */ jsxs(
                       AccordionItem,
                       {
-                        value: "food",
-                        id: "trip-section-food",
+                        value: "what-to-bring",
+                        id: "trip-section-what-to-bring",
                         className: "scroll-mt-20 border-b border-border",
                         children: [
                           /* @__PURE__ */ jsx(AccordionTrigger, { className: "py-5 text-xl font-bold text-foreground font-heading hover:no-underline", children: /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-2", children: [
-                            (sectionIcons == null ? void 0 : sectionIcons.food) ? /* @__PURE__ */ jsx("span", { className: "text-primary [&>svg]:h-5 [&>svg]:w-5", children: sectionIcons.food }) : /* @__PURE__ */ jsx(UtensilsIcon, { className: "h-5 w-5 text-primary" }),
-                            "Food"
+                            (sectionIcons == null ? void 0 : sectionIcons.whatToBring) ? /* @__PURE__ */ jsx("span", { className: "text-primary [&>svg]:h-5 [&>svg]:w-5", children: sectionIcons.whatToBring }) : /* @__PURE__ */ jsx(BackpackIcon, { className: "h-5 w-5 text-primary" }),
+                            "What to bring"
                           ] }) }),
-                          /* @__PURE__ */ jsx(AccordionContent, { className: "pb-6", children: /* @__PURE__ */ jsx("div", { className: "text-base text-foreground leading-relaxed space-y-3 [&_strong]:font-semibold [&_a]:text-primary [&_a]:underline", children: food }) })
+                          /* @__PURE__ */ jsx(AccordionContent, { className: "pb-6", children: /* @__PURE__ */ jsx(Checklist, { items: whatToBring, icon: /* @__PURE__ */ jsx(InfoIcon, { className: "h-4 w-4" }) }) })
                         ]
                       }
                     ),
-                    weather && /* @__PURE__ */ jsxs(
+                    optionalExtras && /* @__PURE__ */ jsxs(
                       AccordionItem,
                       {
-                        value: "weather",
-                        id: "trip-section-weather",
+                        value: "optional-extras",
+                        id: "trip-section-optional-extras",
                         className: "scroll-mt-20 border-b border-border",
                         children: [
                           /* @__PURE__ */ jsx(AccordionTrigger, { className: "py-5 text-xl font-bold text-foreground font-heading hover:no-underline", children: /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-2", children: [
-                            (sectionIcons == null ? void 0 : sectionIcons.weather) ? /* @__PURE__ */ jsx("span", { className: "text-primary [&>svg]:h-5 [&>svg]:w-5", children: sectionIcons.weather }) : /* @__PURE__ */ jsx(SunIcon, { className: "h-5 w-5 text-primary" }),
-                            "Weather"
+                            (sectionIcons == null ? void 0 : sectionIcons.optionalExtras) ? /* @__PURE__ */ jsx("span", { className: "text-primary [&>svg]:h-5 [&>svg]:w-5", children: sectionIcons.optionalExtras }) : /* @__PURE__ */ jsx(CherryIcon, { className: "h-5 w-5 text-primary" }),
+                            "Optional extras"
                           ] }) }),
-                          /* @__PURE__ */ jsx(AccordionContent, { className: "pb-6", children: /* @__PURE__ */ jsx("div", { className: "flex items-start gap-3 rounded-xl bg-muted/60 border border-border p-5", children: /* @__PURE__ */ jsx("div", { className: "text-base text-foreground leading-relaxed space-y-2 [&_strong]:font-semibold", children: weather }) }) })
+                          /* @__PURE__ */ jsx(AccordionContent, { className: "pb-6", children: /* @__PURE__ */ jsx("div", { className: "text-base text-foreground leading-relaxed space-y-3 [&_strong]:font-semibold [&_a]:text-primary [&_a]:underline", children: optionalExtras }) })
                         ]
                       }
                     ),
@@ -11174,13 +12377,39 @@ function TripPage({
                   ]
                 }
               ),
-              faqs && faqs.length > 0 && /* @__PURE__ */ jsxs("section", { id: "trip-section-faq", className: "scroll-mt-20", children: [
-                /* @__PURE__ */ jsx("h2", { className: "text-xl font-bold text-foreground font-heading mb-6", children: "FAQ" }),
-                /* @__PURE__ */ jsx(Accordion, { variant: "faq", children: faqs.map((faq, i) => /* @__PURE__ */ jsxs(AccordionItem, { value: `faq-${i}`, children: [
-                  /* @__PURE__ */ jsx(AccordionTrigger, { children: faq.question }),
-                  /* @__PURE__ */ jsx(AccordionContent, { children: faq.answer })
-                ] }, i)) })
-              ] }),
+              faqs && faqs.length > 0 && (() => {
+                const visibleFaqs = faqsExpanded ? faqs : faqs.slice(0, faqInitialCount);
+                const hiddenCount = faqs.length - visibleFaqs.length;
+                return /* @__PURE__ */ jsxs("section", { id: "trip-section-faq", className: "scroll-mt-20", children: [
+                  /* @__PURE__ */ jsx("h2", { className: "text-xl font-bold text-foreground font-heading mb-6", children: "FAQ" }),
+                  /* @__PURE__ */ jsx(Accordion, { variant: "faq", children: visibleFaqs.map((faq, i) => /* @__PURE__ */ jsxs(AccordionItem, { value: `faq-${i}`, children: [
+                    /* @__PURE__ */ jsx(AccordionTrigger, { children: faq.question }),
+                    /* @__PURE__ */ jsx(AccordionContent, { children: faq.answer })
+                  ] }, i)) }),
+                  faqs.length > faqInitialCount && /* @__PURE__ */ jsx("div", { className: "mt-5 flex justify-center", children: /* @__PURE__ */ jsx(
+                    "button",
+                    {
+                      type: "button",
+                      onClick: () => setFaqsExpanded((v) => !v),
+                      className: cn(
+                        "inline-flex items-center gap-2 rounded-full border border-border bg-background px-5 py-2.5",
+                        "text-sm font-semibold text-foreground shadow-sm",
+                        "hover:bg-muted transition-colors duration-150",
+                        "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
+                      ),
+                      children: faqsExpanded ? /* @__PURE__ */ jsxs(Fragment, { children: [
+                        /* @__PURE__ */ jsx(ChevronUpIcon, { className: "h-4 w-4 text-muted-foreground" }),
+                        "Show less"
+                      ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+                        /* @__PURE__ */ jsx(ChevronDownIcon, { className: "h-4 w-4 text-muted-foreground" }),
+                        "See more (",
+                        hiddenCount,
+                        ")"
+                      ] })
+                    }
+                  ) })
+                ] });
+              })(),
               trustpilot ? /* @__PURE__ */ jsxs("section", { id: "trip-section-reviews", className: "scroll-mt-20", children: [
                 /* @__PURE__ */ jsx(Separator, { className: "mb-10" }),
                 /* @__PURE__ */ jsx("h2", { className: "text-xl font-bold text-foreground font-heading mb-5", children: "What our guests think" }),
@@ -11269,8 +12498,8 @@ function TripPage({
           PhotoGallery,
           {
             photos: gallery,
-            variant: "grid",
-            initialVisible: 6
+            variant: "gridCompact",
+            initialVisible: 8
           }
         ) }),
         gallery && gallery.length > 0 && /* @__PURE__ */ jsx("div", { ref: pricingBarRef, className: "mx-auto w-full max-w-6xl px-6 sm:px-8 py-12", children: /* @__PURE__ */ jsx("div", { id: "trip-booking-form", className: "rounded-2xl border border-border bg-card p-8 shadow-sm", children: /* @__PURE__ */ jsx(BookingForm, { onSubmit: onBook ? (values) => onBook() : void 0 }) }) }),
@@ -11287,7 +12516,8 @@ function TripPage({
             currencyEstimates
           }
         ) }),
-        /* @__PURE__ */ jsx("div", { className: "h-20 lg:hidden" })
+        /* @__PURE__ */ jsx("div", { className: "h-20 lg:hidden" }),
+        /* @__PURE__ */ jsx(SiteFooter, {})
       ]
     }
   );
@@ -11393,12 +12623,12 @@ function Toast({
   duration = 6e3,
   className
 }) {
-  const [mounted, setMounted] = React8.useState(false);
-  const [visible, setVisible] = React8.useState(true);
-  React8.useEffect(() => {
+  const [mounted, setMounted] = React28.useState(false);
+  const [visible, setVisible] = React28.useState(true);
+  React28.useEffect(() => {
     setMounted(true);
   }, []);
-  React8.useEffect(() => {
+  React28.useEffect(() => {
     if (duration === 0) return;
     const t = setTimeout(() => {
       setVisible(false);