@dreamtree-org/landing-kit 0.0.0-stage → 0.2.0

package/dist/index.js

@@ -0,0 +1,1117 @@
+'use client';
+
+// src/LandingPage.jsx
+import { Fragment as Fragment4, cloneElement, isValidElement as isValidElement2 } from "react";
+
+// src/AuthShell.jsx
+import { useId } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+var DEFAULT_LEGAL = [
+  { label: "Privacy Policy", href: "/privacy" },
+  { label: "Terms", href: "/terms" },
+  { label: "Data Policy", href: "/data-policy" }
+];
+function BrandMark({ brand, size }) {
+  if (brand.logoSrc) {
+    return /* @__PURE__ */ jsx("img", { className: "dt-auth-mark-img", src: brand.logoSrc, alt: "", width: size, height: size });
+  }
+  if (brand.mark) return /* @__PURE__ */ jsx("span", { className: "dt-auth-mark-node", children: brand.mark });
+  return /* @__PURE__ */ jsx("span", { className: "dt-auth-monogram", style: { width: size, height: size }, "aria-hidden": "true", children: brand.name.charAt(0) });
+}
+function brandStyle(brand) {
+  return {
+    "--dt-brand": brand.primary,
+    "--dt-brand-accent": brand.accent || brand.primary,
+    ...brand.panel ? { "--dt-brand-panel": brand.panel } : {}
+  };
+}
+function AuthShell({
+  brand,
+  title,
+  subtitle,
+  children,
+  footer,
+  variant = "tenant",
+  legalLinks = DEFAULT_LEGAL,
+  linkComponent: LinkComponent,
+  className = ""
+}) {
+  var _a;
+  const headingId = useId();
+  const isPlatform = variant === "platform";
+  const headline = isPlatform ? brand.platformHeadline || "Platform administration" : brand.headline;
+  const pitch = isPlatform ? brand.platformPitch || `Super administrator console for ${brand.name}. Every action here is audited.` : brand.pitch;
+  const renderLink = (l) => LinkComponent ? /* @__PURE__ */ jsx(LinkComponent, { to: l.href, href: l.href, className: "dt-auth-legal-link", children: l.label }, l.href) : /* @__PURE__ */ jsx("a", { href: l.href, className: "dt-auth-legal-link", children: l.label }, l.href);
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: `dt-auth ${isPlatform ? "dt-auth--platform" : ""} ${className}`,
+      style: brandStyle(brand),
+      "data-product": brand.id,
+      children: [
+        /* @__PURE__ */ jsxs("aside", { className: "dt-auth-panel", children: [
+          /* @__PURE__ */ jsxs("a", { href: "/", className: "dt-auth-brand", children: [
+            /* @__PURE__ */ jsx(BrandMark, { brand, size: 28 }),
+            /* @__PURE__ */ jsx("span", { className: "dt-auth-brand-name", children: brand.name }),
+            isPlatform ? /* @__PURE__ */ jsx("span", { className: "dt-auth-badge", children: "Platform" }) : null
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "dt-auth-pitch", children: [
+            /* @__PURE__ */ jsx("h2", { children: headline }),
+            pitch ? /* @__PURE__ */ jsx("p", { children: pitch }) : null,
+            !isPlatform && ((_a = brand.points) == null ? void 0 : _a.length) ? /* @__PURE__ */ jsx("ul", { children: brand.points.map((p) => /* @__PURE__ */ jsx("li", { children: p }, p)) }) : null
+          ] }),
+          /* @__PURE__ */ jsx("p", { className: "dt-auth-panel-foot", children: brand.category || "by Dreamtree-Org" })
+        ] }),
+        /* @__PURE__ */ jsx("main", { className: "dt-auth-main", children: /* @__PURE__ */ jsxs("div", { className: "dt-auth-column", children: [
+          /* @__PURE__ */ jsxs("a", { href: "/", className: "dt-auth-brand dt-auth-brand--mobile", children: [
+            /* @__PURE__ */ jsx(BrandMark, { brand, size: 24 }),
+            /* @__PURE__ */ jsx("span", { className: "dt-auth-brand-name", children: brand.name }),
+            isPlatform ? /* @__PURE__ */ jsx("span", { className: "dt-auth-badge", children: "Platform" }) : null
+          ] }),
+          /* @__PURE__ */ jsxs("section", { className: "dt-auth-card", "aria-labelledby": headingId, children: [
+            /* @__PURE__ */ jsxs("header", { className: "dt-auth-head", children: [
+              /* @__PURE__ */ jsx("h1", { id: headingId, children: title }),
+              subtitle ? /* @__PURE__ */ jsx("p", { children: subtitle }) : null
+            ] }),
+            children
+          ] }),
+          footer ? /* @__PURE__ */ jsx("div", { className: "dt-auth-footer", children: footer }) : null,
+          (legalLinks == null ? void 0 : legalLinks.length) ? /* @__PURE__ */ jsx("nav", { className: "dt-auth-legal", "aria-label": "Legal", children: legalLinks.map((l, i) => /* @__PURE__ */ jsxs("span", { className: "dt-auth-legal-item", children: [
+            i > 0 ? /* @__PURE__ */ jsx("span", { "aria-hidden": "true", children: "\xB7" }) : null,
+            renderLink(l)
+          ] }, l.href)) }) : null
+        ] }) })
+      ]
+    }
+  );
+}
+
+// src/context.jsx
+import { createContext, useContext } from "react";
+import { jsx as jsx2 } from "react/jsx-runtime";
+var LandingContext = createContext({ brand: null, linkComponent: null, onBookDemo: null, home: true });
+var LandingProvider = LandingContext.Provider;
+var useLanding = () => useContext(LandingContext);
+function resolveHref(href, home) {
+  if (!href) return href;
+  return !home && href.startsWith("#") ? `/${href}` : href;
+}
+function SmartLink({ href, children, className, reload, ...rest }) {
+  const { linkComponent: Link, home } = useLanding();
+  const to = resolveHref(href, home);
+  const internal = to && to.startsWith("/") && !to.startsWith("//") && !to.includes("#");
+  if (Link && internal && !reload) {
+    return /* @__PURE__ */ jsx2(Link, { to, href: to, className, ...rest, children });
+  }
+  return /* @__PURE__ */ jsx2("a", { href: to, className, ...rest, children });
+}
+
+// src/Header.jsx
+import { useState } from "react";
+
+// src/icons.jsx
+import { createElement, isValidElement } from "react";
+import { Fragment, jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
+var base = {
+  viewBox: "0 0 24 24",
+  fill: "none",
+  stroke: "currentColor",
+  strokeWidth: 2,
+  strokeLinecap: "round",
+  strokeLinejoin: "round",
+  "aria-hidden": "true",
+  focusable: "false"
+};
+var make = (paths) => function Icon({ size = 16, className = "dt-lp-icon" }) {
+  return /* @__PURE__ */ jsx3("svg", { ...base, width: size, height: size, className, children: paths });
+};
+var ArrowRight = make(/* @__PURE__ */ jsx3("path", { d: "M5 12h14M13 6l6 6-6 6" }));
+var ChevronRight = make(/* @__PURE__ */ jsx3("path", { d: "m9 6 6 6-6 6" }));
+var Check = make(/* @__PURE__ */ jsx3("path", { d: "M20 6 9 17l-5-5" }));
+var Help = make(
+  /* @__PURE__ */ jsxs2(Fragment, { children: [
+    /* @__PURE__ */ jsx3("circle", { cx: "12", cy: "12", r: "10" }),
+    /* @__PURE__ */ jsx3("path", { d: "M9.1 9a3 3 0 0 1 5.8 1c0 2-3 3-3 3M12 17h.01" })
+  ] })
+);
+var Alert = make(
+  /* @__PURE__ */ jsxs2(Fragment, { children: [
+    /* @__PURE__ */ jsx3("path", { d: "M10.3 3.9 1.8 18a2 2 0 0 0 1.7 3h17a2 2 0 0 0 1.7-3L13.7 3.9a2 2 0 0 0-3.4 0Z" }),
+    /* @__PURE__ */ jsx3("path", { d: "M12 9v4M12 17h.01" })
+  ] })
+);
+var MenuIcon = make(/* @__PURE__ */ jsx3("path", { d: "M4 6h16M4 12h16M4 18h16" }));
+var Close = make(/* @__PURE__ */ jsx3("path", { d: "M18 6 6 18M6 6l12 12" }));
+var Calendar = make(
+  /* @__PURE__ */ jsxs2(Fragment, { children: [
+    /* @__PURE__ */ jsx3("rect", { x: "3", y: "4", width: "18", height: "18", rx: "2" }),
+    /* @__PURE__ */ jsx3("path", { d: "M16 2v4M8 2v4M3 10h18m-12 6 2 2 4-4" })
+  ] })
+);
+function renderIcon(icon, size = 20, className = "dt-lp-icon") {
+  if (!icon) return null;
+  if (isValidElement(icon)) return icon;
+  return createElement(icon, { size, "aria-hidden": true, className, strokeWidth: 1.8 });
+}
+
+// src/Brand.jsx
+import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
+function BrandMark2({ brand, size = 36 }) {
+  if (brand.logoSrc) {
+    return /* @__PURE__ */ jsx4("img", { className: "dt-lp-mark-img", src: brand.logoSrc, alt: "", width: size, height: size });
+  }
+  if (brand.mark) return /* @__PURE__ */ jsx4("span", { className: "dt-lp-mark-node", "aria-hidden": "true", children: brand.mark });
+  return /* @__PURE__ */ jsx4("span", { className: "dt-lp-monogram", style: { width: size, height: size }, "aria-hidden": "true", children: brand.name.charAt(0) });
+}
+function Wordmark({ name }) {
+  const m = /^(.+?)(Pro)$/.exec(name);
+  if (!m) return /* @__PURE__ */ jsx4("span", { className: "dt-lp-wordmark", children: name });
+  return /* @__PURE__ */ jsxs3("span", { className: "dt-lp-wordmark", children: [
+    m[1],
+    /* @__PURE__ */ jsx4("span", { className: "dt-lp-wordmark-hi", children: m[2] })
+  ] });
+}
+function BrandLockup({ brand: own, byline = "by Dreamtree-Org", href = "/" }) {
+  const ctx = useLanding();
+  const brand = own || ctx.brand;
+  if (!brand) return null;
+  return /* @__PURE__ */ jsxs3("a", { href, className: "dt-lp-brand", "aria-label": `${brand.name}${byline ? ` ${byline}` : ""}, home`, children: [
+    /* @__PURE__ */ jsx4(BrandMark2, { brand }),
+    /* @__PURE__ */ jsxs3("span", { className: "dt-lp-brand-text", "aria-hidden": "true", children: [
+      /* @__PURE__ */ jsx4(Wordmark, { name: brand.name }),
+      byline ? /* @__PURE__ */ jsx4("span", { className: "dt-lp-byline", children: byline }) : null
+    ] })
+  ] });
+}
+
+// src/BookDemoButton.jsx
+import { jsx as jsx5 } from "react/jsx-runtime";
+function BookDemoButton({ size = "md", variant = "primary", className = "", children = "Book a demo", onClick }) {
+  const { onBookDemo } = useLanding();
+  const handler = onClick || (onBookDemo ? (e) => onBookDemo(e.currentTarget) : void 0);
+  return /* @__PURE__ */ jsx5(
+    "button",
+    {
+      type: "button",
+      className: `dt-lp-btn dt-lp-btn--${variant} dt-lp-btn--${size} ${className}`.trim(),
+      "data-book-demo": "",
+      "aria-haspopup": "dialog",
+      onClick: handler,
+      children
+    }
+  );
+}
+
+// src/Section.jsx
+import { jsx as jsx6, jsxs as jsxs4 } from "react/jsx-runtime";
+function Wrap({ className = "", narrow, children }) {
+  return /* @__PURE__ */ jsx6("div", { className: `dt-lp-wrap${narrow ? " dt-lp-wrap--narrow" : ""} ${className}`.trim(), children });
+}
+function Eyebrow({ children, className = "" }) {
+  if (!children) return null;
+  return /* @__PURE__ */ jsx6("p", { className: `dt-lp-eyebrow ${className}`.trim(), children });
+}
+function SectionIntro({ id, eyebrow, title, body, align = "start", children }) {
+  return /* @__PURE__ */ jsxs4("div", { className: `dt-lp-intro dt-lp-intro--${align}`, children: [
+    /* @__PURE__ */ jsx6(Eyebrow, { children: eyebrow }),
+    /* @__PURE__ */ jsx6("h2", { id, className: "dt-lp-h2", children: title }),
+    body ? /* @__PURE__ */ jsx6("p", { className: "dt-lp-lead", children: body }) : null,
+    children
+  ] });
+}
+function Section({ id, labelledBy, tone = "plain", className = "", children, narrow }) {
+  return /* @__PURE__ */ jsx6("section", { id, "aria-labelledby": labelledBy, className: `dt-lp-section dt-lp-tone--${tone} ${className}`.trim(), children: /* @__PURE__ */ jsx6(Wrap, { narrow, children }) });
+}
+function TextLink({ href, children, className = "", ...rest }) {
+  return /* @__PURE__ */ jsxs4(SmartLink, { href, className: `dt-lp-textlink ${className}`.trim(), ...rest, children: [
+    children,
+    " ",
+    /* @__PURE__ */ jsx6(ArrowRight, {})
+  ] });
+}
+function Cta({ cta, className = "" }) {
+  if (!cta) return null;
+  if (Array.isArray(cta)) {
+    if (!cta.length) return null;
+    return /* @__PURE__ */ jsx6("div", { className: `dt-lp-ctas ${className}`.trim(), children: cta.map((c2, i) => /* @__PURE__ */ jsx6(Cta, { cta: c2 }, i)) });
+  }
+  const c = typeof cta === "string" ? { label: cta, demo: true } : cta;
+  if (c.href && !c.demo) return /* @__PURE__ */ jsx6(TextLink, { href: c.href, className, children: c.label });
+  return /* @__PURE__ */ jsxs4(BookDemoButton, { size: "lg", className, children: [
+    c.label,
+    " ",
+    /* @__PURE__ */ jsx6(ArrowRight, {})
+  ] });
+}
+
+// src/Header.jsx
+import { jsx as jsx7, jsxs as jsxs5 } from "react/jsx-runtime";
+function Header({ nav = [], login = { label: "Log in", href: "/login" }, cta = "Book a demo", brand }) {
+  const { home } = useLanding();
+  const [open, setOpen] = useState(false);
+  const items = login ? [...nav, login] : nav;
+  return /* @__PURE__ */ jsxs5("header", { className: "dt-lp-header", children: [
+    /* @__PURE__ */ jsxs5(Wrap, { className: "dt-lp-header-bar", children: [
+      /* @__PURE__ */ jsx7(BrandLockup, { brand }),
+      nav.length ? /* @__PURE__ */ jsx7("nav", { "aria-label": "Primary", className: "dt-lp-nav", children: nav.map((n) => /* @__PURE__ */ jsx7(SmartLink, { href: n.href, className: "dt-lp-nav-link", children: n.label }, n.href)) }) : null,
+      /* @__PURE__ */ jsxs5("div", { className: "dt-lp-header-actions", children: [
+        login ? /* @__PURE__ */ jsx7(SmartLink, { href: login.href, className: "dt-lp-nav-link dt-lp-login", reload: true, children: login.label }) : null,
+        cta ? /* @__PURE__ */ jsx7(BookDemoButton, { size: "sm", children: cta }) : null,
+        items.length ? /* @__PURE__ */ jsxs5(
+          "button",
+          {
+            type: "button",
+            className: "dt-lp-menu-btn",
+            "aria-label": open ? "Close menu" : "Open menu",
+            "aria-expanded": open ? "true" : "false",
+            "aria-controls": "mobile-nav",
+            "data-menu-toggle": "",
+            onClick: () => setOpen((o) => !o),
+            children: [
+              /* @__PURE__ */ jsx7("span", { className: "dt-lp-menu-open", children: /* @__PURE__ */ jsx7(MenuIcon, { size: 20 }) }),
+              /* @__PURE__ */ jsx7("span", { className: "dt-lp-menu-close", children: /* @__PURE__ */ jsx7(Close, { size: 20 }) })
+            ]
+          }
+        ) : null
+      ] })
+    ] }),
+    items.length ? /* @__PURE__ */ jsx7("nav", { id: "mobile-nav", "aria-label": "Mobile", className: "dt-lp-mobile-nav", hidden: !open, onClick: (e) => {
+      var _a, _b;
+      return ((_b = (_a = e.target).closest) == null ? void 0 : _b.call(_a, "a")) && setOpen(false);
+    }, children: /* @__PURE__ */ jsx7(Wrap, { children: /* @__PURE__ */ jsx7("ul", { children: items.map((n) => /* @__PURE__ */ jsx7("li", { children: /* @__PURE__ */ jsx7(SmartLink, { href: n.href, reload: n === login, children: n.label }) }, n.href)) }) }) }) : null
+  ] });
+}
+
+// src/DreamtreeFooter.jsx
+import { jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
+function DreamtreeMark({ size = 28 }) {
+  return /* @__PURE__ */ jsxs6("span", { className: "dt-lp-org", role: "img", "aria-label": "Dreamtree-Org", children: [
+    /* @__PURE__ */ jsx8("svg", { viewBox: "0 0 48.35 48.35", width: size, height: size, "aria-hidden": "true", children: /* @__PURE__ */ jsxs6("g", { fill: "none", strokeWidth: "4", strokeLinecap: "round", strokeLinejoin: "round", stroke: "#0f766e", children: [
+      /* @__PURE__ */ jsx8("path", { d: "M23.01,44.02c-9.02.03-16.36-7.27-16.39-16.29-.02-7.98,5.72-14.81,13.59-16.16,13.31-2.57,16.81-3.78,21.48-9.57,2.33,4.67,4.67,9.76,4.67,18.67,0,12.84-11.16,23.34-23.34,23.34Z" }),
+      /* @__PURE__ */ jsx8("path", { d: "M2,46.35c0-7,4.32-12.51,11.86-14.01,5.65-1.12,11.49-4.67,13.82-7" })
+    ] }) }),
+    /* @__PURE__ */ jsx8("span", { "aria-hidden": "true", className: "dt-lp-org-name", children: "Dreamtree-Org" })
+  ] });
+}
+function DreamtreeFooter({
+  blurb,
+  columns = [],
+  org = "Dreamtree-Org",
+  tagline,
+  legal = [],
+  year = (/* @__PURE__ */ new Date()).getFullYear(),
+  brand: own
+}) {
+  const ctx = useLanding();
+  const brand = own || ctx.brand;
+  return /* @__PURE__ */ jsxs6("footer", { className: "dt-lp-footer", children: [
+    /* @__PURE__ */ jsxs6(Wrap, { className: `dt-lp-footer-grid dt-lp-footer-grid--${Math.min(columns.length, 3)}`, children: [
+      /* @__PURE__ */ jsxs6("div", { className: "dt-lp-footer-about", children: [
+        /* @__PURE__ */ jsx8(DreamtreeMark, {}),
+        blurb ? /* @__PURE__ */ jsx8("p", { children: blurb }) : null
+      ] }),
+      columns.map((col) => /* @__PURE__ */ jsxs6("nav", { "aria-label": col.label || col.title, className: "dt-lp-footer-col", children: [
+        /* @__PURE__ */ jsx8("p", { className: "dt-lp-footer-title", children: col.title }),
+        /* @__PURE__ */ jsx8("ul", { className: col.links.length > 5 && col.compact !== false ? "dt-lp-footer-links" : "dt-lp-footer-links dt-lp-footer-links--one", children: col.links.map((l) => /* @__PURE__ */ jsx8("li", { children: /* @__PURE__ */ jsx8(SmartLink, { href: l.href, reload: l.reload, children: l.label }) }, l.href)) })
+      ] }, col.title))
+    ] }),
+    /* @__PURE__ */ jsx8("div", { className: "dt-lp-footer-bar", children: /* @__PURE__ */ jsxs6(Wrap, { className: "dt-lp-footer-bar-inner", children: [
+      /* @__PURE__ */ jsxs6("p", { children: [
+        "\xA9 ",
+        year,
+        " ",
+        org,
+        ". All rights reserved."
+      ] }),
+      legal.length ? /* @__PURE__ */ jsx8("nav", { "aria-label": "Legal", className: "dt-lp-footer-legal", children: legal.map((l) => /* @__PURE__ */ jsx8(SmartLink, { href: l.href, children: l.label }, l.href)) }) : null,
+      brand && tagline ? /* @__PURE__ */ jsxs6("p", { children: [
+        brand.name,
+        ": ",
+        tagline
+      ] }) : null
+    ] }) })
+  ] });
+}
+
+// src/MarketingLayout.jsx
+import { jsx as jsx9, jsxs as jsxs7 } from "react/jsx-runtime";
+function MarketingLayout({
+  brand,
+  nav = [],
+  login,
+  cta,
+  footer,
+  home = true,
+  linkComponent = null,
+  onBookDemo = null,
+  className = "",
+  children
+}) {
+  if (!brand || !brand.name) {
+    throw new Error(`landing-kit: "brand" is missing. Pass getBrand('<product>') from @dreamtree-org/auth-kit, or your own { id, name, primary }.`);
+  }
+  return /* @__PURE__ */ jsx9(LandingProvider, { value: { brand, linkComponent, onBookDemo, home }, children: /* @__PURE__ */ jsxs7("div", { className: `dt-landing ${className}`.trim(), style: brandStyle(brand), "data-product": brand.id, children: [
+    /* @__PURE__ */ jsx9("a", { href: "#main", className: "dt-lp-skip", children: "Skip to content" }),
+    /* @__PURE__ */ jsx9(Header, { nav, ...login !== void 0 ? { login } : {}, ...cta !== void 0 ? { cta } : {} }),
+    /* @__PURE__ */ jsx9("main", { id: "main", children }),
+    footer === false ? null : /* @__PURE__ */ jsx9(DreamtreeFooter, { ...footer || {} })
+  ] }) });
+}
+
+// src/Hero.jsx
+import { Fragment as Fragment2, jsx as jsx10, jsxs as jsxs8 } from "react/jsx-runtime";
+function Hero({
+  eyebrow,
+  title,
+  subtitle,
+  lead,
+  chips,
+  chipsLabel = "Who it is for",
+  cta = "Book a demo",
+  secondary,
+  overlap = false,
+  id = "hero",
+  backdrop
+}) {
+  const [first, hi] = Array.isArray(title) ? title : [title, null];
+  return /* @__PURE__ */ jsxs8("section", { id, "aria-labelledby": "hero-title", className: `dt-lp-hero${overlap ? " dt-lp-hero--overlap" : ""}`, children: [
+    /* @__PURE__ */ jsx10("div", { className: "dt-lp-hero-glow", "aria-hidden": "true" }),
+    backdrop ? /* @__PURE__ */ jsx10("div", { className: "dt-lp-hero-backdrop", "aria-hidden": "true", children: backdrop }) : null,
+    /* @__PURE__ */ jsxs8(Wrap, { className: "dt-lp-hero-inner", children: [
+      /* @__PURE__ */ jsx10(Eyebrow, { children: eyebrow }),
+      /* @__PURE__ */ jsxs8("h1", { id: "hero-title", className: "dt-lp-h1", children: [
+        first,
+        hi ? /* @__PURE__ */ jsxs8(Fragment2, { children: [
+          " ",
+          /* @__PURE__ */ jsx10("span", { className: "dt-lp-h1-hi", children: hi })
+        ] }) : null
+      ] }),
+      subtitle ? /* @__PURE__ */ jsx10("p", { className: "dt-lp-hero-subtitle", children: subtitle }) : null,
+      lead ? /* @__PURE__ */ jsx10("p", { className: "dt-lp-hero-lead", children: lead }) : null,
+      /* @__PURE__ */ jsxs8("div", { className: "dt-lp-actions", children: [
+        cta ? /* @__PURE__ */ jsx10(BookDemoButton, { size: "lg", children: cta }) : null,
+        secondary ? /* @__PURE__ */ jsx10(TextLink, { href: secondary.href, children: secondary.label }) : null
+      ] }),
+      (chips == null ? void 0 : chips.length) ? /* @__PURE__ */ jsx10("ul", { className: "dt-lp-chips", "aria-label": chipsLabel, children: chips.map((c) => /* @__PURE__ */ jsx10("li", { children: c }, c)) }) : null
+    ] })
+  ] });
+}
+
+// src/FeatureSection.jsx
+import { Fragment as Fragment3, jsx as jsx11, jsxs as jsxs9 } from "react/jsx-runtime";
+var asItem = (x) => typeof x === "string" ? { title: x } : x;
+function Items({ items, kind }) {
+  return /* @__PURE__ */ jsx11("ul", { className: `dt-lp-grid dt-lp-grid--${kind}`, children: items.map(asItem).map((f) => /* @__PURE__ */ jsxs9("li", { className: `dt-lp-card dt-lp-card--${kind}`, children: [
+    f.icon ? /* @__PURE__ */ jsx11("span", { className: "dt-lp-icon-tile", children: renderIcon(f.icon, 20) }) : null,
+    /* @__PURE__ */ jsxs9("div", { className: "dt-lp-card-text", children: [
+      f.label ? /* @__PURE__ */ jsx11("p", { className: "dt-lp-kicker", children: f.label }) : null,
+      /* @__PURE__ */ jsx11("h3", { className: "dt-lp-h3", children: f.href ? /* @__PURE__ */ jsx11(SmartLink, { href: f.href, children: f.title }) : f.title }),
+      f.body ? /* @__PURE__ */ jsx11("p", { children: f.body }) : null
+    ] })
+  ] }, f.title)) });
+}
+function Checklist({ items, icon: Icon = Check, tone = "good", labelledBy }) {
+  return /* @__PURE__ */ jsx11("ul", { className: `dt-lp-checklist dt-lp-checklist--${tone}`, "aria-labelledby": labelledBy, children: items.map((x) => /* @__PURE__ */ jsxs9("li", { children: [
+    /* @__PURE__ */ jsx11(Icon, { size: 18 }),
+    /* @__PURE__ */ jsx11("span", { children: x })
+  ] }, x)) });
+}
+function InlineItems({ items }) {
+  if (!(items == null ? void 0 : items.length)) return null;
+  return /* @__PURE__ */ jsx11("ul", { className: "dt-lp-inline-items", children: items.map(asItem).map((f) => /* @__PURE__ */ jsxs9("li", { children: [
+    f.icon ? renderIcon(f.icon, 22) : null,
+    /* @__PURE__ */ jsxs9("span", { children: [
+      /* @__PURE__ */ jsx11("span", { className: "dt-lp-inline-title", children: f.title }),
+      f.body ? /* @__PURE__ */ jsx11("span", { className: "dt-lp-inline-body", children: f.body }) : null
+    ] })
+  ] }, f.title)) });
+}
+function Media({ children }) {
+  return /* @__PURE__ */ jsx11("div", { className: "dt-lp-media", children });
+}
+function Pair({ className, reverse, text, side }) {
+  return /* @__PURE__ */ jsxs9("div", { className: `${className}${reverse ? " dt-lp-pair--reverse" : ""}`, children: [
+    reverse ? side : text,
+    reverse ? text : side
+  ] });
+}
+function Chips({ items, label, className = "" }) {
+  if (!(items == null ? void 0 : items.length)) return null;
+  return /* @__PURE__ */ jsx11("ul", { className: `dt-lp-chips dt-lp-chips--start ${className}`.trim(), "aria-label": label, children: items.map((c) => /* @__PURE__ */ jsx11("li", { children: c }, c)) });
+}
+function FeatureSection(props) {
+  const { id, variant = "cards", tone, eyebrow, title, body, items = [], cta, footnote, media, reverse, bullets } = props;
+  const hid = `${id || variant}-title`;
+  const defaultTone = { highlight: "dark", split: "tinted", compare: "muted" }[variant] || "plain";
+  const shell = (children, extra = {}) => /* @__PURE__ */ jsx11(Section, { id, labelledBy: hid, tone: tone || defaultTone, className: `dt-lp-feature dt-lp-feature--${variant}`, ...extra, children });
+  switch (variant) {
+    case "split":
+      return shell(
+        /* @__PURE__ */ jsx11(
+          Pair,
+          {
+            className: "dt-lp-split",
+            reverse,
+            text: /* @__PURE__ */ jsxs9(SectionIntro, { id: hid, eyebrow, title, body, children: [
+              media ? /* @__PURE__ */ jsx11(InlineItems, { items }) : null,
+              (bullets == null ? void 0 : bullets.length) ? /* @__PURE__ */ jsx11(Checklist, { items: bullets }) : null,
+              /* @__PURE__ */ jsx11(Cta, { cta, className: "dt-lp-mt" })
+            ] }, "text"),
+            side: media ? /* @__PURE__ */ jsx11(Media, { children: media }, "side") : /* @__PURE__ */ jsx11(Items, { items, kind: "split" }, "side")
+          }
+        )
+      );
+    case "list":
+      return shell(
+        /* @__PURE__ */ jsxs9(Fragment3, { children: [
+          /* @__PURE__ */ jsx11(SectionIntro, { id: hid, eyebrow, title, body, align: "center" }),
+          /* @__PURE__ */ jsx11(Items, { items, kind: "list" }),
+          /* @__PURE__ */ jsx11(Cta, { cta, className: "dt-lp-mt" })
+        ] })
+      );
+    case "intro": {
+      const { subtitle, detail, note, glance = [], glanceTitle = "At a glance", link } = props;
+      return shell(
+        /* @__PURE__ */ jsxs9("div", { className: "dt-lp-intro-grid", children: [
+          /* @__PURE__ */ jsxs9("div", { children: [
+            /* @__PURE__ */ jsx11(SectionIntro, { id: hid, eyebrow, title, body }),
+            subtitle ? /* @__PURE__ */ jsx11("h3", { className: "dt-lp-h3 dt-lp-h3--lg", children: subtitle }) : null,
+            detail ? /* @__PURE__ */ jsx11("p", { className: "dt-lp-body", children: detail }) : null,
+            note ? /* @__PURE__ */ jsx11("p", { className: "dt-lp-note", children: note }) : null,
+            /* @__PURE__ */ jsx11(Cta, { cta, className: "dt-lp-mt" })
+          ] }),
+          glance.length ? /* @__PURE__ */ jsxs9("aside", { className: "dt-lp-glance", "aria-labelledby": `${hid}-glance`, children: [
+            /* @__PURE__ */ jsx11("p", { id: `${hid}-glance`, className: "dt-lp-eyebrow", children: glanceTitle }),
+            /* @__PURE__ */ jsx11(Checklist, { items: glance }),
+            props.glanceNote ? /* @__PURE__ */ jsx11("p", { className: "dt-lp-note", children: props.glanceNote }) : null,
+            link ? /* @__PURE__ */ jsx11(TextLink, { href: link.href, className: "dt-lp-mt", children: link.label }) : null
+          ] }) : null
+        ] })
+      );
+    }
+    case "highlight": {
+      const { note, noteLabel = "Important:" } = props;
+      const text = /* @__PURE__ */ jsxs9("div", { className: "dt-lp-intro", children: [
+        /* @__PURE__ */ jsx11(Eyebrow, { children: eyebrow }),
+        /* @__PURE__ */ jsx11("h2", { id: hid, className: "dt-lp-h2", children: title }),
+        body ? /* @__PURE__ */ jsx11("p", { className: "dt-lp-lead", children: body }) : null,
+        note ? /* @__PURE__ */ jsxs9("p", { className: "dt-lp-callout", children: [
+          /* @__PURE__ */ jsx11(Alert, { size: 20 }),
+          /* @__PURE__ */ jsxs9("span", { children: [
+            /* @__PURE__ */ jsx11("strong", { children: noteLabel }),
+            " ",
+            note
+          ] })
+        ] }) : null,
+        media ? /* @__PURE__ */ jsx11(InlineItems, { items }) : null,
+        /* @__PURE__ */ jsx11(Cta, { cta, className: "dt-lp-mt" })
+      ] }, "text");
+      const side = media ? /* @__PURE__ */ jsx11(Media, { children: media }, "side") : /* @__PURE__ */ jsx11("ul", { className: "dt-lp-grid dt-lp-grid--chips", children: items.map(asItem).map((f) => /* @__PURE__ */ jsxs9("li", { className: "dt-lp-chip-card", children: [
+        renderIcon(f.icon, 22),
+        /* @__PURE__ */ jsx11("span", { children: f.title })
+      ] }, f.title)) }, "side");
+      return shell(/* @__PURE__ */ jsx11(Pair, { className: "dt-lp-split dt-lp-split--wide", reverse, text, side }));
+    }
+    case "band": {
+      const { examples, examplesLabel = "Examples" } = props;
+      const text = /* @__PURE__ */ jsxs9("div", { children: [
+        /* @__PURE__ */ jsx11(SectionIntro, { id: hid, eyebrow, title, body }),
+        /* @__PURE__ */ jsx11(Chips, { items: examples, label: examplesLabel, className: "dt-lp-mt" }),
+        media ? /* @__PURE__ */ jsx11(InlineItems, { items }) : null,
+        /* @__PURE__ */ jsx11(Cta, { cta, className: "dt-lp-mt" })
+      ] }, "text");
+      const side = media ? /* @__PURE__ */ jsx11(Media, { children: media }, "side") : /* @__PURE__ */ jsx11("ul", { className: "dt-lp-band-list", children: items.map(asItem).map((f) => /* @__PURE__ */ jsxs9("li", { children: [
+        renderIcon(f.icon, 22),
+        /* @__PURE__ */ jsx11("span", { children: f.title })
+      ] }, f.title)) }, "side");
+      return shell(/* @__PURE__ */ jsx11(Pair, { className: "dt-lp-band", reverse, text, side }));
+    }
+    case "compare": {
+      const { columns = [] } = props;
+      return shell(
+        /* @__PURE__ */ jsxs9(Fragment3, { children: [
+          /* @__PURE__ */ jsx11(SectionIntro, { id: hid, eyebrow, title, body }),
+          /* @__PURE__ */ jsx11("div", { className: "dt-lp-compare", children: columns.map((col, i) => {
+            const cid = `${id || "compare"}-${i + 1}`;
+            const tone2 = col.tone || (i === 0 ? "good" : "check");
+            return /* @__PURE__ */ jsxs9("div", { className: "dt-lp-card dt-lp-card--compare", children: [
+              /* @__PURE__ */ jsx11("h3", { id: cid, className: "dt-lp-h3 dt-lp-h3--lg", children: col.title }),
+              /* @__PURE__ */ jsx11(Checklist, { items: col.items, tone: tone2, icon: tone2 === "good" ? Check : Help, labelledBy: cid })
+            ] }, cid);
+          }) })
+        ] })
+      );
+    }
+    case "links":
+      return shell(
+        /* @__PURE__ */ jsxs9(Fragment3, { children: [
+          /* @__PURE__ */ jsx11(SectionIntro, { id: hid, eyebrow, title, body }),
+          /* @__PURE__ */ jsx11("ul", { className: "dt-lp-grid dt-lp-grid--links", children: items.map((s) => /* @__PURE__ */ jsx11("li", { children: /* @__PURE__ */ jsxs9(SmartLink, { href: s.href, className: "dt-lp-linkcard", children: [
+            /* @__PURE__ */ jsxs9("span", { className: "dt-lp-linkcard-title", children: [
+              s.title,
+              " ",
+              /* @__PURE__ */ jsx11(ArrowRight, {})
+            ] }),
+            s.body ? /* @__PURE__ */ jsx11("span", { className: "dt-lp-linkcard-body", children: s.body }) : null
+          ] }) }, s.href)) })
+        ] })
+      );
+    case "detail": {
+      return shell(
+        /* @__PURE__ */ jsxs9("div", { className: "dt-lp-detail", children: [
+          /* @__PURE__ */ jsx11("h2", { id: hid, className: "dt-lp-h2", children: title }),
+          /* @__PURE__ */ jsxs9("div", { children: [
+            body ? /* @__PURE__ */ jsx11("p", { className: "dt-lp-body", children: body }) : null,
+            (bullets == null ? void 0 : bullets.length) ? /* @__PURE__ */ jsx11(Checklist, { items: bullets }) : null
+          ] })
+        ] })
+      );
+    }
+    default:
+      return shell(
+        /* @__PURE__ */ jsxs9(Fragment3, { children: [
+          /* @__PURE__ */ jsx11(SectionIntro, { id: hid, eyebrow, title, body }),
+          /* @__PURE__ */ jsx11(Items, { items, kind: "cards" }),
+          footnote ? /* @__PURE__ */ jsx11("p", { className: "dt-lp-footnote", children: footnote }) : null,
+          /* @__PURE__ */ jsx11(Cta, { cta, className: "dt-lp-mt" })
+        ] })
+      );
+  }
+}
+
+// src/Audiences.jsx
+import { jsx as jsx12, jsxs as jsxs10 } from "react/jsx-runtime";
+function Audiences({ id = "audiences", eyebrow, title, body, items = [], linkLabel = "See how it works", tone = "muted" }) {
+  const hid = `${id}-title`;
+  return /* @__PURE__ */ jsxs10(Section, { id, labelledBy: hid, tone, className: "dt-lp-audiences", children: [
+    /* @__PURE__ */ jsx12(SectionIntro, { id: hid, eyebrow, title, body, align: "center" }),
+    /* @__PURE__ */ jsx12("div", { className: `dt-lp-grid dt-lp-grid--audiences dt-lp-grid--n${Math.min(items.length, 4)}`, children: items.map((a, i) => {
+      var _a;
+      const aid = a.id || `${id}-${i + 1}`;
+      return /* @__PURE__ */ jsxs10("article", { id: aid, "aria-labelledby": `${aid}-title`, className: "dt-lp-card dt-lp-card--audience", children: [
+        a.icon ? /* @__PURE__ */ jsx12("span", { className: "dt-lp-audience-icon", children: renderIcon(a.icon, 30) }) : null,
+        /* @__PURE__ */ jsxs10("div", { className: a.media ? "dt-lp-audience-head" : void 0, children: [
+          /* @__PURE__ */ jsxs10("div", { children: [
+            a.keyword ? /* @__PURE__ */ jsx12("p", { className: "dt-lp-kicker", children: a.keyword }) : null,
+            /* @__PURE__ */ jsx12("h3", { id: `${aid}-title`, className: "dt-lp-h3 dt-lp-h3--lg", children: a.title }),
+            /* @__PURE__ */ jsx12("p", { className: a.media || a.features ? void 0 : "dt-lp-grow", children: a.body })
+          ] }),
+          a.media ? /* @__PURE__ */ jsx12("div", { className: "dt-lp-audience-media", "aria-hidden": "true", children: a.media }) : null
+        ] }),
+        ((_a = a.features) == null ? void 0 : _a.length) ? /* @__PURE__ */ jsx12("ul", { className: "dt-lp-audience-features dt-lp-grow", children: a.features.map((f) => {
+          const it = typeof f === "string" ? { title: f } : f;
+          return /* @__PURE__ */ jsxs10("li", { children: [
+            it.icon ? renderIcon(it.icon, 22) : null,
+            /* @__PURE__ */ jsx12("span", { children: it.title })
+          ] }, it.title);
+        }) }) : null,
+        a.href ? /* @__PURE__ */ jsx12(TextLink, { href: a.href, "aria-label": `${a.keyword || a.title}: ${(a.linkLabel || linkLabel).toLowerCase()}`, children: a.linkLabel || linkLabel }) : null
+      ] }, aid);
+    }) })
+  ] });
+}
+
+// src/HowItWorks.jsx
+import { jsx as jsx13, jsxs as jsxs11 } from "react/jsx-runtime";
+function HowItWorks({ id = "how-it-works", eyebrow, title, body, steps, items, tone = "plain", cta }) {
+  const list = steps || items || [];
+  const hid = `${id}-title`;
+  return /* @__PURE__ */ jsxs11(Section, { id, labelledBy: hid, tone, className: "dt-lp-steps", children: [
+    /* @__PURE__ */ jsx13(SectionIntro, { id: hid, eyebrow, title, body }),
+    /* @__PURE__ */ jsx13("ol", { className: "dt-lp-grid dt-lp-grid--steps", children: list.map((st, i) => /* @__PURE__ */ jsxs11("li", { className: "dt-lp-card", children: [
+      /* @__PURE__ */ jsx13("span", { className: "dt-lp-step-num", "aria-hidden": "true", children: i + 1 }),
+      /* @__PURE__ */ jsx13("h3", { className: "dt-lp-h3", children: st.name || st.title }),
+      /* @__PURE__ */ jsx13("p", { children: st.text || st.body })
+    ] }, st.name || st.title)) }),
+    /* @__PURE__ */ jsx13(Cta, { cta, className: "dt-lp-mt" })
+  ] });
+}
+
+// src/Faq.jsx
+import { jsx as jsx14, jsxs as jsxs12 } from "react/jsx-runtime";
+function Faq({ id = "faq", eyebrow, title = "Frequently asked questions", intro, items = [], openFirst = true, tone = "muted" }) {
+  const hid = `${id}-title`;
+  return /* @__PURE__ */ jsxs12(Section, { id, labelledBy: hid, tone, narrow: true, className: "dt-lp-faq", children: [
+    /* @__PURE__ */ jsx14(SectionIntro, { id: hid, eyebrow, title, body: intro, align: "center" }),
+    /* @__PURE__ */ jsx14("div", { className: "dt-lp-faq-list", children: items.map((f, i) => /* @__PURE__ */ jsxs12("details", { className: "dt-lp-faq-item", open: openFirst && i === 0, children: [
+      /* @__PURE__ */ jsxs12("summary", { children: [
+        /* @__PURE__ */ jsx14("h3", { className: "dt-lp-h3", children: f.q }),
+        /* @__PURE__ */ jsx14(ChevronRight, { size: 18, className: "dt-lp-icon dt-lp-faq-chevron" })
+      ] }),
+      /* @__PURE__ */ jsx14("p", { children: f.a })
+    ] }, f.q)) })
+  ] });
+}
+
+// src/DemoCta.jsx
+import { jsx as jsx15, jsxs as jsxs13 } from "react/jsx-runtime";
+function DemoCta({ id = "demo", eyebrow, title, body, label = "Book a demo", chips, chipsLabel = "Business types", note, link }) {
+  return /* @__PURE__ */ jsx15("section", { id, "aria-labelledby": `${id}-title`, className: "dt-lp-section dt-lp-cta", children: /* @__PURE__ */ jsx15(Wrap, { children: /* @__PURE__ */ jsxs13("div", { className: "dt-lp-cta-panel", children: [
+    eyebrow ? /* @__PURE__ */ jsx15("p", { className: "dt-lp-eyebrow dt-lp-eyebrow--inverse", children: eyebrow }) : null,
+    /* @__PURE__ */ jsx15("h2", { id: `${id}-title`, className: "dt-lp-h2 dt-lp-h2--cta", children: title }),
+    body ? /* @__PURE__ */ jsx15("p", { className: "dt-lp-cta-body", children: body }) : null,
+    /* @__PURE__ */ jsx15(BookDemoButton, { size: "lg", variant: "inverse", children: label }),
+    (chips == null ? void 0 : chips.length) ? /* @__PURE__ */ jsx15("ul", { className: "dt-lp-chips dt-lp-chips--inverse", "aria-label": chipsLabel, children: chips.map((k) => /* @__PURE__ */ jsx15("li", { children: k }, k)) }) : null,
+    note ? /* @__PURE__ */ jsxs13("div", { className: "dt-lp-cta-note", children: [
+      note.title ? /* @__PURE__ */ jsx15("h3", { className: "dt-lp-h3", children: note.title }) : null,
+      note.body ? /* @__PURE__ */ jsx15("p", { children: note.body }) : null
+    ] }) : null,
+    link ? /* @__PURE__ */ jsx15("p", { className: "dt-lp-cta-link", children: /* @__PURE__ */ jsx15(SmartLink, { href: link.href, reload: link.reload, children: link.label }) }) : null
+  ] }) }) });
+}
+
+// src/LandingPage.jsx
+import { jsx as jsx16, jsxs as jsxs14 } from "react/jsx-runtime";
+var BLOCKS = { audiences: Audiences, steps: HowItWorks, faq: Faq, cta: DemoCta };
+var TAIL = ["audiences", "steps", "faq", "cta"];
+function LandingPage({ brand, content, preview = null, slots = {}, linkComponent, onBookDemo, home = true, className }) {
+  if (!content || !content.hero) {
+    throw new Error('landing-kit: "content.hero" is missing. LandingPage needs at least { hero: { title } }; see README "Content".');
+  }
+  const { nav = [], login, hero, sections = [], footer, header = {} } = content;
+  const used = new Set(sections.filter((s) => s && s.use).map((s) => s.use));
+  const previewInline = used.has("preview");
+  const render = (s, i) => {
+    var _a;
+    if (!s) return null;
+    if (isValidElement2(s)) return cloneElement(s, { key: (_a = s.key) != null ? _a : `el-${i}` });
+    if (s.use === "preview") return preview ? /* @__PURE__ */ jsx16("div", { children: preview }, "preview") : null;
+    if (s.use) {
+      if (slots && Object.prototype.hasOwnProperty.call(slots, s.use)) {
+        const node = slots[s.use];
+        return node ? /* @__PURE__ */ jsx16(Fragment4, { children: node }, `slot-${s.use}`) : null;
+      }
+      const Block = BLOCKS[s.use];
+      if (!Block) {
+        const known = ["preview", ...TAIL, ...Object.keys(slots || {})].join(", ");
+        throw new Error(`landing-kit: unknown section use "${s.use}" (known: ${known}). Pass custom sections as <LandingPage slots={{ ${s.use}: <YourSection /> }} />.`);
+      }
+      return content[s.use] ? /* @__PURE__ */ jsx16(Block, { ...content[s.use] }, s.use) : null;
+    }
+    return /* @__PURE__ */ jsx16(FeatureSection, { ...s }, s.id || `section-${i}`);
+  };
+  return /* @__PURE__ */ jsxs14(
+    MarketingLayout,
+    {
+      brand,
+      nav,
+      login,
+      cta: header.cta,
+      footer,
+      home,
+      linkComponent,
+      onBookDemo,
+      className,
+      children: [
+        /* @__PURE__ */ jsx16(Hero, { ...hero, overlap: !!preview && !previewInline }),
+        preview && !previewInline ? preview : null,
+        sections.map(render),
+        TAIL.filter((k) => !used.has(k) && content[k]).map((k) => {
+          const Block = BLOCKS[k];
+          return /* @__PURE__ */ jsx16(Block, { ...content[k] }, k);
+        })
+      ]
+    }
+  );
+}
+
+// src/PreviewFrame.jsx
+import { jsx as jsx17, jsxs as jsxs15 } from "react/jsx-runtime";
+function PreviewFrame({
+  id = "product",
+  heading,
+  caption,
+  meta,
+  badge = "Demo data",
+  brand: own,
+  children
+}) {
+  const ctx = useLanding();
+  const brand = own || ctx.brand;
+  return /* @__PURE__ */ jsxs15("section", { id, "aria-labelledby": `${id}-title`, className: "dt-lp-preview", children: [
+    /* @__PURE__ */ jsx17("h2", { id: `${id}-title`, className: "dt-lp-sr-only", children: heading || `${brand ? brand.name : "Product"} overview` }),
+    /* @__PURE__ */ jsx17(Wrap, { children: /* @__PURE__ */ jsxs15("figure", { className: "dt-lp-preview-frame", children: [
+      /* @__PURE__ */ jsxs15("div", { className: "dt-lp-preview-bar", children: [
+        /* @__PURE__ */ jsxs15("div", { className: "dt-lp-preview-title", children: [
+          brand ? /* @__PURE__ */ jsx17(Wordmark, { name: brand.name }) : null,
+          meta ? /* @__PURE__ */ jsx17("span", { className: "dt-lp-preview-meta", children: meta }) : null
+        ] }),
+        badge ? /* @__PURE__ */ jsx17("span", { className: "dt-lp-preview-badge", children: badge }) : null
+      ] }),
+      /* @__PURE__ */ jsx17("div", { className: "dt-lp-preview-body", children }),
+      caption ? /* @__PURE__ */ jsx17("figcaption", { className: "dt-lp-sr-only", children: caption }) : null
+    ] }) })
+  ] });
+}
+
+// src/DemoDialog.jsx
+import { useEffect, useRef, useState as useState2 } from "react";
+import { jsx as jsx18, jsxs as jsxs16 } from "react/jsx-runtime";
+var DEFAULT_DEMO_FIELDS = [
+  { name: "name", label: "Your name", required: true, maxLength: 120, autoComplete: "name" },
+  { name: "phone", label: "Mobile", type: "tel", required: true, maxLength: 20, autoComplete: "tel", inputMode: "tel" },
+  { name: "email", label: "Email", type: "email", maxLength: 190, autoComplete: "email" },
+  { name: "company", label: "Business name", maxLength: 160, autoComplete: "organization" }
+];
+var initial = (fields) => Object.fromEntries(fields.map((f) => [f.name, ""]));
+function Field({ f, value, onChange, error }) {
+  const id = `dt-demo-${f.name}`;
+  const errId = `${id}-error`;
+  const common = {
+    id,
+    name: f.name,
+    value,
+    onChange,
+    required: !!f.required,
+    className: "dt-lp-input",
+    ...error ? { "aria-invalid": "true", "aria-describedby": errId } : {}
+  };
+  let control;
+  if (f.type === "select") {
+    control = /* @__PURE__ */ jsxs16("select", { ...common, children: [
+      /* @__PURE__ */ jsx18("option", { value: "", children: f.placeholder || "Choose one" }),
+      (f.options || []).map((o) => /* @__PURE__ */ jsx18("option", { value: o.value, children: o.label }, o.value))
+    ] });
+  } else if (f.type === "textarea") {
+    control = /* @__PURE__ */ jsx18("textarea", { ...common, rows: f.rows || 3, maxLength: f.maxLength });
+  } else {
+    control = /* @__PURE__ */ jsx18(
+      "input",
+      {
+        ...common,
+        type: f.type || "text",
+        maxLength: f.maxLength,
+        min: f.min,
+        inputMode: f.inputMode,
+        autoComplete: f.autoComplete,
+        placeholder: f.placeholder
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs16("label", { htmlFor: id, className: `dt-lp-field${f.wide || f.type === "textarea" ? " dt-lp-field--wide" : ""}`, children: [
+    /* @__PURE__ */ jsxs16("span", { children: [
+      f.label,
+      f.required ? " *" : ""
+    ] }),
+    control,
+    error ? /* @__PURE__ */ jsx18("span", { id: errId, className: "dt-lp-field-error", children: error }) : null
+  ] });
+}
+function DemoDialog({
+  brand,
+  open = true,
+  onClose = () => {
+  },
+  onSubmit,
+  fields = DEFAULT_DEMO_FIELDS,
+  title,
+  intro = "Tell us a little about your business and we will walk you through the workflows that matter to your team.",
+  fiduciary = "Dreamtree-Org",
+  consentText,
+  privacyHref = "/privacy",
+  policyVersion,
+  submitLabel = "Request my demo",
+  successMessage,
+  validate
+}) {
+  const ref = useRef(null);
+  const [form, setForm] = useState2(() => initial(fields));
+  const [website, setWebsite] = useState2("");
+  const [consent, setConsent] = useState2(false);
+  const [busy, setBusy] = useState2(false);
+  const [err, setErr] = useState2("");
+  const [fieldErrors, setFieldErrors] = useState2({});
+  const [sent, setSent] = useState2(false);
+  const name = brand ? brand.name : "a";
+  useEffect(() => {
+    const dlg = ref.current;
+    if (open && dlg && !dlg.open && typeof dlg.showModal === "function") dlg.showModal();
+  }, [open]);
+  if (!open) return null;
+  if (typeof onSubmit !== "function") {
+    throw new Error('landing-kit DemoDialog: "onSubmit" is missing. Pass async (data) => { /* POST the demo request */ }.');
+  }
+  const set = (k) => (e) => {
+    setForm((f) => ({ ...f, [k]: e.target.value }));
+    if (fieldErrors[k]) setFieldErrors(({ [k]: _gone, ...rest }) => rest);
+  };
+  const ready = consent && (typeof validate === "function" || fields.every((f) => !f.required || String(form[f.name] || "").trim()));
+  const submit = async (e) => {
+    e.preventDefault();
+    if (!ready || busy) return;
+    setErr("");
+    if (typeof validate === "function") {
+      const found = validate(form) || {};
+      setFieldErrors(found);
+      if (Object.keys(found).length) return;
+    }
+    setBusy(true);
+    try {
+      await onSubmit({ ...form, website, consent: true, source_path: typeof window === "undefined" ? "/" : window.location.pathname });
+      setSent(true);
+    } catch (ex) {
+      if (ex && ex.fields && typeof ex.fields === "object") setFieldErrors(ex.fields);
+      setErr(ex && ex.message || "Could not send your request. Please try again.");
+    } finally {
+      setBusy(false);
+    }
+  };
+  const first = String(form.name || "").trim().split(/\s+/)[0] || "there";
+  const thanks = typeof successMessage === "function" ? successMessage(form) : successMessage || `Thanks, ${first}. We have your request. Someone from the ${name} team will call you within one working day to fix a time.`;
+  return /* @__PURE__ */ jsxs16(
+    "dialog",
+    {
+      ref,
+      className: "dt-lp-dialog",
+      style: brand ? brandStyle(brand) : void 0,
+      "aria-labelledby": "dt-demo-title",
+      onClose,
+      onCancel: (e) => {
+        e.preventDefault();
+        onClose();
+      },
+      children: [
+        /* @__PURE__ */ jsxs16("div", { className: "dt-lp-dialog-head", children: [
+          /* @__PURE__ */ jsx18("h2", { id: "dt-demo-title", children: sent ? "Thank you" : title || `Book a ${name} demo` }),
+          /* @__PURE__ */ jsx18("button", { type: "button", className: "dt-lp-dialog-x", onClick: onClose, "aria-label": "Close", children: /* @__PURE__ */ jsx18(Close, { size: 18 }) })
+        ] }),
+        /* @__PURE__ */ jsx18("div", { className: "dt-lp-dialog-body", children: sent ? /* @__PURE__ */ jsxs16("div", { className: "dt-lp-stack", children: [
+          /* @__PURE__ */ jsx18("p", { role: "status", children: thanks }),
+          /* @__PURE__ */ jsx18("button", { type: "button", className: "dt-lp-btn dt-lp-btn--outline dt-lp-btn--md", onClick: onClose, children: "Close" })
+        ] }) : /* @__PURE__ */ jsxs16("form", { className: "dt-lp-stack", onSubmit: submit, noValidate: true, children: [
+          intro ? /* @__PURE__ */ jsx18("p", { className: "dt-lp-muted", children: intro }) : null,
+          err ? /* @__PURE__ */ jsx18("p", { role: "alert", className: "dt-lp-error", children: err }) : null,
+          /* @__PURE__ */ jsx18("div", { className: "dt-lp-fields", children: fields.map((f) => /* @__PURE__ */ jsx18(Field, { f, value: form[f.name], onChange: set(f.name), error: fieldErrors[f.name] }, f.name)) }),
+          /* @__PURE__ */ jsx18("div", { "aria-hidden": "true", className: "dt-lp-honeypot", children: /* @__PURE__ */ jsxs16("label", { children: [
+            "Website",
+            /* @__PURE__ */ jsx18("input", { type: "text", name: "website", tabIndex: -1, autoComplete: "off", value: website, onChange: (e) => setWebsite(e.target.value) })
+          ] }) }),
+          /* @__PURE__ */ jsxs16("label", { className: "dt-lp-consent", children: [
+            /* @__PURE__ */ jsx18("input", { type: "checkbox", checked: consent, onChange: (e) => setConsent(e.target.checked) }),
+            /* @__PURE__ */ jsx18("span", { children: consentText || `I agree that ${fiduciary} may call, message or email me about this demo.` })
+          ] }),
+          privacyHref ? /* @__PURE__ */ jsxs16("p", { className: "dt-lp-fineprint", children: [
+            "Used only to arrange your demo. See the ",
+            /* @__PURE__ */ jsx18("a", { href: privacyHref, children: "privacy policy" }),
+            policyVersion ? ` (v${policyVersion})` : "",
+            "."
+          ] }) : null,
+          /* @__PURE__ */ jsxs16("button", { type: "submit", className: "dt-lp-btn dt-lp-btn--primary dt-lp-btn--md", disabled: !ready || busy, "aria-busy": busy ? "true" : void 0, children: [
+            /* @__PURE__ */ jsx18(Calendar, { size: 16 }),
+            busy ? "Sending\u2026" : submitLabel
+          ] })
+        ] }) })
+      ]
+    }
+  );
+}
+
+// src/PageHero.jsx
+import { jsx as jsx19, jsxs as jsxs17 } from "react/jsx-runtime";
+function Breadcrumbs({ items = [] }) {
+  if (!items.length) return null;
+  return /* @__PURE__ */ jsx19("nav", { "aria-label": "Breadcrumb", className: "dt-lp-crumbs", children: /* @__PURE__ */ jsx19("ol", { children: items.map((c, i) => {
+    const last = i === items.length - 1;
+    return /* @__PURE__ */ jsxs17("li", { children: [
+      i > 0 ? /* @__PURE__ */ jsx19(ChevronRight, { size: 14 }) : null,
+      last || !c.href ? /* @__PURE__ */ jsx19("span", { "aria-current": last ? "page" : void 0, children: c.label }) : /* @__PURE__ */ jsx19(SmartLink, { href: c.href, children: c.label })
+    ] }, `${c.label}-${i}`);
+  }) }) });
+}
+function PageHero({ breadcrumbs, eyebrow, title, lead, cta = "Book a demo", secondary }) {
+  return /* @__PURE__ */ jsx19("section", { "aria-labelledby": "hero-title", className: "dt-lp-hero dt-lp-hero--page", children: /* @__PURE__ */ jsxs17(Wrap, { className: "dt-lp-hero-inner dt-lp-hero-inner--start", children: [
+    /* @__PURE__ */ jsx19(Breadcrumbs, { items: breadcrumbs }),
+    /* @__PURE__ */ jsx19(Eyebrow, { className: "dt-lp-mt-lg", children: eyebrow }),
+    /* @__PURE__ */ jsx19("h1", { id: "hero-title", className: "dt-lp-h1 dt-lp-h1--page", children: title }),
+    lead ? /* @__PURE__ */ jsx19("p", { id: "answer", className: "dt-lp-hero-lead", children: lead }) : null,
+    /* @__PURE__ */ jsxs17("div", { className: "dt-lp-actions dt-lp-actions--start", children: [
+      cta ? /* @__PURE__ */ jsx19(BookDemoButton, { size: "lg", children: cta }) : null,
+      secondary ? /* @__PURE__ */ jsx19(TextLink, { href: secondary.href, children: secondary.label }) : null
+    ] })
+  ] }) });
+}
+
+// src/island.jsx
+import { createRoot } from "react-dom/client";
+import { jsx as jsx20 } from "react/jsx-runtime";
+function createDemoIsland(props) {
+  let root;
+  let returnTo = null;
+  const close = () => {
+    root.render(null);
+    const target = returnTo;
+    if (target) setTimeout(() => target.focus(), 0);
+  };
+  return {
+    openDemo(trigger) {
+      returnTo = trigger || null;
+      if (!root) {
+        const host = document.createElement("div");
+        host.id = "demo-dialog-root";
+        document.body.appendChild(host);
+        root = createRoot(host);
+      }
+      const p = typeof props === "function" ? props() : props;
+      root.render(/* @__PURE__ */ jsx20(DemoDialog, { ...p, onClose: close }, Date.now()));
+    },
+    close
+  };
+}
+
+// src/brands.js
+var brands = {
+  billpro: {
+    id: "billpro",
+    name: "BillPro",
+    primary: "#15803d",
+    // current #19a249, darkened one step for AA contrast on white
+    accent: "#4ade80",
+    logoSrc: "/brand/billpro-mark.svg",
+    headline: "Billing, inventory and GST \u2014 done right, every day.",
+    pitch: "GST invoices, stock, purchases and accounts for growing Indian businesses.",
+    points: ["GST-ready invoices and returns", "Live inventory across branches", "Payments, ledgers and reports"],
+    category: "Billing & Inventory \xB7 by Dreamtree-Org"
+  },
+  taskpro: {
+    id: "taskpro",
+    name: "TaskPro",
+    primary: "#065f46",
+    accent: "#34d399",
+    logoSrc: "/taskpro-mark-48.webp",
+    headline: "Projects and workflows, shaped the way your team works.",
+    pitch: "Configurable project types, statuses and automations \u2014 one place for every task.",
+    points: ["Your own workflows and statuses", "Boards, timelines and my-work", "Automations and audit trail"],
+    category: "Project & Workflow Management \xB7 by Dreamtree-Org"
+  },
+  venturepro: {
+    id: "venturepro",
+    name: "VenturePro",
+    primary: "#1e3a6e",
+    accent: "#e5ad42",
+    // accent-400, as shipped
+    panel: "#182e57",
+    // primary-700, as shipped
+    logoSrc: "/brand/venturepro-mark.svg",
+    headline: "Every venture, block and flat \u2014 in one place.",
+    pitch: "Create ventures, lay out blocks and units, track sales, rentals and collections across your whole portfolio.",
+    points: [],
+    category: "Builder Property & Apartment Management System"
+  },
+  campaignpro: {
+    id: "campaignpro",
+    name: "CampaignPro",
+    primary: "#6d28d9",
+    // PROPOSED — was the same red as firepro
+    accent: "#a78bfa",
+    headline: "Run every campaign from one pipeline.",
+    pitch: "Plan, send and track campaigns across channels with your whole team.",
+    points: ["Multi-channel campaigns", "Pipeline and follow-ups", "Team roles and approvals"],
+    category: "Campaign Management \xB7 by Dreamtree-Org"
+  },
+  firepro: {
+    id: "firepro",
+    name: "FirePro",
+    primary: "#b42318",
+    // keeps the red — it is the fire-safety product
+    accent: "#fb923c",
+    headline: "Fire safety compliance, inspections and service \u2014 on schedule.",
+    pitch: "Assets, inspections, service jobs and certificates for fire-safety teams.",
+    points: ["Scheduled inspections", "Asset and site registers", "Certificates and reports"],
+    category: "Fire Safety Operations \xB7 by Dreamtree-Org"
+  },
+  procurementpro: {
+    id: "procurementpro",
+    name: "ProcurementPro",
+    primary: "#1d4ed8",
+    // current #2563eb, one step darker for panel contrast
+    accent: "#60a5fa",
+    headline: "From request to purchase order, without the chase.",
+    pitch: "RFQs, quotations, approvals and purchase orders in one audited flow.",
+    points: ["RFQs and quotation comparison", "Approval workflows", "Purchase orders and vendors"],
+    category: "Procurement \xB7 by Dreamtree-Org"
+  },
+  fitweavepro: {
+    id: "fitweavepro",
+    name: "FitWeavePro",
+    primary: "#be185d",
+    // PROPOSED — was Tailwind blue
+    accent: "#f9a8d4",
+    headline: "Made-to-measure, made simple.",
+    pitch: "Measurements, patterns and orders for tailoring shops.",
+    points: ["Customer measurements", "Pattern and cutting plans", "Orders and deliveries"],
+    category: "Tailoring Shop Management \xB7 by Dreamtree-Org"
+  },
+  aiagentbuilder: {
+    id: "aiagentbuilder",
+    name: "AI Agent Builder",
+    primary: "#0f766e",
+    // PROPOSED — was blue, same as procurementpro
+    accent: "#5eead4",
+    headline: "Build, approve and ship AI agents your team can trust.",
+    pitch: "Multi-provider agents with approvals, knowledge bases, voice and an MCP server.",
+    points: ["Human-in-the-loop approvals", "Knowledge bases (RAG)", "Voice calls and campaigns"],
+    category: "AI Agent Platform \xB7 by Dreamtree-Org"
+  },
+  runloompro: {
+    id: "runloompro",
+    name: "RunLoom",
+    primary: "#4f46e5",
+    accent: "#a5b4fc",
+    headline: "Missions, run reliably.",
+    pitch: "Orchestrate long-running work across workers with full telemetry.",
+    points: ["Durable missions", "Node and Python workers", "Telemetry built in"],
+    category: "by Dreamtree-Org"
+  },
+  appforge: {
+    id: "appforge",
+    name: "AppForge",
+    primary: "#1f3864",
+    accent: "#2563eb",
+    headline: "Design, build and publish business apps.",
+    pitch: "Schema-driven apps with policy, review and one-click release.",
+    points: ["Visual builder", "Policies and RBAC", "Review and publish"],
+    category: "by Dreamtree-Org"
+  }
+};
+function getBrand(id) {
+  const b = brands[id];
+  if (!b) throw new Error(`landing-kit: unknown brand "${id}" (known: ${Object.keys(brands).join(", ")})`);
+  return b;
+}
+export {
+  Audiences,
+  AuthShell,
+  BookDemoButton,
+  BrandLockup,
+  BrandMark2 as BrandMark,
+  Breadcrumbs,
+  Cta,
+  DEFAULT_DEMO_FIELDS,
+  DemoCta,
+  DemoDialog,
+  DreamtreeFooter,
+  DreamtreeMark,
+  Eyebrow,
+  Faq,
+  FeatureSection,
+  Header,
+  Hero,
+  HowItWorks,
+  LandingPage,
+  LandingProvider,
+  MarketingLayout,
+  PageHero,
+  PreviewFrame,
+  Section,
+  SectionIntro,
+  SmartLink,
+  TextLink,
+  Wordmark,
+  Wrap,
+  brandStyle,
+  brands,
+  createDemoIsland,
+  getBrand,
+  resolveHref,
+  useLanding
+};