:root {
            --primary-green: #2d5c1e;
            --secondary-green: #3d6e2a;
            --accent-green: #5a9216;
            --accent-bright: #7db928;
            --dark: #1a1a1a;
            --text-dark: #2d2d2d;
            --text-medium: #525252;
            --bg-light: #f8faf8;
            --bg-white: #ffffff;
            --border-light: #e5e7e5;

            --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.08);
            --shadow-md: 0 8px 24px rgba(0, 0, 0, 0.12);
            --shadow-lg: 0 16px 48px rgba(0, 0, 0, 0.15);
            --shadow-xl: 0 24px 64px rgba(0, 0, 0, 0.2);

            --font-primary: 'Inter', -apple-system, sans-serif;
            --font-display: 'Bebas Neue', sans-serif;
        }

        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }

        html {
            scroll-behavior: smooth;
        }

        body {
            font-family: var(--font-primary);
            line-height: 1.7;
            color: var(--text-dark);
            background: var(--bg-white);
            overflow-x: hidden;
            -webkit-font-smoothing: antialiased;
        }

        a {
            text-decoration: none;
            color: inherit;
        }

        /* NAVIGATION */
        @keyframes gradientMove {
            0%, 100% {
                background-position: 0% 50%;
            }
            50% {
                background-position: 100% 50%;
            }
        }

        @keyframes shimmer {
            0% { left: -100%; }
            50%, 100% { left: 200%; }
        }

        @keyframes glow {
            0%, 100% {
                box-shadow:
                    0 5px 20px rgba(0, 0, 0, 0.12),
                    0 20px 50px rgba(93, 146, 22, 0.25),
                    0 0 0 1px rgba(125, 185, 40, 0.3),
                    0 0 40px rgba(125, 185, 40, 0.2),
                    0 0 60px rgba(164, 214, 82, 0.15),
                    inset 0 3px 6px rgba(255, 255, 255, 0.95),
                    inset 0 -2px 4px rgba(93, 146, 22, 0.08);
            }
            50% {
                box-shadow:
                    0 5px 20px rgba(0, 0, 0, 0.12),
                    0 20px 50px rgba(93, 146, 22, 0.4),
                    0 0 0 1px rgba(125, 185, 40, 0.5),
                    0 0 50px rgba(125, 185, 40, 0.35),
                    0 0 80px rgba(164, 214, 82, 0.25),
                    inset 0 3px 6px rgba(255, 255, 255, 0.95),
                    inset 0 -2px 4px rgba(93, 146, 22, 0.08);
            }
        }

        .navbar {
            position: fixed;
            top: 0;
            width: 100%;
            z-index: 9999;
            background:
                radial-gradient(circle at 20% 50%, rgba(240, 250, 235, 0.88) 0%, transparent 50%),
                radial-gradient(circle at 80% 50%, rgba(235, 248, 228, 0.85) 0%, transparent 50%),
                linear-gradient(135deg,
                    rgba(255, 255, 255, 0.88) 0%,
                    rgba(248, 252, 246, 0.82) 20%,
                    rgba(240, 250, 235, 0.78) 40%,
                    rgba(235, 248, 228, 0.80) 60%,
                    rgba(245, 252, 242, 0.85) 80%,
                    rgba(250, 254, 248, 0.88) 100%);
            background-size: 200% 200%, 200% 200%, 200% 200%;
            animation: gradientMove 10s ease infinite, glow 3s ease-in-out infinite;
            backdrop-filter: blur(40px) saturate(250%) brightness(1.05);
            -webkit-backdrop-filter: blur(40px) saturate(250%) brightness(1.05);
            border-bottom: 5px solid transparent;
            border-image: linear-gradient(90deg,
                transparent 0%,
                rgba(93, 146, 22, 0.4) 8%,
                rgba(125, 185, 40, 0.6) 16%,
                rgba(164, 214, 82, 0.75) 24%,
                rgba(180, 230, 100, 0.85) 32%,
                rgba(190, 240, 110, 0.95) 40%,
                rgba(180, 230, 100, 1) 50%,
                rgba(190, 240, 110, 0.95) 60%,
                rgba(180, 230, 100, 0.85) 68%,
                rgba(164, 214, 82, 0.75) 76%,
                rgba(125, 185, 40, 0.6) 84%,
                rgba(93, 146, 22, 0.4) 92%,
                transparent 100%) 1;
            transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
            position: relative;
            overflow: hidden;
        }

        .navbar::before {
            content: '';
            position: absolute;
            top: 0;
            left: -100%;
            width: 100%;
            height: 100%;
            background: linear-gradient(90deg,
                transparent,
                rgba(125, 185, 40, 0.35),
                rgba(164, 214, 82, 0.45),
                rgba(180, 230, 100, 0.5),
                rgba(164, 214, 82, 0.45),
                transparent);
            animation: shimmer 5s ease-in-out infinite;
            filter: blur(20px);
        }

        .navbar::after {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            height: 3px;
            background: linear-gradient(90deg,
                transparent,
                rgba(164, 214, 82, 0.7) 15%,
                rgba(180, 230, 100, 0.9) 35%,
                rgba(190, 240, 110, 1) 50%,
                rgba(180, 230, 100, 0.9) 65%,
                rgba(164, 214, 82, 0.7) 85%,
                transparent);
            box-shadow: 0 0 15px rgba(180, 230, 100, 0.6);
        }

        .nav-container {
            max-width: 1400px;
            margin: 0 auto;
            padding: 1rem 3rem;
            display: flex;
            justify-content: space-between;
            align-items: center;
            position: relative;
            z-index: 2;
        }

        .logo-container {
            display: flex;
            align-items: center;
            text-decoration: none;
            transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
            padding: 0.75rem 1rem;
            border-radius: 15px;
            position: relative;
        }

        .logo-text-wrapper {
            display: flex;
            flex-direction: column;
            gap: 0.25rem;
        }

        .logo-greeting {
            font-size: 0.85rem;
            font-weight: 600;
            color: var(--primary-green);
            letter-spacing: 0.05em;
        }

        .logo-company {
            display: flex;
            align-items: center;
            gap: 0.5rem;
        }

        .logo-small-icon {
            height: 30px;
            width: auto;
        }

        .logo-company-text {
            font-family: var(--font-display);
            font-size: 1.3rem;
            font-weight: 700;
            color: var(--text-dark);
            letter-spacing: 0.02em;
        }

        .nav-links {
            display: flex;
            list-style: none;
            gap: 3rem;
            align-items: center;
        }

        .nav-link {
            color: var(--text-dark);
            text-decoration: none;
            font-weight: 600;
            font-size: 1rem;
            transition: color 0.3s ease;
        }

        .nav-link:hover {
            color: var(--accent-green);
        }

        .nav-cta {
            background: linear-gradient(135deg, var(--primary-green), var(--accent-green));
            color: white;
            padding: 0.7rem 1.8rem;
            border-radius: 50px;
            text-decoration: none;
            font-weight: 700;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            box-shadow: 0 4px 15px rgba(93, 146, 22, 0.3);
        }

        .nav-cta:hover {
            transform: translateY(-2px);
            box-shadow: 0 6px 25px rgba(93, 146, 22, 0.4);
        }

        /* MAIN CONTENT */
        .legal-content {
            max-width: 900px;
            margin: 0 auto;
            padding: 150px 3rem 100px;
        }

        .page-header {
            text-align: center;
            margin-bottom: 4rem;
        }

        .page-tag {
            display: inline-block;
            color: white;
            background: linear-gradient(135deg, var(--primary-green), var(--accent-green));
            font-weight: 700;
            font-size: 0.9rem;
            letter-spacing: 0.2em;
            text-transform: uppercase;
            margin-bottom: 1.5rem;
            padding: 0.7rem 2rem;
            border-radius: 50px;
            box-shadow: 0 4px 15px rgba(93, 146, 22, 0.3);
        }

        .page-title {
            font-family: var(--font-display);
            font-size: 4rem;
            font-weight: 900;
            color: var(--dark);
            line-height: 1.15;
            margin-bottom: 1rem;
            letter-spacing: -0.02em;
        }

        .content-section {
            background: white;
            padding: 3rem;
            border-radius: 20px;
            box-shadow: var(--shadow-md);
            margin-bottom: 2rem;
        }

        .content-section h2 {
            font-family: var(--font-display);
            font-size: 2rem;
            color: var(--primary-green);
            margin-bottom: 1.5rem;
            padding-bottom: 1rem;
            border-bottom: 3px solid var(--accent-bright);
        }

        .content-section h3 {
            font-size: 1.4rem;
            color: var(--text-dark);
            margin-top: 2rem;
            margin-bottom: 1rem;
            font-weight: 700;
        }

        .content-section p {
            font-size: 1.1rem;
            color: var(--text-medium);
            line-height: 1.8;
            margin-bottom: 1rem;
        }

        .content-section ul {
            margin-left: 2rem;
            margin-bottom: 1rem;
        }

        .content-section li {
            font-size: 1.1rem;
            color: var(--text-medium);
            line-height: 1.8;
            margin-bottom: 0.5rem;
        }

        .content-section strong {
            color: var(--text-dark);
            font-weight: 700;
        }

        .content-section a {
            color: var(--accent-green);
            text-decoration: none;
            font-weight: 600;
            transition: color 0.3s ease;
        }

        .content-section a:hover {
            color: var(--primary-green);
            text-decoration: underline;
        }

        .info-box {
            background: var(--bg-light);
            padding: 1.5rem;
            border-radius: 10px;
            border-left: 4px solid var(--accent-green);
            margin: 1.5rem 0;
        }

        .back-link {
            display: inline-flex;
            align-items: center;
            gap: 0.5rem;
            color: var(--accent-green);
            text-decoration: none;
            font-weight: 600;
            font-size: 1.1rem;
            margin-top: 3rem;
            transition: all 0.3s ease;
        }

        .back-link:hover {
            gap: 1rem;
            color: var(--primary-green);
        }

        /* RESPONSIVE */
        @media (max-width: 1024px) {
            .nav-links {
                display: none;
            }
        }

        @media (max-width: 768px) {
            .legal-content {
                padding: 120px 2rem 80px;
            }

            .page-title {
                font-size: 2.5rem;
            }

            .content-section {
                padding: 2rem;
            }

            .content-section h2 {
                font-size: 1.6rem;
            }
        }

        /* HAMBURGER MENU & MOBILE NAVIGATION */
        .hamburger{display:none;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:0.5rem;z-index:10001;touch-action:manipulation;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;}@media(max-width:1024px){.hamburger{display:flex;}.nav-links{display:none;}}.hamburger span{width:30px;height:3px;background:var(--primary-green);border-radius:3px;transition:all 0.3s ease;pointer-events:none;}.hamburger.active span:nth-child(1){transform:rotate(45deg) translateY(10px);}.hamburger.active span:nth-child(2){opacity:0;}.hamburger.active span:nth-child(3){transform:rotate(-45deg) translateY(-10px);}.mobile-nav-overlay{position:fixed;top:0;left:0;width:100%;height:100vh;background:linear-gradient(135deg,#1e4620 0%,#2d5c1e 50%,#3d6e2a 100%);z-index:10000;display:flex;flex-direction:column;padding:2rem;transform:translateX(-100%);transition:transform 0.4s cubic-bezier(0.4,0,0.2,1);-webkit-overflow-scrolling:touch;}.mobile-nav-overlay.active{transform:translateX(0);}.mobile-close-btn{align-self:flex-end;background:none;border:none;color:white;font-size:2rem;cursor:pointer;padding:0.5rem 1rem;touch-action:manipulation;-webkit-tap-highlight-color:transparent;}.mobile-nav-links{display:flex;flex-direction:column;gap:1.5rem;margin-top:3rem;}.mobile-nav-link{color:white;text-decoration:none;font-size:1.3rem;font-weight:600;padding:1rem;border-radius:10px;transition:background 0.3s ease;touch-action:manipulation;-webkit-tap-highlight-color:transparent;}.mobile-nav-link:hover{background:rgba(255,255,255,0.1);}.social-links{display:flex;gap:1rem;align-items:center;margin-left:2rem;}.social-link{width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,rgba(125,185,40,0.1) 0%,rgba(93,146,22,0.15) 100%);border-radius:50%;border:2px solid rgba(93,146,22,0.3);transition:all 0.4s cubic-bezier(0.4,0,0.2,1);position:relative;overflow:hidden;backdrop-filter:blur(10px);box-shadow:0 2px 8px rgba(0,0,0,0.1),inset 0 1px 0 rgba(255,255,255,0.2);}.social-link::before{content:'';position:absolute;top:50%;left:50%;width:0;height:0;border-radius:50%;background:radial-gradient(circle,rgba(125,185,40,0.3) 0%,rgba(93,146,22,0.2) 100%);transform:translate(-50%,-50%);transition:width 0.5s,height 0.5s;}.social-link:hover::before{width:100%;height:100%;}.social-link:hover{transform:translateY(-3px) scale(1.1);border-color:var(--accent-green);background:linear-gradient(135deg,rgba(125,185,40,0.2) 0%,rgba(93,146,22,0.25) 100%);box-shadow:0 8px 20px rgba(93,146,22,0.3),0 0 20px rgba(125,185,40,0.2),inset 0 1px 0 rgba(255,255,255,0.3);}.social-link svg{width:20px;height:20px;fill:var(--accent-green);transition:all 0.3s ease;position:relative;z-index:1;filter:drop-shadow(0 1px 2px rgba(0,0,0,0.1));}.social-link:hover svg{fill:var(--primary-green);transform:scale(1.1);filter:drop-shadow(0 2px 4px rgba(0,0,0,0.2));}.social-link.facebook:hover{background:linear-gradient(135deg,rgba(24,119,242,0.15) 0%,rgba(24,119,242,0.2) 100%);border-color:rgba(24,119,242,0.5);box-shadow:0 8px 20px rgba(24,119,242,0.25),0 0 20px rgba(24,119,242,0.15);}.social-link.facebook:hover svg{fill:#1877f2;}.social-link.instagram:hover{background:linear-gradient(135deg,rgba(225,48,108,0.15) 0%,rgba(193,53,132,0.2) 50%,rgba(131,58,180,0.2) 100%);border-color:rgba(225,48,108,0.5);box-shadow:0 8px 20px rgba(225,48,108,0.25),0 0 20px rgba(193,53,132,0.15);}.social-link.instagram:hover svg{fill:url(#instagram-gradient);}@media(max-width:1024px){.social-links{display:none;}}
    </style>
</head>
<body>
    <!-- Navigation -->
    <nav class="navbar" id="navbar">
        <div class="nav-container">
            <a href="index.html" class="logo-container">
                <div class="logo-text-wrapper">
                    <div class="logo-greeting">⚒️ Glück auf</div>
                    <div class="logo-company">
                        <img src="https://www.baumdienst-kruda.de/wp-content/uploads/2024/12/cropped-wq1-12.png" alt="Logo" class="logo-small-icon">
                        <span class="logo-company-text">Baumdienst KRUDA</span>
                    </div>
                </div>
            </a>
            <ul class="nav-links">
                <li><a href="index.html#home" class="nav-link">Home</a></li>
                <li><a href="index.html#about" class="nav-link">Über uns</a></li>
                <li><a href="index.html#services" class="nav-link">Leistungen</a></li>
                <li><a href="index.html#contact" class="nav-cta">Kontakt</a></li>
            </ul>
        </div>
    </nav>

    <!-- Main Content -->
    <main class="legal-content">
        <div class="page-header">
            <span class="page-tag">DATENSCHUTZ</span>
            <h1 class="page-title">Datenschutzerklärung</h1>
        </div>

        <div class="content-section">
            <h2>1. Datenschutz auf einen Blick</h2>

            <h3>Allgemeine Hinweise</h3>
            <p>
                Die folgenden Hinweise geben einen einfachen Überblick darüber, was mit Ihren personenbezogenen Daten passiert, wenn Sie diese Website besuchen. Personenbezogene Daten sind alle Daten, mit denen Sie persönlich identifiziert werden können. Ausführliche Informationen zum Thema Datenschutz entnehmen Sie unserer unter diesem Text aufgeführten Datenschutzerklärung.
            </p>

            <h3>Datenerfassung auf dieser Website</h3>
            <p><strong>Wer ist verantwortlich für die Datenerfassung auf dieser Website?</strong></p>
            <p>
                Die Datenverarbeitung auf dieser Website erfolgt durch den Websitebetreiber. Dessen Kontaktdaten können Sie dem Impressum dieser Website entnehmen.
            </p>

            <p><strong>Wie erfassen wir Ihre Daten?</strong></p>
            <p>
                Ihre Daten werden zum einen dadurch erhoben, dass Sie uns diese mitteilen. Hierbei kann es sich z.B. um Daten handeln, die Sie in ein Kontaktformular eingeben.
            </p>
            <p>
                Andere Daten werden automatisch beim Besuch der Website durch unsere IT-Systeme erfasst. Das sind vor allem technische Daten (z.B. Internetbrowser, Betriebssystem oder Uhrzeit des Seitenaufrufs). Die Erfassung dieser Daten erfolgt automatisch, sobald Sie diese Website betreten.
            </p>

            <p><strong>Wofür nutzen wir Ihre Daten?</strong></p>
            <p>
                Ein Teil der Daten wird erhoben, um eine fehlerfreie Bereitstellung der Website zu gewährleisten. Andere Daten können zur Analyse Ihres Nutzerverhaltens verwendet werden.
            </p>

            <p><strong>Welche Rechte haben Sie bezüglich Ihrer Daten?</strong></p>
            <p>
                Sie haben jederzeit das Recht unentgeltlich Auskunft über Herkunft, Empfänger und Zweck Ihrer gespeicherten personenbezogenen Daten zu erhalten. Sie haben außerdem ein Recht, die Berichtigung oder Löschung dieser Daten zu verlangen. Hierzu sowie zu weiteren Fragen zum Thema Datenschutz können Sie sich jederzeit unter der im Impressum angegebenen Adresse an uns wenden. Des Weiteren steht Ihnen ein Beschwerderecht bei der zuständigen Aufsichtsbehörde zu.
            </p>
        </div>

        <div class="content-section">
            <h2>2. Hosting und Content Delivery Networks (CDN)</h2>

            <h3>Externes Hosting</h3>
            <p>
                Diese Website wird bei Alfahosting gehostet. Die personenbezogenen Daten, die auf dieser Website erfasst werden, werden auf den Servern des Hosters gespeichert. Hierbei kann es sich v.a. um IP-Adressen, Kontaktanfragen, Meta- und Kommunikationsdaten, Vertragsdaten, Kontaktdaten, Namen, Webseitenzugriffe und sonstige Daten, die über eine Website generiert werden, handeln.
            </p>
            <p>
                Der Einsatz des Hosters erfolgt zum Zwecke der Vertragserfüllung gegenüber unseren potenziellen und bestehenden Kunden (Art. 6 Abs. 1 lit. b DSGVO) und im Interesse einer sicheren, schnellen und effizienten Bereitstellung unseres Online-Angebots durch einen professionellen Anbieter (Art. 6 Abs. 1 lit. f DSGVO).
            </p>

            <h3>Google Fonts</h3>
            <p>
                Diese Seite nutzt zur einheitlichen Darstellung von Schriftarten so genannte Google Fonts, die von Google bereitgestellt werden. Beim Aufruf einer Seite lädt Ihr Browser die benötigten Fonts in ihren Browsercache, um Texte und Schriftarten korrekt anzuzeigen.
            </p>
            <p>
                Zu diesem Zweck muss der von Ihnen verwendete Browser Verbindung zu den Servern von Google aufnehmen. Hierdurch erlangt Google Kenntnis darüber, dass über Ihre IP-Adresse diese Website aufgerufen wurde. Die Nutzung von Google Fonts erfolgt im Interesse einer einheitlichen und ansprechenden Darstellung unserer Online-Angebote. Dies stellt ein berechtigtes Interesse im Sinne von Art. 6 Abs. 1 lit. f DSGVO dar.
            </p>
            <p>
                Weitere Informationen zu Google Fonts finden Sie unter <a href="https://developers.google.com/fonts/faq" target="_blank" rel="noopener noreferrer">https://developers.google.com/fonts/faq</a> und in der Datenschutzerklärung von Google: <a href="https://policies.google.com/privacy" target="_blank" rel="noopener noreferrer">https://policies.google.com/privacy</a>.
            </p>
        </div>