blog design

This commit is contained in:
2026-01-29 21:13:54 +01:00
parent ec0a055c13
commit eafb740b1d
14 changed files with 291 additions and 385 deletions

View File

@@ -1,7 +1,8 @@
import * as React from 'react';
import Link from 'next/link';
import { ArrowRight, Minus, Zap, Shield, Clock } from 'lucide-react';
import { ArrowRight, Zap, Shield } from 'lucide-react';
import { Reveal } from '../src/components/Reveal';
import { Section } from '../src/components/Section';
export default function LandingPage() {
return (
@@ -48,12 +49,10 @@ export default function LandingPage() {
</section>
{/* Was ich mache - Designed Grid */}
<section className="narrow-container relative">
<div className="absolute -right-24 -top-12 text-[15rem] font-bold text-slate-50 select-none -z-10">01</div>
<Section number="01" title="Das Versprechen" numberPosition="right">
<div className="grid grid-cols-1 md:grid-cols-12 gap-12">
<div className="md:col-span-5 space-y-8">
<Reveal>
<h2 className="text-sm font-bold uppercase tracking-[0.3em] text-slate-400">Das Versprechen</h2>
<p className="text-4xl font-bold text-slate-900 leading-[1.1]">
Direkt. <br />
Sauber. <br />
@@ -87,13 +86,10 @@ export default function LandingPage() {
</div>
</div>
</div>
</section>
</Section>
{/* Comparison - Visual Path */}
<section className="narrow-container relative">
<div className="absolute -left-24 -top-12 text-[15rem] font-bold text-slate-50 select-none -z-10">02</div>
<h2 className="text-sm font-bold uppercase tracking-[0.3em] text-slate-400 mb-24">Der Unterschied</h2>
<Section number="02" title="Der Unterschied">
<div className="space-y-32">
{/* Row 1 */}
<Reveal>
@@ -132,15 +128,13 @@ export default function LandingPage() {
</div>
</Reveal>
</div>
</section>
</Section>
{/* Für wen - Designed Box */}
<section className="narrow-container relative">
<div className="absolute -right-24 -top-12 text-[15rem] font-bold text-slate-50 select-none -z-10">03</div>
<Section number="03" title="Zielgruppe" numberPosition="right">
<Reveal>
<div className="relative p-12 md:p-24 border border-slate-100">
<div className="absolute top-0 left-12 w-px h-24 bg-slate-900 -translate-y-12"></div>
<h2 className="text-sm font-bold uppercase tracking-[0.3em] text-slate-400 mb-12">Zielgruppe</h2>
<p className="text-4xl md:text-5xl font-bold text-slate-900 leading-tight mb-16 tracking-tighter">
Für Unternehmen, die <br />
<span className="text-slate-300 underline decoration-slate-100 underline-offset-8">Ergebnisse</span> wollen.
@@ -160,12 +154,10 @@ export default function LandingPage() {
</div>
</div>
</Reveal>
</section>
</Section>
{/* Leistungen - Visual Cards */}
<section className="narrow-container relative">
<div className="absolute -left-24 -top-32 text-[15rem] font-bold text-slate-50 select-none -z-10">04</div>
<h2 className="text-sm font-bold uppercase tracking-[0.3em] text-slate-400 mb-24">Leistungen</h2>
<Section number="04" title="Leistungen">
<div className="grid grid-cols-1 gap-32">
<Reveal>
<div className="group relative">
@@ -198,8 +190,7 @@ export default function LandingPage() {
</div>
</Reveal>
</div>
</section>
</Section>
</div>
);
}