"use client"; import { motion, useMotionValue, useTransform, animate } from "framer-motion"; import { Circle } from "lucide-react"; import { useEffect, useState } from "react"; import { cn } from "@/lib/utils"; function ElegantShape({ className, delay = 0, width = 400, height = 100, rotate = 0, gradient = "from-white/[0.08]", }: { className?: string; delay?: number; width?: number; height?: number; rotate?: number; gradient?: string; }) { return (

); } function HeroGeometric({ badge = "Design Collective", title1 = "Elevate Your Digital Vision", title2 = "Crafting Exceptional Websites", }: { badge?: string; title1?: string; title2?: string; }) { const fadeUpVariants = { hidden: { opacity: 0, y: 30 }, visible: (i: number) => ({ opacity: 1, y: 0, transition: { duration: 1, delay: 0.5 + i * 0.2, ease: [0.25, 0.4, 0.25, 1], }, }), }; return (

{badge}

{title1}
{title2}

Crafting exceptional digital experiences through innovative design and cutting-edge technology.

); } export { HeroGeometric }

{title1} {title2}

{title1}
{title2}