@vadimcomanescu/nadicode-design-system 4.0.1 → 4.0.2

package/.agents/skills/seed/intent-map.md

@@ -1,320 +0,0 @@
-# Intent Map
-
-THE lookup table for "what components do I use for X?" Every page in a consumer app must map to one of these 20 intents. If your page does not match any intent, stop and report it.
-
-For each intent: **Required** components must be present, **Allowed** may be used, **Forbidden** must never appear. **Blocks** are pre-composed sections. **States** are the UI states the page must handle.
-
----
-
-### marketing-landing
-
-| Classification | Values |
-|----------------|--------|
-| Routes | `/`, `/landing` |
-| Shell | marketing-shell |
-| Required | HeaderBlock, FooterBlock, Button, Badge, Typography, ScrollFadeIn |
-| Allowed | HeroBlock, HeroSectionBlock, FeatureBlock, FeatureGridBlock, FAQBlock, CallToActionBlock, TestimonialsBlock, LogoCloud, StatsMarketingBlock, SocialProofBlock, ComparisonBlock, BannerBlock, AnnouncementBanner, InfiniteSlider, AnimatedGradientText, CountingNumber, PricingBlock, BentoGrid, ShaderBackground, Card, Separator |
-| Forbidden | Sidebar, DataTable, Form, FormWizard, AgentTeamPanel, AgentTerminal, SettingsLayout |
-| Blocks | HeroBlock, HeroSectionBlock, FeatureBlock, FeatureGridBlock, FAQBlock, CallToActionBlock, TestimonialsBlock, LogoCloud, StatsMarketingBlock, SocialProofBlock, ComparisonBlock, BannerBlock, HeaderBlock, FooterBlock, NewsletterBlock |
-| States | default, mobile-navigation |
-| Recipe | `recipes/marketing-landing.md` |
-
----
-
-### dashboard
-
-| Classification | Values |
-|----------------|--------|
-| Routes | `/dashboard` |
-| Shell | app-shell |
-| Required | MetricCard, ChartCard, Card, Badge, Typography, Breadcrumb, Button, Skeleton, Empty, StaggerChildren |
-| Allowed | Sparkline, TrendIndicator, SlidingNumber, CountingNumber, ProgressRing, DataFreshness, AreaChart, BarChart, LineChart, PieChart, HeatmapChart, AgentMetricsCard, Tabs, Select, Progress, Timeline, DateRangePicker, DataTable, Tooltip, ScrollFadeIn, StatusDot |
-| Forbidden | HeroBlock, PricingBlock, FormWizard, AuthLayout, TextReveal, AnimatedGradientText, AuroraEffect, MeteorShower |
-| Blocks | StatsBlock, ChartBlock, ChartCollectionBlock, ActivityFeedBlock, BarChartBlock, InteractiveAreaChartBlock |
-| States | loading, empty, has-data, error |
-| Recipe | `recipes/dashboard.md` |
-
----
-
-### crud-list-detail
-
-| Classification | Values |
-|----------------|--------|
-| Routes | `/[entity]`, `/[entity]/[id]` |
-| Shell | app-shell |
-| Required | DataTable, Pagination, Input, Select, Button, Badge, Card, Sheet, AlertDialog, Typography, Breadcrumb, Skeleton, Empty |
-| Allowed | Table, Dialog, Tabs, DropdownMenu, ContextMenu, Tooltip, Checkbox |
-| Forbidden | HeroBlock, PricingBlock, FormWizard, AreaChart, BarChart, AuroraEffect, TextReveal |
-| Blocks | DataGridBlock, DirectoryBlock |
-| States | loading, empty, has-data, error, filtering |
-| Recipe | `recipes/crud-list-detail.md` |
-
----
-
-### kanban-board
-
-| Classification | Values |
-|----------------|--------|
-| Routes | `/runs`, `/board`, `/pipeline`, `/[entity]/board` |
-| Shell | app-shell |
-| Required | KanbanBoard, KanbanColumn, KanbanColumnHeader, KanbanItem, KanbanHandle, Badge, Typography, Empty, Button |
-| Allowed | Avatar, StatusDot, Tooltip, DropdownMenu, Sheet, Dialog, Skeleton, Tabs, Select, Input |
-| Forbidden | DataTable, HeroBlock, PricingBlock, FormWizard, AreaChart, AuroraEffect, AgentTeamPanel |
-| Blocks | KanbanDemoBlock |
-| States | loading, empty, has-data, error, dragging |
-| Recipe | See SKILL.md "Kanban Board" section |
-
----
-
-### crud-form
-
-| Classification | Values |
-|----------------|--------|
-| Routes | `/[entity]/new`, `/[entity]/[id]/edit` |
-| Shell | app-shell |
-| Required | Form, FormField, FormItem, FormLabel, FormControl, FormMessage, Input, Button, Card, Typography, Breadcrumb, AlertDialog, Alert, Spinner, Skeleton |
-| Allowed | Field, Label, Textarea, Select, Switch, Checkbox, DatePicker, Combobox, TagInput, RadioGroup, Slider, FileUpload, InputOTP, NativeSelect, InputGroup, Tooltip |
-| Forbidden | DataTable, HeroBlock, AreaChart, BarChart, AuroraEffect, AgentTeamPanel |
-| Blocks | CreateBlock |
-| States | pristine, dirty, submitting, success, validation-error |
-| Recipe | `recipes/crud-form.md` |
-
----
-
-### settings
-
-| Classification | Values |
-|----------------|--------|
-| Routes | `/settings`, `/settings/[section]` |
-| Shell | app-shell |
-| Required | Card, Button, Input, Switch, Select, Typography, Breadcrumb, Tabs, AlertDialog, AvatarUpload, Form, Skeleton, Sonner |
-| Allowed | PasswordInput, Checkbox, RadioGroup, Label, Badge, Tooltip, Separator |
-| Forbidden | DataTable, HeroBlock, AreaChart, AuroraEffect, AgentTeamPanel, TextReveal |
-| Blocks | SettingsLayout |
-| States | loading, default, dirty, saving, saved, error |
-| Recipe | `recipes/settings.md` |
-
----
-
-### auth
-
-| Classification | Values |
-|----------------|--------|
-| Routes | `/login`, `/signup`, `/reset-password`, `/verify` |
-| Shell | auth-shell |
-| Required | Card, Label, Input, PasswordInput, Button, Alert, Logo, BrandIcons, Separator, Typography, Spinner |
-| Allowed | InputOTP, Checkbox, ShaderBackground |
-| Forbidden | Sidebar, DataTable, NavigationMenu, AreaChart, AuroraEffect |
-| Blocks | AuthLayout, LoginBlock, SignUpBlock, PasswordRecoveryBlock, ResetPasswordBlock, TwoFactorChallengeBlock, TwoFactorSetupBlock, AccountLockedBlock, AuthSuccessBlock |
-| States | default, submitting, error, success |
-| Recipe | `recipes/auth.md` |
-
----
-
-### onboarding
-
-| Classification | Values |
-|----------------|--------|
-| Routes | `/onboarding`, `/onboarding/[step]` |
-| Shell | onboarding-shell |
-| Required | Progress, Button, Card, Typography, Logo, ConfettiBurst, SuccessCheck |
-| Allowed | FormWizard, Input, AvatarUpload, Select, Checkbox, RadioGroup, TagInput, Label, Form, FormField, Stepper, Step, Badge, Separator |
-| Forbidden | Sidebar, DataTable, NavigationMenu, HeroBlock, AgentTeamPanel |
-| Blocks | OnboardingBlock, WizardBlock |
-| States | step-active, step-valid, step-error, complete |
-| Recipe | `recipes/onboarding.md` |
-
----
-
-### pricing
-
-| Classification | Values |
-|----------------|--------|
-| Routes | `/pricing` |
-| Shell | marketing-shell |
-| Required | Card, Badge, Button, Switch, Typography, Separator, ScrollFadeIn |
-| Allowed | PricingBlock, ComparisonBlock, Table, Tooltip, ToggleGroup, Tabs, Accordion, CountingNumber, FAQBlock, CallToActionBlock, HeaderBlock, FooterBlock, CheckoutForm |
-| Forbidden | Sidebar, DataTable, FormWizard, AgentTeamPanel, AuroraEffect |
-| Blocks | PricingBlock, FAQBlock, CallToActionBlock, ComparisonBlock, HeaderBlock, FooterBlock |
-| States | default, annual-toggle, cta-loading |
-| Recipe | `recipes/pricing.md` |
-
----
-
-### analytics
-
-| Classification | Values |
-|----------------|--------|
-| Routes | `/analytics` |
-| Shell | app-shell |
-| Required | Card, Badge, Typography, Breadcrumb, Button, DateRangePicker, Tabs, Select, Skeleton, Empty |
-| Allowed | AreaChart, BarChart, LineChart, PieChart, RadarChart, RadialBarChart, HeatmapChart, DataTable, CountingNumber, Tooltip, Progress, Input |
-| Forbidden | HeroBlock, FormWizard, AuthLayout, AgentTeamPanel, AuroraEffect, TextReveal |
-| Blocks | StatsBlock, ChartBlock, ChartCollectionBlock, BarChartBlock, InteractiveAreaChartBlock, HeatmapChartBlock, UsageDonutBlock, DataGridBlock |
-| States | loading, empty, has-data, error, date-filtered |
-| Recipe | `recipes/analytics.md` |
-
----
-
-### agents-chat
-
-| Classification | Values |
-|----------------|--------|
-| Routes | `/agents`, `/voice-agents`, `/chat` |
-| Shell | app-shell |
-| Required | Conversation, ChatMessage, ChatResponse, ChatPromptInput, ChatToolCall, ChatActions, ChatGreeting, ChatThinkingMessage, ChatShimmer, ChatReasoning, ChatConfirmation, ChatSuggestion, ChatSources, ChatBranch, ChatChainOfThought, ChatPlan, ChatQueue, ChatPromptInputAttachments, AgentTeamPanel, AgentStatus, AgentMessageBubble, ThinkingIndicator, ToolCallCard, ApprovalCard, CodeDiffViewer, ArtifactCard, AgentTerminal, ContextMeter, Tabs, Button, ScrollArea, Sheet |
-| Allowed | ConversationThread, AgentTimeline, AgentMetricsCard, WorkflowGraph, HandoffIndicator, MemoryInspector, SourceCitation, StreamingText, Badge, Avatar, AgentAvatar, Resizable, Textarea |
-| Forbidden | HeroBlock, PricingBlock, FormWizard, DataTable, AuroraEffect, MeteorShower |
-| Blocks | AgentConversationBlock, ChatLayout |
-| States | empty, loading, running, thinking, blocked-approval, failed, complete |
-| Recipe | `recipes/agents-chat.md` |
-
----
-
-### error
-
-| Classification | Values |
-|----------------|--------|
-| Routes | `/404`, `/500` |
-| Shell | fallback-shell |
-| Required | Button, Typography, Logo |
-| Allowed | Card, NotFoundBlock |
-| Forbidden | Sidebar, DataTable, NavigationMenu, AreaChart, FormWizard, AuroraEffect |
-| Blocks | NotFoundBlock |
-| States | not-found, server-error |
-| Recipe | `recipes/error-pages.md` |
-
----
-
-### navigation-shell
-
-| Classification | Values |
-|----------------|--------|
-| Routes | `(layout)` |
-| Shell | app-shell |
-| Required | Sidebar, SidebarProvider, SidebarTrigger, SidebarInset, SidebarContent, SidebarGroup, SidebarGroupLabel, SidebarMenu, SidebarMenuItem, SidebarMenuButton, Breadcrumb, SearchCommand, Dialog, ThemeToggle, Button, Avatar |
-| Allowed | SidebarMenuSub, SidebarMenuSubItem, SidebarMenuSubButton, SidebarRail, NotificationCenter, Badge, StyleToggle, Tooltip, DropdownMenu, ScrollArea, ContextMenu, Menubar |
-| Forbidden | HeroBlock, FooterBlock, AreaChart, Form, AgentTeamPanel |
-| Blocks | NavUser, AppBreadcrumb, AppSearch, WorkspaceSwitcher |
-| States | (none) |
-| Recipe | `recipes/navigation-shell.md` |
-
----
-
-### blog-content
-
-| Classification | Values |
-|----------------|--------|
-| Routes | `/blog`, `/blog/[slug]`, `/changelog` |
-| Shell | marketing-shell |
-| Required | Card, Badge, Avatar, Typography, Pagination, Separator, Select, Button, ScrollFadeIn |
-| Allowed | Tabs, Input, Breadcrumb, Tooltip, HeaderBlock, FooterBlock |
-| Forbidden | Sidebar, DataTable, FormWizard, AgentTeamPanel, AreaChart |
-| Blocks | HeaderBlock, FooterBlock, ChangelogBlock, NewsletterBlock, CodeBlock |
-| States | loading, has-data, category-filtered |
-| Recipe | `recipes/blog-content.md` |
-
----
-
-### checkout
-
-| Classification | Values |
-|----------------|--------|
-| Routes | `/checkout`, `/checkout/success` |
-| Shell | marketing-shell |
-| Required | CheckoutForm, Card, Input, InputGroup, Button, Typography, Separator, Logo, Form, Alert, Spinner, ConfettiBurst, SuccessCheck |
-| Allowed | CheckoutFormDemo, Label, Select, NativeSelect, Badge, Tooltip |
-| Forbidden | Sidebar, NavigationMenu, DataTable, AgentTeamPanel, AreaChart, AuroraEffect, HeroBlock |
-| Blocks | (none) |
-| States | default, submitting, processing, error, success |
-| Recipe | `recipes/checkout.md` |
-
----
-
-### marketing-shell
-
-| Classification | Values |
-|----------------|--------|
-| Routes | `(marketing)` route group layout |
-| Shell | marketing-shell (this IS the definition) |
-| Required | HeaderBlock, FooterBlock, Logo, Button, ThemeToggle |
-| Allowed | BannerBlock, AnnouncementBanner, SkipNav |
-| Forbidden | Sidebar, SidebarProvider, DataTable, Form, FormWizard, AgentTeamPanel, AgentTerminal, SettingsLayout |
-| Blocks | HeaderBlock, FooterBlock |
-| States | default, mobile-navigation |
-| Recipe | `recipes/marketing-shell.md` |
-
----
-
-### agency-home
-
-| Classification | Values |
-|----------------|--------|
-| Routes | `/`, `/home` |
-| Shell | marketing-shell |
-| Required | HeaderBlock, FooterBlock, Button, Badge, ScrollFadeIn, ProcessFlowBlock, FeatureGridBlock, StatsMarketingBlock |
-| Allowed | HeroBlock, HeroSectionBlock, TestimonialsBlock, LogoCloud, FAQBlock, CallToActionBlock, SocialProofBlock, InfiniteSlider, CountingNumber, ShaderBackground, Card, BentoGrid, AnimatedGradientText, Separator |
-| Forbidden | Sidebar, DataTable, Form, FormWizard, AgentTeamPanel, AgentTerminal, SettingsLayout |
-| Blocks | HeroBlock, HeroSectionBlock, FeatureGridBlock, ProcessFlowBlock, StatsMarketingBlock, TestimonialsBlock, LogoCloud, FAQBlock, CallToActionBlock, HeaderBlock, FooterBlock |
-| States | default, mobile-navigation |
-| Recipe | `recipes/agency-home.md` |
-
----
-
-### digital-workers
-
-| Classification | Values |
-|----------------|--------|
-| Routes | `/digital-workers`, `/agents`, `/platform` |
-| Shell | marketing-shell |
-| Required | HeaderBlock, FooterBlock, Button, Badge, ScrollFadeIn, AgentProfileGridBlock |
-| Allowed | HeroBlock, HeroSectionBlock, FeatureBlock, FeatureGridBlock, WorkflowGraph, IntegrationsBlock, FAQBlock, CallToActionBlock, StatsMarketingBlock, Card, BentoGrid, ShaderBackground, LogoCloud, InfiniteSlider, Separator |
-| Forbidden | Sidebar, DataTable, Form, FormWizard, SettingsLayout, AgentTeamPanel |
-| Blocks | AgentProfileGridBlock, FeatureBlock, IntegrationsBlock, FAQBlock, CallToActionBlock, HeaderBlock, FooterBlock |
-| States | default, mobile-navigation |
-| Recipe | `recipes/digital-workers.md` |
-
----
-
-### service-detail
-
-| Classification | Values |
-|----------------|--------|
-| Routes | `/services/[slug]`, `/products/[slug]`, `/agents/[slug]` |
-| Shell | marketing-shell |
-| Required | HeaderBlock, FooterBlock, Button, Badge, ScrollFadeIn, SolutionShowcaseBlock |
-| Allowed | ProcessFlowBlock, FeatureBlock, FeatureGridBlock, StatsMarketingBlock, TestimonialsBlock, FAQBlock, CallToActionBlock, HeroBlock, HeroSectionBlock, Card, ShaderBackground, BentoGrid, LogoCloud, InfiniteSlider, CountingNumber, Separator |
-| Forbidden | Sidebar, DataTable, AgentTeamPanel, SettingsLayout, FormWizard |
-| Blocks | SolutionShowcaseBlock, ProcessFlowBlock, FeatureBlock, FeatureGridBlock, StatsMarketingBlock, TestimonialsBlock, FAQBlock, CallToActionBlock, HeaderBlock, FooterBlock |
-| States | default, mobile-navigation |
-| Recipe | `recipes/service-detail.md` |
-
----
-
-### company-about
-
-| Classification | Values |
-|----------------|--------|
-| Routes | `/about`, `/manifesto`, `/chi-siamo` |
-| Shell | marketing-shell |
-| Required | HeaderBlock, FooterBlock, Button, Badge, ScrollFadeIn, TeamBlock |
-| Allowed | FeatureBlock, FeatureGridBlock, StatsMarketingBlock, LogoCloud, CallToActionBlock, HeroBlock, HeroSectionBlock, Card, ShaderBackground, TestimonialsBlock, InfiniteSlider, Separator |
-| Forbidden | Sidebar, DataTable, Form, FormWizard, AgentTeamPanel, PricingBlock, SettingsLayout |
-| Blocks | TeamBlock, FeatureGridBlock, StatsMarketingBlock, LogoCloud, CallToActionBlock, HeaderBlock, FooterBlock |
-| States | default, mobile-navigation |
-| Recipe | `recipes/company-about.md` |
-
----
-
-### company-contact
-
-| Classification | Values |
-|----------------|--------|
-| Routes | `/contact`, `/contatti` |
-| Shell | marketing-shell |
-| Required | HeaderBlock, FooterBlock, Button, ScrollFadeIn, ContactBlock |
-| Allowed | FAQBlock, Card, FeatureGridBlock, Badge, HeroBlock, HeroSectionBlock, CallToActionBlock, Separator |
-| Forbidden | Sidebar, DataTable, FormWizard, AgentTeamPanel, PricingBlock, SettingsLayout |
-| Blocks | ContactBlock, FAQBlock, HeaderBlock, FooterBlock |
-| States | default, form-submitting, form-success, form-error |
-| Recipe | `recipes/company-contact.md` |

package/.agents/skills/seed/recipes/agency-home.md

@@ -1,311 +0,0 @@
-# Recipe: Agency Home
-
-AI agency/platform homepage oriented around selling AI services, showcasing process and outcomes.
-
-## Route Pattern
-
-`/` or `/home`
-
-## Shell
-
-`marketing-shell` (HeaderBlock + FooterBlock)
-
----
-
-## Layout Blueprint (Desktop)
-
-```
-+------------------------------------------------+
-| HeaderBlock: Logo  [Nav links]  [CTA Button]   |
-+------------------------------------------------+
-|                                                 |
-|              HERO SECTION                       |
-|    Agency headline (centered)                   |
-|    Subtitle: what the agency delivers           |
-|    [Primary CTA]  [Secondary CTA]              |
-|    ShaderBackground / ambient visual            |
-|                                                 |
-+------------------------------------------------+
-| Logo Cloud: client logos (InfiniteSlider)       |
-+------------------------------------------------+
-|                                                 |
-|         SERVICES GRID (3-col)                   |
-|  +----------+ +----------+ +----------+         |
-|  | Service 1| | Service 2| | Service 3|         |
-|  +----------+ +----------+ +----------+         |
-|  +----------+ +----------+ +----------+         |
-|  | Service 4| | Service 5| | Service 6|         |
-|  +----------+ +----------+ +----------+         |
-|                                                 |
-+------------------------------------------------+
-|         PROCESS FLOW                            |
-|  [Step 1] → [Step 2] → [Step 3] → [Step 4]     |
-|  How we work: discovery → design → deliver      |
-+------------------------------------------------+
-|        OUTCOME STATS                            |
-|   +------+  +------+  +------+  +------+       |
-|   | ROI  |  | Time |  | Cost |  | Scale|       |
-|   | 340% |  | -60% |  | -45% |  | 10x |       |
-|   +------+  +------+  +------+  +------+       |
-+------------------------------------------------+
-|                                                 |
-|         TESTIMONIALS (carousel or grid)         |
-|                                                 |
-+------------------------------------------------+
-|                                                 |
-|         FAQ (Accordion)                         |
-|                                                 |
-+------------------------------------------------+
-|         FINAL CTA SECTION                       |
-|    Headline + [CTA Button]                      |
-+------------------------------------------------+
-| FooterBlock: columns + social + legal           |
-+------------------------------------------------+
-```
-
----
-
-## Section Sequence
-
-### 1. Header
-
-```tsx
-<HeaderBlock logo={<Logo />} links={navLinks} actions={<Button>Book a Call</Button>} />
-```
-
-### 2. Hero Section
-
-```tsx
-<section className="relative py-24 md:py-32 overflow-hidden">
-  <ShaderBackground shader="meshGradient" intent="hero" opacity={0.25} />
-  <div className="relative z-10 max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
-    <motion.div variants={heroStagger.container} initial="hidden" animate="visible">
-      <motion.div variants={heroStagger.child}>
-        <Badge variant="outline" className="mb-4">AI-Powered Solutions</Badge>
-      </motion.div>
-      <motion.h1 variants={heroStagger.child} className="text-4xl md:text-6xl font-bold tracking-tight">
-        {headline}
-      </motion.h1>
-      <motion.p variants={heroStagger.child} className="mt-6 text-lg md:text-xl text-text-secondary max-w-2xl mx-auto">
-        {subtitle}
-      </motion.p>
-      <motion.div variants={heroStagger.child} className="mt-8 flex flex-col sm:flex-row gap-4 justify-center">
-        <Button size="lg">Book a Call</Button>
-        <Button size="lg" variant="outline">See Our Work</Button>
-      </motion.div>
-    </motion.div>
-  </div>
-</section>
-```
-
-### 3. Logo Cloud
-
-```tsx
-<section className="py-12 border-y border-border-subtle">
-  <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
-    <Typography variant="small" className="text-center text-text-tertiary mb-6">
-      Trusted by forward-thinking companies
-    </Typography>
-    <LogoCloud logos={clientLogos} />
-  </div>
-</section>
-```
-
-### 4. Services Grid
-
-```tsx
-<ScrollFadeIn>
-  <section className="py-16 md:py-24">
-    <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
-      <div className="text-center mb-12">
-        <Heading level={2} size="section" >Our Services</Heading>
-        <Typography variant="lead" className="mt-4 text-text-secondary">
-          End-to-end AI solutions tailored to your business
-        </Typography>
-      </div>
-      <FeatureGridBlock features={services} columns={3} />
-    </div>
-  </section>
-</ScrollFadeIn>
-```
-
-### 5. Process Flow
-
-```tsx
-<ScrollFadeIn>
-  <section className="py-16 md:py-24 bg-muted">
-    <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
-      <div className="text-center mb-12">
-        <Heading level={2} size="section" >How We Work</Heading>
-        <Typography variant="lead" className="mt-4 text-text-secondary">
-          A proven process from discovery to deployment
-        </Typography>
-      </div>
-      <ProcessFlowBlock steps={processSteps} />
-    </div>
-  </section>
-</ScrollFadeIn>
-```
-
-### 6. Outcome Stats
-
-```tsx
-<ScrollFadeIn>
-  <section className="py-16 md:py-24">
-    <StatsMarketingBlock stats={outcomeStats} />
-  </section>
-</ScrollFadeIn>
-```
-
-### 7. Testimonials
-
-```tsx
-<ScrollFadeIn>
-  <section className="py-16 md:py-24 bg-muted">
-    <TestimonialsBlock testimonials={testimonials} />
-  </section>
-</ScrollFadeIn>
-```
-
-### 8. FAQ
-
-```tsx
-<ScrollFadeIn>
-  <section className="py-16 md:py-24">
-    <FAQBlock items={faqItems} />
-  </section>
-</ScrollFadeIn>
-```
-
-### 9. Final CTA
-
-```tsx
-<ScrollFadeIn>
-  <section className="py-16 md:py-24">
-    <CallToActionBlock
-      title="Ready to transform your business with AI?"
-      description="Book a free discovery call and see how we can help."
-      action={<Button size="lg">Book a Call</Button>}
-    />
-  </section>
-</ScrollFadeIn>
-```
-
-### 10. Footer
-
-```tsx
-<FooterBlock columns={footerColumns} social={socialLinks} legal={legalLinks} />
-```
-
----
-
-## Animation Storyboard
-
-```
-ANIMATION STORYBOARD
-====================
-BUDGET: 1000ms (above-fold) | SPRING: dramatic (hero), snappy (rest) | REDUCED: opacity-only
-
-T+0ms     [nav]        Header visible                  (instant)
-T+100ms   [badge]      Agency badge                    {fadeIn, snappy}
-T+200ms   [headline]   Hero headline                   {fadeInUp, dramatic}
-T+350ms   [subtitle]   Hero subtitle                   {fadeInUp, dramatic}
-T+500ms   [ctas]       CTA buttons                     {fadeInUp, dramatic}
-T+700ms   [shader]     Hero visual/shader appears      {fadeIn, gentle}
-T+900ms   [logos]      Logo cloud fades in             {fadeIn, snappy}
-
-SCROLL-TRIGGERED (below fold):
-[services]     ScrollFadeIn at 20% visible    {fadeInUp, snappy, stagger 100ms}
-[process]      ScrollFadeIn at 20% visible    {fadeInUp, snappy, stagger 150ms}
-[stats]        ScrollFadeIn at 20% visible    {fadeInUp, snappy}
-[testimonials] ScrollFadeIn at 20% visible    {fadeIn, gentle}
-[faq]          ScrollFadeIn at 20% visible    {fadeInUp, snappy}
-[cta]          ScrollFadeIn at 20% visible    {scaleIn, gentle}
-
-REDUCED MOTION: All items visible immediately, opacity 0->1 in 10ms
-```
-
----
-
-## Required Components
-
-| Component | Import Path | Purpose |
-|-----------|-------------|---------|
-| `HeaderBlock` | `@vadimcomanescu/nadicode-design-system/catalog/components` via `seedComponents` | Site navigation |
-| `FooterBlock` | `@vadimcomanescu/nadicode-design-system/catalog/components` via `seedComponents` | Site footer |
-| `Button` | `@vadimcomanescu/nadicode-design-system/button` | CTAs |
-| `Badge` | `@vadimcomanescu/nadicode-design-system/badge` | Hero tag |
-| `Typography` | `@vadimcomanescu/nadicode-design-system/typography` | Headings, body text |
-| `ScrollFadeIn` | `@vadimcomanescu/nadicode-design-system/scroll-fade-in` | Below-fold animations |
-| `ProcessFlowBlock` | `@vadimcomanescu/nadicode-design-system/catalog/components` via `seedComponents` | How-we-work process |
-| `FeatureGridBlock` | `@vadimcomanescu/nadicode-design-system/catalog/components` via `seedComponents` | Services grid |
-| `StatsMarketingBlock` | `@vadimcomanescu/nadicode-design-system/catalog/components` via `seedComponents` | Outcome metrics (ROI, time saved) |
-
-### Allowed (optional)
-
-`HeroBlock`, `HeroSectionBlock`, `TestimonialsBlock`, `LogoCloud`, `FAQBlock`, `CallToActionBlock`, `SocialProofBlock`, `InfiniteSlider`, `CountingNumber`, `ShaderBackground`, `Card`, `BentoGrid`
-
-### Forbidden
-
-`Sidebar`, `DataTable`, `Form`, `FormWizard`, `AgentTeamPanel`, `AgentTerminal`, `SettingsLayout`, `ChatLayout`
-
----
-
-## Required States
-
-| State | Trigger | Visual |
-|-------|---------|--------|
-| `default` | Page loaded | Full marketing content |
-| `mobile-navigation` | Hamburger tap | Mobile nav drawer/sheet |
-
----
-
-## Responsive Contract
-
-| Breakpoint | Hero | Services | Process | Stats | Content Width |
-|------------|------|----------|---------|-------|---------------|
-| Mobile | Stacked, text-center | 1 col | Vertical stack | 2 col | px-4 |
-| `sm:` | Stacked, text-center | 2 col | Vertical stack | 2 col | px-6, max-w-7xl |
-| `lg:` | Centered | 3 col | Horizontal flow | 4 col | px-8, max-w-7xl |
-
----
-
-## Styling Rules
-
-- Hero: `ShaderBackground` for ambient glow, `glass-floating` for elevated cards
-- Section backgrounds alternate: `bg-background` and `bg-muted`
-- Process flow uses connected step indicators with semantic `border-accent`
-- Stats use `CountingNumber` for animated counters
-- CTAs use `Button` with `size="lg"` for prominence
-- No raw palette colors; semantic tokens only
-
----
-
-## Accessibility
-
-- Hero heading is `<h1>`, section headings are `<h2>`
-- Skip-nav link to main content
-- All images have alt text
-- CTA buttons have descriptive text (not just "Click here")
-- Mobile nav is keyboard accessible with focus trap
-- Process flow steps are in an ordered list
-
----
-
-## Reference Implementations
-
-- `src/app/landing/page.tsx`
-- `src/components/blocks/ProcessFlowBlock.tsx`
-- `src/components/blocks/FeatureGridBlock.tsx`
-- `src/components/blocks/StatsMarketingBlock.tsx`
-
----
-
-## Verification
-
-```bash
-npx tsc --noEmit
-npm run lint
-npm run test
-npx vitest run src/test/css-variable-usage.test.ts
-```