Neue Website Kirschner Gebäudeservice
Statische Seite ohne Build und ohne Fremdanfragen: Start, Leistungen, Unternehmen, Karriere, Kontakt, Impressum und Datenschutz. Design „Präzision in Blau" mit Archivo Variable, Motion über lokal eingebundenes GSAP/ScrollTrigger/SplitText und Lenis, reduced-motion-Fallback. Seiten entstehen aus tools/build_pages.py. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
NotPika69andClaude Opus 5.5 committed
commit
62916fc179
66 files changed
+3466
No files matched your search
+11
@@ -0,0 +1,11 @@
|
||||
# macOS
|
||||
.DS_Store
|
||||
._*
|
||||
|
||||
# Editor / lokale Werkzeuge
|
||||
.vscode/
|
||||
.idea/
|
||||
.claude/
|
||||
__pycache__/
|
||||
*.log
|
||||
node_modules/
|
||||
@@ -0,0 +1,106 @@
|
||||
# Kirschner Gebäudeservice — Design-System
|
||||
|
||||
Live-Dateien: sieben HTML-Seiten im Wurzelordner, `assets/site.css`, `assets/motion.js`.
|
||||
Stand 2026-09-30. Offene Punkte: [`README.md`](README.md).
|
||||
|
||||
## Benannte Referenz
|
||||
|
||||
Workspace-Regel: *kein UI-Code ohne benannte Referenz*. Für einen Gebäudedienstleister gab es
|
||||
keine Familie; deshalb am 2026-09-30 neu angelegt und gemessen:
|
||||
|
||||
**[`gebaeudedienstleister-de.md`](../../ASX%20Studio/design-references/entries/gebaeudedienstleister-de.md)**
|
||||
— Piepenbrock + Dussmann als Branchen-Baseline, Familie *Premium Local Service / Facility*.
|
||||
|
||||
**Übernommen:** genau ein gesättigtes Markenblau (Piepenbrock bestätigt Blau als Vertrauensfarbe der
|
||||
Branche), Body ≥ 17px (Dussmann 18px), Menschen im Hero, sobald echte Fotos da sind.
|
||||
**Bewusst anders:** Headlines 3× größer als die Branche (38–40px dort), Motion als Markenträger statt
|
||||
0.15s-Hover, null Fremd-Tracking und daher kein Cookie-Banner.
|
||||
|
||||
Ergänzend gestützt auf **BaseHub** (Dark + ein Akzent) und **Teenage Engineering**
|
||||
(Industrieblau, Typo-Extreme).
|
||||
|
||||
## Farbe
|
||||
|
||||
Alle Neutraltöne sind blau getönt, kein reines Grau. Ein Akzent: das Mittelblau aus dem Logo.
|
||||
|
||||
| Token | Wert | Einsatz | Kontrast |
|
||||
|---|---|---|---|
|
||||
| `--night-950` | `#0A1424` | Grundfläche | — |
|
||||
| `--night-900` / `-800` / `-700` | `#0F1D33` / `#16263F` / `#1F3354` | Tiefe Sektionen, Karten | — |
|
||||
| `--paper` | `#F2F5F9` | Helle Sektionen | — |
|
||||
| `--fog` | `#E8EEF6` | Text auf Nacht | 15.8 : 1 |
|
||||
| `--fog-soft` | `#A9B7CC` | Fließtext auf Nacht | 9.1 : 1 |
|
||||
| `--fog-mute` | `#8C9BB3` | nur Labels auf Nacht | 6.5 : 1 |
|
||||
| `--ink-soft` | `#4A5873` | Fließtext auf Papier | 6.5 : 1 |
|
||||
| `--kk` | `#5B8AD6` | **der Akzent** auf Nacht, Button-Fläche mit Nacht-Text | 5.3 : 1 |
|
||||
| `--kk-ink` | `#2F5FAE` | Akzent als Text/Fläche auf Papier | 5.7 : 1 |
|
||||
|
||||
Das Karriere-Band ist die einzige volle Akzentfläche der Seite — mit Nacht-Text, nie Grau
|
||||
(Guardrail „keine graue Schrift auf farbigem Grund").
|
||||
|
||||
## Typografie
|
||||
|
||||
Ein Face: **Archivo Variable** (wght 100–900, wdth 62–125, OFL), lokal in `assets/fonts/`.
|
||||
Nicht Inter, kein System-Font (Guardrail).
|
||||
|
||||
- Display: `font-stretch: 125%`, Weight 800, Tracking −0.035em, Line-Height .92
|
||||
- `--fs-mega` 52–136px (Hero, Philosophie) · `--fs-display` 42–92px (Sektionen)
|
||||
- Body 17px, Lead 18–22px, Label 13px Caps +0.12em
|
||||
- Keine Mittelstufe zwischen Label und Display — Typo-Extreme.
|
||||
|
||||
## Der eine Move: „Der Winkel"
|
||||
|
||||
Die zwei Chevrons des KK-Logos sind die einzige Form der Seite:
|
||||
|
||||
- Logo als Vektor (`chev_mark`, `assets/favicon.svg`) — aus dem Rasterlogo nachgezeichnet, **vom Kunden bestätigen lassen**
|
||||
- Bild-Reveals: `clip-path` mit „<"-Spitze, gesteuert über `--x` (`.reveal-img`)
|
||||
- Seitenwechsel: View-Transition-Wipe mit derselben Spitze
|
||||
- Button-Hover, mobiles Menü, Kontaktkarten: Füllung wischt im selben Winkel herein
|
||||
- Eyebrow-Marker, Listenpunkte, Hero-Linien: dieselbe Form in klein bzw. als Strich
|
||||
|
||||
## Motion
|
||||
|
||||
Guardrail „Motion nur, wo sie Information trägt" ist **bewusst gelockert** — der Auftrag lautete
|
||||
„Animationen sollen sehr gut sein". Ersatzregel: jede Animation hat einen benennbaren Zweck, und
|
||||
bei `prefers-reduced-motion` bleibt nur Funktion.
|
||||
|
||||
| # | Wo | Was | Zweck |
|
||||
|---|---|---|---|
|
||||
| 1 | Start, 1× pro Session | Intro: Chevrons + Wortmarke, Winkel-Wipe (~1.3s, Klick überspringt) | Markenmoment |
|
||||
| 2 | Hero | Zeilen aus Maske (SplitText), Chevron-Linien zeichnen sich, Scroll-Parallax | Hierarchie |
|
||||
| 3 | Header | Glas ab 40px, beim Runterscrollen weg, beim Hochscrollen da | Platz |
|
||||
| 4 | Kennzahlen | Zähler; „Jahre" wird aus dem aktuellen Jahr berechnet | Fakten |
|
||||
| 5 | Leistungen Start | Desktop ≥1024px: gepinnte horizontale Strecke + Fortschritt; darunter gestapelt | Überblick |
|
||||
| 6 | Osmose | Vorher/Nachher-Slider, zeigt beim ersten Sichtkontakt einmal die Ziehbarkeit | Beweis |
|
||||
| 7 | Philosophie | Wort für Wort hell, an Scroll gekoppelt | Botschaft |
|
||||
| 8 | Bilder | Winkel-Reveal + Scale 1.18→1 | Signatur |
|
||||
| 9 | Timeline | Linie zeichnet sich mit dem Scroll | Geschichte |
|
||||
| 10 | Team | Initialen/Chevron bewegen sich bei Hover | Nähe |
|
||||
| 11 | Buttons | Magnet max. 6px, nur `pointer: fine` | Affordanz |
|
||||
| 12 | Notruf-Pille | erscheint nach dem Hero, verschwindet am Footer | Erreichbarkeit |
|
||||
| 13 | Seitenwechsel | Cross-Document View Transitions, reines CSS | Kontinuität |
|
||||
| 14 | Scroll | Lenis, synchron mit ScrollTrigger; Touch bleibt nativ | Gefühl |
|
||||
|
||||
Easing `expo.out` / `cubic-bezier(.16,1,.3,1)`, kein Bounce/Elastic. Nur `transform`, `opacity`,
|
||||
`clip-path` werden animiert.
|
||||
|
||||
**Robustheit:** Versteckte Startzustände gelten nur unter `html.js` *und* `no-preference`.
|
||||
Lädt GSAP nicht, entfernt `motion.js` die Klasse wieder; läuft `motion.js` gar nicht, tut es ein
|
||||
3-Sekunden-Timeout im `<head>`. Das Intro hat zusätzlich einen CSS-Failsafe (2.4s).
|
||||
|
||||
## Bibliotheken (lokal, `assets/vendor/`)
|
||||
|
||||
GSAP 3.15 (Core, ScrollTrigger, SplitText — seit 3.13 frei nutzbar), Lenis 1.3.26.
|
||||
Zusammen ca. 55 KB gzip. Keine CDN-Anfragen.
|
||||
|
||||
## Bilder
|
||||
|
||||
Platzhalter von Unsplash, lokal als AVIF + WebP in 800/1600px (`assets/img/`). Nachweise im
|
||||
Impressum. Das Vorher/Nachher-Paar ist **aus einem Foto erzeugt** (Staub/Kalk künstlich
|
||||
aufgelegt) und als „Symbolbild" gekennzeichnet — ersetzen, sobald echte Fotos da sind.
|
||||
Das Team zeigt Initialen statt Fotos („Foto folgt").
|
||||
|
||||
## Formulare
|
||||
|
||||
Keine — Entscheidung vom 2026-09-30. Stattdessen `tel:`-Links und `mailto:` mit vorbereitetem
|
||||
Betreff und Text (Angebotsanfrage, je Stelle eine Bewerbung).
|
||||
@@ -0,0 +1,68 @@
|
||||
# Kirschner Gebäudeservice — Website
|
||||
|
||||
Neue Website für den Hausmeisterservice in Ergolding (bisher Jimdo:
|
||||
`1407316705.jimdoweb.com`). Statisches HTML/CSS/JS, keine Fremdanfragen, kein Cookie-Banner.
|
||||
|
||||
| Datei | Seite |
|
||||
|---|---|
|
||||
| `index.html` | Start (Intro, Hero, Leistungen gepinnt, Osmose-Slider, Philosophie, Karriere-Band) |
|
||||
| `leistungen.html` | Umfang Gewerbe/Privat, 7 Leistungen im Detail, Leistungsverzeichnisse, Referenzen |
|
||||
| `unternehmen.html` | Philosophie, Timeline 2003–heute, Team, Anfahrt |
|
||||
| `karriere.html` | Benefits, drei Stellen mit Bewerbung per E-Mail |
|
||||
| `kontakt.html` | Büro, Notruf, E-Mail, Adresse |
|
||||
| `impressum.html`, `datenschutz.html` | Rechtstexte (Entwürfe, siehe unten) |
|
||||
| `assets/site.css` | Tokens und alle Komponenten |
|
||||
| `assets/motion.js` | alle Animationen |
|
||||
| `tools/build_pages.py` | **Quelle der Seiten** — Inhalte hier ändern, dann neu erzeugen |
|
||||
|
||||
Design-Entscheidungen, Tokens und Animationsliste: [`DESIGN.md`](DESIGN.md).
|
||||
|
||||
## Lokal ansehen
|
||||
|
||||
```bash
|
||||
python3 -m http.server 4174
|
||||
```
|
||||
|
||||
Dann http://localhost:4174 öffnen. Das Intro läuft nur einmal pro Browser-Sitzung.
|
||||
|
||||
## Seiten ändern
|
||||
|
||||
Header, Footer und die Leistungsliste stehen einmal in `tools/build_pages.py` und werden in alle
|
||||
sieben Seiten geschrieben. Nach jeder Inhaltsänderung:
|
||||
|
||||
```bash
|
||||
python3 tools/build_pages.py
|
||||
```
|
||||
|
||||
## Was noch fehlt
|
||||
|
||||
### Vor dem Launch zwingend
|
||||
|
||||
1. **Leistungsverzeichnisse (PDF).** Verlinkt als `assets/docs/Leistungsverzeichnis-Wohnanlage.pdf`
|
||||
und `…-Tiefgarage.pdf`, die Dateien fehlen noch. Quelle: alte Seite → Leistungen.
|
||||
2. **Impressum:** Rechtsform bestätigen (rot markiert). TMG-Verweise sind bereits auf DDG umgestellt.
|
||||
3. **Datenschutz:** Hosting-Anbieter, AV-Vertrag (Art. 28 DSGVO) und Logfile-Speicherdauer eintragen
|
||||
(rot markiert). Beide Rechtstexte sind Entwürfe — juristisch prüfen lassen.
|
||||
4. **Hoster und Domain.** Danach `deploy.sh` nach dem Muster von Emma's Schatzkiste anlegen
|
||||
(rsync, CSS-Hash-Versionierung). Canonical-URLs und Sitemap zeigen auf `https://www.kirschner-service.de`.
|
||||
|
||||
### Vom Kunden ausstehend
|
||||
|
||||
- **Echte Fotos:** Team (6 Porträts, 4:5), Fahrzeuge, Osmoseanlage im Einsatz, betreute Objekte,
|
||||
ein echtes Vorher/Nachher-Paar (gleicher Ausschnitt). Bis dahin: Unsplash-Platzhalter bzw.
|
||||
Initialen. Das Vorher-Bild ist künstlich verschmutzt und als Symbolbild gekennzeichnet.
|
||||
- **Logo als Vektor.** Die Chevrons sind aus dem 950×157-Rasterlogo nachgezeichnet — bitte bestätigen
|
||||
oder Original-SVG/EPS liefern.
|
||||
- **Sind die drei Stellen noch aktuell?** Texte 1:1 von der alten Seite übernommen.
|
||||
- **Öffnungs- bzw. Bürozeiten** — gibt es keine auf der alten Seite; würden Kontaktseite und
|
||||
Google-Eintrag (JSON-LD) stärken.
|
||||
- **Referenzobjekte namentlich nennen?** Die alte Seite sagt nur „auf Anfrage".
|
||||
- **News:** Die alte Seite endet 2020. Die Meldungen stecken jetzt in der Timeline; neue Meldungen
|
||||
kommen dort oder in einen eigenen Bereich.
|
||||
|
||||
### Bewusst nicht übernommen
|
||||
|
||||
- Fotolia-Bilder der alten Seite (150px, Lizenz unklar).
|
||||
- Kontakt- und Bewerbungsformular — ersetzt durch vorbereitete `mailto:`-Links (Entscheidung
|
||||
vom 2026-09-30).
|
||||
- Google-Maps-Einbettung — ersetzt durch eine schematische Karte mit Link.
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 10 KiB |
@@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><rect width="64" height="64" rx="12" fill="#0A1424"/><g transform="translate(10 16)"><polygon fill="#5B8AD6" opacity=".55" points="14,0 24,0 10,16 24,32 14,32 0,16"/><polygon fill="#5B8AD6" points="32,0 42,0 28,16 42,32 32,32 18,16"/></g></svg>
|
||||
|
After Width: | Height: | Size: 305 B |
@@ -0,0 +1,93 @@
|
||||
Copyright 2020 The Archivo Project Authors (https://github.com/Omnibus-Type/Archivo) Archivo-Italic[wdth,wght].ttf: Copyright 2020 The Archivo Project Authors (https://github.com/Omnibus-Type/Archivo)
|
||||
|
||||
This Font Software is licensed under the SIL Open Font License, Version 1.1.
|
||||
This license is copied below, and is also available with a FAQ at:
|
||||
http://scripts.sil.org/OFL
|
||||
|
||||
|
||||
-----------------------------------------------------------
|
||||
SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007
|
||||
-----------------------------------------------------------
|
||||
|
||||
PREAMBLE
|
||||
The goals of the Open Font License (OFL) are to stimulate worldwide
|
||||
development of collaborative font projects, to support the font creation
|
||||
efforts of academic and linguistic communities, and to provide a free and
|
||||
open framework in which fonts may be shared and improved in partnership
|
||||
with others.
|
||||
|
||||
The OFL allows the licensed fonts to be used, studied, modified and
|
||||
redistributed freely as long as they are not sold by themselves. The
|
||||
fonts, including any derivative works, can be bundled, embedded,
|
||||
redistributed and/or sold with any software provided that any reserved
|
||||
names are not used by derivative works. The fonts and derivatives,
|
||||
however, cannot be released under any other type of license. The
|
||||
requirement for fonts to remain under this license does not apply
|
||||
to any document created using the fonts or their derivatives.
|
||||
|
||||
DEFINITIONS
|
||||
"Font Software" refers to the set of files released by the Copyright
|
||||
Holder(s) under this license and clearly marked as such. This may
|
||||
include source files, build scripts and documentation.
|
||||
|
||||
"Reserved Font Name" refers to any names specified as such after the
|
||||
copyright statement(s).
|
||||
|
||||
"Original Version" refers to the collection of Font Software components as
|
||||
distributed by the Copyright Holder(s).
|
||||
|
||||
"Modified Version" refers to any derivative made by adding to, deleting,
|
||||
or substituting -- in part or in whole -- any of the components of the
|
||||
Original Version, by changing formats or by porting the Font Software to a
|
||||
new environment.
|
||||
|
||||
"Author" refers to any designer, engineer, programmer, technical
|
||||
writer or other person who contributed to the Font Software.
|
||||
|
||||
PERMISSION & CONDITIONS
|
||||
Permission is hereby granted, free of charge, to any person obtaining
|
||||
a copy of the Font Software, to use, study, copy, merge, embed, modify,
|
||||
redistribute, and sell modified and unmodified copies of the Font
|
||||
Software, subject to the following conditions:
|
||||
|
||||
1) Neither the Font Software nor any of its individual components,
|
||||
in Original or Modified Versions, may be sold by itself.
|
||||
|
||||
2) Original or Modified Versions of the Font Software may be bundled,
|
||||
redistributed and/or sold with any software, provided that each copy
|
||||
contains the above copyright notice and this license. These can be
|
||||
included either as stand-alone text files, human-readable headers or
|
||||
in the appropriate machine-readable metadata fields within text or
|
||||
binary files as long as those fields can be easily viewed by the user.
|
||||
|
||||
3) No Modified Version of the Font Software may use the Reserved Font
|
||||
Name(s) unless explicit written permission is granted by the corresponding
|
||||
Copyright Holder. This restriction only applies to the primary font name as
|
||||
presented to the users.
|
||||
|
||||
4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font
|
||||
Software shall not be used to promote, endorse or advertise any
|
||||
Modified Version, except to acknowledge the contribution(s) of the
|
||||
Copyright Holder(s) and the Author(s) or with their explicit written
|
||||
permission.
|
||||
|
||||
5) The Font Software, modified or unmodified, in part or in whole,
|
||||
must be distributed entirely under this license, and must not be
|
||||
distributed under any other license. The requirement for fonts to
|
||||
remain under this license does not apply to any document created
|
||||
using the Font Software.
|
||||
|
||||
TERMINATION
|
||||
This license becomes null and void if any of the above conditions are
|
||||
not met.
|
||||
|
||||
DISCLAIMER
|
||||
THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
|
||||
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF
|
||||
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT
|
||||
OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE
|
||||
COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
|
||||
INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL
|
||||
DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
|
||||
FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM
|
||||
OTHER DEALINGS IN THE FONT SOFTWARE.
|
||||
Binary file not shown.
Binary file not shown.
Binary file not shown.
|
After Width: | Height: | Size: 61 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 89 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 30 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 38 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 101 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 171 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 45 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 61 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 135 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 193 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 58 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 74 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 30 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 50 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 15 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 22 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 89 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 84 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 152 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 40 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 67 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 60 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 97 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 28 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 44 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 136 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 198 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 37 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 48 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 25 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 43 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 14 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 18 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 72 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 107 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 31 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 40 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 164 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 234 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 53 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 68 KiB |
@@ -0,0 +1,359 @@
|
||||
/* ==========================================================================
|
||||
Kirschner Gebäudeservice — Motion
|
||||
Ein Modul. Alles Bewegte läuft in gsap.matchMedia(): bei reduced motion
|
||||
bleibt nur Funktion (Slider, Menü, Umschalter), keine Choreografie.
|
||||
Jede Animation hat einen Zweck — Liste in DESIGN.md.
|
||||
========================================================================== */
|
||||
(() => {
|
||||
const root = document.documentElement;
|
||||
root.classList.add('motion-ready');
|
||||
|
||||
const $ = (s, c = document) => c.querySelector(s);
|
||||
const $$ = (s, c = document) => [...c.querySelectorAll(s)];
|
||||
let lenis = null;
|
||||
|
||||
/* ---------- Fakten, die sich selbst aktualisieren ---------- */
|
||||
const years = new Date().getFullYear() - 2003;
|
||||
$$('[data-years]').forEach((el) => { el.textContent = years; });
|
||||
$$('[data-year]').forEach((el) => { el.textContent = new Date().getFullYear(); });
|
||||
|
||||
/* ---------- Header: fest nach 40px, weg beim Runterscrollen ---------- */
|
||||
const header = $('.site-header');
|
||||
const menuToggle = $('.menu-toggle');
|
||||
let lastY = scrollY;
|
||||
const onScroll = () => {
|
||||
const y = scrollY;
|
||||
if (header) {
|
||||
header.classList.toggle('is-solid', y > 40);
|
||||
const menuOpen = menuToggle && menuToggle.getAttribute('aria-expanded') === 'true';
|
||||
header.classList.toggle('is-hidden', !menuOpen && y > 480 && y > lastY + 2);
|
||||
if (y < lastY - 2) header.classList.remove('is-hidden');
|
||||
}
|
||||
lastY = y;
|
||||
};
|
||||
addEventListener('scroll', onScroll, { passive: true });
|
||||
onScroll();
|
||||
|
||||
/* ---------- Mobiles Menü ---------- */
|
||||
const mnav = $('#mobile-nav');
|
||||
if (menuToggle && mnav) {
|
||||
mnav.inert = true;
|
||||
const setMenu = (open) => {
|
||||
menuToggle.setAttribute('aria-expanded', String(open));
|
||||
menuToggle.setAttribute('aria-label', open ? 'Menü schließen' : 'Menü öffnen');
|
||||
mnav.classList.toggle('is-open', open);
|
||||
mnav.inert = !open;
|
||||
document.body.style.overflow = open ? 'hidden' : '';
|
||||
if (lenis) open ? lenis.stop() : lenis.start();
|
||||
if (open && window.gsap && !matchMedia('(prefers-reduced-motion: reduce)').matches) {
|
||||
gsap.fromTo($$('.mobile-nav__link, .mobile-nav__meta', mnav),
|
||||
{ yPercent: 60, opacity: 0 },
|
||||
{ yPercent: 0, opacity: 1, duration: .8, ease: 'expo.out', stagger: .05, delay: .18 });
|
||||
}
|
||||
if (open) $('.mobile-nav__link', mnav)?.focus({ preventScroll: true });
|
||||
};
|
||||
menuToggle.addEventListener('click', () => setMenu(menuToggle.getAttribute('aria-expanded') !== 'true'));
|
||||
addEventListener('keydown', (e) => { if (e.key === 'Escape' && mnav.classList.contains('is-open')) { setMenu(false); menuToggle.focus(); } });
|
||||
$$('a', mnav).forEach((a) => a.addEventListener('click', () => setMenu(false)));
|
||||
matchMedia('(min-width: 1081px)').addEventListener('change', (e) => { if (e.matches) setMenu(false); });
|
||||
}
|
||||
|
||||
/* ---------- Vorher/Nachher-Slider (Zeiger + Tastatur) ---------- */
|
||||
$$('.compare').forEach((cmp) => {
|
||||
let pos = 50;
|
||||
const set = (v) => {
|
||||
pos = Math.max(0, Math.min(100, v));
|
||||
cmp.style.setProperty('--pos', pos + '%');
|
||||
cmp.setAttribute('aria-valuenow', Math.round(pos));
|
||||
cmp.setAttribute('aria-valuetext', `${Math.round(pos)} % Vorher-Ansicht`);
|
||||
};
|
||||
const fromEvent = (e) => {
|
||||
const r = cmp.getBoundingClientRect();
|
||||
set(((e.clientX - r.left) / r.width) * 100);
|
||||
};
|
||||
let dragging = false;
|
||||
cmp.addEventListener('pointerdown', (e) => { dragging = true; cmp.setPointerCapture(e.pointerId); fromEvent(e); });
|
||||
cmp.addEventListener('pointermove', (e) => { if (dragging) fromEvent(e); });
|
||||
cmp.addEventListener('pointerup', () => { dragging = false; });
|
||||
cmp.addEventListener('pointercancel', () => { dragging = false; });
|
||||
cmp.addEventListener('keydown', (e) => {
|
||||
const step = e.shiftKey ? 10 : 2;
|
||||
const map = { ArrowLeft: pos - step, ArrowDown: pos - step, ArrowRight: pos + step, ArrowUp: pos + step, Home: 0, End: 100, PageDown: pos - 10, PageUp: pos + 10 };
|
||||
if (e.key in map) { e.preventDefault(); set(map[e.key]); }
|
||||
});
|
||||
set(50);
|
||||
cmp._set = set;
|
||||
});
|
||||
|
||||
/* ---------- Umschalter Privat / Gewerbe (Tabs) ---------- */
|
||||
$$('.switch').forEach((sw) => {
|
||||
const tabs = $$('[role="tab"]', sw);
|
||||
const pill = $('.switch__pill', sw);
|
||||
const place = (t) => { if (pill) { pill.style.width = t.offsetWidth + 'px'; pill.style.transform = `translateX(${t.offsetLeft - 4}px)`; } };
|
||||
const select = (t, focus) => {
|
||||
tabs.forEach((x) => {
|
||||
const on = x === t;
|
||||
x.setAttribute('aria-selected', String(on));
|
||||
x.tabIndex = on ? 0 : -1;
|
||||
const panel = document.getElementById(x.getAttribute('aria-controls'));
|
||||
if (panel) panel.hidden = !on;
|
||||
if (on && panel && window.gsap && !matchMedia('(prefers-reduced-motion: reduce)').matches) {
|
||||
gsap.fromTo(panel.children, { opacity: 0, y: 14 }, { opacity: 1, y: 0, duration: .6, ease: 'expo.out', stagger: .035 });
|
||||
}
|
||||
});
|
||||
place(t);
|
||||
if (focus) t.focus();
|
||||
};
|
||||
tabs.forEach((t, i) => {
|
||||
t.addEventListener('click', () => select(t));
|
||||
t.addEventListener('keydown', (e) => {
|
||||
const d = e.key === 'ArrowRight' ? 1 : e.key === 'ArrowLeft' ? -1 : 0;
|
||||
if (d) { e.preventDefault(); select(tabs[(i + d + tabs.length) % tabs.length], true); }
|
||||
});
|
||||
});
|
||||
const initial = tabs.find((t) => t.getAttribute('aria-selected') === 'true') || tabs[0];
|
||||
requestAnimationFrame(() => place(initial));
|
||||
addEventListener('resize', () => place(tabs.find((t) => t.getAttribute('aria-selected') === 'true')));
|
||||
});
|
||||
|
||||
/* ---------- Notruf-Pille: nach dem Hero sichtbar, am Seitenende weg ---------- */
|
||||
const sos = $('.sos');
|
||||
if (sos) {
|
||||
const hero = $('.hero, .page-hero');
|
||||
const footer = $('.site-footer');
|
||||
let pastHero = false, atFooter = false;
|
||||
const update = () => sos.classList.toggle('is-visible', pastHero && !atFooter);
|
||||
if (hero) new IntersectionObserver(([e]) => { pastHero = !e.isIntersecting; update(); }, { rootMargin: '-20% 0px 0px 0px' }).observe(hero);
|
||||
if (footer) new IntersectionObserver(([e]) => { atFooter = e.isIntersecting; update(); }).observe(footer);
|
||||
}
|
||||
|
||||
/* ======================================================================
|
||||
Ab hier: Choreografie. Ohne GSAP bleibt alles sichtbar und benutzbar.
|
||||
====================================================================== */
|
||||
if (!window.gsap || !window.ScrollTrigger || !window.SplitText) {
|
||||
root.classList.remove('js', 'has-intro');
|
||||
return;
|
||||
}
|
||||
gsap.registerPlugin(ScrollTrigger, SplitText);
|
||||
gsap.defaults({ ease: 'expo.out', duration: 1 });
|
||||
|
||||
const intro = $('.intro');
|
||||
|
||||
/* Intro: zwei Chevrons + Wortmarke, dann Winkel-Wipe (nur 1× pro Session) */
|
||||
const playIntro = () => new Promise((resolve) => {
|
||||
if (!root.classList.contains('has-intro') || !intro) { resolve(); return; }
|
||||
try { sessionStorage.setItem('kk-intro', '1'); } catch (e) { /* privat */ }
|
||||
intro.style.animation = 'none';
|
||||
gsap.set(intro, { clipPath: 'polygon(0% 0%, 120% 0%, 100% 50%, 120% 100%, 0% 100%)' });
|
||||
const tl = gsap.timeline({
|
||||
onComplete: () => { root.classList.remove('has-intro'); resolve(); },
|
||||
});
|
||||
tl.from('.intro__mark .chev', { xPercent: 140, opacity: 0, duration: .5, stagger: .09 })
|
||||
.from('.intro__word span, .intro__word small', { yPercent: 115, duration: .5, stagger: .06 }, .15)
|
||||
.to(intro, { clipPath: 'polygon(0% 0%, 0% 0%, -20% 50%, 0% 100%, 0% 100%)', duration: .7, ease: 'expo.inOut' }, .75)
|
||||
.add(resolve, 1.0); /* Hero startet, während der Wipe noch läuft */
|
||||
intro.addEventListener('click', () => tl.progress(1), { once: true });
|
||||
});
|
||||
|
||||
const splitLines = (el, vars = {}) => SplitText.create(el, {
|
||||
type: 'lines',
|
||||
mask: 'lines',
|
||||
linesClass: 'line',
|
||||
autoSplit: true,
|
||||
onSplit(self) {
|
||||
el.classList.add('is-split');
|
||||
return gsap.from(self.lines, { yPercent: 115, duration: 1.15, stagger: .09, ...vars });
|
||||
},
|
||||
});
|
||||
|
||||
const mm = gsap.matchMedia();
|
||||
|
||||
mm.add({
|
||||
motion: '(prefers-reduced-motion: no-preference)',
|
||||
desktop: '(min-width: 1024px)',
|
||||
fine: '(pointer: fine)',
|
||||
}, (ctx) => {
|
||||
const { motion, desktop, fine } = ctx.conditions;
|
||||
if (!motion) return;
|
||||
|
||||
/* ---- Smooth-Scroll (Lenis), synchron mit ScrollTrigger; Touch bleibt nativ ---- */
|
||||
lenis = new Lenis({ lerp: .1, wheelMultiplier: 1, anchors: { offset: -90 } });
|
||||
lenis.on('scroll', ScrollTrigger.update);
|
||||
window.lenis = lenis; /* für Anker-Sprünge & Debugging */
|
||||
const raf = (t) => lenis.raf(t * 1000);
|
||||
gsap.ticker.add(raf);
|
||||
gsap.ticker.lagSmoothing(0);
|
||||
|
||||
/* ---- Hero ---- */
|
||||
const hero = $('.hero, .page-hero');
|
||||
const heroH1 = hero && $('[data-split]', hero);
|
||||
const heroRest = hero ? $$('[data-hero]', hero) : [];
|
||||
const heroPaths = hero ? $$('.hero__chevrons path', hero) : [];
|
||||
gsap.set(heroRest, { opacity: 0, y: 24 });
|
||||
gsap.set(heroPaths, { strokeDasharray: 1, strokeDashoffset: 1 });
|
||||
|
||||
const startHero = () => {
|
||||
if (heroH1) splitLines(heroH1, { delay: .05 });
|
||||
gsap.to(heroRest, { opacity: 1, y: 0, duration: 1.1, stagger: .08, delay: .35 });
|
||||
gsap.to(heroPaths, { strokeDashoffset: 0, duration: 1.8, ease: 'expo.inOut', stagger: .12, delay: .1 });
|
||||
const media = hero && $('.hero__media img', hero);
|
||||
if (media) gsap.from(media, { scale: 1.12, duration: 2.2, ease: 'expo.out' });
|
||||
};
|
||||
document.fonts.ready.then(playIntro).then(startHero);
|
||||
|
||||
if (hero) {
|
||||
const chev = $('.hero__chevrons', hero);
|
||||
const media = $('.hero__media img', hero);
|
||||
const content = $('.hero__content, .page-hero__grid', hero);
|
||||
const st = { trigger: hero, start: 'top top', end: 'bottom top', scrub: true };
|
||||
if (chev) gsap.to(chev, { yPercent: -18, xPercent: 6, ease: 'none', scrollTrigger: st });
|
||||
if (media) gsap.to(media, { yPercent: 10, ease: 'none', scrollTrigger: { ...st } });
|
||||
if (content) gsap.to(content, { y: -60, opacity: .2, ease: 'none', scrollTrigger: { ...st, start: 'center center' } });
|
||||
}
|
||||
|
||||
/* ---- Leistungen: horizontal gepinnt (Desktop) ---- */
|
||||
const hs = $('.hscroll');
|
||||
let hsTween = null;
|
||||
if (hs && desktop) {
|
||||
hs.classList.add('is-pinned');
|
||||
const track = $('.hscroll__track', hs);
|
||||
const bar = $('.hscroll__bar i', hs);
|
||||
const count = $('[data-hs-count]', hs);
|
||||
const panels = $$('.panel', hs);
|
||||
gsap.set(panels, { opacity: 1, y: 0 });
|
||||
const dist = () => Math.max(0, track.scrollWidth - innerWidth);
|
||||
hsTween = gsap.to(track, {
|
||||
x: () => -dist(),
|
||||
ease: 'none',
|
||||
scrollTrigger: {
|
||||
trigger: hs,
|
||||
start: 'top top',
|
||||
end: () => '+=' + dist(),
|
||||
pin: true,
|
||||
scrub: .8,
|
||||
invalidateOnRefresh: true,
|
||||
onUpdate: (self) => {
|
||||
if (bar) bar.style.transform = `scaleX(${self.progress})`;
|
||||
if (count) count.textContent = String(Math.min(panels.length, Math.floor(self.progress * panels.length) + 1)).padStart(2, '0');
|
||||
},
|
||||
},
|
||||
});
|
||||
panels.forEach((p) => {
|
||||
const img = $('img', p);
|
||||
if (img) gsap.fromTo(img, { xPercent: -6, scale: 1.18 }, {
|
||||
xPercent: 6, scale: 1.18, ease: 'none',
|
||||
scrollTrigger: { trigger: p, containerAnimation: hsTween, start: 'left right', end: 'right left', scrub: true },
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
/* ---- Textzeilen aus der Maske ---- */
|
||||
$$('[data-split]').forEach((el) => {
|
||||
if (hero && hero.contains(el)) return;
|
||||
splitLines(el, { scrollTrigger: { trigger: el, start: 'top 86%', once: true } });
|
||||
});
|
||||
|
||||
/* ---- Blöcke gestaffelt einblenden ---- */
|
||||
const reveals = $$('[data-reveal]').filter((el) => !(hs && desktop && hs.contains(el)));
|
||||
ScrollTrigger.batch(reveals, {
|
||||
start: 'top 88%',
|
||||
once: true,
|
||||
onEnter: (batch) => gsap.to(batch, { opacity: 1, y: 0, duration: 1, stagger: .08, overwrite: true }),
|
||||
});
|
||||
|
||||
/* ---- Winkel-Reveal für Bilder (Signatur) ---- */
|
||||
$$('.reveal-img').forEach((el) => {
|
||||
const img = $('img', el);
|
||||
const tl = gsap.timeline({ scrollTrigger: { trigger: el, start: 'top 82%', once: true } });
|
||||
tl.to(el, { '--x': '0%', duration: 1.35, ease: 'expo.inOut' });
|
||||
if (img) tl.from(img, { scale: 1.18, duration: 1.8, ease: 'expo.out' }, 0);
|
||||
});
|
||||
|
||||
/* ---- Zähler ---- */
|
||||
$$('[data-count]').forEach((el) => {
|
||||
const to = el.dataset.count === 'years' ? years : Number(el.dataset.count);
|
||||
const o = { v: 0 };
|
||||
el.textContent = '0';
|
||||
gsap.to(o, {
|
||||
v: to, duration: 1.8, ease: 'expo.out',
|
||||
scrollTrigger: { trigger: el, start: 'top 90%', once: true },
|
||||
onUpdate: () => { el.textContent = Math.round(o.v); },
|
||||
});
|
||||
});
|
||||
|
||||
/* ---- Philosophie: Wort für Wort hell (gescrubbt) ---- */
|
||||
$$('[data-scrub-words]').forEach((el) => {
|
||||
SplitText.create(el, {
|
||||
type: 'words',
|
||||
wordsClass: 'word',
|
||||
autoSplit: true,
|
||||
onSplit(self) {
|
||||
return gsap.fromTo(self.words, { opacity: .14 }, {
|
||||
opacity: 1, ease: 'none', stagger: .12,
|
||||
scrollTrigger: { trigger: el, start: 'top 78%', end: 'bottom 42%', scrub: true },
|
||||
});
|
||||
},
|
||||
});
|
||||
});
|
||||
|
||||
/* ---- Timeline-Linie zeichnet sich ---- */
|
||||
$$('.timeline').forEach((tl) => {
|
||||
const line = $('.timeline__line i', tl);
|
||||
if (line) gsap.fromTo(line, { scaleY: 0 }, {
|
||||
scaleY: 1, ease: 'none',
|
||||
scrollTrigger: { trigger: tl, start: 'top 70%', end: 'bottom 65%', scrub: true },
|
||||
});
|
||||
});
|
||||
|
||||
/* ---- Parallax für einzelne Elemente ---- */
|
||||
$$('[data-parallax]').forEach((el) => {
|
||||
const amt = Number(el.dataset.parallax) || 10;
|
||||
gsap.fromTo(el, { yPercent: -amt }, {
|
||||
yPercent: amt, ease: 'none',
|
||||
scrollTrigger: { trigger: el.parentElement, start: 'top bottom', end: 'bottom top', scrub: true },
|
||||
});
|
||||
});
|
||||
|
||||
/* ---- Vorher/Nachher: einmal kurz zeigen, dass man ziehen kann ---- */
|
||||
$$('.compare').forEach((cmp) => {
|
||||
const o = { v: 50 };
|
||||
gsap.timeline({ scrollTrigger: { trigger: cmp, start: 'top 70%', once: true } })
|
||||
.to(o, { v: 72, duration: .9, ease: 'expo.inOut', onUpdate: () => cmp._set(o.v) })
|
||||
.to(o, { v: 50, duration: .9, ease: 'expo.inOut', onUpdate: () => cmp._set(o.v) });
|
||||
});
|
||||
|
||||
/* ---- Magnet-Buttons (nur Maus) ---- */
|
||||
if (fine) {
|
||||
$$('.btn, [data-magnetic]').forEach((btn) => {
|
||||
const xTo = gsap.quickTo(btn, 'x', { duration: .6, ease: 'expo.out' });
|
||||
const yTo = gsap.quickTo(btn, 'y', { duration: .6, ease: 'expo.out' });
|
||||
const clamp = gsap.utils.clamp(-6, 6);
|
||||
const move = (e) => {
|
||||
const r = btn.getBoundingClientRect();
|
||||
xTo(clamp((e.clientX - r.left - r.width / 2) * .18));
|
||||
yTo(clamp((e.clientY - r.top - r.height / 2) * .3));
|
||||
};
|
||||
const leave = () => { xTo(0); yTo(0); };
|
||||
btn.addEventListener('pointermove', move);
|
||||
btn.addEventListener('pointerleave', leave);
|
||||
ctx.add(() => () => { btn.removeEventListener('pointermove', move); btn.removeEventListener('pointerleave', leave); });
|
||||
});
|
||||
}
|
||||
|
||||
/* Nach Font-Load und Bildern Layout neu messen */
|
||||
document.fonts.ready.then(() => ScrollTrigger.refresh());
|
||||
addEventListener('load', () => ScrollTrigger.refresh(), { once: true });
|
||||
|
||||
return () => {
|
||||
gsap.ticker.remove(raf);
|
||||
lenis?.destroy();
|
||||
lenis = null;
|
||||
hs?.classList.remove('is-pinned');
|
||||
};
|
||||
});
|
||||
|
||||
/* Reduced motion: Intro nie zeigen, Zähler stehen schon auf Endwert (HTML) */
|
||||
mm.add('(prefers-reduced-motion: reduce)', () => {
|
||||
root.classList.remove('has-intro');
|
||||
});
|
||||
})();
|
||||
+687
@@ -0,0 +1,687 @@
|
||||
/* ==========================================================================
|
||||
Kirschner Gebäudeservice — Design-System „Präzision in Blau"
|
||||
Referenz: design-references/entries/gebaeudedienstleister-de.md
|
||||
Details und Begründungen: DESIGN.md
|
||||
========================================================================== */
|
||||
|
||||
/* ---------- Font: Archivo Variable (wght 100–900, wdth 62–125), OFL ---------- */
|
||||
@font-face {
|
||||
font-family: "Archivo";
|
||||
font-style: normal;
|
||||
font-display: swap;
|
||||
font-weight: 100 900;
|
||||
font-stretch: 62% 125%;
|
||||
src: url("fonts/archivo-latin-ext-wdth-normal.woff2") format("woff2-variations");
|
||||
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
|
||||
}
|
||||
@font-face {
|
||||
font-family: "Archivo";
|
||||
font-style: normal;
|
||||
font-display: swap;
|
||||
font-weight: 100 900;
|
||||
font-stretch: 62% 125%;
|
||||
src: url("fonts/archivo-latin-wdth-normal.woff2") format("woff2-variations");
|
||||
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
|
||||
}
|
||||
|
||||
/* ---------- Tokens ---------- */
|
||||
:root {
|
||||
/* Nacht — blau getönte Dunkeltöne */
|
||||
--night-950: #0A1424;
|
||||
--night-900: #0F1D33;
|
||||
--night-800: #16263F;
|
||||
--night-700: #1F3354;
|
||||
/* Papier — blau getöntes Off-White */
|
||||
--paper: #F2F5F9;
|
||||
--paper-2: #E6ECF4;
|
||||
--white: #FFFFFF;
|
||||
/* Text */
|
||||
--ink: #0A1424; /* auf Papier */
|
||||
--ink-soft: #4A5873; /* auf Papier, 6.5:1 */
|
||||
--fog: #E8EEF6; /* auf Nacht, 15.8:1 */
|
||||
--fog-soft: #A9B7CC; /* auf Nacht, 9.1:1 */
|
||||
--fog-mute: #8C9BB3; /* auf Nacht, 6.5:1 — nur Labels */
|
||||
/* Der eine Akzent: Logo-Mittelblau */
|
||||
--kk: #5B8AD6; /* auf Nacht 5.3:1 */
|
||||
--kk-bright: #6E9AE3;
|
||||
--kk-ink: #2F5FAE; /* Akzent als Text auf Papier, 5.7:1 */
|
||||
--kk-deep: #3B6CC0;
|
||||
/* Linien */
|
||||
--line-dark: rgba(169, 183, 204, .16);
|
||||
--line-light: rgba(10, 20, 36, .12);
|
||||
|
||||
/* Typo */
|
||||
--font: "Archivo", "Helvetica Neue", Arial, sans-serif;
|
||||
--fs-mega: clamp(3.25rem, 9.6vw, 8.5rem);
|
||||
--fs-display: clamp(2.6rem, 6.4vw, 5.75rem);
|
||||
--fs-title: clamp(1.75rem, 3.2vw, 2.75rem);
|
||||
--fs-lead: clamp(1.15rem, 1.5vw, 1.375rem);
|
||||
--fs-body: 1.0625rem;
|
||||
--fs-label: .8125rem;
|
||||
|
||||
/* Raum — 8px-Skala */
|
||||
--s1: .5rem; --s2: 1rem; --s3: 1.5rem; --s4: 2rem; --s5: 3rem; --s6: 4rem; --s7: 6rem;
|
||||
--section: clamp(6rem, 12vw, 10rem);
|
||||
--gutter: clamp(1rem, 3vw, 1.5rem);
|
||||
--max: 1320px;
|
||||
--radius: 4px;
|
||||
|
||||
/* Motion */
|
||||
--ease: cubic-bezier(.16, 1, .3, 1);
|
||||
--ease-io: cubic-bezier(.65, 0, .35, 1);
|
||||
--t-fast: 200ms;
|
||||
--t-mid: 450ms;
|
||||
|
||||
/* Chevron-Winkel (Signatur) — Tiefe des „<" */
|
||||
--chev: 18%;
|
||||
}
|
||||
|
||||
/* ---------- Reset / Basis ---------- */
|
||||
*, *::before, *::after { box-sizing: border-box; }
|
||||
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-padding-top: 96px; }
|
||||
html.lenis, html.lenis body { height: auto; }
|
||||
.lenis.lenis-smooth { scroll-behavior: auto !important; }
|
||||
.lenis.lenis-stopped { overflow: clip; }
|
||||
body {
|
||||
margin: 0;
|
||||
font-family: var(--font);
|
||||
font-size: var(--fs-body);
|
||||
font-stretch: 100%;
|
||||
line-height: 1.6;
|
||||
color: var(--fog);
|
||||
background: var(--night-950);
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
text-rendering: optimizeLegibility;
|
||||
overflow-wrap: break-word;
|
||||
overflow-x: clip;
|
||||
}
|
||||
img, svg, picture { display: block; max-width: 100%; }
|
||||
img { height: auto; }
|
||||
a { color: inherit; text-decoration: none; }
|
||||
button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
|
||||
h1, h2, h3, h4, p, ul, ol, figure, dl, dd { margin: 0; }
|
||||
ul[role="list"], ol[role="list"] { list-style: none; padding: 0; }
|
||||
::selection { background: var(--kk); color: var(--night-950); }
|
||||
:focus-visible { outline: 2px solid var(--kk-bright); outline-offset: 3px; border-radius: 2px; }
|
||||
.theme-light :focus-visible { outline-color: var(--kk-ink); }
|
||||
|
||||
.skip-link {
|
||||
position: fixed; left: var(--s2); top: var(--s2); z-index: 200;
|
||||
padding: .75rem 1.25rem; background: var(--kk); color: var(--night-950); font-weight: 700;
|
||||
transform: translateY(-160%); transition: transform var(--t-fast) var(--ease);
|
||||
}
|
||||
.skip-link:focus { transform: none; }
|
||||
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
|
||||
|
||||
/* ---------- Layout ---------- */
|
||||
.wrap { width: min(100% - 2 * var(--gutter), var(--max)); margin-inline: auto; }
|
||||
.section { padding-block: var(--section); position: relative; }
|
||||
.theme-light { background: var(--paper); color: var(--ink); }
|
||||
.theme-white { background: var(--white); color: var(--ink); }
|
||||
.theme-deep { background: var(--night-900); }
|
||||
.grid-12 { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--s4) var(--gutter); }
|
||||
|
||||
/* ---------- Typo ---------- */
|
||||
.mega, .display, .title {
|
||||
font-stretch: 125%;
|
||||
font-weight: 800;
|
||||
letter-spacing: -.035em;
|
||||
line-height: .92;
|
||||
text-wrap: balance;
|
||||
}
|
||||
.mega { font-size: var(--fs-mega); }
|
||||
.display { font-size: var(--fs-display); line-height: .95; }
|
||||
.title { font-size: var(--fs-title); line-height: 1.02; letter-spacing: -.025em; }
|
||||
.lead { font-size: var(--fs-lead); line-height: 1.5; color: var(--fog-soft); max-width: 38ch; }
|
||||
.theme-light .lead, .theme-white .lead { color: var(--ink-soft); }
|
||||
.prose p + p { margin-top: 1em; }
|
||||
.muted { color: var(--fog-soft); }
|
||||
.theme-light .muted, .theme-white .muted { color: var(--ink-soft); }
|
||||
.accent { color: var(--kk); }
|
||||
.theme-light .accent, .theme-white .accent { color: var(--kk-ink); }
|
||||
|
||||
.eyebrow {
|
||||
display: inline-flex; align-items: center; gap: .75rem;
|
||||
font-size: var(--fs-label); font-weight: 600; letter-spacing: .12em; text-transform: uppercase;
|
||||
color: var(--fog-mute);
|
||||
}
|
||||
.theme-light .eyebrow, .theme-white .eyebrow { color: var(--ink-soft); }
|
||||
.eyebrow::before {
|
||||
content: ""; width: 14px; height: 14px; flex: none;
|
||||
background: var(--kk);
|
||||
clip-path: polygon(100% 0, 55% 0, 0 50%, 55% 100%, 100% 100%, 45% 50%);
|
||||
}
|
||||
.theme-light .eyebrow::before, .theme-white .eyebrow::before { background: var(--kk-ink); }
|
||||
|
||||
/* Zeilen-Maske für SplitText */
|
||||
.line-mask { display: block; overflow: clip; padding-bottom: .06em; margin-bottom: -.06em; }
|
||||
|
||||
/* ---------- Chevron-Motiv ---------- */
|
||||
.chev-mark { width: 44px; height: 32px; flex: none; }
|
||||
.chev { fill: currentColor; }
|
||||
|
||||
/* Winkel-Reveal: --x läuft von 118% auf 0%, die Spitze „<" führt */
|
||||
.reveal-img { --x: 0%; clip-path: polygon(100% 0, var(--x) 0, calc(var(--x) - var(--chev)) 50%, var(--x) 100%, 100% 100%); }
|
||||
.reveal-img img { transform-origin: 70% 50%; }
|
||||
|
||||
/* ---------- Buttons ---------- */
|
||||
.btn {
|
||||
--bg: var(--kk); --fg: var(--night-950);
|
||||
position: relative; display: inline-flex; align-items: center; gap: .9rem;
|
||||
min-height: 56px; padding: 0 1.5rem 0 1.75rem;
|
||||
font-weight: 650; font-stretch: 110%; letter-spacing: -.005em; font-size: 1rem;
|
||||
color: var(--fg); background: var(--bg);
|
||||
border-radius: var(--radius);
|
||||
overflow: hidden; isolation: isolate;
|
||||
transition: color var(--t-mid) var(--ease);
|
||||
will-change: transform;
|
||||
}
|
||||
.btn::before {
|
||||
/* Füllung wischt im Chevron-Winkel von rechts herein */
|
||||
content: ""; position: absolute; inset: 0; z-index: -1;
|
||||
background: var(--fog);
|
||||
clip-path: polygon(100% 0, 120% 0, 100% 50%, 120% 100%, 100% 100%);
|
||||
transition: clip-path var(--t-mid) var(--ease);
|
||||
}
|
||||
.btn:hover::before, .btn:focus-visible::before { clip-path: polygon(100% 0, 0 0, -20% 50%, 0 100%, 100% 100%); }
|
||||
.btn__arrow { width: 18px; height: 18px; flex: none; transition: transform var(--t-mid) var(--ease); }
|
||||
.btn:hover .btn__arrow { transform: translateX(4px); }
|
||||
.btn--ghost { --bg: transparent; --fg: var(--fog); box-shadow: inset 0 0 0 1px var(--line-dark); }
|
||||
.btn--ghost:hover { --fg: var(--night-950); }
|
||||
.theme-light .btn--ghost, .theme-white .btn--ghost { --fg: var(--ink); box-shadow: inset 0 0 0 1px var(--line-light); }
|
||||
.theme-light .btn::before, .theme-white .btn::before { background: var(--night-950); }
|
||||
.theme-light .btn:not(.btn--ghost), .theme-white .btn:not(.btn--ghost) { --bg: var(--kk-ink); --fg: var(--white); }
|
||||
.theme-light .btn--ghost:hover, .theme-white .btn--ghost:hover { --fg: var(--white); }
|
||||
.btn-row { display: flex; flex-wrap: wrap; gap: var(--s2); align-items: center; }
|
||||
|
||||
.link-arrow {
|
||||
display: inline-flex; align-items: center; gap: .5rem; font-weight: 600;
|
||||
background: linear-gradient(currentColor, currentColor) 0 100% / 0 1px no-repeat;
|
||||
transition: background-size var(--t-mid) var(--ease);
|
||||
padding-bottom: 2px;
|
||||
}
|
||||
.link-arrow:hover { background-size: 100% 1px; }
|
||||
.link-arrow svg { width: 14px; height: 14px; transition: transform var(--t-mid) var(--ease); }
|
||||
.link-arrow:hover svg { transform: translateX(3px); }
|
||||
|
||||
/* ---------- Header ---------- */
|
||||
.site-header {
|
||||
position: fixed; inset: 0 0 auto; z-index: 100;
|
||||
transition: transform .5s var(--ease), background-color .4s var(--ease), box-shadow .4s var(--ease);
|
||||
}
|
||||
.site-header.is-solid {
|
||||
background: rgba(10, 20, 36, .72);
|
||||
-webkit-backdrop-filter: saturate(160%) blur(16px);
|
||||
backdrop-filter: saturate(160%) blur(16px);
|
||||
box-shadow: 0 1px 0 var(--line-dark);
|
||||
}
|
||||
.site-header.is-hidden { transform: translateY(-100%); }
|
||||
.site-header__inner { display: flex; align-items: center; justify-content: space-between; gap: var(--s3); height: 84px; }
|
||||
.brand { display: inline-flex; align-items: center; gap: .75rem; color: var(--fog); }
|
||||
.brand .chev-mark { color: var(--kk); }
|
||||
.brand__name { display: grid; line-height: 1; }
|
||||
.brand__name b { font-weight: 800; font-stretch: 125%; letter-spacing: .02em; font-size: 1.05rem; }
|
||||
.brand__name span { font-size: .6875rem; letter-spacing: .24em; text-transform: uppercase; color: var(--fog-soft); margin-top: .3rem; }
|
||||
.nav { display: flex; align-items: center; gap: clamp(1.25rem, 2.4vw, 2.25rem); }
|
||||
.nav__link { position: relative; font-weight: 500; font-size: .96875rem; color: var(--fog-soft); transition: color var(--t-fast) var(--ease); padding-block: .5rem; }
|
||||
.nav__link::after {
|
||||
content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: var(--kk);
|
||||
transform: scaleX(0); transform-origin: right; transition: transform var(--t-mid) var(--ease);
|
||||
}
|
||||
.nav__link:hover, .nav__link[aria-current="page"] { color: var(--fog); }
|
||||
.nav__link:hover::after, .nav__link[aria-current="page"]::after { transform: scaleX(1); transform-origin: left; }
|
||||
.header-cta { display: flex; align-items: center; gap: var(--s2); }
|
||||
.header-phone { display: inline-flex; align-items: center; gap: .5rem; font-weight: 600; font-variant-numeric: tabular-nums; font-size: .96875rem; }
|
||||
.header-phone svg { width: 16px; height: 16px; color: var(--kk); }
|
||||
.header-cta .btn { min-height: 44px; padding: 0 1.1rem 0 1.25rem; font-size: .9375rem; }
|
||||
|
||||
.menu-toggle { display: none; width: 48px; height: 48px; place-items: center; border-radius: var(--radius); box-shadow: inset 0 0 0 1px var(--line-dark); }
|
||||
.menu-toggle__bars { position: relative; width: 20px; height: 12px; }
|
||||
.menu-toggle__bars::before, .menu-toggle__bars::after {
|
||||
content: ""; position: absolute; left: 0; right: 0; height: 2px; background: var(--fog);
|
||||
transition: transform var(--t-mid) var(--ease), top var(--t-mid) var(--ease);
|
||||
}
|
||||
.menu-toggle__bars::before { top: 0; }
|
||||
.menu-toggle__bars::after { top: 10px; }
|
||||
[aria-expanded="true"] .menu-toggle__bars::before { top: 5px; transform: rotate(45deg); }
|
||||
[aria-expanded="true"] .menu-toggle__bars::after { top: 5px; transform: rotate(-45deg); }
|
||||
|
||||
.mobile-nav {
|
||||
position: fixed; inset: 0; z-index: 90; background: var(--night-900);
|
||||
display: flex; flex-direction: column; justify-content: flex-end;
|
||||
padding: 110px var(--gutter) var(--s5);
|
||||
clip-path: polygon(100% 0, 118% 0, 100% 50%, 118% 100%, 100% 100%);
|
||||
transition: clip-path .7s var(--ease-io), visibility 0s .7s;
|
||||
visibility: hidden;
|
||||
}
|
||||
.mobile-nav.is-open { clip-path: polygon(100% 0, 0 0, -18% 50%, 0 100%, 100% 100%); visibility: visible; transition: clip-path .7s var(--ease-io), visibility 0s; }
|
||||
.mobile-nav ul { display: grid; gap: .25rem; }
|
||||
.mobile-nav a.mobile-nav__link { display: block; font-size: clamp(2.25rem, 10vw, 3.5rem); font-weight: 800; font-stretch: 125%; letter-spacing: -.03em; line-height: 1.1; }
|
||||
.mobile-nav a.mobile-nav__link[aria-current="page"] { color: var(--kk); }
|
||||
.mobile-nav__meta { margin-top: var(--s5); display: grid; gap: .5rem; color: var(--fog-soft); }
|
||||
.mobile-nav__meta a { color: var(--fog); font-weight: 600; }
|
||||
|
||||
@media (max-width: 1080px) {
|
||||
.nav, .header-phone { display: none; }
|
||||
.menu-toggle { display: grid; }
|
||||
}
|
||||
@media (max-width: 520px) {
|
||||
.header-cta .btn { display: none; }
|
||||
}
|
||||
|
||||
/* ---------- Hero ---------- */
|
||||
.hero {
|
||||
position: relative; min-height: 100svh; display: grid; align-items: end;
|
||||
padding: 140px 0 var(--s5); overflow: clip; isolation: isolate;
|
||||
}
|
||||
.hero__media { position: absolute; inset: 0; z-index: -2; }
|
||||
.hero__media img { width: 100%; height: 115%; object-fit: cover; object-position: 60% 40%; }
|
||||
.hero__media::after {
|
||||
content: ""; position: absolute; inset: 0;
|
||||
background:
|
||||
linear-gradient(90deg, rgba(10, 20, 36, .96) 0%, rgba(10, 20, 36, .82) 42%, rgba(10, 20, 36, .35) 100%),
|
||||
linear-gradient(0deg, rgba(10, 20, 36, 1) 0%, rgba(10, 20, 36, 0) 45%);
|
||||
}
|
||||
.hero__chevrons { position: absolute; right: -6vw; top: 50%; z-index: -1; width: min(62vw, 880px); translate: 0 -50%; color: var(--kk); pointer-events: none; }
|
||||
.hero__chevrons path { fill: none; stroke: currentColor; stroke-width: 1.2; vector-effect: non-scaling-stroke; }
|
||||
.hero__chevrons path:nth-child(2) { opacity: .55; }
|
||||
.hero__chevrons path:nth-child(3) { opacity: .28; }
|
||||
.hero__content { display: grid; gap: var(--s4); }
|
||||
.hero h1 { max-width: 12ch; }
|
||||
.hero .lead { max-width: 44ch; }
|
||||
.hero__foot {
|
||||
margin-top: var(--s6); padding-top: var(--s3); border-top: 1px solid var(--line-dark);
|
||||
display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--s2) var(--s4);
|
||||
font-size: .875rem; color: var(--fog-mute); letter-spacing: .04em;
|
||||
}
|
||||
.hero__foot ul { display: flex; flex-wrap: wrap; gap: var(--s1) var(--s4); list-style: none; padding: 0; }
|
||||
.hero__foot li { display: inline-flex; align-items: center; gap: .6rem; }
|
||||
.hero__foot li::before { content: ""; width: 6px; height: 6px; background: var(--kk); clip-path: polygon(100% 0, 0 50%, 100% 100%); }
|
||||
.scroll-hint { display: inline-flex; align-items: center; gap: .6rem; }
|
||||
.scroll-hint__line { width: 1px; height: 28px; background: var(--line-dark); position: relative; overflow: hidden; }
|
||||
.scroll-hint__line::after { content: ""; position: absolute; inset: 0; background: var(--kk); transform: translateY(-100%); animation: scroll-hint 2.2s var(--ease-io) infinite; }
|
||||
@keyframes scroll-hint { 0% { transform: translateY(-100%); } 60%, 100% { transform: translateY(100%); } }
|
||||
|
||||
/* Unterseiten-Hero */
|
||||
.page-hero { position: relative; padding: 180px 0 var(--s6); overflow: clip; isolation: isolate; }
|
||||
.page-hero .hero__chevrons { width: min(48vw, 620px); right: -8vw; opacity: .7; }
|
||||
.page-hero__grid { display: grid; gap: var(--s4); align-items: end; }
|
||||
.page-hero h1 { max-width: 14ch; }
|
||||
@media (min-width: 900px) { .page-hero__grid { grid-template-columns: 1.4fr 1fr; } }
|
||||
|
||||
/* ---------- Zielgruppen-Leiste ---------- */
|
||||
.audience { border-block: 1px solid var(--line-dark); }
|
||||
.audience ul { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); list-style: none; padding: 0; margin: 0; }
|
||||
.audience li {
|
||||
padding: var(--s4) var(--s3); display: grid; gap: .35rem; border-left: 1px solid var(--line-dark);
|
||||
}
|
||||
.audience li:first-child { border-left: 0; padding-left: 0; }
|
||||
.audience b { hyphens: auto; -webkit-hyphens: auto; font-weight: 700; font-stretch: 112%; font-size: 1.0625rem; }
|
||||
.audience span { color: var(--fog-mute); font-size: .9375rem; }
|
||||
@media (max-width: 860px) {
|
||||
.audience ul { grid-template-columns: repeat(2, minmax(0, 1fr)); }
|
||||
.audience li { padding-inline: var(--s2); }
|
||||
.audience li:nth-child(3) { border-left: 0; padding-left: 0; }
|
||||
.audience li:nth-child(n+3) { border-top: 1px solid var(--line-dark); }
|
||||
}
|
||||
|
||||
/* ---------- Kennzahlen ---------- */
|
||||
.stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--s4) var(--gutter); }
|
||||
.stat { display: grid; gap: .75rem; align-content: start; padding-top: var(--s3); border-top: 1px solid var(--line-light); }
|
||||
.stat__num { font-size: clamp(3.5rem, 8vw, 7rem); font-weight: 800; font-stretch: 125%; letter-spacing: -.05em; line-height: .85; font-variant-numeric: tabular-nums; color: var(--ink); }
|
||||
.stat__num sup { font-size: .4em; vertical-align: top; position: relative; top: .15em; margin-left: .05em; color: var(--kk-ink); letter-spacing: 0; }
|
||||
.stat__label { color: var(--ink-soft); max-width: 22ch; }
|
||||
@media (max-width: 900px) { .stats { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
|
||||
|
||||
.intro-split { display: grid; gap: var(--s5); margin-bottom: var(--s7); }
|
||||
@media (min-width: 960px) { .intro-split { grid-template-columns: 1.25fr 1fr; align-items: end; } }
|
||||
|
||||
/* ---------- Leistungen: horizontale Sektion ---------- */
|
||||
.services-head { display: grid; gap: var(--s3); margin-bottom: var(--s6); }
|
||||
@media (min-width: 960px) { .services-head { grid-template-columns: 1.3fr 1fr; align-items: end; } }
|
||||
.hscroll { position: relative; }
|
||||
.hscroll__track { display: grid; gap: var(--s5); }
|
||||
.panel { display: grid; gap: var(--s3); }
|
||||
.panel__media { position: relative; aspect-ratio: 4 / 3; overflow: hidden; border-radius: var(--radius); background: var(--night-800); }
|
||||
.panel__media img { width: 100%; height: 100%; object-fit: cover; }
|
||||
.panel__media picture, .service-row__media picture, .hero__media picture, .compare picture { display: block; width: 100%; height: 100%; }
|
||||
.panel__num { position: absolute; left: var(--s3); top: var(--s2); font-weight: 800; font-stretch: 125%; font-size: 1rem; letter-spacing: .06em; color: var(--fog); mix-blend-mode: normal; text-shadow: 0 1px 12px rgba(10,20,36,.5); }
|
||||
.panel__body { display: grid; gap: var(--s2); max-width: 48ch; }
|
||||
.panel h3, .service-row h3, .job summary h3, .contact-card strong { hyphens: auto; -webkit-hyphens: auto; }
|
||||
.panel h3 { font-size: clamp(1.75rem, 2.6vw, 2.5rem); font-weight: 800; font-stretch: 120%; letter-spacing: -.03em; line-height: 1; }
|
||||
.panel p { color: var(--fog-soft); }
|
||||
.tags { display: flex; flex-wrap: wrap; gap: .5rem; list-style: none; padding: 0; margin: 0; }
|
||||
.tags li { font-size: .8125rem; padding: .35rem .7rem; border-radius: 999px; box-shadow: inset 0 0 0 1px var(--line-dark); color: var(--fog-soft); }
|
||||
.theme-light .tags li, .theme-white .tags li { box-shadow: inset 0 0 0 1px var(--line-light); color: var(--ink-soft); }
|
||||
.hscroll__progress { display: none; }
|
||||
.hscroll:not(.is-pinned) .hscroll__track { width: min(100% - 2 * var(--gutter), var(--max)); margin-inline: auto; }
|
||||
|
||||
@media (min-width: 1024px) {
|
||||
.hscroll.is-pinned { height: 100vh; overflow: clip; display: flex; flex-direction: column; justify-content: center; }
|
||||
.hscroll.is-pinned .hscroll__track {
|
||||
display: flex; gap: clamp(2rem, 4vw, 4rem); width: max-content;
|
||||
padding-inline: max(var(--gutter), (100vw - var(--max)) / 2);
|
||||
}
|
||||
.hscroll.is-pinned .panel { width: clamp(420px, 38vw, 560px); flex: none; }
|
||||
.hscroll.is-pinned .panel:nth-child(even) { margin-top: 8vh; }
|
||||
.hscroll.is-pinned .panel__media { aspect-ratio: auto; height: min(44vh, 400px); }
|
||||
.hscroll.is-pinned .hscroll__progress {
|
||||
display: flex; align-items: center; gap: var(--s3);
|
||||
width: min(100% - 2 * var(--gutter), var(--max)); margin: var(--s5) auto 0;
|
||||
font-size: var(--fs-label); letter-spacing: .12em; color: var(--fog-mute); font-variant-numeric: tabular-nums;
|
||||
}
|
||||
.hscroll__bar { flex: 1; height: 2px; background: var(--line-dark); position: relative; overflow: hidden; }
|
||||
.hscroll__bar i { position: absolute; inset: 0; background: var(--kk); transform-origin: left; transform: scaleX(0); }
|
||||
}
|
||||
@media (min-width: 700px) and (max-width: 1023px) {
|
||||
.hscroll__track { grid-template-columns: 1fr 1fr; }
|
||||
}
|
||||
|
||||
/* ---------- Osmose-Feature + Vorher/Nachher ---------- */
|
||||
.feature { display: grid; gap: var(--s5); align-items: center; }
|
||||
@media (min-width: 960px) { .feature { grid-template-columns: 1fr 1.15fr; gap: var(--s6); } }
|
||||
.feature__copy { display: grid; gap: var(--s3); }
|
||||
.checklist { list-style: none; padding: 0; margin: 0; display: grid; gap: .9rem; }
|
||||
.checklist li { display: grid; grid-template-columns: 18px 1fr; gap: .9rem; align-items: baseline; }
|
||||
.checklist li::before { content: ""; width: 12px; height: 12px; background: var(--kk-ink); clip-path: polygon(0 0, 45% 0, 100% 50%, 45% 100%, 0 100%, 55% 50%); transform: translateY(1px); }
|
||||
.theme-deep .checklist li::before, body > .section:not([class*="theme-"]) .checklist li::before { background: var(--kk); }
|
||||
|
||||
.compare {
|
||||
--pos: 50%;
|
||||
position: relative; aspect-ratio: 4 / 3; border-radius: var(--radius); overflow: hidden;
|
||||
user-select: none; touch-action: pan-y; background: var(--night-800); cursor: ew-resize;
|
||||
}
|
||||
.compare img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; pointer-events: none; }
|
||||
.compare__before { position: absolute; inset: 0; clip-path: inset(0 calc(100% - var(--pos)) 0 0); }
|
||||
.compare__handle {
|
||||
position: absolute; top: 0; bottom: 0; left: var(--pos); width: 2px; margin-left: -1px;
|
||||
background: var(--white); box-shadow: 0 0 0 1px rgba(10,20,36,.2);
|
||||
}
|
||||
.compare__knob {
|
||||
position: absolute; top: 50%; left: 50%; width: 56px; height: 56px; transform: translate(-50%, -50%);
|
||||
display: grid; place-items: center; border-radius: 50%; background: var(--white); color: var(--night-950);
|
||||
box-shadow: 0 10px 30px rgba(10,20,36,.35);
|
||||
transition: transform var(--t-fast) var(--ease);
|
||||
}
|
||||
.compare:active .compare__knob, .compare:focus-visible .compare__knob { transform: translate(-50%, -50%) scale(1.08); }
|
||||
.compare__knob svg { width: 26px; height: 26px; }
|
||||
.compare__tag {
|
||||
position: absolute; bottom: var(--s2); padding: .35rem .7rem; border-radius: 999px;
|
||||
font-size: .75rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
|
||||
background: rgba(10,20,36,.72); color: var(--fog); backdrop-filter: blur(6px);
|
||||
}
|
||||
.compare__tag--before { left: var(--s2); }
|
||||
.compare__tag--after { right: var(--s2); background: var(--kk); color: var(--night-950); }
|
||||
.compare:focus-visible { outline-offset: 4px; }
|
||||
.figure-note { margin-top: .75rem; font-size: .8125rem; color: var(--ink-soft); }
|
||||
|
||||
/* ---------- Philosophie ---------- */
|
||||
.philosophy { text-align: left; }
|
||||
.philosophy__words { font-size: var(--fs-mega); font-weight: 800; font-stretch: 125%; letter-spacing: -.045em; line-height: .95; }
|
||||
.philosophy__words .word { display: inline-block; }
|
||||
.philosophy__words .dot { color: var(--kk); }
|
||||
.philosophy__sub { margin-top: var(--s5); display: grid; gap: var(--s4); }
|
||||
@media (min-width: 900px) { .philosophy__sub { grid-template-columns: repeat(3, 1fr); } }
|
||||
.philosophy__sub div { border-top: 1px solid var(--line-dark); padding-top: var(--s3); display: grid; gap: .5rem; }
|
||||
.philosophy__sub b { font-weight: 700; font-stretch: 112%; font-size: 1.125rem; }
|
||||
.philosophy__sub p { color: var(--fog-soft); }
|
||||
|
||||
/* ---------- Karriere-Band ---------- */
|
||||
.band { background: var(--kk); color: var(--night-950); position: relative; overflow: clip; isolation: isolate; }
|
||||
.band__inner { display: grid; gap: var(--s4); padding-block: clamp(4rem, 9vw, 7rem); }
|
||||
@media (min-width: 900px) { .band__inner { grid-template-columns: 1.4fr auto; align-items: end; } }
|
||||
.band .eyebrow { color: var(--night-950); }
|
||||
.band .eyebrow::before { background: var(--night-950); }
|
||||
.band p { max-width: 50ch; font-size: var(--fs-lead); line-height: 1.5; }
|
||||
.band .btn { --bg: var(--night-950); --fg: var(--fog); }
|
||||
.band .btn::before { background: var(--white); }
|
||||
.band .btn:hover { --fg: var(--night-950); }
|
||||
.band__chev { position: absolute; right: -4%; top: 50%; width: 46%; translate: 0 -50%; z-index: -1; color: var(--night-950); opacity: .08; }
|
||||
.band__chev path { fill: currentColor; }
|
||||
|
||||
/* ---------- Kontakt-Abschluss ---------- */
|
||||
.cta-final { display: grid; gap: var(--s5); }
|
||||
@media (min-width: 960px) { .cta-final { grid-template-columns: 1.3fr 1fr; align-items: end; } }
|
||||
.contact-lines { display: grid; gap: 0; border-top: 1px solid var(--line-dark); }
|
||||
.contact-line {
|
||||
display: grid; grid-template-columns: 1fr auto; align-items: center; gap: var(--s2);
|
||||
padding: var(--s3) 0; border-bottom: 1px solid var(--line-dark);
|
||||
transition: padding var(--t-mid) var(--ease), color var(--t-fast);
|
||||
}
|
||||
.contact-line small { display: block; font-size: var(--fs-label); letter-spacing: .12em; text-transform: uppercase; color: var(--fog-mute); margin-bottom: .25rem; }
|
||||
.contact-line strong { font-size: clamp(1.25rem, 2.2vw, 1.75rem); font-weight: 700; font-stretch: 112%; letter-spacing: -.01em; font-variant-numeric: tabular-nums; }
|
||||
.contact-line svg { width: 22px; height: 22px; color: var(--kk); transition: transform var(--t-mid) var(--ease); }
|
||||
a.contact-line:hover { padding-left: var(--s2); }
|
||||
a.contact-line:hover svg { transform: translateX(4px); }
|
||||
.theme-light .contact-lines, .theme-light .contact-line { border-color: var(--line-light); }
|
||||
.theme-light .contact-line small { color: var(--ink-soft); }
|
||||
.theme-light .contact-line svg { color: var(--kk-ink); }
|
||||
|
||||
/* ---------- Footer ---------- */
|
||||
.site-footer { background: var(--night-950); border-top: 1px solid var(--line-dark); padding: var(--s6) 0 var(--s4); color: var(--fog-soft); font-size: .9375rem; }
|
||||
.footer-grid { display: grid; gap: var(--s5); }
|
||||
@media (min-width: 860px) { .footer-grid { grid-template-columns: 1.4fr 1fr 1fr 1fr; } }
|
||||
.footer-grid h2 { font-size: var(--fs-label); letter-spacing: .12em; text-transform: uppercase; color: var(--fog-mute); font-weight: 600; margin-bottom: var(--s2); }
|
||||
.footer-grid ul { list-style: none; padding: 0; margin: 0; display: grid; gap: .5rem; }
|
||||
.footer-grid a { color: var(--fog); transition: color var(--t-fast); }
|
||||
.footer-grid a:hover { color: var(--kk-bright); }
|
||||
.footer-motto { margin-top: var(--s3); color: var(--fog-soft); max-width: 30ch; }
|
||||
.footer-bottom { margin-top: var(--s6); padding-top: var(--s3); border-top: 1px solid var(--line-dark); display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--s2); font-size: .8125rem; color: var(--fog-mute); }
|
||||
.footer-bottom nav { display: flex; gap: var(--s3); }
|
||||
.footer-bottom a:hover { color: var(--fog); }
|
||||
.footer-word {
|
||||
font-size: calc(min(100vw - 2 * var(--gutter), var(--max)) / 7.4); font-weight: 800; font-stretch: 125%; letter-spacing: -.06em; line-height: .8; overflow: hidden;
|
||||
color: var(--night-800); margin-top: var(--s6); white-space: nowrap; user-select: none;
|
||||
}
|
||||
|
||||
/* ---------- Notruf-Pille ---------- */
|
||||
.sos {
|
||||
position: fixed; right: var(--gutter); bottom: var(--gutter); z-index: 80;
|
||||
display: inline-flex; align-items: center; gap: .7rem;
|
||||
padding: .7rem 1.1rem .7rem .9rem; border-radius: 999px;
|
||||
background: var(--fog); color: var(--night-950); font-weight: 650; font-size: .9375rem;
|
||||
box-shadow: 0 14px 40px rgba(10,20,36,.35);
|
||||
transform: translateY(calc(100% + 2rem)); opacity: 0;
|
||||
transition: transform .6s var(--ease), opacity .4s var(--ease);
|
||||
}
|
||||
.sos.is-visible { transform: none; opacity: 1; }
|
||||
.sos__dot { position: relative; width: 10px; height: 10px; border-radius: 50%; background: var(--kk-deep); }
|
||||
.sos__dot::after { content: ""; position: absolute; inset: 0; border-radius: 50%; background: var(--kk-deep); animation: pulse 2.4s var(--ease) infinite; }
|
||||
@keyframes pulse { 0% { transform: scale(1); opacity: .6; } 70%, 100% { transform: scale(2.8); opacity: 0; } }
|
||||
.sos small { display: block; font-size: .6875rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-soft); line-height: 1.2; }
|
||||
.sos b { font-variant-numeric: tabular-nums; line-height: 1.2; }
|
||||
html:not(.js) .sos { transform: none; opacity: 1; position: static; margin: var(--s3); }
|
||||
|
||||
/* ---------- Intro (nur Startseite, 1× pro Session) ---------- */
|
||||
.intro { display: none; }
|
||||
html.has-intro .intro {
|
||||
display: grid; place-items: center; position: fixed; inset: 0; z-index: 300; background: var(--night-950);
|
||||
/* Sicherheitsnetz: falls JS nicht läuft, verschwindet das Intro nach 2.4s von selbst */
|
||||
animation: intro-failsafe 0s 2.4s forwards;
|
||||
}
|
||||
@keyframes intro-failsafe { to { visibility: hidden; } }
|
||||
.intro__mark { display: flex; align-items: center; gap: 1.1rem; color: var(--kk); }
|
||||
.intro__mark svg { width: 88px; height: 64px; }
|
||||
.intro__word { overflow: clip; }
|
||||
.intro__word span { display: block; font-weight: 800; font-stretch: 125%; font-size: clamp(1.5rem, 4vw, 2.25rem); letter-spacing: .04em; color: var(--fog); line-height: 1; }
|
||||
.intro__word small { display: block; font-size: .75rem; letter-spacing: .3em; text-transform: uppercase; color: var(--fog-soft); margin-top: .5rem; }
|
||||
|
||||
/* ---------- Leistungsseite ---------- */
|
||||
.switch { display: inline-flex; padding: 4px; border-radius: 999px; box-shadow: inset 0 0 0 1px var(--line-light); background: var(--white); position: relative; }
|
||||
.switch__btn { position: relative; z-index: 1; padding: .7rem 1.4rem; border-radius: 999px; font-weight: 600; font-size: .9375rem; color: var(--ink-soft); transition: color var(--t-mid) var(--ease); }
|
||||
.switch__btn[aria-selected="true"] { color: var(--white); }
|
||||
.switch__pill { position: absolute; top: 4px; bottom: 4px; left: 4px; border-radius: 999px; background: var(--night-950); transition: transform var(--t-mid) var(--ease), width var(--t-mid) var(--ease); }
|
||||
.scope-lists { margin-top: var(--s5); }
|
||||
.scope-list { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); border-top: 1px solid var(--line-light); }
|
||||
.scope-list li { display: flex; align-items: center; gap: .9rem; padding: var(--s3) var(--s2) var(--s3) 0; border-bottom: 1px solid var(--line-light); font-weight: 600; font-stretch: 108%; font-size: 1.125rem; }
|
||||
.scope-list li::before { content: ""; width: 10px; height: 10px; flex: none; background: var(--kk-ink); clip-path: polygon(0 0, 45% 0, 100% 50%, 45% 100%, 0 100%, 55% 50%); }
|
||||
.scope-list[hidden] { display: none; }
|
||||
|
||||
.service-rows { display: grid; gap: var(--s7); }
|
||||
.service-row { display: grid; gap: var(--s4); align-items: center; }
|
||||
.service-row__media { aspect-ratio: 5 / 4; border-radius: var(--radius); overflow: hidden; background: var(--night-800); }
|
||||
.service-row__media img { width: 100%; height: 100%; object-fit: cover; }
|
||||
.service-row__body { display: grid; gap: var(--s3); max-width: 52ch; }
|
||||
.service-row__num { font-weight: 800; font-stretch: 125%; color: var(--kk); letter-spacing: .06em; }
|
||||
@media (min-width: 960px) {
|
||||
.service-row { grid-template-columns: 1.1fr 1fr; gap: var(--s6); }
|
||||
.service-row:nth-child(even) .service-row__media { order: 2; }
|
||||
}
|
||||
|
||||
.downloads { display: grid; gap: var(--s2); }
|
||||
@media (min-width: 760px) { .downloads { grid-template-columns: 1fr 1fr; } }
|
||||
.download {
|
||||
display: grid; grid-template-columns: auto 1fr auto; gap: var(--s3); align-items: center;
|
||||
padding: var(--s3); border-radius: var(--radius); background: var(--white); box-shadow: inset 0 0 0 1px var(--line-light);
|
||||
transition: box-shadow var(--t-mid) var(--ease), transform var(--t-mid) var(--ease);
|
||||
}
|
||||
.download:hover { box-shadow: inset 0 0 0 1px var(--kk-ink), 0 18px 40px rgba(10,20,36,.08); transform: translateY(-2px); }
|
||||
.download__icon { width: 48px; height: 56px; display: grid; place-items: end center; padding-bottom: 8px; background: var(--night-950); color: var(--fog); font-size: .625rem; font-weight: 800; letter-spacing: .08em; clip-path: polygon(0 0, 70% 0, 100% 22%, 100% 100%, 0 100%); }
|
||||
.download b { display: block; font-weight: 700; font-stretch: 108%; }
|
||||
.download span { color: var(--ink-soft); font-size: .875rem; }
|
||||
.download svg { width: 22px; height: 22px; color: var(--kk-ink); }
|
||||
|
||||
/* ---------- Unternehmen ---------- */
|
||||
.timeline { position: relative; display: grid; gap: var(--s6); padding-left: clamp(2rem, 6vw, 5rem); }
|
||||
.timeline__line { position: absolute; left: 0; top: 0; bottom: 0; width: 2px; background: var(--line-light); }
|
||||
.timeline__line i { position: absolute; inset: 0; background: var(--kk-ink); transform-origin: top; }
|
||||
.tl-item { position: relative; display: grid; gap: var(--s2); }
|
||||
@media (min-width: 900px) { .tl-item { grid-template-columns: 220px 1fr; gap: var(--s5); } }
|
||||
.tl-item::before {
|
||||
content: ""; position: absolute; left: calc(-1 * clamp(2rem, 6vw, 5rem) - 7px); top: .55em; width: 16px; height: 16px;
|
||||
background: var(--paper); box-shadow: inset 0 0 0 2px var(--kk-ink); border-radius: 50%;
|
||||
}
|
||||
.tl-item__year { font-size: clamp(2.5rem, 5vw, 4rem); font-weight: 800; font-stretch: 125%; letter-spacing: -.04em; line-height: .9; color: var(--ink); font-variant-numeric: tabular-nums; }
|
||||
.tl-item h3 { font-size: 1.375rem; font-weight: 700; font-stretch: 112%; letter-spacing: -.01em; margin-bottom: .5rem; }
|
||||
.tl-item p { color: var(--ink-soft); max-width: 60ch; }
|
||||
|
||||
.team { display: grid; gap: var(--gutter); grid-template-columns: repeat(2, 1fr); }
|
||||
@media (min-width: 720px) { .team { grid-template-columns: repeat(3, 1fr); } }
|
||||
@media (min-width: 1200px) { .team { grid-template-columns: repeat(6, 1fr); } }
|
||||
.member { position: relative; display: grid; gap: var(--s2); }
|
||||
.member__photo {
|
||||
position: relative; aspect-ratio: 4 / 5; border-radius: var(--radius); overflow: hidden;
|
||||
background: linear-gradient(160deg, var(--night-700), var(--night-900));
|
||||
display: grid; place-items: center;
|
||||
}
|
||||
.member__initials { font-size: clamp(3rem, 6vw, 4.5rem); font-weight: 800; font-stretch: 125%; letter-spacing: -.04em; color: var(--kk); transition: transform .8s var(--ease); }
|
||||
.member__photo svg { position: absolute; right: -18%; bottom: -10%; width: 80%; color: var(--kk); opacity: .12; transition: transform .8s var(--ease), opacity .8s var(--ease); }
|
||||
.member:hover .member__initials { transform: scale(1.06); }
|
||||
.member:hover .member__photo svg { transform: translateX(-8%); opacity: .22; }
|
||||
.member__photo small { position: absolute; left: var(--s2); bottom: var(--s2); font-size: .6875rem; letter-spacing: .12em; text-transform: uppercase; color: var(--fog-mute); }
|
||||
.member b { font-weight: 700; font-stretch: 112%; font-size: 1.125rem; display: block; }
|
||||
.member span { color: var(--ink-soft); }
|
||||
.member--more .member__photo { background: transparent; box-shadow: inset 0 0 0 1px var(--line-light); }
|
||||
.member--more .member__initials { color: var(--ink); font-size: clamp(2.5rem, 5vw, 3.5rem); }
|
||||
|
||||
.map-card { display: grid; gap: var(--s4); align-items: stretch; }
|
||||
@media (min-width: 900px) { .map-card { grid-template-columns: 1fr 1.3fr; } }
|
||||
.map {
|
||||
position: relative; min-height: 360px; border-radius: var(--radius); overflow: hidden; background: var(--night-900);
|
||||
color: var(--fog);
|
||||
}
|
||||
.map svg { position: absolute; inset: 0; width: 100%; height: 100%; }
|
||||
.map__pin { position: absolute; left: 56%; top: 46%; transform: translate(-50%, -100%); display: grid; justify-items: center; gap: .4rem; }
|
||||
.map__pin span { padding: .45rem .8rem; background: var(--kk); color: var(--night-950); font-weight: 700; font-size: .875rem; border-radius: var(--radius); white-space: nowrap; }
|
||||
.map__pin i { width: 14px; height: 14px; border-radius: 50%; background: var(--kk); box-shadow: 0 0 0 6px rgba(91,138,214,.25); }
|
||||
|
||||
/* ---------- Karriere ---------- */
|
||||
.benefits { list-style: none; padding: 0; margin: 0; display: grid; gap: 0; border-top: 1px solid var(--line-dark); }
|
||||
@media (min-width: 900px) { .benefits { grid-template-columns: 1fr 1fr; column-gap: var(--s5); } }
|
||||
.benefits li { padding: var(--s3) 0; border-bottom: 1px solid var(--line-dark); display: grid; gap: .25rem; }
|
||||
.benefits b { font-weight: 700; font-stretch: 112%; font-size: 1.125rem; }
|
||||
.benefits span { color: var(--fog-soft); }
|
||||
|
||||
.jobs { display: grid; border-top: 1px solid var(--line-light); }
|
||||
.job { border-bottom: 1px solid var(--line-light); }
|
||||
.job summary {
|
||||
list-style: none; cursor: pointer; display: grid; grid-template-columns: 1fr auto; gap: var(--s3); align-items: center;
|
||||
padding: var(--s4) 0;
|
||||
}
|
||||
.job summary::-webkit-details-marker { display: none; }
|
||||
.job summary h3 { font-size: clamp(1.5rem, 3vw, 2.5rem); font-weight: 800; font-stretch: 122%; letter-spacing: -.03em; line-height: 1.02; }
|
||||
.job summary .job__meta { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .75rem; }
|
||||
.job summary .job__meta span { font-size: .8125rem; padding: .3rem .7rem; border-radius: 999px; box-shadow: inset 0 0 0 1px var(--line-light); color: var(--ink-soft); }
|
||||
.job__toggle { width: 56px; height: 56px; border-radius: 50%; display: grid; place-items: center; box-shadow: inset 0 0 0 1px var(--line-light); transition: background-color var(--t-mid) var(--ease), transform var(--t-mid) var(--ease); }
|
||||
.job__toggle svg { width: 20px; height: 20px; transition: transform var(--t-mid) var(--ease); }
|
||||
.job[open] .job__toggle { background: var(--night-950); color: var(--fog); }
|
||||
.job[open] .job__toggle svg { transform: rotate(45deg); }
|
||||
.job summary:hover .job__toggle { transform: scale(1.06); }
|
||||
.job__body { display: grid; gap: var(--s4); padding-bottom: var(--s5); }
|
||||
@media (min-width: 900px) { .job__body { grid-template-columns: 1fr 1fr; } }
|
||||
.job__body h4 { font-size: var(--fs-label); letter-spacing: .12em; text-transform: uppercase; color: var(--ink-soft); font-weight: 600; margin-bottom: var(--s2); }
|
||||
.job__body ul { padding: 0; margin: 0; list-style: none; display: grid; gap: .6rem; }
|
||||
.job__body li { display: grid; grid-template-columns: 14px 1fr; gap: .75rem; }
|
||||
.job__body li::before { content: ""; width: 9px; height: 9px; margin-top: .55em; background: var(--kk-ink); clip-path: polygon(0 0, 45% 0, 100% 50%, 45% 100%, 0 100%, 55% 50%); }
|
||||
.job__text { grid-column: 1 / -1; color: var(--ink-soft); max-width: 70ch; }
|
||||
.job__text p + p { margin-top: .75em; }
|
||||
.job__apply { grid-column: 1 / -1; }
|
||||
|
||||
/* ---------- Kontaktseite ---------- */
|
||||
.contact-grid { display: grid; gap: var(--gutter); }
|
||||
@media (min-width: 900px) { .contact-grid { grid-template-columns: repeat(3, 1fr); } }
|
||||
.contact-card {
|
||||
position: relative; display: grid; gap: var(--s2); align-content: start; padding: var(--s4); min-height: 240px;
|
||||
border-radius: var(--radius); background: var(--night-900); box-shadow: inset 0 0 0 1px var(--line-dark);
|
||||
overflow: hidden; isolation: isolate;
|
||||
transition: box-shadow var(--t-mid) var(--ease);
|
||||
}
|
||||
.contact-card::before {
|
||||
content: ""; position: absolute; inset: 0; z-index: -1; background: var(--night-800);
|
||||
clip-path: polygon(100% 0, 118% 0, 100% 50%, 118% 100%, 100% 100%);
|
||||
transition: clip-path .7s var(--ease);
|
||||
}
|
||||
a.contact-card:hover::before { clip-path: polygon(100% 0, 0 0, -18% 50%, 0 100%, 100% 100%); }
|
||||
a.contact-card:hover { box-shadow: inset 0 0 0 1px var(--kk); }
|
||||
.contact-card small { font-size: var(--fs-label); letter-spacing: .12em; text-transform: uppercase; color: var(--fog-mute); }
|
||||
.contact-card strong { font-size: clamp(1.5rem, 2.4vw, 2rem); font-weight: 800; font-stretch: 118%; letter-spacing: -.02em; line-height: 1.1; font-variant-numeric: tabular-nums; word-break: break-word; }
|
||||
.contact-card p { color: var(--fog-soft); }
|
||||
.contact-card__go { margin-top: auto; display: inline-flex; align-items: center; gap: .5rem; color: var(--kk); font-weight: 600; }
|
||||
.contact-card__go svg { width: 16px; height: 16px; transition: transform var(--t-mid) var(--ease); }
|
||||
a.contact-card:hover .contact-card__go svg { transform: translateX(4px); }
|
||||
.contact-card--sos { background: var(--kk); color: var(--night-950); box-shadow: none; }
|
||||
.contact-card--sos::before { background: var(--kk-bright); }
|
||||
.contact-card--sos small, .contact-card--sos p, .contact-card--sos .contact-card__go { color: var(--night-950); }
|
||||
a.contact-card--sos:hover { box-shadow: none; }
|
||||
|
||||
/* ---------- Rechtstexte ---------- */
|
||||
.legal { max-width: 72ch; }
|
||||
.legal h2 { font-size: 1.5rem; font-weight: 800; font-stretch: 115%; letter-spacing: -.015em; margin: var(--s5) 0 var(--s2); }
|
||||
.legal h3 { font-size: 1.125rem; font-weight: 700; margin: var(--s4) 0 var(--s1); }
|
||||
.legal p, .legal li { color: var(--ink-soft); }
|
||||
.legal p + p { margin-top: .9em; }
|
||||
.legal ul { padding-left: 1.2rem; display: grid; gap: .4rem; margin: .75rem 0; }
|
||||
.legal a { color: var(--kk-ink); text-decoration: underline; text-underline-offset: 3px; }
|
||||
.legal address { font-style: normal; color: var(--ink); line-height: 1.7; }
|
||||
.todo { display: block; margin: var(--s2) 0; padding: var(--s2) var(--s3); border: 2px dashed #B3261E; border-radius: var(--radius); color: #8C1D18; background: #FCEEEE; font-size: .9375rem; }
|
||||
|
||||
/* ---------- Reveal-Startzustände (nur mit JS, nur mit Motion) ---------- */
|
||||
@media (prefers-reduced-motion: no-preference) {
|
||||
html.js [data-reveal] { opacity: 0; transform: translateY(28px); }
|
||||
html.js .reveal-img { --x: 118%; }
|
||||
html.js [data-split] { visibility: hidden; }
|
||||
html.js [data-split].is-split { visibility: visible; }
|
||||
}
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
*, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
|
||||
}
|
||||
|
||||
/* ---------- Seitenübergänge: Cross-Document View Transitions ---------- */
|
||||
@media (prefers-reduced-motion: no-preference) {
|
||||
@view-transition { navigation: auto; }
|
||||
::view-transition-old(root) { animation: vt-out .6s var(--ease-io) both; }
|
||||
::view-transition-new(root) { animation: vt-in .75s var(--ease-io) both; }
|
||||
::view-transition-old(site-header), ::view-transition-new(site-header) { animation: none; }
|
||||
.site-header { view-transition-name: site-header; }
|
||||
}
|
||||
@keyframes vt-out { to { opacity: .35; transform: translateX(-4%); } }
|
||||
@keyframes vt-in {
|
||||
from { clip-path: polygon(100% 0, 120% 0, 100% 50%, 120% 100%, 100% 100%); }
|
||||
to { clip-path: polygon(100% 0, 0 0, -20% 50%, 0 100%, 100% 100%); }
|
||||
}
|
||||
|
||||
/* ---------- Hilfen ---------- */
|
||||
.mt-2 { margin-top: var(--s2); } .mt-3 { margin-top: var(--s3); } .mt-4 { margin-top: var(--s4); } .mt-5 { margin-top: var(--s5); } .mt-6 { margin-top: var(--s6); }
|
||||
.stack { display: grid; gap: var(--s3); }
|
||||
.section-head { display: grid; gap: var(--s3); margin-bottom: var(--s6); max-width: 60rem; }
|
||||
Vendored
+11
@@ -0,0 +1,11 @@
|
||||
/*!
|
||||
* ScrollTrigger 3.15.0
|
||||
* https://gsap.com
|
||||
*
|
||||
* @license Copyright 2026, GreenSock. All rights reserved.
|
||||
* Subject to the terms at https://gsap.com/standard-license.
|
||||
* @author: Jack Doyle, jack@greensock.com
|
||||
*/
|
||||
|
||||
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports):"function"==typeof define&&define.amd?define(["exports"],t):t((e=e||self).window=e.window||{})}(this,function(e){"use strict";function _defineProperties(e,t){for(var r=0;r<t.length;r++){var n=t[r];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,n.key,n)}}function r(){return Se||"undefined"!=typeof window&&(Se=window.gsap)&&Se.registerPlugin&&Se}function z(e,t){return~Le.indexOf(e)&&Le[Le.indexOf(e)+1][t]}function A(e){return!!~t.indexOf(e)}function B(e,t,r,n,i){return e.addEventListener(t,r,{passive:!1!==n,capture:!!i})}function C(e,t,r,n){return e.removeEventListener(t,r,!!n)}function F(){return Re&&Re.isPressed||Ie.cache++}function G(r,n){function fd(e){if(e||0===e){i&&(Ce.history.scrollRestoration="manual");var t=Re&&Re.isPressed;e=fd.v=Math.round(e)||(Re&&Re.iOS?1:0),r(e),fd.cacheID=Ie.cache,t&&o("ss",e)}else(n||Ie.cache!==fd.cacheID||o("ref"))&&(fd.cacheID=Ie.cache,fd.v=r());return fd.v+fd.offset}return fd.offset=0,r&&fd}function J(e,t){return(t&&t._ctx&&t._ctx.selector||Se.utils.toArray)(e)[0]||("string"==typeof e&&!1!==Se.config().nullTargetWarn?console.warn("Element not found:",e):null)}function L(t,e){var r=e.s,n=e.sc;A(t)&&(t=Me.scrollingElement||ke);var i=Ie.indexOf(t),o=n===Xe.sc?1:2;~i||(i=Ie.push(t)-1),Ie[i+o]||B(t,"scroll",F);var a=Ie[i+o],s=a||(Ie[i+o]=G(z(t,r),!0)||(A(t)?n:G(function(e){return arguments.length?t[r]=e:t[r]})));return s.target=t,a||(s.smooth="smooth"===Se.getProperty(t,"scrollBehavior")),s}function M(e,t,i){function Hd(e,t){var r=Ye();t||n<r-s?(a=o,o=e,l=s,s=r):i?o+=e:o=a+(e-a)/(r-l)*(s-l)}var o=e,a=e,s=Ye(),l=s,n=t||50,c=Math.max(500,3*n);return{update:Hd,reset:function reset(){a=o=i?0:o,l=s=0},getVelocity:function getVelocity(e){var t=l,r=a,n=Ye();return!e&&0!==e||e===o||Hd(e),s===l||c<n-l?0:(o+(i?r:-r))/((i?n:s)-t)*1e3}}}function N(e,t){return t&&!e._gsapAllow&&!1!==e.cancelable&&e.preventDefault(),e.changedTouches?e.changedTouches[0]:e}function O(e){var t=Math.max.apply(Math,e),r=Math.min.apply(Math,e);return Math.abs(t)>=Math.abs(r)?t:r}function P(){(Ae=Se.core.globals().ScrollTrigger)&&Ae.core&&function _integrate(){var e=Ae.core,r=e.bridge||{},t=e._scrollers,n=e._proxies;t.push.apply(t,Ie),n.push.apply(n,Le),Ie=t,Le=n,o=function _bridge(e,t){return r[e](t)}}()}function Q(e){return Se=e||r(),!Te&&Se&&"undefined"!=typeof document&&document.body&&(Ce=window,ke=(Me=document).documentElement,Ee=Me.body,t=[Ce,Me,ke,Ee],Se.utils.clamp,Be=Se.core.context||function(){},Oe="onpointerenter"in Ee?"pointer":"mouse",Pe=k.isTouch=Ce.matchMedia&&Ce.matchMedia("(hover: none), (pointer: coarse)").matches?1:"ontouchstart"in Ce||0<navigator.maxTouchPoints||0<navigator.msMaxTouchPoints?2:0,De=k.eventTypes=("ontouchstart"in ke?"touchstart,touchmove,touchcancel,touchend":"onpointerdown"in ke?"pointerdown,pointermove,pointercancel,pointerup":"mousedown,mousemove,mouseup,mouseup").split(","),setTimeout(function(){return i=0},500),Te=1),Ae||P(),Te}var Se,Te,Ce,Me,ke,Ee,Pe,Oe,Ae,t,Re,De,Be,i=1,ze=[],Ie=[],Le=[],Ye=Date.now,o=function _bridge(e,t){return t},n="scrollLeft",a="scrollTop",Ne={s:n,p:"left",p2:"Left",os:"right",os2:"Right",d:"width",d2:"Width",a:"x",sc:G(function(e){return arguments.length?Ce.scrollTo(e,Xe.sc()):Ce.pageXOffset||Me[n]||ke[n]||Ee[n]||0})},Xe={s:a,p:"top",p2:"Top",os:"bottom",os2:"Bottom",d:"height",d2:"Height",a:"y",op:Ne,sc:G(function(e){return arguments.length?Ce.scrollTo(Ne.sc(),e):Ce.pageYOffset||Me[a]||ke[a]||Ee[a]||0})};Ne.op=Xe,Ie.cache=0;var k=(Observer.prototype.init=function init(e){Te||Q(Se)||console.warn("Please gsap.registerPlugin(Observer)"),Ae||P();var i=e.tolerance,a=e.dragMinimum,t=e.type,o=e.target,r=e.lineHeight,n=e.debounce,s=e.preventDefault,l=e.onStop,c=e.onStopDelay,u=e.ignore,f=e.wheelSpeed,d=e.event,p=e.onDragStart,g=e.onDragEnd,h=e.onDrag,v=e.onPress,b=e.onRelease,m=e.onRight,y=e.onLeft,x=e.onUp,_=e.onDown,w=e.onChangeX,S=e.onChangeY,T=e.onChange,k=e.onToggleX,E=e.onToggleY,R=e.onHover,D=e.onHoverEnd,z=e.onMove,I=e.ignoreCheck,Y=e.isNormalizer,X=e.onGestureStart,U=e.onGestureEnd,q=e.onWheel,H=e.onEnable,W=e.onDisable,V=e.onClick,G=e.scrollSpeed,j=e.capture,K=e.allowClicks,$=e.lockAxis,Z=e.onLockAxis;function hf(){return xe=Ye()}function jf(e,t){return(se.event=e)&&u&&function _isWithin(e,t){for(var r=t.length;r--;)if(t[r]===e||t[r].contains(e))return!0;return!1}(e.target,u)||t&&he&&"touch"!==e.pointerType||I&&I(e,t)}function lf(){var e=se.deltaX=O(me),t=se.deltaY=O(ye),r=Math.abs(e)>=i,n=Math.abs(t)>=i;T&&(r||n)&&T(se,e,t,me,ye),r&&(m&&0<se.deltaX&&m(se),y&&se.deltaX<0&&y(se),w&&w(se),k&&se.deltaX<0!=le<0&&k(se),le=se.deltaX,me[0]=me[1]=me[2]=0),n&&(_&&0<se.deltaY&&_(se),x&&se.deltaY<0&&x(se),S&&S(se),E&&se.deltaY<0!=ce<0&&E(se),ce=se.deltaY,ye[0]=ye[1]=ye[2]=0),(ne||re)&&(z&&z(se),re&&(p&&1===re&&p(se),h&&h(se),re=0),ne=!1),oe&&!(oe=!1)&&Z&&Z(se),ie&&(q(se),ie=!1),ee=0}function mf(e,t,r){me[r]+=e,ye[r]+=t,se._vx.Line truncated
|
||||
|
||||
Vendored
+11
@@ -0,0 +1,11 @@
|
||||
/*!
|
||||
* SplitText 3.15.0
|
||||
* https://gsap.com
|
||||
*
|
||||
* @license Copyright 2026, GreenSock. All rights reserved. Subject to the terms at https://gsap.com/standard-license.
|
||||
* @author: Jack Doyle
|
||||
*/
|
||||
|
||||
(function(k,A){typeof exports=="object"&&typeof module!="undefined"?A(exports):typeof define=="function"&&define.amd?define(["exports"],A):(k=typeof globalThis!="undefined"?globalThis:k||self,A(k.window=k.window||{}))})(this,function(k){"use strict";let A,D,Z=typeof Symbol=="function"?Symbol():"_split",K,he=()=>K||Y.register(window.gsap),$=typeof Intl!="undefined"&&"Segmenter"in Intl?new Intl.Segmenter:0,I=e=>e?typeof e=="string"?I(document.querySelectorAll(e)):"length"in e?Array.from(e).reduce((t,i)=>(typeof i=="string"?t.push(...I(i)):t.push(i),t),[]):[e]:[],ee=e=>I(e).filter(t=>t&&t.nodeType===1),Q=[],U=function(){},de={add:e=>e()},pe=/\s+/g,te=new RegExp("\\p{RI}\\p{RI}|\\p{Emoji}(\\p{EMod}|\\u{FE0F}\\u{20E3}?|[\\u{E0020}-\\u{E007E}]+\\u{E007F})?(\\u{200D}\\p{Emoji}(\\p{EMod}|\\u{FE0F}\\u{20E3}?|[\\u{E0020}-\\u{E007E}]+\\u{E007F})?)*|.","gu"),J={left:0,top:0,width:0,height:0},ue=(e,t)=>{for(;++t<e.length&&e[t]===J;);return e[t]||J},ie=({element:e,html:t,ariaL:i,ariaH:n})=>{e.innerHTML=t,i?e.setAttribute("aria-label",i):e.removeAttribute("aria-label"),n?e.setAttribute("aria-hidden",n):e.removeAttribute("aria-hidden")},ne=(e,t)=>{if(t){let i=new Set(e.join("").match(t)||Q),n=e.length,a,c,l,o;if(i.size)for(;--n>-1;){c=e[n];for(l of i)if(l.startsWith(c)&&l.length>c.length){for(a=0,o=c;l.startsWith(o+=e[n+ ++a])&&o.length<l.length;);if(a&&o.length===l.length){e[n]=l,e.splice(n+1,a);break}}}}return e},le=e=>window.getComputedStyle(e).display==="inline"&&(e.style.display="inline-block"),M=(e,t,i)=>t.insertBefore(typeof e=="string"?document.createTextNode(e):e,i),X=(e,t,i)=>{let n=t[e+"sClass"]||"",{tag:a="div",aria:c="auto",propIndex:l=!1}=t,o=e==="line"?"block":"inline-block",d=n.indexOf("++")>-1,_=y=>{let m=document.createElement(a),E=i.length+1;return n&&(m.className=n+(d?" "+n+E:"")),l&&m.style.setProperty("--"+e,E+""),c!=="none"&&m.setAttribute("aria-hidden","true"),a!=="span"&&(m.style.position="relative",m.style.display=o),m.textContent=y,i.push(m),m};return d&&(n=n.replace("++","")),_.collection=i,_},fe=(e,t,i,n)=>{let a=X("line",i,n),c=window.getComputedStyle(e).textAlign||"left";return(l,o)=>{let d=a("");for(d.style.textAlign=c,e.insertBefore(d,t[l]);l<o;l++)d.appendChild(t[l]);d.normalize()}},se=(e,t,i,n,a,c,l,o,d,_)=>{var y;let m=Array.from(e.childNodes),E=0,{wordDelimiter:R,reduceWhiteSpace:B=!0,prepareText:V}=t,G=e.getBoundingClientRect(),j=G,q=!B&&window.getComputedStyle(e).whiteSpace.substring(0,3)==="pre",C=0,b=i.collection,r,f,O,s,g,x,z,h,p,W,S,T,N,F,w,u,L,v;for(typeof R=="object"?(O=R.delimiter||R,f=R.replaceWith||""):f=R===""?"":R||" ",r=f!==" ";E<m.length;E++)if(s=m[E],s.nodeType===3){for(w=s.textContent||"",B?w=w.replace(pe," "):q&&(w=w.replace(/\n/g,f+`
|
||||
`)),V&&(w=V(w,e)),s.textContent=w,g=f||O?w.split(O||f):w.match(o)||Q,L=g[g.length-1],h=r?L.slice(-1)===" ":!L,L||g.pop(),j=G,z=r?g[0].charAt(0)===" ":!g[0],z&&M(" ",e,s),g[0]||g.shift(),ne(g,d),c&&_||(s.textContent=""),p=1;p<=g.length;p++)if(u=g[p-1],!B&&q&&u.charAt(0)===`
|
||||
`&&((y=s.previousSibling)==null||y.remove(),M(document.createElement("br"),e,s),u=u.slice(1)),!B&&u==="")M(f,e,s);else if(u===" ")e.insertBefore(document.createTextNode(" "),s);else{if(r&&u.charAt(0)===" "&&M(" ",e,s),C&&p===1&&!z&&b.indexOf(C.parentNode)>-1?(x=b[b.length-1],x.appendChild(document.createTextNode(n?"":u))):(x=i(n?"":u),M(x,e,s),C&&p===1&&!z&&x.insertBefore(C,x.firstChild)),n)for(S=$?ne([...$.segment(u)].map(H=>H.segment),d):u.match(o)||Q,v=0;v<S.length;v++)x.appendChild(S[v]===" "?document.createTextNode(" "):n(S[v]));if(c&&_){if(w=s.textContent=w.substring(u.length+1,w.length),W=x.getBoundingClientRect(),W.top>j.top&&W.left<=j.left){for(T=e.cloneNode(),N=e.childNodes[0];N&&N!==x;)F=N,N=N.nextSibling,T.appendChild(F);e.parentNode.insertBefore(T,e),a&&le(T)}j=W}(p<g.length||h)&&M(p>=g.length?" ":r&&u.slice(-1)===" "?" "+f:f,e,s)}e.removeChild(s),C=0}else s.nodeType===1&&(l&&l.indexOf(s)>-1?(b.indexOf(s.previousSibling)>-1&&b[b.length-1].appendChild(s),C=s):(se(s,t,i,n,a,c,l,o,d,!0),C=0),a&&le(s))};const re=class ae{constructor(t,i){this.isSplit=!1,he(),this.elements=ee(t),this.chars=[],this.words=[],this.lines=[],this.masks=[],this.vars=i,this.elements.forEach(l=>{var o;i.overwrite!==!1&&((o=l[Z])==null||o._data.orig.filter(({element:d})=>d===l).forEach(ie)),l[Z]=this}),this._split=()=>this.isSplit&&this.split(this.vars);let n=[],a,c=()=>{let l=n.length,o;for(;l--;){o=n[l];let d=o.element.offsetWidth;if(d!==o.width){o.width=d,this._split();return}}};this._data={orig:n,obs:typeof ResizeObserver!="undefined"&&new ResizeObserver(()=>{clearTimeout(a),a=setTimeout(c,200)})},U(this),this.split(i)}split(t){return(this._ctx||de).add(()=>{this.isSplit&&this.revert(),this.vars=t=t||this.vars||{};let{type:i="chars,words,lines",aria:n="auto",deepSlice:a=!0,smartWrap:c,onSplit:l,autoSplit:o=!1,specialChars:d,mask:_}=this.vars,y=i.indexOf("lines")>-1,m=i.indexOf("chars")>-1,E=i.indexOf("words")>-1,R=m&&!E&&!y,B=d&&("push"in d?new RegExp("(?:"+d.join("|")+")","gu"):d),V=B?new RegExp(B.source+"|"+te.source,"gu"):te,G=!!t.ignore&&ee(t.ignore),{orig:j,animTime:q,obs:C}=this._data,b;(m||E||y)&&(this.elements.forEach((r,f)=>{j[f]={element:r,html:r.innerHTML,ariaL:r.getAttribute("aria-label"),ariaH:r.getAttribute("aria-hidden")},n==="auto"?r.setAttribute("aria-label",(r.textContent||"").trim()):n==="hidden"&&r.setAttribute("aria-hidden","true");let O=[],s=[],g=[],x=m?X("char",t,O):null,z=X("word",t,s),h,p,W,S;if(se(r,t,z,x,R,a&&(y||R),G,V,B,!1),y){let T=I(r.childNodes),N=fe(r,T,t,g),F,w=[],u=0,L=T.map(P=>P.nodeType===1?P.getBoundingClientRect():J),v=J,H;for(h=0;h<T.length;h++)F=T[h],F.nodeType===1&&(F.nodeName==="BR"?((!h||T[h-1].nodeName!=="BR")&&(w.push(F),N(u,h+1)),u=h+1,v=ue(L,h)):(H=L[h],h&&H.top>v.top&&H.left<v.left+v.width-1&&(N(u,h),u=h),v=H));u<h&&N(u,h),w.forEach(P=>{var oe;return(oe=P.parentNode)==null?void 0:oe.removeChild(P)})}if(!E){for(h=0;h<s.length;h++)if(p=s[h],m||!p.nextSibling||p.nextSibling.nodeType!==3)if(c&&!y){for(W=document.createElement("span"),W.style.whiteSpace="nowrap";p.firstChild;)W.appendChild(p.firstChild);p.replaceWith(W)}else p.replaceWith(...p.childNodes);else S=p.nextSibling,S&&S.nodeType===3&&(S.textContent=(p.textContent||"")+(S.textContent||""),p.remove());s.length=0,r.normalize()}this.lines.push(...g),this.words.push(...s),this.chars.push(...O)}),_&&this[_]&&this.masks.push(...this[_].map(r=>{let f=r.cloneNode();return r.replaceWith(f),f.appendChild(r),r.className&&(f.className=r.className.trim().split(" ").map(O=>O+"-mask").join(" ")),f.style.overflow="clip",f}))),this.isSplit=!0,D&&y&&o&&D.addEventListener("loadingdone",this._split),(b=l&&l(this))&&b.totalTime&&(this._data.anim=q?b.totalTime(q):b),y&&o&&this.elements.forEach((r,f)=>{j[f].width=r.offsetWidth,C&&C.observe(r)})}),this}kill(){let{obs:t}=this._data;t&&t.disconnect(),D==null||D.removeEventListener("loadingdone",this._split)}revert(){var t,i;if(this.isSplit){let{orig:n,anim:a}=this._data;this.kill(),n.forEach(ie),this.chars.length=this.words.length=this.lines.length=n.length=this.masks.length=0,this.isSplit=!1,a&&(this._data.animTime=a.totalTime(),a.revert()),(i=(t=this.vars).onRevert)==null||i.call(t,this)}return this}static create(t,i){return new ae(t,i)}static register(t){A=A||t||window.gsap,A&&(I=A.utils.toArray,U=A.core.context||U),!K&&window.innerWidth>0&&(D=document.fonts,K=!0)}};re.version="3.15.0";let Y=re;k.SplitText=Y,k.default=Y;if (typeof(window)==="undefined"||window!==k){Object.defineProperty(k,"__esModule",{value:!0})} else {delete k.default}});
|
||||
Vendored
+11
@@ -0,0 +1,11 @@
|
||||
/*!
|
||||
* GSAP 3.15.0
|
||||
* https://gsap.com
|
||||
*
|
||||
* @license Copyright 2026, GreenSock. All rights reserved.
|
||||
* Subject to the terms at https://gsap.com/standard-license.
|
||||
* @author: Jack Doyle, jack@greensock.com
|
||||
*/
|
||||
|
||||
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports):"function"==typeof define&&define.amd?define(["exports"],e):e((t=t||self).window=t.window||{})}(this,function(e){"use strict";function _inheritsLoose(t,e){t.prototype=Object.create(e.prototype),(t.prototype.constructor=t).__proto__=e}function _assertThisInitialized(t){if(void 0===t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return t}function r(t){return"string"==typeof t}function s(t){return"function"==typeof t}function t(t){return"number"==typeof t}function u(t){return void 0===t}function v(t){return"object"==typeof t}function w(t){return!1!==t}function x(){return"undefined"!=typeof window}function y(t){return s(t)||r(t)}function R(t){return(i=bt(t,ht))&&Fe}function S(t,e){return console.warn("Invalid property",t,"set to",e,"Missing plugin? gsap.registerPlugin()")}function T(t,e){return!e&&console.warn(t)}function U(t,e){return t&&(ht[t]=e)&&i&&(i[t]=e)||ht}function V(){return 0}function ga(t){var e,r,i=t[0];if(v(i)||s(i)||(t=[t]),!(e=(i._gsap||{}).harness)){for(r=yt.length;r--&&!yt[r].targetTest(i););e=yt[r]}for(r=t.length;r--;)t[r]&&(t[r]._gsap||(t[r]._gsap=new Xt(t[r],e)))||t.splice(r,1);return t}function ha(t){return t._gsap||ga(Pt(t))[0]._gsap}function ia(t,e,r){return(r=t[e])&&s(r)?t[e]():u(r)&&t.getAttribute&&t.getAttribute(e)||r}function ja(t,e){return(t=t.split(",")).forEach(e)||t}function ka(t){return Math.round(1e5*t)/1e5||0}function la(t){return Math.round(1e7*t)/1e7||0}function ma(t,e){var r=e.charAt(0),i=parseFloat(e.substr(2));return t=parseFloat(t),"+"===r?t+i:"-"===r?t-i:"*"===r?t*i:t/i}function na(t,e){for(var r=e.length,i=0;t.indexOf(e[i])<0&&++i<r;);return i<r}function oa(){var t,e,r=pt.length,i=pt.slice(0);for(_t={},t=pt.length=0;t<r;t++)(e=i[t])&&e._lazy&&(e.render(e._lazy[0],e._lazy[1],!0)._lazy=0)}function pa(t){return!!(t._initted||t._startAt||t.add)}function qa(t,e,r,i){pt.length&&!I&&oa(),t.render(e,r,i||!!(I&&e<0&&pa(t))),pt.length&&!I&&oa()}function ra(t){var e=parseFloat(t);return(e||0===e)&&(t+"").match(ot).length<2?e:r(t)?t.trim():t}function sa(t){return t}function ta(t,e){for(var r in e)r in t||(t[r]=e[r]);return t}function wa(t,e){for(var r in e)"__proto__"!==r&&"constructor"!==r&&"prototype"!==r&&(t[r]=v(e[r])?wa(t[r]||(t[r]={}),e[r]):e[r]);return t}function xa(t,e){var r,i={};for(r in t)r in e||(i[r]=t[r]);return i}function ya(t){var e=t.parent||L,r=t.keyframes?function _setKeyframeDefaults(i){return function(t,e){for(var r in e)r in t||"duration"===r&&i||"ease"===r||(t[r]=e[r])}}(K(t.keyframes)):ta;if(w(t.inherit))for(;e;)r(t,e.vars.defaults),e=e.parent||e._dp;return t}function Aa(t,e,r,i,n){void 0===r&&(r="_first"),void 0===i&&(i="_last");var a,s=t[i];if(n)for(a=e[n];s&&s[n]>a;)s=s._prev;return s?(e._next=s._next,s._next=e):(e._next=t[r],t[r]=e),e._next?e._next._prev=e:t[i]=e,e._prev=s,e.parent=e._dp=t,e}function Ba(t,e,r,i){void 0===r&&(r="_first"),void 0===i&&(i="_last");var n=e._prev,a=e._next;n?n._next=a:t[r]===e&&(t[r]=a),a?a._prev=n:t[i]===e&&(t[i]=n),e._next=e._prev=e.parent=null}function Ca(t,e){t.parent&&(!e||t.parent.autoRemoveChildren)&&t.parent.remove&&t.parent.remove(t),t._act=0}function Da(t,e){if(t&&(!e||e._end>t._dur||e._start<0))for(var r=t;r;)r._dirty=1,r=r.parent;return t}function Fa(t,e,r,i){return t._startAt&&(I?t._startAt.revert(ft):t.vars.immediateRender&&!t.vars.autoRevert||t._startAt.render(e,!0,i))}function Ha(t){return t._repeat?wt(t._tTime,t=t.duration()+t._rDelay)*t:0}function Ja(t,e){return(t-e._start)*e._ts+(0<=e._ts?0:e._dirty?e.totalDuration():e._tDur)}function Ka(t){return t._end=la(t._start+(t._tDur/Math.abs(t._ts||t._rts||q)||0))}function La(t,e){var r=t._dp;return r&&r.smoothChildTiming&&t._ts&&(t._start=la(r._time-(0<t._ts?e/t._ts:((t._dirty?t.totalDuration():t._tDur)-e)/-t._ts)),Ka(t),r._dirty||Da(r,t)),t}function Ma(t,e){var r;if((e._time||!e._dur&&e._initted||e._start<t._time&&(e._dur||!e.add))&&(r=Ja(t.rawTime(),e),(!e._dur||Mt(0,e.totalDuration(),r)-e._tTime>q)&&e.render(r,!0)),Da(t,e)._dp&&t._initted&&t._time>=t._dur&&t._ts){if(t._dur<t.duration())for(r=t;r._dp;)0<=r.rawTime()&&r.totalTime(r._tTime),r=r._dp;t._zTime=-q}}function Na(e,r,i,n){return r.parent&&Ca(r),r._start=la((t(i)?i:i||e!==L?Ot(e,i,r):e._time)+r._delay),r._end=la(r._start+(r.totalDuration()/Math.abs(r.timeScale())||0)),Aa(e,r,"_first","_last",e._sort?"_start":0),xt(r)||(e._recent=r),n||Ma(e,r),e._ts<0&&La(e,e._tTime),e}function Oa(t,e){return(ht.ScrollTrigger||S("scrollTrigger",e))&&ht.ScrollTrigger.create(e,t)}function Pa(t,e,r,i,n){return Ht(t,e,n),t._initted?!r&&t._pt&&!I&&(t._dur&&!1!==t.vars.lazy||!t._dur&&t.vars.lazy)&&f!==It.frame?(pt.push(t),t._lazy=[n,i],1):void 0:1}function Ua(t,e,r,i){var n=t._repeat,a=la(e)||0,s=t._tTime/t._tDur;return s&&!i&&(t._time*=a/t._dur),t._dur=a,t._tDur=n?n<0?1e10:la(a*(n+1)+t._rDelay*n):a,0<s&&!i&&La(t,t._tTime=t._tDur*s),t.parent&&Ka(t),r||Da(t.parent,t),t}function Va(t){return t instanceof Gt?Da(t)Line truncated
|
||||
|
||||
Vendored
+2
@@ -0,0 +1,2 @@
|
||||
(function(){var e=`1.3.26`;function t(e,t,n){return Math.max(e,Math.min(t,n))}function n(e,t,n){return(1-n)*e+n*t}function r(e,t,r,i){return n(e,t,1-Math.exp(-r*i))}function i(e,t){return(e%t+t)%t}var a=class{isRunning=!1;value=0;from=0;to=0;currentTime=0;lerp;duration;easing;onUpdate;advance(e){if(!this.isRunning)return;let n=!1;if(this.duration&&this.easing){this.currentTime+=e;let r=t(0,this.currentTime/this.duration,1);n=r>=1;let i=n?1:this.easing(r);this.value=this.from+(this.to-this.from)*i}else this.lerp?(this.value=r(this.value,this.to,this.lerp*60,e),Math.round(this.value)===Math.round(this.to)&&(this.value=this.to,n=!0)):(this.value=this.to,n=!0);n&&this.stop(),this.onUpdate?.(this.value,n)}stop(){this.isRunning=!1}fromTo(e,t,{lerp:n,duration:r,easing:i,onStart:a,onUpdate:o}){this.from=this.value=e,this.to=t,this.lerp=n,this.duration=r,this.easing=i,this.currentTime=0,this.isRunning=!0,a?.(),this.onUpdate=o}};function o(e,t){let n;return function(...r){clearTimeout(n),n=setTimeout(()=>{n=void 0,e.apply(this,r)},t)}}var s=class{width=0;height=0;scrollHeight=0;scrollWidth=0;debouncedResize;wrapperResizeObserver;contentResizeObserver;constructor(e,t,{autoResize:n=!0,debounce:r=250}={}){this.wrapper=e,this.content=t,n&&(this.debouncedResize=o(this.resize,r),this.wrapper instanceof Window?window.addEventListener(`resize`,this.debouncedResize):(this.wrapperResizeObserver=new ResizeObserver(this.debouncedResize),this.wrapperResizeObserver.observe(this.wrapper)),this.contentResizeObserver=new ResizeObserver(this.debouncedResize),this.contentResizeObserver.observe(this.content)),this.resize()}destroy(){this.wrapperResizeObserver?.disconnect(),this.contentResizeObserver?.disconnect(),this.wrapper===window&&this.debouncedResize&&window.removeEventListener(`resize`,this.debouncedResize)}resize=()=>{this.onWrapperResize(),this.onContentResize()};onWrapperResize=()=>{this.wrapper instanceof Window?(this.width=window.innerWidth,this.height=window.innerHeight):(this.width=this.wrapper.clientWidth,this.height=this.wrapper.clientHeight)};onContentResize=()=>{this.wrapper instanceof Window?(this.scrollHeight=this.content.scrollHeight,this.scrollWidth=this.content.scrollWidth):(this.scrollHeight=this.wrapper.scrollHeight,this.scrollWidth=this.wrapper.scrollWidth)};get limit(){return{x:this.scrollWidth-this.width,y:this.scrollHeight-this.height}}},c=class{events={};emit(e,...t){let n=this.events[e]||[];for(let e=0,r=n.length;e<r;e++)n[e]?.(...t)}on(e,t){return this.events[e]?this.events[e].push(t):this.events[e]=[t],()=>{this.events[e]=this.events[e]?.filter(e=>t!==e)}}off(e,t){this.events[e]=this.events[e]?.filter(e=>t!==e)}destroy(){this.events={}}};let l={passive:!1};function u(e,t){return e===1?16.666666666666668:e===2?t:1}var d=class{touchStart={x:0,y:0};lastDelta={x:0,y:0};window={width:0,height:0};emitter=new c;constructor(e,t={wheelMultiplier:1,touchMultiplier:1}){this.element=e,this.options=t,window.addEventListener(`resize`,this.onWindowResize),this.onWindowResize(),this.element.addEventListener(`wheel`,this.onWheel,l),this.element.addEventListener(`touchstart`,this.onTouchStart,l),this.element.addEventListener(`touchmove`,this.onTouchMove,l),this.element.addEventListener(`touchend`,this.onTouchEnd,l)}on(e,t){return this.emitter.on(e,t)}destroy(){this.emitter.destroy(),window.removeEventListener(`resize`,this.onWindowResize),this.element.removeEventListener(`wheel`,this.onWheel,l),this.element.removeEventListener(`touchstart`,this.onTouchStart,l),this.element.removeEventListener(`touchmove`,this.onTouchMove,l),this.element.removeEventListener(`touchend`,this.onTouchEnd,l)}onTouchStart=e=>{let{clientX:t,clientY:n}=e.targetTouches?e.targetTouches[0]:e;this.touchStart.x=t,this.touchStart.y=n,this.lastDelta={x:0,y:0},this.emitter.emit(`scroll`,{deltaX:0,deltaY:0,event:e})};onTouchMove=e=>{let{clientX:t,clientY:n}=e.targetTouches?e.targetTouches[0]:e,r=-(t-this.touchStart.x)*this.options.touchMultiplier,i=-(n-this.touchStart.y)*this.options.touchMultiplier;this.touchStart.x=t,this.touchStart.y=n,this.lastDelta={x:r,y:i},this.emitter.emit(`scroll`,{deltaX:r,deltaY:i,event:e})};onTouchEnd=e=>{this.emitter.emit(`scroll`,{deltaX:this.lastDelta.x,deltaY:this.lastDelta.y,event:e})};onWheel=e=>{let{deltaX:t,deltaY:n,deltaMode:r}=e,i=u(r,this.window.width),a=u(r,this.window.height);t*=i,n*=a,t*=this.options.wheelMultiplier,n*=this.options.wheelMultiplier,this.emitter.emit(`scroll`,{deltaX:t,deltaY:n,event:e})};onWindowResize=()=>{this.window={width:window.innerWidth,height:window.innerHeight}}};let f=e=>Math.min(1,1.001-2**(-10*e));var p=class{_isScrolling=!1;_isStopped=!1;_isLocked=!1;_preventNextNativeScrollEvent=!1;_resetVelocityTimeout=null;_rafId=null;_isDraggingSelection=!1;reducedMotionMediaQuery=window.matchMedia(`(prefers-reduced-motion: reduce)`);isTouching;isIos;time=0;userData={};lastVelocity=0;velocity=0;direction=0;options;targetScroll;animatedScroll;animate=new a;emitter=new c;dimensions;virtualScroll;conLine truncated
|
||||
//# sourceMappingURL=lenis.min.js.map
|
||||
@@ -0,0 +1,133 @@
|
||||
<!doctype html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>Datenschutz — Kirschner Gebäudeservice</title>
|
||||
<meta name="description" content="Datenschutzerklärung von Kirschner Gebäudeservice: keine Cookies, kein Tracking, keine Fremdinhalte.">
|
||||
<link rel="canonical" href="https://www.kirschner-service.de/datenschutz.html">
|
||||
<meta name="theme-color" content="#0A1424">
|
||||
<meta property="og:type" content="website">
|
||||
<meta property="og:locale" content="de_DE">
|
||||
<meta property="og:site_name" content="Kirschner Gebäudeservice">
|
||||
<meta property="og:title" content="Datenschutz — Kirschner Gebäudeservice">
|
||||
<meta property="og:description" content="Datenschutzerklärung von Kirschner Gebäudeservice: keine Cookies, kein Tracking, keine Fremdinhalte.">
|
||||
<meta property="og:url" content="https://www.kirschner-service.de/datenschutz.html">
|
||||
<meta property="og:image" content="https://www.kirschner-service.de/assets/img/og.jpg">
|
||||
<link rel="icon" href="assets/favicon.svg" type="image/svg+xml">
|
||||
<link rel="apple-touch-icon" href="assets/apple-touch-icon.png">
|
||||
<link rel="preload" href="assets/fonts/archivo-latin-wdth-normal.woff2" as="font" type="font/woff2" crossorigin>
|
||||
<link rel="stylesheet" href="assets/site.css">
|
||||
<script>(function(r){r.classList.add('js');try{if(r.hasAttribute('data-intro')&&!sessionStorage.getItem('kk-intro')&&matchMedia('(prefers-reduced-motion: no-preference)').matches)r.classList.add('has-intro')}catch(e){}setTimeout(function(){if(!r.classList.contains('motion-ready'))r.classList.remove('js','has-intro')},3000)})(document.documentElement)</script>
|
||||
<script src="assets/vendor/gsap.min.js" defer></script>
|
||||
<script src="assets/vendor/ScrollTrigger.min.js" defer></script>
|
||||
<script src="assets/vendor/SplitText.min.js" defer></script>
|
||||
<script src="assets/vendor/lenis.min.js" defer></script>
|
||||
<script src="assets/motion.js" defer></script>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<a class="skip-link" href="#inhalt">Zum Inhalt springen</a>
|
||||
<header class="site-header">
|
||||
<div class="wrap site-header__inner">
|
||||
<a class="brand" href="index.html" aria-label="Kirschner Gebäudeservice — Startseite">
|
||||
<svg class="chev-mark" viewBox="0 0 44 32" aria-hidden="true"><polygon class="chev" opacity=".55" points="14,0 24,0 10,16 24,32 14,32 0,16"/><polygon class="chev" points="32,0 42,0 28,16 42,32 32,32 18,16"/></svg>
|
||||
<span class="brand__name"><b>KIRSCHNER</b><span>Gebäudeservice</span></span>
|
||||
</a>
|
||||
<nav class="nav" aria-label="Hauptnavigation"><a class="nav__link" href="leistungen.html">Leistungen</a><a class="nav__link" href="unternehmen.html">Unternehmen</a><a class="nav__link" href="karriere.html">Karriere</a><a class="nav__link" href="kontakt.html">Kontakt</a></nav>
|
||||
<div class="header-cta">
|
||||
<a class="header-phone" href="tel:+4987114269101"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linejoin="round" aria-hidden="true"><path d="M5 4h4l2 5-2.5 1.5a11 11 0 0 0 5 5L15 13l5 2v4a2 2 0 0 1-2 2A16 16 0 0 1 3 6a2 2 0 0 1 2-2"/></svg><span>0871 / 14 26 91 01</span></a>
|
||||
<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>
|
||||
<button class="menu-toggle" type="button" aria-expanded="false" aria-controls="mobile-nav" aria-label="Menü öffnen"><span class="menu-toggle__bars"></span></button>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
<div class="mobile-nav" id="mobile-nav">
|
||||
<nav aria-label="Mobile Navigation"><ul role="list"><li><a class="mobile-nav__link" href="index.html">Start</a></li><li><a class="mobile-nav__link" href="leistungen.html">Leistungen</a></li><li><a class="mobile-nav__link" href="unternehmen.html">Unternehmen</a></li><li><a class="mobile-nav__link" href="karriere.html">Karriere</a></li><li><a class="mobile-nav__link" href="kontakt.html">Kontakt</a></li></ul></nav>
|
||||
<div class="mobile-nav__meta">
|
||||
<a href="tel:+4987114269101">Büro 0871 / 14 26 91 01</a>
|
||||
<a href="tel:+491608365753">Notruf 24/7 0160 / 836 57 53</a>
|
||||
<a href="mailto:info@kirschner-service.de">info@kirschner-service.de</a>
|
||||
</div>
|
||||
</div>
|
||||
<main id="inhalt">
|
||||
|
||||
<section class="page-hero">
|
||||
<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">
|
||||
<div class="stack">
|
||||
<p class="eyebrow" data-hero>Rechtliches</p>
|
||||
<h1 class="display" data-split>Datenschutz</h1>
|
||||
</div>
|
||||
<div class="stack">
|
||||
<p class="lead" data-hero>Kurz gesagt: Diese Website setzt keine Cookies, verwendet kein Tracking und lädt nichts von fremden Servern.</p>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section class="section theme-light" style="padding-top: var(--s6)">
|
||||
<div class="wrap legal">
|
||||
<h2>1. Verantwortlicher</h2>
|
||||
<address>Kirschner Gebäudeservice, Thomas Kirschner<br>Etzstraße 45, 84030 Ergolding<br>Telefon: 0871 / 14 26 91 01<br>E-Mail: <a href="mailto:info@kirschner-service.de">info@kirschner-service.de</a></address>
|
||||
|
||||
<h2>2. Hosting und Server-Logfiles</h2>
|
||||
<p>Beim Aufruf dieser Website verarbeitet unser Hosting-Anbieter technisch notwendige Daten (IP-Adresse, Datum und Uhrzeit, aufgerufene Seite, Referrer, Browser und Betriebssystem), um die Seite auszuliefern und die Sicherheit des Betriebs zu gewährleisten. Rechtsgrundlage ist Art. 6 Abs. 1 lit. f DSGVO; unser berechtigtes Interesse liegt im sicheren und stabilen Betrieb der Website.</p>
|
||||
<span class="todo">Offen: Name und Anschrift des Hosting-Anbieters, Abschluss eines Auftragsverarbeitungsvertrags (Art. 28 DSGVO) und Speicherdauer der Logfiles eintragen.</span>
|
||||
|
||||
<h2>3. Keine Cookies, kein Tracking, keine Fremdinhalte</h2>
|
||||
<p>Diese Website setzt keine Cookies und verwendet keine Analyse- oder Marketingwerkzeuge. Schriften und Skripte liegen auf unserem eigenen Server; es werden keine Inhalte von Drittanbietern nachgeladen. Lediglich im Browser-Sitzungsspeicher (sessionStorage) wird vermerkt, dass die Eröffnungsanimation bereits gezeigt wurde — dieser Eintrag enthält keine personenbezogenen Daten und wird beim Schließen des Browsers gelöscht.</p>
|
||||
|
||||
<h2>4. Externe Links</h2>
|
||||
<p>Der Link „Route planen" führt zu Google Maps (Google Ireland Limited). Erst wenn Sie ihn anklicken, werden Daten an Google übertragen; dafür gilt die Datenschutzerklärung von Google.</p>
|
||||
|
||||
<h2>5. Kontakt per E-Mail oder Telefon</h2>
|
||||
<p>Wenn Sie uns per E-Mail oder Telefon kontaktieren, verarbeiten wir Ihre Angaben zur Bearbeitung der Anfrage und für Anschlussfragen. Rechtsgrundlage ist Art. 6 Abs. 1 lit. b DSGVO, soweit Ihre Anfrage mit einem Vertrag zusammenhängt, ansonsten Art. 6 Abs. 1 lit. f DSGVO. Wir löschen die Daten, sobald sie nicht mehr erforderlich sind und keine gesetzlichen Aufbewahrungspflichten bestehen.</p>
|
||||
|
||||
<h2>6. Bewerbungen</h2>
|
||||
<p>Bewerbungen, die Sie uns per E-Mail senden, verarbeiten wir zur Durchführung des Bewerbungsverfahrens (§ 26 BDSG, Art. 6 Abs. 1 lit. b DSGVO). Kommt kein Arbeitsverhältnis zustande, löschen wir Ihre Unterlagen spätestens sechs Monate nach Abschluss des Verfahrens.</p>
|
||||
|
||||
<h2>7. Ihre Rechte</h2>
|
||||
<p>Sie haben das Recht auf Auskunft, Berichtigung, Löschung, Einschränkung der Verarbeitung, Datenübertragbarkeit sowie Widerspruch gegen Verarbeitungen auf Grundlage von Art. 6 Abs. 1 lit. f DSGVO. Wenden Sie sich dazu einfach an die oben genannten Kontaktdaten.</p>
|
||||
<p>Sie können sich außerdem bei einer Datenschutz-Aufsichtsbehörde beschweren, für uns zuständig ist das Bayerische Landesamt für Datenschutzaufsicht (BayLDA), Promenade 18, 91522 Ansbach.</p>
|
||||
|
||||
<p class="mt-4"><em>Stand: September 2026. Entwurf — vor Veröffentlichung juristisch prüfen lassen.</em></p>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
<footer class="site-footer">
|
||||
<div class="wrap">
|
||||
<div class="footer-grid">
|
||||
<div>
|
||||
<a class="brand" href="index.html" aria-label="Kirschner Gebäudeservice — Startseite"><svg class="chev-mark" viewBox="0 0 44 32" aria-hidden="true"><polygon class="chev" opacity=".55" points="14,0 24,0 10,16 24,32 14,32 0,16"/><polygon class="chev" points="32,0 42,0 28,16 42,32 32,32 18,16"/></svg><span class="brand__name"><b>KIRSCHNER</b><span>Gebäudeservice</span></span></a>
|
||||
<p class="footer-motto">Das Original seit 2003. Persönlich, zuverlässig, erstklassig — in Landshut, Ergolding und Umgebung.</p>
|
||||
</div>
|
||||
<div>
|
||||
<h2>Seiten</h2>
|
||||
<ul role="list"><li><a href="index.html">Start</a></li><li><a href="leistungen.html">Leistungen</a></li><li><a href="unternehmen.html">Unternehmen</a></li><li><a href="karriere.html">Karriere</a></li><li><a href="kontakt.html">Kontakt</a></li></ul>
|
||||
</div>
|
||||
<div>
|
||||
<h2>Kontakt</h2>
|
||||
<ul role="list">
|
||||
<li><a href="tel:+4987114269101">0871 / 14 26 91 01</a></li>
|
||||
<li><a href="tel:+491608365753">Notruf 0160 / 836 57 53</a></li>
|
||||
<li><a href="mailto:info@kirschner-service.de">info@kirschner-service.de</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div>
|
||||
<h2>Adresse</h2>
|
||||
<address style="font-style:normal">Etzstraße 45<br>84030 Ergolding<br><a href="https://www.google.com/maps/search/?api=1&query=Etzstra%C3%9Fe+45%2C+84030+Ergolding" rel="noopener" target="_blank">Route planen</a></address>
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer-word" aria-hidden="true">KIRSCHNER</div>
|
||||
<div class="footer-bottom">
|
||||
<span>© <span data-year>2026</span> Kirschner Gebäudeservice · Thomas Kirschner</span>
|
||||
<nav aria-label="Rechtliches"><a href="impressum.html">Impressum</a><a href="datenschutz.html">Datenschutz</a></nav>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
<a class="sos" href="tel:+491608365753" aria-label="24/7 Notruf anrufen: 0160 / 836 57 53">
|
||||
<span class="sos__dot" aria-hidden="true"></span>
|
||||
<span><small>Notruf 24/7</small><b>0160 / 836 57 53</b></span>
|
||||
</a>
|
||||
</body>
|
||||
</html>
|
||||
BIN
Binary file not shown.
|
After Width: | Height: | Size: 4.8 KiB |
+135
@@ -0,0 +1,135 @@
|
||||
<!doctype html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>Impressum — Kirschner Gebäudeservice</title>
|
||||
<meta name="description" content="Impressum von Kirschner Gebäudeservice, Etzstraße 45, 84030 Ergolding.">
|
||||
<link rel="canonical" href="https://www.kirschner-service.de/impressum.html">
|
||||
<meta name="theme-color" content="#0A1424">
|
||||
<meta property="og:type" content="website">
|
||||
<meta property="og:locale" content="de_DE">
|
||||
<meta property="og:site_name" content="Kirschner Gebäudeservice">
|
||||
<meta property="og:title" content="Impressum — Kirschner Gebäudeservice">
|
||||
<meta property="og:description" content="Impressum von Kirschner Gebäudeservice, Etzstraße 45, 84030 Ergolding.">
|
||||
<meta property="og:url" content="https://www.kirschner-service.de/impressum.html">
|
||||
<meta property="og:image" content="https://www.kirschner-service.de/assets/img/og.jpg">
|
||||
<link rel="icon" href="assets/favicon.svg" type="image/svg+xml">
|
||||
<link rel="apple-touch-icon" href="assets/apple-touch-icon.png">
|
||||
<link rel="preload" href="assets/fonts/archivo-latin-wdth-normal.woff2" as="font" type="font/woff2" crossorigin>
|
||||
<link rel="stylesheet" href="assets/site.css">
|
||||
<script>(function(r){r.classList.add('js');try{if(r.hasAttribute('data-intro')&&!sessionStorage.getItem('kk-intro')&&matchMedia('(prefers-reduced-motion: no-preference)').matches)r.classList.add('has-intro')}catch(e){}setTimeout(function(){if(!r.classList.contains('motion-ready'))r.classList.remove('js','has-intro')},3000)})(document.documentElement)</script>
|
||||
<script src="assets/vendor/gsap.min.js" defer></script>
|
||||
<script src="assets/vendor/ScrollTrigger.min.js" defer></script>
|
||||
<script src="assets/vendor/SplitText.min.js" defer></script>
|
||||
<script src="assets/vendor/lenis.min.js" defer></script>
|
||||
<script src="assets/motion.js" defer></script>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<a class="skip-link" href="#inhalt">Zum Inhalt springen</a>
|
||||
<header class="site-header">
|
||||
<div class="wrap site-header__inner">
|
||||
<a class="brand" href="index.html" aria-label="Kirschner Gebäudeservice — Startseite">
|
||||
<svg class="chev-mark" viewBox="0 0 44 32" aria-hidden="true"><polygon class="chev" opacity=".55" points="14,0 24,0 10,16 24,32 14,32 0,16"/><polygon class="chev" points="32,0 42,0 28,16 42,32 32,32 18,16"/></svg>
|
||||
<span class="brand__name"><b>KIRSCHNER</b><span>Gebäudeservice</span></span>
|
||||
</a>
|
||||
<nav class="nav" aria-label="Hauptnavigation"><a class="nav__link" href="leistungen.html">Leistungen</a><a class="nav__link" href="unternehmen.html">Unternehmen</a><a class="nav__link" href="karriere.html">Karriere</a><a class="nav__link" href="kontakt.html">Kontakt</a></nav>
|
||||
<div class="header-cta">
|
||||
<a class="header-phone" href="tel:+4987114269101"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linejoin="round" aria-hidden="true"><path d="M5 4h4l2 5-2.5 1.5a11 11 0 0 0 5 5L15 13l5 2v4a2 2 0 0 1-2 2A16 16 0 0 1 3 6a2 2 0 0 1 2-2"/></svg><span>0871 / 14 26 91 01</span></a>
|
||||
<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>
|
||||
<button class="menu-toggle" type="button" aria-expanded="false" aria-controls="mobile-nav" aria-label="Menü öffnen"><span class="menu-toggle__bars"></span></button>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
<div class="mobile-nav" id="mobile-nav">
|
||||
<nav aria-label="Mobile Navigation"><ul role="list"><li><a class="mobile-nav__link" href="index.html">Start</a></li><li><a class="mobile-nav__link" href="leistungen.html">Leistungen</a></li><li><a class="mobile-nav__link" href="unternehmen.html">Unternehmen</a></li><li><a class="mobile-nav__link" href="karriere.html">Karriere</a></li><li><a class="mobile-nav__link" href="kontakt.html">Kontakt</a></li></ul></nav>
|
||||
<div class="mobile-nav__meta">
|
||||
<a href="tel:+4987114269101">Büro 0871 / 14 26 91 01</a>
|
||||
<a href="tel:+491608365753">Notruf 24/7 0160 / 836 57 53</a>
|
||||
<a href="mailto:info@kirschner-service.de">info@kirschner-service.de</a>
|
||||
</div>
|
||||
</div>
|
||||
<main id="inhalt">
|
||||
|
||||
<section class="page-hero">
|
||||
<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">
|
||||
<div class="stack">
|
||||
<p class="eyebrow" data-hero>Rechtliches</p>
|
||||
<h1 class="display" data-split>Impressum</h1>
|
||||
</div>
|
||||
<div class="stack">
|
||||
<p class="lead" data-hero>Angaben gemäß § 5 Digitale-Dienste-Gesetz (DDG).</p>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section class="section theme-light" style="padding-top: var(--s6)">
|
||||
<div class="wrap legal">
|
||||
<h2>Anbieter</h2>
|
||||
<address>Kirschner Gebäudeservice<br>Inhaber: Thomas Kirschner<br>Etzstraße 45<br>84030 Ergolding</address>
|
||||
<span class="todo">Offen: Rechtsform bestätigen (Einzelunternehmen?). Falls GmbH o. Ä.: Firmierung, Registergericht, Registernummer und Vertretungsberechtigte ergänzen.</span>
|
||||
|
||||
<h2>Kontakt</h2>
|
||||
<p>Telefon: <a href="tel:+4987114269101">0871 / 14 26 91 01</a><br>Mobil: <a href="tel:+491608365753">0160 / 836 57 53</a><br>E-Mail: <a href="mailto:info@kirschner-service.de">info@kirschner-service.de</a></p>
|
||||
|
||||
<h2>Steuern</h2>
|
||||
<p>Steuernummer: 132/236/30809</p>
|
||||
|
||||
<h2>Verantwortlich für den Inhalt nach § 18 Abs. 2 MStV</h2>
|
||||
<p>Thomas Kirschner, Anschrift wie oben.</p>
|
||||
|
||||
<h2>Verbraucherstreitbeilegung</h2>
|
||||
<p>Wir sind nicht bereit und nicht verpflichtet, an Streitbeilegungsverfahren vor einer Verbraucherschlichtungsstelle teilzunehmen.</p>
|
||||
|
||||
<h2>Haftung für Inhalte und Links</h2>
|
||||
<p>Die Inhalte dieser Seiten wurden mit größter Sorgfalt erstellt. Für die Richtigkeit, Vollständigkeit und Aktualität können wir jedoch keine Gewähr übernehmen. Als Diensteanbieter sind wir für eigene Inhalte nach den allgemeinen Gesetzen verantwortlich. Für Inhalte externer Links sind ausschließlich deren Betreiber verantwortlich; rechtswidrige Inhalte waren zum Zeitpunkt der Verlinkung nicht erkennbar. Bei Bekanntwerden von Rechtsverletzungen entfernen wir entsprechende Inhalte oder Links umgehend.</p>
|
||||
|
||||
<h2>Urheberrecht</h2>
|
||||
<p>Die durch uns erstellten Inhalte und Werke auf diesen Seiten unterliegen dem deutschen Urheberrecht. Vervielfältigung, Bearbeitung und Verbreitung außerhalb der Grenzen des Urheberrechts bedürfen unserer schriftlichen Zustimmung.</p>
|
||||
|
||||
<h2>Bildnachweise</h2>
|
||||
<p>Fotos von Unsplash (Unsplash-Lizenz):</p>
|
||||
<ul><li>Titelbild (Wohngebäude): Tobias Wilden</li><li>Treppenhaus: Payam Moin Afshari</li><li>Fensterreinigung: Joshua Bowers</li><li>PV-Reinigung: Florida Solar Fix</li><li>Heckenschnitt: Mustafa Turhan</li><li>Haustechnik: Peter Herrmann</li><li>Reparatur: Theme Photos</li><li>Winterdienst: Bradley Andrews</li><li>Glasfassade: Priscilla Du Preez</li></ul>
|
||||
<p>Schrift: Archivo (SIL Open Font License), lokal eingebunden.</p>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
<footer class="site-footer">
|
||||
<div class="wrap">
|
||||
<div class="footer-grid">
|
||||
<div>
|
||||
<a class="brand" href="index.html" aria-label="Kirschner Gebäudeservice — Startseite"><svg class="chev-mark" viewBox="0 0 44 32" aria-hidden="true"><polygon class="chev" opacity=".55" points="14,0 24,0 10,16 24,32 14,32 0,16"/><polygon class="chev" points="32,0 42,0 28,16 42,32 32,32 18,16"/></svg><span class="brand__name"><b>KIRSCHNER</b><span>Gebäudeservice</span></span></a>
|
||||
<p class="footer-motto">Das Original seit 2003. Persönlich, zuverlässig, erstklassig — in Landshut, Ergolding und Umgebung.</p>
|
||||
</div>
|
||||
<div>
|
||||
<h2>Seiten</h2>
|
||||
<ul role="list"><li><a href="index.html">Start</a></li><li><a href="leistungen.html">Leistungen</a></li><li><a href="unternehmen.html">Unternehmen</a></li><li><a href="karriere.html">Karriere</a></li><li><a href="kontakt.html">Kontakt</a></li></ul>
|
||||
</div>
|
||||
<div>
|
||||
<h2>Kontakt</h2>
|
||||
<ul role="list">
|
||||
<li><a href="tel:+4987114269101">0871 / 14 26 91 01</a></li>
|
||||
<li><a href="tel:+491608365753">Notruf 0160 / 836 57 53</a></li>
|
||||
<li><a href="mailto:info@kirschner-service.de">info@kirschner-service.de</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div>
|
||||
<h2>Adresse</h2>
|
||||
<address style="font-style:normal">Etzstraße 45<br>84030 Ergolding<br><a href="https://www.google.com/maps/search/?api=1&query=Etzstra%C3%9Fe+45%2C+84030+Ergolding" rel="noopener" target="_blank">Route planen</a></address>
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer-word" aria-hidden="true">KIRSCHNER</div>
|
||||
<div class="footer-bottom">
|
||||
<span>© <span data-year>2026</span> Kirschner Gebäudeservice · Thomas Kirschner</span>
|
||||
<nav aria-label="Rechtliches"><a href="impressum.html">Impressum</a><a href="datenschutz.html">Datenschutz</a></nav>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
<a class="sos" href="tel:+491608365753" aria-label="24/7 Notruf anrufen: 0160 / 836 57 53">
|
||||
<span class="sos__dot" aria-hidden="true"></span>
|
||||
<span><small>Notruf 24/7</small><b>0160 / 836 57 53</b></span>
|
||||
</a>
|
||||
</body>
|
||||
</html>
|
||||
+295
@@ -0,0 +1,295 @@
|
||||
<!doctype html>
|
||||
<html lang="de" data-intro>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>Kirschner Gebäudeservice — Hausmeisterservice in Landshut & Ergolding seit 2003</title>
|
||||
<meta name="description" content="Hausmeisterservice, Reinigung, Glas- & PV-Reinigung mit Osmose, Grünpflege, Winterdienst und 24/7-Bereitschaft in Landshut und Ergolding. Persönlich, zuverlässig, erstklassig — seit 2003.">
|
||||
<link rel="canonical" href="https://www.kirschner-service.de/">
|
||||
<meta name="theme-color" content="#0A1424">
|
||||
<meta property="og:type" content="website">
|
||||
<meta property="og:locale" content="de_DE">
|
||||
<meta property="og:site_name" content="Kirschner Gebäudeservice">
|
||||
<meta property="og:title" content="Kirschner Gebäudeservice — Hausmeisterservice in Landshut & Ergolding seit 2003">
|
||||
<meta property="og:description" content="Hausmeisterservice, Reinigung, Glas- & PV-Reinigung mit Osmose, Grünpflege, Winterdienst und 24/7-Bereitschaft in Landshut und Ergolding. Persönlich, zuverlässig, erstklassig — seit 2003.">
|
||||
<meta property="og:url" content="https://www.kirschner-service.de/">
|
||||
<meta property="og:image" content="https://www.kirschner-service.de/assets/img/og.jpg">
|
||||
<link rel="icon" href="assets/favicon.svg" type="image/svg+xml">
|
||||
<link rel="apple-touch-icon" href="assets/apple-touch-icon.png">
|
||||
<link rel="preload" href="assets/fonts/archivo-latin-wdth-normal.woff2" as="font" type="font/woff2" crossorigin>
|
||||
<link rel="stylesheet" href="assets/site.css">
|
||||
<script>(function(r){r.classList.add('js');try{if(r.hasAttribute('data-intro')&&!sessionStorage.getItem('kk-intro')&&matchMedia('(prefers-reduced-motion: no-preference)').matches)r.classList.add('has-intro')}catch(e){}setTimeout(function(){if(!r.classList.contains('motion-ready'))r.classList.remove('js','has-intro')},3000)})(document.documentElement)</script>
|
||||
<script src="assets/vendor/gsap.min.js" defer></script>
|
||||
<script src="assets/vendor/ScrollTrigger.min.js" defer></script>
|
||||
<script src="assets/vendor/SplitText.min.js" defer></script>
|
||||
<script src="assets/vendor/lenis.min.js" defer></script>
|
||||
<script src="assets/motion.js" defer></script>
|
||||
<script type="application/ld+json">{"@context": "https://schema.org", "@type": "LocalBusiness", "name": "Kirschner Gebäudeservice", "description": "Hausmeisterservice und Gebäudedienstleistungen in Landshut und Ergolding seit 2003.", "url": "https://www.kirschner-service.de/", "telephone": "+49 871 14269101", "email": "info@kirschner-service.de", "foundingDate": "2003", "founder": {"@type": "Person", "name": "Thomas Kirschner"}, "address": {"@type": "PostalAddress", "streetAddress": "Etzstraße 45", "postalCode": "84030", "addressLocality": "Ergolding", "addressRegion": "Bayern", "addressCountry": "DE"}, "areaServed": ["Landshut", "Ergolding"], "slogan": "persönlich, zuverlässig, erstklassig", "image": "https://www.kirschner-service.de/assets/img/og.jpg"}</script>
|
||||
</head>
|
||||
<body>
|
||||
<a class="skip-link" href="#inhalt">Zum Inhalt springen</a>
|
||||
<header class="site-header">
|
||||
<div class="wrap site-header__inner">
|
||||
<a class="brand" href="index.html" aria-label="Kirschner Gebäudeservice — Startseite">
|
||||
<svg class="chev-mark" viewBox="0 0 44 32" aria-hidden="true"><polygon class="chev" opacity=".55" points="14,0 24,0 10,16 24,32 14,32 0,16"/><polygon class="chev" points="32,0 42,0 28,16 42,32 32,32 18,16"/></svg>
|
||||
<span class="brand__name"><b>KIRSCHNER</b><span>Gebäudeservice</span></span>
|
||||
</a>
|
||||
<nav class="nav" aria-label="Hauptnavigation"><a class="nav__link" href="leistungen.html">Leistungen</a><a class="nav__link" href="unternehmen.html">Unternehmen</a><a class="nav__link" href="karriere.html">Karriere</a><a class="nav__link" href="kontakt.html">Kontakt</a></nav>
|
||||
<div class="header-cta">
|
||||
<a class="header-phone" href="tel:+4987114269101"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linejoin="round" aria-hidden="true"><path d="M5 4h4l2 5-2.5 1.5a11 11 0 0 0 5 5L15 13l5 2v4a2 2 0 0 1-2 2A16 16 0 0 1 3 6a2 2 0 0 1 2-2"/></svg><span>0871 / 14 26 91 01</span></a>
|
||||
<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>
|
||||
<button class="menu-toggle" type="button" aria-expanded="false" aria-controls="mobile-nav" aria-label="Menü öffnen"><span class="menu-toggle__bars"></span></button>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
<div class="mobile-nav" id="mobile-nav">
|
||||
<nav aria-label="Mobile Navigation"><ul role="list"><li><a class="mobile-nav__link" href="index.html" aria-current="page">Start</a></li><li><a class="mobile-nav__link" href="leistungen.html">Leistungen</a></li><li><a class="mobile-nav__link" href="unternehmen.html">Unternehmen</a></li><li><a class="mobile-nav__link" href="karriere.html">Karriere</a></li><li><a class="mobile-nav__link" href="kontakt.html">Kontakt</a></li></ul></nav>
|
||||
<div class="mobile-nav__meta">
|
||||
<a href="tel:+4987114269101">Büro 0871 / 14 26 91 01</a>
|
||||
<a href="tel:+491608365753">Notruf 24/7 0160 / 836 57 53</a>
|
||||
<a href="mailto:info@kirschner-service.de">info@kirschner-service.de</a>
|
||||
</div>
|
||||
</div>
|
||||
<main id="inhalt">
|
||||
|
||||
<div class="intro" aria-hidden="true">
|
||||
<div class="intro__mark">
|
||||
<svg class="chev-mark" viewBox="0 0 44 32" aria-hidden="true"><polygon class="chev" opacity=".55" points="14,0 24,0 10,16 24,32 14,32 0,16"/><polygon class="chev" points="32,0 42,0 28,16 42,32 32,32 18,16"/></svg>
|
||||
<div class="intro__word"><span>KIRSCHNER</span><small>Gebäudeservice</small></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<section class="hero" aria-labelledby="hero-title">
|
||||
<div class="hero__media"><picture><source type="image/avif" srcset="assets/img/hero-800.avif 800w, assets/img/hero-1600.avif 1600w" sizes="100vw"><source type="image/webp" srcset="assets/img/hero-800.webp 800w, assets/img/hero-1600.webp 1600w" sizes="100vw"><img src="assets/img/hero-1600.webp" width="1600" height="1068" 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">
|
||||
<div class="hero__content">
|
||||
<p class="eyebrow" data-hero>Hausmeisterservice · Landshut & Ergolding</p>
|
||||
<h1 class="mega" id="hero-title" data-split>Ihr Gebäude.<br> In besten Händen.</h1>
|
||||
<p class="lead" data-hero>Reinigung, Grünpflege, Technik, Reparaturen und Winterdienst aus einer Hand — für Privat, Eigentümergemeinschaften, Gewerbe und die öffentliche Hand. Seit 2003.</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>
|
||||
<a class="btn btn--ghost" href="leistungen.html">Alle Leistungen <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 class="hero__foot" data-hero>
|
||||
<ul role="list">
|
||||
<li>Das Original seit 2003</li>
|
||||
<li>Eigene Osmoseanlage</li>
|
||||
<li>24/7-Bereitschaft auf Wunsch</li>
|
||||
</ul>
|
||||
<span class="scroll-hint" aria-hidden="true"><span class="scroll-hint__line"></span>Scrollen</span>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="audience" aria-label="Für wen wir arbeiten">
|
||||
<div class="wrap">
|
||||
<ul role="list">
|
||||
<li data-reveal><b>Privat</b><span>Haus, Garten, Reparaturen</span></li>
|
||||
<li data-reveal><b>Eigentümergemeinschaften</b><span>Wohnanlagen & Hausverwaltungen</span></li>
|
||||
<li data-reveal><b>Gewerbe</b><span>Büro-, Gewerbe- & Tiefgaragen</span></li>
|
||||
<li data-reveal><b>Öffentliche Hand</b><span>Kommunale Objekte</span></li>
|
||||
</ul>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section theme-light" aria-labelledby="about-title">
|
||||
<div class="wrap">
|
||||
<div class="intro-split">
|
||||
<div class="stack">
|
||||
<p class="eyebrow" data-reveal>Über uns</p>
|
||||
<h2 class="display" id="about-title" data-split>Werterhalt, der man ansieht.</h2>
|
||||
</div>
|
||||
<div class="stack">
|
||||
<p class="lead" data-reveal>Seit 2003 kümmern wir uns um Immobilien in Landshut, Ergolding und Umgebung — und werden dabei auch gehobenen Ansprüchen im Premiumbereich gerecht.</p>
|
||||
<p data-reveal class="muted">Sie bekommen feste Ansprechpartner, ein eingespieltes Team und professionelle Arbeit zu einem fairen Preis. Unsere langjährige Erfahrung bringen wir gern zum Werterhalt Ihrer Immobilie ein.</p>
|
||||
<p data-reveal><a class="link-arrow accent" href="unternehmen.html">Unternehmen & Team <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></p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="stats">
|
||||
<div class="stat" data-reveal><span class="stat__num"><span data-count="years">23</span></span><span class="stat__label">Jahre Erfahrung — das Original seit 2003</span></div>
|
||||
<div class="stat" data-reveal><span class="stat__num"><span data-count="7">7</span></span><span class="stat__label">Leistungsbereiche aus einer Hand</span></div>
|
||||
<div class="stat" data-reveal><span class="stat__num">24<sup>/7</sup></span><span class="stat__label">Bereitschaftsdienst auf Wunsch</span></div>
|
||||
<div class="stat" data-reveal><span class="stat__num"><span data-count="4">4</span></span><span class="stat__label">Kundengruppen — von Privat bis Kommune</span></div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section" aria-labelledby="services-title" style="padding-bottom:0">
|
||||
<div class="wrap services-head">
|
||||
<div class="stack">
|
||||
<p class="eyebrow" data-reveal>Leistungen</p>
|
||||
<h2 class="display" id="services-title" data-split>Alles, was Ihr Gebäude braucht.</h2>
|
||||
</div>
|
||||
<p class="lead" data-reveal>Klassische Hausmeisterdienste und spezialisierte Leistungen — koordiniert von einem Team, das Ihr Objekt kennt.</p>
|
||||
</div>
|
||||
</section>
|
||||
<section class="hscroll" aria-label="Leistungsübersicht">
|
||||
<div class="hscroll__track">
|
||||
<article class="panel" data-reveal>
|
||||
<div class="panel__media"><picture><source type="image/avif" srcset="assets/img/reinigung-800.avif 800w, assets/img/reinigung-1600.avif 1600w" sizes="(min-width: 1024px) 38vw, (min-width: 700px) 50vw, 100vw"><source type="image/webp" srcset="assets/img/reinigung-800.webp 800w, assets/img/reinigung-1600.webp 1600w" sizes="(min-width: 1024px) 38vw, (min-width: 700px) 50vw, 100vw"><img src="assets/img/reinigung-1600.webp" width="1600" height="1200" alt="Treppenhaus in einem modernen Wohngebäude" loading="lazy" decoding="async"></picture><span class="panel__num">01</span></div>
|
||||
<div class="panel__body">
|
||||
<h3>Reinigung</h3>
|
||||
<p>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"><li>Treppenhaus</li><li>Innenreinigung</li><li>Außenreinigung</li><li>Tiefgarage</li></ul>
|
||||
</div>
|
||||
</article>
|
||||
<article class="panel" data-reveal>
|
||||
<div class="panel__media"><picture><source type="image/avif" srcset="assets/img/glas-800.avif 800w, assets/img/glas-1600.avif 1600w" sizes="(min-width: 1024px) 38vw, (min-width: 700px) 50vw, 100vw"><source type="image/webp" srcset="assets/img/glas-800.webp 800w, assets/img/glas-1600.webp 1600w" sizes="(min-width: 1024px) 38vw, (min-width: 700px) 50vw, 100vw"><img src="assets/img/glas-1600.webp" width="1600" height="1066" alt="Fensterreinigung mit Teleskopstange an einem Wohnhaus" loading="lazy" decoding="async"></picture><span class="panel__num">02</span></div>
|
||||
<div class="panel__body">
|
||||
<h3>Glas- & PV-Reinigung</h3>
|
||||
<p>Mit eigener Osmoseanlage und reinem Wasser: streifenfreie Fenster und saubere Photovoltaik-Module — meist sogar ohne Hebebühne.</p>
|
||||
<ul class="tags" role="list"><li>Osmoseanlage</li><li>Fenster & Fassadenglas</li><li>Photovoltaik</li><li>meist ohne Hebebühne</li></ul>
|
||||
</div>
|
||||
</article>
|
||||
<article class="panel" data-reveal>
|
||||
<div class="panel__media"><picture><source type="image/avif" srcset="assets/img/garten-800.avif 800w, assets/img/garten-1600.avif 1600w" sizes="(min-width: 1024px) 38vw, (min-width: 700px) 50vw, 100vw"><source type="image/webp" srcset="assets/img/garten-800.webp 800w, assets/img/garten-1600.webp 1600w" sizes="(min-width: 1024px) 38vw, (min-width: 700px) 50vw, 100vw"><img src="assets/img/garten-1600.webp" width="1600" height="1066" alt="Heckenschnitt in einer Gartenanlage" loading="lazy" decoding="async"></picture><span class="panel__num">03</span></div>
|
||||
<div class="panel__body">
|
||||
<h3>Garten- & Grünpflege</h3>
|
||||
<p>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"><li>Rasenpflege</li><li>Heckenschnitt</li><li>Grünanlagen</li><li>Gartenarbeiten</li></ul>
|
||||
</div>
|
||||
</article>
|
||||
<article class="panel" data-reveal>
|
||||
<div class="panel__media"><picture><source type="image/avif" srcset="assets/img/technik-800.avif 800w, assets/img/technik-1600.avif 1600w" sizes="(min-width: 1024px) 38vw, (min-width: 700px) 50vw, 100vw"><source type="image/webp" srcset="assets/img/technik-800.webp 800w, assets/img/technik-1600.webp 1600w" sizes="(min-width: 1024px) 38vw, (min-width: 700px) 50vw, 100vw"><img src="assets/img/technik-1600.webp" width="1600" height="1065" alt="Rohrleitungen einer Haustechnikanlage" loading="lazy" decoding="async"></picture><span class="panel__num">04</span></div>
|
||||
<div class="panel__body">
|
||||
<h3>Technische Hausbetreuung</h3>
|
||||
<p>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"><li>Anlagenkontrolle</li><li>Wartung</li><li>Objektrundgänge</li></ul>
|
||||
</div>
|
||||
</article>
|
||||
<article class="panel" data-reveal>
|
||||
<div class="panel__media"><picture><source type="image/avif" srcset="assets/img/reparatur-800.avif 800w, assets/img/reparatur-1600.avif 1600w" sizes="(min-width: 1024px) 38vw, (min-width: 700px) 50vw, 100vw"><source type="image/webp" srcset="assets/img/reparatur-800.webp 800w, assets/img/reparatur-1600.webp 1600w" sizes="(min-width: 1024px) 38vw, (min-width: 700px) 50vw, 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><span class="panel__num">05</span></div>
|
||||
<div class="panel__body">
|
||||
<h3>Reparaturen & Renovierungen</h3>
|
||||
<p>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"><li>Reparaturen</li><li>Renovierungen</li><li>Schreinerarbeiten</li></ul>
|
||||
</div>
|
||||
</article>
|
||||
<article class="panel" data-reveal>
|
||||
<div class="panel__media"><picture><source type="image/avif" srcset="assets/img/winter-800.avif 800w, assets/img/winter-1600.avif 1600w" sizes="(min-width: 1024px) 38vw, (min-width: 700px) 50vw, 100vw"><source type="image/webp" srcset="assets/img/winter-800.webp 800w, assets/img/winter-1600.webp 1600w" sizes="(min-width: 1024px) 38vw, (min-width: 700px) 50vw, 100vw"><img src="assets/img/winter-1600.webp" width="1600" height="1061" alt="Schneeräumung vor einem Gebäude" loading="lazy" decoding="async"></picture><span class="panel__num">06</span></div>
|
||||
<div class="panel__body">
|
||||
<h3>Winterdienst</h3>
|
||||
<p>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"><li>Räumdienst</li><li>Streudienst</li><li>eigene Fahrzeuge</li></ul>
|
||||
</div>
|
||||
</article>
|
||||
<article class="panel" data-reveal>
|
||||
<div class="panel__media"><picture><source type="image/avif" srcset="assets/img/bereitschaft-800.avif 800w, assets/img/bereitschaft-1600.avif 1600w" sizes="(min-width: 1024px) 38vw, (min-width: 700px) 50vw, 100vw"><source type="image/webp" srcset="assets/img/bereitschaft-800.webp 800w, assets/img/bereitschaft-1600.webp 1600w" sizes="(min-width: 1024px) 38vw, (min-width: 700px) 50vw, 100vw"><img src="assets/img/bereitschaft-1600.webp" width="1600" height="1066" alt="Reinigung einer Glasfassade am Abend" loading="lazy" decoding="async"></picture><span class="panel__num">07</span></div>
|
||||
<div class="panel__body">
|
||||
<h3>24/7-Bereitschaft</h3>
|
||||
<p>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"><li>rund um die Uhr</li><li>Notruf</li><li>auf Wunsch</li></ul>
|
||||
</div>
|
||||
</article>
|
||||
</div>
|
||||
<div class="hscroll__progress" aria-hidden="true"><span data-hs-count>01</span><span class="hscroll__bar"><i></i></span><span>07</span></div>
|
||||
</section>
|
||||
<div class="wrap" style="padding-block: var(--s6) var(--section)"><a class="btn btn--ghost" href="leistungen.html">Alle Leistungen im Detail <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>
|
||||
|
||||
<section class="section theme-white" aria-labelledby="osmose-title">
|
||||
<div class="wrap feature">
|
||||
<div class="feature__copy">
|
||||
<p class="eyebrow" data-reveal>Glas- & PV-Reinigung</p>
|
||||
<h2 class="display" id="osmose-title" data-split>Reines Wasser. Klare Sicht.</h2>
|
||||
<p class="lead" data-reveal>Mit unserer eigenen Osmoseanlage reinigen wir Glasflächen und Photovoltaik-Module mit entmineralisiertem Wasser — ohne Rückstände.</p>
|
||||
<ul class="checklist" role="list">
|
||||
<li data-reveal>Streifenfrei trocknend, ohne Reinigungsmittel</li>
|
||||
<li data-reveal>Teleskoptechnik — meist sogar ohne Hebebühne</li>
|
||||
<li data-reveal>Für Fenster, Glasfassaden und PV-Anlagen</li>
|
||||
</ul>
|
||||
<p data-reveal class="mt-2"><a class="btn" href="mailto:info@kirschner-service.de?subject=Anfrage%20Glas-%20/%20PV-Reinigung">Reinigung 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></p>
|
||||
</div>
|
||||
<figure data-reveal>
|
||||
<div class="compare" tabindex="0" role="slider" aria-label="Vorher-Nachher-Vergleich PV-Reinigung" aria-valuemin="0" aria-valuemax="100" aria-valuenow="50">
|
||||
<picture><source type="image/avif" srcset="assets/img/pv-nachher-800.avif 800w, assets/img/pv-nachher-1400.avif 1400w" sizes="(min-width: 960px) 55vw, 100vw"><source type="image/webp" srcset="assets/img/pv-nachher-800.webp 800w, assets/img/pv-nachher-1400.webp 1400w" sizes="(min-width: 960px) 55vw, 100vw"><img src="assets/img/pv-nachher-1400.webp" width="1400" height="1050" alt="Photovoltaik-Modul nach der Reinigung, klar und glänzend" loading="lazy" decoding="async"></picture>
|
||||
<div class="compare__before"><picture><source type="image/avif" srcset="assets/img/pv-vorher-800.avif 800w, assets/img/pv-vorher-1400.avif 1400w" sizes="(min-width: 960px) 55vw, 100vw"><source type="image/webp" srcset="assets/img/pv-vorher-800.webp 800w, assets/img/pv-vorher-1400.webp 1400w" sizes="(min-width: 960px) 55vw, 100vw"><img src="assets/img/pv-vorher-1400.webp" width="1400" height="1050" alt="Photovoltaik-Modul vor der Reinigung, mit Staub und Kalkflecken" loading="lazy" decoding="async"></picture></div>
|
||||
<div class="compare__handle" aria-hidden="true"><span class="compare__knob"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="square" aria-hidden="true"><path d="M9 6l-6 6 6 6M15 6l6 6-6 6"/></svg></span></div>
|
||||
<span class="compare__tag compare__tag--before" aria-hidden="true">Vorher</span>
|
||||
<span class="compare__tag compare__tag--after" aria-hidden="true">Nachher</span>
|
||||
</div>
|
||||
<figcaption class="figure-note">Symbolbild — ziehen oder mit den Pfeiltasten vergleichen.</figcaption>
|
||||
</figure>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section theme-deep philosophy" aria-labelledby="philo-title">
|
||||
<div class="wrap">
|
||||
<p class="eyebrow" data-reveal id="philo-title">Unsere Philosophie</p>
|
||||
<p class="philosophy__words mt-4" data-scrub-words>Persönlich<span class="dot">.</span> Zuverlässig<span class="dot">.</span> Erstklassig<span class="dot">.</span></p>
|
||||
<div class="philosophy__sub">
|
||||
<div data-reveal><b>Persönlich</b><p>Feste Ansprechpartner und Mitarbeiter, die „ihre" Objekte kennen — keine wechselnden Springer.</p></div>
|
||||
<div data-reveal><b>Zuverlässig</b><p>Klare Abläufe, strukturiert über unsere eigene App, und auf Wunsch Bereitschaft rund um die Uhr.</p></div>
|
||||
<div data-reveal><b>Erstklassig</b><p>Moderne Maschinen, eigene Osmoseanlage, handwerkliche Ausbildung im Team — für Ansprüche bis in den Premiumbereich.</p></div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="band" aria-labelledby="jobs-title">
|
||||
<svg class="band__chev" viewBox="0 0 600 400" aria-hidden="true"><path d="M260 0h120L180 200l200 200H260L60 200z"/><path d="M460 0h120L380 200l200 200H460L260 200z"/></svg>
|
||||
<div class="wrap band__inner">
|
||||
<div class="stack">
|
||||
<p class="eyebrow" data-reveal>Wir stellen ein</p>
|
||||
<h2 class="display" id="jobs-title" data-split>Bock auf einen vielseitigen Job?</h2>
|
||||
<p data-reveal>Hausmeister, Ga-La-Bauer, Glas- und Solarreiniger, Reinigungskräfte: übertarifliche Bezahlung, starkes Team, viel frische Luft — und freitagnachmittags frei.</p>
|
||||
</div>
|
||||
<div data-reveal><a class="btn" href="karriere.html">Offene Stellen <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>
|
||||
</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>Sprechen wir über Ihr Objekt.</h2>
|
||||
<p class="lead" data-reveal>Rufen Sie uns an oder schreiben Sie uns — wir melden uns schnell und unterbreiten Ihnen gern ein Angebot.</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>
|
||||
</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>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
<footer class="site-footer">
|
||||
<div class="wrap">
|
||||
<div class="footer-grid">
|
||||
<div>
|
||||
<a class="brand" href="index.html" aria-label="Kirschner Gebäudeservice — Startseite"><svg class="chev-mark" viewBox="0 0 44 32" aria-hidden="true"><polygon class="chev" opacity=".55" points="14,0 24,0 10,16 24,32 14,32 0,16"/><polygon class="chev" points="32,0 42,0 28,16 42,32 32,32 18,16"/></svg><span class="brand__name"><b>KIRSCHNER</b><span>Gebäudeservice</span></span></a>
|
||||
<p class="footer-motto">Das Original seit 2003. Persönlich, zuverlässig, erstklassig — in Landshut, Ergolding und Umgebung.</p>
|
||||
</div>
|
||||
<div>
|
||||
<h2>Seiten</h2>
|
||||
<ul role="list"><li><a href="index.html">Start</a></li><li><a href="leistungen.html">Leistungen</a></li><li><a href="unternehmen.html">Unternehmen</a></li><li><a href="karriere.html">Karriere</a></li><li><a href="kontakt.html">Kontakt</a></li></ul>
|
||||
</div>
|
||||
<div>
|
||||
<h2>Kontakt</h2>
|
||||
<ul role="list">
|
||||
<li><a href="tel:+4987114269101">0871 / 14 26 91 01</a></li>
|
||||
<li><a href="tel:+491608365753">Notruf 0160 / 836 57 53</a></li>
|
||||
<li><a href="mailto:info@kirschner-service.de">info@kirschner-service.de</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div>
|
||||
<h2>Adresse</h2>
|
||||
<address style="font-style:normal">Etzstraße 45<br>84030 Ergolding<br><a href="https://www.google.com/maps/search/?api=1&query=Etzstra%C3%9Fe+45%2C+84030+Ergolding" rel="noopener" target="_blank">Route planen</a></address>
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer-word" aria-hidden="true">KIRSCHNER</div>
|
||||
<div class="footer-bottom">
|
||||
<span>© <span data-year>2026</span> Kirschner Gebäudeservice · Thomas Kirschner</span>
|
||||
<nav aria-label="Rechtliches"><a href="impressum.html">Impressum</a><a href="datenschutz.html">Datenschutz</a></nav>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
<a class="sos" href="tel:+491608365753" aria-label="24/7 Notruf anrufen: 0160 / 836 57 53">
|
||||
<span class="sos__dot" aria-hidden="true"></span>
|
||||
<span><small>Notruf 24/7</small><b>0160 / 836 57 53</b></span>
|
||||
</a>
|
||||
</body>
|
||||
</html>
|
||||
+180
@@ -0,0 +1,180 @@
|
||||
<!doctype html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>Karriere — Hausmeister, Handwerker & Reinigungskräfte gesucht | Kirschner Gebäudeservice</title>
|
||||
<meta name="description" content="Wir stellen ein: Hausmeister, Handwerker, Ga-La-Bauer, Glas- & Solarreiniger und Reinigungskräfte in Landshut und Ergolding. Übertarifliche Bezahlung, starkes Team.">
|
||||
<link rel="canonical" href="https://www.kirschner-service.de/karriere.html">
|
||||
<meta name="theme-color" content="#0A1424">
|
||||
<meta property="og:type" content="website">
|
||||
<meta property="og:locale" content="de_DE">
|
||||
<meta property="og:site_name" content="Kirschner Gebäudeservice">
|
||||
<meta property="og:title" content="Karriere — Hausmeister, Handwerker & Reinigungskräfte gesucht | Kirschner Gebäudeservice">
|
||||
<meta property="og:description" content="Wir stellen ein: Hausmeister, Handwerker, Ga-La-Bauer, Glas- & Solarreiniger und Reinigungskräfte in Landshut und Ergolding. Übertarifliche Bezahlung, starkes Team.">
|
||||
<meta property="og:url" content="https://www.kirschner-service.de/karriere.html">
|
||||
<meta property="og:image" content="https://www.kirschner-service.de/assets/img/og.jpg">
|
||||
<link rel="icon" href="assets/favicon.svg" type="image/svg+xml">
|
||||
<link rel="apple-touch-icon" href="assets/apple-touch-icon.png">
|
||||
<link rel="preload" href="assets/fonts/archivo-latin-wdth-normal.woff2" as="font" type="font/woff2" crossorigin>
|
||||
<link rel="stylesheet" href="assets/site.css">
|
||||
<script>(function(r){r.classList.add('js');try{if(r.hasAttribute('data-intro')&&!sessionStorage.getItem('kk-intro')&&matchMedia('(prefers-reduced-motion: no-preference)').matches)r.classList.add('has-intro')}catch(e){}setTimeout(function(){if(!r.classList.contains('motion-ready'))r.classList.remove('js','has-intro')},3000)})(document.documentElement)</script>
|
||||
<script src="assets/vendor/gsap.min.js" defer></script>
|
||||
<script src="assets/vendor/ScrollTrigger.min.js" defer></script>
|
||||
<script src="assets/vendor/SplitText.min.js" defer></script>
|
||||
<script src="assets/vendor/lenis.min.js" defer></script>
|
||||
<script src="assets/motion.js" defer></script>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<a class="skip-link" href="#inhalt">Zum Inhalt springen</a>
|
||||
<header class="site-header">
|
||||
<div class="wrap site-header__inner">
|
||||
<a class="brand" href="index.html" aria-label="Kirschner Gebäudeservice — Startseite">
|
||||
<svg class="chev-mark" viewBox="0 0 44 32" aria-hidden="true"><polygon class="chev" opacity=".55" points="14,0 24,0 10,16 24,32 14,32 0,16"/><polygon class="chev" points="32,0 42,0 28,16 42,32 32,32 18,16"/></svg>
|
||||
<span class="brand__name"><b>KIRSCHNER</b><span>Gebäudeservice</span></span>
|
||||
</a>
|
||||
<nav class="nav" aria-label="Hauptnavigation"><a class="nav__link" href="leistungen.html">Leistungen</a><a class="nav__link" href="unternehmen.html">Unternehmen</a><a class="nav__link" href="karriere.html" aria-current="page">Karriere</a><a class="nav__link" href="kontakt.html">Kontakt</a></nav>
|
||||
<div class="header-cta">
|
||||
<a class="header-phone" href="tel:+4987114269101"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linejoin="round" aria-hidden="true"><path d="M5 4h4l2 5-2.5 1.5a11 11 0 0 0 5 5L15 13l5 2v4a2 2 0 0 1-2 2A16 16 0 0 1 3 6a2 2 0 0 1 2-2"/></svg><span>0871 / 14 26 91 01</span></a>
|
||||
<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>
|
||||
<button class="menu-toggle" type="button" aria-expanded="false" aria-controls="mobile-nav" aria-label="Menü öffnen"><span class="menu-toggle__bars"></span></button>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
<div class="mobile-nav" id="mobile-nav">
|
||||
<nav aria-label="Mobile Navigation"><ul role="list"><li><a class="mobile-nav__link" href="index.html">Start</a></li><li><a class="mobile-nav__link" href="leistungen.html">Leistungen</a></li><li><a class="mobile-nav__link" href="unternehmen.html">Unternehmen</a></li><li><a class="mobile-nav__link" href="karriere.html" aria-current="page">Karriere</a></li><li><a class="mobile-nav__link" href="kontakt.html">Kontakt</a></li></ul></nav>
|
||||
<div class="mobile-nav__meta">
|
||||
<a href="tel:+4987114269101">Büro 0871 / 14 26 91 01</a>
|
||||
<a href="tel:+491608365753">Notruf 24/7 0160 / 836 57 53</a>
|
||||
<a href="mailto:info@kirschner-service.de">info@kirschner-service.de</a>
|
||||
</div>
|
||||
</div>
|
||||
<main id="inhalt">
|
||||
|
||||
<section class="page-hero">
|
||||
<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">
|
||||
<div class="stack">
|
||||
<p class="eyebrow" data-hero>Karriere</p>
|
||||
<h1 class="display" data-split>Bock auf einen vielseitigen Job?</h1>
|
||||
</div>
|
||||
<div class="stack">
|
||||
<p class="lead" data-hero>Viel Zeit an der frischen Luft statt in der Industriehalle, überaus faire Bezahlung und ein Team, das zusammenhält. Bewirb Dich — wir freuen uns auf ein Gespräch bei einem Espresso.</p>
|
||||
<div class="btn-row" data-hero><a class="btn" href="#stellen">Offene Stellen <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" aria-labelledby="why-title">
|
||||
<div class="wrap">
|
||||
<div class="section-head">
|
||||
<p class="eyebrow" data-reveal>Was uns ausmacht</p>
|
||||
<h2 class="display" id="why-title" data-split>Arbeit, die man gern macht.</h2>
|
||||
</div>
|
||||
<ul class="benefits" role="list"><li data-reveal><b>Übertarifliche Bezahlung</b><span>Dein Einsatz wird fair belohnt — mit klaren Aufstiegsplänen.</span></li><li data-reveal><b>Keine Freitagnachmittage</b><span>Keine permanenten Überstunden, kein Samstag — Zeit für Familie und Freunde.</span></li><li data-reveal><b>Feste Objekte</b><span>Du betreust Deine eigenen Objekte, statt ständig einzuspringen.</span></li><li data-reveal><b>Boni & Gutscheine</b><span>Spritgeld, Urlaubs- und Weihnachtsgeld, Erfolgsbonus.</span></li><li data-reveal><b>Moderne Ausstattung</b><span>Hochwertige Arbeitskleidung, moderne Maschinen, eigener Fuhrpark.</span></li><li data-reveal><b>Alles per App</b><span>Gut strukturierte Arbeit und Zeiterfassung einfach am Handy.</span></li></ul>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section theme-light" aria-labelledby="stellen-title" id="stellen">
|
||||
<div class="wrap">
|
||||
<div class="section-head">
|
||||
<p class="eyebrow" data-reveal>Offene Stellen</p>
|
||||
<h2 class="display" id="stellen-title" data-split>Wir stellen ein.</h2>
|
||||
<p class="lead" data-reveal>Bewirb Dich ganz einfach per E-Mail oder Telefon — ein Lebenslauf ist schön, aber kein Muss.</p>
|
||||
</div>
|
||||
<div class="jobs">
|
||||
<details class="job" data-reveal open>
|
||||
<summary>
|
||||
<div><h3>Handwerker / Hausmeister</h3><div class="job__meta"><span>Teilzeit</span><span>Vollzeit</span><span>auch Ga-La-Bauer, Glas- & Solarreiniger</span></div></div>
|
||||
<span class="job__toggle" aria-hidden="true"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="square" aria-hidden="true"><path d="M12 4v16M4 12h16"/></svg></span>
|
||||
</summary>
|
||||
<div class="job__body">
|
||||
<div class="job__text"><p>Du sorgst dafür, dass sich unsere Kunden zuhause wohlfühlen — Sauberkeit in Deinen festen Objekten hat für Dich Priorität. Gemeinsam mit Kollegen pflegst Du Gärten und Grünflächen, reinigst Tiefgaragen mit modernen Maschinen und erlebst den Vorher-Nachher-Effekt.</p><p>Im Winter sorgst Du mit unseren Fahrzeugen bei Schnee und Eis für Sicherheit. Mit handwerklichem Geschick zeigen wir Dir, wie Du mit Reparaturen unsere Kunden begeisterst. Viel Zeit an der frischen Luft, gut strukturierte Arbeit mit unserer eigenen App — und keine permanenten Überstunden, keine Arbeit am Freitagnachmittag oder Samstag.</p></div>
|
||||
<div><h4>Das bringst Du mit</h4><ul role="list"><li>Erfahrung im jeweiligen Bereich</li><li>Blick für Sauberkeit und Qualität</li><li>Freundlichkeit, Teamfähigkeit & Motivation</li><li>Ambition, Verantwortung zu übernehmen</li></ul></div>
|
||||
<div><h4>Das bekommst Du</h4><ul role="list"><li>Sicherer Arbeitsplatz — krisenfest und zukunftssicher</li><li>Weit übertarifliche Bezahlung und klare Aufstiegspläne</li><li>Hochwertige Arbeitskleidung</li><li>Boni: Spritgeld, Urlaubs- & Weihnachtsgeld, Erfolgsbonus</li><li>Starkes Team, das sich gegenseitig unterstützt</li></ul></div>
|
||||
<div class="job__apply btn-row"><a class="btn" href="mailto:info@kirschner-service.de?subject=Bewerbung%3A%20Handwerker%20/%20Hausmeister%20%28TZ/VZ%29&body=Hallo%20Herr%20Kirschner%2C%0A%0Aich%20interessiere%20mich%20f%C3%BCr%20die%20Stelle%20und%20m%C3%B6chte%20mich%20kurz%20vorstellen%3A%0A%0AName%3A%0ATelefon%3A%0AErfahrung%3A%0AFr%C3%BChester%20Start%3A%0A%0AViele%20Gr%C3%BC%C3%9Fe%0A">Jetzt bewerben <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><a class="btn btn--ghost" href="tel:+4987114269101">Lieber anrufen</a></div>
|
||||
</div>
|
||||
</details>
|
||||
<details class="job" data-reveal>
|
||||
<summary>
|
||||
<div><h3>Reinigungskraft</h3><div class="job__meta"><span>Minijob</span><span>m/w/d</span></div></div>
|
||||
<span class="job__toggle" aria-hidden="true"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="square" aria-hidden="true"><path d="M12 4v16M4 12h16"/></svg></span>
|
||||
</summary>
|
||||
<div class="job__body">
|
||||
<div class="job__text"><p>Wir sind ein familiäres und jung gebliebenes Unternehmen und suchen Dich, wenn Du Dich in diesen Punkten wiederfindest.</p></div>
|
||||
<div><h4>Das bringst Du mit</h4><ul role="list"><li>Pünktlichkeit, Ehrlichkeit, Fleiß und Zuverlässigkeit</li><li>Sauberes, gepflegtes Erscheinungsbild und gute Umgangsformen</li><li>Blick für Sauberkeit</li><li>Gutes Deutsch</li><li>Du lebst den Teamgedanken</li><li>Idealerweise Erfahrung im Reinigungsbereich</li></ul></div>
|
||||
<div><h4>Das bekommst Du</h4><ul role="list"><li>Tarifliche Vergütung sowie Gutscheine (z. B. Tanken)</li><li>Flexible Zeiteinteilung, die zu Deinem Leben passt</li><li>30 Arbeitstage bezahlter Urlaub</li><li>Lohnfortzahlung im Krankheitsfall</li><li>Deine „eigenen“ festen Objekte — kein Springer</li><li>Sehr kollegiales Betriebsklima</li><li>Arbeitszeit einfach per App am Handy erfassen</li></ul></div>
|
||||
<div class="job__apply btn-row"><a class="btn" href="mailto:info@kirschner-service.de?subject=Bewerbung%3A%20Reinigungskraft%20%28Minijob%29&body=Hallo%20Herr%20Kirschner%2C%0A%0Aich%20interessiere%20mich%20f%C3%BCr%20die%20Stelle%20und%20m%C3%B6chte%20mich%20kurz%20vorstellen%3A%0A%0AName%3A%0ATelefon%3A%0AErfahrung%3A%0AFr%C3%BChester%20Start%3A%0A%0AViele%20Gr%C3%BC%C3%9Fe%0A">Jetzt bewerben <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><a class="btn btn--ghost" href="tel:+4987114269101">Lieber anrufen</a></div>
|
||||
</div>
|
||||
</details>
|
||||
<details class="job" data-reveal>
|
||||
<summary>
|
||||
<div><h3>Hausmeister</h3><div class="job__meta"><span>Minijob</span><span>m/w/d</span></div></div>
|
||||
<span class="job__toggle" aria-hidden="true"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="square" aria-hidden="true"><path d="M12 4v16M4 12h16"/></svg></span>
|
||||
</summary>
|
||||
<div class="job__body">
|
||||
<div class="job__text"><p>Wir sind ein familiäres und jung gebliebenes Unternehmen und suchen Dich, wenn Du Dich in diesen Punkten wiederfindest.</p></div>
|
||||
<div><h4>Das bringst Du mit</h4><ul role="list"><li>Pünktlichkeit, Ehrlichkeit, Fleiß und Zuverlässigkeit</li><li>Sauberes, gepflegtes Erscheinungsbild und gute Umgangsformen</li><li>Blick für Sauberkeit</li><li>Gutes Deutsch</li><li>Du arbeitest gern im Team</li><li>Idealerweise Erfahrung im Garten oder handwerklich</li></ul></div>
|
||||
<div><h4>Das bekommst Du</h4><ul role="list"><li>Übertarifliche Vergütung</li><li>Prämien wie Gutscheine (z. B. Tanken)</li><li>Flexible Zeiteinteilung</li><li>30 Arbeitstage bezahlter Urlaub</li><li>Lohnfortzahlung im Krankheitsfall</li><li>Abwechslungsreich — indoor und outdoor</li><li>Moderne Maschinen und Fuhrpark</li><li>Arbeitszeit einfach per App erfassen</li></ul></div>
|
||||
<div class="job__apply btn-row"><a class="btn" href="mailto:info@kirschner-service.de?subject=Bewerbung%3A%20Hausmeister%20%28Minijob%29&body=Hallo%20Herr%20Kirschner%2C%0A%0Aich%20interessiere%20mich%20f%C3%BCr%20die%20Stelle%20und%20m%C3%B6chte%20mich%20kurz%20vorstellen%3A%0A%0AName%3A%0ATelefon%3A%0AErfahrung%3A%0AFr%C3%BChester%20Start%3A%0A%0AViele%20Gr%C3%BC%C3%9Fe%0A">Jetzt bewerben <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><a class="btn btn--ghost" href="tel:+4987114269101">Lieber anrufen</a></div>
|
||||
</div>
|
||||
</details>
|
||||
</div>
|
||||
</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>Interesse? Melde Dich!</h2>
|
||||
<p class="lead" data-reveal>Ruf uns an oder schreib uns eine kurze E-Mail. Wir melden uns schnell bei Dir.</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>
|
||||
</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>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
<footer class="site-footer">
|
||||
<div class="wrap">
|
||||
<div class="footer-grid">
|
||||
<div>
|
||||
<a class="brand" href="index.html" aria-label="Kirschner Gebäudeservice — Startseite"><svg class="chev-mark" viewBox="0 0 44 32" aria-hidden="true"><polygon class="chev" opacity=".55" points="14,0 24,0 10,16 24,32 14,32 0,16"/><polygon class="chev" points="32,0 42,0 28,16 42,32 32,32 18,16"/></svg><span class="brand__name"><b>KIRSCHNER</b><span>Gebäudeservice</span></span></a>
|
||||
<p class="footer-motto">Das Original seit 2003. Persönlich, zuverlässig, erstklassig — in Landshut, Ergolding und Umgebung.</p>
|
||||
</div>
|
||||
<div>
|
||||
<h2>Seiten</h2>
|
||||
<ul role="list"><li><a href="index.html">Start</a></li><li><a href="leistungen.html">Leistungen</a></li><li><a href="unternehmen.html">Unternehmen</a></li><li><a href="karriere.html">Karriere</a></li><li><a href="kontakt.html">Kontakt</a></li></ul>
|
||||
</div>
|
||||
<div>
|
||||
<h2>Kontakt</h2>
|
||||
<ul role="list">
|
||||
<li><a href="tel:+4987114269101">0871 / 14 26 91 01</a></li>
|
||||
<li><a href="tel:+491608365753">Notruf 0160 / 836 57 53</a></li>
|
||||
<li><a href="mailto:info@kirschner-service.de">info@kirschner-service.de</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div>
|
||||
<h2>Adresse</h2>
|
||||
<address style="font-style:normal">Etzstraße 45<br>84030 Ergolding<br><a href="https://www.google.com/maps/search/?api=1&query=Etzstra%C3%9Fe+45%2C+84030+Ergolding" rel="noopener" target="_blank">Route planen</a></address>
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer-word" aria-hidden="true">KIRSCHNER</div>
|
||||
<div class="footer-bottom">
|
||||
<span>© <span data-year>2026</span> Kirschner Gebäudeservice · Thomas Kirschner</span>
|
||||
<nav aria-label="Rechtliches"><a href="impressum.html">Impressum</a><a href="datenschutz.html">Datenschutz</a></nav>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
<a class="sos" href="tel:+491608365753" aria-label="24/7 Notruf anrufen: 0160 / 836 57 53">
|
||||
<span class="sos__dot" aria-hidden="true"></span>
|
||||
<span><small>Notruf 24/7</small><b>0160 / 836 57 53</b></span>
|
||||
</a>
|
||||
</body>
|
||||
</html>
|
||||
+138
@@ -0,0 +1,138 @@
|
||||
<!doctype html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>Kontakt — Kirschner Gebäudeservice Ergolding</title>
|
||||
<meta name="description" content="Kirschner Gebäudeservice, Etzstraße 45, 84030 Ergolding. Telefon 0871 / 14 26 91 01, Notruf 0160 / 836 57 53, info@kirschner-service.de.">
|
||||
<link rel="canonical" href="https://www.kirschner-service.de/kontakt.html">
|
||||
<meta name="theme-color" content="#0A1424">
|
||||
<meta property="og:type" content="website">
|
||||
<meta property="og:locale" content="de_DE">
|
||||
<meta property="og:site_name" content="Kirschner Gebäudeservice">
|
||||
<meta property="og:title" content="Kontakt — Kirschner Gebäudeservice Ergolding">
|
||||
<meta property="og:description" content="Kirschner Gebäudeservice, Etzstraße 45, 84030 Ergolding. Telefon 0871 / 14 26 91 01, Notruf 0160 / 836 57 53, info@kirschner-service.de.">
|
||||
<meta property="og:url" content="https://www.kirschner-service.de/kontakt.html">
|
||||
<meta property="og:image" content="https://www.kirschner-service.de/assets/img/og.jpg">
|
||||
<link rel="icon" href="assets/favicon.svg" type="image/svg+xml">
|
||||
<link rel="apple-touch-icon" href="assets/apple-touch-icon.png">
|
||||
<link rel="preload" href="assets/fonts/archivo-latin-wdth-normal.woff2" as="font" type="font/woff2" crossorigin>
|
||||
<link rel="stylesheet" href="assets/site.css">
|
||||
<script>(function(r){r.classList.add('js');try{if(r.hasAttribute('data-intro')&&!sessionStorage.getItem('kk-intro')&&matchMedia('(prefers-reduced-motion: no-preference)').matches)r.classList.add('has-intro')}catch(e){}setTimeout(function(){if(!r.classList.contains('motion-ready'))r.classList.remove('js','has-intro')},3000)})(document.documentElement)</script>
|
||||
<script src="assets/vendor/gsap.min.js" defer></script>
|
||||
<script src="assets/vendor/ScrollTrigger.min.js" defer></script>
|
||||
<script src="assets/vendor/SplitText.min.js" defer></script>
|
||||
<script src="assets/vendor/lenis.min.js" defer></script>
|
||||
<script src="assets/motion.js" defer></script>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<a class="skip-link" href="#inhalt">Zum Inhalt springen</a>
|
||||
<header class="site-header">
|
||||
<div class="wrap site-header__inner">
|
||||
<a class="brand" href="index.html" aria-label="Kirschner Gebäudeservice — Startseite">
|
||||
<svg class="chev-mark" viewBox="0 0 44 32" aria-hidden="true"><polygon class="chev" opacity=".55" points="14,0 24,0 10,16 24,32 14,32 0,16"/><polygon class="chev" points="32,0 42,0 28,16 42,32 32,32 18,16"/></svg>
|
||||
<span class="brand__name"><b>KIRSCHNER</b><span>Gebäudeservice</span></span>
|
||||
</a>
|
||||
<nav class="nav" aria-label="Hauptnavigation"><a class="nav__link" href="leistungen.html">Leistungen</a><a class="nav__link" href="unternehmen.html">Unternehmen</a><a class="nav__link" href="karriere.html">Karriere</a><a class="nav__link" href="kontakt.html" aria-current="page">Kontakt</a></nav>
|
||||
<div class="header-cta">
|
||||
<a class="header-phone" href="tel:+4987114269101"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linejoin="round" aria-hidden="true"><path d="M5 4h4l2 5-2.5 1.5a11 11 0 0 0 5 5L15 13l5 2v4a2 2 0 0 1-2 2A16 16 0 0 1 3 6a2 2 0 0 1 2-2"/></svg><span>0871 / 14 26 91 01</span></a>
|
||||
<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>
|
||||
<button class="menu-toggle" type="button" aria-expanded="false" aria-controls="mobile-nav" aria-label="Menü öffnen"><span class="menu-toggle__bars"></span></button>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
<div class="mobile-nav" id="mobile-nav">
|
||||
<nav aria-label="Mobile Navigation"><ul role="list"><li><a class="mobile-nav__link" href="index.html">Start</a></li><li><a class="mobile-nav__link" href="leistungen.html">Leistungen</a></li><li><a class="mobile-nav__link" href="unternehmen.html">Unternehmen</a></li><li><a class="mobile-nav__link" href="karriere.html">Karriere</a></li><li><a class="mobile-nav__link" href="kontakt.html" aria-current="page">Kontakt</a></li></ul></nav>
|
||||
<div class="mobile-nav__meta">
|
||||
<a href="tel:+4987114269101">Büro 0871 / 14 26 91 01</a>
|
||||
<a href="tel:+491608365753">Notruf 24/7 0160 / 836 57 53</a>
|
||||
<a href="mailto:info@kirschner-service.de">info@kirschner-service.de</a>
|
||||
</div>
|
||||
</div>
|
||||
<main id="inhalt">
|
||||
|
||||
<section class="page-hero">
|
||||
<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">
|
||||
<div class="stack">
|
||||
<p class="eyebrow" data-hero>Kontakt</p>
|
||||
<h1 class="display" data-split>Wir sind für Sie da.</h1>
|
||||
</div>
|
||||
<div class="stack">
|
||||
<p class="lead" data-hero>Schreiben Sie uns oder rufen Sie an — wir freuen uns auf Ihre Anfragen, Aufträge und natürlich über Ihr Feedback.</p>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section class="section" style="padding-top:0" aria-label="Kontaktwege">
|
||||
<div class="wrap">
|
||||
<div class="contact-grid">
|
||||
<a class="contact-card" href="tel:+4987114269101" data-reveal><small>Büro</small><strong>0871 / 14 26 91 01</strong><p>Für Anfragen, Angebote und Rückfragen.</p><span class="contact-card__go">Anrufen <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></span></a>
|
||||
<a class="contact-card contact-card--sos" href="tel:+491608365753" data-reveal><small>Notruf 24/7</small><strong>0160 / 836 57 53</strong><p>Wenn es dringend ist — auch nachts und am Wochenende.</p><span class="contact-card__go">Notruf wählen <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></span></a>
|
||||
<a class="contact-card" 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" data-reveal><small>E-Mail</small><strong>info@kirschner-service.de</strong><p>Wir haben die wichtigsten Angaben schon vorbereitet — einfach ausfüllen und absenden.</p><span class="contact-card__go">E-Mail schreiben <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></span></a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section theme-deep" aria-labelledby="map-title">
|
||||
<div class="wrap map-card">
|
||||
<div class="stack">
|
||||
<p class="eyebrow" data-reveal>Adresse</p>
|
||||
<h2 class="display" id="map-title" data-split>Mitten in Ergolding.</h2>
|
||||
<p class="lead" data-reveal>Kirschner Gebäudeservice<br>Etzstraße 45 · 84030 Ergolding<br>Landshut-Ergolding</p>
|
||||
<div class="btn-row" data-reveal><a class="btn" href="https://www.google.com/maps/search/?api=1&query=Etzstra%C3%9Fe+45%2C+84030+Ergolding" target="_blank" rel="noopener">Route planen <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>
|
||||
<a class="map reveal-img" href="https://www.google.com/maps/search/?api=1&query=Etzstra%C3%9Fe+45%2C+84030+Ergolding" target="_blank" rel="noopener" aria-label="Standort in Google Maps öffnen (externe Seite)">
|
||||
<svg viewBox="0 0 800 480" preserveAspectRatio="xMidYMid slice" aria-hidden="true">
|
||||
<defs><pattern id="g" width="40" height="40" patternUnits="userSpaceOnUse"><path d="M40 0H0v40" fill="none" stroke="rgba(169,183,204,.07)"/></pattern></defs>
|
||||
<rect width="800" height="480" fill="url(#g)"/>
|
||||
<path d="M-20 360 C 140 330, 240 400, 380 370 S 640 300, 820 330" fill="none" stroke="rgba(91,138,214,.35)" stroke-width="18" stroke-linecap="round"/>
|
||||
<g fill="none" stroke="rgba(169,183,204,.28)" stroke-width="3" stroke-linecap="round">
|
||||
<path d="M0 120 L800 170"/><path d="M120 0 L260 480"/><path d="M430 0 C 440 160, 470 260, 520 480"/><path d="M0 250 C 200 230, 520 250, 800 210"/><path d="M620 0 L700 480"/>
|
||||
</g>
|
||||
<g fill="none" stroke="rgba(169,183,204,.14)" stroke-width="1.5"><path d="M0 60 L800 90"/><path d="M300 0 L340 480"/><path d="M0 420 L800 440"/><path d="M540 0 L580 480"/></g>
|
||||
</svg>
|
||||
<span class="map__pin"><span>Kirschner Gebäudeservice</span><i></i></span>
|
||||
</a>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
</main>
|
||||
<footer class="site-footer">
|
||||
<div class="wrap">
|
||||
<div class="footer-grid">
|
||||
<div>
|
||||
<a class="brand" href="index.html" aria-label="Kirschner Gebäudeservice — Startseite"><svg class="chev-mark" viewBox="0 0 44 32" aria-hidden="true"><polygon class="chev" opacity=".55" points="14,0 24,0 10,16 24,32 14,32 0,16"/><polygon class="chev" points="32,0 42,0 28,16 42,32 32,32 18,16"/></svg><span class="brand__name"><b>KIRSCHNER</b><span>Gebäudeservice</span></span></a>
|
||||
<p class="footer-motto">Das Original seit 2003. Persönlich, zuverlässig, erstklassig — in Landshut, Ergolding und Umgebung.</p>
|
||||
</div>
|
||||
<div>
|
||||
<h2>Seiten</h2>
|
||||
<ul role="list"><li><a href="index.html">Start</a></li><li><a href="leistungen.html">Leistungen</a></li><li><a href="unternehmen.html">Unternehmen</a></li><li><a href="karriere.html">Karriere</a></li><li><a href="kontakt.html">Kontakt</a></li></ul>
|
||||
</div>
|
||||
<div>
|
||||
<h2>Kontakt</h2>
|
||||
<ul role="list">
|
||||
<li><a href="tel:+4987114269101">0871 / 14 26 91 01</a></li>
|
||||
<li><a href="tel:+491608365753">Notruf 0160 / 836 57 53</a></li>
|
||||
<li><a href="mailto:info@kirschner-service.de">info@kirschner-service.de</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div>
|
||||
<h2>Adresse</h2>
|
||||
<address style="font-style:normal">Etzstraße 45<br>84030 Ergolding<br><a href="https://www.google.com/maps/search/?api=1&query=Etzstra%C3%9Fe+45%2C+84030+Ergolding" rel="noopener" target="_blank">Route planen</a></address>
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer-word" aria-hidden="true">KIRSCHNER</div>
|
||||
<div class="footer-bottom">
|
||||
<span>© <span data-year>2026</span> Kirschner Gebäudeservice · Thomas Kirschner</span>
|
||||
<nav aria-label="Rechtliches"><a href="impressum.html">Impressum</a><a href="datenschutz.html">Datenschutz</a></nav>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
<a class="sos" href="tel:+491608365753" aria-label="24/7 Notruf anrufen: 0160 / 836 57 53">
|
||||
<span class="sos__dot" aria-hidden="true"></span>
|
||||
<span><small>Notruf 24/7</small><b>0160 / 836 57 53</b></span>
|
||||
</a>
|
||||
</body>
|
||||
</html>
|
||||
+226
@@ -0,0 +1,226 @@
|
||||
<!doctype html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>Leistungen — Hausmeisterservice, Reinigung, Winterdienst | Kirschner Gebäudeservice</title>
|
||||
<meta name="description" content="Reinigung, Glas- & PV-Reinigung mit Osmoseanlage, Garten- & Grünpflege, technische Hausbetreuung, Reparaturen, Winterdienst und 24/7-Bereitschaft in Landshut und Ergolding.">
|
||||
<link rel="canonical" href="https://www.kirschner-service.de/leistungen.html">
|
||||
<meta name="theme-color" content="#0A1424">
|
||||
<meta property="og:type" content="website">
|
||||
<meta property="og:locale" content="de_DE">
|
||||
<meta property="og:site_name" content="Kirschner Gebäudeservice">
|
||||
<meta property="og:title" content="Leistungen — Hausmeisterservice, Reinigung, Winterdienst | Kirschner Gebäudeservice">
|
||||
<meta property="og:description" content="Reinigung, Glas- & PV-Reinigung mit Osmoseanlage, Garten- & Grünpflege, technische Hausbetreuung, Reparaturen, Winterdienst und 24/7-Bereitschaft in Landshut und Ergolding.">
|
||||
<meta property="og:url" content="https://www.kirschner-service.de/leistungen.html">
|
||||
<meta property="og:image" content="https://www.kirschner-service.de/assets/img/og.jpg">
|
||||
<link rel="icon" href="assets/favicon.svg" type="image/svg+xml">
|
||||
<link rel="apple-touch-icon" href="assets/apple-touch-icon.png">
|
||||
<link rel="preload" href="assets/fonts/archivo-latin-wdth-normal.woff2" as="font" type="font/woff2" crossorigin>
|
||||
<link rel="stylesheet" href="assets/site.css">
|
||||
<script>(function(r){r.classList.add('js');try{if(r.hasAttribute('data-intro')&&!sessionStorage.getItem('kk-intro')&&matchMedia('(prefers-reduced-motion: no-preference)').matches)r.classList.add('has-intro')}catch(e){}setTimeout(function(){if(!r.classList.contains('motion-ready'))r.classList.remove('js','has-intro')},3000)})(document.documentElement)</script>
|
||||
<script src="assets/vendor/gsap.min.js" defer></script>
|
||||
<script src="assets/vendor/ScrollTrigger.min.js" defer></script>
|
||||
<script src="assets/vendor/SplitText.min.js" defer></script>
|
||||
<script src="assets/vendor/lenis.min.js" defer></script>
|
||||
<script src="assets/motion.js" defer></script>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<a class="skip-link" href="#inhalt">Zum Inhalt springen</a>
|
||||
<header class="site-header">
|
||||
<div class="wrap site-header__inner">
|
||||
<a class="brand" href="index.html" aria-label="Kirschner Gebäudeservice — Startseite">
|
||||
<svg class="chev-mark" viewBox="0 0 44 32" aria-hidden="true"><polygon class="chev" opacity=".55" points="14,0 24,0 10,16 24,32 14,32 0,16"/><polygon class="chev" points="32,0 42,0 28,16 42,32 32,32 18,16"/></svg>
|
||||
<span class="brand__name"><b>KIRSCHNER</b><span>Gebäudeservice</span></span>
|
||||
</a>
|
||||
<nav class="nav" aria-label="Hauptnavigation"><a class="nav__link" href="leistungen.html" aria-current="page">Leistungen</a><a class="nav__link" href="unternehmen.html">Unternehmen</a><a class="nav__link" href="karriere.html">Karriere</a><a class="nav__link" href="kontakt.html">Kontakt</a></nav>
|
||||
<div class="header-cta">
|
||||
<a class="header-phone" href="tel:+4987114269101"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linejoin="round" aria-hidden="true"><path d="M5 4h4l2 5-2.5 1.5a11 11 0 0 0 5 5L15 13l5 2v4a2 2 0 0 1-2 2A16 16 0 0 1 3 6a2 2 0 0 1 2-2"/></svg><span>0871 / 14 26 91 01</span></a>
|
||||
<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>
|
||||
<button class="menu-toggle" type="button" aria-expanded="false" aria-controls="mobile-nav" aria-label="Menü öffnen"><span class="menu-toggle__bars"></span></button>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
<div class="mobile-nav" id="mobile-nav">
|
||||
<nav aria-label="Mobile Navigation"><ul role="list"><li><a class="mobile-nav__link" href="index.html">Start</a></li><li><a class="mobile-nav__link" href="leistungen.html" aria-current="page">Leistungen</a></li><li><a class="mobile-nav__link" href="unternehmen.html">Unternehmen</a></li><li><a class="mobile-nav__link" href="karriere.html">Karriere</a></li><li><a class="mobile-nav__link" href="kontakt.html">Kontakt</a></li></ul></nav>
|
||||
<div class="mobile-nav__meta">
|
||||
<a href="tel:+4987114269101">Büro 0871 / 14 26 91 01</a>
|
||||
<a href="tel:+491608365753">Notruf 24/7 0160 / 836 57 53</a>
|
||||
<a href="mailto:info@kirschner-service.de">info@kirschner-service.de</a>
|
||||
</div>
|
||||
</div>
|
||||
<main id="inhalt">
|
||||
|
||||
<section class="page-hero">
|
||||
<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">
|
||||
<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>
|
||||
<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 & 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>
|
||||
</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>
|
||||
</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>
|
||||
</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>
|
||||
</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>
|
||||
</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>
|
||||
</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>
|
||||
</div>
|
||||
</article>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<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>
|
||||
</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>
|
||||
</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>
|
||||
</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>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
<footer class="site-footer">
|
||||
<div class="wrap">
|
||||
<div class="footer-grid">
|
||||
<div>
|
||||
<a class="brand" href="index.html" aria-label="Kirschner Gebäudeservice — Startseite"><svg class="chev-mark" viewBox="0 0 44 32" aria-hidden="true"><polygon class="chev" opacity=".55" points="14,0 24,0 10,16 24,32 14,32 0,16"/><polygon class="chev" points="32,0 42,0 28,16 42,32 32,32 18,16"/></svg><span class="brand__name"><b>KIRSCHNER</b><span>Gebäudeservice</span></span></a>
|
||||
<p class="footer-motto">Das Original seit 2003. Persönlich, zuverlässig, erstklassig — in Landshut, Ergolding und Umgebung.</p>
|
||||
</div>
|
||||
<div>
|
||||
<h2>Seiten</h2>
|
||||
<ul role="list"><li><a href="index.html">Start</a></li><li><a href="leistungen.html">Leistungen</a></li><li><a href="unternehmen.html">Unternehmen</a></li><li><a href="karriere.html">Karriere</a></li><li><a href="kontakt.html">Kontakt</a></li></ul>
|
||||
</div>
|
||||
<div>
|
||||
<h2>Kontakt</h2>
|
||||
<ul role="list">
|
||||
<li><a href="tel:+4987114269101">0871 / 14 26 91 01</a></li>
|
||||
<li><a href="tel:+491608365753">Notruf 0160 / 836 57 53</a></li>
|
||||
<li><a href="mailto:info@kirschner-service.de">info@kirschner-service.de</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div>
|
||||
<h2>Adresse</h2>
|
||||
<address style="font-style:normal">Etzstraße 45<br>84030 Ergolding<br><a href="https://www.google.com/maps/search/?api=1&query=Etzstra%C3%9Fe+45%2C+84030+Ergolding" rel="noopener" target="_blank">Route planen</a></address>
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer-word" aria-hidden="true">KIRSCHNER</div>
|
||||
<div class="footer-bottom">
|
||||
<span>© <span data-year>2026</span> Kirschner Gebäudeservice · Thomas Kirschner</span>
|
||||
<nav aria-label="Rechtliches"><a href="impressum.html">Impressum</a><a href="datenschutz.html">Datenschutz</a></nav>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
<a class="sos" href="tel:+491608365753" aria-label="24/7 Notruf anrufen: 0160 / 836 57 53">
|
||||
<span class="sos__dot" aria-hidden="true"></span>
|
||||
<span><small>Notruf 24/7</small><b>0160 / 836 57 53</b></span>
|
||||
</a>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,3 @@
|
||||
User-agent: *
|
||||
Allow: /
|
||||
Sitemap: https://www.kirschner-service.de/sitemap.xml
|
||||
+10
@@ -0,0 +1,10 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
|
||||
<url><loc>https://www.kirschner-service.de/</loc><lastmod>2026-09-30</lastmod></url>
|
||||
<url><loc>https://www.kirschner-service.de/leistungen.html</loc><lastmod>2026-09-30</lastmod></url>
|
||||
<url><loc>https://www.kirschner-service.de/unternehmen.html</loc><lastmod>2026-09-30</lastmod></url>
|
||||
<url><loc>https://www.kirschner-service.de/karriere.html</loc><lastmod>2026-09-30</lastmod></url>
|
||||
<url><loc>https://www.kirschner-service.de/kontakt.html</loc><lastmod>2026-09-30</lastmod></url>
|
||||
<url><loc>https://www.kirschner-service.de/impressum.html</loc><lastmod>2026-09-30</lastmod></url>
|
||||
<url><loc>https://www.kirschner-service.de/datenschutz.html</loc><lastmod>2026-09-30</lastmod></url>
|
||||
</urlset>
|
||||
@@ -0,0 +1,771 @@
|
||||
"""Erzeugt die sieben HTML-Seiten aus gemeinsamen Bausteinen (Header, Footer, Leistungen).
|
||||
|
||||
Quelle der Wahrheit für Inhalt und Struktur ist diese Datei — die HTML-Dateien nicht von Hand
|
||||
ändern, sondern hier ändern und neu erzeugen:
|
||||
|
||||
python3 tools/build_pages.py (braucht Pillow: pip install pillow)
|
||||
"""
|
||||
import json
|
||||
from datetime import date
|
||||
from pathlib import Path
|
||||
from PIL import Image
|
||||
|
||||
OUT = Path(__file__).resolve().parent.parent
|
||||
IMG = OUT / "assets/img"
|
||||
YEARS = date.today().year - 2003 # motion.js aktualisiert zur Laufzeit
|
||||
SITE = "https://www.kirschner-service.de"
|
||||
|
||||
TEL = "0871 / 14 26 91 01"
|
||||
TEL_HREF = "tel:+4987114269101"
|
||||
SOS = "0160 / 836 57 53"
|
||||
SOS_HREF = "tel:+491608365753"
|
||||
MAIL = "info@kirschner-service.de"
|
||||
MAPS = "https://www.google.com/maps/search/?api=1&query=Etzstra%C3%9Fe+45%2C+84030+Ergolding"
|
||||
|
||||
|
||||
def mailto(subject, body=""):
|
||||
from urllib.parse import quote
|
||||
q = "subject=" + quote(subject)
|
||||
if body:
|
||||
q += "&body=" + quote(body)
|
||||
return f"mailto:{MAIL}?{q}"
|
||||
|
||||
|
||||
ANFRAGE = mailto("Angebotsanfrage", "Guten Tag,\n\nich interessiere mich für Ihre Leistungen.\n\nObjekt / Adresse:\nGewünschte Leistungen:\nTelefon für Rückruf:\n\nViele Grüße\n")
|
||||
|
||||
# ---------- Icons ----------
|
||||
I_ARROW = '<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>'
|
||||
I_ARROW_S = '<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>'
|
||||
I_PHONE = '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linejoin="round" aria-hidden="true"><path d="M5 4h4l2 5-2.5 1.5a11 11 0 0 0 5 5L15 13l5 2v4a2 2 0 0 1-2 2A16 16 0 0 1 3 6a2 2 0 0 1 2-2"/></svg>'
|
||||
I_DOWN = '<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>'
|
||||
I_PLUS = '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="square" aria-hidden="true"><path d="M12 4v16M4 12h16"/></svg>'
|
||||
I_DRAG = '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="square" aria-hidden="true"><path d="M9 6l-6 6 6 6M15 6l6 6-6 6"/></svg>'
|
||||
|
||||
|
||||
def chev_mark(cls="chev-mark"):
|
||||
return (f'<svg class="{cls}" viewBox="0 0 44 32" aria-hidden="true">'
|
||||
'<polygon class="chev" opacity=".55" points="14,0 24,0 10,16 24,32 14,32 0,16"/>'
|
||||
'<polygon class="chev" points="32,0 42,0 28,16 42,32 32,32 18,16"/></svg>')
|
||||
|
||||
|
||||
HERO_CHEVRONS = ('<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>')
|
||||
BAND_CHEV = ('<svg class="band__chev" viewBox="0 0 600 400" aria-hidden="true">'
|
||||
'<path d="M260 0h120L180 200l200 200H260L60 200z"/><path d="M460 0h120L380 200l200 200H460L260 200z"/></svg>')
|
||||
|
||||
|
||||
def pic(name, alt, sizes="100vw", eager=False, cls=""):
|
||||
w, h = Image.open(IMG / f"{name}-1600.webp").size if (IMG / f"{name}-1600.webp").exists() else Image.open(IMG / f"{name}-1400.webp").size
|
||||
big = 1600 if (IMG / f"{name}-1600.webp").exists() else 1400
|
||||
load = 'fetchpriority="high"' if eager else 'loading="lazy" decoding="async"'
|
||||
c = f' class="{cls}"' if cls else ""
|
||||
return (f'<picture{c}>'
|
||||
f'<source type="image/avif" srcset="assets/img/{name}-800.avif 800w, assets/img/{name}-{big}.avif {big}w" sizes="{sizes}">'
|
||||
f'<source type="image/webp" srcset="assets/img/{name}-800.webp 800w, assets/img/{name}-{big}.webp {big}w" sizes="{sizes}">'
|
||||
f'<img src="assets/img/{name}-{big}.webp" width="{w}" height="{h}" alt="{alt}" {load}></picture>')
|
||||
|
||||
|
||||
NAV = [("index.html", "Start"), ("leistungen.html", "Leistungen"), ("unternehmen.html", "Unternehmen"),
|
||||
("karriere.html", "Karriere"), ("kontakt.html", "Kontakt")]
|
||||
|
||||
HEAD_SCRIPT = ("(function(r){r.classList.add('js');try{if(r.hasAttribute('data-intro')&&!sessionStorage.getItem('kk-intro')"
|
||||
"&&matchMedia('(prefers-reduced-motion: no-preference)').matches)r.classList.add('has-intro')}catch(e){}"
|
||||
"setTimeout(function(){if(!r.classList.contains('motion-ready'))r.classList.remove('js','has-intro')},3000)})(document.documentElement)")
|
||||
|
||||
LD = {
|
||||
"@context": "https://schema.org",
|
||||
"@type": "LocalBusiness",
|
||||
"name": "Kirschner Gebäudeservice",
|
||||
"description": "Hausmeisterservice und Gebäudedienstleistungen in Landshut und Ergolding seit 2003.",
|
||||
"url": SITE + "/",
|
||||
"telephone": "+49 871 14269101",
|
||||
"email": MAIL,
|
||||
"foundingDate": "2003",
|
||||
"founder": {"@type": "Person", "name": "Thomas Kirschner"},
|
||||
"address": {"@type": "PostalAddress", "streetAddress": "Etzstraße 45", "postalCode": "84030",
|
||||
"addressLocality": "Ergolding", "addressRegion": "Bayern", "addressCountry": "DE"},
|
||||
"areaServed": ["Landshut", "Ergolding"],
|
||||
"slogan": "persönlich, zuverlässig, erstklassig",
|
||||
"image": SITE + "/assets/img/og.jpg",
|
||||
}
|
||||
|
||||
|
||||
def head(title, desc, file, intro=False):
|
||||
ld = f'<script type="application/ld+json">{json.dumps(LD, ensure_ascii=False)}</script>' if file == "index.html" else ""
|
||||
canonical = SITE + "/" + ("" if file == "index.html" else file)
|
||||
return f'''<!doctype html>
|
||||
<html lang="de"{' data-intro' if intro else ''}>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>{title}</title>
|
||||
<meta name="description" content="{desc}">
|
||||
<link rel="canonical" href="{canonical}">
|
||||
<meta name="theme-color" content="#0A1424">
|
||||
<meta property="og:type" content="website">
|
||||
<meta property="og:locale" content="de_DE">
|
||||
<meta property="og:site_name" content="Kirschner Gebäudeservice">
|
||||
<meta property="og:title" content="{title}">
|
||||
<meta property="og:description" content="{desc}">
|
||||
<meta property="og:url" content="{canonical}">
|
||||
<meta property="og:image" content="{SITE}/assets/img/og.jpg">
|
||||
<link rel="icon" href="assets/favicon.svg" type="image/svg+xml">
|
||||
<link rel="apple-touch-icon" href="assets/apple-touch-icon.png">
|
||||
<link rel="preload" href="assets/fonts/archivo-latin-wdth-normal.woff2" as="font" type="font/woff2" crossorigin>
|
||||
<link rel="stylesheet" href="assets/site.css">
|
||||
<script>{HEAD_SCRIPT}</script>
|
||||
<script src="assets/vendor/gsap.min.js" defer></script>
|
||||
<script src="assets/vendor/ScrollTrigger.min.js" defer></script>
|
||||
<script src="assets/vendor/SplitText.min.js" defer></script>
|
||||
<script src="assets/vendor/lenis.min.js" defer></script>
|
||||
<script src="assets/motion.js" defer></script>
|
||||
{ld}
|
||||
</head>'''
|
||||
|
||||
|
||||
def header(active):
|
||||
def cur(f):
|
||||
return ' aria-current="page"' if f == active else ""
|
||||
links = "".join(f'<a class="nav__link" href="{f}"{cur(f)}>{n}</a>' for f, n in NAV if f != "index.html")
|
||||
mlinks = "".join(f'<li><a class="mobile-nav__link" href="{f}"{cur(f)}>{n}</a></li>' for f, n in NAV)
|
||||
return f'''
|
||||
<a class="skip-link" href="#inhalt">Zum Inhalt springen</a>
|
||||
<header class="site-header">
|
||||
<div class="wrap site-header__inner">
|
||||
<a class="brand" href="index.html" aria-label="Kirschner Gebäudeservice — Startseite">
|
||||
{chev_mark()}
|
||||
<span class="brand__name"><b>KIRSCHNER</b><span>Gebäudeservice</span></span>
|
||||
</a>
|
||||
<nav class="nav" aria-label="Hauptnavigation">{links}</nav>
|
||||
<div class="header-cta">
|
||||
<a class="header-phone" href="{TEL_HREF}">{I_PHONE}<span>{TEL}</span></a>
|
||||
<a class="btn" href="{ANFRAGE}">Angebot anfragen {I_ARROW}</a>
|
||||
<button class="menu-toggle" type="button" aria-expanded="false" aria-controls="mobile-nav" aria-label="Menü öffnen"><span class="menu-toggle__bars"></span></button>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
<div class="mobile-nav" id="mobile-nav">
|
||||
<nav aria-label="Mobile Navigation"><ul role="list">{mlinks}</ul></nav>
|
||||
<div class="mobile-nav__meta">
|
||||
<a href="{TEL_HREF}">Büro {TEL}</a>
|
||||
<a href="{SOS_HREF}">Notruf 24/7 {SOS}</a>
|
||||
<a href="mailto:{MAIL}">{MAIL}</a>
|
||||
</div>
|
||||
</div>'''
|
||||
|
||||
|
||||
FOOTER = f'''
|
||||
<footer class="site-footer">
|
||||
<div class="wrap">
|
||||
<div class="footer-grid">
|
||||
<div>
|
||||
<a class="brand" href="index.html" aria-label="Kirschner Gebäudeservice — Startseite">{chev_mark()}<span class="brand__name"><b>KIRSCHNER</b><span>Gebäudeservice</span></span></a>
|
||||
<p class="footer-motto">Das Original seit 2003. Persönlich, zuverlässig, erstklassig — in Landshut, Ergolding und Umgebung.</p>
|
||||
</div>
|
||||
<div>
|
||||
<h2>Seiten</h2>
|
||||
<ul role="list">{"".join(f'<li><a href="{f}">{n}</a></li>' for f, n in NAV)}</ul>
|
||||
</div>
|
||||
<div>
|
||||
<h2>Kontakt</h2>
|
||||
<ul role="list">
|
||||
<li><a href="{TEL_HREF}">{TEL}</a></li>
|
||||
<li><a href="{SOS_HREF}">Notruf {SOS}</a></li>
|
||||
<li><a href="mailto:{MAIL}">{MAIL}</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div>
|
||||
<h2>Adresse</h2>
|
||||
<address style="font-style:normal">Etzstraße 45<br>84030 Ergolding<br><a href="{MAPS}" rel="noopener" target="_blank">Route planen</a></address>
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer-word" aria-hidden="true">KIRSCHNER</div>
|
||||
<div class="footer-bottom">
|
||||
<span>© <span data-year>2026</span> Kirschner Gebäudeservice · Thomas Kirschner</span>
|
||||
<nav aria-label="Rechtliches"><a href="impressum.html">Impressum</a><a href="datenschutz.html">Datenschutz</a></nav>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
<a class="sos" href="{SOS_HREF}" aria-label="24/7 Notruf anrufen: {SOS}">
|
||||
<span class="sos__dot" aria-hidden="true"></span>
|
||||
<span><small>Notruf 24/7</small><b>{SOS}</b></span>
|
||||
</a>'''
|
||||
|
||||
|
||||
def page(file, title, desc, body, intro=False):
|
||||
html = head(title, desc, file, intro) + "\n<body>" + header(file) + f'\n<main id="inhalt">\n{body}\n</main>' + FOOTER + "\n</body>\n</html>\n"
|
||||
(OUT / file).write_text(html, encoding="utf-8")
|
||||
print("geschrieben:", file, len(html))
|
||||
|
||||
|
||||
def page_hero(eyebrow, h1, lead, extra=""):
|
||||
return f'''
|
||||
<section class="page-hero">
|
||||
{HERO_CHEVRONS}
|
||||
<div class="wrap page-hero__grid">
|
||||
<div class="stack">
|
||||
<p class="eyebrow" data-hero>{eyebrow}</p>
|
||||
<h1 class="display" data-split>{h1}</h1>
|
||||
</div>
|
||||
<div class="stack">
|
||||
<p class="lead" data-hero>{lead}</p>
|
||||
{extra}
|
||||
</div>
|
||||
</div>
|
||||
</section>'''
|
||||
|
||||
|
||||
def cta_final(h, p, theme=""):
|
||||
return f'''
|
||||
<section class="section {theme}" 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>{h}</h2>
|
||||
<p class="lead" data-reveal>{p}</p>
|
||||
<div class="btn-row mt-2" data-reveal>
|
||||
<a class="btn" href="{ANFRAGE}">Angebot per E-Mail {I_ARROW}</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="contact-lines" data-reveal>
|
||||
<a class="contact-line" href="{TEL_HREF}"><span><small>Büro</small><strong>{TEL}</strong></span>{I_ARROW_S}</a>
|
||||
<a class="contact-line" href="{SOS_HREF}"><span><small>Notruf 24/7</small><strong>{SOS}</strong></span>{I_ARROW_S}</a>
|
||||
<a class="contact-line" href="mailto:{MAIL}"><span><small>E-Mail</small><strong>{MAIL}</strong></span>{I_ARROW_S}</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>'''
|
||||
|
||||
|
||||
# ======================================================================
|
||||
# Leistungen (eine Quelle für Start und Leistungsseite)
|
||||
# ======================================================================
|
||||
SERVICES = [
|
||||
("reinigung", "Reinigung",
|
||||
"Treppenhäuser, Eingangsbereiche, Innen- und Außenflächen — regelmäßig und nach festem Plan. Tiefgaragen reinigen wir mit modernen Maschinen.",
|
||||
["Treppenhaus", "Innenreinigung", "Außenreinigung", "Tiefgarage"],
|
||||
"Treppenhaus in einem modernen Wohngebäude"),
|
||||
("glas", "Glas- & PV-Reinigung",
|
||||
"Mit eigener Osmoseanlage und reinem Wasser: streifenfreie Fenster und saubere Photovoltaik-Module — meist sogar ohne Hebebühne.",
|
||||
["Osmoseanlage", "Fenster & Fassadenglas", "Photovoltaik", "meist ohne Hebebühne"],
|
||||
"Fensterreinigung mit Teleskopstange an einem Wohnhaus"),
|
||||
("garten", "Garten- & Grünpflege",
|
||||
"Rasen, Hecken, Beete und Grünanlagen — gepflegt über das ganze Jahr, damit Ihr Objekt schon von außen einen guten Eindruck macht.",
|
||||
["Rasenpflege", "Heckenschnitt", "Grünanlagen", "Gartenarbeiten"],
|
||||
"Heckenschnitt in einer Gartenanlage"),
|
||||
("technik", "Technische Hausbetreuung",
|
||||
"Kontrolle und Wartung technischer Anlagen, regelmäßige Rundgänge und ein wacher Blick, bevor aus Kleinigkeiten teure Schäden werden.",
|
||||
["Anlagenkontrolle", "Wartung", "Objektrundgänge"],
|
||||
"Rohrleitungen einer Haustechnikanlage"),
|
||||
("reparatur", "Reparaturen & Renovierungen",
|
||||
"Handwerkliches Können im eigenen Team — vom Schreiner bis zum Servicetechniker. Kleine Reparaturen erledigen wir direkt, größere planen wir mit Ihnen.",
|
||||
["Reparaturen", "Renovierungen", "Schreinerarbeiten"],
|
||||
"Handwerker bei der Arbeit mit einem Akkuschrauber"),
|
||||
("winter", "Winterdienst",
|
||||
"Räumen und Streuen mit eigenen Fahrzeugen, damit Wege, Zufahrten und Eingänge bei Schnee und Eis sicher bleiben.",
|
||||
["Räumdienst", "Streudienst", "eigene Fahrzeuge"],
|
||||
"Schneeräumung vor einem Gebäude"),
|
||||
("bereitschaft", "24/7-Bereitschaft",
|
||||
"Auf Wunsch sind wir rund um die Uhr erreichbar. Wenn es brennt, erreichen Sie uns über den Notruf — auch nachts und am Wochenende.",
|
||||
["rund um die Uhr", "Notruf", "auf Wunsch"],
|
||||
"Reinigung einer Glasfassade am Abend"),
|
||||
]
|
||||
|
||||
# ======================================================================
|
||||
# Startseite
|
||||
# ======================================================================
|
||||
panels = "".join(f'''
|
||||
<article class="panel" data-reveal>
|
||||
<div class="panel__media">{pic(n, alt, "(min-width: 1024px) 38vw, (min-width: 700px) 50vw, 100vw")}<span class="panel__num">{i:02d}</span></div>
|
||||
<div class="panel__body">
|
||||
<h3>{t}</h3>
|
||||
<p>{d}</p>
|
||||
<ul class="tags" role="list">{"".join(f"<li>{x}</li>" for x in tags)}</ul>
|
||||
</div>
|
||||
</article>''' for i, (n, t, d, tags, alt) in enumerate(SERVICES, 1))
|
||||
|
||||
INDEX = f'''
|
||||
<div class="intro" aria-hidden="true">
|
||||
<div class="intro__mark">
|
||||
{chev_mark()}
|
||||
<div class="intro__word"><span>KIRSCHNER</span><small>Gebäudeservice</small></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<section class="hero" aria-labelledby="hero-title">
|
||||
<div class="hero__media">{pic("hero", "", "100vw", eager=True)}</div>
|
||||
{HERO_CHEVRONS}
|
||||
<div class="wrap">
|
||||
<div class="hero__content">
|
||||
<p class="eyebrow" data-hero>Hausmeisterservice · Landshut & Ergolding</p>
|
||||
<h1 class="mega" id="hero-title" data-split>Ihr Gebäude.<br> In besten Händen.</h1>
|
||||
<p class="lead" data-hero>Reinigung, Grünpflege, Technik, Reparaturen und Winterdienst aus einer Hand — für Privat, Eigentümergemeinschaften, Gewerbe und die öffentliche Hand. Seit 2003.</p>
|
||||
<div class="btn-row" data-hero>
|
||||
<a class="btn" href="{ANFRAGE}">Angebot anfragen {I_ARROW}</a>
|
||||
<a class="btn btn--ghost" href="leistungen.html">Alle Leistungen {I_ARROW}</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="hero__foot" data-hero>
|
||||
<ul role="list">
|
||||
<li>Das Original seit 2003</li>
|
||||
<li>Eigene Osmoseanlage</li>
|
||||
<li>24/7-Bereitschaft auf Wunsch</li>
|
||||
</ul>
|
||||
<span class="scroll-hint" aria-hidden="true"><span class="scroll-hint__line"></span>Scrollen</span>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="audience" aria-label="Für wen wir arbeiten">
|
||||
<div class="wrap">
|
||||
<ul role="list">
|
||||
<li data-reveal><b>Privat</b><span>Haus, Garten, Reparaturen</span></li>
|
||||
<li data-reveal><b>Eigentümergemeinschaften</b><span>Wohnanlagen & Hausverwaltungen</span></li>
|
||||
<li data-reveal><b>Gewerbe</b><span>Büro-, Gewerbe- & Tiefgaragen</span></li>
|
||||
<li data-reveal><b>Öffentliche Hand</b><span>Kommunale Objekte</span></li>
|
||||
</ul>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section theme-light" aria-labelledby="about-title">
|
||||
<div class="wrap">
|
||||
<div class="intro-split">
|
||||
<div class="stack">
|
||||
<p class="eyebrow" data-reveal>Über uns</p>
|
||||
<h2 class="display" id="about-title" data-split>Werterhalt, der man ansieht.</h2>
|
||||
</div>
|
||||
<div class="stack">
|
||||
<p class="lead" data-reveal>Seit 2003 kümmern wir uns um Immobilien in Landshut, Ergolding und Umgebung — und werden dabei auch gehobenen Ansprüchen im Premiumbereich gerecht.</p>
|
||||
<p data-reveal class="muted">Sie bekommen feste Ansprechpartner, ein eingespieltes Team und professionelle Arbeit zu einem fairen Preis. Unsere langjährige Erfahrung bringen wir gern zum Werterhalt Ihrer Immobilie ein.</p>
|
||||
<p data-reveal><a class="link-arrow accent" href="unternehmen.html">Unternehmen & Team {I_ARROW_S}</a></p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="stats">
|
||||
<div class="stat" data-reveal><span class="stat__num"><span data-count="years">{YEARS}</span></span><span class="stat__label">Jahre Erfahrung — das Original seit 2003</span></div>
|
||||
<div class="stat" data-reveal><span class="stat__num"><span data-count="7">7</span></span><span class="stat__label">Leistungsbereiche aus einer Hand</span></div>
|
||||
<div class="stat" data-reveal><span class="stat__num">24<sup>/7</sup></span><span class="stat__label">Bereitschaftsdienst auf Wunsch</span></div>
|
||||
<div class="stat" data-reveal><span class="stat__num"><span data-count="4">4</span></span><span class="stat__label">Kundengruppen — von Privat bis Kommune</span></div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section" aria-labelledby="services-title" style="padding-bottom:0">
|
||||
<div class="wrap services-head">
|
||||
<div class="stack">
|
||||
<p class="eyebrow" data-reveal>Leistungen</p>
|
||||
<h2 class="display" id="services-title" data-split>Alles, was Ihr Gebäude braucht.</h2>
|
||||
</div>
|
||||
<p class="lead" data-reveal>Klassische Hausmeisterdienste und spezialisierte Leistungen — koordiniert von einem Team, das Ihr Objekt kennt.</p>
|
||||
</div>
|
||||
</section>
|
||||
<section class="hscroll" aria-label="Leistungsübersicht">
|
||||
<div class="hscroll__track">{panels}
|
||||
</div>
|
||||
<div class="hscroll__progress" aria-hidden="true"><span data-hs-count>01</span><span class="hscroll__bar"><i></i></span><span>{len(SERVICES):02d}</span></div>
|
||||
</section>
|
||||
<div class="wrap" style="padding-block: var(--s6) var(--section)"><a class="btn btn--ghost" href="leistungen.html">Alle Leistungen im Detail {I_ARROW}</a></div>
|
||||
|
||||
<section class="section theme-white" aria-labelledby="osmose-title">
|
||||
<div class="wrap feature">
|
||||
<div class="feature__copy">
|
||||
<p class="eyebrow" data-reveal>Glas- & PV-Reinigung</p>
|
||||
<h2 class="display" id="osmose-title" data-split>Reines Wasser. Klare Sicht.</h2>
|
||||
<p class="lead" data-reveal>Mit unserer eigenen Osmoseanlage reinigen wir Glasflächen und Photovoltaik-Module mit entmineralisiertem Wasser — ohne Rückstände.</p>
|
||||
<ul class="checklist" role="list">
|
||||
<li data-reveal>Streifenfrei trocknend, ohne Reinigungsmittel</li>
|
||||
<li data-reveal>Teleskoptechnik — meist sogar ohne Hebebühne</li>
|
||||
<li data-reveal>Für Fenster, Glasfassaden und PV-Anlagen</li>
|
||||
</ul>
|
||||
<p data-reveal class="mt-2"><a class="btn" href="{mailto('Anfrage Glas- / PV-Reinigung')}">Reinigung anfragen {I_ARROW}</a></p>
|
||||
</div>
|
||||
<figure data-reveal>
|
||||
<div class="compare" tabindex="0" role="slider" aria-label="Vorher-Nachher-Vergleich PV-Reinigung" aria-valuemin="0" aria-valuemax="100" aria-valuenow="50">
|
||||
{pic("pv-nachher", "Photovoltaik-Modul nach der Reinigung, klar und glänzend", "(min-width: 960px) 55vw, 100vw")}
|
||||
<div class="compare__before">{pic("pv-vorher", "Photovoltaik-Modul vor der Reinigung, mit Staub und Kalkflecken", "(min-width: 960px) 55vw, 100vw")}</div>
|
||||
<div class="compare__handle" aria-hidden="true"><span class="compare__knob">{I_DRAG}</span></div>
|
||||
<span class="compare__tag compare__tag--before" aria-hidden="true">Vorher</span>
|
||||
<span class="compare__tag compare__tag--after" aria-hidden="true">Nachher</span>
|
||||
</div>
|
||||
<figcaption class="figure-note">Symbolbild — ziehen oder mit den Pfeiltasten vergleichen.</figcaption>
|
||||
</figure>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section theme-deep philosophy" aria-labelledby="philo-title">
|
||||
<div class="wrap">
|
||||
<p class="eyebrow" data-reveal id="philo-title">Unsere Philosophie</p>
|
||||
<p class="philosophy__words mt-4" data-scrub-words>Persönlich<span class="dot">.</span> Zuverlässig<span class="dot">.</span> Erstklassig<span class="dot">.</span></p>
|
||||
<div class="philosophy__sub">
|
||||
<div data-reveal><b>Persönlich</b><p>Feste Ansprechpartner und Mitarbeiter, die „ihre" Objekte kennen — keine wechselnden Springer.</p></div>
|
||||
<div data-reveal><b>Zuverlässig</b><p>Klare Abläufe, strukturiert über unsere eigene App, und auf Wunsch Bereitschaft rund um die Uhr.</p></div>
|
||||
<div data-reveal><b>Erstklassig</b><p>Moderne Maschinen, eigene Osmoseanlage, handwerkliche Ausbildung im Team — für Ansprüche bis in den Premiumbereich.</p></div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="band" aria-labelledby="jobs-title">
|
||||
{BAND_CHEV}
|
||||
<div class="wrap band__inner">
|
||||
<div class="stack">
|
||||
<p class="eyebrow" data-reveal>Wir stellen ein</p>
|
||||
<h2 class="display" id="jobs-title" data-split>Bock auf einen vielseitigen Job?</h2>
|
||||
<p data-reveal>Hausmeister, Ga-La-Bauer, Glas- und Solarreiniger, Reinigungskräfte: übertarifliche Bezahlung, starkes Team, viel frische Luft — und freitagnachmittags frei.</p>
|
||||
</div>
|
||||
<div data-reveal><a class="btn" href="karriere.html">Offene Stellen {I_ARROW}</a></div>
|
||||
</div>
|
||||
</section>
|
||||
''' + cta_final("Sprechen wir über Ihr Objekt.", "Rufen Sie uns an oder schreiben Sie uns — wir melden uns schnell und unterbreiten Ihnen gern ein Angebot.")
|
||||
|
||||
page("index.html",
|
||||
"Kirschner Gebäudeservice — Hausmeisterservice in Landshut & Ergolding seit 2003",
|
||||
"Hausmeisterservice, Reinigung, Glas- & PV-Reinigung mit Osmose, Grünpflege, Winterdienst und 24/7-Bereitschaft in Landshut und Ergolding. Persönlich, zuverlässig, erstklassig — seit 2003.",
|
||||
INDEX, intro=True)
|
||||
|
||||
# ======================================================================
|
||||
# Leistungen
|
||||
# ======================================================================
|
||||
PRIVAT = ["Gartenarbeiten", "Reparaturen", "Renovierungen", "Glas- & PV-Reinigung", "Winterdienst"]
|
||||
GEWERBE = ["Technische Hausbetreuung", "Innenreinigung", "Außenreinigung", "Pflege von Grünanlagen", "Winterdienst",
|
||||
"Reparaturen", "Renovierungen", "Tiefgaragenreinigung", "Glas- & PV-Reinigung", "24/7-Bereitschaft"]
|
||||
|
||||
rows = "".join(f'''
|
||||
<article class="service-row" id="{n}">
|
||||
<div class="service-row__media reveal-img">{pic(n, alt, "(min-width: 960px) 52vw, 100vw")}</div>
|
||||
<div class="service-row__body">
|
||||
<span class="service-row__num" data-reveal>{i:02d}</span>
|
||||
<h3 class="title" data-split>{t}</h3>
|
||||
<p class="muted" data-reveal>{d}</p>
|
||||
<ul class="tags" role="list" data-reveal>{"".join(f"<li>{x}</li>" for x in tags)}</ul>
|
||||
</div>
|
||||
</article>''' for i, (n, t, d, tags, alt) in enumerate(SERVICES, 1))
|
||||
|
||||
LEISTUNGEN = page_hero("Leistungen", "Ein Team. Jedes Gewerk.",
|
||||
"Klassische Hausmeisterdienste und spezialisierte Leistungen — einzeln buchbar oder als Rundum-Betreuung für Ihr Objekt.",
|
||||
f'<div class="btn-row" data-hero><a class="btn" href="{ANFRAGE}">Angebot anfragen {I_ARROW}</a></div>') + f'''
|
||||
<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 & 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">{"".join(f"<li>{x}</li>" for x in GEWERBE)}</ul>
|
||||
<ul class="scope-list" role="tabpanel" id="scope-privat" aria-labelledby="tab-privat" hidden>{"".join(f"<li>{x}</li>" for x in PRIVAT)}</ul>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section" aria-label="Leistungen im Detail">
|
||||
<div class="wrap service-rows">{rows}
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<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>
|
||||
</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>{I_DOWN}</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>{I_DOWN}</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>
|
||||
</div>
|
||||
</section>
|
||||
''' + cta_final("Sie wünschen ein Angebot?", "Sprechen Sie uns an — wir schauen uns Ihr Objekt an und unterbreiten Ihnen ein Angebot, das zu Ihnen passt.")
|
||||
|
||||
page("leistungen.html",
|
||||
"Leistungen — Hausmeisterservice, Reinigung, Winterdienst | Kirschner Gebäudeservice",
|
||||
"Reinigung, Glas- & PV-Reinigung mit Osmoseanlage, Garten- & Grünpflege, technische Hausbetreuung, Reparaturen, Winterdienst und 24/7-Bereitschaft in Landshut und Ergolding.",
|
||||
LEISTUNGEN)
|
||||
|
||||
# ======================================================================
|
||||
# Unternehmen
|
||||
# ======================================================================
|
||||
TIMELINE = [
|
||||
("2003", "Gründung in Ergolding", "Kirschner Gebäudeservice startet — mit umfangreichen Dienstleistungen rund um Immobilien. Das Original seit 2003."),
|
||||
("2013", "10 Jahre", "Zehn Jahre Kirschner Gebäudeservice. Wir bedanken uns bei unseren Kunden für die gute und erfolgreiche Zusammenarbeit."),
|
||||
("2015", "Servicetechnik & Schreinerei", "Herr Listl verstärkt Servicetechnik und Hausmeisterei — mit langjähriger Erfahrung als Schreiner."),
|
||||
("2018", "15 Jahre — und 120 Schulessen-Jahre", "Wir feiern das Jubiläum mit unseren Geschäftspartnern. Durch die Spenden des Abends werden über 120 Kinder in Nepal ein Jahr lang mit Schulessen versorgt."),
|
||||
("2019", "Das Team wächst", "Herr Gerhart ergänzt das Team mit handwerklicher Ausbildung, Herr Ponath mit langjähriger Erfahrung in der Gebäudedienstleistung."),
|
||||
("2020", "Für den Nachwuchs", "Ein neuer Trikotsatz für die U8 des FC Ergolding 1932 e.V."),
|
||||
("Heute", f"<span data-years>{YEARS}</span> Jahre Erfahrung", "Wohnanlagen, Gewerbeanlagen und kommunale Objekte in Landshut und Umgebung — persönlich betreut von einem eingespielten Team."),
|
||||
]
|
||||
tl = "".join(f'''
|
||||
<div class="tl-item" data-reveal><span class="tl-item__year">{y}</span><div><h3>{h}</h3><p>{p}</p></div></div>''' for y, h, p in TIMELINE)
|
||||
|
||||
TEAM = [("TK", "Thomas Kirschner", "Geschäftsführung"), ("MP", "Marcel Pilsner", "Stellvertretende Geschäftsführung"),
|
||||
("CK", "Christine Kirschner", "Assistenz Büro"), ("EM", "Elena Miller", "Qualitätsmanagement"),
|
||||
("HL", "Harald Listl", "Hausmeister, technische Betreuung, Schreiner")]
|
||||
team = "".join(f'''
|
||||
<div class="member" data-reveal>
|
||||
<div class="member__photo">{chev_mark("")}<span class="member__initials" aria-hidden="true">{ini}</span><small>Foto folgt</small></div>
|
||||
<div><b>{n}</b><span>{r}</span></div>
|
||||
</div>''' for ini, n, r in TEAM) + '''
|
||||
<div class="member member--more" data-reveal>
|
||||
<div class="member__photo"><span class="member__initials" aria-hidden="true">+</span></div>
|
||||
<div><b>und viele mehr</b><span>geschätzte Kolleginnen und Kollegen</span></div>
|
||||
</div>'''
|
||||
|
||||
MAP_SVG = '''<svg viewBox="0 0 800 480" preserveAspectRatio="xMidYMid slice" aria-hidden="true">
|
||||
<defs><pattern id="g" width="40" height="40" patternUnits="userSpaceOnUse"><path d="M40 0H0v40" fill="none" stroke="rgba(169,183,204,.07)"/></pattern></defs>
|
||||
<rect width="800" height="480" fill="url(#g)"/>
|
||||
<path d="M-20 360 C 140 330, 240 400, 380 370 S 640 300, 820 330" fill="none" stroke="rgba(91,138,214,.35)" stroke-width="18" stroke-linecap="round"/>
|
||||
<g fill="none" stroke="rgba(169,183,204,.28)" stroke-width="3" stroke-linecap="round">
|
||||
<path d="M0 120 L800 170"/><path d="M120 0 L260 480"/><path d="M430 0 C 440 160, 470 260, 520 480"/><path d="M0 250 C 200 230, 520 250, 800 210"/><path d="M620 0 L700 480"/>
|
||||
</g>
|
||||
<g fill="none" stroke="rgba(169,183,204,.14)" stroke-width="1.5"><path d="M0 60 L800 90"/><path d="M300 0 L340 480"/><path d="M0 420 L800 440"/><path d="M540 0 L580 480"/></g>
|
||||
</svg>'''
|
||||
|
||||
UNTERNEHMEN = page_hero("Unternehmen", "Das Original seit 2003.",
|
||||
"Hinter Kirschner Gebäudeservice stehen Qualität, Erfahrung, Kompetenz — und echte Freude an der Dienstleistung.") + f'''
|
||||
<section class="section theme-deep philosophy" aria-labelledby="philo-title">
|
||||
<div class="wrap">
|
||||
<p class="eyebrow" data-reveal id="philo-title">Unsere Philosophie</p>
|
||||
<p class="philosophy__words mt-4" data-scrub-words>Persönlich<span class="dot">.</span> Zuverlässig<span class="dot">.</span> Erstklassig<span class="dot">.</span></p>
|
||||
<div class="philosophy__sub">
|
||||
<div data-reveal><b>Seit 2003</b><p>Aus einer Idee wurde eine Erfolgsgeschichte — unsere Kunden belohnen hochwertigen Service mit Treue.</p></div>
|
||||
<div data-reveal><b>Aus der Region</b><p>Sitz in Ergolding, Einsatz in Landshut und Umgebung. Kurze Wege, schnelle Reaktion.</p></div>
|
||||
<div data-reveal><b>Engagiert</b><p>Wir unterstützen Vereine und Projekte vor Ort und weltweit — vom Jugendfußball bis zum Schulessen in Nepal.</p></div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section theme-light" aria-labelledby="tl-title">
|
||||
<div class="wrap">
|
||||
<div class="section-head">
|
||||
<p class="eyebrow" data-reveal>Geschichte</p>
|
||||
<h2 class="display" id="tl-title" data-split>Seit 2003 gewachsen.</h2>
|
||||
</div>
|
||||
<div class="timeline">
|
||||
<span class="timeline__line" aria-hidden="true"><i></i></span>{tl}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section theme-white" aria-labelledby="team-title">
|
||||
<div class="wrap">
|
||||
<div class="section-head">
|
||||
<p class="eyebrow" data-reveal>Unser Team</p>
|
||||
<h2 class="display" id="team-title" data-split>Gesichter statt Hotline.</h2>
|
||||
<p class="lead" data-reveal>Sie sprechen mit Menschen, die Ihr Objekt kennen.</p>
|
||||
</div>
|
||||
<div class="team">{team}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section" aria-labelledby="map-title" id="anfahrt">
|
||||
<div class="wrap map-card">
|
||||
<div class="stack">
|
||||
<p class="eyebrow" data-reveal>Anfahrt</p>
|
||||
<h2 class="display" id="map-title" data-split>Hier finden Sie uns.</h2>
|
||||
<p class="lead" data-reveal>Kirschner Gebäudeservice<br>Etzstraße 45 · 84030 Ergolding</p>
|
||||
<div class="btn-row" data-reveal>
|
||||
<a class="btn" href="{MAPS}" target="_blank" rel="noopener">Route planen {I_ARROW}</a>
|
||||
<a class="btn btn--ghost" href="{TEL_HREF}">{TEL}</a>
|
||||
</div>
|
||||
</div>
|
||||
<a class="map reveal-img" href="{MAPS}" target="_blank" rel="noopener" aria-label="Standort in Google Maps öffnen (externe Seite)">
|
||||
{MAP_SVG}
|
||||
<span class="map__pin"><span>Kirschner Gebäudeservice</span><i></i></span>
|
||||
</a>
|
||||
</div>
|
||||
</section>
|
||||
''' + cta_final("Lernen wir uns kennen.", "Wir freuen uns auf Ihre Anfrage, Ihren Auftrag — und natürlich über Ihr Feedback.", "theme-deep")
|
||||
|
||||
page("unternehmen.html",
|
||||
"Unternehmen & Team — Kirschner Gebäudeservice Ergolding",
|
||||
"Kirschner Gebäudeservice in Ergolding — das Original seit 2003. Philosophie, Geschichte, Team und Anfahrt.",
|
||||
UNTERNEHMEN)
|
||||
|
||||
# ======================================================================
|
||||
# Karriere
|
||||
# ======================================================================
|
||||
JOBS = [
|
||||
("Handwerker / Hausmeister", ["Teilzeit", "Vollzeit", "auch Ga-La-Bauer, Glas- & Solarreiniger"],
|
||||
["Erfahrung im jeweiligen Bereich", "Blick für Sauberkeit und Qualität", "Freundlichkeit, Teamfähigkeit & Motivation", "Ambition, Verantwortung zu übernehmen"],
|
||||
["Sicherer Arbeitsplatz — krisenfest und zukunftssicher", "Weit übertarifliche Bezahlung und klare Aufstiegspläne", "Hochwertige Arbeitskleidung", "Boni: Spritgeld, Urlaubs- & Weihnachtsgeld, Erfolgsbonus", "Starkes Team, das sich gegenseitig unterstützt"],
|
||||
["Du sorgst dafür, dass sich unsere Kunden zuhause wohlfühlen — Sauberkeit in Deinen festen Objekten hat für Dich Priorität. Gemeinsam mit Kollegen pflegst Du Gärten und Grünflächen, reinigst Tiefgaragen mit modernen Maschinen und erlebst den Vorher-Nachher-Effekt.",
|
||||
"Im Winter sorgst Du mit unseren Fahrzeugen bei Schnee und Eis für Sicherheit. Mit handwerklichem Geschick zeigen wir Dir, wie Du mit Reparaturen unsere Kunden begeisterst. Viel Zeit an der frischen Luft, gut strukturierte Arbeit mit unserer eigenen App — und keine permanenten Überstunden, keine Arbeit am Freitagnachmittag oder Samstag."],
|
||||
"Bewerbung: Handwerker / Hausmeister (TZ/VZ)"),
|
||||
("Reinigungskraft", ["Minijob", "m/w/d"],
|
||||
["Pünktlichkeit, Ehrlichkeit, Fleiß und Zuverlässigkeit", "Sauberes, gepflegtes Erscheinungsbild und gute Umgangsformen", "Blick für Sauberkeit", "Gutes Deutsch", "Du lebst den Teamgedanken", "Idealerweise Erfahrung im Reinigungsbereich"],
|
||||
["Tarifliche Vergütung sowie Gutscheine (z. B. Tanken)", "Flexible Zeiteinteilung, die zu Deinem Leben passt", "30 Arbeitstage bezahlter Urlaub", "Lohnfortzahlung im Krankheitsfall", "Deine „eigenen“ festen Objekte — kein Springer", "Sehr kollegiales Betriebsklima", "Arbeitszeit einfach per App am Handy erfassen"],
|
||||
["Wir sind ein familiäres und jung gebliebenes Unternehmen und suchen Dich, wenn Du Dich in diesen Punkten wiederfindest."],
|
||||
"Bewerbung: Reinigungskraft (Minijob)"),
|
||||
("Hausmeister", ["Minijob", "m/w/d"],
|
||||
["Pünktlichkeit, Ehrlichkeit, Fleiß und Zuverlässigkeit", "Sauberes, gepflegtes Erscheinungsbild und gute Umgangsformen", "Blick für Sauberkeit", "Gutes Deutsch", "Du arbeitest gern im Team", "Idealerweise Erfahrung im Garten oder handwerklich"],
|
||||
["Übertarifliche Vergütung", "Prämien wie Gutscheine (z. B. Tanken)", "Flexible Zeiteinteilung", "30 Arbeitstage bezahlter Urlaub", "Lohnfortzahlung im Krankheitsfall", "Abwechslungsreich — indoor und outdoor", "Moderne Maschinen und Fuhrpark", "Arbeitszeit einfach per App erfassen"],
|
||||
["Wir sind ein familiäres und jung gebliebenes Unternehmen und suchen Dich, wenn Du Dich in diesen Punkten wiederfindest."],
|
||||
"Bewerbung: Hausmeister (Minijob)"),
|
||||
]
|
||||
APPLY_BODY = "Hallo Herr Kirschner,\n\nich interessiere mich für die Stelle und möchte mich kurz vorstellen:\n\nName:\nTelefon:\nErfahrung:\nFrühester Start:\n\nViele Grüße\n"
|
||||
jobs = "".join(f'''
|
||||
<details class="job" data-reveal{" open" if i == 0 else ""}>
|
||||
<summary>
|
||||
<div><h3>{t}</h3><div class="job__meta">{"".join(f"<span>{m}</span>" for m in meta)}</div></div>
|
||||
<span class="job__toggle" aria-hidden="true">{I_PLUS}</span>
|
||||
</summary>
|
||||
<div class="job__body">
|
||||
<div class="job__text">{"".join(f"<p>{p}</p>" for p in text)}</div>
|
||||
<div><h4>Das bringst Du mit</h4><ul role="list">{"".join(f"<li>{x}</li>" for x in need)}</ul></div>
|
||||
<div><h4>Das bekommst Du</h4><ul role="list">{"".join(f"<li>{x}</li>" for x in give)}</ul></div>
|
||||
<div class="job__apply btn-row"><a class="btn" href="{mailto(subj, APPLY_BODY)}">Jetzt bewerben {I_ARROW}</a><a class="btn btn--ghost" href="{TEL_HREF}">Lieber anrufen</a></div>
|
||||
</div>
|
||||
</details>''' for i, (t, meta, need, give, text, subj) in enumerate(JOBS))
|
||||
|
||||
BENEFITS = [("Übertarifliche Bezahlung", "Dein Einsatz wird fair belohnt — mit klaren Aufstiegsplänen."),
|
||||
("Keine Freitagnachmittage", "Keine permanenten Überstunden, kein Samstag — Zeit für Familie und Freunde."),
|
||||
("Feste Objekte", "Du betreust Deine eigenen Objekte, statt ständig einzuspringen."),
|
||||
("Boni & Gutscheine", "Spritgeld, Urlaubs- und Weihnachtsgeld, Erfolgsbonus."),
|
||||
("Moderne Ausstattung", "Hochwertige Arbeitskleidung, moderne Maschinen, eigener Fuhrpark."),
|
||||
("Alles per App", "Gut strukturierte Arbeit und Zeiterfassung einfach am Handy.")]
|
||||
|
||||
KARRIERE = page_hero("Karriere", "Bock auf einen vielseitigen Job?",
|
||||
"Viel Zeit an der frischen Luft statt in der Industriehalle, überaus faire Bezahlung und ein Team, das zusammenhält. Bewirb Dich — wir freuen uns auf ein Gespräch bei einem Espresso.",
|
||||
f'<div class="btn-row" data-hero><a class="btn" href="#stellen">Offene Stellen {I_ARROW}</a></div>') + f'''
|
||||
<section class="section" aria-labelledby="why-title">
|
||||
<div class="wrap">
|
||||
<div class="section-head">
|
||||
<p class="eyebrow" data-reveal>Was uns ausmacht</p>
|
||||
<h2 class="display" id="why-title" data-split>Arbeit, die man gern macht.</h2>
|
||||
</div>
|
||||
<ul class="benefits" role="list">{"".join(f'<li data-reveal><b>{b}</b><span>{s}</span></li>' for b, s in BENEFITS)}</ul>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section theme-light" aria-labelledby="stellen-title" id="stellen">
|
||||
<div class="wrap">
|
||||
<div class="section-head">
|
||||
<p class="eyebrow" data-reveal>Offene Stellen</p>
|
||||
<h2 class="display" id="stellen-title" data-split>Wir stellen ein.</h2>
|
||||
<p class="lead" data-reveal>Bewirb Dich ganz einfach per E-Mail oder Telefon — ein Lebenslauf ist schön, aber kein Muss.</p>
|
||||
</div>
|
||||
<div class="jobs">{jobs}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
''' + cta_final("Interesse? Melde Dich!", "Ruf uns an oder schreib uns eine kurze E-Mail. Wir melden uns schnell bei Dir.")
|
||||
|
||||
page("karriere.html",
|
||||
"Karriere — Hausmeister, Handwerker & Reinigungskräfte gesucht | Kirschner Gebäudeservice",
|
||||
"Wir stellen ein: Hausmeister, Handwerker, Ga-La-Bauer, Glas- & Solarreiniger und Reinigungskräfte in Landshut und Ergolding. Übertarifliche Bezahlung, starkes Team.",
|
||||
KARRIERE)
|
||||
|
||||
# ======================================================================
|
||||
# Kontakt
|
||||
# ======================================================================
|
||||
KONTAKT = page_hero("Kontakt", "Wir sind für Sie da.",
|
||||
"Schreiben Sie uns oder rufen Sie an — wir freuen uns auf Ihre Anfragen, Aufträge und natürlich über Ihr Feedback.") + f'''
|
||||
<section class="section" style="padding-top:0" aria-label="Kontaktwege">
|
||||
<div class="wrap">
|
||||
<div class="contact-grid">
|
||||
<a class="contact-card" href="{TEL_HREF}" data-reveal><small>Büro</small><strong>{TEL}</strong><p>Für Anfragen, Angebote und Rückfragen.</p><span class="contact-card__go">Anrufen {I_ARROW_S}</span></a>
|
||||
<a class="contact-card contact-card--sos" href="{SOS_HREF}" data-reveal><small>Notruf 24/7</small><strong>{SOS}</strong><p>Wenn es dringend ist — auch nachts und am Wochenende.</p><span class="contact-card__go">Notruf wählen {I_ARROW_S}</span></a>
|
||||
<a class="contact-card" href="{ANFRAGE}" data-reveal><small>E-Mail</small><strong>{MAIL}</strong><p>Wir haben die wichtigsten Angaben schon vorbereitet — einfach ausfüllen und absenden.</p><span class="contact-card__go">E-Mail schreiben {I_ARROW_S}</span></a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section theme-deep" aria-labelledby="map-title">
|
||||
<div class="wrap map-card">
|
||||
<div class="stack">
|
||||
<p class="eyebrow" data-reveal>Adresse</p>
|
||||
<h2 class="display" id="map-title" data-split>Mitten in Ergolding.</h2>
|
||||
<p class="lead" data-reveal>Kirschner Gebäudeservice<br>Etzstraße 45 · 84030 Ergolding<br>Landshut-Ergolding</p>
|
||||
<div class="btn-row" data-reveal><a class="btn" href="{MAPS}" target="_blank" rel="noopener">Route planen {I_ARROW}</a></div>
|
||||
</div>
|
||||
<a class="map reveal-img" href="{MAPS}" target="_blank" rel="noopener" aria-label="Standort in Google Maps öffnen (externe Seite)">
|
||||
{MAP_SVG}
|
||||
<span class="map__pin"><span>Kirschner Gebäudeservice</span><i></i></span>
|
||||
</a>
|
||||
</div>
|
||||
</section>
|
||||
'''
|
||||
page("kontakt.html",
|
||||
"Kontakt — Kirschner Gebäudeservice Ergolding",
|
||||
"Kirschner Gebäudeservice, Etzstraße 45, 84030 Ergolding. Telefon 0871 / 14 26 91 01, Notruf 0160 / 836 57 53, info@kirschner-service.de.",
|
||||
KONTAKT)
|
||||
|
||||
# ======================================================================
|
||||
# Impressum & Datenschutz
|
||||
# ======================================================================
|
||||
CREDITS = [("Titelbild (Wohngebäude)", "Tobias Wilden"), ("Treppenhaus", "Payam Moin Afshari"), ("Fensterreinigung", "Joshua Bowers"),
|
||||
("PV-Reinigung", "Florida Solar Fix"), ("Heckenschnitt", "Mustafa Turhan"), ("Haustechnik", "Peter Herrmann"),
|
||||
("Reparatur", "Theme Photos"), ("Winterdienst", "Bradley Andrews"), ("Glasfassade", "Priscilla Du Preez")]
|
||||
|
||||
IMPRESSUM = page_hero("Rechtliches", "Impressum", "Angaben gemäß § 5 Digitale-Dienste-Gesetz (DDG).") + f'''
|
||||
<section class="section theme-light" style="padding-top: var(--s6)">
|
||||
<div class="wrap legal">
|
||||
<h2>Anbieter</h2>
|
||||
<address>Kirschner Gebäudeservice<br>Inhaber: Thomas Kirschner<br>Etzstraße 45<br>84030 Ergolding</address>
|
||||
<span class="todo">Offen: Rechtsform bestätigen (Einzelunternehmen?). Falls GmbH o. Ä.: Firmierung, Registergericht, Registernummer und Vertretungsberechtigte ergänzen.</span>
|
||||
|
||||
<h2>Kontakt</h2>
|
||||
<p>Telefon: <a href="{TEL_HREF}">{TEL}</a><br>Mobil: <a href="{SOS_HREF}">{SOS}</a><br>E-Mail: <a href="mailto:{MAIL}">{MAIL}</a></p>
|
||||
|
||||
<h2>Steuern</h2>
|
||||
<p>Steuernummer: 132/236/30809</p>
|
||||
|
||||
<h2>Verantwortlich für den Inhalt nach § 18 Abs. 2 MStV</h2>
|
||||
<p>Thomas Kirschner, Anschrift wie oben.</p>
|
||||
|
||||
<h2>Verbraucherstreitbeilegung</h2>
|
||||
<p>Wir sind nicht bereit und nicht verpflichtet, an Streitbeilegungsverfahren vor einer Verbraucherschlichtungsstelle teilzunehmen.</p>
|
||||
|
||||
<h2>Haftung für Inhalte und Links</h2>
|
||||
<p>Die Inhalte dieser Seiten wurden mit größter Sorgfalt erstellt. Für die Richtigkeit, Vollständigkeit und Aktualität können wir jedoch keine Gewähr übernehmen. Als Diensteanbieter sind wir für eigene Inhalte nach den allgemeinen Gesetzen verantwortlich. Für Inhalte externer Links sind ausschließlich deren Betreiber verantwortlich; rechtswidrige Inhalte waren zum Zeitpunkt der Verlinkung nicht erkennbar. Bei Bekanntwerden von Rechtsverletzungen entfernen wir entsprechende Inhalte oder Links umgehend.</p>
|
||||
|
||||
<h2>Urheberrecht</h2>
|
||||
<p>Die durch uns erstellten Inhalte und Werke auf diesen Seiten unterliegen dem deutschen Urheberrecht. Vervielfältigung, Bearbeitung und Verbreitung außerhalb der Grenzen des Urheberrechts bedürfen unserer schriftlichen Zustimmung.</p>
|
||||
|
||||
<h2>Bildnachweise</h2>
|
||||
<p>Fotos von Unsplash (Unsplash-Lizenz):</p>
|
||||
<ul>{"".join(f"<li>{a}: {b}</li>" for a, b in CREDITS)}</ul>
|
||||
<p>Schrift: Archivo (SIL Open Font License), lokal eingebunden.</p>
|
||||
</div>
|
||||
</section>'''
|
||||
page("impressum.html", "Impressum — Kirschner Gebäudeservice", "Impressum von Kirschner Gebäudeservice, Etzstraße 45, 84030 Ergolding.", IMPRESSUM)
|
||||
|
||||
DATENSCHUTZ = page_hero("Rechtliches", "Datenschutz", "Kurz gesagt: Diese Website setzt keine Cookies, verwendet kein Tracking und lädt nichts von fremden Servern.") + f'''
|
||||
<section class="section theme-light" style="padding-top: var(--s6)">
|
||||
<div class="wrap legal">
|
||||
<h2>1. Verantwortlicher</h2>
|
||||
<address>Kirschner Gebäudeservice, Thomas Kirschner<br>Etzstraße 45, 84030 Ergolding<br>Telefon: {TEL}<br>E-Mail: <a href="mailto:{MAIL}">{MAIL}</a></address>
|
||||
|
||||
<h2>2. Hosting und Server-Logfiles</h2>
|
||||
<p>Beim Aufruf dieser Website verarbeitet unser Hosting-Anbieter technisch notwendige Daten (IP-Adresse, Datum und Uhrzeit, aufgerufene Seite, Referrer, Browser und Betriebssystem), um die Seite auszuliefern und die Sicherheit des Betriebs zu gewährleisten. Rechtsgrundlage ist Art. 6 Abs. 1 lit. f DSGVO; unser berechtigtes Interesse liegt im sicheren und stabilen Betrieb der Website.</p>
|
||||
<span class="todo">Offen: Name und Anschrift des Hosting-Anbieters, Abschluss eines Auftragsverarbeitungsvertrags (Art. 28 DSGVO) und Speicherdauer der Logfiles eintragen.</span>
|
||||
|
||||
<h2>3. Keine Cookies, kein Tracking, keine Fremdinhalte</h2>
|
||||
<p>Diese Website setzt keine Cookies und verwendet keine Analyse- oder Marketingwerkzeuge. Schriften und Skripte liegen auf unserem eigenen Server; es werden keine Inhalte von Drittanbietern nachgeladen. Lediglich im Browser-Sitzungsspeicher (sessionStorage) wird vermerkt, dass die Eröffnungsanimation bereits gezeigt wurde — dieser Eintrag enthält keine personenbezogenen Daten und wird beim Schließen des Browsers gelöscht.</p>
|
||||
|
||||
<h2>4. Externe Links</h2>
|
||||
<p>Der Link „Route planen" führt zu Google Maps (Google Ireland Limited). Erst wenn Sie ihn anklicken, werden Daten an Google übertragen; dafür gilt die Datenschutzerklärung von Google.</p>
|
||||
|
||||
<h2>5. Kontakt per E-Mail oder Telefon</h2>
|
||||
<p>Wenn Sie uns per E-Mail oder Telefon kontaktieren, verarbeiten wir Ihre Angaben zur Bearbeitung der Anfrage und für Anschlussfragen. Rechtsgrundlage ist Art. 6 Abs. 1 lit. b DSGVO, soweit Ihre Anfrage mit einem Vertrag zusammenhängt, ansonsten Art. 6 Abs. 1 lit. f DSGVO. Wir löschen die Daten, sobald sie nicht mehr erforderlich sind und keine gesetzlichen Aufbewahrungspflichten bestehen.</p>
|
||||
|
||||
<h2>6. Bewerbungen</h2>
|
||||
<p>Bewerbungen, die Sie uns per E-Mail senden, verarbeiten wir zur Durchführung des Bewerbungsverfahrens (§ 26 BDSG, Art. 6 Abs. 1 lit. b DSGVO). Kommt kein Arbeitsverhältnis zustande, löschen wir Ihre Unterlagen spätestens sechs Monate nach Abschluss des Verfahrens.</p>
|
||||
|
||||
<h2>7. Ihre Rechte</h2>
|
||||
<p>Sie haben das Recht auf Auskunft, Berichtigung, Löschung, Einschränkung der Verarbeitung, Datenübertragbarkeit sowie Widerspruch gegen Verarbeitungen auf Grundlage von Art. 6 Abs. 1 lit. f DSGVO. Wenden Sie sich dazu einfach an die oben genannten Kontaktdaten.</p>
|
||||
<p>Sie können sich außerdem bei einer Datenschutz-Aufsichtsbehörde beschweren, für uns zuständig ist das Bayerische Landesamt für Datenschutzaufsicht (BayLDA), Promenade 18, 91522 Ansbach.</p>
|
||||
|
||||
<p class="mt-4"><em>Stand: September 2026. Entwurf — vor Veröffentlichung juristisch prüfen lassen.</em></p>
|
||||
</div>
|
||||
</section>'''
|
||||
page("datenschutz.html", "Datenschutz — Kirschner Gebäudeservice", "Datenschutzerklärung von Kirschner Gebäudeservice: keine Cookies, kein Tracking, keine Fremdinhalte.", DATENSCHUTZ)
|
||||
@@ -0,0 +1,215 @@
|
||||
<!doctype html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>Unternehmen & Team — Kirschner Gebäudeservice Ergolding</title>
|
||||
<meta name="description" content="Kirschner Gebäudeservice in Ergolding — das Original seit 2003. Philosophie, Geschichte, Team und Anfahrt.">
|
||||
<link rel="canonical" href="https://www.kirschner-service.de/unternehmen.html">
|
||||
<meta name="theme-color" content="#0A1424">
|
||||
<meta property="og:type" content="website">
|
||||
<meta property="og:locale" content="de_DE">
|
||||
<meta property="og:site_name" content="Kirschner Gebäudeservice">
|
||||
<meta property="og:title" content="Unternehmen & Team — Kirschner Gebäudeservice Ergolding">
|
||||
<meta property="og:description" content="Kirschner Gebäudeservice in Ergolding — das Original seit 2003. Philosophie, Geschichte, Team und Anfahrt.">
|
||||
<meta property="og:url" content="https://www.kirschner-service.de/unternehmen.html">
|
||||
<meta property="og:image" content="https://www.kirschner-service.de/assets/img/og.jpg">
|
||||
<link rel="icon" href="assets/favicon.svg" type="image/svg+xml">
|
||||
<link rel="apple-touch-icon" href="assets/apple-touch-icon.png">
|
||||
<link rel="preload" href="assets/fonts/archivo-latin-wdth-normal.woff2" as="font" type="font/woff2" crossorigin>
|
||||
<link rel="stylesheet" href="assets/site.css">
|
||||
<script>(function(r){r.classList.add('js');try{if(r.hasAttribute('data-intro')&&!sessionStorage.getItem('kk-intro')&&matchMedia('(prefers-reduced-motion: no-preference)').matches)r.classList.add('has-intro')}catch(e){}setTimeout(function(){if(!r.classList.contains('motion-ready'))r.classList.remove('js','has-intro')},3000)})(document.documentElement)</script>
|
||||
<script src="assets/vendor/gsap.min.js" defer></script>
|
||||
<script src="assets/vendor/ScrollTrigger.min.js" defer></script>
|
||||
<script src="assets/vendor/SplitText.min.js" defer></script>
|
||||
<script src="assets/vendor/lenis.min.js" defer></script>
|
||||
<script src="assets/motion.js" defer></script>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<a class="skip-link" href="#inhalt">Zum Inhalt springen</a>
|
||||
<header class="site-header">
|
||||
<div class="wrap site-header__inner">
|
||||
<a class="brand" href="index.html" aria-label="Kirschner Gebäudeservice — Startseite">
|
||||
<svg class="chev-mark" viewBox="0 0 44 32" aria-hidden="true"><polygon class="chev" opacity=".55" points="14,0 24,0 10,16 24,32 14,32 0,16"/><polygon class="chev" points="32,0 42,0 28,16 42,32 32,32 18,16"/></svg>
|
||||
<span class="brand__name"><b>KIRSCHNER</b><span>Gebäudeservice</span></span>
|
||||
</a>
|
||||
<nav class="nav" aria-label="Hauptnavigation"><a class="nav__link" href="leistungen.html">Leistungen</a><a class="nav__link" href="unternehmen.html" aria-current="page">Unternehmen</a><a class="nav__link" href="karriere.html">Karriere</a><a class="nav__link" href="kontakt.html">Kontakt</a></nav>
|
||||
<div class="header-cta">
|
||||
<a class="header-phone" href="tel:+4987114269101"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linejoin="round" aria-hidden="true"><path d="M5 4h4l2 5-2.5 1.5a11 11 0 0 0 5 5L15 13l5 2v4a2 2 0 0 1-2 2A16 16 0 0 1 3 6a2 2 0 0 1 2-2"/></svg><span>0871 / 14 26 91 01</span></a>
|
||||
<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>
|
||||
<button class="menu-toggle" type="button" aria-expanded="false" aria-controls="mobile-nav" aria-label="Menü öffnen"><span class="menu-toggle__bars"></span></button>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
<div class="mobile-nav" id="mobile-nav">
|
||||
<nav aria-label="Mobile Navigation"><ul role="list"><li><a class="mobile-nav__link" href="index.html">Start</a></li><li><a class="mobile-nav__link" href="leistungen.html">Leistungen</a></li><li><a class="mobile-nav__link" href="unternehmen.html" aria-current="page">Unternehmen</a></li><li><a class="mobile-nav__link" href="karriere.html">Karriere</a></li><li><a class="mobile-nav__link" href="kontakt.html">Kontakt</a></li></ul></nav>
|
||||
<div class="mobile-nav__meta">
|
||||
<a href="tel:+4987114269101">Büro 0871 / 14 26 91 01</a>
|
||||
<a href="tel:+491608365753">Notruf 24/7 0160 / 836 57 53</a>
|
||||
<a href="mailto:info@kirschner-service.de">info@kirschner-service.de</a>
|
||||
</div>
|
||||
</div>
|
||||
<main id="inhalt">
|
||||
|
||||
<section class="page-hero">
|
||||
<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">
|
||||
<div class="stack">
|
||||
<p class="eyebrow" data-hero>Unternehmen</p>
|
||||
<h1 class="display" data-split>Das Original seit 2003.</h1>
|
||||
</div>
|
||||
<div class="stack">
|
||||
<p class="lead" data-hero>Hinter Kirschner Gebäudeservice stehen Qualität, Erfahrung, Kompetenz — und echte Freude an der Dienstleistung.</p>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section class="section theme-deep philosophy" aria-labelledby="philo-title">
|
||||
<div class="wrap">
|
||||
<p class="eyebrow" data-reveal id="philo-title">Unsere Philosophie</p>
|
||||
<p class="philosophy__words mt-4" data-scrub-words>Persönlich<span class="dot">.</span> Zuverlässig<span class="dot">.</span> Erstklassig<span class="dot">.</span></p>
|
||||
<div class="philosophy__sub">
|
||||
<div data-reveal><b>Seit 2003</b><p>Aus einer Idee wurde eine Erfolgsgeschichte — unsere Kunden belohnen hochwertigen Service mit Treue.</p></div>
|
||||
<div data-reveal><b>Aus der Region</b><p>Sitz in Ergolding, Einsatz in Landshut und Umgebung. Kurze Wege, schnelle Reaktion.</p></div>
|
||||
<div data-reveal><b>Engagiert</b><p>Wir unterstützen Vereine und Projekte vor Ort und weltweit — vom Jugendfußball bis zum Schulessen in Nepal.</p></div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section theme-light" aria-labelledby="tl-title">
|
||||
<div class="wrap">
|
||||
<div class="section-head">
|
||||
<p class="eyebrow" data-reveal>Geschichte</p>
|
||||
<h2 class="display" id="tl-title" data-split>Seit 2003 gewachsen.</h2>
|
||||
</div>
|
||||
<div class="timeline">
|
||||
<span class="timeline__line" aria-hidden="true"><i></i></span>
|
||||
<div class="tl-item" data-reveal><span class="tl-item__year">2003</span><div><h3>Gründung in Ergolding</h3><p>Kirschner Gebäudeservice startet — mit umfangreichen Dienstleistungen rund um Immobilien. Das Original seit 2003.</p></div></div>
|
||||
<div class="tl-item" data-reveal><span class="tl-item__year">2013</span><div><h3>10 Jahre</h3><p>Zehn Jahre Kirschner Gebäudeservice. Wir bedanken uns bei unseren Kunden für die gute und erfolgreiche Zusammenarbeit.</p></div></div>
|
||||
<div class="tl-item" data-reveal><span class="tl-item__year">2015</span><div><h3>Servicetechnik & Schreinerei</h3><p>Herr Listl verstärkt Servicetechnik und Hausmeisterei — mit langjähriger Erfahrung als Schreiner.</p></div></div>
|
||||
<div class="tl-item" data-reveal><span class="tl-item__year">2018</span><div><h3>15 Jahre — und 120 Schulessen-Jahre</h3><p>Wir feiern das Jubiläum mit unseren Geschäftspartnern. Durch die Spenden des Abends werden über 120 Kinder in Nepal ein Jahr lang mit Schulessen versorgt.</p></div></div>
|
||||
<div class="tl-item" data-reveal><span class="tl-item__year">2019</span><div><h3>Das Team wächst</h3><p>Herr Gerhart ergänzt das Team mit handwerklicher Ausbildung, Herr Ponath mit langjähriger Erfahrung in der Gebäudedienstleistung.</p></div></div>
|
||||
<div class="tl-item" data-reveal><span class="tl-item__year">2020</span><div><h3>Für den Nachwuchs</h3><p>Ein neuer Trikotsatz für die U8 des FC Ergolding 1932 e.V.</p></div></div>
|
||||
<div class="tl-item" data-reveal><span class="tl-item__year">Heute</span><div><h3><span data-years>23</span> Jahre Erfahrung</h3><p>Wohnanlagen, Gewerbeanlagen und kommunale Objekte in Landshut und Umgebung — persönlich betreut von einem eingespielten Team.</p></div></div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section theme-white" aria-labelledby="team-title">
|
||||
<div class="wrap">
|
||||
<div class="section-head">
|
||||
<p class="eyebrow" data-reveal>Unser Team</p>
|
||||
<h2 class="display" id="team-title" data-split>Gesichter statt Hotline.</h2>
|
||||
<p class="lead" data-reveal>Sie sprechen mit Menschen, die Ihr Objekt kennen.</p>
|
||||
</div>
|
||||
<div class="team">
|
||||
<div class="member" data-reveal>
|
||||
<div class="member__photo"><svg class="" viewBox="0 0 44 32" aria-hidden="true"><polygon class="chev" opacity=".55" points="14,0 24,0 10,16 24,32 14,32 0,16"/><polygon class="chev" points="32,0 42,0 28,16 42,32 32,32 18,16"/></svg><span class="member__initials" aria-hidden="true">TK</span><small>Foto folgt</small></div>
|
||||
<div><b>Thomas Kirschner</b><span>Geschäftsführung</span></div>
|
||||
</div>
|
||||
<div class="member" data-reveal>
|
||||
<div class="member__photo"><svg class="" viewBox="0 0 44 32" aria-hidden="true"><polygon class="chev" opacity=".55" points="14,0 24,0 10,16 24,32 14,32 0,16"/><polygon class="chev" points="32,0 42,0 28,16 42,32 32,32 18,16"/></svg><span class="member__initials" aria-hidden="true">MP</span><small>Foto folgt</small></div>
|
||||
<div><b>Marcel Pilsner</b><span>Stellvertretende Geschäftsführung</span></div>
|
||||
</div>
|
||||
<div class="member" data-reveal>
|
||||
<div class="member__photo"><svg class="" viewBox="0 0 44 32" aria-hidden="true"><polygon class="chev" opacity=".55" points="14,0 24,0 10,16 24,32 14,32 0,16"/><polygon class="chev" points="32,0 42,0 28,16 42,32 32,32 18,16"/></svg><span class="member__initials" aria-hidden="true">CK</span><small>Foto folgt</small></div>
|
||||
<div><b>Christine Kirschner</b><span>Assistenz Büro</span></div>
|
||||
</div>
|
||||
<div class="member" data-reveal>
|
||||
<div class="member__photo"><svg class="" viewBox="0 0 44 32" aria-hidden="true"><polygon class="chev" opacity=".55" points="14,0 24,0 10,16 24,32 14,32 0,16"/><polygon class="chev" points="32,0 42,0 28,16 42,32 32,32 18,16"/></svg><span class="member__initials" aria-hidden="true">EM</span><small>Foto folgt</small></div>
|
||||
<div><b>Elena Miller</b><span>Qualitätsmanagement</span></div>
|
||||
</div>
|
||||
<div class="member" data-reveal>
|
||||
<div class="member__photo"><svg class="" viewBox="0 0 44 32" aria-hidden="true"><polygon class="chev" opacity=".55" points="14,0 24,0 10,16 24,32 14,32 0,16"/><polygon class="chev" points="32,0 42,0 28,16 42,32 32,32 18,16"/></svg><span class="member__initials" aria-hidden="true">HL</span><small>Foto folgt</small></div>
|
||||
<div><b>Harald Listl</b><span>Hausmeister, technische Betreuung, Schreiner</span></div>
|
||||
</div>
|
||||
<div class="member member--more" data-reveal>
|
||||
<div class="member__photo"><span class="member__initials" aria-hidden="true">+</span></div>
|
||||
<div><b>und viele mehr</b><span>geschätzte Kolleginnen und Kollegen</span></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section" aria-labelledby="map-title" id="anfahrt">
|
||||
<div class="wrap map-card">
|
||||
<div class="stack">
|
||||
<p class="eyebrow" data-reveal>Anfahrt</p>
|
||||
<h2 class="display" id="map-title" data-split>Hier finden Sie uns.</h2>
|
||||
<p class="lead" data-reveal>Kirschner Gebäudeservice<br>Etzstraße 45 · 84030 Ergolding</p>
|
||||
<div class="btn-row" data-reveal>
|
||||
<a class="btn" href="https://www.google.com/maps/search/?api=1&query=Etzstra%C3%9Fe+45%2C+84030+Ergolding" target="_blank" rel="noopener">Route planen <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>
|
||||
<a class="btn btn--ghost" href="tel:+4987114269101">0871 / 14 26 91 01</a>
|
||||
</div>
|
||||
</div>
|
||||
<a class="map reveal-img" href="https://www.google.com/maps/search/?api=1&query=Etzstra%C3%9Fe+45%2C+84030+Ergolding" target="_blank" rel="noopener" aria-label="Standort in Google Maps öffnen (externe Seite)">
|
||||
<svg viewBox="0 0 800 480" preserveAspectRatio="xMidYMid slice" aria-hidden="true">
|
||||
<defs><pattern id="g" width="40" height="40" patternUnits="userSpaceOnUse"><path d="M40 0H0v40" fill="none" stroke="rgba(169,183,204,.07)"/></pattern></defs>
|
||||
<rect width="800" height="480" fill="url(#g)"/>
|
||||
<path d="M-20 360 C 140 330, 240 400, 380 370 S 640 300, 820 330" fill="none" stroke="rgba(91,138,214,.35)" stroke-width="18" stroke-linecap="round"/>
|
||||
<g fill="none" stroke="rgba(169,183,204,.28)" stroke-width="3" stroke-linecap="round">
|
||||
<path d="M0 120 L800 170"/><path d="M120 0 L260 480"/><path d="M430 0 C 440 160, 470 260, 520 480"/><path d="M0 250 C 200 230, 520 250, 800 210"/><path d="M620 0 L700 480"/>
|
||||
</g>
|
||||
<g fill="none" stroke="rgba(169,183,204,.14)" stroke-width="1.5"><path d="M0 60 L800 90"/><path d="M300 0 L340 480"/><path d="M0 420 L800 440"/><path d="M540 0 L580 480"/></g>
|
||||
</svg>
|
||||
<span class="map__pin"><span>Kirschner Gebäudeservice</span><i></i></span>
|
||||
</a>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section theme-deep" 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>Lernen wir uns kennen.</h2>
|
||||
<p class="lead" data-reveal>Wir freuen uns auf Ihre Anfrage, Ihren Auftrag — und natürlich über Ihr Feedback.</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>
|
||||
</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>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
<footer class="site-footer">
|
||||
<div class="wrap">
|
||||
<div class="footer-grid">
|
||||
<div>
|
||||
<a class="brand" href="index.html" aria-label="Kirschner Gebäudeservice — Startseite"><svg class="chev-mark" viewBox="0 0 44 32" aria-hidden="true"><polygon class="chev" opacity=".55" points="14,0 24,0 10,16 24,32 14,32 0,16"/><polygon class="chev" points="32,0 42,0 28,16 42,32 32,32 18,16"/></svg><span class="brand__name"><b>KIRSCHNER</b><span>Gebäudeservice</span></span></a>
|
||||
<p class="footer-motto">Das Original seit 2003. Persönlich, zuverlässig, erstklassig — in Landshut, Ergolding und Umgebung.</p>
|
||||
</div>
|
||||
<div>
|
||||
<h2>Seiten</h2>
|
||||
<ul role="list"><li><a href="index.html">Start</a></li><li><a href="leistungen.html">Leistungen</a></li><li><a href="unternehmen.html">Unternehmen</a></li><li><a href="karriere.html">Karriere</a></li><li><a href="kontakt.html">Kontakt</a></li></ul>
|
||||
</div>
|
||||
<div>
|
||||
<h2>Kontakt</h2>
|
||||
<ul role="list">
|
||||
<li><a href="tel:+4987114269101">0871 / 14 26 91 01</a></li>
|
||||
<li><a href="tel:+491608365753">Notruf 0160 / 836 57 53</a></li>
|
||||
<li><a href="mailto:info@kirschner-service.de">info@kirschner-service.de</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div>
|
||||
<h2>Adresse</h2>
|
||||
<address style="font-style:normal">Etzstraße 45<br>84030 Ergolding<br><a href="https://www.google.com/maps/search/?api=1&query=Etzstra%C3%9Fe+45%2C+84030+Ergolding" rel="noopener" target="_blank">Route planen</a></address>
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer-word" aria-hidden="true">KIRSCHNER</div>
|
||||
<div class="footer-bottom">
|
||||
<span>© <span data-year>2026</span> Kirschner Gebäudeservice · Thomas Kirschner</span>
|
||||
<nav aria-label="Rechtliches"><a href="impressum.html">Impressum</a><a href="datenschutz.html">Datenschutz</a></nav>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
<a class="sos" href="tel:+491608365753" aria-label="24/7 Notruf anrufen: 0160 / 836 57 53">
|
||||
<span class="sos__dot" aria-hidden="true"></span>
|
||||
<span><small>Notruf 24/7</small><b>0160 / 836 57 53</b></span>
|
||||
</a>
|
||||
</body>
|
||||
</html>
|
||||
Reference in new issue
Block a user