@npm_leadtech/legal-contracts-ui 0.119.1 → 0.122.0

package/dist/assets/style/themes.css

@@ -1 +1 @@
-html{--color-principal: #078080;--color-background: #f8f9fa;--color-bg-modal-01: #6d727551;--color-drop-shadow-01: #02374a33;--color-error-25: #ffecef;--color-error-200: #f09d9e;--color-error-principal: #d63737;--color-neutral-White: #ffffff;--color-neutral-25: #f8f9fa;--color-neutral-50: #f3f7fa;--color-neutral-200: #dbe1e5;--color-neutral-400: #b5babd;--color-neutral-600: #6d7275;--color-neutral-800: #3d4042;--color-neutral-900: #1e2021;--color-primary-50: #eff7f5;--color-primary-100: #e4f8f3;--color-primary-200: #c0f7e8;--color-primary-300: #5dd8c3;--color-primary-400: #34b2a7;--color-primary-500: #078080;--color-primary-700: #05646e;--color-primary-800: #02374a;--color-primary-900: #032a38;--color-secondary-50: #fcf9f5;--color-secondary-100: #fcf4e5;--color-secondary-200: #f7e8cf;--color-secondary-300: #f5dab0;--color-secondary-400: #f4cc8c;--color-secondary-500: #f2bd6a;--color-secondary-600: #cd9a4c;--color-secondary-700: #936c2f}html[data-theme=districtlaws]{--font-main: "Inter", sans-serif;--color-principal: #f26600;--color-background: #f8f9fa;--color-bg-modal-01: #6d727551;--color-drop-shadow-01: #02374a33;--color-error-25: #ffecef;--color-error-200: #f09d9e;--color-error-principal: #d63737;--color-neutral-white: #ffffff;--color-neutral-25: #f8f9fa;--color-neutral-50: #f3f7fa;--color-neutral-200: #dbe1e5;--color-neutral-400: #b5babd;--color-neutral-600: #6d7275;--color-neutral-800: #3d4042;--color-neutral-900: #1e2021;--color-primary-50: #fff5ee;--color-primary-100: #ffe1cc;--color-primary-200: #ffc59b;--color-primary-300: #ffa05c;--color-primary-400: #ff862e;--color-primary-500: #f26600;--color-primary-700: #c95500;--color-primary-800: #4f2100;--color-primary-900: #220f00;--color-secondary-50: #eff7f5;--color-secondary-100: #e4f8f3;--color-secondary-200: #c0f7e8;--color-secondary-300: #5dd8c3;--color-secondary-400: #34b2a7;--color-secondary-500: #078080;--color-secondary-600: #05646e;--color-secondary-700: #02374a;--color-secondary-900: #032a38}html[data-theme=lawdistricts]{--font-main: "Inter", sans-serif;--color-principal: #485aff;--color-background: #f8f9fa;--color-bg-modal-01: #6d727551;--color-drop-shadow-01: #02374a33;--color-error-25: #ffecef;--color-error-200: #f09d9e;--color-error-principal: #d63737;--color-neutral-white: #ffffff;--color-neutral-25: #f8f9fa;--color-neutral-50: #f3f7fa;--color-neutral-200: #dbe1e5;--color-neutral-400: #b5babd;--color-neutral-600: #6d7275;--color-neutral-800: #3d4042;--color-neutral-900: #1e2021;--color-primary-50: #f9f9ff;--color-primary-100: #eceeff;--color-primary-200: #c3c9ff;--color-primary-300: #9aa4ff;--color-primary-400: #717fff;--color-primary-500: #485aff;--color-primary-700: #1725a6;--color-primary-800: #050e5a;--color-primary-900: #000533;--color-secondary-50: #eff7f5;--color-secondary-100: #e4f8f3;--color-secondary-200: #c0f7e8;--color-secondary-300: #5dd8c3;--color-secondary-400: #34b2a7;--color-secondary-500: #078080;--color-secondary-600: #05646e;--color-secondary-700: #02374a;--color-secondary-900: #032a38}html[data-theme=lawdistrict]{--font-main: "Inter", sans-serif;--background: #ffffff;--foreground: #171717;--font-inter: "Inter", sans-serif;--font-lora: "Lora", serif;--primary-50: #eff7f5;--primary-100: #e4f8f3;--primary-200: #c0f7e8;--primary-300: #5dd8c3;--primary-400: #34b2a7;--primary-500: #078080;--primary-700: #05646e;--primary-800: #02374a;--primary-900: #032a38;--secondary-50: #fcf9f5;--secondary-100: #fcf4e5;--secondary-200: #f7e8cf;--secondary-300: #f5dab0;--secondary-400: #f4cc8c;--secondary-500: #f2bd6a;--secondary-600: #cd9a4c;--secondary-700: #936c2f;--neutral-25: #f8f9fa;--neutral-50: #f3f7fa;--neutral-200: #dbe1e5;--neutral-400: #b5babd;--neutral-600: #6d7275;--neutral-800: #3d4042;--neutral-900: #1e2021;--neutral-white: #ffffff;--error-25: #ffecef;--error-200: #f09d9e;--error-500: #d63737}html[data-theme=lawsdistrict]{--font-main: "Inter", sans-serif;--color-principal: #7d2eff;--color-background: #f8f9fa;--color-bg-modal-01: #6d727551;--color-drop-shadow-01: #02374a33;--color-error-25: #ffecef;--color-error-200: #f09d9e;--color-error-principal: #d63737;--color-neutral-white: #ffffff;--color-neutral-25: #f8f9fa;--color-neutral-50: #f3f7fa;--color-neutral-200: #dbe1e5;--color-neutral-400: #b5babd;--color-neutral-600: #6d7275;--color-neutral-800: #3d4042;--color-neutral-900: #1e2021;--color-primary-50: #f9f5ff;--color-primary-100: #e3d1ff;--color-primary-200: #b68aff;--color-primary-300: #a56dff;--color-primary-400: #9e63ff;--color-primary-500: #7d2eff;--color-primary-700: #320085;--color-primary-800: #23005c;--color-primary-900: #11002d;--color-secondary-50: #eff7f5;--color-secondary-100: #e4f8f3;--color-secondary-200: #c0f7e8;--color-secondary-300: #5dd8c3;--color-secondary-400: #34b2a7;--color-secondary-500: #078080;--color-secondary-600: #05646e;--color-secondary-700: #02374a;--color-secondary-900: #032a38}html[data-theme=lawdistrictinfo]{--font-main: "Inter", sans-serif;--color-principal: #00b649;--color-background: #f8f9fa;--color-bg-modal-01: #6d727551;--color-drop-shadow-01: #02374a33;--color-error-25: #ffecef;--color-error-200: #f09d9e;--color-error-principal: #d63737;--color-neutral-white: #ffffff;--color-neutral-25: #f8f9fa;--color-neutral-50: #f3f7fa;--color-neutral-200: #dbe1e5;--color-neutral-400: #b5babd;--color-neutral-600: #6d7275;--color-neutral-800: #3d4042;--color-neutral-900: #1e2021;--color-primary-50: #e7fff1;--color-primary-100: #d5ffe6;--color-primary-200: #6affa5;--color-primary-300: #16ff73;--color-primary-400: #00df59;--color-primary-500: #00b649;--color-primary-700: #008e39;--color-primary-800: #003c18;--color-primary-900: #001709;--color-secondary-50: #eff7f5;--color-secondary-100: #e4f8f3;--color-secondary-200: #c0f7e8;--color-secondary-300: #5dd8c3;--color-secondary-400: #34b2a7;--color-secondary-500: #078080;--color-secondary-600: #05646e;--color-secondary-700: #02374a;--color-secondary-900: #032a38}html[data-theme=uslawdistrict]{--font-main: "Inter", sans-serif;--color-principal: #d68d00;--color-background: #f8f9fa;--color-bg-modal-01: #6d727551;--color-drop-shadow-01: #02374a33;--color-error-25: #ffecef;--color-error-200: #f09d9e;--color-error-principal: #d63737;--color-neutral-white: #ffffff;--color-neutral-25: #f8f9fa;--color-neutral-50: #f3f7fa;--color-neutral-200: #dbe1e5;--color-neutral-400: #b5babd;--color-neutral-600: #6d7275;--color-neutral-800: #3d4042;--color-neutral-900: #1e2021;--color-primary-50: #fffbf2;--color-primary-100: #fff6e5;--color-primary-200: #ffe6b7;--color-primary-300: #ffc75c;--color-primary-400: #ffa800;--color-primary-500: #d68d00;--color-primary-700: #855800;--color-primary-800: #3d2800;--color-primary-900: #231700;--color-secondary-50: #eff7f5;--color-secondary-100: #e4f8f3;--color-secondary-200: #c0f7e8;--color-secondary-300: #5dd8c3;--color-secondary-400: #34b2a7;--color-secondary-500: #078080;--color-secondary-600: #05646e;--color-secondary-700: #02374a;--color-secondary-900: #032a38}html[data-theme=legalfinity]{--font-main: "Poppins", sans-serif;--background: #ffffff;--foreground: #171717;--font-inter: "Poppins", sans-serif;--font-lora: "Poppins", serif;--primary-50: #e9f5ff;--primary-100: #d7ecff;--primary-200: #b7daff;--primary-300: #8bc1ff;--primary-400: #5e99ff;--primary-500: #3970ff;--primary-700: #1039f5;--primary-800: #163399;--primary-900: #07144b;--secondary-50: #fff6ed;--secondary-100: #fff0d5;--secondary-200: #fedcaa;--secondary-300: #fdc374;--secondary-400: #fb9e3c;--secondary-500: #f98116;--secondary-600: #ea660c;--secondary-700: #d3530d;--neutral-25: #f5f7fa;--neutral-50: #ebeef3;--neutral-200: #d2d9e5;--neutral-400: #abbbce;--neutral-600: #496080;--neutral-800: #2f3a4b;--neutral-900: #1f2532;--neutral-white: #ffffff;--error-25: #ffecef;--error-200: #f09d9e;--error-500: #d63737}
+html{--color-principal: #078080;--color-background: #f8f9fa;--color-bg-modal-01: #6d727551;--color-drop-shadow-01: #02374a33;--color-error-25: #ffecef;--color-error-200: #f09d9e;--color-error-principal: #d63737;--color-neutral-White: #ffffff;--color-neutral-25: #f8f9fa;--color-neutral-50: #f3f7fa;--color-neutral-200: #dbe1e5;--color-neutral-400: #b5babd;--color-neutral-600: #6d7275;--color-neutral-800: #3d4042;--color-neutral-900: #1e2021;--color-primary-50: #eff7f5;--color-primary-100: #e4f8f3;--color-primary-200: #c0f7e8;--color-primary-300: #5dd8c3;--color-primary-400: #34b2a7;--color-primary-500: #078080;--color-primary-700: #05646e;--color-primary-800: #02374a;--color-primary-900: #032a38;--color-secondary-50: #fcf9f5;--color-secondary-100: #fcf4e5;--color-secondary-200: #f7e8cf;--color-secondary-300: #f5dab0;--color-secondary-400: #f4cc8c;--color-secondary-500: #f2bd6a;--color-secondary-600: #cd9a4c;--color-secondary-700: #936c2f}html[data-theme=districtlaws]{--font-main: "Inter", sans-serif;--color-principal: #f26600;--color-background: #f8f9fa;--color-bg-modal-01: #6d727551;--color-drop-shadow-01: #02374a33;--color-error-25: #ffecef;--color-error-200: #f09d9e;--color-error-principal: #d63737;--color-neutral-white: #ffffff;--color-neutral-25: #f8f9fa;--color-neutral-50: #f3f7fa;--color-neutral-200: #dbe1e5;--color-neutral-400: #b5babd;--color-neutral-600: #6d7275;--color-neutral-800: #3d4042;--color-neutral-900: #1e2021;--color-primary-50: #fff5ee;--color-primary-100: #ffe1cc;--color-primary-200: #ffc59b;--color-primary-300: #ffa05c;--color-primary-400: #ff862e;--color-primary-500: #f26600;--color-primary-700: #c95500;--color-primary-800: #4f2100;--color-primary-900: #220f00;--color-secondary-50: #eff7f5;--color-secondary-100: #e4f8f3;--color-secondary-200: #c0f7e8;--color-secondary-300: #5dd8c3;--color-secondary-400: #34b2a7;--color-secondary-500: #078080;--color-secondary-600: #05646e;--color-secondary-700: #02374a;--color-secondary-900: #032a38}html[data-theme=lawdistricts]{--font-main: "Inter", sans-serif;--color-principal: #485aff;--color-background: #f8f9fa;--color-bg-modal-01: #6d727551;--color-drop-shadow-01: #02374a33;--color-error-25: #ffecef;--color-error-200: #f09d9e;--color-error-principal: #d63737;--color-neutral-white: #ffffff;--color-neutral-25: #f8f9fa;--color-neutral-50: #f3f7fa;--color-neutral-200: #dbe1e5;--color-neutral-400: #b5babd;--color-neutral-600: #6d7275;--color-neutral-800: #3d4042;--color-neutral-900: #1e2021;--color-primary-50: #f9f9ff;--color-primary-100: #eceeff;--color-primary-200: #c3c9ff;--color-primary-300: #9aa4ff;--color-primary-400: #717fff;--color-primary-500: #485aff;--color-primary-700: #1725a6;--color-primary-800: #050e5a;--color-primary-900: #000533;--color-secondary-50: #eff7f5;--color-secondary-100: #e4f8f3;--color-secondary-200: #c0f7e8;--color-secondary-300: #5dd8c3;--color-secondary-400: #34b2a7;--color-secondary-500: #078080;--color-secondary-600: #05646e;--color-secondary-700: #02374a;--color-secondary-900: #032a38}html[data-theme=lawdistrict]{--font-main: "Inter", sans-serif;--color-principal: #078080;--color-background: #f8f9fa;--color-bg-modal-01: #6d727551;--color-drop-shadow-01: #02374a33;--color-error-25: #ffecef;--color-error-200: #f09d9e;--color-error-principal: #d63737;--color-neutral-White: #ffffff;--color-neutral-25: #f8f9fa;--color-neutral-50: #f3f7fa;--color-neutral-200: #dbe1e5;--color-neutral-400: #b5babd;--color-neutral-600: #6d7275;--color-neutral-800: #3d4042;--color-neutral-900: #1e2021;--color-primary-50: #eff7f5;--color-primary-100: #e4f8f3;--color-primary-200: #c0f7e8;--color-primary-300: #5dd8c3;--color-primary-400: #34b2a7;--color-primary-500: #078080;--color-primary-700: #05646e;--color-primary-800: #02374a;--color-primary-900: #032a38;--color-secondary-50: #fcf9f5;--color-secondary-100: #fcf4e5;--color-secondary-200: #f7e8cf;--color-secondary-300: #f5dab0;--color-secondary-400: #f4cc8c;--color-secondary-500: #f2bd6a;--color-secondary-600: #cd9a4c;--color-secondary-700: #936c2f}html[data-theme=lawsdistrict]{--font-main: "Inter", sans-serif;--color-principal: #7d2eff;--color-background: #f8f9fa;--color-bg-modal-01: #6d727551;--color-drop-shadow-01: #02374a33;--color-error-25: #ffecef;--color-error-200: #f09d9e;--color-error-principal: #d63737;--color-neutral-white: #ffffff;--color-neutral-25: #f8f9fa;--color-neutral-50: #f3f7fa;--color-neutral-200: #dbe1e5;--color-neutral-400: #b5babd;--color-neutral-600: #6d7275;--color-neutral-800: #3d4042;--color-neutral-900: #1e2021;--color-primary-50: #f9f5ff;--color-primary-100: #e3d1ff;--color-primary-200: #b68aff;--color-primary-300: #a56dff;--color-primary-400: #9e63ff;--color-primary-500: #7d2eff;--color-primary-700: #320085;--color-primary-800: #23005c;--color-primary-900: #11002d;--color-secondary-50: #eff7f5;--color-secondary-100: #e4f8f3;--color-secondary-200: #c0f7e8;--color-secondary-300: #5dd8c3;--color-secondary-400: #34b2a7;--color-secondary-500: #078080;--color-secondary-600: #05646e;--color-secondary-700: #02374a;--color-secondary-900: #032a38}html[data-theme=lawdistrictinfo]{--font-main: "Inter", sans-serif;--color-principal: #00b649;--color-background: #f8f9fa;--color-bg-modal-01: #6d727551;--color-drop-shadow-01: #02374a33;--color-error-25: #ffecef;--color-error-200: #f09d9e;--color-error-principal: #d63737;--color-neutral-white: #ffffff;--color-neutral-25: #f8f9fa;--color-neutral-50: #f3f7fa;--color-neutral-200: #dbe1e5;--color-neutral-400: #b5babd;--color-neutral-600: #6d7275;--color-neutral-800: #3d4042;--color-neutral-900: #1e2021;--color-primary-50: #e7fff1;--color-primary-100: #d5ffe6;--color-primary-200: #6affa5;--color-primary-300: #16ff73;--color-primary-400: #00df59;--color-primary-500: #00b649;--color-primary-700: #008e39;--color-primary-800: #003c18;--color-primary-900: #001709;--color-secondary-50: #eff7f5;--color-secondary-100: #e4f8f3;--color-secondary-200: #c0f7e8;--color-secondary-300: #5dd8c3;--color-secondary-400: #34b2a7;--color-secondary-500: #078080;--color-secondary-600: #05646e;--color-secondary-700: #02374a;--color-secondary-900: #032a38}html[data-theme=uslawdistrict]{--font-main: "Inter", sans-serif;--color-principal: #d68d00;--color-background: #f8f9fa;--color-bg-modal-01: #6d727551;--color-drop-shadow-01: #02374a33;--color-error-25: #ffecef;--color-error-200: #f09d9e;--color-error-principal: #d63737;--color-neutral-white: #ffffff;--color-neutral-25: #f8f9fa;--color-neutral-50: #f3f7fa;--color-neutral-200: #dbe1e5;--color-neutral-400: #b5babd;--color-neutral-600: #6d7275;--color-neutral-800: #3d4042;--color-neutral-900: #1e2021;--color-primary-50: #fffbf2;--color-primary-100: #fff6e5;--color-primary-200: #ffe6b7;--color-primary-300: #ffc75c;--color-primary-400: #ffa800;--color-primary-500: #d68d00;--color-primary-700: #855800;--color-primary-800: #3d2800;--color-primary-900: #231700;--color-secondary-50: #eff7f5;--color-secondary-100: #e4f8f3;--color-secondary-200: #c0f7e8;--color-secondary-300: #5dd8c3;--color-secondary-400: #34b2a7;--color-secondary-500: #078080;--color-secondary-600: #05646e;--color-secondary-700: #02374a;--color-secondary-900: #032a38}html[data-theme=legalfinity]{--font-main: "Poppins", sans-serif;--font-inter: "Poppins", sans-serif;--font-lora: "Poppins", serif;--color-principal: #3970ff;--color-background: #f8f9fa;--color-bg-modal-01: #6d727551;--color-drop-shadow-01: #02374a33;--color-error-25: #ffecef;--color-error-200: #f09d9e;--color-error-principal: #d63737;--color-neutral-white: #ffffff;--color-neutral-25: #f5f7fa;--color-neutral-50: #ebeef3;--color-neutral-200: #d2d9e5;--color-neutral-400: #abbbce;--color-neutral-600: #496080;--color-neutral-800: #2f3a4b;--color-neutral-900: #1f2532;--color-primary-50: #e9f5ff;--color-primary-100: #d7ecff;--color-primary-200: #b7daff;--color-primary-300: #8bc1ff;--color-primary-400: #5e99ff;--color-primary-500: #1039f5;--color-primary-700: #1039f5;--color-primary-800: #163399;--color-primary-900: #07144b;--color-secondary-50: #fff6ed;--color-secondary-100: #fff0d5;--color-secondary-200: #fedcaa;--color-secondary-300: #fdc374;--color-secondary-400: #fb9e3c;--color-secondary-500: #f98116;--color-secondary-600: #ea660c;--color-secondary-700: #d3530d}

package/dist/components/Anchor.d.ts

@@ -3,6 +3,6 @@ import { JSX } from 'react/jsx-runtime';
 export declare const Anchor: ({ children, variant, className, ...props }: AnchorProps) => JSX.Element;
 
 export interface AnchorProps extends React.ComponentProps<'a'> {
-    variant?: 'default' | 'legal' | 'tooltip' | 'about-us' | 'pricing' | 'unsubscribe' | 'cookies';
+    variant?: 'default' | 'legal' | 'ratafia' | 'tooltip' | 'about-us' | 'pricing' | 'unsubscribe' | 'cookies';
 }
 

package/dist/components/Anchor.js

@@ -1,15 +1,16 @@
 import { jsx as d } from "react/jsx-runtime";
 import p from "clsx";
-const v = ({ children: i, variant: c = "default", className: l = "", ...r }) => {
-  const t = r.href || "", s = t.toLowerCase(), u = s.startsWith("mailto:"), n = s.startsWith("tel:"), e = "cursor-pointer text-primary-700", o = {
+const b = ({ children: a, variant: c = "default", className: l = "", ...r }) => {
+  const t = r.href || "", n = t.toLowerCase(), u = n.startsWith("mailto:"), o = n.startsWith("tel:"), e = "cursor-pointer text-primary-700", s = {
     default: "text-neutral-900 underline",
     legal: e,
+    ratafia: "cursor-pointer text-primary-200 underline decoration-white/40 underline-offset-2 hover:text-white",
     "about-us": e,
     pricing: "cursor-pointer text-neutral-900",
     unsubscribe: e,
     cookies: "text-white"
-  }, f = o[c] ?? o.default, a = t.startsWith("http") && !n && !u, h = (() => {
-    if (!n) return t;
+  }, f = s[c] ?? s.default, i = t.startsWith("http") && !o && !u, h = (() => {
+    if (!o) return t;
     try {
       return decodeURIComponent(t).replace(/\s/g, "");
     } catch {
@@ -22,12 +23,12 @@ const v = ({ children: i, variant: c = "default", className: l = "", ...r }) =>
       ...r,
       href: h,
       className: p(l, f),
-      target: a ? "_blank" : void 0,
-      rel: a ? "noopener noreferrer" : void 0,
-      children: i
+      target: i ? "_blank" : void 0,
+      rel: i ? "noopener noreferrer" : void 0,
+      children: a
     }
   );
 };
 export {
-  v as Anchor
+  b as Anchor
 };

package/dist/components/Blockquote.d.ts

@@ -3,6 +3,6 @@ import { JSX } from 'react/jsx-runtime';
 export declare const Blockquote: ({ children, variant }: BlockquoteProps) => JSX.Element;
 
 export interface BlockquoteProps extends React.ComponentProps<'blockquote'> {
-    variant?: 'default' | 'legal' | 'tooltip' | 'about-us' | 'pricing' | 'unsubscribe' | 'cookies';
+    variant?: 'default' | 'legal' | 'ratafia' | 'tooltip' | 'about-us' | 'pricing' | 'unsubscribe' | 'cookies';
 }
 

package/dist/components/Blockquote.js

@@ -1,13 +1,13 @@
-import { jsx as o } from "react/jsx-runtime";
-import l from "clsx";
-const b = ({ children: r, variant: e = "default" }) => {
+import { jsx as l } from "react/jsx-runtime";
+import o from "clsx";
+const s = ({ children: r, variant: a = "default" }) => {
   const t = {
-    default: "border-l-4 border-gray-300 pl-4 text-gray-700 ",
-    "about-us": "text-gray-700 bg-neutral-25 pt-4 px-4 pb-0.5",
-    unsubscribe: "border-l-4 border-neutral-300 pl-4 text-neutral-700"
-  }, a = t[e] ?? t.default;
-  return /* @__PURE__ */ o("blockquote", { className: l("my-4 italic", a), children: r });
+    default: "my-4 border-l-4 border-gray-300 pl-4 text-gray-700 italic",
+    "about-us": "my-4 text-gray-700 italic bg-neutral-25 pt-4 px-4 pb-0.5",
+    unsubscribe: "my-4 border-l-4 border-neutral-300 pl-4 text-neutral-700 italic"
+  }, e = t[a] ?? t.default;
+  return /* @__PURE__ */ l("blockquote", { className: o("my-4 italic", e), children: r });
 };
 export {
-  b as Blockquote
+  s as Blockquote
 };

package/dist/components/ContactFormSection.js

@@ -18,7 +18,7 @@ const C = () => /* @__PURE__ */ e("div", { role: "status", "aria-live": "polite"
   /* @__PURE__ */ e(o, { ...i, variant: "primary-green" })
 ] }), B = ({ title: r, message: l, cta: i }) => /* @__PURE__ */ t("div", { role: "status", "aria-live": "polite", className: "flex flex-col items-center justify-center gap-8 px-4 py-3", children: [
   /* @__PURE__ */ t("div", { className: "flex flex-col items-center gap-2", children: [
-    /* @__PURE__ */ e("div", { className: "bg-primary-100 w-fit rounded-full p-3", children: /* @__PURE__ */ e(w, { width: 48, height: 48, fill: "var(--color-primary-500)" }) }),
+    /* @__PURE__ */ e("div", { className: "bg-primary-100 w-fit rounded-full p-3", children: /* @__PURE__ */ e(w, { width: 48, height: 48, fill: "var(--primary-500)" }) }),
     /* @__PURE__ */ e("p", { className: "text-big font-bold text-neutral-800", children: r }),
     /* @__PURE__ */ e("p", { className: "text-medium text-neutral-800", children: l })
   ] }),

package/dist/components/ContactMethodCard.js

@@ -1,35 +1,35 @@
-import { jsxs as i, Fragment as n, jsx as a } from "react/jsx-runtime";
+import { jsxs as l, Fragment as r, jsx as a } from "react/jsx-runtime";
 import { SinglePhoneIcon as s } from "./SinglePhoneIcon.js";
 import { PhoneTalkIcon as m } from "./PhoneTalkIcon.js";
 import { MailFillIcon as c } from "./MailFillIcon.js";
 import { LocationIcon as o } from "./LocationIcon.js";
-import { LinkWrapper as t } from "./LinkWrapper.js";
-const v = ({ label: e, helper: l, variant: r }) => /* @__PURE__ */ i("article", { className: "bg-neutral-25 flex flex-wrap gap-2 rounded-sm p-4 md:flex-col", children: [
-  r === "phone" && /* @__PURE__ */ i(n, { children: [
-    /* @__PURE__ */ i(t, { variant: "primary-green", className: "w-full md:hidden", children: [
+import { LinkWrapper as n } from "./LinkWrapper.js";
+const v = ({ label: e, helper: i, variant: t }) => /* @__PURE__ */ l("article", { className: "bg-neutral-25 flex flex-wrap gap-2 rounded-sm p-4 md:flex-col", children: [
+  t === "phone" && /* @__PURE__ */ l(r, { children: [
+    /* @__PURE__ */ l(n, { variant: "primary-green", className: "w-full md:hidden", children: [
       /* @__PURE__ */ a(s, { width: 22, height: 22, fill: "white" }),
       " ",
       e
     ] }),
-    /* @__PURE__ */ i("div", { className: "hidden gap-2 md:flex", children: [
-      /* @__PURE__ */ a("span", { className: "shrink-0", children: /* @__PURE__ */ a(m, { fill: "var(--color-primary-800)" }) }),
-      /* @__PURE__ */ i("div", { className: "flex flex-col gap-1", children: [
-        /* @__PURE__ */ a(t, { className: "justify-start! p-0! no-underline!", variant: "tertiary-link", children: /* @__PURE__ */ a("span", { className: "text-medium text-primary-800 font-bold", children: e }) }),
-        l && /* @__PURE__ */ a("p", { className: "text-small mx-auto text-neutral-600 md:mx-0", children: l })
+    /* @__PURE__ */ l("div", { className: "hidden gap-2 md:flex", children: [
+      /* @__PURE__ */ a("span", { className: "shrink-0", children: /* @__PURE__ */ a(m, { fill: "var(--primary-800)" }) }),
+      /* @__PURE__ */ l("div", { className: "flex flex-col gap-1", children: [
+        /* @__PURE__ */ a(n, { className: "justify-start! p-0! no-underline!", variant: "tertiary-link", children: /* @__PURE__ */ a("span", { className: "text-medium text-primary-800 font-bold", children: e }) }),
+        i && /* @__PURE__ */ a("p", { className: "text-small mx-auto text-neutral-600 md:mx-0", children: i })
       ] })
     ] }),
-    l && /* @__PURE__ */ a("p", { className: "text-small mx-auto text-neutral-600 md:mx-0 md:hidden", children: l })
+    i && /* @__PURE__ */ a("p", { className: "text-small mx-auto text-neutral-600 md:mx-0 md:hidden", children: i })
   ] }),
-  r === "email" && /* @__PURE__ */ i("div", { className: "flex gap-2", children: [
-    /* @__PURE__ */ a("span", { className: "shrink-0", children: /* @__PURE__ */ a(c, { fill: "var(--color-primary-800)" }) }),
-    /* @__PURE__ */ i("div", { className: "flex flex-col gap-1", children: [
-      /* @__PURE__ */ a(t, { className: "justify-start! p-0!", variant: "tertiary-link", children: /* @__PURE__ */ a("span", { className: "text-medium text-primary-800 font-bold", children: e }) }),
-      l && /* @__PURE__ */ a("p", { className: "text-small text-neutral-600", children: l })
+  t === "email" && /* @__PURE__ */ l("div", { className: "flex gap-2", children: [
+    /* @__PURE__ */ a("span", { className: "shrink-0", children: /* @__PURE__ */ a(c, { fill: "var(--primary-800)" }) }),
+    /* @__PURE__ */ l("div", { className: "flex flex-col gap-1", children: [
+      /* @__PURE__ */ a(n, { className: "justify-start! p-0!", variant: "tertiary-link", children: /* @__PURE__ */ a("span", { className: "text-medium text-primary-800 font-bold", children: e }) }),
+      i && /* @__PURE__ */ a("p", { className: "text-small text-neutral-600", children: i })
     ] })
   ] }),
-  r === "location" && /* @__PURE__ */ i("div", { className: "flex gap-2", children: [
-    /* @__PURE__ */ a("span", { className: "shrink-0", children: /* @__PURE__ */ a(o, { fill: "var(--color-primary-800)" }) }),
-    l && /* @__PURE__ */ a("p", { className: "text-small text-neutral-600", children: l })
+  t === "location" && /* @__PURE__ */ l("div", { className: "flex gap-2", children: [
+    /* @__PURE__ */ a("span", { className: "shrink-0", children: /* @__PURE__ */ a(o, { fill: "var(--primary-800)" }) }),
+    i && /* @__PURE__ */ a("p", { className: "text-small text-neutral-600", children: i })
   ] })
 ] });
 export {

package/dist/components/DoneCircleIcon.js

@@ -1,6 +1,6 @@
 import { jsxs as l, jsx as e } from "react/jsx-runtime";
 import "react";
-const a = ({ fill: i = "var(--color-primary-900)", ...s }) => /* @__PURE__ */ l("svg", { xmlns: "http://www.w3.org/2000/svg", width: "32", height: "32", fill: "none", viewBox: "0 0 32 32", ...s, children: [
+const a = ({ fill: i = "var(--primary-900)", ...s }) => /* @__PURE__ */ l("svg", { xmlns: "http://www.w3.org/2000/svg", width: "32", height: "32", fill: "none", viewBox: "0 0 32 32", ...s, children: [
   /* @__PURE__ */ e(
     "mask",
     {

package/dist/components/FaqItem.js

@@ -2,9 +2,9 @@ import { jsx as e, jsxs as r } from "react/jsx-runtime";
 import { useId as c } from "react";
 import { FaqItemWrapper as d } from "./FaqItemWrapper.js";
 import { Markdown as p } from "./Markdown.js";
-import { ChevronDownIcon as o } from "./ChevronDownIcon.js";
+import { ChevronDownIcon as n } from "./ChevronDownIcon.js";
 const b = ({
-  question: n,
+  question: o,
   answer: l,
   showMoreText: a,
   collapsedButtonText: i,
@@ -12,7 +12,7 @@ const b = ({
   variant: m
 }) => {
   const t = `toggle-${c().replace(/:/g, "")}`;
-  return /* @__PURE__ */ e("div", { className: "text-medium flex flex-col rounded bg-white p-4 text-neutral-800 shadow", children: /* @__PURE__ */ r(d, { question: /* @__PURE__ */ e("span", { className: "font-bold", children: n }), children: [
+  return /* @__PURE__ */ e("div", { className: "text-medium flex flex-col rounded bg-white p-4 text-neutral-800 shadow", children: /* @__PURE__ */ r(d, { question: /* @__PURE__ */ e("span", { className: "font-bold", children: o }), children: [
     /* @__PURE__ */ e(p, { content: l, className: "text-medium", variant: m ?? "default" }),
     a && /* @__PURE__ */ r("div", { className: "mt-4 rounded-lg bg-neutral-50 p-6", children: [
       /* @__PURE__ */ e("input", { type: "checkbox", id: t, className: "peer sr-only" }),
@@ -24,7 +24,7 @@ const b = ({
           className: "text-primary-700 flex cursor-pointer items-center gap-1 text-sm transition-colors peer-checked:hidden",
           children: [
             s,
-            /* @__PURE__ */ e(o, { fill: "var(--color-primary-700)", className: "h-4 w-4 transition-transform duration-200" })
+            /* @__PURE__ */ e(n, { fill: "var(--primary-700)", className: "h-4 w-4 transition-transform duration-200" })
           ]
         }
       ),
@@ -36,9 +36,9 @@ const b = ({
           children: [
             i,
             /* @__PURE__ */ e(
-              o,
+              n,
               {
-                fill: "var(--color-primary-700)",
+                fill: "var(--primary-700)",
                 className: "h-4 w-4 rotate-180 transition-transform duration-200"
               }
             )

package/dist/components/Footer.js

@@ -1,23 +1,23 @@
 import { jsxs as l, jsx as e } from "react/jsx-runtime";
 import "react";
 import { PhoneButton as o } from "./PhoneButton.js";
-import { FooterNav as p } from "./FooterNav.js";
+import { FooterNav as f } from "./FooterNav.js";
 const g = ({
   nav: r,
   contactInfo: t,
-  logoGray: i,
-  socialLinks: d,
-  legalLinks: c,
-  disclaimerText: x,
+  logoGray: d,
+  socialLinks: i,
+  legalLinks: x,
+  disclaimerText: c,
   copyrightText: n,
-  trustPilot: s,
-  languageSelector: m
-}) => /* @__PURE__ */ l("footer", { className: "text-neutral-25", children: [
+  trustPilot: m,
+  languageSelector: s
+}) => /* @__PURE__ */ l("footer", { className: "text-neutral-25 max-w-full overflow-x-hidden", children: [
   /* @__PURE__ */ e("div", { className: "bg-primary-900", children: /* @__PURE__ */ l("div", { className: "mx-auto flex w-full max-w-300 flex-col items-start gap-8 px-6 py-10 md:grid md:grid-cols-3 lg:flex lg:flex-row lg:justify-between", children: [
-    r.map((a) => /* @__PURE__ */ e(p, { ...a }, a.title)),
+    r.map((a) => /* @__PURE__ */ e(f, { ...a }, a.title)),
     /* @__PURE__ */ l("div", { className: "flex flex-col gap-6 max-sm:w-full md:contents lg:flex", children: [
       /* @__PURE__ */ l("div", { className: "", children: [
-        /* @__PURE__ */ e("div", { className: "mb-8 xl:hidden", children: !!m && /* @__PURE__ */ e("div", { className: "language-selector-mobile-container", children: m }) }),
+        /* @__PURE__ */ e("div", { className: "mb-8 xl:hidden", children: !!s && /* @__PURE__ */ e("div", { className: "language-selector-mobile-container", children: s }) }),
         /* @__PURE__ */ l("div", { children: [
           /* @__PURE__ */ e("p", { className: "text-small hidden font-bold text-white sm:block", children: t.phoneNumber }),
           /* @__PURE__ */ e("div", { className: "mb-2 w-full text-center sm:hidden", children: /* @__PURE__ */ e(o, { phoneNumber: t.phoneNumber }) }),
@@ -28,17 +28,17 @@ const g = ({
           ] })
         ] })
       ] }),
-      !!s && /* @__PURE__ */ e("div", { className: "flex flex-col gap-2", children: s })
+      !!m && /* @__PURE__ */ e("div", { className: "flex flex-col gap-2", children: m })
     ] })
   ] }) }),
   /* @__PURE__ */ e("div", { className: "bg-neutral-900 px-6 py-8 text-neutral-400", children: /* @__PURE__ */ l("div", { className: "mx-auto flex w-full max-w-300 flex-col gap-6", children: [
     /* @__PURE__ */ l("div", { className: "flex flex-col items-start gap-6 md:flex-row md:justify-between", children: [
-      i,
-      /* @__PURE__ */ e("div", { className: "flex gap-4", children: d?.map((a) => a) })
+      d,
+      /* @__PURE__ */ e("div", { className: "flex gap-4", children: i?.map((a) => a) })
     ] }),
     /* @__PURE__ */ e("div", { className: "h-px w-full bg-neutral-600" }),
-    /* @__PURE__ */ e("div", { className: "text-extra-small flex flex-wrap gap-4", children: c?.map((a) => a) }),
-    /* @__PURE__ */ e("p", { className: "text-extra-small text-neutral-400", children: x }),
+    /* @__PURE__ */ e("div", { className: "text-extra-small flex flex-wrap gap-4", children: x?.map((a) => a) }),
+    /* @__PURE__ */ e("p", { className: "text-extra-small text-neutral-400", children: c }),
     /* @__PURE__ */ e("p", { className: "text-extra-small text-neutral-400", children: n })
   ] }) })
 ] });

package/dist/components/Header2.d.ts

@@ -3,6 +3,6 @@ import { JSX } from 'react/jsx-runtime';
 export declare const Header2: ({ children, variant }: Header2Props) => JSX.Element;
 
 export interface Header2Props extends React.ComponentProps<'h2'> {
-    variant?: 'default' | 'legal' | 'tooltip' | 'about-us' | 'pricing' | 'unsubscribe' | 'cookies';
+    variant?: 'default' | 'legal' | 'ratafia' | 'tooltip' | 'about-us' | 'pricing' | 'unsubscribe' | 'cookies';
 }
 

package/dist/components/Header2.js

@@ -1,13 +1,14 @@
 import { jsx as a } from "react/jsx-runtime";
-import s from "clsx";
-const m = ({ children: e, variant: l = "default" }) => {
+import m from "clsx";
+const s = ({ children: e, variant: l = "default" }) => {
   const t = {
     default: "mt-5 mb-3 text-3xl text-gray-900",
     legal: "mt-5 -mx-ds-11xl mb-6 bg-white px-ds-11xl text-left text-neutral-800 text-3xl",
+    ratafia: "mt-4 mb-3 text-left text-xl font-bold text-white lg:text-2xl",
     unsubscribe: "mt-0 mb-0 w-full bg-white pb-4 pt-8 text-left text-3xl leading-tight text-neutral-900 font-sans tracking-tight md:text-4xl md:leading-8"
   }, x = t[l] ?? t.default;
-  return /* @__PURE__ */ a("h2", { className: s("font-bold", x), children: e });
+  return /* @__PURE__ */ a("h2", { className: m("font-bold", x), children: e });
 };
 export {
-  m as Header2
+  s as Header2
 };

package/dist/components/HowItWorksTemplate.d.ts

@@ -29,23 +29,31 @@ export declare type HowItWorksHeroBullet = {
     text: string;
 };
 
+export declare const howItWorksHeroCtaLinkClassName = "font-semibold text-white";
+
+export declare const howItWorksLawGeniusBelowStepsMarkdownClassName = "text-medium";
+
+export declare const howItWorksLawGeniusCtaLinkClassName = "font-semibold text-white";
+
 export declare type HowItWorksLawGeniusStep = {
     id: string;
     title: string;
-    description: string;
+    description: ReactNode;
     icon: ReactNode;
 };
 
 export declare type HowItWorksProcessStep = {
     id: string;
     title: string;
-    /** Column with text when not reversed; swap with image when `reverse` is true. */
     body: ReactNode;
     image: ReactNode;
     background: 'bg-white' | 'bg-neutral-25';
     reverse?: boolean;
+    imageFirstOnMobile?: boolean;
 };
 
+export declare const howItWorksResourcesCtaLinkClassName = "font-semibold";
+
 export declare const HowItWorksTemplate: FC<HowItWorksTemplateProps>;
 
 export declare interface HowItWorksTemplateProps {

package/dist/components/HowItWorksTemplate.js

@@ -1,128 +1,124 @@
-import { jsxs as a, jsx as e, Fragment as x } from "react/jsx-runtime";
-import { Button as c } from "./Button.js";
-import { IntroSection as u } from "./IntroSection.js";
+import { jsxs as a, jsx as e, Fragment as p } from "react/jsx-runtime";
+import { clsx as u } from "clsx";
+import { Button as r } from "./Button.js";
+import { IntroSection as g } from "./IntroSection.js";
 import { RatafiaSection as f } from "./RatafiaSection.js";
-import { TwoColumnSection as m } from "./TwoColumnSection.js";
-const g = ({ title: l, description: r, icon: s }) => /* @__PURE__ */ a("div", { className: "rounded-2xl bg-white/10 p-5", children: [
-  /* @__PURE__ */ a("div", { className: "flex items-center gap-3", children: [
-    /* @__PURE__ */ e("span", { className: "flex h-10 w-10 items-center justify-center rounded-full bg-white/20", children: s }),
-    /* @__PURE__ */ e("p", { className: "text-lg font-semibold", children: l })
+import { TwoColumnSection as o } from "./TwoColumnSection.js";
+const S = "font-semibold text-white", _ = "font-semibold text-white", j = "font-semibold", I = "text-medium", h = ({ title: t, description: n, icon: l }) => /* @__PURE__ */ a("div", { className: "bg-neutral-25 flex flex-col gap-2 rounded-sm p-6", children: [
+  /* @__PURE__ */ a("div", { className: "flex w-full items-start gap-2", children: [
+    /* @__PURE__ */ e("span", { className: "flex h-5 w-5 shrink-0 items-center justify-center [&_img]:h-5 [&_img]:w-5 [&_img]:object-contain [&_svg]:h-5 [&_svg]:w-5", children: l }),
+    /* @__PURE__ */ e("p", { className: "text-big min-w-0 flex-1 font-bold tracking-tight text-neutral-800", children: t })
   ] }),
-  /* @__PURE__ */ e("p", { className: "text-small mt-3 text-white/85", children: r })
-] }), h = (l) => {
-  const r = /* @__PURE__ */ a("div", { className: "space-y-5 text-neutral-800 lg:w-1/2", children: [
-    /* @__PURE__ */ e("h2", { className: "font-lora text-3xl font-bold text-neutral-800", children: l.title }),
-    /* @__PURE__ */ e("div", { className: "text-medium space-y-4 text-neutral-800", children: l.body })
-  ] }), s = /* @__PURE__ */ e("div", { className: "relative aspect-560/408 w-full overflow-hidden rounded-2xl shadow-[0_25px_60px_rgba(3,42,56,0.15)] lg:w-1/2", children: l.image });
-  return l.reverse ? { firstColumn: s, secondColumn: r } : { firstColumn: r, secondColumn: s };
-}, C = ({ hero: l, processSteps: r, lawGenius: s, resources: n }) => {
-  const o = {
+  /* @__PURE__ */ e("div", { className: "text-small w-full min-w-0 tracking-tight text-neutral-800 [&_p:last-child]:mb-0 [&_strong]:font-bold", children: n })
+] }), w = (t) => {
+  const n = /* @__PURE__ */ a("div", { className: "min-w-0 space-y-4 text-neutral-800 lg:basis-[47%]", children: [
+    /* @__PURE__ */ e("h2", { className: "font-lora text-[2.05rem] leading-[1.15] font-bold text-neutral-800", children: t.title }),
+    /* @__PURE__ */ e("div", { className: "text-small space-y-3 text-neutral-700", children: t.body })
+  ] }), l = /* @__PURE__ */ e("div", { className: "w-full shrink-0 lg:w-1/2 lg:max-w-[50%]", children: t.image });
+  return t.reverse ? { firstColumn: l, secondColumn: n } : { firstColumn: n, secondColumn: l };
+}, L = ({ hero: t, processSteps: n, lawGenius: l, resources: m }) => {
+  const c = {
     size: "large",
-    variant: "primary-white",
-    className: "text-medium w-full justify-center font-bold text-primary-900 lg:w-auto",
-    ...s.cta
-  }, { examples: i } = n;
-  return /* @__PURE__ */ a("main", { className: "flex flex-1 flex-col", children: [
-    /* @__PURE__ */ e("section", { className: "bg-primary-50 px-6 py-16 sm:px-10 lg:px-24", children: /* @__PURE__ */ a("div", { className: "mx-auto flex max-w-6xl flex-col gap-12", children: [
+    variant: "primary-green",
+    className: "!rounded-md text-medium w-full justify-center font-bold lg:w-auto",
+    ...l.cta
+  }, { examples: i } = m;
+  return /* @__PURE__ */ a("main", { className: "flex w-full max-w-full min-w-0 flex-1 flex-col", children: [
+    /* @__PURE__ */ e("section", { className: "bg-primary-50 lg:px-ds-10xl px-6 pt-4 pb-12 sm:px-10", children: /* @__PURE__ */ a("div", { className: "mx-auto flex max-w-6xl flex-col gap-12", children: [
       /* @__PURE__ */ a("div", { className: "text-center", children: [
-        /* @__PURE__ */ e("p", { className: "text-small font-semibold tracking-[0.3em] text-neutral-600 uppercase", children: l.eyebrow }),
-        /* @__PURE__ */ e("h1", { className: "font-lora mt-3 text-4xl text-neutral-800 sm:text-5xl", children: l.title })
+        /* @__PURE__ */ a("div", { className: "mx-auto inline-flex max-w-full flex-col items-center gap-2", children: [
+          /* @__PURE__ */ e("p", { className: "text-small font-semibold tracking-[0.3em] whitespace-nowrap text-neutral-600 uppercase", children: t.eyebrow }),
+          /* @__PURE__ */ e("span", { className: "h-px w-full max-w-[7.5rem] min-w-[5.5rem] shrink-0 bg-neutral-400", "aria-hidden": !0 })
+        ] }),
+        /* @__PURE__ */ e("h1", { className: "font-lora mx-auto mt-12 max-w-[48rem] text-4xl leading-tight font-bold tracking-tight text-neutral-800 sm:text-5xl sm:leading-tight", children: t.title })
       ] }),
       /* @__PURE__ */ e(
-        u,
+        g,
         {
           className: "bg-transparent",
-          containerClassName: "w-full !max-w-none flex-col gap-10 !px-0 !py-0 lg:flex-row lg:items-center",
-          image: l.image,
+          containerClassName: "w-full !max-w-none flex-col gap-10 !px-0 !py-0 lg:flex-row lg:items-stretch",
+          image: t.image,
           cta: {
             size: "large",
-            variant: "primary-darkgreen",
+            variant: "primary-green",
             className: "text-medium mt-8 w-full justify-center font-bold",
-            ...l.cta
+            ...t.cta
           },
-          children: /* @__PURE__ */ a("div", { className: "text-medium space-y-4", children: [
-            l.intro,
-            /* @__PURE__ */ e("ul", { className: "text-medium space-y-3", children: l.bullets.map((t) => /* @__PURE__ */ a("li", { className: "flex items-start gap-2", children: [
-              /* @__PURE__ */ e("span", { className: "bg-primary-600 mt-1 h-2.5 w-2.5 rounded-full", "aria-hidden": !0 }),
+          children: /* @__PURE__ */ a("div", { className: "text-medium space-y-4 [&_ul]:my-8 [&_ul]:list-disc [&_ul]:pl-[1.2rem]", children: [
+            t.intro,
+            /* @__PURE__ */ e("ul", { className: "text-medium space-y-3", children: t.bullets.map((s) => /* @__PURE__ */ a("li", { className: "flex items-start gap-2", children: [
+              /* @__PURE__ */ e("span", { className: "bg-primary-600 mt-1 h-2.5 w-2.5", "aria-hidden": !0 }),
               /* @__PURE__ */ a("span", { children: [
                 /* @__PURE__ */ a("strong", { children: [
-                  t.strong,
+                  s.strong,
                   " "
                 ] }),
-                t.text
+                s.text
               ] })
-            ] }, t.id)) }),
-            l.closing
+            ] }, s.id)) }),
+            t.closing
           ] })
         }
       )
     ] }) }),
-    r.map((t) => {
-      const { firstColumn: d, secondColumn: p } = h(t);
+    n.map((s) => {
+      const { firstColumn: d, secondColumn: x } = w(s);
       return /* @__PURE__ */ e(
-        m,
+        o,
         {
-          className: `${t.background} px-6 py-16 sm:px-10 lg:px-24`,
-          containerClassName: "w-full !max-w-6xl flex-col gap-10 !px-0 !py-0 lg:flex-row lg:items-center",
+          className: `${s.background} lg:px-ds-10xl px-6 py-12 sm:px-10`,
+          containerClassName: u(
+            "!mx-auto !w-full !max-w-6xl !px-0 !py-0 !gap-8 md:!gap-10 lg:items-start",
+            s.imageFirstOnMobile ? "!flex-col-reverse md:!flex-row" : "!flex-col md:!flex-row"
+          ),
           firstColumn: d,
-          secondColumn: p
+          secondColumn: x
         },
-        t.id
+        s.id
       );
     }),
     /* @__PURE__ */ e(
       f,
       {
-        title: s.title,
-        content: s.content,
-        stepsSlot: /* @__PURE__ */ e(x, { children: s.steps.map((t) => /* @__PURE__ */ e(g, { ...t }, t.id)) }),
-        belowStepsSlot: s.belowStepsSlot,
-        cta: /* @__PURE__ */ e(c, { ...o }),
+        title: l.title,
+        content: l.content,
+        stepsSlot: /* @__PURE__ */ e(p, { children: l.steps.map((s) => /* @__PURE__ */ e(h, { ...s }, s.id)) }),
+        belowStepsSlot: l.belowStepsSlot,
+        cta: /* @__PURE__ */ e(r, { ...c }),
         skipCtaWrapper: !0,
-        image: s.image,
-        sectionClassName: s.sectionClassName ?? "bg-primary-50 px-6 py-16 sm:px-10 lg:px-24 xl:px-0"
+        image: l.image,
+        sectionClassName: l.sectionClassName ?? "bg-neutral-25 px-6 pb-12 pt-16 sm:px-10 lg:px-ds-10xl"
       }
     ),
-    /* @__PURE__ */ e("section", { className: "bg-white px-6 py-16 sm:px-10 lg:px-24", children: /* @__PURE__ */ e(
-      m,
+    /* @__PURE__ */ e(
+      o,
       {
-        className: "bg-transparent",
-        containerClassName: "w-full !max-w-6xl flex-col gap-10 !px-0 !py-0 lg:flex-row lg:items-stretch",
-        firstColumn: /* @__PURE__ */ a("div", { className: "space-y-6 rounded-3xl border border-neutral-100 p-8 shadow-[0_20px_60px_rgba(3,42,56,0.12)] lg:w-1/2", children: [
-          /* @__PURE__ */ a("div", { children: [
-            /* @__PURE__ */ e("p", { className: "text-sm font-semibold tracking-[0.2em] text-neutral-500 uppercase", children: i.eyebrow }),
-            /* @__PURE__ */ e("h3", { className: "mt-2 text-3xl font-bold text-neutral-800", children: i.title })
-          ] }),
-          /* @__PURE__ */ e("div", { className: "space-y-4", children: i.rows.map((t) => /* @__PURE__ */ a(
-            "div",
-            {
-              className: "text-medium flex items-center justify-between border-b border-neutral-100 pb-3",
-              children: [
-                /* @__PURE__ */ e("span", { className: "text-neutral-500", children: t.label }),
-                /* @__PURE__ */ e("span", { className: "font-semibold text-neutral-900", children: t.value })
-              ]
-            },
-            t.label
-          )) }),
-          /* @__PURE__ */ e("div", { className: "bg-neutral-25 rounded-2xl p-4 text-neutral-700", children: i.footer })
-        ] }),
-        secondColumn: /* @__PURE__ */ a("div", { className: "bg-neutral-25 space-y-6 rounded-3xl p-8 shadow-[0_25px_70px_rgba(3,42,56,0.15)] lg:w-1/2", children: [
-          /* @__PURE__ */ e("div", { className: "relative aspect-420/306 w-full overflow-hidden rounded-2xl", children: n.image }),
-          /* @__PURE__ */ e("div", { className: "space-y-4 text-neutral-800", children: n.supportBody }),
+        className: "bg-neutral-25 lg:px-ds-10xl px-6 py-12 sm:px-10",
+        containerClassName: "!mx-auto !w-full !max-w-6xl !items-start !gap-8 !px-0 !py-0 md:!gap-10 lg:!items-stretch",
+        firstColumn: /* @__PURE__ */ e("div", { className: "w-full min-w-0 shrink-0 rounded-2xl border border-neutral-100 bg-white p-4 lg:basis-[48%] lg:p-5", children: m.image }),
+        secondColumn: /* @__PURE__ */ a("div", { className: "w-full space-y-4 lg:basis-[52%]", children: [
+          i.eyebrow && /* @__PURE__ */ e("p", { className: "text-xs font-semibold tracking-[0.2em] text-neutral-500 uppercase", children: i.eyebrow }),
+          i.title && /* @__PURE__ */ e("h3", { className: "font-lora text-[2rem] leading-[1.2] font-bold text-neutral-800", children: i.title }),
+          /* @__PURE__ */ e("div", { className: "text-small space-y-3 text-neutral-700", children: m.supportBody }),
+          i.footer && /* @__PURE__ */ e("p", { className: "text-small text-neutral-600", children: i.footer }),
           /* @__PURE__ */ e(
-            c,
+            r,
             {
-              size: "large",
-              variant: "primary-darkgreen",
-              className: "text-medium w-full justify-center font-bold",
-              ...n.cta
+              size: "small",
+              variant: "primary-green",
+              className: "text-small inline-flex w-auto justify-center font-bold",
+              ...m.cta
             }
           )
         ] })
       }
-    ) })
+    )
   ] });
 };
 export {
-  C as HowItWorksTemplate
+  L as HowItWorksTemplate,
+  S as howItWorksHeroCtaLinkClassName,
+  I as howItWorksLawGeniusBelowStepsMarkdownClassName,
+  _ as howItWorksLawGeniusCtaLinkClassName,
+  j as howItWorksResourcesCtaLinkClassName
 };

package/dist/components/InfoIcon.js

@@ -1,14 +1,14 @@
 import { jsx as l } from "react/jsx-runtime";
 import "react";
-const i = (C) => /* @__PURE__ */ l("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...C, children: /* @__PURE__ */ l(
+const o = (C) => /* @__PURE__ */ l("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...C, children: /* @__PURE__ */ l(
   "path",
   {
     fillRule: "evenodd",
     clipRule: "evenodd",
     d: "M2 12C2 6.47 6.47 2 12 2C17.53 2 22 6.47 22 12C22 17.53 17.53 22 12 22C6.47 22 2 17.53 2 12ZM4 12C4 16.41 7.59 20 12 20C16.41 20 20 16.41 20 12C20 7.59 16.41 4 12 4C7.59 4 4 7.59 4 12ZM11 12C11 11.4477 11.4477 11 12 11C12.5523 11 13 11.4477 13 12V16C13 16.5523 12.5523 17 12 17C11.4477 17 11 16.5523 11 16V12ZM12 7C11.4477 7 11 7.44772 11 8C11 8.55228 11.4477 9 12 9C12.5523 9 13 8.55228 13 8C13 7.44772 12.5523 7 12 7Z",
-    fill: C.fill ?? "var(--color-neutral-900)"
+    fill: C.fill ?? "#1E2021"
   }
 ) });
 export {
-  i as InfoIcon
+  o as InfoIcon
 };