/* ============================================================
   v2.css - Gestaltung NUR fuer Textversion 2 (Vorschlag, 26.09.2026)
   Besitzer: Textversion-2-Pakete (warme Grundflaeche, mobile Kuerzungen).

   Regel: JEDER Selektor beginnt mit html[data-textversion="2"]. Das
   Attribut setzt header.php nur, wenn Version 2 aktiv ist (bzw. in der
   Vorschau "1"/"2"). Ohne das Praefix wuerde eine Regel auch Version 1
   veraendern - Version 1 muss der heutige Stand bleiben.
   Beispiel:
     html[data-textversion="2"] .f-papier { ... }
   Farben nur als Tokens aus tokens.css (keine Hex-Werte hier), nichts
   unter 14 px, reduced-motion beachten. Steht in KH_CSS direkt vor
   mindestschrift.css (die Sammelregel 14 px gewinnt weiterhin).
   ============================================================ */

/* ============================================================
   1  WARME GRUNDFLAECHE „Leuchttisch-Licht“ (26.09.2026)
   Papier, Leuchtkasten und Box-Ton leicht warm statt kuehl-grau. Nur die
   Grundflaechen: Marke (Cyan/Magenta/Schwarz), Schrift- und Akzentfarben,
   Ladenschild und Zettel bleiben wie in Version 1.
   Die abgeleiteten Tokens (--flaeche-papier, --flaeche-wash, --line …)
   stehen in tokens.css auf :root bzw. auf body (Gewerbe) und rechnen dort
   mit dem hier gesetzten --bg - sie drehen also von selbst mit.
   Rohwerte: tokens.css (--v2-warm-*). Kontrast-Gate gruen:
   _tools-pruefung/tokens-v2-pruefung.css (Projektordner).
   ============================================================ */
html[data-textversion="2"]{
  --bg:            var(--v2-warm-grund);
  --flaeche-licht: var(--v2-warm-licht);
  --bg-2:          var(--v2-warm-box);
  /* Nachbesserung 26.09. (Design-Review): die Wash-Flaechen (Leistungen,
     Signalweg, Kontaktblock) mischen ihr Cyan wie in Version 1 auf das
     NEUTRALE Papier. Aus dem warmen --bg gemischt wurden sie blaeulicher
     (Chroma .0126 -> .0184) und der Temperatursprung an den Kanten groesser. */
  --flaeche-wash:  color-mix(in oklch, var(--cyan) 7%, var(--v2-wash-basis));
}
html[data-textversion="2"] body:has(#zg-gewerbe:checked){
  --bg:            var(--v2-warm-grund-gewerbe);
  --flaeche-licht: var(--v2-warm-licht);
  --bg-2:          var(--v2-warm-box-gewerbe);
  --flaeche-wash:  color-mix(in oklch, var(--magenta) 6%, var(--v2-wash-basis-gewerbe));
}

/* ============================================================
   2  MOBILE KUERZUNGEN der Startseite (unter 48rem, 26.09.2026)
   Ziel: Startseite mobil hoechstens ~13 Bildschirme (Messung im Bericht).
   Nichts faellt ersatzlos weg:
   - Vertrauensbild: BLEIBT (Nachbesserung 26.09., Design-Review): es ist
     das einzige echte, grosse Ladenfoto der mobilen Startseite.
   - Fragen-Anreisser: mobil 2 statt 3 Fragen; alle stehen auf /fragen.php,
     der Knopf „Alle … Fragen ansehen“ bleibt direkt darunter.
   - „Außerdem für Sie“: mobil nur die Titel als kompakte Kacheln
     nebeneinander; die Beschreibung steht auf der verlinkten Seite.
   Zusaetzlich (nur Startseite, weil der Fuss direkt darunter dieselben
   Angaben traegt: Telefon, E-Mail, Anschrift, Oeffnungszeiten):
   - Kontaktblock: Anschrift/Zeiten/E-Mail-Liste mobil aus; Tuerschild
     (offen/geschlossen) und das grosse Telefon bleiben.
   - volle Weiter-Zeilen: die Zeiten-Zeile mobil aus (Tuerschild + Fuss);
     Telefon als 48-px-Hoerer-Knopf neben dem Primaerknopf wie in der
     kompakten Zeile (die Nummer steht mobil ohnehin im mitlaufenden Kopf);
     „Unverbindlich, kein Verkaufsdruck.“ bleibt am Klickpunkt.
   - Bereichs-Panel „Für Zuhause“: die vier Kurzfakten (ab 9 €, 1:1 in
     Echtzeit, Labor, Abgabe) stehen eine Sektion tiefer wortgleich in der
     Leinwand des Rundmagazins - mobil nur dort. „Für Unternehmen“ behaelt
     seine Fakten (dort stehen sie nirgends sonst).
   - Telefon-Textlinks neben Knoepfen („Anrufen: …“, kh_tel_link): mobil aus,
     die Nummer steht im mitlaufenden Kopf-Knopf, im Kontaktblock gross und
     im Fuss. Das grosse Telefon im Kontaktblock bleibt.
   ============================================================ */
@media (max-width:47.99rem){
  html[data-textversion="2"] .fk .faq-kurz > .faq-paar:nth-child(n+3){display:none}
  html[data-textversion="2"] .bereich-hero .auch{margin-top:1.25rem}
  html[data-textversion="2"] .bereich-hero .auch-liste{
    grid-template-columns:repeat(auto-fit, minmax(min(100%, 9rem), 1fr));gap:.6rem;
  }
  html[data-textversion="2"] .bereich-hero .auch-liste a{padding:.75rem .9rem;align-content:center}
  html[data-textversion="2"] .bereich-hero .auch-text{display:none}
  html[data-textversion="2"] body:has(#start-hero) #kontakt .kb-daten{display:none}
  html[data-textversion="2"] body:has(#start-hero) .weiter:not(.weiter--kompakt) .weiter-zeiten{display:none}
  html[data-textversion="2"] body:has(#start-hero) .weiter:not(.weiter--kompakt) .weiter-innen{gap:.75rem}
  html[data-textversion="2"] body:has(#start-hero) .weiter:not(.weiter--kompakt) .btn-1{
    flex:1 1 0;min-width:0;padding-inline:.8rem;gap:.4rem;font-size:.9375rem;letter-spacing:-.005em;
  }
  html[data-textversion="2"] body:has(#start-hero) .weiter:not(.weiter--kompakt) .weiter-tel{
    flex:0 0 48px;width:48px;justify-content:center;gap:0;
    border:2px solid var(--border-feld);border-radius:var(--r-knopf);
  }
  html[data-textversion="2"] body:has(#start-hero) .weiter:not(.weiter--kompakt) .weiter-tel span{
    position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;
  }
  html[data-textversion="2"] .bereich-hero .panel[data-zg="privat"] .facts{display:none}
  html[data-textversion="2"] body:has(#start-hero) .tel-link{display:none}
}