47 lines
1.5 KiB
TypeScript
47 lines
1.5 KiB
TypeScript
import { motion } from "motion/react";
|
|
import { ArrowRight } from "lucide-react";
|
|
|
|
export function ServicesCTASection() {
|
|
return (
|
|
<section className="py-16 px-[var(--section-margin-x)] max-lg:px-8 max-md:py-12">
|
|
<div className="max-w-4xl mx-auto text-center">
|
|
<motion.div
|
|
initial={{ opacity: 0, y: 30 }}
|
|
whileInView={{ opacity: 1, y: 0 }}
|
|
transition={{ duration: 0.7 }}
|
|
viewport={{ once: true }}
|
|
className="space-y-8"
|
|
>
|
|
{/* CTA Button */}
|
|
<motion.div
|
|
initial={{ opacity: 0, y: 20 }}
|
|
whileInView={{ opacity: 1, y: 0 }}
|
|
transition={{ duration: 0.6, delay: 0.3 }}
|
|
viewport={{ once: true }}
|
|
>
|
|
<button className="services-cta-button">
|
|
<div className="services-cta-icon">
|
|
<ArrowRight size={20} />
|
|
</div>
|
|
<span className="services-cta-text">
|
|
Get Started Today
|
|
</span>
|
|
</button>
|
|
</motion.div>
|
|
|
|
{/* Supporting Text */}
|
|
<motion.p
|
|
className="text-sm max-md:text-xs"
|
|
style={{ color: 'var(--color-brand-gray-muted)' }}
|
|
initial={{ opacity: 0 }}
|
|
whileInView={{ opacity: 1 }}
|
|
transition={{ duration: 0.6, delay: 0.5 }}
|
|
viewport={{ once: true }}
|
|
>
|
|
Free consultation • No commitment required • Expert guidance
|
|
</motion.p>
|
|
</motion.div>
|
|
</div>
|
|
</section>
|
|
);
|
|
} |