/* Lesegröße 20.10.2026 (Rico): „die Schrift auf den gesamten Seiten ziemlich klein“.
   Regel design-farbregeln 3b / GEO-STANDARD B.12:
   Fließtext mind. 18 px ab 768 px Breite, 17 px darunter, Zeilenhöhe 1,65.
   Kleingedrucktes und Etiketten nie unter 14 px. Navigation, Knöpfe mind. 15 px, Formularfelder 16 px.
   Überschriften mind. 1,5-mal Fließtext. Unterzeilen (p.subline) regelt der eigene Stilblock subline-css.
   Wird als letzte Datei im <head> geladen, damit sie die Inline-Stile der Seiten übersteuert.
   !important nur dort, wo die Größe als style-Attribut im HTML oder per Skript gesetzt ist (1b, 3b). */

/* 1 · Fließtext (Absätze, Listen, Kartentexte, FAQ-Antworten, Tabellenzellen) */
html body :is(p, li, dd, td, blockquote):not(.subline, .hero-sub, .sell-lead, .invest-lead, .hero-meta, .calc-feld-hilfe, .sell-disclaim, .invest-disclaim, .kontakt-form-block-sub, .oton *, form *, nav *, header *, footer *),
html body .calc-section > .calc-inner > p {
  font-size: 17px;
  line-height: 1.65;
}
@media (min-width: 768px) {
  html body :is(p, li, dd, td, blockquote):not(.subline, .hero-sub, .sell-lead, .invest-lead, .hero-meta, .calc-feld-hilfe, .sell-disclaim, .invest-disclaim, .kontakt-form-block-sub, .oton *, form *, nav *, header *, footer *),
html body .calc-section > .calc-inner > p {
    font-size: 18px;
  }
}

/* 1b · Quellenhinweise mit fest eingetragener Größe im HTML (style="font-size:14px/15px"):
   lassen sich nur so übersteuern. Sie zählen als Lesetext, weil sie ganze Sätze sind. */
html body p[style*="font-size:14px"], html body p[style*="font-size:15px"] { font-size: 17px !important; }
@media (min-width: 768px) {
  html body p[style*="font-size:14px"], html body p[style*="font-size:15px"] { font-size: 18px !important; }
}

/* 2 · Kleingedrucktes: Hilfetexte, Hinweise im Formular */
html body :is(.calc-feld-hilfe, .kontakt-form-block-sub, .calc-uebergabe p) { font-size: 15px; }

/* 3 · Etiketten, Tabellenköpfe, Brotkrumen, Fußzeile: nie unter 14 px */
html body :is(.section-tag, .hero-tag, .hero-direct, .hero-direct-link, .hero-direct-label, .hero-stat-label, .breadcrumb, .author-role, .kpi-label, .hero-meta,
  .calc-kicker, .calc-block-titel, .calc-block-titel span, .calc-karte-label, .calc-verbund, .calc-quelle, .calc-lokal, .calc-status,
  .calc-spanne span, .calc-balken-skala span, .calc-feld-kopf label, .calc-check label, .pkt,
  .oton-quelle, .werkzeug-nr, .fuer, .pfeil, .ref-type, .recent-deal, .sell-mandants-tag, .ueber-villa-badge-sub,
  .kontakt-item-label, .kontakt-form-block-tag, .path-tag, .invest-step-num, .sell-step-num, .geo-city-name,
  .sell-process-tag, .invest-process-tag, .sell-disclaim, .invest-disclaim, .mitgabe, .zustimmung, .form-consent, .form-label,
  .footer-topics-label, .footer-topics a, .footer-links a, .footer-copy, footer > div, th) {
  font-size: 14px;
}

/* 3b · Etiketten und Knöpfe, die rechner.css mit zwei Klassen setzt oder die als style-Attribut kommen */
html body .calc-uebergabe :is(.zustimmung, .mitgabe) { font-size: 14px; }
html body .calc-check .pkt { font-size: 14px; }
html body .calc-check button.pkt, html body .calc-uebergabe button[type="submit"] { font-size: 15px; }
html body .calc-verbund { font-size: 14px !important; }                     /* style-Attribut aus rechner.js */
html body a.btn-primary[style*="font-size:14px"] { font-size: 15px !important; } /* style-Attribut im HTML */

/* 4 · Navigation und Knöpfe: mind. 15 px */
html body :is(.nav-links a, .nav-cta, .nav-lang, .nav-back, .btn, .btn-primary, .btn-secondary, .form-submit, .path-cta,
  .calc-uebergabe button, .calc-seg button, .calc-check button) {
  font-size: 15px;
}

/* 5 · Formularfelder: 16 px (sonst zoomt iOS beim Antippen) */
html body :is(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=hidden]), select, textarea) {
  font-size: 16px;
}

/* 6 · Überschriften im Verhältnis zum größeren Fließtext */
html body :is(.article-inner, .related, .calc-uebergabe, .kontakt-form-block, .werkzeug) h3, html body main > h3,
html body :is(.leistung-title, .ablauf-step-title, .ref-title, .sell-value-title, .pillar-title) {
  font-size: 25.5px;
}
html body main > h2 { font-size: 28px; }
html body :is(.sell-step-title, .invest-step-title) { font-size: 19px; }
html body details > summary { font-size: 19px; }
@media (min-width: 768px) {
  html body :is(.article-inner, .related, .calc-uebergabe, .kontakt-form-block, .werkzeug) h3, html body main > h3,
  html body :is(.leistung-title, .ablauf-step-title, .ref-title, .sell-value-title, .pillar-title) {
    font-size: 27px;
  }
  html body main > h2 { font-size: 30px; }
  html body :is(.sell-step-title, .invest-step-title) { font-size: 20px; }
  html body details > summary { font-size: 20px; }
}

/* 7 · Schmale Handys: lange Wörter (Umsatzsteuer-Identifikationsnummer, Mitteldeutschland) trennen statt überstehen */
@media (max-width: 400px) {
  html body :is(h1, h2, h3, .geo-title, .ref-title, .leistung-title, .pillar-title, .sell-value-title, .ablauf-step-title) {
    hyphens: auto; -webkit-hyphens: auto; overflow-wrap: break-word;
  }
  html body :is(p, li) { overflow-wrap: break-word; }
  html body :is(.ref-type, .ref-title, .geo-title) { overflow-wrap: anywhere; }
}
/* Tabellenköpfe in Versalien: auf dem Handy weniger Sperrung, damit „Kriterium“ in die Spalte passt */
@media (max-width: 640px) {
  html body :is(table, .data-table) th { letter-spacing: .04em; }
  html body :is(table, .data-table) :is(th, td) { hyphens: auto; -webkit-hyphens: auto; }
}

/* 8 · Rechner: lange Werte in Ergebniszeilen umbrechen (stand vorher 3 px über, Wertindikator MFH) */
html body .calc-zeile > span { min-width: 0; overflow-wrap: anywhere; }

/* 9 · Folgen der größeren Schrift im Layout */
html body .path-bullets li::before { top: calc(8px + .825em); }   /* Strich mittig zur ersten Zeile */
html body .nav-links a { white-space: nowrap; }
@media (min-width: 961px) and (max-width: 1240px) {               /* Menü passt in eine Zeile */
  html body nav { padding-left: 32px; padding-right: 32px; }
  html body .nav-links { gap: 20px; }
  html body .nav-links a { letter-spacing: .08em; }
}

/* Weiß auf dunkel 20.10.2026 (Rico): „Diese grauen Schriften auf diesen dunklen Hintergründen … das soll in weiß sein,
   nicht total rein weiß, sondern ein schönes Weiß“. Lese-Weiß #F0EFEA für allen Lesetext auf dunklem Grund.
   Die Grauvariablen werden auf allen Seiten nur als Schriftfarbe genutzt (geprüft: 755 × --gray-light, 281 × --gray,
   alles color). Die hellen Rechnerflächen haben eigene Variablen (--calc-ink) und bleiben dunkel beschriftet. */
:root { --gray: #F0EFEA; --gray-light: #F0EFEA; }
/* Dunkle Rechnerkarten und das dunkle Übergabeformular: dort war #C9C4BA fest in rechner.css gesetzt */
html body :is(.calc-gross small, .calc-gross-sub, .calc-balken-skala, .calc-uebergabe, .calc-uebergabe p,
  .calc-uebergabe .zustimmung, .calc-uebergabe .mitgabe, .calc-uebergabe .mitgabe b, .calc-uebergabe button:not([type="submit"])) {
  color: #F0EFEA;
}
/* #C9C4BA als style-Attribut (Werkzeugkarten, Rollenschalter im Übergabeformular), immer auf dunklem Grund */
html body [style*="color:#C9C4BA" i] { color: #F0EFEA !important; }

/* Weiß auf dunkel, Nachtrag 20.10.2026: grüne Fläche (Kerngebiet, Inhaber-Etikett) mit 75-%-Weiß wirkte grau */
[style*="255,255,255,0.75"],.ueber-villa-badge-sub{color:#F0EFEA!important}
