{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "hero-07",
  "title": "Hero 07",
  "description": "An editorial hero with a full-width image above, a top-aligned tagline, and right-aligned headline and copy below.",
  "dependencies": [
    "react-wrap-balancer"
  ],
  "registryDependencies": [],
  "files": [
    {
      "path": "registry/blocks/hero/hero-07/hero-07.tsx",
      "content": "import Balancer from 'react-wrap-balancer'\n\nexport function Hero07() {\n  return (\n    <section className=\"bg-background relative isolate w-full overflow-hidden\">\n      <div className=\"relative w-full overflow-hidden\">\n        <div className=\"relative overflow-hidden rounded-t-sm mask-b-from-80% mask-b-to-95%\">\n          <div\n            aria-hidden\n            className=\"bg-background/15 dark:bg-background/30 pointer-events-none absolute inset-0 z-10 mix-blend-overlay\"\n          />\n          <img\n            src=\"https://images.unsplash.com/photo-1578301978018-3005759f48f7?q=80&w=1144&auto=format&fit=crop\"\n            alt=\"Alt\"\n            decoding=\"async\"\n            className=\"aspect-[2/1] w-full object-cover object-center outline outline-black/10 sm:aspect-[9/4] dark:outline-white/10 dark:brightness-[0.97] dark:saturate-[0.92]\"\n          />\n        </div>\n      </div>\n\n      <div className=\"relative z-10 mx-auto grid max-w-7xl grid-cols-1 gap-10 px-6 pt-10 pb-20 sm:pt-12 sm:pb-28 lg:grid-cols-12 lg:pb-32\">\n        <div className=\"flex lg:col-span-4 lg:col-start-1 lg:items-start lg:self-stretch\">\n          <p className=\"text-muted-foreground max-w-xs text-sm leading-relaxed tracking-tight sm:text-base\">\n            <Balancer>\n              Architecture, interiors, and spaces built to last\n            </Balancer>\n          </p>\n        </div>\n\n        <div className=\"flex flex-col items-start gap-6 sm:gap-8 lg:col-span-6 lg:col-start-7\">\n          <h1 className=\"text-foreground font-serif text-3xl font-normal tracking-tight text-balance sm:text-4xl md:text-5xl\">\n            <Balancer>\n              Design-led homes for people who care how a place feels.\n            </Balancer>\n          </h1>\n          <p className=\"text-muted-foreground max-w-xl text-sm leading-relaxed sm:text-base\">\n            <Balancer>\n              From first sketch to final detail, we shape residential projects\n              that balance light, material, and daily life. Thoughtful planning,\n              refined finishes, and a calm build process.\n            </Balancer>\n          </p>\n        </div>\n      </div>\n    </section>\n  )\n}\n",
      "type": "registry:component",
      "target": "components/flx/blocks/hero/hero-07.tsx"
    }
  ],
  "meta": {
    "iframeHeight": 1100
  },
  "type": "registry:block"
}