Thatsaphorn Atchariyaphap
37cde33b41
Merge branch 'Homepage Refactoring - Pt .3' into 'production' See merge request rheinsw/website!30
58 lines
2.3 KiB
TypeScript
58 lines
2.3 KiB
TypeScript
'use client';
|
|
|
|
import Link from 'next/link';
|
|
import {motion} from 'framer-motion';
|
|
import {FiArrowRight} from 'react-icons/fi';
|
|
import {useThemeColors} from '@/utils/useThemeColors';
|
|
|
|
const ContactCTA = () => {
|
|
const colors = useThemeColors();
|
|
|
|
return (
|
|
<section
|
|
className="relative w-full py-24 overflow-hidden transition-colors duration-700 ease-in-out"
|
|
style={{backgroundColor: colors.primaryBg, color: colors.primaryText}}
|
|
>
|
|
<div className="w-full max-w-4xl px-6 md:px-10 mx-auto text-center">
|
|
{/* Headline */}
|
|
<motion.h2
|
|
className="text-3xl md:text-4xl font-bold transition-colors duration-700 ease-in-out"
|
|
>
|
|
Interesse geweckt?
|
|
</motion.h2>
|
|
|
|
{/* Description */}
|
|
<motion.p
|
|
className="mt-4 text-sm md:text-base max-w-xl mx-auto transition-colors duration-700 ease-in-out"
|
|
style={{color: colors.secondaryText}}
|
|
initial={{opacity: 0, y: 20}}
|
|
whileInView={{opacity: 1, y: 0}}
|
|
viewport={{once: true}}
|
|
transition={{duration: 0.5, delay: 0.2}}
|
|
>
|
|
Lass uns über dein Projekt sprechen. Wir freuen uns darauf, deine Ideen in die Realität umzusetzen.
|
|
</motion.p>
|
|
|
|
{/* CTA Button */}
|
|
<motion.div
|
|
className="mt-8 flex justify-center"
|
|
initial={{opacity: 0, y: 20}}
|
|
whileInView={{opacity: 1, y: 0}}
|
|
viewport={{once: true}}
|
|
transition={{duration: 0.5, delay: 0.3}}
|
|
>
|
|
<Link href="/contact">
|
|
<button
|
|
className="inline-flex items-center gap-2 px-6 py-3 text-sm md:text-base font-semibold rounded-full bg-blue-700 hover:bg-blue-900 text-white shadow-md transition-all duration-300"
|
|
>
|
|
Jetzt Kontakt aufnehmen <FiArrowRight size={18}/>
|
|
</button>
|
|
</Link>
|
|
</motion.div>
|
|
</div>
|
|
</section>
|
|
);
|
|
};
|
|
|
|
export default ContactCTA;
|