sync: auto-sync from GURU-5070 at 2026-06-14 20:04:14

Author: Mike Swanson
Machine: GURU-5070
Timestamp: 2026-06-14 20:04:14

projects/acg-website-showcase/multipage/design/detect.json

@@ -0,0 +1 @@
+Error: bundled detector not found.

projects/acg-website-showcase/multipage/design/gen-extra-images.sh

@@ -0,0 +1,18 @@
+#!/usr/bin/env bash
+set -u
+ROOT=/d/ClaudeTools
+GROK="$ROOT/.claude/skills/grok/scripts/ask-grok.sh"
+OUT="$ROOT/projects/acg-website-showcase/multipage/assets/images"
+cd "$ROOT"
+
+echo "=== [1/3] services / hardware ==="
+bash "$GROK" image "Photorealistic editorial close-up of a tidy small-office network setup in warm afternoon light: a clean wall-mounted patch panel and a small network switch with neatly dressed cables on a light wooden shelf against a smooth white stucco wall. Orderly, honest, premium, no logos, no text. Warm cream, tan and soft amber palette, gentle film grain, shallow depth of field. No people. Wide 3:2 landscape." "$OUT/services.png"
+
+echo "=== [2/3] about / relationship ==="
+bash "$GROK" image "Photorealistic editorial photograph, warm afternoon window light: a friendly handshake across a light-wood desk in a small Tucson office, mid-shot focusing on the two hands meeting above the desk, with a modern laptop and an open paper notebook nearby. Genuine, human, welcoming. Warm cream and tan palette, soft fine film grain, shallow depth of field. No logos, no visible faces, no text. Wide 3:2 landscape." "$OUT/about.png"
+
+echo "=== [3/3] contact / Tucson exterior ==="
+bash "$GROK" image "Photorealistic golden-hour photograph: the exterior of a modest single-story southwestern commercial building with warm hand-troweled stucco walls and a clean simple storefront, a saguaro cactus and the soft silhouette of the Santa Catalina mountains in the distance, Tucson Arizona. Calm, local, welcoming. No signage text, no people, no logos. Warm cream and amber palette, soft film grain. Wide 3:2 landscape." "$OUT/contact.png"
+
+echo "=== DONE ==="
+ls -la "$OUT"

projects/acg-website-showcase/multipage/design/gen-verdigris-images.sh

@@ -0,0 +1,21 @@
+#!/usr/bin/env bash
+set -u
+ROOT=/d/ClaudeTools
+GROK="$ROOT/.claude/skills/grok/scripts/ask-grok.sh"
+OUT="$ROOT/projects/acg-website-showcase/multipage/assets/images/verdigris"
+mkdir -p "$OUT"
+cd "$ROOT"
+
+echo "=== [1/4] hero: copper gate latch ==="
+bash "$GROK" image "Photorealistic documentary close-up: a verdigris-patinated copper gate latch on a whitewashed stucco wall, soft cool morning side light, the latch in sharp focus and the plaster softly blurred behind it. Neutral-to-cool white balance, desaturated palette, the verdigris blue-green patina is the only saturated hue in frame, shallow depth of field, fine grain. No people, no text, no lens flare. Wide 3:2 landscape." "$OUT/hero.png"
+
+echo "=== [2/4] services: patch panel labeling ==="
+bash "$GROK" image "Photorealistic documentary photo: a pair of hands labeling a network patch panel with small neat handwritten tags, careful and human, cool neutral light, shallow depth of field, desaturated palette with a faint hint of verdigris green. Industrial, orderly, transparent process. No faces, no logos, no text on screen. Wide 3:2 landscape." "$OUT/services.png"
+
+echo "=== [3/4] about: weathered enamel storefront sign ==="
+bash "$GROK" image "Photorealistic documentary photo: a weathered hand-painted enamel storefront service sign mounted on a whitewashed Tucson stucco wall, cared-for but not glossy, the lettering soft and partly out of focus, partial sidewalk and plaster visible. Cool neutral white balance, side light, desaturated palette with verdigris-green and aged-metal accents. No people. Wide 3:2 landscape." "$OUT/about.png"
+
+echo "=== [4/4] contact: cool Tucson storefront ==="
+bash "$GROK" image "Photorealistic documentary photo: the exterior of a tidy 1950s single-story Tucson stucco storefront in cool overcast morning light, whitewashed plaster walls, a weathered copper-patina door pull and trim, clean simple windows. Calm, local, cared-for. Cool neutral white balance, desaturated palette, verdigris-green the only saturated hue. No signage text, no people. Wide 3:2 landscape." "$OUT/contact.png"
+
+echo "=== DONE ==="; ls -la "$OUT"

projects/acg-website-showcase/multipage/design/grok-newdesign-prompt.txt

@@ -0,0 +1,20 @@
+You are the lead designer. Originate ONE complete, opinionated, buildable art direction for a website. I will implement it exactly, then put it through an independent design critique, so be concrete and commit.
+
+THE SITE: A multipage marketing website for "Arizona Computer Guru" (ACG), a Tucson managed-IT and cybersecurity company since 2001. Differentiator: "concierge IT" (genuine relationships, going far beyond typical IT companies, transparent honest pricing, kind and direct, local). Audience: Tucson small-business owners, often burned before by surprise bills, offshore call centers, three-year lock-ins. The site sells trust first. Pages: Home, Services, Pricing, Calculator (interactive IT-cost estimator), About, Contact.
+
+HARD CONSTRAINTS:
+- Hand-built static HTML/CSS/vanilla-JS, driven by CSS custom-property design tokens. So give me CONCRETE values.
+- Must be genuinely premium and distinctive, and must NOT look like generic AI-slop SaaS (no blue/purple gradient blobs, no floating 3D isometrics, no glowing shields, no hero-metric template, no identical icon-card grids).
+- ALL text must be readable (WCAG AA, ~4.5:1 body) in BOTH a light theme AND a dark theme.
+- It must be DISTINCT from the two skins this site already has: (1) "Sonoran Ledger" = warm cream paper, ledger rulings, mono numerals, burnt-amber accent; (2) "Midnight Concierge" = cool slate dark-premium with amber accent. Do not give me a third variation on warm-paper or cool-slate. Go somewhere new.
+
+DELIVER, in this structure:
+1. NAME.
+2. CONCEPT: one tight paragraph. Name a real-world reference object/aesthetic so it is not generic.
+3. COLOR TOKENS, explicit hex, for BOTH modes. Give exactly these roles for LIGHT and for DARK: paper (bg), surface, surface-2, ink (primary text), ink-2 (secondary), ink-3 (muted), rule (hairline rgba), accent (the one signal color used <=10%), accent-ink (the accent as TEXT, AA-safe on that mode's bg), on-accent (text on an accent fill). Keep chroma sane at extremes. State the accent hue you chose and why (you may keep ACG's amber or pick a new brand-justified color).
+4. TYPOGRAPHY: display + body + mono families (real Google Fonts). You MAY change from the current Barlow Condensed / Lexend / JetBrains Mono if your concept needs it; justify. Note weights and the hierarchy approach.
+5. SIGNATURE MOVES: 2-4 concrete, distinctive treatments that define the look (what replaces ledger rulings, corner radius, dividers, the way pricing/the calculator are framed, motion). Be specific enough to build.
+6. IMAGERY: describe the hero image + 2 section images you want (photographic, so I can generate them with an image model), and the overall art-direction of photography (light, palette, mood). Say if existing warm golden-hour Tucson photos (desk-with-ledger, handshake, stucco storefront) should be reused or replaced.
+7. ANTI-SLOP: 3 specific reasons this will not read as AI-generated, and name the single biggest risk that it DOES, plus how to avoid it.
+
+Keep it tight and decisive, under ~750 words. Commit to specifics; do not hedge with ranges.

projects/acg-website-showcase/multipage/design/grok-newdesign.md

@@ -0,0 +1,96 @@
+# 1. NAME
+
+**Verdigris Gate**
+
+---
+
+# 2. CONCEPT
+
+Reference object: the **oxidized copper hardware on a maintained 1950s Tucson stucco storefront** — whitewashed plaster, brushed aluminum door pulls weathered to verdigris, hand-painted enamel service signage. Premium through material honesty, not dashboard gloss. Concierge IT is the gate you walk through: labeled, direct, locally kept. The site should feel like that building’s fascia and service counter, not a SaaS landing template.
+
+---
+
+# 3. COLOR TOKENS
+
+**Accent hue: Verdigris (#2F7A6B light / #4DA896 dark).** Copper oxidation is Tucson-native (pipes, roof flashings, desert hardware) and signals stewardship and longevity — not alarm-red security or fintech amber. Used ≤10%: primary CTA, active nav rule, calculator totals, one pull-quote bar.
+
+### Light (plaster day)
+| Role | Value |
+|---|---|
+| paper | `#E9EDEA` |
+| surface | `#FFFFFF` |
+| surface-2 | `#DFE5E1` |
+| ink | `#1C2421` |
+| ink-2 | `#3F4F49` |
+| ink-3 | `#5C6B65` |
+| rule | `rgba(28, 36, 33, 0.12)` |
+| accent | `#2F7A6B` |
+| accent-ink | `#1F5F52` |
+| on-accent | `#F0F7F5` |
+
+### Dark (wet courtyard night)
+| Role | Value |
+|---|---|
+| paper | `#141A18` |
+| surface | `#1C2421` |
+| surface-2 | `#25302C` |
+| ink | `#E4EBE8` |
+| ink-2 | `#A8B5AF` |
+| ink-3 | `#7A8A84` |
+| rule | `rgba(228, 235, 232, 0.10)` |
+| accent | `#4DA896` |
+| accent-ink | `#6BC4B0` |
+| on-accent | `#0D1614` |
+
+All body pairs (`ink` on `paper`, `ink-2` on `surface`) exceed 4.5:1. `accent-ink` is for text links and inline emphasis on backgrounds, never large accent fills.
+
+---
+
+# 4. TYPOGRAPHY
+
+**Display: Fraunces** (Google Fonts) — weights 500 (H1), 400 (H2–H3). Soft, old-metal signage energy; breaks SaaS sans uniformity without ledger nostalgia.
+
+**Body: Source Sans 3** — 400 body, 600 labels/nav. Humanist, plainspoken; reads kind and direct at 18px/1.6.
+
+**Mono: IBM Plex Mono** — 400 inputs, 500 calculator totals and pricing figures. Clinical where money is discussed.
+
+**Hierarchy:** One Fraunces H1 per page (max 48px). Sections lead with Source Sans 600 uppercase tracked labels (11px, `letter-spacing: 0.08em`, `ink-3`) — enamel caption style. No hero metrics; trust copy is body-scale, not billboard numbers.
+
+---
+
+# 5. SIGNATURE MOVES
+
+1. **Enamel double-rule frames** — Pricing tiers, calculator shell, and contact form sit inside a 1px `rule` border with a second 1px border 4px inset (no outer glow). `border-radius: 2px` everywhere. Max corner radius site-wide: 4px on buttons only.
+
+2. **Gate-rail header** — Nav lives on a full-width `surface-2` band with a CSS brushed-metal grain (`repeating-linear-gradient(90deg, transparent, transparent 2px, rgba(0,0,0,0.03) 2px, rgba(0,0,0,0.03) 3px)` in light; `0.06` opacity in dark). Not floating, not sticky glass.
+
+3. **Verdigris underscore navigation** — Links are `ink`; hover/active = 2px `accent` bottom border. One filled `accent` button per viewport (primary CTA). Secondary actions are outlined `rule` borders, never ghost gradients.
+
+4. **Calculator as meter tape** — The estimator is a vertical stack on `surface-2`, top edge perforated via `radial-gradient(circle, paper 30%, transparent 31%)` spaced 8px. Live total in IBM Plex Mono 28px `accent-ink` on `paper` strip — receipt, not widget card. Sliders are 2px track + square 12px thumb (no pill toggles).
+
+**Motion:** 180ms ease on border-color and underscore only. No parallax, no blob drift. Theme toggle cross-fades `color`/`background-color` 200ms.
+
+---
+
+# 6. IMAGERY
+
+**Photography direction:** Documentary maintenance photography — neutral-to-cool white balance, side light, shallow depth of field, desaturated greens and plaster whites, verdigris as the only saturated hue in frame. No lens flare, no neon, no server-room blue wash.
+
+- **Hero:** Close-up of a **verdigris-patinated copper gate latch** on white stucco, morning side light, latch sharp / stucco soft blur. Conveys “local gatekeeper,” not “cyber shield.”
+- **Services section:** **Hands labeling a network patch panel** with handwritten tags — neat, human, transparent process.
+- **About section:** **Weathered hand-painted enamel “Computer Guru” sign** on a Tucson storefront, cared-for not glossy, partial stucco and sidewalk visible.
+
+**Reuse verdict:** **Replace** golden-hour desk-with-ledger (too Sonoran Ledger), **replace** generic handshake (stock trust cliché). **Adapt** stucco storefront only if re-shot cooler/plaster-toned with enamel-sign framing; do not reuse warm golden-hour grade.
+
+---
+
+# 7. ANTI-SLOP
+
+**Why this won’t read AI-generated:**
+1. Verdigris-on-plaster palette — neither blue-purple SaaS nor amber concierge variants already in the repo.
+2. Fraunces serif + enamel double-rules — explicitly rejects icon-card grids and rounded-16px component libraries.
+3. Calculator-as-meter-tape and gate-rail nav are site-specific behaviors, not interchangeable hero-metric templates.
+
+**Biggest risk:** Fraunces + muted green reads **boutique wellness spa**, not MSP.
+
+**Avoid it:** Keep photography industrial (patch panels, hardware, signage). Use IBM Plex Mono and plain-dollar copy on Pricing. No leaf motifs, no “wellness” whitespace — use `surface-2` bands and double-rules to maintain civic/commercial weight. Fraunces only on headlines; body stays Source Sans at 18px minimum.

projects/acg-website-showcase/multipage/design/review-gemini-mp.md

@@ -0,0 +1,45 @@
+**index.html**
+- [WARN] Cross-page consistency: The inline theme `<script>` in the `<head>` is unminified, whereas it is a minified one-liner in the other 5 pages (line 12).
+- [WARN] Cross-page consistency: Footer `<p class="disclaimer">` text heavily drifts/diverges from the strings used on other pages (line 109).
+- [WARN] Inline styling: Uses a hardcoded `<div style="display:flex;gap:1.5rem;flex-wrap:wrap;margin-top:var(--base);">` instead of a CSS utility class (line 94).
+
+**services.html**
+- [ERROR] Accessibility: Missing semantic headings. Item titles use `<div class="svc__name">` inside `<article>` tags instead of heading elements (line 46). Group titles use `<p class="svc-group__title">` instead of headings (line 44).
+- [WARN] Cross-page consistency: Footer disclaimer text drifts from other pages (line 78).
+
+**pricing.html**
+- [ERROR] Accessibility: Missing semantic headings. The rate cards use `<div class="tier__name">` instead of `<h3>` elements (line 37).
+- [WARN] Cross-page consistency: Footer disclaimer text drifts from other pages (line 107).
+
+**calculator.html**
+- [OK] Accessibility: Form controls are properly labeled, input modes are specified, and `aria-live` is correctly placed on the total output.
+- [WARN] Cross-page consistency: Footer disclaimer text drifts from other pages (line 90).
+
+**about.html**
+- [ERROR] Accessibility: Missing semantic headings. Similar to the services page, item names inside the `.svc-list` are structured as `<div class="svc__name">` instead of headings (line 51).
+- [WARN] Cross-page consistency: Footer disclaimer text drifts from other pages (line 81).
+
+**contact.html**
+- [WARN] Inline styling: The main page heading uses heavy inline styles `<h1 id="contact-h" style="...">` rather than pulling from the stylesheet (line 39).
+- [WARN] Cross-page consistency: Footer disclaimer text drifts from other pages (line 80).
+
+**styles.css**
+- [ERROR] House Rules: An em dash (`—`) is used in the header comment string block, violating the strict no em dash rule (line 2).
+- [ERROR] WCAG AA Contrast: The `active nav underline` uses `var(--accent)` (orange) on `--paper` (cream), which fails the 3:1 non-text contrast requirement in light mode (line 348).
+- [ERROR] WCAG AA Contrast: The `.bigquote::before` quotation mark uses `var(--accent)` on `--paper`, failing the 3:1 ratio for large text in light mode (line 364).
+- [ERROR] WCAG AA Contrast: The `.office-figure figcaption` uses `var(--ink-3)` on `var(--surface)`. While `--ink-3` passes on `--paper`, the darker `--surface` background causes this to fail the 4.5:1 ratio for small text in light mode (line 386).
+- [WARN] Responsive risk: The mobile nav `.nav__links` relies on `max-height: 60vh; overflow: hidden;`. On short landscape viewports, overflowed links will clip and become entirely inaccessible because it lacks `overflow-y: auto` (line 103).
+- [OK] House Rules: Verified no side-stripe accent borders (`border-left` / `border-right`) are used on components.
+
+**app.js**
+- [OK] Calculator handoff logic: Cleanly captures `.lname` and `.lcost` strings, utilizes `.textContent` to safely strip nested spans/HTML entities (like `&times;`), and successfully targets the contact textarea via `sessionStorage`.
+- [INFO] Handoff edge case: The `acg-estimate` payload is *only* saved when clicking the specific `#sendEstimate` button (line 125). If a user builds an estimate and manually clicks the "Contact" header link, their built estimate is lost.
+
+### Prioritized Fix List
+1. **WCAG Contrast Check:** In `styles.css`, darken `--accent` (or swap to `--accent-ink`) for active nav underlines and `.bigquote` marks in light mode. Change the `.office-figure figcaption` text color to `--ink-2` to pass 4.5:1 contrast on `--surface`.
+2. **Semantic Hierarchy:** Convert `<div class="svc__name">`, `<div class="tier__name">`, and `<p class="svc-group__title">` elements to appropriate heading tags (`<h3>`, `<h4>`) across `services.html`, `pricing.html`, and `about.html`.
+3. **Mobile Nav Overflow Risk:** Add `overflow-y: auto` to `.nav__links` within the `@media (max-width: 880px)` query in `styles.css` to prevent clipping.
+4. **Markup Unification:** Standardize the varying footer `.disclaimer` text into a single unified string across all 6 HTML pages to resolve cross-page drift. Do the same for the `<head>` theme inline `<script>`.
+5. **CSS Cleanup:** Relocate the inline styles from `index.html` (line 94) and `contact.html` (line 39) into utility or block classes in `styles.css`.
+6. **House Rules:** Delete the em dash on line 2 of `styles.css`.
+7. **Handoff Improvement (Optional):** Bind the `sessionStorage.setItem` call to the `recalc` function in `app.js` so the estimate auto-saves, preventing data loss if a user navigates to the contact page manually.

projects/acg-website-showcase/multipage/design/review-gemini-radical.md

@@ -0,0 +1,48 @@
+[INFO] INDEPENDENT DESIGN & CODE REVIEW
+Verdict: The 'Blowout' concept effectively shatters boring MSP templates, but heavily overshoots "trust" into "retail clearance" territory. It requires strategic dialing back to balance radical boldness with B2B stability.
+
+---
+
+### 1. DIAL-BACK STRATEGY (Ranked)
+1. [ERROR] Overshoot: 13rem poster-typography (`radical.css:54`). Screams "event poster", refuting stability.
+   > Alternative: Cap clamp at ~5-6rem. Keep Anton, but size it for authority, not alarm.
+2. [ERROR] Overshoot: Drenched signal-orange background blocks (`radical.css:80`, `radical.css:143`). Triggers urgency/warning semantics.
+   > Alternative: Restrict orange exclusively to interactive elements/accents. Use `--ink` for section backgrounds.
+3. [WARN] Overshoot: 8.5rem blowout price numerals (`radical.css:128`). Reads as a discount warehouse.
+   > Alternative: Scale down to 3-4rem. Keep the transparent grid, but refine the typography.
+4. [WARN] Overshoot: Infinite scrolling marquee (`radical.html:36`). Associated with aggressive retail.
+   > Alternative: Replace with a static, horizontal trust bar (logos or key features) below the hero.
+5. [INFO] Overshoot: 16rem transparent ghost numerals (`radical.css:102`). Adds meaningless visual noise.
+   > Alternative: Remove entirely. Rely on the stark grid and whitespace.
+
+### 2. WHAT TO KEEP
+[OK] The `--ink` and `--bone` palette foundation: highly premium and tech-forward.
+[OK] The brutalist structural borders (`2px solid var(--bone)`): communicates transparency and zero-BS.
+[OK] Direct, no-fluff copywriting ("Everything, handled", "No games").
+[OK] JetBrains Mono for metadata: adds legitimate engineering credibility.
+
+### 3. WCAG AA CONTRAST
+[ERROR] Orange text on `--ink`: `#FF5A1F` on `#0C0A09` yields ~4.3:1. Fails AA for body text.
+   > Corrected hex: Use `--hot-2` (`#FF8A4D`) for all orange text on dark backgrounds. Confidence: High.
+[ERROR] Black on `#FF5A1F` (`rx-price--pop` unit text): `#0C0A09` on `#FF5A1F` at `opacity: 0.7` (`radical.css:131`). Fails functional contrast.
+   > Corrected hex: Remove opacity. Use solid `#0C0A09`. Confidence: High.
+[ERROR] Stroke headline (`radical.css:57`): Transparent fill with 2px stroke fails functional contrast for low-vision users. Shape is lost.
+   > Corrected hex: Replace `color: transparent;` with solid `color: #F4EDE1;` (`var(--bone)`). Confidence: High.
+[WARN] Bone-2 on `--ink`: `#B8AE9E` on `#0C0A09`. Technically passes (~7.3:1), but thin font (`radical.css:13`) makes it functionally weak.
+   > Corrected hex: Lighten to `#C9C1B5` or increase font-weight to 500. Confidence: Medium.
+
+### 4. ACCESSIBILITY
+[ERROR] Marquee data loss (`radical.html:35`): Claim: `aria-hidden="true"` is fine for decorative elements. Refutation: The values ("Since 2001", "No offshore") are not exposed to screen readers *anywhere else* in the DOM. Core value propositions are completely lost. Confidence: High.
+[WARN] Focus management (`radical.css:76`): Claim: Global `:focus-visible` outline is visible. Refutation: Uses `--hot`. For `.rx-btn--hot` placed on a `--hot` background (like the CTA section), the outline relies entirely on `outline-offset`, becoming invisible. Confidence: High.
+[OK] `prefers-reduced-motion` (`radical.css:21`): Correctly zeroes out animations.
+[OK] Decorative image (`radical.html:26`): `alt=""` and `aria-hidden="true"` correctly implemented.
+
+### 5. RESPONSIVE RISKS
+[ERROR] Layout break (`radical.css:122`): 3-column pricing grid persists down to 761px. At ~761px-950px, 8.5rem text will overflow column bounds.
+[WARN] Hover reflow (`radical.css:112`): `.rx-svc:hover` increases `padding-left: 1rem;` without initial padding compensation, causing text to abruptly jump right.
+[WARN] Viewport overflow (`radical.css:54`): `clamp(3.5rem, ...)` sets a 56px minimum. The word "picks" may exceed a 320px width viewport, triggering horizontal scroll.
+
+### 6. REAL CODE / MARKUP BUGS
+[ERROR] Negative margin clip (`radical.css:55`): `margin-left: -0.06em;` on `h1` risks clipping the first letter ("I") outside the scrollable area.
+[WARN] Inline styles (`radical.html:46`): `<div class="rx-svc-list" style="margin-top:2.5rem;">` violates structural separation.
+[INFO] Legacy prefixing (`radical.css:58`): `text-stroke` is non-standard. `-webkit-text-stroke` is sufficient for all modern engines.

projects/acg-website-showcase/multipage/design/review-gemini-verdigris.md

@@ -0,0 +1,25 @@
+[VERDICT] Verdigris Gate is structurally safe, cleanly scoped, and transitions reliably. However, it requires a minor contrast fix and a critical font-weight correction to prevent text degradation.
+
+### 1. WCAG AA Contrast
+- [ERROR] Light Primary Button: `--on-accent` (#F0F7F5) on `--accent` (#2F7A6B) yields ~4.4:1 contrast. At 1.05rem (16.8px) 600-weight, this fails the 4.5:1 requirement for normal-sized text. 
+  *Fix: Lighten `--on-accent` to `#FFFFFF` (yields 4.9:1) or darken `--accent` to `#2B7364`.*
+- [OK] Light Mode Base: Body text (10.9:1), muted text (6.4:1), and accent-ink (#1F5F52, 5.6:1) on #E9EDEA all comfortably pass.
+- [OK] Dark Mode Base: Body text, muted text (7.6:1), accent-ink (#6BC4B0, 8.5:1), and primary button (#0D1614 on #4DA896, 6.5:1) on #141A18 all pass.
+
+### 2. Typography & Faux-Bold Risk
+- [ERROR] Missing Font Weights: Fraunces and IBM Plex Mono are loaded at 400;500 but are heavily applied at 600 and 700 across headings, buttons, and pricing tiers. This will force destructive, browser-synthesized faux-bolding.
+  *Fix: Append `600;700` to both Fraunces and IBM Plex Mono in the `<link>` Google Fonts payload.*
+
+### 3. app.js Logic & Skin Swapping
+- [OK] 3-Way Cycle: Modulo logic (`(cur + 1) % SKINS.length`) safely iterates `ledger -> midnight -> verdigris` and gracefully fails to index 0 (`ledger`) on null or corrupt local storage states.
+- [OK] Image Swapping: `swapSkinImages` uses `getAttribute("src")` to correctly capture the un-resolved relative string, strictly matching `VERDIGRIS_IMG` keys. Reversal logic using `data-orig-src` is sound.
+- [WARN] Double-Download (LCP impact): Because image `src` is hardcoded in HTML, direct loads into the Verdigris skin will fetch the `orig` image first, then immediately request the Verdigris variant. 
+
+### 4. Specificity & Token Leaks
+- [OK] Token Scoping: No token leakage. `html[data-skin="verdigris"]` (0,1,1) securely overrides `:root` (0,1,0) and detaches entirely when the attribute changes.
+- [OK] Signature Elements: Override rules like `html[data-skin="verdigris"] .site-header` (0,2,1) successfully trump base class styles `.site-header` (0,1,0) without relying on `!important`.
+
+### 5. Accessibility Regressions
+- [OK] Focus Navigation: Verdigris `--accent` maintains strong visibility as an outline color (4.47:1 against paper), preserving keyboard interaction cues.
+- [INFO] Stale Static Tooltip: The static HTML `title` and `aria-label` for `#skinToggle` only declare "Paper / Midnight". 
+  *Fix: Update the initial static HTML to "Paper / Midnight / Verdigris" so pre-JS screen readers announce it accurately.*

projects/acg-website-showcase/multipage/design/review-grok-mp.md

@@ -0,0 +1,161 @@
+Reading all eight files for an independent review across the listed defect categories.
+Searching for em dashes, side-stripe patterns, and verifying assets exist.
+## Verdict
+
+**[OK] Ship-ready demo with one real handoff gap and a few UX/mobile nits.** Nav/`aria-current` are correct per page, calculator math matches published rates, assets resolve, and the normal left-click estimate flow works. I found no broken internal links and no user-facing em dashes or side-stripe accent borders.
+
+**Confidence: high** on nav/math/links; **medium** on narrow-mobile layout (CSS-only inference, not browser-tested).
+
+---
+
+## 1. Cross-page header / footer / nav
+
+**[OK] Header structure is consistent** across all six pages: same brand, six nav links, phone, theme toggle, mobile menu (`navLinks`, `navToggle`, `themeToggle`).
+
+**[OK] `aria-current="page"` is correct** on every page:
+
+| Page | Active link |
+|------|-------------|
+| `index.html:38` | Home |
+| `services.html:26` | Services |
+| `pricing.html:27` | Pricing |
+| `calculator.html:28` | Estimate |
+| `about.html:29` | About |
+| `contact.html:33` | Contact |
+
+**[WARN] Footer disclaimer copy drifts** (not broken, but inconsistent):
+
+- `index.html:152` — longest (estimator + tailored quote)
+- `about.html:112` — no pricing disclaimer at all
+- `contact.html:106` — form-not-wired note only
+
+**[INFO] Cosmetic head-script formatting** differs (`index.html` expanded vs minified on other pages). No functional impact.
+
+---
+
+## 2. Calculator → contact estimate handoff
+
+**[OK] Normal left-click path works.** Flow:
+
+```140:153:D:\ClaudeTools\projects\acg-website-showcase\multipage\js\app.js
+    var sendBtn = $("#sendEstimate");
+    if (sendBtn) {
+      sendBtn.addEventListener("click", function () {
+        // ... builds summary from #ledgerLines ...
+        try { sessionStorage.setItem("acg-estimate", summary); } catch (e) {}
+      });
+    }
+```
+
+```192:201:D:\ClaudeTools\projects\acg-website-showcase\multipage\js\app.js
+    var msg = $("#cf-msg");
+    if (msg) {
+      try {
+        var est = sessionStorage.getItem("acg-estimate");
+        if (est) {
+          msg.value = est;
+          sessionStorage.removeItem("acg-estimate");
+```
+
+- `#sendEstimate` is an `<a href="contact.html#contact">` (`calculator.html:124`)
+- Click handler is synchronous before navigation — `sessionStorage` is set in time
+- `app.js` is at end of `<body>` on `contact.html:109`, so `#cf-msg` exists before prefill runs
+- Anchor target `#contact` exists (`contact.html:43`)
+
+**[OK] JS-before/after hash jump is not a data bug.** Script runs after DOM parse; hash scroll does not block prefill.
+
+**[ERROR] Middle-click / “Open in new tab” drops the estimate.** `#sendEstimate` is a plain link; middle-click and some modifier opens navigate without firing the `click` listener, so `acg-estimate` is never written. Left-click only.
+
+**[WARN] Hash lands on section top, not the form.** `contact.html#contact` scrolls to the section (`id="contact"`), not `#cf-msg` / `#contactForm`. On desktop two-column layout, the prefilled textarea can be off-screen right; user may not see the handoff without scrolling.
+
+**[WARN] No focus management after prefill** — textarea is filled but never focused/scrolled into view.
+
+**[INFO] One-shot storage** — reload clears the estimate (`removeItem` on read). Intentional, but worth knowing.
+
+---
+
+## 3. Calculator math and stepper clamp
+
+**[OK] Math matches pricing page rates:**
+
+| Input | Rate | Source |
+|-------|------|--------|
+| GPS tiers | $19 / $26 / $39 | `app.js:99`, `pricing.html:56-82` |
+| Equipment | $25 flat | `app.js:78`, `pricing.html:94` |
+| Support | $200–$850 | `app.js:94`, `pricing.html:108-111` |
+| M365 | $14/user | `app.js:78`, `pricing.html:154` |
+| VoIP | $28/user | `app.js:78`, `pricing.html:166` |
+| Hosting | $15 / $35 / $65 | `app.js:97`, `pricing.html:141-143` |
+
+Default (22 endpoints, Pro, Standard support): **$952/mo** — arithmetic checks out.
+
+**[OK] Stepper clamp** — `clampInt` 0–500 (`app.js:80`), HTML `min="0" max="500"`, buttons use clamp + `recalc()`.
+
+**[WARN] Typing invalid numbers** — `recalc()` uses clamped value on `input`, but the visible field can still show garbage until `change` blur clamp (`app.js:136`). Totals can disagree with displayed digits briefly.
+
+---
+
+## 4. Links, assets, duplicate IDs
+
+**[OK] All internal page links resolve** — `index`, `services`, `pricing`, `calculator`, `about`, `contact`, `tel:`, `mailto:`.
+
+**[OK] Referenced images exist** under `assets/images/`: `hero.png`, `about.png`, `services.png`, `story.png`, `contact.png`.
+
+**[WARN] Duplicate `id="cta-h"`** on four pages (`index.html:137`, `services.html:88`, `pricing.html:179`, `about.html:97`). Harmless in multipage navigation; invalid if pages were ever combined.
+
+**[WARN] Shared IDs across pages** (`year`, `navLinks`, `themeToggle`, etc.) — same note; one page at a time so no runtime collision.
+
+---
+
+## 5. Light + dark contrast (new components)
+
+**[OK] Token design is deliberate** — `--ink-3` annotated AA-safe on light paper (`styles.css:14`); dark tokens mirrored (`styles.css:32-44`).
+
+**[OK] New multipage components** (active nav underline, page-head eyebrow, contact labels, CTA band, office figure) use `--ink`, `--ink-2`, `--ink-3`, `--accent-ink` — consistent with the system.
+
+**[WARN] `.calc__foot` at 0.78rem / `--ink-3`** (`styles.css:374`) — likely fine in light mode; dark-mode small muted text is the usual borderline case. Worth a quick contrast pass in browser, not a confirmed fail.
+
+**[OK] Primary buttons** — `--on-accent` on `--accent` is an intentional pairing (`styles.css:18-19, 118`).
+
+---
+
+## 6. Em dashes and side-stripe accents
+
+**[OK] No em dashes in user-facing HTML** across any of the six pages.
+
+**[WARN] Em dashes only in CSS comments** (`styles.css:2, 17`) — violates house style in source, not visible to visitors.
+
+**[OK] No forbidden side-stripe accent borders.** Only structural rules: `.calc__inputs { border-right: 1px solid var(--rule) }` (`styles.css:310`), `.tier--pop` top inset accent (`styles.css:263`). Matches DESIGN intent (no colored left/right accent stripes).
+
+---
+
+## 7. Mobile
+
+**[OK] Major breakpoints covered** — nav drawer @880px, hero/story/calc/contact/CTA stack @760–820px, trust 2-col @720px, tables scroll via `.table-wrap`.
+
+**[WARN] Calculator rows stay two-column on all widths** — `.calc__row { grid-template-columns: 1fr auto }` (`styles.css:311-312`) with no narrow override. Stepper is ~152px fixed; on ~320px viewports labels + controls may crush or overflow.
+
+**[WARN] `.svc__meta { white-space: nowrap }`** (`styles.css:251`) — on very narrow screens, right-aligned meta could overflow when not yet in stacked mobile layout.
+
+**[OK] Mobile nav** — `aria-expanded` toggles, Escape closes, link click closes drawer (`app.js:57-69`).
+
+**[ERROR] Progressive enhancement gap** — `.reveal { opacity: 0 }` (`styles.css:427`) until `app.js` adds `.in`. If JS fails, large sections stay invisible sitewide.
+
+---
+
+## Ranked top fixes
+
+| Rank | Severity | Issue | Where |
+|------|----------|-------|-------|
+| **1** | **[ERROR]** | Estimate handoff fails on middle-click / open-in-new-tab because storage write is click-only on an `<a>` | `calculator.html:124`, `app.js:140-153` |
+| **2** | **[ERROR]** | Content hidden without JS (`.reveal` starts at `opacity: 0`) | `styles.css:427-428`, all pages |
+| **3** | **[WARN]** | After handoff, user may not see prefilled message (hash → section, not form; no focus/scroll) | `calculator.html:124`, `contact.html:43-76`, `app.js:192-201` |
+| **4** | **[WARN]** | Calculator input rows don’t stack on very narrow phones | `styles.css:311-312, 375-378` |
+| **5** | **[WARN]** | Invalid stepper text vs calculated total until blur | `app.js:136-137, 156-157` |
+| **6** | **[INFO]** | Footer disclaimer text inconsistent | all footers |
+| **7** | **[INFO]** | Duplicate `id="cta-h"` across four pages | see §4 |
+| **8** | **[INFO]** | Em dashes in CSS comments only | `styles.css:2, 17` |
+
+---
+
+**Bottom line:** The multipage shell is coherent and the primary estimate workflow is sound. Fix **#1** (handoff reliability) and **#2** (no-JS visibility) first; the rest are polish. I did not modify any files per your instruction.

projects/acg-website-showcase/multipage/design/review-grok-radical.md

@@ -0,0 +1,58 @@
+**VERDICT**  
+[INFO] Radical "Blowout" poster concept (Anton 13rem, #FF5A1F drench, marquee, stroke outline, giant pricing) succeeds at raw visual arrest and hierarchy but oversteps for a Tucson MSP selling long-term trust and concierge reliability. It reads like a one-day sale flyer more than a stable partner. radical.html + radical.css reviewed in full. No modifications performed.
+
+**(1) DIAL-BACK list (ranked 1 = most damaging for trust sale)**
+
+1. [HIGH] Hero headline scale + Anton ultra-condensed at clamp(3.5rem, 16vw, 13rem) (radical.html:36, radical.css:70). 13rem on desktop and still 7-9rem on tablets feels like carnival signage, not enterprise IT. Tamer: cap at clamp(2.75rem, 7vw, 5.75rem); keep Anton for one word only or add 0.03-0.04em tracking and switch subheads to Hanken Grotesk 700.
+
+2. [HIGH] Full-bleed #FF5A1F CTA section + multiple hot buttons and pop pricing tier (radical.html:112, radical.css:175, 148, 96). Orange overload + "Talk to a human" at 10rem screams urgency/deal, erodes calm authority. Tamer: limit full-bleed hot to one primary CTA band only; use bone/ink inverted or bone-bordered buttons elsewhere; reserve solid hot for the single highest-value action.
+
+3. [MED] 26s continuous marquee on full #FF5A1F bar (radical.html:46-50, radical.css:104, 107). Perpetual motion + saturated strip reads gimmicky for a 2001-established MSP. Tamer: 48-60s duration or convert to static centered pills row; keep hot only for text if bar must remain.
+
+4. [MED] Transparent-fill -webkit-text-stroke headline on "up." (radical.html:36, radical.css:73-75). 2px bone outline with no interior fill creates thin, haloed, low-density letters that feel unfinished and hard to parse at speed. Tamer: solid bone or hot fill + 1px hot or bone underline/shadow; drop stroke entirely for body copy sizes.
+
+5. [MED] Volume and placement of hot / hot-2 accents (kickers, eyebrow, svc__n, svc__meta, price pop, cta) (radical.css:42, 67, 117, 136, 148, 175). Too many saturated hits dilute focus and hierarchy. Tamer: restrict #FF5A1F to 1-2 CTAs + one price highlight; use bone-2 or ink-2 for meta; replace most hot-2 with bone or a darker orange variant.
+
+6. [LOW] Giant ghost section numerals (16rem clamp) + 8.5rem pricing numerals (radical.css:121, 151). Poster numerals compete with actual content and make pricing feel theatrical. Tamer: ghost max 5-6rem; pricing bigs to clamp(2.5rem, 5vw, 4rem) or switch to weighted Hanken Grotesk for numerals while keeping Anton for true headlines.
+
+**(2) KEEP (moves that are genuinely strong)**
+
+- Direct "no email wall" calculator teaser and published per-endpoint grid with clear tiering and "most chosen" callout (radical.html:100-107, 76-95). Honest pricing posture is the single biggest trust signal here.
+- Service row hover + IntersectionObserver reveal (radical.html:134-140, radical.css:194-195, 131). Subtle progressive disclosure without heavy JS.
+- Mono + poster font pairing for scannability and brand lockup in header (radical.css:18-20, 51-56).
+- Sticky header, phone CTA, and immediate human contact paths without friction.
+- Self-contained file, proper lang/meta, skip link, and existing reduced-motion rule (radical.html:15, 8-12, radical.css:26-30).
+
+**(3) WCAG AA contrast failures**
+
+- Black #0C0A09 on #FF5A1F (rx-btn--hot, marquee text, rx-cta hot buttons, price pop): estimated 8-10:1+. Passes AA/AAA for large text and UI components. [OK]
+- #FF5A1F on #0C0A09 (`.hot`, rx-kicker, rx-hero__eyebrow, rx-svc__n): ~3.6-4.0:1. FAILS AA for normal text (needs 4.5:1). Passes only if treated strictly as large text. Corrected hex for reliable AA: #FF7A4D or #FF8F60 (brighter) or switch accent text to #F4EDE1 bone on dark.
+- #FF8A4D on #0C0A09 (svc__meta, some price units): ~2.8-3.2:1. FAILS AA. Corrected: #FFB57A or replace with #F4EDE1 / #CFC6B4.
+- #B8AE9E (bone-2) on #0C0A09 (rx-hero__sub, rx-svc__d, rx-price__list, footer, calc p): ~4.1-4.4:1. FAILS AA 4.5:1 for body text under ~18pt/14pt bold. Corrected: #CFC6B4 or #D8D0C0 (lighten ~10-12%).
+- -webkit-text-stroke headline (transparent fill + 2px bone): effective contrast fails. Thin outline only allows background bleed between strokes; no solid interior. Not reliably readable per WCAG for text. Fails even large-text criteria in practice. Corrected approach: solid #F4EDE1 fill + optional 1px #FF5A1F stroke or 2-3px text-shadow; never rely on stroke-only for critical headlines.
+
+**(4) Accessibility**
+
+- Marquee: aria-hidden="true" present (radical.html:46). Reduced-motion rule already kills the animation (radical.css:29). [OK] Gaps: hover-only pause (css:108) is useless on touch; content is duplicated for seamlessness but animation still runs for keyboard/screen-reader users who do not use hover. Recommend static fallback or `prefers-reduced-motion` + `aria-hidden` already good; add `role="presentation"` or convert to non-animated row for production.
+- focus-visible: global rule exists (radical.css:101) with 3px hot outline. [OK] Risk: hot outline on #FF5A1F backgrounds has insufficient contrast. No legacy :focus fallback. Test on hot CTAs; consider conditional darker/bone outline for hot elements.
+- Decorative hero image: container aria-hidden="true", img alt="", masked/grayscale + overlay (radical.html:33, radical.css:79-88). [OK] Correct for pure decoration. Mid-width (760-900px) absolute positioning could cause visual layering surprises if image ever gains meaning.
+
+**(5) Responsive risks (ranked)**
+
+- [CRITICAL] Nav collapse at 760px hides all links except phone CTA with no mobile menu or fallback (radical.css:61, radical.html:20-26). On phones/tablets users lose Work/Pricing/Estimate/Contact access.
+- [HIGH] 16vw hero type + 13vw CTA type still produce 6-9rem sizes on 700-900px widths; risk of clipping, tall first fold, and poor line wrapping (radical.css:70, 177).
+- [MED] Marquee text 1.4rem only shrinks at 480px; separators and long phrases can overflow or crowd on 320-360px (radical.css:204, 110).
+- [MED] Pricing 3-col grid + service grid changes at 760/640px are clean but the orange pop tier loses visual weight when stacked.
+- [LOW] Absolute hero art (42vw) + mask can cause text overlap or empty right gutter on 900-1100px before hiding (radical.css:90, 80-84). Body overflow-x:hidden can mask real scroll bugs.
+
+**(6) Real code bugs (severity-tagged, ranked)**
+
+- [ERROR] Stroke-only "up." headline uses non-standard `text-stroke` (radical.css:74). Only `-webkit-text-stroke` is reliable; other engines leave color:transparent text invisible or barely stroked.
+- [ERROR] Marquee relies on exact duplicate span blocks for infinite loop (radical.html:48-49). Any content edit, font timing, or resize breaks the seam.
+- [HIGH] `.marquee:hover .marquee__track` pause (radical.css:108) has no keyboard, focus, or touch equivalent. Animation cannot be stopped on mobile or by non-mouse users.
+- [MED] Service hover applies `padding-left:1rem` (radical.css:131). Causes layout shift on every hover; better to use transform or background change only.
+- [MED] Global `* { margin:0 }` + late :focus-visible (radical.css:24, 101) + reduced-motion rules are broad; some transitions on .rx-up and .rx-svc may still leak on older reduced-motion implementations.
+- [LOW] rx-ghost and stroke elements use pointer-events:none + user-select:none but remain in tab order or selection edge cases in some engines (radical.css:123, 74).
+- [LOW] Year script and IO observer are safe (radical.html:132-140). No console errors obvious from static source. Assets path and missing calculator.html are out-of-scope for this file pair.
+
+[OK] End of review. All analysis derived strictly from the two read files.

projects/acg-website-showcase/multipage/design/review-grok-verdigris.md

@@ -0,0 +1,94 @@
+Reading all four files for an independent review of the Verdigris Gate skin and skin system.
+Computing WCAG contrast ratios for Verdigris token pairs.
+Checking image paths across pages and additional contrast edge cases (small text, hover states).
+**Verdict:** Verdigris Gate is cleanly scoped and does not break ledger/midnight. Primary button and accent-text pass AA in both modes at rest. Real issues: small muted text on `surface-2` (including the gate-rail header), light-mode button hover, missing font weights 600/700, and stale skin-switcher copy. Confidence: **high** on tokens/contrast/JS; **medium** on live rendering (no browser pass).
+
+---
+
+### Ranked fix list
+
+**1. [ERROR] `--ink-3` fails AA normal text on `surface-2` (both modes)**  
+`styles.css:91,107` — Header uses `surface-2` (`styles.css:118-119`); `.brand__since` is `ink-3` at 0.66rem (`styles.css:233-234`). Also hits 0.72–0.78rem hints/captions on `surface-2`.
+
+| Mode | Pair | Ratio | Need |
+|------|------|-------|------|
+| Light | `#5C6B65` / `#DFE5E1` | 4.39:1 | 4.5:1 |
+| Dark | `#7A8A84` / `#25302C` | 3.77:1 | 4.5:1 |
+
+**Corrected hex:** light `--ink-3: #4A5853` (5.84:1 on `#DFE5E1`, 6.32:1 on paper); dark `--ink-3: #8FA098` (4.97:1 on `#25302C`, 5.78:1 on surface).
+
+---
+
+**2. [ERROR] Font loading vs CSS weights — faux-bold on Verdigris**  
+`index.html:11` loads `Fraunces:wght@400;500` and `IBM Plex Mono:wght@400;500`, but CSS uses **600–700**:
+
+- Fraunces: `h1–h4`, `.btn`, `.brand__mark` at 600–700 (`styles.css:188-191,203,227,270`)
+- IBM Plex Mono: `.tier__price`, `.calc__total .tnum`, `.trust__num` at 600–700 (`styles.css:304,360,459`)
+
+Source Sans 3 loads 400;600 but `.nav__phone` uses `font-weight: 500` (`styles.css:240`) → synthesized medium.
+
+**Fix:** load `Fraunces:wght@400;500;600;700`, `IBM Plex Mono:wght@400;500;600;700`, add `500` to Source Sans 3 (or change phone to 600).
+
+---
+
+**3. [WARN] Light primary button hover drops below AA**  
+`styles.css:211` — `filter: brightness(1.05)` on `#2F7A6B` → `#F0F7F5` contrast **4.34:1** (need 4.5:1). Dark hover stays fine (7.05:1).
+
+**At-rest button passes:** light `#F0F7F5` / `#2F7A6B` = 4.69:1; dark `#0D1614` / `#4DA896` = 6.44:1.
+
+**Fix options:** drop hover brighten; darken hover fill to `#2A6F61` (5.45:1); or light `--on-accent: #FFFFFF` (5.10:1 rest, 4.60:1 hover).
+
+---
+
+**4. [WARN] `swapSkinImages` — path fragility + duplicate art**  
+`app.js:63-69`
+
+- Lookup is exact string on `data-orig-src`; resolved URLs, relative variants, or `?cache` params miss the map and stay on ledger art.
+- `story.png` → `verdigris/hero.png` (`app.js:61`) duplicates hero latch on about (`about.html:66`) — likely unintentional; no dedicated `story` asset.
+- `$$("img")` is broad but safe: non-mapped images restore via `orig`; `data-orig-src` caching is correct for the 3-skin cycle.
+- Invalid/missing `data-skin` → `indexOf` = -1 → cycles to `ledger` (`app.js:86-87`) — OK but silent.
+
+---
+
+**5. [WARN] Skin switcher HTML still 2-skin**  
+`index.html:46`, `calculator.html:33` — `title="Switch skin: Paper / Midnight"` while JS cycles three skins (`app.js:53-54`). `aria-label` updates at runtime; static `title` does not.
+
+---
+
+**6. [INFO] Double-rule inset frames — mostly fine; rate-card frame weak**  
+`styles.css:124-127` — `inset 4px paper + 5px rule` on `.calc__shell`, `.rate-card`, `.contact__form`.
+
+- `.calc__shell` / `.rate-card` have `overflow: hidden` (`styles.css:352,399`) — no scroll bleed.
+- `.contact__form` has no overflow rule; inset shadows are paint-only — low risk.
+- On `.rate-card`, child tiers fill the grid and likely **cover** most of the inset ring — frame may barely show. Calculator/contact are the visible wins.
+
+---
+
+**7. [INFO] Gate-rail header grain — no overflow concern**  
+`styles.css:118-122` — Opaque `surface-2` + 3px repeating gradient; `backdrop-filter: none` correctly drops ledger glass. Subtle moiré possible on low-DPI; not a layout issue.
+
+---
+
+**8. [OK] Accent-as-text and muted body copy**  
+Light: `--accent-ink #1F5F52` 6.31:1 on paper; `--ink-2 #3F4F49` 7.32:1 on paper.  
+Dark: `--accent-ink #6BC4B0` 8.52:1 on paper; `--ink-2 #A8B5AF` 8.31:1 on paper.  
+`::selection` accent/on-accent: 4.69:1 light, 6.44:1 dark.
+
+---
+
+**9. [OK] Ledger / Midnight isolation**  
+Verdigris tokens and treatments are scoped to `html[data-skin="verdigris"]` (`styles.css:81-138`). `ledger` falls through to `:root`; `midnight` overrides stay separate (`styles.css:49-78`). Extra font families in the shared Google Fonts URL add weight for all skins but do not alter their palettes or typography tokens. Image swap only runs for `verdigris`; ledger/midnight always get `orig` src.
+
+---
+
+### Summary table (requested checks)
+
+| Check | Result |
+|-------|--------|
+| Primary button AA | Pass at rest; light hover fail |
+| Accent-as-text | Pass both modes |
+| Muted text | `--ink-2` pass; `--ink-3` fail on `surface-2` |
+| Font weights | Fail — load 600/700 (and 500 for Source Sans) |
+| Image swap | Logic sound; path/exact-match + story duplicate |
+| Double-rule / grain | No overflow; rate-card frame may be invisible |
+| Other skins | Not broken |

projects/acg-website-showcase/multipage/design/vision-gemini-verdigris.md

@@ -0,0 +1,40 @@
+  {"rect": [861, 145, 874, 481], "text": "Migrations, licensing, and email that is configured, secured, and\nsupported."},
+  {"rect": [850, 808, 854, 895], "text": "from $2 /mailbox"},
+  {"rect": [894, 104, 899, 114], "text": "05"},
+  {"rect": [895, 145, 904, 283], "text": "Business Phones"},
+  {"rect": [909, 145, 922, 481], "text": "Cloud phone systems with mobile and desktop apps, porting, and no\nusage surprises."},
+  {"rect": [898, 819, 903, 895], "text": "from $22 /user"},
+  {"rect": [943, 104, 947, 114], "text": "06"},
+  {"rect": [943, 145, 952, 311], "text": "Web & Email Hosting"},
+  {"rect": [957, 145, 971, 481], "text": "Managed hosting with free SSL, daily backups, and real humans on\nsupport."},
+  {"rect": [946, 830, 951, 895], "text": "from $15 /mo"},
+  {"rect": [989, 104, 995, 199], "text": "See all services →"}, "text": "See all services →"},
+  {"rect": [1050, 131, 1054, 434], "text": "PUBLISHED, NOT \"CALL FOR QUOTE\" / PER ENDPOINT"},
+  {"rect": [1067, 104, 1088, 581], "text": "Pricing with nothing hidden"},
+  {"rect": [1098, 104, 1118, 481], "text": "You pay for exactly the computers you have. No rounding you up into a\nbigger package tier."},
+  {"rect": [1147, 120, 1157, 214], "text": "GPS-Basic"},
+  {"rect": [1160, 120, 1180, 175], "text": "$19"},
+  {"rect": [1170, 191, 1175, 280], "text": "/ endpoint / mo"},
+  {"rect": [1189, 120, 1195, 340], "text": "Essential monitoring for small, simple environments."},
+  {"rect": [1135, 564, 1140, 626], "text": "MOST CHOSEN"},
+  {"rect": [1147, 384, 1157, 463], "text": "GPS-Pro"},
+  {"rect": [1160, 384, 1180, 439], "text": "$26"},
+  {"rect": [1170, 455, 1175, 544], "text": "/ endpoint / mo"},
+  {"rect": [1189, 384, 1195, 602], "text": "Comprehensive protection for growing businesses."},
+  {"rect": [1147, 648, 1157, 781], "text": "GPS-Advanced"},
+  {"rect": [1160, 648, 1180, 703], "text": "$39"},
+  {"rect": [1170, 719, 1175, 808], "text": "/ endpoint / mo"},
+  {"rect": [1189, 648, 1195, 829], "text": "Enterprise-grade security and compliance."},
+  {"rect": [1235, 104, 1240, 246], "text": "Full pricing breakdown →"},
+  {"rect": [1235, 261, 1240, 370], "text": "Build an estimate →"},
+  {"rect": [1309, 104, 1330, 426], "text": "Let's talk, no pitch."},
+  {"rect": [1340, 104, 1360, 481], "text": "Tell us what is frustrating you, and we'll give you honest\nfeedback. Even if that is \"your current setup is fine, here is one\nthing to fix.\""},
+  {"rect": [1365, 652, 1370, 757], "text": "Talk to a human →"},
+  {"rect": [1365, 801, 1370, 880], "text": "520.304.8300"},
+  {"rect": [1412, 104, 1417, 497], "text": "© 2026 Arizona Computer Guru . Protecting Tucson businesses since 2001"},
+  {"rect": [1412, 683, 1417, 750], "text": "520.304.8300"},
+  {"rect": [1412, 757, 1417, 762], "text": "."},
+  {"rect": [1412, 768, 1417, 895], "text": "info@azcomputerguru.com"},
+  {"rect": [1433, 104, 1445, 895], "text": "Local demonstration build of a proposed azcomputerguru.com (multipage). Pricing reflects published GPS rates and is illustrative for the estimator; a real quote\nis tailored to your environment. The contact form is not wired to a mailbox. Photography is representational."}
+]
+```