/* ============================================================
   Wegweiser nach Lagen: Startseite und pro365complete
   Baut auf css/style.css auf, nur Klassen mit lp- oder eigenen
   Namen, damit Unterseiten und Rechtsseiten unberührt bleiben.
   Farben nur über die Variablen aus style.css (Hell und Dunkel).
   ============================================================ */

.lp {
  --lp-ease: cubic-bezier(0.23, 1, 0.32, 1);
  --lp-max: 1180px;
}
.lp p, .lp li, .lp dd { text-wrap: pretty; }
.lp h1, .lp h2, .lp h3 { text-wrap: balance; }
.nb { white-space: nowrap; }

/* ---------- Skip-Link ---------- */
.lp-skip {
  position: absolute; left: 12px; top: -60px; z-index: 300;
  background: var(--cta-bg); color: var(--on-accent); padding: 12px 18px; border-radius: 6px;
  font-weight: 700; text-decoration: none;
}
.lp-skip:focus { top: 12px; }

/* ---------- Navigation ---------- */
.lp .nav__inner { gap: 24px; }
.lp .nav__links { gap: 26px; }
.lp .nav__burger { width: 44px; height: 44px; align-items: center; justify-content: center; padding: 0; }
.lp .nav__dropdown-menu { min-width: 330px; }
.lp .nav__lage a { display: grid; gap: 2px; padding: 10px 12px; }
.lp .nav__lage-satz { color: var(--ink); font-weight: 600; font-size: 0.92rem; line-height: 1.35; }
.lp .nav__lage-produkt { color: var(--ink-soft); font-weight: 600; font-size: 0.78rem; }
.lp .nav__tel { color: var(--ink) !important; }

/* ---------- Hero ---------- */
.lp-hero { padding: 64px 0 72px; }
.lp-hero__inner { display: grid; grid-template-columns: 1.08fr 0.92fr; gap: 56px; align-items: center; }
.lp-hero__ort {
  font-size: 0.8rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--ink-soft); margin-bottom: 18px; display: flex; gap: 10px; align-items: center;
}
.lp-hero__ort::before { content: ''; width: 14px; height: 3px; border-radius: 2px; background: var(--action); flex: none; }
.lp-hero__titel {
  font-size: clamp(2.05rem, 3.7vw, 3.05rem); line-height: 1.1; margin-bottom: 22px; max-width: 18ch;
}
.lp-hero__lead { font-size: 1.14rem; color: var(--ink-soft); max-width: 50ch; margin-bottom: 28px; }
.lp-hero__lead strong { color: var(--ink); font-weight: 700; }
.lp-hero__aktion { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; }
.lp-hero__notiz { font-size: 0.92rem; color: var(--ink-soft); max-width: 46ch; }
.lp-bild {
  display: block; width: 100%; height: auto; border-radius: var(--radius);
  background: var(--paper-2);
}
.lp-hero__seite { border: 1px solid var(--rule); border-radius: var(--radius); overflow: hidden; background: var(--paper); }
.lp-hero__seite .lp-bild { aspect-ratio: 16 / 6.4; object-fit: cover; object-position: 50% 62%; border-radius: 0; }
/* Foto des Inhabers: eigene Spalte, nie Text darüber, immer ganz (4:3 wie das Original, kein Zuschnitt) */
.lp-hero__seite .lp-bild--inhaber { aspect-ratio: 4 / 3; object-fit: contain; }

/* Kennzeichnung erzeugter Bilder: Plakette unten rechts im Bild, von der Seite gesetzt, nicht anklickbar.
   Gebrauch: <div class="bild-gekennzeichnet"> Bild … <span class="bild-kennzeichnung" aria-hidden="true">KI-erstellt</span></div>,
   der Alt-Text trägt den Hinweis für Screenreader. Fester dunkler Grund, damit der Kontrast im Hell- und Dunkelmodus gleich bleibt. */
.bild-gekennzeichnet { position: relative; }
.bild-kennzeichnung {
  position: absolute; right: 8px; bottom: 8px; z-index: 1;
  padding: 2px 7px; border-radius: 4px;
  background: rgba(17, 24, 32, 0.78); color: #FFFFFF;
  font-size: 0.7rem; font-weight: 600; line-height: 1.4; letter-spacing: 0.02em;
  pointer-events: none; user-select: none; white-space: nowrap;
}
.schnell { padding: 6px 0 4px; }
.schnell__titel {
  font-size: 0.74rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink-soft);
  padding: 14px 22px 8px;
}
.schnell ul { list-style: none; }
.schnell li + li { border-top: 1px solid var(--rule); }
.schnell a {
  display: grid; grid-template-columns: 1fr auto; column-gap: 16px; align-items: center;
  min-height: 56px; padding: 9px 22px; text-decoration: none; color: var(--ink);
  position: relative;
}
.schnell a::after { content: '\2193'; grid-column: 2; grid-row: 1 / span 2; color: var(--trust-strong); font-weight: 700; transition: transform 160ms var(--lp-ease); }
.schnell span { font-family: var(--font-display); font-weight: 700; font-size: 0.98rem; line-height: 1.3; }
.schnell small { grid-column: 1; color: var(--trust-strong); font-weight: 700; font-size: 0.8rem; }
@media (hover: hover) and (pointer: fine) {
  .schnell a:hover { background: var(--paper-2); }
  .schnell a:hover::after { transform: translateY(2px); }
  .lp .nav__links > a:hover, .lp .nav__dropdown-trigger:hover { color: var(--ink); }
}
@media (min-width: 901px) {
  .lp .nav__links > a:not(.nav__cta), .lp .nav__dropdown-trigger { padding: 10px 0; }
}

/* ---------- Abschnitt-Kopf ---------- */
.lp-kopf { max-width: 760px; margin-bottom: 40px; }
.lp-kopf__marke {
  font-size: 0.78rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--ink-soft); margin-bottom: 14px; display: flex; gap: 10px; align-items: center;
}
.lp-kopf__marke::before { content: ''; width: 14px; height: 3px; border-radius: 2px; background: var(--action); flex: none; }
.lp-kopf h2 { font-size: clamp(1.75rem, 3.2vw, 2.45rem); line-height: 1.16; margin-bottom: 14px; }
.lp-kopf p { color: var(--ink-soft); font-size: 1.06rem; max-width: 62ch; }

.lp-abschnitt { padding: 84px 0; border-top: 1px solid var(--rule); }
.lp-abschnitt--flaeche { background: var(--paper-2); }

/* ---------- Wegweiser ---------- */
.lagen { list-style: none; border-top: 2px solid var(--ink); counter-reset: lage; }
.lage {
  display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr) minmax(0, 0.85fr);
  gap: 36px; padding: 34px 0; border-bottom: 1px solid var(--rule);
  scroll-margin-top: 90px;
}
.lage__kopf { position: relative; padding-left: 46px; counter-increment: lage; }
.lage__kopf::before {
  content: counter(lage, decimal-leading-zero);
  position: absolute; left: 0; top: 0.28em;
  font-family: var(--font-display); font-weight: 800; font-size: 0.85rem; color: var(--trust-strong);
  letter-spacing: 0.04em;
}
.lage__satz { font-size: clamp(1.18rem, 1.9vw, 1.42rem); line-height: 1.3; font-weight: 700; margin-bottom: 12px; }
.lage__produkt {
  display: block; padding-left: 20px; position: relative;
  font-size: 0.88rem; font-weight: 700; color: var(--trust-strong);
}
.lage__produkt::before { content: '\21B3'; position: absolute; left: 0; top: 0; font-weight: 400; color: var(--ink-soft); }
.lage__tun { color: var(--ink); font-size: 1rem; }
.lage__tun p + p { margin-top: 10px; }
.lage__grenze { display: flex; flex-direction: column; gap: 14px; align-items: flex-start; }
.lage__nicht {
  font-size: 0.93rem; color: var(--ink-soft);
  border-left: 3px solid var(--rule); padding: 2px 0 2px 14px;
}
.lage__nicht b { display: block; color: var(--ink); font-size: 0.78rem; letter-spacing: 0.08em; text-transform: uppercase; margin-bottom: 4px; }
.lage__weiter {
  display: inline-flex; align-items: center; gap: 8px; min-height: 44px;
  font-weight: 700; font-size: 0.95rem; color: var(--trust-strong); text-decoration: none;
  border-bottom: 1px solid transparent;
}
.lage__weiter span[aria-hidden] { transition: transform 160ms var(--lp-ease); }
.lage__tel {
  display: inline-flex; align-items: center; min-height: 44px; padding: 10px 18px;
  border: 1.5px solid var(--ink); border-radius: 999px; font-weight: 700; color: var(--ink); text-decoration: none;
  font-variant-numeric: tabular-nums;
}
.lage__zeiten { font-size: 0.86rem; color: var(--ink-soft); }
@media (hover: hover) and (pointer: fine) {
  .lage__weiter:hover { border-bottom-color: currentColor; }
  .lage__weiter:hover span[aria-hidden] { transform: translateX(3px); }
  .lage__tel:hover { background: var(--paper-2); }
}

/* ---------- Passt / passt nicht und Grenzen ---------- */
.passt { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-bottom: 56px; }
.passt__box { background: var(--paper); border: 1px solid var(--rule); border-radius: var(--radius); padding: 30px 32px; }
.passt__box--nein { background: transparent; border-style: dashed; }
.passt__box h3 { font-size: 1.12rem; margin-bottom: 14px; }
.passt__box ul { list-style: none; display: grid; gap: 10px; }
.passt__box li { position: relative; padding-left: 26px; color: var(--ink-soft); }
.passt__box li::before { position: absolute; left: 0; top: 0; font-weight: 700; }
.passt__box--ja li::before { content: '+'; color: var(--trust-strong); }
.passt__box--nein li::before { content: '\2212'; color: var(--ink-soft); }

.grenzen-wrap { display: grid; grid-template-columns: 0.9fr 1.1fr; gap: 48px; align-items: start; }
.grenzen-wrap h3 { font-size: 1.32rem; margin-bottom: 8px; }
.grenzen-wrap > div > p { color: var(--ink-soft); margin-bottom: 22px; }
.grenzen { display: grid; gap: 0; }
.grenzen > div { padding: 18px 0; border-top: 1px solid var(--rule); }
.grenzen > div:first-child { border-top: none; padding-top: 0; }
.grenzen dt { font-family: var(--font-display); font-weight: 700; font-size: 1.02rem; margin-bottom: 4px; }
.grenzen dd { color: var(--ink-soft); }

/* ---------- Ablauf ---------- */
.schritte-wrap { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: 56px; align-items: center; }
.schritte { list-style: none; counter-reset: schritt; display: grid; gap: 0; }
.schritte li { position: relative; padding: 20px 0 20px 56px; border-top: 1px solid var(--rule); counter-increment: schritt; }
.schritte li:first-child { border-top: none; padding-top: 0; }
.schritte li::before {
  content: counter(schritt); position: absolute; left: 0; top: 18px;
  width: 34px; height: 34px; border-radius: 50%; border: 1.5px solid var(--trust-strong);
  display: grid; place-items: center; font-family: var(--font-display); font-weight: 800; font-size: 0.9rem; color: var(--trust-strong);
}
.schritte li:first-child::before { top: -2px; }
.schritte h3 { font-size: 1.08rem; margin-bottom: 4px; }
.schritte p { color: var(--ink-soft); }
.schritte-aktion { margin-top: 30px; display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
.schritte-aktion p { font-size: 0.92rem; color: var(--ink-soft); }

/* ---------- FAQ (details) ---------- */
.lp-faq { max-width: 820px; }
.lp-faq details { border-top: 1px solid var(--rule); }
.lp-faq details:last-child { border-bottom: 1px solid var(--rule); }
.lp-faq summary {
  list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 20px;
  min-height: 56px; padding: 16px 0; font-family: var(--font-display); font-weight: 700; font-size: 1.06rem;
}
.lp-faq summary::-webkit-details-marker { display: none; }
.lp-faq summary::after {
  content: '+'; flex: none; width: 28px; height: 28px; border-radius: 50%; border: 1px solid var(--rule);
  display: grid; place-items: center; font-weight: 400; color: var(--ink-soft);
  transition: transform 160ms var(--lp-ease);
}
.lp-faq details[open] summary::after { transform: rotate(45deg); }
.lp-faq details > div { padding: 0 0 22px; color: var(--ink-soft); max-width: 68ch; }
.lp-faq details > div p + p { margin-top: 10px; }
.lp-faq a { color: var(--trust-strong); }

/* ---------- Abschluss ---------- */
.lp .cta { padding: 84px 0 56px; }
.lp .cta__panel { max-width: 760px; padding: 60px 48px; }
.lp .nav__brand { display: inline-flex; align-items: center; min-height: 44px; }
.lp .footer__brand > a { display: inline-flex; align-items: center; min-height: 44px; }
.lp .cta__panel h2 { font-size: clamp(1.75rem, 3.2vw, 2.4rem); line-height: 1.16; margin-bottom: 16px; }
.lp-cta__text { color: var(--ink-soft); max-width: 54ch; margin: 0 auto 28px; }
.lp-cta__danach { color: var(--ink-soft); font-size: 0.92rem; max-width: 52ch; margin: 18px auto 0; }
.lp .cta__actions { margin-bottom: 0; }
.lp .cta__contacts { margin-top: 26px; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 0 4px; }
.lp .cta__contacts a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 8px; }
.lp-cta__zeiten { color: var(--ink-soft); font-size: 0.88rem; margin-top: 6px; }
.lp-absender { color: var(--ink-soft); font-size: 0.86rem; margin-top: 30px; padding-top: 22px; border-top: 1px solid var(--rule); }
.lp .footer__links a { display: inline-flex; align-items: center; min-height: 44px; }
.lp-fussnotiz { color: var(--ink-soft); font-size: 0.84rem; max-width: 70ch; margin-top: 24px; }

/* ---------- pro365complete ---------- */
.p365-hero { padding: 40px 0 72px; }
.p365-hero__inner { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: 56px; align-items: center; }
.p365-lage {
  font-family: var(--font-display); font-weight: 600; font-size: clamp(1.02rem, 1.6vw, 1.18rem); line-height: 1.4;
  color: var(--ink-soft); border-left: 3px solid var(--action); padding-left: 16px; margin-bottom: 22px; max-width: 46ch;
}
.p365-hero h1 { font-size: clamp(1.95rem, 3.8vw, 3rem); line-height: 1.1; margin-bottom: 20px; }
.p365-hero h1 .p365-name { display: block; color: var(--trust-strong); font-size: 0.62em; font-weight: 800; margin-bottom: 8px; letter-spacing: 0; }
.p365-hero .lp-hero__lead { margin-bottom: 26px; }
.p365-hero .lp-bild { aspect-ratio: 4 / 3.6; object-fit: cover; object-position: 50% 50%; }

.definition { display: grid; grid-template-columns: 1fr; gap: 44px; }
.definition__text { max-width: 780px; }
.definition__text p { font-size: 1.08rem; color: var(--ink); }
.definition__text p + p { margin-top: 16px; }
.vergleich { width: 100%; border-collapse: collapse; font-size: 0.95rem; }
.vergleich caption { text-align: left; font-weight: 700; font-family: var(--font-display); margin-bottom: 12px; font-size: 1rem; }
.vergleich th, .vergleich td { text-align: left; vertical-align: top; padding: 14px 12px; border-bottom: 1px solid var(--rule); }
.vergleich thead th { font-size: 0.86rem; color: var(--ink-soft); border-bottom: 2px solid var(--ink); }
.vergleich tbody th { font-weight: 700; width: 30%; }
.vergleich td { color: var(--ink-soft); }
.vergleich td.vergleich__neu { color: var(--ink); font-weight: 600; }

.umfang { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.umfang__box { border: 1px solid var(--rule); border-radius: var(--radius); padding: 30px 32px; background: var(--paper); }
.umfang__box--nicht { background: transparent; border-style: dashed; }
.umfang__box h3 { font-size: 1.15rem; margin-bottom: 18px; }
.umfang__box ol { list-style: none; counter-reset: punkt; display: grid; gap: 14px; }
.umfang__box li { counter-increment: punkt; position: relative; padding-left: 34px; }
.umfang__box li::before {
  content: counter(punkt); position: absolute; left: 0; top: 1px; width: 22px; height: 22px; border-radius: 50%;
  display: grid; place-items: center; font-size: 0.74rem; font-weight: 700; background: var(--paper-2); color: var(--trust-strong);
}
.umfang__box--nicht li::before { background: transparent; border: 1px solid var(--rule); color: var(--ink-soft); }
.umfang__box li b { display: block; color: var(--ink); }
.umfang__box li span { color: var(--ink-soft); font-size: 0.93rem; }
.kleiner { margin-top: 28px; color: var(--ink-soft); max-width: 70ch; }
.kleiner a { color: var(--trust-strong); font-weight: 700; }

/* ---------- Responsive ---------- */
@media (max-width: 1080px) {
  .lage { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .lage__grenze { grid-column: 2; }
}
@media (max-width: 900px) {
  .lp .container { padding: 0 22px; }
  .lp .nav__inner { padding: 8px 22px; }
  .lp .nav__links { top: 60px; padding: 18px 22px 26px; gap: 4px; }
  .lp .nav__links > a, .lp .nav__dropdown-trigger { display: flex; align-items: center; min-height: 44px; width: 100%; }
  .lp .nav__dropdown-menu { min-width: 0; padding-left: 4px; }
  .lp .nav__lage a { min-height: 44px; }
  .lp .nav__cta { justify-content: center; margin-top: 8px; }

  .lp-hero { padding: 26px 0 48px; }
  .lp-hero__inner, .p365-hero__inner, .definition, .grenzen-wrap, .schritte-wrap { grid-template-columns: 1fr; gap: 32px; }
  .lp-hero__ort { font-size: 0.72rem; margin-bottom: 12px; letter-spacing: 0.1em; }
  .lp-hero__titel { font-size: 1.86rem; line-height: 1.12; margin-bottom: 14px; }
  .lp-hero__lead { font-size: 1.02rem; margin-bottom: 20px; }
  .lp-hero__aktion .btn { width: 100%; }
  .lp-hero__notiz { font-size: 0.86rem; }
  .p365-hero .lp-bild { aspect-ratio: 16 / 9; object-position: 50% 30%; }
  .lp-hero__seite .schnell { display: none; }
  .lp-hero__seite .lp-bild { aspect-ratio: 16 / 9; }
  .lp-hero__seite .lp-bild--inhaber { aspect-ratio: 4 / 3; }

  .lp-abschnitt { padding: 60px 0; }
  .lp-kopf { margin-bottom: 28px; }
  .lage { grid-template-columns: 1fr; gap: 14px; padding: 26px 0; }
  .lage__grenze { grid-column: auto; }
  .lage__kopf { padding-left: 38px; }
  .passt, .umfang { grid-template-columns: 1fr; }
  .passt__box, .umfang__box { padding: 24px 22px; }
  .schritte-wrap > picture { order: -1; }
  .schritte-aktion .btn { width: 100%; }
  .lp .cta { padding: 56px 0 32px; }
  .lp .cta__panel { padding: 40px 22px; margin: 0 14px; }
  .lp .btn--lg { padding: 17px 22px; width: 100%; }

  .p365-hero { padding: 22px 0 48px; }
  .p365-lage { margin-bottom: 14px; font-size: 0.98rem; }
  .p365-hero h1 { font-size: 1.72rem; margin-bottom: 14px; }

  .vergleich thead { display: none; }
  .vergleich, .vergleich tbody, .vergleich tr, .vergleich th, .vergleich td { display: block; width: 100%; }
  .vergleich tr { padding: 14px 0; border-bottom: 1px solid var(--rule); }
  .vergleich tbody th, .vergleich td { border: none; padding: 4px 0; }
  .vergleich td::before { content: attr(data-label) ': '; font-weight: 700; color: var(--ink-soft); font-size: 0.82rem; }
}

/* ---------- Nachtrag nach Messung 390 und 1440 ---------- */
.lp .breadcrumb a { display: inline-flex; align-items: center; min-height: 44px; min-width: 44px; }
.vergleich thead th:first-child { width: 28%; }
@media (max-width: 900px) {
  .vergleich caption { display: block; width: 100%; }
  .vergleich tbody th { width: 100%; }
  .lp-kopf h2.h2-name { font-size: min(1.75rem, 5.6vw); text-wrap: nowrap; }
  .p365-hero { padding-top: 6px; }
  .p365-hero .breadcrumb { margin-bottom: 2px; }
}
@media (max-width: 420px) {
  .umfang__box { padding: 22px 16px; }
  .umfang__box li { padding-left: 32px; }
}

/* ============================================================
   Runde 2, Team A: ein Knopfziel, Ausfahrten ohne Knopf-Optik
   ============================================================ */
.lp-sr {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

/* Navigation: Notfall und KI als zweite Gruppe */
.lp .nav__lage-aus { border-top: 1px solid var(--rule); margin-top: 6px !important; padding-top: 6px; }

/* Andere Anliegen: Ausfahrt aus dem Wegweiser, ohne Knopf */
.ausfahrt { margin-top: 56px; }
.ausfahrt__titel { font-size: 1.22rem; margin-bottom: 6px; }
.ausfahrt__text { color: var(--ink-soft); margin-bottom: 22px; max-width: 62ch; }
.ausfahrt__liste { list-style: none; display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.ausfahrt__fall {
  border: 1px dashed var(--rule); border-radius: var(--radius); padding: 26px 28px;
  display: flex; flex-direction: column; gap: 10px; align-items: flex-start;
  scroll-margin-top: 90px;
}
.ausfahrt__marke {
  font-size: 0.74rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink-soft);
}
.ausfahrt__satz { font-size: 1.1rem; line-height: 1.32; }
.ausfahrt__produkt { font-size: 0.88rem; font-weight: 700; color: var(--trust-strong); margin-top: -4px; }
.ausfahrt__fall > p:not([class]) { color: var(--ink); }
.ausfahrt__nicht {
  font-size: 0.93rem; color: var(--ink-soft);
  border-left: 3px solid var(--rule); padding: 2px 0 2px 14px;
}
.ausfahrt__nicht b { display: block; color: var(--ink); font-size: 0.78rem; letter-spacing: 0.08em; text-transform: uppercase; margin-bottom: 4px; }
.ausfahrt__wege { display: flex; flex-wrap: wrap; align-items: center; column-gap: 14px; }
.ausfahrt__tel {
  display: inline-flex; align-items: center; min-height: 44px;
  font-weight: 700; color: var(--ink); text-decoration: underline; text-underline-offset: 3px;
  text-decoration-thickness: 1.5px; font-variant-numeric: tabular-nums;
}
.ausfahrt__zeiten { font-size: 0.86rem; color: var(--ink-soft); }

/* Fuß: Ausfahrt für bestehende Kunden, Textlink statt Knopf */
.footer__kunden { max-width: 340px; display: grid; gap: 2px; }
.footer__kunden-titel {
  font-size: 0.74rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink-soft);
}
.footer__kunden a {
  display: inline-flex; align-items: center; min-height: 44px;
  color: var(--ink); font-size: 0.92rem; font-weight: 600; text-decoration: underline; text-underline-offset: 3px;
}
.footer__kunden-notiz { color: var(--ink-soft); font-size: 0.84rem; }

@media (max-width: 900px) {
  .ausfahrt { margin-top: 40px; }
  .ausfahrt__liste { grid-template-columns: 1fr; gap: 16px; }
  .ausfahrt__fall { padding: 22px 20px; }
  .footer__kunden { max-width: none; }
}

/* pro365complete: H1 ist das Ergebnis, der Produktname steht klein darunter */
.p365-hero h1 { margin-bottom: 12px; max-width: 22ch; }
.p365-name {
  font-family: var(--font-display); font-size: 0.95rem; font-weight: 700; color: var(--trust-strong);
  margin-bottom: 20px; display: flex; gap: 10px; align-items: center;
}
.p365-name::before { content: ''; width: 14px; height: 3px; border-radius: 2px; background: var(--action); flex: none; }
@media (max-width: 900px) {
  .p365-hero h1 { margin-bottom: 10px; }
  .p365-name { font-size: 0.88rem; margin-bottom: 14px; }
}

/* Kostenlose Erstanalyse: Ablauf, Knopf und Kontakt an einer Stelle */
.erstanalyse { background: var(--paper-2); }
.erstanalyse__inner { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); gap: 64px; align-items: start; }
.erstanalyse__kopf .lp-kopf { margin-bottom: 28px; }
.erstanalyse__bild .lp-bild { aspect-ratio: 4 / 3; object-fit: cover; }
.erstanalyse__ablauf { background: var(--paper); border: 1px solid var(--rule); border-radius: var(--radius); padding: 36px 36px 30px; }
.erstanalyse__aktion { margin-top: 26px; display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
.erstanalyse__aktion p { font-size: 0.9rem; color: var(--ink-soft); }
.erstanalyse__kontakt { margin-top: 26px; padding-top: 20px; border-top: 1px solid var(--rule); }
.erstanalyse__kontakt > p:first-child { color: var(--ink-soft); font-size: 0.95rem; }
.erstanalyse__wege { display: flex; flex-wrap: wrap; align-items: center; gap: 0 6px; font-weight: 700; }
.erstanalyse__wege a { display: inline-flex; align-items: center; min-height: 44px; color: var(--ink); text-decoration: none; font-variant-numeric: tabular-nums; }
.erstanalyse__wege span { color: var(--ink-soft); padding: 0 6px; }
.erstanalyse .lp-absender { margin-top: 48px; }
@media (hover: hover) and (pointer: fine) {
  .erstanalyse__wege a:hover { text-decoration: underline; text-underline-offset: 3px; }
}
@media (max-width: 900px) {
  .erstanalyse__inner { grid-template-columns: 1fr; gap: 0; }
  .erstanalyse__bild { display: none; }
  .erstanalyse__ablauf { padding: 26px 20px 22px; }
  .erstanalyse__aktion .btn { width: 100%; }
  .erstanalyse .lp-absender { margin-top: 32px; }
}

/* Erster Bildschirm bei schmaler Breite: Notfall-Ausfahrt im Hero, kompaktere Cookie-Leiste (Wortlaut unverändert) */
.lp-hero__ausfahrt { display: none; }
@media (max-width: 900px) {
  .lp-hero__ausfahrt { display: block; margin-top: 14px; font-size: 0.9rem; color: var(--ink-soft); }
  .lp-hero__ausfahrt a { color: var(--trust-strong); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; padding-block: 12px; }
}
@media (max-width: 640px) {
  .lp .consent__box { padding: 12px 18px 14px; gap: 10px; }
  .lp .consent__box p { font-size: 0.8rem; line-height: 1.42; }
  .lp .consent__actions { gap: 10px; }
  .lp .consent__actions .btn { min-height: 44px; padding: 8px 16px; }
}
@media (min-width: 901px) {
  /* Kostensatz unter dem Knopf endet bei 1440 x 900 über der Cookie-Leiste */
  .p365-hero { padding-top: 24px; }
  .p365-hero h1 { font-size: clamp(1.95rem, 3.2vw, 2.6rem); max-width: 24ch; }
}

/* ki-mitarbeiter.html: Zeilenfall nach der Regel kein-wort-allein */
.ki-seite p, .ki-seite li { text-wrap: pretty; }
.ki-seite .stay__item p { text-wrap: balance; }
/* Ablauf-Titel bricht an der Satzgrenze: „Erst die Analyse.“ / „Dann der Mitarbeiter.“ */
.ki-seite .process .section-title em { display: block; }
@media (min-width: 901px) {
  /* H1 in zwei Zeilen statt vier, ohne Einzelwort */
  .ki-seite .svc-hero__intro { max-width: 940px; }
}
@media (max-width: 480px) {
  /* „Reden wir. Unverbindlich.“ und der Buchungsknopf bleiben einzeilig */
  .ki-seite .cta .section-title { font-size: min(1.9rem, 6.2vw); }
  .ki-seite .process .section-title { font-size: min(1.9rem, 7.2vw); }
  /* „Was ein KI-Mitarbeiter“ / „konkret übernimmt.“ in zwei Zeilen, auch bei 360 und 320 px */
  .ki-seite .pillars .section-title { font-size: min(1.9rem, 6.8vw); }
  .ki-seite .cta__actions .btn--lg { padding: 17px 22px; }
}
@media (min-width: 481px) {
  /* span.nb hält „KI-Mitarbeiter“ nur mobil zusammen; breiter stört nowrap den Ausgleich von text-wrap: balance und lässt „übernimmt.“ allein */
  .ki-seite .pillars .section-title .nb { white-space: normal; }
}

/* Rechtsseiten (impressum.html, datenschutz.html): lange Wörter wie „Datenschutzerklärung“ in der H1 brechen bei 390 px um, statt die Seite auf 404 px zu verbreitern */
.legal { overflow-wrap: anywhere; }
@media (max-width: 480px) {
  /* „Datenschutzerklärung“ bleibt bei 390 px in einer Zeile statt mitten im Wort zu brechen */
  .legal h1 { font-size: min(2rem, 7vw); }
}

/* it-notfall.html: Zeilenfall nach der Regel kein-wort-allein */
.notfall-seite p, .notfall-seite li { text-wrap: pretty; }
.notfall-seite h1, .notfall-seite h2, .notfall-seite h3 { text-wrap: balance; }
