/* ExoEnergies – Ergänzungen für Leistungsseiten (Etappe 1, 17.10.2026).
   Baut auf exo-basis.css (Startseite A) auf: gleiche Farben aus dem Logo, gleiche Schriften, gleiche Abstände.
   Neue Bausteine: Seitenkopf mit Bild, Kurzantwort, Prüfliste, Auswahlkarten, Fragenliste, Weiterführend, Fachquellen. */

/* Navigation: aktuelle Seite, noch nicht vorhandene Seiten */
.exo-nav a[aria-current="page"] { color: var(--exo-teal-ink); text-decoration: underline; text-underline-offset: .45em; text-decoration-thickness: 2px; }
.exo-nav .exo-nav__later { color: #8f8d8f; font-size: .95rem; cursor: default; white-space: nowrap; }
.exo-nav .exo-nav__later small { font-size: .74rem; margin-left: 4px; }
.exo-later { color: var(--exo-grey); }
.exo-later small, .exo-soon { display: inline-block; font: 700 .7rem/1 var(--exo-text); letter-spacing: .04em; text-transform: uppercase; color: var(--exo-note); background: var(--exo-mist); border: 1px solid var(--exo-line); border-radius: 999px; padding: 4px 8px; margin-left: 6px; vertical-align: .12em; white-space: nowrap; }

/* Brotkrumen */
.exo-crumbs { font-size: .9rem; color: var(--exo-note); }
.exo-crumbs ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 4px 0; }
.exo-crumbs li + li::before { content: "/"; margin: 0 10px; color: #b8b6b8; }
.exo-crumbs a { color: var(--exo-grey); }
.exo-crumbs [aria-current] { color: var(--exo-ink); }

/* Seitenkopf: Text links, Foto läuft bis zum rechten Bildschirmrand */
.exo-phero { --bleed: calc(var(--exo-gutter) + max(0px, (100vw - var(--exo-max)) / 2)); padding-block: clamp(28px, 4vw, 56px) clamp(56px, 7vw, 104px); }
.exo-phero__grid { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); gap: clamp(32px, 5vw, 80px); align-items: center; }
.exo-phero__text { display: grid; gap: 22px; min-width: 0; align-content: center; }
.exo-phero__text h1 { font-size: clamp(2.35rem, 4.6vw, 4.1rem); }
.exo-eyebrow { font: 700 .82rem/1.2 var(--exo-text); letter-spacing: .08em; text-transform: uppercase; color: var(--exo-teal-ink); }
.exo-phero__media { margin: 0 calc(-1 * var(--bleed)) 0 0; height: clamp(420px, 44vw, 600px); border-radius: 22px 0 0 22px; overflow: hidden; background: var(--exo-mist); position: relative; }
.exo-phero__media img { width: 100%; height: 100%; object-fit: cover; }
.exo-phero--flip .exo-phero__grid { grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); }
.exo-phero--flip .exo-phero__media { order: -1; margin: 0 0 0 calc(-1 * var(--bleed)); border-radius: 0 22px 22px 0; }
.exo-phero__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 24px; }
.exo-symbol { position: absolute; left: 12px; bottom: 12px; font: 400 .78rem/1.3 var(--exo-text); color: #ffffff; background: rgba(31, 42, 41, .62); padding: 5px 9px; border-radius: 6px; }
.exo-phero__media .exo-symbol { left: auto; right: calc(var(--bleed) - var(--exo-gutter) + 12px); }
.exo-phero--flip .exo-phero__media .exo-symbol { right: auto; left: calc(var(--bleed) - var(--exo-gutter) + 12px); }
.exo-phero__media--draw { background: var(--exo-mist); display: grid; place-items: center; padding: clamp(18px, 3vw, 40px); padding-right: calc(var(--bleed) - var(--exo-gutter) + clamp(18px, 3vw, 40px)); }
.exo-phero__media--draw svg { width: 100%; height: auto; max-height: 100%; }

/* Kurzantwort direkt unter dem Seitenkopf */
.exo-answer { background: var(--exo-mist); border-radius: 18px; padding: clamp(20px, 2.6vw, 30px); display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 8px 22px; align-items: start; }
.exo-answer__label { font: 700 .82rem/1.6 var(--exo-text); letter-spacing: .06em; text-transform: uppercase; color: var(--exo-teal-ink); white-space: nowrap; }
.exo-answer p { color: var(--exo-ink); max-width: 62em; }
.exo-phero + .exo-section, .exo-phero + .exo-band { padding-top: 0; }

/* Fließtextblöcke */
.exo-prose { display: grid; gap: 16px; max-width: 40em; }
.exo-prose h3 { margin-top: 8px; }
.exo-split { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(28px, 5vw, 88px); align-items: start; }

/* Prüfliste mit Nummern */
.exo-checkgrid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 clamp(24px, 4vw, 56px); counter-reset: chk; border-top: 1px solid var(--exo-line); }
.exo-checkgrid li { counter-increment: chk; display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 6px 14px; padding: 22px 0; border-bottom: 1px solid var(--exo-line); }
.exo-checkgrid li::before { content: counter(chk, decimal-leading-zero); grid-row: span 2; font: 400 1.5rem/1 var(--exo-display); color: var(--exo-teal-ink); padding-top: 2px; }
.exo-checkgrid strong { font-family: var(--exo-display); font-weight: 700; color: var(--exo-ink); font-size: 1.1rem; }
.exo-checkgrid--three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.exo-after { margin-top: 22px; max-width: 46em; }

/* Auswahlkarten (Ladefall, Speicheraufgabe, Serviceanliegen) */
.exo-choices { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(14px, 2vw, 24px); }
.exo-choices--two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.exo-choice { background: var(--exo-white); border: 1px solid var(--exo-line); border-radius: 18px; padding: clamp(20px, 2.4vw, 30px); display: flex; flex-direction: column; gap: 12px; min-width: 0; scroll-margin-top: calc(var(--exo-header) + 16px); }
.exo-section--mist .exo-choice { border-color: transparent; }
.exo-choice__tag { font: 700 .78rem/1 var(--exo-text); letter-spacing: .06em; text-transform: uppercase; color: var(--exo-teal-ink); }
.exo-choice h3 { font-size: clamp(1.25rem, 1.8vw, 1.5rem); }
.exo-choice__foot { margin-top: auto; padding-top: 8px; display: flex; flex-wrap: wrap; gap: 10px 20px; align-items: baseline; }
.exo-choice__icon { width: 52px; height: 52px; }

/* Große Fragen (Freifläche) */
.exo-questions { list-style: none; margin: 0; padding: 0; counter-reset: q; display: grid; gap: 0; border-top: 1px solid var(--exo-line); }
.exo-questions li { counter-increment: q; display: grid; grid-template-columns: 72px minmax(0, 5fr) minmax(0, 6fr); gap: 8px clamp(18px, 3vw, 44px); padding: clamp(22px, 3vw, 36px) 0; border-bottom: 1px solid var(--exo-line); align-items: baseline; }
.exo-questions li::before { content: counter(q); font: 400 clamp(2.4rem, 4vw, 3.4rem)/1 var(--exo-display); color: var(--exo-teal); }
.exo-questions h3 { font-weight: 400; font-size: clamp(1.4rem, 2.3vw, 2rem); letter-spacing: -.01em; }

/* Zahlenpaar (kW/kWh) */
.exo-pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; border: 1px solid var(--exo-line); border-radius: 18px; overflow: hidden; background: var(--exo-white); }
.exo-pair > div { padding: clamp(20px, 2.6vw, 32px); display: grid; gap: 8px; align-content: start; }
.exo-pair > div + div { border-left: 1px solid var(--exo-line); }
.exo-pair__unit { font: 400 clamp(2.2rem, 4vw, 3.2rem)/1 var(--exo-display); color: var(--exo-teal-ink); }
.exo-pair h3 { font-size: 1.1rem; }

/* Zwei Wege (neu/nachrüsten) */
.exo-paths { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(14px, 2vw, 24px); margin-top: 8px; }
.exo-paths > div { border-top: 3px solid var(--exo-teal); padding-top: 16px; display: grid; gap: 8px; align-content: start; }

/* Weiterführende Seiten */
.exo-related { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px 12px; }
.exo-related a, .exo-related .exo-later { display: inline-flex; align-items: center; min-height: 44px; padding: 0 18px; border-radius: 999px; border: 1.5px solid var(--exo-line); background: var(--exo-white); text-decoration: none; color: var(--exo-ink); font-weight: 700; font-size: .95rem; }
.exo-related a:hover { border-color: var(--exo-teal); color: var(--exo-teal-ink); }
.exo-related a::after { content: "→"; margin-left: 10px; color: var(--exo-teal-ink); font-weight: 400; }
.exo-related .exo-later { font-weight: 400; color: var(--exo-grey); border-style: dashed; }
.exo-related__label { font: 700 .82rem/1.2 var(--exo-text); letter-spacing: .06em; text-transform: uppercase; color: var(--exo-note); margin-bottom: 10px; display: block; }

/* Bewertungsblock (Wirtschaftlichkeit, Investment) */
.exo-band { padding-block: clamp(56px, 8vw, 104px); }
.exo-assess { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: clamp(28px, 5vw, 80px); align-items: start; background: var(--exo-wash); border-radius: 24px; padding: clamp(26px, 4vw, 56px); }
.exo-assess .exo-prose { max-width: none; }
.exo-assess ul.exo-topics { margin: 0; }

/* Häufige Fragen */
.exo-faq { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: clamp(28px, 5vw, 88px); align-items: start; }
.exo-faq__head { display: grid; gap: 16px; position: sticky; top: calc(var(--exo-header) + 24px); }
.exo-faq__list { border-top: 1px solid var(--exo-line); }
.exo-faq__item { border-bottom: 1px solid var(--exo-line); }
.exo-faq__item summary { list-style: none; cursor: pointer; display: grid; grid-template-columns: minmax(0, 1fr) 32px; gap: 16px; align-items: center; padding: 20px 4px; font: 700 1.1rem/1.35 var(--exo-display); color: var(--exo-ink); border-radius: 6px; }
.exo-faq__item summary::-webkit-details-marker { display: none; }
.exo-faq__item summary::after { content: ""; width: 32px; height: 32px; border-radius: 50%; background: var(--exo-mist) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M7.25 3h1.5v10h-1.5zM3 7.25h10v1.5H3z' fill='%230a6c64'/%3E%3C/svg%3E") center / 14px no-repeat; transition: transform .2s ease; }
.exo-faq__item[open] summary::after { transform: rotate(45deg); }
.exo-faq__item summary:hover { color: var(--exo-teal-ink); }
.exo-faq__item summary:focus-visible { outline: 3px solid var(--exo-teal); outline-offset: 2px; }
.exo-faq__answer { padding: 0 52px 22px 4px; display: grid; gap: 10px; }

/* Fachquellen */
.exo-sources { display: grid; gap: 12px; padding-top: clamp(28px, 3vw, 40px); border-top: 1px solid var(--exo-line); margin-top: clamp(40px, 5vw, 64px); }
.exo-sources h3 { font-size: 1rem; font-family: var(--exo-text); }
.exo-sources ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 8px; font-size: .92rem; }
.exo-sources li span { color: var(--exo-note); }

/* Abschluss-Überleitung zur Anfrage */
.exo-closing { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 20px 40px; align-items: center; padding: clamp(26px, 3.6vw, 44px) 0; border-top: 1px solid var(--exo-line); border-bottom: 1px solid var(--exo-line); }
.exo-closing h2 { font-size: clamp(1.7rem, 3vw, 2.5rem); }

/* Anfrage: längere Abschlussfrage als Überschrift */
#kontakt .exo-direct h2 { font-size: clamp(1.8rem, 3vw, 2.6rem); }

/* Video-Platzhalter auf Leistungsseiten */
.exo-voices--page { margin-top: 0; padding-top: 0; border-top: 0; }

/* Formular: Art des Vorhabens */
#exo-kind-block legend small { font-weight: 400; }

/* Übersichtsseite der Etappe */
.exo-overview { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 340px), 1fr)); gap: 18px; }
.exo-overview li { border: 1px solid var(--exo-line); border-radius: 18px; padding: 24px; display: grid; gap: 10px; align-content: start; }
.exo-overview dl { margin: 0; display: grid; gap: 4px; font-size: .92rem; }
.exo-overview dt { font-weight: 700; color: var(--exo-ink); }
.exo-overview dd { margin: 0 0 6px; }
.exo-tablewrap { overflow-x: auto; border: 1px solid var(--exo-line); border-radius: 14px; -webkit-overflow-scrolling: touch; }
.exo-table { border-collapse: collapse; width: 100%; min-width: 980px; font-size: .86rem; line-height: 1.45; }
.exo-table th, .exo-table td { text-align: left; vertical-align: top; padding: 10px 12px; border-bottom: 1px solid var(--exo-line); }
.exo-table th { background: var(--exo-mist); color: var(--exo-ink); position: sticky; top: 0; }
.exo-table tr.is-legal td { color: var(--exo-note); }
.exo-table tr.is-private td { background: #fff7e0; }
.exo-pill { display: inline-block; font: 700 .72rem/1 var(--exo-text); padding: 5px 8px; border-radius: 999px; background: var(--exo-wash); color: var(--exo-teal-ink); white-space: nowrap; }
.exo-table .exo-pill { white-space: normal; line-height: 1.3; }
.exo-overview .exo-pill { justify-self: start; }
.exo-pill--later { background: var(--exo-mist); color: var(--exo-note); }
.exo-pill--warn { background: #fff1c7; color: #6b4a00; }

@media (max-width: 1100px) {
  .exo-choices { grid-template-columns: minmax(0, 1fr); }
  .exo-checkgrid--three { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 900px) {
  .exo-phero__grid, .exo-phero--flip .exo-phero__grid { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .exo-phero__media, .exo-phero--flip .exo-phero__media { order: 0; margin: 0 calc(-1 * var(--exo-gutter)); height: auto; aspect-ratio: 16 / 10; border-radius: 0; }
  .exo-phero__media .exo-symbol, .exo-phero--flip .exo-phero__media .exo-symbol { right: 12px; left: auto; }
  .exo-phero__media--draw { aspect-ratio: auto; padding: 20px var(--exo-gutter); }
  .exo-split, .exo-faq, .exo-assess { grid-template-columns: minmax(0, 1fr); }
  .exo-faq__head { position: static; }
  .exo-checkgrid { grid-template-columns: minmax(0, 1fr); }
  .exo-questions li { grid-template-columns: 48px minmax(0, 1fr); }
  .exo-questions li p { grid-column: 2; }
  .exo-choices--two, .exo-paths { grid-template-columns: minmax(0, 1fr); }
  .exo-closing { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 600px) {
  .exo-crumbs li:nth-child(2) { display: none; }
  .exo-answer { grid-template-columns: minmax(0, 1fr); }
  .exo-pair { grid-template-columns: minmax(0, 1fr); }
  .exo-pair > div + div { border-left: 0; border-top: 1px solid var(--exo-line); }
  .exo-faq__answer { padding-right: 4px; }
  .exo-phero__actions .exo-btn { width: 100%; justify-content: center; }
}
@media (prefers-reduced-motion: reduce) { .exo-faq__item summary::after { transition: none; } }
@media print { .exo-header, .exo-draftbar, .exo-draftpill, #kontakt { display: none; } .exo-faq__item:not([open]) .exo-faq__answer { display: block; } }

/* ===== Etappe 2 (Serviceausbau, 17.10.2026) ===== */
/* Navigation: Bereich der aktuellen Unterseite */
.exo-nav a.is-section { color: var(--exo-teal-ink); }
/* Fußzeile mit zusätzlicher Spalte „Service“ */
@media (min-width: 901px) { .exo-footer__grid { grid-template-columns: minmax(0, 3fr) repeat(4, minmax(0, 2fr)); } }

/* Seitenkopf ohne Foto (Übersicht, Gutachten) */
.exo-phero--plain .exo-phero__grid { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); align-items: end; }
.exo-heropanel { background: var(--exo-mist); border-radius: 22px; padding: clamp(22px, 3vw, 36px); display: grid; gap: 14px; align-content: start; }
.exo-heropanel h2 { font-size: clamp(1.25rem, 1.8vw, 1.5rem); font-family: var(--exo-display); font-weight: 700; }
.exo-heropanel ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 0; border-top: 1px solid var(--exo-line); }
.exo-heropanel li { padding: 12px 0; border-bottom: 1px solid var(--exo-line); color: var(--exo-ink); }
.exo-jump { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.exo-jump a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 18px; border-radius: 999px; background: var(--exo-mist); color: var(--exo-ink); text-decoration: none; font-weight: 700; font-size: .95rem; }
.exo-jump a:hover { background: var(--exo-wash); color: var(--exo-teal-ink); }

/* Übersicht: vier Ausgangslagen */
.exo-needs { display: grid; gap: clamp(40px, 6vw, 88px); }
.exo-need { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(24px, 4vw, 64px); align-items: start; scroll-margin-top: calc(var(--exo-header) + 16px); }
.exo-need:nth-child(even) .exo-need__media { order: 2; }
.exo-need__media { margin: 0; border-radius: 18px; overflow: hidden; aspect-ratio: 3 / 2; background: var(--exo-mist); position: relative; }
.exo-need__media img { width: 100%; height: 100%; object-fit: cover; }
.exo-need__text { display: grid; gap: 14px; min-width: 0; }
.exo-need__text h3 { font-weight: 400; font-size: clamp(1.6rem, 2.6vw, 2.2rem); letter-spacing: -.015em; }
.exo-svclist { list-style: none; margin: 6px 0 0; padding: 0; border-top: 1px solid var(--exo-line); }
.exo-svclist li { border-bottom: 1px solid var(--exo-line); }
.exo-svclist a, .exo-svclist .exo-later { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 16px; padding: 14px 4px; text-decoration: none; color: var(--exo-ink); }
.exo-svclist a strong { font-family: var(--exo-display); font-size: 1.1rem; }
.exo-svclist a span { grid-column: 1; color: var(--exo-grey); font-size: .95rem; }
.exo-svclist a::after { content: "→"; grid-column: 2; grid-row: 1 / span 2; align-self: center; color: var(--exo-teal-ink); }
.exo-svclist a:hover strong { color: var(--exo-teal-ink); }
.exo-svclist .exo-later { color: var(--exo-grey); }

/* Übersicht: Lebenslauf einer Anlage */
.exo-cycle { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 0; counter-reset: cyc; position: relative; }
.exo-cycle::before { content: ""; position: absolute; left: 0; right: 0; top: 21px; border-top: 2px dashed rgba(13, 148, 136, .45); }
.exo-cycle li { counter-increment: cyc; position: relative; display: grid; gap: 8px; padding-right: 14px; align-content: start; min-width: 0; }
.exo-cycle li::before { content: counter(cyc); width: 44px; height: 44px; border-radius: 50%; background: var(--exo-white); border: 2px solid var(--exo-teal); display: grid; place-items: center; font: 700 1rem/1 var(--exo-display); color: var(--exo-teal-ink); position: relative; }
.exo-cycle a { font-family: var(--exo-display); font-weight: 700; color: var(--exo-ink); text-decoration-color: rgba(10, 108, 100, .4); }
.exo-cycle span { font-size: .9rem; line-height: 1.5; }
.exo-aside-svcs { margin-top: clamp(28px, 4vw, 44px); display: flex; flex-wrap: wrap; gap: 10px 24px; align-items: baseline; }
@media (max-width: 1100px) {
  .exo-cycle { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .exo-cycle::before { left: 21px; right: auto; top: 0; bottom: 0; border-top: 0; border-left: 2px dashed rgba(13, 148, 136, .45); }
  .exo-cycle li { grid-template-columns: 44px minmax(0, 1fr); column-gap: 16px; padding: 0 0 22px; }
  .exo-cycle li::before { grid-row: span 2; }
}

/* Gegenüberstellung (Beratung/Planung, Einzelauftrag/Vertrag) */
.exo-compare { display: grid; grid-template-columns: repeat(var(--cols, 2), minmax(0, 1fr)); border: 1px solid var(--exo-line); border-radius: 18px; overflow: hidden; background: var(--exo-white); }
.exo-compare > div { padding: clamp(20px, 2.6vw, 32px); display: grid; gap: 10px; align-content: start; min-width: 0; }
.exo-compare > div + div { border-left: 1px solid var(--exo-line); }
.exo-compare h3 { font-size: 1.25rem; }
.exo-compare dl { margin: 0; display: grid; gap: 10px; }
.exo-compare dt { font: 700 .78rem/1.3 var(--exo-text); letter-spacing: .06em; text-transform: uppercase; color: var(--exo-teal-ink); }
.exo-compare dd { margin: 0; }
.exo-compare .is-here { background: var(--exo-wash); }
.exo-compare__tag { justify-self: start; font: 700 .72rem/1 var(--exo-text); padding: 5px 9px; border-radius: 999px; background: var(--exo-teal-ink); color: #fff; }

/* Bausteintabelle (Wartungsvertrag) */
.exo-scope { width: 100%; border-collapse: collapse; font-size: .98rem; }
.exo-scope th, .exo-scope td { text-align: left; vertical-align: top; padding: 16px 14px; border-bottom: 1px solid var(--exo-line); }
.exo-scope thead th { font: 700 .78rem/1.3 var(--exo-text); letter-spacing: .06em; text-transform: uppercase; color: var(--exo-teal-ink); border-bottom: 2px solid var(--exo-ink); }
.exo-scope tbody th { font-family: var(--exo-display); color: var(--exo-ink); width: 26%; }
.exo-scope td:last-child { color: var(--exo-note); font-size: .92rem; width: 30%; }

/* Ablauf Meldung → Einordnung → Bearbeitung (Monitoring) */
.exo-flow { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(28px, 3vw, 44px); }
.exo-flow li { position: relative; background: var(--exo-white); border-radius: 18px; padding: clamp(20px, 2.4vw, 28px); display: grid; gap: 10px; align-content: start; min-width: 0; }
.exo-flow li + li::before { content: ""; position: absolute; left: calc(-1 * clamp(28px, 3vw, 44px) + 6px); top: 50%; width: calc(clamp(28px, 3vw, 44px) - 12px); border-top: 2px solid var(--exo-teal); }
.exo-flow li + li::after { content: ""; position: absolute; left: -12px; top: calc(50% - 5px); border: 5px solid transparent; border-left-color: var(--exo-teal); }
.exo-flow__who { font-size: .92rem; color: var(--exo-teal-ink); }
.exo-flow h3 { font-size: 1.3rem; }

/* Statusbeispiel (Planung) */
.exo-status-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; border-top: 1px solid var(--exo-line); }
.exo-status-list li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; padding: 14px 4px; border-bottom: 1px solid var(--exo-line); align-items: center; color: var(--exo-ink); }
.exo-state { font: 700 .74rem/1 var(--exo-text); padding: 6px 10px; border-radius: 999px; white-space: nowrap; }
.exo-state--ok { background: var(--exo-wash); color: var(--exo-teal-ink); }
.exo-state--open { background: #fff1c7; color: #6b4a00; }
.exo-state--ext { background: var(--exo-mist); color: var(--exo-grey); border: 1px solid var(--exo-line); }
.exo-caption { font-size: .86rem; color: var(--exo-note); }

/* Sicherheitshinweis (Reparatur) */
.exo-alert { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 14px; align-items: start; background: #fff7e0; border: 1px solid #e6c766; border-radius: 16px; padding: 18px 20px; color: #3d2b00; }
.exo-alert svg { width: 24px; height: 24px; }

@media (max-width: 900px) {
  .exo-phero--plain .exo-phero__grid { grid-template-columns: minmax(0, 1fr); align-items: start; }
  .exo-need, .exo-need:nth-child(even) { grid-template-columns: minmax(0, 1fr); }
  .exo-need:nth-child(even) .exo-need__media { order: 0; }
  .exo-compare { grid-template-columns: minmax(0, 1fr); }
  .exo-compare > div + div { border-left: 0; border-top: 1px solid var(--exo-line); }
  .exo-flow { grid-template-columns: minmax(0, 1fr); }
  .exo-flow li + li::before { left: 50%; top: calc(-1 * clamp(28px, 3vw, 44px) + 6px); width: 0; height: calc(clamp(28px, 3vw, 44px) - 12px); border-top: 0; border-left: 2px solid var(--exo-teal); }
  .exo-flow li + li::after { left: calc(50% - 4px); top: -12px; border: 5px solid transparent; border-top-color: var(--exo-teal); border-left-color: transparent; }
}
@media (max-width: 700px) {
  .exo-scope thead { display: none; }
  .exo-scope, .exo-scope tbody, .exo-scope tr, .exo-scope th, .exo-scope td { display: block; width: auto !important; }
  .exo-scope tr { padding: 14px 0; border-bottom: 1px solid var(--exo-line); }
  .exo-scope th, .exo-scope td { border: 0; padding: 4px 0; }
}

.exo-feature__media { position: relative; }

/* ===== Etappe 2 Korrektur: kompakter Referenzplatz (Entwurf) ===== */
.exo-refband { padding-block: clamp(40px, 5vw, 72px); }
.exo-refslot { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: clamp(20px, 3vw, 44px); align-items: stretch; padding: clamp(14px, 1.6vw, 20px); border: 1.5px dashed #b8c7c5; border-radius: 22px; background: var(--exo-white); }
.exo-refslot__media { margin: 0; position: relative; border-radius: 14px; overflow: hidden; min-height: 220px; background: var(--exo-mist); }
.exo-refslot__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.exo-refslot__text { display: grid; gap: 12px; align-content: center; padding: clamp(6px, 1.4vw, 18px) clamp(4px, 1vw, 14px); min-width: 0; }
.exo-refslot__top { display: flex; flex-wrap: wrap; gap: 8px 14px; align-items: center; }
.exo-refslot__badge { font: 700 .72rem/1.2 var(--exo-text); letter-spacing: .02em; color: var(--exo-note); background: var(--exo-mist); border: 1px solid var(--exo-line); border-radius: 999px; padding: 5px 10px; }
.exo-refslot h2 { font-size: clamp(1.4rem, 2.2vw, 1.9rem); }
.exo-refslot__facts { margin: 4px 0 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; border-top: 1px solid var(--exo-line); }
.exo-refslot__facts > div { padding: 12px 12px 4px 0; display: grid; gap: 2px; align-content: start; min-width: 0; }
.exo-refslot__facts dt { font: 700 .74rem/1.3 var(--exo-text); letter-spacing: .05em; text-transform: uppercase; color: var(--exo-teal-ink); }
.exo-refslot__facts dd { margin: 0; color: var(--exo-note); font-style: italic; }
.exo-section--mist + .exo-refband, .exo-band + .exo-refband { padding-top: clamp(40px, 5vw, 72px); }
@media (max-width: 800px) {
  .exo-refslot { grid-template-columns: minmax(0, 1fr); }
  .exo-refslot__media { min-height: 0; aspect-ratio: 16 / 9; }
  .exo-refslot__media img { position: static; }
  .exo-refslot__facts { grid-template-columns: minmax(0, 1fr); }
  .exo-refslot__facts > div { padding: 10px 0 2px; border-bottom: 1px solid var(--exo-line); }
}
.exo-refband + .exo-section { padding-top: clamp(40px, 5vw, 72px); }

/* ===== Etappe 3: Projektvertiefungen (Entwurf) ===== */
.exo-srcline { margin: 14px 0 0; font-size: .88rem; line-height: 1.5; color: var(--exo-note); }
.exo-srcline a { color: var(--exo-teal-ink); text-decoration: underline; text-underline-offset: 3px; overflow-wrap: anywhere; }
.exo-contrast { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; border: 1px solid var(--exo-line); border-radius: 18px; overflow: hidden; background: var(--exo-white); }
.exo-contrast li { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); align-items: stretch; }
.exo-contrast li + li { border-top: 1px solid var(--exo-line); }
.exo-contrast__claim { padding: clamp(18px, 2.2vw, 28px); font: 400 clamp(1.1rem, 1.7vw, 1.35rem)/1.3 var(--exo-display); color: var(--exo-ink); background: var(--exo-mist); }
.exo-contrast__check { padding: clamp(18px, 2.2vw, 28px); padding-left: calc(clamp(18px, 2.2vw, 28px) + 26px); position: relative; color: var(--exo-grey); align-self: center; }
.exo-contrast__check::before { content: ""; position: absolute; left: clamp(18px, 2.2vw, 28px); top: 50%; width: 14px; height: 2px; background: var(--exo-teal); }
.exo-diagram { margin: 0; padding: clamp(18px, 2.6vw, 32px); border: 1px solid var(--exo-line); border-radius: 18px; background: var(--exo-white); display: grid; gap: 16px; }
.exo-diagram__scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; border-radius: 8px; }
.exo-diagram__scroll:focus-visible { outline: 3px solid var(--exo-teal); outline-offset: 3px; }
.exo-diagram svg { display: block; width: 100%; height: auto; min-width: 600px; font-family: var(--exo-text); }
.exo-diagram figcaption { display: flex; flex-wrap: wrap; gap: 8px 20px; align-items: center; }
.exo-diagram figcaption .exo-caption { flex: 1 1 260px; margin: 0; }
.exo-legend { display: inline-flex; align-items: center; gap: 8px; font-size: .9rem; font-weight: 600; color: var(--exo-ink); }
.exo-legend::before { content: ""; width: 22px; height: 12px; border-radius: 3px; }
.exo-legend--tour::before { background: #c9d0cf; }
.exo-legend--load::before { background: var(--exo-teal); }
.dep-axis path { stroke: var(--exo-ink); stroke-width: 1.5; fill: none; }
.dep-axis text, .dep-row text { font-size: 14px; fill: var(--exo-grey); }
.dep-row text { font-weight: 600; fill: var(--exo-ink); }
.dep-tour { fill: #c9d0cf; }
.dep-load { fill: var(--exo-teal); }
.dep-overlap { stroke: var(--exo-teal-ink); stroke-width: 1.5; stroke-dasharray: 5 5; fill: none; }
.dep-note { font-size: 13px; font-weight: 600; fill: var(--exo-teal-ink); }
.sn-box rect { fill: var(--exo-white); stroke: var(--exo-ink); stroke-width: 1.5; }
.sn-box text { font-size: 15px; font-weight: 600; fill: var(--exo-ink); }
.sn-box .sn-sub { font-size: 13px; font-weight: 400; fill: var(--exo-grey); }
.sn-new rect { fill: var(--exo-wash); stroke: var(--exo-teal); stroke-width: 2; }
.sn-new text { fill: var(--exo-teal-ink); }
.sn-line { stroke: var(--exo-ink); stroke-width: 1.5; fill: none; }
.sn-dash { stroke: var(--exo-teal); stroke-width: 2; stroke-dasharray: 6 5; }
.sn-pin circle { fill: var(--exo-teal-ink); }
.sn-pin text { font-size: 13px; font-weight: 700; fill: #fff; }
.sn-head { font: 400 18px var(--exo-display); fill: var(--exo-ink); }
@media (max-width: 800px) {
  .exo-contrast li { grid-template-columns: minmax(0, 1fr); }
}
.exo-diagram svg { max-width: 960px; margin-inline: auto; }
.exo-contrast__claim { display: flex; align-items: center; }
.sn-box text { font-size: 14px; }
.exo-diagram__hint { display: none; margin: 0; font-size: .82rem; font-weight: 600; color: var(--exo-teal-ink); }
@media (max-width: 700px) { .exo-diagram__hint { display: block; } }

/* ===== Etappe 4: Unternehmen, Kontakt, Rechtliches (Entwurf) ===== */
.exo-section--first { padding-top: clamp(24px, 3vw, 40px); }
.exo-entry { margin: 0; padding: 10px 14px; border-radius: 12px; background: var(--exo-wash); color: var(--exo-teal-ink); font-size: .95rem; }
.exo-step__nav--final .exo-status.is-shown { padding: 12px 14px; border-radius: 12px; background: var(--exo-white); border: 1px solid var(--exo-line); color: var(--exo-ink); }
.exo-heropanel ol { margin: 0; padding: 0; list-style: none; counter-reset: hp; display: grid; }
.exo-heropanel ol li { counter-increment: hp; position: relative; padding: 14px 0 14px 44px; border-bottom: 1px solid var(--exo-line); }
.exo-heropanel ol li::before { content: counter(hp); position: absolute; left: 0; top: 13px; width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; background: var(--exo-teal-ink); color: #fff; font: 700 .9rem/1 var(--exo-text); }
.exo-heropanel li strong { display: block; font-family: var(--exo-display); color: var(--exo-ink); margin-bottom: 2px; }
.exo-ref__links { margin-top: auto; padding-top: 8px; display: flex; flex-wrap: wrap; gap: 6px 20px; }
.exo-ref__links .exo-ref__link { margin: 0; padding: 0; }
.exo-refslot--plain { grid-template-columns: minmax(0, 1fr); }
.exo-checklist { margin: 0 0 18px; padding: 0; list-style: none; display: grid; gap: 10px; }
.exo-checklist li { position: relative; padding-left: 30px; }
.exo-checklist li::before { content: ""; position: absolute; left: 2px; top: .45em; width: 14px; height: 8px; border-left: 2.5px solid var(--exo-teal); border-bottom: 2.5px solid var(--exo-teal); transform: rotate(-45deg); }
/* Projektanfrage: kurzer Einstieg */
.exo-router__form { display: grid; gap: 18px; }
.exo-router__form fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
.exo-router__form legend { padding: 0; margin-bottom: 10px; font-weight: 700; color: var(--exo-ink); }
.exo-router__form select { width: 100%; font: 400 1rem/1.4 var(--exo-text); color: var(--exo-ink); background: var(--exo-white); border: 1.5px solid var(--exo-line); border-radius: 12px; padding: 12px 14px; }
.exo-router__form select:focus { outline: 3px solid rgba(13, 148, 136, .25); border-color: var(--exo-teal); }
.exo-router__form .exo-btn { justify-self: start; }
.exo-router__form .exo-small { margin: 0; }
/* Rechtstexte: Wortlaut unverändert, nur Gestaltung */
.exo-legalpage { padding: clamp(28px, 4vw, 56px) 0 clamp(56px, 7vw, 104px); }
.exo-legalpage__grid { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: clamp(32px, 5vw, 80px); align-items: start; margin-top: 18px; }
.exo-legal { min-width: 0; max-width: 780px; color: var(--exo-grey); overflow-wrap: anywhere; }
.exo-legal > .exo-content > section > div > div:first-child { display: flex; gap: 8px; align-items: center; font: 700 .8rem/1 var(--exo-text); letter-spacing: .08em; text-transform: uppercase; color: var(--exo-teal-ink); margin-bottom: 14px; }
.exo-legal > .exo-content > section > div > div:first-child span:empty { display: none; }
.exo-legal h1 { font: 400 clamp(2.3rem, 4.6vw, 3.6rem)/1.05 var(--exo-display); color: var(--exo-ink); letter-spacing: -.02em; margin: 0 0 14px; }
.exo-legal h1 + p { color: var(--exo-note); font-size: .95rem; }
.exo-legal h2 { font: 700 clamp(1.15rem, 1.6vw, 1.35rem)/1.3 var(--exo-display); color: var(--exo-ink); margin: 0 0 10px; }
.exo-legal h3 { font: 700 1.02rem/1.35 var(--exo-text); color: var(--exo-ink); margin: 18px 0 8px; }
.exo-legal p, .exo-legal li { font-size: 1rem; line-height: 1.7; }
.exo-legal p { margin: 0 0 12px; }
.exo-legal ul, .exo-legal ol { margin: 0 0 14px; padding-left: 1.3em; }
.exo-legal a { color: var(--exo-teal-ink); text-underline-offset: .2em; }
.exo-legal > .exo-content > section > div > div:not(:first-child) > div { padding: clamp(18px, 2.4vw, 28px) 0; border-top: 1px solid var(--exo-line); scroll-margin-top: calc(var(--exo-header) + 16px); }
.exo-legal [id^="sec-"] { scroll-margin-top: calc(var(--exo-header) + 16px); }
.exo-legal > .exo-content > section > div > div:nth-child(4):has(> ol) { background: var(--exo-mist); border-radius: 16px; padding: 20px 24px; margin: 8px 0 20px; }
.exo-legalpage__aside { position: sticky; top: calc(var(--exo-header) + 24px); display: grid; gap: 10px; padding: 22px; border-radius: 18px; background: var(--exo-mist); }
.exo-legalpage__h { font: 700 .78rem/1.3 var(--exo-text); letter-spacing: .08em; text-transform: uppercase; color: var(--exo-teal-ink); margin: 6px 0 0; }
.exo-legalpage__aside ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.exo-legalpage__aside a { color: var(--exo-ink); }
.exo-legalpage__aside a[aria-current="page"] { color: var(--exo-teal-ink); font-weight: 700; }
.exo-legalpage__aside p { margin: 0; }
/* Sammelnachweis im Impressum */
.exo-credits-page__cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(24px, 4vw, 56px); }
.exo-credits-page h3 { font-size: 1.15rem; margin-bottom: 10px; }
.exo-credits-page h3 small { font: 400 .85rem var(--exo-text); color: var(--exo-note); }
.exo-credits-page .exo-credits__list { display: grid; gap: 10px; padding-left: 1.1em; margin: 0; font-size: .92rem; line-height: 1.55; overflow-wrap: anywhere; }
@media (max-width: 900px) {
  .exo-legalpage__grid, .exo-credits-page__cols { grid-template-columns: minmax(0, 1fr); }
  .exo-legalpage__aside { position: static; }
}
.exo-phero__grid:has(.exo-router) { align-items: start; }
.exo-router .exo-chip { max-width: 100%; }
.exo-router .exo-chip span { white-space: normal; max-width: 100%; }
.exo-legal h1 { overflow-wrap: normal; hyphens: auto; -webkit-hyphens: auto; }
@media (max-width: 600px) { .exo-legal h1 { font-size: clamp(1.9rem, 8.4vw, 2.3rem); } }

/* ===== Etappe 4 Nacharbeit: Referenzseite mit längerem Lesefluss ===== */
.exo-toc { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; padding-bottom: clamp(32px, 4vw, 56px); }
.exo-toc__label { font: 700 .78rem/1.3 var(--exo-text); letter-spacing: .08em; text-transform: uppercase; color: var(--exo-teal-ink); }
.exo-toc ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.exo-toc a { display: inline-flex; align-items: center; min-height: 40px; padding: 0 14px; border-radius: 999px; border: 1.5px solid var(--exo-line); background: var(--exo-white); color: var(--exo-ink); text-decoration: none; font-size: .92rem; font-weight: 600; }
.exo-toc a:hover, .exo-toc a:focus-visible { border-color: var(--exo-teal); color: var(--exo-teal-ink); }
.exo-feature__text.exo-prose p { max-width: 62ch; }
.exo-split > .exo-prose p, .exo-wrap--text p { max-width: 68ch; }
.exo-wrap--text { max-width: 820px; margin-bottom: clamp(32px, 4vw, 52px); }
.exo-wrap--text h2 { margin-bottom: 18px; }
.exo-tasklist { list-style: none; margin: 22px 0 0; padding: 0; display: grid; gap: 10px; max-width: 320px; }
.exo-tasklist li { position: relative; padding: 14px 16px 14px 46px; border-radius: 14px; background: var(--exo-white); border: 1px solid var(--exo-line); font: 600 1rem/1.3 var(--exo-display); color: var(--exo-ink); }
.exo-tasklist li::before { content: ""; position: absolute; left: 16px; top: 50%; width: 16px; height: 16px; margin-top: -8px; border-radius: 4px; border: 2px solid var(--exo-teal); }
.exo-duo { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(20px, 3vw, 40px); }
.exo-duo__item { background: var(--exo-white); border: 1px solid var(--exo-line); border-radius: 18px; padding: clamp(20px, 2.6vw, 32px); display: grid; gap: 12px; align-content: start; }
.exo-duo__item p { margin: 0; }
.exo-duo__item .exo-relatedwrap { margin-top: 8px; }
@media (max-width: 800px) { .exo-duo { grid-template-columns: minmax(0, 1fr); } .exo-tasklist { max-width: none; grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 420px) { .exo-tasklist { grid-template-columns: minmax(0, 1fr); } }
.exo-tasklist { counter-reset: task; }
.exo-tasklist li { counter-increment: task; }
.exo-tasklist li::before { content: counter(task); width: 24px; height: 24px; margin-top: -12px; left: 12px; border: 0; border-radius: 50%; background: var(--exo-wash); color: var(--exo-teal-ink); font: 700 .8rem/24px var(--exo-text); text-align: center; }
.exo-tasklist li { padding-left: 48px; }

/* ===== Zentrale Textüberarbeitung Paket 1 (17.10.2026): lange Leistungsseiten ===== */
.exo-cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 clamp(28px, 4.5vw, 72px); }
.exo-cols p { max-width: 62ch; }
.exo-cols > div > p:first-child { margin-top: 0; }
.exo-cols .exo-relatedwrap { margin-top: 22px; }
.exo-cols__lead { margin-bottom: clamp(18px, 2.4vw, 32px); }
.exo-cols__lead p { font-size: 1.1rem; line-height: 1.6; color: var(--exo-ink); }
.exo-duo--three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.exo-section--mist .exo-duo--three .exo-duo__item { border-color: transparent; }
@media (max-width: 1040px) { .exo-duo--three { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 800px) { .exo-cols { grid-template-columns: minmax(0, 1fr); } .exo-cols > div + div > p:first-child { margin-top: 1em; } }
.exo-cols.exo-prose { max-width: none; }

/* ===== Textausbau Unternehmen/Kontakt/Anfrage (17.10.2026): Silbentrennung nur für ausdrücklich markierte Überschriften mit sehr langen Wörtern ===== */
.exo-hyphen { -webkit-hyphens: auto; hyphens: auto; overflow-wrap: break-word; }

/* ===== Paket 2 Abschlusskorrektur (18.10.2026): Prüfthemen Freifläche in voller Inhaltsbreite unter der Einleitung (nur .exo-pruefthemen) ===== */
.exo-pruefthemen { margin-top: clamp(28px, 4vw, 48px); }
.exo-pruefthemen li { align-content: start; }