/* ============================================================
   Zusatzstile nur fuer photovoltaik-was-ist-enthalten.html
   ------------------------------------------------------------
   Bewusst eine eigene Datei statt eines Anbaus an stil.css:
   die grosse Datei wird gerade an anderer Stelle bearbeitet, und
   eine Aenderung dort wuerde auf allen 21 Seiten eine neue
   Versionskennung erzwingen. Hier betrifft es genau eine Seite.

   Alle Farben kommen aus den Variablen von stil.css, damit die
   Seite bei einer Farbaenderung automatisch mitzieht.
   ============================================================ */

/* --- Ja/Nein/Teils-Marken in der Vergleichstabelle --- */
.vgl-ja, .vgl-nein, .vgl-teils {
  display: inline-flex; align-items: center; gap: 7px;
  font-weight: 600; font-size: .88rem; white-space: nowrap;
}
.vgl-ja svg, .vgl-nein svg, .vgl-teils svg {
  width: 17px; height: 17px; flex: 0 0 17px;
}
.vgl-ja    { color: #2f7a4d }
.vgl-nein  { color: #a8432f }
.vgl-teils { color: #8a6410 }
.vgl-ja svg, .vgl-nein svg, .vgl-teils svg { fill: currentColor }

/* Die Vergleichstabelle: erste Spalte traegt den Posten,
   die beiden anderen sind gleich breit, damit das Auge
   Zeile fuer Zeile vergleichen kann. */
.vgl-tab { width: 100%; border-collapse: collapse; margin: 26px 0; font-size: .92rem }
.vgl-tab th, .vgl-tab td {
  text-align: left; padding: 14px 14px; border-bottom: 1px solid var(--line);
  vertical-align: top;
}
.vgl-tab thead th {
  font-family: 'Montserrat', sans-serif; font-weight: 800; font-size: .7rem;
  letter-spacing: .1em; text-transform: uppercase; color: var(--muted);
  border-bottom-width: 2px;
}
.vgl-tab thead th:nth-child(2) { color: var(--olive) }
.vgl-tab td:first-child { color: var(--text); font-weight: 500; width: 34% }
.vgl-tab td:nth-child(2) { background: rgba(126,142,74,.05) }
.vgl-tab th:nth-child(2) { background: rgba(126,142,74,.09) }
.vgl-tab tbody tr:last-child td { border-bottom: 0 }
.vgl-tab .vgl-zusatz {
  display: block; font-weight: 400; font-size: .82rem; line-height: 1.55;
  color: var(--muted); margin-top: 4px;
}
.vgl-huelle { overflow-x: auto; margin: 26px -4px }
@media (max-width: 640px) {
  .vgl-tab { min-width: 520px }
}

/* --- Kartenraster fuer die Leistungen im Preis --- */
.enth-karten {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(215px, 1fr));
  gap: 14px; margin: 26px 0 30px; padding: 0; list-style: none;
}
.enth-karten li {
  background: var(--paper); border-radius: var(--r);
  padding: 16px 18px; display: flex; gap: 11px; align-items: flex-start;
}
.enth-karten svg { width: 19px; height: 19px; flex: 0 0 19px; fill: #2f7a4d; margin-top: 1px }
.enth-karten b {
  display: block; font-family: 'Montserrat', sans-serif; font-weight: 800;
  font-size: .84rem; line-height: 1.35; margin-bottom: 3px;
}
.enth-karten span { display: block; font-size: .83rem; line-height: 1.55; color: var(--muted) }

/* --- Der ehrliche Kasten: was NICHT enthalten ist --- */
.enth-offen {
  border: 1px solid var(--line); border-left: 3px solid #8a6410;
  border-radius: 0 var(--r) var(--r) 0; padding: 20px 24px; margin: 28px 0;
}
.enth-offen h3 {
  font-family: 'Montserrat', sans-serif; font-weight: 800; font-size: .95rem;
  margin: 0 0 8px;
}
.enth-offen p { margin: 0 0 10px }
.enth-offen p:last-child { margin-bottom: 0 }

/* --- Pruefliste zum Abhaken --- */
.enth-pruef { list-style: none; margin: 24px 0 30px; padding: 0 }
.enth-pruef li {
  position: relative; padding: 0 0 0 32px; margin-bottom: 14px;
  font-size: .93rem; line-height: 1.68;
}
.enth-pruef li::before {
  content: ""; position: absolute; left: 0; top: 3px;
  width: 19px; height: 19px; border: 2px solid var(--olive); border-radius: 4px;
}
.enth-pruef li::after {
  content: ""; position: absolute; left: 6px; top: 7px;
  width: 6px; height: 10px; border: solid var(--olive);
  border-width: 0 2px 2px 0; transform: rotate(45deg);
}
.enth-pruef b { font-weight: 700 }