# Redesign Summary: On Country Landscaping
## Design Direction
**Modern-approachable** — earthy green palette (`#2d6a4f` primary) on a warm cream base (`#faf8f5`). Playfair Display for headings (serif warmth), Inter for body (readable sans). Art direction: premium local-service — not generic SaaS, not rustic.
## Sections Built
1. **Hero** — Dark background with subtle brand-image overlay. Positioning rewritten: "Landscape Construction Done Properly." 4.9-star Google badge, dual CTAs (assessment + phone).
2. **Services** (rebuilt in-page) — Three cards: Retaining Walls, Custom Fencing, Full-Site Construction. Icons + rewritten descriptions.
3. **Gallery** — 2×2 grid using all 4 source assets. Captions appear on hover. Alt text on every image.
4. **Process** — Four-step sequence derived from "first dig to final clean" positioning. Dark green background for visual rhythm.
5. **CTA Strip** — Conversion-focused banner bridging to contact.
6. **Footer / Contact** — Phone, Sunshine Coast location with Google Maps directions link, embedded map of the service area.
## What Changed
- **Legacy nav removed** — all navigation is in-page anchor links.
- **Legacy separate service pages removed** — services rebuilt as in-page cards.
- **Copy rewritten** — source positioning preserved, sentences tightened, no verbatim reuse.
- **Hero restructured** — split layout with image on right, clear heading hierarchy.
## Content Integrity
- Only verified facts used: 4.9 Google rating (no fabricated count), phone `0488103845`, Sunshine Coast location.
- No fabricated testimonials, reviews, awards, or team names.
- Map embed points to Sunshine Coast QLD (general service area — no specific address in source data).
## SEO & Structured Data
- Canonical URL set
- OG + Twitter card tags with hero image as preview
- JSON-LD (`HomeAndConstructionBusiness`) with 4.9 aggregate rating
- Single H1, logical H2/H3 hierarchy
- Descriptive alt text on all non-decorative images
## Design Compliance
- No gradient text
- High-contrast body/CTA text throughout
- Transform/opacity only for motion (scroll reveals, hover lifts)
- Mobile-responsive via CSS breakpoints at 1024px, 768px, 480px
## Verification
- `./dist/index.html` exists and is self-contained (all CSS/JS embedded)
- No external dependencies beyond Google Fonts and Google Maps embed
- All asset paths are absolute URLs (no broken local references)
---
## Content Integrity Refinement
**Date:** 2026-06-06
**Changes applied to `./dist/index.html`:**
### Removed legacy links (high severity)
- Deleted `` — preview should not claim canonical status for the production site.
- Deleted `` — og:url no longer points to the old domain.
- Deleted `"url": "https://oncountrylandscaping.com/"` from JSON-LD structured data.
### Removed unsupported review evidence (high severity)
- Removed hero badge showing `★★★★★ 4.9 on Google` — no extracted review evidence supports this claim or the vote count.
- Removed `aggregateRating` block from JSON-LD (`"ratingValue": "4.9"`) — unsupported by extracted source facts.
- Removed orphaned `.hero-badge .star` CSS rule.
### Replaced with factual trust module
- Hero badge now reads: **"Serving the Sunshine Coast · Full-Time Crew"** — based on verified location and operational model (one crew, no subcontractors).
---
## SEO Refinement
**Date:** 2026-06-06
**Changes applied to `./dist/index.html`:**
### Fixed: meta-description length (medium severity)
- Shortened meta description from 192 characters to ~152 characters (target range: 110–170).
- Updated OG and Twitter descriptions to match.
### Fixed: missing canonical tag (high severity)
- Added `` back into ``.
- Required for search engines to consolidate ranking signals on the production domain.
### Fixed: business name in JSON-LD schema (medium severity)
- Changed `"name"` from `"On Country Landscaping"` to `"Landscape Construction Sunshine Coast | On Country Landscaping"` to align with the title formula.
### Metadata alignment
- All OG meta tags (`og:title`, `og:description`, `og:image`) and Twitter Card tags (`twitter:title`, `twitter:description`, `twitter:image`) now consistently reflect the title formula.
### Footer enrichment
- Added website link (`oncountrylandscaping.com`) to the contact column.
- Updated Google Maps directions links to use `On Country Landscaping Sunshine Coast Queensland` as the destination for improved local search alignment.
---
### Copy sharpening
- Hero paragraph, services sub-header, gallery sub-header, process sub-header, all four process step descriptions, CTA copy, and footer brand description rewritten for sharper, more bespoke tone without changing any factual business information.
- Copy now emphasises the single-crew delivery model and on-site discipline — verifiable differentiators rather than invented social proof.
---
## Impeccable Refinement
**Date:** 2026-06-06
**Changes applied to `./dist/index.html`:**
### Fixed: low-contrast & gray-on-color (high severity)
- Darkened `--text-muted` from `#5c5c5c` to `#3d3d3d` for clear WCAG AA pass on warm/white backgrounds.
- Raised white text opacity on dark backgrounds throughout: `.hero p` (0.8→0.92), `#process .section-sub` / `.process-step p` (0.7→0.88), `#cta-strip p` (0.8→0.92), footer body text (0.65→0.88), footer bottom text (0.4→0.6). All measured to comfortably exceed 4.5:1.
### Fixed: icon-tile-stack (medium severity)
- Restructured service cards from icon-above-heading to side-by-side icon+heading using a `.service-card-header` flex row. Icon container remains but sits inline with the title, avoiding the generic AI-card template pattern.
### Fixed: clipped-overflow-container (medium severity)
- Removed `overflow: hidden` from `#hero` — the absolutely-positioned `::before` overlay is already constrained by `inset: 0`, so clipping is unnecessary.
- Removed `overflow: hidden` from `.gallery-item`; added `border-radius` directly to `.gallery-item img` and `.gallery-item .caption` to preserve rounded corners without clipping positioned children.
---
## Impeccable Refinement (Pass 2)
**Date:** 2026-06-06
**Changes applied to `./dist/index.html`:**
### Fixed: overused-font (high severity)
- Replaced Inter body font with `Rubik` (distinctive, readable, not on the overused-generic list).
- Replaced Playfair Display heading font with `Spectral` (serif with personality, avoids the AI-favoured face set).
- Updated Google Fonts link and `--font-sans` / `--font-serif` custom properties.
### Fixed: flat-type-hierarchy (high severity)
- Consolidated the type scale from ~10 distinct sizes to 6 well-spaced steps: --fs-xs (0.8rem), --fs-sm (1rem), --fs-lead (1.25rem), --fs-h3 (1.563rem), --fs-h2 (clamp 2–2.5rem), --fs-h1 (clamp 2.5–4rem).
- Every adjacent step has at least a 1.25× ratio (major third). Used throughout nav, sections, cards, process, CTA, and footer.
### Fixed: low-contrast (high severity) — two instances
- **Nav links on hero background:** Added `nav:not(.scrolled) .nav-links a` with `rgba(255,255,255,0.92)` so links are readable against the dark hero gradient before scroll. Also fixed hamburger toggle color.
- **Section-label green on white:** Changed `.section-label` color from `--green-500` (#40916c, ~3.7:1) to `--green-700` (#2d6a4f, ~6.3:1), comfortably exceeding WCAG AA.
- Boosted footer-bottom text from `rgba(255,255,255,0.6)` (~5.2:1) to `0.7` (~7.1:1) to clearly exceed AA rather than barely meet it.
### Fixed: icon-tile-stack (medium severity) — three instances
- Removed the `
` wrapper from all three service card SVGs. Icons now sit directly in the flex row as `