/* _theme.css — readability fixes for neumangroupre.com, measured not eyeballed. Palette follows remined.letaibuildit.com/data_lineage.html. Measured ratios (paper #faf7f2 / white): #141414 ink 17.2 / 18.4 #7a5f26 gold TEXT 5.6 / 6.0 #5a6169 soft ink 5.9 / 6.3 #a07c3b gold LARGE 3.6 / 3.9 (>=24px) #c9a567 gold 2.2 / 2.3 <- FILLS AND BORDERS ONLY, never small text #262d33 on gold 6.3 (white on gold measured 2.3 - do not use) THREE TRAPS ALREADY PAID FOR ON THIS SITE - do not retry any of them: 1. Do NOT re-point --accent/--muted on to fix every page at once. Measured: 888 failures became 1074. The same tokens paint dark panels, where the readable gold is the unreadable one. 2. Every custom property here is --ng- prefixed. page-audit.html and deal-map.html define their own --ink/--line/--muted/--paper, and a plain :root{--ink:...} here repainted those dark pages light (0 -> 196). 3. Do NOT set a light canvas globally (body{background:...;color:...}) to force one design. Measured: 894 failures became 1644. About a dozen pages here are DARK by design (page-audit, cost-segregation-todd, owner, relocate, pay-less-taxes, maps, for-renters ...). A light canvas leaves their white text stranded on paper. Those pages must be converted individually, palette and text together - not overridden from here. Re-measure across all 62 pages before adding anything: node /tmp/final.js (2 passes: theme blocked vs live. Use networkidle + a settle wait, or slow pages report phantom regressions.) */ :root{ --ng-paper:#faf7f2; --ng-card:#fff; --ng-line:#ded5c7; --ng-ink:#141414; --ng-ink-soft:#5a6169; --ng-gold-chrome:#c9a567; --ng-gold-text:#7a5f26; --ng-gold-text-lg:#a07c3b; --ng-slate:#313c44; } /* ---- gold used as TEXT on a light surface (verified light contexts) ---- */ .section-label, .closing-body .place, .agent .role, .stat-item h3 .accent { color: var(--ng-gold-text); } .testimonial blockquote::before{ color: var(--ng-gold-text-lg); } /* ---- text too pale to read on light ---- */ .stat-item p, .testimonial cite, .area p { color: var(--ng-ink-soft); } /* ---- dark surfaces keep the bright gold ---- */ .featured-text .section-label, .featured-text .price, /* .featured-text is background:var(--darker) - gold belongs here */ footer .section-label, footer .place, footer .role, footer .price, .footer-cta .section-label, .footer-cta .place, .footer-cta .role, nav .section-label, #navbar .section-label, .hero .section-label, .subhero .section-label, .subhero-content .section-label, .parallax .section-label, .parallax-content .section-label, .ava-panel .section-label, .cd-panel .section-label { color: var(--ng-gold-chrome); } footer .stat-item p, footer .testimonial cite, .footer-cta .stat-item p { color:#cfc7b8; } /* ---- white text on a gold fill measured 2.3:1 - give it dark text ---- */ .btn-gold, .nav-cta, .b.gold{ background-color:var(--ng-gold-chrome); border-color:var(--ng-gold-chrome); color:#262d33; } /* ---- white-on-gold buttons that outrank the rule above ----------------- _nav.css uses '.ng-nav-scope #navbar .nav-cta' (id + 2 classes), so the plain .nav-cta rule loses the cascade. Matched here on purpose. Measured: white on #c9a567 = 2.3:1 -> #262d33 on #c9a567 = 6.3:1 */ .ng-nav-scope #navbar .nav-cta, .ng-nav-scope #navbar .nav-cta:hover, .dic-cta a, .nez-next a.nez-btn{ color:#262d33; } /* ---- links that were never given a colour ------------------------------ .phone-247 in the footer CTA had no color rule at all, so it rendered as the browser default blue (#0000ee) on the dark #313c44 band = 1.2:1. */ .footer-cta .phone-247, .footer-cta a.phone-247{ color:#e6c896; } /* ---- gold TEXT that sits on a dark band keeps the bright gold ---------- */ .footer-cta em, .footer-cta h2 em, .ads-head .sub, .ads-head span.sub{ color:#c9a567; }