---
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>
