85 lines
3.9 KiB
TypeScript
85 lines
3.9 KiB
TypeScript
'use client';
|
||
|
||
// import Link from 'next/link';
|
||
// import {FiArrowRight} from 'react-icons/fi';
|
||
import {motion} from 'framer-motion';
|
||
import {useThemeColors} from '@/utils/useThemeColors';
|
||
|
||
const About = () => {
|
||
const colors = useThemeColors();
|
||
|
||
return (
|
||
<section
|
||
className="relative w-full py-24 transition-colors duration-700 ease-in-out"
|
||
style={{backgroundColor: colors.secondaryBg, color: colors.primaryText}}
|
||
>
|
||
<div className="w-full max-w-6xl px-6 md:px-10 mx-auto">
|
||
<div className="flex flex-col">
|
||
{/* Title */}
|
||
<motion.h2
|
||
className="text-3xl md:text-4xl font-bold mb-1 text-left transition-colors duration-700 ease-in-out"
|
||
>
|
||
Über uns
|
||
</motion.h2>
|
||
|
||
<motion.div
|
||
className="w-12 h-[2px] mt-2 mb-6 bg-amber-500"
|
||
initial={{opacity: 0, x: -20}}
|
||
whileInView={{opacity: 1, x: 0}}
|
||
viewport={{once: true}}
|
||
transition={{duration: 0.4, delay: 0.1}}
|
||
/>
|
||
|
||
{/* Text */}
|
||
<div className="p-0 max-w-4xl">
|
||
<motion.p
|
||
className="text-base md:text-lg leading-relaxed 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}}
|
||
>
|
||
Wir sind Rhein-Software – ein Team, das sich auf individuelle Softwarelösungen und digitale
|
||
Services spezialisiert hat. Unsere Anwendungen sind technisch solide, skalierbar und
|
||
durchdacht – gebaut für langfristigen Erfolg.
|
||
</motion.p>
|
||
|
||
<motion.p
|
||
className="mt-6 text-base md:text-lg leading-relaxed 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.3}}
|
||
>
|
||
Von der ersten Idee bis zum Go-Live begleiten wir Unternehmen und Startups mit einem
|
||
flexiblen Netzwerk, klarer Kommunikation und einem hohen Anspruch an Qualität.
|
||
Unsere Lösungen sind intuitiv, effizient – und genau auf deine Anforderungen zugeschnitten.
|
||
</motion.p>
|
||
</div>
|
||
|
||
{/* CTA Button */}
|
||
<motion.div
|
||
className="mt-10 flex justify-end"
|
||
initial={{opacity: 0, y: 10}}
|
||
whileInView={{opacity: 1, y: 0}}
|
||
viewport={{once: true}}
|
||
transition={{duration: 0.5, delay: 0.5}}
|
||
>
|
||
{/*<Link href="/about">*/}
|
||
{/* <button*/}
|
||
{/* className="flex items-center gap-2 bg-blue-700 hover:bg-blue-900 text-white font-semibold px-5 py-2 rounded-full shadow-lg transition-all"*/}
|
||
{/* >*/}
|
||
{/* Mehr über uns <FiArrowRight size={18}/>*/}
|
||
{/* </button>*/}
|
||
{/*</Link>*/}
|
||
</motion.div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
);
|
||
};
|
||
|
||
export default About;
|