WEBklar/Kirschner-Geb-udeservice
4
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Weniger Text, mehr Bild: Schablonen-Elemente entfernt

Browse Source 
Über-uns-Block mit Kennzahlen, Zielgruppen-Leiste, Eyebrow-Labels,
Pillen, Checklisten und reine Textsektionen entfernt. Hero auf
Headline, eine Zeile und zwei Buttons reduziert. Unterseiten mit
Foto im Kopf, Philosophie über Fassadenbild mit Parallax, Layout
breiter (max. 1680px).

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
NotPika69andClaude Opus 5.5 committed 2026-09-30 21:07:20 +02:00
1 parent 62916fc179
commit ba44dc3f0a
31 files changed
+227 -591
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

leistungen.html
+23 -59
View File
@@ -52,100 +52,73 @@
</div>
<main id="inhalt">
<section class="page-hero">
<section class="page-hero page-hero--image">
<div class="hero__media"><picture><source type="image/avif" srcset="assets/img/seil-800.avif 800w, assets/img/seil-1600.avif 1600w" sizes="100vw"><source type="image/webp" srcset="assets/img/seil-800.webp 800w, assets/img/seil-1600.webp 1600w" sizes="100vw"><img src="assets/img/seil-1600.webp" width="1600" height="1200" alt="" fetchpriority="high"></picture></div>
<svg class="hero__chevrons" viewBox="0 0 600 400" preserveAspectRatio="xMidYMid meet" aria-hidden="true"><path pathLength="1" d="M300 0 L100 200 L300 400"/><path pathLength="1" d="M430 0 L230 200 L430 400"/><path pathLength="1" d="M560 0 L360 200 L560 400"/></svg>
<div class="wrap page-hero__grid">
<h1 class="display" data-split>Leistungen</h1>
<div class="stack">
<p class="eyebrow" data-hero>Leistungen</p>
<h1 class="display" data-split>Ein Team. Jedes Gewerk.</h1>
</div>
<div class="stack">
<p class="lead" data-hero>Klassische Hausmeisterdienste und spezialisierte Leistungen — einzeln buchbar oder als Rundum-Betreuung für Ihr Objekt.</p>
<p class="lead" data-hero>Für Privat, Eigentümergemeinschaften, Gewerbe und die öffentliche Hand.</p>
<div class="btn-row" data-hero><a class="btn" href="mailto:info@kirschner-service.de?subject=Angebotsanfrage&body=Guten%20Tag%2C%0A%0Aich%20interessiere%20mich%20f%C3%BCr%20Ihre%20Leistungen.%0A%0AObjekt%20/%20Adresse%3A%0AGew%C3%BCnschte%20Leistungen%3A%0ATelefon%20f%C3%BCr%20R%C3%BCckruf%3A%0A%0AViele%20Gr%C3%BC%C3%9Fe%0A">Angebot anfragen <svg class="btn__arrow" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="square" aria-hidden="true"><path d="M4 12h15M13 6l6 6-6 6"/></svg></a></div>
</div>
</div>
</section>
<section class="section theme-light" aria-labelledby="scope-title">
<div class="wrap">
<div class="section-head">
<p class="eyebrow" data-reveal>Leistungsumfang</p>
<h2 class="display" id="scope-title" data-split>Für private und gewerbliche Objekte.</h2>
</div>
<div class="switch" role="tablist" aria-label="Objektart" data-reveal>
<span class="switch__pill" aria-hidden="true"></span>
<button class="switch__btn" role="tab" id="tab-gewerbe" aria-selected="true" aria-controls="scope-gewerbe" type="button">Gewerbe &amp; Wohnanlagen</button>
<button class="switch__btn" role="tab" id="tab-privat" aria-selected="false" aria-controls="scope-privat" tabindex="-1" type="button">Privat</button>
</div>
<div class="scope-lists">
<ul class="scope-list" role="tabpanel" id="scope-gewerbe" aria-labelledby="tab-gewerbe"><li>Technische Hausbetreuung</li><li>Innenreinigung</li><li>Außenreinigung</li><li>Pflege von Grünanlagen</li><li>Winterdienst</li><li>Reparaturen</li><li>Renovierungen</li><li>Tiefgaragenreinigung</li><li>Glas- & PV-Reinigung</li><li>24/7-Bereitschaft</li></ul>
<ul class="scope-list" role="tabpanel" id="scope-privat" aria-labelledby="tab-privat" hidden><li>Gartenarbeiten</li><li>Reparaturen</li><li>Renovierungen</li><li>Glas- & PV-Reinigung</li><li>Winterdienst</li></ul>
</div>
</div>
</section>
<section class="section" aria-label="Leistungen im Detail">
<div class="wrap service-rows">
<article class="service-row" id="reinigung">
<div class="service-row__media reveal-img"><picture><source type="image/avif" srcset="assets/img/reinigung-800.avif 800w, assets/img/reinigung-1600.avif 1600w" sizes="(min-width: 960px) 52vw, 100vw"><source type="image/webp" srcset="assets/img/reinigung-800.webp 800w, assets/img/reinigung-1600.webp 1600w" sizes="(min-width: 960px) 52vw, 100vw"><img src="assets/img/reinigung-1600.webp" width="1600" height="1200" alt="Treppenhaus in einem modernen Wohngebäude" loading="lazy" decoding="async"></picture></div>
<div class="service-row__body">
<span class="service-row__num" data-reveal>01</span>
<h3 class="title" data-split>Reinigung</h3>
<p class="muted" data-reveal>Treppenhäuser, Eingangsbereiche, Innen- und Außenflächen — regelmäßig und nach festem Plan. Tiefgaragen reinigen wir mit modernen Maschinen.</p>
<ul class="tags" role="list" data-reveal><li>Treppenhaus</li><li>Innenreinigung</li><li>Außenreinigung</li><li>Tiefgarage</li></ul>
<h2 class="title" data-split>Reinigung</h2>
<p class="muted" data-reveal>Treppenhäuser, Innen- und Außenflächen nach festem Plan. Tiefgaragen mit modernen Maschinen.</p>
</div>
</article>
<article class="service-row" id="glas">
<div class="service-row__media reveal-img"><picture><source type="image/avif" srcset="assets/img/glas-800.avif 800w, assets/img/glas-1600.avif 1600w" sizes="(min-width: 960px) 52vw, 100vw"><source type="image/webp" srcset="assets/img/glas-800.webp 800w, assets/img/glas-1600.webp 1600w" sizes="(min-width: 960px) 52vw, 100vw"><img src="assets/img/glas-1600.webp" width="1600" height="1066" alt="Fensterreinigung mit Teleskopstange an einem Wohnhaus" loading="lazy" decoding="async"></picture></div>
<div class="service-row__body">
<span class="service-row__num" data-reveal>02</span>
<h3 class="title" data-split>Glas- & PV-Reinigung</h3>
<p class="muted" data-reveal>Mit eigener Osmoseanlage und reinem Wasser: streifenfreie Fenster und saubere Photovoltaik-Module — meist sogar ohne Hebebühne.</p>
<ul class="tags" role="list" data-reveal><li>Osmoseanlage</li><li>Fenster & Fassadenglas</li><li>Photovoltaik</li><li>meist ohne Hebebühne</li></ul>
<h2 class="title" data-split>Glas- & PV-Reinigung</h2>
<p class="muted" data-reveal>Mit eigener Osmoseanlage und reinem Wasser — meist sogar ohne Hebebühne.</p>
</div>
</article>
<article class="service-row" id="garten">
<div class="service-row__media reveal-img"><picture><source type="image/avif" srcset="assets/img/garten-800.avif 800w, assets/img/garten-1600.avif 1600w" sizes="(min-width: 960px) 52vw, 100vw"><source type="image/webp" srcset="assets/img/garten-800.webp 800w, assets/img/garten-1600.webp 1600w" sizes="(min-width: 960px) 52vw, 100vw"><img src="assets/img/garten-1600.webp" width="1600" height="1066" alt="Heckenschnitt in einer Gartenanlage" loading="lazy" decoding="async"></picture></div>
<div class="service-row__body">
<span class="service-row__num" data-reveal>03</span>
<h3 class="title" data-split>Garten- & Grünpflege</h3>
<p class="muted" data-reveal>Rasen, Hecken, Beete und Grünanlagen — gepflegt über das ganze Jahr, damit Ihr Objekt schon von außen einen guten Eindruck macht.</p>
<ul class="tags" role="list" data-reveal><li>Rasenpflege</li><li>Heckenschnitt</li><li>Grünanlagen</li><li>Gartenarbeiten</li></ul>
<h2 class="title" data-split>Garten- & Grünpflege</h2>
<p class="muted" data-reveal>Rasen, Hecken, Beete und Grünanlagen, das ganze Jahr über.</p>
</div>
</article>
<article class="service-row" id="technik">
<div class="service-row__media reveal-img"><picture><source type="image/avif" srcset="assets/img/technik-800.avif 800w, assets/img/technik-1600.avif 1600w" sizes="(min-width: 960px) 52vw, 100vw"><source type="image/webp" srcset="assets/img/technik-800.webp 800w, assets/img/technik-1600.webp 1600w" sizes="(min-width: 960px) 52vw, 100vw"><img src="assets/img/technik-1600.webp" width="1600" height="1065" alt="Rohrleitungen einer Haustechnikanlage" loading="lazy" decoding="async"></picture></div>
<div class="service-row__body">
<span class="service-row__num" data-reveal>04</span>
<h3 class="title" data-split>Technische Hausbetreuung</h3>
<p class="muted" data-reveal>Kontrolle und Wartung technischer Anlagen, regelmäßige Rundgänge und ein wacher Blick, bevor aus Kleinigkeiten teure Schäden werden.</p>
<ul class="tags" role="list" data-reveal><li>Anlagenkontrolle</li><li>Wartung</li><li>Objektrundgänge</li></ul>
<h2 class="title" data-split>Technische Hausbetreuung</h2>
<p class="muted" data-reveal>Kontrolle und Wartung technischer Anlagen.</p>
</div>
</article>
<article class="service-row" id="reparatur">
<div class="service-row__media reveal-img"><picture><source type="image/avif" srcset="assets/img/reparatur-800.avif 800w, assets/img/reparatur-1600.avif 1600w" sizes="(min-width: 960px) 52vw, 100vw"><source type="image/webp" srcset="assets/img/reparatur-800.webp 800w, assets/img/reparatur-1600.webp 1600w" sizes="(min-width: 960px) 52vw, 100vw"><img src="assets/img/reparatur-1600.webp" width="1600" height="1067" alt="Handwerker bei der Arbeit mit einem Akkuschrauber" loading="lazy" decoding="async"></picture></div>
<div class="service-row__body">
<span class="service-row__num" data-reveal>05</span>
<h3 class="title" data-split>Reparaturen & Renovierungen</h3>
<p class="muted" data-reveal>Handwerkliches Können im eigenen Team — vom Schreiner bis zum Servicetechniker. Kleine Reparaturen erledigen wir direkt, größere planen wir mit Ihnen.</p>
<ul class="tags" role="list" data-reveal><li>Reparaturen</li><li>Renovierungen</li><li>Schreinerarbeiten</li></ul>
<h2 class="title" data-split>Reparaturen & Renovierungen</h2>
<p class="muted" data-reveal>Handwerk im eigenen Team — vom Servicetechniker bis zum Schreiner.</p>
</div>
</article>
<article class="service-row" id="winter">
<div class="service-row__media reveal-img"><picture><source type="image/avif" srcset="assets/img/winter-800.avif 800w, assets/img/winter-1600.avif 1600w" sizes="(min-width: 960px) 52vw, 100vw"><source type="image/webp" srcset="assets/img/winter-800.webp 800w, assets/img/winter-1600.webp 1600w" sizes="(min-width: 960px) 52vw, 100vw"><img src="assets/img/winter-1600.webp" width="1600" height="1061" alt="Schneeräumung vor einem Gebäude" loading="lazy" decoding="async"></picture></div>
<div class="service-row__body">
<span class="service-row__num" data-reveal>06</span>
<h3 class="title" data-split>Winterdienst</h3>
<p class="muted" data-reveal>Räumen und Streuen mit eigenen Fahrzeugen, damit Wege, Zufahrten und Eingänge bei Schnee und Eis sicher bleiben.</p>
<ul class="tags" role="list" data-reveal><li>Räumdienst</li><li>Streudienst</li><li>eigene Fahrzeuge</li></ul>
<h2 class="title" data-split>Winterdienst</h2>
<p class="muted" data-reveal>Räumen und Streuen mit eigenen Fahrzeugen.</p>
</div>
</article>
<article class="service-row" id="bereitschaft">
<div class="service-row__media reveal-img"><picture><source type="image/avif" srcset="assets/img/bereitschaft-800.avif 800w, assets/img/bereitschaft-1600.avif 1600w" sizes="(min-width: 960px) 52vw, 100vw"><source type="image/webp" srcset="assets/img/bereitschaft-800.webp 800w, assets/img/bereitschaft-1600.webp 1600w" sizes="(min-width: 960px) 52vw, 100vw"><img src="assets/img/bereitschaft-1600.webp" width="1600" height="1066" alt="Reinigung einer Glasfassade am Abend" loading="lazy" decoding="async"></picture></div>
<div class="service-row__body">
<span class="service-row__num" data-reveal>07</span>
<h3 class="title" data-split>24/7-Bereitschaft</h3>
<p class="muted" data-reveal>Auf Wunsch sind wir rund um die Uhr erreichbar. Wenn es brennt, erreichen Sie uns über den Notruf — auch nachts und am Wochenende.</p>
<ul class="tags" role="list" data-reveal><li>rund um die Uhr</li><li>Notruf</li><li>auf Wunsch</li></ul>
<h2 class="title" data-split>24/7-Bereitschaft</h2>
<p class="muted" data-reveal>Auf Wunsch rund um die Uhr erreichbar — Notruf 0160 / 836 57 53.</p>
</div>
</article>
</div>
@@ -154,35 +127,26 @@
<section class="section theme-light" aria-labelledby="dl-title">
<div class="wrap">
<div class="section-head">
<p class="eyebrow" data-reveal>Leistungsverzeichnis</p>
<h2 class="display" id="dl-title" data-split>Alles schwarz auf weiß.</h2>
<p class="lead" data-reveal>Eine detaillierte Aufstellung unserer Dienstleistungen finden Sie in unseren Leistungsverzeichnissen.</p>
<h2 class="display" id="dl-title" data-split>Zum Download</h2>
</div>
<div class="downloads">
<a class="download" href="assets/docs/Leistungsverzeichnis-Wohnanlage.pdf" download data-reveal><span class="download__icon">PDF</span><span><b>Leistungsverzeichnis Wohnanlage</b><span>PDF · 1,4 MB</span></span><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="square" aria-hidden="true"><path d="M12 4v13M6 11l6 6 6-6M5 21h14"/></svg></a>
<a class="download" href="assets/docs/Leistungsverzeichnis-Tiefgarage.pdf" download data-reveal><span class="download__icon">PDF</span><span><b>Leistungsverzeichnis Tiefgarage</b><span>PDF · 400 KB</span></span><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="square" aria-hidden="true"><path d="M12 4v13M6 11l6 6 6-6M5 21h14"/></svg></a>
</div>
<div class="section-head mt-6" style="margin-bottom:0">
<p class="eyebrow" data-reveal>Referenzen</p>
<p class="title" data-reveal>Wir betreuen Wohnanlagen, Gewerbeanlagen und kommunale Objekte in Landshut. Auf Wunsch nennen wir Ihnen gern Referenzobjekte.</p>
</div>
<p class="muted mt-4" data-reveal>Referenzobjekte in Landshut nennen wir Ihnen gern auf Anfrage.</p>
</div>
</section>
<section class="section " aria-labelledby="cta-title">
<div class="wrap cta-final">
<div class="stack">
<p class="eyebrow" data-reveal>Kontakt</p>
<h2 class="display" id="cta-title" data-split>Sie wünschen ein Angebot?</h2>
<p class="lead" data-reveal>Sprechen Sie uns an — wir schauen uns Ihr Objekt an und unterbreiten Ihnen ein Angebot, das zu Ihnen passt.</p>
<div class="btn-row mt-2" data-reveal>
<a class="btn" href="mailto:info@kirschner-service.de?subject=Angebotsanfrage&body=Guten%20Tag%2C%0A%0Aich%20interessiere%20mich%20f%C3%BCr%20Ihre%20Leistungen.%0A%0AObjekt%20/%20Adresse%3A%0AGew%C3%BCnschte%20Leistungen%3A%0ATelefon%20f%C3%BCr%20R%C3%BCckruf%3A%0A%0AViele%20Gr%C3%BC%C3%9Fe%0A">Angebot per E-Mail <svg class="btn__arrow" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="square" aria-hidden="true"><path d="M4 12h15M13 6l6 6-6 6"/></svg></a>
</div>
<h2 class="display" id="cta-title" data-split>Angebot anfragen</h2>
<p class="lead" data-reveal>Wir schauen uns Ihr Objekt an und machen Ihnen ein Angebot.</p>
</div>
<div class="contact-lines" data-reveal>
<a class="contact-line" href="tel:+4987114269101"><span><small>Büro</small><strong>0871 / 14 26 91 01</strong></span><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="square" aria-hidden="true"><path d="M4 12h15M13 6l6 6-6 6"/></svg></a>
<a class="contact-line" href="tel:+491608365753"><span><small>Notruf 24/7</small><strong>0160 / 836 57 53</strong></span><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="square" aria-hidden="true"><path d="M4 12h15M13 6l6 6-6 6"/></svg></a>
<a class="contact-line" href="mailto:info@kirschner-service.de"><span><small>E-Mail</small><strong>info@kirschner-service.de</strong></span><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="square" aria-hidden="true"><path d="M4 12h15M13 6l6 6-6 6"/></svg></a>
<a class="contact-line" href="mailto:info@kirschner-service.de?subject=Angebotsanfrage&body=Guten%20Tag%2C%0A%0Aich%20interessiere%20mich%20f%C3%BCr%20Ihre%20Leistungen.%0A%0AObjekt%20/%20Adresse%3A%0AGew%C3%BCnschte%20Leistungen%3A%0ATelefon%20f%C3%BCr%20R%C3%BCckruf%3A%0A%0AViele%20Gr%C3%BC%C3%9Fe%0A"><span><small>E-Mail</small><strong>info@kirschner-service.de</strong></span><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="square" aria-hidden="true"><path d="M4 12h15M13 6l6 6-6 6"/></svg></a>
</div>
</div>
</section>