/* LP-Subheadline: Farbe, Lato, fett, einheitliche Größe auf allen Devices */
.lp-hero-sub .et_pb_text_inner,
.lp-hero-sub .et_pb_text_inner p,
.lp-hero-sub h2,
.lp-hero-sub span {
  color: #BFA14C !important;
  font-family: 'Lato', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
  font-weight: 700 !important;
  font-size: 1.5rem !important;  /* ≈ 20px – ein Wert für alle Geräte */
  line-height: 1.4 !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}


/* LP-Subheadline: Farbe, Lato, fett, einheitliche Größe auf allen Devices */
.lp-hero-sub-grey .et_pb_text_inner,
.lp-hero-sub-grey .et_pb_text_inner p,
.lp-hero-sub-grey h2,
.lp-hero-sub-grey span {
  color: #d3d3d3 !important;
  font-family: 'Lato', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
  font-weight: 700 !important;
  font-size: 1.5rem !important;  /* ≈ 24px – ein Wert für alle Geräte */
  line-height: 1.4 !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* LP-Subheadline: Farbe, Lato, fett, einheitliche Größe auf allen Devices */
.lp-hero-sub-white .et_pb_text_inner,
.lp-hero-sub-white .et_pb_text_inner p,
.lp-hero-sub-white h2,
.lp-hero-sub-white span {
  color: #ffffff !important;
  font-family: 'Lato', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
  font-weight: 700 !important;
  font-size: 1.5rem !important;  /* ≈ 20px – ein Wert für alle Geräte */
  line-height: 1.4 !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}



.lp-footer-text-p p {
  color: #ffffff !important;
}






/* =========================================================
   LP – Steps Block
   ========================================================= */

:root {
  --lp-gold: #BFA14C;
  --lp-blue: #25283d;
  --lp-text: #1b1b1b;
  --lp-muted: #6B7280;
  --lp-card: #ffffff;
}

/* Sektion */
.lp-steps {
  position: relative;

  background: #f7f7f8; /* hell gegen dunklen Block davor */
}

/* Headline */
.lp-steps__headline {
  text-align: center;
  margin: 0 0 28px;
  line-height: 1.2;
  color: var(--lp-blue);
}

/* Entfernt die zweite Linie (nur goldene Track-Linie bleibt sichtbar) */
.lp-steps__headline::after {
  content: none !important;
}

/* Track-Linie (Desktop) */
.lp-steps__track {
  display: none;
}
@media (min-width: 981px) {
  .lp-steps__track {
    display: block;
    position: absolute;
    top: 150px;
    left: 50%;
    width: 60%;
    height: 4px;
    transform: translateX(-50%);
    background: linear-gradient(
      90deg,
      rgba(191, 161, 76, 0.15),
      rgba(191, 161, 76, 0.5),
      rgba(191, 161, 76, 0.15)
    );
    border-radius: 4px;
  }
}

/* Grid */
.lp-steps__list {
  list-style: none; /* entfernt die Zahlen */
  margin: 0 auto;
  padding: 0 20px;
  max-width: 1180px;
  display: grid;
  gap: 22px;
}
@media (min-width: 981px) {
  .lp-steps__list {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 24px;
    padding: 0 40px;
  }
}

/* Entfernt Marker absolut zuverlässig */
ol.lp-steps__list,
ol.lp-steps__list > li {
  list-style: none !important;
}
ol.lp-steps__list > li.lp-step::marker {
  content: "" !important;
  font-size: 0 !important;
}

/* Card */
.lp-step {
  position: relative;
  background: var(--lp-card);
  border: 1px solid rgba(0, 0, 0, 0.06);
  border-radius: 14px;
  padding: 24px 18px 22px;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.06);
  text-align: center;
  transition: 0.2s ease;
}

/* Hover */
.lp-step:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.08);
}

/* Icon + Nummer */
.lp-step__icon {
  font-size: 28px;
  line-height: 1;
  margin-bottom: 10px;
  margin-top: 8px; /* leicht nach unten rücken, damit es optisch ausgewogen bleibt */
}
.lp-step__badge {
  position: absolute;
  top: -12px;
  left: 50%;
  transform: translateX(-50%);
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  background: var(--lp-gold);
  color: #111;
  font-weight: 700;
  border-radius: 999px;
  box-shadow: 0 2px 0 rgba(0, 0, 0, 0.12);
  margin-bottom: 12px; /* zusätzlicher Space nach unten */
}

/* Inhalte */
.lp-step__title {
  margin: 0.25rem 0 0.4rem;
  font-size: 1.125rem;
  line-height: 1.25;
  color: var(--lp-blue);
}
.lp-step__text {
  margin: 0;
  color: var(--lp-muted);
  font-size: 0.98rem;
  line-height: 1.45;
}

/* =========================================================
   LP – Steps Block – Mobile Styles
   ========================================================= */
@media (max-width: 980px) {


  .lp-step {
    text-align: center; /* zentriert alles */
    padding: 24px 16px 20px;
  }

  /* Goldene Nummer */
  .lp-step__badge {
    position: relative; /* nicht mehr absolut – ordnet sich sauber über dem Icon ein */
    left: 50%;
    transform: translateX(-50%);
    margin-bottom: 10px; /* Luft nach unten */
    top: 0;
  }

  /* Icon */
  .lp-step__icon {
    font-size: 24px;
    margin-top: 8px;
    margin-bottom: 10px;
  }

  /* Titel & Text */
  .lp-step__title {
    padding-left: 0;
    margin-top: 4px;
  }

  .lp-step__text {
    padding-left: 0;
  }
}

/* Scroll-Offset bei Menüsprung */
:target#lp-ablauf {
  scroll-margin-top: 100px;
}




.lp-trustname {
  text-align: center;
  color: #6B7280;
  font-size: 1.2rem;
  font-family: 'Permanent Marker', cursive;

  margin-top: 10px;

}







/* =========================================================
   LP – Logos / Referenzen
   ========================================================= */
/* Container */
.lp-logos {
  padding-block: clamp(24px, 4vw, 48px);
  overflow: hidden; /* Verhindert versehentliches horizontales Scrollen */
}

/* Flex-Layout, automatisch umbruchfähig */
.lp-logos__grid {
  list-style: none;
  margin: 0 auto;
  padding: 0;
  max-width: 1380px;

  display: flex;
  flex-wrap: wrap; /* erlaubt 2. Reihe statt Abschneiden */
  justify-content: center;
  align-items: center;
  gap: clamp(28px, 3vw, 64px);
}

/* Ein Slot */
.lp-logos__grid li {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  height: clamp(44px, 4vw, 56px);
}

/* Logos */
.lp-logos__grid img {
  height: 100%;
  width: auto;
  max-width: 220px;
  object-fit: contain;
  filter: grayscale(100%) contrast(1.05) opacity(0.85);
  mix-blend-mode: multiply;
  transition: filter .25s ease, opacity .25s ease, transform .2s ease;
}

.lp-logos__grid img:hover {
  filter: none;
  opacity: 1;
  transform: translateY(-1px);
}

/* Breakpoints */
@media (max-width: 1280px) {
  .lp-logos__grid {
    gap: clamp(20px, 4vw, 32px);
    max-width: 1100px;
  }
}

@media (max-width: 980px) {
  .lp-logos__grid {
    max-width: 900px;
    gap: clamp(18px, 5vw, 28px);
  }
  .lp-logos__grid li {
    height: clamp(40px, 5vw, 50px);
  }
}

@media (max-width: 640px) {
  .lp-logos__grid {
    gap: clamp(14px, 4vw, 22px);
  }
  .lp-logos__grid li {
    height: clamp(36px, 7vw, 46px);
  }
  .lp-logos__grid img {
    max-width: 150px;
  }
}







.lieblingskunden {
  text-align: center;
}

@media (max-width: 1024px) and (min-width: 901px) {

.lieblingskunden {
  font-size: 2.4rem;
}

}



@media (max-width: 900px) and (min-width: 769px) {

.lieblingskunden {
  font-size: 2.0rem;
}

}


@media (max-width: 768px) {

.lieblingskunden {
  font-size: 1.9rem;
}
}
