/* ===================================================================== * Competitor-comparison pages — remaining "old style" text. * QA sheet row 70 (Christoph): "A lot of the text is still in the old * style (font + colour)." Named in his follow-up: the "ERP-Systeme im * Vergleich" table, the text links in "Anbieter im Überblick", the * disclaimer card, and the CTA buttons. * * WHAT "OLD FONT" ACTUALLY MEANS — measured, not assumed. * Proxima Nova appears ZERO times on these pages; the tally is Inter * ~1350 / Kurdis ~8. The real defect is Inter where Kurdis belongs, and * #333333 grey where brand navy belongs. Two headings on the same odoo * page make it unambiguous: * "ERP-VERGLEICH" -> Kurdis, #2722F8 (correct) * "START ODER WECHSEL" -> Inter, #333333 (reported) * * This sheet covers the table body copy, the review links and the * disclaimer card. The CTA pair and the "Warum JTL …" heading live in * `comparison-warum-jtl-cards.css`, which already owns those selectors — * override sheets load ALPHABETICALLY, so `comparison-w…` would win over * `comparison-o…`. Those fixes are made there, not fought from here. * * SCOPE: the same 8 page-ids the sibling comparison-*.css sheets use * (4 DE + 4 EN). WPML stamps the DE original's id onto the EN twin's * , so the DE ids alone would already reach EN — the EN ids are * listed anyway, matching the existing sheets and surviving any future * change to WPML's body-class behaviour. Verified on the rendered DOM: * DE /de/vergleiche/odoo-alternative -> body … page-id-295010 * EN /en/vergleiche/odoo-alternative -> body … page-id-310672 page-id-295010 * * RULE 4c: no blanket #333 recolour. Every rule below is pinned to these * page-ids AND to a module container. `.comparison-table` alone renders * on ~69 other pages; `.decorated-container-heading` sits on BOTH a light * sand section and a DARK navy one on these very pages (the dark one is * the Auswahlkriterien card, whose white/#89D2FF text is set by * comparison-auswahlkriterien-navy.css — a class-wide recolour would * black it out). * ===================================================================== */ /* page set: de 294848/295001/295010/295031 · en 310636/310672/310702/310717 */ /* --------------------------------------------------------------------- * 1. "AUF EINEN BLICK / ERP-Systeme im Vergleich" feature matrix. * * The grey is INHERITED, not set per-node (verified: no rule in any sheet * sets `color` on the table's

elements). So one `color` on the table * root recolours all ~134-220 body cells per page, while descendants that * DO declare their own colour keep it — notably the tech-blue * `.comparison-table__upper--title` ("Stand: April 2026") and the * category icons. No !important needed, and no risk of flattening the * designed accents. * ------------------------------------------------------------------- */ :is(body.page-id-294848, body.page-id-295001, body.page-id-295010, body.page-id-295031, body.page-id-310636, body.page-id-310672, body.page-id-310702, body.page-id-310717) .comparison-table { color: #0B1B45; } /* --------------------------------------------------------------------- * 2. Review links in the "Anbieter im Überblick" tabbed accordion * (Capterra / Trustpilot / OMR / G2 …), 15-22 per page. * * These are bare elements with NO class, coloured grey by the theme's * page-template rule: * .page-template-product-landing a { color: #333 } (0,1,1) * The selector below is (0,3,2), so it wins on specificity alone — no * !important. The underline is left in place: at Dark Blue the links are * the same colour as the body copy around them, so the underline is the * only affordance marking them as links. * ------------------------------------------------------------------- */ :is(body.page-id-294848, body.page-id-295001, body.page-id-295010, body.page-id-295031, body.page-id-310636, body.page-id-310672, body.page-id-310702, body.page-id-310717) .tabbed-subitem__description a { color: #0B1B45; } /* …and the intro paragraph above the accordion in that same section ("Wann Odoo passt – und wann Alternativen sinnvoller sind"), the last grey leaf left in the module. */ :is(body.page-id-294848, body.page-id-295001, body.page-id-295010, body.page-id-295031, body.page-id-310636, body.page-id-310672, body.page-id-310702, body.page-id-310717) .tabbed-widget__copy-text { color: #0B1B45; } /* --------------------------------------------------------------------- * 3. Disclaimer card ("Alle Inhalte dieser Seite …"). * * It is the ONLY content in `section.product-tabs-section.purple` on all * four pages (verified: 468 chars, a single "Disclaimer" heading), so the * section is a safe container to scope to. Body copy inherits the grey, * hence a plain `color` on the section. * ------------------------------------------------------------------- */ :is(body.page-id-294848, body.page-id-295001, body.page-id-295010, body.page-id-295031, body.page-id-310636, body.page-id-310672, body.page-id-310702, body.page-id-310717) section.product-tabs-section.purple { color: #0B1B45; } /* The "Disclaimer" heading is a different animal: the widget emits a per-instance inline block for it — — the same construct as JP-849. Per `.claude/rules/css-override.md` §4 the hash MUST NOT be targeted: WPBakery regenerates it on every editor save (it already differs between prod and the clone for this element). The root-cause fix is Layer B — clear `advanced_advanced_xs_color_custom` on that HeadlineStandard — but that is a DB script across 8 posts and is flagged as a follow-up rather than smuggled into a CSS ticket. Here we out-rank the inline rule STRUCTURALLY. `.utils-` is (0,1,0); the selector below is (0,4,1), so it wins regardless of source order, and it keeps working after the next re-save because it never names the hash. `!important` is required only because the inline rule declares it. */ :is(body.page-id-294848, body.page-id-295001, body.page-id-295010, body.page-id-295031, body.page-id-310636, body.page-id-310672, body.page-id-310702, body.page-id-310717) section.product-tabs-section.purple .h5 { color: #0B1B45 !important; font-family: "Kurdis", "Kurdis Wide", Inter, sans-serif; font-weight: 700; } /* --------------------------------------------------------------------- * 4. The lone legacy CTA in the hero ("Leitfaden: Wechsel zu JTL" — * xentral / plentyone / weclapp; absent on odoo). * * Neither the QA row nor the brief mentions it, but it is the same defect: * the legacy `.product-button-group__button` class, rendering grey #333 * text with a 10px radius and no border, sitting next to a correctly * styled orange `--with-icon` primary in the same hero. Given it is alone * in its group it takes the SECONDARY treatment (see the pair rules in * comparison-warum-jtl-cards.css) — matching the hero's own outline button * elsewhere on the site. * * `:not([class*="--with-icon"])` is what separates legacy from redesign: * both classes coexist on these pages. * ------------------------------------------------------------------- */ :is(body.page-id-294848, body.page-id-295001, body.page-id-295010, body.page-id-295031, body.page-id-310636, body.page-id-310672, body.page-id-310702, body.page-id-310717) section.hero-product-section .product-buttons-group .product-button-group__button:not([class*="--with-icon"]) { display: inline-flex; align-items: center; justify-content: center; padding: 12px 24px; background: transparent; /* 1.4px, not 2px — this is the hero's own secondary-button border width in custom-clone.css (`…__button--with-icon:not(.has-wawi-gradient)`). Deliberately thin per design feedback. */ border: 1.4px solid #0B1B45; /* …and the widget's grey INSET RING has to go, or the border is not the edge you see. ProductButton/style.css:3 sets `inset 0 0 0 2px #333333` on this very class; left in place it draws a 2px grey ring inside the 1.4px navy border, which is both the "old style" colour and the "too thick" edge. */ box-shadow: none; border-radius: 145px; color: #0B1B45; text-decoration: none; } :is(body.page-id-294848, body.page-id-295001, body.page-id-295010, body.page-id-295031, body.page-id-310636, body.page-id-310672, body.page-id-310702, body.page-id-310717) section.hero-product-section .product-buttons-group .product-button-group__button:not([class*="--with-icon"]):hover { background: #0B1B45; border-color: #0B1B45; color: #ffffff; text-decoration: none; }