1import ShaderCard2 from "@/components/lightswind-pro/shader-card-2";
2import { Sparkles, Check, ArrowRight } from "lucide-react";
3
4export default function PricingDemo() {
5 return (
6 <ShaderCard2
7 color="#5227FF"
8 speed={0.5}
9 noiseScale={1.5}
10 waveAmount={0.15}
11 branchIntensity={2.0}
12 blur={5.0}
13 opacity={0.8}
14 enableTilt={true}
15 glow={true}
16 className="max-w-[380px] w-full p-7"
17 >
18 <div className="flex flex-col gap-4">
19 <div className="inline-flex items-center gap-1.5 px-3 py-1 rounded-full text-[11px] font-bold uppercase tracking-wider bg-black/5 dark:bg-white/10 text-foreground backdrop-blur-md border border-black/10 dark:border-white/15">
20 <span className="w-2 h-2 rounded-full bg-[#5227FF] animate-pulse" />
21 <span>Most Popular</span>
22 </div>
23 <div>
24 <h3 className="text-2xl font-extrabold tracking-tight text-foreground flex items-center gap-2">
25 Enterprise AI Pro
26 <Sparkles className="w-4 h-4 text-[#5227FF]" />
27 </h3>
28 <p className="text-xs text-muted-foreground mt-1">
29 Real-time procedural GPU shaders and high-fps 3D UI elements.
30 </p>
31 </div>
32 </div>
33
34 <div className="my-5 py-4 border-y border-border/60 flex items-baseline gap-2">
35 <span className="text-5xl font-black text-foreground">$49</span>
36 <span className="text-xs text-muted-foreground">/ month</span>
37 </div>
38
39 <button className="w-full py-3 px-4 rounded-xl text-sm font-bold text-white bg-[#5227FF] flex items-center justify-center gap-2">
40 <span>Get Started with Pro</span>
41 <ArrowRight className="w-4 h-4" />
42 </button>
43 </ShaderCard2>
44 );
45}
