This commit is contained in:
2026-01-30 22:33:29 +01:00
parent 615e8b4b4b
commit 6beaf3c0aa
2 changed files with 360 additions and 26 deletions

View File

@@ -5,14 +5,14 @@ import { PageHeader } from '../../src/components/PageHeader';
import { Reveal } from '../../src/components/Reveal';
import { Section } from '../../src/components/Section';
import {
ConceptSystem,
ConceptCode,
ConceptWebsite,
ConceptAutomation,
ConceptCommunication,
ConceptMessy,
ConceptTarget
} from '../../src/components/Landing/Illustrations';
SystemArchitecture,
SpeedPerformance,
SolidFoundation,
LayerSeparation,
DirectService,
AgencyChaos,
TaskDone
} from '../../src/components/Landing/Illustrations/WebsitesDescriptive';
import { motion } from 'framer-motion';
export default function WebsitesPage() {
@@ -24,7 +24,7 @@ export default function WebsitesPage() {
backgroundSize: '80px 80px'
}} />
<PageHeader
<PageHeader
title={<>Websites, die <br /><span className="text-slate-300">einfach funktionieren.</span></>}
description="Die meisten Websites funktionieren. Bis jemand sie anfasst. Ich baue Websites so, dass das alles egal ist."
backLink={{ href: '/', label: 'Zurück' }}
@@ -36,13 +36,13 @@ export default function WebsitesPage() {
number="01"
title="Der Ansatz"
borderTop
illustration={<ConceptSystem className="w-16 h-16" />}
illustration={<SystemArchitecture className="w-32 h-32" />}
>
<div className="space-y-12">
<Reveal>
<h3 className="text-3xl md:text-5xl font-bold text-slate-900 leading-tight tracking-tight max-w-3xl">
Ich baue Websites wie Systeme <br />
<span className="text-slate-300 font-serif italic">nicht wie Broschüren.</span>
<span className="text-slate-300">nicht wie Broschüren.</span>
</h3>
</Reveal>
<Reveal delay={0.2}>
@@ -74,13 +74,13 @@ export default function WebsitesPage() {
number="02"
title="Performance"
borderTop
illustration={<ConceptTarget className="w-16 h-16" />}
illustration={<SpeedPerformance className="w-32 h-32" />}
>
<div className="space-y-12">
<Reveal>
<h3 className="text-3xl md:text-5xl font-bold text-slate-900 leading-tight tracking-tight max-w-3xl">
Geschwindigkeit ist <br />
<span className="text-slate-300 font-serif italic">kein Extra. Sie ist Standard.</span>
<span className="text-slate-300">kein Extra. Sie ist Standard.</span>
</h3>
</Reveal>
<Reveal delay={0.2}>
@@ -119,13 +119,13 @@ export default function WebsitesPage() {
number="03"
title="Wartungsfrei"
borderTop
illustration={<ConceptCode className="w-16 h-16" />}
illustration={<SolidFoundation className="w-32 h-32" />}
>
<div className="space-y-12">
<Reveal>
<h3 className="text-3xl md:text-5xl font-bold text-slate-900 leading-tight tracking-tight max-w-3xl">
Keine Plugins. <br />
<span className="text-slate-300 font-serif italic">Keine Wartungshölle.</span>
<span className="text-slate-300">Keine Wartungshölle.</span>
</h3>
</Reveal>
<Reveal delay={0.2}>
@@ -154,13 +154,13 @@ export default function WebsitesPage() {
number="04"
title="Inhalte"
borderTop
illustration={<ConceptAutomation className="w-16 h-16" />}
illustration={<LayerSeparation className="w-32 h-32" />}
>
<div className="space-y-12">
<Reveal>
<h3 className="text-3xl md:text-5xl font-bold text-slate-900 leading-tight tracking-tight max-w-3xl">
Inhalte & Technik <br />
<span className="text-slate-300 font-serif italic">sind getrennt. Absichtlich.</span>
<span className="text-slate-300">sind getrennt. Absichtlich.</span>
</h3>
</Reveal>
<Reveal delay={0.2}>
@@ -196,13 +196,13 @@ export default function WebsitesPage() {
number="05"
title="Service"
borderTop
illustration={<ConceptCommunication className="w-16 h-16" />}
illustration={<DirectService className="w-32 h-32" />}
>
<div className="space-y-12">
<Reveal>
<h3 className="text-3xl md:text-5xl font-bold text-slate-900 leading-tight tracking-tight max-w-3xl">
Änderungen sind <br />
<span className="text-slate-300 font-serif italic">einfach. Wirklich.</span>
<span className="text-slate-300">einfach. Wirklich.</span>
</h3>
</Reveal>
<Reveal delay={0.2}>
@@ -233,13 +233,13 @@ export default function WebsitesPage() {
number="06"
title="Warum"
borderTop
illustration={<ConceptMessy className="w-16 h-16" />}
illustration={<AgencyChaos className="w-32 h-32" />}
>
<div className="space-y-12">
<Reveal>
<h3 className="text-3xl md:text-5xl font-bold text-slate-900 leading-tight tracking-tight max-w-3xl">
15 Jahre Agenturen <br />
<span className="text-slate-300 font-serif italic">waren genug.</span>
<span className="text-slate-300">waren genug.</span>
</h3>
</Reveal>
<Reveal delay={0.2}>
@@ -252,17 +252,18 @@ export default function WebsitesPage() {
</Section>
{/* Result */}
<Section
number="07"
<Section
number="07"
title="Ergebnis"
borderTop
variant="gray"
illustration={<TaskDone className="w-32 h-32" />}
>
<div className="space-y-16">
<Reveal>
<h2 className="text-5xl md:text-7xl font-bold text-slate-900 tracking-tighter leading-[0.9]">
<h2 className="text-5xl md:text-8xl font-bold text-slate-900 tracking-tighter leading-[0.9]">
Eine Website, die sich wie eine <br />
<span className="text-slate-300 font-serif italic">erledigte Aufgabe</span> anfühlt.
<span className="text-slate-300">erledigte Aufgabe</span> anfühlt.
</h2>
</Reveal>
@@ -282,7 +283,7 @@ export default function WebsitesPage() {
</div>
<Reveal delay={0.4}>
<div className="pt-16 border-t border-slate-100 flex flex-col md:flex-row justify-between items-start md:items-center gap-8">
<div className="pt-16 border-t border-slate-200 flex flex-col md:flex-row justify-between items-start md:items-center gap-8">
<div className="space-y-2">
<div className="text-[10px] font-bold uppercase tracking-[0.3em] text-slate-400">Technik</div>
<p className="text-slate-500 font-serif italic text-lg">