/* Feinschliff: vorhandene Inhalte, ein Kapitel zur Zeit; ohne JS alles offen. */
.verkauf-versprechen { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(28px,5vw,88px); padding-block:12px var(--abstand); }
.verkauf-versprechen > div { border-top:1px solid var(--sand); padding-top:26px; min-width:0; }
.verkauf-versprechen h2 { font-size:clamp(22px,2vw,30px); line-height:1.25; max-width:23ch; margin-block:14px; }
.verkauf-versprechen p:not(.augenbraue) { color:var(--sekundaer); max-width:34ch; }
.verkauf-ablauf { padding-block:var(--abstand); background:var(--nebel,#f4f5f2); }
.ablauf-kopf { display:grid; grid-template-columns:1fr 1fr; gap:14px 7vw; margin-bottom:clamp(36px,5vw,64px); }
.ablauf-kopf .augenbraue { grid-column:1/-1; }
.ablauf-kopf h2 { font-size:clamp(38px,4vw,64px); line-height:1.08; }
.ablauf-kopf > p:last-child { align-self:end; color:var(--sekundaer); max-width:32ch; }
.verkauf-kapitel [hidden] { display:none!important; }
.verkauf-phase { border-top:1px solid var(--sand); }
.verkauf-phase:last-child { border-bottom:1px solid var(--sand); }
.verkauf-phase summary { display:flex; gap:16px; align-items:center; list-style:none; cursor:pointer; padding:22px 0; font-size:19px; font-weight:500; min-height:64px; }
.verkauf-phase summary::-webkit-details-marker { display:none; }
.verkauf-phase summary::after { content:'+'; margin-left:auto; font-weight:400; font-size:24px; }
.verkauf-phase[open] summary::after { content:'−'; }
.phase-nr { flex:0 0 32px; color:var(--sekundaer); font-size:14px; }
.phase-inhalt { padding:12px 0 34px 48px; max-width:68ch; }
.phase-inhalt h3 { font-size:clamp(26px,2.7vw,44px); line-height:1.15; margin-bottom:24px; color:var(--gruen); font-weight:500; }
.phase-inhalt p { line-height:1.75; font-size:clamp(18px,1.35vw,21px); color:var(--anthrazit); }
.phase-zaehler { display:none; }
.kapitel-navigation { min-width:0; }
.kapitel-tab { display:flex; align-items:center; gap:20px; width:100%; padding:24px 22px; border:0; border-top:1px solid var(--sand); background:transparent; text-align:left; font:inherit; font-size:clamp(17px,1.25vw,21px); color:var(--anthrazit); cursor:pointer; transition:background .18s,color .18s; }
.kapitel-tab:last-child { border-bottom:1px solid var(--sand); }
.kapitel-tab[aria-selected="true"] { background:var(--gruen); color:var(--weiss,#fff); }
.kapitel-tab[aria-selected="true"] .phase-nr { color:inherit; }
.kapitel-tab:hover:not([aria-selected="true"]) { background:#e8ece7; }
.kapitel-tab:focus-visible,.verkauf-phase summary:focus-visible,.leistungsdetails summary:focus-visible { outline:2px solid var(--gruen); outline-offset:4px; }
.verkauf-bewertung { display:grid; grid-template-columns:minmax(220px,360px) minmax(0,1fr); align-items:center; gap:clamp(48px,9vw,150px); padding-block:var(--abstand); }
.bewertung-person { width:100%; max-width:360px; }
.bewertung-person img { width:100%; aspect-ratio:4/5; object-fit:cover; }
.bewertung-person figcaption { display:grid; gap:4px; margin-top:18px; }
.bewertung-person strong { font-size:20px; font-weight:500; }
.bewertung-person span { color:var(--sekundaer); font-size:15px; }
.bewertung-inhalt { max-width:800px; min-width:0; }
.bewertung-inhalt h2 { font-size:clamp(36px,4vw,64px); line-height:1.1; margin-block:18px 28px; max-width:17ch; }
.bewertung-inhalt > p:not(.augenbraue) { max-width:52ch; }
.bewertung-aktionen { display:flex; gap:22px 30px; align-items:center; flex-wrap:wrap; margin-top:30px; }
.bewertung-email { margin-top:20px; font-size:15px; }
.bewertung-email a { color:var(--gruen); text-underline-offset:4px; }
.verkauf-modelle { padding-top:0; }
.verkauf-modelle .modellzeilen { max-width:none; gap:clamp(28px,5vw,72px); }
.verkauf-modelle h2 { font-size:clamp(30px,3vw,46px); }
.verkauf-modelle .modellzeilen > div { border-top:1px solid var(--sand); }
.verkauf-modelle .m-name { font-size:clamp(26px,2.5vw,38px); font-weight:500; }
.verkauf-leistungen { padding-bottom:var(--abstand); }
.leistungsdetails { border-block:1px solid var(--sand); }
.leistungsdetails summary { display:flex; justify-content:space-between; align-items:center; gap:20px; padding-block:28px; list-style:none; cursor:pointer; font-size:clamp(25px,2.7vw,40px); line-height:1.2; color:var(--gruen); }
.leistungsdetails summary::-webkit-details-marker { display:none; }
.leistungs-toggle { font-size:32px; }
.leistungsdetails[open] .leistungs-toggle { transform:rotate(45deg); }
.leistungsdetails .hakenliste { max-width:none; padding-bottom:28px; }
@media(min-width:980px) {
  .verkauf-kapitel[data-bereit="desktop"] { display:grid; grid-template-columns:minmax(300px,.86fr) minmax(0,1.14fr); gap:clamp(36px,6vw,100px); align-items:start; }
  [data-bereit="desktop"] .verkauf-phase { border:0; }
  [data-bereit="desktop"] .verkauf-phase > summary { display:none; }
  [data-bereit="desktop"] .phase-inhalt { padding:clamp(28px,3vw,52px) 0; }
  [data-bereit="desktop"] .phase-zaehler { display:block; color:var(--sekundaer); font-size:15px; letter-spacing:.08em; margin-bottom:40px; }
  [data-bereit="desktop"] .kapitel-panels { min-height:490px; }
}
@media(max-width:979px) {
  .verkauf-versprechen { gap:30px; }
  .verkauf-versprechen h2 { font-size:24px; }
  .verkauf-versprechen > div:last-child { grid-column:1/-1; }
  .verkauf-versprechen { grid-template-columns:1fr 1fr; }
  .ablauf-kopf { grid-template-columns:1fr; }
  .verkauf-bewertung { grid-template-columns:280px minmax(0,1fr); gap:34px; }
  .phase-inhalt h3 { display:none; }
}
@media(max-width:659px) {
  .verkauf-versprechen { grid-template-columns:1fr; }
  .verkauf-versprechen > div:last-child { grid-column:auto; }
  .verkauf-versprechen h2 { max-width:25ch; }
  .verkauf-bewertung { grid-template-columns:1fr; gap:32px; }
  .bewertung-person { max-width:200px; }
  .verkauf-phase summary { font-size:18px; gap:12px; }
  .phase-nr { flex-basis:24px; }
  .phase-inhalt { padding-left:0; }
  .bewertung-aktionen { align-items:stretch; flex-direction:column; }
  .bewertung-aktionen .knopf { white-space:normal; text-align:center; }
}
@media(prefers-reduced-motion:reduce) { .kapitel-tab { transition:none; } }

/* ---- Verkaufsmodelle Flex / Exklusiv (18.09.2026) --------------------------
   Gegenüberstellung nach ../../BRIEFING Gegenüberstellung Verkaufsmodelle.md.
   Desktop: echte Tabelle. Unter 660 px: zwei gestapelte Modellkarten, gebaut aus
   derselben Tabelle per Grid — Zeilen/Zellen werden mit display:contents zu
   Grid-Elementen, die Zeilenköpfe bleiben für Screenreader vorhanden, sichtbar
   übernimmt .mv-label. Kein Querscrollen. */
.verkauf-modelle .modelle-kopf h2 { margin-bottom:0; }
.modelle-leit { max-width:620px; margin-top:18px; font-size:var(--t-lead); line-height:1.55; }
.modelle-immer { margin-top:44px; }
.modelle-vergleich { margin-top:52px; }
.verkauf-modelle h3 { color:var(--gruen); font-size:var(--t-mittel); line-height:var(--lh-mittel); font-weight:400; margin-bottom:18px; }
.immer-liste { max-width:820px; }
.immer-liste li { padding-block:13px; }
@media(min-width:980px) {
  /* Die vier Grundsätze bleiben einspaltig; die zweispaltige Hakenliste in
     stil-a.css (4 links, 3 rechts) ist für die sieben Leistungen gedacht. */
  .verkauf-modelle .immer-liste { display:block; }
}

.modellvergleich { width:100%; max-width:900px; border-collapse:collapse; border-spacing:0; }
.modellvergleich th, .modellvergleich td { padding:18px 20px 18px 0; vertical-align:top; text-align:left; font-weight:400; border-top:1px solid var(--sand); }
.modellvergleich tbody tr:last-child th, .modellvergleich tbody tr:last-child td { border-bottom:1px solid var(--sand); }
.modellvergleich thead th, .modellvergleich thead td { border-top:0; padding-top:0; padding-bottom:14px; }
.modellvergleich thead th { font-size:var(--t-klein); line-height:var(--lh-klein); color:var(--gruen); }
.modellvergleich tbody th { width:38%; color:var(--anthrazit); }
.modellvergleich .mv-flex, .modellvergleich .mv-exklusiv { width:31%; }
.modellvergleich .mv-exklusiv { padding-left:16px; background:rgba(30,58,43,.045); }
.modellvergleich thead .mv-exklusiv { border-top:2px solid var(--gruen); padding-top:12px; font-weight:500; }
.modellvergleich .mv-label { display:none; }
.mv-brutto { font-size:var(--t-klein); font-weight:500; color:var(--anthrazit); }
/* MwSt-Zusatz immer als eigene Zeile: Brutto / inkl. MwSt / netto in jeder Zelle
   gleich aufgebaut, unabhängig von Zellbreite und Ziffernlänge (13'512.50). */
.mv-mwst { display:block; margin-top:2px; font-size:var(--t-fein); color:var(--anthrazit); white-space:nowrap; }
.mv-netto { display:block; margin-top:4px; font-size:var(--t-fein); color:var(--sekundaer); }
.mv-grundlage { max-width:620px; margin-top:16px; font-size:var(--t-fein); color:var(--sekundaer); }

@media(max-width:659px) {
  .modellvergleich { display:grid; grid-template-columns:minmax(0,1fr); }
  .modellvergleich thead, .modellvergleich tbody, .modellvergleich tr { display:contents; }
  /* Zeilenköpfe und Eckzelle: für Screenreader da, visuell durch .mv-label ersetzt */
  .modellvergleich .mv-eck, .modellvergleich tbody th { position:absolute; width:1px; height:1px; padding:0; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
  /* gleiche Spezifität wie die Desktop-Spaltenbreiten, sonst bleiben 31 % stehen;
     die versteckten Zeilenköpfe (tbody th, oben) bewusst nicht mit aufführen */
  .modellvergleich td, .modellvergleich thead th, .modellvergleich .mv-flex, .modellvergleich .mv-exklusiv { width:auto; padding:14px 18px; }
  .modellvergleich thead th { display:block; padding:16px 18px 12px; border-top:2px solid var(--gruen); font-size:var(--t-klein); }
  .modellvergleich thead .mv-flex { grid-row:1; }
  .modellvergleich .mv-z1 .mv-flex { grid-row:2; }
  .modellvergleich .mv-z2 .mv-flex { grid-row:3; }
  .modellvergleich .mv-z3 .mv-flex { grid-row:4; border-bottom:1px solid var(--sand); }
  .modellvergleich thead .mv-exklusiv { grid-row:5; margin-top:28px; }
  .modellvergleich .mv-z1 .mv-exklusiv { grid-row:6; }
  .modellvergleich .mv-z2 .mv-exklusiv { grid-row:7; }
  .modellvergleich .mv-z3 .mv-exklusiv { grid-row:8; border-bottom:1px solid var(--sand); }
  .modellvergleich .mv-exklusiv { padding-left:18px; }
  .modellvergleich .mv-label { display:block; margin-bottom:4px; font-size:var(--t-mikro); letter-spacing:.06em; text-transform:uppercase; color:var(--sekundaer); }
  .modelle-immer { margin-top:36px; }
  .modelle-vergleich { margin-top:40px; }
}
