Tax Lawfirm Demo 1
This commit is contained in:
@@ -0,0 +1,73 @@
|
||||
'use client'
|
||||
|
||||
import {
|
||||
VerticalTimeline,
|
||||
VerticalTimelineElement,
|
||||
} from 'react-vertical-timeline-component'
|
||||
import 'react-vertical-timeline-component/style.min.css'
|
||||
import {GraduationCap, Briefcase, Building2} from 'lucide-react'
|
||||
|
||||
export function AboutMeSection() {
|
||||
const timeline = [
|
||||
{
|
||||
date: '2010',
|
||||
title: 'Abschluss Bachelor of Laws (LL.B.)',
|
||||
desc: 'Studium der Wirtschaftsjuristik an der Hochschule XYZ.',
|
||||
icon: <GraduationCap className="w-5 h-5"/>,
|
||||
},
|
||||
{
|
||||
date: '2012',
|
||||
title: 'Master Steuerrecht (M.A.)',
|
||||
desc: 'Vertiefung im Bereich nationales und internationales Steuerrecht.',
|
||||
icon: <GraduationCap className="w-5 h-5"/>,
|
||||
},
|
||||
{
|
||||
date: '2014',
|
||||
title: 'Steuerberaterprüfung bestanden',
|
||||
desc: 'Zulassung als Steuerberaterin durch die Steuerberaterkammer ABC.',
|
||||
icon: <Building2 className="w-5 h-5"/>,
|
||||
},
|
||||
{
|
||||
date: '2015–2020',
|
||||
title: 'Tätigkeit in mittelständischer Kanzlei',
|
||||
desc: 'Beratung von Unternehmen, Freiberuflern und Privatpersonen.',
|
||||
icon: <Briefcase className="w-5 h-5"/>,
|
||||
},
|
||||
{
|
||||
date: 'seit 2021',
|
||||
title: 'Eigene Kanzlei in Musterstadt',
|
||||
desc: 'Gründung der Steuerkanzlei Mustermann mit Fokus auf digitale Beratung.',
|
||||
icon: <Briefcase className="w-5 h-5"/>,
|
||||
},
|
||||
]
|
||||
|
||||
return (
|
||||
<section id="about" className="py-20 px-6 bg-white">
|
||||
<div className="max-w-4xl mx-auto">
|
||||
<h2 className="text-3xl font-bold mb-8 text-left">Über mich</h2>
|
||||
<p className="text-lg mb-12 text-left">
|
||||
Als erfahrene Steuerberaterin begleite ich seit über zehn Jahren Mandanten in sämtlichen
|
||||
steuerlichen
|
||||
Fragen – transparent, digital und auf Augenhöhe. Meine Schwerpunkte liegen in der vorausschauenden
|
||||
Steuergestaltung sowie der Begleitung von Gründern und mittelständischen Unternehmen.
|
||||
</p>
|
||||
|
||||
<VerticalTimeline lineColor="#e5e7eb">
|
||||
{timeline.map(({date, title, desc, icon}) => (
|
||||
<VerticalTimelineElement
|
||||
key={date}
|
||||
date={date}
|
||||
icon={icon}
|
||||
iconStyle={{background: '#0f172a', color: '#fff'}}
|
||||
contentStyle={{background: '#f9fafb', color: '#0f172a'}}
|
||||
contentArrowStyle={{borderRight: '7px solid #f9fafb'}}
|
||||
>
|
||||
<h3 className="text-xl font-semibold">{title}</h3>
|
||||
<p className="text-sm text-muted-foreground">{desc}</p>
|
||||
</VerticalTimelineElement>
|
||||
))}
|
||||
</VerticalTimeline>
|
||||
</div>
|
||||
</section>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,72 @@
|
||||
'use client'
|
||||
|
||||
import Image from 'next/image'
|
||||
import {Button} from '@/components/ui/button'
|
||||
import {motion as m, Variants} from 'framer-motion'
|
||||
import Link from 'next/link'
|
||||
|
||||
const containerVariants: Variants = {
|
||||
hidden: {opacity: 0},
|
||||
visible: {
|
||||
opacity: 1,
|
||||
transition: {
|
||||
delay: 0.2,
|
||||
staggerChildren: 0.4,
|
||||
ease: 'easeOut',
|
||||
},
|
||||
},
|
||||
}
|
||||
|
||||
const itemVariants: Variants = {
|
||||
hidden: {opacity: 0, y: 40},
|
||||
visible: {
|
||||
opacity: 1,
|
||||
y: 0,
|
||||
transition: {
|
||||
duration: 0.8,
|
||||
ease: 'easeOut',
|
||||
},
|
||||
},
|
||||
}
|
||||
|
||||
export function HeroSection() {
|
||||
return (
|
||||
<section className="relative h-[80vh] flex items-center text-white">
|
||||
<Image
|
||||
src="/images/hero.jpeg"
|
||||
alt="Steuerkanzlei Hero"
|
||||
fill
|
||||
className="object-cover brightness-[0.4]"
|
||||
priority
|
||||
/>
|
||||
<m.div
|
||||
className="z-10 text-left px-6 md:px-24 max-w-2xl"
|
||||
variants={containerVariants}
|
||||
initial="hidden"
|
||||
animate="visible"
|
||||
>
|
||||
<m.h1
|
||||
className="text-4xl md:text-6xl font-bold leading-tight"
|
||||
variants={itemVariants}
|
||||
>
|
||||
Ihr Partner für<br/>Steuerberatung & Finanzen
|
||||
</m.h1>
|
||||
|
||||
<m.p
|
||||
className="mt-6 text-lg md:text-xl"
|
||||
variants={itemVariants}
|
||||
>
|
||||
Persönlich. Kompetent. Transparent.
|
||||
</m.p>
|
||||
|
||||
<m.div className="mt-8" variants={itemVariants}>
|
||||
<Link href="/kontakt">
|
||||
<Button size="lg" variant="secondary">
|
||||
Jetzt Kontakt aufnehmen
|
||||
</Button>
|
||||
</Link>
|
||||
</m.div>
|
||||
</m.div>
|
||||
</section>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,98 @@
|
||||
'use client'
|
||||
|
||||
import {Briefcase, BookOpen, Building2, User, Coins, ReceiptText} from 'lucide-react'
|
||||
import {motion as m, Variants} from 'framer-motion'
|
||||
|
||||
const containerVariants: Variants = {
|
||||
hidden: {},
|
||||
visible: {
|
||||
transition: {
|
||||
staggerChildren: 0.2,
|
||||
delayChildren: 0.1,
|
||||
},
|
||||
},
|
||||
}
|
||||
|
||||
const cardVariants: Variants = {
|
||||
hidden: {opacity: 0, y: 30},
|
||||
visible: {
|
||||
opacity: 1,
|
||||
y: 0,
|
||||
transition: {
|
||||
duration: 0.5,
|
||||
ease: 'easeOut',
|
||||
},
|
||||
},
|
||||
}
|
||||
|
||||
export function ServicesSection() {
|
||||
const services = [
|
||||
{
|
||||
title: 'Einkommensteuer',
|
||||
subtitle: 'Privatpersonen',
|
||||
desc: 'Beratung und Erstellung Ihrer jährlichen Einkommensteuererklärung – digital und unkompliziert.',
|
||||
icon: <User className="w-6 h-6 text-primary"/>,
|
||||
},
|
||||
{
|
||||
title: 'Jahresabschlüsse',
|
||||
subtitle: 'Unternehmen',
|
||||
desc: 'Erstellung von Handels- und Steuerbilanzen für Einzelunternehmen, GmbH & Co. KG oder Kapitalgesellschaften.',
|
||||
icon: <BookOpen className="w-6 h-6 text-primary"/>,
|
||||
},
|
||||
{
|
||||
title: 'Lohnbuchhaltung',
|
||||
subtitle: 'Mitarbeiterabrechnung',
|
||||
desc: 'Abwicklung Ihrer Lohn- und Gehaltsabrechnungen – pünktlich, zuverlässig und digital.',
|
||||
icon: <Coins className="w-6 h-6 text-primary"/>,
|
||||
},
|
||||
{
|
||||
title: 'Existenzgründung',
|
||||
subtitle: 'Startups & Gründer',
|
||||
desc: 'Von der Idee zum Business – steuerliche Beratung, Businessplan und Gründungszuschuss-Anträge.',
|
||||
icon: <Briefcase className="w-6 h-6 text-primary"/>,
|
||||
},
|
||||
{
|
||||
title: 'Unternehmensnachfolge',
|
||||
subtitle: 'Übergabe & Erbe',
|
||||
desc: 'Beratung zur steuerlich optimalen Übergabe an Familie oder Käufer. Langfristige Planung inklusive.',
|
||||
icon: <Building2 className="w-6 h-6 text-primary"/>,
|
||||
},
|
||||
{
|
||||
title: 'Finanzbuchhaltung',
|
||||
subtitle: 'GoBD & DATEV-konform',
|
||||
desc: 'Digitale Finanzbuchhaltung inkl. Belegtransfer, OPOS und monatlichen Auswertungen.',
|
||||
icon: <ReceiptText className="w-6 h-6 text-primary"/>,
|
||||
},
|
||||
]
|
||||
|
||||
return (
|
||||
<section id="leistungen" className="py-20 px-6 bg-muted/50">
|
||||
<div className="max-w-6xl mx-auto text-left">
|
||||
<h2 className="text-3xl font-bold mb-12 text-center">Unsere Leistungen</h2>
|
||||
|
||||
<m.div
|
||||
className="grid md:grid-cols-2 gap-10"
|
||||
variants={containerVariants}
|
||||
initial="hidden"
|
||||
whileInView="visible"
|
||||
viewport={{once: true, amount: 0.2}}
|
||||
>
|
||||
{services.map(({title, subtitle, desc, icon}) => (
|
||||
<m.div
|
||||
key={title}
|
||||
variants={cardVariants}
|
||||
className="p-6 bg-white rounded-xl shadow-sm hover:shadow-md border flex gap-4"
|
||||
>
|
||||
<div className="mt-1">{icon}</div>
|
||||
<div>
|
||||
<h3 className="text-xl font-semibold">{title}</h3>
|
||||
<p className="text-sm text-muted-foreground mb-1">{subtitle}</p>
|
||||
<p className="text-sm">{desc}</p>
|
||||
</div>
|
||||
</m.div>
|
||||
))}
|
||||
</m.div>
|
||||
</div>
|
||||
</section>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,69 @@
|
||||
'use client'
|
||||
|
||||
import {
|
||||
Globe,
|
||||
Briefcase,
|
||||
Building2,
|
||||
Landmark,
|
||||
Lightbulb,
|
||||
PiggyBank,
|
||||
Users
|
||||
} from 'lucide-react'
|
||||
|
||||
export function SpecialServicesSection() {
|
||||
const items = [
|
||||
{
|
||||
title: 'Grenzgängerberatung',
|
||||
desc: 'Spezialisierte Beratung für grenzüberschreitende Einkommen und Arbeitsverhältnisse.',
|
||||
icon: <Globe className="w-8 h-8 text-primary"/>,
|
||||
},
|
||||
{
|
||||
title: 'Beratung von Existenzgründern',
|
||||
desc: 'Von der Geschäftsidee über den Businessplan bis zur steuerlichen Erfassung.',
|
||||
icon: <Briefcase className="w-8 h-8 text-primary"/>,
|
||||
},
|
||||
{
|
||||
title: 'Immobilienkaufberatung',
|
||||
desc: 'Begleitung beim Immobilienkauf – steuerliche Optimierung inklusive.',
|
||||
icon: <Building2 className="w-8 h-8 text-primary"/>,
|
||||
},
|
||||
{
|
||||
title: 'Begleitung bei Bankgesprächen',
|
||||
desc: 'Vorbereitung und Teilnahme an Finanzierungsgesprächen mit Ihrer Bank.',
|
||||
icon: <Landmark className="w-8 h-8 text-primary"/>,
|
||||
},
|
||||
{
|
||||
title: 'Steuergestaltung und -planung',
|
||||
desc: 'Vorausschauende Steueroptimierung für Unternehmen und Privatpersonen.',
|
||||
icon: <Lightbulb className="w-8 h-8 text-primary"/>,
|
||||
},
|
||||
{
|
||||
title: 'Betriebsprüfung begleiten',
|
||||
desc: 'Strategische Vorbereitung und persönliche Begleitung von Außenprüfungen.',
|
||||
icon: <Users className="w-8 h-8 text-primary"/>,
|
||||
},
|
||||
{
|
||||
title: 'Vererben & Schenken',
|
||||
desc: 'Steuerliche Gestaltung und Begleitung von Vermögensübertragungen.',
|
||||
icon: <PiggyBank className="w-8 h-8 text-primary"/>,
|
||||
},
|
||||
]
|
||||
|
||||
return (
|
||||
<section id="special-services" className="py-20 px-6 bg-muted/50 text-center">
|
||||
<h2 className="text-3xl font-bold mb-12">Spezialleistungen</h2>
|
||||
<div className="grid md:grid-cols-3 gap-8 max-w-6xl mx-auto text-left">
|
||||
{items.map(({title, desc, icon}) => (
|
||||
<div
|
||||
key={title}
|
||||
className="bg-white p-6 rounded-xl shadow-sm hover:shadow-md transition"
|
||||
>
|
||||
<div className="mb-4 flex justify-center">{icon}</div>
|
||||
<h3 className="text-xl font-semibold mb-2 text-center">{title}</h3>
|
||||
<p className="text-sm text-muted-foreground text-center">{desc}</p>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</section>
|
||||
)
|
||||
}
|
||||
Reference in New Issue
Block a user