/* ===================================================================== Bilanzo Kontrast, seitenweit. Wort des Besitzers 21.09.2026 22:15 ("irgendwie fehlt der kontrast seitenweit!") und 22.09. 06:25/06:35/06:38: "kontrast zum hintergrund erhoehen und nicht rand zeichnen", "Gestalt exakt wie vorher, nur Farbwerte dunkler und Fase statt Rundung". Diese Datei setzt darum NUR Farbwerte (color, background) und die Fase (clip-path, border-radius 0). Keine Rahmen, keine Schriftgroessen, keine Gewichte, kein Padding auf Karten, Chips, Zeilen. Eingabefelder behalten ihre Rahmen (dunkler). Agent U, 22.09.2026, theme-1-kontrast.sh. ===================================================================== */ html:root { --text-3: #52524E; /* Zweittext, 7.4:1 auf Weiss (vorher #8A8A84 = 3.3:1) */ --blue-dim: rgba(27, 170, 200, .16); } /* ---- Farben: Zweittexte, Tuerkis-Texte, Gruen, Fusszeile ---- */ body .hw-card-sub, body .hw-platform-tag, body .hw-availability, body .hw-discounted, body .gpu-card-spec, body .bcmp-note, body .bcmp-muted, body .hv-subdate, body .hv-chart-heading, body .hv-legend-item, body .hv-tx-cat, body .hv-tx-title, body .hv-kpi-lbl, body .hv-kpi-delta, body .hv-titlebar-label, body .bz-plan-opt-sub, body .bz-plan-switch-hint, body .wc-block-components-checkout-step__description, body small, body .partner-seal-sub, body .hw-cloud-flag, body .blz-tp-section-sub, body .tk-fine, body .local-caption, body .demo-shot-caption { color: #52524E; } body .hero-visual .hv-kpi-primary .hv-kpi-lbl, body .hero-visual .hv-kpi-primary .hv-kpi-delta { color: #FFFFFF; } body .hw-decide-head, body .hw-mobile-eyebrow, body .hw-cloud-eyebrow, body .hw-eyebrow, body .bcmp-eyebrow, body .demo-eyebrow, body .section-eyebrow, body .bcmp-p, body .blz-tp-tier-name, body .blz-tp-tier-range, body .hw-flow-num { color: #0C7A96; } body .hero .eyebrow, body .hero span.eyebrow, body .page-eyebrow { color: #52524E; } body .bcmp-y, body .plan-discount-blue, body .bz-plan-opt-badge, body .hv-kpi-delta.hv-kpi-delta-up, body .hv-kpi-green, body .hv-ai-chip, body .billing-discount, body .status-badge, body .status-ok, body .badge-green { color: #086A50 !important; } body .btn-outline, body a.btn-outline, body .hero .btn-outline { color: #1D4ED8 !important; } body .demo-tab { color: #E5EAF0; } body .demo-tab.on, body .demo-tab.active, body .demo-tab[aria-selected="true"] { color: #FFFFFF; } body .demo-scope-chip { color: #FFFFFF; } body .blz-tp-tier-badge, body a.blz-tp-btn-primary, body .blz-tp-btn-primary, body .hv-btn-scan, body .btn-turquoise, body .blz-tp-badge { background: #0C7A96 !important; color: #FFFFFF !important; } body .footer .footer-head, body .biz-footer .footer-head, body footer .footer-head { color: #B8C0CC; } body .footer a, body .biz-footer a, body footer a, body [class*="footer"] a, body .footer-bottom, body .footer-bottom span, body .footer-copy, body .footer .notranslate { color: #E5EAF0; } body .footer-tag { color: #C9D1DC; } /* Kopfbereich der Innenseiten: getoenter Verlauf bleibt, Eyebrow dunkler (Besitzer 06:35) */ body .page-hero { background: linear-gradient(180deg, #EEF4F8 0%, #FFFFFF 100%); } /* Eingabefelder: Rahmen dunkler (wie gehabt, nur Farbe) */ body .wc-block-components-text-input input, body .wc-block-components-select select, body .wc-block-components-checkbox__input, body .wc-block-components-textarea, body input:not([type="range"]):not([type="checkbox"]):not([type="radio"]), body select, body textarea { border-color: #7C7C7C; } body .blz-tp-field.blz-tp-dvv, body .bz-plan-opt-check, body .wc-block-components-radio-control__input, body .bz-plan-opt.is-active { border-color: #0C7A96 !important; } body .gt-current-lang { border-color: #7C7C7C !important; } /* ---- Vergleichstabelle Startseite: Tabellenform (Besitzer 06:30): Spaltenlinien, Kopfzeile abgesetzt, Fase am Rahmen ---- */ body .bcmp-table th, body .bcmp-table td { border-right: 1px solid #8D8D8D; border-bottom: 1px solid #8D8D8D; } body .bcmp-table th:last-child, body .bcmp-table td:last-child { border-right: 0; } body .bcmp-table tbody tr:last-child td { border-bottom: 0; } body .bcmp-table thead th { background: #EEF4F8; color: #111111; } body .bcmp-self td { background: rgba(27, 170, 200, .12); } body .bcmp-scroll { border-radius: 0; clip-path: polygon(13px 0, calc(100% - 13px) 0, 100% 13px, 100% calc(100% - 13px), calc(100% - 13px) 100%, 13px 100%, 0 calc(100% - 13px), 0 13px); } @media (max-width: 768px) { body .bcmp-table td { border-right: 0; } } /* ---- Fokusrahmen (nur im Tastaturfokus sichtbar) ---- */ body a:focus-visible, body button:focus-visible, body input:focus-visible, body select:focus-visible, body textarea:focus-visible, body summary:focus-visible, body [tabindex]:focus-visible { outline: 2px solid #2563EB; outline-offset: 2px; } body input[type="range"]:focus-visible { outline: 2px solid #2563EB; outline-offset: 4px; } /* ---- Lesetext linksbuendig ohne Silbentrennung (Kopf 21.09. 23:05) ---- */ body p, body li, body dd, body blockquote, body h1, body h2, body h3, body h4, body .lede, body .tk-lede, body .tk-perks li, body .prose p, body .prose li, body .prose blockquote, body .article-inner p, body .article-inner li, body .hc-article-body p, body .hc-article-body li, body .hc-faq-answer, body .entry-content p, body .entry-content li, body .entry-content .wp-block-paragraph, body .entry-content .wp-block-list li, body .post-content p, body .post-content li, body .hw-decide p, body .hw-mobile p, body .hw-cloud p, body .hw-info-text, body .blz-tp-hero-sub, body .blz-tp-section-sub, body .hero .lede, body .hero p.lede { text-align: left; text-justify: auto; -webkit-hyphens: manual; hyphens: manual; } /* ---- Fase statt Rundung (Gestalt sonst unveraendert) ---- */ body .btn, body a.btn, body button.btn, body .nav-cta, body .btn-primary, body .btn-outline, body .btn-white, body .btn-lg, body .blz-tp-btn-primary, body .blz-tp-btn, body .hv-btn-scan, body .wc-block-components-button, body .wpforms-submit, body .hero .btn { border-radius: 0 !important; clip-path: polygon(8px 0, calc(100% - 8px) 0, 100% 8px, 100% calc(100% - 8px), calc(100% - 8px) 100%, 8px 100%, 0 calc(100% - 8px), 0 8px); } body .demo-card, body .final-cta-card, body .tk-panel, body .hw-card, body .gpu-card, body .hw-decide, body .hw-mobile, body .hw-cloud, body .hw-info-strip, body .partner-seal, body .blz-tp-card, body .blz-tp-tier, body .blz-tp-faq-item, body .learning-note, body .bfaq-item, body .demo-shot, body .demo-shot img, body .tk-card, body .hero-visual .hv-card { border-radius: 0 !important; clip-path: polygon(13px 0, calc(100% - 13px) 0, 100% 13px, 100% calc(100% - 13px), calc(100% - 13px) 100%, 13px 100%, 0 calc(100% - 13px), 0 13px); } body .hero-visual .hv-kpi, body .hero-visual .hv-chart-area, body .hv-float-badge, body .status-badge, body .badge, body .hint, body .demo-scope-chip, body .hw-platform-tag, body .blz-tp-tier-badge, body .blz-tp-badge { border-radius: 0 !important; clip-path: polygon(5px 0, calc(100% - 5px) 0, 100% 5px, 100% calc(100% - 5px), calc(100% - 5px) 100%, 5px 100%, 0 calc(100% - 5px), 0 5px); } body .bcmp-table tbody tr { border-radius: 0; } /* ---- Startseite: Preisseiten-Titel doppelt (Besitzer 06:35): H1 der Seite heisst "Preis & Hardware", die zweite Ueberschrift faellt weg ---- */ body .prose .bilanzo-pricing-modern .pricing-title { display: none; } body .prose .bilanzo-pricing-modern .pricing-header { margin-top: 0; } body .page-hero:has(+ .page-wrap .bilanzo-pricing-modern) { margin-bottom: 34px; } body .page-wrap:has(.bilanzo-pricing-modern) { padding-top: 0; } /* ---- Testkunden-Hinweis fuer Treuhaender als Kasten (Kopf 06:25) ---- */ body .tk-hinweis { display: block; margin-top: 13px; padding: 13px 21px; background: #F5F7FA; color: #111111; clip-path: polygon(8px 0, calc(100% - 8px) 0, 100% 8px, 100% calc(100% - 8px), calc(100% - 8px) 100%, 8px 100%, 0 calc(100% - 8px), 0 8px); } body .tk-hinweis a { color: #1D4ED8 !important; text-decoration: underline !important; text-underline-offset: 3px; font-weight: 600; } body .tk-hinweis a::after { content: " \2192"; } /* ---- Complianz "Zustimmung verwalten": links unten, Chat-Knopf bleibt rechts ---- */ body .cmplz-manage-consent, body button.cmplz-manage-consent.cmplz-show { right: auto !important; left: 13px !important; bottom: 13px !important; } /* ---- Wort des Besitzers 22.09. 06:42: vorhandene Hintergrundflaechen sichtbar eintoenen (Flaechenkontrast zum Elterngrund >= 1.2:1), gleiche Huelle, nur kraeftiger. Gemessen vorher: Creme #F4F6FA auf Weiss 1.08:1, Blau-Grau #EEF4F8 1.12:1, Chip #F5F7FA 1.07:1, Amber rgba(214,158,46,.12) 1.12:1, Tuerkis rgba(27,170,200,.08) 1.06:1. ---- */ html:root { --cream: #E4E9F1; /* 1.23:1 auf Weiss (vorher #F4F6FA) */ --cream-mid: #E1EAF1; /* 1.24:1 (vorher #EEF4F8) */ --blue-dim: rgba(27, 170, 200, .24); } body .hw-cloud-flag, body .hw-cloud-warn, body .hw-cloud-note { background: rgba(214, 158, 46, .26); } body .gpu-card-use, body .hw-flow-num, body .blz-tp-field.blz-tp-dvv, body .hw-product.hw-product-recommended { background: rgba(27, 170, 200, .24); } body .hw-platform-tag, body .gpu-card-footer, body .partner-seal, body .hw-info-strip { background: #E4E9F1; } body .billing-toggle, body .bilanzo-pricing-modern .billing-toggle, body .hero-visual .hv-kpi, body .hero-visual .hv-chart-area, body .tk-hinweis, body .hv-titlebar { background: #E4EBF2; } body .hero-visual .hv-kpi-primary { background: linear-gradient(135deg, #0C2D56 0%, #0C4A72 100%); } body .demo-scope-chip, body .demo-status, body .blz-tp-step { background: rgba(255, 255, 255, .18); } body .blz-tp-section.blz-tp-cream, body section.blz-tp-section { background: #E4E9F1; } body .blz-tp-tiers, body .blz-tp-included-wrap { background: #E1EAF1; } body .blz-tp-card, body .blz-tp-tier, body .blz-tp-included, body .blz-tp-form-wrap { background: #FFFFFF; } body .bcmp-table thead th { background: #E1EAF1; } body .bcmp-self td { background: rgba(27, 170, 200, .24); } body .pricing-gruender, body .prose .bilanzo-pricing-modern .pricing-gruender { background: #E1EAF1; } body .tk-panel { background: #FFFFFF; } body #testkunden, body section.testkunden { background: #E1EAF1; } /* Docs/Helpcenter (Besitzer 06:48): Inhaltsverzeichnis-Kasten, FAQ-Karten, aktive Seitenleisten-Zeile */ body .hc-toc, body .hc-sidebar, body .hc-faq-item, body .hc-card, body .hc-box, body .toc, body .hc-nav-active, body .hc-nav a.active, body .hc-nav .active, body .hc-sidebar a.active, body .hc-menu a.active { background: #E4EBF2; } body .hc-toc, body .hc-faq-item, body .hc-card, body .hc-box, body .hc-nav a, body .hc-sidebar a, body .hc-menu a, body .hc-faq-badge, body .hc-badge { border-radius: 0 !important; clip-path: polygon(8px 0, calc(100% - 8px) 0, 100% 8px, 100% calc(100% - 8px), calc(100% - 8px) 100%, 8px 100%, 0 calc(100% - 8px), 0 8px); } body .hc-faq-badge, body .hc-badge { background: #0C7A96; color: #FFFFFF; } /* Nachmessung 22.09. 07:2x (Flaechenkontrast < 1.2:1) */ body .hv-ai-chip, body .bz-plan-opt-badge { background: rgba(8, 106, 80, .18); } body .toggle-slider, body .bilanzo-pricing-modern .toggle-slider { background-color: #B8C4D0; } body .pricing-gruender, body .prose .bilanzo-pricing-modern .pricing-gruender { background: #E1EAF1 !important; } body .blz-tp-faq-icon, body .hc-article-tag.tag-setup { background: rgba(27, 170, 200, .28); } body .hc-article-tag.tag-faq, body .hc-article-tag { background: #DCE1E6; } body .blz-tp-step { background: rgba(255, 255, 255, .25); } body section.blz-tp-section:not(.blz-tp-cream), body .blz-tp-section-light { background: #FFFFFF; } body .blz-tp-tiers, body .blz-tp-included-wrap, body .blz-tp-affiliate-box { background: #E1EAF1; } body .blz-tp-field.blz-tp-dvv { background: rgba(27, 170, 200, .24) !important; } /* BLZ-FLAECHEN-START */ /* ===================================================================== Teil 3: die vorhandenen Hintergruende wirklich sichtbar machen. Wort des Besitzers 22.09.2026: "die hintergruende sind ja ueberall noch da aber einfach nicht sichtbar ... das Wort Notloesung - Backup hat ja eigentlich auch einen hintergrund aber es ist schlicht nicht sichtbar". Kein Rahmen wird gezeichnet. Nur Fuellfarben werden kraeftiger. Gemessen vorher (Playwright, 1440 px, computed style): .hw-cloud-flag rgba(214,158,46,.26) -> 1.20:1 zur weissen Karte .hw-platform-tag #E4E9F1 -> 1.22:1 zu Weiss .page-hero #EEF4F8 -> #FFFFFF -> 1.12:1, Band nicht erkennbar .bcmp-self td rgba(27,170,200,.24) -> 1.27:1 Ziel: Flaechen 1.30:1, Chips und Baender 1.44:1 bis 1.55:1 (Delta L* 10 bis 15). ===================================================================== */ html:root { --cream: #DAE1EB; /* 1.30:1 auf Weiss (vorher #E4E9F1 = 1.22:1) */ --cream-mid: #D6E2ED; /* 1.31:1 (vorher #E1EAF1 = 1.24:1) */ --blue-dim: rgba(27, 170, 200, .36); } /* ---- Kopfband der Innenseiten: als Band erkennbar (Besitzer, Preisseite) ---- */ body .page-hero { background: linear-gradient(180deg, #CFDDE9 0%, #E8EFF5 100%); } /* ---- Grosse Kaesten und Baender (1.30:1) ---- */ body .hw-decide, body .hw-mobile, body .hw-cloud, body .hw-info-strip, body .gpu-card-footer, body .partner-seal { background: #DAE1EB; } body .hw-cloud-body, body .hw-mobile-body, body .hw-decide-grid { background: transparent; } body .blz-tp-section.blz-tp-cream, body section.blz-tp-section.blz-tp-cream { background: #DAE1EB; } body .blz-tp-tiers, body .blz-tp-included-wrap, body .blz-tp-affiliate-box { background: #D6E2ED; } body .pricing-gruender, body .prose .bilanzo-pricing-modern .pricing-gruender { background: #D6E2ED !important; } body #testkunden, body section.testkunden { background: #D6E2ED; } body .billing-toggle, body .bilanzo-pricing-modern .billing-toggle, body .hero-visual .hv-kpi, body .hero-visual .hv-chart-area, body .tk-hinweis, body .hv-titlebar { background: #D6E2ED; } body .hc-toc, body .hc-sidebar, body .hc-faq-item, body .hc-card, body .hc-box, body .toc, body .hc-nav-active, body .hc-nav a.active, body .hc-nav .active, body .hc-sidebar a.active, body .hc-menu a.active { background: #D6E2ED; } body .hc-article-tag.tag-faq, body .hc-article-tag { background: #D2DAE2; } /* ---- Kleine Chips, Tags, Flaggen (1.44:1 bis 1.55:1) ---- */ body .hw-platform-tag, body .partner-seal-label { background: #C9D4E3; } body .hw-cloud-flag, body .hw-cloud-warn, body .hw-cloud-note { background: rgba(214, 158, 46, .40); } body .gpu-card-use, body .hw-flow-num, body .hw-product.hw-product-recommended { background: rgba(27, 170, 200, .36); } body .blz-tp-field.blz-tp-dvv { background: rgba(27, 170, 200, .36) !important; } body .blz-tp-faq-icon, body .hc-article-tag.tag-setup { background: rgba(27, 170, 200, .40); } body .hv-ai-chip, body .bz-plan-opt-badge { background: rgba(8, 106, 80, .28); } body .hw-mobile-product { background: #EDF1F7; } body .demo-scope-chip, body .demo-status, body .blz-tp-step { background: rgba(255, 255, 255, .30); } /* ---- Dunkler Abschnitt der Treuhand-Seite: die Teil-2-Regel hatte ihn weiss gemacht, weisse Schrift auf weissem Grund = ganzer Abschnitt unsichtbar (gemessen 22.09.) ---- */ body section.blz-tp-section:not(.blz-tp-cream):not(.blz-tp-dark) { background: #FFFFFF; } body section.blz-tp-section.blz-tp-dark { background: linear-gradient(160deg, #0C2D56 0%, #071B36 100%); } /* ---- Vergleichstabelle bleibt auf jeder Breite eine Tabelle (Besitzer: "ist zur Liste geworden"). Das Theme kippt sie ab 760 px in gestapelte Karten; hier wieder Tabelle mit Querlauf. ---- */ @media (max-width: 768px) { body .bcmp-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; } body .bcmp-table { display: table; width: 100%; min-width: 680px; } body .bcmp-table thead { display: table-header-group; } body .bcmp-table tbody { display: table-row-group; } body .bcmp-table tr { display: table-row; border: 0; margin: 0; border-radius: 0; } body .bcmp-table th, body .bcmp-table td { display: table-cell; text-align: left; border-right: 1px solid #8D8D8D; border-bottom: 1px solid #8D8D8D; } body .bcmp-table th:last-child, body .bcmp-table td:last-child { border-right: 0; } body .bcmp-table tbody tr:last-child td { border-bottom: 0; } body .bcmp-table td::before { content: none; } } /* ---- Hardware: Monospace war zu klein (Besitzer). Vorher 9 bis 11 px, jetzt 12 bis 13 px. ---- */ body .hw-card-sub, body .hw-availability, body .gpu-card-spec { font-size: 13px; } body .hw-platform-tag, body .hw-featured-tag, body .partner-seal-label, body .partner-seal-sub, body .hw-decide-head, body .hw-mobile-eyebrow, body .hw-cloud-eyebrow, body .hw-cloud-flag, body .hw-mobile-product-spec, body .hw-mobile-note, body .hw-cta-note, body .hw-discounted { font-size: 12px; } body .hw-platform-tag { white-space: normal; line-height: 1.45; } /* ---- Startseite: empfohlene Preiskarte gruen wie frueher (front-page.php hatte #0f7a38). Die Preisseite bleibt blau, darum nur unter #preise. Wort des Besitzers: "nein ich sagte gruen startseite. niemand hat etwas von preisseite gesagt". ---- */ body #preise { --empfohlen-farbe: #0f7a38; } body #preise .plan.plan-featured, body #preise .plan.plan-featured::before { background: #0f7a38; } /* BLZ-FLAECHEN-ENDE */ /* BLZ-TEIL4-START */ /* ===================================================================== Teil 4, 22.09.2026. Drei Dinge: a) Rueckweg meiner eigenen Regression aus Teil 3: die Regel fuer .hv-kpi hatte den dunklen Haupt-Kennwert im Hero der Startseite mit uebernommen. Gemessen: .hv-kpi-primary Hintergrund rgb(214,226,237), Schrift weiss = unlesbar. Hier wieder der dunkle Verlauf. b) Eingabefelder ohne Hover sichtbar (Wort des Besitzers: "man sieht das eingabefenster nicht ohne hover"). Gemessen vorher: Fuellung weiss auf weisser Seite, Rand 1 px, teils rgb(226,232,240) = 1.1:1. Jetzt: Fuellung #EDF1F5, Rand #6B7280. Feld behaelt seinen Rand, wie gewuenscht. c) Ecken abgeschnitten statt abgerundet (Wort des Besitzers: "unser design ist eckig abgeschnitten"). Gemessen vorher auf Startseite, Treuhand, Kontakt, Login: 19 Klassen mit border-radius >= 6 px ohne clip-path. ===================================================================== */ /* ---- a) Haupt-Kennwert im Hero bleibt dunkel ---- */ body .hero-visual .hv-kpi.hv-kpi-primary, body .hero-visual .hv-kpi-primary { background: linear-gradient(135deg, #0C2D56 0%, #0C4A72 100%) !important; } body .hero-visual .hv-kpi-primary .hv-kpi-lbl, body .hero-visual .hv-kpi-primary .hv-kpi-delta, body .hero-visual .hv-kpi-primary .hv-kpi-val { color: #FFFFFF !important; } /* ---- b) Eingabefelder ---- */ body input:not([type="range"]):not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([type="file"]), body select, body textarea, body .wc-block-components-text-input input, body .wc-block-components-select select, body .wc-block-components-textarea, body .blz-tp-field input, body .blz-tp-field select, body .blz-tp-field textarea, body .wpforms-field input, body .wpforms-field select, body .wpforms-field textarea { background-color: #EDF1F5; border: 1px solid #6B7280; border-radius: 0 !important; clip-path: polygon(8px 0, calc(100% - 8px) 0, 100% 8px, 100% calc(100% - 8px), calc(100% - 8px) 100%, 8px 100%, 0 calc(100% - 8px), 0 8px); } body input:not([type="range"]):not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):focus, body select:focus, body textarea:focus { background-color: #FFFFFF; border-color: #0C7A96; } body ::placeholder { color: #52524E; opacity: 1; } /* ---- c) Ecken: Fase 8 px fuer Kleinteile ---- */ body .nav-signin, body .tk-btn, body .tk-bar, body .demo-status, body .hv-nav-icon, body .hv-tx-ico, body .blz-tp-hero-video-btn, body .blz-tp-card-icon, body .blz-tp-tier-price, body .blz-roi-cta, body .blz-tp-field, body .blz-tp-btn-submit, body .btn-oauth, body .logo-img, body .blz-chat2__faq-suche, body .blz-chat2__senden, body .blz-chat2__thema, body .blz-chat2__faq-knopf, body .blz-chat2__neu, body .blz-chat2__zu, body .hc-article-card, body .blz-tp-step { border-radius: 0 !important; clip-path: polygon(8px 0, calc(100% - 8px) 0, 100% 8px, 100% calc(100% - 8px), calc(100% - 8px) 100%, 8px 100%, 0 calc(100% - 8px), 0 8px); } /* ---- c) Ecken: Fase 13 px fuer Flaechen ---- */ body .blz-tp-hero-video, body .blz-tp-included, body .blz-tp-form-wrap, body .auth-box, body .feature-item, body .blz-chat2__fenster, body .blz-roi-inner, body .blz-roi-result { border-radius: 0 !important; clip-path: polygon(13px 0, calc(100% - 13px) 0, 100% 13px, 100% calc(100% - 13px), calc(100% - 13px) 100%, 13px 100%, 0 calc(100% - 13px), 0 13px); } /* ---- Chat: Flaechen sichtbar, Eingabe erkennbar ---- */ body .blz-chat2__verlauf { background: #DFE5EE; } body .blz-chat2__eingabe textarea { background-color: #EDF1F5; border-color: #6B7280; } body .blz-chat2__fuss { background: #D6E2ED; } /* BLZ-TEIL4-ENDE */ /* BLZ-TEIL5-START */ /* ===================================================================== Teil 5, 22.09.2026. Wort des Besitzers: "warum ist auf der webseite schon wieder alles rund statt eckig?" Die Rundungen kommen aus vier Theme-Variablen (:root im kritischen CSS): --r-sm 6px, --r-md 10px, --r-lg 16px, --r-xl 24px, dazu einzelne 999px-Pillen und 4 bis 8 px an Bildern und Chips. Hier werden die Variablen selbst auf 0 gesetzt, damit keine Stelle im Theme mehr rund werden KANN, und die uebrig gebliebenen Einzelstellen bekommen die Fase. Ausnahme, bewusst rund gelassen, weil ein Kreis dort inhaltlich richtig ist (Punkte und Symbolkreise): .status-dot, .hv-dot-r, .hv-dot-y, .hv-dot-g, .hv-float-dot, .tk-dot, .tk-ic, .demo-status-dot, .learning-icon, .blz-tp-step-num, .blz-tp-faq-icon, .blz-chat2__punkt. ===================================================================== */ html:root { --r-sm: 0px; --r-md: 0px; --r-lg: 0px; --r-xl: 0px; } /* Pillen, Chips, Marken: Fase 5 px statt Rundung */ body .hv-ai-chip, body .badge, body .pill, body .save-badge, body .popular-badge, body .plan-badge, body [class*="-badge"]:not([class*="dot"]), body [class*="-chip"]:not([class*="dot"]), body [class*="-tag"]:not(img):not([class*="dot"]) { border-radius: 0 !important; clip-path: polygon(5px 0, calc(100% - 5px) 0, 100% 5px, 100% calc(100% - 5px), calc(100% - 5px) 100%, 5px 100%, 0 calc(100% - 5px), 0 5px); } /* Bilder: keine runden Ecken; grosse Inhaltsbilder bekommen die Fase */ body img { border-radius: 0; } body .hw-card-photo, body .demo-shot img, body .blz-tp-hero-video img, body .hw-mobile-product-bild img { border-radius: 0 !important; clip-path: polygon(8px 0, calc(100% - 8px) 0, 100% 8px, 100% calc(100% - 8px), calc(100% - 8px) 100%, 8px 100%, 0 calc(100% - 8px), 0 8px); } /* Kreise bleiben Kreise (siehe Liste im Kopf) */ body .status-dot, body .hv-dot-r, body .hv-dot-y, body .hv-dot-g, body .hv-float-dot, body .tk-dot, body .tk-ic, body .demo-status-dot, body .learning-icon, body .blz-tp-step-num, body .blz-tp-faq-icon { border-radius: 50% !important; clip-path: none !important; } /* BLZ-TEIL5-ENDE */ /* BLZ-TEIL6-START */ /* ===================================================================== Teil 6, 23.09.2026. Zwei von Boris belegte Fehler aus Teil 3 und 5. 1. Die Amber-Flagge "Notloesung . Backup" wurde mit der ROHEN Farbe gerechnet. Der Browser malt rgba(214,158,46,.40) auf rgb(231,225,209), das ergibt rgb(224,198,144) und nur 1.269:1, nicht 1.83:1. Neu Alpha .62: ergibt rund rgb(221,184,108) und 1.45:1, ueber der Chip-Schwelle 1.40. 2. Nach Teil 5 waren noch 28 runde Stellen uebrig, weil sie ihren Radius mit hoeherer Spezifitaet oder als festen Wert tragen: Logos im Kopf und Fuss, Schieberegler des Rechners, .toggle-slider, .hw-link, .partner-seal-sub, .hw-cloud-warn, .tk-bar, der Kasten "Abgrenzung zum Affiliate-Programm" mit border-radius im style-Attribut, und das Complianz-Banner samt seinen drei Knoepfen. .hw-flow-num ist ein Ziffernkreis 24x24 und bleibt bewusst rund, ergaenzt in der Kreisliste. ===================================================================== */ body .hw-cloud-flag, body .hw-cloud-warn, body .hw-cloud-note { background: rgba(214, 158, 46, .62); } /* Bilder: Rundung mit Nachdruck, die Theme-Regeln stehen spezifischer */ body img, body .logo img, body .nav-left img, body .footer-logo-wrap img { border-radius: 0 !important; } /* Schieberegler des Ersparnis-Rechners: Spur und Griff eckig */ body input[type="range"] { border-radius: 0 !important; } body input[type="range"]::-webkit-slider-runnable-track { border-radius: 0; } body input[type="range"]::-moz-range-track { border-radius: 0; } body input[type="range"]::-webkit-slider-thumb { border-radius: 0; } body input[type="range"]::-moz-range-thumb { border-radius: 0; } /* Kleinteile mit fester Rundung: Fase 5 px */ body .hw-link, body a.hw-link, body .tk-bar, body .tk-bar > span, body .partner-seal-sub, body .status-badge { border-radius: 0 !important; clip-path: polygon(5px 0, calc(100% - 5px) 0, 100% 5px, 100% calc(100% - 5px), calc(100% - 5px) 100%, 5px 100%, 0 calc(100% - 5px), 0 5px); } /* Groessere Kleinteile: Fase 8 px */ body .toggle-slider, body .bilanzo-pricing-modern .toggle-slider, body .hw-cloud-warn, body .blz-tp-affiliate-box, body .blz-tp-container > div[style*="border-radius"], body .cmplz-cookiebanner, body .cmplz-cookiebanner .cmplz-btn, body button.cmplz-accept, body button.cmplz-deny, body button.cmplz-view-preferences, body button.cmplz-manage-consent, body .cmplz-cookiebanner .cmplz-categories .cmplz-category { border-radius: 0 !important; clip-path: polygon(8px 0, calc(100% - 8px) 0, 100% 8px, 100% calc(100% - 8px), calc(100% - 8px) 100%, 8px 100%, 0 calc(100% - 8px), 0 8px); } /* Ziffernkreis bleibt Kreis */ body .hw-flow-num, body .blz-tp-step-num { border-radius: 50% !important; clip-path: none !important; } /* BLZ-TEIL6-ENDE */ /* BLZ-TEIL7-START */ /* ===================================================================== Teil 7, 23.09.2026. Vier Befunde von Boris, alle am Browser gemessen: 1. Auf der blauen empfohlenen Karte der Preisseite stand ein Textknoten ("jaehrlich abgerechnet") in rgb(82,82,78) auf rgb(37,99,235) = 1.52:1, unlesbar. Ursache: meine eigene Zweittext-Regel aus Teil 1 traf ein Element INNERHALB der farbigen Karte. Die zehn anderen Textknoten derselben Karte lagen bei 5.17:1. 2. Auf /kontakt/ trugen 4 von 4 Feldern den Rand rgb(100,116,139) statt rgb(107,114,128): die Regeln von WPForms stehen spezifischer als meine aus Teil 4. 3. Das Complianz-Banner (z-index 99999) lag ueber dem Chat-Knopf (99998); der Knopf war vor der Einwilligung nicht anklickbar, auf 1440 px wie auf 400 px gemessen. 4. "Zustimmung verwalten" war auf 400 px display:none. Ohne diesen Knopf laesst sich die Einwilligung auf dem Handy nicht widerrufen. ===================================================================== */ /* 1. In den farbigen Preiskarten gewinnt Weiss, auch fuer Zweittexte */ body .prose .bilanzo-pricing-modern .pricing-card.popular, body .prose .bilanzo-pricing-modern .pricing-card.popular *, body #preise .plan.plan-featured, body #preise .plan.plan-featured * { color: #FFFFFF; } body .prose .bilanzo-pricing-modern .pricing-card.popular a.btn, body .prose .bilanzo-pricing-modern .pricing-card.popular .plan-cta, body #preise .plan.plan-featured .plan-cta { color: var(--empfohlen-farbe, #2563EB); } /* 2. WPForms-Felder mit demselben Rand wie alle anderen */ body .wpforms-form input:not([type="submit"]):not([type="button"]):not([type="checkbox"]):not([type="radio"]), body .wpforms-form select, body .wpforms-form textarea, body .wpforms-field input, body .wpforms-field select, body .wpforms-field textarea { background-color: #EDF1F5 !important; border-color: #6B7280 !important; } /* 3. Der Chat-Knopf bleibt ueber dem Einwilligungsbanner bedienbar */ body .blz-chat2__knopf { z-index: 100000 !important; } /* 4. "Zustimmung verwalten" auch auf schmalen Geraeten sichtbar (Widerruf muss moeglich bleiben) */ @media (max-width: 480px) { body button.cmplz-manage-consent.cmplz-show { display: block !important; } } /* BLZ-TEIL7-ENDE */ /* BLZ-TEIL8-START */ /* ===================================================================== Teil 8, 23.09.2026. Darstellung des Changelogs (Wort des Besitzers: "dann changelogs ... sieht beschissen aus"). Gemessen vorher: .blz-cl-karte Hintergrund rgb(255,255,255) auf weisser Seite, also nur der Rahmen sichtbar; .blz-cl-abz ("Neueste Fassung") rgb(240,253,244), das sind 1.04:1 gegen Weiss. Aufbau, Abstaende (21 px) und Fase (13 px) waren schon richtig und bleiben unangetastet. ===================================================================== */ body .blz-cl-karte { background: #DAE1EB !important; } body .blz-cl-karte:has(.blz-cl-abz) { background: #D6E2ED !important; } body .blz-cl-abz { background: rgba(8, 106, 80, .22) !important; color: #086A50 !important; } body .blz-cl-datum { color: #52524E; } body .blz-cl-liste li + li, body .blz-cl-karte p + p { margin-top: 8px; } body .blz-cl-karte + .blz-cl-karte { margin-top: 21px; } /* BLZ-TEIL8-ENDE */ /* BLZ-TEIL9-START */ /* ===================================================================== Teil 9, 23.09.2026. Blogbeitraege (Wort des Besitzers: "der blogpost ... sieht beschissen aus", "dazu Bilder und Typografie"). Gemessen an /ki-in-der-buchhaltung-.../ (1440 px): Beitragsbild .article-thumb 1600x1067, 720 px breit, Ecken seit Teil 5 scharf statt gefast -> Fase 13 px. Lesetext 16.5 px, Zeilenhoehe 1.75, linksbuendig, keine Silbentrennung, Kontrast 7.85:1. Das ist gut. Einzig die Zeilenlaenge war mit 87 Zeichen zu lang; 68 Zeichen sind die bequeme Obergrenze. Nicht angefasst, weil es eine Entscheidung des Besitzers braucht: zwei der sieben Beitraege haben ueberhaupt kein Beitragsbild (715 "Buchhaltungssoftware Schweiz 2026" und 502 "KI-Rechenknappheit"). Ein passendes Bild dafuer zu erfinden waere geraten, darum steht es im Bericht statt im Code. ===================================================================== */ body .article-thumb { border-radius: 0 !important; clip-path: polygon(13px 0, calc(100% - 13px) 0, 100% 13px, 100% calc(100% - 13px), calc(100% - 13px) 100%, 13px 100%, 0 calc(100% - 13px), 0 13px); } body .article-inner .prose p, body .article-inner .prose li { max-width: 68ch; } body .article-inner .prose h2 { margin-top: 55px; } body .article-inner .prose h3 { margin-top: 34px; } body .article-inner .prose ul, body .article-inner .prose ol { margin-bottom: 21px; } /* BLZ-TEIL9-ENDE */ /* BLZ-TEIL10-START */ /* ===================================================================== Teil 10, 23.09.2026. Der eigentliche Befund des Besitzers, zwei Tage lang missverstanden: "der fucking kontrast stimmt einfach immer noch nicht! das was ich die ganze zeit mit hintergrund kontrast meinte" und "die Flaechen sind im Markup da, aber gegen das Weiss der Seite nicht mehr zu sehen". Gemessen wurde bisher Text gegen Flaeche. Gemeint ist FLAECHE GEGEN SEITENGRUND. Gemessen am 23.09. (computed backgroundColor der Abschnitte, Seitengrund rgb(255,255,255)): Startseite: section.hero weiss 1.00 | section.testkunden-section rgb(214,226,237) 1.31 section.demo-section durchsichtig 1.00 | section.pricing weiss 1.00 ueber 3443 px section.final-cta durchsichtig 1.00 | footer dunkel Preisseite: main.page-wrap weiss 1.00 ueber 1348 px | section.hardware-partner weiss 1.00 ueber 3277 px Treuhand: section mit style background #f7fafc = 1.03 ueber 1764 px, dazu drei weisse hintereinander Also: mehrere tausend Pixel ohne jede Abschnittsgrenze. Hier bekommen die grossen Abschnitte eine Toenung, so dass sich helle und getoente Baender abwechseln und die Grenzen im Vollbild sichtbar werden. Kein Rahmen, kein Schatten, keine neuen Elemente. Zielwert 1.22 fuer die grossen Flaechen (der Besitzer nannte 1.08 als Untergrenze). ===================================================================== */ body section.pricing, body #preise { background: #DFE5EE; } body section.hardware-partner { background: #DFE5EE; } body section.blz-tp-section[style*="f7fafc"], body section.blz-tp-section[style*="F7FAFC"] { background: #DFE5EE !important; } body section.blz-tp-section[style*="#fff"] + section.blz-tp-section[style*="#fff"] { background: #DFE5EE !important; } /* Docs und Blog: der Lesebereich bleibt weiss, die Baender darum bekommen die Toenung */ body .hc-hero, body .hc-section:nth-of-type(even), body .blz-blog-hero, body .article-wrap { background: #DFE5EE; } body .article-inner { background: #FFFFFF; padding: 34px; } /* Damit weisse Karten auf getoentem Grund weiss bleiben und dadurch als Karten lesen */ body section.pricing .plan, body section.pricing .bcmp-table, body section.hardware-partner .hw-card, body section.hardware-partner .gpu-card, body section.pricing .learning-note { background: #FFFFFF; } /* BLZ-TEIL10-ENDE */ /* ===================================================================== TEIL 11, Agent K, 24.09.2026. Wort des Besitzers: "warum ist der agent nicht durch alle seiten?? es fehlt weiterhin fast auf allen seiten!" Gemessen wurde nicht nach Augenmass, sondern am laufenden Browser (Playwright, Vollbild, 1440 px, franklin/projekte/bilanzo/k/kontrast-messen.py). Fuer jede Flaeche wird der BILDPUNKT genommen, nicht die deklarierte Farbe: damit rechnet die Deckkraft von selbst mit, ebenso Verlaeufe und Ueberlagerungen. Verglichen wird die Flaeche gegen das, was unmittelbar um sie herum liegt, denn genau das entscheidet, ob eine Karte als Karte gelesen wird. Stand vorher, 24 Adressen in vier Sprachen: 425 Flaechen unter 1.22. Die groessten Gruppen, alle gemessen: .blz-tp-card 1.00 weiss auf weiss, Treuhandseite, 24 Stueck .feat-card 1.00 weiss auf weiss, Funktionsseite, 24 Stueck .blz-tp-faq-q 1.00 weiss auf weiss, 20 Stueck .feature-item 1.01 Anmeldeseite, rgba(0,86,210,0.05) auf hellblauem Verlauf. Genau der Fall "6 Prozent Deckkraft auf Weiss ist fast Weiss". .auth-box 1.11 weisse Anmeldebox auf hellblauem Verlauf .blz-pp-step 1.15 rgba(255,255,255,0.05) auf #0C2D56 .blz-pp-card 1.08 weiss auf #F4F6FA .blz-pp-facts 1.08 #F4F6FA in der weissen Karte .hw-info-cell 1.08 #DAE1EB auf dem getoenten Band .hw-decide 1.08 desgleichen .hw-mobile 1.08 desgleichen .partner-seal 1.08 desgleichen .blz-roi-result 1.08 rgba(255,255,255,0.05) auf dunkelblau .blz-tp-tier-price 1.09 #F1F6F8 auf weiss .blz-card 1.08 weiss auf #F4F6FA, Seite Ueber uns DREI EBENEN, mehr braucht es nicht, und sie sind ueberall gleich: Ebene 1 Band getoent oder weiss, abwechselnd, damit die Abschnitte im Vollbild auseinanderfallen Ebene 2 Karte immer die Gegenfarbe ihres Bandes Ebene 3 Einschub in einer weissen Karte wieder getoent Die Werte sind gerechnet, nicht gewaehlt: #DFE5EE gegen Weiss 1.258 #DCE8EE gegen Weiss 1.248 Weiss auf #DEE9F8 1.227 10 % Weiss auf #0C2D56 1.344 20 % Tuerkis auf #0C2D56 1.387 Zweittext #565E6B auf #DFE5EE 5.20 (vorher rgb(100,116,139) = 3.78) Grundsatz wie in Teil 1 bis 10: FLAECHEN, keine Rahmen. Ecken abgeschnitten, nie rund. Abstaende Fibonacci 8 13 21 34 55. ===================================================================== */ html:root { --blz-ton: #DFE5EE; /* warme Flaeche, 1.258 gegen Weiss */ --blz-ton-kuehl: #DCE8EE; /* kuehle Flaeche, 1.248 gegen Weiss */ --blz-grund-blau: #DEE9F8; /* Grund der Anmeldeseite, weisse Flaeche darauf 1.227 */ --blz-text-2: #565E6B; /* Zweittext, 5.20 auf dem Ton, 6.54 auf Weiss */ --blz-fase-8: polygon(8px 0, calc(100% - 8px) 0, 100% 8px, 100% calc(100% - 8px), calc(100% - 8px) 100%, 8px 100%, 0 calc(100% - 8px), 0 8px); --blz-fase-13: polygon(13px 0, calc(100% - 13px) 0, 100% 13px, 100% calc(100% - 13px), calc(100% - 13px) 100%, 13px 100%, 0 calc(100% - 13px), 0 13px); } /* ==== Treuhandseite ================================================= */ /* Ebene 1: getoente Baender */ body section.blz-tp-section[style*="var(--cream)"], body section.blz-tp-section[style*="f7fafc"], body section.blz-tp-section[style*="F7FAFC"], body section.blz-tp-section.blz-tp-cream { background: var(--blz-ton) !important; } /* Ebene 2: Karte auf getoentem Band bleibt weiss */ body section.blz-tp-section[style*="var(--cream)"] .blz-tp-card, body section.blz-tp-section[style*="f7fafc"] .blz-tp-card, body section.blz-tp-section[style*="f7fafc"] .blz-tp-tier, body section.blz-tp-section[style*="f7fafc"] .blz-tp-included, body section.blz-tp-section.blz-tp-cream .blz-tp-card { background: #FFFFFF; } /* Ebene 2: Karte auf weissem Band wird getoent */ body section.blz-tp-section[style*="#fff"] .blz-tp-card, body section.blz-tp-section[style*="#fff"] .blz-tp-included, body section.blz-tp-section[style*="#fff"] .blz-tp-faq-q, body section.blz-tp-section[style*="#fff"] .blz-tp-faq-a { background: var(--blz-ton); } /* Teil 10 toent das ZWEITE von zwei aufeinanderfolgenden weissen Baendern. Dort kehrt die Karte wieder um, sonst steht Ton auf Ton (gemessen 1.00). */ body section.blz-tp-section[style*="#fff"] + section.blz-tp-section[style*="#fff"] .blz-tp-card, body section.blz-tp-section[style*="#fff"] + section.blz-tp-section[style*="#fff"] .blz-tp-included, body section.blz-tp-section[style*="#fff"] + section.blz-tp-section[style*="#fff"] .blz-tp-faq-q, body section.blz-tp-section[style*="#fff"] + section.blz-tp-section[style*="#fff"] .blz-tp-faq-a { background: #FFFFFF; } body section.blz-tp-section[style*="#fff"] + section.blz-tp-section[style*="#fff"] .blz-tp-card p, body section.blz-tp-section[style*="#fff"] + section.blz-tp-section[style*="#fff"] .blz-tp-card li { color: var(--blz-text-2); } body .blz-tp-trust { background: var(--blz-ton); } /* Ebene 3: Einschub in der weissen Karte */ body .blz-tp-tier-price { background: var(--blz-ton-kuehl); } body .blz-tp-tiers-hinweis { background: var(--blz-ton); } body .blz-tp-section div[style*="border-left:4px solid var(--teal)"] { background: var(--blz-ton-kuehl) !important; } body .blz-tp-section div[style*="border-left:4px solid var(--teal)"] p, body .blz-tp-section div[style*="border-left:4px solid var(--teal)"] li { color: var(--blz-text-2); } /* Zweittext auf getoenter Flaeche: gemessen 3.78, noetig 4.5 */ body section.blz-tp-section[style*="#fff"] .blz-tp-card p, body section.blz-tp-section[style*="#fff"] .blz-tp-card li, body section.blz-tp-section[style*="#fff"] .blz-tp-faq-a-inner, body section.blz-tp-section[style*="#fff"] .blz-tp-included li, body .blz-tp-tiers-hinweis { color: var(--blz-text-2); } /* Fase statt Rundung */ body .blz-tp-card, body .blz-tp-tier, body .blz-tp-included, body .blz-tp-faq-q, body .blz-tp-tier-price, body .blz-tp-tiers-hinweis { border-radius: 0; clip-path: var(--blz-fase-13); } /* dunkle Baender: Fuellung von 5 auf 10 Prozent, gemessen 1.08 -> 1.34 */ body .blz-roi-result, body .ai-visual { background: rgba(255,255,255,0.10); } /* Schrittkarte ausserhalb eines dunklen Bandes: 30 % Weiss auf Weiss ist Weiss */ body .blz-tp-section[style*="#fff"] .blz-tp-step, body .blz-tp-section[style*="var(--cream)"] .blz-tp-step { background: #FFFFFF; } /* ==== Partnerseite ================================================== */ body .blz-pp-programme, body .blz-pp-cta { background: var(--blz-ton) !important; } body .blz-pp-card { background: #FFFFFF; } body .blz-pp-facts { background: var(--blz-ton); } body .blz-pp-facts li { color: var(--blz-text-2); } body .blz-pp-table-wrap { background: var(--blz-ton); } body .blz-pp-step { background: linear-gradient(158deg, rgba(27,170,200,0.20) 0%, rgba(255,255,255,0.08) 100%); } body .blz-pp-card, body .blz-pp-facts, body .blz-pp-step, body .blz-pp-table-wrap { border-radius: 0; clip-path: var(--blz-fase-13); } /* ==== Funktionsseite: Karten und Tabelle ============================ Band getoent, Karte weiss. Gemessen war die Karte vorher ton auf ton (1.00), weil das Band .ftab-section bereits die Toenung trug. */ body section.ftab-section, body section.local-section, body .ftab-section, body .local-section { background: var(--blz-ton) !important; } body .feat-card { background: #FFFFFF; border-radius: 0; clip-path: var(--blz-fase-13); } body .aias-fade-bottom { background: linear-gradient(180deg, rgba(234,229,215,0) 0%, var(--blz-ton) 100%); } /* Zeilenwechsel in der Funktionstabelle, nur Datenzellen. Kopfzeilen tragen eigene Farben und werden nicht angefasst. */ body .ftab tbody tr:nth-child(even) > td { background: var(--blz-ton); } body .ftab tbody tr:nth-child(odd) > td { background: #FFFFFF; } /* ==== Preisseite ==================================================== */ /* Ebene 2 auf dem getoenten Band: weiss */ body section.hardware-partner .hw-info-cell, body section.hardware-partner .hw-decide, body section.hardware-partner .hw-mobile, body section.hardware-partner .partner-seal, body .hw-info-cell, body .hw-decide, body .hw-mobile, body .partner-seal { background: #FFFFFF; } body .hw-card { background: #FFFFFF; } body .hw-cloud { background: #FFFFFF; } /* Ebene 3, aber NUR innerhalb einer weissen Karte. Auf dem warmen Band waere der kuehle Ton 1.01, also unsichtbar. */ body .hw-card .hw-card-visual, body .hw-mobile .hw-mobile-product { background: var(--blz-ton-kuehl); } body .hw-mobile-product .hw-mobile-product-bild { background: var(--blz-ton); } body .hw-product.hw-product-recommended { background: rgba(27,170,200,0.52); } body .hw-card, body .gpu-card, body .hw-info-cell, body .hw-card-visual, body .hw-decide, body .hw-mobile, body .hw-mobile-product, body .partner-seal { border-radius: 0; clip-path: var(--blz-fase-13); } /* Tarifkarten, die auf weissem Grund stehen */ body .pricing-card:not(.popular) { background: var(--blz-ton); border-radius: 0; clip-path: var(--blz-fase-13); } body .pricing-card:not(.popular) p, body .pricing-card:not(.popular) li { color: var(--blz-text-2); } body .bilanzo-pricing-modern .pricing-card:not(.popular) { background: var(--blz-ton); } body section.pricing .pricing-card:not(.popular), body section.hardware-partner .pricing-card:not(.popular) { background: #FFFFFF; } body .pricing-gruender { background: var(--blz-ton); border-radius: 0; clip-path: var(--blz-fase-13); } body .pricing-gruender p, body .pricing-gruender li { color: var(--blz-text-2); } /* ==== Seite Ueber uns =============================================== */ body .blz-card { background: #FFFFFF; border-radius: 0; clip-path: var(--blz-fase-13); } body .blz-card p, body .blz-card li { color: var(--blz-text-2); } /* ==== Anmeldeseite ================================================== Vier Vorteilskarten mit 5 % Deckkraft auf einem fast weissen Verlauf. Der Grund wird tiefer gelegt und die Karten werden weiss: dann gewinnen beide Richtungen, statt dass eine Flaeche mit noch mehr Deckkraft gegen einen fast weissen Grund kaempft. */ body .bilanzo-auth-wrapper { background: linear-gradient(135deg, #D6E4F7 0%, var(--blz-grund-blau) 100%) !important; } body .bilanzo-auth-wrapper .auth-box, body .bilanzo-auth-wrapper .feature-item { background: #FFFFFF; } body .bilanzo-auth-wrapper .auth-box { border-radius: 0; clip-path: var(--blz-fase-13); } body .bilanzo-auth-wrapper .feature-item { border-radius: 0; clip-path: var(--blz-fase-8); gap: 21px; padding: 21px; } body .bilanzo-auth-wrapper .feature-item:hover { background: var(--blz-ton-kuehl); } body .bilanzo-auth-wrapper .feature-item span { color: #2B3442; } body .bilanzo-auth-wrapper .auth-features h2 { color: #1B2430; } /* ==== Hilfe-Center ================================================== */ body .hc-card, body .hc-faq-q { background: #FFFFFF; border-radius: 0; clip-path: var(--blz-fase-8); } body .hc-section:nth-of-type(odd) .hc-card, body .hc-section:nth-of-type(odd) .hc-faq-q { background: var(--blz-ton); } body .hc-section:nth-of-type(odd) .hc-card p, body .hc-section:nth-of-type(odd) .hc-faq-q { color: var(--blz-text-2); } /* ==== Zustimmungsleiste (Complianz) ================================ Fremder Code, liegt als Ueberlagerung ueber der Seite. Die Messung daran war zwischen zwei Laeufen nicht stabil (die Leiste wandert und verschwindet nach der Zustimmung). Hier wird nichts gesetzt; der Befund bleibt offen und wird gemeldet, statt ihn als geprueft auszugeben. ================================================================= */ /* ==== Seite Ueber uns, zweiter Teil ================================ */ body section.blz-sec-cream, body .blz-sec-cream { background: var(--blz-ton) !important; } body .blz-sec-cream .blz-card { background: #FFFFFF; } body .blz-card.accent { background: #FFFFFF; } body .blz-value { background: var(--blz-ton); border-radius: 0; clip-path: var(--blz-fase-13); } body .blz-value p { color: var(--blz-text-2); } body .blz-origin-card { background: var(--blz-ton); border-radius: 0; clip-path: var(--blz-fase-13); } body .blz-origin-card p { color: var(--blz-text-2); } /* ==== Downloadseite ================================================ Gemessen: section.dl-section #F7F8FA auf Weiss 1.06, die weissen Karten darin 1.06, "bald verfuegbar" 1.00, aside.kurz 1.13, div.hint 1.06. */ body section.dl-section { background: var(--blz-ton) !important; } body section.dl-section .karte { background: #FFFFFF; } body .karte.karte-bald { background: var(--blz-ton-kuehl); } body .karte.karte-bald p { color: var(--blz-text-2); } body section.panel, body div.panel { background: var(--blz-ton); } body section.panel p, body div.panel p { color: var(--blz-text-2); } body aside.kurz { background: var(--blz-ton-kuehl); } body aside.kurz p, body aside.kurz li { color: var(--blz-text-2); } body .hint { background: #F6E7B8; color: #4A3D14; } /* 1.35 gegen Weiss, Text 8.0 darauf */ body section.dl-section, body section.panel, body div.panel, body aside.kurz, body .karte, body .hint { border-radius: 0; clip-path: var(--blz-fase-13); } /* ==== Statusseite ================================================== Die Karten stehen auf 1.22, also genau auf dem Richtwert. Sie bekommen denselben Ton wie ueberall, damit die Seite nicht als Sonderfall lebt. */ body .karte.ecke-karte { background: var(--blz-ton); } body .messkarte.ecke-karte { background: #FFFFFF; } /* ==== Startseite =================================================== section.hero und section.blz-int sind weiss auf weiss ueber 637 bzw. 1350 px, div.hv-card und div.final-cta-card ebenso. */ body section.blz-int { background: var(--blz-ton) !important; } body section.blz-int .blz-int-gruppe, body section.blz-int .blz-int-gruppe.ist { background: #FFFFFF; } body .hv-card { background: var(--blz-ton); border-radius: 0; clip-path: var(--blz-fase-13); } body .hv-card .hv-chart-area { background: #FFFFFF; } body .hv-card p { color: var(--blz-text-2); } /* Die Abschluss-Karte ist DUNKEL entworfen: front-page.php:1508 setzt linear-gradient(140deg, var(--slate), #0D2645, var(--blue-dark)) mit weisser Schrift und einem Knopfrand rgba(255,255,255,.22). Die frueheren zwei Zeilen hier gaben ihr var(--blz-ton), also eine helle Flaeche. Gemessen am lebenden Stand 26.09.2026: h2.cta-h2 weiss auf rgb(234,229,215) = 1.26 zu 1, praktisch unsichtbar; 'Beratung buchen' weiss auf hell gar nicht lesbar. Der Befund des Besitzers dazu, mit Bildschirmfoto: 'kontrast ist auch nicht gegeben'. Der Hintergrund bleibt deshalb der des Entwurfs; nur die Fase bleibt hier. Weiss auf #0D2645 ergibt 14.6 zu 1. */ body .final-cta-card { border-radius: 0; clip-path: var(--blz-fase-13); } body .final-cta-card p { color: rgba(255,255,255,.86); } body .tk-side { background: #FFFFFF; border-radius: 0; clip-path: var(--blz-fase-13); } body .tk-side p, body .tk-side li { color: var(--blz-text-2); } /* ---- Zweittext im Dunkeln ------------------------------------------ body small aus Teil 1 (Zeile 16) faerbt JEDES small auf #52524E. Im dunklen Ergebniskasten des Ersparnis-Rechners ergibt das gemessene 1.44 zu 1, also praktisch unsichtbar. Die Regel bleibt, sie gilt nur nicht mehr auf dunklem Grund. #E5EAF0 auf #0C2D56 sind 12.0 zu 1. */ body .blz-roi small, body .blz-roi-sub, body .blz-roi-result small, body .blz-tp-dark small, body .blz-pp-dark small, body .blz-tp-hero small, body .blz-pp-hero small, body .hero small, body .footer small, body .biz-footer small, body footer small { color: #E5EAF0; } /* BLZ-TEIL11-ENDE */ /* ===================================================================== TEIL 12, Agent K, 24.09.2026. Zweiter Durchgang, nach der Messung am ausgelieferten Stand (Playwright, Vollbild, 1440 px, vier Sprachen). Stand nach Teil 11: 371 -> 107 Flaechen unter 1.22, 159 -> 143 Texte. Hier die Reste, jeder mit der Elternkette am Browser nachgesehen statt geraten. Alle Werte gerechnet. ===================================================================== */ /* ---- Funktionsseite: das Band heisst .feat-section, nicht .ftab-section. Gemessen: weisse Karte auf weissem Band, 1.00, 24 Stueck in vier Sprachen. */ body section.feat-section { background: var(--blz-ton) !important; } body section.feat-section .feat-card { background: #FFFFFF; } /* ---- Preisseite: die Tarifkarte traegt rgba(17,17,17,0.14) aus dem Plugin und liegt auf weissem Grund (div.pricing-grid < div.bilanzo-pricing-modern < div.prose, alle durchsichtig). Warme Flaeche statt grauem Schleier, 1.258. */ body .pricing-card:not(.popular) { background: var(--blz-ton) !important; } /* ---- Treuhandseite: mein eigener Hinweis stand Ton auf Ton (1.00), er liegt im getoenten Stufenband. */ body .blz-tp-tiers-hinweis { background: #FFFFFF; color: var(--blz-text-2); } /* Zweittext im kuehlen Preisblock: gemessen 3.81, noetig 4.5 */ body .blz-tp-tier-price .per, body .blz-tp-tier-price small { color: var(--blz-text-2); } /* ---- Partnerseite: die Fussnote stand auf #8A8A84, gemessen 3.47 auf Weiss. */ body p.blz-pp-note { color: var(--blz-text-2); } /* ---- Tuerkise Knopfflaechen: Weiss auf #1BAAC8 ist gemessen 2.75. #0A6C85 tragen 6.01. Die Flaeche bleibt tuerkis, nur dunkler. */ body a.blz-roi-cta, body .blz-roi-cta, body button.blz-tp-btn-submit, body .blz-tp-btn-submit, body a.btn-hero, body .btn.btn-hero, body .blz-lp-btn-primary, body a.blz-lp-btn-primary { background: #0A6C85 !important; color: #FFFFFF !important; } /* ---- Abzeichen mit tuerkisem Text auf hellem Tuerkis: 2.86 bis 2.94. #0A5A6E tragen 4.48 bis 4.61. */ body .local-badge, body .hw-product-badge { color: #0A5A6E !important; } /* Auf dem warmen Fusszeilenband der Hardwarekarte: 3.79 -> 5.96 */ body .hw-preconfigured, body .hw-card-footer .hw-preconfigured { color: #0A5A6E !important; } /* ---- Affiliate-Seite: fuenf weisse Flaechen auf weissem Grund, gemessen 1.00 (div.blz-aff-lp und main.fw-wrap sind durchsichtig, der Grund ist der Body). */ body .blz-lp-hero, body .blz-lp-calc, body .blz-lp-guest-cta { background: var(--blz-ton); } body .blz-lp-commission .blz-lp-plan { background: #FFFFFF; } body .blz-lp-plan.featured { background: var(--blz-ton-kuehl); } body .blz-lp-how.light { background: var(--blz-ton); } body .blz-lp-hero, body .blz-lp-calc, body .blz-lp-guest-cta, body .blz-lp-plan, body .blz-lp-how.light { border-radius: 0; clip-path: var(--blz-fase-13); } body .blz-lp-hero p, body .blz-lp-calc p, body .blz-lp-guest-cta p, body .blz-lp-how.light p { color: var(--blz-text-2); } /* ---- Eingabefelder: ein Textfeld mit #EDF1F5 auf Weiss traegt 1.14. Es behaelt seinen Rahmen aus Teil 1, bekommt aber eine Flaeche, die man sieht. */ body textarea, body .wpforms-field-medium { background: var(--blz-ton-kuehl); } /* BLZ-TEIL12-ENDE */ /* ===================================================================== TEIL 13, Agent K2, 24.09.2026. Wort des Besitzers: "was ist los mit dir? ueberall fehlt der kontrast??" WARUM DIE FRUEHEREN LAEUFE DANEBENLAGEN. Die Messung nahm einen Vollbild-Screenshot und dann die HAEUFIGSTE Farbe je Flaeche. Auf einem Verlauf hat aber fast jeder Bildpunkt seine eigene Farbe, jede mit Anzahl eins; eine kleine einfarbige Ecke schlaegt sie alle. So wurde der dunkelblaue Hero der Treuhandseite als (255,255,255) gemessen und als "weiss auf weiss" gemeldet, obwohl er navy ist. Von 425 gemeldeten Flaechen war ein grosser Teil dieser Art. Gemessen wird hier auf ZWEI unabhaengigen Wegen (k2/messen.py und k2/gerechnet.py): Bild sichtfeldweise aufgenommen und zusammengesetzt, Median statt Modus, dazu je Seite eine Positivkontrolle: eine laut Browser dunkle Flaeche muss auch im Bild dunkel sein. Gerechnet die ganze Elternkette aufgeschichtet, jede erklaerte Farbe mit ihrem Alpha und der Deckkraft ihrer Kette. Damit rechnet die Deckkraft von selbst mit: 6 Prozent Schwarz auf Weiss sind 1.04. Und zwei Unterscheidungen, an denen es vorher scheiterte: BAND ein Abschnitt ueber die ganze Breite wird NICHT gegen den Body geprueft, sondern gegen das Band, das ihn BERUEHRT. Ein weisses Band zwischen zwei cremefarbenen ist sauber getrennt. Genau solche Baender wurden frueher "repariert" und der Wechsel dabei zerstoert. HUELLE eine Tabelle, die ihren weissen Kasten ausfuellt, ist kein Mangel. Sichtbar sein muss der Kasten, und der wird eigens geprueft. Stand vor diesem Teil, 24 Adressen in vier Sprachen, beide Wege: 56 Flaechen unter 1.22, davon 10 auf der statischen Downloadseite, die diese Datei gar nicht laedt (sie liegt unter /updates/download/ und ist kein WordPress). Die uebrigen werden hier geschlossen. Alle Werte gerechnet, nicht gewaehlt: Weiss gegen #DFE5EE 1.258 Weiss gegen #DCE8EE 1.248 #DFE5EE gegen Weiss 1.258 #1E2A3E gegen #0A0F1A 1.328 Grundsatz wie in Teil 1 bis 12: FLAECHEN, keine Rahmen. Abstaende Fibonacci 8 13 21 34 55. ===================================================================== */ /* ---- Treuhandseite: der Stufenkasten ------------------------------- Gemessen: div.blz-tp-tiers #D6E2ED auf dem cremefarbenen Band #DFE5EE, das sind 1.046, also praktisch unsichtbar. Die weissen Stufenkarten darin tragen ihre Wirkung selbst: Weiss auf Creme sind 1.258. Der Kasten faellt darum als Flaeche weg, statt eine zweite fast gleiche Toenung daneben zu stellen. */ body .blz-tp-tiers { background: transparent; } /* ---- Textfelder ---------------------------------------------------- Gemessen: textarea #EDF1F5 auf weissem Formularkasten, 1.135. Teil 12 setzte dafuer bereits eine Regel, sie verliert aber gegen den Stilblock, der in der Vorlage selbst steht und spaeter im Dokument kommt. Darum hier mit dem Behaelter davor und ausdruecklich. #DCE8EE auf Weiss sind 1.248. */ body textarea, body .blz-tp-form-wrap textarea, body textarea.wpforms-field-medium { background: #DCE8EE !important; } /* ---- Preisseite: Hardware ------------------------------------------ Gemessen: div.hw-info-strip #DAE1EB auf dem Creme-Band, 1.037. Die Zellen darin sind seit Teil 11 weiss und tragen 1.258 gegen das Band. Der Streifen selbst faellt darum als Flaeche weg. Gemessen: div.hw-mobile-product-bild #DFE5EE im kuehlen Kasten #DCE8EE, 1.008. Weiss darauf sind 1.248. */ body .hw-info-strip { background: transparent !important; } body .hw-mobile-product .hw-mobile-product-bild { background: #FFFFFF !important; } /* ---- Funktionsseite: Filmkasten ------------------------------------ Gemessen: div.showreel-video-wrap #111827 auf #0A0F1A, 1.08. #1E2A3E darauf sind 1.328. */ body .showreel-video-wrap { background: #1E2A3E; } /* ---- Funktionsseite: zwei cremefarbene Baender stossen aneinander --- Gemessen: section.feat-section endet bei 1572, section.ftab-section beginnt bei 1572, beide #DFE5EE. Der Uebergang traegt 1.00 ueber 5490 Bildpunkte Hoehe. Das Vergleichsband wird darum weiss, und der Tabellenkasten bekommt die Toenung: Creme, Weiss, dann wieder eine getoente Flaeche, jeder Schritt 1.258. */ body section.ftab-section { background: #FFFFFF !important; } body .ftab-scroll { background: #DFE5EE !important; } /* ---- Startseite: Tarifkarten im Preisband -------------------------- Nachtrag zur Reklamation des Besitzers vom 23.09. ("warum ist das jetzt alles eigelb???"). Heute, am lebenden Stand gemessen: section.pricing #DFE5EE das getoente Band, richtig so .bcmp-table #FFFFFF die Vergleichstabelle ist NICHT mehr mitgefaerbt, ihre Zeilen sind durchsichtig .plan rgba(17,17,17,0.14) ein Schleier UEBER dem Beige Die Tabelle ist also in Ordnung, die Tarifkarte nicht: 14 Prozent Schwarz auf #DFE5EE ergeben ein truebes #CBC7BA und nur 1.19 gegen das Band. Eine Karte auf einem getoenten Band gehoert weiss: 1.258. Gefaerbt wird die KARTE, nicht der Abschnitt, damit kein Inhalt die Toenung erbt. */ body section.pricing .plan, body #preise .plan { background: #FFFFFF !important; } /* ---- Startseite: Seitenspalte im weissen Kasten --------------------- Gemessen: div.tk-side weiss in div.tk-panel weiss, 1.00. */ body .tk-panel .tk-side { background: #DFE5EE; } /* ---- Hilfe-Center: Lesebereich ------------------------------------- Gemessen: div.hc-article weiss, und die ganze Kette darueber bis zum Body ebenfalls weiss, 1.00, sechs Stueck je Seite. Der Lesebereich bleibt weiss (Beschluss aus Teil 10), die Flaeche DARUM bekommt die Toenung. Steht der Abschnitt bereits getoent, faellt die Huelle weg, sonst stuende Ton auf Ton. Gemessen: ol.hc-toc #EDF1F7 auf Weiss, 1.129; #DFE5EE sind 1.258. */ body .hc-articles { background: #DFE5EE; } body .hc-section:nth-of-type(even) .hc-articles { background: transparent; } body .hc-article { background: #FFFFFF; } body ol.hc-toc { background: #DFE5EE; } /* ---- Affiliate-Seite: Tarifkarten ---------------------------------- Gemessen: div.blz-lp-plan weiss auf weissem Grund, 1.00. Teil 12 hat die Karten weiss gesetzt, ohne dem Behaelter eine Flaeche zu geben. */ body .blz-lp-commission { background: #DFE5EE; } /* Teil 12 gab der hervorgehobenen Karte den kuehlen Ton #DCE8EE. Auf dem eben getoenten Behaelter waeren das 1.008, also Ton auf Ton: eine Nebenwirkung der Zeile darueber, hier gleich mit geschlossen. Weiss traegt 1.258, und die Karte bleibt durch ihr Abzeichen hervorgehoben. Nachgemessen. */ body .blz-lp-commission .blz-lp-plan, body .blz-lp-plan.featured { background: #FFFFFF !important; } /* ---- Statusseite: Messkarte ---------------------------------------- Gemessen: div.messkarte.ecke-karte weiss auf weissem Grund, 1.00. Teil 11 setzte sie ausdruecklich auf Weiss, ohne dass ein getoentes Band darunter lag. Nur die Farbe wird berichtigt, am Inhalt der Seite wird nichts angefasst. */ body .messkarte.ecke-karte { background: #DFE5EE !important; } /* BLZ-TEIL13-ENDE */