/* Geräteschutz mit WERTGARANTIE: Übersicht geraeteschutz/ und die Themenseiten aus Schutz::SEITEN ('css' => 'geraeteschutz').
   Baut auf den Klassen der Themenseiten auf (inhaltskopf, ablaufkasten, spalten, liste-haken, preistabelle, themen). */

/* Pflichthinweis und Beitrag direkt unter dem Abschlussknopf */
.schutz-pflicht { margin: 14px 0 0; max-width: 52ch; font-size: .92rem; line-height: 1.5; color: var(--text-2); }
.schutz-pflicht strong { color: var(--schwarz); }
.schutz-offen { margin: 10px 0 0; max-width: 60ch; font-size: .84rem; line-height: 1.5; color: var(--stahl); }

/* Was abgedeckt ist / was nicht: Liste mit Strich statt Haken */
.liste-strich { list-style: none; padding: 0; margin: 0 0 1em; }
.liste-strich li { position: relative; padding-left: 30px; margin-bottom: 10px; }
.liste-strich li::before { content: ""; position: absolute; left: 4px; top: .78em; width: 12px; border-top: 2px solid var(--stahl); }
.schutz-quelle { margin-top: 8px; font-size: .84rem; color: var(--stahl); max-width: 70ch; }
.schutz-spalte h3 { margin-bottom: .7em; }

/* Werkstattpreise */
.schutz-preise { margin-top: 8px; }
.schutz-preise li { align-items: baseline; }
.schutz-preise a { text-decoration: none; }
.schutz-preise a:hover { text-decoration: underline; }
.schutz-preise small { display: block; font-size: .84rem; color: var(--stahl); }
.schutz-kosten .preistabelle { margin-bottom: 10px; }
.schutz-kosten__text { max-width: 68ch; }

/* Zitat des Inhabers */
.schutz-zitat { margin: 0; padding: 26px 26px 22px; border-left: 4px solid var(--rot); border-radius: 0 var(--radius) var(--radius) 0; background: var(--werkbank); }
.schutz-zitat blockquote { margin: 0; }
.schutz-zitat blockquote p { margin: 0; font: 700 clamp(1.2rem, 1rem + .9vw, 1.6rem)/1.3 var(--din); color: var(--schwarz); text-wrap: pretty; }
.schutz-zitat figcaption { margin-top: 14px; font-size: .92rem; color: var(--text-2); }
.schutz-zitat figcaption strong { display: block; color: var(--schwarz); }
.schutz-zitat__hinweis { margin: 12px 0 0; font-size: .84rem; color: var(--stahl); }

/* Übersicht: sechs Kacheln (am breiten Bildschirm drei je Reihe statt fünf), darunter die Themenseiten als Links */
@media (min-width: 1100px) { .wg-wahl--sechs { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.schutz-mehr { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 20px 0 0; padding: 0; }
.schutz-mehr a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 16px; border: 1px solid var(--alu); border-radius: 999px; background: #fff;
  font-weight: 600; font-size: .94rem; text-decoration: none; }
.schutz-mehr a:hover { border-color: var(--stahl); color: var(--rot); }

/* Übersicht: Abschluss und Schadenfall nebeneinander */
.schutz-wege { display: grid; gap: 20px; }
@media (min-width: 900px) { .schutz-wege { grid-template-columns: 1fr 1fr; gap: 32px; } }
.schutz-wege .ablaufkasten p:last-child { margin-bottom: 0; }

/* Querverweise: Tippziele ≥ 44 px */
.schutz-weiter__liste .pfeil-link { min-height: 44px; padding-block: 8px; }

/* Werkstatt-Seite: Wege nebeneinander */
.schutz-faelle .karte p:last-child { margin-bottom: 0; }
.schutz-faelle ol { margin: 0 0 1em; padding-left: 1.3em; }
.schutz-faelle li { margin-bottom: 8px; }

/* Übersicht: Offenlegung als ruhiger, knapper Block */
.schutz-offenlegung { padding-block: 28px; }
.schutz-offenlegung .h4 { margin-bottom: .4em; }

/* Tippziele ≥ 44 px: eigenständige Pfeil-Links; Links in der Preistabelle bekommen eine größere Trefferfläche, ohne dass die
   Zeilen höher werden (Polster und gleich großer negativer Rand) */
.pfeil-link { min-height: 44px; }
.schutz-kosten .preistabelle td a { display: inline-block; min-width: 56px; padding: 14px 6px; margin: -14px -6px; text-align: right; }
.schutz-kosten .preistabelle th a { display: inline-block; padding-block: 11px; margin-block: -11px; }

/* Zitat im grauen Abschnitt: weiße Fläche statt grau auf grau */
.abschnitt--grau .schutz-zitat { background: #fff; }