/* Style für das Popup-Overlay */
        .popup-overlay {
            display: none; /* Standardmäßig versteckt */
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, 0.7); /* Transparenter schwarzer Hintergrund */
            z-index: 1000;
        }

        /* Style für das Popup-Fenster */
        .popup-content {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            background: white;
            padding: 20px;
            border-radius: 10px;
            max-width: 400px;
            width: 100%;
            text-align: center;
        }

        /* Style für den Schließen-Button */
        .close-popup {
            position: absolute;
            top: 10px;
            right: 10px;
            cursor: pointer;
        }
        .region-wrapper {
        display: flex;
        gap: 30px;
        flex-wrap: wrap;
        }

        .region-box {
        flex: 1;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        border: 1px solid #ddd;
        padding: 20px;
        min-height: 400px; /* Höhe anpassen nach Wunsch */
        box-sizing: border-box;
        }

        .region-box img {
        max-width: 100%;
        height: auto;
        }

        .region-box h3:last-of-type {
        margin-top: auto;
        }

         .section-wrapper {
                background-color: #f7f7f7;
                padding: 60px 20px;
            }

            .card-container {
                display: flex;
                justify-content: space-between;
                gap: 20px;
                flex-wrap: wrap;
                width: 100%;
                max-width: 100%;
                padding: 0 30px;
                box-sizing: border-box;
            }

            .card {
                flex: 1 1 48%;
                background-color: #f8f8f8;
                border-radius: 6px;
                box-sizing: border-box;
                min-width: 320px;
            }

            .card h3 {
                color: #db9881;
                margin-bottom: 20px;
            }

            .card ul {
                list-style: none;
                padding: 0;
                margin: 0;
            }

            .card ul li::before {
                content: "✔️";
                margin-right: 8px;
                color: #db9881;
            }

            .columns {
                display: flex;
                flex-wrap: wrap;
                gap: 40px;
            }

            .columns ul {
                flex: 1;
                min-width: 250px;
            }

.wdr-logo{
  max-width:126px; border-radius:12px; box-shadow:0 6px 16px rgba(0,0,0,.18);
  margin-top:10px; transition:transform .2s ease; cursor:pointer;
}
.wdr-logo:hover{ transform:scale(1.04); }

.wdr-trigger{ position:relative; display:inline-block; }

/* Popover */
.wdr-popover{
  position:absolute; left:50%; top:100%; transform:translate(-50%, 10px);
  background:#000; border-radius:12px; padding:6px; z-index:30;
  box-shadow:0 12px 28px rgba(0,0,0,.28);
  opacity:0; visibility:hidden; transition:opacity .15s ease, transform .15s ease, visibility 0s .15s;
}
.wdr-popover::before{
  content:""; position:absolute; top:-8px; left:50%; transform:translateX(-50%) rotate(45deg);
  width:14px; height:14px; background:#000;
}
.wdr-preview{ width:320px; max-width:72vw; height:auto; border-radius:8px; display:block; }

/* Hover sichtbar (nur Desktop-Hover) */
@media (hover:hover){
  .wdr-trigger:hover .wdr-popover,
  .wdr-trigger:focus .wdr-popover{
    opacity:1; visibility:visible; transform:translate(-50%, 6px); transition-delay:0s;
  }
}

/* Modal */
.wdr-modal{ position:fixed; inset:0; display:flex; align-items:center; justify-content:center;
  background:rgba(0,0,0,.7); z-index:10000; opacity:0; visibility:hidden; transition:opacity .2s, visibility .2s; }
.wdr-modal.open{ opacity:1; visibility:visible; }
.wdr-modal-content{ background:#fff; width:min(90vw,820px); padding:20px; border-radius:14px; box-shadow:0 8px 20px rgba(0,0,0,.3); position:relative; }
.wdr-close{ position:absolute; top:10px; right:14px; font-size:28px; line-height:1; border:0; background:transparent; cursor:pointer; }
.sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }

body.modal-open{ overflow:hidden; }

/* Auf Touch-Geräten kein Hover-Popover anzeigen */
@media (hover:none){ .wdr-popover{ display:none !important; } }

.wdr-popover{
  background:rgba(0,0,0,.75); /* halbtransparent schwarz */
  border-radius:8px;
  padding:2px;                /* dünner Rand */
  box-shadow:0 6px 16px rgba(0,0,0,.25); /* weicher Schatten */
}

.team-section {
    padding: 50px 0;
    background-color: #F4F5F7;
}

/* Nur im Team-Bereich: Flex-Grid mit 4 Spalten */
.team-row {
    display: flex;
    flex-wrap: wrap;
    justify-content: center; /* optional, sieht meistens schöner aus */
}

/* 4 Spalten auf Desktop */
.team-member {
    flex: 1 1 calc(25% - 30px); /* 4 Spalten mit Abstand */
    margin: 15px;
    display: flex;              /* sorgt dafür, dass .team-card gestreckt werden kann */
    flex-direction: column;
}

/* Karten auf gleiche Höhe bringen */
.team-card {
    position: relative;
    background-color: #6e6e6e;
    padding: 30px 20px;
    border-radius: 15px;
    text-align: center;
    margin-bottom: 120px;
    flex: 1;                    /* Karte füllt die komplette Höhe der Spalte */
    display: flex;
    flex-direction: column;
}

.team-image {
    width: 220px;
    height: 220px;
    border-radius: 50%;
    overflow: hidden;
    position: absolute;
    top: -115px;
    left: 50%;
    transform: translateX(-50%);
    border: 5px solid #db9881;
}

.team-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.team-content {
    padding-top: 70px; /* Platz für das runde Bild */
    flex: 1;           /* Textbereich füllt die Karte nach unten aus */
}

.team-content h3 {
    font-size: 24px;
    color: white;
    margin-bottom: 10px;
}

.team-content h4 {
    font-size: 18px;
    color: #db9881;
    margin-bottom: 15px;
}

.team-content p {
    font-size: 16px;
    color: #e6e6e6;
    margin-bottom: 0;
}

/* Tablet: 2 Spalten */
@media (max-width: 992px) {
    .team-member {
        flex: 1 1 calc(50% - 30px);
        margin-bottom: 40px;
    }
}

/* Mobile: 1 Spalte */
@media (max-width: 768px) {
    .team-member {
        flex: 1 1 100%;
        margin: 0 0 40px;
    }

    .team-card {
        margin-bottom: 115px;
    }
}

.as-seen-on{background:linear-gradient(90deg,#e9f5ff,#f7fbff); padding:10px 0; border-top:1px solid #e2eef6; border-bottom:1px solid #e2eef6}
.aso-inner{max-width:1100px; margin:auto; padding:0 16px; display:flex; gap:10px; align-items:center; justify-content:center; flex-wrap:wrap}
.aso-label{font-size:.85rem; letter-spacing:.06em; text-transform:uppercase; color:#0b5a91}
.aso-inner img{height:22px; width:auto; filter:grayscale(0)}
.aso-link{font-weight:700; text-decoration:none; color:#0b5a91}
.aso-link:hover{text-decoration:underline}


.wdr-logo2 {
  max-width: 70px;
  border-radius: 12px;   /* Ecken abrunden */
  box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}

        .stars-container {
            display: inline-block;
            font-size: 1.4em;
            position: relative;
            color: #e0e0e0; /* graue Sterne für leere Sterne */
        }

        .stars-container::before {
            content: "★★★★★";
            color: #e0e0e0; /* Graue Sterne für leere Sterne */
            position: absolute;
            left: 0;
            top: 0;
            width: 100%;
            overflow: hidden;
        }

        .stars-container::after {
            content: "★★★★★";
            position: absolute;
            top: 0;
            left: 0;
            color: gold;
            overflow: hidden;
            white-space: nowrap;
        }

        [data-rating="5.0"]::after { width: 100%; }
        [data-rating="4.9"]::after { width: 98%; }
        [data-rating="4.8"]::after { width: 96%; }
        [data-rating="4.7"]::after { width: 94%; }
        [data-rating="4.6"]::after { width: 92%; }
        [data-rating="4.5"]::after { width: 90%; }
        [data-rating="4.4"]::after { width: 88%; }
        [data-rating="4.3"]::after { width: 86%; }
        [data-rating="4.2"]::after { width: 84%; }
        [data-rating="4.1"]::after { width: 82%; }
        [data-rating="4.0"]::after { width: 80%; }

        .recommend-icon {
            font-size: 1.5em;
            vertical-align: middle;
        }
        .testimonial-content {
        text-align: center;
        padding: 20px;
        background-color: #f9f9f9;
        border: 1px solid #ddd;
        border-radius: 10px;
        margin-bottom: 30px;
        }

        .rating {
        color: gold;
        font-weight: bold;
        font-size: 1.2em;
        }

        .carousel-control-prev-icon, .carousel-control-next-icon {
        background-color: #000; /* Schwarze Pfeile */
        border-radius: 50%;
        }

        .carousel-control-prev, .carousel-control-next {
        width: 5%;
        }

        .carousel-item {
        padding: 0px;
        background-color: #fff;
        border-radius: 10px;
        }

        /* Grüner Kreis mit Smiley */
        .strong::before {
        content: '😊'; /* Smiley */
        display: inline-block;
        background-color: green;
        color: white;
        border-radius: 50%;
        padding: 5px 10px;
        margin-right: 10px;
        }
        /* Anpassung des Containers, damit er schmaler ist */
        .container2 {
            max-width: 950px; /* Reduziert die Breite des Containers */
            margin: 0 auto; /* Zentriert den Container */
        }

        /* Standardgröße der Aufklapp-Icons für alle Zustände */
        .card-header a::after {
            font-size: 16px; /* Icon-Größe festlegen */
            content: "\f078"; /* Pfeil nach unten (FontAwesome) */
            font-family: "FontAwesome"; /* FontAwesome Icon */
            float: right;
            transition: transform 0.2s ease-in-out;
            vertical-align: middle; /* Vertikale Ausrichtung mittig */
            position: relative; /* Erlaubt Verschiebung */
            top: -20px; /* Hebt das Icon leicht an */
        }
        /* Wenn das Accordion geschlossen ist (collapsed) */
        .card-header a.collapsed::after {
            content: "\f078"; /* Pfeil nach unten (FontAwesome) */
            transform: rotate(0deg); /* Keine Drehung für eingeklappte Items */
            font-size: 16px; /* Icon-Größe festlegen */
            content: "\f078"; /* Pfeil nach unten (FontAwesome) */

        }

        /* Wenn das Accordion geöffnet ist */
        .card-header a:not(.collapsed)::after {
            content: "\f077"; /* Pfeil nach oben (FontAwesome) */
            transform: rotate(0deg); /* Keine zusätzliche Drehung */
        }
    
        .error-hero {
            position: relative;
            padding-top: 51px;
            background: #f8f8f8;
        }

        .error-hero img {
            width: 100%;
            height: auto;
            display: block;
        }

        .error-section {
            padding: 70px 0 80px;
        }

        .error-code {
            font-size: 126px;
            line-height: 1;
            font-weight: 700;
            color: #db9881;
            margin-bottom: 20px;
        }

        .error-title {
            font-size: 34px;
            line-height: 1.25;
            margin-bottom: 20px;
        }

        .error-text {
            font-size: 18px;
            line-height: 1.7;
            color: #555;
            max-width: 680px;
            margin: 0 auto 30px;
        }

        .error-links {
            margin-top: 30px;
        }

        .error-links .btn {
            margin: 0px;
            min-width: 220px;
        }

        .error-help {
            margin-top: 35px;
            padding-top: 30px;
            border-top: 1px solid #e9e9e9;
            color: #666;
            font-size: 16px;
            line-height: 1.7;
        }

        .error-help a {
            color: #93c01f;
            font-weight: 600;
        }

        @media (max-width: 767px) {
            .error-section {
                padding: 55px 0 55px;
            }

            .error-box {
                padding: 35px 20px;
            }

            .error-code {
                font-size: 58px;
            }

            .error-title {
                font-size: 28px;
            }

            .error-text {
                font-size: 16px;
            }

            .error-links .btn {
                width: 100%;
                min-width: auto;
            }
        }