{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "creative-portfolio-01",
  "title": "Creative Portfolio",
  "description": "A bold studio portfolio with selected work, profile, process, inquiry form and footer.",
  "dependencies": [
    "lucide-react"
  ],
  "registryDependencies": [
    "@rivelle/utils",
    "@rivelle/badge",
    "@rivelle/button",
    "@rivelle/site-header-01",
    "@rivelle/profile-card-01",
    "@rivelle/contact-form-01",
    "@rivelle/footer-01"
  ],
  "files": [
    {
      "path": "registry/nova/templates/creative-portfolio-01.tsx",
      "content": "import * as React from \"react\";\nimport {\n  ArrowDownRight,\n  ArrowRight,\n  ArrowUpRight,\n  Asterisk,\n  Circle,\n  Plus,\n  Sparkles,\n} from \"lucide-react\";\n\nimport { ContactForm01 } from \"@/components/blocks/contact-form-01\";\nimport { Footer01 } from \"@/components/blocks/footer-01\";\nimport { ProfileCard01 } from \"@/components/blocks/profile-card-01\";\nimport { SiteHeader01 } from \"@/components/blocks/site-header-01\";\nimport { Badge } from \"@/components/ui/badge\";\nimport { Button } from \"@/components/ui/button\";\nimport { cn } from \"@/lib/utils\";\n\nconst projects = [\n  {\n    number: \"01\",\n    title: \"Morrow Health\",\n    type: \"Brand system · Product\",\n    tone: \"from-violet-500/35 via-fuchsia-400/15 to-transparent\",\n    shape: \"rounded-full\",\n  },\n  {\n    number: \"02\",\n    title: \"Field Notes\",\n    type: \"Editorial · Commerce\",\n    tone: \"from-amber-400/35 via-orange-400/15 to-transparent\",\n    shape: \"rounded-[2rem] rotate-12\",\n  },\n  {\n    number: \"03\",\n    title: \"Common Ground\",\n    type: \"Strategy · Digital\",\n    tone: \"from-cyan-400/30 via-blue-500/15 to-transparent\",\n    shape: \"rounded-full scale-x-150\",\n  },\n];\n\nfunction CreativePortfolio01({\n  className,\n  ...props\n}: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      className={cn(\"min-h-screen bg-background text-foreground\", className)}\n      data-slot=\"creative-portfolio-template\"\n      {...props}\n    >\n      <SiteHeader01\n        brand=\"Atelier 17\"\n        ctaHref=\"#contact\"\n        ctaLabel=\"Start a project\"\n        links={[\n          { label: \"Work\", href: \"#work\" },\n          { label: \"Services\", href: \"#services\" },\n          { label: \"About\", href: \"#about\" },\n          { label: \"Contact\", href: \"#contact\" },\n        ]}\n        profileEmail=\"hello@atelier17.studio\"\n        profileName=\"Avery Lane\"\n      />\n      <main>\n        <section\n          className=\"relative overflow-hidden px-5 pb-20 pt-20 sm:px-8 sm:pb-28 sm:pt-28\"\n          id=\"top\"\n        >\n          <div className=\"absolute right-[-10%] top-[-20%] -z-10 size-[560px] rounded-full bg-primary/12 blur-[110px]\" />\n          <div className=\"mx-auto max-w-7xl\">\n            <div className=\"grid gap-12 lg:grid-cols-[1.35fr_.65fr] lg:items-end\">\n              <div>\n                <p className=\"flex items-center gap-2 text-xs font-semibold uppercase tracking-[.16em] text-muted-foreground\">\n                  <Asterisk className=\"size-4 text-primary\" /> Independent\n                  creative practice\n                </p>\n                <h1 className=\"mt-8 max-w-5xl text-balance text-6xl font-semibold leading-[.9] tracking-[-.075em] sm:text-8xl lg:text-[7.4rem]\">\n                  Clear ideas.\n                  <br />\n                  <span className=\"font-normal italic text-primary\">\n                    Unexpected\n                  </span>{\" \"}\n                  form.\n                </h1>\n              </div>\n              <div className=\"lg:pb-3\">\n                <p className=\"max-w-md text-base leading-relaxed text-muted-foreground\">\n                  We shape identities and digital products for people building a\n                  more interesting future.\n                </p>\n                <Button className=\"mt-7\" size=\"lg\">\n                  Explore selected work <ArrowDownRight />\n                </Button>\n              </div>\n            </div>\n            <div className=\"mt-16 grid gap-4 border-y border-foreground/10 py-5 text-xs font-semibold uppercase tracking-[.12em] text-muted-foreground sm:grid-cols-3\">\n              <span>Strategy · Identity · Digital</span>\n              <span className=\"sm:text-center\">Copenhagen / Worldwide</span>\n              <span className=\"sm:text-right\">Selected work 2024—2026</span>\n            </div>\n          </div>\n        </section>\n        <section className=\"px-5 py-20 sm:px-8 sm:py-28\" id=\"work\">\n          <div className=\"mx-auto max-w-7xl\">\n            <div className=\"flex items-end justify-between gap-6\">\n              <div>\n                <Badge variant=\"outline\">\n                  <Sparkles /> Selected work\n                </Badge>\n                <h2 className=\"mt-5 text-4xl font-semibold tracking-[-.05em] sm:text-6xl\">\n                  Three recent collaborations.\n                </h2>\n              </div>\n              <Button className=\"hidden sm:inline-flex\" variant=\"ghost\">\n                View archive <ArrowRight />\n              </Button>\n            </div>\n            <div className=\"mt-12 space-y-5\">\n              {projects.map((project) => (\n                <article\n                  className=\"group grid min-h-[440px] overflow-hidden rounded-[2rem] border border-foreground/10 bg-foreground text-background md:grid-cols-[.42fr_.58fr]\"\n                  key={project.title}\n                >\n                  <div className=\"flex flex-col p-7 sm:p-10\">\n                    <div className=\"flex items-center justify-between\">\n                      <span className=\"text-xs font-semibold text-background/50\">\n                        {project.number}\n                      </span>\n                      <Button\n                        className=\"border-background/15 bg-background/10 text-background hover:bg-background/20\"\n                        size=\"icon\"\n                        variant=\"outline\"\n                      >\n                        <ArrowUpRight />\n                      </Button>\n                    </div>\n                    <div className=\"mt-auto\">\n                      <p className=\"text-xs font-semibold uppercase tracking-[.12em] text-background/50\">\n                        {project.type}\n                      </p>\n                      <h3 className=\"mt-3 text-4xl font-semibold tracking-[-.05em] sm:text-5xl\">\n                        {project.title}\n                      </h3>\n                    </div>\n                  </div>\n                  <div\n                    className={cn(\n                      \"relative min-h-72 overflow-hidden bg-gradient-to-br\",\n                      project.tone,\n                    )}\n                  >\n                    <div className=\"absolute inset-8 grid place-items-center rounded-[1.5rem] border border-background/15 bg-background/[.055]\">\n                      <div\n                        className={cn(\n                          \"size-40 border border-background/30 bg-background/10 backdrop-blur-md transition-transform duration-500 group-hover:scale-110 group-hover:rotate-6\",\n                          project.shape,\n                        )}\n                      />\n                      <Circle className=\"absolute size-10 text-background/70\" />\n                      <Plus className=\"absolute bottom-8 right-8 size-5 text-background/50\" />\n                    </div>\n                  </div>\n                </article>\n              ))}\n            </div>\n          </div>\n        </section>\n        <section className=\"px-5 py-20 sm:px-8 sm:py-28\" id=\"about\">\n          <div className=\"mx-auto grid max-w-7xl gap-10 lg:grid-cols-[.72fr_1.28fr]\">\n            <ProfileCard01 />\n            <div className=\"rounded-[2rem] border border-foreground/10 bg-muted/35 p-7 sm:p-10\">\n              <p className=\"text-xs font-semibold uppercase tracking-[.14em] text-primary\">\n                How we work\n              </p>\n              <h2 className=\"mt-5 max-w-3xl text-balance text-4xl font-semibold tracking-[-.05em] sm:text-6xl\">\n                Small senior teams, close collaboration, no theatre.\n              </h2>\n              <div className=\"mt-12 grid gap-6 sm:grid-cols-3\">\n                {[\n                  [\n                    \"01\",\n                    \"Find the signal\",\n                    \"Research and a sharp shared brief.\",\n                  ],\n                  [\n                    \"02\",\n                    \"Make the system\",\n                    \"A coherent idea across every touchpoint.\",\n                  ],\n                  [\n                    \"03\",\n                    \"Ship with care\",\n                    \"Detailed delivery that survives reality.\",\n                  ],\n                ].map(([number, title, text]) => (\n                  <div\n                    className=\"border-t border-foreground/12 pt-5\"\n                    key={number}\n                  >\n                    <span className=\"text-xs font-semibold text-primary\">\n                      {number}\n                    </span>\n                    <h3 className=\"mt-5 font-semibold\">{title}</h3>\n                    <p className=\"mt-2 text-sm leading-relaxed text-muted-foreground\">\n                      {text}\n                    </p>\n                  </div>\n                ))}\n              </div>\n            </div>\n          </div>\n        </section>\n        <ContactForm01\n          description=\"Tell us where the work is today, what should change and why it matters. We’ll reply with a focused first thought.\"\n          email=\"hello@atelier17.studio\"\n          eyebrow=\"Start a conversation\"\n          heading=\"Have a project with a point of view?\"\n          responseNote=\"Replies within two working days\"\n          submitLabel=\"Share the brief\"\n        />\n      </main>\n      <Footer01\n        brand=\"Atelier 17\"\n        description=\"Independent strategy, identity and digital product design for ambitious organizations.\"\n        groups={[\n          { title: \"Work\", links: [\"Selected projects\", \"Archive\", \"Process\"] },\n          { title: \"Studio\", links: [\"About\", \"Services\", \"Journal\"] },\n          {\n            title: \"Connect\",\n            links: [\"Start a project\", \"Email\", \"Instagram\"],\n          },\n        ]}\n        newsletterPlaceholder=\"Email for studio notes\"\n      />\n    </div>\n  );\n}\n\nexport { CreativePortfolio01 };\n",
      "type": "registry:page",
      "target": "@templates/creative-portfolio-01.tsx"
    }
  ],
  "type": "registry:page"
}