matthias/Dev-Landing
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Professionalize landing page design

Browse Source
This commit is contained in:
Matthias Meister
2026-05-05 22:20:09 +02:00
parent add89b0f92
commit 117839058b
13 changed files with 628 additions and 576 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
src/components/cta.tsx
View File

@@ -23,19 +23,18 @@ const trustAnchors = [
export default function CTASection() {
return (
<section className="px-4 pb-16 pt-4 sm:px-6 lg:px-8 lg:pb-24">
<div className="mx-auto max-w-6xl border-y border-border/80 py-8 lg:grid lg:grid-cols-[minmax(0,0.95fr)_minmax(0,1.45fr)] lg:gap-12 lg:py-10">
<div className="max-w-md space-y-4">
<section className="px-4 pb-14 sm:px-6 lg:px-8 lg:pb-20">
<div className="mx-auto max-w-6xl border-y border-border/80 py-9 lg:grid lg:grid-cols-[minmax(0,0.82fr)_minmax(0,1.55fr)] lg:gap-14 lg:py-11">
<div className="max-w-md space-y-4 lg:pt-1">
<p className="text-xs font-medium uppercase tracking-[0.18em] text-muted-foreground">
Vertrauensanker
Vor dem Angebot
</p>
<h2 className="text-2xl font-semibold tracking-tight text-balance lg:text-3xl">
Ein gemeinsamer Startpunkt statt leerer Versprechen.
Erst verstehen, dann bauen.
</h2>
<p className="text-base leading-7 text-muted-foreground">
Noch bevor es um Pakete oder Features geht, soll direkt klar sein,
warum diese Zusammenarbeit für regionale Unternehmen greifbar und
verlaesslich wirkt.
Die Zusammenarbeit ist bewusst direkt gehalten: ein Gespräch, eine
klare Empfehlung und ein Vorschlag, der zu Ihrem Betrieb passt.
</p>
</div>
<dl className="mt-8 grid gap-6 sm:grid-cols-3 lg:mt-0 lg:gap-0">
@@ -46,14 +45,14 @@ export default function CTASection() {
"space-y-3",
index === 0
? ""
: "border-t border-border/70 pt-4 sm:border-t-0 sm:border-l sm:pl-6 sm:pt-0 lg:pl-8",
: "border-t border-border/70 pt-5 sm:border-t-0 sm:border-l sm:pl-6 sm:pt-0 lg:pl-8",
)}
>
<dt className="text-sm font-medium text-foreground">
<dt className="text-sm font-semibold text-foreground">
{item.title}
</dt>
<dd className="space-y-2">
<p className="text-lg font-semibold leading-7 text-balance text-foreground">
<p className="text-base font-medium leading-7 text-balance text-foreground lg:text-lg">
{item.description}
</p>
<p className="text-sm leading-6 text-muted-foreground">