{"$schema":"https://ui.shadcn.com/schema/registry-item.json","name":"portfolio-portfolio-mission-and-values-grid-of-core-values","type":"registry:block","title":"Grid Of Core Values","files":[{"path":"components/blocks/portfolio/portfolio-mission-and-values/grid-of-core-values.tsx","content":"import {\n  HeartHandshake,\n  Lightbulb,\n  Shield,\n  Users,\n  Target,\n  RefreshCw,\n  PackageOpen,\n  Sparkles,\n  Globe,\n} from \"lucide-react\";\n\nexport default function MissionAndValuesGrid() {\n  const values = [\n    {\n      title: \"Innovation\",\n      description:\n        \"We continuously challenge assumptions and explore new possibilities.\",\n      icon: <Lightbulb className=\"h-6 w-6\" />,\n    },\n    {\n      title: \"Integrity\",\n      description:\n        \"We operate with honesty, transparency, and ethical responsibility.\",\n      icon: <Shield className=\"h-6 w-6\" />,\n    },\n    {\n      title: \"Collaboration\",\n      description:\n        \"We bring diverse perspectives together to achieve extraordinary results.\",\n      icon: <Users className=\"h-6 w-6\" />,\n    },\n    {\n      title: \"Excellence\",\n      description: \"We strive for outstanding quality in everything we create.\",\n      icon: <Sparkles className=\"h-6 w-6\" />,\n    },\n    {\n      title: \"Adaptability\",\n      description: \"We embrace change and evolve to meet new challenges.\",\n      icon: <RefreshCw className=\"h-6 w-6\" />,\n    },\n    {\n      title: \"Empathy\",\n      description:\n        \"We design with a deep understanding of human needs and experiences.\",\n      icon: <HeartHandshake className=\"h-6 w-6\" />,\n    },\n    {\n      title: \"Purpose\",\n      description: \"We focus on creating meaningful impact that matters.\",\n      icon: <Target className=\"h-6 w-6\" />,\n    },\n    {\n      title: \"Transparency\",\n      description:\n        \"We communicate openly and honestly with clients and team members.\",\n      icon: <PackageOpen className=\"h-6 w-6\" />,\n    },\n    {\n      title: \"Sustainability\",\n      description:\n        \"We consider long-term environmental and social impact in our work.\",\n      icon: <Globe className=\"h-6 w-6\" />,\n    },\n  ];\n\n  return (\n    <section className=\"py-16 md:py-24\">\n      <div className=\"container mx-auto px-4 md:px-6 2xl:max-w-[1400px]\">\n        {/* Header */}\n        <div className=\"mb-16 text-center\">\n          <h2 className=\"mb-4 text-3xl font-bold tracking-tight sm:text-4xl md:text-5xl\">\n            Our Core Values\n          </h2>\n          <p className=\"text-muted-foreground mx-auto max-w-3xl text-lg\">\n            These principles guide our decisions, shape our culture, and define\n            how we collaborate with our clients.\n          </p>\n        </div>\n\n        {/* Values Grid */}\n        <div className=\"grid gap-6 sm:grid-cols-2 md:grid-cols-3\">\n          {values.map((value, index) => (\n            <div\n              key={index}\n              className=\"bg-card flex flex-col rounded-lg border p-6 shadow-sm transition-all hover:shadow-md\"\n            >\n              <div className=\"bg-primary/10 text-primary mb-4 flex h-12 w-12 items-center justify-center rounded-md\">\n                {value.icon}\n              </div>\n              <h3 className=\"mb-2 text-xl font-semibold\">{value.title}</h3>\n              <p className=\"text-muted-foreground\">{value.description}</p>\n            </div>\n          ))}\n        </div>\n      </div>\n    </section>\n  );\n}\n","type":"registry:component","target":"components/blocks/portfolio/portfolio-mission-and-values/grid-of-core-values.tsx"}],"description":"A grid of cards, each naming one core value with an icon and a short line of detail. Use it to lay out the principles behind your work at a glance.","dependencies":["lucide-react"]}