From 845a32f47e517037563e59de96e73440e7a71a69 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=BC=A0=E7=BF=94?= <xiangzhang1024@gmail.com>
Date: Sun, 3 May 2026 17:11:34 +0800
Subject: [PATCH] feat(hero): integrate InkDataMorph animation into Hero
 Section

---
 src/components/sections/hero-section-v2.tsx | 7 +++++++
 1 file changed, 7 insertions(+)

diff --git a/src/components/sections/hero-section-v2.tsx b/src/components/sections/hero-section-v2.tsx
index ac95094..20e9bc6 100644
--- a/src/components/sections/hero-section-v2.tsx
+++ b/src/components/sections/hero-section-v2.tsx
@@ -1,6 +1,7 @@
 'use client';
 
 import { useEffect, useRef, useState } from 'react';
+import dynamic from 'next/dynamic';
 import { motion } from 'framer-motion';
 import { StaticLink } from '@/components/ui/static-link';
 import { Button } from '@/components/ui/button';
@@ -8,6 +9,11 @@ import { COMPANY_INFO } from '@/lib/constants';
 import { ArrowRight } from 'lucide-react';
 import { useReducedMotion } from '@/hooks/use-reduced-motion';
 
+const InkDataMorph = dynamic(
+  () => import('@/components/effects/ink-data-morph').then(mod => ({ default: mod.InkDataMorph })),
+  { ssr: false }
+);
+
 export function HeroSectionV2() {
   const [isVisible, setIsVisible] = useState(false);
   const sectionRef = useRef<HTMLElement>(null);
@@ -42,6 +48,7 @@ export function HeroSectionV2() {
       aria-labelledby="hero-heading"
       className="relative min-h-screen flex flex-col justify-center overflow-hidden bg-white"
     >
+      <InkDataMorph />
       <div className="container-wide py-24 md:py-32 lg:py-40 relative z-10 flex-1 flex items-center">
         <div className="max-w-3xl">
           <motion.div