{
	"$schema": "https://shadcn-svelte.com/schema/registry-item.json",
	"name": "hero-three",
	"type": "registry:block",
	"description": "Hero with background image and overlay",
	"devDependencies": [
		"@lucide/svelte"
	],
	"registryDependencies": [
		"button",
		"./marquee.json",
		"./progressive-blur.json",
		"./svgs.json"
	],
	"files": [
		{
			"content": "<script>\n\timport Button from \"$COMPONENTS$/ui/button/button.svelte\";\n\timport { Marquee } from \"$COMPONENTS$/magic/marquee\";\n\timport { ProgressiveBlur } from \"$COMPONENTS$/magic/progressive-blur\";\n\t// Hero Header Component\n\n\timport { cn } from \"$UTILS$\";\n\timport Menu from \"@lucide/svelte/icons/menu\";\n\timport X from \"@lucide/svelte/icons/x\";\n\timport { scrollY } from \"svelte/reactivity/window\";\n\timport Mail from \"@lucide/svelte/icons/mail\";\n\timport SendHorizonal from \"@lucide/svelte/icons/send-horizontal\";\n\n\tlet menuItems = [\n\t\t{ name: \"Features\", href: \"#a\" },\n\t\t{ name: \"Solution\", href: \"#a\" },\n\t\t{ name: \"Pricing\", href: \"#a\" },\n\t\t{ name: \"About\", href: \"#a\" },\n\t];\n\tlet menuState = $state(false);\n\tlet isScrolled = $derived.by(() => {\n\t\tif (scrollY.current !== undefined && scrollY.current > 50) {\n\t\t\treturn true;\n\t\t}\n\t\treturn false;\n\t});\n\n\timport {\n\t\tBeacon,\n\t\tBolt,\n\t\tCisco,\n\t\tClaude,\n\t\tFigma,\n\t\tFirebaseFull,\n\t\tHulu,\n\t\tSpotify,\n\t\tSupabaseFull,\n\t\tVercelFull,\n\t} from \"$LIB$/svgs\";\n</script>\n\n<div>\n\t<!-- Scroll below to see the snippet code  -->\n\t{@render heroheader()}\n\t<main\n\t\tclass=\"overflow-hidden [--color-primary-foreground:var(--color-white)] [--color-primary:var(--color-green-600)]\"\n\t>\n\t\t<section>\n\t\t\t<div class=\"relative mx-auto max-w-6xl px-6 pt-32 pb-20 lg:pt-48\">\n\t\t\t\t<div class=\"relative z-10 mx-auto max-w-4xl text-center\">\n\t\t\t\t\t<h1 class=\"text-5xl font-medium text-balance md:text-6xl\">\n\t\t\t\t\t\tHealthier daily routine\n\t\t\t\t\t</h1>\n\t\t\t\t\t<p class=\"mx-auto mt-6 max-w-2xl text-lg text-pretty\">\n\t\t\t\t\t\tTailwindcss highly customizable components for building modern websites and\n\t\t\t\t\t\tapplications that look and feel the way you mean it.\n\t\t\t\t\t</p>\n\n\t\t\t\t\t<div class=\"mt-12\">\n\t\t\t\t\t\t<form action=\"\" class=\"mx-auto max-w-sm\">\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tclass=\"relative grid grid-cols-[1fr_auto] items-center rounded-[calc(var(--radius)+0.5rem)] border bg-background pr-2 shadow shadow-zinc-950/5 has-[input:focus]:ring-2 has-[input:focus]:ring-muted\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<Mail\n\t\t\t\t\t\t\t\t\tclass=\"pointer-events-none absolute inset-y-0 left-4 my-auto size-4\"\n\t\t\t\t\t\t\t\t/>\n\n\t\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\t\tplaceholder=\"Your mail address\"\n\t\t\t\t\t\t\t\t\tclass=\"h-12 w-full bg-transparent pl-12 focus:outline-none\"\n\t\t\t\t\t\t\t\t\ttype=\"email\"\n\t\t\t\t\t\t\t\t/>\n\n\t\t\t\t\t\t\t\t<div class=\"md:pr-1.5 lg:pr-0\">\n\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\taria-label=\"submit\"\n\t\t\t\t\t\t\t\t\t\tsize=\"sm\"\n\t\t\t\t\t\t\t\t\t\tclass=\"rounded-(--radius)\"\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<span class=\"hidden md:block\">Get Started</span>\n\t\t\t\t\t\t\t\t\t\t<SendHorizonal\n\t\t\t\t\t\t\t\t\t\t\tclass=\"relative mx-auto size-5 md:hidden\"\n\t\t\t\t\t\t\t\t\t\t\tstrokeWidth={2}\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</form>\n\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\taria-hidden={true}\n\t\t\t\t\t\t\tclass=\"relative mx-auto mt-32 max-w-2xl bg-radial from-primary/50 to-transparent to-55% text-left dark:from-primary/25\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tclass=\"absolute inset-0 mx-auto w-80 -translate-x-3 -translate-y-12 rounded-4xl border border-border/50 bg-background mask-[linear-gradient(to_bottom,#000_50%,transparent_90%)] p-2 sm:-translate-x-6\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\tclass=\"relative h-96 overflow-hidden rounded-3xl border p-2 pb-12 before:absolute before:inset-0 before:bg-[repeating-linear-gradient(-45deg,var(--color-border),var(--color-border)_1px,transparent_1px,transparent_6px)] before:opacity-50\"\n\t\t\t\t\t\t\t\t></div>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tclass=\"mx-auto w-80 translate-x-4 rounded-4xl border border-border/50 bg-muted mask-[linear-gradient(to_bottom,#000_50%,transparent_90%)] p-2 backdrop-blur-3xl sm:translate-x-8 dark:bg-background/50\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\tclass=\"space-y-2 overflow-hidden rounded-3xl border bg-background p-2 shadow-xl dark:bg-white/5 dark:shadow-black dark:backdrop-blur-3xl\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<!-- App Component -->\n\t\t\t\t\t\t\t\t\t<div class=\"relative space-y-3 rounded-2xl bg-white/5 p-4\">\n\t\t\t\t\t\t\t\t\t\t<div class=\"flex items-center gap-1.5 text-orange-400\">\n\t\t\t\t\t\t\t\t\t\t\t<svg\n\t\t\t\t\t\t\t\t\t\t\t\tclass=\"size-5\"\n\t\t\t\t\t\t\t\t\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t\t\t\t\t\t\t\t\t\twidth=\"1em\"\n\t\t\t\t\t\t\t\t\t\t\t\theight=\"1em\"\n\t\t\t\t\t\t\t\t\t\t\t\tviewBox=\"0 0 32 32\"\n\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t<g fill=\"none\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<path\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tfill=\"#ff6723\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\td=\"M26 19.34c0 6.1-5.05 11.005-11.15 10.641c-6.269-.374-10.56-6.403-9.752-12.705c.489-3.833 2.286-7.12 4.242-9.67c.34-.445.689 3.136 1.038 2.742c.35-.405 3.594-6.019 4.722-7.991a.694.694 0 0 1 1.028-.213C18.394 3.854 26 10.277 26 19.34\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t></path>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<path\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tfill=\"#ffb02e\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\td=\"M23 21.851c0 4.042-3.519 7.291-7.799 7.144c-4.62-.156-7.788-4.384-7.11-8.739C9.07 14.012 15.48 10 15.48 10S23 14.707 23 21.851\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t></path>\n\t\t\t\t\t\t\t\t\t\t\t\t</g>\n\t\t\t\t\t\t\t\t\t\t\t</svg>\n\t\t\t\t\t\t\t\t\t\t\t<div class=\"text-sm font-medium\">Steps</div>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t<div class=\"space-y-3\">\n\t\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\t\tclass=\"border-b border-white/10 pb-3 text-sm font-medium text-foreground\"\n\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\tThis year, you're walking more on average than you\n\t\t\t\t\t\t\t\t\t\t\t\tdid in 2023.\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t<div class=\"space-y-3\">\n\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"space-y-1\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"space-x-1\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"align-baseline text-xl font-medium text-foreground\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t>8,081</span\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"text-xs text-muted-foreground\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t>Steps/day</span\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"flex h-5 items-center rounded bg-linear-to-l from-emerald-400 to-indigo-600 px-2 text-xs text-white\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t2024\n\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"space-y-1\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"space-x-1\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"align-baseline text-xl font-medium text-foreground\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t>5,412</span\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"text-xs text-muted-foreground\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t>Steps/day</span\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"flex h-5 w-2/3 items-center rounded bg-muted px-2 text-xs text-foreground dark:bg-white/20\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t2023\n\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t<!-- App Component End -->\n\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\tclass=\"rounded-2xl bg-muted p-4 pb-16 dark:bg-white/5\"\n\t\t\t\t\t\t\t\t\t></div>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tclass=\"absolute inset-0 bg-[radial-gradient(#e5e7eb_1px,transparent_1px)] mask-[radial-gradient(ellipse_50%_50%_at_50%_50%,#000_70%,transparent_100%)] bg-size-[16px_16px] mix-blend-overlay dark:opacity-5\"\n\t\t\t\t\t\t\t></div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</section>\n\t\t<!-- <LogoCloud /> -->\n\t\t<section class=\"bg-background pb-16 md:pb-32\">\n\t\t\t<div class=\"group relative m-auto max-w-6xl px-6\">\n\t\t\t\t<div class=\"flex flex-col items-center md:flex-row\">\n\t\t\t\t\t<div class=\"inline md:max-w-44 md:border-r md:pr-6\">\n\t\t\t\t\t\t<p class=\"text-end text-sm\">Powering the best teams</p>\n\t\t\t\t\t</div>\n\t\t\t\t\t<div class=\"relative py-6 **:fill-foreground md:w-[calc(100%-11rem)]\">\n\t\t\t\t\t\t<Marquee>\n\t\t\t\t\t\t\t<Bolt height={22} width={56} />\n\t\t\t\t\t\t\t<VercelFull height={22} width={84} />\n\t\t\t\t\t\t\t<SupabaseFull class=\"h-6\" />\n\t\t\t\t\t\t\t<Hulu height={18} width={56} />\n\t\t\t\t\t\t\t<Spotify height={24} width={80} />\n\t\t\t\t\t\t\t<FirebaseFull height={24} width={80} />\n\t\t\t\t\t\t\t<Beacon height={24} width={80} />\n\t\t\t\t\t\t\t<Claude height={26} width={90} />\n\t\t\t\t\t\t\t<Figma height={24} width={24} />\n\t\t\t\t\t\t\t<Cisco height={30} width={60} />\n\t\t\t\t\t\t</Marquee>\n\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\taria-hidden={true}\n\t\t\t\t\t\t\tclass=\"absolute inset-y-0 left-0 w-20 bg-linear-to-r from-background\"\n\t\t\t\t\t\t></div>\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\taria-hidden={true}\n\t\t\t\t\t\t\tclass=\"absolute inset-y-0 right-0 w-20 bg-linear-to-l from-background\"\n\t\t\t\t\t\t></div>\n\t\t\t\t\t\t<ProgressiveBlur\n\t\t\t\t\t\t\tclass=\"pointer-events-none absolute top-0 left-0 h-full w-20\"\n\t\t\t\t\t\t\tdirection=\"left\"\n\t\t\t\t\t\t\tblurIntensity={1}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<ProgressiveBlur\n\t\t\t\t\t\t\tclass=\"pointer-events-none absolute top-0 right-0 h-full w-20\"\n\t\t\t\t\t\t\tdirection=\"right\"\n\t\t\t\t\t\t\tblurIntensity={1}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</section>\n\t</main>\n</div>\n\n{#snippet heroheader()}\n\t<header>\n\t\t<nav class=\"fixed z-20 w-full px-2\">\n\t\t\t<div\n\t\t\t\tclass={[\n\t\t\t\t\t\"mx-auto mt-2 max-w-6xl rounded-2xl px-6 transition-all duration-300 lg:px-12\",\n\t\t\t\t\tisScrolled &&\n\t\t\t\t\t\t\"max-w-4xl rounded-2xl border bg-background/50 backdrop-blur-lg lg:px-5\",\n\t\t\t\t]}\n\t\t\t>\n\t\t\t\t<div\n\t\t\t\t\tclass=\"relative flex flex-wrap items-center justify-between gap-6 py-3 lg:gap-0 lg:py-4\"\n\t\t\t\t>\n\t\t\t\t\t<div class=\"flex w-full justify-between lg:w-auto\">\n\t\t\t\t\t\t<a href=\"/\" aria-label=\"home\" class=\"flex items-center space-x-2\">\n\t\t\t\t\t\t\t<svg\n\t\t\t\t\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t\t\t\t\t\twidth=\"22\"\n\t\t\t\t\t\t\t\theight=\"22\"\n\t\t\t\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\t\t\t\tfill=\"none\"\n\t\t\t\t\t\t\t\trole=\"img\"\n\t\t\t\t\t\t\t\tcolor=\"currentColor\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<path\n\t\t\t\t\t\t\t\t\td=\"M22 18C22 19.4001 22 20.1002 21.7275 20.635C21.4878 21.1054 21.1054 21.4878 20.635 21.7275C20.1002 22 19.4001 22 18 22C16.5999 22 15.8998 22 15.365 21.7275C14.8946 21.4878 14.5122 21.1054 14.2725 20.635C14 20.1002 14 19.4001 14 18C14 16.5999 14 15.8998 14.2725 15.365C14.5122 14.8946 14.8946 14.5122 15.365 14.2725C15.8998 14 16.5999 14 18 14C19.4001 14 20.1002 14 20.635 14.2725C21.1054 14.5122 21.4878 14.8946 21.7275 15.365C22 15.8998 22 16.5999 22 18Z\"\n\t\t\t\t\t\t\t\t\tstroke=\"currentColor\"\n\t\t\t\t\t\t\t\t\tstroke-width=\"1.5\"\n\t\t\t\t\t\t\t\t></path>\n\t\t\t\t\t\t\t\t<path\n\t\t\t\t\t\t\t\t\td=\"M22 10C22 11.4001 22 12.1002 21.7275 12.635C21.4878 13.1054 21.1054 13.4878 20.635 13.7275C20.1002 14 19.4001 14 18 14C16.5999 14 15.8998 14 15.365 13.7275C14.8946 13.4878 14.5122 13.1054 14.2725 12.635C14 12.1002 14 11.4001 14 10C14 8.59987 14 7.8998 14.2725 7.36502C14.5122 6.89462 14.8946 6.51217 15.365 6.27248C15.8998 6 16.5999 6 18 6C19.4001 6 20.1002 6 20.635 6.27248C21.1054 6.51217 21.4878 6.89462 21.7275 7.36502C22 7.8998 22 8.59987 22 10Z\"\n\t\t\t\t\t\t\t\t\tstroke=\"currentColor\"\n\t\t\t\t\t\t\t\t\tstroke-width=\"1.5\"\n\t\t\t\t\t\t\t\t></path>\n\t\t\t\t\t\t\t\t<path\n\t\t\t\t\t\t\t\t\td=\"M14 18C14 19.4001 14 20.1002 13.7275 20.635C13.4878 21.1054 13.1054 21.4878 12.635 21.7275C12.1002 22 11.4001 22 10 22C8.59987 22 7.8998 22 7.36502 21.7275C6.89462 21.4878 6.51217 21.1054 6.27248 20.635C6 20.1002 6 19.4001 6 18C6 16.5999 6 15.8998 6.27248 15.365C6.51217 14.8946 6.89462 14.5122 7.36502 14.2725C7.8998 14 8.59987 14 10 14C11.4001 14 12.1002 14 12.635 14.2725C13.1054 14.5122 13.4878 14.8946 13.7275 15.365C14 15.8998 14 16.5999 14 18Z\"\n\t\t\t\t\t\t\t\t\tstroke=\"currentColor\"\n\t\t\t\t\t\t\t\t\tstroke-width=\"1.5\"\n\t\t\t\t\t\t\t\t></path>\n\t\t\t\t\t\t\t\t<path\n\t\t\t\t\t\t\t\t\topacity=\"0.4\"\n\t\t\t\t\t\t\t\t\td=\"M10 6C10 7.40013 10 8.1002 9.72752 8.63497C9.48783 9.10538 9.10538 9.48783 8.63498 9.72752C8.1002 10 7.40013 10 6 10C4.59987 10 3.8998 10 3.36502 9.72751C2.89462 9.48783 2.51217 9.10538 2.27248 8.63497C2 8.10019 2 7.40013 2 6C2 4.59987 2 3.8998 2.27248 3.36502C2.51217 2.89462 2.89462 2.51217 3.36502 2.27248C3.8998 2 4.59987 2 6 2C7.40013 2 8.1002 2 8.63498 2.27248C9.10538 2.51217 9.48783 2.89462 9.72752 3.36502C10 3.8998 10 4.59987 10 6Z\"\n\t\t\t\t\t\t\t\t\tstroke=\"currentColor\"\n\t\t\t\t\t\t\t\t\tstroke-width=\"1.5\"\n\t\t\t\t\t\t\t\t></path>\n\t\t\t\t\t\t\t</svg>\n\t\t\t\t\t\t</a>\n\n\t\t\t\t\t\t<button\n\t\t\t\t\t\t\tonclick={() => (menuState = !menuState)}\n\t\t\t\t\t\t\taria-label={menuState == true ? \"Close Menu\" : \"Open Menu\"}\n\t\t\t\t\t\t\tclass=\"relative z-20 -m-2.5 -mr-4 block cursor-pointer p-2.5 lg:hidden\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Menu\n\t\t\t\t\t\t\t\tclass={[\n\t\t\t\t\t\t\t\t\t\"m-auto size-6 duration-200\",\n\t\t\t\t\t\t\t\t\tmenuState && \"scale-0 rotate-180 opacity-0\",\n\t\t\t\t\t\t\t\t]}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t<X\n\t\t\t\t\t\t\t\tclass={[\n\t\t\t\t\t\t\t\t\t\"absolute inset-0 m-auto size-6 scale-0 -rotate-180 opacity-0 duration-200\",\n\t\t\t\t\t\t\t\t\tmenuState && \"scale-100 rotate-0 opacity-100\",\n\t\t\t\t\t\t\t\t]}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</button>\n\t\t\t\t\t</div>\n\n\t\t\t\t\t<div class=\"absolute inset-0 m-auto hidden size-fit lg:block\">\n\t\t\t\t\t\t<ul class=\"flex gap-8 text-sm\">\n\t\t\t\t\t\t\t{#each menuItems as item, index}\n\t\t\t\t\t\t\t\t<li>\n\t\t\t\t\t\t\t\t\t<a\n\t\t\t\t\t\t\t\t\t\thref={item.href}\n\t\t\t\t\t\t\t\t\t\tclass=\"block text-muted-foreground duration-150 hover:text-accent-foreground\"\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<span>{item.name}</span>\n\t\t\t\t\t\t\t\t\t</a>\n\t\t\t\t\t\t\t\t</li>\n\t\t\t\t\t\t\t{/each}\n\t\t\t\t\t\t</ul>\n\t\t\t\t\t</div>\n\t\t\t\t\t<div\n\t\t\t\t\t\tclass={[\n\t\t\t\t\t\t\t\"mb-6 w-full  flex-wrap items-center justify-end space-y-8 rounded-3xl border bg-background p-6 shadow-2xl shadow-zinc-300/20 md:flex-nowrap lg:m-0 lg:flex lg:w-fit lg:gap-6 lg:space-y-0 lg:border-transparent lg:bg-transparent lg:p-0 lg:shadow-none dark:shadow-none dark:lg:bg-transparent\",\n\t\t\t\t\t\t\tmenuState ? \"block lg:flex\" : \"hidden lg:flex\",\n\t\t\t\t\t\t]}\n\t\t\t\t\t>\n\t\t\t\t\t\t<div class=\"lg:hidden\">\n\t\t\t\t\t\t\t<ul class=\"space-y-6 text-base\">\n\t\t\t\t\t\t\t\t{#each menuItems as item, index}\n\t\t\t\t\t\t\t\t\t<li>\n\t\t\t\t\t\t\t\t\t\t<a\n\t\t\t\t\t\t\t\t\t\t\thref={item.href}\n\t\t\t\t\t\t\t\t\t\t\tclass=\"block text-muted-foreground duration-150 hover:text-accent-foreground\"\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t<span>{item.name}</span>\n\t\t\t\t\t\t\t\t\t\t</a>\n\t\t\t\t\t\t\t\t\t</li>\n\t\t\t\t\t\t\t\t{/each}\n\t\t\t\t\t\t\t</ul>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tclass=\"flex w-full flex-col space-y-3 sm:flex-row sm:gap-3 sm:space-y-0 md:w-fit\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tvariant=\"outline\"\n\t\t\t\t\t\t\t\tsize=\"sm\"\n\t\t\t\t\t\t\t\tclass={cn(isScrolled && \"lg:hidden\")}\n\t\t\t\t\t\t\t\thref=\"/\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\tLogin\n\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t<Button href=\"/\" size=\"sm\" class={cn(isScrolled && \"lg:hidden\")}\n\t\t\t\t\t\t\t\t>Sign Up</Button\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tsize=\"sm\"\n\t\t\t\t\t\t\t\thref=\"/\"\n\t\t\t\t\t\t\t\tclass={cn(isScrolled ? \"lg:inline-flex\" : \"hidden\")}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\tGet Strated\n\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</nav>\n\t</header>\n{/snippet}\n",
			"type": "registry:component",
			"target": "blocks/hero/hero-three.svelte"
		}
	]
}