103 lines
No EOL
6.6 KiB
PHP
103 lines
No EOL
6.6 KiB
PHP
<section class="py-20 px-4 bg-background">
|
|
<div class="max-w-7xl mx-auto">
|
|
<div class="grid lg:grid-cols-2 gap-16 items-center">
|
|
<div class="relative order-2 lg:order-1">
|
|
<div class="card-elevated rounded-3xl p-12">
|
|
<div class="text-center mb-8">
|
|
<div class="w-20 h-20 mx-auto rounded-full bg-gradient-to-br from-primary to-primary/60 flex items-center justify-center mb-6">
|
|
<svg class="w-10 h-10 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 7h8m0 0v8m0-8l-8 8-4-4-6 6"/>
|
|
</svg>
|
|
</div>
|
|
<h3 class="text-2xl font-semibold text-foreground mb-4">
|
|
Lifetime-Vergütung
|
|
</h3>
|
|
</div>
|
|
|
|
<div class="space-y-6">
|
|
<div class="bg-accent/30 rounded-xl p-6">
|
|
<div class="flex justify-between items-center mb-2">
|
|
<span class="text-sm text-muted-foreground">Erstverkauf</span>
|
|
<span class="text-lg font-semibold text-primary">3.5%</span>
|
|
</div>
|
|
<div class="w-full bg-accent/50 rounded-full h-2">
|
|
<div class="bg-primary h-2 rounded-full w-[35%]"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="bg-accent/30 rounded-xl p-6">
|
|
<div class="flex justify-between items-center mb-2">
|
|
<span class="text-sm text-muted-foreground">Folgegeschäfte</span>
|
|
<span class="text-lg font-semibold text-primary">1.5%</span>
|
|
</div>
|
|
<div class="w-full bg-accent/50 rounded-full h-2">
|
|
<div class="bg-primary h-2 rounded-full w-[15%]"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="text-center pt-4">
|
|
<p class="text-sm text-muted-foreground">
|
|
Kontinuierliche Erträge über die gesamte Kundenbeziehung
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="space-y-8 order-1 lg:order-2">
|
|
<div>
|
|
<div class="inline-flex items-center gap-2 bg-primary/10 text-primary px-4 py-2 rounded-full text-sm font-medium mb-6">
|
|
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 21V5a2 2 0 00-2-2H7a2 2 0 00-2 2v16m14 0h2m-2 0h-5m-9 0H3m2 0h5M9 7h1m-1 4h1m4-4h1m-1 4h1m-5 10v-5a1 1 0 011-1h2a1 1 0 011 1v5m-4 0h4"/>
|
|
</svg>
|
|
Für Makler
|
|
</div>
|
|
|
|
<h2 class="text-4xl lg:text-5xl font-light text-foreground mb-6">
|
|
Lifetime <span class="text-primary">Vergütung</span> für Makler
|
|
</h2>
|
|
|
|
<p class="text-xl text-muted-foreground leading-relaxed">
|
|
Profitieren Sie von einem revolutionären Vergütungsmodell, das über
|
|
den einmaligen Verkauf hinausgeht. Bauen Sie langfristige Kundenbeziehungen
|
|
auf und generieren Sie kontinuierliche Erträge.
|
|
</p>
|
|
</div>
|
|
|
|
<div class="space-y-6">
|
|
@foreach($this->benefits as $benefit)
|
|
<div class="flex gap-4">
|
|
<div class="flex-shrink-0 w-12 h-12 rounded-xl bg-primary/10 flex items-center justify-center">
|
|
@if($benefit['icon'] === 'trending-up')
|
|
<svg class="w-6 h-6 text-primary" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 7h8m0 0v8m0-8l-8 8-4-4-6 6"/>
|
|
</svg>
|
|
@elseif($benefit['icon'] === 'clock')
|
|
<svg class="w-6 h-6 text-primary" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"/>
|
|
</svg>
|
|
@elseif($benefit['icon'] === 'target')
|
|
<svg class="w-6 h-6 text-primary" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17.657 18.657A8 8 0 016.343 7.343S7 9 9 10c0-2 1.657-2.657 1.657-2.657A8 8 0 0118.657 17.657zM12 12l1 1"/>
|
|
</svg>
|
|
@else
|
|
<svg class="w-6 h-6 text-primary" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4M7.835 4.697a3.42 3.42 0 001.946-.806 3.42 3.42 0 014.438 0 3.42 3.42 0 001.946.806 3.42 3.42 0 013.138 3.138 3.42 3.42 0 00.806 1.946 3.42 3.42 0 010 4.438 3.42 3.42 0 00-.806 1.946 3.42 3.42 0 01-3.138 3.138 3.42 3.42 0 00-1.946.806 3.42 3.42 0 01-4.438 0 3.42 3.42 0 00-1.946-.806 3.42 3.42 0 01-3.138-3.138 3.42 3.42 0 00-.806-1.946 3.42 3.42 0 010-4.438 3.42 3.42 0 00.806-1.946 3.42 3.42 0 013.138-3.138z"/>
|
|
</svg>
|
|
@endif
|
|
</div>
|
|
<div>
|
|
<h3 class="text-lg font-semibold text-foreground mb-2">
|
|
{{ $benefit['title'] }}
|
|
</h3>
|
|
<p class="text-muted-foreground">
|
|
{{ $benefit['description'] }}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
@endforeach
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section> |