@media screen and (max-width:360px) {
    .info {
      padding: 10px 0px 10px 0px;
      top: 90px;
    }
    .agb-impressum-datenschutz-container .section {
         padding: 0; 
         word-break: break-word;
    }
  }

  @media screen and (max-width:370px) {
    .info {
        padding: 10px 0px 10px 0px;
        top: 90px;
      }
    .info span {
        display: block;
    }
    .w-auto {
        width: auto!important;
    }
}

@media screen and (min-width: 371px) and (max-width: 400px) { 
    .info {
        top: 90px;
      }
}

@media screen and (min-width: 401px) and (max-width: 1095px) { 
    .info {
        top: 93px;
      }
}

@media screen and (max-width: 400px) {
:root {
    --site-header-height: 76px;
}
.site-topbar {
    display: none;
}
.site-header__inner {
    padding: 16px 16px;
}
.site-brand__mark {
    width: 44px;
    height: 44px;
    border-radius: 14px;
}
.site-brand__copy strong {
    font-size: 0.83rem;
}
.site-brand__copy small {
    font-size: 0.64rem;
}
.site-hero {
    padding: 40px 0 48px;
}
.site-hero__inner {
    padding: 0 16px;
    grid-template-columns: 1fr;
    gap: 22px;
}
.site-hero__title {
    font-size: 2.3rem;
}
.site-hero__description {
    font-size: 0.98rem;
}
.site-hero__highlights {
    grid-template-columns: 1fr;
}
.site-hero__actions {
    flex-direction: column;
}

.site-hero__panel {
    padding: 22px;
}
.site-hero__stats {
    grid-template-columns: 1fr;
}
.services {
    padding: 20px;
}
.services h1 {
    font-size: 1.5em;
}
.services .row {
    display: grid;
    grid-template-columns: 1fr;
    grid-gap: 30px;
}
.how-we-works {
    padding: 20px;
}

.how-we-works .how-we-works__header {
    margin-bottom: 30px;
}

.how-we-works .how-we-works__title {
    font-size: clamp(1.6rem, 6.6vw, 2.3rem);
}

.how-we-works .how-we-works__sub {
    font-size: 0.95rem;
}
.why-us {
    padding: 20px;
}
.CTA {
    padding: 20px;
}
.erfolg .container {
    min-height: 150px;
}
.gallery {
    padding: 20px;
}
.user-reviews {
    padding: 20px;
}
.agb-impressum-datenschutz-wrap {
    padding: 30px 20px;
}
.write-review-section {
    padding: 50px 20px 40px;
}
.write-review-section__form {
    padding: 28px 20px;
}
.online-offert {
    padding: 30px 20px;
}
.three-grid, .two-grid {
    grid-template-columns: repeat(1, 1fr);
  }
.prefooter {
    padding: 20px;
}
footer {
    padding: 20px 20px 0px 20px;
}
}

@media screen and (max-width: 450px) {
    .info {
        text-align: center!important;
        padding: 10px 10px 10px 10px;
      }
    .why-us .row {
      display: grid;
     grid-template-columns: auto;
      gap: 20px;
  }
  .gallery .comparsison-wrapper {
    display: grid;
     grid-template-columns: 1fr;
    gap: 20px;
}
.checkbox-item {
    display: flex;
    justify-content: center;
}
  }

@media screen and (min-width: 401px) and (max-width: 500px) {
    :root {
        --site-header-height: 88px;
    }
    .site-topbar {
        display: none;
    }
    .site-header__inner {
        padding: 18px 20px;
    }
    .site-hero {
        padding: 48px 0 56px;
    }
    .site-hero__inner {
        padding: 0 20px;
        grid-template-columns: 1fr;
    }
    .site-hero__title {
        font-size: 2.6rem;
    }
    .site-hero__highlights,
    .site-hero__stats {
        grid-template-columns: 1fr;
    }
    .site-hero__actions {
        flex-direction: column;
    }
    .site-button,
    .site-header__phone,
    .site-header__cta {
        width: 100%;
    }
    .info {
        text-align: center!important;
        padding: 10px 10px 10px 10px;
      }
      .three-grid {
        gap: 0rem 1.5rem;
        display: grid;
        grid-template-columns: repeat(1, 1fr);
    }
    .two-grid {
        gap: 0rem 1.5rem;
        display: grid;
        grid-template-columns: repeat(1, 1fr);
    }
    .w-auto {
        width: auto!important;
    }
    .checkbox-item {
        display: flex;
        justify-content: center;
    }
}

@media screen and (min-width: 501px) and (max-width: 700px) {
    :root {
        --site-header-height: 90px;
    }
    .site-topbar {
        display: none;
    }
    .site-hero__inner {
        padding: 0 24px;
        grid-template-columns: 1fr;
    }
    .site-hero__highlights,
    .site-hero__stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .three-grid {
        gap: 0rem 1.5rem;
        display: grid;
        grid-template-columns: repeat(2, 1fr);
    }
    .two-grid {
        gap: 0rem 1.5rem;
        display: grid;
        grid-template-columns: repeat(1, 1fr);
    }
}

@media (min-width: 501px) and (max-width: 550px) {
    .user-reviews .testimonials-wrap .testimonials {
        padding: 18px;
        border-radius: 12px;
    }
    .user-reviews .testimonials-wrap .testimonials .user {
        flex-wrap: wrap;
    }
    .user-reviews .review-context {
        flex-direction: column;
        align-items: flex-start;
        gap: 6px;
    }
    .user-reviews .review-source {
        margin-left: 0;
    }
    .user-reviews .review-meta {
        flex-direction: column;
        align-items: flex-start;
        gap: 6px;
    }
  }


  
  @media screen and (min-width: 701px) and (max-width: 1095px) {
        :root {
            --site-header-height: 90px;
        }
  }

  @media screen and (max-width: 1095px) {
        :root {
            --site-topbar-height: 0px;
            --site-header-offset: var(--site-header-height);
        }
        .site-topbar {
            display: block;
            position: fixed;
            top: auto;
            bottom: 12px;
            left: 12px;
            right: 12px;
            width: auto;
            z-index: 1400;
            border: 1px solid rgba(255, 255, 255, 0.12);
            border-radius: 22px;
            background: rgba(23, 24, 28, 0.94);
            backdrop-filter: blur(18px);
            box-shadow: 0 18px 42px rgba(0, 0, 0, 0.35);
        }
        .site-topbar__inner {
            padding: 0;
            max-width: none;
            display: grid;
            grid-template-columns: repeat(4, minmax(0, 1fr));
            gap: 0;
            flex-wrap: nowrap;
        }
        .site-topbar__item {
            min-width: 0;
            min-height: 74px;
            padding: 12px 8px 14px;
            justify-content: center;
            flex-direction: column;
            gap: 8px;
            font-size: 0.76rem;
            line-height: 1.2;
            letter-spacing: 0.02em;
            text-transform: none;
            text-align: center;
            border-right: 1px solid rgba(255, 255, 255, 0.08);
        }
        .site-topbar__item:last-child {
            border-right: 0;
        }
        .site-topbar__item i {
            font-size: 1.3rem;
            color: #ffffff;
        }
        .site-topbar__inner .site-topbar__item--desktop {
            display: none;
        }
        .site-topbar__inner .site-topbar__item--mobile {
            display: inline-flex;
            word-break: break-word;
            hyphens: auto;
            white-space: normal;
        }
        .site-topbar__label--desktop {
            display: none;
        }
        .site-topbar__label--mobile {
            display: inline;
        }
        body {
            padding-bottom: 98px;
        }
        .site-nav,
        .site-header__phone,
        .site-header__cta {
            display: none;
        }
        .site-nav-toggle,
        .site-mobile-nav {
            display: block;
        }
        .site-mobile-nav:not(.is-open) {
            display: none;
        }
        .site-header__inner {
            padding: 18px 24px;
        }
        .site-header {
            top: 0;
        }
        .site-hero {
            padding-top: 46px;
            padding-bottom: 56px;
        }
        .site-hero__inner {
            padding: 0 24px;
            grid-template-columns: 1fr;
        }
        .site-hero__copy {
            max-width: 100%;
        }
        .site-hero__panel {
            max-width: 100%;
        }
    .container {
      flex-direction: column;
      align-items: center;
  }

  .box {
      margin-bottom: 20px;
  }
  }

  @media screen and (min-width: 1680px) {
    .why-us .row {
      grid-template-columns: repeat(4, 1fr)!important;
  }
  }

    @media screen and (max-width: 550px) {
        .user-reviews .testimonials-column-set {
            grid-template-columns: 1fr;
            gap: 14px;
        }
    }

    @media (min-width: 551px) and (max-width: 768px) {
        .user-reviews .testimonials-column-set {
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 16px;
        }
    }

@media screen and (max-width: 1095px) {
    .user-reviews {
        padding: 64px 24px;
    }

    .user-reviews .user-reviews__header {
        margin-bottom: 42px;
    }
}

@media screen and (max-width: 550px) {
    .user-reviews {
        padding: 48px 16px;
    }

    .user-reviews .user-reviews__title {
        font-size: clamp(1.65rem, 7vw, 2.15rem);
    }

    .user-reviews .user-reviews__cta {
        justify-content: center;
    }
}

@media screen and (max-width: 1095px) {
    .gallery {
        padding: 64px 24px;
    }

    .gallery .gallery__header {
        margin-bottom: 38px;
    }

    .gallery .gallery__chips {
        gap: 6px;
    }

    .gallery .comparsison-wrapper {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media screen and (max-width: 700px) {
    .gallery {
        padding: 48px 16px;
    }

    .gallery .gallery__title {
        font-size: clamp(1.65rem, 7vw, 2.25rem);
    }

    .gallery .gallery__sub {
        font-size: 0.95rem;
    }

    .gallery .comparsison-wrapper {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .gallery .comparsison-wrapper .comparison-container .comparison-label {
        font-size: 0.62rem;
        padding: 5px 9px;
    }
}

@media screen and (max-width: 1095px) {
    .site-hero {
        padding-top: 54px;
        padding-bottom: 62px;
    }

    .site-hero .site-hero__inner,
    .site-hero .site-hero__copy,
    .site-hero .site-hero__panel,
    .site-hero .site-hero__actions,
    .site-hero .site-hero__stats {
        min-width: 0;
        width: 100%;
        box-sizing: border-box;
    }

    .site-hero .site-hero__inner {
        gap: 20px;
        align-items: start;
    }

    .site-hero .site-hero__title,
    .site-hero .site-hero__title span,
    .site-hero .site-hero__description,
    .site-hero .site-hero__panel h2,
    .site-hero .site-hero__panel p,
    .site-hero .site-hero__highlights li {
        overflow-wrap: anywhere;
        word-break: break-word;
    }

    .site-hero .site-button {
        max-width: 100%;
        box-sizing: border-box;
    }

    .site-hero .site-hero__description {
        margin-top: 16px;
        font-size: 1rem;
        line-height: 1.6;
    }

    .site-hero .site-hero__actions {
        margin-top: 22px;
    }

    .site-hero .site-hero__pills {
        margin-top: 16px;
        gap: 8px;
    }

    .site-hero .site-hero__pills span {
        min-height: 34px;
        padding: 0 10px;
        font-size: 0.84rem;
    }

    .site-hero .site-hero__panel {
        padding: 20px;
        border-radius: 22px;
    }

    .site-hero .site-hero__panel h2 {
        margin: 10px 0 8px;
        font-size: 1.25rem;
    }

    .site-hero .site-hero__stats {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 8px;
        margin-top: 16px;
    }

    .site-hero .site-hero__stat {
        padding: 12px 10px;
        border-radius: 14px;
    }

    .site-hero .site-hero__stat strong {
        font-size: 1.2rem;
    }
}

@media screen and (max-width: 700px) {
    .how-we-works {
        padding: 48px 16px;
    }

    .how-we-works .box {
        max-width: 100%;
    }

    .site-hero .site-hero__actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .site-hero .site-button {
        width: 100%;
    }

    .site-hero .site-hero__title {
        font-size: clamp(1.8rem, 8.6vw, 2.5rem);
        line-height: 0.96;
    }

    .site-hero .site-hero__eyebrow {
        margin-bottom: 14px;
        font-size: 0.72rem;
        letter-spacing: 0.14em;
    }

    .site-hero .site-hero__highlights {
        margin-top: 18px;
        gap: 10px;
    }

    .site-hero .site-hero__highlights li {
        font-size: 0.92rem;
    }

    .site-hero .site-hero__stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media screen and (max-width: 400px) {
    .site-hero {
        padding-top: 42px;
        padding-bottom: 46px;
    }

    .site-hero .site-hero__title {
        font-size: clamp(1.55rem, 8vw, 2rem);
    }

    .site-hero .site-hero__description {
        font-size: 0.93rem;
    }

    .site-hero .site-hero__actions {
        gap: 10px;
    }

    .site-hero .site-hero__panel {
        padding: 16px;
        border-radius: 18px;
    }

    .site-hero .site-hero__stats {
        grid-template-columns: 1fr;
    }
}