Initial Astro static demo
This commit is contained in:
@@ -0,0 +1,40 @@
|
||||
---
|
||||
import { site } from "../data/site";
|
||||
|
||||
interface Props {
|
||||
title?: string;
|
||||
text?: string;
|
||||
application?: boolean;
|
||||
}
|
||||
|
||||
const {
|
||||
title = "Der direkte Draht zu uns",
|
||||
text = "Für Beratung, Angebot oder Reparatur erreichen Sie uns telefonisch oder per E-Mail.",
|
||||
application = false,
|
||||
} = Astro.props;
|
||||
const email = application ? site.applicationEmail : site.email;
|
||||
---
|
||||
|
||||
<aside class="contact-panel">
|
||||
<p class="label">Kontakt</p>
|
||||
<h2>{title}</h2>
|
||||
<p>{text}</p>
|
||||
<div class="contact-actions">
|
||||
<a class="button primary" href={site.phoneHref}>Anrufen</a>
|
||||
<a class="button secondary" href={`mailto:${email}`}>E-Mail schreiben</a>
|
||||
</div>
|
||||
<dl>
|
||||
<div>
|
||||
<dt>Telefon</dt>
|
||||
<dd><a href={site.phoneHref}>{site.phone}</a></dd>
|
||||
</div>
|
||||
<div>
|
||||
<dt>E-Mail</dt>
|
||||
<dd><a href={`mailto:${email}`}>{email}</a></dd>
|
||||
</div>
|
||||
<div>
|
||||
<dt>Adresse</dt>
|
||||
<dd>{site.address[0]}<br />{site.address[1]}</dd>
|
||||
</div>
|
||||
</dl>
|
||||
</aside>
|
||||
@@ -0,0 +1,56 @@
|
||||
---
|
||||
import { nav, partners, site } from "../data/site";
|
||||
---
|
||||
|
||||
<footer class="site-footer">
|
||||
<section class="footer-cta" aria-labelledby="footer-cta-title">
|
||||
<div class="container footer-cta-grid">
|
||||
<div>
|
||||
<p class="label">Direkter Draht</p>
|
||||
<h2 id="footer-cta-title">Sprechen wir über Ihr Dach.</h2>
|
||||
</div>
|
||||
<div class="footer-actions">
|
||||
<a class="button primary" href={site.phoneHref}>Anrufen</a>
|
||||
<a class="button secondary" href={`mailto:${site.email}`}>E-Mail schreiben</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<div class="container footer-main">
|
||||
<div class="footer-brand">
|
||||
<img src="/assets/img/logo-heidrich.png" alt="Heinz Heidrich GmbH" width="300" height="73" />
|
||||
<p>{site.description}</p>
|
||||
<address>
|
||||
{site.address[0]}<br />
|
||||
{site.address[1]}<br />
|
||||
<a href={site.phoneHref}>{site.phone}</a><br />
|
||||
<a href={`mailto:${site.email}`}>{site.email}</a>
|
||||
</address>
|
||||
</div>
|
||||
|
||||
<nav class="footer-nav" aria-label="Footer Navigation">
|
||||
<h2>Seiten</h2>
|
||||
{nav.map((item) => <a href={item.href}>{item.label}</a>)}
|
||||
<a href="/velux/">VELUX</a>
|
||||
</nav>
|
||||
|
||||
<div class="footer-nav">
|
||||
<h2>Rechtliches</h2>
|
||||
<a href="/impressum/">Impressum</a>
|
||||
<a href="/datenschutzerklaerung/">Datenschutz</a>
|
||||
<a href="/datenverarbeitung-velux/">VELUX Datenverarbeitung</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-partners">
|
||||
<h2>Partner</h2>
|
||||
<div class="partner-mini">
|
||||
{partners.map((partner) => (
|
||||
<a href={partner.href} rel="noreferrer" target="_blank">
|
||||
<img src={partner.logo} alt={partner.name} loading="lazy" />
|
||||
</a>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<p class="footer-bottom">© {new Date().getFullYear()} Heinz Heidrich GmbH</p>
|
||||
</footer>
|
||||
@@ -0,0 +1,26 @@
|
||||
---
|
||||
import { nav, site } from "../data/site";
|
||||
---
|
||||
|
||||
<a class="skip-link" href="#main-content">Zum Inhalt springen</a>
|
||||
<header class="site-header">
|
||||
<div class="header-inner">
|
||||
<a class="brand" href="/" aria-label="Heinz Heidrich GmbH Startseite">
|
||||
<img src="/assets/img/logo-heidrich.png" alt="Heinz Heidrich GmbH" width="300" height="73" />
|
||||
</a>
|
||||
|
||||
<nav class="desktop-nav" aria-label="Hauptnavigation">
|
||||
{nav.map((item) => <a href={item.href}>{item.label}</a>)}
|
||||
</nav>
|
||||
|
||||
<a class="nav-call" href={site.phoneHref}>{site.phone}</a>
|
||||
|
||||
<details class="mobile-nav">
|
||||
<summary>Menü</summary>
|
||||
<div class="mobile-nav-panel">
|
||||
{nav.map((item) => <a href={item.href}>{item.label}</a>)}
|
||||
<a href={site.phoneHref}>Anrufen</a>
|
||||
</div>
|
||||
</details>
|
||||
</div>
|
||||
</header>
|
||||
@@ -0,0 +1,26 @@
|
||||
---
|
||||
interface Props {
|
||||
title: string;
|
||||
kicker?: string;
|
||||
text?: string;
|
||||
image?: string;
|
||||
alt?: string;
|
||||
}
|
||||
|
||||
const { title, kicker, text, image, alt = "" } = Astro.props;
|
||||
---
|
||||
|
||||
<section class={`page-hero ${image ? "with-image" : ""}`}>
|
||||
<div class="container page-hero-grid">
|
||||
<div>
|
||||
{kicker && <p class="label">{kicker}</p>}
|
||||
<h1>{title}</h1>
|
||||
{text && <p class="lead">{text}</p>}
|
||||
</div>
|
||||
{image && (
|
||||
<figure class="page-hero-image">
|
||||
<img src={image} alt={alt} width="1200" height="800" />
|
||||
</figure>
|
||||
)}
|
||||
</div>
|
||||
</section>
|
||||
@@ -0,0 +1,20 @@
|
||||
---
|
||||
import BaseLayout from "../layouts/BaseLayout.astro";
|
||||
|
||||
interface Props {
|
||||
to: string;
|
||||
title?: string;
|
||||
}
|
||||
|
||||
const { to, title = "Weiterleitung" } = Astro.props;
|
||||
---
|
||||
|
||||
<BaseLayout title={title} canonical={to} noindex>
|
||||
<meta http-equiv="refresh" content={`0; url=${to}`} slot="head" />
|
||||
<section class="section">
|
||||
<div class="container legal-content">
|
||||
<h1>{title}</h1>
|
||||
<p>Die Seite ist umgezogen. <a href={to}>Hier geht es weiter</a>.</p>
|
||||
</div>
|
||||
</section>
|
||||
</BaseLayout>
|
||||
@@ -0,0 +1,13 @@
|
||||
---
|
||||
interface Props {
|
||||
title: string;
|
||||
text?: string;
|
||||
}
|
||||
|
||||
const { title, text } = Astro.props;
|
||||
---
|
||||
|
||||
<div class="section-intro">
|
||||
<h2>{title}</h2>
|
||||
{text && <p>{text}</p>}
|
||||
</div>
|
||||
@@ -0,0 +1,252 @@
|
||||
export const site = {
|
||||
name: "Heinz Heidrich GmbH",
|
||||
description:
|
||||
"Dachdecker- und Bauklempnerbetrieb aus Tostedt für Hamburg, Bremen, Buchholz, die Nordheide und Umgebung.",
|
||||
url: "https://heidrich-bedachung.de",
|
||||
phone: "04182 5802",
|
||||
phoneHref: "tel:+4941825802",
|
||||
fax: "04182 21480",
|
||||
email: "info@heidrich-bedachung.de",
|
||||
applicationEmail: "bewerbung@heidrich-bedachung.de",
|
||||
address: ["Zinnhütte 8", "21255 Tostedt"],
|
||||
postalAddress: ["Postfach 1303", "21255 Tostedt"],
|
||||
mapsUrl:
|
||||
"https://www.google.com/maps/search/?api=1&query=Heinz%20Heidrich%20GmbH%20Zinnh%C3%BCtte%208%2021255%20Tostedt",
|
||||
};
|
||||
|
||||
export const nav = [
|
||||
{ href: "/leistungen/", label: "Leistungen" },
|
||||
{ href: "/das-unternehmen/", label: "Unternehmen" },
|
||||
{ href: "/referenzen/", label: "Referenzen" },
|
||||
{ href: "/jobs/", label: "Jobs" },
|
||||
{ href: "/downloads/", label: "Downloads" },
|
||||
{ href: "/kontakt/", label: "Kontakt" },
|
||||
];
|
||||
|
||||
export const services = [
|
||||
{
|
||||
title: "Dacheindeckung",
|
||||
image: "/assets/img/dacheindeckung-baustelle.jpg",
|
||||
summary:
|
||||
"Traditionelles Dachdeckerhandwerk verbunden mit moderner Bauphysik und hochwertigen Materialien.",
|
||||
text:
|
||||
"Von der Dachrinne bis zum First, ob Betondachstein, Tonziegel oder metallische Werkstoffe: Heidrich setzt auch komplexe architektonische Konzepte fachgerecht um.",
|
||||
},
|
||||
{
|
||||
title: "Dachsanierung",
|
||||
image: "/assets/img/dachsanierung-hamburg.jpg",
|
||||
summary:
|
||||
"Alte Werte erhalten und Gebäude nach heutigen energetischen Anforderungen sanieren.",
|
||||
text:
|
||||
"Altbausanierung und Reparaturen stellen gerade bei älterer Bausubstanz besondere Anforderungen. Das Team begegnet ihnen mit Erfahrung, Sorgfalt und moderner Technik.",
|
||||
},
|
||||
{
|
||||
title: "Flachdach",
|
||||
image: "/assets/img/flachdach-arbeit.jpg",
|
||||
summary:
|
||||
"Sichere Abdichtungen für private, gewerbliche und industrielle Flachdächer.",
|
||||
text:
|
||||
"Kunststoff-Dachbahnen, Dichtungsbahnen und bituminöse Schweißbahnen sorgen für langlebige, dichte und belastbare Flachdachaufbauten.",
|
||||
},
|
||||
{
|
||||
title: "Dachklempnerei",
|
||||
image: "/assets/img/klempnerei-detail.jpg",
|
||||
summary:
|
||||
"Dachrinnen, Fallrohre, Wandanschlüsse, Schornsteine und Fassadenbekleidungen aus einer Hand.",
|
||||
text:
|
||||
"Die Arbeiten werden auf Wunsch in Zink, Kupfer, Aluminium oder Edelstahl ausgeführt und passend zur Gestaltung des Hauses geplant.",
|
||||
},
|
||||
{
|
||||
title: "Photovoltaik",
|
||||
image: "/assets/img/firmengelaende-blaues-dach.jpg",
|
||||
summary:
|
||||
"Dacharbeiten und PV-Anlagen als abgestimmte Lösung für Neubau und Sanierung.",
|
||||
text:
|
||||
"Umweltfreundliche Technik wird beim Hausbau und bei der Sanierung immer wichtiger. Heidrich begleitet passende PV-Lösungen auf dem Dach.",
|
||||
},
|
||||
{
|
||||
title: "Service & Reparatur",
|
||||
image: "/assets/img/jobs-team.jpg",
|
||||
summary:
|
||||
"Dachrinnenreinigung, Wartungsverträge und schnelle Hilfe bei Schäden.",
|
||||
text:
|
||||
"Ob Sturmschaden, undichte Stelle oder regelmäßige Kontrolle: Das Team übernimmt Wartung und Reparaturen rund um Dach, Fassade und Entwässerung.",
|
||||
},
|
||||
];
|
||||
|
||||
export const references = [
|
||||
"New Beiersdorf Campus",
|
||||
"Theater im Zimmer",
|
||||
"Hafencity",
|
||||
"Kampnagel",
|
||||
"Freilichtmuseum Kiekeberg",
|
||||
"WLC-Holstenwall",
|
||||
"Laeiszhalle",
|
||||
"Diverse Schulgebäude",
|
||||
];
|
||||
|
||||
export const timeline = [
|
||||
["1963", "Dachdeckermeister Heinz Heidrich gründet das Unternehmen im Meisenweg 16 in Tostedt."],
|
||||
["1964", "Der erste Mitarbeiter wird eingestellt."],
|
||||
["1965", "Zwei Lehrlinge und zwei Dachdeckergesellen kommen hinzu."],
|
||||
["1968", "Der Betrieb wächst und zieht an die Zinnhütte 8, den heutigen Firmensitz."],
|
||||
["1977", "Eine große Lagerhalle mit Sozialräumen entsteht. Das Unternehmen beschäftigt 25 Menschen."],
|
||||
["1987/1988", "Christian und Heiner Heidrich legen ihre Prüfung als Dachdeckermeister ab."],
|
||||
["1995", "Die Firma wird zur GmbH. Christian und Heiner Heidrich übernehmen die Geschäftsführung."],
|
||||
["2001", "Das Büro zieht in das Gebäude mit dem markanten blauen Dach in der Zinnhütte."],
|
||||
["2015", "Richard Nick, ehemaliger Lehrling des Betriebs, unterstützt das Team als Dachdeckermeister."],
|
||||
["2023", "Die Heinz Heidrich GmbH feiert ihr 60-jähriges Firmenjubiläum."],
|
||||
["2025", "Richard Nick übernimmt gemeinsam mit Christian und Heiner Heidrich die Geschäftsführung."],
|
||||
];
|
||||
|
||||
export const team = [
|
||||
["Christian Heidrich", "Geschäftsführer"],
|
||||
["Heiner Heidrich", "Geschäftsführer"],
|
||||
["Richard Nick", "Geschäftsführer"],
|
||||
["Claas Besendahl", "Zimmerermeister"],
|
||||
["Niklas Weber", "Dachdeckermeister"],
|
||||
["Christian Hillbring", "Dachdeckermeister"],
|
||||
["Jan Gaede", "Bautechniker"],
|
||||
["Martina Heidrich", "Sachbearbeitung"],
|
||||
["Ursula Meyer", "Sachbearbeitung"],
|
||||
["Emily Heidrich", "Marketing"],
|
||||
["Elke Heidrich", "Mitgründerin"],
|
||||
];
|
||||
|
||||
export const partners = [
|
||||
{ name: "Velux", logo: "/assets/img/partner-velux.png", href: "https://www.velux.de/" },
|
||||
{ name: "Braas", logo: "/assets/img/partner-braas.png", href: "https://www.braas.de/" },
|
||||
{ name: "Alwitra", logo: "/assets/img/partner-alwitra.png", href: "https://alwitra.de/" },
|
||||
{ name: "Rheinzink", logo: "/assets/img/partner-rheinzink.png", href: "https://www.rheinzink.de/" },
|
||||
];
|
||||
|
||||
export const downloads = [
|
||||
{
|
||||
title: "Freistellungsbescheinigung nach § 48b EStG 2026 bis 2028",
|
||||
href: "/assets/downloads/freistellungsbescheinigung-48b-estg-2026-2028.pdf",
|
||||
},
|
||||
{
|
||||
title: "Nachweis zur Steuerschuldnerschaft Leistungsempfänger-Bauleistungen nach §13b 2026 bis 2029",
|
||||
href: "/assets/downloads/bescheinigung-13b-2026-2029.pdf",
|
||||
},
|
||||
{
|
||||
title: "Eigenerklärungen zum PQ-Verfahren",
|
||||
href: "/assets/downloads/eigenerklaerungen-pq-verfahren.pdf",
|
||||
},
|
||||
{
|
||||
title: "Bestätigung des Betriebskontos der SokaDach",
|
||||
href: "/assets/downloads/sokadach-betriebskonto.pdf",
|
||||
},
|
||||
{
|
||||
title: "Bestätigung der Betriebshaftpflichtversicherung",
|
||||
href: "/assets/downloads/betriebshaftpflichtversicherung-2026-2027.pdf",
|
||||
},
|
||||
];
|
||||
|
||||
export const jobs = [
|
||||
{
|
||||
slug: "dachdecker-dachklempner",
|
||||
aliases: ["dachdecker"],
|
||||
title: "Dachdecker/in / Dachklempner/in (m/w/d)",
|
||||
location: "Tostedt",
|
||||
start: "Ab sofort",
|
||||
image: "/assets/img/job-dachdecker.jpg",
|
||||
intro: "Wir suchen ab sofort Dachdecker/innen und Dachklempner/innen für unseren Betrieb in Tostedt.",
|
||||
requirements: [
|
||||
"Abgeschlossene Berufsausbildung als Dachdecker/in, Dachklempner/in oder praktische Erfahrung als Dachdeckerhelfer/in",
|
||||
"Idealerweise mehrere Jahre Praxis im Dachdecker-, Dachklempner- oder Zimmereibereich",
|
||||
"Handwerkliches Geschick, Gewissenhaftigkeit, Sorgfalt und körperliche Belastbarkeit",
|
||||
"Teamfähigkeit und Freude am Arbeiten im Freien",
|
||||
"Führerschein Klasse B von Vorteil",
|
||||
"Freundlicher Umgang mit Kundschaft und Kollegium",
|
||||
],
|
||||
benefits: [
|
||||
"Familiäres Miteinander in einem Traditionsbetrieb",
|
||||
"Vermögenswirksame Leistungen",
|
||||
"Betriebliche Firmenfeiern",
|
||||
"Fachliche Weiterbildungen",
|
||||
"Leistungsgerechte Bezahlung nach Hamburger Tarif",
|
||||
"Flexible Arbeitszeiten",
|
||||
"Zuschuss zum Anhängerführerschein",
|
||||
"Hochwertige Arbeitsmittel und Arbeitsbekleidung",
|
||||
"Jobrad",
|
||||
],
|
||||
},
|
||||
{
|
||||
slug: "ausbildung-dachdecker",
|
||||
aliases: ["ausbildung"],
|
||||
title: "Ausbildung als Dachdecker/in (m/w/d)",
|
||||
location: "Tostedt",
|
||||
start: "01. August 2026",
|
||||
image: "/assets/img/job-ausbildung.jpg",
|
||||
intro: "Wir bieten für 2026 wieder Ausbildungsplätze zum Dachdecker oder zur Dachdeckerin in Tostedt an.",
|
||||
requirements: [
|
||||
"Du bist motiviert und lernbereit",
|
||||
"Du bringst handwerkliches Geschick, Sorgfalt und körperliche Belastbarkeit mit",
|
||||
"Du arbeitest gern im Team und draußen",
|
||||
],
|
||||
benefits: [
|
||||
"Familiäres Miteinander in einem Traditionsbetrieb",
|
||||
"Vermögenswirksame Leistungen",
|
||||
"Betriebliche Firmenfeiern",
|
||||
"Fachliche Weiterbildungen über die Ausbildung hinaus",
|
||||
"Gute Übernahmechancen bei entsprechenden Leistungen",
|
||||
"Leistungsgerechte Bezahlung nach Hamburger Tarif",
|
||||
"Flexible Arbeitszeiten",
|
||||
"Zuschuss zum Anhängerführerschein",
|
||||
"Hochwertige Arbeitsmittel und Arbeitsbekleidung",
|
||||
],
|
||||
},
|
||||
{
|
||||
slug: "zimmerer",
|
||||
aliases: [],
|
||||
title: "Zimmerer / Zimmerin (m/w/d)",
|
||||
location: "Tostedt",
|
||||
start: "Ab sofort",
|
||||
image: "/assets/img/job-zimmerer.jpg",
|
||||
intro: "Wir suchen ab sofort Zimmerleute für unseren Betrieb in Tostedt.",
|
||||
requirements: [
|
||||
"Abgeschlossene Berufsausbildung als Zimmerer oder Zimmerin mit praktischer Erfahrung",
|
||||
"Idealerweise mehrere Jahre Praxis im Dachdecker-, Dachklempner- oder Zimmereibereich",
|
||||
"Handwerkliches Geschick, Gewissenhaftigkeit, Sorgfalt und körperliche Belastbarkeit",
|
||||
"Teamfähigkeit und Freude am Arbeiten im Freien",
|
||||
"Führerschein Klasse B von Vorteil",
|
||||
"Freundlicher Umgang mit Kundschaft und Kollegium",
|
||||
],
|
||||
benefits: [
|
||||
"Familiäres Miteinander in einem Traditionsbetrieb",
|
||||
"Vermögenswirksame Leistungen",
|
||||
"Betriebliche Firmenfeiern",
|
||||
"Fachliche Weiterbildungen",
|
||||
"Leistungsgerechte Bezahlung nach Hamburger Tarif",
|
||||
"Flexible Arbeitszeiten",
|
||||
"Zuschuss zum Anhängerführerschein",
|
||||
"Hochwertige Arbeitsmittel und Arbeitsbekleidung",
|
||||
"Jobrad",
|
||||
],
|
||||
},
|
||||
];
|
||||
|
||||
export const masterJob = {
|
||||
title: "Dachdeckermeister/in (m/w/d)",
|
||||
href: "/jobs-dachdeckermeister/",
|
||||
intro: "Wir suchen zum nächstmöglichen Zeitpunkt einen Dachdeckermeister oder eine Dachdeckermeisterin für unseren Betrieb in Tostedt.",
|
||||
tasks: [
|
||||
"Kundenbetreuung",
|
||||
"Angebots- und Rechnungserstellung",
|
||||
"Baustellenorganisation",
|
||||
"Einteilung der Mitarbeiterinnen und Mitarbeiter",
|
||||
],
|
||||
requirements: [
|
||||
"Erfolgreich abgeschlossene Weiterbildung zum Meister im Dachdeckerhandwerk",
|
||||
"Mehrjährige Berufserfahrung",
|
||||
],
|
||||
benefits: [
|
||||
"Firmenwagen",
|
||||
"Familiäres Miteinander in einem Traditionsbetrieb",
|
||||
"Moderne technische Grundausstattung mit Laptop und Apple iPhone",
|
||||
"Unterstützung bei der Vereinbarkeit von Arbeit und Familie",
|
||||
],
|
||||
};
|
||||
|
||||
export const allJobPaths = jobs.flatMap((job) => [job.slug, ...job.aliases]);
|
||||
@@ -0,0 +1,50 @@
|
||||
---
|
||||
import "../styles/global.css";
|
||||
import Header from "../components/Header.astro";
|
||||
import Footer from "../components/Footer.astro";
|
||||
import { site } from "../data/site";
|
||||
|
||||
interface Props {
|
||||
title?: string;
|
||||
description?: string;
|
||||
canonical?: string;
|
||||
noindex?: boolean;
|
||||
}
|
||||
|
||||
const {
|
||||
title = site.name,
|
||||
description = site.description,
|
||||
canonical = Astro.url.pathname,
|
||||
noindex = false,
|
||||
} = Astro.props;
|
||||
|
||||
const pageTitle = title === site.name ? title : `${title} | ${site.name}`;
|
||||
const canonicalUrl = new URL(canonical, site.url).toString();
|
||||
---
|
||||
|
||||
<!doctype html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<meta name="generator" content={Astro.generator} />
|
||||
<title>{pageTitle}</title>
|
||||
<meta name="description" content={description} />
|
||||
<link rel="canonical" href={canonicalUrl} />
|
||||
{noindex && <meta name="robots" content="noindex, follow" />}
|
||||
<link rel="icon" href="/assets/img/logo-heidrich-square.png" />
|
||||
<meta property="og:title" content={pageTitle} />
|
||||
<meta property="og:description" content={description} />
|
||||
<meta property="og:type" content="website" />
|
||||
<meta property="og:url" content={canonicalUrl} />
|
||||
<meta property="og:image" content={new URL("/assets/img/firmengelaende-luftaufnahme.jpg", site.url).toString()} />
|
||||
<slot name="head" />
|
||||
</head>
|
||||
<body>
|
||||
<Header />
|
||||
<main id="main-content">
|
||||
<slot />
|
||||
</main>
|
||||
<Footer />
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,5 @@
|
||||
---
|
||||
import RedirectPage from "../components/RedirectPage.astro";
|
||||
---
|
||||
|
||||
<RedirectPage to="/jobs/" title="Jobs" />
|
||||
@@ -0,0 +1,44 @@
|
||||
---
|
||||
import BaseLayout from "../layouts/BaseLayout.astro";
|
||||
import PageHero from "../components/PageHero.astro";
|
||||
---
|
||||
|
||||
<BaseLayout title="60 Jahre Heinz Heidrich GmbH" description="Zum 60-jährigen Bestehen der Heinz Heidrich GmbH: Geschichte, Wachstum, Ausbildung und Team des Dachdeckerbetriebs aus Tostedt.">
|
||||
<PageHero
|
||||
title="60 Jahre Heinz Heidrich GmbH"
|
||||
kicker="Jubiläum"
|
||||
text="Eine Erfolgsgeschichte aus Tostedt, gewachsen aus Handwerk, Ausbildung und Teamgeist."
|
||||
image="/assets/img/firmengelaende-luftaufnahme.jpg"
|
||||
alt="Luftaufnahme des gesamten Firmengeländes der Heinz Heidrich GmbH"
|
||||
/>
|
||||
|
||||
<section class="section">
|
||||
<article class="container article">
|
||||
<p>Die Firma Heinz Heidrich GmbH aus Tostedt feierte 2023 ihr 60-jähriges Bestehen. Das Unternehmen ist in der Metropolregion Hamburg für unternehmerischen Weitblick, solide und qualitativ hochwertige Arbeiten sowie motivierte Mitarbeiter bekannt.</p>
|
||||
|
||||
<h2>Bescheidene Anfänge</h2>
|
||||
<p>Alles begann mit der Gründung am 18. Juni 1963 durch Dachdeckermeister Heinz Heidrich. Das Lager des jungen Unternehmens befand sich im Meisenweg 16, wo sogar das Flachdach der Garage als Materiallager genutzt wurde. Das Büro war in einer Wohnküche untergebracht.</p>
|
||||
<p>Bereits 1964 stellte Heinz Heidrich seinen ersten Mitarbeiter ein. 1965 folgten zwei Lehrlinge und zwei Dachdeckergesellen. Der Betrieb wuchs weiter und zog 1968 an die Zinnhütte 8, den heutigen Sitz des Unternehmens.</p>
|
||||
|
||||
<figure class="article-image">
|
||||
<img src="/assets/img/historie-fahrzeuge.jpg" alt="Fahrzeuge des Betriebs vor dem früheren Firmensitz" loading="lazy" width="1024" height="509" />
|
||||
</figure>
|
||||
|
||||
<h2>Familie und Verantwortung</h2>
|
||||
<p>Die Söhne Christian und Heiner Heidrich wuchsen von Anfang an in das Unternehmen hinein und begleiteten ihren Vater bereits als Kinder auf Baustellen. 1988 legten beide ihre Prüfung zu Dachdeckermeistern ab, 1991 folgte die Prüfung zu Klempnermeistern.</p>
|
||||
<p>Seit 1995 führten Christian und Heiner Heidrich die GmbH. Heinz Heidrich stand seinen Söhnen weiterhin mit Rat und Tat zur Seite.</p>
|
||||
|
||||
<figure class="article-image">
|
||||
<img src="/assets/img/historie-familie.jpg" alt="Heinz Heidrich mit Christian und Heiner Heidrich" loading="lazy" width="1024" height="509" />
|
||||
</figure>
|
||||
|
||||
<h2>Ausbildung als Fundament</h2>
|
||||
<p>Die Heinz Heidrich GmbH legt seit jeher großen Wert auf Ausbildung und Weiterbildung. Mehr als 200 Lehrlinge wurden in den vergangenen 60 Jahren ausgebildet. Einige wurden als beste Lehrlinge Hamburgs oder als Landessieger ausgezeichnet.</p>
|
||||
<p>Heute arbeiten über 75 Menschen im Betrieb: Dachdecker, Klempner, Zimmerergesellen, Dachdeckerhelfer, Lehrlinge und Büroangestellte.</p>
|
||||
|
||||
<figure class="article-image">
|
||||
<img src="/assets/img/kompetenzteam-kran.jpg" alt="Kompetenzteam der Heinz Heidrich GmbH vor einem Kran" loading="lazy" width="1024" height="683" />
|
||||
</figure>
|
||||
</article>
|
||||
</section>
|
||||
</BaseLayout>
|
||||
@@ -0,0 +1,5 @@
|
||||
---
|
||||
import RedirectPage from "../components/RedirectPage.astro";
|
||||
---
|
||||
|
||||
<RedirectPage to="/job/ausbildung-dachdecker/" title="Ausbildung" />
|
||||
@@ -0,0 +1,71 @@
|
||||
---
|
||||
import BaseLayout from "../layouts/BaseLayout.astro";
|
||||
import PageHero from "../components/PageHero.astro";
|
||||
import SectionIntro from "../components/SectionIntro.astro";
|
||||
import { team, timeline } from "../data/site";
|
||||
---
|
||||
|
||||
<BaseLayout title="Das Unternehmen" description="Seit 1963 ist die Heinz Heidrich GmbH Ihr Dachdecker- und Klempnerbetrieb aus Tostedt. Geschichte, Team und Werte des Familienunternehmens.">
|
||||
<PageHero
|
||||
title="Das Unternehmen"
|
||||
kicker="Familienbetrieb seit 1963"
|
||||
text="Qualität, Präzision und ein großes Team aus dem Dachdecker-, Klempner- und Zimmererhandwerk."
|
||||
image="/assets/img/geschaeftsfuehrung.jpg"
|
||||
alt="Christian und Heiner Heidrich auf dem Firmengelände"
|
||||
/>
|
||||
|
||||
<section class="section">
|
||||
<div class="container split-grid">
|
||||
<div class="copy-stack">
|
||||
<h2>Willkommen bei der Heinz Heidrich GmbH.</h2>
|
||||
<p>Seit über 60 Jahren ist die Heinz Heidrich GmbH ein zuverlässiger Partner für hochwertige Dachdecker- und Klempnerarbeiten in der Region.</p>
|
||||
<p>Gegründet wurde der Betrieb 1963 von Dachdeckermeister Heinz Heidrich. Seit 1995 wurde das Unternehmen von seinen Söhnen Christian und Heiner Heidrich weitergeführt. Heute gehört auch Richard Nick zur Geschäftsführung.</p>
|
||||
<p>Zum Leistungsspektrum gehören Neuinstallation und Reparatur von Dächern, Fassadenverkleidung, Abdichtung, Dachsanierung und Serviceleistungen für private, gewerbliche und öffentliche Projekte.</p>
|
||||
</div>
|
||||
<figure class="feature-image">
|
||||
<img src="/assets/img/firmengelaende-blaues-dach.jpg" alt="Luftaufnahme des Firmengeländes mit blauem Dach" loading="lazy" width="1600" height="900" />
|
||||
</figure>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section alt">
|
||||
<div class="container">
|
||||
<SectionIntro title="Unsere Chronik" text="Viele der heutigen Stärken des Betriebs sind über Jahrzehnte gewachsen: Ausbildung, Technik, Teamgröße und regionale Verwurzelung." />
|
||||
<div class="timeline">
|
||||
{timeline.map(([year, text]) => (
|
||||
<div class="timeline-item">
|
||||
<div class="timeline-year">{year}</div>
|
||||
<p>{text}</p>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section">
|
||||
<div class="container split-grid reverse">
|
||||
<figure class="feature-image">
|
||||
<img src="/assets/img/kompetenzteam-kran.jpg" alt="Fünf Mitarbeiter der Heinz Heidrich GmbH vor einem Kran" loading="lazy" width="1024" height="683" />
|
||||
</figure>
|
||||
<div class="copy-stack">
|
||||
<h2>Ausbildung und Erfahrung im selben Team.</h2>
|
||||
<p>Heute sorgen über 75 Menschen dafür, dass Kundenwünsche umgesetzt werden: Dachdeckergesellen, Dachdeckerhelfer, Dachdeckermeister, Zimmerermeister, Lehrlinge und Büroangestellte.</p>
|
||||
<p>In den vergangenen Jahrzehnten wurden mehr als 200 Lehrlinge ausgebildet. Einige davon zählten zu den besten Lehrlingen Hamburgs oder wurden Landessieger.</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section alt">
|
||||
<div class="container">
|
||||
<SectionIntro title="Unser Team" text="Die folgenden Ansprechpartner und Fachkräfte prägen den Betrieb in Tostedt." />
|
||||
<div class="team-grid">
|
||||
{team.map(([name, role]) => (
|
||||
<div class="team-member">
|
||||
<strong>{name}</strong>
|
||||
<span>{role}</span>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</BaseLayout>
|
||||
@@ -0,0 +1,49 @@
|
||||
---
|
||||
import BaseLayout from "../layouts/BaseLayout.astro";
|
||||
import PageHero from "../components/PageHero.astro";
|
||||
import { site } from "../data/site";
|
||||
---
|
||||
|
||||
<BaseLayout title="Datenschutzerklärung" description="Datenschutzerklärung der Heinz Heidrich GmbH für die statische Website heidrich-bedachung.de.">
|
||||
<PageHero title="Datenschutzerklärung" kicker="Stand Juli 2026" text="Informationen zur Verarbeitung personenbezogener Daten auf dieser Website." />
|
||||
|
||||
<section class="section">
|
||||
<div class="container legal-content">
|
||||
<h2>Verantwortlicher</h2>
|
||||
<p>{site.name}<br />Christian Heidrich, Heiner Heidrich, Richard Nick<br />{site.address[0]}<br />{site.address[1]}<br />Deutschland</p>
|
||||
<p>E-Mail: <a href={`mailto:${site.email}`}>{site.email}</a><br />Telefon: <a href={site.phoneHref}>{site.phone}</a></p>
|
||||
|
||||
<h2>Allgemeines</h2>
|
||||
<p>Wir nehmen den Schutz Ihrer personenbezogenen Daten ernst. Personenbezogene Daten werden nur verarbeitet, soweit dies zur Bereitstellung dieser Website, zur Bearbeitung Ihrer Anfrage oder aufgrund gesetzlicher Pflichten erforderlich ist.</p>
|
||||
|
||||
<h2>Bereitstellung der Website und Server-Logfiles</h2>
|
||||
<p>Beim Aufruf dieser Website verarbeitet der ausliefernde Webserver technisch notwendige Zugriffsdaten. Dazu können IP-Adresse, Datum und Uhrzeit des Abrufs, aufgerufene Datei, übertragene Datenmenge, Referrer, Browsertyp, Betriebssystem und HTTP-Status gehören.</p>
|
||||
<p>Die Verarbeitung erfolgt zur technischen Bereitstellung, Stabilität und Sicherheit der Website. Rechtsgrundlage ist Art. 6 Abs. 1 lit. f DSGVO. Unser berechtigtes Interesse liegt im sicheren und fehlerfreien Betrieb dieser Website.</p>
|
||||
|
||||
<h2>Kontakt per E-Mail oder Telefon</h2>
|
||||
<p>Wenn Sie uns per E-Mail oder Telefon kontaktieren, verarbeiten wir die von Ihnen mitgeteilten Daten zur Bearbeitung Ihrer Anfrage. Rechtsgrundlage ist Art. 6 Abs. 1 lit. b DSGVO, soweit die Anfrage mit einem Vertrag oder vorvertraglichen Maßnahmen zusammenhängt, andernfalls Art. 6 Abs. 1 lit. f DSGVO.</p>
|
||||
|
||||
<h2>Bewerbungen</h2>
|
||||
<p>Wenn Sie sich bei uns bewerben, verarbeiten wir Ihre Bewerbungsdaten zur Durchführung des Bewerbungsverfahrens. Rechtsgrundlage ist Art. 6 Abs. 1 lit. b DSGVO. Bewerbungsdaten werden gelöscht, sobald sie für das Bewerbungsverfahren nicht mehr erforderlich sind und keine gesetzlichen Aufbewahrungspflichten entgegenstehen.</p>
|
||||
|
||||
<h2>Cookies, Tracking und Analyse</h2>
|
||||
<p>Diese statische Website setzt selbst keine Analyse- oder Marketing-Cookies ein und verwendet kein Google Analytics, kein Facebook Pixel und kein vergleichbares Tracking-Script.</p>
|
||||
|
||||
<h2>Externe Links</h2>
|
||||
<p>Diese Website enthält Links zu externen Angeboten, etwa Google Maps, VELUX und Partnerwebsites. Wenn Sie einen externen Link anklicken, verlassen Sie diese Website. Für die Datenverarbeitung auf den externen Seiten ist der jeweilige Anbieter verantwortlich.</p>
|
||||
|
||||
<h2>VELUX Dachfenster-Konfigurator</h2>
|
||||
<p>Informationen zur Datenverarbeitung bei Nutzung des VELUX Dachfenster-Konfigurators finden Sie auf der Seite <a href="/datenverarbeitung-velux/">Datenverarbeitung VELUX</a>.</p>
|
||||
|
||||
<h2>Ihre Rechte</h2>
|
||||
<p>Sie haben nach Maßgabe der gesetzlichen Bestimmungen das Recht auf Auskunft, Berichtigung, Löschung, Einschränkung der Verarbeitung, Datenübertragbarkeit sowie Widerspruch gegen bestimmte Verarbeitungen Ihrer personenbezogenen Daten.</p>
|
||||
<p>Sie haben außerdem das Recht, sich bei einer Datenschutzaufsichtsbehörde zu beschweren, wenn Sie der Ansicht sind, dass die Verarbeitung Ihrer personenbezogenen Daten gegen Datenschutzrecht verstößt.</p>
|
||||
|
||||
<h2>Speicherdauer</h2>
|
||||
<p>Wir speichern personenbezogene Daten nur so lange, wie dies für den jeweiligen Zweck erforderlich ist oder gesetzliche Aufbewahrungspflichten bestehen.</p>
|
||||
|
||||
<h2>Änderungen dieser Datenschutzerklärung</h2>
|
||||
<p>Wir behalten uns vor, diese Datenschutzerklärung anzupassen, wenn sich technische, rechtliche oder organisatorische Anforderungen ändern.</p>
|
||||
</div>
|
||||
</section>
|
||||
</BaseLayout>
|
||||
@@ -0,0 +1,39 @@
|
||||
---
|
||||
import BaseLayout from "../layouts/BaseLayout.astro";
|
||||
import PageHero from "../components/PageHero.astro";
|
||||
---
|
||||
|
||||
<BaseLayout title="Datenverarbeitung bei Nutzung des VELUX Konfigurators" description="Informationen zur Datenverarbeitung bei Nutzung des VELUX Dachfenster-Konfigurators.">
|
||||
<PageHero
|
||||
title="Datenverarbeitung VELUX"
|
||||
kicker="Datenschutzhinweis"
|
||||
text="Informationen zur Nutzung des VELUX Dachfenster-Konfigurators."
|
||||
/>
|
||||
|
||||
<section class="section">
|
||||
<div class="container legal-content">
|
||||
<h2>Beschreibung und Umfang der Datenverarbeitung</h2>
|
||||
<p>Mit dem VELUX Dachfenster-Konfigurator können Sie in mehreren Schritten eine persönliche Dachfensterlösung konfigurieren, eine unverbindliche Indikation für einen Gesamtpreis aus Produkten und gegebenenfalls Einbaukosten ermitteln und auf Wunsch ein unverbindliches Angebot anfordern.</p>
|
||||
<p>Dazu wird, Ihre Zustimmung vorausgesetzt, aus dem VELUX-System eine E-Mail an den ausgewählten Handwerksbetrieb, den Betreiber dieser Webseite, sowie an Sie selbst gesendet.</p>
|
||||
|
||||
<h2>Übermittelte Daten</h2>
|
||||
<p>Die Nachricht enthält die ausgewählte Produkt-Konfiguration sowie folgende personenbezogene Daten:</p>
|
||||
<ul>
|
||||
<li>Vor- und Nachname</li>
|
||||
<li>Anschrift</li>
|
||||
<li>E-Mail-Adresse</li>
|
||||
<li>Telefonnummer</li>
|
||||
<li>Projektinformationen</li>
|
||||
</ul>
|
||||
<p>Im Zeitpunkt der Absendung werden zusätzlich Datum und Uhrzeit erhoben. Ihre Daten werden im System der VELUX Deutschland GmbH gespeichert.</p>
|
||||
|
||||
<h2>VELUX Bedingungen</h2>
|
||||
<p>Im Rahmen der Nutzung des Konfigurators werden Ihre Daten gemäß den Nutzungsbedingungen und der Datenschutzerklärung von VELUX behandelt.</p>
|
||||
<p>Im weiteren Verlauf erhält VELUX vom Betreiber dieser Webseite eine Rückmeldung zum Bearbeitungsstand Ihrer Anfrage. Dies ist notwendig, damit VELUX Sie gegebenenfalls zeitnah bei der ausgelobten Dienstleistung unterstützen kann.</p>
|
||||
|
||||
<h2>Rechtsgrundlage</h2>
|
||||
<p>Die Rechtsgrundlage für die Verarbeitung der oben genannten Daten ist Art. 6 Abs. 1 lit. b DSGVO zur Erfüllung eines Vertrages beziehungsweise zur Durchführung vorvertraglicher Maßnahmen und Beantwortung von Anfragen.</p>
|
||||
<p>Soweit vom Betreiber dieser Webseite ein Angebot angefordert oder ein Auftrag erteilt wurde, gilt zusätzlich die <a href="/datenschutzerklaerung/">Datenschutzerklärung</a> dieser Webseite.</p>
|
||||
</div>
|
||||
</section>
|
||||
</BaseLayout>
|
||||
@@ -0,0 +1,26 @@
|
||||
---
|
||||
import BaseLayout from "../layouts/BaseLayout.astro";
|
||||
import PageHero from "../components/PageHero.astro";
|
||||
import { downloads } from "../data/site";
|
||||
---
|
||||
|
||||
<BaseLayout title="Downloads" description="Aktuelle Bescheinigungen und Nachweise der Heinz Heidrich GmbH als PDF herunterladen.">
|
||||
<PageHero
|
||||
title="Downloads"
|
||||
kicker="Nachweise und Bescheinigungen"
|
||||
text="Alle wichtigen PDF-Dokumente für Auftraggeber, Buchhaltung und Projektabwicklung."
|
||||
/>
|
||||
|
||||
<section class="section">
|
||||
<div class="container">
|
||||
<div class="downloads">
|
||||
{downloads.map((download) => (
|
||||
<article class="download-row">
|
||||
<h2>{download.title}</h2>
|
||||
<a class="button primary" href={download.href} download>Herunterladen</a>
|
||||
</article>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</BaseLayout>
|
||||
@@ -0,0 +1,5 @@
|
||||
---
|
||||
import RedirectPage from "../components/RedirectPage.astro";
|
||||
---
|
||||
|
||||
<RedirectPage to="/" title="Startseite" />
|
||||
@@ -0,0 +1,52 @@
|
||||
---
|
||||
import BaseLayout from "../layouts/BaseLayout.astro";
|
||||
import PageHero from "../components/PageHero.astro";
|
||||
import { site } from "../data/site";
|
||||
---
|
||||
|
||||
<BaseLayout title="Impressum" description="Impressum der Heinz Heidrich GmbH, Zinnhütte 8, 21255 Tostedt.">
|
||||
<PageHero title="Impressum" kicker="Angaben gemäß § 5 TMG" text="Heinz Heidrich GmbH, Dachdecker- und Klempnerbetrieb aus Tostedt." />
|
||||
|
||||
<section class="section">
|
||||
<div class="container legal-content">
|
||||
<h2>Angaben gemäß § 5 TMG</h2>
|
||||
<p>{site.name}<br />{site.address[0]}<br />{site.address[1]}</p>
|
||||
|
||||
<h2>Postadresse</h2>
|
||||
<p>{site.name}<br />{site.postalAddress[0]}<br />{site.postalAddress[1]}</p>
|
||||
|
||||
<h2>Vertreten durch</h2>
|
||||
<p>Christian Heidrich<br />Heiner Heidrich<br />Richard Nick</p>
|
||||
|
||||
<h2>Kontakt</h2>
|
||||
<p>Telefon: <a href={site.phoneHref}>{site.phone}</a><br />Telefax: {site.fax}<br />E-Mail: <a href={`mailto:${site.email}`}>{site.email}</a></p>
|
||||
|
||||
<h2>Registereintrag</h2>
|
||||
<p>Eintragung im Handelsregister.<br />Registergericht: Amtsgericht 21255 Tostedt<br />Registernummer: HRB 3809</p>
|
||||
|
||||
<h2>Umsatzsteuer</h2>
|
||||
<p>Umsatzsteuer-Identifikationsnummer gemäß §27 a Umsatzsteuergesetz: DE 169507570</p>
|
||||
|
||||
<h2>Angaben zur Berufshaftpflichtversicherung</h2>
|
||||
<p>BG BAU, Berufsgenossenschaft der Bauwirtschaft<br />Region Nord<br />Hildesheimer Straße 309<br />30519 Hannover</p>
|
||||
<p>Telefon: 0511 987-0<br />Nummer: MM 10507489819<br />Geltungsraum der Versicherung: Deutschland</p>
|
||||
|
||||
<h2>Streitschlichtung</h2>
|
||||
<p>Wir sind nicht bereit oder verpflichtet, an Streitbeilegungsverfahren vor einer Verbraucherschlichtungsstelle teilzunehmen.</p>
|
||||
|
||||
<h2>Haftung für Inhalte</h2>
|
||||
<p>Als Diensteanbieter sind wir gemäß § 7 Abs.1 TMG für eigene Inhalte auf diesen Seiten nach den allgemeinen Gesetzen verantwortlich. Nach §§ 8 bis 10 TMG sind wir als Diensteanbieter jedoch nicht verpflichtet, übermittelte oder gespeicherte fremde Informationen zu überwachen oder nach Umständen zu forschen, die auf eine rechtswidrige Tätigkeit hinweisen.</p>
|
||||
<p>Verpflichtungen zur Entfernung oder Sperrung der Nutzung von Informationen nach den allgemeinen Gesetzen bleiben hiervon unberührt. Eine diesbezügliche Haftung ist erst ab dem Zeitpunkt der Kenntnis einer konkreten Rechtsverletzung möglich. Bei Bekanntwerden von entsprechenden Rechtsverletzungen werden diese Inhalte umgehend entfernt.</p>
|
||||
|
||||
<h2>Haftung für Links</h2>
|
||||
<p>Unser Angebot enthält Links zu externen Webseiten Dritter, auf deren Inhalte wir keinen Einfluss haben. Deshalb können wir für diese fremden Inhalte keine Gewähr übernehmen. Für die Inhalte der verlinkten Seiten ist stets der jeweilige Anbieter oder Betreiber der Seiten verantwortlich.</p>
|
||||
|
||||
<h2>Urheberrecht</h2>
|
||||
<p>Die durch die Seitenbetreiber erstellten Inhalte und Werke auf diesen Seiten unterliegen dem deutschen Urheberrecht. Vervielfältigung, Bearbeitung, Verbreitung und jede Art der Verwertung außerhalb der Grenzen des Urheberrechtes bedürfen der schriftlichen Zustimmung des jeweiligen Autors beziehungsweise Erstellers.</p>
|
||||
<p>Soweit die Inhalte auf dieser Seite nicht vom Betreiber erstellt wurden, werden die Urheberrechte Dritter beachtet. Sollten Sie trotzdem auf eine Urheberrechtsverletzung aufmerksam werden, bitten wir um einen entsprechenden Hinweis.</p>
|
||||
|
||||
<h2>Quelle</h2>
|
||||
<p>eRecht24</p>
|
||||
</div>
|
||||
</section>
|
||||
</BaseLayout>
|
||||
@@ -0,0 +1,147 @@
|
||||
---
|
||||
import BaseLayout from "../layouts/BaseLayout.astro";
|
||||
import SectionIntro from "../components/SectionIntro.astro";
|
||||
import ContactPanel from "../components/ContactPanel.astro";
|
||||
import { partners, references, services, site, timeline } from "../data/site";
|
||||
|
||||
const structuredData = {
|
||||
"@context": "https://schema.org",
|
||||
"@type": "RoofingContractor",
|
||||
name: site.name,
|
||||
url: site.url,
|
||||
telephone: site.phone,
|
||||
email: site.email,
|
||||
address: {
|
||||
"@type": "PostalAddress",
|
||||
streetAddress: "Zinnhütte 8",
|
||||
postalCode: "21255",
|
||||
addressLocality: "Tostedt",
|
||||
addressCountry: "DE",
|
||||
},
|
||||
areaServed: ["Tostedt", "Hamburg", "Bremen", "Buchholz in der Nordheide", "Nordheide"],
|
||||
};
|
||||
---
|
||||
|
||||
<BaseLayout title="Bedachung und Bauklempnerei aus Tostedt" description="Heinz Heidrich GmbH aus Tostedt: Dacheindeckung, Dachsanierung, Flachdach, Bauklempnerei, Photovoltaik, Wartung und Reparatur.">
|
||||
<script type="application/ld+json" set:html={JSON.stringify(structuredData)} />
|
||||
|
||||
<section class="hero">
|
||||
<div class="container hero-grid">
|
||||
<div class="hero-copy">
|
||||
<p class="label">Seit 1963 in Tostedt</p>
|
||||
<h1>Dächer, die <span>halten.</span></h1>
|
||||
<p class="lead">Bedachung, Bauklempnerei, Sanierung und Service für private, gewerbliche und öffentliche Projekte.</p>
|
||||
<div class="hero-actions">
|
||||
<a class="button primary" href="/kontakt/">Kontakt aufnehmen</a>
|
||||
<a class="button secondary" href="/leistungen/">Leistungen ansehen</a>
|
||||
</div>
|
||||
</div>
|
||||
<figure class="hero-media">
|
||||
<img src="/assets/img/firmengelaende-luftaufnahme.jpg" alt="Luftaufnahme des Firmengeländes der Heinz Heidrich GmbH in Tostedt" width="1600" height="900" />
|
||||
</figure>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="stats-strip" aria-label="Unternehmensdaten">
|
||||
<div class="stat">
|
||||
<strong>60+</strong>
|
||||
<span>Jahre Erfahrung</span>
|
||||
</div>
|
||||
<div class="stat">
|
||||
<strong>75+</strong>
|
||||
<span>Menschen im Team</span>
|
||||
</div>
|
||||
<div class="stat">
|
||||
<strong>200+</strong>
|
||||
<span>ausgebildete Lehrlinge</span>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section">
|
||||
<div class="container">
|
||||
<SectionIntro title="Handwerk mit breitem Dachwissen" text="Von klassischer Eindeckung bis energetischer Sanierung: Das Team plant und setzt Dacharbeiten mit eigenen Fachkräften um." />
|
||||
<div class="service-grid">
|
||||
{services.map((service) => (
|
||||
<article class="service-card">
|
||||
<img src={service.image} alt="" loading="lazy" width="895" height="665" />
|
||||
<div class="service-card-content">
|
||||
<h3>{service.title}</h3>
|
||||
<p>{service.summary}</p>
|
||||
</div>
|
||||
</article>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section alt">
|
||||
<div class="container split-grid">
|
||||
<div class="copy-stack">
|
||||
<h2>Hochwertiges Dachdeckerhandwerk hat bei uns Tradition.</h2>
|
||||
<p>Seit 1963 ist die Heinz Heidrich GmbH in Tostedt verwurzelt und in der Region Hamburg, Bremen, Buchholz und Nordheide unterwegs.</p>
|
||||
<p>Das Unternehmen verbindet langjährige Erfahrung mit moderner Technik, eigener Ausbildung und einem Team aus Dachdeckern, Klempnern, Zimmerern, Meistern und Büro.</p>
|
||||
<div class="inline-actions">
|
||||
<a class="button primary" href="/das-unternehmen/">Unternehmen kennenlernen</a>
|
||||
<a class="button secondary" href="/60-jahre-heinz-heidrich-gmbh/">60 Jahre lesen</a>
|
||||
</div>
|
||||
</div>
|
||||
<figure class="feature-image">
|
||||
<img src="/assets/img/geschaeftsfuehrung.jpg" alt="Christian und Heiner Heidrich auf dem Firmengelände" loading="lazy" width="1024" height="683" />
|
||||
</figure>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section">
|
||||
<div class="container split-grid reverse">
|
||||
<figure class="feature-image">
|
||||
<img src="/assets/img/firmengelaende-blaues-dach.jpg" alt="Firmengelände mit blauem Dach und Fahrzeugen" loading="lazy" width="1600" height="900" />
|
||||
</figure>
|
||||
<div class="copy-stack">
|
||||
<h2>Aus der Region, für die Region.</h2>
|
||||
<p>Die Baustellen reichen vom Einfamilienhaus bis zu großen gewerblichen und öffentlichen Projekten. Heidrich betreut Dacheindeckung, Fassadenbekleidung, Abdichtung, Reparatur und Wartung.</p>
|
||||
<ul class="check-list">
|
||||
{references.slice(0, 5).map((reference) => <li>{reference}</li>)}
|
||||
</ul>
|
||||
<a class="button secondary" href="/referenzen/">Referenzen ansehen</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section field">
|
||||
<div class="container split-grid">
|
||||
<div class="copy-stack">
|
||||
<h2>Wir bilden aus und suchen Verstärkung.</h2>
|
||||
<p>Wer im Dachdecker-, Klempner- oder Zimmererhandwerk arbeiten möchte, findet in Tostedt ein großes Team, moderne Ausstattung und echte Baustellenvielfalt.</p>
|
||||
<a class="button primary" href="/jobs/">Zu den Jobs</a>
|
||||
</div>
|
||||
<ContactPanel title="Schnell erreichbar" text="Ob Projektanfrage oder Bewerbung: Wir antworten direkt aus Tostedt." />
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section">
|
||||
<div class="container">
|
||||
<SectionIntro title="Ein Betrieb mit Geschichte" text="Aus einem kleinen Dachdeckerbetrieb wurde ein großes Familienunternehmen mit gewachsener Verantwortung." />
|
||||
<div class="timeline">
|
||||
{timeline.slice(0, 6).map(([year, text]) => (
|
||||
<div class="timeline-item">
|
||||
<div class="timeline-year">{year}</div>
|
||||
<p>{text}</p>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section alt">
|
||||
<div class="container">
|
||||
<SectionIntro title="Materialpartner" text="Bei Dachfenstern, Dachsteinen, Abdichtung und Metall setzt Heidrich auf bewährte Hersteller." />
|
||||
<div class="partner-grid">
|
||||
{partners.map((partner) => (
|
||||
<a href={partner.href} target="_blank" rel="noreferrer">
|
||||
<img src={partner.logo} alt={partner.name} loading="lazy" />
|
||||
</a>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</BaseLayout>
|
||||
@@ -0,0 +1,73 @@
|
||||
---
|
||||
import BaseLayout from "../../layouts/BaseLayout.astro";
|
||||
import PageHero from "../../components/PageHero.astro";
|
||||
import ContactPanel from "../../components/ContactPanel.astro";
|
||||
import { jobs } from "../../data/site";
|
||||
|
||||
export function getStaticPaths() {
|
||||
return jobs.flatMap((job) => {
|
||||
const paths = [job.slug, ...job.aliases];
|
||||
return paths.map((slug) => ({
|
||||
params: { slug },
|
||||
props: { job, slug },
|
||||
}));
|
||||
});
|
||||
}
|
||||
|
||||
const { job, slug } = Astro.props;
|
||||
const isAlias = slug !== job.slug;
|
||||
---
|
||||
|
||||
<BaseLayout
|
||||
title={job.title}
|
||||
description={`${job.title} bei der Heinz Heidrich GmbH in Tostedt. Start: ${job.start}.`}
|
||||
canonical={`/job/${job.slug}/`}
|
||||
noindex={isAlias}
|
||||
>
|
||||
<PageHero
|
||||
title={job.title}
|
||||
kicker="Stellenangebot"
|
||||
text={job.intro}
|
||||
image={job.image}
|
||||
alt=""
|
||||
/>
|
||||
|
||||
<section class="section">
|
||||
<div class="container job-layout">
|
||||
<article class="job-content">
|
||||
<div class="job-hero">
|
||||
<img src={job.image} alt="" width="1000" height="400" />
|
||||
</div>
|
||||
|
||||
<section class="copy-stack">
|
||||
<h2>Über uns</h2>
|
||||
<p>Sie sind auf der Suche nach beruflicher Veränderung? Dann melden Sie sich, um Teil unseres Teams zu werden.</p>
|
||||
<p>Die Firma Heinz Heidrich GmbH wurde 1963 vom Dachdeckermeister Heinz Heidrich gegründet. Das Geschäft wird seit 1995 von Christian und Heiner Heidrich weitergeführt, beide Dachdecker- und Klempnermeister. Seit Gründung des Betriebes wird besonderer Wert auf solide und qualitativ hochwertige Arbeiten gelegt.</p>
|
||||
<p>Unser Arbeitsbereich erstreckt sich auf den Großraum Hamburg, Schleswig-Holstein und Niedersachsen.</p>
|
||||
</section>
|
||||
|
||||
<section class="copy-stack">
|
||||
<h2>Qualifikationen und Anforderungen</h2>
|
||||
<ul class="check-list">
|
||||
{job.requirements.map((item) => <li>{item}</li>)}
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
<section class="copy-stack">
|
||||
<h2>Was wir bieten</h2>
|
||||
<ul class="check-list">
|
||||
{job.benefits.map((item) => <li>{item}</li>)}
|
||||
</ul>
|
||||
</section>
|
||||
</article>
|
||||
|
||||
<div class="sticky-side">
|
||||
<ContactPanel
|
||||
application
|
||||
title="Jetzt bewerben"
|
||||
text="Ansprechpartner: Christian und Heiner Heidrich. Schicken Sie uns Ihre Bewerbung gern per E-Mail."
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</BaseLayout>
|
||||
@@ -0,0 +1,5 @@
|
||||
---
|
||||
import RedirectPage from "../../components/RedirectPage.astro";
|
||||
---
|
||||
|
||||
<RedirectPage to="/jobs-dachdeckermeister/" title="Meister gesucht" />
|
||||
@@ -0,0 +1,51 @@
|
||||
---
|
||||
import BaseLayout from "../layouts/BaseLayout.astro";
|
||||
import PageHero from "../components/PageHero.astro";
|
||||
import ContactPanel from "../components/ContactPanel.astro";
|
||||
import { masterJob } from "../data/site";
|
||||
---
|
||||
|
||||
<BaseLayout title="Meister gesucht" description="Dachdeckermeister/in bei der Heinz Heidrich GmbH in Tostedt gesucht. Kundenbetreuung, Angebote, Baustellenorganisation und Teamplanung.">
|
||||
<PageHero
|
||||
title="Meister gesucht"
|
||||
kicker="Dachdeckermeister/in (m/w/d)"
|
||||
text={masterJob.intro}
|
||||
image="/assets/img/kompetenzteam-kran.jpg"
|
||||
alt="Mitarbeiter der Heinz Heidrich GmbH vor einem Kran"
|
||||
/>
|
||||
|
||||
<section class="section">
|
||||
<div class="container job-layout">
|
||||
<article class="job-content">
|
||||
<section class="copy-stack">
|
||||
<h2>Aufgabenbereiche</h2>
|
||||
<ul class="check-list">
|
||||
{masterJob.tasks.map((item) => <li>{item}</li>)}
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
<section class="copy-stack">
|
||||
<h2>Voraussetzungen</h2>
|
||||
<ul class="check-list">
|
||||
{masterJob.requirements.map((item) => <li>{item}</li>)}
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
<section class="copy-stack">
|
||||
<h2>Wir bieten</h2>
|
||||
<ul class="check-list">
|
||||
{masterJob.benefits.map((item) => <li>{item}</li>)}
|
||||
</ul>
|
||||
</section>
|
||||
</article>
|
||||
|
||||
<div class="sticky-side">
|
||||
<ContactPanel
|
||||
application
|
||||
title="Direkt bewerben"
|
||||
text="Schicken Sie Ihre Bewerbung oder erste Fragen gerne per E-Mail an uns."
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</BaseLayout>
|
||||
@@ -0,0 +1,65 @@
|
||||
---
|
||||
import BaseLayout from "../layouts/BaseLayout.astro";
|
||||
import PageHero from "../components/PageHero.astro";
|
||||
import SectionIntro from "../components/SectionIntro.astro";
|
||||
import ContactPanel from "../components/ContactPanel.astro";
|
||||
import { jobs, masterJob } from "../data/site";
|
||||
---
|
||||
|
||||
<BaseLayout title="Jobs" description="Aktuelle Stellenangebote und Ausbildungsplätze bei der Heinz Heidrich GmbH in Tostedt. Dachdecker, Dachklempner, Zimmerer und Ausbildung.">
|
||||
<PageHero
|
||||
title="Jobs"
|
||||
kicker="Arbeiten im Handwerk"
|
||||
text="Ein großes Team, moderne Technik und Baustellen im Großraum Hamburg, Schleswig-Holstein und Niedersachsen."
|
||||
image="/assets/img/jobs-team.jpg"
|
||||
alt="Mitarbeiter der Heinz Heidrich GmbH auf einer Baustelle"
|
||||
/>
|
||||
|
||||
<section class="section">
|
||||
<div class="container">
|
||||
<SectionIntro title="Aktuelle Stellenangebote" text="Wir suchen Fachkräfte und Auszubildende, die gerne draußen arbeiten und Teil eines gewachsenen Teams werden wollen." />
|
||||
<div class="job-grid">
|
||||
<article class="job-card featured">
|
||||
<h3>{masterJob.title}</h3>
|
||||
<p>{masterJob.intro}</p>
|
||||
<div class="job-meta">
|
||||
<span>Tostedt</span>
|
||||
<span>Nächstmöglich</span>
|
||||
</div>
|
||||
<a class="button primary" href={masterJob.href}>Ansehen</a>
|
||||
</article>
|
||||
{jobs.map((job) => (
|
||||
<article class="job-card">
|
||||
<h3>{job.title}</h3>
|
||||
<p>{job.intro}</p>
|
||||
<div class="job-meta">
|
||||
<span>{job.location}</span>
|
||||
<span>{job.start}</span>
|
||||
</div>
|
||||
<a class="button secondary" href={`/job/${job.slug}/`}>Ansehen</a>
|
||||
</article>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section alt">
|
||||
<div class="container split-grid">
|
||||
<div class="copy-stack">
|
||||
<h2>Warum Heidrich?</h2>
|
||||
<p>Dem qualifizierten Team stehen moderne Maschinen und Werkzeuge zur Ausführung der Arbeiten zur Verfügung. In jedem Ausbildungsjahr bietet Heidrich bis zu drei Ausbildungsplätze im Dachdecker- und Klempnerhandwerk an.</p>
|
||||
<ul class="check-list">
|
||||
<li>Familiäres Miteinander in einem Traditionsbetrieb</li>
|
||||
<li>Baustellenvielfalt von Einfamilienhaus bis Industrieprojekt</li>
|
||||
<li>Fachliche Weiterbildung und hochwertige Arbeitsmittel</li>
|
||||
<li>Gute Perspektiven nach erfolgreicher Ausbildung</li>
|
||||
</ul>
|
||||
</div>
|
||||
<ContactPanel
|
||||
application
|
||||
title="Bewerbung schicken"
|
||||
text="Schreiben Sie uns kurz, für welche Stelle Sie sich interessieren. Unterlagen können per E-Mail folgen."
|
||||
/>
|
||||
</div>
|
||||
</section>
|
||||
</BaseLayout>
|
||||
@@ -0,0 +1,5 @@
|
||||
---
|
||||
import RedirectPage from "../../components/RedirectPage.astro";
|
||||
---
|
||||
|
||||
<RedirectPage to="/jobs/" title="Bewerbung" />
|
||||
@@ -0,0 +1,50 @@
|
||||
---
|
||||
import BaseLayout from "../layouts/BaseLayout.astro";
|
||||
import PageHero from "../components/PageHero.astro";
|
||||
import { site } from "../data/site";
|
||||
---
|
||||
|
||||
<BaseLayout title="Kontakt" description="Kontakt zur Heinz Heidrich GmbH in Tostedt: Telefon, E-Mail, Adresse und Anfahrt.">
|
||||
<PageHero
|
||||
title="Kontakt"
|
||||
kicker="Heinz Heidrich GmbH"
|
||||
text="Rufen Sie uns an oder schreiben Sie eine E-Mail. Wir melden uns direkt aus Tostedt."
|
||||
/>
|
||||
|
||||
<section class="section">
|
||||
<div class="container split-grid">
|
||||
<dl class="info-table">
|
||||
<div>
|
||||
<dt>Adresse</dt>
|
||||
<dd>{site.name}<br />{site.address[0]}<br />{site.address[1]}</dd>
|
||||
</div>
|
||||
<div>
|
||||
<dt>Postadresse</dt>
|
||||
<dd>{site.name}<br />{site.postalAddress[0]}<br />{site.postalAddress[1]}</dd>
|
||||
</div>
|
||||
<div>
|
||||
<dt>Telefon</dt>
|
||||
<dd><a href={site.phoneHref}>{site.phone}</a></dd>
|
||||
</div>
|
||||
<div>
|
||||
<dt>Telefax</dt>
|
||||
<dd>{site.fax}</dd>
|
||||
</div>
|
||||
<div>
|
||||
<dt>E-Mail</dt>
|
||||
<dd><a href={`mailto:${site.email}`}>{site.email}</a></dd>
|
||||
</div>
|
||||
</dl>
|
||||
|
||||
<div class="embed-link-box">
|
||||
<p class="label">Anfahrt</p>
|
||||
<h2>So finden Sie zu uns</h2>
|
||||
<p>Die interaktive Karte öffnet extern bei Google Maps.</p>
|
||||
<div class="inline-actions">
|
||||
<a class="button primary" href={site.mapsUrl} target="_blank" rel="noreferrer">Route öffnen</a>
|
||||
<a class="button secondary" href={`mailto:${site.email}`}>E-Mail schreiben</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</BaseLayout>
|
||||
@@ -0,0 +1,75 @@
|
||||
---
|
||||
import BaseLayout from "../layouts/BaseLayout.astro";
|
||||
import PageHero from "../components/PageHero.astro";
|
||||
import SectionIntro from "../components/SectionIntro.astro";
|
||||
import ContactPanel from "../components/ContactPanel.astro";
|
||||
import { services } from "../data/site";
|
||||
---
|
||||
|
||||
<BaseLayout title="Leistungen" description="Dacheindeckung, Dachsanierung, Flachdach, Dachklempnerei, Photovoltaik, Wartung und Reparatur von der Heinz Heidrich GmbH in Tostedt.">
|
||||
<PageHero
|
||||
title="Leistungen"
|
||||
kicker="Dach, Fassade und Entwässerung"
|
||||
text="Fachmännische Planung und Ausführung für private, gewerbliche und öffentliche Bauvorhaben."
|
||||
image="/assets/img/dacheindeckung-baustelle.jpg"
|
||||
alt="Dachdeckerarbeiten an einem Steildach"
|
||||
/>
|
||||
|
||||
<section class="section">
|
||||
<div class="container">
|
||||
<SectionIntro title="Alles, was ein Dach dauerhaft schützt" text="Heidrich verbindet klassische Handwerkstechniken mit modernen Materialien, aktueller Bauphysik und sauberer Baustellenorganisation." />
|
||||
<div class="service-grid">
|
||||
{services.map((service) => (
|
||||
<article class="service-card">
|
||||
<img src={service.image} alt="" loading="lazy" width="895" height="665" />
|
||||
<div class="service-card-content">
|
||||
<h3>{service.title}</h3>
|
||||
<p>{service.text}</p>
|
||||
</div>
|
||||
</article>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section alt">
|
||||
<div class="container split-grid">
|
||||
<div class="copy-stack">
|
||||
<h2>Dachsanierung mit Blick auf Energie und Förderung.</h2>
|
||||
<p>Bei Sanierungen geht es nicht nur um neue Deckung. Es geht um Substanz, Dämmung, Feuchtigkeitsschutz und die passende technische Lösung für das jeweilige Gebäude.</p>
|
||||
<p>Die Fachkräfte beraten zu sinnvollen Maßnahmen und unterstützen bei der Nutzung von Fördermöglichkeiten für energetische Sanierungen.</p>
|
||||
</div>
|
||||
<figure class="feature-image">
|
||||
<img src="/assets/img/dachsanierung-hamburg.jpg" alt="Sanierungsarbeiten an einem Dach in Hamburg" loading="lazy" width="895" height="665" />
|
||||
</figure>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section">
|
||||
<div class="container split-grid reverse">
|
||||
<figure class="feature-image">
|
||||
<img src="/assets/img/klempnerei-detail.jpg" alt="Detailarbeiten am Dach" loading="lazy" width="895" height="665" />
|
||||
</figure>
|
||||
<div class="copy-stack">
|
||||
<h2>Service für Wartung, Reinigung und Reparatur.</h2>
|
||||
<p>Neben den üblichen Dachdecker- und Klempnerarbeiten bietet Heidrich Dachrinnenreinigung, Wartungsverträge und Reparaturen rund um Dach, Fassade und Entwässerung an.</p>
|
||||
<ul class="check-list">
|
||||
<li>Kontrolle und Wartung von Dachflächen</li>
|
||||
<li>Reinigung von Dachrinnen und Entwässerung</li>
|
||||
<li>Reparatur bei Sturm- und Wasserschäden</li>
|
||||
<li>Abstimmung von Material, Farbe und Ausführung</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section field">
|
||||
<div class="container split-grid">
|
||||
<div class="copy-stack">
|
||||
<h2>Projekt besprechen?</h2>
|
||||
<p>Ein Anruf reicht für den ersten Schritt. Danach klären wir Umfang, Ort, Zeitfenster und die nächsten sinnvollen Maßnahmen.</p>
|
||||
</div>
|
||||
<ContactPanel />
|
||||
</div>
|
||||
</section>
|
||||
</BaseLayout>
|
||||
@@ -0,0 +1,5 @@
|
||||
---
|
||||
import RedirectPage from "../components/RedirectPage.astro";
|
||||
---
|
||||
|
||||
<RedirectPage to="/kontakt/" title="Kontakt" />
|
||||
@@ -0,0 +1,38 @@
|
||||
---
|
||||
import BaseLayout from "../layouts/BaseLayout.astro";
|
||||
import PageHero from "../components/PageHero.astro";
|
||||
---
|
||||
|
||||
<BaseLayout title="Jeden Tag in luftiger Höhe" description="Artikel über Niklas Weber, seine Ausbildung im Dachdeckerhandwerk und seine Laufbahn bei der Heinz Heidrich GmbH.">
|
||||
<PageHero
|
||||
title="Jeden Tag in luftiger Höhe"
|
||||
kicker="Ausbildung im Handwerk"
|
||||
text="Niklas Weber zeigt, wie vielseitig eine Ausbildung im Dachdeckerhandwerk sein kann."
|
||||
image="/assets/img/job-ausbildung.jpg"
|
||||
alt="Dachdeckermeister Niklas Weber"
|
||||
/>
|
||||
|
||||
<section class="section">
|
||||
<article class="container article">
|
||||
<p>Das Handwerk hat goldenen Boden. Dieser alte Spruch passt gut zur heutigen Zeit: Wer eine Ausbildung im Dachdeckerhandwerk macht, entscheidet sich für einen Beruf mit Zukunft.</p>
|
||||
<p>Niklas Weber hat nach dem Realschulabschluss eine dreijährige Ausbildung zum Dachdecker gemacht und damit den Grundstein für seine berufliche Karriere im Handwerk gelegt.</p>
|
||||
|
||||
<h2>Ausbildung mit Baustellenvielfalt</h2>
|
||||
<p>Durch die Unterstützung seines Ausbilders Richard Nick sammelte Niklas früh praktische Erfahrung auf sehr unterschiedlichen Baustellen. Er war nicht nur auf Dächern von Einfamilienhäusern unterwegs, sondern auch auf großen Industriekomplexen in Hamburg.</p>
|
||||
<p>Diese Vielfalt gab ihm die Sicherheit, die er für seine Abschlussprüfung brauchte. Bei der Gesellenprüfung der Hamburger Dachdeckerinnung erreichte er die höchste Punktzahl aller teilnehmenden Auszubildenden und wurde Landessieger.</p>
|
||||
|
||||
<figure class="article-image">
|
||||
<img src="/assets/img/job-zimmerer.jpg" alt="Luftaufnahme eines von Heidrich gedeckten Daches" loading="lazy" width="1000" height="400" />
|
||||
</figure>
|
||||
|
||||
<h2>Gute Perspektiven</h2>
|
||||
<p>Nach der Ausbildung ist für viele noch lange nicht Schluss. Weiterbildung, Meisterschule und Spezialisierung sind im Dachdeckerhandwerk realistische Wege.</p>
|
||||
<p>Ein reiner Männerberuf ist das Dachdeckerhandwerk längst nicht mehr. Bewerbungen für Praktikum, Ausbildung oder Gesellenstelle sind willkommen.</p>
|
||||
|
||||
<div class="inline-actions">
|
||||
<a class="button primary" href="/jobs/">Zu den Jobs</a>
|
||||
<a class="button secondary" href="mailto:bewerbung@heidrich-bedachung.de">Bewerbung schreiben</a>
|
||||
</div>
|
||||
</article>
|
||||
</section>
|
||||
</BaseLayout>
|
||||
@@ -0,0 +1,5 @@
|
||||
---
|
||||
import RedirectPage from "../components/RedirectPage.astro";
|
||||
---
|
||||
|
||||
<RedirectPage to="/" title="Startseite" />
|
||||
@@ -0,0 +1,40 @@
|
||||
---
|
||||
import BaseLayout from "../layouts/BaseLayout.astro";
|
||||
import PageHero from "../components/PageHero.astro";
|
||||
import SectionIntro from "../components/SectionIntro.astro";
|
||||
import ContactPanel from "../components/ContactPanel.astro";
|
||||
import { references } from "../data/site";
|
||||
---
|
||||
|
||||
<BaseLayout title="Referenzen" description="Auswahl an Referenzen der Heinz Heidrich GmbH aus Tostedt, darunter New Beiersdorf Campus, Hafencity, Kampnagel, Laeiszhalle und Schulgebäude.">
|
||||
<PageHero
|
||||
title="Referenzen"
|
||||
kicker="Private, gewerbliche und öffentliche Projekte"
|
||||
text="Eine Auswahl an Bauvorhaben, bei denen Heidrich Dach- und Klempnerarbeiten umgesetzt hat."
|
||||
image="/assets/img/flachdach-arbeit.jpg"
|
||||
alt="Arbeiten an einem großen Flachdach"
|
||||
/>
|
||||
|
||||
<section class="section">
|
||||
<div class="container">
|
||||
<SectionIntro title="Ausgewählte Projekte" text="Die Bandbreite reicht von Kultur- und Schulgebäuden bis zu Gewerbe- und Stadtentwicklungsprojekten." />
|
||||
<div class="reference-grid">
|
||||
{references.map((reference) => (
|
||||
<article class="reference-card">
|
||||
<h2>{reference}</h2>
|
||||
</article>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section alt">
|
||||
<div class="container split-grid">
|
||||
<div class="copy-stack">
|
||||
<h2>Solide Ausführung für anspruchsvolle Baustellen.</h2>
|
||||
<p>Je nach Objekt koordiniert Heidrich Dacheindeckung, Abdichtung, Fassadenbekleidung, Klempnerarbeiten, Wartung oder Reparatur. Entscheidend sind saubere Planung, verlässliche Ausführung und die passenden Materialien.</p>
|
||||
</div>
|
||||
<ContactPanel title="Projekt anfragen" text="Erzählen Sie uns kurz, worum es geht. Wir melden uns mit den nächsten Schritten." />
|
||||
</div>
|
||||
</section>
|
||||
</BaseLayout>
|
||||
@@ -0,0 +1,11 @@
|
||||
import { site } from "../data/site";
|
||||
|
||||
export function GET() {
|
||||
return new Response(`User-agent: *
|
||||
Allow: /
|
||||
|
||||
Sitemap: ${site.url}/sitemap.xml
|
||||
`, {
|
||||
headers: { "Content-Type": "text/plain; charset=utf-8" },
|
||||
});
|
||||
}
|
||||
@@ -0,0 +1,38 @@
|
||||
import { jobs, site } from "../data/site";
|
||||
|
||||
const paths = [
|
||||
"/",
|
||||
"/das-unternehmen/",
|
||||
"/leistungen/",
|
||||
"/referenzen/",
|
||||
"/downloads/",
|
||||
"/jobs/",
|
||||
"/kontakt/",
|
||||
"/velux/",
|
||||
"/datenverarbeitung-velux/",
|
||||
"/impressum/",
|
||||
"/datenschutzerklaerung/",
|
||||
"/jobs-dachdeckermeister/",
|
||||
"/60-jahre-heinz-heidrich-gmbh/",
|
||||
"/niklas/",
|
||||
...jobs.map((job) => `/job/${job.slug}/`),
|
||||
];
|
||||
|
||||
export function GET() {
|
||||
const body = `<?xml version="1.0" encoding="UTF-8"?>
|
||||
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
|
||||
${paths
|
||||
.map(
|
||||
(path) => ` <url>
|
||||
<loc>${site.url}${path}</loc>
|
||||
<changefreq>monthly</changefreq>
|
||||
<priority>${path === "/" ? "1.0" : "0.8"}</priority>
|
||||
</url>`,
|
||||
)
|
||||
.join("\n")}
|
||||
</urlset>`;
|
||||
|
||||
return new Response(body, {
|
||||
headers: { "Content-Type": "application/xml; charset=utf-8" },
|
||||
});
|
||||
}
|
||||
@@ -0,0 +1,5 @@
|
||||
---
|
||||
import RedirectPage from "../components/RedirectPage.astro";
|
||||
---
|
||||
|
||||
<RedirectPage to="/" title="Startseite" />
|
||||
@@ -0,0 +1,49 @@
|
||||
---
|
||||
import BaseLayout from "../layouts/BaseLayout.astro";
|
||||
import PageHero from "../components/PageHero.astro";
|
||||
import ContactPanel from "../components/ContactPanel.astro";
|
||||
|
||||
const configuratorUrl = "https://dachfensterkonfigurator.velux.de/konfigurator?embed=true&id=10038184";
|
||||
const bookingUrl = "https://installer-leads.velux.de/booking-form/Heinz%20Heidrich%20GmbH/21255/Tostedt";
|
||||
---
|
||||
|
||||
<BaseLayout title="VELUX Dachfenster-Konfigurator" description="VELUX Dachfenster-Konfigurator und VELUX@Home Beratung mit der Heinz Heidrich GmbH aus Tostedt.">
|
||||
<PageHero
|
||||
title="VELUX Dachfenster"
|
||||
kicker="Konfigurator und Beratung"
|
||||
text="Planen Sie Ihre Dachfensterlösung und sprechen Sie anschliessend mit dem Heidrich-Team in Tostedt."
|
||||
image="/assets/img/firmengelaende-blaues-dach.jpg"
|
||||
alt="Firmengelände mit vielen Dachfenstern"
|
||||
/>
|
||||
|
||||
<section class="section">
|
||||
<div class="container split-grid">
|
||||
<div class="embed-link-box">
|
||||
<p class="label">VELUX Konfigurator</p>
|
||||
<h2>Dachfensterlösung konfigurieren</h2>
|
||||
<p>Der Konfigurator öffnet direkt bei VELUX. Dort können Sie mehrere Schritte durchlaufen, eine unverbindliche Preisindikation erhalten und bei Bedarf ein Angebot anfragen.</p>
|
||||
<div class="inline-actions">
|
||||
<a class="button primary" href={configuratorUrl} target="_blank" rel="noreferrer">Konfigurator öffnen</a>
|
||||
<a class="button secondary" href="/datenverarbeitung-velux/">Datenhinweis lesen</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="embed-link-box">
|
||||
<p class="label">VELUX@Home</p>
|
||||
<h2>Kostenfreie Tageslichtberatung</h2>
|
||||
<p>Wenn Sie eine Beratung mit einem Tageslichtberater wünschen, nutzen Sie das externe VELUX Buchungsformular.</p>
|
||||
<a class="button secondary" href={bookingUrl} target="_blank" rel="noreferrer">Beratung buchen</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section alt">
|
||||
<div class="container split-grid">
|
||||
<div class="copy-stack">
|
||||
<h2>Dachfenster fachgerecht einbauen lassen.</h2>
|
||||
<p>Heidrich unterstützt bei Planung, Einbau und Abstimmung mit der Dachkonstruktion, damit Licht, Lüftung und Wetterdichtigkeit zusammenpassen.</p>
|
||||
</div>
|
||||
<ContactPanel title="Fragen zu VELUX?" text="Rufen Sie uns an oder schreiben Sie kurz, welches Dachfensterprojekt geplant ist." />
|
||||
</div>
|
||||
</section>
|
||||
</BaseLayout>
|
||||
@@ -0,0 +1,958 @@
|
||||
:root {
|
||||
color-scheme: light dark;
|
||||
--surface: #fbfaf7;
|
||||
--surface-raised: #f2f5f7;
|
||||
--surface-strong: #e8eef2;
|
||||
--text: #202327;
|
||||
--muted: #5c6670;
|
||||
--soft: #d7dde2;
|
||||
--accent: #0b699f;
|
||||
--accent-strong: #084b72;
|
||||
--accent-soft: #dcecf4;
|
||||
--field: #ece6da;
|
||||
--radius: 8px;
|
||||
--shadow: 0 18px 45px rgb(22 38 50 / 0.14);
|
||||
--container: 1160px;
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:root {
|
||||
--surface: #17191c;
|
||||
--surface-raised: #20262a;
|
||||
--surface-strong: #2a3338;
|
||||
--text: #f1f4f5;
|
||||
--muted: #bbc5ca;
|
||||
--soft: #3e4a51;
|
||||
--accent: #6db9df;
|
||||
--accent-strong: #a5d8ef;
|
||||
--accent-soft: #18313e;
|
||||
--field: #25211c;
|
||||
--shadow: 0 18px 45px rgb(0 0 0 / 0.34);
|
||||
}
|
||||
}
|
||||
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
html {
|
||||
scroll-behavior: smooth;
|
||||
background: var(--surface);
|
||||
}
|
||||
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
html {
|
||||
scroll-behavior: auto;
|
||||
}
|
||||
|
||||
*,
|
||||
*::before,
|
||||
*::after {
|
||||
animation-duration: 0.001ms !important;
|
||||
animation-iteration-count: 1 !important;
|
||||
transition-duration: 0.001ms !important;
|
||||
}
|
||||
}
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
min-width: 320px;
|
||||
background: var(--surface);
|
||||
color: var(--text);
|
||||
font-size: 16px;
|
||||
line-height: 1.6;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
}
|
||||
|
||||
img {
|
||||
display: block;
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
a {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
a:focus-visible,
|
||||
button:focus-visible,
|
||||
summary:focus-visible {
|
||||
outline: 3px solid var(--accent);
|
||||
outline-offset: 4px;
|
||||
}
|
||||
|
||||
::selection {
|
||||
background: var(--accent);
|
||||
color: #f8faf9;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
p {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3 {
|
||||
line-height: 1.08;
|
||||
letter-spacing: 0;
|
||||
}
|
||||
|
||||
p {
|
||||
color: var(--muted);
|
||||
}
|
||||
|
||||
.skip-link {
|
||||
position: absolute;
|
||||
left: 1rem;
|
||||
top: 1rem;
|
||||
z-index: 20;
|
||||
transform: translateY(-140%);
|
||||
border-radius: var(--radius);
|
||||
background: var(--text);
|
||||
color: var(--surface);
|
||||
padding: 0.7rem 1rem;
|
||||
}
|
||||
|
||||
.skip-link:focus {
|
||||
transform: translateY(0);
|
||||
}
|
||||
|
||||
.container {
|
||||
width: min(calc(100% - 2rem), var(--container));
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.site-header {
|
||||
position: sticky;
|
||||
top: 0;
|
||||
z-index: 10;
|
||||
background: color-mix(in srgb, var(--surface) 88%, transparent);
|
||||
border-bottom: 1px solid var(--soft);
|
||||
backdrop-filter: blur(18px);
|
||||
}
|
||||
|
||||
.header-inner {
|
||||
width: min(calc(100% - 2rem), 1260px);
|
||||
min-height: 72px;
|
||||
margin: 0 auto;
|
||||
display: grid;
|
||||
grid-template-columns: auto 1fr auto auto;
|
||||
align-items: center;
|
||||
gap: 1.25rem;
|
||||
}
|
||||
|
||||
.brand img {
|
||||
width: 228px;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.desktop-nav {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
gap: clamp(0.8rem, 1.8vw, 1.6rem);
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.desktop-nav a,
|
||||
.footer-nav a,
|
||||
.mobile-nav-panel a {
|
||||
color: var(--muted);
|
||||
font-weight: 700;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.desktop-nav a:hover,
|
||||
.footer-nav a:hover,
|
||||
.mobile-nav-panel a:hover {
|
||||
color: var(--accent-strong);
|
||||
}
|
||||
|
||||
.nav-call {
|
||||
border: 1px solid var(--soft);
|
||||
border-radius: 999px;
|
||||
color: var(--accent-strong);
|
||||
font-weight: 800;
|
||||
padding: 0.55rem 0.9rem;
|
||||
text-decoration: none;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.mobile-nav {
|
||||
display: none;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.mobile-nav summary {
|
||||
cursor: pointer;
|
||||
list-style: none;
|
||||
border: 1px solid var(--soft);
|
||||
border-radius: 999px;
|
||||
padding: 0.55rem 0.9rem;
|
||||
font-weight: 800;
|
||||
}
|
||||
|
||||
.mobile-nav summary::-webkit-details-marker {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.mobile-nav-panel {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: calc(100% + 0.7rem);
|
||||
width: min(76vw, 280px);
|
||||
display: grid;
|
||||
gap: 0.25rem;
|
||||
border: 1px solid var(--soft);
|
||||
border-radius: var(--radius);
|
||||
background: var(--surface);
|
||||
box-shadow: var(--shadow);
|
||||
padding: 0.7rem;
|
||||
}
|
||||
|
||||
.mobile-nav-panel a {
|
||||
border-radius: 6px;
|
||||
padding: 0.7rem;
|
||||
}
|
||||
|
||||
.button {
|
||||
display: inline-flex;
|
||||
min-height: 44px;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-radius: 6px;
|
||||
padding: 0.75rem 1rem;
|
||||
font-weight: 800;
|
||||
text-decoration: none;
|
||||
transition: transform 180ms ease, background-color 180ms ease, color 180ms ease, border-color 180ms ease;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.button:active {
|
||||
transform: translateY(1px);
|
||||
}
|
||||
|
||||
.button.primary {
|
||||
background: var(--accent-strong);
|
||||
color: #f8faf9;
|
||||
}
|
||||
|
||||
.button.primary:hover {
|
||||
background: var(--accent);
|
||||
}
|
||||
|
||||
.button.secondary {
|
||||
border: 1px solid var(--soft);
|
||||
color: var(--text);
|
||||
background: color-mix(in srgb, var(--surface) 70%, var(--surface-raised));
|
||||
}
|
||||
|
||||
.button.secondary:hover {
|
||||
border-color: var(--accent);
|
||||
color: var(--accent-strong);
|
||||
}
|
||||
|
||||
.label {
|
||||
color: var(--accent-strong);
|
||||
font-size: 0.92rem;
|
||||
font-weight: 800;
|
||||
}
|
||||
|
||||
.lead {
|
||||
color: var(--muted);
|
||||
font-size: clamp(1.05rem, 2vw, 1.25rem);
|
||||
max-width: 62ch;
|
||||
}
|
||||
|
||||
.hero {
|
||||
min-height: calc(100dvh - 72px);
|
||||
display: grid;
|
||||
align-items: center;
|
||||
padding: clamp(3rem, 6vw, 5rem) 0;
|
||||
}
|
||||
|
||||
.hero-grid {
|
||||
display: grid;
|
||||
grid-template-columns: minmax(0, 0.92fr) minmax(320px, 1.08fr);
|
||||
gap: clamp(2rem, 5vw, 5rem);
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.hero-copy {
|
||||
display: grid;
|
||||
gap: 1.35rem;
|
||||
}
|
||||
|
||||
.hero h1,
|
||||
.page-hero h1 {
|
||||
max-width: 11ch;
|
||||
font-size: clamp(3rem, 7vw, 5.7rem);
|
||||
font-weight: 900;
|
||||
}
|
||||
|
||||
.hero h1 span {
|
||||
color: var(--accent-strong);
|
||||
}
|
||||
|
||||
.hero-actions,
|
||||
.footer-actions,
|
||||
.contact-actions,
|
||||
.inline-actions {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 0.8rem;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.hero-media {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.hero-media img,
|
||||
.page-hero-image img,
|
||||
.feature-image img,
|
||||
.article-image img,
|
||||
.job-hero img {
|
||||
width: 100%;
|
||||
border-radius: var(--radius);
|
||||
box-shadow: var(--shadow);
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
.hero-media img {
|
||||
aspect-ratio: 4 / 3;
|
||||
}
|
||||
|
||||
.stats-strip {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
border-top: 1px solid var(--soft);
|
||||
border-bottom: 1px solid var(--soft);
|
||||
background: var(--surface-raised);
|
||||
}
|
||||
|
||||
.stat {
|
||||
padding: clamp(1rem, 3vw, 1.75rem);
|
||||
border-right: 1px solid var(--soft);
|
||||
}
|
||||
|
||||
.stat:last-child {
|
||||
border-right: 0;
|
||||
}
|
||||
|
||||
.stat strong {
|
||||
display: block;
|
||||
color: var(--text);
|
||||
font-size: clamp(1.8rem, 4vw, 3rem);
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.stat span {
|
||||
color: var(--muted);
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.section {
|
||||
padding: clamp(4rem, 8vw, 7rem) 0;
|
||||
}
|
||||
|
||||
.section.alt {
|
||||
background: var(--surface-raised);
|
||||
}
|
||||
|
||||
.section.field {
|
||||
background: var(--field);
|
||||
}
|
||||
|
||||
.section-intro {
|
||||
display: grid;
|
||||
gap: 1rem;
|
||||
max-width: 760px;
|
||||
margin-bottom: clamp(2rem, 4vw, 3rem);
|
||||
}
|
||||
|
||||
.section-intro h2 {
|
||||
font-size: clamp(2rem, 4.8vw, 4rem);
|
||||
font-weight: 900;
|
||||
}
|
||||
|
||||
.section-intro p {
|
||||
font-size: 1.08rem;
|
||||
}
|
||||
|
||||
.service-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(6, 1fr);
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.service-card {
|
||||
display: grid;
|
||||
grid-template-rows: auto 1fr;
|
||||
grid-column: span 2;
|
||||
min-height: 100%;
|
||||
overflow: hidden;
|
||||
border: 1px solid var(--soft);
|
||||
border-radius: var(--radius);
|
||||
background: var(--surface);
|
||||
}
|
||||
|
||||
.service-card:nth-child(1),
|
||||
.service-card:nth-child(4) {
|
||||
grid-column: span 3;
|
||||
}
|
||||
|
||||
.service-card:nth-child(6) {
|
||||
grid-column: span 3;
|
||||
}
|
||||
|
||||
.service-card img {
|
||||
width: 100%;
|
||||
aspect-ratio: 16 / 10;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
.service-card-content {
|
||||
display: grid;
|
||||
gap: 0.75rem;
|
||||
padding: 1.15rem;
|
||||
}
|
||||
|
||||
.service-card h3,
|
||||
.job-card h3,
|
||||
.download-row h2,
|
||||
.reference-card h2 {
|
||||
color: var(--text);
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
|
||||
.split-grid {
|
||||
display: grid;
|
||||
grid-template-columns: minmax(0, 0.95fr) minmax(320px, 1.05fr);
|
||||
gap: clamp(2rem, 5vw, 5rem);
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.split-grid.reverse {
|
||||
grid-template-columns: minmax(320px, 1.05fr) minmax(0, 0.95fr);
|
||||
}
|
||||
|
||||
.copy-stack {
|
||||
display: grid;
|
||||
gap: 1.1rem;
|
||||
}
|
||||
|
||||
.copy-stack h2 {
|
||||
font-size: clamp(2rem, 4.5vw, 3.8rem);
|
||||
font-weight: 900;
|
||||
}
|
||||
|
||||
.copy-stack h3 {
|
||||
font-size: 1.2rem;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.plain-list,
|
||||
.check-list {
|
||||
display: grid;
|
||||
gap: 0.75rem;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.plain-list li,
|
||||
.check-list li {
|
||||
color: var(--muted);
|
||||
}
|
||||
|
||||
.check-list li {
|
||||
position: relative;
|
||||
padding-left: 1.35rem;
|
||||
}
|
||||
|
||||
.check-list li::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0.62em;
|
||||
width: 0.48rem;
|
||||
height: 0.48rem;
|
||||
border-radius: 2px;
|
||||
background: var(--accent);
|
||||
}
|
||||
|
||||
.timeline {
|
||||
display: grid;
|
||||
gap: 0;
|
||||
border-top: 1px solid var(--soft);
|
||||
}
|
||||
|
||||
.timeline-item {
|
||||
display: grid;
|
||||
grid-template-columns: 140px 1fr;
|
||||
gap: 1.5rem;
|
||||
padding: 1.2rem 0;
|
||||
border-bottom: 1px solid var(--soft);
|
||||
}
|
||||
|
||||
.timeline-year {
|
||||
color: var(--accent-strong);
|
||||
font-size: 1.35rem;
|
||||
font-weight: 900;
|
||||
}
|
||||
|
||||
.team-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, 1fr);
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.team-member,
|
||||
.reference-card,
|
||||
.job-card,
|
||||
.download-row,
|
||||
.legal-notice {
|
||||
border: 1px solid var(--soft);
|
||||
border-radius: var(--radius);
|
||||
background: var(--surface);
|
||||
}
|
||||
|
||||
.team-member {
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
.team-member strong {
|
||||
display: block;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.team-member span {
|
||||
color: var(--muted);
|
||||
}
|
||||
|
||||
.reference-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, 1fr);
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.reference-card {
|
||||
min-height: 132px;
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
.job-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, 1fr);
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.job-card {
|
||||
display: grid;
|
||||
gap: 0.85rem;
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
.job-card.featured {
|
||||
background: var(--accent-soft);
|
||||
}
|
||||
|
||||
.job-meta {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 0.5rem;
|
||||
}
|
||||
|
||||
.job-meta span {
|
||||
border: 1px solid var(--soft);
|
||||
border-radius: 999px;
|
||||
color: var(--muted);
|
||||
padding: 0.28rem 0.55rem;
|
||||
font-size: 0.88rem;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.job-layout {
|
||||
display: grid;
|
||||
grid-template-columns: minmax(0, 1fr) minmax(280px, 360px);
|
||||
gap: clamp(2rem, 5vw, 4rem);
|
||||
align-items: start;
|
||||
}
|
||||
|
||||
.job-content {
|
||||
display: grid;
|
||||
gap: 2rem;
|
||||
}
|
||||
|
||||
.job-hero img {
|
||||
aspect-ratio: 5 / 2;
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
|
||||
.sticky-side {
|
||||
position: sticky;
|
||||
top: 96px;
|
||||
}
|
||||
|
||||
.contact-panel {
|
||||
display: grid;
|
||||
gap: 1rem;
|
||||
border: 1px solid var(--soft);
|
||||
border-radius: var(--radius);
|
||||
background: var(--surface);
|
||||
padding: 1.3rem;
|
||||
box-shadow: var(--shadow);
|
||||
}
|
||||
|
||||
.contact-panel h2 {
|
||||
font-size: clamp(1.5rem, 3vw, 2.3rem);
|
||||
}
|
||||
|
||||
.contact-panel dl {
|
||||
display: grid;
|
||||
gap: 0.8rem;
|
||||
margin: 0;
|
||||
padding-top: 0.25rem;
|
||||
}
|
||||
|
||||
.contact-panel dt,
|
||||
.info-table dt {
|
||||
color: var(--muted);
|
||||
font-size: 0.9rem;
|
||||
font-weight: 800;
|
||||
}
|
||||
|
||||
.contact-panel dd,
|
||||
.info-table dd {
|
||||
margin: 0;
|
||||
color: var(--text);
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.downloads {
|
||||
display: grid;
|
||||
gap: 0.85rem;
|
||||
}
|
||||
|
||||
.download-row {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr auto;
|
||||
gap: 1rem;
|
||||
align-items: center;
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
.partner-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, 1fr);
|
||||
gap: 1rem;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.partner-grid a {
|
||||
display: grid;
|
||||
min-height: 88px;
|
||||
place-items: center;
|
||||
border: 1px solid var(--soft);
|
||||
border-radius: var(--radius);
|
||||
background: #f8faf9;
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
.partner-grid img {
|
||||
max-height: 44px;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.page-hero {
|
||||
padding: clamp(3rem, 7vw, 5.5rem) 0;
|
||||
background: linear-gradient(180deg, var(--surface-raised), var(--surface));
|
||||
}
|
||||
|
||||
.page-hero-grid {
|
||||
display: grid;
|
||||
gap: 2rem;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.page-hero.with-image .page-hero-grid {
|
||||
grid-template-columns: minmax(0, 0.92fr) minmax(320px, 1.08fr);
|
||||
}
|
||||
|
||||
.page-hero h1 {
|
||||
max-width: 14ch;
|
||||
margin-top: 0.45rem;
|
||||
}
|
||||
|
||||
.page-hero-image img {
|
||||
aspect-ratio: 16 / 10;
|
||||
}
|
||||
|
||||
.article {
|
||||
max-width: 860px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.article h2 {
|
||||
margin-top: 2.2rem;
|
||||
margin-bottom: 0.8rem;
|
||||
font-size: clamp(1.6rem, 3vw, 2.4rem);
|
||||
}
|
||||
|
||||
.article p + p {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
.article-image {
|
||||
margin: 2rem 0;
|
||||
}
|
||||
|
||||
.article-image img {
|
||||
aspect-ratio: 16 / 10;
|
||||
}
|
||||
|
||||
.info-table {
|
||||
display: grid;
|
||||
gap: 1rem;
|
||||
border: 1px solid var(--soft);
|
||||
border-radius: var(--radius);
|
||||
background: var(--surface);
|
||||
padding: 1.2rem;
|
||||
}
|
||||
|
||||
.info-table div {
|
||||
display: grid;
|
||||
gap: 0.15rem;
|
||||
}
|
||||
|
||||
.legal-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.legal-content h2 {
|
||||
margin-top: 2.5rem;
|
||||
margin-bottom: 0.8rem;
|
||||
font-size: clamp(1.45rem, 3vw, 2rem);
|
||||
}
|
||||
|
||||
.legal-content h3 {
|
||||
margin-top: 1.6rem;
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
.legal-content p,
|
||||
.legal-content li {
|
||||
color: var(--muted);
|
||||
}
|
||||
|
||||
.legal-content p + p {
|
||||
margin-top: 0.9rem;
|
||||
}
|
||||
|
||||
.legal-notice {
|
||||
margin-bottom: 2rem;
|
||||
padding: 1rem;
|
||||
background: var(--accent-soft);
|
||||
}
|
||||
|
||||
.embed-link-box {
|
||||
display: grid;
|
||||
gap: 1rem;
|
||||
border: 1px solid var(--soft);
|
||||
border-radius: var(--radius);
|
||||
background: var(--surface);
|
||||
padding: clamp(1.2rem, 3vw, 2rem);
|
||||
}
|
||||
|
||||
.site-footer {
|
||||
background: var(--surface-raised);
|
||||
border-top: 1px solid var(--soft);
|
||||
}
|
||||
|
||||
.footer-cta {
|
||||
border-bottom: 1px solid var(--soft);
|
||||
padding: 2rem 0;
|
||||
}
|
||||
|
||||
.footer-cta-grid {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr auto;
|
||||
gap: 1.5rem;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.footer-cta h2 {
|
||||
font-size: clamp(1.8rem, 4vw, 3.2rem);
|
||||
}
|
||||
|
||||
.footer-main {
|
||||
display: grid;
|
||||
grid-template-columns: minmax(260px, 1.4fr) repeat(3, 1fr);
|
||||
gap: 2rem;
|
||||
padding: 3rem 0;
|
||||
}
|
||||
|
||||
.footer-brand {
|
||||
display: grid;
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.footer-brand img {
|
||||
width: 210px;
|
||||
}
|
||||
|
||||
.footer-brand address {
|
||||
color: var(--muted);
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
.footer-nav,
|
||||
.footer-partners {
|
||||
display: grid;
|
||||
align-content: start;
|
||||
gap: 0.55rem;
|
||||
}
|
||||
|
||||
.footer-nav h2,
|
||||
.footer-partners h2 {
|
||||
font-size: 1rem;
|
||||
margin-bottom: 0.25rem;
|
||||
}
|
||||
|
||||
.partner-mini {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||
gap: 0.5rem;
|
||||
}
|
||||
|
||||
.partner-mini a {
|
||||
display: grid;
|
||||
min-height: 52px;
|
||||
place-items: center;
|
||||
border: 1px solid var(--soft);
|
||||
border-radius: 6px;
|
||||
background: #f8faf9;
|
||||
padding: 0.55rem;
|
||||
}
|
||||
|
||||
.partner-mini img {
|
||||
max-height: 28px;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.footer-bottom {
|
||||
border-top: 1px solid var(--soft);
|
||||
padding: 1rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
@media (max-width: 1024px) {
|
||||
.desktop-nav,
|
||||
.nav-call {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.header-inner {
|
||||
grid-template-columns: auto 1fr auto;
|
||||
}
|
||||
|
||||
.mobile-nav {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.hero-grid,
|
||||
.split-grid,
|
||||
.split-grid.reverse,
|
||||
.page-hero.with-image .page-hero-grid,
|
||||
.job-layout,
|
||||
.footer-cta-grid {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.split-grid.reverse .feature-image {
|
||||
order: -1;
|
||||
}
|
||||
|
||||
.hero h1,
|
||||
.page-hero h1 {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.sticky-side {
|
||||
position: static;
|
||||
}
|
||||
|
||||
.footer-main {
|
||||
grid-template-columns: 1fr 1fr;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 760px) {
|
||||
.container {
|
||||
width: min(calc(100% - 1.25rem), var(--container));
|
||||
}
|
||||
|
||||
.brand img {
|
||||
width: 174px;
|
||||
}
|
||||
|
||||
.header-inner {
|
||||
min-height: 64px;
|
||||
}
|
||||
|
||||
.hero {
|
||||
min-height: auto;
|
||||
padding: 3rem 0;
|
||||
}
|
||||
|
||||
.hero h1,
|
||||
.page-hero h1 {
|
||||
font-size: clamp(2.5rem, 12vw, 3.5rem);
|
||||
}
|
||||
|
||||
.stats-strip,
|
||||
.service-grid,
|
||||
.team-grid,
|
||||
.reference-grid,
|
||||
.job-grid,
|
||||
.partner-grid,
|
||||
.footer-main {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.stat {
|
||||
border-right: 0;
|
||||
border-bottom: 1px solid var(--soft);
|
||||
}
|
||||
|
||||
.stat:last-child {
|
||||
border-bottom: 0;
|
||||
}
|
||||
|
||||
.service-card,
|
||||
.service-card:nth-child(1),
|
||||
.service-card:nth-child(4),
|
||||
.service-card:nth-child(6) {
|
||||
grid-column: span 1;
|
||||
}
|
||||
|
||||
.timeline-item {
|
||||
grid-template-columns: 1fr;
|
||||
gap: 0.3rem;
|
||||
}
|
||||
|
||||
.download-row {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.button {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user