69 lines
3.2 KiB
TypeScript
69 lines
3.2 KiB
TypeScript
'use client';
|
||
|
||
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">
|
||
{/* 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 – Ihr Partner für digitale Produkte und individuelle
|
||
Softwarelösungen.
|
||
Wir entwickeln skalierbare, wartbare Anwendungen mit klarem Fokus: Technik, die begeistert –
|
||
von der Architektur bis zum Go-Live.
|
||
</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}}
|
||
>
|
||
Ob Start-up oder etabliertes Unternehmen: Wir begleiten Sie mit einem flexiblen Netzwerk,
|
||
klarer Kommunikation und hohem Qualitätsanspruch – agil, lösungsorientiert und nah am
|
||
Projekt.
|
||
</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;
|