Build against chobble-template main; compact, corporate theme refresh

_includes/navigation-start.html

@@ -1,5 +1,5 @@
 <a class="nav-logo" href="/" aria-label="PIPA Testing home">
-  <img src="/images/brand-logo.png" alt="">
+  <img src="/images/brand-mark.png" alt="">
   <span class="nav-logo__text">
     PIPA Testing
     <span class="nav-logo__tag">Inspections &middot; Repairs</span>

css/theme.scss

@@ -45,9 +45,16 @@
   --body-background: #f6f3f1;
   --body-background-alt: #efeae8;
 
+  // Compact, corporate rhythm: pull section padding in from the stock 96px.
+  // --space-3xl feeds every section-padding-y-* variable in the design system,
+  // so trimming it here tightens the whole vertical rhythm in one move.
+  --space-3xl: 4rem;
+
   --border: 1px solid #ead9d4;
-  --border-radius: 6px;
-  --border-radius-small: 3px;
+
+  // Sharper corners read more corporate than the stock soft radii.
+  --border-radius: 4px;
+  --border-radius-small: 2px;
   --box-shadow:
     0 1px 2px rgb(26 26 26 / 5%),
     0 8px 24px rgb(26 26 26 / 8%);
@@ -60,6 +67,7 @@
 
   --link-decoration: none;
   --link-decoration-hover: underline;
+  --link-decoration-style: solid;
 
   --list-marker-content: "▸  ";
   --list-marker-color: #eb4b36;
@@ -89,8 +97,8 @@ body::before {
   z-index: -1;
   inset: 0;
   background:
-    url("/images/brand-logo.png") no-repeat right -6rem bottom -6rem / 32rem auto;
-  opacity: 0.04;
+    url("/images/brand-mark.png") no-repeat right -4rem bottom -5rem / 24rem auto;
+  opacity: 0.035;
   pointer-events: none;
 }
 
@@ -145,10 +153,24 @@ body::before {
     align-items: center;
     gap: 1.5rem;
 
+    // Crisp white corporate header bar: a thin brand rule along the top,
+    // a clean white field and a soft shadow lifting it off the page.
+    background: #ffffff;
+    border-top: 3px solid var(--color-link);
+    box-shadow: var(--shadow-sm);
+    padding-inline: 1.25rem;
+
+    // Tighten the menu so all nine items hold a single line on desktop
+    // instead of spilling onto an awkward second row.
     > ul {
       flex: 0 1 auto;
+      flex-wrap: wrap;
       justify-content: flex-end;
       align-items: center;
+      gap: 0 0.95rem;
+      font-size: 0.92rem;
+      font-weight: 500;
+      letter-spacing: 0.01em;
     }
   }
 }
@@ -173,15 +195,15 @@ body::before {
   img {
     display: block;
     width: auto !important;
-    height: 44px !important;
+    height: 52px !important;
     max-width: none !important;
     aspect-ratio: auto !important;
     background: none !important;
   }
 
   picture {
     display: block;
-    height: 44px;
+    height: 52px;
   }
 
   picture img {
@@ -218,9 +240,11 @@ body::before {
   font-family: var(--font-family-heading);
 }
 
-// Quiet hover lift on cards and buttons.
+// Quiet hover lift on the feature cards (and a soft transition on buttons).
+// Scoped to .feature deliberately: a broad `article:hover` also caught the
+// <article class="stack"> wrapper on every split block, so hovering body
+// prose lifted and shadowed the whole text column.
 @media (prefers-reduced-motion: no-preference) {
-  .design-system article,
   .design-system .btn,
   .design-system button,
   .design-system .feature,
@@ -232,8 +256,7 @@ body::before {
       border-color 0.2s ease;
   }
 
-  .design-system .feature:hover,
-  .design-system article:hover {
+  .design-system .feature:hover {
     transform: translateY(-2px);
     box-shadow: var(--shadow-md);
   }
@@ -249,3 +272,31 @@ a {
 table thead {
   background-color: var(--color-tint);
 }
+
+// Eyebrow labels — the small subtitle that sits above split headings
+// (e.g. "BS EN 14960:2019", "Meet Dave Morris") reads as a brand-red,
+// tracked label rather than muted grey: a classic corporate section cue.
+.design-system .split .stack > .text-muted:first-child,
+.design-system .split-callout .stack > .text-muted:first-child {
+  color: var(--color-link);
+  font-family: var(--font-family-body);
+  font-size: 0.72rem;
+  font-weight: 600;
+  letter-spacing: 0.12em;
+  text-transform: uppercase;
+}
+
+// Feature cards — square them off to match the sharper corporate radius
+// and top each one with a thin brand rule so the grid reads as a tidy,
+// structured row rather than soft floating tiles.
+.design-system .feature {
+  border-radius: var(--border-radius);
+  border-top: 2px solid var(--color-link);
+}
+
+// Buttons — a hair of tracking and weight makes the calls-to-action feel
+// deliberate and on-brand.
+.design-system .btn {
+  font-weight: 600;
+  letter-spacing: 0.01em;
+}

package.json

@@ -21,12 +21,5 @@
 		"lint": "bunx @biomejs/biome check --config-path=biome.json --error-on-warnings scripts/",
 		"lint:fix": "bunx @biomejs/biome check --config-path=biome.json --write scripts/",
 		"cpd": "bunx jscpd"
-	},
-	"imports": {
-		"#fp": "@chobble/js-toolkit/fp",
-		"#fp/*": "@chobble/js-toolkit/fp/*"
-	},
-	"devDependencies": {
-		"@chobble/js-toolkit": "file:./chobble-template/packages/js-toolkit"
 	}
 }

pages/about.md

@@ -1,6 +1,5 @@
 ---
 permalink: /about/
-layout: design-system-base.html
 name: About Dave
 meta_title: About Dave Morris - RPII Inspector | PIPA Testing
 meta_description: Meet David (Dave) Morris, the RPII-accredited PIPA inspector behind Monster Event Hire. Inflatable inspections, repairs and RPII courses across Hampshire, Surrey, Sussex and the UK.

pages/contact.md

@@ -1,6 +1,5 @@
 ---
 permalink: /contact/
-layout: design-system-base.html
 name: Contact
 meta_title: Contact Dave Morris | PIPA Testing
 meta_description: Get in touch with Dave Morris (RPII inspector) to book a PIPA test, standard test, PAT test, RPII course or inflatable repair. Phone, email or use the contact form.

pages/equipment-sales.md

@@ -1,6 +1,5 @@
 ---
 permalink: /equipment-sales/
-layout: design-system-base.html
 name: Equipment Sales
 meta_title: Inflatable Anchor Stakes, Barrier Fencing & Repair Kits | PIPA Testing
 meta_description: Compliant 16mm anchor stakes, orange barrier fencing and bouncy castle repair kits available from Dave Morris. Phone or email to order.

pages/home.md

@@ -1,6 +1,5 @@
 ---
 permalink: "/"
-layout: design-system-base.html
 name: Home
 meta_title: PIPA Testing - Inflatable Inspections, RPII Courses & Repairs
 meta_description: Inflatable inspections, PIPA tests, BS EN 14960:2019 standard tests, PAT testing, RPII operator courses and on-site repairs by Dave Morris (RPII-accredited). Hampshire, Surrey, Sussex and across the UK.

pages/inflatable-repairs.md

@@ -1,6 +1,5 @@
 ---
 permalink: /inflatable-repairs/
-layout: design-system-base.html
 name: Inflatable Repairs
 meta_title: Inflatable Repairs - Anchors, Stitching, Zips, Tubes | PIPA Testing
 meta_description: Full repair workshop for inflatables run by Dave Morris - new anchors, wall ties, bed re-stitches, inflation tube extensions and zip repairs. Many repairs done on-site.

pages/not-found.md

@@ -1,14 +1,15 @@
 ---
 permalink: /bunnycdn_errors/404.html
-layout: design-system-base.html
 name: Not Found
 meta_title: Not Found
 meta_description:
 no_index: true
 blocks:
   - type: hero
-    name: Page not found
-    lead: That page isn't here, either because the link's gone stale or the URL was typed wrong. Head back to the homepage and try from there.
+    content: |
+      # Page not found
+
+      That page isn't here, either because the link's gone stale or the URL was typed wrong. Head back to the homepage and try from there.
     buttons:
       - text: Back to homepage
         href: /

pages/pipa-testing.md

@@ -1,6 +1,5 @@
 ---
 permalink: /pipa-testing/
-layout: design-system-base.html
 name: PIPA Testing
 meta_title: PIPA Testing for Inflatables | Dave Morris RPII Inspector
 meta_description: PIPA tests carried out personally by Dave Morris, an RPII-accredited inspector, to BS EN 14960:2019. Tags, certificates and full pricing.

pages/rpii-courses.md

@@ -1,6 +1,5 @@
 ---
 permalink: /rpii-courses/
-layout: design-system-base.html
 name: RPII Courses
 meta_title: RPII Operating & Attendant Courses | PIPA Testing
 meta_description: RPII Operating and Attendant courses run by Dave Morris. On completion, operators and attendants are added to the RPII Register of Safe Operators and Attendants for 3 years.

pages/safety.md

@@ -1,6 +1,5 @@
 ---
 permalink: /safety/
-layout: design-system-base.html
 name: Safety
 meta_title: Inflatable Safety & the PIPA Scheme | PIPA Testing
 meta_description: Why every bouncy castle and inflatable should carry a current PIPA tag, and what the PIPA scheme delivers for operators and the public. Inspections by RPII-accredited inspector Dave Morris.

pages/standard-test.md

@@ -1,6 +1,5 @@
 ---
 permalink: /standard-test/
-layout: design-system-base.html
 name: Standard Test
 meta_title: Standard Inflatable Test BS EN 14960:2019 | PIPA Testing
 meta_description: Annual inspections for inflatables to BS EN 14960:2019 by Dave Morris, an RPII-accredited inspector. Mobile service across Hampshire, Surrey, Sussex and the UK.

pages/thank-you.md

@@ -1,15 +1,16 @@
 ---
 permalink: /thank-you/
-layout: design-system-base.html
 name: Thank You
 meta_title: Thank You
 meta_description:
 navigationParent: Contact
 no_index: true
 blocks:
   - type: hero
-    name: Thank you
-    lead: Your message has been sent, and we'll be in touch as soon as Dave is back at his desk.
+    content: |
+      # Thank you
+
+      Your message has been sent, and we'll be in touch as soon as Dave is back at his desk.
     buttons:
       - text: Back to homepage
         href: /

scripts/consts.js

@@ -25,5 +25,6 @@ export const sourceExcludes = [
   "old_site",
   "chobble-template",
   "CLAUDE.md",
+  "VOICE.md",
   ...(process.env.PLACEHOLDER_IMAGES === "1" ? ["images"] : []),
 ];

scripts/precommit.js

@@ -1,30 +1,46 @@
 #!/usr/bin/env bun
 
 /**
- * Precommit hook - runs lint, copy-paste detection, and build.
+ * Precommit hook - runs lint:fix, copy-paste detection, and build.
  * Use --verbose flag to see full output from all checks.
  */
 
-import {
-  COMMON_STEPS,
-  runSteps,
-} from "@chobble/js-toolkit/code-quality/runner";
-
 const verbose = process.argv.includes("--verbose");
 
-const buildStep = { name: "build", cmd: "bun", args: ["run", "build"] };
+const steps = [
+  { name: "lint:fix", cmd: ["bun", "run", "lint:fix"] },
+  { name: "cpd", cmd: ["bun", "run", "cpd"] },
+  { name: "build", cmd: ["bun", "run", "build"] },
+];
 
-const steps = [COMMON_STEPS.lintFix, COMMON_STEPS.cpd, buildStep];
+const runStep = (step) => {
+  console.log(`\n▶ ${step.name}`);
+  const proc = Bun.spawnSync(step.cmd, {
+    stdio: verbose
+      ? ["inherit", "inherit", "inherit"]
+      : ["ignore", "pipe", "pipe"],
+  });
+  const ok = proc.exitCode === 0;
+  if (!ok && !verbose) {
+    process.stdout.write(proc.stdout?.toString() ?? "");
+    process.stderr.write(proc.stderr?.toString() ?? "");
+  }
+  console.log(ok ? `✓ ${step.name} passed` : `✗ ${step.name} failed`);
+  return ok;
+};
 
 console.log(
   verbose
     ? "Running precommit checks (verbose)...\n"
     : "Running precommit checks...",
 );
 
-runSteps({
-  steps,
-  verbose,
-  title: "PRECOMMIT SUMMARY",
-  rootDir: process.cwd(),
-});
+let failed = 0;
+for (const step of steps) {
+  if (!runStep(step)) failed += 1;
+}
+
+console.log("\n=== PRECOMMIT SUMMARY ===");
+console.log(failed === 0 ? "All checks passed." : `${failed} check(s) failed.`);
+
+process.exit(failed === 0 ? 0 : 1);