@riligar/components-kit 1.0.1 → 1.1.1

package/dist/index.esm.js

@@ -1,11 +1,9 @@
-import { createTheme, Stack, Text, Title, Center, Box, Button, Container, Paper, Group, SimpleGrid, Image, List, ThemeIcon, Grid, Badge, Code, RingProgress, Divider, SegmentedControl, Accordion, Avatar, Anchor, ActionIcon } from '@mantine/core';
-import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
-import { useWindowScroll } from '@mantine/hooks';
-import { IconCheck, IconBolt, IconQuote, IconCircleCheck } from '@tabler/icons-react';
-import { Fragment as Fragment$1 } from 'react';
-
-// RiLiGar Design System Theme — same as console
-const theme = createTheme({
+import { createTheme as q, Stack as p, Text as c, Title as ee, Center as v, Box as m, Button as H, Container as G, Paper as x, Group as f, SimpleGrid as S, Image as O, List as R, ThemeIcon as I, Grid as b, Badge as k, Code as re, RingProgress as le, Divider as _, SegmentedControl as ie, Accordion as z, Avatar as ne } from "@mantine/core";
+import { jsxs as n, jsx as e, Fragment as K } from "react/jsx-runtime";
+import { useWindowScroll as ae } from "@mantine/hooks";
+import { IconCheck as L, IconBolt as U, IconQuote as te, IconCircleCheck as ce } from "@tabler/icons-react";
+import { Fragment as oe } from "react";
+const Te = q({
   fontFamily: 'Montserrat, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif',
   headings: {
     fontFamily: 'Montserrat, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif',
@@ -13,33 +11,34 @@ const theme = createTheme({
   },
   colors: {
     // RiLiGar Monochrome Palette - Zen Optimized
-    gray: ["#FFFFFF",
-    // 0: App Base (Pure White)
-    "#F9FAFB",
-    // 1: Hover / Secondary Background
-    "#F3F4F6",
-    // 2: Border Standard
-    "#E5E7EB",
-    // 3: Disabled / Muted Border
-    "#9CA3AF",
-    // 4: Quaternary Text
-    "#6B7280",
-    // 5: Tertiary Text (Labels)
-    "#4B5563",
-    // 6: Secondary Text
-    "#374151",
-    // 7: Secondary Text Dark
-    "#1F2937",
-    // 8: Primary Text Dark
-    "#11181C" // 9: Primary Text (RiLiGar Absolute)
+    gray: [
+      "#FFFFFF",
+      // 0: App Base (Pure White)
+      "#F9FAFB",
+      // 1: Hover / Secondary Background
+      "#F3F4F6",
+      // 2: Border Standard
+      "#E5E7EB",
+      // 3: Disabled / Muted Border
+      "#9CA3AF",
+      // 4: Quaternary Text
+      "#6B7280",
+      // 5: Tertiary Text (Labels)
+      "#4B5563",
+      // 6: Secondary Text
+      "#374151",
+      // 7: Secondary Text Dark
+      "#1F2937",
+      // 8: Primary Text Dark
+      "#11181C"
+      // 9: Primary Text (RiLiGar Absolute)
     ]
   },
   primaryColor: "gray",
   primaryShade: 9,
-  autoContrast: true,
+  autoContrast: !0,
   defaultRadius: "0",
   // Zen prefers sharp or very subtle radius, defaulting to 0 for inputs/buttons
-
   components: {
     Container: {
       defaultProps: {
@@ -50,7 +49,7 @@ const theme = createTheme({
     },
     Paper: {
       defaultProps: {
-        withBorder: true,
+        withBorder: !0,
         shadow: "none",
         radius: "0",
         bg: "white"
@@ -58,7 +57,7 @@ const theme = createTheme({
     },
     Card: {
       defaultProps: {
-        withBorder: false,
+        withBorder: !1,
         // Zen reduces borders
         shadow: "none",
         radius: "0",
@@ -85,7 +84,8 @@ const theme = createTheme({
       defaultProps: {
         size: "lg",
         radius: "0",
-        variant: "unstyled" // Zen Minimalist Inputs
+        variant: "unstyled"
+        // Zen Minimalist Inputs
       },
       styles: {
         input: {
@@ -99,7 +99,8 @@ const theme = createTheme({
       defaultProps: {
         lh: 1.1,
         c: "gray.9",
-        ls: "-0.04em" // Zen Massive Hierarchy
+        ls: "-0.04em"
+        // Zen Massive Hierarchy
       }
     },
     Text: {
@@ -140,1253 +141,878 @@ const theme = createTheme({
     }
   }
 });
-
-function SectionHeader({
-  subtitle,
-  title,
-  titleOrder = 2,
-  titleFz = "var(--fz-section-title)",
-  ta = "left",
-  maw
+function J({
+  subtitle: r,
+  title: t,
+  titleOrder: a = 2,
+  titleFz: l = "var(--fz-section-title)",
+  ta: i = "left",
+  maw: d
 }) {
-  if (!title && !subtitle) return null;
-  return /*#__PURE__*/jsxs(Stack, {
-    gap: "xs",
-    align: ta === "center" ? "center" : "flex-start",
-    ta: ta,
-    children: [subtitle && /*#__PURE__*/jsx(Text, {
-      c: "gray.4",
-      size: "xs",
-      fw: 800,
-      tt: "uppercase",
-      ls: "1.5px",
-      children: subtitle
-    }), title && /*#__PURE__*/jsx(Title, {
-      order: titleOrder,
-      fz: titleFz,
-      maw: maw,
-      children: title
-    })]
-  });
+  return !t && !r ? null : /* @__PURE__ */ n(p, { gap: "xs", align: i === "center" ? "center" : "flex-start", ta: i, children: [
+    r && /* @__PURE__ */ e(c, { c: "gray.4", size: "xs", fw: 800, tt: "uppercase", ls: "1.5px", children: r }),
+    t && /* @__PURE__ */ e(ee, { order: a, fz: l, maw: d, children: t })
+  ] });
 }
-
-function MediaBlock({
-  video,
-  image,
-  width = "100%",
-  alt
-}) {
-  if (video) {
-    return /*#__PURE__*/jsx(Center, {
-      children: /*#__PURE__*/jsx(Box, {
-        component: "video",
-        src: video.src,
-        autoPlay: true,
-        loop: true,
-        muted: true,
-        playsInline: true,
-        "aria-label": alt || "Demonstração em vídeo",
-        w: video.width || width,
-        h: "auto",
-        style: {
-          filter: video.filter || "none"
-        }
-      })
-    });
-  }
-  if (image) {
-    return /*#__PURE__*/jsx(Center, {
-      children: /*#__PURE__*/jsx(Box, {
-        component: "img",
-        src: image,
-        alt: alt || "",
-        w: width,
-        h: "auto"
-      })
-    });
-  }
-  return null;
+function X({ video: r, image: t, width: a = "100%", alt: l }) {
+  return r ? /* @__PURE__ */ e(v, { children: /* @__PURE__ */ e(
+    m,
+    {
+      component: "video",
+      src: r.src,
+      autoPlay: !0,
+      loop: !0,
+      muted: !0,
+      playsInline: !0,
+      "aria-label": l || "Demonstração em vídeo",
+      w: r.width || a,
+      h: "auto",
+      style: { filter: r.filter || "none" }
+    }
+  ) }) : t ? /* @__PURE__ */ e(v, { children: /* @__PURE__ */ e(m, { component: "img", src: t, alt: l || "", w: a, h: "auto" }) }) : null;
 }
-
-function CTAButton({
-  label,
-  href,
-  onClick,
-  icon,
-  size = "lg",
-  variant = "filled",
-  color,
-  target,
-  px,
-  fullWidth,
-  leftSection,
-  ...rest
+function T({
+  label: r,
+  href: t,
+  onClick: a,
+  icon: l,
+  size: i = "lg",
+  variant: d = "filled",
+  color: h,
+  target: o,
+  px: y,
+  fullWidth: s,
+  leftSection: g,
+  ...u
 }) {
-  return /*#__PURE__*/jsx(Button, {
-    size: size,
-    component: href ? "a" : "button",
-    href: href,
-    onClick: onClick,
-    target: target,
-    rightSection: icon,
-    leftSection: leftSection,
-    variant: variant,
-    color: color,
-    px: px,
-    fullWidth: fullWidth,
-    ...rest,
-    children: label
-  });
+  return /* @__PURE__ */ e(
+    H,
+    {
+      size: i,
+      component: t ? "a" : "button",
+      href: t,
+      onClick: a,
+      target: o,
+      rightSection: l,
+      leftSection: g,
+      variant: d,
+      color: h,
+      px: y,
+      fullWidth: s,
+      ...u,
+      children: r
+    }
+  );
 }
-
-function Layout({
-  children,
-  title,
-  subtitle,
-  id,
-  bg = "white",
-  py = {
-    base: 80,
-    md: 120
-  },
-  maw = 800,
-  ta = "left",
-  stackGap = "xl"
+const $ = {
+  white: "white",
+  gray: "gray.0"
+}, D = (r) => $[r] || $.white;
+function F({
+  children: r,
+  title: t,
+  subtitle: a,
+  id: l,
+  background: i = "white",
+  py: d = { base: 80, md: 120 },
+  maw: h = 800,
+  ta: o = "left",
+  stackGap: y = "xl"
 }) {
-  return /*#__PURE__*/jsx(Box, {
-    component: "section",
-    id: id,
-    bg: bg,
-    py: py,
-    style: {
-      overflow: "hidden"
-    },
-    children: /*#__PURE__*/jsx(Container, {
-      size: "lg",
-      children: /*#__PURE__*/jsxs(Stack, {
-        gap: stackGap,
-        children: [/*#__PURE__*/jsx(SectionHeader, {
-          subtitle: subtitle,
-          title: title,
-          ta: ta,
-          maw: maw
-        }), /*#__PURE__*/jsx(Box, {
-          children: children
-        })]
-      })
-    })
-  });
+  const s = D(i);
+  return /* @__PURE__ */ e(
+    m,
+    {
+      component: "section",
+      id: l,
+      bg: s,
+      py: d,
+      style: { overflow: "hidden" },
+      children: /* @__PURE__ */ e(G, { size: "lg", children: /* @__PURE__ */ n(p, { gap: y, children: [
+        /* @__PURE__ */ e(J, { subtitle: a, title: t, ta: o, maw: h }),
+        /* @__PURE__ */ e(m, { children: r })
+      ] }) })
+    }
+  );
 }
-
-function Header({
-  logo,
-  navLinks = [],
-  loginCta,
-  signupCta
+function se({
+  logo: r,
+  navLinks: t = [],
+  loginCta: a,
+  signupCta: l,
+  background: i = "white"
 }) {
-  const [scroll] = useWindowScroll();
-  const scrolled = scroll.y > 10;
-  const handleNavClick = target => {
-    if (target === "top") {
-      window.scrollTo({
-        top: 0,
-        behavior: "smooth"
-      });
-    } else {
-      document.getElementById(target)?.scrollIntoView({
-        behavior: "smooth"
-      });
-    }
+  const d = D(i), [h] = ae(), o = h.y > 10, y = (g) => {
+    g === "top" ? window.scrollTo({ top: 0, behavior: "smooth" }) : document.getElementById(g)?.scrollIntoView({ behavior: "smooth" });
+  }, s = (g, u) => {
+    (g.key === "Enter" || g.key === " ") && (g.preventDefault(), y(u));
   };
-  const handleNavKeyDown = (e, target) => {
-    if (e.key === "Enter" || e.key === " ") {
-      e.preventDefault();
-      handleNavClick(target);
+  return /* @__PURE__ */ e(
+    m,
+    {
+      component: "header",
+      pos: "sticky",
+      top: 0,
+      w: "100%",
+      style: { zIndex: 100, pointerEvents: "none" },
+      children: /* @__PURE__ */ e(G, { size: "xl", py: "md", children: /* @__PURE__ */ e(
+        x,
+        {
+          shadow: o ? "sm" : "none",
+          radius: "0",
+          p: "xs",
+          bg: d,
+          bd: o ? "1px solid var(--mantine-color-gray-2)" : "1px solid transparent",
+          style: { pointerEvents: "auto", transition: "all 0.2s ease" },
+          children: /* @__PURE__ */ n(
+            f,
+            {
+              justify: "space-between",
+              align: "center",
+              px: { base: "xs", sm: "md" },
+              children: [
+                r && /* @__PURE__ */ e(
+                  "a",
+                  {
+                    href: "#",
+                    "aria-label": "Voltar ao topo",
+                    onClick: (g) => {
+                      g.preventDefault(), window.scrollTo({ top: 0, behavior: "smooth" });
+                    },
+                    style: { display: "inline-flex" },
+                    children: /* @__PURE__ */ e(
+                      "img",
+                      {
+                        src: r.src,
+                        alt: r.alt || "",
+                        height: r.height || 32,
+                        style: { objectFit: "contain" }
+                      }
+                    )
+                  }
+                ),
+                t.length > 0 && /* @__PURE__ */ e(
+                  f,
+                  {
+                    gap: "xl",
+                    visibleFrom: "sm",
+                    component: "nav",
+                    role: "navigation",
+                    "aria-label": "Menu principal",
+                    children: t.map((g) => /* @__PURE__ */ e(
+                      c,
+                      {
+                        size: "sm",
+                        fw: 900,
+                        tt: "uppercase",
+                        ls: "1px",
+                        c: "dark",
+                        role: "link",
+                        tabIndex: 0,
+                        style: { cursor: "pointer" },
+                        onClick: () => y(g.target),
+                        onKeyDown: (u) => s(u, g.target),
+                        children: g.label
+                      },
+                      g.label
+                    ))
+                  }
+                ),
+                /* @__PURE__ */ n(f, { gap: "sm", children: [
+                  a && /* @__PURE__ */ e(
+                    H,
+                    {
+                      variant: "subtle",
+                      component: a.href ? "a" : "button",
+                      href: a.href,
+                      onClick: a.onClick,
+                      c: "gray.7",
+                      size: "sm",
+                      radius: "0",
+                      visibleFrom: "xs",
+                      fw: 900,
+                      children: a.label
+                    }
+                  ),
+                  l && /* @__PURE__ */ n(
+                    H,
+                    {
+                      component: l.href ? "a" : "button",
+                      href: l.href,
+                      onClick: l.onClick,
+                      size: "sm",
+                      radius: "0",
+                      color: "dark",
+                      variant: "filled",
+                      children: [
+                        /* @__PURE__ */ e(c, { span: !0, visibleFrom: "sm", c: "white", fw: 900, size: "sm", children: l.label }),
+                        /* @__PURE__ */ e(c, { span: !0, hiddenFrom: "sm", c: "white", fw: 900, size: "xs", children: l.labelMobile || l.label })
+                      ]
+                    }
+                  )
+                ] })
+              ]
+            }
+          )
+        }
+      ) })
     }
-  };
-  return /*#__PURE__*/jsx(Box, {
-    component: "header",
-    pos: "sticky",
-    top: 0,
-    w: "100%",
-    style: {
-      zIndex: 100,
-      pointerEvents: "none"
-    },
-    children: /*#__PURE__*/jsx(Container, {
-      size: "xl",
-      py: "md",
-      children: /*#__PURE__*/jsx(Paper, {
-        shadow: scrolled ? "sm" : "none",
-        radius: "0",
-        p: "xs",
-        bg: "white",
-        bd: scrolled ? "1px solid var(--mantine-color-gray-2)" : "1px solid transparent",
-        style: {
-          pointerEvents: "auto",
-          transition: "all 0.2s ease"
-        },
-        children: /*#__PURE__*/jsxs(Group, {
-          justify: "space-between",
-          align: "center",
-          px: {
-            base: "xs",
-            sm: "md"
-          },
-          children: [logo && /*#__PURE__*/jsx("a", {
-            href: "#",
-            "aria-label": "Voltar ao topo",
-            onClick: e => {
-              e.preventDefault();
-              window.scrollTo({
-                top: 0,
-                behavior: "smooth"
-              });
-            },
-            style: {
-              display: "inline-flex"
-            },
-            children: /*#__PURE__*/jsx("img", {
-              src: logo.src,
-              alt: logo.alt || "",
-              height: logo.height || 32,
-              style: {
-                objectFit: "contain"
-              }
-            })
-          }), navLinks.length > 0 && /*#__PURE__*/jsx(Group, {
-            gap: "xl",
-            visibleFrom: "sm",
-            component: "nav",
-            role: "navigation",
-            "aria-label": "Menu principal",
-            children: navLinks.map(link => /*#__PURE__*/jsx(Text, {
-              size: "sm",
-              fw: 900,
-              tt: "uppercase",
-              ls: "1px",
-              c: "dark",
-              role: "link",
-              tabIndex: 0,
-              style: {
-                cursor: "pointer"
-              },
-              onClick: () => handleNavClick(link.target),
-              onKeyDown: e => handleNavKeyDown(e, link.target),
-              children: link.label
-            }, link.label))
-          }), /*#__PURE__*/jsxs(Group, {
-            gap: "sm",
-            children: [loginCta && /*#__PURE__*/jsx(Button, {
-              variant: "subtle",
-              component: loginCta.href ? "a" : "button",
-              href: loginCta.href,
-              onClick: loginCta.onClick,
-              c: "gray.7",
-              size: "sm",
-              radius: "0",
-              visibleFrom: "xs",
-              fw: 900,
-              children: loginCta.label
-            }), signupCta && /*#__PURE__*/jsxs(Button, {
-              component: signupCta.href ? "a" : "button",
-              href: signupCta.href,
-              onClick: signupCta.onClick,
-              size: "sm",
-              radius: "0",
-              color: "dark",
-              variant: "filled",
-              children: [/*#__PURE__*/jsx(Text, {
-                span: true,
-                visibleFrom: "sm",
-                c: "white",
-                fw: 900,
-                size: "sm",
-                children: signupCta.label
-              }), /*#__PURE__*/jsx(Text, {
-                span: true,
-                hiddenFrom: "sm",
-                c: "white",
-                fw: 900,
-                size: "xs",
-                children: signupCta.labelMobile || signupCta.label
-              })]
-            })]
-          })]
-        })
-      })
-    })
-  });
+  );
 }
-
-/** @deprecated Use Header instead */
-const Navbar = Header;
-
-function Hero({
-  subtitle,
-  title,
-  description,
-  cta,
-  video,
-  image
+const Be = se;
+function Pe({
+  subtitle: r,
+  title: t,
+  description: a,
+  cta: l,
+  video: i,
+  image: d,
+  background: h = "white"
 }) {
-  return /*#__PURE__*/jsx(Box, {
-    py: {
-      base: 80,
-      sm: 100,
-      md: 140
-    },
-    id: "hero",
-    bg: "white",
-    children: /*#__PURE__*/jsx(Container, {
-      size: "lg",
-      children: /*#__PURE__*/jsxs(SimpleGrid, {
-        cols: {
-          base: 1,
-          md: 2
-        },
-        spacing: {
-          base: 60,
-          md: 100
-        },
-        verticalSpacing: 60,
-        children: [/*#__PURE__*/jsxs(Stack, {
-          align: {
-            base: "center",
-            md: "flex-start"
-          },
-          justify: "center",
-          gap: {
-            base: 32,
-            md: 48
-          },
-          ta: {
-            base: "center",
-            md: "left"
-          },
-          children: [/*#__PURE__*/jsx(SectionHeader, {
-            subtitle: subtitle,
-            title: title,
-            titleOrder: 1,
-            titleFz: "var(--fz-hero)",
-            ta: "inherit"
-          }), description && /*#__PURE__*/jsx(Center, {
-            children: /*#__PURE__*/jsx(Text, {
-              size: "xl",
-              c: "gray.6",
-              lh: 1.6,
-              maw: 600,
-              children: description
-            })
-          }), cta && /*#__PURE__*/jsx(Center, {
-            children: /*#__PURE__*/jsx(Group, {
-              gap: "md",
-              justify: {
-                base: "center",
-                md: "flex-start"
-              },
-              children: /*#__PURE__*/jsx(CTAButton, {
-                label: cta.label,
-                href: cta.href,
-                icon: cta.icon,
-                size: cta.size || "xl",
-                px: cta.px || 48,
-                variant: cta.variant,
-                color: cta.color
-              })
-            })
-          })]
-        }), /*#__PURE__*/jsx(MediaBlock, {
-          video: video,
-          image: image,
-          alt: "Demonstra\xE7\xE3o do produto"
-        })]
-      })
-    })
-  });
+  const o = D(h);
+  return /* @__PURE__ */ e(m, { py: { base: 80, sm: 100, md: 140 }, id: "hero", bg: o, children: /* @__PURE__ */ e(G, { size: "lg", children: /* @__PURE__ */ n(
+    S,
+    {
+      cols: { base: 1, md: 2 },
+      spacing: { base: 60, md: 100 },
+      verticalSpacing: 60,
+      children: [
+        /* @__PURE__ */ n(
+          p,
+          {
+            align: { base: "center", md: "flex-start" },
+            justify: "center",
+            gap: { base: 32, md: 48 },
+            ta: { base: "center", md: "left" },
+            children: [
+              /* @__PURE__ */ e(
+                J,
+                {
+                  subtitle: r,
+                  title: t,
+                  titleOrder: 1,
+                  titleFz: "var(--fz-hero)",
+                  ta: "inherit"
+                }
+              ),
+              a && /* @__PURE__ */ e(v, { children: /* @__PURE__ */ e(c, { size: "xl", c: "gray.6", lh: 1.6, maw: 600, children: a }) }),
+              l && /* @__PURE__ */ e(v, { children: /* @__PURE__ */ e(f, { gap: "md", justify: { base: "center", md: "flex-start" }, children: /* @__PURE__ */ e(
+                T,
+                {
+                  label: l.label,
+                  href: l.href,
+                  icon: l.icon,
+                  size: l.size || "xl",
+                  px: l.px || 48,
+                  variant: l.variant,
+                  color: l.color
+                }
+              ) }) })
+            ]
+          }
+        ),
+        /* @__PURE__ */ e(
+          X,
+          {
+            video: i,
+            image: d,
+            alt: "Demonstração do produto"
+          }
+        )
+      ]
+    }
+  ) }) });
 }
-
-function LogoItem({
-  logo,
-  index
-}) {
-  const imageProps = {
-    src: logo.src,
-    alt: logo.alt || `Logo ${index}`,
-    h: logo.height || 50,
+function de({ logo: r, index: t }) {
+  const a = {
+    src: r.src,
+    alt: r.alt || `Logo ${t}`,
+    h: r.height || 50,
     w: "auto",
     style: {
       filter: "grayscale(1) opacity(0.4)",
       transition: "filter 0.3s ease, opacity 0.3s ease",
-      ...logo.style
+      ...r.style
     },
-    onMouseEnter: e => {
-      e.currentTarget.style.filter = "grayscale(0) opacity(0.8)";
+    onMouseEnter: (l) => {
+      l.currentTarget.style.filter = "grayscale(0) opacity(0.8)";
     },
-    onMouseLeave: e => {
-      e.currentTarget.style.filter = "grayscale(1) opacity(0.4)";
+    onMouseLeave: (l) => {
+      l.currentTarget.style.filter = "grayscale(1) opacity(0.4)";
     }
   };
-  if (logo.url) {
-    return /*#__PURE__*/jsx(Center, {
-      children: /*#__PURE__*/jsx("a", {
-        href: logo.url,
-        target: "_blank",
-        rel: "noopener noreferrer",
-        children: /*#__PURE__*/jsx(Image, {
-          ...imageProps
-        })
-      })
-    });
-  }
-  return /*#__PURE__*/jsx(Center, {
-    children: /*#__PURE__*/jsx(Image, {
-      ...imageProps
-    })
-  });
+  return r.url ? /* @__PURE__ */ e(v, { children: /* @__PURE__ */ e("a", { href: r.url, target: "_blank", rel: "noopener noreferrer", children: /* @__PURE__ */ e(O, { ...a }) }) }) : /* @__PURE__ */ e(v, { children: /* @__PURE__ */ e(O, { ...a }) });
 }
-
-/**
- * SocialProof - Logo bar showing partner/client logos.
- *
- * @param {string} id     - Section ID for scroll navigation
- * @param {string} title  - Optional heading text
- * @param {array}  logos  - [{ src, alt, height, url?, style? }]
- */
-function SocialProof({
-  id,
-  title,
-  logos
-}) {
-  if (!logos || logos.length === 0) return null;
-  return /*#__PURE__*/jsx(Box, {
-    component: "section",
-    id: id,
-    py: {
-      base: 40,
-      md: 60
-    },
-    bg: "white",
-    bd: {
-      bottom: "1px solid var(--mantine-color-gray-1)"
-    },
-    children: /*#__PURE__*/jsx(Container, {
-      size: "lg",
-      children: /*#__PURE__*/jsxs(Stack, {
-        align: "center",
-        ta: "center",
-        gap: "xl",
-        children: [title && /*#__PURE__*/jsx(Text, {
-          fw: 500,
-          c: "gray.5",
-          size: "sm",
-          tt: "uppercase",
-          ls: "0.1em",
-          children: title
-        }), /*#__PURE__*/jsx(Group, {
-          justify: "space-between",
-          gap: {
-            base: 40,
-            md: 80
-          },
-          style: {
-            rowGap: 40
-          },
-          w: "100%",
-          children: logos.map((logo, i) => /*#__PURE__*/jsx(LogoItem, {
-            logo: logo,
-            index: i
-          }, i))
-        })]
-      })
-    })
-  });
+function ke({ id: r, title: t, logos: a, background: l = "gray" }) {
+  const i = D(l);
+  return !a || a.length === 0 ? null : /* @__PURE__ */ e(
+    m,
+    {
+      component: "section",
+      id: r,
+      py: { base: 40, md: 60 },
+      bg: i,
+      bd: { bottom: "1px solid var(--mantine-color-gray-1)" },
+      children: /* @__PURE__ */ e(G, { size: "lg", children: /* @__PURE__ */ n(p, { align: "center", ta: "center", gap: "xl", children: [
+        t && /* @__PURE__ */ e(c, { fw: 500, c: "gray.5", size: "sm", tt: "uppercase", ls: "0.1em", children: t }),
+        /* @__PURE__ */ e(
+          f,
+          {
+            justify: "space-between",
+            gap: { base: 40, md: 80 },
+            style: { rowGap: 40 },
+            w: "100%",
+            children: a.map((d, h) => /* @__PURE__ */ e(de, { logo: d, index: h }, h))
+          }
+        )
+      ] }) })
+    }
+  );
 }
-
-function FeatureSplit({
-  id,
-  subtitle,
-  title,
-  description,
-  featuresList,
-  cta,
-  video,
-  image,
-  reverse = false,
-  bg
+function De({
+  id: r,
+  subtitle: t,
+  title: a,
+  description: l,
+  featuresList: i,
+  cta: d,
+  video: h,
+  image: o,
+  reverse: y = !1,
+  background: s = "white"
 }) {
-  const listComponent = featuresList && featuresList.length > 0 && /*#__PURE__*/jsx(List, {
-    spacing: "md",
-    size: "md",
-    center: true,
-    icon: /*#__PURE__*/jsx(ThemeIcon, {
-      color: "gray.2",
-      size: 24,
-      radius: "0",
-      children: /*#__PURE__*/jsx(IconCheck, {
-        size: 14,
-        color: "var(--mantine-color-gray-9)"
-      })
-    }),
-    children: featuresList.map((item, index) => /*#__PURE__*/jsx(List.Item, {
-      children: item
-    }, index))
-  });
-  const contentCol = /*#__PURE__*/jsxs(Stack, {
-    justify: "center",
-    gap: "lg",
-    children: [description && /*#__PURE__*/jsx(Text, {
-      c: "gray.6",
-      size: "xl",
-      lh: 1.6,
-      children: description
-    }), listComponent, cta && /*#__PURE__*/jsx(Group, {
-      mt: "md",
-      children: /*#__PURE__*/jsx(CTAButton, {
-        label: cta.label,
-        href: cta.href,
-        icon: cta.icon,
-        size: cta.size || "lg",
-        variant: cta.variant,
-        color: cta.color
-      })
-    })]
-  });
-  const mediaCol = (video || image) && /*#__PURE__*/jsx(MediaBlock, {
-    video: video,
-    image: image,
-    width: "80%"
-  });
-  return /*#__PURE__*/jsx(Layout, {
-    id: id,
-    subtitle: subtitle,
-    title: title,
-    bg: bg,
-    children: /*#__PURE__*/jsx(SimpleGrid, {
-      cols: {
-        base: 1,
-        md: 2
-      },
-      spacing: {
-        base: 40,
-        md: 80
-      },
-      verticalSpacing: {
-        base: 40,
-        md: 50
-      },
-      children: reverse ? /*#__PURE__*/jsxs(Fragment, {
-        children: [mediaCol, contentCol]
-      }) : /*#__PURE__*/jsxs(Fragment, {
-        children: [contentCol, mediaCol]
-      })
-    })
-  });
+  const g = i && i.length > 0 && /* @__PURE__ */ e(
+    R,
+    {
+      spacing: "md",
+      size: "md",
+      center: !0,
+      icon: /* @__PURE__ */ e(I, { color: "gray.2", size: 24, radius: "0", children: /* @__PURE__ */ e(L, { size: 14, color: "var(--mantine-color-gray-9)" }) }),
+      children: i.map((A, w) => /* @__PURE__ */ e(R.Item, { children: A }, w))
+    }
+  ), u = /* @__PURE__ */ n(p, { justify: "center", gap: "lg", children: [
+    l && /* @__PURE__ */ e(c, { c: "gray.6", size: "xl", lh: 1.6, children: l }),
+    g,
+    d && /* @__PURE__ */ e(f, { mt: "md", children: /* @__PURE__ */ e(
+      T,
+      {
+        label: d.label,
+        href: d.href,
+        icon: d.icon,
+        size: d.size || "lg",
+        variant: d.variant,
+        color: d.color
+      }
+    ) })
+  ] }), B = (h || o) && /* @__PURE__ */ e(X, { video: h, image: o, width: "80%" });
+  return /* @__PURE__ */ e(F, { id: r, subtitle: t, title: a, background: s, children: /* @__PURE__ */ e(
+    S,
+    {
+      cols: { base: 1, md: 2 },
+      spacing: { base: 40, md: 80 },
+      verticalSpacing: { base: 40, md: 50 },
+      children: y ? /* @__PURE__ */ n(K, { children: [
+        B,
+        u
+      ] }) : /* @__PURE__ */ n(K, { children: [
+        u,
+        B
+      ] })
+    }
+  ) });
 }
-
-function FeaturesGrid({
-  id,
-  subtitle,
-  title,
-  bg = "gray.0",
-  items = []
+function Ae({
+  id: r,
+  subtitle: t,
+  title: a,
+  background: l = "gray.0",
+  items: i = []
 }) {
-  return /*#__PURE__*/jsx(Layout, {
-    id: id,
-    subtitle: subtitle,
-    title: title,
-    bg: bg,
-    children: /*#__PURE__*/jsx(Grid, {
-      gutter: "lg",
-      children: items.map((item, idx) => /*#__PURE__*/jsx(FeatureCard, {
-        ...item
-      }, idx))
-    })
-  });
+  return /* @__PURE__ */ e(F, { id: r, subtitle: t, title: a, background: l, children: /* @__PURE__ */ e(b, { gutter: "lg", children: i.map((d, h) => /* @__PURE__ */ e(he, { ...d }, h)) }) });
 }
-function FeatureCard({
-  icon: Icon,
-  iconVariant,
-  iconColor,
-  label,
-  title,
-  titleSize,
-  description,
-  descriptionSize,
-  descriptionMaw,
-  span = {
-    base: 12,
-    md: 6
-  },
-  bg = "white",
-  dark = false,
-  visual,
-  secondaryVisual,
-  layout = "stacked",
-  badges,
-  codeBlock,
-  decorativeContent,
-  style: extraStyle,
-  ...props
+function he({
+  icon: r,
+  iconVariant: t,
+  iconColor: a,
+  label: l,
+  title: i,
+  titleSize: d,
+  description: h,
+  descriptionSize: o,
+  descriptionMaw: y,
+  span: s = { base: 12, md: 6 },
+  bg: g = "white",
+  dark: u = !1,
+  visual: B,
+  secondaryVisual: A,
+  layout: w = "stacked",
+  badges: C,
+  codeBlock: N,
+  decorativeContent: V,
+  style: E,
+  ...M
 }) {
-  const textColor = dark ? "white" : undefined;
-  const descColor = dark ? "gray.4" : "gray.6";
-  const labelColor = "gray.5";
-  const resolvedIconVariant = iconVariant || (dark ? "filled" : "light");
-  const resolvedIconColor = iconColor || (dark ? "gray.7" : "gray");
-  const resolvedTitleSize = titleSize || (layout === "compact" ? "h4" : "h3");
-  const resolvedDescSize = descriptionSize || (layout === "compact" ? "sm" : "lg");
-  const headerContent = /*#__PURE__*/jsxs(Box, {
-    children: [Icon && /*#__PURE__*/jsx(ThemeIcon, {
-      size: 48,
-      radius: "0",
-      variant: resolvedIconVariant,
-      color: resolvedIconColor,
-      mb: "lg",
-      style: dark ? {
-        color: "white"
-      } : undefined,
-      children: /*#__PURE__*/jsx(Icon, {
-        size: 24,
-        stroke: 1.5
-      })
-    }), label && /*#__PURE__*/jsx(Text, {
-      size: "sm",
-      fw: 800,
-      tt: "uppercase",
-      ls: "1.5px",
-      c: labelColor,
-      mb: "xs",
-      children: label
-    }), title && /*#__PURE__*/jsx(Text, {
-      fz: resolvedTitleSize,
-      fw: 900,
-      lh: 1.2,
-      mb: "sm",
-      c: textColor,
-      children: title
-    }), description && /*#__PURE__*/jsx(Text, {
-      c: descColor,
-      size: resolvedDescSize,
-      maw: descriptionMaw,
-      mb: badges ? "xl" : layout === "compact" ? "lg" : undefined,
-      children: description
-    }), badges && badges.length > 0 && /*#__PURE__*/jsx(Group, {
-      children: badges.map((badge, i) => /*#__PURE__*/jsx(Badge, {
-        variant: "dot",
-        color: "gray",
-        radius: "0",
-        children: badge
-      }, i))
-    })]
-  });
-  const visualContent = visual ? renderVisual(visual, dark) : null;
-  const secondaryVisualContent = secondaryVisual ? renderVisual(secondaryVisual, dark) : null;
-
-  // Split layout: text left, visual/code right (via inner Grid)
-  if (layout === "split") {
-    return /*#__PURE__*/jsx(Grid.Col, {
-      span: span,
-      children: /*#__PURE__*/jsx(Paper, {
-        h: "100%",
-        p: {
-          base: "xl",
-          md: 40
-        },
+  const j = /* @__PURE__ */ n(m, { children: [
+    r && /* @__PURE__ */ e(
+      I,
+      {
+        size: 48,
         radius: "0",
-        bg: bg,
-        bd: "1px solid var(--mantine-color-gray-2)",
-        style: extraStyle,
-        ...props,
-        children: /*#__PURE__*/jsxs(Grid, {
-          align: "center",
-          gutter: "xl",
-          children: [/*#__PURE__*/jsx(Grid.Col, {
-            span: {
-              base: 12,
-              sm: 6
-            },
-            children: headerContent
-          }), /*#__PURE__*/jsxs(Grid.Col, {
-            span: {
-              base: 12,
-              sm: 6
-            },
-            children: [visualContent, codeBlock && /*#__PURE__*/jsx(Code, {
-              block: true,
+        variant: t || (u ? "filled" : "light"),
+        color: a || (u ? "gray.7" : "gray"),
+        mb: "lg",
+        style: u ? { color: "white" } : void 0,
+        children: /* @__PURE__ */ e(r, { size: 24, stroke: 1.5 })
+      }
+    ),
+    l && /* @__PURE__ */ e(
+      c,
+      {
+        size: "sm",
+        fw: 800,
+        tt: "uppercase",
+        ls: "1.5px",
+        c: "gray.5",
+        mb: "xs",
+        children: l
+      }
+    ),
+    i && /* @__PURE__ */ e(c, { fz: d || (w === "compact" ? "h4" : "h3"), fw: 900, lh: 1.2, mb: "sm", c: u ? "white" : void 0, children: i }),
+    h && /* @__PURE__ */ e(
+      c,
+      {
+        c: u ? "gray.4" : "gray.6",
+        size: o || (w === "compact" ? "sm" : "lg"),
+        maw: y,
+        mb: C ? "xl" : w === "compact" ? "lg" : void 0,
+        children: h
+      }
+    ),
+    C && C.length > 0 && /* @__PURE__ */ e(f, { children: C.map((Y, Z) => /* @__PURE__ */ e(k, { variant: "dot", color: "gray", radius: "0", children: Y }, Z)) })
+  ] }), P = B ? Q(B, u) : null, W = A ? Q(A, u) : null;
+  return w === "split" ? /* @__PURE__ */ e(b.Col, { span: s, children: /* @__PURE__ */ e(
+    x,
+    {
+      h: "100%",
+      p: { base: "xl", md: 40 },
+      radius: "0",
+      bg: g,
+      bd: "1px solid var(--mantine-color-gray-2)",
+      style: E,
+      ...M,
+      children: /* @__PURE__ */ n(b, { align: "center", gutter: "xl", children: [
+        /* @__PURE__ */ e(b.Col, { span: { base: 12, sm: 6 }, children: j }),
+        /* @__PURE__ */ n(b.Col, { span: { base: 12, sm: 6 }, children: [
+          P,
+          N && /* @__PURE__ */ e(
+            re,
+            {
+              block: !0,
               color: "gray.0",
               c: "gray.7",
-              style: {
-                fontSize: 12,
-                lineHeight: 1.4,
-                borderRadius: 0
-              },
-              children: codeBlock
-            })]
-          })]
-        })
-      })
-    });
-  }
-
-  // Compact layout: simpler card
-  if (layout === "compact") {
-    return /*#__PURE__*/jsx(Grid.Col, {
-      span: span,
-      children: /*#__PURE__*/jsxs(Paper, {
-        h: "100%",
-        p: {
-          base: "xl",
-          md: 40
-        },
-        radius: "0",
-        bg: bg,
-        bd: "1px solid var(--mantine-color-gray-2)",
-        style: extraStyle,
-        ...props,
-        children: [headerContent, visualContent]
-      })
-    });
-  }
-
-  // Stacked layout with decorative content on the side (e.g. device icons)
-  if (decorativeContent) {
-    return /*#__PURE__*/jsx(Grid.Col, {
-      span: span,
-      children: /*#__PURE__*/jsx(Paper, {
-        h: "100%",
-        p: {
-          base: "xl",
-          md: 40
-        },
-        radius: "0",
-        bg: bg,
-        bd: "1px solid var(--mantine-color-gray-2)",
-        pos: "relative",
-        style: extraStyle,
-        ...props,
-        children: /*#__PURE__*/jsxs(Grid, {
-          gutter: 0,
-          pos: "relative",
-          children: [/*#__PURE__*/jsx(Grid.Col, {
-            span: {
-              base: 12,
-              sm: 7
-            },
-            style: {
-              zIndex: 1
-            },
-            children: headerContent
-          }), /*#__PURE__*/jsx(Grid.Col, {
-            span: 5,
-            visibleFrom: "sm",
-            children: decorativeContent
-          })]
-        })
-      })
-    });
-  }
-
-  // Default stacked layout
-  return /*#__PURE__*/jsx(Grid.Col, {
-    span: span,
-    children: /*#__PURE__*/jsxs(Paper, {
+              style: { fontSize: 12, lineHeight: 1.4, borderRadius: 0 },
+              children: N
+            }
+          )
+        ] })
+      ] })
+    }
+  ) }) : w === "compact" ? /* @__PURE__ */ e(b.Col, { span: s, children: /* @__PURE__ */ n(
+    x,
+    {
       h: "100%",
-      p: {
-        base: "xl",
-        md: 40
-      },
+      p: { base: "xl", md: 40 },
+      radius: "0",
+      bg: g,
+      bd: "1px solid var(--mantine-color-gray-2)",
+      style: E,
+      ...M,
+      children: [
+        j,
+        P
+      ]
+    }
+  ) }) : V ? /* @__PURE__ */ e(b.Col, { span: s, children: /* @__PURE__ */ e(
+    x,
+    {
+      h: "100%",
+      p: { base: "xl", md: 40 },
       radius: "0",
-      bg: bg,
+      bg: g,
+      bd: "1px solid var(--mantine-color-gray-2)",
+      pos: "relative",
+      style: E,
+      ...M,
+      children: /* @__PURE__ */ n(b, { gutter: 0, pos: "relative", children: [
+        /* @__PURE__ */ e(b.Col, { span: { base: 12, sm: 7 }, style: { zIndex: 1 }, children: j }),
+        /* @__PURE__ */ e(b.Col, { span: 5, visibleFrom: "sm", children: V })
+      ] })
+    }
+  ) }) : /* @__PURE__ */ e(b.Col, { span: s, children: /* @__PURE__ */ n(
+    x,
+    {
+      h: "100%",
+      p: { base: "xl", md: 40 },
+      radius: "0",
+      bg: g,
       bd: "1px solid var(--mantine-color-gray-2)",
       display: "flex",
       style: {
         flexDirection: "column",
         justifyContent: "space-between",
-        ...extraStyle
+        ...E
       },
-      ...props,
-      children: [headerContent, visualContent && secondaryVisualContent ? /*#__PURE__*/jsxs(Group, {
-        gap: 40,
-        align: "center",
-        children: [visualContent, secondaryVisualContent]
-      }) : visualContent]
-    })
-  });
+      ...M,
+      children: [
+        j,
+        P && W ? /* @__PURE__ */ n(f, { gap: 40, align: "center", children: [
+          P,
+          W
+        ] }) : P
+      ]
+    }
+  ) });
 }
-function renderVisual(visual, dark) {
-  if (!visual) return null;
-  switch (visual.type) {
+function Q(r, t) {
+  if (!r) return null;
+  switch (r.type) {
     case "ring":
-      return /*#__PURE__*/jsx(RingProgress, {
-        size: visual.size || 140,
-        thickness: visual.thickness || 12,
-        sections: [{
-          value: visual.value || 100,
-          color: "gray.9"
-        }],
-        label: /*#__PURE__*/jsx(Center, {
-          children: /*#__PURE__*/jsxs(Stack, {
-            gap: 0,
-            align: "center",
-            children: [/*#__PURE__*/jsx(Text, {
-              fw: 900,
-              size: "xl",
-              lh: 1,
-              children: visual.label
-            }), visual.sublabel && /*#__PURE__*/jsx(Text, {
-              size: "xs",
-              c: "gray.5",
-              fw: 700,
-              children: visual.sublabel
-            })]
-          })
-        })
-      });
+      return /* @__PURE__ */ e(
+        le,
+        {
+          size: r.size || 140,
+          thickness: r.thickness || 12,
+          sections: [{ value: r.value || 100, color: "gray.9" }],
+          label: /* @__PURE__ */ e(v, { children: /* @__PURE__ */ n(p, { gap: 0, align: "center", children: [
+            /* @__PURE__ */ e(c, { fw: 900, size: "xl", lh: 1, children: r.label }),
+            r.sublabel && /* @__PURE__ */ e(c, { size: "xs", c: "gray.5", fw: 700, children: r.sublabel })
+          ] }) })
+        }
+      );
     case "metric":
-      return /*#__PURE__*/jsxs(Stack, {
-        gap: 0,
-        children: [/*#__PURE__*/jsx(Text, {
-          fw: 900,
-          fz: 32,
-          c: "gray.9",
-          lh: 1,
-          children: visual.value
-        }), /*#__PURE__*/jsx(Text, {
-          size: "sm",
-          c: "gray.5",
-          mt: 4,
-          children: visual.label
-        }), visual.badge && /*#__PURE__*/jsx(Badge, {
-          mt: "md",
-          color: "gray",
-          variant: "dot",
-          radius: "0",
-          children: visual.badge
-        })]
-      });
+      return /* @__PURE__ */ n(p, { gap: 0, children: [
+        /* @__PURE__ */ e(c, { fw: 900, fz: 32, c: "gray.9", lh: 1, children: r.value }),
+        /* @__PURE__ */ e(c, { size: "sm", c: "gray.5", mt: 4, children: r.label }),
+        r.badge && /* @__PURE__ */ e(k, { mt: "md", color: "gray", variant: "dot", radius: "0", children: r.badge })
+      ] });
     case "bars":
-      return /*#__PURE__*/jsx(Group, {
-        align: "flex-end",
-        gap: 8,
-        h: visual.height || 100,
-        preventGrowOverflow: false,
-        children: (visual.data || []).map((h, i) => /*#__PURE__*/jsx(Box, {
-          w: 20,
-          h: `${h}%`,
-          bg: i === visual.highlight ? "gray.9" : "gray.2",
-          radius: "0"
-        }, i))
-      });
+      return /* @__PURE__ */ e(
+        f,
+        {
+          align: "flex-end",
+          gap: 8,
+          h: r.height || 100,
+          preventGrowOverflow: !1,
+          children: (r.data || []).map((a, l) => /* @__PURE__ */ e(
+            m,
+            {
+              w: 20,
+              h: `${a}%`,
+              bg: l === r.highlight ? "gray.9" : "gray.2",
+              radius: "0"
+            },
+            l
+          ))
+        }
+      );
     case "typography":
-      return /*#__PURE__*/jsx(Center, {
-        h: visual.height || 160,
-        bg: dark ? "gray.8" : "gray.1",
-        radius: "0",
-        children: /*#__PURE__*/jsx(Text, {
-          fz: visual.fontSize || 100,
-          fw: 900,
-          c: dark ? "gray.6" : "gray.3",
-          style: {
-            letterSpacing: -6
-          },
-          children: visual.text || "Aa"
-        })
-      });
-    case "icon-large":
-      {
-        const LargeIcon = visual.icon;
-        if (!LargeIcon) return null;
-        return /*#__PURE__*/jsx(LargeIcon, {
-          size: visual.size || 64,
-          stroke: visual.stroke || 1,
-          color: visual.color || "var(--mantine-color-gray-2)"
-        });
-      }
+      return /* @__PURE__ */ e(
+        v,
+        {
+          h: r.height || 160,
+          bg: t ? "gray.8" : "gray.1",
+          radius: "0",
+          children: /* @__PURE__ */ e(
+            c,
+            {
+              fz: r.fontSize || 100,
+              fw: 900,
+              c: t ? "gray.6" : "gray.3",
+              style: { letterSpacing: -6 },
+              children: r.text || "Aa"
+            }
+          )
+        }
+      );
+    case "icon-large": {
+      const a = r.icon;
+      return a ? /* @__PURE__ */ e(
+        a,
+        {
+          size: r.size || 64,
+          stroke: r.stroke || 1,
+          color: r.color || "var(--mantine-color-gray-2)"
+        }
+      ) : null;
+    }
     default:
       return null;
   }
 }
-
-function Comparison({
-  id,
-  subtitle,
-  title,
-  traditionalCol,
-  newCol
+function Ce({
+  id: r,
+  subtitle: t,
+  title: a,
+  traditionalCol: l,
+  newCol: i,
+  background: d = "white"
 }) {
-  return /*#__PURE__*/jsx(Layout, {
-    id: id,
-    subtitle: subtitle,
-    title: title,
-    bg: "white",
-    children: /*#__PURE__*/jsx(Paper, {
+  return /* @__PURE__ */ e(F, { id: r, subtitle: t, title: a, background: d, children: /* @__PURE__ */ e(
+    x,
+    {
       radius: "0",
       bd: "1px solid var(--mantine-color-gray-2)",
-      style: {
-        overflow: "hidden"
-      },
-      children: /*#__PURE__*/jsxs(SimpleGrid, {
-        cols: {
-          base: 1,
-          md: 2
-        },
-        spacing: 0,
-        children: [/*#__PURE__*/jsx(Box, {
-          bg: "gray.0",
-          p: {
-            base: 30,
-            md: 60
-          },
-          children: /*#__PURE__*/jsxs(Stack, {
-            gap: "xl",
-            children: [/*#__PURE__*/jsxs(Box, {
-              children: [/*#__PURE__*/jsx(Text, {
-                fw: 900,
-                fz: "h2",
-                c: "gray.9",
-                mb: 4,
-                children: traditionalCol.title
-              }), /*#__PURE__*/jsx(Text, {
-                size: "sm",
-                fw: 800,
-                tt: "uppercase",
-                ls: "1.5px",
-                c: "gray.5",
-                children: traditionalCol.subtitle
-              })]
-            }), /*#__PURE__*/jsx(Stack, {
-              gap: "md",
-              mb: 40,
-              children: traditionalCol.items.map((item, index) => /*#__PURE__*/jsxs(Fragment$1, {
-                children: [/*#__PURE__*/jsxs(Group, {
-                  justify: "space-between",
-                  children: [/*#__PURE__*/jsx(Text, {
-                    size: "sm",
-                    c: "gray.6",
-                    children: item.label
-                  }), /*#__PURE__*/jsx(Text, {
-                    fw: 700,
-                    c: "gray.9",
-                    children: item.value
-                  })]
-                }), index < traditionalCol.items.length - 1 && /*#__PURE__*/jsx(Divider, {
-                  color: "var(--mantine-color-gray-2)"
-                })]
-              }, index))
-            }), /*#__PURE__*/jsxs(Box, {
+      style: { overflow: "hidden" },
+      children: /* @__PURE__ */ n(S, { cols: { base: 1, md: 2 }, spacing: 0, children: [
+        /* @__PURE__ */ e(m, { bg: "gray.0", p: { base: 30, md: 60 }, children: /* @__PURE__ */ n(p, { gap: "xl", children: [
+          /* @__PURE__ */ n(m, { children: [
+            /* @__PURE__ */ e(c, { fw: 900, fz: "h2", c: "gray.9", mb: 4, children: l.title }),
+            /* @__PURE__ */ e(c, { size: "sm", fw: 800, tt: "uppercase", ls: "1.5px", c: "gray.5", children: l.subtitle })
+          ] }),
+          /* @__PURE__ */ e(p, { gap: "md", mb: 40, children: l.items.map((h, o) => /* @__PURE__ */ n(oe, { children: [
+            /* @__PURE__ */ n(f, { justify: "space-between", children: [
+              /* @__PURE__ */ e(c, { size: "sm", c: "gray.6", children: h.label }),
+              /* @__PURE__ */ e(c, { fw: 700, c: "gray.9", children: h.value })
+            ] }),
+            o < l.items.length - 1 && /* @__PURE__ */ e(_, { color: "var(--mantine-color-gray-2)" })
+          ] }, o)) }),
+          /* @__PURE__ */ n(
+            m,
+            {
               bg: "white",
               p: "lg",
               radius: "0",
               bd: "1px solid var(--mantine-color-gray-2)",
-              children: [/*#__PURE__*/jsxs(Group, {
-                justify: "space-between",
-                children: [/*#__PURE__*/jsx(Text, {
-                  fw: 900,
-                  c: "gray.7",
-                  children: traditionalCol.totalLabel || "Total Estimado"
-                }), /*#__PURE__*/jsx(Text, {
-                  fw: 900,
-                  fz: 32,
-                  c: "gray.9",
-                  children: traditionalCol.totalValue
-                })]
-              }), traditionalCol.footerText && /*#__PURE__*/jsx(Text, {
-                size: "xs",
-                c: "red.6",
-                ta: "right",
-                mt: 4,
-                children: traditionalCol.footerText
-              })]
-            })]
-          })
-        }), /*#__PURE__*/jsx(Box, {
-          bg: "white",
-          p: {
-            base: 30,
-            md: 60
-          },
-          pos: "relative",
-          children: /*#__PURE__*/jsxs(Stack, {
-            gap: "xl",
-            h: "100%",
-            children: [/*#__PURE__*/jsxs(Box, {
-              children: [/*#__PURE__*/jsxs(Group, {
-                gap: "xs",
-                children: [/*#__PURE__*/jsx(Text, {
-                  fw: 900,
-                  fz: "h2",
-                  c: "gray.9",
-                  mb: 4,
-                  children: newCol.title
-                }), newCol.badge && /*#__PURE__*/jsx(Badge, {
-                  color: "gray.9",
-                  variant: "filled",
-                  radius: "0",
-                  children: newCol.badge
-                })]
-              }), /*#__PURE__*/jsx(Text, {
-                size: "sm",
-                c: "gray.6",
-                children: newCol.description
-              })]
-            }), /*#__PURE__*/jsx(List, {
+              children: [
+                /* @__PURE__ */ n(f, { justify: "space-between", children: [
+                  /* @__PURE__ */ e(c, { fw: 900, c: "gray.7", children: l.totalLabel || "Total Estimado" }),
+                  /* @__PURE__ */ e(c, { fw: 900, fz: 32, c: "gray.9", children: l.totalValue })
+                ] }),
+                l.footerText && /* @__PURE__ */ e(c, { size: "xs", c: "red.6", ta: "right", mt: 4, children: l.footerText })
+              ]
+            }
+          )
+        ] }) }),
+        /* @__PURE__ */ e(m, { bg: "white", p: { base: 30, md: 60 }, pos: "relative", children: /* @__PURE__ */ n(p, { gap: "xl", h: "100%", children: [
+          /* @__PURE__ */ n(m, { children: [
+            /* @__PURE__ */ n(f, { gap: "xs", children: [
+              /* @__PURE__ */ e(c, { fw: 900, fz: "h2", c: "gray.9", mb: 4, children: i.title }),
+              i.badge && /* @__PURE__ */ e(k, { color: "gray.9", variant: "filled", radius: "0", children: i.badge })
+            ] }),
+            /* @__PURE__ */ e(c, { size: "sm", c: "gray.6", children: i.description })
+          ] }),
+          /* @__PURE__ */ e(
+            R,
+            {
               spacing: "md",
               size: "md",
               c: "gray.6",
-              icon: /*#__PURE__*/jsx(ThemeIcon, {
-                color: "gray.0",
-                size: 20,
-                radius: "0",
-                bd: "1px solid var(--mantine-color-gray-2)",
-                children: /*#__PURE__*/jsx(IconCheck, {
-                  size: 12,
-                  color: "var(--mantine-color-gray-9)"
-                })
-              }),
-              children: newCol.items.map((item, index) => /*#__PURE__*/jsx(List.Item, {
-                children: item
-              }, index))
-            }), newCol.pricingBox && /*#__PURE__*/jsx(Box, {
+              icon: /* @__PURE__ */ e(
+                I,
+                {
+                  color: "gray.0",
+                  size: 20,
+                  radius: "0",
+                  bd: "1px solid var(--mantine-color-gray-2)",
+                  children: /* @__PURE__ */ e(L, { size: 12, color: "var(--mantine-color-gray-9)" })
+                }
+              ),
+              children: i.items.map((h, o) => /* @__PURE__ */ e(R.Item, { children: h }, o))
+            }
+          ),
+          i.pricingBox && /* @__PURE__ */ e(
+            m,
+            {
               bg: "gray.0",
               p: "lg",
               radius: "0",
               bd: "1px solid var(--mantine-color-gray-2)",
-              children: /*#__PURE__*/jsxs(Stack, {
-                gap: 4,
-                children: [/*#__PURE__*/jsx(Text, {
-                  size: "sm",
-                  fw: 800,
-                  tt: "uppercase",
-                  ls: "1.5px",
-                  c: "gray.5",
-                  children: newCol.pricingBox.label
-                }), /*#__PURE__*/jsx(Text, {
-                  fw: 900,
-                  fz: 48,
-                  c: "gray.9",
-                  lh: 1,
-                  children: newCol.pricingBox.price
-                }), newCol.pricingBox.subtext && /*#__PURE__*/jsx(Text, {
-                  size: "xs",
-                  c: "gray.5",
-                  mt: "sm",
-                  children: newCol.pricingBox.subtext
-                })]
-              })
-            }), newCol.cta && /*#__PURE__*/jsx(Box, {
-              mt: "xl",
-              children: /*#__PURE__*/jsx(CTAButton, {
-                label: newCol.cta.label,
-                href: newCol.cta.href,
-                icon: newCol.cta.icon,
-                size: newCol.cta.size || "lg",
-                color: newCol.cta.color || "gray.9",
-                fullWidth: true
-              })
-            })]
-          })
-        })]
-      })
-    })
-  });
+              children: /* @__PURE__ */ n(p, { gap: 4, children: [
+                /* @__PURE__ */ e(
+                  c,
+                  {
+                    size: "sm",
+                    fw: 800,
+                    tt: "uppercase",
+                    ls: "1.5px",
+                    c: "gray.5",
+                    children: i.pricingBox.label
+                  }
+                ),
+                /* @__PURE__ */ e(c, { fw: 900, fz: 48, c: "gray.9", lh: 1, children: i.pricingBox.price }),
+                i.pricingBox.subtext && /* @__PURE__ */ e(c, { size: "xs", c: "gray.5", mt: "sm", children: i.pricingBox.subtext })
+              ] })
+            }
+          ),
+          i.cta && /* @__PURE__ */ e(m, { mt: "xl", children: /* @__PURE__ */ e(
+            T,
+            {
+              label: i.cta.label,
+              href: i.cta.href,
+              icon: i.cta.icon,
+              size: i.cta.size || "lg",
+              color: i.cta.color || "gray.9",
+              fullWidth: !0
+            }
+          ) })
+        ] }) })
+      ] })
+    }
+  ) });
 }
-
-function Pricing({
-  id,
-  subtitle,
-  title,
-  billingOptions = [{
-    label: "Mensal",
-    value: "monthly"
-  }, {
-    label: "Anual",
-    value: "annual"
-  }],
-  billing,
-  setBilling,
-  promoBadge,
-  plans
+function Ee({
+  id: r,
+  subtitle: t,
+  title: a,
+  billingOptions: l = [
+    { label: "Mensal", value: "monthly" },
+    { label: "Anual", value: "annual" }
+  ],
+  billing: i,
+  setBilling: d,
+  promoBadge: h,
+  plans: o,
+  background: y = "white"
 }) {
-  return /*#__PURE__*/jsxs(Layout, {
-    id: id,
-    subtitle: subtitle,
-    title: title,
-    ta: "center",
-    children: [billingOptions && billingOptions.length > 0 && /*#__PURE__*/jsx(Stack, {
-      align: "center",
-      gap: "xl",
-      mb: 80,
-      children: /*#__PURE__*/jsxs(Group, {
-        gap: "xs",
-        children: [/*#__PURE__*/jsx(SegmentedControl, {
-          value: billing,
-          onChange: setBilling,
-          radius: "0",
-          size: "md",
-          data: billingOptions,
-          color: "gray.9",
-          bg: "white",
-          style: {
-            border: "1px solid var(--mantine-color-gray-2)"
-          }
-        }), billing === "annual" && promoBadge && /*#__PURE__*/jsx(Badge, {
-          variant: "filled",
-          color: "gray.9",
-          radius: "0",
-          size: "lg",
-          children: promoBadge
-        })]
-      })
-    }), /*#__PURE__*/jsx(SimpleGrid, {
-      cols: {
-        base: 1,
-        md: plans.length <= 3 ? plans.length : 3
-      },
-      spacing: "xl",
-      verticalSpacing: "xl",
-      children: plans.map(plan => /*#__PURE__*/jsxs(Paper, {
-        p: "xl",
-        radius: "0",
-        withBorder: true,
-        bd: plan.highlight ? "2px solid var(--mantine-color-gray-9)" : "1px solid var(--mantine-color-gray-2)",
-        display: "flex",
-        h: "100%",
-        style: {
-          flexDirection: "column"
-        },
-        bg: "white",
-        children: [/*#__PURE__*/jsxs(Stack, {
-          gap: "md",
-          mb: "xl",
-          children: [/*#__PURE__*/jsxs(Group, {
-            justify: "space-between",
-            align: "center",
-            children: [/*#__PURE__*/jsx(Text, {
-              size: "xs",
-              fw: 800,
-              tt: "uppercase",
-              ls: "1.5px",
-              c: "gray.4",
-              children: plan.name
-            }), plan.highlight && /*#__PURE__*/jsx(Badge, {
-              variant: "dot",
+  return /* @__PURE__ */ n(
+    F,
+    {
+      id: r,
+      subtitle: t,
+      title: a,
+      ta: "center",
+      background: y,
+      children: [
+        l && l.length > 0 && /* @__PURE__ */ e(p, { align: "center", gap: "xl", mb: 80, children: /* @__PURE__ */ n(f, { gap: "xs", children: [
+          /* @__PURE__ */ e(
+            ie,
+            {
+              value: i,
+              onChange: d,
+              radius: "0",
+              size: "md",
+              data: l,
               color: "gray.9",
-              children: plan.highlightBadge || "RECOMENDADO"
-            })]
-          }), /*#__PURE__*/jsx(Text, {
-            size: "sm",
-            c: "gray.6",
-            fw: 500,
-            lh: 1.5,
-            h: {
-              md: 42
-            },
-            children: plan.description
-          })]
-        }), /*#__PURE__*/jsxs(Box, {
-          mb: "xl",
-          children: [/*#__PURE__*/jsx(Text, {
-            size: "xs",
-            c: "gray.4",
-            fw: 800,
-            tt: "uppercase",
-            ls: "1px",
-            mb: 4,
-            children: plan.pricePrefix || "A partir de"
-          }), /*#__PURE__*/jsxs(Group, {
-            gap: 8,
-            align: "flex-start",
-            children: [/*#__PURE__*/jsx(Text, {
-              size: "xl",
-              fw: 900,
-              c: "gray.9",
-              style: {
-                marginTop: 8
+              bg: "white",
+              style: { border: "1px solid var(--mantine-color-gray-2)" }
+            }
+          ),
+          i === "annual" && h && /* @__PURE__ */ e(k, { variant: "filled", color: "gray.9", radius: "0", size: "lg", children: h })
+        ] }) }),
+        /* @__PURE__ */ e(
+          S,
+          {
+            cols: { base: 1, md: o.length <= 3 ? o.length : 3 },
+            spacing: "xl",
+            verticalSpacing: "xl",
+            children: o.map((s) => /* @__PURE__ */ n(
+              x,
+              {
+                p: "xl",
+                radius: "0",
+                withBorder: !0,
+                bd: s.highlight ? "2px solid var(--mantine-color-gray-9)" : "1px solid var(--mantine-color-gray-2)",
+                display: "flex",
+                h: "100%",
+                style: { flexDirection: "column" },
+                bg: "white",
+                children: [
+                  /* @__PURE__ */ n(p, { gap: "md", mb: "xl", children: [
+                    /* @__PURE__ */ n(f, { justify: "space-between", align: "center", children: [
+                      /* @__PURE__ */ e(c, { size: "xs", fw: 800, tt: "uppercase", ls: "1.5px", c: "gray.4", children: s.name }),
+                      s.highlight && /* @__PURE__ */ e(k, { variant: "dot", color: "gray.9", children: s.highlightBadge || "RECOMENDADO" })
+                    ] }),
+                    /* @__PURE__ */ e(c, { size: "sm", c: "gray.6", fw: 500, lh: 1.5, h: { md: 42 }, children: s.description })
+                  ] }),
+                  /* @__PURE__ */ n(m, { mb: "xl", children: [
+                    /* @__PURE__ */ e(
+                      c,
+                      {
+                        size: "xs",
+                        c: "gray.4",
+                        fw: 800,
+                        tt: "uppercase",
+                        ls: "1px",
+                        mb: 4,
+                        children: s.pricePrefix || "A partir de"
+                      }
+                    ),
+                    /* @__PURE__ */ n(f, { gap: 8, align: "flex-start", children: [
+                      /* @__PURE__ */ e(c, { size: "xl", fw: 900, c: "gray.9", style: { marginTop: 8 }, children: s.priceDisplay?.currency }),
+                      /* @__PURE__ */ n(f, { gap: 4, align: "flex-end", children: [
+                        /* @__PURE__ */ e(
+                          c,
+                          {
+                            fz: "var(--fz-big-metric)",
+                            fw: 900,
+                            ls: "-0.04em",
+                            lh: 0.8,
+                            c: "gray.9",
+                            children: s.priceDisplay?.whole
+                          }
+                        ),
+                        s.priceDisplay?.fraction && /* @__PURE__ */ n(p, { gap: 0, mb: 6, children: [
+                          /* @__PURE__ */ n(c, { size: "xl", fw: 900, lh: 1, c: "gray.9", children: [
+                            ",",
+                            s.priceDisplay.fraction
+                          ] }),
+                          /* @__PURE__ */ e(
+                            c,
+                            {
+                              size: "xs",
+                              c: "gray.5",
+                              fw: 800,
+                              tt: "uppercase",
+                              ls: "0.5px",
+                              children: s.period || s.priceSuffix || "/mês"
+                            }
+                          )
+                        ] })
+                      ] })
+                    ] })
+                  ] }),
+                  /* @__PURE__ */ e(_, { mb: "xl", color: "gray.1" }),
+                  /* @__PURE__ */ e(p, { gap: "sm", mb: 40, style: { flex: 1 }, children: s.features.map((g, u) => /* @__PURE__ */ n(f, { gap: "sm", wrap: "nowrap", align: "flex-start", children: [
+                    /* @__PURE__ */ e(
+                      L,
+                      {
+                        size: 16,
+                        color: "var(--mantine-color-gray-9)",
+                        style: { marginTop: 2, flexShrink: 0 }
+                      }
+                    ),
+                    /* @__PURE__ */ e(c, { size: "sm", fw: 500, c: "gray.6", lh: 1.4, children: g })
+                  ] }, u)) }),
+                  /* @__PURE__ */ e(m, { mt: "auto", children: /* @__PURE__ */ e(
+                    T,
+                    {
+                      label: s.cta.label,
+                      href: s.cta.href,
+                      size: s.cta.size || "xl",
+                      variant: s.cta.variant,
+                      color: s.cta.color || "gray.9",
+                      fullWidth: !0
+                    }
+                  ) })
+                ]
               },
-              children: plan.priceDisplay?.currency
-            }), /*#__PURE__*/jsxs(Group, {
-              gap: 4,
-              align: "flex-end",
-              children: [/*#__PURE__*/jsx(Text, {
-                fz: "var(--fz-big-metric)",
-                fw: 900,
-                ls: "-0.04em",
-                lh: 0.8,
-                c: "gray.9",
-                children: plan.priceDisplay?.whole
-              }), plan.priceDisplay?.fraction && /*#__PURE__*/jsxs(Stack, {
-                gap: 0,
-                mb: 6,
-                children: [/*#__PURE__*/jsxs(Text, {
-                  size: "xl",
-                  fw: 900,
-                  lh: 1,
-                  c: "gray.9",
-                  children: [",", plan.priceDisplay.fraction]
-                }), /*#__PURE__*/jsx(Text, {
-                  size: "xs",
-                  c: "gray.5",
-                  fw: 800,
-                  tt: "uppercase",
-                  ls: "0.5px",
-                  children: plan.period || plan.priceSuffix || "/mês"
-                })]
-              })]
-            })]
-          })]
-        }), /*#__PURE__*/jsx(Divider, {
-          mb: "xl",
-          color: "gray.1"
-        }), /*#__PURE__*/jsx(Stack, {
-          gap: "sm",
-          mb: 40,
-          style: {
-            flex: 1
-          },
-          children: plan.features.map((feature, i) => /*#__PURE__*/jsxs(Group, {
-            gap: "sm",
-            wrap: "nowrap",
-            align: "flex-start",
-            children: [/*#__PURE__*/jsx(IconCheck, {
-              size: 16,
-              color: "var(--mantine-color-gray-9)",
-              style: {
-                marginTop: 2,
-                flexShrink: 0
-              }
-            }), /*#__PURE__*/jsx(Text, {
-              size: "sm",
-              fw: 500,
-              c: "gray.6",
-              lh: 1.4,
-              children: feature
-            })]
-          }, i))
-        }), /*#__PURE__*/jsx(Box, {
-          mt: "auto",
-          children: /*#__PURE__*/jsx(CTAButton, {
-            label: plan.cta.label,
-            href: plan.cta.href,
-            size: plan.cta.size || "xl",
-            variant: plan.cta.variant,
-            color: plan.cta.color || "gray.9",
-            fullWidth: true
-          })
-        })]
-      }, plan.name))
-    })]
-  });
+              s.name
+            ))
+          }
+        )
+      ]
+    }
+  );
 }
-
-function FAQ({
-  id,
-  subtitle,
-  title,
-  questions = [],
-  contactCard
+function Me({
+  id: r,
+  subtitle: t,
+  title: a,
+  questions: l = [],
+  contactCard: i,
+  background: d = "white"
 }) {
-  const accordionStyles = {
+  const h = {
     item: {
       backgroundColor: "white",
       border: "1px solid var(--mantine-color-gray-2)"
@@ -1405,419 +1031,237 @@ function FAQ({
       color: "var(--mantine-color-gray-5)"
     }
   };
-  return /*#__PURE__*/jsxs(Layout, {
-    id: id,
-    subtitle: subtitle,
-    title: title,
-    bg: "white",
-    children: [/*#__PURE__*/jsxs(SimpleGrid, {
-      cols: {
-        base: 1,
-        md: 2
-      },
-      spacing: "xl",
-      children: [/*#__PURE__*/jsx(Accordion, {
-        variant: "separated",
-        radius: "0",
-        chevronPosition: "right",
-        styles: accordionStyles,
-        children: questions.slice(0, Math.ceil(questions.length / 2)).map((item, i) => /*#__PURE__*/jsxs(Accordion.Item, {
-          value: item.value || String(i),
-          mb: "md",
-          children: [/*#__PURE__*/jsx(Accordion.Control, {
-            icon: /*#__PURE__*/jsx(ThemeIcon, {
-              variant: "light",
-              color: "gray",
-              radius: "0",
-              children: /*#__PURE__*/jsx(IconBolt, {
-                size: 16
-              })
-            }),
-            children: item.question
-          }), /*#__PURE__*/jsx(Accordion.Panel, {
-            c: "gray.6",
-            children: item.answer
-          })]
-        }, item.value || i))
-      }), /*#__PURE__*/jsx(Accordion, {
-        variant: "separated",
+  return /* @__PURE__ */ n(F, { id: r, subtitle: t, title: a, background: d, children: [
+    /* @__PURE__ */ n(S, { cols: { base: 1, md: 2 }, spacing: "xl", children: [
+      /* @__PURE__ */ e(
+        z,
+        {
+          variant: "separated",
+          radius: "0",
+          chevronPosition: "right",
+          styles: h,
+          children: l.slice(0, Math.ceil(l.length / 2)).map((o, y) => /* @__PURE__ */ n(
+            z.Item,
+            {
+              value: o.value || String(y),
+              mb: "md",
+              children: [
+                /* @__PURE__ */ e(
+                  z.Control,
+                  {
+                    icon: /* @__PURE__ */ e(I, { variant: "light", color: "gray", radius: "0", children: /* @__PURE__ */ e(U, { size: 16 }) }),
+                    children: o.question
+                  }
+                ),
+                /* @__PURE__ */ e(z.Panel, { c: "gray.6", children: o.answer })
+              ]
+            },
+            o.value || y
+          ))
+        }
+      ),
+      /* @__PURE__ */ e(
+        z,
+        {
+          variant: "separated",
+          radius: "0",
+          chevronPosition: "right",
+          styles: h,
+          children: l.slice(Math.ceil(l.length / 2)).map((o, y) => /* @__PURE__ */ n(
+            z.Item,
+            {
+              value: o.value || String(y),
+              mb: "md",
+              children: [
+                /* @__PURE__ */ e(
+                  z.Control,
+                  {
+                    icon: /* @__PURE__ */ e(I, { variant: "light", color: "gray", radius: "0", children: /* @__PURE__ */ e(U, { size: 16 }) }),
+                    children: o.question
+                  }
+                ),
+                /* @__PURE__ */ e(z.Panel, { c: "gray.6", children: o.answer })
+              ]
+            },
+            o.value || y
+          ))
+        }
+      )
+    ] }),
+    i && /* @__PURE__ */ e(
+      x,
+      {
+        mt: { base: 40, md: 80 },
         radius: "0",
-        chevronPosition: "right",
-        styles: accordionStyles,
-        children: questions.slice(Math.ceil(questions.length / 2)).map((item, i) => /*#__PURE__*/jsxs(Accordion.Item, {
-          value: item.value || String(i),
-          mb: "md",
-          children: [/*#__PURE__*/jsx(Accordion.Control, {
-            icon: /*#__PURE__*/jsx(ThemeIcon, {
-              variant: "light",
-              color: "gray",
-              radius: "0",
-              children: /*#__PURE__*/jsx(IconBolt, {
-                size: 16
-              })
-            }),
-            children: item.question
-          }), /*#__PURE__*/jsx(Accordion.Panel, {
-            c: "gray.6",
-            children: item.answer
-          })]
-        }, item.value || i))
-      })]
-    }), contactCard && /*#__PURE__*/jsx(Paper, {
-      mt: {
-        base: 40,
-        md: 80
-      },
-      radius: "0",
-      p: {
-        base: "xl",
-        md: 60
-      },
-      bg: "gray.0",
-      bd: "1px solid var(--mantine-color-gray-1)",
-      pos: "relative",
-      style: {
-        overflow: "hidden"
-      },
-      children: /*#__PURE__*/jsxs(SimpleGrid, {
-        cols: {
-          base: 1,
-          md: 2
-        },
-        spacing: "xl",
-        style: {
-          position: "relative",
-          zIndex: 1,
-          alignItems: "center"
-        },
-        children: [/*#__PURE__*/jsxs(Stack, {
-          gap: "sm",
-          ta: {
-            base: "center",
-            md: "left"
-          },
-          align: {
-            base: "center",
-            md: "flex-start"
-          },
-          children: [/*#__PURE__*/jsx(Text, {
-            fz: "h2",
-            fw: 900,
-            c: "gray.9",
-            lh: 1.2,
-            children: contactCard.title
-          }), /*#__PURE__*/jsx(Text, {
-            c: "gray.6",
-            maw: 500,
-            size: "lg",
-            children: contactCard.description
-          })]
-        }), /*#__PURE__*/jsx(Stack, {
-          align: {
-            base: "center",
-            md: "flex-end"
-          },
-          children: /*#__PURE__*/jsx(CTAButton, {
-            label: contactCard.cta.label,
-            href: contactCard.cta.href,
-            target: contactCard.cta.target,
-            leftSection: contactCard.cta.icon,
-            size: contactCard.cta.size || "xl",
-            color: contactCard.cta.color || "dark"
-          })
-        })]
-      })
-    })]
-  });
+        p: { base: "xl", md: 60 },
+        bg: "gray.0",
+        bd: "1px solid var(--mantine-color-gray-1)",
+        pos: "relative",
+        style: { overflow: "hidden" },
+        children: /* @__PURE__ */ n(
+          S,
+          {
+            cols: { base: 1, md: 2 },
+            spacing: "xl",
+            style: { position: "relative", zIndex: 1, alignItems: "center" },
+            children: [
+              /* @__PURE__ */ n(
+                p,
+                {
+                  gap: "sm",
+                  ta: { base: "center", md: "left" },
+                  align: { base: "center", md: "flex-start" },
+                  children: [
+                    /* @__PURE__ */ e(c, { fz: "h2", fw: 900, c: "gray.9", lh: 1.2, children: i.title }),
+                    /* @__PURE__ */ e(c, { c: "gray.6", maw: 500, size: "lg", children: i.description })
+                  ]
+                }
+              ),
+              /* @__PURE__ */ e(p, { align: { base: "center", md: "flex-end" }, children: /* @__PURE__ */ e(
+                T,
+                {
+                  label: i.cta.label,
+                  href: i.cta.href,
+                  target: i.cta.target,
+                  leftSection: i.cta.icon,
+                  size: i.cta.size || "xl",
+                  color: i.cta.color || "dark"
+                }
+              ) })
+            ]
+          }
+        )
+      }
+    )
+  ] });
 }
-
-function Testimonials({
-  id,
-  bg = "gray.0",
-  title,
-  subtitle,
-  items = []
+function je({
+  id: r,
+  subtitle: t,
+  items: a = [],
+  background: l = "gray"
 }) {
-  return /*#__PURE__*/jsx(Layout, {
-    id: id,
-    bg: bg,
-    title: title,
-    subtitle: subtitle,
-    children: /*#__PURE__*/jsx(SimpleGrid, {
-      cols: {
-        base: 1,
-        md: items.length > 3 ? 4 : items.length || 3
-      },
+  return /* @__PURE__ */ e(F, { id: r, background: l, title, subtitle: t, children: /* @__PURE__ */ e(
+    S,
+    {
+      cols: { base: 1, md: a.length > 3 ? 4 : a.length || 3 },
       spacing: "xl",
-      children: items.map((item, index) => /*#__PURE__*/jsx(Paper, {
-        p: "xl",
-        radius: "0",
-        bd: "1px solid var(--mantine-color-gray-2)",
-        bg: "white",
-        children: /*#__PURE__*/jsxs(Stack, {
-          gap: "md",
-          align: "flex-start",
-          h: "100%",
-          children: [/*#__PURE__*/jsx(IconQuote, {
-            size: 32,
-            color: "var(--mantine-color-gray-3)"
-          }), /*#__PURE__*/jsxs(Text, {
-            size: "lg",
-            c: "gray.7",
-            lh: 1.6,
-            fs: "italic",
-            flex: 1,
-            children: ["\"", item.content, "\""]
-          }), /*#__PURE__*/jsxs(Group, {
-            gap: "sm",
-            mt: "xl",
-            children: [/*#__PURE__*/jsx(Avatar, {
-              size: "md",
-              radius: "0",
-              color: "gray",
-              src: item.avatarSrc,
-              children: item.initials
-            }), /*#__PURE__*/jsxs(Stack, {
-              gap: 0,
-              children: [/*#__PURE__*/jsx(Text, {
-                size: "sm",
-                fw: 900,
-                children: item.name
-              }), /*#__PURE__*/jsx(Text, {
-                size: "xs",
-                fw: 800,
-                tt: "uppercase",
-                ls: "1px",
-                c: "gray.5",
-                children: item.role
-              })]
-            })]
-          })]
-        })
-      }, index))
-    })
-  });
+      children: a.map((i, d) => /* @__PURE__ */ e(
+        x,
+        {
+          p: "xl",
+          radius: "0",
+          bd: "1px solid var(--mantine-color-gray-2)",
+          bg: "white",
+          children: /* @__PURE__ */ n(p, { gap: "md", align: "flex-start", h: "100%", children: [
+            /* @__PURE__ */ e(te, { size: 32, color: "var(--mantine-color-gray-3)" }),
+            /* @__PURE__ */ n(c, { size: "lg", c: "gray.7", lh: 1.6, fs: "italic", flex: 1, children: [
+              '"',
+              i.content,
+              '"'
+            ] }),
+            /* @__PURE__ */ n(f, { gap: "sm", mt: "xl", children: [
+              /* @__PURE__ */ e(ne, { size: "md", radius: "0", color: "gray", src: i.avatarSrc, children: i.initials }),
+              /* @__PURE__ */ n(p, { gap: 0, children: [
+                /* @__PURE__ */ e(c, { size: "sm", fw: 900, children: i.name }),
+                /* @__PURE__ */ e(c, { size: "xs", fw: 800, tt: "uppercase", ls: "1px", c: "gray.5", children: i.role })
+              ] })
+            ] })
+          ] })
+        },
+        d
+      ))
+    }
+  ) });
 }
-
-function CTABanner({
-  id,
-  title,
-  description,
-  cta,
-  bg = "gray.0"
+function ge({
+  id: r,
+  title: t,
+  description: a,
+  cta: l,
+  background: i = "gray.0"
 }) {
-  return /*#__PURE__*/jsx(Layout, {
-    id: id,
-    bg: bg,
-    ta: "center",
-    children: /*#__PURE__*/jsx(Paper, {
-      p: {
-        base: "xl",
-        sm: 80
-      },
+  return /* @__PURE__ */ e(F, { id: r, background: i, ta: "center", children: /* @__PURE__ */ e(
+    x,
+    {
+      p: { base: "xl", sm: 80 },
       bg: "white",
       radius: "0",
       bd: "1px solid var(--mantine-color-gray-2)",
-      style: {
-        borderTop: "4px solid var(--mantine-color-gray-9)"
-      },
-      children: /*#__PURE__*/jsxs(Stack, {
-        align: "center",
-        ta: "center",
-        gap: "xl",
-        children: [title && /*#__PURE__*/jsx(Text, {
-          fz: "var(--fz-section-title)",
-          fw: 900,
-          lh: 1.2,
-          ls: "-0.04em",
-          maw: 700,
-          children: title
-        }), description && /*#__PURE__*/jsx(Text, {
-          c: "gray.7",
-          size: "xl",
-          maw: 550,
-          children: description
-        }), cta && /*#__PURE__*/jsx(Box, {
-          mt: "md",
-          children: /*#__PURE__*/jsx(CTAButton, {
-            label: cta.label,
-            href: cta.href,
-            size: cta.size || "xl",
-            px: cta.px || {
-              base: 32,
-              md: 60
-            },
-            variant: cta.variant,
-            color: cta.color
-          })
-        })]
-      })
-    })
-  });
-}
-
-/** @deprecated Use CTABanner instead */
-const SecondaryCTA = CTABanner;
-
-function TrustBadge({
-  text = "Selo Exclusivo RiLiGar",
-  color = "green.6"
-}) {
-  return /*#__PURE__*/jsx(Box, {
-    p: "xs",
-    bg: "gray.1",
-    style: {
-      borderRadius: "8px",
-      border: "1px solid var(--mantine-color-gray-2)",
-      display: "inline-block"
-    },
-    children: /*#__PURE__*/jsxs(Group, {
-      gap: "xs",
-      children: [/*#__PURE__*/jsx(ThemeIcon, {
-        color: color,
-        variant: "light",
-        size: "sm",
-        radius: "xl",
-        children: /*#__PURE__*/jsx(IconCircleCheck, {
-          size: 14,
-          "aria-hidden": "true"
-        })
-      }), /*#__PURE__*/jsx(Text, {
-        size: "xs",
-        fw: 700,
-        c: "gray.7",
-        tt: "uppercase",
-        lts: 0.5,
-        children: text
-      })]
-    })
-  });
+      style: { borderTop: "4px solid var(--mantine-color-gray-9)" },
+      children: /* @__PURE__ */ n(p, { align: "center", ta: "center", gap: "xl", children: [
+        t && /* @__PURE__ */ e(
+          c,
+          {
+            fz: "var(--fz-section-title)",
+            fw: 900,
+            lh: 1.2,
+            ls: "-0.04em",
+            maw: 700,
+            children: t
+          }
+        ),
+        a && /* @__PURE__ */ e(c, { c: "gray.7", size: "xl", maw: 550, children: a }),
+        l && /* @__PURE__ */ e(m, { mt: "md", children: /* @__PURE__ */ e(
+          T,
+          {
+            label: l.label,
+            href: l.href,
+            size: l.size || "xl",
+            px: l.px || { base: 32, md: 60 },
+            variant: l.variant,
+            color: l.color
+          }
+        ) })
+      ] })
+    }
+  ) });
 }
-
-/** @deprecated Use TrustBadge instead */
-const SeloExclusivo = TrustBadge;
-
-function Footer({
-  logo,
-  description,
-  sections = [],
-  socialLinks = [],
-  copyrightText,
-  madeByText,
-  bg = "gray.0"
+const Re = ge;
+function me({
+  text: r = "Selo Exclusivo RiLiGar",
+  color: t = "green.6",
+  background: a = "gray"
 }) {
-  return /*#__PURE__*/jsx(Box, {
-    component: "footer",
-    py: "xl",
-    bg: bg,
-    bd: {
-      top: "1px solid var(--mantine-color-gray-2)"
-    },
-    children: /*#__PURE__*/jsxs(Container, {
-      size: "xl",
-      children: [/*#__PURE__*/jsxs(SimpleGrid, {
-        cols: {
-          base: 1,
-          sm: 2
-        },
-        spacing: "xl",
-        children: [/*#__PURE__*/jsxs(Stack, {
-          gap: "lg",
-          children: [logo && /*#__PURE__*/jsx("img", {
-            src: logo.src,
-            alt: logo.alt || "",
-            height: logo.height || 32,
-            style: {
-              objectFit: "contain",
-              objectPosition: "left"
-            }
-          }), description && /*#__PURE__*/jsx(Text, {
-            size: "md",
-            c: "gray.6",
-            lh: 1.6,
-            maw: 400,
-            children: description
-          })]
-        }), /*#__PURE__*/jsxs(SimpleGrid, {
-          cols: {
-            base: 2,
-            sm: sections.length || 4
-          },
-          spacing: "xl",
-          children: [sections.map((section, idx) => /*#__PURE__*/jsxs(Stack, {
-            gap: "md",
-            children: [/*#__PURE__*/jsx(Text, {
-              fw: 900,
-              size: "xs",
-              tt: "uppercase",
-              ls: "1.5px",
-              children: section.title
-            }), /*#__PURE__*/jsx(Stack, {
-              gap: "xs",
-              children: section.links.map((link, linkIdx) => /*#__PURE__*/jsx(Anchor, {
-                c: "gray.6",
-                size: "sm",
-                component: link.href ? "a" : "button",
-                href: link.href,
-                onClick: link.onClick,
-                fw: 500,
-                children: link.label
-              }, linkIdx))
-            })]
-          }, idx)), socialLinks && socialLinks.length > 0 && /*#__PURE__*/jsxs(Stack, {
-            gap: "md",
-            children: [/*#__PURE__*/jsx(Text, {
-              fw: 900,
-              size: "xs",
-              tt: "uppercase",
-              ls: "1.5px",
-              children: "Social"
-            }), /*#__PURE__*/jsx(Group, {
-              gap: "xs",
-              children: socialLinks.map((social, socialIdx) => /*#__PURE__*/jsx(ActionIcon, {
-                size: "md",
-                variant: "subtle",
-                color: "gray",
-                component: "a",
-                href: social.href,
-                target: "_blank",
-                radius: "0",
-                "aria-label": social.label || `Social link ${socialIdx + 1}`,
-                children: social.icon
-              }, socialIdx))
-            })]
-          })]
-        })]
-      }), /*#__PURE__*/jsx(Divider, {
-        my: "xl",
-        color: "gray.2"
-      }), /*#__PURE__*/jsxs(Group, {
-        justify: "space-between",
-        mt: 30,
-        wrap: "wrap",
-        gap: "sm",
-        children: [/*#__PURE__*/jsx(Text, {
-          size: "xs",
-          fw: 800,
-          tt: "uppercase",
-          ls: "1px",
-          c: "gray.5",
-          children: copyrightText
-        }), madeByText && /*#__PURE__*/jsx(Group, {
-          gap: "sm",
-          children: /*#__PURE__*/jsx(Text, {
-            size: "xs",
-            fw: 800,
-            tt: "uppercase",
-            ls: "1px",
-            c: "gray.5",
-            children: madeByText
-          })
-        })]
-      })]
-    })
-  });
+  const l = D(a);
+  return /* @__PURE__ */ e(
+    m,
+    {
+      p: "xs",
+      bg: l,
+      style: {
+        borderRadius: "8px",
+        border: "1px solid var(--mantine-color-gray-2)",
+        display: "inline-block"
+      },
+      children: /* @__PURE__ */ n(f, { gap: "xs", children: [
+        /* @__PURE__ */ e(I, { color: t, variant: "light", size: "sm", radius: "xl", children: /* @__PURE__ */ e(ce, { size: 14, "aria-hidden": "true" }) }),
+        /* @__PURE__ */ e(c, { size: "xs", fw: 700, c: "gray.7", tt: "uppercase", lts: 0.5, children: r })
+      ] })
+    }
+  );
 }
-
-export { CTABanner, CTAButton, Comparison, FAQ, FeatureSplit, FeaturesGrid, Footer, Header, Hero, Layout, MediaBlock, Navbar, Pricing, SecondaryCTA, SectionHeader, SeloExclusivo, SocialProof, Testimonials, TrustBadge, theme };
-//# sourceMappingURL=index.esm.js.map
+const Ge = me;
+export {
+  ge as CTABanner,
+  T as CTAButton,
+  Ce as Comparison,
+  Me as FAQ,
+  De as FeatureSplit,
+  Ae as FeaturesGrid,
+  se as Header,
+  Pe as Hero,
+  F as Layout,
+  X as MediaBlock,
+  Be as Navbar,
+  Ee as Pricing,
+  $ as SECTION_BACKGROUNDS,
+  Re as SecondaryCTA,
+  J as SectionHeader,
+  Ge as SeloExclusivo,
+  ke as SocialProof,
+  je as Testimonials,
+  me as TrustBadge,
+  D as resolveBackground,
+  Te as theme
+};