/* ============================================================
   Landing Pages (Relaunch 2026-07) — page-scoped styles.
   Uses the design tokens + shared components from styles.css
   (trust-bar, btn-light/btn-dark, tag chips, kf- form).
   ============================================================ */

/* ---------- LP header: logo | WhatsApp number | CTA | burger ---------- */
.lp-nav {
  position: relative;
  background: var(--nav-bg);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  width: 100%;
  padding: 0 50px;
  display: flex;
  justify-content: center;
}
.lp-nav::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: var(--white-15); }
.lp-nav-inner { width: 100%; max-width: 1600px; height: 76px; display: flex; align-items: center; justify-content: space-between; gap: 30px; }
.lp-nav-logo { display: block; flex: none; }
.lp-nav-logo img { display: block; width: 157px; height: 51px; object-fit: contain; }
.lp-nav-right { display: flex; align-items: center; gap: 14px; }

/* ---------- Hauptnavigation im Desktop (unter 1200px lebt sie im Overlay) ---------- */
.lp-nav-links { display: none; }
@media (min-width: 1200px) {
  /* mehr Luft: der Balken trägt Logo, sechs Links und vier Bedienelemente */
  .lp-nav-inner { height: 88px; }
  .lp-nav-logo img { width: 180px; height: 58px; }
  .lp-nav-links { display: flex; align-items: stretch; height: 88px; flex: 1 1 auto; margin-left: 30px; }
  .lp-nav-link {
    position: relative;
    display: flex;
    align-items: center;
    padding: 0 24px;
    text-decoration: none;
    overflow: hidden;
  }
  /* Trennlinien als Overlay, damit sie nichts zur Breite beitragen */
  .lp-nav-link::after { content: ''; position: absolute; inset: 0; border-right: 1px solid var(--white-15); pointer-events: none; }
  .lp-nav-link:first-child::before { content: ''; position: absolute; inset: 0; border-left: 1px solid var(--white-15); pointer-events: none; }
  .lp-nav-link p {
    font-size: 17px;
    line-height: 1.5;
    font-weight: 500;
    letter-spacing: -0.02em;
    color: var(--lime-soft);
    white-space: nowrap;
    transition: color 0.2s ease;
  }
  .lp-nav-link:hover { background: #ffffff0d; }
  .lp-nav-link:hover p { color: var(--lime); }
  .lp-nav-link.is-active { background: var(--white-10); }
  .lp-nav-link.is-active p { color: var(--lime); }
  /* rechte Gruppe auf eine gemeinsame Höhe bringen.
     .lp-nav vorangestellt, weil die Grundregeln weiter unten in der Datei stehen */
  .lp-nav .lp-nav-right { gap: 12px; }
  .lp-nav .lp-nav-icos { gap: 12px; }
  .lp-nav .lp-nav-ico { width: 52px; height: 52px; }
  .lp-nav .lp-nav-ico svg { width: 22px; height: 22px; }
  /* mit sechs sichtbaren Links wäre ein nacktes Symbol rätselhaft: der Knopf
     bekommt hier seine Beschriftung, damit klar ist, was er öffnet */
  .lp-nav .lp-burger { width: auto; height: 52px; padding: 0 18px; }
  .lp-nav .lp-burger-text { display: block; }
  /* der geteilte Button ist 48 hoch, hier soll die ganze Reihe auf 52 stehen.
     Die Höhe sitzt auf .btn-light selbst, sonst laufen die Kinder über */
  .lp-nav .lp-nav-cta .btn-light,
  .lp-nav .lp-nav-cta .btn-text,
  .lp-nav .lp-nav-cta .btn-arrow { height: 52px; }
  /* Ab hier die aufgeräumte Leiste (Variante 3):
     Alle Seiten stehen als Links im Balken, deshalb braucht es am Desktop
     weder den Menü-Knopf noch die zwei Symbole. Statt der Symbole steht die
     Telefonnummer lesbar da, denn Anrufen ist für diese Zielgruppe der
     wahrscheinlichste Weg. Unter 1200 px bleibt alles wie bisher. */
  .lp-nav .lp-nav-icos { display: none; }
  .lp-nav .lp-burger { display: none; }
  .lp-nav .lp-nav-tel {
    display: flex;
    flex-direction: column;
    gap: 1px;
    padding-right: 4px;
    text-decoration: none;
    white-space: nowrap;
  }
  .lp-nav .lp-nav-tel .lnt-k {
    font-family: 'Red Hat Mono', monospace;
    font-size: 10px;
    line-height: 14px;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: rgba(255, 255, 230, 0.5);
  }
  .lp-nav .lp-nav-tel .lnt-n {
    font-size: 17px;
    line-height: 23px;
    font-weight: 600;
    letter-spacing: -0.02em;
    color: var(--lime-soft);
    transition: color 0.2s ease;
  }
  .lp-nav .lp-nav-tel:hover .lnt-n { color: var(--lime); }
}
/* unter 1200 px zeigt die Leiste weiter Symbole + Menü-Knopf, keine Nummer */
.lp-nav-tel { display: none; }
.lp-nav-wa { display: flex; align-items: center; gap: 10px; text-decoration: none; }
.lp-nav-wa svg { display: block; width: 22px; height: 22px; }
.lp-nav-wa span { font-size: 15px; line-height: 20px; font-weight: 600; letter-spacing: 0; color: var(--white-warm); white-space: nowrap; }
.lp-nav-wa:hover span { color: var(--lime); }
/* WhatsApp- + Mail-Quadrate */
.lp-nav-icos { display: flex; gap: 8px; }
.lp-nav-ico {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  background: #ffffff0d;
  border: 1px solid #ffffff26;
  flex: none;
  transition: background-color 0.2s ease, border-color 0.2s ease;
}
.lp-nav-ico:hover { background: #ffffff1a; border-color: var(--lime); }
.lp-nav-ico svg { width: 19px; height: 19px; }
.lp-burger {
  height: 48px;
  width: 48px;
  border: 1px solid var(--white-15);
  margin: 0;
  padding: 0;
  background: #ffffff0d;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  flex: none;
  transition: background-color 0.2s ease, border-color 0.2s ease;
}
.lp-burger:hover { background: #ffffff1a; border-color: var(--lime); }
.lp-burger-lines { display: flex; flex-direction: column; align-items: flex-end; gap: 6px; width: 26px; flex: none; }
.lp-burger-lines i { display: block; width: 26px; height: 2px; background: var(--white-warm); border-radius: 10px; }
.lp-burger-lines i:nth-child(2) { width: 17px; }
.lp-burger-text { display: none; font-size: 15px; font-weight: 600; letter-spacing: -0.02em; color: var(--white-warm); }
.lp-burger:hover .lp-burger-text { color: var(--lime); }
@media (max-width: 1199.98px) {
  .lp-nav { padding: 0 20px; }
  .lp-nav-inner { height: 80px; }
  .lp-nav-right { gap: 12px; }
  .lp-nav-logo img { width: 166px; height: 54px; }
  /* Tablets sind ebenfalls Touch: alles auf eine Reihe von 48 */
  .lp-nav-ico { width: 48px; height: 48px; }
  .lp-nav-ico svg { width: 20px; height: 20px; }
  .lp-nav-icos { gap: 10px; }
}
@media (max-width: 809.98px) {
  .lp-nav-inner { height: 76px; gap: 12px; }
  .lp-nav-right { gap: 8px; }
  .lp-nav-logo img { width: 140px; height: 46px; }
  .lp-nav-wa svg { width: 20px; height: 20px; }
  .lp-nav-wa span { font-size: 15px; }
  .lp-nav-cta { display: none; }        /* zu schmal: CTA lebt im Menü + Sticky-Bar */
  /* alles auf 48, damit die Reihe eine Linie bildet und sicher treffbar bleibt */
  .lp-nav-ico { width: 48px; height: 48px; }
  .lp-nav-ico svg { width: 20px; height: 20px; }
  .lp-nav-icos { gap: 8px; }
}

/* ---------- burger menu overlay ---------- */
.lp-menu {
  position: fixed;
  inset: 0;
  z-index: 60;
  background: var(--black);
  display: flex;
  flex-direction: column;
  padding: 0 50px;
  overflow-y: auto;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.35s ease, visibility 0.35s ease;
}
.lp-menu.is-open { opacity: 1; visibility: visible; }
.lp-menu-inner { width: 100%; max-width: 1600px; margin: 0 auto; display: flex; flex-direction: column; gap: 40px; padding: 24px 0 48px; }
.lp-menu-top { display: flex; align-items: center; justify-content: space-between; }
.lp-menu-top p {
  font-family: 'Red Hat Mono', monospace;
  font-size: 12px;
  line-height: 18px;
  font-weight: 600;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--lime-soft);
}
.lp-menu-close {
  width: 44px;
  height: 44px;
  border: 1px solid var(--white-15);
  border-radius: 50%;
  background: transparent;
  color: var(--white-warm);
  cursor: pointer;
  display: grid;
  place-items: center;
}
.lp-menu-close svg { display: block; }
.lp-menu-links { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; }
.lp-menu-links a {
  position: relative;
  font-size: 46px;
  line-height: 1.18;
  font-weight: 600;
  letter-spacing: -0.04em;
  color: var(--white-warm);
  text-decoration: none;
  transition: color 0.2s ease, transform 0.25s cubic-bezier(0.22, 1, 0.36, 1);
}
.lp-menu-links a:hover { color: var(--lime); transform: translateX(10px); }
.lp-menu-links a.is-current { color: var(--lime-soft); }
.lp-menu-links a.is-current::before {
  content: '';
  position: absolute;
  left: -18px;
  top: 50%;
  width: 8px;
  height: 8px;
  margin-top: -4px;
  background: var(--lime);
}
.lp-menu-block { display: flex; flex-direction: column; }
/* Entwurfs-Umschalter direkt unter „Unsere Kanzlei" */
.lp-menu-variants { display: flex; flex-wrap: wrap; gap: 8px; margin: 6px 0 14px; }
.lp-menu-variants a {
  padding: 7px 14px;
  border: 1px solid var(--white-15);
  background: var(--white-5);
  font-size: 14px;
  line-height: 20px;
  font-weight: 500;
  letter-spacing: -0.01em;
  color: rgba(255, 255, 230, 0.8);
  text-decoration: none;
  transition: color 0.2s ease, border-color 0.2s ease, background-color 0.2s ease;
}
.lp-menu-variants a:hover { color: var(--lime); border-color: var(--lime); background: #ffffff14; }
.lp-menu-variants a.is-current { color: var(--ink); background: var(--lime); border-color: var(--lime); }
.lp-menu-label {
  font-family: 'Red Hat Mono', monospace;
  font-size: 12px;
  line-height: 18px;
  font-weight: 600;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: rgba(255, 255, 230, 0.5);
  padding-bottom: 12px;
  border-bottom: 1px solid var(--white-15);
  width: 100%;
}
/* Landingpage-Einstiege (Beratung nach Fall) */
.lp-menu-sub { display: flex; flex-direction: column; gap: 10px; padding-top: 16px; }
.lp-menu-sub a {
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding: 14px 18px;
  background: var(--white-5);
  border: 1px solid var(--white-15);
  text-decoration: none;
  transition: background-color 0.2s ease, border-color 0.2s ease;
}
.lp-menu-sub a:hover { background: #ffffff14; border-color: var(--lime); }
.lp-menu-sub a.is-current { border-color: var(--lime); }
.lp-menu-sub .lms-t { font-size: 20px; line-height: 26px; font-weight: 600; letter-spacing: -0.03em; color: var(--white-warm); }
.lp-menu-sub a:hover .lms-t { color: var(--lime); }
.lp-menu-sub .lms-s { font-size: 14px; line-height: 20px; letter-spacing: -0.01em; color: rgba(255, 255, 230, 0.6); }
/* interne Entwürfe */
.lp-menu-drafts { display: flex; flex-wrap: wrap; gap: 10px; padding-top: 16px; }
.lp-menu-drafts a {
  padding: 8px 14px;
  border: 1px solid var(--white-15);
  font-size: 14px;
  line-height: 20px;
  font-weight: 500;
  letter-spacing: -0.01em;
  color: rgba(255, 255, 230, 0.75);
  text-decoration: none;
  transition: color 0.2s ease, border-color 0.2s ease;
}
.lp-menu-drafts a:hover, .lp-menu-drafts a.is-current { color: var(--lime); border-color: var(--lime); }
.lp-menu-contact { display: flex; flex-direction: column; gap: 4px; padding-top: 8px; }
.lp-menu-contact a { display: flex; align-items: center; gap: 14px; padding: 8px 0; text-decoration: none; }
.lp-menu-contact svg { display: block; width: 22px; height: 22px; flex: none; }
.lp-menu-contact span { font-size: 18px; line-height: 24px; font-weight: 500; letter-spacing: -0.02em; color: var(--white-warm); }
.lp-menu-contact a:hover span { color: var(--lime); }
/* bottom CTA pill (like the Auvelle menu) */
.lp-menu-cta {
  position: fixed;
  left: 16px;
  right: 16px;
  bottom: 16px;
  background: var(--lime);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 20px;
  text-decoration: none;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.35s ease 0.08s, visibility 0.35s ease 0.08s;
}
.lp-menu.is-open ~ .lp-menu-cta, .lp-menu-cta.is-open { opacity: 1; visibility: visible; }
.lp-menu-cta-text { display: flex; flex-direction: column; gap: 2px; }
.lp-menu-cta-text .lmc-k {
  font-family: 'Red Hat Mono', monospace;
  font-size: 10px;
  line-height: 14px;
  font-weight: 600;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: rgba(0, 0, 0, 0.6);
}
.lp-menu-cta-text .lmc-t { font-size: 20px; line-height: 26px; font-weight: 600; letter-spacing: -0.03em; color: var(--ink); }
.lp-menu-cta-arrow { width: 42px; height: 42px; border-radius: 50%; background: var(--black); display: grid; place-items: center; flex: none; }

/* ---------- Menü-CTA im Blockformat: Kicker + Titel + runder Pfeil ---------- */
.lp-menu-act {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 20px 22px;
  border-radius: 14px;
  background: var(--lime);
  text-decoration: none;
  transition: background-color 0.2s ease, transform 0.25s cubic-bezier(0.22, 1, 0.36, 1);
}
.lp-menu-act:hover { background: #eeffa0; transform: translateY(-2px); }
.lma-text { display: flex; flex-direction: column; gap: 3px; }
.lma-kicker {
  font-family: 'Red Hat Mono', monospace;
  font-size: 10px;
  line-height: 14px;
  font-weight: 600;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: rgba(27, 28, 28, 0.6);
}
.lma-title { font-size: 24px; line-height: 30px; font-weight: 600; letter-spacing: -0.03em; color: var(--ink); }
.lma-arrow {
  width: 48px;
  height: 48px;
  flex: none;
  border-radius: 50%;
  background: var(--black);
  display: grid;
  place-items: center;
  transition: transform 0.25s cubic-bezier(0.22, 1, 0.36, 1);
}
.lp-menu-act:hover .lma-arrow { transform: translate(3px, -3px); }
/* CTA + Icons bilden einen Block (am Desktop die rechte Spalte) */
.lp-menu-side { display: flex; flex-direction: column; gap: 22px; align-items: stretch; }
/* Kontakt unter dem CTA: Icon + ausgeschriebene Nummer/Adresse, damit man sie
   auch ohne Klick ablesen kann */
.lp-menu-icons { display: flex; flex-direction: column; gap: 2px; }
.lp-menu-icons a {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 6px 0;
  color: var(--white-warm);
  text-decoration: none;
  transition: color 0.2s ease;
}
.lp-menu-icons .lmi-ico {
  width: 42px;
  height: 42px;
  flex: none;
  border-radius: 50%;
  border: 1px solid var(--white-15);
  background: var(--white-5);
  display: grid;
  place-items: center;
  transition: border-color 0.2s ease, background-color 0.2s ease;
}
.lp-menu-icons .lmi-t { font-size: 17px; line-height: 24px; font-weight: 500; letter-spacing: -0.02em; }
.lp-menu-icons svg { display: block; width: 19px; height: 19px; }
.lp-menu-icons a:hover { color: var(--lime); }
.lp-menu-icons a:hover .lmi-ico { border-color: var(--lime); background: #ffffff14; }
@media (prefers-reduced-motion: reduce) {
  .lp-menu-act, .lma-arrow { transition: none; }
  .lp-menu-act:hover, .lp-menu-act:hover .lma-arrow { transform: none; }
}
/* Desktop: Links links, CTA + Kontakt-Icons rechts (passt ohne Scrollen) */
@media (min-width: 1200px) {
  .lp-menu-inner {
    display: grid;
    grid-template-columns: 1fr 440px;
    column-gap: 80px;
    row-gap: 22px;
    align-content: start;
    padding: 24px 0 60px;
  }
  .lp-menu-top { grid-column: 1 / -1; }
  .lp-menu-links { grid-column: 1; grid-row: 2; }
  .lp-menu-side { grid-column: 2; grid-row: 2; align-self: start; }
  /* Rest der alten fixen Pille (lebt nur noch in den _ref-Archivseiten) */
  .lp-menu-cta { left: auto; right: 50px; width: 440px; bottom: 24px; }
}
@media (max-width: 1199.98px) { .lp-menu { padding: 0 20px; } }
@media (max-width: 809.98px) {
  .lp-menu-links a { font-size: 32px; }
  .lp-menu-inner { gap: 30px; }
  .lp-menu-sub a { padding: 12px 14px; }
  .lp-menu-sub .lms-t { font-size: 18px; line-height: 24px; }
}

/* ---------- shared LP typography ---------- */
.lp-h1 {
  font-size: 64px;
  line-height: 1.04;
  font-weight: 600;
  letter-spacing: -0.05em;
  color: var(--white-warm);
}
.lp-h1 mark { background: var(--lime); color: var(--ink); }
.lp-sub {
  font-size: 20px;
  line-height: 1.45;
  font-weight: 500;
  letter-spacing: -0.03em;
  color: var(--white-warm);
}
.lp-h2 {
  font-size: 50px;
  line-height: 1.18;
  font-weight: 600;
  letter-spacing: -0.05em;
  text-wrap: balance;
}
@media (max-width: 1199.98px) {
  .lp-h1 { font-size: 46px; }
  .lp-h2 { font-size: 40px; }
  .lp-sub { font-size: 18px; }
}
@media (max-width: 809.98px) {
  .lp-h1 { font-size: 36px; }
  .lp-h2 { font-size: 32px; }
  .lp-sub { font-size: 17px; }
}

/* trust row (stars + facts) */
.lp-trustrow { display: flex; align-items: center; flex-wrap: wrap; gap: 10px 22px; }
.lp-trustrow p {
  display: flex;
  align-items: center;
  gap: 8px;
  font-family: 'Red Hat Mono', monospace;
  font-size: 12px;
  line-height: 18px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--white-warm);
  white-space: nowrap;
}
.lp-trustrow .lp-stars { color: var(--lime); letter-spacing: 0.08em; }

/* CTA row: button + phone alternative */
.lp-ctarow { display: flex; align-items: center; flex-wrap: wrap; gap: 16px 26px; }
.lp-ctatel { display: flex; flex-direction: column; gap: 1px; text-decoration: none; }
.lp-ctatel .lct-a { font-size: 14px; line-height: 20px; letter-spacing: -0.02em; color: var(--white-warm); opacity: 0.75; }
.lp-ctatel .lct-num { font-size: 18px; line-height: 24px; font-weight: 600; letter-spacing: -0.02em; color: var(--lime-soft); }
.lp-ctatel:hover .lct-num { color: var(--lime); }
.lp-sec-light .lp-ctatel .lct-a, .lp-sec-khaki .lp-ctatel .lct-a { color: var(--ink); opacity: 0.6; }
.lp-sec-light .lp-ctatel .lct-num, .lp-sec-khaki .lp-ctatel .lct-num { color: var(--ink); }
.lp-microline {
  font-family: 'Red Hat Mono', monospace;
  font-size: 12px;
  line-height: 18px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--lime-soft);
}

/* photo placeholder slots (real photos come later, in one go) */
.lp-ph {
  position: relative;
  background: var(--khaki);
  border: 2px dashed rgba(0, 0, 0, 0.35);
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 8px;
  padding: 24px;
  overflow: hidden;
}
.lp-ph p {
  font-family: 'Red Hat Mono', monospace;
  font-size: 12px;
  line-height: 17px;
  font-weight: 600;
  letter-spacing: 0.08em;
  color: rgba(0, 0, 0, 0.65);
}
.lp-ph .lp-ph-t { font-size: 13px; text-transform: uppercase; letter-spacing: 0.15em; color: var(--ink); }

/* ---------- HERO (gewählte Variante A: Klartext) ---------- */
.lp-hero { background: var(--black); padding: 160px 50px 90px; display: flex; justify-content: center; }
.lp-hero-cont { width: 100%; max-width: 1600px; display: flex; gap: 60px; align-items: center; }
.lph-left { flex: 1.25 1 0; display: flex; flex-direction: column; align-items: flex-start; gap: 32px; }
.lph-right { flex: 1 1 0; display: flex; }
.lph-photo { position: relative; width: 100%; aspect-ratio: 0.92; }
.lph-photo .lp-ph { position: absolute; inset: 0; }
.lph-chip {
  position: absolute;
  left: -18px;
  bottom: 34px;
  background: var(--lime);
  color: var(--ink);
  padding: 12px 18px;
  font-size: 15px;
  line-height: 21px;
  font-weight: 600;
  letter-spacing: -0.02em;
  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.45);
}
.lph-corner { position: absolute; top: -19px; right: 0; width: 36px; height: 54px; }
.lph-corner i { position: absolute; width: 18px; height: 18px; background: var(--lime); }
.lph-corner i:nth-child(1) { top: 0; left: 18px; }
.lph-corner i:nth-child(2) { top: 18px; left: 0; }
.lph-corner i:nth-child(3) { top: 36px; left: 18px; }
@media (max-width: 1199.98px) {
  .lp-hero { padding: 140px 20px 70px; }
  .lp-hero-cont { flex-direction: column; align-items: stretch; gap: 50px; }
  .lph-photo { max-width: 560px; aspect-ratio: 1.1; }
}
@media (max-width: 809.98px) {
  .lp-hero { padding: 120px 20px 60px; }
  .lph-chip { left: 0; }
}

/* ---------- sections shared ---------- */
.lp-sec { padding: 100px 50px; display: flex; justify-content: center; }
.lp-sec-cont { width: 100%; max-width: 1600px; display: flex; flex-direction: column; gap: 60px; }
.lp-sec-light { background: #ffffe6; }
.lp-sec-khaki { background: var(--khaki); }
.lp-sec-light .lp-h2, .lp-sec-khaki .lp-h2 { color: var(--ink); }
.lp-sec-light .lp-h2 mark, .lp-sec-khaki .lp-h2 mark { background: var(--black); color: var(--lime-soft); }
.lp-sec-dark { background: var(--black); }
.lp-sec-dark .lp-h2 { color: var(--white-warm); }
.lp-sec-dark .lp-h2 mark { background: var(--lime); color: var(--ink); }
@media (max-width: 1199.98px) { .lp-sec { padding: 80px 20px; } }
@media (max-width: 809.98px) { .lp-sec-cont { gap: 40px; } }

/* ---------- „So läuft es ab" (hell, 3 Schritte) ---------- */
.lps-a-grid { display: grid; grid-template-columns: repeat(3, minmax(50px, 1fr)); gap: 40px; }
.lps-a-step { display: flex; flex-direction: column; align-items: flex-start; gap: 18px; padding: 30px 0 0; border-top: 2px dotted rgba(0, 0, 0, 0.4); }
.lps-a-num {
  background: var(--black);
  color: var(--lime-soft);
  padding: 4px 12px;
  font-family: 'Red Hat Mono', monospace;
  font-size: 14px;
  line-height: 21px;
  font-weight: 600;
  letter-spacing: 0.15em;
}
.lps-a-step h3 { font-size: 22px; line-height: 28.6px; font-weight: 600; letter-spacing: -0.04em; color: var(--ink); }
.lps-a-step p { font-size: 16px; line-height: 24px; letter-spacing: -0.02em; color: var(--ink); }
.lps-a-note { font-size: 14px; line-height: 21px; letter-spacing: -0.02em; color: rgba(0, 0, 0, 0.55); }
@media (max-width: 1199.98px) { .lps-a-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 809.98px) { .lps-a-grid { grid-template-columns: 1fr; } }

/* ---------- „Passt das zu Ihrer Situation?" (khaki, 3 Fälle) ---------- */
.lpw-list { display: flex; flex-direction: column; }
.lpw-case { display: flex; align-items: center; gap: 40px; padding: 30px 0; border-top: 1px solid rgba(0, 0, 0, 0.15); }
.lpw-case:last-child { border-bottom: 1px solid rgba(0, 0, 0, 0.15); }
.lpw-img { flex: none; width: 132px; }
.lpw-img .lp-ph { aspect-ratio: 1; padding: 10px; gap: 4px; }
.lpw-img .lp-ph p { font-size: 9px; line-height: 12px; letter-spacing: 0.04em; }
.lpw-body { flex: 1 1 0; display: flex; flex-direction: column; align-items: flex-start; gap: 8px; }
.lpw-num {
  font-family: 'Red Hat Mono', monospace;
  font-size: 13px;
  line-height: 19px;
  font-weight: 600;
  letter-spacing: 0.2em;
  color: rgba(0, 0, 0, 0.5);
}
.lpw-body h3 { font-size: 24px; line-height: 30px; font-weight: 600; letter-spacing: -0.04em; color: var(--ink); }
.lpw-body p { font-size: 16px; line-height: 24px; letter-spacing: -0.02em; color: var(--ink); max-width: 640px; }
@media (max-width: 809.98px) {
  .lpw-case { flex-direction: row; gap: 20px; align-items: flex-start; }
  .lpw-img { width: 84px; }
  .lpw-body h3 { font-size: 20px; line-height: 26px; }
}

/* ---------- Oliver + Bewertungen (hell) ---------- */
.lpr-grid { display: flex; gap: 40px; align-items: stretch; }
.lpr-photo { flex: 1 1 0; position: relative; min-height: 520px; }
.lpr-photo .lp-ph { position: absolute; inset: 0; }
.lpr-quote {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  background: var(--black);
  padding: 24px 28px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.lpr-quote blockquote { margin: 0; font-size: 20px; line-height: 28px; font-weight: 500; letter-spacing: -0.03em; color: var(--lime-soft); }
.lpr-quote p {
  font-family: 'Red Hat Mono', monospace;
  font-size: 12px;
  line-height: 18px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--white-warm);
}
.lpr-side { flex: 1 1 0; display: flex; flex-direction: column; gap: 20px; }
.lpr-badge {
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.12);
  padding: 20px 24px;
  display: flex;
  align-items: center;
  gap: 16px;
}
.lpr-badge svg { display: block; flex: none; }
.lpr-badge .lb-score { font-size: 30px; line-height: 34px; font-weight: 600; letter-spacing: -0.03em; color: var(--ink); }
.lpr-badge .lb-sub { font-size: 14px; line-height: 20px; letter-spacing: -0.01em; color: rgba(0, 0, 0, 0.6); }
.lpr-badge .lb-stars { color: #e8a13c; font-size: 15px; letter-spacing: 0.08em; }
.lpr-card { background: #fff; border: 1px solid rgba(0, 0, 0, 0.12); padding: 24px; display: flex; flex-direction: column; gap: 14px; }
.lpr-card .lr-stars { color: #e8a13c; font-size: 15px; letter-spacing: 0.08em; }
.lpr-card blockquote { margin: 0; font-size: 16px; line-height: 24px; letter-spacing: -0.02em; color: var(--ink); }
.lpr-card .lr-who { display: flex; align-items: center; gap: 12px; }
.lpr-card .lr-ava {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: var(--black);
  color: var(--lime);
  display: grid;
  place-items: center;
  font-family: 'Red Hat Mono', monospace;
  font-size: 13px;
  font-weight: 600;
  flex: none;
}
.lpr-card .lr-name {
  font-family: 'Red Hat Mono', monospace;
  font-size: 12px;
  line-height: 17px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink);
}
.lpr-card .lr-case { font-size: 13px; line-height: 18px; color: rgba(0, 0, 0, 0.55); }
@media (max-width: 1199.98px) {
  .lpr-grid { flex-direction: column; }
  /* flex: none ist Pflicht — sobald .lpr-grid auf column steht, gilt die
     flex-basis 0 fuer die HOEHE: die Box fiel auf 0 px zusammen, Bild und
     Zitat liefen darueber hinaus und das erste Bewertungs-Kaertchen
     verschwand halb hinter dem schwarzen Zitatkasten. */
  .lpr-photo { flex: none; min-height: 440px; }
}

/* ---------- Kennzahlen-Block (ueber den Mandatserfolgen) ----------
   Fuehrt die Sektion mit Erfahrung statt mit einer Verfahrensdauer. */
.lpst-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.lpst-card { background: var(--black); padding: 34px 32px 30px; display: flex; flex-direction: column; gap: 10px; }
.lpst-label { font-family: 'Red Hat Mono', monospace; font-size: 12px; line-height: 18px; font-weight: 600; letter-spacing: 0.15em; text-transform: uppercase; color: var(--lime); }
.lpst-num { font-size: 54px; line-height: 1.02; font-weight: 600; letter-spacing: -0.05em; color: var(--lime); }
.lpst-num em { font-style: normal; font-size: 32px; }
.lpst-numl { font-size: 17px; line-height: 1.4; font-weight: 500; letter-spacing: -0.02em; color: var(--white-warm); }
@media (max-width: 809.98px) {
  .lpst-grid { grid-template-columns: 1fr; }
  .lpst-card { padding: 24px 22px 22px; }
  .lpst-num { font-size: 44px; }
  .lpst-num em { font-size: 26px; }
}

/* ---------- form section ---------- */
.lp-formsec { background: var(--black); padding: 100px 50px; display: flex; justify-content: center; }
.lp-formsec-cont { width: 100%; max-width: 1600px; display: flex; flex-direction: column; align-items: center; gap: 40px; }
.lp-formsec-head { display: flex; flex-direction: column; align-items: center; gap: 14px; text-align: center; }
.lp-formsec-head .lp-h2 { color: var(--white-warm); }
.lp-formsec-head > p { font-size: 18px; line-height: 26px; font-weight: 500; letter-spacing: -0.02em; color: var(--lime-soft); }
@media (max-width: 1199.98px) { .lp-formsec { padding: 80px 20px; } }

/* ---------- slim LP footer ---------- */
/* Der globale .page-blur ist fix am unteren Rand und 134 px hoch; wirksam wird
   er (Maske ab 37 %) auf den letzten ~84 px. Bei diesem schmalen Footer lag die
   Zeile mit Impressum / Datenschutz / Cookie-Einstellungen genau darin und war
   unlesbar. 114 px unten schieben sie aus dem Blur heraus — geblurrt wird dann
   nur noch leerer Hintergrund, also nichts Sichtbares. Die grossen Footer der
   anderen Seiten sind hoch genug und brauchen das nicht. */
.lp-footer { background: var(--black); padding: 40px 50px 114px; display: flex; justify-content: center; border-top: 1px solid var(--white-10); }
.lp-footer-cont { width: 100%; max-width: 1600px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px 40px; }
.lp-footer p, .lp-footer a { font-size: 14px; line-height: 21px; letter-spacing: -0.02em; color: var(--white-warm); text-decoration: none; }
.lp-footer a:hover { color: var(--lime-soft); }
.lp-footer-legal { display: flex; gap: 24px; }
@media (max-width: 809.98px) {
  .lp-footer { padding: 30px 20px 110px; }
  .lp-footer-cont { flex-direction: column; align-items: flex-start; }
}

/* ---------- header hide-on-scroll (LP only) ---------- */
.nav-fixed { transition: transform 0.4s cubic-bezier(0.22, 1, 0.36, 1); }
.nav-fixed.lp-nav-hidden { transform: translateY(-100%); }

/* ---------- Ansprüche variants B (Checkliste) + C (Chip-Ticker) ---------- */
.lps-check { display: grid; grid-template-columns: 1fr 1fr; gap: 0 60px; }
.lps-check p {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 16px 0;
  border-bottom: 1px solid var(--white-10);
  font-size: 18px;
  line-height: 26px;
  font-weight: 500;
  letter-spacing: -0.02em;
  color: var(--white-warm);
}
.lps-check svg { flex: none; margin-top: 4px; }
.lps-check strong { font-weight: 600; color: var(--lime-soft); }
@media (max-width: 809.98px) { .lps-check { grid-template-columns: 1fr; gap: 0; } }

@keyframes lp-chipmove { to { transform: translateX(-50%); } }

/* ---------- guided funnel overlay (Starten) ---------- */
.lp-funnel {
  position: fixed;
  inset: 0;
  z-index: 70;
  background: #ffffe6;
  overflow-y: auto;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.35s ease, visibility 0.35s ease;
}
.lp-funnel.is-open { opacity: 1; visibility: visible; }
.lp-funnel-inner { max-width: 800px; margin: 0 auto; padding: 24px 20px 60px; display: flex; flex-direction: column; gap: 34px; min-height: 100%; }
.lp-funnel-top { display: flex; align-items: center; justify-content: space-between; min-height: 32px; }
.lpf-back {
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  font-size: 15px;
  line-height: 22px;
  letter-spacing: -0.02em;
  color: rgba(0, 0, 0, 0.6);
}
.lpf-back:hover { color: var(--ink); }
.lpf-progress {
  font-family: 'Red Hat Mono', monospace;
  font-size: 12px;
  line-height: 18px;
  font-weight: 600;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: rgba(0, 0, 0, 0.5);
}
.lpf-screen { display: none; flex-direction: column; align-items: flex-start; gap: 22px; }
.lpf-screen.is-active { display: flex; }
.lpf-crest { width: 64px; height: 64px; object-fit: contain; }
.lpf-label {
  font-family: 'Red Hat Mono', monospace;
  font-size: 12px;
  line-height: 18px;
  font-weight: 600;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: rgba(0, 0, 0, 0.55);
}
.lpf-screen h2 { font-size: 40px; line-height: 1.15; font-weight: 600; letter-spacing: -0.05em; color: var(--ink); text-wrap: balance; }
.lpf-sub, .lpf-hint { font-size: 17px; line-height: 25px; letter-spacing: -0.02em; color: var(--ink); max-width: 560px; }
.lpf-hint { color: rgba(0, 0, 0, 0.55); font-size: 15px; line-height: 22px; }
.lpf-grid { width: 100%; display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.lpf-case {
  border: 1px solid rgba(0, 0, 0, 0.22);
  background: transparent;
  padding: 0;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  text-align: left;
  transition: border-color 0.2s ease, background-color 0.2s ease;
}
.lpf-case:hover { border-color: var(--black); background: var(--khaki); }
.lpf-case .lp-ph { aspect-ratio: 1.85; border: none; border-bottom: 1px dashed rgba(0, 0, 0, 0.3); padding: 14px; gap: 4px; }
.lpf-case .lp-ph p { font-size: 10px; line-height: 14px; }
.lpf-case > span { padding: 14px 16px; font-size: 17px; line-height: 24px; font-weight: 500; letter-spacing: -0.02em; color: var(--ink); }
.lpf-unsure {
  width: 100%;
  border: 1px solid rgba(0, 0, 0, 0.22);
  background: transparent;
  padding: 16px;
  cursor: pointer;
  font-size: 16px;
  line-height: 23px;
  letter-spacing: -0.02em;
  color: var(--ink);
  text-align: center;
  transition: border-color 0.2s ease, background-color 0.2s ease;
}
.lpf-unsure:hover { border-color: var(--black); background: var(--khaki); }
.lpf-cta {
  border: none;
  cursor: pointer;
  background: var(--black);
  color: var(--lime-soft);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 16px 26px;
  font-size: 18px;
  line-height: 25px;
  font-weight: 600;
  letter-spacing: -0.02em;
}
.lpf-form .lpf-cta { width: 100%; }
.lpf-form .lpf-micro { align-self: center; }
.lpf-cta:hover { color: var(--lime); }
.lpf-cta[disabled] { opacity: 0.6; cursor: default; }
.lpf-chosen { display: flex; }
.lpfc-chip { display: inline-flex; align-items: center; background: var(--khaki); }
.lpfc-chip strong { font-size: 15px; line-height: 21px; font-weight: 600; letter-spacing: -0.02em; color: var(--ink); padding: 8px 14px; }
.lpfc-chip button {
  background: none;
  border: none;
  border-left: 1px solid rgba(0, 0, 0, 0.2);
  padding: 8px 14px;
  cursor: pointer;
  font-size: 14px;
  line-height: 21px;
  color: rgba(0, 0, 0, 0.6);
  text-decoration: underline;
}
.lpfc-chip button:hover { color: var(--ink); }
.lpf-form { width: 100%; display: flex; flex-direction: column; gap: 24px; }
.lpf-form.is-senderr .kf-senderr { display: block; }
.lpf-form .kf-row { gap: 24px; }
.lpf-micro { font-size: 14px; line-height: 20px; letter-spacing: -0.02em; color: rgba(0, 0, 0, 0.55); }
.lpf-foot { margin-top: auto; display: flex; flex-direction: column; align-items: center; gap: 10px; padding-top: 30px; }
.lpf-foot a, .lpf-foot button {
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  line-height: 20px;
  letter-spacing: -0.02em;
  color: rgba(0, 0, 0, 0.6);
  text-decoration: none;
}
.lpf-foot a:hover, .lpf-foot button:hover { color: var(--ink); }
.lpf-foot svg { display: block; }
@media (max-width: 809.98px) {
  .lpf-screen h2 { font-size: 30px; }
  .lpf-grid { gap: 10px; }
  .lpf-case .lp-ph { aspect-ratio: 1.5; padding: 10px; }
  .lpf-case .lp-ph p { display: none; }
  .lpf-case > span { padding: 10px 12px; font-size: 14px; line-height: 20px; }
  .lpf-unsure { padding: 13px; font-size: 15px; }
  .lpf-form .kf-row { flex-direction: column; gap: 24px; }
}

/* ---------- Mandatserfolge (khaki, 3 Karten) ---------- */
.lpe-grid { display: grid; grid-template-columns: repeat(3, minmax(50px, 1fr)); gap: 20px; }
.lpe-card {
  background: #ffffe6;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
  padding: 30px;
  text-decoration: none;
  transition: background-color 0.25s ease;
}
.lpe-card:hover { background: #fdfdd6; }
.lpe-label {
  font-family: 'Red Hat Mono', monospace;
  font-size: 12px;
  line-height: 18px;
  font-weight: 600;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: rgba(0, 0, 0, 0.5);
}
.lpe-num { font-size: 40px; line-height: 1.05; font-weight: 600; letter-spacing: -0.04em; color: var(--ink); }
.lpe-numl { font-size: 14px; line-height: 20px; letter-spacing: -0.01em; color: rgba(0, 0, 0, 0.6); }
.lpe-title { font-size: 17px; line-height: 24px; font-weight: 500; letter-spacing: -0.02em; color: var(--ink); margin-top: 6px; }
.lpe-more {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: auto;
  padding-top: 14px;
  font-family: 'Red Hat Mono', monospace;
  font-size: 12px;
  line-height: 18px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink);
}
@media (max-width: 1199.98px) { .lpe-grid { grid-template-columns: 1fr; } }

/* ---------- Gerichts-Timeline (dunkel, Foto-Marquee) ---------- */
.lpt-strip { overflow: hidden; }
.lpt-move { display: flex; width: max-content; animation: lp-chipmove 60s linear infinite; }
.lpt-group { display: flex; gap: 20px; padding-right: 20px; }
.lpt-card { flex: none; width: 240px; display: flex; flex-direction: column; }
.lpt-card .lp-ph { aspect-ratio: 0.8; }
.lpt-cap {
  background: var(--white-5);
  padding: 10px 14px;
  font-family: 'Red Hat Mono', monospace;
  font-size: 12px;
  line-height: 18px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--lime-soft);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.lpt-note { font-size: 16px; line-height: 24px; letter-spacing: -0.02em; color: var(--white-warm); }
@media (max-width: 809.98px) { .lpt-card { width: 180px; } }

/* ---------- Team-Grid (dunkel, alle Anwälte) ---------- */
.lp-team { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; }
.lp-member { display: flex; flex-direction: column; text-decoration: none; }
.lp-member img { display: block; width: 100%; aspect-ratio: 1 / 1; object-fit: cover; object-position: 50% 22%; }
.lp-member .lp-tph { display: grid; place-items: center; width: 100%; aspect-ratio: 1 / 1; background: var(--white-5); }
.lp-member .lp-tph img { width: 46%; aspect-ratio: auto; object-fit: contain; opacity: 0.55; }
.lp-member p { padding: 12px 4px 0; font-size: 15px; line-height: 21px; font-weight: 600; letter-spacing: -0.02em; color: var(--white-warm); }
.lp-member span {
  padding: 0 4px;
  font-family: 'Red Hat Mono', monospace;
  font-size: 10px;
  line-height: 15px;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(255, 255, 230, 0.5);
}
.lp-member:hover p { color: var(--lime-soft); }
@media (max-width: 1199.98px) { .lp-team { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 809.98px) { .lp-team { grid-template-columns: 1fr 1fr; } }

/* ---------- mobile sticky CTA bar ---------- */
.lp-sticky {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 40;
  background: var(--lime);
  display: none;
  align-items: center;
  gap: 12px;
  padding: 10px 14px;
  box-shadow: 0 -6px 24px rgba(0, 0, 0, 0.35);
  transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1);
}
.lp-sticky.is-hidden { transform: translateY(110%); }
.lp-sticky-ava {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: var(--black);
  color: var(--lime);
  display: grid;
  place-items: center;
  font-family: 'Red Hat Mono', monospace;
  font-size: 14px;
  font-weight: 600;
  flex: none;
  overflow: hidden;
}
.lp-sticky-ava img { width: 100%; height: 100%; object-fit: cover; }
.lp-sticky-text { flex: 1 1 0; display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.lp-sticky-text .ls-t { font-size: 15px; line-height: 20px; font-weight: 600; letter-spacing: -0.02em; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lp-sticky-text .ls-s {
  font-family: 'Red Hat Mono', monospace;
  font-size: 10px;
  line-height: 14px;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(0, 0, 0, 0.6);
}
.lp-sticky-btn {
  flex: none;
  background: var(--black);
  color: var(--lime-soft);
  text-decoration: none;
  padding: 12px 18px;
  font-size: 15px;
  line-height: 20px;
  font-weight: 600;
  letter-spacing: -0.02em;
  display: flex;
  align-items: center;
  gap: 8px;
}
@media (max-width: 809.98px) {
  .lp-sticky { display: flex; }
  /* nur Seiten mit Sticky-Leiste brauchen den Platz darunter */
  body:has(.lp-sticky) { padding-bottom: 76px; }
}

/* =====================================================================
   30.07.2026: Der Balken traegt jetzt fuenf Inhaltspunkte, weil Oliver auf
   Wunsch der Kanzlei einen eigenen Reiter bekommt ("der Olli kriegt seine
   eigene [Seite] ... das Branding laeuft auf ihn").  Gemessen bei 1200 px lief
   die rechte Gruppe 241 px aus dem Container heraus, der Knopf "Anfrage
   starten" war abgeschnitten.  Darum unter 1400 px engere Zellen und die
   Telefonnummer erst ab 1400 px.
   ===================================================================== */
@media (min-width: 1200px) and (max-width: 1399.98px) {
  .lp-nav .lp-nav-link { padding: 0 12px; }
  .lp-nav .lp-nav-link p { font-size: 16px; }
  .lp-nav .lp-nav-tel { display: none; }
  .lp-nav-links { margin-left: 20px; }
}

/* Fallkarten der neuen Landingpages: Symbolkachel statt unpassendem Foto ------ */
.lpw-img.lpw-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--ink, #1b1c1c);
}
.lpw-img.lpw-icon img {
  width: 46%;
  height: auto;
  max-height: 60%;
  object-fit: contain;
}


/* ===== Korrekturrunde 20.08.2026: Blocksatz für LP-Fließtext ===== */
.lp-sub, .lps-a-step p, .lpw-body p, .lpt-note, .lps-note, .lpr-quote p, .lpf-sub {
  text-align: justify;
  hyphens: auto;
}


/* =====================================================================
   24.08.2026: Zwei Bausteine aus dem Wettbewerbs-Abgleich (Meta Ad Library,
   Downloads/kanzlei-ads-onepager): (1) .lp-frist — schmale Frist-Zeile direkt
   unter dem Hero; die gesetzliche Frist ist der staerkste Urgency-Anker im
   Anzeigen-Umfeld und stand bisher nur beilaeufig im Fliesstext. (2) #fragen —
   FAQ vor dem Formular; 5 von 8 analysierten Wettbewerber-LPs beantworten
   Einwaende (v. a. die Kostenfrage) an dieser Stelle, unsere LPs bisher nicht.
   ===================================================================== */
.lp-frist {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 8px 14px;
  padding: 13px 20px;
  background: var(--ink, #1b1c1c);
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  text-align: center;
}
.lp-frist svg { flex: none; }
.lp-frist p {
  font-size: 14.5px;
  line-height: 21px;
  letter-spacing: -0.01em;
  color: rgba(255, 255, 230, 0.82);
}
.lp-frist p strong { color: var(--lime, #e4fe7b); font-weight: 600; }
.lp-frist a {
  color: var(--white-warm, #ffffe6);
  font-size: 14.5px;
  line-height: 21px;
  text-decoration: underline;
  text-underline-offset: 3px;
}
@media (max-width: 809.98px) {
  .lp-frist { padding: 12px 16px; }
  .lp-frist p, .lp-frist a { font-size: 13.5px; line-height: 19px; }
}

/* FAQ (#fragen): natives details/summary, kein JS noetig */
.lp-faq { max-width: 860px; }
.lp-faq details { border-bottom: 1px solid rgba(27, 28, 28, 0.14); }
.lp-faq details:first-child { border-top: 1px solid rgba(27, 28, 28, 0.14); }
.lp-faq summary {
  list-style: none;
  cursor: pointer;
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 18px;
  padding: 18px 2px;
  font-size: 18px;
  line-height: 26px;
  font-weight: 600;
  letter-spacing: -0.02em;
  color: var(--ink, #1b1c1c);
}
.lp-faq summary::-webkit-details-marker { display: none; }
.lp-faq summary::after {
  content: '+';
  flex: none;
  font-size: 22px;
  line-height: 1;
  font-weight: 500;
  color: rgba(27, 28, 28, 0.45);
}
.lp-faq details[open] summary::after { content: '\2013'; }
.lp-faq .lpq-a { padding: 0 2px 20px; max-width: 72ch; }
.lp-faq .lpq-a p {
  font-size: 15.5px;
  line-height: 24px;
  color: rgba(27, 28, 28, 0.72);
  text-align: justify;
  hyphens: auto;
}
.lp-faq .lpq-a p + p { margin-top: 10px; }
.lp-faq .lpq-a a { color: var(--ink, #1b1c1c); }
@media (max-width: 809.98px) {
  .lp-faq summary { font-size: 16px; line-height: 23px; padding: 15px 0; }
  .lp-faq .lpq-a p { font-size: 14.5px; line-height: 22px; }
}
