99 lines
3.2 KiB
TypeScript
99 lines
3.2 KiB
TypeScript
'use client'
|
|
|
|
import { motion } from 'framer-motion'
|
|
import Link from 'next/link'
|
|
import Image from 'next/image'
|
|
import Navigation from '@/components/Navigation'
|
|
import Footer from '@/components/Footer'
|
|
|
|
export default function UeberUns() {
|
|
return (
|
|
<>
|
|
<Navigation />
|
|
<main>
|
|
<section className="page-hero">
|
|
<motion.div
|
|
initial={{ opacity: 0, y: 20 }}
|
|
animate={{ opacity: 1, y: 0 }}
|
|
transition={{ duration: 0.8 }}
|
|
className="container"
|
|
>
|
|
<h1>Über uns</h1>
|
|
<p className="page-hero-subtitle">
|
|
IT für alle verständlich machen
|
|
</p>
|
|
</motion.div>
|
|
</section>
|
|
|
|
<section className="page-content">
|
|
<div className="container">
|
|
<motion.div
|
|
initial={{ opacity: 0, y: 30 }}
|
|
whileInView={{ opacity: 1, y: 0 }}
|
|
viewport={{ once: true }}
|
|
transition={{ duration: 0.6 }}
|
|
className="content-block"
|
|
>
|
|
<h2>Unsere Mission</h2>
|
|
<p>
|
|
Wir möchten IT für alle verständlich machen. Unser Fokus liegt auf praktischen, verständlichen und realistischen Schulungsangeboten für Quereinsteiger und Unternehmen. Dabei setzen wir auf Erfahrung, Ehrlichkeit und moderne Lernmethoden.
|
|
</p>
|
|
</motion.div>
|
|
|
|
<motion.div
|
|
initial={{ opacity: 0, y: 30 }}
|
|
whileInView={{ opacity: 1, y: 0 }}
|
|
viewport={{ once: true }}
|
|
transition={{ duration: 0.6, delay: 0.2 }}
|
|
style={{
|
|
maxWidth: '800px',
|
|
margin: '80px auto',
|
|
textAlign: 'center',
|
|
position: 'relative',
|
|
zIndex: 1
|
|
}}
|
|
>
|
|
<Image
|
|
src="/motorrad.png"
|
|
alt="Motorradfahren"
|
|
width={800}
|
|
height={600}
|
|
style={{
|
|
width: '100%',
|
|
height: 'auto',
|
|
display: 'block',
|
|
borderRadius: '20px',
|
|
border: '1px solid rgba(255, 255, 255, 0.1)'
|
|
}}
|
|
/>
|
|
<p style={{
|
|
marginTop: '30px',
|
|
fontSize: '19px',
|
|
color: 'var(--color-text-secondary)',
|
|
lineHeight: '1.7'
|
|
}}>
|
|
Neben der IT teilen wir beide die Leidenschaft für das Motorradfahren.
|
|
</p>
|
|
</motion.div>
|
|
|
|
<motion.div
|
|
initial={{ opacity: 0, y: 30 }}
|
|
whileInView={{ opacity: 1, y: 0 }}
|
|
viewport={{ once: true }}
|
|
transition={{ duration: 0.6 }}
|
|
className="cta-section"
|
|
>
|
|
<h2>Kontaktieren Sie uns</h2>
|
|
<p>Haben Sie Fragen oder möchten Sie mehr über unsere Angebote erfahren?</p>
|
|
<Link href="/kontakt" className="btn btn-primary btn-large">
|
|
Jetzt Kontakt aufnehmen
|
|
</Link>
|
|
</motion.div>
|
|
</div>
|
|
</section>
|
|
</main>
|
|
<Footer />
|
|
</>
|
|
)
|
|
}
|