28 lines
2.9 KiB
Markdown
28 lines
2.9 KiB
Markdown
[INFO] 1. B2B Trust Assessment (Dial-back)
|
|
- **Verdict:** Credible but leans industrial/brutalist; overcorrected away from "concierge."
|
|
- **Reasoning:** Restricting the signal orange and relying on the bone/ink palette effectively neutralizes the "loud poster" liability. However, the relentless 2px hard ink borders (`styles.css:151`) and ubiquitous zero-radius corners project "heavy construction/logistics" rather than high-touch IT. It is safe for B2B, but lacks premium polish.
|
|
|
|
[ERROR] 2. WCAG AA Contrast
|
|
- **Verdict:** CLAIM REFUTED. Light mode buttons fail AA compliance.
|
|
- **Reasoning:** `styles.css:135` pairs `--accent: #E24A12` with `--on-accent: #FBF7F0`. For a 16.8px (1.05rem) 600-weight button text, WCAG AA requires 4.5:1. This pairing yields ~3.78:1.
|
|
- **Fix:** Change `html[data-skin="bold"]` light mode `--on-accent` to `#16120F` (yields 5.5:1). Dark mode passes (button `5.5:1`, text `7.4:1`).
|
|
|
|
[WARN] 3. Anton Readability at UI Sizes
|
|
- **Verdict:** Severe legibility friction on sentence-length strings.
|
|
- **Reasoning:** `styles.css:147` forces `.faq__q` (full questions) and `.svc__name` to uppercase. Anton's ultra-condensed, heavy letterforms are designed for isolated poster words. At 1.25rem (20px), block-capital questions smear into unreadable rectangles.
|
|
- **Fix:** Remove `.faq__q`, `.svc__name`, and `.brand__name` from the `styles.css:147` uppercase block.
|
|
|
|
[WARN] 4. Grayscale Filter Scope
|
|
- **Verdict:** Destructive global targeting.
|
|
- **Reasoning:** `styles.css:158` (`html[data-skin="bold"] img { filter: grayscale(1)... }`) blindly desaturates the entire DOM. This will break Microsoft/partner badges, future client logos, and functional UI images.
|
|
- **Fix:** Scope specifically to narrative frames: `html[data-skin="bold"] .hero__frame img, html[data-skin="bold"] .story__img img, html[data-skin="bold"] .page-head--img img`.
|
|
|
|
[ERROR] 5. Skin Scoping & Real Bugs
|
|
- **Verdict:** 3 implementation failures detected.
|
|
- **Leak (Mobile Nav):** `styles.css:160` applies an active link gradient with a specificity of `0,0,2,2`. This permanently defeats the multipage mobile reset at `styles.css:431` (`0,0,2,0`), causing desktop underlines to break the mobile dropdown layout.
|
|
- *Fix:* Add `@media (max-width: 880px) { html[data-skin="bold"] .nav__links a[aria-current="page"] { background-image: none; } }`
|
|
- **Missing Selector:** `styles.css:154` applies thick borders to `.pricing`. `index.html:121` uses `.home-pricing`. The homepage pricing block floats without borders.
|
|
- *Fix:* Add `.home-pricing` to the line 154 selector list.
|
|
- **Internal/External Clash:** `styles.css:153` slaps a harsh 2px ink border around `.rate-card`, but the internal dividers rely on a soft translucent 1px gap (`--rule`). The contrast looks like a rendering glitch.
|
|
- *Fix:* Override the `.rate-card` gap background to `var(--ink)` for the bold skin to unify the grid lines.
|