/* IR Bau Deko — App */ const { useState, useEffect, useRef } = React; // ---------- Icons (stroke, currentColor) ---------- const Icon = { Drywall: () => ( ), Tile: () => ( ), Paint: () => ( ), Renovation: () => ( ), Garden: () => ( ), Assembly: () => ( ), Concrete: () => ( ), Arrow: () => ( ), ArrowSmall: () => ( ), Check: () => ( ), Phone: () => ( ), Mail: () => ( ), Pin: () => ( ), Clock: () => ( ), Shield: () => ( ), Instagram: () => ( ), Play: () => ( ), Plus: () => ( ), Trash: () => ( ), }; // ---------- Nav ---------- const NAV_LINKS = [ ['#leistungen', 'Leistungen'], ['#ueber-uns', 'Über uns'], ['#prozess', 'Ablauf'], ['#projekte', 'Projekte'], ['#kontakt', 'Kontakt'], ]; function Nav({ scrollY }) { const scrolled = scrollY > 20; const [open, setOpen] = useState(false); // Lock page scroll while the mobile menu is open useEffect(() => { document.body.style.overflow = open ? 'hidden' : ''; return () => { document.body.style.overflow = ''; }; }, [open]); // Close menu, unlock scroll, then glide to the target section const goTo = (e, href) => { e.preventDefault(); setOpen(false); document.body.style.overflow = ''; const el = document.querySelector(href); if (el) { const top = el.getBoundingClientRect().top + window.scrollY - 72; window.scrollTo({ top, behavior: 'smooth' }); } }; return (
{/* Logo space — actual logo is rendered by MorphLogo (fixed) so it can fly in from the hero */} Angebot anfragen
); } // ---------- MorphLogo ---------- // One logo, fixed-positioned. At scrollY=0 it sits big on the left of the hero. // As you scroll past the threshold it flies up into the nav bar position and // becomes the home button. function MorphLogo({ scrollY }) { const THRESHOLD = 260; const p = Math.min(1, Math.max(0, scrollY / THRESHOLD)); const scrolled = p > 0.5; return ( { e.preventDefault(); window.scrollTo({ top: 0, behavior: 'smooth' }); }} > IR Bau Deko ); } // ---------- Hero ---------- function Hero({ headline = 'precision' }) { const labelMap = { precision: 'Kreativität', passion: 'Hingabe', quality: 'Qualität', }; const italicWord = labelMap[headline] || 'Kreativität'; return (
); } // ---------- Reveal wrapper ---------- function Reveal({ children, delay = 0, as: Tag = 'div', className = '', ...rest }) { const ref = useRef(null); const [inView, setInView] = useState(false); useEffect(() => { const el = ref.current; if (!el) return; const io = new IntersectionObserver(([e]) => { if (e.isIntersecting) { setInView(true); io.disconnect(); } }, { threshold: .15 }); io.observe(el); return () => io.disconnect(); }, []); const dClass = delay ? ` d${delay}` : ''; return ( {children} ); } // ---------- Services ---------- const SERVICES = [ { ico: 'Drywall', num: '01', title: 'Trockenbau', featured: true, desc: 'Wände, Decken, Vorsatzschalen und Akustiklösungen — sauber verarbeitet, millimetergenau gespachtelt.', long: 'Vom einfachen Wandaufbau bis zur abgehängten Akustikdecke: Wir planen tragfähige Konstruktionen, integrieren Installation und Licht sauber und übergeben gespachtelte Oberflächen in jeder gewünschten Qualitätsstufe.', highlights: ['Trennwände & Vorsatzschalen', 'Abgehängte Decken & Lichtvouten', 'Schall- und Brandschutz', 'Spachtelung Q1 – Q4', 'Revisionsöffnungen & Aussparungen'], }, { ico: 'Tile', num: '02', title: 'Fliesenlegerei', desc: 'Bad, Küche, Bodenflächen. Fugen ruhig, Kanten sauber — auf Tausendstel.', long: 'Wir verlegen Fliesen, Mosaik und Großformate für Bad, Küche, Flur und Außenbereich — inklusive Untergrundvorbereitung, Abdichtung und Verfugung. Jeder Schnitt sitzt, jede Fuge läuft.', highlights: ['Bad- & Küchenfliesen', 'Großformate bis 120 × 240 cm', 'Naturstein & Mosaik', 'Abdichtung nach DIN 18534', 'Sockel, Übergänge & Profile'], }, { ico: 'Renovation', num: '03', title: 'Renovierung', desc: 'Von Einzelraum bis Komplettsanierung — durchdachte Planung, zuverlässige Ausführung.', long: 'Egal ob einzelner Raum oder komplette Wohnung — wir koordinieren alle Gewerke, halten den Zeitplan und übernehmen Verantwortung für das Gesamtergebnis. Ein Ansprechpartner, ein fester Preis.', highlights: ['Komplette Wohnungssanierung', 'Bad- & Küchenrenovierung', 'Gewerkekoordination aus einer Hand', 'Festpreis & Zeitplan', 'Saubere Übergabe inkl. Endreinigung'], }, { ico: 'Garden', num: '04', title: 'Garten & Landschaftsbau', desc: 'Pflasterwege, Terrassen, Außenanlagen — Ihre Vision für draußen.', long: 'Wir gestalten Außenbereiche, die zur Architektur passen — von der Hofeinfahrt über die Terrasse bis zur kompletten Außenanlage. Solider Unterbau, präzise Verlegung, dauerhafte Optik.', highlights: ['Pflaster- & Plattenarbeiten', 'Terrassen aus Holz oder Stein', 'Einfahrten & Zugangswege', 'Mauern, Stufen & Einfassungen', 'Drainage & Untergrundaufbau'], }, { ico: 'Assembly', num: '05', title: 'Montage & Demontage', desc: 'Präziser Aufbau und fachgerechter Rückbau — strukturiert und sauber.', long: 'Aufbau neuer Elemente oder fachgerechter Rückbau bestehender Strukturen — planvoll, dokumentiert und mit Rücksicht auf umliegende Gewerke. Ohne Kollateralschäden, mit ordentlicher Entsorgung.', highlights: ['Möbel- & Küchenmontage', 'Türen, Zargen & Treppen', 'Trockenbau-Rückbau', 'Entkernung & Entsorgung', 'Maschinen- & Anlagenversetzungen'], }, { ico: 'Paint', num: '06', title: 'Malerarbeiten', desc: 'Innen und außen, Tapete, Lasur, Spachteltechnik — Oberflächen mit Charakter.', long: 'Klassische Anstriche, dekorative Spachteltechniken, Tapeten und Lasuren — innen wie außen. Wir bereiten Untergründe sorgfältig vor und arbeiten ausschließlich mit hochwertigen Materialien.', highlights: ['Innen- & Außenanstriche', 'Tapezierarbeiten', 'Spachteltechnik & Stuccolustro', 'Lasuren auf Holz & Beton', 'Untergrundvorbereitung & Grundierung'], }, { ico: 'Concrete', num: '07', title: 'Beton & Maurerarbeiten', featured: true, desc: 'Fundament, Mauerwerk, Schalung — solide Substanz, die Bestand hat.', long: 'Solides Fundament für alles, was darauf folgt: Beton-, Schalungs- und Maurerarbeiten — sauber bewehrt, statisch korrekt, dauerhaft. Auch Sichtbeton mit definierter Schalhautstruktur.', highlights: ['Fundamente & Bodenplatten', 'Mauerwerk (KS, Ziegel, Porenbeton)', 'Schalung & Bewehrung', 'Sichtbeton-Oberflächen', 'Durchbrüche & Kernbohrungen'], }, ]; function ServiceModal({ service, onClose }) { useEffect(() => { if (!service) return; const onKey = (e) => { if (e.key === 'Escape') onClose(); }; window.addEventListener('keydown', onKey); const prev = document.body.style.overflow; document.body.style.overflow = 'hidden'; return () => { window.removeEventListener('keydown', onKey); document.body.style.overflow = prev; }; }, [service, onClose]); if (!service) return null; const Ic = Icon[service.ico]; const toForm = () => { onClose(); window.__prefillContactForm && window.__prefillContactForm(service.title); const el = document.getElementById('kontakt'); if (el) window.scrollTo({ top: el.offsetTop - 60, behavior: 'smooth' }); }; return (
e.stopPropagation()}>
Leistung {service.num}

{service.title}

{service.long}

); } function Services() { const [active, setActive] = useState(null); return (
Leistungen

Alles aus einer Hand. Sauber gebaut.

Sieben Gewerke unter einem Dach — von tragender Substanz bis zur letzten Fuge. Wir koordinieren, planen und führen aus.

{SERVICES.map((s, i) => { const Ic = Icon[s.ico]; return ( setActive(s)} role="button" tabIndex={0} onKeyDown={(e) => { if (e.key === 'Enter' || e.key === ' ') { e.preventDefault(); setActive(s); } }} >
{s.num}

{s.title}

{s.desc}

Mehr erfahren
); })}
setActive(null)} />
); } // ---------- About ---------- function AboutVisual() { const [i, setI] = useState(0); const total = 4; const go = (d) => setI((p) => (p + d + total) % total); const touch = useRef(null); const onTouchStart = (e) => { touch.current = e.touches[0].clientX; }; const onTouchEnd = (e) => { if (touch.current == null) return; const dx = e.changedTouches[0].clientX - touch.current; if (Math.abs(dx) > 40) go(dx < 0 ? 1 : -1); touch.current = null; }; return (
Das Team von IR Bau Deko
Inita Rihtere — Inhaberin von IR Bau Deko
Ihre Ansprechpartnerin
Inita Rihtere Inhaberin — führt den Betrieb seit 2016 mit klarem Blick für Qualität und Kundenzufriedenheit.
Edgars — Projektleitung & Kundenbetreuung bei IR Bau Deko
Ihr Ansprechpartner
Edgars Projektleitung & Kundenbetreuung — von der ersten Begehung bis zur Übergabe an Ihrer Seite.
Armin Hollatz — Technische Leitung & Qualitätssicherung bei IR Bau Deko
Ihr Ansprechpartner
Armin Hollatz Technische Leitung & Qualitätssicherung — prüft jedes Detail, damit das Ergebnis hält, was wir versprechen.
{[0, 1, 2, 3].map((n) => ( ))}
); } function About() { const points = [ { title: 'Qualifizierte Fachkräfte & Fachexperten', desc: 'Qualifiziertes Team, geprüfte Verarbeitung — keine Kompromisse bei Material oder Ausführung.' }, { title: 'Festpreis, fest geplant', desc: 'Transparente Kostenvoranschläge. Keine bösen Überraschungen am Ende.' }, { title: 'Termintreue & Sauberkeit', desc: 'Wir halten Zeitpläne und hinterlassen Baustellen, wie wir sie selbst vorfinden wollen.' }, ]; return (
Über uns

Ein Betrieb aus Sierksdorf — für ganz Norddeutschland.

IR Bau Deko ist Ihr Partner für Trockenbau, Fliesenlegerei und begleitende Gewerke. Unser eingespieltes Team verbindet handwerkliche Präzision mit einem klaren Blick für Ästhetik — damit jeder Raum das wird, was er werden soll.

Wir legen großen Wert auf eine kundenorientierte und individuelle Herangehensweise — denn nach unserer Erfahrung erzielt man so das bestmögliche Verständnis für Ihr Vorhaben. Nach einem persönlichen Gespräch und der Besichtigung des Einsatzortes erstellen unsere fachkundigen und erfahrenen Kollegen Ihnen gerne ein Angebot, das ganz individuell auf Ihre Bedürfnisse, Wünsche und die Gegebenheiten vor Ort abgestimmt ist.

Seit 2016 sind wir im Bauwesen tätig. Unsere verwirklichten Projekte und zufriedenen Kunden erzählen mehr als tausend Worte — werfen Sie gerne einen Blick auf unseren{' '} Instagram-Account, um selbst einen ersten Eindruck davon zu gewinnen, was Sie erwartet. Wir freuen uns auf Ihre Anfrage!

{points.map(p => (

{p.title}

{p.desc}

))}
); } // ---------- Process ---------- const STEPS = [ { n: '01', t: 'Aufmaß & Planung', d: 'Millimetergenaues Messen und Anzeichnen. Jedes Maß sitzt, bevor der erste Schnitt fällt.', img: window.__ASSETS.cAufmass }, { n: '02', t: 'Präziser Zuschnitt', d: 'Fliese für Fliese auf Maß gebracht — Kanten sauber, Fugen exakt, ohne Kompromisse.', img: window.__ASSETS.cAnzeichnen }, { n: '03', t: 'Verlegen mit Sorgfalt', d: 'Ob Riemchen, Fliese oder Boden: Material für Material von Hand gesetzt und ausgerichtet.', img: window.__ASSETS.cBrick }, { n: '04', t: 'Das Ergebnis', d: 'Saubere Übergabe — ein Resultat, hinter dem wir mit unserem Namen stehen.', img: window.__ASSETS.cResult }, ]; function Process() { return (
Ablauf

Von der Planung zum Ergebnis — mit Sorgfalt.

Vier Schritte, ein Anspruch: handwerkliche Präzision in jeder Phase. So entsteht aus einer Baustelle ein Raum, der überzeugt.

{STEPS.map((s, i) => (
{s.t} {s.n}

{s.t}

{s.d}

))}
); } // ---------- Projects ---------- function Projects({ instagramUrl, instagramHandle }) { const items = [ { img: window.__ASSETS.cBrickWall, cat: 'Riemchen · Wandgestaltung', title: 'Klinkeroptik im Innenraum' }, { img: window.__ASSETS.cTile, cat: 'Fliesenlegerei', title: 'Großformat in Natursteinoptik' }, { img: window.__ASSETS.cTeam, cat: 'Malerarbeiten', title: 'Wand- & Deckenanstrich' }, ]; return (
Projekte

Ausgewählte Arbeiten.

Ein Auszug aus fertigen Baustellen — jedes Projekt bekommt von uns die volle Aufmerksamkeit.

{instagramUrl && ( Mehr auf Instagram {instagramHandle} )}
{items.map((p, i) => ( {p.title}
{p.cat}

{p.title}

))}
); } // ---------- Contact form ---------- function ContactForm() { const [sent, setSent] = useState(false); const [showDs, setShowDs] = useState(false); const [betreff, setBetreff] = useState('Angebot anfragen'); const [nachricht, setNachricht] = useState(''); useEffect(() => { window.__prefillContactForm = (title) => { setBetreff('Angebot anfragen'); setNachricht(`Ich interessiere mich für Ihre Leistung „${title}“ und bitte um ein Angebot.\n\n`); setTimeout(() => { const n = document.querySelector('.cform textarea'); if (n) n.focus(); }, 600); }; return () => { delete window.__prefillContactForm; }; }, []); const submit = (e) => { e.preventDefault(); const f = e.target; if (!f.checkValidity()) { f.reportValidity(); return; } if (!f.consent.checked) { f.consent.focus(); return; } const subject = `${f.betreff.value} — Anfrage über die Website von ${f.name.value}`; const body = `Name: ${f.name.value}\nE-Mail: ${f.email.value}\nTelefon: ${f.telefon.value || '—'}\n\n${f.nachricht.value}`; window.open(`mailto:ir.baudeko@gmail.com?subject=${encodeURIComponent(subject)}&body=${encodeURIComponent(body)}`, '_blank'); setSent(true); }; return (

Angebot oder Frage senden

{sent && Ihr E-Mail-Programm wurde geöffnet — bitte dort auf „Senden“ klicken.}
{showDs && ReactDOM.createPortal(
setShowDs(false)} role="dialog" aria-modal="true" aria-label="Datenschutzerklärung">
e.stopPropagation()}>
, document.body )}
); } // ---------- CTA / Contact ---------- function CTA() { return (
Kontakt

Lassen Sie uns über Ihr Projekt sprechen.

Ob kleine Sanierung oder Komplettausbau – wir hören zu, beraten ehrlich und planen Ihr Projekt mit Verstand. Nach der gemeinsamen Besprechung erhalten Sie von uns zeitnah ein transparentes und verlässliches Angebot.

Angebot per E-Mail Mehr über uns

So erreichen Sie uns

Direkt, ohne Formular. Antwort innerhalb eines Werktags.

Adresse
Neustädter Straße 31
23730 Sierksdorf
E-Mail
Bürozeiten
Mo – Fr · 08:00 – 18:00
); } // ---------- Footer ---------- function Footer() { return ( ); } // ---------- WhatsApp Icon ---------- function WhatsAppIcon() { return ( ); } // ---------- Floating WhatsApp button ---------- function WhatsAppFloat({ phone, message, label, showTooltip }) { const [visible, setVisible] = useState(false); const [tipOpen, setTipOpen] = useState(false); useEffect(() => { const onScroll = () => setVisible(window.scrollY > 280); onScroll(); window.addEventListener('scroll', onScroll, { passive: true }); return () => window.removeEventListener('scroll', onScroll); }, []); useEffect(() => { if (!visible || !showTooltip) { setTipOpen(false); return; } const t = setTimeout(() => setTipOpen(true), 1500); const t2 = setTimeout(() => setTipOpen(false), 6500); return () => { clearTimeout(t); clearTimeout(t2); }; }, [visible, showTooltip]); const clean = (phone || '').replace(/[^0-9]/g, ''); const href = `https://wa.me/${clean}?text=${encodeURIComponent(message || '')}`; return ( setTipOpen(false)} > {label} {showTooltip && Fragen? Schreiben Sie uns!} ); } // ---------- Tweak defaults ---------- const TWEAK_DEFAULTS = /*EDITMODE-BEGIN*/{ "waPhone": "491234567890", "waMessage": "Hallo IR Bau Deko, ich interessiere mich für ein Angebot.", "waLabel": "WhatsApp Chat", "waTooltip": true, "accentHue": 220, "showProcess": true, "showProjects": true, "instagramUrl": "https://www.instagram.com/ir.baudeko/", "instagramHandle": "@ir.baudeko", "heroHeadline": "precision" }/*EDITMODE-END*/; // ---------- App ---------- function App() { const [t, setTweak] = useTweaks(TWEAK_DEFAULTS); const [scrollY, setScrollY] = useState(0); // Apply accent hue dynamically useEffect(() => { const root = document.documentElement; const h = t.accentHue; root.style.setProperty('--blue-500', `hsl(${h} 92% 60%)`); root.style.setProperty('--blue-600', `hsl(${h} 85% 52%)`); root.style.setProperty('--blue-400', `hsl(${h} 92% 68%)`); root.style.setProperty('--blue-50', `hsl(${h} 90% 97%)`); }, [t.accentHue]); // Migrate previously-saved old Instagram URL to the correct one useEffect(() => { if (t.instagramUrl === 'https://instagram.com/ir.baudeko') { setTweak('instagramUrl', 'https://www.instagram.com/ir.baudeko/'); } }, [t.instagramUrl]); // Track scroll once, share with Nav + MorphLogo useEffect(() => { const onScroll = () => setScrollY(window.scrollY); onScroll(); window.addEventListener('scroll', onScroll, { passive: true }); return () => window.removeEventListener('scroll', onScroll); }, []); return ( <>