@kuckit/landing-module 4.0.5 → 5.0.1

package/dist/client/components/features.js

@@ -0,0 +1,624 @@
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/client/components/features.tsx
+const AI_FEATURES = [
+	{
+		title: "Context Engineering",
+		tag: "Hot"
+	},
+	{ title: "Skills Your AI Can Use" },
+	{
+		title: "Curated MCP Tools",
+		tag: "New"
+	},
+	{ title: "Multi-Agent Workflows" }
+];
+function ScanLines() {
+	return /* @__PURE__ */ jsx("div", {
+		className: "absolute inset-0 pointer-events-none overflow-hidden opacity-[0.03]",
+		children: /* @__PURE__ */ jsx("div", {
+			className: "absolute inset-0",
+			style: {
+				backgroundImage: "repeating-linear-gradient(0deg, transparent, transparent 2px, currentColor 2px, currentColor 3px)",
+				backgroundSize: "100% 4px"
+			}
+		})
+	});
+}
+function GridPattern() {
+	return /* @__PURE__ */ jsx("div", {
+		className: "absolute inset-0 pointer-events-none opacity-[0.04]",
+		children: /* @__PURE__ */ jsxs("svg", {
+			className: "w-full h-full",
+			xmlns: "http://www.w3.org/2000/svg",
+			children: [/* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsx("pattern", {
+				id: "grid",
+				width: "20",
+				height: "20",
+				patternUnits: "userSpaceOnUse",
+				children: /* @__PURE__ */ jsx("path", {
+					d: "M 20 0 L 0 0 0 20",
+					fill: "none",
+					stroke: "currentColor",
+					strokeWidth: "0.5"
+				})
+			}) }), /* @__PURE__ */ jsx("rect", {
+				width: "100%",
+				height: "100%",
+				fill: "url(#grid)"
+			})]
+		})
+	});
+}
+function CornerMarkers({ glow = false }) {
+	const baseClass = "absolute w-5 h-5 border-primary";
+	const glowClass = glow ? "shadow-[0_0_10px_rgba(209,80,16,0.5)]" : "";
+	return /* @__PURE__ */ jsxs(Fragment, { children: [
+		/* @__PURE__ */ jsx("div", { className: `${baseClass} ${glowClass} -top-px -left-px border-l-2 border-t-2` }),
+		/* @__PURE__ */ jsx("div", { className: `${baseClass} ${glowClass} -top-px -right-px border-r-2 border-t-2` }),
+		/* @__PURE__ */ jsx("div", { className: `${baseClass} ${glowClass} -bottom-px -left-px border-l-2 border-b-2` }),
+		/* @__PURE__ */ jsx("div", { className: `${baseClass} ${glowClass} -bottom-px -right-px border-r-2 border-b-2` })
+	] });
+}
+function DiagonalAccent() {
+	return /* @__PURE__ */ jsx("div", {
+		className: "absolute top-0 right-0 w-32 h-32 pointer-events-none",
+		style: { background: "linear-gradient(135deg, hsl(var(--primary) / 0.15) 0%, transparent 50%)" }
+	});
+}
+function CardA() {
+	return /* @__PURE__ */ jsxs("div", {
+		className: "group relative bg-gradient-to-br from-card via-card to-primary/5 border border-border overflow-hidden transform-gpu md:col-span-2 md:row-span-2 transition-all duration-500 hover:border-primary/60 hover:shadow-[0_0_40px_rgba(209,80,16,0.15)]",
+		children: [
+			/* @__PURE__ */ jsx(CornerMarkers, { glow: true }),
+			/* @__PURE__ */ jsx(GridPattern, {}),
+			/* @__PURE__ */ jsx(DiagonalAccent, {}),
+			/* @__PURE__ */ jsx("div", { className: "absolute -top-20 -right-20 w-64 h-64 bg-primary/20 rounded-full blur-[80px] group-hover:scale-150 transition-transform duration-700" }),
+			/* @__PURE__ */ jsx("div", {
+				className: "absolute bottom-0 left-0 right-0 h-24 opacity-20 group-hover:opacity-40 transition-opacity",
+				children: /* @__PURE__ */ jsxs("svg", {
+					className: "w-full h-full",
+					viewBox: "0 0 400 100",
+					preserveAspectRatio: "none",
+					children: [/* @__PURE__ */ jsx("path", {
+						d: "M0,80 Q50,60 100,70 T200,50 T300,65 T400,45 L400,100 L0,100 Z",
+						fill: "url(#waveGradient)"
+					}), /* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsxs("linearGradient", {
+						id: "waveGradient",
+						x1: "0%",
+						y1: "0%",
+						x2: "0%",
+						y2: "100%",
+						children: [/* @__PURE__ */ jsx("stop", {
+							offset: "0%",
+							stopColor: "hsl(var(--primary))",
+							stopOpacity: "0.4"
+						}), /* @__PURE__ */ jsx("stop", {
+							offset: "100%",
+							stopColor: "hsl(var(--primary))",
+							stopOpacity: "0"
+						})]
+					}) })]
+				})
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				className: "absolute inset-0 flex flex-col justify-center p-8 md:p-12",
+				children: [/* @__PURE__ */ jsxs("div", {
+					className: "transition-transform duration-500 ease-out group-hover:-translate-y-6",
+					children: [
+						/* @__PURE__ */ jsxs("div", {
+							className: "flex items-center gap-3 mb-6",
+							children: [/* @__PURE__ */ jsx("div", { className: "w-2 h-2 bg-primary animate-pulse shadow-[0_0_8px_rgba(209,80,16,0.8)]" }), /* @__PURE__ */ jsx("span", {
+								className: "text-[10px] text-primary tracking-[0.3em] uppercase font-medium",
+								children: "Production Ready"
+							})]
+						}),
+						/* @__PURE__ */ jsxs("h3", {
+							className: "text-3xl md:text-4xl lg:text-5xl font-light tracking-[-0.04em] text-foreground mb-6 leading-[1.1]",
+							children: [
+								"Ship faster.",
+								/* @__PURE__ */ jsx("br", {}),
+								/* @__PURE__ */ jsx("span", {
+									className: "text-primary",
+									children: "Build right."
+								})
+							]
+						}),
+						/* @__PURE__ */ jsx("div", {
+							className: "flex flex-wrap gap-3",
+							children: [
+								"Production-ready",
+								"Pre-built features",
+								"AI-native"
+							].map((pill, i) => /* @__PURE__ */ jsx("span", {
+								className: "px-4 py-2 text-xs border border-primary/40 text-foreground/80 bg-primary/5 backdrop-blur-sm tracking-wide transition-all duration-300 hover:bg-primary/20 hover:border-primary",
+								style: { animationDelay: `${i * 100}ms` },
+								children: pill
+							}, pill))
+						})
+					]
+				}), /* @__PURE__ */ jsx("div", {
+					className: "absolute bottom-8 md:bottom-12 left-8 md:left-12 opacity-0 group-hover:opacity-100 translate-y-6 group-hover:translate-y-0 transition-all duration-500 delay-100",
+					children: /* @__PURE__ */ jsxs("a", {
+						href: "/docs/getting-started",
+						className: "inline-flex items-center gap-3 text-sm text-primary font-medium tracking-wide group/cta",
+						children: [/* @__PURE__ */ jsxs("span", {
+							className: "relative",
+							children: ["Get Started", /* @__PURE__ */ jsx("span", { className: "absolute bottom-0 left-0 w-0 h-px bg-primary group-hover/cta:w-full transition-all duration-300" })]
+						}), /* @__PURE__ */ jsx("svg", {
+							className: "w-4 h-4 group-hover/cta:translate-x-1 transition-transform",
+							fill: "none",
+							viewBox: "0 0 24 24",
+							stroke: "currentColor",
+							strokeWidth: 2,
+							children: /* @__PURE__ */ jsx("path", {
+								strokeLinecap: "round",
+								strokeLinejoin: "round",
+								d: "M17 8l4 4m0 0l-4 4m4-4H3"
+							})
+						})]
+					})
+				})]
+			})
+		]
+	});
+}
+function CardB({ className = "" }) {
+	return /* @__PURE__ */ jsxs("div", {
+		className: `group relative bg-card border border-border overflow-hidden transform-gpu transition-all duration-500 hover:border-primary/60 hover:shadow-[0_0_30px_rgba(209,80,16,0.1)] ${className}`,
+		children: [
+			/* @__PURE__ */ jsx(CornerMarkers, {}),
+			/* @__PURE__ */ jsx(ScanLines, {}),
+			/* @__PURE__ */ jsxs("div", {
+				className: "absolute top-6 right-6 w-16 h-16",
+				children: [
+					/* @__PURE__ */ jsx("div", {
+						className: "absolute inset-0 border border-primary/30 rounded-full animate-ping",
+						style: { animationDuration: "3s" }
+					}),
+					/* @__PURE__ */ jsx("div", {
+						className: "absolute inset-2 border border-primary/50 rounded-full animate-ping",
+						style: {
+							animationDuration: "3s",
+							animationDelay: "0.5s"
+						}
+					}),
+					/* @__PURE__ */ jsx("div", {
+						className: "absolute inset-4 bg-primary/20 rounded-full flex items-center justify-center",
+						children: /* @__PURE__ */ jsx("div", { className: "w-2 h-2 bg-primary rounded-full shadow-[0_0_10px_rgba(209,80,16,0.8)]" })
+					})
+				]
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				className: "absolute inset-0 flex flex-col p-6",
+				children: [
+					/* @__PURE__ */ jsxs("div", {
+						className: "flex items-center gap-2 mb-6",
+						children: [/* @__PURE__ */ jsx("span", {
+							className: "text-[10px] text-muted-foreground tracking-[0.2em] uppercase",
+							children: "AI Enhancement"
+						}), /* @__PURE__ */ jsx("span", {
+							className: "px-1.5 py-0.5 text-[8px] bg-[hsl(var(--status-success))] text-white tracking-wider uppercase",
+							children: "Active"
+						})]
+					}),
+					/* @__PURE__ */ jsxs("div", {
+						className: "flex-1 flex flex-col justify-center",
+						children: [/* @__PURE__ */ jsxs("div", {
+							className: "relative",
+							children: [/* @__PURE__ */ jsxs("span", {
+								className: "text-6xl md:text-7xl font-extralight text-foreground tracking-tighter",
+								children: ["10", /* @__PURE__ */ jsx("span", {
+									className: "text-primary",
+									children: "x"
+								})]
+							}), /* @__PURE__ */ jsx("div", { className: "absolute -inset-4 bg-primary/10 blur-2xl -z-10" })]
+						}), /* @__PURE__ */ jsx("span", {
+							className: "text-sm text-muted-foreground mt-2 tracking-wide",
+							children: "Faster AI responses"
+						})]
+					}),
+					/* @__PURE__ */ jsx("div", {
+						className: "space-y-2 mt-4",
+						children: [
+							{
+								label: "Smart Context",
+								value: "100%"
+							},
+							{
+								label: "Auto-Complete",
+								value: "95%"
+							},
+							{
+								label: "Team of AIs",
+								value: "∞"
+							}
+						].map((cap, i) => /* @__PURE__ */ jsxs("div", {
+							className: "group/bar relative overflow-hidden",
+							children: [/* @__PURE__ */ jsxs("div", {
+								className: "flex items-center justify-between text-xs mb-1",
+								children: [/* @__PURE__ */ jsx("span", {
+									className: "text-muted-foreground",
+									children: cap.label
+								}), /* @__PURE__ */ jsx("span", {
+									className: "text-primary font-mono",
+									children: cap.value
+								})]
+							}), /* @__PURE__ */ jsx("div", {
+								className: "h-1 bg-border rounded-full overflow-hidden",
+								children: /* @__PURE__ */ jsx("div", {
+									className: "h-full bg-gradient-to-r from-primary/50 to-primary rounded-full transition-all duration-700 group-hover:from-primary group-hover:to-primary",
+									style: {
+										width: cap.value === "∞" ? "100%" : cap.value,
+										transitionDelay: `${i * 100}ms`
+									}
+								})
+							})]
+						}, cap.label))
+					})
+				]
+			})
+		]
+	});
+}
+function CardC({ className = "" }) {
+	return /* @__PURE__ */ jsxs("div", {
+		className: `group relative bg-card border border-border overflow-hidden transform-gpu transition-all duration-500 hover:border-primary/60 ${className}`,
+		children: [
+			/* @__PURE__ */ jsx(CornerMarkers, {}),
+			/* @__PURE__ */ jsx("div", {
+				className: "absolute inset-0 opacity-0 group-hover:opacity-100 transition-opacity duration-500",
+				style: { background: "linear-gradient(135deg, transparent 49.5%, hsl(var(--primary) / 0.1) 49.5%, hsl(var(--primary) / 0.1) 50.5%, transparent 50.5%)" }
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				className: "absolute inset-0 flex flex-col justify-center p-6",
+				children: [/* @__PURE__ */ jsx("div", {
+					className: "text-[10px] text-muted-foreground tracking-[0.2em] uppercase mb-4",
+					children: "Transformation"
+				}), /* @__PURE__ */ jsx("div", {
+					className: "space-y-4",
+					children: [
+						{
+							problem: "Stuck in loops",
+							outcome: "Ship in hours",
+							icon: "○"
+						},
+						{
+							problem: "Can't debug",
+							outcome: "Code you own",
+							icon: "△"
+						},
+						{
+							problem: "Won't deploy",
+							outcome: "Launch confident",
+							icon: "□"
+						}
+					].map((t, i) => /* @__PURE__ */ jsxs("div", {
+						className: "group/row relative flex items-center gap-3 transition-all duration-300",
+						style: { transitionDelay: `${i * 50}ms` },
+						children: [/* @__PURE__ */ jsx("span", {
+							className: "w-6 h-6 flex items-center justify-center border border-border text-muted-foreground text-xs group-hover/row:border-primary group-hover/row:text-primary transition-colors",
+							children: t.icon
+						}), /* @__PURE__ */ jsxs("div", {
+							className: "flex-1 flex items-center gap-2 text-sm",
+							children: [
+								/* @__PURE__ */ jsx("span", {
+									className: "text-muted-foreground/60 line-through decoration-primary/50 group-hover:text-muted-foreground/40 transition-colors",
+									children: t.problem
+								}),
+								/* @__PURE__ */ jsx("svg", {
+									className: "w-4 h-4 text-primary shrink-0 group-hover:translate-x-1 transition-transform",
+									viewBox: "0 0 24 24",
+									fill: "none",
+									stroke: "currentColor",
+									strokeWidth: 2,
+									children: /* @__PURE__ */ jsx("path", {
+										strokeLinecap: "round",
+										strokeLinejoin: "round",
+										d: "M13 7l5 5m0 0l-5 5m5-5H6"
+									})
+								}),
+								/* @__PURE__ */ jsx("span", {
+									className: "text-foreground font-medium group-hover:text-primary transition-colors",
+									children: t.outcome
+								})
+							]
+						})]
+					}, t.problem))
+				})]
+			})
+		]
+	});
+}
+function FeaturePill({ title, tag }) {
+	return /* @__PURE__ */ jsxs("div", {
+		className: "shrink-0 px-5 py-3 bg-gradient-to-r from-card to-primary/5 border border-border flex items-center gap-3 group-hover:border-primary/40 transition-colors",
+		children: [
+			/* @__PURE__ */ jsx("div", { className: "w-1.5 h-1.5 bg-primary rounded-full" }),
+			/* @__PURE__ */ jsx("span", {
+				className: "text-sm font-medium whitespace-nowrap text-foreground",
+				children: title
+			}),
+			tag && /* @__PURE__ */ jsx("span", {
+				className: `text-[9px] px-2 py-0.5 tracking-wider uppercase font-medium ${tag === "Hot" ? "bg-primary text-white" : "bg-[hsl(var(--status-info))] text-white"}`,
+				children: tag
+			})
+		]
+	});
+}
+function CardD() {
+	return /* @__PURE__ */ jsxs("div", {
+		className: "group relative bg-card border border-border overflow-hidden transform-gpu md:col-span-2 transition-all duration-500 hover:border-primary/60",
+		children: [
+			/* @__PURE__ */ jsx(CornerMarkers, {}),
+			/* @__PURE__ */ jsx("div", { className: "absolute left-0 top-0 bottom-0 w-16 bg-gradient-to-r from-card to-transparent z-10 pointer-events-none" }),
+			/* @__PURE__ */ jsx("div", { className: "absolute right-0 top-0 bottom-0 w-16 bg-gradient-to-l from-card to-transparent z-10 pointer-events-none" }),
+			/* @__PURE__ */ jsxs("div", {
+				className: "absolute inset-0 flex flex-col justify-center",
+				children: [/* @__PURE__ */ jsx("div", {
+					className: "absolute top-4 left-4 z-20",
+					children: /* @__PURE__ */ jsx("span", {
+						className: "text-[10px] text-muted-foreground tracking-[0.2em] uppercase",
+						children: "AI Superpowers"
+					})
+				}), /* @__PURE__ */ jsx("div", {
+					className: "flex overflow-hidden py-4",
+					children: /* @__PURE__ */ jsxs("div", {
+						className: "flex gap-4 px-4 animate-marquee group-hover:[animation-play-state:paused]",
+						children: [AI_FEATURES.map((f) => /* @__PURE__ */ jsx(FeaturePill, { ...f }, f.title)), AI_FEATURES.map((f) => /* @__PURE__ */ jsx(FeaturePill, { ...f }, `dup-${f.title}`))]
+					})
+				})]
+			})
+		]
+	});
+}
+function CardE() {
+	const layers = [
+		{
+			name: "Apps",
+			packages: ["web", "server"],
+			radius: 95
+		},
+		{
+			name: "Infrastructure",
+			packages: [
+				"db",
+				"auth",
+				"infra"
+			],
+			radius: 75
+		},
+		{
+			name: "Adapters",
+			packages: ["api", "contracts"],
+			radius: 55
+		},
+		{
+			name: "Application",
+			packages: ["application"],
+			radius: 38
+		},
+		{
+			name: "Domain",
+			packages: ["domain"],
+			radius: 20
+		}
+	];
+	return /* @__PURE__ */ jsxs("div", {
+		className: "group relative bg-card border border-border overflow-hidden transform-gpu md:col-span-2 transition-all duration-500 hover:border-primary/60",
+		children: [
+			/* @__PURE__ */ jsx(CornerMarkers, {}),
+			/* @__PURE__ */ jsx(ScanLines, {}),
+			/* @__PURE__ */ jsx("div", {
+				className: "absolute top-4 left-4 z-20",
+				children: /* @__PURE__ */ jsx("span", {
+					className: "text-[10px] text-muted-foreground tracking-[0.2em] uppercase",
+					children: "Clean Architecture"
+				})
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				className: "absolute top-4 right-4 z-20 flex items-center gap-2",
+				children: [/* @__PURE__ */ jsx("span", {
+					className: "text-[8px] text-muted-foreground tracking-wider uppercase",
+					children: "deps flow in"
+				}), /* @__PURE__ */ jsx("svg", {
+					className: "w-3 h-3 text-primary animate-pulse",
+					viewBox: "0 0 24 24",
+					fill: "none",
+					stroke: "currentColor",
+					strokeWidth: 2,
+					children: /* @__PURE__ */ jsx("circle", {
+						cx: "12",
+						cy: "12",
+						r: "3",
+						fill: "currentColor"
+					})
+				})]
+			}),
+			/* @__PURE__ */ jsx("div", {
+				className: "absolute inset-0 flex items-center justify-center",
+				children: /* @__PURE__ */ jsxs("div", {
+					className: "relative w-48 h-48 md:w-56 md:h-56",
+					children: [
+						/* @__PURE__ */ jsx("div", {
+							className: "absolute inset-0 flex items-center justify-center",
+							children: [
+								0,
+								1,
+								2
+							].map((i) => /* @__PURE__ */ jsx("div", {
+								className: "absolute rounded-full border border-primary/20",
+								style: {
+									width: "100%",
+									height: "100%",
+									animation: `pulseIn 3s ease-in-out infinite`,
+									animationDelay: `${i * 1}s`
+								}
+							}, i))
+						}),
+						layers.map((layer, i) => /* @__PURE__ */ jsx("div", {
+							className: "absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 rounded-full border transition-all duration-300 group/layer flex items-center justify-center cursor-default",
+							style: {
+								width: `${layer.radius}%`,
+								height: `${layer.radius}%`,
+								borderColor: i === layers.length - 1 ? "hsl(var(--primary))" : `hsl(var(--primary) / ${.15 + i * .1})`,
+								backgroundColor: i === layers.length - 1 ? "hsl(var(--primary) / 0.15)" : `hsl(var(--primary) / ${.02 + i * .02})`
+							},
+							children: i === layers.length - 1 ? /* @__PURE__ */ jsx("span", {
+								className: "text-[9px] font-medium text-primary tracking-wide",
+								children: layer.name
+							}) : /* @__PURE__ */ jsx("span", {
+								className: "absolute text-[8px] text-muted-foreground/60 tracking-wide opacity-0 group-hover:opacity-100 transition-opacity whitespace-nowrap",
+								style: {
+									top: "2px",
+									left: "50%",
+									transform: "translateX(-50%)"
+								},
+								children: layer.name
+							})
+						}, layer.name)),
+						/* @__PURE__ */ jsx("div", { className: "absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 w-8 h-8 bg-primary/30 rounded-full blur-xl" })
+					]
+				})
+			}),
+			/* @__PURE__ */ jsx("div", {
+				className: "absolute right-4 top-1/2 -translate-y-1/2 space-y-1 opacity-0 group-hover:opacity-100 transition-opacity duration-300",
+				children: layers.slice().reverse().map((layer) => /* @__PURE__ */ jsxs("div", {
+					className: "flex items-center gap-2",
+					children: [/* @__PURE__ */ jsx("div", {
+						className: "w-2 h-2 rounded-full",
+						style: { backgroundColor: "hsl(var(--primary) / 0.5)" }
+					}), /* @__PURE__ */ jsx("code", {
+						className: "text-[8px] text-muted-foreground font-mono",
+						children: layer.packages.join(", ")
+					})]
+				}, layer.name))
+			})
+		]
+	});
+}
+function CardF() {
+	return /* @__PURE__ */ jsxs("div", {
+		className: "group relative bg-card border border-border overflow-hidden transform-gpu transition-all duration-500 hover:border-primary/60 hover:bg-primary/5",
+		children: [
+			/* @__PURE__ */ jsx(CornerMarkers, {}),
+			/* @__PURE__ */ jsx("div", {
+				className: "absolute inset-0 opacity-5",
+				children: /* @__PURE__ */ jsxs("svg", {
+					className: "w-full h-full",
+					viewBox: "0 0 100 100",
+					preserveAspectRatio: "none",
+					children: [
+						/* @__PURE__ */ jsx("circle", {
+							cx: "50",
+							cy: "50",
+							r: "40",
+							fill: "none",
+							stroke: "currentColor",
+							strokeWidth: "0.5"
+						}),
+						/* @__PURE__ */ jsx("circle", {
+							cx: "50",
+							cy: "50",
+							r: "25",
+							fill: "none",
+							stroke: "currentColor",
+							strokeWidth: "0.5"
+						}),
+						/* @__PURE__ */ jsx("line", {
+							x1: "0",
+							y1: "50",
+							x2: "100",
+							y2: "50",
+							stroke: "currentColor",
+							strokeWidth: "0.5"
+						}),
+						/* @__PURE__ */ jsx("line", {
+							x1: "50",
+							y1: "0",
+							x2: "50",
+							y2: "100",
+							stroke: "currentColor",
+							strokeWidth: "0.5"
+						})
+					]
+				})
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				className: "absolute inset-0 flex flex-col justify-center items-center p-6 text-center",
+				children: [
+					/* @__PURE__ */ jsxs("div", {
+						className: "relative mb-4 group-hover:scale-110 transition-transform duration-300",
+						children: [/* @__PURE__ */ jsx("svg", {
+							className: "w-10 h-10 text-primary",
+							fill: "none",
+							viewBox: "0 0 24 24",
+							stroke: "currentColor",
+							strokeWidth: 1.5,
+							children: /* @__PURE__ */ jsx("path", {
+								strokeLinecap: "round",
+								strokeLinejoin: "round",
+								d: "M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"
+							})
+						}), /* @__PURE__ */ jsx("div", { className: "absolute -inset-2 bg-primary/20 blur-lg -z-10 group-hover:bg-primary/30 transition-colors" })]
+					}),
+					/* @__PURE__ */ jsx("span", {
+						className: "text-sm font-mono text-primary tracking-wide",
+						children: "AGENTS.md"
+					}),
+					/* @__PURE__ */ jsx("span", {
+						className: "text-[10px] text-muted-foreground mt-1 tracking-wider uppercase",
+						children: "In every package"
+					})
+				]
+			})
+		]
+	});
+}
+function Features() {
+	return /* @__PURE__ */ jsxs("section", {
+		className: "relative border-t border-border overflow-hidden",
+		children: [/* @__PURE__ */ jsxs("div", {
+			className: "absolute inset-0 pointer-events-none",
+			children: [/* @__PURE__ */ jsx("div", { className: "absolute top-1/4 -left-1/4 w-1/2 h-1/2 bg-primary/5 rounded-full blur-[120px]" }), /* @__PURE__ */ jsx("div", { className: "absolute bottom-1/4 -right-1/4 w-1/2 h-1/2 bg-primary/5 rounded-full blur-[120px]" })]
+		}), /* @__PURE__ */ jsxs("div", {
+			className: "relative max-w-7xl mx-auto px-8 py-20 md:py-28",
+			children: [/* @__PURE__ */ jsxs("div", {
+				className: "mb-16 md:mb-20",
+				children: [
+					/* @__PURE__ */ jsxs("div", {
+						className: "flex items-center gap-4 mb-6",
+						children: [/* @__PURE__ */ jsx("div", { className: "h-px w-16 bg-gradient-to-r from-primary to-transparent" }), /* @__PURE__ */ jsx("span", {
+							className: "text-[11px] text-primary tracking-[0.3em] uppercase font-medium",
+							children: "Features"
+						})]
+					}),
+					/* @__PURE__ */ jsx("h2", {
+						className: "text-4xl md:text-5xl lg:text-6xl font-light text-foreground tracking-[-0.04em] mb-6",
+						children: "Everything You Need"
+					}),
+					/* @__PURE__ */ jsxs("p", {
+						className: "text-lg md:text-xl text-muted-foreground max-w-2xl leading-relaxed",
+						children: ["A complete foundation for building production-ready SaaS applications.", /* @__PURE__ */ jsx("span", {
+							className: "text-foreground",
+							children: " No assembly required."
+						})]
+					})
+				]
+			}), /* @__PURE__ */ jsxs("div", {
+				className: "grid grid-cols-1 md:grid-cols-3 auto-rows-[14rem] gap-4 md:gap-5",
+				children: [
+					/* @__PURE__ */ jsx(CardA, {}),
+					/* @__PURE__ */ jsx(CardB, { className: "md:row-span-2" }),
+					/* @__PURE__ */ jsx(CardC, { className: "md:row-span-2" }),
+					/* @__PURE__ */ jsx(CardD, {}),
+					/* @__PURE__ */ jsx(CardE, {}),
+					/* @__PURE__ */ jsx(CardF, {})
+				]
+			})]
+		})]
+	});
+}
+
+//#endregion
+export { Features };