@dmitriikapustin/ui 0.1.0 → 0.2.1

package/dist/index.cjs

@@ -40,6 +40,12 @@ var __objRest = (source, exclude) => {
     }
   return target;
 };
+
+// src/atoms/Spinner.module.scss
+var Spinner_module_default = {
+  root: "Spinner_module_root",
+  fallback: "Spinner_module_fallback"
+};
 var sizeMap = {
   sm: 32,
   md: 48,
@@ -47,7 +53,7 @@ var sizeMap = {
 };
 var cachedData = null;
 function Spinner({ size = "md", className = "" }) {
-  const s = sizeMap[size];
+  const px = sizeMap[size];
   const [data, setData] = react.useState(() => cachedData);
   react.useEffect(() => {
     if (data) return;
@@ -66,8 +72,8 @@ function Spinner({ size = "md", className = "" }) {
   return /* @__PURE__ */ jsxRuntime.jsx(
     "div",
     {
-      className: `inline-flex items-center justify-center ${className}`,
-      style: { width: s, height: s },
+      className: `${Spinner_module_default.root} ${className}`,
+      style: { width: px, height: px },
       "aria-label": "Loading",
       children: data ? /* @__PURE__ */ jsxRuntime.jsx(
         Lottie__default.default,
@@ -75,27 +81,29 @@ function Spinner({ size = "md", className = "" }) {
           animationData: data,
           loop: true,
           autoplay: true,
-          style: { width: s, height: s }
+          style: { width: px, height: px }
         }
       ) : /* @__PURE__ */ jsxRuntime.jsx(
         "div",
         {
-          className: "rounded-full border-2 border-[var(--border-color)] border-t-[var(--fg)] animate-spin",
-          style: { width: s * 0.7, height: s * 0.7 }
+          className: Spinner_module_default.fallback,
+          style: { width: px * 0.7, height: px * 0.7 }
         }
       )
     }
   );
 }
-var variantStyles = {
-  primary: "bg-[var(--fg)] text-[var(--bg)] border border-[var(--bg)] hover:opacity-90 active:opacity-80 shadow-[var(--shadow-sm)]",
-  secondary: "bg-[var(--bg-tertiary)] text-[var(--fg)] hover:bg-[var(--border-color)] active:bg-[var(--border-color-strong)]",
-  outline: "border border-[var(--fg-secondary)] text-[var(--fg-secondary)] hover:bg-[var(--bg-tertiary)] active:bg-[var(--border-color)]",
-  ghost: "text-[var(--fg-secondary)] hover:text-[var(--fg)] hover:bg-[var(--bg-tertiary)] active:bg-[var(--border-color)]"
-};
-var sizeStyles = {
-  sm: "text-[13px] px-4 py-2 gap-1.5 rounded-full tracking-[-0.25px]",
-  md: "text-[13px] px-4 py-2 gap-2 rounded-full tracking-[-0.25px]"
+
+// src/atoms/Button.module.scss
+var Button_module_default = {
+  root: "Button_module_root",
+  primary: "Button_module_primary",
+  secondary: "Button_module_secondary",
+  outline: "Button_module_outline",
+  ghost: "Button_module_ghost",
+  sm: "Button_module_sm",
+  md: "Button_module_md",
+  disabled: "Button_module_disabled"
 };
 function Button(_a) {
   var _b = _a, {
@@ -120,7 +128,7 @@ function Button(_a) {
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "button",
     __spreadProps(__spreadValues({
-      className: `inline-flex items-center justify-center font-medium transition-all duration-[var(--transition-fast)] cursor-pointer select-none whitespace-nowrap ${variantStyles[variant]} ${sizeStyles[size]} ${disabled || loading ? "opacity-50 cursor-not-allowed pointer-events-none" : ""} ${className}`,
+      className: `${Button_module_default.root} ${Button_module_default[variant]} ${Button_module_default[size]}${disabled || loading ? ` ${Button_module_default.disabled}` : ""}${className ? ` ${className}` : ""}`,
       disabled: disabled || loading
     }, props), {
       children: [
@@ -131,6 +139,20 @@ function Button(_a) {
     })
   );
 }
+
+// src/atoms/Input.module.scss
+var Input_module_default = {
+  wrapper: "Input_module_wrapper",
+  label: "Input_module_label",
+  inputWrap: "Input_module_inputWrap",
+  input: "Input_module_input",
+  hasIconLeft: "Input_module_hasIconLeft",
+  hasIconRight: "Input_module_hasIconRight",
+  iconLeft: "Input_module_iconLeft",
+  iconRight: "Input_module_iconRight",
+  error: "Input_module_error",
+  errorText: "Input_module_errorText"
+};
 function Input(_a) {
   var _b = _a, {
     label,
@@ -148,41 +170,37 @@ function Input(_a) {
     "id"
   ]);
   const inputId = id || (label == null ? void 0 : label.toLowerCase().replace(/\s+/g, "-"));
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-1.5", children: [
-    label && /* @__PURE__ */ jsxRuntime.jsx(
-      "label",
-      {
-        htmlFor: inputId,
-        className: "text-[13px] font-medium text-[var(--fg)] tracking-[-0.25px]",
-        children: label
-      }
-    ),
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
-      icon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute left-3.5 top-1/2 -translate-y-1/2 text-[var(--fg-muted)]", children: icon }),
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: Input_module_default.wrapper, children: [
+    label && /* @__PURE__ */ jsxRuntime.jsx("label", { htmlFor: inputId, className: Input_module_default.label, children: label }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: Input_module_default.inputWrap, children: [
+      icon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: Input_module_default.iconLeft, children: icon }),
       /* @__PURE__ */ jsxRuntime.jsx(
         "input",
         __spreadValues({
           id: inputId,
-          className: `w-full border border-[var(--fg-muted)] bg-[var(--bg)] px-[15px] py-3 text-[13px] tracking-[-0.25px] text-[var(--fg-secondary)] placeholder:text-[var(--fg-muted)] transition-all duration-[var(--transition-fast)] focus:outline-none focus:border-[var(--fg)] rounded-full ${icon ? "pl-10" : ""} ${iconRight ? "pr-10" : ""} ${error ? "border-[var(--color-error)] focus:border-[var(--color-error)]" : ""} ${className}`
+          className: `${Input_module_default.input}${icon ? ` ${Input_module_default.hasIconLeft}` : ""}${iconRight ? ` ${Input_module_default.hasIconRight}` : ""}${error ? ` ${Input_module_default.error}` : ""}${className ? ` ${className}` : ""}`
         }, props)
       ),
-      iconRight && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute right-3.5 top-1/2 -translate-y-1/2 text-[var(--fg-muted)]", children: iconRight })
+      iconRight && /* @__PURE__ */ jsxRuntime.jsx("span", { className: Input_module_default.iconRight, children: iconRight })
     ] }),
-    error && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-[13px] tracking-[-0.25px] text-[var(--color-error)]", children: error })
+    error && /* @__PURE__ */ jsxRuntime.jsx("p", { className: Input_module_default.errorText, children: error })
   ] });
 }
-var colorStyles = {
-  default: "bg-[var(--bg-tertiary)] text-[var(--fg)]",
-  success: "bg-[var(--bg-tertiary)] text-[var(--color-success)]",
-  warning: "bg-[var(--bg-tertiary)] text-[var(--color-warning)]",
-  error: "bg-[var(--bg-tertiary)] text-[var(--color-error)]",
-  info: "bg-[var(--bg-tertiary)] text-[var(--color-info)]"
+
+// src/atoms/Badge.module.scss
+var Badge_module_default = {
+  root: "Badge_module_root",
+  default: "Badge_module_default",
+  success: "Badge_module_success",
+  warning: "Badge_module_warning",
+  error: "Badge_module_error",
+  info: "Badge_module_info"
 };
 function Badge({ color = "default", children, className = "" }) {
   return /* @__PURE__ */ jsxRuntime.jsx(
     "span",
     {
-      className: `inline-flex items-center px-2.5 py-0.5 rounded-full text-[13px] font-semibold tracking-[-0.25px] ${colorStyles[color]} ${className}`,
+      className: `${Badge_module_default.root} ${Badge_module_default[color]}${className ? ` ${className}` : ""}`,
       children
     }
   );
@@ -220,71 +238,108 @@ var IconlyEye = IconlyActivity;
 var IconlyEyeOff = IconlyActivity;
 var IconlyChevronRight = IconlyActivity;
 var IconlyChevronLeft = IconlyActivity;
-var colorStyles2 = {
-  default: "bg-[var(--bg-tertiary)] text-[var(--fg-secondary)] border-[var(--border-color)]",
-  primary: "bg-[var(--bg-tertiary)] text-[var(--fg)] border-[var(--border-color-strong)]",
-  success: "bg-[var(--bg-tertiary)] text-[var(--color-success)] border-[var(--border-color)]",
-  warning: "bg-[var(--bg-tertiary)] text-[var(--color-warning)] border-[var(--border-color)]",
-  error: "bg-[var(--bg-tertiary)] text-[var(--color-error)] border-[var(--border-color)]"
+
+// src/atoms/Tag.module.scss
+var Tag_module_default = {
+  root: "Tag_module_root",
+  default: "Tag_module_default",
+  primary: "Tag_module_primary",
+  success: "Tag_module_success",
+  warning: "Tag_module_warning",
+  error: "Tag_module_error",
+  closeBtn: "Tag_module_closeBtn"
 };
 function Tag({ color = "default", closable = false, onClose, children, className = "" }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("span", { className: `${Tag_module_default.root} ${Tag_module_default[color]} ${className}`, children: [
+    children,
+    closable && /* @__PURE__ */ jsxRuntime.jsx(
+      "button",
+      {
+        onClick: onClose,
+        className: Tag_module_default.closeBtn,
+        "aria-label": "Remove tag",
+        children: /* @__PURE__ */ jsxRuntime.jsx(IconlyClose, { size: 12 })
+      }
+    )
+  ] });
+}
+
+// src/atoms/Toggle.module.scss
+var Toggle_module_default = {
+  root: "Toggle_module_root",
+  track: "Toggle_module_track",
+  trackOn: "Toggle_module_trackOn",
+  trackOff: "Toggle_module_trackOff",
+  knob: "Toggle_module_knob",
+  knobOn: "Toggle_module_knobOn",
+  knobOff: "Toggle_module_knobOff",
+  label: "Toggle_module_label",
+  disabled: "Toggle_module_disabled"
+};
+function Toggle({
+  checked = false,
+  onChange,
+  label,
+  disabled = false,
+  className = ""
+}) {
   return /* @__PURE__ */ jsxRuntime.jsxs(
-    "span",
+    "label",
     {
-      className: `inline-flex items-center gap-1.5 px-3 py-1 rounded-full text-[13px] font-medium tracking-[-0.25px] border ${colorStyles2[color]} ${className}`,
+      className: `${Toggle_module_default.root}${disabled ? ` ${Toggle_module_default.disabled}` : ""}${className ? ` ${className}` : ""}`,
       children: [
-        children,
-        closable && /* @__PURE__ */ jsxRuntime.jsx(
+        /* @__PURE__ */ jsxRuntime.jsx(
           "button",
           {
-            onClick: onClose,
-            className: "hover:opacity-70 transition-opacity cursor-pointer",
-            "aria-label": "Remove tag",
-            children: /* @__PURE__ */ jsxRuntime.jsx(IconlyClose, { size: 12 })
+            role: "switch",
+            type: "button",
+            "aria-checked": checked,
+            disabled,
+            onClick: () => onChange == null ? void 0 : onChange(!checked),
+            className: `${Toggle_module_default.track} ${checked ? Toggle_module_default.trackOn : Toggle_module_default.trackOff}${disabled ? ` ${Toggle_module_default.disabled}` : ""}`,
+            children: /* @__PURE__ */ jsxRuntime.jsx(
+              "span",
+              {
+                className: `${Toggle_module_default.knob} ${checked ? Toggle_module_default.knobOn : Toggle_module_default.knobOff}`
+              }
+            )
           }
-        )
+        ),
+        label && /* @__PURE__ */ jsxRuntime.jsx("span", { className: Toggle_module_default.label, children: label })
       ]
     }
   );
 }
-function Toggle({ checked = false, onChange, label, disabled = false, className = "" }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs("label", { className: `inline-flex items-center gap-2.5 ${disabled ? "opacity-50 cursor-not-allowed" : "cursor-pointer"} ${className}`, children: [
-    /* @__PURE__ */ jsxRuntime.jsx(
-      "button",
-      {
-        role: "switch",
-        type: "button",
-        "aria-checked": checked,
-        disabled,
-        onClick: () => onChange == null ? void 0 : onChange(!checked),
-        className: `relative inline-flex h-6 w-11 shrink-0 items-center rounded-full px-0.5 transition-colors duration-200 ease-in-out focus:outline-none cursor-pointer ${checked ? "bg-[var(--color-accent)] justify-end" : "bg-[var(--border-color)]"} ${disabled ? "cursor-not-allowed" : ""}`,
-        children: /* @__PURE__ */ jsxRuntime.jsx(
-          "span",
-          {
-            className: "pointer-events-none inline-block h-5 w-5 rounded-full bg-white transition-transform duration-200 ease-in-out"
-          }
-        )
-      }
-    ),
-    label && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[13px] font-medium text-[var(--fg)] tracking-[-0.25px]", children: label })
-  ] });
-}
-var sizeMap2 = {
-  sm: { container: "w-8 h-8", text: "text-xs" },
-  md: { container: "w-10 h-10", text: "text-sm" },
-  lg: { container: "w-12 h-12", text: "text-base" },
-  xl: { container: "w-16 h-16", text: "text-lg" }
+
+// src/atoms/Avatar.module.scss
+var Avatar_module_default = {
+  root: "Avatar_module_root",
+  initials: "Avatar_module_initials",
+  initialsText: "Avatar_module_initialsText",
+  sm: "Avatar_module_sm",
+  md: "Avatar_module_md",
+  lg: "Avatar_module_lg",
+  xl: "Avatar_module_xl",
+  textSm: "Avatar_module_textSm",
+  textMd: "Avatar_module_textMd",
+  textLg: "Avatar_module_textLg",
+  textXl: "Avatar_module_textXl"
+};
+var textSizeMap = {
+  sm: Avatar_module_default.textSm,
+  md: Avatar_module_default.textMd,
+  lg: Avatar_module_default.textLg,
+  xl: Avatar_module_default.textXl
 };
 function Avatar(_a) {
   var _b = _a, { src, alt = "", initials, size = "md", className = "" } = _b, props = __objRest(_b, ["src", "alt", "initials", "size", "className"]);
-  const s = sizeMap2[size];
   if (!src && initials) {
     return /* @__PURE__ */ jsxRuntime.jsx(
       "div",
       {
-        className: `${s.container} rounded-full bg-[var(--bg-tertiary)] border border-[var(--border-color)] flex items-center justify-center ${className}`,
+        className: `${Avatar_module_default.initials} ${Avatar_module_default[size]}${className ? ` ${className}` : ""}`,
         "aria-label": alt || initials,
-        children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: `${s.text} font-medium text-[var(--fg-secondary)] select-none`, children: initials })
+        children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: `${Avatar_module_default.initialsText} ${textSizeMap[size]}`, children: initials })
       }
     );
   }
@@ -296,37 +351,59 @@ function Avatar(_a) {
       __spreadValues({
         src: imgSrc,
         alt,
-        className: `${s.container} rounded-full object-cover ${className}`
+        className: `${Avatar_module_default.root} ${Avatar_module_default[size]}${className ? ` ${className}` : ""}`
       }, props)
     )
   );
 }
+
+// src/atoms/Divider.module.scss
+var Divider_module_default = {
+  root: "Divider_module_root",
+  withLabel: "Divider_module_withLabel",
+  line: "Divider_module_line",
+  label: "Divider_module_label"
+};
 function Divider({ className = "", label }) {
   if (label) {
-    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `flex items-center gap-4 ${className}`, children: [
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 h-px bg-[var(--border-color)]" }),
-      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs font-medium text-[var(--fg-muted)] uppercase tracking-wider", children: label }),
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 h-px bg-[var(--border-color)]" })
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `${Divider_module_default.withLabel}${className ? ` ${className}` : ""}`, children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: Divider_module_default.line }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: Divider_module_default.label, children: label }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: Divider_module_default.line })
     ] });
   }
-  return /* @__PURE__ */ jsxRuntime.jsx("hr", { className: `border-none h-px bg-[var(--border-color)] ${className}` });
+  return /* @__PURE__ */ jsxRuntime.jsx("hr", { className: `${Divider_module_default.root}${className ? ` ${className}` : ""}` });
 }
-function MenuItem({ text, active = false, onClick, className = "" }) {
-  return /* @__PURE__ */ jsxRuntime.jsx(
+
+// src/atoms/MenuItem.module.scss
+var MenuItem_module_default = {
+  root: "MenuItem_module_root",
+  icon: "MenuItem_module_icon",
+  active: "MenuItem_module_active"
+};
+function MenuItem({ text, active = false, onClick, className = "", icon }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
     "button",
     {
       onClick,
-      className: `inline-flex items-center px-[4px] py-[2px] text-[13px] font-medium tracking-[-0.25px] cursor-pointer border-none text-left whitespace-nowrap transition-colors duration-150 ${active ? "bg-[var(--bg-secondary)] text-[var(--fg)]" : "bg-transparent text-[var(--fg-muted)] hover:text-[var(--fg-secondary)]"} ${className}`,
-      children: text
+      className: `${MenuItem_module_default.root}${active ? ` ${MenuItem_module_default.active}` : ""}${className ? ` ${className}` : ""}`,
+      children: [
+        icon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: MenuItem_module_default.icon, children: icon }),
+        text
+      ]
     }
   );
 }
-var variantStyles2 = {
-  primary: "bg-[var(--fg)] text-[var(--bg)] border border-[var(--bg)] shadow-[var(--shadow-sm)]",
-  secondary: "bg-[var(--bg-tertiary)] text-[var(--fg-secondary)]",
-  clear: "bg-transparent text-[var(--fg-secondary)] shadow-[var(--shadow-sm)]",
-  disabled: "bg-[var(--bg-tertiary)] text-[var(--fg-muted)] opacity-50 cursor-not-allowed",
-  contrast: "bg-[var(--border-color)] text-[var(--fg-secondary)]"
+
+// src/atoms/IconButton.module.scss
+var IconButton_module_default = {
+  root: "IconButton_module_root",
+  primary: "IconButton_module_primary",
+  secondary: "IconButton_module_secondary",
+  clear: "IconButton_module_clear",
+  disabled: "IconButton_module_disabled",
+  contrast: "IconButton_module_contrast",
+  isDisabled: "IconButton_module_isDisabled"
 };
 function IconButton(_a) {
   var _b = _a, { icon, variant = "primary", className = "", disabled } = _b, props = __objRest(_b, ["icon", "variant", "className", "disabled"]);
@@ -334,34 +411,57 @@ function IconButton(_a) {
   return /* @__PURE__ */ jsxRuntime.jsx(
     "button",
     __spreadProps(__spreadValues({
-      className: `inline-flex items-center justify-center w-9 h-9 rounded-full transition-all duration-[var(--transition-fast)] cursor-pointer shrink-0 ${variantStyles2[variant]} ${isDisabled ? "cursor-not-allowed" : ""} ${className}`,
+      className: `${IconButton_module_default.root} ${IconButton_module_default[variant]}${isDisabled ? ` ${IconButton_module_default.isDisabled}` : ""}${className ? ` ${className}` : ""}`,
       disabled: isDisabled
     }, props), {
       children: icon
     })
   );
 }
+
+// src/atoms/Logo.module.scss
+var Logo_module_default = {
+  short: "Logo_module_short",
+  full: "Logo_module_full",
+  third: "Logo_module_third",
+  thirdText: "Logo_module_thirdText"
+};
 function Logo({ version = "short", className = "" }) {
   if (version === "short") {
-    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: `w-[19px] h-5 ${className}`, children: /* @__PURE__ */ jsxRuntime.jsx("img", { className: "logo-img", src: "/assets/logos/logo-short.svg", alt: "aiacade.me", width: 19, height: 20 }) });
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${Logo_module_default.short}${className ? ` ${className}` : ""}`, children: /* @__PURE__ */ jsxRuntime.jsx("img", { className: "logo-img", src: "/assets/logos/logo-short.svg", alt: "aiacade.me", width: 19, height: 20 }) });
   }
   if (version === "third") {
-    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `flex items-center gap-1.5 ${className}`, children: [
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `${Logo_module_default.third}${className ? ` ${className}` : ""}`, children: [
       /* @__PURE__ */ jsxRuntime.jsx("img", { className: "logo-img", src: "/assets/logos/logo-icon.svg", alt: "", width: 20, height: 20 }),
-      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[13px] font-medium text-[var(--fg)] tracking-[-0.25px]", children: "aiacade.me" })
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: Logo_module_default.thirdText, children: "aiacade.me" })
     ] });
   }
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: `h-5 w-[130px] ${className}`, children: /* @__PURE__ */ jsxRuntime.jsx("img", { className: "logo-img", src: "/assets/logos/logo-full.svg", alt: "aiacade.me", width: 130, height: 20 }) });
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${Logo_module_default.full}${className ? ` ${className}` : ""}`, children: /* @__PURE__ */ jsxRuntime.jsx("img", { className: "logo-img", src: "/assets/logos/logo-full.svg", alt: "aiacade.me", width: 130, height: 20 }) });
 }
+
+// src/atoms/StatBadge.module.scss
+var StatBadge_module_default = {
+  root: "StatBadge_module_root",
+  bracket: "StatBadge_module_bracket"
+};
 function StatBadge({ value, suffix, showBrackets = false, className = "" }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs("span", { className: `inline-flex items-center text-[13px] font-medium text-[var(--fg-secondary)] tracking-[-0.25px] whitespace-nowrap ${className}`, children: [
-    showBrackets && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[var(--fg-muted)]", children: "[ " }),
+  return /* @__PURE__ */ jsxRuntime.jsxs("span", { className: `${StatBadge_module_default.root}${className ? ` ${className}` : ""}`, children: [
+    showBrackets && /* @__PURE__ */ jsxRuntime.jsx("span", { className: StatBadge_module_default.bracket, children: "[ " }),
     value,
     " ",
     suffix,
-    showBrackets && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[var(--fg-muted)]", children: " ]" })
+    showBrackets && /* @__PURE__ */ jsxRuntime.jsx("span", { className: StatBadge_module_default.bracket, children: " ]" })
   ] });
 }
+
+// src/atoms/Textarea.module.scss
+var Textarea_module_default = {
+  wrapper: "Textarea_module_wrapper",
+  label: "Textarea_module_label",
+  textarea: "Textarea_module_textarea",
+  error: "Textarea_module_error",
+  errorText: "Textarea_module_errorText"
+};
 function Textarea(_a) {
   var _b = _a, {
     label,
@@ -377,26 +477,30 @@ function Textarea(_a) {
     "rows"
   ]);
   const textareaId = id || (label == null ? void 0 : label.toLowerCase().replace(/\s+/g, "-"));
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-1.5", children: [
-    label && /* @__PURE__ */ jsxRuntime.jsx(
-      "label",
-      {
-        htmlFor: textareaId,
-        className: "text-[13px] font-medium text-[var(--fg)] tracking-[-0.25px]",
-        children: label
-      }
-    ),
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: Textarea_module_default.wrapper, children: [
+    label && /* @__PURE__ */ jsxRuntime.jsx("label", { htmlFor: textareaId, className: Textarea_module_default.label, children: label }),
     /* @__PURE__ */ jsxRuntime.jsx(
       "textarea",
       __spreadValues({
         id: textareaId,
         rows,
-        className: `w-full border border-[var(--fg-muted)] bg-[var(--bg)] px-[15px] py-3 text-[13px] tracking-[-0.25px] text-[var(--fg-secondary)] placeholder:text-[var(--fg-muted)] transition-all duration-[var(--transition-fast)] focus:outline-none focus:border-[var(--fg)] rounded-[var(--radius-lg)] resize-vertical ${error ? "border-[var(--color-error)] focus:border-[var(--color-error)]" : ""} ${className}`
+        className: `${Textarea_module_default.textarea}${error ? ` ${Textarea_module_default.error}` : ""}${className ? ` ${className}` : ""}`
       }, props)
     ),
-    error && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-[13px] tracking-[-0.25px] text-[var(--color-error)]", children: error })
+    error && /* @__PURE__ */ jsxRuntime.jsx("p", { className: Textarea_module_default.errorText, children: error })
   ] });
 }
+
+// src/atoms/Select.module.scss
+var Select_module_default = {
+  wrapper: "Select_module_wrapper",
+  label: "Select_module_label",
+  selectWrap: "Select_module_selectWrap",
+  select: "Select_module_select",
+  chevron: "Select_module_chevron",
+  error: "Select_module_error",
+  errorText: "Select_module_errorText"
+};
 function Select(_a) {
   var _b = _a, {
     label,
@@ -414,21 +518,14 @@ function Select(_a) {
     "id"
   ]);
   const selectId = id || (label == null ? void 0 : label.toLowerCase().replace(/\s+/g, "-"));
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-1.5", children: [
-    label && /* @__PURE__ */ jsxRuntime.jsx(
-      "label",
-      {
-        htmlFor: selectId,
-        className: "text-[13px] font-medium text-[var(--fg)] tracking-[-0.25px]",
-        children: label
-      }
-    ),
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: Select_module_default.wrapper, children: [
+    label && /* @__PURE__ */ jsxRuntime.jsx("label", { htmlFor: selectId, className: Select_module_default.label, children: label }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: Select_module_default.selectWrap, children: [
       /* @__PURE__ */ jsxRuntime.jsxs(
         "select",
         __spreadProps(__spreadValues(__spreadValues({
           id: selectId,
-          className: `w-full appearance-none border border-[var(--fg-muted)] bg-[var(--bg)] px-[15px] py-3 pr-10 text-[13px] tracking-[-0.25px] text-[var(--fg-secondary)] transition-all duration-[var(--transition-fast)] focus:outline-none focus:border-[var(--fg)] rounded-full ${error ? "border-[var(--color-error)] focus:border-[var(--color-error)]" : ""} ${className}`
+          className: `${Select_module_default.select}${error ? ` ${Select_module_default.error}` : ""}${className ? ` ${className}` : ""}`
         }, !("value" in props) && { defaultValue: "" }), props), {
           children: [
             placeholder && /* @__PURE__ */ jsxRuntime.jsx("option", { value: "", disabled: true, children: placeholder }),
@@ -436,11 +533,22 @@ function Select(_a) {
           ]
         })
       ),
-      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute right-3.5 top-1/2 -translate-y-1/2 pointer-events-none text-[var(--fg-muted)]", children: /* @__PURE__ */ jsxRuntime.jsx(IconlyChevronDown, { size: 16 }) })
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: Select_module_default.chevron, children: /* @__PURE__ */ jsxRuntime.jsx(IconlyChevronDown, { size: 16 }) })
     ] }),
-    error && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-[13px] tracking-[-0.25px] text-[var(--color-error)]", children: error })
+    error && /* @__PURE__ */ jsxRuntime.jsx("p", { className: Select_module_default.errorText, children: error })
   ] });
 }
+
+// src/atoms/Checkbox.module.scss
+var Checkbox_module_default = {
+  root: "Checkbox_module_root",
+  hiddenInput: "Checkbox_module_hiddenInput",
+  box: "Checkbox_module_box",
+  checked: "Checkbox_module_checked",
+  unchecked: "Checkbox_module_unchecked",
+  label: "Checkbox_module_label",
+  disabled: "Checkbox_module_disabled"
+};
 function Checkbox({
   checked = false,
   onChange,
@@ -451,7 +559,7 @@ function Checkbox({
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "label",
     {
-      className: `inline-flex items-center gap-2.5 ${disabled ? "opacity-50 cursor-not-allowed" : "cursor-pointer"} ${className}`,
+      className: `${Checkbox_module_default.root}${disabled ? ` ${Checkbox_module_default.disabled}` : ""}${className ? ` ${className}` : ""}`,
       children: [
         /* @__PURE__ */ jsxRuntime.jsx(
           "input",
@@ -460,13 +568,13 @@ function Checkbox({
             checked,
             disabled,
             onChange: () => onChange == null ? void 0 : onChange(!checked),
-            className: "absolute opacity-0 w-0 h-0"
+            className: Checkbox_module_default.hiddenInput
           }
         ),
         /* @__PURE__ */ jsxRuntime.jsx(
           "span",
           {
-            className: `flex items-center justify-center w-[18px] h-[18px] rounded-[5px] border transition-colors duration-200 shrink-0 ${checked ? "bg-[var(--color-accent)] border-[var(--color-accent)]" : "border-[var(--fg-muted)] bg-transparent"}`,
+            className: `${Checkbox_module_default.box} ${checked ? Checkbox_module_default.checked : Checkbox_module_default.unchecked}`,
             children: checked && /* @__PURE__ */ jsxRuntime.jsx(
               "svg",
               {
@@ -489,11 +597,23 @@ function Checkbox({
             )
           }
         ),
-        label && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[13px] font-medium text-[var(--fg)] tracking-[-0.25px]", children: label })
+        label && /* @__PURE__ */ jsxRuntime.jsx("span", { className: Checkbox_module_default.label, children: label })
       ]
     }
   );
 }
+
+// src/atoms/Radio.module.scss
+var Radio_module_default = {
+  root: "Radio_module_root",
+  hiddenInput: "Radio_module_hiddenInput",
+  circle: "Radio_module_circle",
+  checked: "Radio_module_checked",
+  unchecked: "Radio_module_unchecked",
+  dot: "Radio_module_dot",
+  label: "Radio_module_label",
+  disabled: "Radio_module_disabled"
+};
 function Radio({
   checked = false,
   onChange,
@@ -506,7 +626,7 @@ function Radio({
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "label",
     {
-      className: `inline-flex items-center gap-2.5 ${disabled ? "opacity-50 cursor-not-allowed" : "cursor-pointer"} ${className}`,
+      className: `${Radio_module_default.root}${disabled ? ` ${Radio_module_default.disabled}` : ""}${className ? ` ${className}` : ""}`,
       children: [
         /* @__PURE__ */ jsxRuntime.jsx(
           "input",
@@ -517,60 +637,71 @@ function Radio({
             name,
             value,
             onChange: () => onChange == null ? void 0 : onChange(!checked),
-            className: "absolute opacity-0 w-0 h-0"
+            className: Radio_module_default.hiddenInput
           }
         ),
         /* @__PURE__ */ jsxRuntime.jsx(
           "span",
           {
-            className: `flex items-center justify-center w-[18px] h-[18px] rounded-full border transition-colors duration-200 shrink-0 ${checked ? "border-[var(--color-accent)]" : "border-[var(--fg-muted)]"}`,
-            children: checked && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "w-[8px] h-[8px] rounded-full bg-[var(--color-accent)]" })
+            className: `${Radio_module_default.circle} ${checked ? Radio_module_default.checked : Radio_module_default.unchecked}`,
+            children: checked && /* @__PURE__ */ jsxRuntime.jsx("span", { className: Radio_module_default.dot })
           }
         ),
-        label && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[13px] font-medium text-[var(--fg)] tracking-[-0.25px]", children: label })
+        label && /* @__PURE__ */ jsxRuntime.jsx("span", { className: Radio_module_default.label, children: label })
       ]
     }
   );
 }
-var variantStyles3 = {
-  default: "text-[var(--color-accent)] hover:underline",
-  muted: "text-[var(--fg-muted)] hover:text-[var(--fg)]",
-  underline: "text-[var(--fg)] underline underline-offset-2 hover:text-[var(--color-accent)]"
+
+// src/atoms/Link.module.scss
+var Link_module_default = {
+  root: "Link_module_root",
+  default: "Link_module_default",
+  muted: "Link_module_muted",
+  underline: "Link_module_underline"
 };
 function Link(_a) {
   var _b = _a, { variant = "default", className = "", children } = _b, rest = __objRest(_b, ["variant", "className", "children"]);
   return /* @__PURE__ */ jsxRuntime.jsx(
     "a",
     __spreadProps(__spreadValues({
-      className: `text-[13px] tracking-[-0.25px] transition-colors duration-[var(--transition-fast)] inline-flex items-center gap-1 ${variantStyles3[variant]} ${className}`
+      className: `${Link_module_default.root} ${Link_module_default[variant]}${className ? ` ${className}` : ""}`
     }, rest), {
       children
     })
   );
 }
-var positionStyles = {
-  top: "bottom-full left-1/2 -translate-x-1/2 mb-1.5",
-  bottom: "top-full left-1/2 -translate-x-1/2 mt-1.5",
-  left: "right-full top-1/2 -translate-y-1/2 mr-1.5",
-  right: "left-full top-1/2 -translate-y-1/2 ml-1.5"
+
+// src/atoms/Tooltip.module.scss
+var Tooltip_module_default = {
+  root: "Tooltip_module_root",
+  tooltip: "Tooltip_module_tooltip",
+  top: "Tooltip_module_top",
+  bottom: "Tooltip_module_bottom",
+  left: "Tooltip_module_left",
+  right: "Tooltip_module_right"
 };
 function Tooltip({ content, position = "top", children, className = "" }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs("span", { className: `relative inline-flex group ${className}`, children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs("span", { className: `${Tooltip_module_default.root} ${className}`, children: [
     children,
     /* @__PURE__ */ jsxRuntime.jsx(
       "span",
       {
         role: "tooltip",
-        className: `absolute invisible group-hover:visible opacity-0 group-hover:opacity-100 transition-opacity bg-[var(--fg)] text-[var(--bg)] text-[11px] px-2 py-1 rounded-md whitespace-nowrap z-50 pointer-events-none ${positionStyles[position]}`,
+        className: `${Tooltip_module_default.tooltip} ${Tooltip_module_default[position]}`,
         children: content
       }
     )
   ] });
 }
-var variantStyles4 = {
-  line: "h-4 w-full rounded-full",
-  circle: "rounded-full",
-  rect: "rounded-[var(--radius-lg)]"
+
+// src/atoms/Skeleton.module.scss
+var Skeleton_module_default = {
+  pulse: "Skeleton_module_pulse",
+  root: "Skeleton_module_root",
+  line: "Skeleton_module_line",
+  circle: "Skeleton_module_circle",
+  rect: "Skeleton_module_rect"
 };
 function Skeleton({ variant = "line", width, height, className = "" }) {
   const style = {};
@@ -583,12 +714,23 @@ function Skeleton({ variant = "line", width, height, className = "" }) {
   return /* @__PURE__ */ jsxRuntime.jsx(
     "div",
     {
-      className: `animate-pulse bg-[var(--bg-tertiary)] ${variantStyles4[variant]} ${className}`,
+      className: `${Skeleton_module_default.root} ${Skeleton_module_default[variant]} ${className}`,
       style: Object.keys(style).length > 0 ? style : void 0,
       "aria-hidden": "true"
     }
   );
 }
+
+// src/atoms/TicketButton.module.scss
+var TicketButton_module_default = {
+  root: "TicketButton_module_root",
+  stub: "TicketButton_module_stub",
+  body: "TicketButton_module_body",
+  bodySvg: "TicketButton_module_bodySvg",
+  bodyText: "TicketButton_module_bodyText",
+  stubSvg: "TicketButton_module_stubSvg",
+  stubIcon: "TicketButton_module_stubIcon"
+};
 var DefaultIcon = () => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsxRuntime.jsx("polyline", { points: "9 18 15 12 9 6" }) });
 function TicketButton(_a) {
   var _b = _a, {
@@ -611,14 +753,14 @@ function TicketButton(_a) {
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "button",
     __spreadProps(__spreadValues({
-      className: `group relative inline-flex items-stretch cursor-pointer border-none bg-transparent p-0 select-none ${className}`
+      className: `${TicketButton_module_default.root} ${className}`
     }, props), {
       children: [
-        /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "relative flex items-center", children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("span", { className: TicketButton_module_default.body, children: [
           /* @__PURE__ */ jsxRuntime.jsxs(
             "svg",
             {
-              className: "absolute inset-0 w-full h-full",
+              className: TicketButton_module_default.bodySvg,
               viewBox: "0 0 140 56",
               fill: "none",
               preserveAspectRatio: "none",
@@ -643,13 +785,13 @@ function TicketButton(_a) {
               ]
             }
           ),
-          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "relative z-10 px-6 py-4 text-[13px] font-semibold tracking-[-0.25px] whitespace-nowrap", style: { color: fg }, children })
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: TicketButton_module_default.bodyText, style: { color: fg }, children })
         ] }),
-        /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "relative flex items-center transition-transform duration-300 ease-[cubic-bezier(0.34,1.56,0.64,1)] group-hover:translate-x-1.5", children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("span", { className: TicketButton_module_default.stub, children: [
           /* @__PURE__ */ jsxRuntime.jsxs(
             "svg",
             {
-              className: "absolute inset-0 w-full h-full",
+              className: TicketButton_module_default.stubSvg,
               viewBox: "0 0 56 56",
               fill: "none",
               preserveAspectRatio: "none",
@@ -673,36 +815,55 @@ function TicketButton(_a) {
               ]
             }
           ),
-          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "relative z-10 w-[56px] h-[56px] flex items-center justify-center", style: { color: fg }, children: icon || /* @__PURE__ */ jsxRuntime.jsx(DefaultIcon, {}) })
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: TicketButton_module_default.stubIcon, style: { color: fg }, children: icon || /* @__PURE__ */ jsxRuntime.jsx(DefaultIcon, {}) })
         ] })
       ]
     })
   );
 }
+
+// src/molecules/Card.module.scss
+var Card_module_default = {
+  root: "Card_module_root",
+  imageWrapper: "Card_module_imageWrapper",
+  image: "Card_module_image",
+  body: "Card_module_body",
+  title: "Card_module_title",
+  description: "Card_module_description",
+  footer: "Card_module_footer"
+};
 function Card({ image, title, description, footer, children, className = "" }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    "div",
-    {
-      className: `rounded-[var(--radius-xl)] border border-[var(--border-color)] bg-[var(--bg)] overflow-hidden shadow-[var(--shadow-xs)] transition-all duration-[var(--transition-base)] hover:shadow-[var(--shadow-md)] hover:-translate-y-0.5 ${className}`,
-      children: [
-        image && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "aspect-video overflow-hidden", children: /* @__PURE__ */ jsxRuntime.jsx("img", { src: image, alt: title || "", className: "w-full h-full object-cover" }) }),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "p-5", children: [
-          title && /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-base font-semibold text-[var(--fg)] mb-1", children: title }),
-          description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-[var(--fg-secondary)] leading-relaxed", children: description }),
-          children
-        ] }),
-        footer && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "px-5 py-3 border-t border-[var(--border-color)] bg-[var(--bg-secondary)]", children: footer })
-      ]
-    }
-  );
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `${Card_module_default.root}${className ? ` ${className}` : ""}`, children: [
+    image && /* @__PURE__ */ jsxRuntime.jsx("div", { className: Card_module_default.imageWrapper, children: /* @__PURE__ */ jsxRuntime.jsx("img", { src: image, alt: title || "", className: Card_module_default.image }) }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: Card_module_default.body, children: [
+      title && /* @__PURE__ */ jsxRuntime.jsx("h3", { className: Card_module_default.title, children: title }),
+      description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: Card_module_default.description, children: description }),
+      children
+    ] }),
+    footer && /* @__PURE__ */ jsxRuntime.jsx("div", { className: Card_module_default.footer, children: footer })
+  ] });
 }
+
+// src/molecules/FormField.module.scss
+var FormField_module_default = {
+  root: "FormField_module_root",
+  hint: "FormField_module_hint"
+};
 function FormField(_a) {
   var _b = _a, { label, error, hint, icon } = _b, inputProps = __objRest(_b, ["label", "error", "hint", "icon"]);
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-1.5", children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: FormField_module_default.root, children: [
     /* @__PURE__ */ jsxRuntime.jsx(Input, __spreadValues({ label, error, icon }, inputProps)),
-    hint && !error && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-[0.8125rem] text-[var(--fg-muted)]", children: hint })
+    hint && !error && /* @__PURE__ */ jsxRuntime.jsx("p", { className: FormField_module_default.hint, children: hint })
   ] });
 }
+
+// src/molecules/SearchBar.module.scss
+var SearchBar_module_default = {
+  root: "SearchBar_module_root",
+  searchIcon: "SearchBar_module_searchIcon",
+  input: "SearchBar_module_input",
+  clearBtn: "SearchBar_module_clearBtn"
+};
 function SearchBar({ placeholder = "Search...", value: controlledValue, onChange, className = "" }) {
   const [internalValue, setInternalValue] = react.useState("");
   const value = controlledValue != null ? controlledValue : internalValue;
@@ -710,8 +871,8 @@ function SearchBar({ placeholder = "Search...", value: controlledValue, onChange
     setInternalValue(val);
     onChange == null ? void 0 : onChange(val);
   };
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `relative flex items-center ${className}`, children: [
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute left-3 text-[var(--fg-muted)]", children: /* @__PURE__ */ jsxRuntime.jsx(IconlySearch, { size: 18 }) }),
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `${SearchBar_module_default.root}${className ? ` ${className}` : ""}`, children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: SearchBar_module_default.searchIcon, children: /* @__PURE__ */ jsxRuntime.jsx(IconlySearch, { size: 18 }) }),
     /* @__PURE__ */ jsxRuntime.jsx(
       "input",
       {
@@ -720,73 +881,95 @@ function SearchBar({ placeholder = "Search...", value: controlledValue, onChange
         onChange: (e) => handleChange(e.target.value),
         placeholder,
         "aria-label": "Search",
-        className: "w-full rounded-[var(--radius-lg)] border border-[var(--border-color)] bg-[var(--bg)] pl-10 pr-10 py-2.5 text-sm text-[var(--fg)] placeholder:text-[var(--fg-muted)] transition-all duration-[var(--transition-fast)] focus:outline-none focus:ring-2 focus:ring-[var(--brand-primary)] focus:border-transparent"
+        className: SearchBar_module_default.input
       }
     ),
     value && /* @__PURE__ */ jsxRuntime.jsx(
       "button",
       {
         onClick: () => handleChange(""),
-        className: "absolute right-3 text-[var(--fg-muted)] hover:text-[var(--fg)] transition-colors cursor-pointer",
+        className: SearchBar_module_default.clearBtn,
         "aria-label": "Clear search",
         children: /* @__PURE__ */ jsxRuntime.jsx(IconlyClose, { size: 16 })
       }
     )
   ] });
 }
+
+// src/molecules/Stat.module.scss
+var Stat_module_default = {
+  root: "Stat_module_root",
+  valueRow: "Stat_module_valueRow",
+  value: "Stat_module_value",
+  trend: "Stat_module_trend",
+  positive: "Stat_module_positive",
+  negative: "Stat_module_negative",
+  label: "Stat_module_label"
+};
 function Stat({ value, label, trend, className = "" }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `flex flex-col gap-1 ${className}`, children: [
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-baseline gap-2", children: [
-      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-2xl font-bold text-[var(--fg)]", children: value }),
-      trend && /* @__PURE__ */ jsxRuntime.jsxs(
-        "span",
-        {
-          className: `text-sm font-medium ${trend.positive ? "text-[var(--color-success)]" : "text-[var(--color-error)]"}`,
-          children: [
-            trend.positive ? "\u2191" : "\u2193",
-            " ",
-            trend.value
-          ]
-        }
-      )
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `${Stat_module_default.root}${className ? ` ${className}` : ""}`, children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: Stat_module_default.valueRow, children: [
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: Stat_module_default.value, children: value }),
+      trend && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: `${Stat_module_default.trend} ${trend.positive ? Stat_module_default.positive : Stat_module_default.negative}`, children: [
+        trend.positive ? "\u2191" : "\u2193",
+        " ",
+        trend.value
+      ] })
     ] }),
-    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm text-[var(--fg-muted)]", children: label })
+    /* @__PURE__ */ jsxRuntime.jsx("span", { className: Stat_module_default.label, children: label })
   ] });
 }
-var variantConfig = {
-  info: { accentColor: "text-[var(--color-info)]", Icon: IconlyInfoCircle },
-  success: { accentColor: "text-[var(--color-success)]", Icon: IconlySuccess },
-  warning: { accentColor: "text-[var(--color-warning)]", Icon: IconlyWarning },
-  error: { accentColor: "text-[var(--color-error)]", Icon: IconlyError }
+
+// src/molecules/Alert.module.scss
+var Alert_module_default = {
+  root: "Alert_module_root",
+  icon: "Alert_module_icon",
+  info: "Alert_module_info",
+  success: "Alert_module_success",
+  warning: "Alert_module_warning",
+  error: "Alert_module_error",
+  content: "Alert_module_content",
+  title: "Alert_module_title",
+  message: "Alert_module_message",
+  dismiss: "Alert_module_dismiss"
+};
+var variantIcons = {
+  info: IconlyInfoCircle,
+  success: IconlySuccess,
+  warning: IconlyWarning,
+  error: IconlyError
 };
 function Alert({ variant = "info", title, children, closable = false, className = "" }) {
   const [visible, setVisible] = react.useState(true);
   if (!visible) return null;
-  const config = variantConfig[variant];
-  const { Icon } = config;
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    "div",
-    {
-      className: `flex gap-3 p-4 rounded-[var(--radius-lg)] border border-[var(--border-color)] bg-[var(--bg-secondary)] ${className}`,
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: `shrink-0 mt-0.5 ${config.accentColor}`, children: /* @__PURE__ */ jsxRuntime.jsx(Icon, { size: 20 }) }),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1 min-w-0", children: [
-          title && /* @__PURE__ */ jsxRuntime.jsx("p", { className: `text-[13px] font-medium tracking-[-0.25px] mb-0.5 ${config.accentColor}`, children: title }),
-          /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-[13px] tracking-[-0.25px] text-[var(--fg-secondary)]", children })
-        ] }),
-        closable && /* @__PURE__ */ jsxRuntime.jsx(
-          "button",
-          {
-            onClick: () => setVisible(false),
-            className: "shrink-0 text-[var(--fg-muted)] hover:text-[var(--fg)] transition-all duration-[var(--transition-fast)] cursor-pointer",
-            "aria-label": "Dismiss",
-            children: /* @__PURE__ */ jsxRuntime.jsx(IconlyClose, { size: 16 })
-          }
-        )
-      ]
-    }
-  );
+  const Icon = variantIcons[variant];
+  const variantClass = Alert_module_default[variant];
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `${Alert_module_default.root}${className ? ` ${className}` : ""}`, children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${Alert_module_default.icon} ${variantClass}`, children: /* @__PURE__ */ jsxRuntime.jsx(Icon, { size: 20 }) }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: Alert_module_default.content, children: [
+      title && /* @__PURE__ */ jsxRuntime.jsx("p", { className: `${Alert_module_default.title} ${variantClass}`, children: title }),
+      /* @__PURE__ */ jsxRuntime.jsx("p", { className: Alert_module_default.message, children })
+    ] }),
+    closable && /* @__PURE__ */ jsxRuntime.jsx(
+      "button",
+      {
+        onClick: () => setVisible(false),
+        className: Alert_module_default.dismiss,
+        "aria-label": "Dismiss",
+        children: /* @__PURE__ */ jsxRuntime.jsx(IconlyClose, { size: 16 })
+      }
+    )
+  ] });
 }
+
+// src/molecules/Tabs.module.scss
+var Tabs_module_default = {
+  tabList: "Tabs_module_tabList",
+  tab: "Tabs_module_tab",
+  active: "Tabs_module_active",
+  indicator: "Tabs_module_indicator",
+  panel: "Tabs_module_panel"
+};
 function Tabs({ tabs, defaultTab, onChange, className = "" }) {
   var _a, _b;
   const [activeTab, setActiveTab] = react.useState(defaultTab || ((_a = tabs[0]) == null ? void 0 : _a.id));
@@ -817,7 +1000,7 @@ function Tabs({ tabs, defaultTab, onChange, className = "" }) {
       "div",
       {
         role: "tablist",
-        className: "flex border-b border-[var(--border-color)]",
+        className: Tabs_module_default.tabList,
         onKeyDown: handleKeyDown,
         children: tabs.map((tab, index) => /* @__PURE__ */ jsxRuntime.jsxs(
           "button",
@@ -831,10 +1014,10 @@ function Tabs({ tabs, defaultTab, onChange, className = "" }) {
             "aria-controls": `panel-${tab.id}`,
             tabIndex: activeTab === tab.id ? 0 : -1,
             onClick: () => activateTab(tab.id),
-            className: `px-4 py-2.5 text-sm font-medium transition-colors cursor-pointer relative ${activeTab === tab.id ? "text-[var(--brand-primary)]" : "text-[var(--fg-muted)] hover:text-[var(--fg)]"}`,
+            className: `${Tabs_module_default.tab} ${activeTab === tab.id ? Tabs_module_default.active : ""}`,
             children: [
               tab.label,
-              activeTab === tab.id && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute bottom-0 left-0 right-0 h-0.5 bg-[var(--brand-primary)] rounded-full" })
+              activeTab === tab.id && /* @__PURE__ */ jsxRuntime.jsx("span", { className: Tabs_module_default.indicator })
             ]
           },
           tab.id
@@ -847,12 +1030,24 @@ function Tabs({ tabs, defaultTab, onChange, className = "" }) {
         role: "tabpanel",
         id: `panel-${activeTab}`,
         "aria-labelledby": `tab-${activeTab}`,
-        className: "pt-4",
+        className: Tabs_module_default.panel,
         children: activeContent
       }
     )
   ] });
 }
+
+// src/molecules/ChatInput.module.scss
+var ChatInput_module_default = {
+  root: "ChatInput_module_root",
+  contrast: "ChatInput_module_contrast",
+  plain: "ChatInput_module_plain",
+  input: "ChatInput_module_input",
+  actions: "ChatInput_module_actions",
+  actionsFull: "ChatInput_module_actionsFull",
+  actionsEasy: "ChatInput_module_actionsEasy",
+  toolGroup: "ChatInput_module_toolGroup"
+};
 function ChatInput({
   placeholder = "\u0412\u0432\u0435\u0434\u0438 \u0441\u0432\u043E\u0439 email...",
   buttonText = "\u041D\u0430\u0447\u0430\u0442\u044C \u0431\u0435\u0441\u043F\u043B\u0430\u0442\u043D\u043E",
@@ -870,7 +1065,6 @@ function ChatInput({
       setValue("");
     }
   };
-  const containerStyles = contrast ? "bg-[var(--bg)] border border-[var(--bg-tertiary)] shadow-[var(--shadow-md)] px-[15px] py-[13px]" : "bg-[var(--bg-tertiary)] pl-3.5 pr-3 py-3";
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "form",
     {
@@ -879,7 +1073,7 @@ function ChatInput({
         var _a;
         return (_a = inputRef.current) == null ? void 0 : _a.focus();
       },
-      className: `rounded-[16px] overflow-hidden flex flex-col gap-4 w-full max-w-[440px] cursor-text ${containerStyles} ${className}`,
+      className: `${ChatInput_module_default.root} ${contrast ? ChatInput_module_default.contrast : ChatInput_module_default.plain}${className ? ` ${className}` : ""}`,
       children: [
         /* @__PURE__ */ jsxRuntime.jsx(
           "input",
@@ -889,11 +1083,11 @@ function ChatInput({
             value,
             onChange: (e) => setValue(e.target.value),
             placeholder,
-            className: "w-full bg-transparent border-none outline-none text-[13px] tracking-[-0.25px] text-[var(--fg)] placeholder:text-[var(--fg-muted)] font-normal"
+            className: ChatInput_module_default.input
           }
         ),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `flex items-center ${type === "full" ? "justify-between" : "justify-end"}`, children: [
-          type === "full" && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1", children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `${ChatInput_module_default.actions} ${type === "full" ? ChatInput_module_default.actionsFull : ChatInput_module_default.actionsEasy}`, children: [
+          type === "full" && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ChatInput_module_default.toolGroup, children: [
             /* @__PURE__ */ jsxRuntime.jsx(IconButton, { variant: "secondary", icon: /* @__PURE__ */ jsxRuntime.jsx(IconlySmile, { size: 20 }), type: "button", "aria-label": "Emoji" }),
             /* @__PURE__ */ jsxRuntime.jsx(IconButton, { variant: "clear", icon: /* @__PURE__ */ jsxRuntime.jsx(IconlyAttach, { size: 20 }), type: "button", "aria-label": "Attach" }),
             /* @__PURE__ */ jsxRuntime.jsx(IconButton, { variant: "clear", icon: /* @__PURE__ */ jsxRuntime.jsx(IconlyInfo, { size: 20 }), type: "button", "aria-label": "Info" })
@@ -904,43 +1098,83 @@ function ChatInput({
     }
   );
 }
+
+// src/molecules/ChatMessage.module.scss
+var ChatMessage_module_default = {
+  root: "ChatMessage_module_root",
+  user: "ChatMessage_module_user",
+  ai: "ChatMessage_module_ai",
+  bubble: "ChatMessage_module_bubble",
+  sm: "ChatMessage_module_sm",
+  lg: "ChatMessage_module_lg",
+  bubbleUser: "ChatMessage_module_bubbleUser",
+  bubbleAi: "ChatMessage_module_bubbleAi"
+};
 function ChatMessage({ children, role = "user", size = "sm", className = "" }) {
   const isUser = role === "user";
-  const isLarge = size === "lg";
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: `flex ${isUser ? "justify-end" : "justify-start"} ${className}`, children: /* @__PURE__ */ jsxRuntime.jsx(
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${ChatMessage_module_default.root} ${isUser ? ChatMessage_module_default.user : ChatMessage_module_default.ai}${className ? ` ${className}` : ""}`, children: /* @__PURE__ */ jsxRuntime.jsx(
     "div",
     {
-      className: `text-[13px] tracking-[-0.25px] font-normal px-4 rounded-tl-[16px] rounded-tr-[16px] ${isLarge ? "w-[225px] py-3" : "py-2"} ${isUser ? "bg-[var(--bg-secondary)] text-[var(--fg)] rounded-bl-[16px]" : "bg-[var(--color-accent)] text-[var(--bg)] rounded-br-[16px]"} ${isLarge ? "leading-normal" : "leading-normal"}`,
+      className: `${ChatMessage_module_default.bubble} ${ChatMessage_module_default[size]} ${isUser ? ChatMessage_module_default.bubbleUser : ChatMessage_module_default.bubbleAi}`,
       children
     }
   ) });
 }
+
+// src/molecules/TopPromo.module.scss
+var TopPromo_module_default = {
+  root: "TopPromo_module_root",
+  text: "TopPromo_module_text"
+};
 function TopPromo({ text, buttonText = "\u0421\u043C\u043E\u0442\u0440\u0435\u0442\u044C", onButtonClick, className = "" }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `flex items-center gap-2.5 ${className}`, children: [
-    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[13px] tracking-[-0.25px] text-[var(--fg-secondary)]", children: text }),
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `${TopPromo_module_default.root}${className ? ` ${className}` : ""}`, children: [
+    /* @__PURE__ */ jsxRuntime.jsx("span", { className: TopPromo_module_default.text, children: text }),
     /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "primary", size: "sm", onClick: onButtonClick, children: buttonText })
   ] });
 }
+
+// src/molecules/ProfileNav.module.scss
+var ProfileNav_module_default = {
+  root: "ProfileNav_module_root",
+  stats: "ProfileNav_module_stats",
+  statItem: "ProfileNav_module_statItem",
+  statText: "ProfileNav_module_statText",
+  separator: "ProfileNav_module_separator"
+};
 function ProfileNav({ stats, avatarSrc, avatarInitials = "DK", className = "" }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `flex items-center gap-5 ${className}`, children: [
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-1", children: stats.map((stat, i) => /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "inline-flex items-center text-[13px] font-medium tracking-[-0.25px] whitespace-nowrap", children: [
-      /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-[var(--fg-secondary)]", children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `${ProfileNav_module_default.root}${className ? ` ${className}` : ""}`, children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: ProfileNav_module_default.stats, children: stats.map((stat, i) => /* @__PURE__ */ jsxRuntime.jsxs("span", { className: ProfileNav_module_default.statItem, children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("span", { className: ProfileNav_module_default.statText, children: [
         stat.value,
         " ",
         stat.suffix
       ] }),
-      i < stats.length - 1 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[var(--fg-muted)]", children: " //" })
+      i < stats.length - 1 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: ProfileNav_module_default.separator, children: " //" })
     ] }, i)) }),
     /* @__PURE__ */ jsxRuntime.jsx(Avatar, { size: "sm", src: avatarSrc, initials: avatarInitials })
   ] });
 }
+
+// src/molecules/IconWithText.module.scss
+var IconWithText_module_default = {
+  root: "IconWithText_module_root",
+  icon: "IconWithText_module_icon",
+  text: "IconWithText_module_text"
+};
 function IconWithText({ icon, text, side = "left", className = "" }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `inline-flex items-center gap-1.5 py-1 rounded-full ${className}`, children: [
-    side === "left" && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "shrink-0 w-5 h-5 flex items-center justify-center", children: icon }),
-    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[13px] font-medium text-[var(--fg)] tracking-[-0.25px] whitespace-nowrap", children: text }),
-    side === "right" && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "shrink-0 w-5 h-5 flex items-center justify-center", children: icon })
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `${IconWithText_module_default.root}${className ? ` ${className}` : ""}`, children: [
+    side === "left" && /* @__PURE__ */ jsxRuntime.jsx("span", { className: IconWithText_module_default.icon, children: icon }),
+    /* @__PURE__ */ jsxRuntime.jsx("span", { className: IconWithText_module_default.text, children: text }),
+    side === "right" && /* @__PURE__ */ jsxRuntime.jsx("span", { className: IconWithText_module_default.icon, children: icon })
   ] });
 }
+
+// src/molecules/StampCard.module.scss
+var StampCard_module_default = {
+  root: "StampCard_module_root",
+  plain: "StampCard_module_plain",
+  inner: "StampCard_module_inner"
+};
 function StampCard({
   children,
   className = "",
@@ -992,9 +1226,9 @@ function StampCard({
     };
   }, [build, stamp]);
   if (!stamp) {
-    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: `rounded-[var(--radius-xl)] border border-[var(--border-color)] bg-[var(--bg)] overflow-hidden shadow-[var(--shadow-xs)] ${className}`, children });
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${StampCard_module_default.plain} ${className}`, children });
   }
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { ref: outerRef, className: `relative ${className}`, children: /* @__PURE__ */ jsxRuntime.jsx("div", { style: { filter: "drop-shadow(0 1px 3px rgba(0,0,0,0.25)) drop-shadow(0 4px 12px rgba(0,0,0,0.20))" }, children: /* @__PURE__ */ jsxRuntime.jsx(
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { ref: outerRef, className: `${StampCard_module_default.root} ${className}`, children: /* @__PURE__ */ jsxRuntime.jsx("div", { style: { filter: "drop-shadow(0 1px 3px rgba(0,0,0,0.25)) drop-shadow(0 4px 12px rgba(0,0,0,0.20))" }, children: /* @__PURE__ */ jsxRuntime.jsx(
     "div",
     {
       style: {
@@ -1003,10 +1237,15 @@ function StampCard({
         WebkitMaskSize: "100% 100%",
         maskSize: "100% 100%"
       },
-      children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "bg-[var(--bg)]", children })
+      children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: StampCard_module_default.inner, children })
     }
   ) }) });
 }
+
+// src/molecules/PasswordInput.module.scss
+var PasswordInput_module_default = {
+  toggle: "PasswordInput_module_toggle"
+};
 function PasswordInput(_a) {
   var props = __objRest(_a, []);
   const [showPassword, setShowPassword] = react.useState(false);
@@ -1019,7 +1258,7 @@ function PasswordInput(_a) {
         {
           type: "button",
           onClick: () => setShowPassword((prev) => !prev),
-          className: "flex items-center justify-center cursor-pointer",
+          className: PasswordInput_module_default.toggle,
           "aria-label": showPassword ? "Hide password" : "Show password",
           tabIndex: -1,
           children: showPassword ? /* @__PURE__ */ jsxRuntime.jsx(IconlyEyeOff, { size: 18 }) : /* @__PURE__ */ jsxRuntime.jsx(IconlyEye, { size: 18 })
@@ -1028,31 +1267,54 @@ function PasswordInput(_a) {
     })
   );
 }
+
+// src/molecules/Breadcrumbs.module.scss
+var Breadcrumbs_module_default = {
+  list: "Breadcrumbs_module_list",
+  item: "Breadcrumbs_module_item",
+  separator: "Breadcrumbs_module_separator",
+  active: "Breadcrumbs_module_active",
+  link: "Breadcrumbs_module_link"
+};
 function Breadcrumbs({
   items,
   separator = /* @__PURE__ */ jsxRuntime.jsx(IconlyChevronRight, { size: 14 })
 }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("nav", { "aria-label": "Breadcrumb", children: /* @__PURE__ */ jsxRuntime.jsx("ol", { className: "flex items-center gap-1.5 text-[13px] tracking-[-0.25px]", children: items.map((item, index) => {
+  return /* @__PURE__ */ jsxRuntime.jsx("nav", { "aria-label": "Breadcrumb", children: /* @__PURE__ */ jsxRuntime.jsx("ol", { className: Breadcrumbs_module_default.list, children: items.map((item, index) => {
     var _a;
     const isLast = index === items.length - 1;
-    return /* @__PURE__ */ jsxRuntime.jsxs("li", { className: "flex items-center gap-1.5", children: [
-      index > 0 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[var(--fg-muted)]", "aria-hidden": "true", children: separator }),
-      isLast ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[var(--fg)] font-medium", "aria-current": "page", children: item.label }) : /* @__PURE__ */ jsxRuntime.jsx(
+    return /* @__PURE__ */ jsxRuntime.jsxs("li", { className: Breadcrumbs_module_default.item, children: [
+      index > 0 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: Breadcrumbs_module_default.separator, "aria-hidden": "true", children: separator }),
+      isLast ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: Breadcrumbs_module_default.active, "aria-current": "page", children: item.label }) : /* @__PURE__ */ jsxRuntime.jsx(
         "a",
         {
           href: (_a = item.href) != null ? _a : "#",
-          className: "text-[var(--fg-muted)] hover:text-[var(--fg)] transition-colors duration-[var(--transition-fast)]",
+          className: Breadcrumbs_module_default.link,
           children: item.label
         }
       )
     ] }, index);
   }) }) });
 }
-var variantConfig2 = {
-  info: { accentColor: "text-[var(--color-info)]", Icon: IconlyInfoCircle },
-  success: { accentColor: "text-[var(--color-success)]", Icon: IconlySuccess },
-  warning: { accentColor: "text-[var(--color-warning)]", Icon: IconlyWarning },
-  error: { accentColor: "text-[var(--color-error)]", Icon: IconlyError }
+
+// src/molecules/Toast.module.scss
+var Toast_module_default = {
+  root: "Toast_module_root",
+  icon: "Toast_module_icon",
+  info: "Toast_module_info",
+  success: "Toast_module_success",
+  warning: "Toast_module_warning",
+  error: "Toast_module_error",
+  content: "Toast_module_content",
+  title: "Toast_module_title",
+  message: "Toast_module_message",
+  dismiss: "Toast_module_dismiss"
+};
+var variantIcons2 = {
+  info: IconlyInfoCircle,
+  success: IconlySuccess,
+  warning: IconlyWarning,
+  error: IconlyError
 };
 function Toast({
   variant = "info",
@@ -1069,25 +1331,25 @@ function Toast({
     return () => clearTimeout(timer);
   }, [visible, duration, onClose]);
   if (!visible) return null;
-  const config = variantConfig2[variant];
-  const { Icon } = config;
+  const Icon = variantIcons2[variant];
+  const variantClass = Toast_module_default[variant];
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "div",
     {
       role: "alert",
       "aria-live": "assertive",
-      className: `fixed bottom-6 right-6 z-50 flex gap-3 p-4 rounded-[var(--radius-lg)] border border-[var(--border-color)] bg-[var(--bg-secondary)] shadow-lg max-w-sm ${className}`,
+      className: `${Toast_module_default.root}${className ? ` ${className}` : ""}`,
       children: [
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: `shrink-0 mt-0.5 ${config.accentColor}`, children: /* @__PURE__ */ jsxRuntime.jsx(Icon, { size: 20 }) }),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1 min-w-0", children: [
-          title && /* @__PURE__ */ jsxRuntime.jsx("p", { className: `text-[13px] font-medium tracking-[-0.25px] mb-0.5 ${config.accentColor}`, children: title }),
-          /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-[13px] tracking-[-0.25px] text-[var(--fg-secondary)]", children: message })
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${Toast_module_default.icon} ${variantClass}`, children: /* @__PURE__ */ jsxRuntime.jsx(Icon, { size: 20 }) }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: Toast_module_default.content, children: [
+          title && /* @__PURE__ */ jsxRuntime.jsx("p", { className: `${Toast_module_default.title} ${variantClass}`, children: title }),
+          /* @__PURE__ */ jsxRuntime.jsx("p", { className: Toast_module_default.message, children: message })
         ] }),
         /* @__PURE__ */ jsxRuntime.jsx(
           "button",
           {
             onClick: onClose,
-            className: "shrink-0 text-[var(--fg-muted)] hover:text-[var(--fg)] transition-all duration-[var(--transition-fast)] cursor-pointer",
+            className: Toast_module_default.dismiss,
             "aria-label": "Dismiss",
             children: /* @__PURE__ */ jsxRuntime.jsx(IconlyClose, { size: 16 })
           }
@@ -1096,6 +1358,15 @@ function Toast({
     }
   );
 }
+
+// src/molecules/Pagination.module.scss
+var Pagination_module_default = {
+  root: "Pagination_module_root",
+  pageBtn: "Pagination_module_pageBtn",
+  activePage: "Pagination_module_activePage",
+  ellipsis: "Pagination_module_ellipsis",
+  nav: "Pagination_module_nav"
+};
 function getPageRange(current, total, siblings) {
   const range = /* @__PURE__ */ new Set();
   range.add(1);
@@ -1124,32 +1395,24 @@ function Pagination({
   const pages = getPageRange(currentPage, totalPages, siblingCount);
   const isFirst = currentPage === 1;
   const isLast = currentPage === totalPages;
-  const buttonBase = "min-w-[36px] h-[36px] flex items-center justify-center text-[13px] tracking-[-0.25px] transition-all duration-[var(--transition-fast)] cursor-pointer";
-  return /* @__PURE__ */ jsxRuntime.jsxs("nav", { "aria-label": "Pagination", className: `flex items-center gap-1 ${className}`, children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs("nav", { "aria-label": "Pagination", className: `${Pagination_module_default.root} ${className}`, children: [
     /* @__PURE__ */ jsxRuntime.jsx(
       "button",
       {
         onClick: () => onPageChange(currentPage - 1),
         disabled: isFirst,
         "aria-label": "Previous page",
-        className: `${buttonBase} text-[var(--fg-secondary)] hover:text-[var(--fg)] ${isFirst ? "opacity-50 cursor-not-allowed" : ""}`,
+        className: Pagination_module_default.nav,
         children: /* @__PURE__ */ jsxRuntime.jsx(IconlyChevronLeft, { size: 18 })
       }
     ),
     pages.map(
-      (page, i) => page === "\u2026" ? /* @__PURE__ */ jsxRuntime.jsx(
-        "span",
-        {
-          className: "min-w-[36px] h-[36px] flex items-center justify-center text-[13px] text-[var(--fg-muted)]",
-          children: "\u2026"
-        },
-        `ellipsis-${i}`
-      ) : /* @__PURE__ */ jsxRuntime.jsx(
+      (page, i) => page === "\u2026" ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: Pagination_module_default.ellipsis, children: "\u2026" }, `ellipsis-${i}`) : /* @__PURE__ */ jsxRuntime.jsx(
         "button",
         {
           onClick: () => onPageChange(page),
           "aria-current": page === currentPage ? "page" : void 0,
-          className: `${buttonBase} rounded-full ${page === currentPage ? "bg-[var(--fg)] text-[var(--bg)] font-medium" : "text-[var(--fg-secondary)] hover:text-[var(--fg)] hover:bg-[var(--bg-secondary)]"}`,
+          className: `${Pagination_module_default.pageBtn} ${page === currentPage ? Pagination_module_default.activePage : ""}`,
           children: page
         },
         page
@@ -1161,12 +1424,22 @@ function Pagination({
         onClick: () => onPageChange(currentPage + 1),
         disabled: isLast,
         "aria-label": "Next page",
-        className: `${buttonBase} text-[var(--fg-secondary)] hover:text-[var(--fg)] ${isLast ? "opacity-50 cursor-not-allowed" : ""}`,
+        className: Pagination_module_default.nav,
         children: /* @__PURE__ */ jsxRuntime.jsx(IconlyChevronRight, { size: 18 })
       }
     )
   ] });
 }
+
+// src/molecules/CodeInput.module.scss
+var CodeInput_module_default = {
+  root: "CodeInput_module_root",
+  label: "CodeInput_module_label",
+  group: "CodeInput_module_group",
+  digitInput: "CodeInput_module_digitInput",
+  digitError: "CodeInput_module_digitError",
+  errorText: "CodeInput_module_errorText"
+};
 function CodeInput({
   length,
   value,
@@ -1219,16 +1492,9 @@ function CodeInput({
     [length, onChange, focusInput]
   );
   const inputId = label == null ? void 0 : label.toLowerCase().replace(/\s+/g, "-");
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `flex flex-col gap-1.5 ${className}`, children: [
-    label && /* @__PURE__ */ jsxRuntime.jsx(
-      "label",
-      {
-        htmlFor: inputId,
-        className: "text-[13px] font-medium text-[var(--fg)] tracking-[-0.25px]",
-        children: label
-      }
-    ),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex gap-3", role: "group", "aria-label": label || "Code input", children: Array.from({ length }, (_, i) => /* @__PURE__ */ jsxRuntime.jsx(
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `${CodeInput_module_default.root} ${className}`, children: [
+    label && /* @__PURE__ */ jsxRuntime.jsx("label", { htmlFor: inputId, className: CodeInput_module_default.label, children: label }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: CodeInput_module_default.group, role: "group", "aria-label": label || "Code input", children: Array.from({ length }, (_, i) => /* @__PURE__ */ jsxRuntime.jsx(
       "input",
       {
         id: i === 0 ? inputId : void 0,
@@ -1243,14 +1509,25 @@ function CodeInput({
         onKeyDown: handleKeyDown(i),
         onPaste: handlePaste,
         autoComplete: "one-time-code",
-        className: `w-12 h-12 text-center text-lg border bg-[var(--bg)] text-[var(--fg)] rounded-[var(--radius-lg)] transition-all duration-[var(--transition-fast)] focus:outline-none focus:border-[var(--fg)] ${error ? "border-[var(--color-error)] focus:border-[var(--color-error)]" : "border-[var(--fg-muted)]"}`,
+        className: `${CodeInput_module_default.digitInput} ${error ? CodeInput_module_default.digitError : ""}`,
         "aria-label": `Digit ${i + 1}`
       },
       i
     )) }),
-    error && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-[13px] tracking-[-0.25px] text-[var(--color-error)]", children: error })
+    error && /* @__PURE__ */ jsxRuntime.jsx("p", { className: CodeInput_module_default.errorText, children: error })
   ] });
 }
+
+// src/molecules/Modal.module.scss
+var Modal_module_default = {
+  dialog: "Modal_module_dialog",
+  content: "Modal_module_content",
+  header: "Modal_module_header",
+  title: "Modal_module_title",
+  closeBtn: "Modal_module_closeBtn",
+  body: "Modal_module_body",
+  footer: "Modal_module_footer"
+};
 function Modal({
   open,
   onClose,
@@ -1280,27 +1557,39 @@ function Modal({
       ref: dialogRef,
       onClose,
       onClick: handleBackdropClick,
-      className: `max-w-lg w-full p-0 rounded-[var(--radius-lg)] shadow-xl bg-[var(--bg)] border border-[var(--border-color)] backdrop:bg-black/50 ${className}`,
-      children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "p-6", children: [
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start justify-between mb-4", children: [
-          title && /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-lg font-semibold text-[var(--fg)] tracking-[-0.25px]", children: title }),
+      className: `${Modal_module_default.dialog}${className ? ` ${className}` : ""}`,
+      children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: Modal_module_default.content, children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: Modal_module_default.header, children: [
+          title && /* @__PURE__ */ jsxRuntime.jsx("h2", { className: Modal_module_default.title, children: title }),
           /* @__PURE__ */ jsxRuntime.jsx(
             "button",
             {
               type: "button",
               onClick: onClose,
-              className: "shrink-0 ml-auto text-[var(--fg-muted)] hover:text-[var(--fg)] transition-all duration-[var(--transition-fast)] cursor-pointer",
+              className: Modal_module_default.closeBtn,
               "aria-label": "Close",
               children: /* @__PURE__ */ jsxRuntime.jsx(IconlyClose, { size: 20 })
             }
           )
         ] }),
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-[14px] text-[var(--fg-secondary)] leading-relaxed", children }),
-        footer && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex gap-3 justify-end mt-6", children: footer })
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: Modal_module_default.body, children }),
+        footer && /* @__PURE__ */ jsxRuntime.jsx("div", { className: Modal_module_default.footer, children: footer })
       ] })
     }
   );
 }
+
+// src/molecules/DropdownMenu.module.scss
+var DropdownMenu_module_default = {
+  root: "DropdownMenu_module_root",
+  trigger: "DropdownMenu_module_trigger",
+  menu: "DropdownMenu_module_menu",
+  alignLeft: "DropdownMenu_module_alignLeft",
+  alignRight: "DropdownMenu_module_alignRight",
+  item: "DropdownMenu_module_item",
+  itemIcon: "DropdownMenu_module_itemIcon",
+  divider: "DropdownMenu_module_divider"
+};
 function DropdownMenu({
   trigger,
   items,
@@ -1368,7 +1657,7 @@ function DropdownMenu({
       openMenu();
     }
   };
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { ref: containerRef, className: `relative inline-block ${className}`, children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { ref: containerRef, className: `${DropdownMenu_module_default.root} ${className}`, children: [
     /* @__PURE__ */ jsxRuntime.jsx(
       "div",
       {
@@ -1377,7 +1666,7 @@ function DropdownMenu({
         tabIndex: 0,
         onClick: () => isOpen ? closeMenu() : openMenu(),
         onKeyDown: handleTriggerKeyDown,
-        className: "cursor-pointer inline-flex",
+        className: DropdownMenu_module_default.trigger,
         "aria-haspopup": "true",
         "aria-expanded": isOpen,
         children: trigger
@@ -1388,9 +1677,9 @@ function DropdownMenu({
       {
         role: "menu",
         onKeyDown: handleMenuKeyDown,
-        className: `absolute top-full mt-1 z-50 rounded-[var(--radius-lg)] shadow-lg border border-[var(--border-color)] bg-[var(--bg)] min-w-[180px] py-1 ${align === "right" ? "right-0" : "left-0"}`,
+        className: `${DropdownMenu_module_default.menu} ${align === "right" ? DropdownMenu_module_default.alignRight : DropdownMenu_module_default.alignLeft}`,
         children: items.map((item, i) => /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-          item.divider && /* @__PURE__ */ jsxRuntime.jsx("hr", { className: "my-1 border-[var(--border-color)]" }),
+          item.divider && /* @__PURE__ */ jsxRuntime.jsx("hr", { className: DropdownMenu_module_default.divider }),
           /* @__PURE__ */ jsxRuntime.jsxs(
             "button",
             {
@@ -1404,9 +1693,9 @@ function DropdownMenu({
                 item.onClick();
                 closeMenu();
               },
-              className: "flex items-center gap-2 w-full px-3 py-2 text-[13px] tracking-[-0.25px] text-[var(--fg-secondary)] hover:bg-[var(--bg-secondary)] hover:text-[var(--fg)] transition-all duration-[var(--transition-fast)] cursor-pointer text-left",
+              className: DropdownMenu_module_default.item,
               children: [
-                item.icon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "shrink-0 text-[var(--fg-muted)]", children: item.icon }),
+                item.icon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: DropdownMenu_module_default.itemIcon, children: item.icon }),
                 item.label
               ]
             }
@@ -1416,56 +1705,90 @@ function DropdownMenu({
     )
   ] });
 }
+
+// src/organisms/Header.module.scss
+var Header_module_default = {
+  root: "Header_module_root",
+  container: "Header_module_container",
+  bar: "Header_module_bar",
+  leftGroup: "Header_module_leftGroup",
+  logoFallback: "Header_module_logoFallback",
+  logoBrand: "Header_module_logoBrand",
+  desktopNav: "Header_module_desktopNav",
+  navLink: "Header_module_navLink",
+  desktopActions: "Header_module_desktopActions",
+  mobileToggle: "Header_module_mobileToggle",
+  mobileMenu: "Header_module_mobileMenu",
+  mobileNav: "Header_module_mobileNav",
+  mobileActions: "Header_module_mobileActions"
+};
 function Header({ logo, navItems = [], className = "" }) {
   const [mobileOpen, setMobileOpen] = react.useState(false);
-  return /* @__PURE__ */ jsxRuntime.jsxs("header", { className: `border-b border-[var(--border-color)] bg-[var(--bg)]/80 backdrop-blur-md sticky top-0 z-50 ${className}`, children: [
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "max-w-7xl mx-auto px-4 sm:px-6 lg:px-8", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between h-16", children: [
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-8", children: [
-        logo || /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-lg font-bold text-[var(--fg)]", children: [
-          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[var(--brand-primary)]", children: "K" }),
+  return /* @__PURE__ */ jsxRuntime.jsxs("header", { className: `${Header_module_default.root}${className ? ` ${className}` : ""}`, children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: Header_module_default.container, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: Header_module_default.bar, children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: Header_module_default.leftGroup, children: [
+        logo || /* @__PURE__ */ jsxRuntime.jsxs("span", { className: Header_module_default.logoFallback, children: [
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: Header_module_default.logoBrand, children: "K" }),
           "apustin"
         ] }),
-        /* @__PURE__ */ jsxRuntime.jsx("nav", { className: "hidden md:flex items-center gap-1", children: navItems.map((item) => /* @__PURE__ */ jsxRuntime.jsx(
+        /* @__PURE__ */ jsxRuntime.jsx("nav", { className: Header_module_default.desktopNav, children: navItems.map((item) => /* @__PURE__ */ jsxRuntime.jsx(
           "a",
           {
             href: item.href,
-            className: "px-3 py-2 text-sm text-[var(--fg-secondary)] hover:text-[var(--fg)] rounded-[var(--radius-md)] hover:bg-[var(--bg-tertiary)] transition-colors",
+            className: Header_module_default.navLink,
             children: item.label
           },
           item.label
         )) })
       ] }),
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "hidden md:flex items-center gap-3", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: Header_module_default.desktopActions, children: [
         /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "ghost", size: "sm", children: "Sign in" }),
         /* @__PURE__ */ jsxRuntime.jsx(Button, { size: "sm", children: "Get started" })
       ] }),
       /* @__PURE__ */ jsxRuntime.jsx(
         "button",
         {
-          className: "md:hidden p-2 text-[var(--fg-secondary)] hover:text-[var(--fg)] cursor-pointer",
+          className: Header_module_default.mobileToggle,
           onClick: () => setMobileOpen(!mobileOpen),
           "aria-label": "Toggle menu",
           children: mobileOpen ? /* @__PURE__ */ jsxRuntime.jsx(IconlyClose, { size: 24 }) : /* @__PURE__ */ jsxRuntime.jsx(IconlyMenu, { size: 24 })
         }
       )
     ] }) }),
-    mobileOpen && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "md:hidden border-t border-[var(--border-color)] bg-[var(--bg)] px-4 py-4", children: [
-      /* @__PURE__ */ jsxRuntime.jsx("nav", { className: "flex flex-col gap-1", children: navItems.map((item) => /* @__PURE__ */ jsxRuntime.jsx(
+    mobileOpen && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: Header_module_default.mobileMenu, children: [
+      /* @__PURE__ */ jsxRuntime.jsx("nav", { className: Header_module_default.mobileNav, children: navItems.map((item) => /* @__PURE__ */ jsxRuntime.jsx(
         "a",
         {
           href: item.href,
-          className: "px-3 py-2 text-sm text-[var(--fg-secondary)] hover:text-[var(--fg)] rounded-[var(--radius-md)] hover:bg-[var(--bg-tertiary)] transition-colors",
+          className: Header_module_default.navLink,
           children: item.label
         },
         item.label
       )) }),
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-2 mt-4 pt-4 border-t border-[var(--border-color)]", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: Header_module_default.mobileActions, children: [
         /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "ghost", size: "sm", children: "Sign in" }),
         /* @__PURE__ */ jsxRuntime.jsx(Button, { size: "sm", children: "Get started" })
       ] })
     ] })
   ] });
 }
+
+// src/organisms/Footer.module.scss
+var Footer_module_default = {
+  root: "Footer_module_root",
+  container: "Footer_module_container",
+  grid: "Footer_module_grid",
+  brand: "Footer_module_brand",
+  brandAccent: "Footer_module_brandAccent",
+  tagline: "Footer_module_tagline",
+  columnTitle: "Footer_module_columnTitle",
+  linkList: "Footer_module_linkList",
+  link: "Footer_module_link",
+  bottom: "Footer_module_bottom",
+  copyright: "Footer_module_copyright",
+  socials: "Footer_module_socials",
+  socialLink: "Footer_module_socialLink"
+};
 var defaultColumns = [
   {
     title: "Product",
@@ -1496,38 +1819,38 @@ var defaultColumns = [
   }
 ];
 function Footer({ columns = defaultColumns, className = "" }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("footer", { className: `border-t border-[var(--border-color)] bg-[var(--bg)] ${className}`, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-12", children: [
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 md:grid-cols-4 gap-8", children: [
+  return /* @__PURE__ */ jsxRuntime.jsx("footer", { className: `${Footer_module_default.root}${className ? ` ${className}` : ""}`, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: Footer_module_default.container, children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: Footer_module_default.grid, children: [
       /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-        /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-lg font-bold text-[var(--fg)]", children: [
-          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[var(--brand-primary)]", children: "K" }),
+        /* @__PURE__ */ jsxRuntime.jsxs("span", { className: Footer_module_default.brand, children: [
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: Footer_module_default.brandAccent, children: "K" }),
           "apustin"
         ] }),
-        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-3 text-[13px] text-[var(--fg-muted)] leading-relaxed tracking-[-0.25px]", children: "A modern design system for building beautiful interfaces." })
+        /* @__PURE__ */ jsxRuntime.jsx("p", { className: Footer_module_default.tagline, children: "A modern design system for building beautiful interfaces." })
       ] }),
       columns.map((col) => /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-        /* @__PURE__ */ jsxRuntime.jsx("h4", { className: "text-[13px] font-semibold text-[var(--fg-secondary)] mb-3 tracking-[-0.25px]", children: col.title }),
-        /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "space-y-2.5", children: col.links.map((link) => /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsx(
+        /* @__PURE__ */ jsxRuntime.jsx("h4", { className: Footer_module_default.columnTitle, children: col.title }),
+        /* @__PURE__ */ jsxRuntime.jsx("ul", { className: Footer_module_default.linkList, children: col.links.map((link) => /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsx(
           "a",
           {
             href: link.href,
-            className: "text-[13px] text-[var(--fg-muted)] hover:text-[var(--fg)] transition-colors duration-[var(--transition-fast)] tracking-[-0.25px]",
+            className: Footer_module_default.link,
             children: link.label
           }
         ) }, link.label)) })
       ] }, col.title))
     ] }),
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-12 pt-8 border-t border-[var(--border-color)] flex flex-col sm:flex-row justify-between items-center gap-4", children: [
-      /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-[13px] text-[var(--fg-muted)] tracking-[-0.25px]", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: Footer_module_default.bottom, children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("p", { className: Footer_module_default.copyright, children: [
         "\xA9 ",
         (/* @__PURE__ */ new Date()).getFullYear(),
         " Kapustin Team. All rights reserved."
       ] }),
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex gap-4", children: ["Twitter", "GitHub", "Discord"].map((social) => /* @__PURE__ */ jsxRuntime.jsx(
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: Footer_module_default.socials, children: ["Twitter", "GitHub", "Discord"].map((social) => /* @__PURE__ */ jsxRuntime.jsx(
         "a",
         {
           href: "#",
-          className: "text-[13px] text-[var(--fg-muted)] hover:text-[var(--fg)] transition-colors duration-[var(--transition-fast)] tracking-[-0.25px]",
+          className: Footer_module_default.socialLink,
           children: social
         },
         social
@@ -1535,6 +1858,23 @@ function Footer({ columns = defaultColumns, className = "" }) {
     ] })
   ] }) });
 }
+
+// src/organisms/PricingCard.module.scss
+var PricingCard_module_default = {
+  root: "PricingCard_module_root",
+  highlighted: "PricingCard_module_highlighted",
+  badgeWrap: "PricingCard_module_badgeWrap",
+  header: "PricingCard_module_header",
+  plan: "PricingCard_module_plan",
+  description: "PricingCard_module_description",
+  priceBlock: "PricingCard_module_priceBlock",
+  price: "PricingCard_module_price",
+  period: "PricingCard_module_period",
+  features: "PricingCard_module_features",
+  featureItem: "PricingCard_module_featureItem",
+  featureIcon: "PricingCard_module_featureIcon",
+  cta: "PricingCard_module_cta"
+};
 function PricingCard({
   plan,
   price,
@@ -1548,63 +1888,89 @@ function PricingCard({
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "div",
     {
-      className: `relative rounded-[var(--radius-xl)] border p-6 flex flex-col ${highlighted ? "border-[var(--brand-primary)] shadow-[0_0_0_1px_var(--brand-primary),var(--shadow-lg)] bg-[var(--bg)]" : "border-[var(--border-color)] bg-[var(--bg)] shadow-[var(--shadow-xs)]"} ${className}`,
+      className: `${PricingCard_module_default.root}${highlighted ? ` ${PricingCard_module_default.highlighted}` : ""}${className ? ` ${className}` : ""}`,
       children: [
-        badge && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute -top-3 left-1/2 -translate-x-1/2", children: /* @__PURE__ */ jsxRuntime.jsx(Badge, { color: "info", children: badge }) }),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-4", children: [
-          /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-lg font-semibold text-[var(--fg)]", children: plan }),
-          description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-[var(--fg-muted)] mt-1", children: description })
+        badge && /* @__PURE__ */ jsxRuntime.jsx("div", { className: PricingCard_module_default.badgeWrap, children: /* @__PURE__ */ jsxRuntime.jsx(Badge, { color: "info", children: badge }) }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: PricingCard_module_default.header, children: [
+          /* @__PURE__ */ jsxRuntime.jsx("h3", { className: PricingCard_module_default.plan, children: plan }),
+          description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: PricingCard_module_default.description, children: description })
         ] }),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-6", children: [
-          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-4xl font-bold text-[var(--fg)]", children: price }),
-          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[var(--fg-muted)]", children: period })
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: PricingCard_module_default.priceBlock, children: [
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: PricingCard_module_default.price, children: price }),
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: PricingCard_module_default.period, children: period })
         ] }),
-        /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "space-y-3 mb-8 flex-1", children: features.map((feature, i) => /* @__PURE__ */ jsxRuntime.jsxs("li", { className: "flex items-start gap-2.5 text-sm text-[var(--fg-secondary)]", children: [
-          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "shrink-0 mt-0.5 text-[var(--color-success)]", children: /* @__PURE__ */ jsxRuntime.jsx(IconlyCheck, { size: 16 }) }),
+        /* @__PURE__ */ jsxRuntime.jsx("ul", { className: PricingCard_module_default.features, children: features.map((feature, i) => /* @__PURE__ */ jsxRuntime.jsxs("li", { className: PricingCard_module_default.featureItem, children: [
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: PricingCard_module_default.featureIcon, children: /* @__PURE__ */ jsxRuntime.jsx(IconlyCheck, { size: 16 }) }),
           feature
         ] }, i)) }),
-        /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: highlighted ? "primary" : "outline", className: "w-full", children: "Get started" })
+        /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: highlighted ? "primary" : "outline", className: PricingCard_module_default.cta, children: "Get started" })
       ]
     }
   );
 }
+
+// src/organisms/TestimonialCard.module.scss
+var TestimonialCard_module_default = {
+  root: "TestimonialCard_module_root",
+  quoteIcon: "TestimonialCard_module_quoteIcon",
+  quoteText: "TestimonialCard_module_quoteText",
+  author: "TestimonialCard_module_author",
+  authorName: "TestimonialCard_module_authorName",
+  authorRole: "TestimonialCard_module_authorRole"
+};
 function TestimonialCard({ quote, name, role, avatarSrc, className = "" }) {
   const initials = name.split(" ").map((n) => n[0]).join("").toUpperCase();
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `rounded-[var(--radius-xl)] border border-[var(--border-color)] bg-[var(--bg)] p-6 shadow-[var(--shadow-xs)] ${className}`, children: [
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-[var(--brand-primary)] opacity-30 mb-4", children: /* @__PURE__ */ jsxRuntime.jsx(IconlyQuote, { size: 32 }) }),
-    /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-sm text-[var(--fg-secondary)] leading-relaxed mb-6", children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `${TestimonialCard_module_default.root}${className ? ` ${className}` : ""}`, children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: TestimonialCard_module_default.quoteIcon, children: /* @__PURE__ */ jsxRuntime.jsx(IconlyQuote, { size: 32 }) }),
+    /* @__PURE__ */ jsxRuntime.jsxs("p", { className: TestimonialCard_module_default.quoteText, children: [
       "\u201C",
       quote,
       "\u201D"
     ] }),
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: TestimonialCard_module_default.author, children: [
       /* @__PURE__ */ jsxRuntime.jsx(Avatar, { src: avatarSrc, initials, size: "sm" }),
       /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-medium text-[var(--fg)]", children: name }),
-        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-[var(--fg-muted)]", children: role })
+        /* @__PURE__ */ jsxRuntime.jsx("p", { className: TestimonialCard_module_default.authorName, children: name }),
+        /* @__PURE__ */ jsxRuntime.jsx("p", { className: TestimonialCard_module_default.authorRole, children: role })
       ] })
     ] })
   ] });
 }
+
+// src/organisms/FeatureGrid.module.scss
+var FeatureGrid_module_default = {
+  root: "FeatureGrid_module_root",
+  cols2: "FeatureGrid_module_cols2",
+  cols3: "FeatureGrid_module_cols3",
+  cols4: "FeatureGrid_module_cols4",
+  card: "FeatureGrid_module_card",
+  cardIcon: "FeatureGrid_module_cardIcon",
+  cardTitle: "FeatureGrid_module_cardTitle",
+  cardDescription: "FeatureGrid_module_cardDescription"
+};
 function FeatureGrid({ features, columns = 3, className = "" }) {
-  const gridCols = {
-    2: "md:grid-cols-2",
-    3: "md:grid-cols-3",
-    4: "md:grid-cols-2 lg:grid-cols-4"
+  const colsClass = {
+    2: FeatureGrid_module_default.cols2,
+    3: FeatureGrid_module_default.cols3,
+    4: FeatureGrid_module_default.cols4
   };
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: `grid grid-cols-1 ${gridCols[columns]} gap-6 ${className}`, children: features.map((feature, i) => /* @__PURE__ */ jsxRuntime.jsxs(
-    "div",
-    {
-      className: "rounded-[var(--radius-xl)] border border-[var(--border-color)] bg-[var(--bg)] p-6 transition-all duration-[var(--transition-base)] hover:shadow-[var(--shadow-md)] hover:-translate-y-0.5",
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-10 h-10 rounded-[var(--radius-lg)] bg-[var(--brand-primary)]/10 flex items-center justify-center text-[var(--brand-primary)] mb-4", children: feature.icon }),
-        /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-sm font-semibold text-[var(--fg)] mb-1.5", children: feature.title }),
-        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-[var(--fg-muted)] leading-relaxed", children: feature.description })
-      ]
-    },
-    i
-  )) });
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${FeatureGrid_module_default.root} ${colsClass[columns]}${className ? ` ${className}` : ""}`, children: features.map((feature, i) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: FeatureGrid_module_default.card, children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: FeatureGrid_module_default.cardIcon, children: feature.icon }),
+    /* @__PURE__ */ jsxRuntime.jsx("h3", { className: FeatureGrid_module_default.cardTitle, children: feature.title }),
+    /* @__PURE__ */ jsxRuntime.jsx("p", { className: FeatureGrid_module_default.cardDescription, children: feature.description })
+  ] }, i)) });
 }
+
+// src/organisms/Sidebar.module.scss
+var Sidebar_module_default = {
+  root: "Sidebar_module_root",
+  menu: "Sidebar_module_menu",
+  courseSubmenu: "Sidebar_module_courseSubmenu",
+  logo: "Sidebar_module_logo",
+  nav: "Sidebar_module_nav",
+  footer: "Sidebar_module_footer",
+  legal: "Sidebar_module_legal"
+};
 var defaultMenuItems = [
   "\u0413\u043B\u0430\u0432\u043D\u0430\u044F",
   "\u041C\u043E\u0438 \u043A\u0443\u0440\u0441\u044B",
@@ -1623,36 +1989,80 @@ var courseMenuItems = [
   "\u0421\u043E\u0446. \u043F\u0440\u043E\u0433\u0440\u0430\u043C\u043C\u0430",
   "\u041A\u043E\u043D\u0442\u0430\u043A\u0442\u044B"
 ];
-function Sidebar({ type = "menu", menuItems, footer, className = "" }) {
-  const items = menuItems || (type === "courseSubmenu" ? courseMenuItems : defaultMenuItems);
-  const [active, setActive] = react.useState(0);
-  const width = type === "courseSubmenu" ? "w-[340px]" : "w-[240px]";
+var DEFAULT_LEGAL = "kapustin.cc, 2026 \n\u0418\u041F \u041A\u0430\u043F\u0443\u0441\u0442\u0438\u043D \u0414.\u0412., \u0418\u041D\u041D 7721250201";
+function normaliseItems(items) {
+  if (items.length === 0) return [];
+  if (typeof items[0] === "string") {
+    return items.map((label, i) => ({ id: String(i), label }));
+  }
+  return items;
+}
+function Sidebar({
+  type = "menu",
+  menuItems,
+  footer,
+  className = "",
+  activeId,
+  onItemClick,
+  logo,
+  legalText
+}) {
+  const rawItems = menuItems || (type === "courseSubmenu" ? courseMenuItems : defaultMenuItems);
+  const items = normaliseItems(rawItems);
+  const [internalActive, setInternalActive] = react.useState(0);
+  const isControlled = activeId !== void 0;
+  const widthClass = type === "courseSubmenu" ? Sidebar_module_default.courseSubmenu : Sidebar_module_default.menu;
+  const showLegal = legalText !== null;
+  const legalContent = legalText === void 0 ? DEFAULT_LEGAL : legalText;
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "aside",
     {
-      className: `bg-[var(--bg)] border-r border-[var(--border-color)] flex flex-col justify-between p-8 shrink-0 h-full ${width} ${className}`,
+      className: `${Sidebar_module_default.root} ${widthClass}${className ? ` ${className}` : ""}`,
       children: [
-        /* @__PURE__ */ jsxRuntime.jsx("nav", { className: "flex flex-col gap-1 items-start", children: items.map((item, i) => /* @__PURE__ */ jsxRuntime.jsx(
-          MenuItem,
-          {
-            text: item,
-            active: i === active,
-            onClick: () => setActive(i)
-          },
-          `${item}-${i}`
-        )) }),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-5 w-full", children: [
+        logo && /* @__PURE__ */ jsxRuntime.jsx("div", { className: Sidebar_module_default.logo, children: logo }),
+        /* @__PURE__ */ jsxRuntime.jsx("nav", { className: Sidebar_module_default.nav, children: items.map((item, i) => {
+          const isActive = isControlled ? item.id === activeId : i === internalActive;
+          return /* @__PURE__ */ jsxRuntime.jsx(
+            MenuItem,
+            {
+              text: item.label,
+              icon: item.icon,
+              active: isActive,
+              onClick: () => {
+                if (onItemClick) onItemClick(item.id);
+                if (!isControlled) setInternalActive(i);
+              }
+            },
+            item.id
+          );
+        }) }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: Sidebar_module_default.footer, children: [
           type === "menu" && footer,
-          /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-[10px] text-[var(--fg-muted)] tracking-[-0.2px]", children: [
-            "kapustin.cc, 2026 ",
-            /* @__PURE__ */ jsxRuntime.jsx("br", {}),
-            "\u0418\u041F \u041A\u0430\u043F\u0443\u0441\u0442\u0438\u043D \u0414.\u0412., \u0418\u041D\u041D 7721250201"
-          ] })
+          showLegal && /* @__PURE__ */ jsxRuntime.jsx("p", { className: Sidebar_module_default.legal, children: legalContent })
         ] })
       ]
     }
   );
 }
+
+// src/organisms/AppCard.module.scss
+var AppCard_module_default = {
+  defaultCard: "AppCard_module_defaultCard",
+  stampCard: "AppCard_module_stampCard",
+  imageWrap: "AppCard_module_imageWrap",
+  imageWrapRounded: "AppCard_module_imageWrap AppCard_module_imageWrapRounded",
+  image: "AppCard_module_image",
+  contentDefaultNoImage: "AppCard_module_contentArea AppCard_module_contentDefault AppCard_module_contentDefaultNoImage",
+  contentDefaultWithImage: "AppCard_module_contentArea AppCard_module_contentDefault AppCard_module_contentDefaultWithImage",
+  contentStamp: "AppCard_module_contentArea AppCard_module_contentStamp",
+  textGroup: "AppCard_module_textGroup",
+  cardTitle: "AppCard_module_cardTitle",
+  cardDesc: "AppCard_module_cardDesc",
+  footer: "AppCard_module_footer",
+  iconRow: "AppCard_module_iconRow",
+  shadowWrap: "AppCard_module_shadowWrap",
+  stampBg: "AppCard_module_stampBg"
+};
 var HOLE_R = 4;
 var HOLE_SP = 16;
 function buildStampMask(w, h) {
@@ -1679,18 +2089,18 @@ function CardContent({
   isStamp
 }) {
   return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-    image && /* @__PURE__ */ jsxRuntime.jsx("div", { className: `relative w-full aspect-[16/9] overflow-hidden ${isStamp ? "" : "rounded-t-[16px]"}`, children: /* @__PURE__ */ jsxRuntime.jsx("img", { src: image, alt: title, className: "absolute inset-0 w-full h-full object-cover" }) }),
+    image && /* @__PURE__ */ jsxRuntime.jsx("div", { className: isStamp ? AppCard_module_default.imageWrap : AppCard_module_default.imageWrapRounded, children: /* @__PURE__ */ jsxRuntime.jsx("img", { src: image, alt: title, className: AppCard_module_default.image }) }),
     /* @__PURE__ */ jsxRuntime.jsxs(
       "div",
       {
-        className: `bg-[var(--bg)] overflow-hidden flex flex-col justify-between px-[25px] pt-[25px] pb-[21px] flex-1 min-h-[220px] relative ${isStamp ? "" : `border border-[var(--bg-tertiary)] shadow-[var(--shadow-md)] ${image ? "rounded-b-[16px]" : "rounded-[16px]"}`}`,
+        className: isStamp ? AppCard_module_default.contentStamp : image ? AppCard_module_default.contentDefaultWithImage : AppCard_module_default.contentDefaultNoImage,
         children: [
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-3 pr-8", children: [
-            /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-base font-semibold text-[var(--fg-secondary)] tracking-[-0.25px]", children: title }),
-            /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-[13px] text-[var(--fg-muted)] tracking-[-0.25px] leading-normal", children: description })
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: AppCard_module_default.textGroup, children: [
+            /* @__PURE__ */ jsxRuntime.jsx("h3", { className: AppCard_module_default.cardTitle, children: title }),
+            /* @__PURE__ */ jsxRuntime.jsx("p", { className: AppCard_module_default.cardDesc, children: description })
           ] }),
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between mt-5", children: [
-            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-1", children: icons }),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: AppCard_module_default.footer, children: [
+            /* @__PURE__ */ jsxRuntime.jsx("div", { className: AppCard_module_default.iconRow, children: icons }),
             /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: buttonVariant === "outline" ? "outline" : "primary", size: "sm", onClick: onButtonClick, children: buttonText })
           ] })
         ]
@@ -1707,7 +2117,7 @@ function AppCard(_a) {
     "className"
   ]);
   if (variant === "default") {
-    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: `flex flex-col w-[320px] ${className}`, children: /* @__PURE__ */ jsxRuntime.jsx(CardContent, __spreadProps(__spreadValues({}, contentProps), { isStamp: false })) });
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${AppCard_module_default.defaultCard}${className ? ` ${className}` : ""}`, children: /* @__PURE__ */ jsxRuntime.jsx(CardContent, __spreadProps(__spreadValues({}, contentProps), { isStamp: false })) });
   }
   const padded = variant === "stamp-padded";
   return /* @__PURE__ */ jsxRuntime.jsx(StampWrapper, { className, padded, children: /* @__PURE__ */ jsxRuntime.jsx(CardContent, __spreadProps(__spreadValues({}, contentProps), { isStamp: true })) });
@@ -1733,7 +2143,7 @@ function StampWrapper({ children, className, padded }) {
       ro.disconnect();
     };
   }, [build]);
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: `flex flex-col w-[320px] relative ${className}`, children: /* @__PURE__ */ jsxRuntime.jsx("div", { style: { filter: "drop-shadow(0 1px 3px rgba(0,0,0,0.15)) drop-shadow(0 4px 12px rgba(0,0,0,0.12))" }, children: /* @__PURE__ */ jsxRuntime.jsx(
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: `${AppCard_module_default.stampCard}${className ? ` ${className}` : ""}`, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: AppCard_module_default.shadowWrap, children: /* @__PURE__ */ jsxRuntime.jsx(
     "div",
     {
       style: {
@@ -1742,10 +2152,15 @@ function StampWrapper({ children, className, padded }) {
         WebkitMaskSize: "100% 100%",
         maskSize: "100% 100%"
       },
-      children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "bg-[var(--bg)]", style: padded ? { padding: STAMP_PADDING } : void 0, children })
+      children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: AppCard_module_default.stampBg, style: padded ? { padding: STAMP_PADDING } : void 0, children })
     }
   ) }) });
 }
+
+// src/organisms/AppTopLine.module.scss
+var AppTopLine_module_default = {
+  root: "AppTopLine_module_root"
+};
 function AppTopLine({
   promoText = "\u0412\u0430\u043C \u0434\u043E\u0441\u0442\u0443\u043F\u043D\u0430 \u0441\u043A\u0438\u0434\u043A\u0430 10% \u043D\u0430 \u0432\u0441\u0435 \u043F\u043B\u0430\u0442\u043D\u044B\u0435 \u043A\u0443\u0440\u0441\u044B",
   promoButtonText = "\u0421\u043C\u043E\u0442\u0440\u0435\u0442\u044C",
@@ -1758,19 +2173,51 @@ function AppTopLine({
   avatarSrc,
   className = ""
 }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `bg-[var(--bg)] flex items-center justify-between w-full ${className}`, children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `${AppTopLine_module_default.root}${className ? ` ${className}` : ""}`, children: [
     /* @__PURE__ */ jsxRuntime.jsx(TopPromo, { text: promoText, buttonText: promoButtonText }),
     /* @__PURE__ */ jsxRuntime.jsx(ProfileNav, { stats, avatarSrc })
   ] });
 }
+
+// src/organisms/EmptyState.module.scss
+var EmptyState_module_default = {
+  root: "EmptyState_module_root",
+  icon: "EmptyState_module_icon",
+  title: "EmptyState_module_title",
+  description: "EmptyState_module_description",
+  action: "EmptyState_module_action"
+};
 function EmptyState({ icon, title, description, action, className = "" }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `rounded-[var(--radius-xl)] border border-[var(--border-color)] bg-[var(--bg)] p-8 shadow-[var(--shadow-xs)] flex flex-col items-center text-center ${className}`, children: [
-    icon && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-[var(--fg-muted)] mb-4", children: icon }),
-    /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-lg font-semibold text-[var(--fg)]", children: title }),
-    /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-[13px] text-[var(--fg-muted)] tracking-[-0.25px] mt-1 max-w-sm", children: description }),
-    action && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-5", children: action })
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `${EmptyState_module_default.root}${className ? ` ${className}` : ""}`, children: [
+    icon && /* @__PURE__ */ jsxRuntime.jsx("div", { className: EmptyState_module_default.icon, children: icon }),
+    /* @__PURE__ */ jsxRuntime.jsx("h3", { className: EmptyState_module_default.title, children: title }),
+    /* @__PURE__ */ jsxRuntime.jsx("p", { className: EmptyState_module_default.description, children: description }),
+    action && /* @__PURE__ */ jsxRuntime.jsx("div", { className: EmptyState_module_default.action, children: action })
   ] });
 }
+
+// src/organisms/HeroSection.module.scss
+var HeroSection_module_default = {
+  root: "HeroSection_module_root",
+  bgGlow: "HeroSection_module_bgGlow",
+  glowOrb: "HeroSection_module_glowOrb",
+  inner: "HeroSection_module_inner",
+  innerCompact: "HeroSection_module_innerCompact",
+  content: "HeroSection_module_content",
+  contentCenter: "HeroSection_module_content HeroSection_module_contentCenter",
+  eyebrowWrap: "HeroSection_module_eyebrowWrap",
+  eyebrowCenter: "HeroSection_module_eyebrowCenter",
+  eyebrow: "HeroSection_module_eyebrow",
+  eyebrowDot: "HeroSection_module_eyebrowDot",
+  title: "HeroSection_module_title",
+  subtitle: "HeroSection_module_subtitle",
+  subtitleCenter: "HeroSection_module_subtitleCenter",
+  actions: "HeroSection_module_actions",
+  actionsCenter: "HeroSection_module_actionsCenter",
+  mediaWrapCenter: "HeroSection_module_mediaWrap HeroSection_module_mediaWrapCenter",
+  mediaWrapLeft: "HeroSection_module_mediaWrap HeroSection_module_mediaWrapLeft",
+  mediaBox: "HeroSection_module_mediaBox"
+};
 function HeroSection({
   eyebrow,
   title,
@@ -1783,30 +2230,40 @@ function HeroSection({
 }) {
   const isCenter = align === "center";
   const isCompact = size === "compact";
-  return /* @__PURE__ */ jsxRuntime.jsxs("section", { className: `relative overflow-hidden ${className}`, children: [
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-0 pointer-events-none", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute top-0 left-1/2 -translate-x-1/2 w-[800px] h-[600px] bg-[radial-gradient(ellipse_at_center,var(--brand-primary)_0%,transparent_70%)] opacity-[0.04]" }) }),
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `relative ${isCompact ? "py-16 md:py-20" : "py-20 md:py-32"}`, children: [
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `max-w-4xl ${isCenter ? "mx-auto text-center" : ""}`, children: [
-        eyebrow && /* @__PURE__ */ jsxRuntime.jsx("div", { className: `mb-4 md:mb-5 ${isCenter ? "flex justify-center" : ""}`, children: /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "inline-flex items-center gap-1.5 px-3 py-1 rounded-full text-[11px] font-semibold uppercase tracking-[0.08em] bg-[var(--brand-primary)]/10 text-[var(--brand-primary)] border border-[var(--brand-primary)]/15", children: [
-          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "w-1.5 h-1.5 rounded-full bg-[var(--brand-primary)] animate-pulse" }),
+  return /* @__PURE__ */ jsxRuntime.jsxs("section", { className: `${HeroSection_module_default.root}${className ? ` ${className}` : ""}`, children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: HeroSection_module_default.bgGlow, "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: HeroSection_module_default.glowOrb }) }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: isCompact ? HeroSection_module_default.innerCompact : HeroSection_module_default.inner, children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: isCenter ? HeroSection_module_default.contentCenter : HeroSection_module_default.content, children: [
+        eyebrow && /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${HeroSection_module_default.eyebrowWrap}${isCenter ? ` ${HeroSection_module_default.eyebrowCenter}` : ""}`, children: /* @__PURE__ */ jsxRuntime.jsxs("span", { className: HeroSection_module_default.eyebrow, children: [
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: HeroSection_module_default.eyebrowDot }),
           eyebrow
         ] }) }),
-        /* @__PURE__ */ jsxRuntime.jsx("h1", { className: `text-[clamp(2rem,5vw,3.75rem)] font-bold leading-[1.08] tracking-[-0.035em] text-[var(--fg)] text-balance`, children: title }),
-        subtitle && /* @__PURE__ */ jsxRuntime.jsx("p", { className: `mt-5 md:mt-6 text-base md:text-lg text-[var(--fg-secondary)] leading-relaxed max-w-2xl ${isCenter ? "mx-auto" : ""}`, children: subtitle }),
-        actions && /* @__PURE__ */ jsxRuntime.jsx("div", { className: `mt-8 md:mt-10 flex flex-wrap gap-3 ${isCenter ? "justify-center" : ""}`, children: actions })
+        /* @__PURE__ */ jsxRuntime.jsx("h1", { className: HeroSection_module_default.title, children: title }),
+        subtitle && /* @__PURE__ */ jsxRuntime.jsx("p", { className: `${HeroSection_module_default.subtitle}${isCenter ? ` ${HeroSection_module_default.subtitleCenter}` : ""}`, children: subtitle }),
+        actions && /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${HeroSection_module_default.actions}${isCenter ? ` ${HeroSection_module_default.actionsCenter}` : ""}`, children: actions })
       ] }),
-      media && /* @__PURE__ */ jsxRuntime.jsx("div", { className: `mt-12 md:mt-16 ${isCenter ? "max-w-5xl mx-auto" : "max-w-4xl"}`, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "rounded-[var(--radius-xl)] border border-[var(--border-color)] shadow-[var(--shadow-xl)] overflow-hidden bg-[var(--bg-secondary)]", children: media }) })
+      media && /* @__PURE__ */ jsxRuntime.jsx("div", { className: isCenter ? HeroSection_module_default.mediaWrapCenter : HeroSection_module_default.mediaWrapLeft, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: HeroSection_module_default.mediaBox, children: media }) })
     ] })
   ] });
 }
+
+// src/organisms/LogoCloud.module.scss
+var LogoCloud_module_default = {
+  root: "LogoCloud_module_root",
+  label: "LogoCloud_module_label",
+  grid: "LogoCloud_module_grid",
+  logoItem: "LogoCloud_module_logoItem",
+  logoImg: "LogoCloud_module_logoImg",
+  logoText: "LogoCloud_module_logoText"
+};
 function LogoCloud({
   label = "Trusted by teams at",
   logos,
   className = ""
 }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs("section", { className: `py-10 md:py-14 ${className}`, children: [
-    label && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-center text-[11px] font-semibold uppercase tracking-[0.1em] text-[var(--fg-muted)] mb-8", children: label }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-wrap items-center justify-center gap-x-10 gap-y-6 md:gap-x-14", children: logos.map((logo) => /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-2 opacity-40 hover:opacity-70 transition-opacity duration-[var(--transition-base)]", children: logo.src ? (
+  return /* @__PURE__ */ jsxRuntime.jsxs("section", { className: `${LogoCloud_module_default.root}${className ? ` ${className}` : ""}`, children: [
+    label && /* @__PURE__ */ jsxRuntime.jsx("p", { className: LogoCloud_module_default.label, children: label }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: LogoCloud_module_default.grid, children: logos.map((logo) => /* @__PURE__ */ jsxRuntime.jsx("div", { className: LogoCloud_module_default.logoItem, children: logo.src ? (
       // eslint-disable-next-line @next/next/no-img-element
       /* @__PURE__ */ jsxRuntime.jsx(
         "img",
@@ -1814,32 +2271,52 @@ function LogoCloud({
           src: logo.src,
           alt: logo.name,
           width: logo.width || 100,
-          className: "h-6 md:h-7 w-auto object-contain logo-img"
+          className: `${LogoCloud_module_default.logoImg} logo-img`
         }
       )
-    ) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm md:text-base font-bold tracking-[-0.02em] text-[var(--fg)] select-none", children: logo.name }) }, logo.name)) })
+    ) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: LogoCloud_module_default.logoText, children: logo.name }) }, logo.name)) })
   ] });
 }
+
+// src/organisms/StatsBar.module.scss
+var StatsBar_module_default = {
+  root: "StatsBar_module_root",
+  inline: "StatsBar_module_inline",
+  inlineGrid: "StatsBar_module_inlineGrid",
+  inlineItem: "StatsBar_module_inlineItem",
+  cardsGrid: "StatsBar_module_cardsGrid",
+  card: "StatsBar_module_card",
+  cardIconWrap: "StatsBar_module_cardIconWrap",
+  statValue: "StatsBar_module_statValue",
+  statLabel: "StatsBar_module_statLabel"
+};
 function StatsBar({ stats, variant = "inline", className = "" }) {
   if (variant === "cards") {
-    return /* @__PURE__ */ jsxRuntime.jsx("section", { className: `py-10 md:py-14 ${className}`, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-2 md:grid-cols-4 gap-4", children: stats.map((stat, i) => /* @__PURE__ */ jsxRuntime.jsxs(
-      "div",
-      {
-        className: "rounded-[var(--radius-xl)] border border-[var(--border-color)] bg-[var(--bg)] p-5 md:p-6 text-center transition-all duration-[var(--transition-base)] hover:shadow-[var(--shadow-md)] hover:-translate-y-0.5",
-        children: [
-          stat.icon && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex justify-center mb-3 text-[var(--brand-primary)]", children: stat.icon }),
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-2xl md:text-3xl font-bold text-[var(--fg)] tracking-[-0.03em] tabular-nums", children: stat.value }),
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-1 text-[13px] text-[var(--fg-muted)] tracking-[-0.25px]", children: stat.label })
-        ]
-      },
-      i
-    )) }) });
+    return /* @__PURE__ */ jsxRuntime.jsx("section", { className: `${StatsBar_module_default.root}${className ? ` ${className}` : ""}`, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: StatsBar_module_default.cardsGrid, children: stats.map((stat, i) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: StatsBar_module_default.card, children: [
+      stat.icon && /* @__PURE__ */ jsxRuntime.jsx("div", { className: StatsBar_module_default.cardIconWrap, children: stat.icon }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: StatsBar_module_default.statValue, children: stat.value }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: StatsBar_module_default.statLabel, children: stat.label })
+    ] }, i)) }) });
   }
-  return /* @__PURE__ */ jsxRuntime.jsx("section", { className: `py-10 md:py-14 border-y border-[var(--border-color)] ${className}`, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-wrap items-center justify-center gap-8 md:gap-16", children: stats.map((stat, i) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-center", children: [
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-2xl md:text-3xl font-bold text-[var(--fg)] tracking-[-0.03em] tabular-nums", children: stat.value }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-1 text-[13px] text-[var(--fg-muted)] tracking-[-0.25px]", children: stat.label })
+  return /* @__PURE__ */ jsxRuntime.jsx("section", { className: `${StatsBar_module_default.root} ${StatsBar_module_default.inline}${className ? ` ${className}` : ""}`, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: StatsBar_module_default.inlineGrid, children: stats.map((stat, i) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: StatsBar_module_default.inlineItem, children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: StatsBar_module_default.statValue, children: stat.value }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: StatsBar_module_default.statLabel, children: stat.label })
   ] }, i)) }) });
 }
+
+// src/organisms/CTASection.module.scss
+var CTASection_module_default = {
+  root: "CTASection_module_root",
+  default: "CTASection_module_default",
+  filled: "CTASection_module_filled",
+  bordered: "CTASection_module_bordered",
+  inner: "CTASection_module_inner",
+  title: "CTASection_module_title",
+  titleFilled: "CTASection_module_titleFilled",
+  description: "CTASection_module_description",
+  descriptionFilled: "CTASection_module_descriptionFilled",
+  actions: "CTASection_module_actions"
+};
 function CTASection({
   title,
   description,
@@ -1847,44 +2324,42 @@ function CTASection({
   variant = "default",
   className = ""
 }) {
-  const variantStyles5 = {
-    default: "py-16 md:py-24",
-    filled: "py-12 md:py-16 px-6 md:px-12 rounded-[var(--radius-xl)] bg-[var(--fg)] text-[var(--bg)]",
-    bordered: "py-12 md:py-16 px-6 md:px-12 rounded-[var(--radius-xl)] border-2 border-dashed border-[var(--border-color-strong)]"
-  };
   const isFilled = variant === "filled";
-  return /* @__PURE__ */ jsxRuntime.jsx("section", { className: `${variantStyles5[variant]} ${className}`, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "max-w-2xl mx-auto text-center", children: [
-    /* @__PURE__ */ jsxRuntime.jsx(
-      "h2",
-      {
-        className: `text-2xl md:text-4xl font-bold tracking-[-0.03em] leading-[1.1] ${isFilled ? "text-[var(--bg)]" : "text-[var(--fg)]"}`,
-        children: title
-      }
-    ),
-    description && /* @__PURE__ */ jsxRuntime.jsx(
-      "p",
-      {
-        className: `mt-4 text-base leading-relaxed ${isFilled ? "text-[var(--bg)]/70" : "text-[var(--fg-secondary)]"}`,
-        children: description
-      }
-    ),
-    actions && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-8 flex flex-wrap gap-3 justify-center", children: actions })
+  return /* @__PURE__ */ jsxRuntime.jsx("section", { className: `${CTASection_module_default.root} ${CTASection_module_default[variant]}${className ? ` ${className}` : ""}`, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: CTASection_module_default.inner, children: [
+    /* @__PURE__ */ jsxRuntime.jsx("h2", { className: `${CTASection_module_default.title}${isFilled ? ` ${CTASection_module_default.titleFilled}` : ""}`, children: title }),
+    description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: `${CTASection_module_default.description}${isFilled ? ` ${CTASection_module_default.descriptionFilled}` : ""}`, children: description }),
+    actions && /* @__PURE__ */ jsxRuntime.jsx("div", { className: CTASection_module_default.actions, children: actions })
   ] }) });
 }
+
+// src/organisms/BentoGrid.module.scss
+var BentoGrid_module_default = {
+  root: "BentoGrid_module_root",
+  grid: "BentoGrid_module_grid",
+  item: "BentoGrid_module_item",
+  colSpan2: "BentoGrid_module_colSpan2",
+  rowSpan2: "BentoGrid_module_rowSpan2",
+  mediaWrap: "BentoGrid_module_mediaWrap",
+  content: "BentoGrid_module_content",
+  contentTall: "BentoGrid_module_contentTall",
+  itemIcon: "BentoGrid_module_itemIcon",
+  itemTitle: "BentoGrid_module_itemTitle",
+  itemDescription: "BentoGrid_module_itemDescription"
+};
 function BentoGrid({ items, className = "" }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("section", { className: `py-10 md:py-14 ${className}`, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-4", children: items.map((item, i) => {
-    const colSpanClass = item.span === 2 ? "md:col-span-2" : "";
-    const rowSpanClass = item.rowSpan === 2 ? "md:row-span-2" : "";
+  return /* @__PURE__ */ jsxRuntime.jsx("section", { className: `${BentoGrid_module_default.root}${className ? ` ${className}` : ""}`, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: BentoGrid_module_default.grid, children: items.map((item, i) => {
+    const spanClass = item.span === 2 ? ` ${BentoGrid_module_default.colSpan2}` : "";
+    const rowClass = item.rowSpan === 2 ? ` ${BentoGrid_module_default.rowSpan2}` : "";
     return /* @__PURE__ */ jsxRuntime.jsxs(
       "div",
       {
-        className: `group relative rounded-[var(--radius-xl)] border border-[var(--border-color)] bg-[var(--bg)] overflow-hidden transition-all duration-[var(--transition-base)] hover:shadow-[var(--shadow-md)] hover:border-[var(--border-color-strong)] ${colSpanClass} ${rowSpanClass} ${item.className || ""}`,
+        className: `${BentoGrid_module_default.item}${spanClass}${rowClass}${item.className ? ` ${item.className}` : ""}`,
         children: [
-          item.media && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-full overflow-hidden", children: item.media }),
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `p-5 md:p-6 ${item.rowSpan === 2 ? "flex flex-col h-full" : ""}`, children: [
-            item.icon && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-9 h-9 rounded-[var(--radius-md)] bg-[var(--brand-primary)]/10 flex items-center justify-center text-[var(--brand-primary)] mb-3.5", children: item.icon }),
-            /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-[15px] font-semibold text-[var(--fg)] tracking-[-0.01em]", children: item.title }),
-            item.description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-1.5 text-[13px] text-[var(--fg-muted)] leading-relaxed tracking-[-0.25px]", children: item.description })
+          item.media && /* @__PURE__ */ jsxRuntime.jsx("div", { className: BentoGrid_module_default.mediaWrap, children: item.media }),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `${BentoGrid_module_default.content}${item.rowSpan === 2 ? ` ${BentoGrid_module_default.contentTall}` : ""}`, children: [
+            item.icon && /* @__PURE__ */ jsxRuntime.jsx("div", { className: BentoGrid_module_default.itemIcon, children: item.icon }),
+            /* @__PURE__ */ jsxRuntime.jsx("h3", { className: BentoGrid_module_default.itemTitle, children: item.title }),
+            item.description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: BentoGrid_module_default.itemDescription, children: item.description })
           ] })
         ]
       },
@@ -1892,6 +2367,23 @@ function BentoGrid({ items, className = "" }) {
     );
   }) }) });
 }
+
+// src/organisms/FAQSection.module.scss
+var FAQSection_module_default = {
+  root: "FAQSection_module_root",
+  container: "FAQSection_module_container",
+  title: "FAQSection_module_title",
+  subtitle: "FAQSection_module_subtitle",
+  list: "FAQSection_module_list",
+  item: "FAQSection_module_item",
+  question: "FAQSection_module_question",
+  questionText: "FAQSection_module_questionText",
+  toggleIcon: "FAQSection_module_toggleIcon",
+  toggleIconOpen: "FAQSection_module_toggleIcon FAQSection_module_toggleIconOpen",
+  answerOpen: "FAQSection_module_answer FAQSection_module_answerOpen",
+  answerClosed: "FAQSection_module_answer FAQSection_module_answerClosed",
+  answerText: "FAQSection_module_answerText"
+};
 function FAQSection({
   title = "Frequently asked questions",
   subtitle,
@@ -1900,64 +2392,72 @@ function FAQSection({
 }) {
   const [openIndex, setOpenIndex] = react.useState(null);
   const toggle = (i) => setOpenIndex(openIndex === i ? null : i);
-  return /* @__PURE__ */ jsxRuntime.jsx("section", { className: `py-14 md:py-20 ${className}`, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "max-w-2xl mx-auto", children: [
-    title && /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-2xl md:text-3xl font-bold text-[var(--fg)] tracking-[-0.03em] text-center", children: title }),
-    subtitle && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-3 text-base text-[var(--fg-secondary)] text-center", children: subtitle }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${title || subtitle ? "mt-10" : ""} divide-y divide-[var(--border-color)]`, children: items.map((item, i) => {
+  return /* @__PURE__ */ jsxRuntime.jsx("section", { className: `${FAQSection_module_default.root}${className ? ` ${className}` : ""}`, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: FAQSection_module_default.container, children: [
+    title && /* @__PURE__ */ jsxRuntime.jsx("h2", { className: FAQSection_module_default.title, children: title }),
+    subtitle && /* @__PURE__ */ jsxRuntime.jsx("p", { className: FAQSection_module_default.subtitle, children: subtitle }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: title || subtitle ? FAQSection_module_default.list : "", children: items.map((item, i) => {
       const isOpen = openIndex === i;
-      return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "py-5", children: [
+      return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: FAQSection_module_default.item, children: [
         /* @__PURE__ */ jsxRuntime.jsxs(
           "button",
           {
             onClick: () => toggle(i),
-            className: "w-full flex items-center justify-between gap-4 text-left cursor-pointer group",
+            className: FAQSection_module_default.question,
             "aria-expanded": isOpen,
             children: [
-              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[15px] font-medium text-[var(--fg)] group-hover:text-[var(--brand-primary)] transition-colors", children: item.question }),
-              /* @__PURE__ */ jsxRuntime.jsx(
-                "span",
-                {
-                  className: `shrink-0 w-5 h-5 flex items-center justify-center text-[var(--fg-muted)] transition-transform duration-200 ${isOpen ? "rotate-45" : ""}`,
-                  children: /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M7 1v12M1 7h12", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" }) })
-                }
-              )
+              /* @__PURE__ */ jsxRuntime.jsx("span", { className: FAQSection_module_default.questionText, children: item.question }),
+              /* @__PURE__ */ jsxRuntime.jsx("span", { className: isOpen ? FAQSection_module_default.toggleIconOpen : FAQSection_module_default.toggleIcon, children: /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M7 1v12M1 7h12", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" }) }) })
             ]
           }
         ),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          "div",
-          {
-            className: `overflow-hidden transition-all duration-200 ease-out ${isOpen ? "max-h-96 opacity-100 mt-3" : "max-h-0 opacity-0"}`,
-            children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-[14px] text-[var(--fg-secondary)] leading-relaxed pr-8", children: item.answer })
-          }
-        )
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: isOpen ? FAQSection_module_default.answerOpen : FAQSection_module_default.answerClosed, children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: FAQSection_module_default.answerText, children: item.answer }) })
       ] }, i);
     }) })
   ] }) });
 }
+
+// src/organisms/ComparisonTable.module.scss
+var ComparisonTable_module_default = {
+  root: "ComparisonTable_module_root",
+  scrollWrap: "ComparisonTable_module_scrollWrap",
+  table: "ComparisonTable_module_table",
+  headerCell: "ComparisonTable_module_headerCell",
+  columnHeader: "ComparisonTable_module_columnHeader",
+  columnHeaderHighlighted: "ComparisonTable_module_columnHeader ComparisonTable_module_columnHeaderHighlighted",
+  bodyRow: "ComparisonTable_module_bodyRow",
+  featureCell: "ComparisonTable_module_featureCell",
+  valueCell: "ComparisonTable_module_valueCell",
+  valueCellHighlighted: "ComparisonTable_module_valueCell ComparisonTable_module_valueCellHighlighted",
+  valueCellHighlightedLast: "ComparisonTable_module_valueCell ComparisonTable_module_valueCellHighlighted ComparisonTable_module_valueCellHighlightedLast",
+  iconSuccess: "ComparisonTable_module_iconSuccess",
+  iconMuted: "ComparisonTable_module_iconMuted",
+  textValue: "ComparisonTable_module_textValue"
+};
 function ComparisonTable({ columns, rows, className = "" }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("section", { className: `py-10 md:py-14 ${className}`, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "overflow-x-auto -mx-4 px-4", children: /* @__PURE__ */ jsxRuntime.jsxs("table", { className: "w-full border-collapse min-w-[500px]", children: [
+  return /* @__PURE__ */ jsxRuntime.jsx("section", { className: `${ComparisonTable_module_default.root}${className ? ` ${className}` : ""}`, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: ComparisonTable_module_default.scrollWrap, children: /* @__PURE__ */ jsxRuntime.jsxs("table", { className: ComparisonTable_module_default.table, children: [
     /* @__PURE__ */ jsxRuntime.jsx("thead", { children: /* @__PURE__ */ jsxRuntime.jsxs("tr", { children: [
-      /* @__PURE__ */ jsxRuntime.jsx("th", { className: "text-left py-4 px-4 text-[13px] font-medium text-[var(--fg-muted)] tracking-[-0.25px] w-[40%]" }),
+      /* @__PURE__ */ jsxRuntime.jsx("th", { className: ComparisonTable_module_default.headerCell }),
       columns.map((col, i) => /* @__PURE__ */ jsxRuntime.jsx(
         "th",
         {
-          className: `py-4 px-4 text-center text-sm font-semibold ${col.highlighted ? "text-[var(--brand-primary)] bg-[var(--brand-primary)]/5 rounded-t-[var(--radius-lg)]" : "text-[var(--fg)]"}`,
+          className: col.highlighted ? ComparisonTable_module_default.columnHeaderHighlighted : ComparisonTable_module_default.columnHeader,
           children: col.label
         },
         i
       ))
     ] }) }),
-    /* @__PURE__ */ jsxRuntime.jsx("tbody", { children: rows.map((row, ri) => /* @__PURE__ */ jsxRuntime.jsxs("tr", { className: "border-t border-[var(--border-color)]", children: [
-      /* @__PURE__ */ jsxRuntime.jsx("td", { className: "py-3.5 px-4 text-[14px] text-[var(--fg-secondary)]", children: row.feature }),
+    /* @__PURE__ */ jsxRuntime.jsx("tbody", { children: rows.map((row, ri) => /* @__PURE__ */ jsxRuntime.jsxs("tr", { className: ComparisonTable_module_default.bodyRow, children: [
+      /* @__PURE__ */ jsxRuntime.jsx("td", { className: ComparisonTable_module_default.featureCell, children: row.feature }),
       row.values.map((val, vi) => {
         var _a;
         const isHighlighted = (_a = columns[vi]) == null ? void 0 : _a.highlighted;
+        const isLast = ri === rows.length - 1;
+        const cellClass = isHighlighted ? isLast ? ComparisonTable_module_default.valueCellHighlightedLast : ComparisonTable_module_default.valueCellHighlighted : ComparisonTable_module_default.valueCell;
         return /* @__PURE__ */ jsxRuntime.jsx(
           "td",
           {
-            className: `py-3.5 px-4 text-center ${isHighlighted ? "bg-[var(--brand-primary)]/5" : ""} ${ri === rows.length - 1 && isHighlighted ? "rounded-b-[var(--radius-lg)]" : ""}`,
-            children: typeof val === "boolean" ? val ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "inline-flex text-[var(--color-success)]", children: /* @__PURE__ */ jsxRuntime.jsx(IconlyCheck, { size: 18 }) }) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "inline-flex text-[var(--fg-muted)]/40", children: /* @__PURE__ */ jsxRuntime.jsx(IconlyClose, { size: 18 }) }) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[13px] font-medium text-[var(--fg)]", children: val })
+            className: cellClass,
+            children: typeof val === "boolean" ? val ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: ComparisonTable_module_default.iconSuccess, children: /* @__PURE__ */ jsxRuntime.jsx(IconlyCheck, { size: 18 }) }) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: ComparisonTable_module_default.iconMuted, children: /* @__PURE__ */ jsxRuntime.jsx(IconlyClose, { size: 18 }) }) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: ComparisonTable_module_default.textValue, children: val })
           },
           vi
         );
@@ -1965,79 +2465,121 @@ function ComparisonTable({ columns, rows, className = "" }) {
     ] }, ri)) })
   ] }) }) });
 }
+
+// src/organisms/PromoBento.module.scss
+var PromoBento_module_default = {
+  root: "PromoBento_module_root",
+  header: "PromoBento_module_header",
+  heading: "PromoBento_module_heading",
+  subtitle: "PromoBento_module_subtitle",
+  grid: "PromoBento_module_grid",
+  card: "PromoBento_module_card",
+  cardMedia: "PromoBento_module_cardMedia",
+  cardMediaInner: "PromoBento_module_cardMediaInner",
+  cardFade: "PromoBento_module_cardFade",
+  cardContent: "PromoBento_module_cardContent",
+  pill: "PromoBento_module_pill",
+  pillInner: "PromoBento_module_pillInner",
+  pillIcon: "PromoBento_module_pillIcon",
+  cardTitle: "PromoBento_module_cardTitle",
+  cardDesc: "PromoBento_module_cardDesc",
+  cardCta: "PromoBento_module_cardCta"
+};
 function PromoBentoCard({ pill, title, description, cta, media, className = "" }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    "div",
-    {
-      className: `relative flex flex-col rounded-[clamp(24px,3vw,48px)] bg-[var(--bg-secondary)] overflow-hidden group transition-shadow duration-[var(--transition-slow)] hover:shadow-[var(--shadow-lg)] ${className}`,
-      children: [
-        media && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex-1 min-h-[240px] md:min-h-[320px] overflow-hidden", children: [
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-0 flex items-center justify-center p-6", children: media }),
-          /* @__PURE__ */ jsxRuntime.jsx(
-            "div",
-            {
-              className: "absolute bottom-0 left-0 right-0 h-[140px] pointer-events-none",
-              style: {
-                background: "linear-gradient(to top, var(--bg-secondary) 0%, transparent 100%)"
-              }
-            }
-          )
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex flex-col gap-4 p-6 md:p-8 pt-0", children: [
-          pill && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex", children: /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "inline-flex items-center gap-2 px-4 py-2 rounded-full bg-[var(--bg)] border border-[var(--border-color)] text-sm font-semibold text-[var(--fg)]", children: [
-            pill.icon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "w-5 h-5 flex items-center justify-center", children: pill.icon }),
-            pill.label
-          ] }) }),
-          /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-xl md:text-[28px] leading-[1.2] tracking-[-0.02em] text-[var(--fg)]", children: title }),
-          description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm md:text-base leading-relaxed text-[var(--fg-secondary)] max-w-[85%]", children: description }),
-          cta && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-1", children: /* @__PURE__ */ jsxRuntime.jsx(
-            Button,
-            {
-              variant: "outline",
-              onClick: cta.onClick,
-              icon: /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M6 3l5 5-5 5" }) }),
-              children: cta.label
-            }
-          ) })
-        ] })
-      ]
-    }
-  );
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `${PromoBento_module_default.card}${className ? ` ${className}` : ""}`, children: [
+    media && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: PromoBento_module_default.cardMedia, children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: PromoBento_module_default.cardMediaInner, children: media }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: PromoBento_module_default.cardFade })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: PromoBento_module_default.cardContent, children: [
+      pill && /* @__PURE__ */ jsxRuntime.jsx("div", { className: PromoBento_module_default.pill, children: /* @__PURE__ */ jsxRuntime.jsxs("span", { className: PromoBento_module_default.pillInner, children: [
+        pill.icon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: PromoBento_module_default.pillIcon, children: pill.icon }),
+        pill.label
+      ] }) }),
+      /* @__PURE__ */ jsxRuntime.jsx("h3", { className: PromoBento_module_default.cardTitle, children: title }),
+      description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: PromoBento_module_default.cardDesc, children: description }),
+      cta && /* @__PURE__ */ jsxRuntime.jsx("div", { className: PromoBento_module_default.cardCta, children: /* @__PURE__ */ jsxRuntime.jsx(
+        Button,
+        {
+          variant: "outline",
+          onClick: cta.onClick,
+          icon: /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M6 3l5 5-5 5" }) }),
+          children: cta.label
+        }
+      ) })
+    ] })
+  ] });
 }
 function PromoBento({ heading, subtitle, items, className = "" }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs("section", { className: `py-16 md:py-24 ${className}`, children: [
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-10 md:mb-14 max-w-xl", children: [
-      /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-[clamp(1.75rem,4vw,2.75rem)] font-bold leading-[1.1] tracking-[-0.03em] text-[var(--fg)] text-balance", children: heading }),
-      subtitle && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-3 text-base text-[var(--fg-secondary)] leading-relaxed", children: subtitle })
+  return /* @__PURE__ */ jsxRuntime.jsxs("section", { className: `${PromoBento_module_default.root}${className ? ` ${className}` : ""}`, children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: PromoBento_module_default.header, children: [
+      /* @__PURE__ */ jsxRuntime.jsx("h2", { className: PromoBento_module_default.heading, children: heading }),
+      subtitle && /* @__PURE__ */ jsxRuntime.jsx("p", { className: PromoBento_module_default.subtitle, children: subtitle })
     ] }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-6 md:gap-9", children: items.map((item, i) => /* @__PURE__ */ jsxRuntime.jsx(PromoBentoCard, __spreadValues({}, item), i)) })
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: PromoBento_module_default.grid, children: items.map((item, i) => /* @__PURE__ */ jsxRuntime.jsx(PromoBentoCard, __spreadValues({}, item), i)) })
   ] });
 }
+
+// src/organisms/PromoShowcase.module.scss
+var PromoShowcase_module_default = {
+  root: "PromoShowcase_module_root",
+  heading: "PromoShowcase_module_heading",
+  headingText: "PromoShowcase_module_headingText",
+  body: "PromoShowcase_module_body",
+  stepper: "PromoShowcase_module_stepper",
+  stepButton: "PromoShowcase_module_stepButton",
+  stepButtonActive: "PromoShowcase_module_stepButtonActive",
+  contentArea: "PromoShowcase_module_contentArea",
+  panel: "PromoShowcase_module_panel",
+  panelActive: "PromoShowcase_module_panelActive",
+  panelInner: "PromoShowcase_module_panelInner"
+};
 function PromoShowcase({ heading, steps, className = "" }) {
   const [activeIndex, setActiveIndex] = react.useState(0);
-  return /* @__PURE__ */ jsxRuntime.jsxs("section", { className: `py-16 md:py-24 ${className}`, children: [
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-10 md:mb-14 max-w-xl", children: /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-[clamp(1.75rem,4vw,2.75rem)] font-bold leading-[1.1] tracking-[-0.03em] text-[var(--fg)] text-balance", children: heading }) }),
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-6 md:gap-8", children: [
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex gap-1 p-1 rounded-full bg-[var(--bg-secondary)] border border-[var(--border-color)] w-fit", children: steps.map((step, i) => /* @__PURE__ */ jsxRuntime.jsx(
+  return /* @__PURE__ */ jsxRuntime.jsxs("section", { className: `${PromoShowcase_module_default.root}${className ? ` ${className}` : ""}`, children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: PromoShowcase_module_default.heading, children: /* @__PURE__ */ jsxRuntime.jsx("h2", { className: PromoShowcase_module_default.headingText, children: heading }) }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: PromoShowcase_module_default.body, children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: PromoShowcase_module_default.stepper, children: steps.map((step, i) => /* @__PURE__ */ jsxRuntime.jsx(
         "button",
         {
           onClick: () => setActiveIndex(i),
-          className: `px-5 py-2.5 rounded-full text-sm font-medium transition-all duration-[var(--transition-base)] cursor-pointer ${i === activeIndex ? "bg-[var(--fg)] text-[var(--bg)] shadow-[var(--shadow-sm)]" : "text-[var(--fg-secondary)] hover:text-[var(--fg)] hover:bg-[var(--bg-tertiary)]"}`,
+          className: `${PromoShowcase_module_default.stepButton}${i === activeIndex ? ` ${PromoShowcase_module_default.stepButtonActive}` : ""}`,
           children: step.label
         },
         i
       )) }),
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative rounded-[clamp(16px,2vw,32px)] border border-[var(--border-color)] bg-[var(--bg-secondary)] overflow-hidden min-h-[300px] md:min-h-[480px]", children: steps.map((step, i) => /* @__PURE__ */ jsxRuntime.jsx(
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: PromoShowcase_module_default.contentArea, children: steps.map((step, i) => /* @__PURE__ */ jsxRuntime.jsx(
         "div",
         {
-          className: `absolute inset-0 transition-opacity duration-300 ease-out ${i === activeIndex ? "opacity-100 z-10" : "opacity-0 z-0 pointer-events-none"}`,
-          children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-full h-full flex items-center justify-center p-6 md:p-10", children: step.content })
+          className: `${PromoShowcase_module_default.panel}${i === activeIndex ? ` ${PromoShowcase_module_default.panelActive}` : ""}`,
+          children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: PromoShowcase_module_default.panelInner, children: step.content })
         },
         i
       )) })
     ] })
   ] });
 }
+
+// src/organisms/PromoSplit.module.scss
+var PromoSplit_module_default = {
+  root: "PromoSplit_module_root",
+  grid: "PromoSplit_module_grid",
+  gridReversed: "PromoSplit_module_grid PromoSplit_module_gridReversed",
+  textColumn: "PromoSplit_module_textColumn",
+  textColumnLtr: "PromoSplit_module_textColumnLtr",
+  heading: "PromoSplit_module_heading",
+  description: "PromoSplit_module_description",
+  features: "PromoSplit_module_features",
+  feature: "PromoSplit_module_feature",
+  featureTitle: "PromoSplit_module_featureTitle",
+  featureDesc: "PromoSplit_module_featureDesc",
+  mediaColumn: "PromoSplit_module_mediaColumn",
+  mediaColumnLtr: "PromoSplit_module_mediaColumnLtr",
+  mediaBox: "PromoSplit_module_mediaBox",
+  mediaContent: "PromoSplit_module_mediaContent",
+  mediaPlaceholder: "PromoSplit_module_mediaPlaceholder",
+  placeholderCircle: "PromoSplit_module_placeholderCircle"
+};
 function PromoSplit({
   heading,
   description,
@@ -2047,66 +2589,118 @@ function PromoSplit({
   className = ""
 }) {
   const isLeft = mediaPosition === "left";
-  return /* @__PURE__ */ jsxRuntime.jsx("section", { className: `py-16 md:py-24 ${className}`, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `grid grid-cols-1 lg:grid-cols-2 gap-10 md:gap-16 items-center ${isLeft ? "lg:[direction:rtl]" : ""}`, children: [
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `flex flex-col gap-6 ${isLeft ? "lg:[direction:ltr]" : ""}`, children: [
-      /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-[clamp(1.75rem,4vw,2.75rem)] font-bold leading-[1.1] tracking-[-0.03em] text-[var(--fg)] text-balance", children: heading }),
-      description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-base md:text-lg leading-relaxed text-[var(--fg-secondary)]", children: description }),
-      features && features.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-5 mt-2", children: features.map((feature, i) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-1.5", children: [
-        /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-base font-semibold text-[var(--fg)]", children: feature.title }),
-        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-[var(--fg-secondary)] leading-relaxed", children: feature.description })
+  return /* @__PURE__ */ jsxRuntime.jsx("section", { className: `${PromoSplit_module_default.root}${className ? ` ${className}` : ""}`, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: isLeft ? PromoSplit_module_default.gridReversed : PromoSplit_module_default.grid, children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `${PromoSplit_module_default.textColumn}${isLeft ? ` ${PromoSplit_module_default.textColumnLtr}` : ""}`, children: [
+      /* @__PURE__ */ jsxRuntime.jsx("h2", { className: PromoSplit_module_default.heading, children: heading }),
+      description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: PromoSplit_module_default.description, children: description }),
+      features && features.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: PromoSplit_module_default.features, children: features.map((feature, i) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: PromoSplit_module_default.feature, children: [
+        /* @__PURE__ */ jsxRuntime.jsx("h3", { className: PromoSplit_module_default.featureTitle, children: feature.title }),
+        /* @__PURE__ */ jsxRuntime.jsx("p", { className: PromoSplit_module_default.featureDesc, children: feature.description })
       ] }, i)) })
     ] }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: `relative ${isLeft ? "lg:[direction:ltr]" : ""}`, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative rounded-[clamp(16px,2vw,32px)] bg-[var(--bg-secondary)] border border-[var(--border-color)] overflow-hidden min-h-[280px] md:min-h-[380px]", children: media ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-0 flex items-center justify-center p-6", children: media }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-0 flex items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-20 h-20 rounded-full bg-[var(--bg-tertiary)] flex items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "32", height: "32", viewBox: "0 0 24 24", fill: "none", stroke: "var(--fg-muted)", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${PromoSplit_module_default.mediaColumn}${isLeft ? ` ${PromoSplit_module_default.mediaColumnLtr}` : ""}`, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: PromoSplit_module_default.mediaBox, children: media ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: PromoSplit_module_default.mediaContent, children: media }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: PromoSplit_module_default.mediaPlaceholder, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: PromoSplit_module_default.placeholderCircle, children: /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "32", height: "32", viewBox: "0 0 24 24", fill: "none", stroke: "var(--fg-muted)", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", children: [
       /* @__PURE__ */ jsxRuntime.jsx("rect", { x: "3", y: "3", width: "18", height: "18", rx: "2" }),
       /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "8.5", cy: "8.5", r: "1.5" }),
       /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m21 15-5-5L5 21" })
     ] }) }) }) }) })
   ] }) });
 }
+
+// src/organisms/PromoTrustGrid.module.scss
+var PromoTrustGrid_module_default = {
+  root: "PromoTrustGrid_module_root",
+  heading: "PromoTrustGrid_module_heading",
+  headingText: "PromoTrustGrid_module_headingText",
+  grid: "PromoTrustGrid_module_grid",
+  featureCard: "PromoTrustGrid_module_featureCard",
+  featureIcon: "PromoTrustGrid_module_featureIcon",
+  featureTitle: "PromoTrustGrid_module_featureTitle",
+  featureDescription: "PromoTrustGrid_module_featureDescription",
+  media: "PromoTrustGrid_module_media",
+  mediaInner: "PromoTrustGrid_module_mediaInner"
+};
 function PromoTrustGrid({ heading, features, media, className = "" }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs("section", { className: `py-16 md:py-24 ${className}`, children: [
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-10 md:mb-14", children: /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-[clamp(1.75rem,4vw,2.75rem)] font-bold leading-[1.1] tracking-[-0.03em] text-[var(--fg)] text-balance", children: heading }) }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-6 mb-10 md:mb-14", children: features.map((feature, i) => /* @__PURE__ */ jsxRuntime.jsxs(
-      "div",
-      {
-        className: "group relative flex flex-col gap-3 p-6 md:p-8 rounded-[var(--radius-xl)] bg-[var(--bg)] border border-[var(--border-color)] transition-all duration-[var(--transition-base)] hover:shadow-[var(--shadow-md)] hover:-translate-y-0.5",
-        children: [
-          feature.icon && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-10 h-10 rounded-[var(--radius-lg)] bg-[var(--fg)]/5 flex items-center justify-center text-[var(--fg)] mb-1", children: feature.icon }),
-          /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-base font-semibold text-[var(--fg)] leading-snug", children: feature.title }),
-          /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-[var(--fg-secondary)] leading-relaxed", children: feature.description })
-        ]
-      },
-      i
-    )) }),
-    media && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative rounded-[clamp(16px,2vw,32px)] bg-[var(--bg-secondary)] border border-[var(--border-color)] overflow-hidden min-h-[280px] md:min-h-[420px]", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-0 flex items-center justify-center p-6", children: media }) })
+  return /* @__PURE__ */ jsxRuntime.jsxs("section", { className: `${PromoTrustGrid_module_default.root}${className ? ` ${className}` : ""}`, children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: PromoTrustGrid_module_default.heading, children: /* @__PURE__ */ jsxRuntime.jsx("h2", { className: PromoTrustGrid_module_default.headingText, children: heading }) }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: PromoTrustGrid_module_default.grid, children: features.map((feature, i) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: PromoTrustGrid_module_default.featureCard, children: [
+      feature.icon && /* @__PURE__ */ jsxRuntime.jsx("div", { className: PromoTrustGrid_module_default.featureIcon, children: feature.icon }),
+      /* @__PURE__ */ jsxRuntime.jsx("h3", { className: PromoTrustGrid_module_default.featureTitle, children: feature.title }),
+      /* @__PURE__ */ jsxRuntime.jsx("p", { className: PromoTrustGrid_module_default.featureDescription, children: feature.description })
+    ] }, i)) }),
+    media && /* @__PURE__ */ jsxRuntime.jsx("div", { className: PromoTrustGrid_module_default.media, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: PromoTrustGrid_module_default.mediaInner, children: media }) })
   ] });
 }
+
+// src/organisms/PromoDevicesCTA.module.scss
+var PromoDevicesCTA_module_default = {
+  root: "PromoDevicesCTA_module_root",
+  textBlock: "PromoDevicesCTA_module_textBlock",
+  heading: "PromoDevicesCTA_module_heading",
+  description: "PromoDevicesCTA_module_description",
+  ctaWrap: "PromoDevicesCTA_module_ctaWrap",
+  devices: "PromoDevicesCTA_module_devices",
+  laptop: "PromoDevicesCTA_module_laptop",
+  laptopScreen: "PromoDevicesCTA_module_laptopScreen",
+  laptopScreenInner: "PromoDevicesCTA_module_laptopScreenInner",
+  laptopHinge: "PromoDevicesCTA_module_laptopHinge",
+  laptopBase: "PromoDevicesCTA_module_laptopBase",
+  tablet: "PromoDevicesCTA_module_tablet",
+  tabletShell: "PromoDevicesCTA_module_tabletShell",
+  tabletScreen: "PromoDevicesCTA_module_tabletScreen",
+  phone: "PromoDevicesCTA_module_phone",
+  phoneShell: "PromoDevicesCTA_module_phoneShell",
+  phoneNotch: "PromoDevicesCTA_module_phoneNotch",
+  phoneScreen: "PromoDevicesCTA_module_phoneScreen"
+};
 function PromoDevicesCTA({
   heading,
   description,
   cta,
   className = ""
 }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs("section", { className: `py-16 md:py-24 ${className}`, children: [
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "max-w-2xl mx-auto text-center mb-8 md:mb-10", children: [
-      /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-[clamp(1.75rem,4vw,2.75rem)] font-bold leading-[1.1] tracking-[-0.03em] text-[var(--fg)] text-balance", children: heading }),
-      description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-4 text-base md:text-lg leading-relaxed text-[var(--fg-secondary)]", children: description }),
-      cta && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-6 flex justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "primary", onClick: cta.onClick, children: cta.label }) })
+  return /* @__PURE__ */ jsxRuntime.jsxs("section", { className: `${PromoDevicesCTA_module_default.root}${className ? ` ${className}` : ""}`, children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: PromoDevicesCTA_module_default.textBlock, children: [
+      /* @__PURE__ */ jsxRuntime.jsx("h2", { className: PromoDevicesCTA_module_default.heading, children: heading }),
+      description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: PromoDevicesCTA_module_default.description, children: description }),
+      cta && /* @__PURE__ */ jsxRuntime.jsx("div", { className: PromoDevicesCTA_module_default.ctaWrap, children: /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "primary", onClick: cta.onClick, children: cta.label }) })
     ] }),
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex items-end justify-center gap-6 md:gap-10 px-4 md:px-0 max-w-4xl mx-auto", children: [
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "hidden md:block relative w-[38%] max-w-[380px]", children: [
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "aspect-[16/10] rounded-t-[var(--radius-lg)] border border-b-0 border-[var(--border-color)] bg-[var(--bg-secondary)] overflow-hidden shadow-[var(--shadow-md)]", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-3 rounded-[var(--radius-md)] bg-[var(--bg-tertiary)]" }) }),
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-2.5 bg-[var(--bg-tertiary)] border border-[var(--border-color)] rounded-b-sm" }),
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-1 bg-[var(--bg-tertiary)] border-x border-b border-[var(--border-color)] rounded-b-[var(--radius-sm)] mx-[-4%]" })
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: PromoDevicesCTA_module_default.devices, children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: PromoDevicesCTA_module_default.laptop, children: [
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: PromoDevicesCTA_module_default.laptopScreen, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: PromoDevicesCTA_module_default.laptopScreenInner }) }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: PromoDevicesCTA_module_default.laptopHinge }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: PromoDevicesCTA_module_default.laptopBase })
       ] }),
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative w-[40%] md:w-[28%] max-w-[280px]", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "aspect-[3/4] rounded-[var(--radius-xl)] border-2 border-[var(--border-color)] bg-[var(--bg-secondary)] overflow-hidden shadow-[var(--shadow-lg)]", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-2.5 rounded-[var(--radius-lg)] bg-[var(--bg-tertiary)]" }) }) }),
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative w-[24%] md:w-[14%] max-w-[140px]", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "aspect-[9/19] rounded-[clamp(12px,2vw,24px)] border-2 border-[var(--border-color)] bg-[var(--bg-secondary)] overflow-hidden shadow-[var(--shadow-lg)]", children: [
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute top-1.5 left-1/2 -translate-x-1/2 w-[40%] h-[3%] rounded-full bg-[var(--border-color)]" }),
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-1.5 top-[6%] rounded-[clamp(8px,1.5vw,16px)] bg-[var(--bg-tertiary)]" })
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: PromoDevicesCTA_module_default.tablet, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: PromoDevicesCTA_module_default.tabletShell, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: PromoDevicesCTA_module_default.tabletScreen }) }) }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: PromoDevicesCTA_module_default.phone, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: PromoDevicesCTA_module_default.phoneShell, children: [
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: PromoDevicesCTA_module_default.phoneNotch }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: PromoDevicesCTA_module_default.phoneScreen })
       ] }) })
     ] })
   ] });
 }
+
+// src/organisms/PromoTestimonials.module.scss
+var PromoTestimonials_module_default = {
+  root: "PromoTestimonials_module_root",
+  wrapper: "PromoTestimonials_module_wrapper",
+  avatarSection: "PromoTestimonials_module_avatarSection",
+  avatarStack: "PromoTestimonials_module_avatarStack",
+  avatarRing: "PromoTestimonials_module_avatarRing",
+  overflowBadge: "PromoTestimonials_module_overflowBadge",
+  overflowCircle: "PromoTestimonials_module_overflowCircle",
+  headingSection: "PromoTestimonials_module_headingSection",
+  heading: "PromoTestimonials_module_heading",
+  subtitle: "PromoTestimonials_module_subtitle",
+  cardsSection: "PromoTestimonials_module_cardsSection",
+  cardsGrid: "PromoTestimonials_module_cardsGrid",
+  card: "PromoTestimonials_module_card",
+  quote: "PromoTestimonials_module_quote",
+  author: "PromoTestimonials_module_author",
+  authorName: "PromoTestimonials_module_authorName",
+  authorRole: "PromoTestimonials_module_authorRole",
+  mediaSection: "PromoTestimonials_module_mediaSection",
+  mediaBox: "PromoTestimonials_module_mediaBox"
+};
 function PromoTestimonials({
   heading,
   subtitle,
@@ -2114,14 +2708,14 @@ function PromoTestimonials({
   media,
   className = ""
 }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("section", { className: `py-16 md:py-24 ${className}`, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative rounded-[clamp(20px,3vw,40px)] border border-[var(--border-color)] bg-[var(--bg)] overflow-hidden", children: [
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex justify-center pt-10 md:pt-14 pb-2", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex -space-x-3", children: [
+  return /* @__PURE__ */ jsxRuntime.jsx("section", { className: `${PromoTestimonials_module_default.root}${className ? ` ${className}` : ""}`, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: PromoTestimonials_module_default.wrapper, children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: PromoTestimonials_module_default.avatarSection, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: PromoTestimonials_module_default.avatarStack, children: [
       testimonials.slice(0, 5).map((t, i) => {
         const initials = t.name.split(" ").map((n) => n[0]).join("").toUpperCase();
         return /* @__PURE__ */ jsxRuntime.jsx(
           "div",
           {
-            className: "relative ring-3 ring-[var(--bg)] rounded-full",
+            className: PromoTestimonials_module_default.avatarRing,
             style: { zIndex: 10 - i },
             children: /* @__PURE__ */ jsxRuntime.jsx(
               Avatar,
@@ -2135,32 +2729,32 @@ function PromoTestimonials({
           i
         );
       }),
-      testimonials.length > 5 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative ring-3 ring-[var(--bg)] rounded-full z-0", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-10 h-10 rounded-full bg-[var(--bg-tertiary)] flex items-center justify-center text-xs font-semibold text-[var(--fg-secondary)]", children: [
+      testimonials.length > 5 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: PromoTestimonials_module_default.overflowBadge, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: PromoTestimonials_module_default.overflowCircle, children: [
         "+",
         testimonials.length - 5
       ] }) })
     ] }) }),
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-center px-6 pb-8 md:pb-10", children: [
-      /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-[clamp(1.75rem,4vw,2.75rem)] font-bold leading-[1.1] tracking-[-0.03em] text-[var(--fg)] text-balance", children: heading }),
-      subtitle && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-3 text-base text-[var(--fg-secondary)] leading-relaxed max-w-lg mx-auto", children: subtitle })
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: PromoTestimonials_module_default.headingSection, children: [
+      /* @__PURE__ */ jsxRuntime.jsx("h2", { className: PromoTestimonials_module_default.heading, children: heading }),
+      subtitle && /* @__PURE__ */ jsxRuntime.jsx("p", { className: PromoTestimonials_module_default.subtitle, children: subtitle })
     ] }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "px-6 md:px-10 pb-8 md:pb-12", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4 md:gap-5", children: testimonials.map((t, i) => {
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: PromoTestimonials_module_default.cardsSection, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: PromoTestimonials_module_default.cardsGrid, children: testimonials.map((t, i) => {
       const initials = t.name.split(" ").map((n) => n[0]).join("").toUpperCase();
       return /* @__PURE__ */ jsxRuntime.jsxs(
         "div",
         {
-          className: "flex flex-col gap-4 p-5 md:p-6 rounded-[var(--radius-xl)] border border-[var(--border-color)] bg-[var(--bg)] transition-shadow duration-[var(--transition-base)] hover:shadow-[var(--shadow-md)]",
+          className: PromoTestimonials_module_default.card,
           children: [
-            /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-sm text-[var(--fg-secondary)] leading-relaxed flex-1", children: [
+            /* @__PURE__ */ jsxRuntime.jsxs("p", { className: PromoTestimonials_module_default.quote, children: [
               "\u201C",
               t.quote,
               "\u201D"
             ] }),
-            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3 pt-1", children: [
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: PromoTestimonials_module_default.author, children: [
               /* @__PURE__ */ jsxRuntime.jsx(Avatar, { size: "sm", src: t.avatarSrc, initials }),
               /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-                /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-medium text-[var(--fg)]", children: t.name }),
-                /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-[var(--fg-muted)]", children: t.role })
+                /* @__PURE__ */ jsxRuntime.jsx("p", { className: PromoTestimonials_module_default.authorName, children: t.name }),
+                /* @__PURE__ */ jsxRuntime.jsx("p", { className: PromoTestimonials_module_default.authorRole, children: t.role })
               ] })
             ] })
           ]
@@ -2168,9 +2762,30 @@ function PromoTestimonials({
         i
       );
     }) }) }),
-    media && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "px-6 md:px-10 pb-8 md:pb-12", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "rounded-[var(--radius-xl)] bg-[var(--bg-secondary)] overflow-hidden", children: media }) })
+    media && /* @__PURE__ */ jsxRuntime.jsx("div", { className: PromoTestimonials_module_default.mediaSection, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: PromoTestimonials_module_default.mediaBox, children: media }) })
   ] }) });
 }
+
+// src/organisms/PromoHero.module.scss
+var PromoHero_module_default = {
+  root: "PromoHero_module_root",
+  dark: "PromoHero_module_dark",
+  light: "PromoHero_module_light",
+  gradient: "PromoHero_module_gradient",
+  glowLayer: "PromoHero_module_glowLayer",
+  glowTop: "PromoHero_module_glowTop",
+  glowBottom: "PromoHero_module_glowBottom",
+  inner: "PromoHero_module_inner",
+  textColumn: "PromoHero_module_textColumn",
+  title: "PromoHero_module_title",
+  subtitle: "PromoHero_module_subtitle",
+  subtitleDark: "PromoHero_module_subtitleDark",
+  subtitleLight: "PromoHero_module_subtitleLight",
+  actions: "PromoHero_module_actions",
+  ctaDark: "PromoHero_module_ctaDark",
+  ghostDark: "PromoHero_module_ghostDark",
+  mediaColumn: "PromoHero_module_mediaColumn"
+};
 function PromoHero({
   title,
   subtitle,
@@ -2180,36 +2795,29 @@ function PromoHero({
   variant = "dark",
   className = ""
 }) {
-  const variantStyles5 = {
-    dark: "bg-[var(--neutral-900)] text-white",
-    light: "bg-[var(--bg)] text-[var(--fg)]",
-    gradient: "bg-gradient-to-br from-[var(--neutral-900)] via-[var(--neutral-800)] to-[var(--neutral-700)] text-white"
-  };
-  const subtitleColor = {
-    dark: "text-white/70",
-    light: "text-[var(--fg-secondary)]",
-    gradient: "text-white/70"
-  };
+  const variantClass = variant === "dark" ? PromoHero_module_default.dark : variant === "gradient" ? PromoHero_module_default.gradient : PromoHero_module_default.light;
+  const subtitleClass = variant === "light" ? PromoHero_module_default.subtitleLight : PromoHero_module_default.subtitleDark;
+  const isLight = variant === "light";
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "section",
     {
-      className: `relative overflow-hidden rounded-[clamp(20px,3vw,40px)] min-h-[480px] md:min-h-[600px] flex items-center ${variantStyles5[variant]} ${className}`,
+      className: `${PromoHero_module_default.root} ${variantClass}${className ? ` ${className}` : ""}`,
       children: [
-        variant !== "light" && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "absolute inset-0 pointer-events-none", "aria-hidden": "true", children: [
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute top-[-20%] right-[-10%] w-[600px] h-[600px] rounded-full bg-white/[0.03] blur-[100px]" }),
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute bottom-[-30%] left-[-5%] w-[400px] h-[400px] rounded-full bg-white/[0.02] blur-[80px]" })
+        !isLight && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: PromoHero_module_default.glowLayer, "aria-hidden": "true", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: PromoHero_module_default.glowTop }),
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: PromoHero_module_default.glowBottom })
         ] }),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative z-10 grid grid-cols-1 lg:grid-cols-2 gap-10 md:gap-16 w-full p-8 md:p-12 lg:p-16 items-center", children: [
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-5 md:gap-6", children: [
-            /* @__PURE__ */ jsxRuntime.jsx("h1", { className: "text-[clamp(2.25rem,5.5vw,5rem)] font-bold leading-[0.95] tracking-[-0.04em] text-balance", children: title }),
-            subtitle && /* @__PURE__ */ jsxRuntime.jsx("p", { className: `text-base md:text-lg leading-relaxed max-w-lg ${subtitleColor[variant]}`, children: subtitle }),
-            (cta || secondaryCta) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-wrap gap-3 mt-2", children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: PromoHero_module_default.inner, children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: PromoHero_module_default.textColumn, children: [
+            /* @__PURE__ */ jsxRuntime.jsx("h1", { className: PromoHero_module_default.title, children: title }),
+            subtitle && /* @__PURE__ */ jsxRuntime.jsx("p", { className: `${PromoHero_module_default.subtitle} ${subtitleClass}`, children: subtitle }),
+            (cta || secondaryCta) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: PromoHero_module_default.actions, children: [
               cta && /* @__PURE__ */ jsxRuntime.jsx(
                 Button,
                 {
-                  variant: variant === "light" ? "primary" : "outline",
+                  variant: isLight ? "primary" : "outline",
                   onClick: cta.onClick,
-                  className: variant !== "light" ? "border-white/20 text-white hover:bg-white/10" : "",
+                  className: !isLight ? PromoHero_module_default.ctaDark : "",
                   children: cta.label
                 }
               ),
@@ -2218,18 +2826,65 @@ function PromoHero({
                 {
                   variant: "ghost",
                   onClick: secondaryCta.onClick,
-                  className: variant !== "light" ? "text-white/70 hover:text-white hover:bg-white/5" : "",
+                  className: !isLight ? PromoHero_module_default.ghostDark : "",
                   children: secondaryCta.label
                 }
               )
             ] })
           ] }),
-          media && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative flex items-center justify-center", children: media })
+          media && /* @__PURE__ */ jsxRuntime.jsx("div", { className: PromoHero_module_default.mediaColumn, children: media })
         ] })
       ]
     }
   );
 }
+
+// src/organisms/PromoPricing.module.scss
+var PromoPricing_module_default = {
+  root: "PromoPricing_module_root",
+  dark: "PromoPricing_module_dark",
+  light: "PromoPricing_module_light",
+  headingSection: "PromoPricing_module_headingSection",
+  heading: "PromoPricing_module_heading",
+  headingDark: "PromoPricing_module_headingDark",
+  headingLight: "PromoPricing_module_headingLight",
+  subtitle: "PromoPricing_module_subtitle",
+  subtitleDark: "PromoPricing_module_subtitleDark",
+  subtitleLight: "PromoPricing_module_subtitleLight",
+  tiersGrid: "PromoPricing_module_tiersGrid",
+  tierDefault: "PromoPricing_module_tierCard PromoPricing_module_tierDefault",
+  tierHighlighted: "PromoPricing_module_tierCard PromoPricing_module_tierHighlighted",
+  tierDark: "PromoPricing_module_tierCard PromoPricing_module_tierDark",
+  tierDarkHighlighted: "PromoPricing_module_tierCard PromoPricing_module_tierDarkHighlighted",
+  tierName: "PromoPricing_module_tierName",
+  tierNameMuted: "PromoPricing_module_tierNameMuted",
+  tierNameDark: "PromoPricing_module_tierNameDark",
+  tierNameHighlightedLight: "PromoPricing_module_tierNameHighlightedLight",
+  tierNameHighlightedDark: "PromoPricing_module_tierNameHighlightedDark",
+  price: "PromoPricing_module_price",
+  period: "PromoPricing_module_period",
+  periodMuted: "PromoPricing_module_periodMuted",
+  periodDark: "PromoPricing_module_periodDark",
+  periodHighlightedLight: "PromoPricing_module_periodHighlightedLight",
+  periodHighlightedDark: "PromoPricing_module_periodHighlightedDark",
+  tierDesc: "PromoPricing_module_tierDesc",
+  tierDescMuted: "PromoPricing_module_tierDescMuted",
+  tierDescDark: "PromoPricing_module_tierDescDark",
+  tierDescHighlightedLight: "PromoPricing_module_tierDescHighlightedLight",
+  tierDescHighlightedDark: "PromoPricing_module_tierDescHighlightedDark",
+  featureList: "PromoPricing_module_featureList",
+  featureItem: "PromoPricing_module_featureItem",
+  checkIcon: "PromoPricing_module_checkIcon",
+  checkDefault: "PromoPricing_module_checkDefault",
+  checkDark: "PromoPricing_module_checkDark",
+  checkHighlightedLight: "PromoPricing_module_checkHighlightedLight",
+  checkHighlightedDark: "PromoPricing_module_checkHighlightedDark",
+  featureTextMuted: "PromoPricing_module_featureTextMuted",
+  featureTextDark: "PromoPricing_module_featureTextDark",
+  featureTextHighlightedLight: "PromoPricing_module_featureTextHighlightedLight",
+  featureTextHighlightedDark: "PromoPricing_module_featureTextHighlightedDark",
+  ctaWrap: "PromoPricing_module_ctaWrap"
+};
 function PromoPricing({
   heading,
   subtitle,
@@ -2238,39 +2893,51 @@ function PromoPricing({
   className = ""
 }) {
   const isDark = variant === "dark";
+  const getTierClass = (highlighted) => {
+    if (highlighted) return isDark ? PromoPricing_module_default.tierDarkHighlighted : PromoPricing_module_default.tierHighlighted;
+    return isDark ? PromoPricing_module_default.tierDark : PromoPricing_module_default.tierDefault;
+  };
+  const getNameClass = (highlighted) => {
+    if (highlighted) return isDark ? PromoPricing_module_default.tierNameHighlightedDark : PromoPricing_module_default.tierNameHighlightedLight;
+    return isDark ? PromoPricing_module_default.tierNameDark : PromoPricing_module_default.tierNameMuted;
+  };
+  const getPeriodClass = (highlighted) => {
+    if (highlighted) return isDark ? PromoPricing_module_default.periodHighlightedDark : PromoPricing_module_default.periodHighlightedLight;
+    return isDark ? PromoPricing_module_default.periodDark : PromoPricing_module_default.periodMuted;
+  };
+  const getDescClass = (highlighted) => {
+    if (highlighted) return isDark ? PromoPricing_module_default.tierDescHighlightedDark : PromoPricing_module_default.tierDescHighlightedLight;
+    return isDark ? PromoPricing_module_default.tierDescDark : PromoPricing_module_default.tierDescMuted;
+  };
+  const getCheckClass = (highlighted) => {
+    if (highlighted) return isDark ? PromoPricing_module_default.checkHighlightedDark : PromoPricing_module_default.checkHighlightedLight;
+    return isDark ? PromoPricing_module_default.checkDark : PromoPricing_module_default.checkDefault;
+  };
+  const getFeatureTextClass = (highlighted) => {
+    if (highlighted) return isDark ? PromoPricing_module_default.featureTextHighlightedDark : PromoPricing_module_default.featureTextHighlightedLight;
+    return isDark ? PromoPricing_module_default.featureTextDark : PromoPricing_module_default.featureTextMuted;
+  };
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "section",
     {
-      className: `py-16 md:py-24 px-6 md:px-12 rounded-[clamp(20px,3vw,40px)] ${isDark ? "bg-[var(--neutral-900)] text-white" : "bg-[var(--bg)]"} ${className}`,
+      className: `${PromoPricing_module_default.root} ${isDark ? PromoPricing_module_default.dark : PromoPricing_module_default.light}${className ? ` ${className}` : ""}`,
       children: [
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-center mb-10 md:mb-14 max-w-2xl mx-auto", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(
-            "h2",
-            {
-              className: `text-[clamp(2rem,5vw,4.75rem)] font-bold leading-[0.95] tracking-[-0.04em] text-balance ${isDark ? "text-white" : "text-[var(--fg)]"}`,
-              children: heading
-            }
-          ),
-          subtitle && /* @__PURE__ */ jsxRuntime.jsx("p", { className: `mt-4 text-base md:text-lg leading-relaxed ${isDark ? "text-white/60" : "text-[var(--fg-secondary)]"}`, children: subtitle })
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: PromoPricing_module_default.headingSection, children: [
+          /* @__PURE__ */ jsxRuntime.jsx("h2", { className: `${PromoPricing_module_default.heading} ${isDark ? PromoPricing_module_default.headingDark : PromoPricing_module_default.headingLight}`, children: heading }),
+          subtitle && /* @__PURE__ */ jsxRuntime.jsx("p", { className: `${PromoPricing_module_default.subtitle} ${isDark ? PromoPricing_module_default.subtitleDark : PromoPricing_module_default.subtitleLight}`, children: subtitle })
         ] }),
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-5 md:gap-6 max-w-5xl mx-auto", children: tiers.map((tier, i) => /* @__PURE__ */ jsxRuntime.jsxs(
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: PromoPricing_module_default.tiersGrid, children: tiers.map((tier, i) => /* @__PURE__ */ jsxRuntime.jsxs(
           "div",
           {
-            className: `relative flex flex-col rounded-[var(--radius-xl)] p-6 md:p-8 transition-all duration-[var(--transition-base)] ${tier.highlighted ? isDark ? "bg-white text-[var(--neutral-900)] shadow-[0_0_60px_rgba(255,255,255,0.1)]" : "bg-[var(--fg)] text-[var(--bg)] shadow-[var(--shadow-xl)]" : isDark ? "bg-white/[0.06] border border-white/10 text-white hover:bg-white/[0.1]" : "bg-[var(--bg)] border border-[var(--border-color)] hover:shadow-[var(--shadow-md)] hover:-translate-y-0.5"}`,
+            className: getTierClass(tier.highlighted),
             children: [
-              /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-4", children: /* @__PURE__ */ jsxRuntime.jsx(
-                "h3",
-                {
-                  className: `text-sm font-semibold uppercase tracking-[0.06em] ${tier.highlighted ? isDark ? "text-[var(--neutral-500)]" : "text-[var(--bg)]/60" : isDark ? "text-white/50" : "text-[var(--fg-muted)]"}`,
-                  children: tier.name
-                }
-              ) }),
-              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-2", children: [
-                /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-4xl md:text-5xl font-bold tracking-[-0.03em]", children: tier.price }),
-                tier.period && /* @__PURE__ */ jsxRuntime.jsx("span", { className: `text-sm ml-1 ${tier.highlighted ? isDark ? "text-[var(--neutral-500)]" : "text-[var(--bg)]/50" : isDark ? "text-white/40" : "text-[var(--fg-muted)]"}`, children: tier.period })
+              /* @__PURE__ */ jsxRuntime.jsx("div", { className: PromoPricing_module_default.tierName, children: /* @__PURE__ */ jsxRuntime.jsx("h3", { className: getNameClass(tier.highlighted), children: tier.name }) }),
+              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: PromoPricing_module_default.price, children: [
+                /* @__PURE__ */ jsxRuntime.jsx("span", { children: tier.price }),
+                tier.period && /* @__PURE__ */ jsxRuntime.jsx("span", { className: `${PromoPricing_module_default.period} ${getPeriodClass(tier.highlighted)}`, children: tier.period })
               ] }),
-              tier.description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: `text-sm mb-6 ${tier.highlighted ? isDark ? "text-[var(--neutral-600)]" : "text-[var(--bg)]/60" : isDark ? "text-white/50" : "text-[var(--fg-secondary)]"}`, children: tier.description }),
-              /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "flex flex-col gap-2.5 mb-8 flex-1", children: tier.features.map((feature, fi) => /* @__PURE__ */ jsxRuntime.jsxs("li", { className: "flex items-start gap-2.5 text-sm", children: [
+              tier.description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: `${PromoPricing_module_default.tierDesc} ${getDescClass(tier.highlighted)}`, children: tier.description }),
+              /* @__PURE__ */ jsxRuntime.jsx("ul", { className: PromoPricing_module_default.featureList, children: tier.features.map((feature, fi) => /* @__PURE__ */ jsxRuntime.jsxs("li", { className: PromoPricing_module_default.featureItem, children: [
                 /* @__PURE__ */ jsxRuntime.jsx(
                   "svg",
                   {
@@ -2278,13 +2945,13 @@ function PromoPricing({
                     height: "16",
                     viewBox: "0 0 16 16",
                     fill: "none",
-                    className: `shrink-0 mt-0.5 ${tier.highlighted ? isDark ? "text-[var(--color-success)]" : "text-[var(--color-success-light)]" : isDark ? "text-white/40" : "text-[var(--color-success)]"}`,
+                    className: `${PromoPricing_module_default.checkIcon} ${getCheckClass(tier.highlighted)}`,
                     children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M3.5 8.5L6.5 11.5L12.5 4.5", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" })
                   }
                 ),
-                /* @__PURE__ */ jsxRuntime.jsx("span", { className: `${tier.highlighted ? isDark ? "text-[var(--neutral-700)]" : "text-[var(--bg)]/80" : isDark ? "text-white/70" : "text-[var(--fg-secondary)]"}`, children: feature })
+                /* @__PURE__ */ jsxRuntime.jsx("span", { className: getFeatureTextClass(tier.highlighted), children: feature })
               ] }, fi)) }),
-              tier.cta && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-auto", children: tier.cta })
+              tier.cta && /* @__PURE__ */ jsxRuntime.jsx("div", { className: PromoPricing_module_default.ctaWrap, children: tier.cta })
             ]
           },
           i
@@ -2293,6 +2960,24 @@ function PromoPricing({
     }
   );
 }
+
+// src/organisms/PromoActionCards.module.scss
+var PromoActionCards_module_default = {
+  root: "PromoActionCards_module_root",
+  header: "PromoActionCards_module_header",
+  heading: "PromoActionCards_module_heading",
+  subtitle: "PromoActionCards_module_subtitle",
+  grid2: "PromoActionCards_module_grid PromoActionCards_module_grid2",
+  grid3: "PromoActionCards_module_grid PromoActionCards_module_grid3",
+  card: "PromoActionCards_module_card",
+  cardContent: "PromoActionCards_module_cardContent",
+  cardTitle: "PromoActionCards_module_cardTitle",
+  cardDesc: "PromoActionCards_module_cardDesc",
+  cardFooter: "PromoActionCards_module_cardFooter",
+  iconGroup: "PromoActionCards_module_iconGroup",
+  iconCircle: "PromoActionCards_module_iconCircle",
+  ctaBtn: "PromoActionCards_module_ctaBtn"
+};
 function PromoActionCards({
   heading,
   subtitle,
@@ -2300,28 +2985,28 @@ function PromoActionCards({
   columns = 3,
   className = ""
 }) {
-  const gridCols = columns === 2 ? "md:grid-cols-2" : "md:grid-cols-2 lg:grid-cols-3";
-  return /* @__PURE__ */ jsxRuntime.jsxs("section", { className: `py-16 md:py-24 ${className}`, children: [
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-10 md:mb-14 max-w-xl", children: [
-      /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-[clamp(1.25rem,3vw,1.5rem)] font-medium leading-[1.3] tracking-[-0.01em] text-[var(--fg-secondary)] text-balance", children: heading }),
-      subtitle && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-2 text-sm text-[var(--fg-muted)]", children: subtitle })
+  const gridClass = columns === 2 ? PromoActionCards_module_default.grid2 : PromoActionCards_module_default.grid3;
+  return /* @__PURE__ */ jsxRuntime.jsxs("section", { className: `${PromoActionCards_module_default.root}${className ? ` ${className}` : ""}`, children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: PromoActionCards_module_default.header, children: [
+      /* @__PURE__ */ jsxRuntime.jsx("h2", { className: PromoActionCards_module_default.heading, children: heading }),
+      subtitle && /* @__PURE__ */ jsxRuntime.jsx("p", { className: PromoActionCards_module_default.subtitle, children: subtitle })
     ] }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: `grid grid-cols-1 ${gridCols} gap-4 md:gap-5`, children: cards.map((card, i) => {
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: gridClass, children: cards.map((card, i) => {
       var _a;
       return /* @__PURE__ */ jsxRuntime.jsxs(
         "div",
         {
-          className: "group flex flex-col gap-4 p-5 md:p-6 rounded-[var(--radius-xl)] border border-[var(--border-color)] bg-[var(--bg)] transition-all duration-[var(--transition-base)] hover:shadow-[var(--shadow-md)] hover:border-[var(--border-color-strong)]",
+          className: PromoActionCards_module_default.card,
           children: [
-            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-2 flex-1", children: [
-              /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-[15px] font-semibold text-[var(--fg)] leading-snug", children: card.title }),
-              /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-[var(--fg-secondary)] leading-relaxed", children: card.description })
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: PromoActionCards_module_default.cardContent, children: [
+              /* @__PURE__ */ jsxRuntime.jsx("h3", { className: PromoActionCards_module_default.cardTitle, children: card.title }),
+              /* @__PURE__ */ jsxRuntime.jsx("p", { className: PromoActionCards_module_default.cardDesc, children: card.description })
             ] }),
-            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between pt-1", children: [
-              /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-2", children: (_a = card.icons) == null ? void 0 : _a.map((icon, ii) => /* @__PURE__ */ jsxRuntime.jsx(
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: PromoActionCards_module_default.cardFooter, children: [
+              /* @__PURE__ */ jsxRuntime.jsx("div", { className: PromoActionCards_module_default.iconGroup, children: (_a = card.icons) == null ? void 0 : _a.map((icon, ii) => /* @__PURE__ */ jsxRuntime.jsx(
                 "span",
                 {
-                  className: "w-7 h-7 rounded-full bg-[var(--bg-secondary)] flex items-center justify-center text-[var(--fg-secondary)]",
+                  className: PromoActionCards_module_default.iconCircle,
                   children: icon
                 },
                 ii
@@ -2330,7 +3015,7 @@ function PromoActionCards({
                 "button",
                 {
                   onClick: card.cta.onClick,
-                  className: "inline-flex items-center gap-1.5 px-3 py-1.5 rounded-full text-xs font-medium bg-[var(--fg)] text-[var(--bg)] hover:opacity-90 transition-opacity cursor-pointer",
+                  className: PromoActionCards_module_default.ctaBtn,
                   children: [
                     card.cta.label,
                     /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "11", height: "11", viewBox: "0 0 12 12", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M4.5 2.5l4 3.5-4 3.5" }) })
@@ -2345,6 +3030,22 @@ function PromoActionCards({
     }) })
   ] });
 }
+
+// src/templates/ArticleHero.module.scss
+var ArticleHero_module_default = {
+  root: "ArticleHero_module_root",
+  bgLayer: "ArticleHero_module_bgLayer",
+  bgImage: "ArticleHero_module_bgImage",
+  overlay: "ArticleHero_module_overlay",
+  topBar: "ArticleHero_module_topBar",
+  logo: "ArticleHero_module_logo",
+  divider: "ArticleHero_module_divider",
+  nav: "ArticleHero_module_nav",
+  bottom: "ArticleHero_module_bottom",
+  category: "ArticleHero_module_category",
+  title: "ArticleHero_module_title",
+  subtitle: "ArticleHero_module_subtitle"
+};
 var DEFAULT_BG = "https://images.unsplash.com/photo-1451187580459-43490279c0fa?w=1600&h=900&fit=crop&q=80";
 function ArticleHero({
   category,
@@ -2356,48 +3057,44 @@ function ArticleHero({
   className = ""
 }) {
   const bgSrc = backgroundImage != null ? backgroundImage : DEFAULT_BG;
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    "section",
-    {
-      className: `relative w-full rounded-[var(--radius-xl)] overflow-hidden min-h-[320px] md:min-h-[480px] flex flex-col justify-between p-5 md:p-10 ${className}`,
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "absolute inset-0 pointer-events-none", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(
-            "img",
-            {
-              src: bgSrc,
-              alt: "",
-              className: "absolute inset-0 w-full h-full object-cover"
-            }
-          ),
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-0 bg-black/40" })
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative z-10 flex items-center w-full", children: [
-          logo && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "shrink-0 pr-4 md:pr-10", children: logo }),
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 h-px bg-white/30" }),
-          nav && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "shrink-0 pl-4 md:pl-10", children: nav })
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative z-10 max-w-[500px]", children: [
-          category && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-lg text-white leading-7 mb-2", children: category }),
-          /* @__PURE__ */ jsxRuntime.jsx("h1", { className: "text-[32px] leading-[34px] md:text-[60px] md:leading-[60px] font-normal text-white tracking-[-2px] md:tracking-[-3px] mb-4", children: title }),
-          subtitle && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-lg text-white/90 leading-[22.5px]", children: subtitle })
-        ] })
-      ]
-    }
-  );
+  return /* @__PURE__ */ jsxRuntime.jsxs("section", { className: `${ArticleHero_module_default.root}${className ? ` ${className}` : ""}`, children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ArticleHero_module_default.bgLayer, children: [
+      /* @__PURE__ */ jsxRuntime.jsx("img", { src: bgSrc, alt: "", className: ArticleHero_module_default.bgImage }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: ArticleHero_module_default.overlay })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ArticleHero_module_default.topBar, children: [
+      logo && /* @__PURE__ */ jsxRuntime.jsx("div", { className: ArticleHero_module_default.logo, children: logo }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: ArticleHero_module_default.divider }),
+      nav && /* @__PURE__ */ jsxRuntime.jsx("div", { className: ArticleHero_module_default.nav, children: nav })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ArticleHero_module_default.bottom, children: [
+      category && /* @__PURE__ */ jsxRuntime.jsx("p", { className: ArticleHero_module_default.category, children: category }),
+      /* @__PURE__ */ jsxRuntime.jsx("h1", { className: ArticleHero_module_default.title, children: title }),
+      subtitle && /* @__PURE__ */ jsxRuntime.jsx("p", { className: ArticleHero_module_default.subtitle, children: subtitle })
+    ] })
+  ] });
 }
+
+// src/templates/ArticleBody.module.scss
+var ArticleBody_module_default = {
+  root: "ArticleBody_module_root"
+};
 function ArticleBody({ children, className = "" }) {
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    "div",
-    {
-      className: `text-[16px] leading-7 text-[var(--fg-secondary)] font-normal ${className}`,
-      children
-    }
-  );
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${ArticleBody_module_default.root}${className ? ` ${className}` : ""}`, children });
 }
-var levelStyles = {
-  2: "text-[24px] leading-8 font-bold pt-12",
-  3: "text-[20px] leading-8 font-semibold pt-8"
+
+// src/templates/ArticleHeading.module.scss
+var ArticleHeading_module_default = {
+  root: "ArticleHeading_module_root",
+  header: "ArticleHeading_module_header",
+  h2: "ArticleHeading_module_h2",
+  h3: "ArticleHeading_module_h3",
+  action: "ArticleHeading_module_action",
+  subtitle: "ArticleHeading_module_subtitle"
+};
+var levelClass = {
+  2: ArticleHeading_module_default.h2,
+  3: ArticleHeading_module_default.h3
 };
 function ArticleHeading({
   level = 2,
@@ -2407,14 +3104,29 @@ function ArticleHeading({
   className = ""
 }) {
   const Tag2 = `h${level}`;
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `flex flex-col gap-1 ${className}`, children: [
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(Tag2, { className: `text-[var(--fg)] tracking-tight ${levelStyles[level]}`, children }),
-      action && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "shrink-0", children: action })
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `${ArticleHeading_module_default.root}${className ? ` ${className}` : ""}`, children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ArticleHeading_module_default.header, children: [
+      /* @__PURE__ */ jsxRuntime.jsx(Tag2, { className: levelClass[level], children }),
+      action && /* @__PURE__ */ jsxRuntime.jsx("div", { className: ArticleHeading_module_default.action, children: action })
     ] }),
-    subtitle && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-[14px] leading-5 text-[var(--fg-muted)]", children: subtitle })
+    subtitle && /* @__PURE__ */ jsxRuntime.jsx("p", { className: ArticleHeading_module_default.subtitle, children: subtitle })
   ] });
 }
+
+// src/templates/ArticleFigure.module.scss
+var ArticleFigure_module_default = {
+  root: "ArticleFigure_module_root",
+  imageWrapper: "ArticleFigure_module_imageWrapper",
+  image: "ArticleFigure_module_image",
+  childWrapper: "ArticleFigure_module_childWrapper",
+  placeholder: "ArticleFigure_module_placeholder",
+  placeholderText: "ArticleFigure_module_placeholderText",
+  legend: "ArticleFigure_module_legend",
+  legendItem: "ArticleFigure_module_legendItem",
+  legendSwatch: "ArticleFigure_module_legendSwatch",
+  legendLabel: "ArticleFigure_module_legendLabel",
+  caption: "ArticleFigure_module_caption"
+};
 function ArticleFigure({
   src,
   alt = "",
@@ -2424,37 +3136,52 @@ function ArticleFigure({
   children,
   className = ""
 }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs("figure", { className: `w-full ${className}`, children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs("figure", { className: `${ArticleFigure_module_default.root}${className ? ` ${className}` : ""}`, children: [
     /* @__PURE__ */ jsxRuntime.jsx(
       "div",
       {
-        className: "w-full rounded-[var(--radius-lg)] overflow-hidden bg-[var(--bg-secondary)] flex items-center justify-center",
+        className: ArticleFigure_module_default.imageWrapper,
         style: { minHeight: height },
         children: src ? (
           // eslint-disable-next-line @next/next/no-img-element
-          /* @__PURE__ */ jsxRuntime.jsx("img", { src, alt, className: "w-full h-full object-contain" })
-        ) : children ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-full h-full p-4", children }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center gap-2 text-[var(--fg-muted)]", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("img", { src, alt, className: ArticleFigure_module_default.image })
+        ) : children ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: ArticleFigure_module_default.childWrapper, children }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ArticleFigure_module_default.placeholder, children: [
           /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "48", height: "48", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
             /* @__PURE__ */ jsxRuntime.jsx("rect", { x: "3", y: "3", width: "18", height: "18", rx: "2" }),
             /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M3 16l5-5 4 4 4-6 5 7" })
           ] }),
-          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm", children: "Figure placeholder" })
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: ArticleFigure_module_default.placeholderText, children: "Figure placeholder" })
         ] })
       }
     ),
-    legend && legend.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-4 mt-3 flex-wrap", children: legend.map((item) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1.5", children: [
+    legend && legend.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: ArticleFigure_module_default.legend, children: legend.map((item) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ArticleFigure_module_default.legendItem, children: [
       /* @__PURE__ */ jsxRuntime.jsx(
         "span",
         {
-          className: "w-3 h-3 rounded-sm shrink-0",
+          className: ArticleFigure_module_default.legendSwatch,
           style: { backgroundColor: item.color }
         }
       ),
-      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[12px] leading-4 text-[var(--fg-secondary)]", children: item.label })
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: ArticleFigure_module_default.legendLabel, children: item.label })
     ] }, item.label)) }),
-    caption && /* @__PURE__ */ jsxRuntime.jsx("figcaption", { className: "mt-2 text-[14px] leading-5 text-[var(--fg-muted)]", children: caption })
+    caption && /* @__PURE__ */ jsxRuntime.jsx("figcaption", { className: ArticleFigure_module_default.caption, children: caption })
   ] });
 }
+
+// src/templates/ArticleTable.module.scss
+var ArticleTable_module_default = {
+  root: "ArticleTable_module_root",
+  headerRow: "ArticleTable_module_headerRow",
+  rankCell: "ArticleTable_module_rankCell",
+  headerCell: "ArticleTable_module_headerCell",
+  headerLabel: "ArticleTable_module_headerLabel",
+  row: "ArticleTable_module_row",
+  rankValue: "ArticleTable_module_rankValue",
+  cell: "ArticleTable_module_cell",
+  cellText: "ArticleTable_module_cellText",
+  badge: "ArticleTable_module_badge",
+  showMore: "ArticleTable_module_showMore"
+};
 function ArticleTable({
   columns,
   rows,
@@ -2466,34 +3193,27 @@ function ArticleTable({
   const limit = initialVisible != null ? initialVisible : rows.length;
   const visibleRows = expanded ? rows : rows.slice(0, limit);
   const hiddenCount = rows.length - limit;
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `w-full ${className}`, children: [
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center border-b border-[var(--border-color)] pb-px", children: [
-      showRank && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-[120px] shrink-0" }),
-      columns.map((col) => /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 px-4 py-3.5", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[14px] leading-5 font-medium text-[var(--fg-muted)]", children: col.label }) }, col.key))
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `${ArticleTable_module_default.root}${className ? ` ${className}` : ""}`, children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ArticleTable_module_default.headerRow, children: [
+      showRank && /* @__PURE__ */ jsxRuntime.jsx("div", { className: ArticleTable_module_default.rankCell }),
+      columns.map((col) => /* @__PURE__ */ jsxRuntime.jsx("div", { className: ArticleTable_module_default.headerCell, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: ArticleTable_module_default.headerLabel, children: col.label }) }, col.key))
     ] }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { children: visibleRows.map((row, i) => /* @__PURE__ */ jsxRuntime.jsxs(
-      "div",
-      {
-        className: "flex items-center gap-4 border-b border-[var(--border-color)] last:border-b-0",
-        children: [
-          showRank && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-[120px] shrink-0 px-4 py-4", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[14px] leading-5 text-[var(--fg-muted)]", children: i + 1 }) }),
-          columns.map((col) => {
-            const value = row[col.key];
-            const hasBadge = row._badge && row._badgeColumn === col.key;
-            return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1 px-4 py-4 flex items-center gap-3", children: [
-              col.render ? col.render(value, row) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[14px] leading-5 text-[var(--fg-secondary)]", children: String(value != null ? value : "") }),
-              hasBadge && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "inline-flex items-center px-2.5 py-0.5 rounded-full text-[12px] leading-4 font-semibold bg-[var(--bg-tertiary)] text-[var(--fg)]", children: row._badge })
-            ] }, col.key);
-          })
-        ]
-      },
-      i
-    )) }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { children: visibleRows.map((row, i) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ArticleTable_module_default.row, children: [
+      showRank && /* @__PURE__ */ jsxRuntime.jsx("div", { className: ArticleTable_module_default.rankValue, children: /* @__PURE__ */ jsxRuntime.jsx("span", { children: i + 1 }) }),
+      columns.map((col) => {
+        const value = row[col.key];
+        const hasBadge = row._badge && row._badgeColumn === col.key;
+        return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ArticleTable_module_default.cell, children: [
+          col.render ? col.render(value, row) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: ArticleTable_module_default.cellText, children: String(value != null ? value : "") }),
+          hasBadge && /* @__PURE__ */ jsxRuntime.jsx("span", { className: ArticleTable_module_default.badge, children: row._badge })
+        ] }, col.key);
+      })
+    ] }, i)) }),
     hiddenCount > 0 && !expanded && /* @__PURE__ */ jsxRuntime.jsxs(
       "button",
       {
         onClick: () => setExpanded(true),
-        className: "mt-4 text-[14px] leading-5 font-medium text-[var(--fg-muted)] hover:text-[var(--fg)] transition-colors cursor-pointer",
+        className: ArticleTable_module_default.showMore,
         children: [
           "Show ",
           hiddenCount,
@@ -2503,34 +3223,62 @@ function ArticleTable({
     )
   ] });
 }
+
+// src/templates/ArticleList.module.scss
+var ArticleList_module_default = {
+  root: "ArticleList_module_root",
+  ordered: "ArticleList_module_ordered",
+  unordered: "ArticleList_module_unordered",
+  item: "ArticleList_module_item"
+};
 function ArticleList({
   variant = "unordered",
   items,
   className = ""
 }) {
   const Tag2 = variant === "ordered" ? "ol" : "ul";
-  const markerClass = variant === "ordered" ? "list-decimal" : "list-disc";
+  const variantClass = variant === "ordered" ? ArticleList_module_default.ordered : ArticleList_module_default.unordered;
   return /* @__PURE__ */ jsxRuntime.jsx(
     Tag2,
     {
-      className: `pl-[26px] flex flex-col gap-2 text-[16px] leading-7 text-[var(--fg-secondary)] ${markerClass} ${className}`,
-      children: items.map((item, i) => /* @__PURE__ */ jsxRuntime.jsx("li", { className: "pl-1", children: item }, i))
+      className: `${ArticleList_module_default.root} ${variantClass}${className ? ` ${className}` : ""}`,
+      children: items.map((item, i) => /* @__PURE__ */ jsxRuntime.jsx("li", { className: ArticleList_module_default.item, children: item }, i))
     }
   );
 }
+
+// src/templates/ArticleNote.module.scss
+var ArticleNote_module_default = {
+  root: "ArticleNote_module_root"
+};
 function ArticleNote({ children, className = "" }) {
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    "p",
-    {
-      className: `text-[16px] leading-7 text-[var(--fg-secondary)] italic ${className}`,
-      children
-    }
-  );
+  return /* @__PURE__ */ jsxRuntime.jsx("p", { className: `${ArticleNote_module_default.root}${className ? ` ${className}` : ""}`, children });
 }
-var roleStyles = {
-  assistant: { bg: "bg-[var(--bg-secondary)]", label: "text-[var(--fg-secondary)]", gradient: "var(--bg-secondary)" },
-  system: { bg: "bg-[var(--bg-tertiary)]", label: "text-[var(--fg-secondary)]", gradient: "var(--bg-tertiary)" },
-  user: { bg: "bg-[var(--bg-secondary)]", label: "text-[var(--fg-secondary)]", gradient: "var(--bg-secondary)" }
+
+// src/templates/ArticleChatBlock.module.scss
+var ArticleChatBlock_module_default = {
+  root: "ArticleChatBlock_module_root",
+  assistant: "ArticleChatBlock_module_assistant",
+  system: "ArticleChatBlock_module_system",
+  user: "ArticleChatBlock_module_user",
+  header: "ArticleChatBlock_module_header",
+  roleLabel: "ArticleChatBlock_module_roleLabel",
+  toolBadge: "ArticleChatBlock_module_toolBadge",
+  toolBadgeInner: "ArticleChatBlock_module_toolBadgeInner",
+  toolDot: "ArticleChatBlock_module_toolDot",
+  toolLabel: "ArticleChatBlock_module_toolLabel",
+  divider: "ArticleChatBlock_module_divider",
+  contentWrapper: "ArticleChatBlock_module_contentWrapper",
+  content: "ArticleChatBlock_module_content",
+  fadeOverlay: "ArticleChatBlock_module_fadeOverlay",
+  fadeGradient: "ArticleChatBlock_module_fadeGradient",
+  showMoreBar: "ArticleChatBlock_module_showMoreBar",
+  showMoreBtn: "ArticleChatBlock_module_showMoreBtn"
+};
+var roleConfig = {
+  assistant: { cls: ArticleChatBlock_module_default.assistant, gradient: "var(--bg-secondary)" },
+  system: { cls: ArticleChatBlock_module_default.system, gradient: "var(--bg-tertiary)" },
+  user: { cls: ArticleChatBlock_module_default.user, gradient: "var(--bg-secondary)" }
 };
 function ArticleChatBlock({
   role,
@@ -2543,41 +3291,41 @@ function ArticleChatBlock({
 }) {
   var _a;
   const [expanded, setExpanded] = react.useState(false);
-  const styles = (_a = roleStyles[role]) != null ? _a : roleStyles.assistant;
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `w-full rounded-[var(--radius-lg)] overflow-hidden ${styles.bg} ${className}`, children: [
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-2 px-5 pt-4 pb-2", children: /* @__PURE__ */ jsxRuntime.jsxs("span", { className: `text-[12px] leading-4 ${styles.label}`, children: [
+  const config = (_a = roleConfig[role]) != null ? _a : roleConfig.assistant;
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `${ArticleChatBlock_module_default.root} ${config.cls}${className ? ` ${className}` : ""}`, children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: ArticleChatBlock_module_default.header, children: /* @__PURE__ */ jsxRuntime.jsxs("span", { className: ArticleChatBlock_module_default.roleLabel, children: [
       role,
       model && ` \u2022 ${model}`
     ] }) }),
-    toolCall && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "px-5 pb-2", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "inline-flex items-center gap-1.5 px-3 py-1 rounded-full border border-[var(--border-color)] bg-[var(--bg)]", children: [
-      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "w-1.5 h-1.5 rounded-full bg-[var(--color-accent)]" }),
-      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[13px] font-medium tracking-[-0.25px] text-[var(--fg-secondary)]", children: toolCall })
+    toolCall && /* @__PURE__ */ jsxRuntime.jsx("div", { className: ArticleChatBlock_module_default.toolBadge, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ArticleChatBlock_module_default.toolBadgeInner, children: [
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: ArticleChatBlock_module_default.toolDot }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: ArticleChatBlock_module_default.toolLabel, children: toolCall })
     ] }) }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mx-5 h-px bg-[var(--border-color)]" }),
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: ArticleChatBlock_module_default.divider }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ArticleChatBlock_module_default.contentWrapper, children: [
       /* @__PURE__ */ jsxRuntime.jsx(
         "div",
         {
-          className: "px-5 py-4 text-[14px] leading-6 text-[var(--fg-secondary)] overflow-hidden transition-all",
+          className: ArticleChatBlock_module_default.content,
           style: collapsible && !expanded ? { maxHeight: collapsedHeight, overflow: "hidden" } : void 0,
           children
         }
       ),
-      collapsible && !expanded && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "absolute bottom-0 left-0 right-0", children: [
+      collapsible && !expanded && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ArticleChatBlock_module_default.fadeOverlay, children: [
         /* @__PURE__ */ jsxRuntime.jsx(
           "div",
           {
-            className: "h-16 pointer-events-none",
+            className: ArticleChatBlock_module_default.fadeGradient,
             style: {
-              background: `linear-gradient(to top, ${styles.gradient}, transparent)`
+              background: `linear-gradient(to top, ${config.gradient}, transparent)`
             }
           }
         ),
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: `px-5 pb-4 ${styles.bg}`, children: /* @__PURE__ */ jsxRuntime.jsx(
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${ArticleChatBlock_module_default.showMoreBar} ${config.cls}`, children: /* @__PURE__ */ jsxRuntime.jsx(
           "button",
           {
             onClick: () => setExpanded(true),
-            className: "text-[14px] leading-5 font-medium text-[var(--fg-muted)] hover:text-[var(--fg)] transition-colors cursor-pointer",
+            className: ArticleChatBlock_module_default.showMoreBtn,
             children: "Show more"
           }
         ) })
@@ -2585,40 +3333,79 @@ function ArticleChatBlock({
     ] })
   ] });
 }
+
+// src/templates/ArticleLinkButton.module.scss
+var ArticleLinkButton_module_default = {
+  root: "ArticleLinkButton_module_root"
+};
 function ArticleLinkButton({
   children,
   href,
   onClick,
   className = ""
 }) {
-  const baseClass = `inline-flex items-center justify-center px-4 py-2 rounded-full bg-[var(--fg)] text-[13px] font-medium tracking-[-0.25px] text-[var(--bg)] border border-[var(--bg)] shadow-[var(--shadow-sm)] hover:opacity-90 active:opacity-80 transition-all duration-[var(--transition-fast)] cursor-pointer ${className}`;
+  const cls = `${ArticleLinkButton_module_default.root}${className ? ` ${className}` : ""}`;
   if (href) {
-    return /* @__PURE__ */ jsxRuntime.jsx("a", { href, className: baseClass, children });
+    return /* @__PURE__ */ jsxRuntime.jsx("a", { href, className: cls, children });
   }
-  return /* @__PURE__ */ jsxRuntime.jsx("button", { onClick, className: baseClass, children });
+  return /* @__PURE__ */ jsxRuntime.jsx("button", { onClick, className: cls, children });
 }
+
+// src/templates/ArticleFooter.module.scss
+var ArticleFooter_module_default = {
+  root: "ArticleFooter_module_root",
+  topBar: "ArticleFooter_module_topBar",
+  logo: "ArticleFooter_module_logo",
+  divider: "ArticleFooter_module_divider",
+  copyright: "ArticleFooter_module_copyright"
+};
 function ArticleFooter({
   logo,
   copyright = `\xA9 ${(/* @__PURE__ */ new Date()).getFullYear()} All rights reserved.`,
   className = ""
 }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs("footer", { className: `w-full px-20 py-10 flex flex-col gap-10 ${className}`, children: [
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center", children: [
-      logo && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "shrink-0 pr-10", children: logo }),
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 h-px bg-[var(--fg)]" })
+  return /* @__PURE__ */ jsxRuntime.jsxs("footer", { className: `${ArticleFooter_module_default.root}${className ? ` ${className}` : ""}`, children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ArticleFooter_module_default.topBar, children: [
+      logo && /* @__PURE__ */ jsxRuntime.jsx("div", { className: ArticleFooter_module_default.logo, children: logo }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: ArticleFooter_module_default.divider })
     ] }),
-    /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-[14px] leading-5 text-[var(--fg-muted)]", children: copyright })
+    /* @__PURE__ */ jsxRuntime.jsx("p", { className: ArticleFooter_module_default.copyright, children: copyright })
   ] });
 }
+
+// src/templates/ArticleLayout.module.scss
+var ArticleLayout_module_default = {
+  root: "ArticleLayout_module_root",
+  wide: "ArticleLayout_module_wide",
+  narrow: "ArticleLayout_module_narrow"
+};
 function ArticleLayout({ children, className = "" }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("article", { className: `w-full max-w-[1100px] mx-auto flex flex-col gap-5 ${className}`, children });
+  return /* @__PURE__ */ jsxRuntime.jsx("article", { className: `${ArticleLayout_module_default.root}${className ? ` ${className}` : ""}`, children });
 }
 function ArticleWide({ children, className = "" }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: `w-full ${className}`, children });
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${ArticleLayout_module_default.wide}${className ? ` ${className}` : ""}`, children });
 }
 function ArticleNarrow({ children, className = "" }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: `w-full max-w-[720px] ${className}`, children });
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${ArticleLayout_module_default.narrow}${className ? ` ${className}` : ""}`, children });
 }
+
+// src/templates/ArticleChart.module.scss
+var ArticleChart_module_default = {
+  figure: "ArticleChart_module_figure",
+  chartWrapper: "ArticleChart_module_chartWrapper",
+  tooltip: "ArticleChart_module_tooltip",
+  tooltipLabel: "ArticleChart_module_tooltipLabel",
+  tooltipRow: "ArticleChart_module_tooltipRow",
+  tooltipDot: "ArticleChart_module_tooltipDot",
+  tooltipName: "ArticleChart_module_tooltipName",
+  tooltipValue: "ArticleChart_module_tooltipValue",
+  scatterTooltipLabel: "ArticleChart_module_scatterTooltipLabel",
+  scatterTooltipRow: "ArticleChart_module_scatterTooltipRow",
+  legend: "ArticleChart_module_legend",
+  legendItem: "ArticleChart_module_legendItem",
+  legendSwatch: "ArticleChart_module_legendSwatch",
+  legendLabel: "ArticleChart_module_legendLabel"
+};
 function ChartTooltip({
   active,
   payload,
@@ -2629,15 +3416,15 @@ function ChartTooltip({
 }) {
   if (!active || !(payload == null ? void 0 : payload.length)) return null;
   const fmt = valueFormatter != null ? valueFormatter : ((v) => String(v));
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-[var(--bg)] border border-[var(--border-color)] rounded-[var(--radius-md)] shadow-[var(--shadow-md)] px-3 py-2 text-[12px] leading-4", children: [
-    label !== void 0 && /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-[var(--fg-muted)] mb-1", children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ArticleChart_module_default.tooltip, children: [
+    label !== void 0 && /* @__PURE__ */ jsxRuntime.jsxs("p", { className: ArticleChart_module_default.tooltipLabel, children: [
       xLabel ? `${xLabel}: ` : "",
       label
     ] }),
-    payload.map((entry, i) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
-      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "w-2 h-2 rounded-full shrink-0", style: { backgroundColor: entry.color } }),
-      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[var(--fg-secondary)]", children: entry.name }),
-      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-medium text-[var(--fg)] ml-auto pl-3", children: yLabel ? `${fmt(entry.value)} ` : fmt(entry.value) })
+    payload.map((entry, i) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ArticleChart_module_default.tooltipRow, children: [
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: ArticleChart_module_default.tooltipDot, style: { backgroundColor: entry.color } }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: ArticleChart_module_default.tooltipName, children: entry.name }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: ArticleChart_module_default.tooltipValue, children: yLabel ? `${fmt(entry.value)} ` : fmt(entry.value) })
     ] }, i))
   ] });
 }
@@ -2651,8 +3438,8 @@ function ArticleLineChart({
   valueFormatter,
   className = ""
 }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs("figure", { className: `w-full ${className}`, children: [
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-full", style: { height }, children: /* @__PURE__ */ jsxRuntime.jsx(recharts.ResponsiveContainer, { width: "100%", height: "100%", children: /* @__PURE__ */ jsxRuntime.jsxs(recharts.LineChart, { data, margin: { top: 8, right: 16, bottom: 4, left: 8 }, children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs("figure", { className: `${ArticleChart_module_default.figure}${className ? ` ${className}` : ""}`, children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: ArticleChart_module_default.chartWrapper, style: { height }, children: /* @__PURE__ */ jsxRuntime.jsx(recharts.ResponsiveContainer, { width: "100%", height: "100%", children: /* @__PURE__ */ jsxRuntime.jsxs(recharts.LineChart, { data, margin: { top: 8, right: 16, bottom: 4, left: 8 }, children: [
       /* @__PURE__ */ jsxRuntime.jsx(recharts.CartesianGrid, { strokeDasharray: "3 3", stroke: "var(--border-color)" }),
       /* @__PURE__ */ jsxRuntime.jsx(
         recharts.XAxis,
@@ -2702,9 +3489,9 @@ function ArticleLineChart({
         s.dataKey
       ))
     ] }) }) }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-4 mt-3 flex-wrap", children: series.map((s) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1.5", children: [
-      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "w-3 h-3 rounded-sm shrink-0", style: { backgroundColor: s.color } }),
-      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[12px] leading-4 text-[var(--fg-secondary)]", children: s.name })
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: ArticleChart_module_default.legend, children: series.map((s) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ArticleChart_module_default.legendItem, children: [
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: ArticleChart_module_default.legendSwatch, style: { backgroundColor: s.color } }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: ArticleChart_module_default.legendLabel, children: s.name })
     ] }, s.dataKey)) })
   ] });
 }
@@ -2719,8 +3506,8 @@ function ArticleBarChart({
   valueFormatter,
   className = ""
 }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs("figure", { className: `w-full ${className}`, children: [
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-full", style: { height }, children: /* @__PURE__ */ jsxRuntime.jsx(recharts.ResponsiveContainer, { width: "100%", height: "100%", children: /* @__PURE__ */ jsxRuntime.jsxs(recharts.BarChart, { data, margin: { top: 8, right: 16, bottom: 4, left: 8 }, children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs("figure", { className: `${ArticleChart_module_default.figure}${className ? ` ${className}` : ""}`, children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: ArticleChart_module_default.chartWrapper, style: { height }, children: /* @__PURE__ */ jsxRuntime.jsx(recharts.ResponsiveContainer, { width: "100%", height: "100%", children: /* @__PURE__ */ jsxRuntime.jsxs(recharts.BarChart, { data, margin: { top: 8, right: 16, bottom: 4, left: 8 }, children: [
       /* @__PURE__ */ jsxRuntime.jsx(recharts.CartesianGrid, { strokeDasharray: "3 3", stroke: "var(--border-color)", vertical: false }),
       /* @__PURE__ */ jsxRuntime.jsx(
         recharts.XAxis,
@@ -2768,9 +3555,9 @@ function ArticleBarChart({
         s.dataKey
       ))
     ] }) }) }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-4 mt-3 flex-wrap", children: series.map((s) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1.5", children: [
-      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "w-3 h-3 rounded-sm shrink-0", style: { backgroundColor: s.color } }),
-      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[12px] leading-4 text-[var(--fg-secondary)]", children: s.name })
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: ArticleChart_module_default.legend, children: series.map((s) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ArticleChart_module_default.legendItem, children: [
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: ArticleChart_module_default.legendSwatch, style: { backgroundColor: s.color } }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: ArticleChart_module_default.legendLabel, children: s.name })
     ] }, s.dataKey)) })
   ] });
 }
@@ -2788,7 +3575,7 @@ function ArticleScatterChart({
     var _a;
     return (_a = d.color) != null ? _a : color;
   });
-  return /* @__PURE__ */ jsxRuntime.jsx("figure", { className: `w-full ${className}`, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-full", style: { height }, children: /* @__PURE__ */ jsxRuntime.jsx(recharts.ResponsiveContainer, { width: "100%", height: "100%", children: /* @__PURE__ */ jsxRuntime.jsxs(recharts.ScatterChart, { margin: { top: 8, right: 16, bottom: 4, left: 8 }, children: [
+  return /* @__PURE__ */ jsxRuntime.jsx("figure", { className: `${ArticleChart_module_default.figure}${className ? ` ${className}` : ""}`, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: ArticleChart_module_default.chartWrapper, style: { height }, children: /* @__PURE__ */ jsxRuntime.jsx(recharts.ResponsiveContainer, { width: "100%", height: "100%", children: /* @__PURE__ */ jsxRuntime.jsxs(recharts.ScatterChart, { margin: { top: 8, right: 16, bottom: 4, left: 8 }, children: [
     /* @__PURE__ */ jsxRuntime.jsx(recharts.CartesianGrid, { strokeDasharray: "3 3", stroke: "var(--border-color)" }),
     /* @__PURE__ */ jsxRuntime.jsx(
       recharts.XAxis,
@@ -2824,14 +3611,14 @@ function ArticleScatterChart({
           if (!active || !(payload == null ? void 0 : payload.length)) return null;
           const point = (_a = payload[0]) == null ? void 0 : _a.payload;
           const fmt = valueFormatter != null ? valueFormatter : ((v) => String(v));
-          return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-[var(--bg)] border border-[var(--border-color)] rounded-[var(--radius-md)] shadow-[var(--shadow-md)] px-3 py-2 text-[12px] leading-4", children: [
-            point.label && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "font-medium text-[var(--fg)] mb-1", children: point.label }),
-            xLabel && /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-[var(--fg-secondary)]", children: [
+          return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ArticleChart_module_default.tooltip, children: [
+            point.label && /* @__PURE__ */ jsxRuntime.jsx("p", { className: ArticleChart_module_default.scatterTooltipLabel, children: point.label }),
+            xLabel && /* @__PURE__ */ jsxRuntime.jsxs("p", { className: ArticleChart_module_default.scatterTooltipRow, children: [
               xLabel,
               ": ",
               fmt(point.x)
             ] }),
-            yLabel && /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-[var(--fg-secondary)]", children: [
+            yLabel && /* @__PURE__ */ jsxRuntime.jsxs("p", { className: ArticleChart_module_default.scatterTooltipRow, children: [
               yLabel,
               ": ",
               fmt(point.y)
@@ -2843,6 +3630,16 @@ function ArticleScatterChart({
     /* @__PURE__ */ jsxRuntime.jsx(recharts.Scatter, { data, children: data.map((_, i) => /* @__PURE__ */ jsxRuntime.jsx(recharts.Cell, { fill: colors[i], r: 6 }, i)) })
   ] }) }) }) });
 }
+
+// src/templates/LandingLayout.module.scss
+var LandingLayout_module_default = {
+  headerMode: "LandingLayout_module_headerMode",
+  headerMain: "LandingLayout_module_headerMain",
+  sidebarMode: "LandingLayout_module_sidebarMode",
+  sidebarNav: "LandingLayout_module_sidebarNav",
+  sidebarMain: "LandingLayout_module_sidebarMain",
+  sidebarContent: "LandingLayout_module_sidebarContent"
+};
 function LandingLayout({
   mode = "header",
   nav,
@@ -2850,14 +3647,14 @@ function LandingLayout({
   className = ""
 }) {
   if (mode === "sidebar") {
-    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `flex min-h-screen bg-[var(--bg)] ${className}`, children: [
-      nav && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "hidden md:flex shrink-0", children: nav }),
-      /* @__PURE__ */ jsxRuntime.jsx("main", { className: "flex-1 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "px-6 md:px-10 lg:px-16 max-w-5xl", children }) })
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `${LandingLayout_module_default.sidebarMode}${className ? ` ${className}` : ""}`, children: [
+      nav && /* @__PURE__ */ jsxRuntime.jsx("div", { className: LandingLayout_module_default.sidebarNav, children: nav }),
+      /* @__PURE__ */ jsxRuntime.jsx("main", { className: LandingLayout_module_default.sidebarMain, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: LandingLayout_module_default.sidebarContent, children }) })
     ] });
   }
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `min-h-screen bg-[var(--bg)] ${className}`, children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `${LandingLayout_module_default.headerMode}${className ? ` ${className}` : ""}`, children: [
     nav,
-    /* @__PURE__ */ jsxRuntime.jsx("main", { className: "max-w-7xl mx-auto px-4 sm:px-6 lg:px-8", children })
+    /* @__PURE__ */ jsxRuntime.jsx("main", { className: LandingLayout_module_default.headerMain, children })
   ] });
 }