@mdxui/services 0.1.0

package/dist/components/index.js

@@ -0,0 +1,615 @@
+// src/components/HeroSplit.tsx
+import Link from "next/link";
+import { ChevronRight } from "lucide-react";
+import { jsx, jsxs } from "react/jsx-runtime";
+function HeroSplit({
+  eyebrow,
+  headline,
+  body,
+  primary,
+  secondary,
+  showGlyph = true,
+  /* INTENTIONALLY UNDEFAULTED — the smart default below uses the
+   * undefined state to distinguish "explicitly unset" from
+   * "explicitly false" (the opt-out escape hatch). */
+  glyphOnMobile,
+  illustration
+}) {
+  const effectiveGlyphOnMobile = glyphOnMobile ?? Boolean(illustration);
+  return /* @__PURE__ */ jsx("section", { className: "border-b border-line", children: /* @__PURE__ */ jsx("div", { className: "mx-auto max-w-container px-6 py-16 sm:px-10 sm:py-28 lg:py-32", children: /* @__PURE__ */ jsxs("div", { className: showGlyph ? "lg:grid lg:grid-cols-[minmax(0,1fr)_360px] lg:items-center lg:gap-16" : "", children: [
+    /* @__PURE__ */ jsxs("div", { children: [
+      /* @__PURE__ */ jsx("p", { className: "text-[11px] uppercase tracking-[0.18em] text-ink3", children: eyebrow }),
+      /* @__PURE__ */ jsx("h1", { className: "mt-5 max-w-[18ch] font-display text-display-hero leading-[1.04] tracking-tighter2 text-ink", children: headline }),
+      /* @__PURE__ */ jsx("p", { className: "mt-6 max-w-[58ch] text-[16px] leading-relaxed text-ink2 sm:mt-7 sm:text-[17px]", children: body }),
+      /* @__PURE__ */ jsxs("div", { className: "mt-10 flex flex-col items-stretch gap-4 sm:flex-row sm:flex-wrap sm:items-center", children: [
+        /* @__PURE__ */ jsx(PrimaryAction, { action: primary }),
+        secondary && /* @__PURE__ */ jsx(SecondaryAction, { action: secondary })
+      ] })
+    ] }),
+    showGlyph && /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: effectiveGlyphOnMobile ? "mt-12 lg:mt-0 lg:block" : "hidden lg:block",
+        "aria-hidden": "true",
+        children: illustration ?? /* @__PURE__ */ jsx(HeroGlyph, {})
+      }
+    )
+  ] }) }) });
+}
+function PrimaryAction({ action }) {
+  const className = "inline-flex w-full items-center justify-center gap-1.5 rounded-cta bg-cta px-5 py-3 text-[14px] font-medium tracking-tightish text-cta-fg transition-colors hover:bg-cta-hover sm:w-auto sm:justify-start";
+  if (action.external) {
+    return /* @__PURE__ */ jsxs(
+      "a",
+      {
+        href: action.href,
+        target: "_blank",
+        rel: "noopener noreferrer",
+        className,
+        children: [
+          action.label,
+          /* @__PURE__ */ jsx(ChevronRight, { className: "h-4 w-4", strokeWidth: 1.7 })
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs(Link, { href: action.href, className, children: [
+    action.label,
+    /* @__PURE__ */ jsx(ChevronRight, { className: "h-4 w-4", strokeWidth: 1.7 })
+  ] });
+}
+function SecondaryAction({ action }) {
+  const className = "inline-flex items-center justify-center gap-1.5 text-[13px] font-medium tracking-tightish text-ink2 transition-colors hover:text-accentDeep sm:justify-start";
+  if (action.external) {
+    return /* @__PURE__ */ jsxs(
+      "a",
+      {
+        href: action.href,
+        target: "_blank",
+        rel: "noopener noreferrer",
+        className,
+        children: [
+          action.label,
+          /* @__PURE__ */ jsx(ChevronRight, { className: "h-3.5 w-3.5", strokeWidth: 1.7 })
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs(Link, { href: action.href, className, children: [
+    action.label,
+    /* @__PURE__ */ jsx(ChevronRight, { className: "h-3.5 w-3.5", strokeWidth: 1.7 })
+  ] });
+}
+function HeroGlyph() {
+  return /* @__PURE__ */ jsxs(
+    "svg",
+    {
+      viewBox: "0 0 360 280",
+      className: "h-auto w-full",
+      fill: "none",
+      role: "presentation",
+      children: [
+        /* @__PURE__ */ jsxs(
+          "g",
+          {
+            stroke: "oklch(var(--ink3) / 0.55)",
+            strokeWidth: "1.5",
+            strokeLinecap: "round",
+            children: [
+              /* @__PURE__ */ jsx("line", { x1: "40", y1: "40", x2: "180", y2: "40" }),
+              /* @__PURE__ */ jsx("line", { x1: "60", y1: "78", x2: "220", y2: "78" }),
+              /* @__PURE__ */ jsx("line", { x1: "40", y1: "172", x2: "200", y2: "172" }),
+              /* @__PURE__ */ jsx("line", { x1: "80", y1: "210", x2: "260", y2: "210" }),
+              /* @__PURE__ */ jsx("line", { x1: "60", y1: "248", x2: "180", y2: "248" })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "line",
+          {
+            x1: "40",
+            y1: "135",
+            x2: "280",
+            y2: "135",
+            stroke: "oklch(var(--accent))",
+            strokeWidth: "2.75",
+            strokeLinecap: "round"
+          }
+        ),
+        /* @__PURE__ */ jsx("circle", { cx: "280", cy: "135", r: "4", fill: "oklch(var(--accent-deep))" }),
+        /* @__PURE__ */ jsxs(
+          "g",
+          {
+            stroke: "oklch(var(--accent-deep) / 0.85)",
+            strokeWidth: "1",
+            strokeLinecap: "round",
+            children: [
+              /* @__PURE__ */ jsx("line", { x1: "312", y1: "100", x2: "312", y2: "170" }),
+              /* @__PURE__ */ jsx("line", { x1: "306", y1: "100", x2: "318", y2: "100" }),
+              /* @__PURE__ */ jsx("line", { x1: "306", y1: "170", x2: "318", y2: "170" }),
+              /* @__PURE__ */ jsx("line", { x1: "308", y1: "135", x2: "316", y2: "135" })
+            ]
+          }
+        )
+      ]
+    }
+  );
+}
+
+// src/components/HeroStacked.tsx
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+function HeroStacked({
+  eyebrow,
+  headline,
+  body,
+  primary,
+  secondary,
+  illustration
+}) {
+  return /* @__PURE__ */ jsx2("section", { className: "border-b border-line", children: /* @__PURE__ */ jsxs2("div", { className: "mx-auto max-w-container px-6 py-16 sm:px-10 sm:py-28 lg:py-32", children: [
+    /* @__PURE__ */ jsxs2("div", { className: "text-center", children: [
+      /* @__PURE__ */ jsx2("p", { className: "text-[11px] uppercase tracking-[0.18em] text-ink3", children: eyebrow }),
+      /* @__PURE__ */ jsx2("h1", { className: "mx-auto mt-5 max-w-[22ch] font-display text-display-hero leading-[1.04] tracking-tighter2 text-ink", children: headline }),
+      /* @__PURE__ */ jsx2("p", { className: "mx-auto mt-6 max-w-[60ch] text-[16px] leading-relaxed text-ink2 sm:mt-7 sm:text-[17px]", children: body }),
+      /* @__PURE__ */ jsxs2("div", { className: "mt-10 flex flex-col items-stretch justify-center gap-4 sm:flex-row sm:flex-wrap sm:items-center", children: [
+        /* @__PURE__ */ jsx2(PrimaryAction, { action: primary }),
+        secondary && /* @__PURE__ */ jsx2(SecondaryAction, { action: secondary })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx2("div", { className: "mx-auto mt-14 max-w-[1080px] sm:mt-16", "aria-hidden": "true", children: illustration })
+  ] }) });
+}
+
+// src/components/Hero.tsx
+import { jsx as jsx3 } from "react/jsx-runtime";
+function Hero(props) {
+  if (props.variant === "stacked-illustration-below" && props.illustration) {
+    return /* @__PURE__ */ jsx3(HeroStacked, { ...props });
+  }
+  return /* @__PURE__ */ jsx3(HeroSplit, { ...props });
+}
+
+// src/shared/section-eyebrow.tsx
+import { jsx as jsx4 } from "react/jsx-runtime";
+function SectionEyebrow({ children }) {
+  return /* @__PURE__ */ jsx4("p", { className: "text-[11px] uppercase tracking-[0.18em] text-ink3", children });
+}
+
+// src/components/Problem.tsx
+import { jsx as jsx5, jsxs as jsxs3 } from "react/jsx-runtime";
+function Problem({ eyebrow, heading, items }) {
+  return /* @__PURE__ */ jsx5("section", { className: "border-b border-line", children: /* @__PURE__ */ jsxs3("div", { className: "mx-auto max-w-container px-6 py-16 sm:px-10 sm:py-24", children: [
+    /* @__PURE__ */ jsx5(SectionEyebrow, { children: eyebrow }),
+    /* @__PURE__ */ jsx5("h2", { className: "mt-3 max-w-[22ch] font-display text-display-section leading-[1.08] tracking-tightish text-ink", children: heading }),
+    /* @__PURE__ */ jsx5("div", { className: "mt-12 grid gap-8 md:grid-cols-3", children: items.map((item) => /* @__PURE__ */ jsx5(ProblemCard, { ...item }, item.label)) })
+  ] }) });
+}
+function ProblemCard({ label, cost, outcome, body }) {
+  return /* @__PURE__ */ jsxs3("article", { children: [
+    /* @__PURE__ */ jsx5("p", { className: "text-[10.5px] uppercase tracking-[0.16em] text-ink3", children: label }),
+    /* @__PURE__ */ jsx5("p", { className: "mt-3 font-display text-[24px] leading-tight tracking-tightish text-ink", children: cost }),
+    /* @__PURE__ */ jsx5("p", { className: "mt-4 text-body-sm font-medium leading-snug tracking-tightish text-accentDeep", children: outcome }),
+    /* @__PURE__ */ jsx5("p", { className: "mt-3 text-body-sm leading-relaxed text-ink2", children: body })
+  ] });
+}
+
+// src/components/WhatYouGet.tsx
+import { jsx as jsx6, jsxs as jsxs4 } from "react/jsx-runtime";
+function WhatYouGet({ eyebrow, heading, sections }) {
+  if (sections.length === 0) return null;
+  return /* @__PURE__ */ jsx6("section", { className: "border-b border-line", children: /* @__PURE__ */ jsxs4("div", { className: "mx-auto max-w-container px-6 py-16 sm:px-10 sm:py-24", children: [
+    /* @__PURE__ */ jsx6(SectionEyebrow, { children: eyebrow }),
+    /* @__PURE__ */ jsx6("h2", { className: "mt-3 max-w-[22ch] font-display text-display-section leading-[1.08] tracking-tightish text-ink", children: heading }),
+    /* @__PURE__ */ jsx6("ul", { className: "mt-12 grid gap-x-8 gap-y-7 md:grid-cols-2 lg:grid-cols-3", children: sections.map((s) => /* @__PURE__ */ jsxs4("li", { children: [
+      /* @__PURE__ */ jsx6("p", { className: "font-display text-[14px] tracking-tightish text-ink3", children: s.n }),
+      /* @__PURE__ */ jsx6("p", { className: "mt-1.5 text-[15px] font-medium tracking-tightish text-ink", children: s.title }),
+      /* @__PURE__ */ jsx6("p", { className: "mt-1.5 text-[13.5px] leading-relaxed text-ink2", children: s.body })
+    ] }, s.n)) })
+  ] }) });
+}
+
+// src/components/HowItWorks.tsx
+import { jsx as jsx7, jsxs as jsxs5 } from "react/jsx-runtime";
+function HowItWorks({
+  eyebrow,
+  heading,
+  steps,
+  stepIllustrations
+}) {
+  if (steps.length === 0) return null;
+  const hasIllustrations = stepIllustrations !== void 0 && stepIllustrations.length === steps.length;
+  return /* @__PURE__ */ jsx7("section", { className: "border-b border-line", children: /* @__PURE__ */ jsxs5("div", { className: "mx-auto max-w-container px-6 py-16 sm:px-10 sm:py-24", children: [
+    /* @__PURE__ */ jsx7(SectionEyebrow, { children: eyebrow }),
+    /* @__PURE__ */ jsx7("h2", { className: "mt-3 max-w-[22ch] font-display text-display-section leading-[1.08] tracking-tightish text-ink", children: heading }),
+    /* @__PURE__ */ jsx7(
+      "ol",
+      {
+        itemScope: true,
+        itemType: "https://schema.org/HowTo",
+        className: "mt-12 grid gap-10 md:grid-cols-3",
+        children: steps.map((s, i) => /* @__PURE__ */ jsx7(
+          Step,
+          {
+            ...s,
+            illustration: hasIllustrations ? stepIllustrations[i] : void 0
+          },
+          s.n
+        ))
+      }
+    )
+  ] }) });
+}
+function Step({
+  n,
+  title,
+  body,
+  illustration: Illustration
+}) {
+  return /* @__PURE__ */ jsxs5(
+    "li",
+    {
+      itemScope: true,
+      itemType: "https://schema.org/HowToStep",
+      className: Illustration ? "flex flex-col" : void 0,
+      children: [
+        Illustration && /* @__PURE__ */ jsx7("div", { className: "mb-6 w-full lg:max-w-[320px]", children: /* @__PURE__ */ jsx7(Illustration, {}) }),
+        /* @__PURE__ */ jsxs5("div", { className: Illustration ? "mt-auto" : void 0, children: [
+          /* @__PURE__ */ jsx7("p", { className: "font-display text-[36px] leading-none tracking-tighter2 text-ink3/60", children: n }),
+          /* @__PURE__ */ jsx7("p", { className: "mt-4 font-display text-[20px] leading-tight tracking-tightish text-ink", children: title }),
+          /* @__PURE__ */ jsx7("p", { className: "mt-3 text-body-sm leading-relaxed text-ink2", children: body })
+        ] })
+      ]
+    }
+  );
+}
+
+// src/components/Defensibility.tsx
+import { jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
+function Defensibility({
+  eyebrow,
+  heading,
+  columns,
+  caveat
+}) {
+  return /* @__PURE__ */ jsx8("section", { className: "border-b border-line", children: /* @__PURE__ */ jsxs6("div", { className: "mx-auto max-w-container px-6 py-16 sm:px-10 sm:py-24", children: [
+    /* @__PURE__ */ jsx8(SectionEyebrow, { children: eyebrow }),
+    /* @__PURE__ */ jsx8("h2", { className: "mt-3 max-w-[22ch] font-display text-display-section leading-[1.08] tracking-tightish text-ink", children: heading }),
+    /* @__PURE__ */ jsx8("div", { className: "mt-10 grid gap-10 lg:grid-cols-2", children: columns.map((col) => /* @__PURE__ */ jsx8(Column, { ...col }, col.heading)) }),
+    caveat && /* @__PURE__ */ jsx8("p", { className: "mt-12 max-w-[68ch] text-body-xs leading-relaxed text-ink3", children: caveat })
+  ] }) });
+}
+function Column({ heading, bullets }) {
+  return /* @__PURE__ */ jsxs6("div", { children: [
+    /* @__PURE__ */ jsx8("h3", { className: "font-display text-[18px] leading-tight tracking-tightish text-ink", children: heading }),
+    /* @__PURE__ */ jsx8("ul", { className: "mt-4 space-y-3 text-body-sm leading-relaxed text-ink2", children: bullets.map((b, i) => /* @__PURE__ */ jsxs6("li", { className: "flex gap-2.5", children: [
+      /* @__PURE__ */ jsx8("span", { className: "mt-2 h-1 w-1 shrink-0 rounded-full bg-ink3" }),
+      /* @__PURE__ */ jsx8("span", { children: b })
+    ] }, i)) })
+  ] });
+}
+
+// src/components/Pricing.tsx
+import Link2 from "next/link";
+import { ChevronRight as ChevronRight2 } from "lucide-react";
+import { Fragment, jsx as jsx9, jsxs as jsxs7 } from "react/jsx-runtime";
+var GRID_COLS = {
+  1: "max-w-[420px]",
+  2: "max-w-[820px] md:grid-cols-2",
+  3: "max-w-container md:grid-cols-3"
+};
+function Pricing(props) {
+  if ("kind" in props && props.kind === "unit") {
+    return /* @__PURE__ */ jsx9(UnitPricing, { ...props });
+  }
+  return /* @__PURE__ */ jsx9(TieredPricing, { ...props });
+}
+function TieredPricing({
+  eyebrow,
+  heading,
+  tiers,
+  footnote
+}) {
+  if (tiers.length === 0) return null;
+  const count = tiers.length === 1 || tiers.length === 2 ? tiers.length : 3;
+  return /* @__PURE__ */ jsx9("section", { className: "border-b border-line bg-surface", children: /* @__PURE__ */ jsxs7("div", { className: "mx-auto max-w-container px-6 py-16 sm:px-10 sm:py-24", children: [
+    /* @__PURE__ */ jsx9(SectionEyebrow, { children: eyebrow }),
+    /* @__PURE__ */ jsx9("h2", { className: "mt-3 max-w-[22ch] font-display text-display-section leading-[1.08] tracking-tightish text-ink", children: heading }),
+    /* @__PURE__ */ jsx9("div", { className: `mt-12 mx-auto grid gap-6 ${GRID_COLS[count]}`, children: tiers.map((t) => /* @__PURE__ */ jsx9(PriceCard, { ...t }, t.tier)) }),
+    footnote && /* @__PURE__ */ jsx9("p", { className: "mt-10 max-w-[64ch] text-[13px] text-ink3", children: footnote })
+  ] }) });
+}
+function formatPerUnit(perUnit, currency) {
+  const isWhole = Number.isInteger(perUnit);
+  return new Intl.NumberFormat("en-US", {
+    style: "currency",
+    currency: currency.toUpperCase(),
+    minimumFractionDigits: isWhole ? 0 : 2,
+    maximumFractionDigits: 2
+  }).format(perUnit);
+}
+function UnitPricing({
+  eyebrow,
+  heading,
+  footnote,
+  currency,
+  perUnit,
+  billingCadence
+}) {
+  const formatted = formatPerUnit(perUnit, currency);
+  return /* @__PURE__ */ jsx9("section", { className: "border-b border-line bg-surface", children: /* @__PURE__ */ jsxs7("div", { className: "mx-auto max-w-container px-6 py-16 sm:px-10 sm:py-24", children: [
+    /* @__PURE__ */ jsx9(SectionEyebrow, { children: eyebrow }),
+    /* @__PURE__ */ jsx9("h2", { className: "mt-3 max-w-[22ch] font-display text-display-section leading-[1.08] tracking-tightish text-ink", children: heading }),
+    /* @__PURE__ */ jsx9("div", { className: "mt-12 mx-auto max-w-[420px]", children: /* @__PURE__ */ jsxs7(
+      "article",
+      {
+        itemScope: true,
+        itemType: "https://schema.org/Offer",
+        "data-pricing-kind": "unit",
+        className: "flex flex-col rounded-card border border-line bg-paper p-7",
+        children: [
+          /* @__PURE__ */ jsx9("p", { className: "text-[10.5px] uppercase tracking-[0.16em] text-ink3", children: "Per call" }),
+          /* @__PURE__ */ jsxs7("p", { className: "mt-3 flex items-baseline gap-2", children: [
+            /* @__PURE__ */ jsx9("span", { className: "font-display text-[40px] leading-none tracking-tighter2 text-ink", children: formatted }),
+            /* @__PURE__ */ jsx9("span", { className: "text-[12px] text-ink3", children: billingCadence })
+          ] })
+        ]
+      }
+    ) }),
+    footnote && /* @__PURE__ */ jsx9("p", { className: "mt-10 max-w-[64ch] text-[13px] text-ink3", children: footnote })
+  ] }) });
+}
+function splitPrice(price) {
+  const i = price.indexOf("/");
+  if (i === -1) return { core: price, suffix: null };
+  return { core: price.slice(0, i).trim(), suffix: price.slice(i) };
+}
+function resolvePriceSuffix(price, override) {
+  if (override !== void 0) return override;
+  const { suffix } = splitPrice(price);
+  return suffix ?? "/ report";
+}
+function PriceCard({
+  tierKey,
+  tier,
+  price,
+  priceSuffix,
+  audience,
+  features,
+  featured,
+  cta
+}) {
+  const isMailto = cta.href.startsWith("mailto:");
+  const { core } = splitPrice(price);
+  const suffix = resolvePriceSuffix(price, priceSuffix);
+  return /* @__PURE__ */ jsxs7(
+    "article",
+    {
+      itemScope: true,
+      itemType: "https://schema.org/Offer",
+      "data-tier-key": tierKey,
+      className: "flex flex-col rounded-card border bg-paper p-7 " + (featured ? "border-accent shadow-lift" : "border-line"),
+      children: [
+        /* @__PURE__ */ jsx9("p", { className: "text-[10.5px] uppercase tracking-[0.16em] text-ink3", children: tier }),
+        /* @__PURE__ */ jsxs7("p", { className: "mt-3 flex items-baseline gap-2", children: [
+          /* @__PURE__ */ jsx9("span", { className: "font-display text-[40px] leading-none tracking-tighter2 text-ink", children: core }),
+          suffix && /* @__PURE__ */ jsx9("span", { className: "text-[12px] text-ink3", children: suffix })
+        ] }),
+        /* @__PURE__ */ jsx9("p", { className: "mt-2 text-[13px] text-ink2", children: audience }),
+        /* @__PURE__ */ jsx9("ul", { className: "mt-6 flex-1 space-y-2.5 text-[13.5px] text-ink2", children: features.map((f) => /* @__PURE__ */ jsxs7("li", { className: "flex gap-2.5", children: [
+          /* @__PURE__ */ jsx9(
+            "span",
+            {
+              className: "mt-2 h-1 w-1 shrink-0 rounded-full " + (featured ? "bg-accent" : "bg-ink3")
+            }
+          ),
+          /* @__PURE__ */ jsx9("span", { children: f })
+        ] }, f)) }),
+        /* @__PURE__ */ jsx9(
+          PriceCardCta,
+          {
+            label: cta.label,
+            href: cta.href,
+            featured,
+            external: isMailto
+          }
+        )
+      ]
+    }
+  );
+}
+function PriceCardCta({
+  label,
+  href,
+  featured,
+  external
+}) {
+  const baseClass = "mt-7 inline-flex w-full items-center justify-center gap-1.5 rounded-cta px-5 py-2.5 text-[13.5px] font-medium tracking-tightish transition-colors";
+  const variantClass = featured ? "bg-cta text-cta-fg hover:bg-cta-hover" : "border border-line2 bg-paper text-ink hover:border-ink hover:text-ink";
+  const className = `${baseClass} ${variantClass}`;
+  const body = /* @__PURE__ */ jsxs7(Fragment, { children: [
+    label,
+    /* @__PURE__ */ jsx9(ChevronRight2, { className: "h-3.5 w-3.5", strokeWidth: 1.7 })
+  ] });
+  if (external) {
+    return /* @__PURE__ */ jsx9("a", { className, href, "data-action": "buy", children: body });
+  }
+  return /* @__PURE__ */ jsx9(Link2, { className, href, "data-action": "buy", children: body });
+}
+
+// src/components/Faq.tsx
+import { jsx as jsx10, jsxs as jsxs8 } from "react/jsx-runtime";
+function Faq({ eyebrow, heading, items }) {
+  if (items.length === 0) return null;
+  return /* @__PURE__ */ jsx10("section", { className: "border-b border-line", children: /* @__PURE__ */ jsxs8("div", { className: "mx-auto max-w-container px-6 py-16 sm:px-10 sm:py-24", children: [
+    /* @__PURE__ */ jsx10(SectionEyebrow, { children: eyebrow }),
+    /* @__PURE__ */ jsx10("h2", { className: "mt-3 max-w-[20ch] font-display text-display-section leading-[1.08] tracking-tightish text-ink", children: heading }),
+    /* @__PURE__ */ jsx10("dl", { className: "mt-12 grid gap-x-12 gap-y-10 md:grid-cols-2", children: items.map((f) => /* @__PURE__ */ jsxs8("div", { itemScope: true, itemType: "https://schema.org/Question", children: [
+      /* @__PURE__ */ jsx10("dt", { className: "font-display text-body leading-snug tracking-tightish text-ink", children: f.q }),
+      /* @__PURE__ */ jsx10("dd", { className: "mt-2 text-body-sm leading-relaxed text-ink2", children: f.a })
+    ] }, f.q)) })
+  ] }) });
+}
+
+// src/components/FinalCta.tsx
+import Link3 from "next/link";
+import { ChevronRight as ChevronRight3 } from "lucide-react";
+import { Fragment as Fragment2, jsx as jsx11, jsxs as jsxs9 } from "react/jsx-runtime";
+function FinalCta({
+  eyebrow,
+  headline,
+  primary,
+  secondary
+}) {
+  return /* @__PURE__ */ jsx11("section", { children: /* @__PURE__ */ jsxs9("div", { className: "mx-auto max-w-container px-6 py-20 text-center sm:px-10 sm:py-32", children: [
+    /* @__PURE__ */ jsx11("p", { className: "text-[11px] uppercase tracking-[0.18em] text-ink3", children: eyebrow }),
+    /* @__PURE__ */ jsx11("h2", { className: "mx-auto mt-4 max-w-[22ch] font-display text-[36px] leading-[1.04] tracking-tighter2 text-ink sm:text-[52px]", children: headline }),
+    /* @__PURE__ */ jsxs9("div", { className: "mt-10 flex flex-col items-stretch gap-4 sm:flex-row sm:flex-wrap sm:items-center sm:justify-center", children: [
+      /* @__PURE__ */ jsx11(PrimaryButton, { action: primary }),
+      secondary && /* @__PURE__ */ jsx11(SecondaryLink, { action: secondary })
+    ] })
+  ] }) });
+}
+function PrimaryButton({ action }) {
+  const className = "inline-flex w-full items-center justify-center gap-1.5 rounded-cta bg-cta px-6 py-3 text-[14px] font-medium tracking-tightish text-cta-fg transition-colors hover:bg-cta-hover sm:w-auto";
+  const body = /* @__PURE__ */ jsxs9(Fragment2, { children: [
+    action.label,
+    /* @__PURE__ */ jsx11(ChevronRight3, { className: "h-4 w-4", strokeWidth: 1.7 })
+  ] });
+  if (action.external) {
+    return /* @__PURE__ */ jsx11(
+      "a",
+      {
+        href: action.href,
+        target: "_blank",
+        rel: "noopener noreferrer",
+        className,
+        children: body
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx11(Link3, { href: action.href, className, children: body });
+}
+function SecondaryLink({ action }) {
+  const className = "inline-flex items-center justify-center gap-1.5 text-[13px] font-medium tracking-tightish text-ink3 transition-colors hover:text-ink";
+  if (action.external) {
+    return /* @__PURE__ */ jsx11(
+      "a",
+      {
+        href: action.href,
+        target: "_blank",
+        rel: "noopener noreferrer",
+        className,
+        children: action.label
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx11(Link3, { href: action.href, className, children: action.label });
+}
+
+// src/components/Masthead.tsx
+import Link4 from "next/link";
+import { Fragment as Fragment3, jsx as jsx12, jsxs as jsxs10 } from "react/jsx-runtime";
+function Masthead({ brand, cta, eyebrow, narrow }) {
+  return /* @__PURE__ */ jsx12("header", { className: "border-b border-line", children: /* @__PURE__ */ jsxs10(
+    "div",
+    {
+      className: "mx-auto flex items-center justify-between gap-4 px-6 py-5 sm:px-10 " + (narrow ? "max-w-[900px]" : "max-w-container"),
+      children: [
+        /* @__PURE__ */ jsxs10("div", { className: "flex items-center gap-3", children: [
+          /* @__PURE__ */ jsx12(
+            Link4,
+            {
+              href: brand.href,
+              className: "font-display text-[18px] tracking-tightish text-ink",
+              children: brand.primary
+            }
+          ),
+          brand.secondary && /* @__PURE__ */ jsxs10(Fragment3, { children: [
+            /* @__PURE__ */ jsx12("span", { className: "hidden h-4 w-px bg-line2 sm:inline-block" }),
+            /* @__PURE__ */ jsx12("span", { className: "hidden text-[11px] uppercase tracking-[0.18em] text-ink3 sm:inline", children: brand.secondary })
+          ] })
+        ] }),
+        cta ? /* @__PURE__ */ jsx12(
+          Link4,
+          {
+            href: cta.href,
+            className: "rounded-cta bg-cta px-4 py-2 text-[12px] font-medium tracking-tightish text-cta-fg transition-colors hover:bg-cta-hover",
+            children: cta.label
+          }
+        ) : eyebrow ? /* @__PURE__ */ jsx12("span", { className: "text-[10.5px] uppercase tracking-[0.18em] text-ink3", children: eyebrow }) : null
+      ]
+    }
+  ) });
+}
+
+// src/components/Footer.tsx
+import Link5 from "next/link";
+import { jsx as jsx13, jsxs as jsxs11 } from "react/jsx-runtime";
+function Footer({ text, links }) {
+  return /* @__PURE__ */ jsx13("footer", { className: "border-t border-line", children: /* @__PURE__ */ jsxs11("div", { className: "mx-auto flex max-w-container flex-col items-center gap-4 px-6 py-10 text-center text-[12px] text-ink3 sm:flex-row sm:justify-between sm:px-10 sm:text-left", children: [
+    /* @__PURE__ */ jsx13("p", { children: text }),
+    links && links.length > 0 && /* @__PURE__ */ jsx13("ul", { className: "flex flex-wrap items-center justify-center gap-x-5 gap-y-2 sm:justify-end", children: links.map((l) => /* @__PURE__ */ jsx13("li", { children: /* @__PURE__ */ jsx13(
+      Link5,
+      {
+        href: l.href,
+        className: "text-ink3 no-underline transition-colors hover:text-ink",
+        children: l.label
+      }
+    ) }, l.href)) })
+  ] }) });
+}
+
+// src/components/ScrollHeader.tsx
+import { useEffect, useState } from "react";
+import { jsx as jsx14 } from "react/jsx-runtime";
+function ScrollHeader({
+  threshold = 480,
+  ...mastheadProps
+}) {
+  const [visible, setVisible] = useState(false);
+  useEffect(() => {
+    let raf = 0;
+    const update = () => {
+      raf = 0;
+      setVisible(window.scrollY > threshold);
+    };
+    const onScroll = () => {
+      if (raf) return;
+      raf = requestAnimationFrame(update);
+    };
+    update();
+    window.addEventListener("scroll", onScroll, { passive: true });
+    return () => {
+      window.removeEventListener("scroll", onScroll);
+      if (raf) cancelAnimationFrame(raf);
+    };
+  }, [threshold]);
+  return /* @__PURE__ */ jsx14(
+    "div",
+    {
+      "aria-hidden": !visible,
+      className: "pointer-events-none fixed inset-x-0 top-0 z-40 transition-[transform,opacity] duration-[220ms] ease-out-quart " + (visible ? "translate-y-0 opacity-100" : "-translate-y-full opacity-0"),
+      children: /* @__PURE__ */ jsx14("div", { className: "pointer-events-auto bg-paper shadow-sheet", children: /* @__PURE__ */ jsx14(Masthead, { ...mastheadProps }) })
+    }
+  );
+}
+export {
+  Defensibility,
+  Faq,
+  FinalCta,
+  Footer,
+  Hero,
+  HeroSplit,
+  HeroStacked,
+  HowItWorks,
+  Masthead,
+  Pricing,
+  PrimaryAction,
+  Problem,
+  Pricing as ReportPricing,
+  ScrollHeader,
+  SecondaryAction,
+  Hero as ServiceHero,
+  WhatYouGet
+};
+//# sourceMappingURL=index.js.map