70 lines
2.6 KiB
TypeScript
70 lines
2.6 KiB
TypeScript
'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>
|
||
)
|
||
}
|