From ea94d309864dd374f73acbf8026da82de4ee2f3c Mon Sep 17 00:00:00 2001
From: David Evans <xd.davidevans@gmail.com>
Date: Fri, 27 Feb 2026 15:28:23 +0000
Subject: [PATCH 1/2] data viz page

---
 app/views/current/search-results-viz-2.html | 856 -----------------
 app/views/current/search-results-viz.html   | 988 ++++++++------------
 app/views/current/search.html               |   2 +-
 app/views/index.html                        |   2 +-
 4 files changed, 414 insertions(+), 1434 deletions(-)
 delete mode 100644 app/views/current/search-results-viz-2.html

diff --git a/app/views/current/search-results-viz-2.html b/app/views/current/search-results-viz-2.html
deleted file mode 100644
index 38cfeac..0000000
--- a/app/views/current/search-results-viz-2.html
+++ /dev/null
@@ -1,856 +0,0 @@
-{% extends prototypeVersion + '/layouts/layout-signed-in.html' %}
-
-{% set pageName = "Search medical technologies - Compass" %}
-{% set serviceHeader = "Compass" %}
-
-{% block beforeContent %}
-{% from "breadcrumb/macro.njk" import breadcrumb %}
-
-{{ breadcrumb({
-  items: [
-    {
-      href: "/",
-      text: "Home"
-    }
-  ],
-  href: "#",
-  text: "Search results"
-}) }}
-{% endblock %}
-
-{% block content %}
-
-<div class="nhsuk-grid-row">
-  <div class="nhsuk-grid-column-full">
-    <h1 class="nhsuk-heading-l">Viewing all data for category "Wound care"</h1>
-  </div>
-</div>
-
-
-    <!-- ═══════════════════════════════════════════
-         DATA VIZ SECTION
-         ═══════════════════════════════════════════ -->
-    <div class="nhsuk-grid-row nhsuk-u-margin-bottom-6">
-      <div class="nhsuk-grid-column-full">
-
-        <hr class="nhsuk-u-margin-top-0 nhsuk-u-margin-bottom-5">
-        <p class="nhsuk-body-l nhsuk-u-margin-bottom-5">18 NHS trusts have experience with products in this category.</p>
-
-        <div class="app-dataviz-grid">
-
-          <!-- ── Chart 1: Supplier market share ───────────── -->
-          <div class="nhsuk-card">
-            <div class="nhsuk-card__content">
-              <h3 class="nhsuk-heading-s nhsuk-u-margin-bottom-1">Supplier market share</h3>
-              <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-4">Based on number of products procured across NHS trusts</p>
-
-              <div class="app-pie-wrap">
-                <svg class="app-pie-svg" width="140" height="140" viewBox="0 0 140 140" aria-hidden="true">
-                  <!-- MedTech Innovations: 34% -->
-                  <path d="M70 70 L70 10 A60 60 0 0 1 124.6 85 Z" fill="#005eb8"/>
-                  <!-- Global Medical Supplies: 24% -->
-                  <path d="M70 70 L124.6 85 A60 60 0 0 1 60.5 129.4 Z" fill="#007f3b"/>
-                  <!-- CareTech Solutions: 18% -->
-                  <path d="M70 70 L60.5 129.4 A60 60 0 0 1 13.2 94.1 Z" fill="#ffb81c"/>
-                  <!-- Pain Management Tech: 14% -->
-                  <path d="M70 70 L13.2 94.1 A60 60 0 0 1 10.5 46.0 Z" fill="#da291c"/>
-                  <!-- Others: 10% -->
-                  <path d="M70 70 L10.5 46.0 A60 60 0 0 1 70 10 Z" fill="#aeb7bd"/>
-                  <!-- Centre hole -->
-                  <circle cx="70" cy="70" r="32" fill="#fff"/>
-                  <text x="70" y="66" text-anchor="middle" font-size="18" font-weight="700" fill="#212b32">143</text>
-                  <text x="70" y="80" text-anchor="middle" font-size="10" fill="#768692">products</text>
-                </svg>
-
-                <div class="app-supplier-legend">
-                  <div class="app-supplier-legend__item">
-                    <div class="app-supplier-legend__swatch" style="background:#005eb8;"></div>
-                    <div class="app-supplier-legend__body">
-                      <p class="nhsuk-body-s nhsuk-u-margin-bottom-0"><strong>MedTech Innovations</strong></p>
-                      <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-1">34% · 49 products</p>
-                      <div class="app-supplier-bar-track"><div class="app-supplier-bar-fill" style="width:100%;background:#005eb8;"></div></div>
-                    </div>
-                  </div>
-                  <div class="app-supplier-legend__item">
-                    <div class="app-supplier-legend__swatch" style="background:#007f3b;"></div>
-                    <div class="app-supplier-legend__body">
-                      <p class="nhsuk-body-s nhsuk-u-margin-bottom-0"><strong>Global Medical Supplies</strong></p>
-                      <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-1">24% · 34 products</p>
-                      <div class="app-supplier-bar-track"><div class="app-supplier-bar-fill" style="width:71%;background:#007f3b;"></div></div>
-                    </div>
-                  </div>
-                  <div class="app-supplier-legend__item">
-                    <div class="app-supplier-legend__swatch" style="background:#ffb81c;"></div>
-                    <div class="app-supplier-legend__body">
-                      <p class="nhsuk-body-s nhsuk-u-margin-bottom-0"><strong>CareTech Solutions</strong></p>
-                      <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-1">18% · 26 products</p>
-                      <div class="app-supplier-bar-track"><div class="app-supplier-bar-fill" style="width:53%;background:#ffb81c;"></div></div>
-                    </div>
-                  </div>
-                  <div class="app-supplier-legend__item">
-                    <div class="app-supplier-legend__swatch" style="background:#da291c;"></div>
-                    <div class="app-supplier-legend__body">
-                      <p class="nhsuk-body-s nhsuk-u-margin-bottom-0"><strong>Pain Management Tech</strong></p>
-                      <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-1">14% · 20 products</p>
-                      <div class="app-supplier-bar-track"><div class="app-supplier-bar-fill" style="width:41%;background:#da291c;"></div></div>
-                    </div>
-                  </div>
-                  <div class="app-supplier-legend__item">
-                    <div class="app-supplier-legend__swatch" style="background:#aeb7bd;"></div>
-                    <div class="app-supplier-legend__body">
-                      <p class="nhsuk-body-s nhsuk-u-margin-bottom-0"><strong>Others</strong></p>
-                      <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-1">10% · 14 products</p>
-                      <div class="app-supplier-bar-track"><div class="app-supplier-bar-fill" style="width:29%;background:#aeb7bd;"></div></div>
-                    </div>
-                  </div>
-                </div>
-              </div>
-
-            </div>
-          </div>
-
-          <!-- ── Chart 2: Products used in trusts like mine ─ -->
-          <div class="nhsuk-card">
-            <div class="nhsuk-card__content">
-              <h3 class="nhsuk-heading-s nhsuk-u-margin-bottom-1">Products used in trusts like mine</h3>
-              <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-4">
-                District general hospitals · North West region · ~500 beds
-                &nbsp;<a href="#" class="nhsuk-link nhsuk-body-s">Change</a>
-              </p>
-
-              <div style="position:relative;">
-                <canvas id="trustsChart" height="200" aria-label="Bar chart showing how many similar trusts use top products in this category"></canvas>
-                <div id="chartTooltip" style="
-                  position:absolute; background:#212b32; color:#fff;
-                  font-size:12px; padding:6px 10px; border-radius:4px;
-                  pointer-events:none; display:none; z-index:10; white-space:nowrap;
-                "></div>
-              </div>
-
-              <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-0 nhsuk-u-margin-top-3">
-                Compared against 12 similar trusts in this category.
-              </p>
-            </div>
-          </div>
-
-        </div>{# /.app-dataviz-grid #}
-
-      </div>
-    </div>
-
-
-
-    <div class="nhsuk-grid-row">
-  <div class="nhsuk-grid-column-full">
-
-    {# Search bar #}
-    <div class="app-filters nhsuk-u-margin-top-5 nhsuk-u-margin-bottom-5">
-      <div class="app-filters-container">
-        <form action="" method="get" novalidate="">
-          <div class="nhsuk-form-group nhsuk-u-margin-bottom-0">
-            <label class="nhsuk-label" for="q">
-              Search again by product, category or supplier
-            </label>
-            <input class="nhsuk-input nhsuk-input--width-20" id="q" name="q" type="search" value="">
-            <button class="nhsuk-button nhsuk-button--secondary nhsuk-u-margin-left-2 app-button--small nhsuk-u-margin-bottom-0" data-module="nhsuk-button" type="submit">
-              Search
-            </button>
-          </div>
-        </form>
-      </div>
-    </div>
-
-  </div>
-</div>
-
-
-<div class="nhsuk-grid-row">
-
-  {# Filters Sidebar #}
-  <app-auto-submit class="app-grid-column-filters">
-
-    <div class="nhsuk-card nhsuk-card--feature app-filters">
-      <div class="nhsuk-card__content nhsuk-card__content--feature">
-        <h3 class="nhsuk-card__heading nhsuk-card__heading--feature">
-          Filter results
-        </h3>
-
-        {# Supplier maturity Filter #}
-        <div class="nhsuk-form-group">
-          <fieldset class="nhsuk-fieldset">
-            <legend class="nhsuk-fieldset__legend nhsuk-fieldset__legend--s">
-              Supplier maturity
-            </legend>
-            <div class="nhsuk-checkboxes nhsuk-checkboxes--small" data-module="nhsuk-checkboxes">
-              <div class="nhsuk-checkboxes__item">
-                <input class="nhsuk-checkboxes__input" id="maturity-new" name="[maturity]" type="checkbox" value="new">
-                <label class="nhsuk-label nhsuk-checkboxes__label" for="maturity-new">
-                  New (1–2 years old)
-                </label>
-              </div>
-              <div class="nhsuk-checkboxes__item">
-                <input class="nhsuk-checkboxes__input" id="maturity-mature" name="[maturity]" type="checkbox" value="mature" checked="">
-                <label class="nhsuk-label nhsuk-checkboxes__label" for="maturity-mature">
-                  Mature (2–5 years old)
-                </label>
-              </div>
-            </div>
-          </fieldset>
-        </div>
-
-        {# Company size Filter #}
-        <div class="nhsuk-form-group">
-          <fieldset class="nhsuk-fieldset">
-            <legend class="nhsuk-fieldset__legend nhsuk-fieldset__legend--s">
-              Company size
-            </legend>
-            <div class="nhsuk-checkboxes nhsuk-checkboxes--small" data-module="nhsuk-checkboxes">
-              <div class="nhsuk-checkboxes__item">
-                <input class="nhsuk-checkboxes__input" id="size-small" name="[size]" type="checkbox" value="1-50">
-                <label class="nhsuk-label nhsuk-checkboxes__label" for="size-small">
-                  1–50 employees
-                </label>
-              </div>
-              <div class="nhsuk-checkboxes__item">
-                <input class="nhsuk-checkboxes__input" id="size-mid" name="[size]" type="checkbox" value="50-100" checked="">
-                <label class="nhsuk-label nhsuk-checkboxes__label" for="size-mid">
-                  50–100 employees
-                </label>
-              </div>
-              <div class="nhsuk-checkboxes__item">
-                <input class="nhsuk-checkboxes__input" id="size-large" name="[size]" type="checkbox" value="100plus">
-                <label class="nhsuk-label nhsuk-checkboxes__label" for="size-large">
-                  100+ employees
-                </label>
-              </div>
-            </div>
-          </fieldset>
-        </div>
-
-        <div class="nhsuk-button-group">
-          <button class="nhsuk-button nhsuk-button--secondary app-button--small" data-module="nhsuk-button" formaction="" formmethod="post" role="search" type="submit" hidden="">
-            Update results
-          </button>
-        </div>
-      </div>
-    </div>
-
-  </app-auto-submit>
-
-  {# Results Column #}
-  <div class="app-grid-column-results">
-
-    <h3 class="nhsuk-heading-m nhsuk-u-margin-bottom-2">Medical technologies</h3>
-    <p class="nhsuk-caption-m nhsuk-u-margin-bottom-4">
-      Showing <b>1</b> to <b>25</b> of <b>143</b> products
-    </p>
-
-    {# Result 1 #}
-    <div class="nhsuk-card nhsuk-card--clickable app-card--compact">
-      <div class="nhsuk-card__content">
-        <h4 class="nhsuk-card__heading nhsuk-heading-s">
-          <a class="nhsuk-card__link" href="product-page?smartpump-300">SmartPump 300 Infusion System</a>
-        </h4>
-        <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-2">
-          MedTech Innovations Ltd
-        </p>
-        <dl class="nhsuk-summary-list">
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Category</dt>
-            <dd class="nhsuk-summary-list__value">Infusion devices</dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Trusts using this</dt>
-            <dd class="nhsuk-summary-list__value">8 trusts</dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Shared documents</dt>
-            <dd class="nhsuk-summary-list__value">
-              12 documents<br>
-              <span class="nhsuk-body-s nhsuk-u-secondary-text-color">Including clinical trials, pilot studies and usage reports</span>
-            </dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Procurement outcomes</dt>
-            <dd class="nhsuk-summary-list__value">
-              <strong class="nhsuk-tag nhsuk-tag--green">Procured: 6 trusts</strong>
-              <strong class="nhsuk-tag nhsuk-tag--blue">Under review: 2 trusts</strong>
-            </dd>
-          </div>
-        </dl>
-        <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-top-3">
-          <strong class="nhsuk-tag nhsuk-tag--white">UK manufactured</strong>
-          <strong class="nhsuk-tag nhsuk-tag--white">SME</strong>
-        </p>
-      </div>
-    </div>
-
-    {# Result 2 #}
-    <div class="nhsuk-card nhsuk-card--clickable app-card--compact">
-      <div class="nhsuk-card__content">
-        <h4 class="nhsuk-card__heading nhsuk-heading-s">
-          <a class="nhsuk-card__link" href="product-page?safeflow-iv">SafeFlow IV Administration Set</a>
-        </h4>
-        <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-2">
-          Global Medical Supplies plc
-        </p>
-        <dl class="nhsuk-summary-list">
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Category</dt>
-            <dd class="nhsuk-summary-list__value">Infusion devices</dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Trusts using this</dt>
-            <dd class="nhsuk-summary-list__value">5 trusts</dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Shared documents</dt>
-            <dd class="nhsuk-summary-list__value">
-              8 documents<br>
-              <span class="nhsuk-body-s nhsuk-u-secondary-text-color">Including clinical trials and comparative studies</span>
-            </dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Procurement outcomes</dt>
-            <dd class="nhsuk-summary-list__value">
-              <strong class="nhsuk-tag nhsuk-tag--green">Procured: 4 trusts</strong>
-              <strong class="nhsuk-tag nhsuk-tag--yellow">Excluded: 1 trust</strong>
-            </dd>
-          </div>
-        </dl>
-      </div>
-    </div>
-
-    {# Result 3 #}
-    <div class="nhsuk-card nhsuk-card--clickable app-card--compact">
-      <div class="nhsuk-card__content">
-        <h4 class="nhsuk-card__heading nhsuk-heading-s">
-          <a class="nhsuk-card__link" href="product-page?portapump-mini">PortaPump Mini Ambulatory Pump</a>
-        </h4>
-        <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-2">
-          CareTech Solutions
-        </p>
-        <dl class="nhsuk-summary-list">
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Category</dt>
-            <dd class="nhsuk-summary-list__value">Infusion devices</dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Trusts using this</dt>
-            <dd class="nhsuk-summary-list__value">3 trusts</dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Shared documents</dt>
-            <dd class="nhsuk-summary-list__value">
-              5 documents<br>
-              <span class="nhsuk-body-s nhsuk-u-secondary-text-color">Including pilot studies and usage reports</span>
-            </dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Procurement outcomes</dt>
-            <dd class="nhsuk-summary-list__value">
-              <strong class="nhsuk-tag nhsuk-tag--green">Procured: 2 trusts</strong>
-              <strong class="nhsuk-tag nhsuk-tag--blue">Under review: 1 trust</strong>
-            </dd>
-          </div>
-        </dl>
-        <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-top-3">
-          <strong class="nhsuk-tag nhsuk-tag--white">SME</strong>
-        </p>
-      </div>
-    </div>
-
-    {# Result 4 #}
-    <div class="nhsuk-card nhsuk-card--clickable app-card--compact">
-      <div class="nhsuk-card__content">
-        <h4 class="nhsuk-card__heading nhsuk-heading-s">
-          <a class="nhsuk-card__link" href="product-page?precisedose-pca">PreciseDose PCA System</a>
-        </h4>
-        <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-2">
-          Pain Management Technologies
-        </p>
-        <dl class="nhsuk-summary-list">
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Category</dt>
-            <dd class="nhsuk-summary-list__value">Infusion devices</dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Trusts using this</dt>
-            <dd class="nhsuk-summary-list__value">123 trusts</dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Shared documents</dt>
-            <dd class="nhsuk-summary-list__value">
-              15 documents<br>
-              <span class="nhsuk-body-s nhsuk-u-secondary-text-color">Including clinical trials, business cases and comparative studies</span>
-            </dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Procurement outcomes</dt>
-            <dd class="nhsuk-summary-list__value">
-              <strong class="nhsuk-tag nhsuk-tag--green">Procured: 10 trusts</strong>
-              <strong class="nhsuk-tag nhsuk-tag--blue">Under review: 2 trusts</strong>
-            </dd>
-          </div>
-        </dl>
-        <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-top-3">
-          <strong class="nhsuk-tag nhsuk-tag--white">UK manufactured</strong>
-        </p>
-      </div>
-    </div>
-
-    {# Result 5 #}
-    <div class="nhsuk-card nhsuk-card--clickable app-card--compact">
-      <div class="nhsuk-card__content">
-        <h4 class="nhsuk-card__heading nhsuk-heading-s">
-          <a class="nhsuk-card__link" href="product-page?multiflow-hub">MultiFlow Central Infusion Hub</a>
-        </h4>
-        <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-2">
-          MedTech Innovations Ltd
-        </p>
-        <dl class="nhsuk-summary-list">
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Category</dt>
-            <dd class="nhsuk-summary-list__value">Infusion devices</dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Trusts using this</dt>
-            <dd class="nhsuk-summary-list__value">7 trusts</dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Shared documents</dt>
-            <dd class="nhsuk-summary-list__value">
-              9 documents<br>
-              <span class="nhsuk-body-s nhsuk-u-secondary-text-color">Including technical assessments and usage reports</span>
-            </dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Procurement outcomes</dt>
-            <dd class="nhsuk-summary-list__value">
-              <strong class="nhsuk-tag nhsuk-tag--green">Procured: 5 trusts</strong>
-              <strong class="nhsuk-tag nhsuk-tag--blue">Under review: 2 trusts</strong>
-            </dd>
-          </div>
-        </dl>
-        <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-top-3">
-          <strong class="nhsuk-tag nhsuk-tag--white">UK manufactured</strong>
-          <strong class="nhsuk-tag nhsuk-tag--white">SME</strong>
-        </p>
-      </div>
-    </div>
-
-    {# Result 6 #}
-    <div class="nhsuk-card nhsuk-card--clickable app-card--compact">
-      <div class="nhsuk-card__content">
-        <h4 class="nhsuk-card__heading nhsuk-heading-s">
-          <a class="nhsuk-card__link" href="product-page?neonatal-ivac">Neonatal IV Access Kit</a>
-        </h4>
-        <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-2">
-          Pediatric Care Systems
-        </p>
-        <dl class="nhsuk-summary-list">
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Category</dt>
-            <dd class="nhsuk-summary-list__value">Infusion devices</dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Trusts using this</dt>
-            <dd class="nhsuk-summary-list__value">4 trusts</dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Shared documents</dt>
-            <dd class="nhsuk-summary-list__value">
-              6 documents<br>
-              <span class="nhsuk-body-s nhsuk-u-secondary-text-color">Including pilot studies and safety assessments</span>
-            </dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Procurement outcomes</dt>
-            <dd class="nhsuk-summary-list__value">
-              <strong class="nhsuk-tag nhsuk-tag--green">Procured: 3 trusts</strong>
-              <strong class="nhsuk-tag nhsuk-tag--blue">Under review: 1 trust</strong>
-            </dd>
-          </div>
-        </dl>
-      </div>
-    </div>
-
-    {# Result 7 #}
-    <div class="nhsuk-card nhsuk-card--clickable app-card--compact">
-      <div class="nhsuk-card__content">
-        <h4 class="nhsuk-card__heading nhsuk-heading-s">
-          <a class="nhsuk-card__link" href="product-page?elastomeric-pump">ElastoFlow Disposable Infusion Pump</a>
-        </h4>
-        <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-2">
-          Disposable Medical Ltd
-        </p>
-        <dl class="nhsuk-summary-list">
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Category</dt>
-            <dd class="nhsuk-summary-list__value">Infusion devices</dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Trusts using this</dt>
-            <dd class="nhsuk-summary-list__value">9 trusts</dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Shared documents</dt>
-            <dd class="nhsuk-summary-list__value">
-              7 documents<br>
-              <span class="nhsuk-body-s nhsuk-u-secondary-text-color">Including clinical trials and patient satisfaction studies</span>
-            </dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Procurement outcomes</dt>
-            <dd class="nhsuk-summary-list__value">
-              <strong class="nhsuk-tag nhsuk-tag--green">Procured: 8 trusts</strong>
-              <strong class="nhsuk-tag nhsuk-tag--blue">Under review: 1 trust</strong>
-            </dd>
-          </div>
-        </dl>
-        <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-top-3">
-          <strong class="nhsuk-tag nhsuk-tag--white">SME</strong>
-        </p>
-      </div>
-    </div>
-
-    {# Result 8 #}
-    <div class="nhsuk-card nhsuk-card--clickable app-card--compact">
-      <div class="nhsuk-card__content">
-        <h4 class="nhsuk-card__heading nhsuk-heading-s">
-          <a class="nhsuk-card__link" href="product-page?volumetric-plus">VoluMetric Plus Infusion Controller</a>
-        </h4>
-        <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-2">
-          Global Medical Supplies plc
-        </p>
-        <dl class="nhsuk-summary-list">
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Category</dt>
-            <dd class="nhsuk-summary-list__value">Infusion devices</dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Trusts using this</dt>
-            <dd class="nhsuk-summary-list__value">11 trusts</dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Shared documents</dt>
-            <dd class="nhsuk-summary-list__value">
-              14 documents<br>
-              <span class="nhsuk-body-s nhsuk-u-secondary-text-color">Including technical assessments and comparative studies</span>
-            </dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Procurement outcomes</dt>
-            <dd class="nhsuk-summary-list__value">
-              <strong class="nhsuk-tag nhsuk-tag--green">Procured: 9 trusts</strong>
-              <strong class="nhsuk-tag nhsuk-tag--blue">Under review: 2 trusts</strong>
-            </dd>
-          </div>
-        </dl>
-      </div>
-    </div>
-
-    {# Result 9 #}
-    <div class="nhsuk-card nhsuk-card--clickable app-card--compact">
-      <div class="nhsuk-card__content">
-        <h4 class="nhsuk-card__heading nhsuk-heading-s">
-          <a class="nhsuk-card__link" href="product-page?smartsyringe-driver">SmartSyringe Driver Pro</a>
-        </h4>
-        <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-2">
-          CareTech Solutions
-        </p>
-        <dl class="nhsuk-summary-list">
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Category</dt>
-            <dd class="nhsuk-summary-list__value">Infusion devices</dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Trusts using this</dt>
-            <dd class="nhsuk-summary-list__value">6 trusts</dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Shared documents</dt>
-            <dd class="nhsuk-summary-list__value">
-              7 documents<br>
-              <span class="nhsuk-body-s nhsuk-u-secondary-text-color">Including technical assessments and pilot studies</span>
-            </dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Procurement outcomes</dt>
-            <dd class="nhsuk-summary-list__value">
-              <strong class="nhsuk-tag nhsuk-tag--green">Procured: 4 trusts</strong>
-              <strong class="nhsuk-tag nhsuk-tag--blue">Under review: 2 trusts</strong>
-            </dd>
-          </div>
-        </dl>
-        <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-top-3">
-          <strong class="nhsuk-tag nhsuk-tag--white">UK manufactured</strong>
-          <strong class="nhsuk-tag nhsuk-tag--white">SME</strong>
-        </p>
-      </div>
-    </div>
-
-    {# Result 10 #}
-    <div class="nhsuk-card nhsuk-card--clickable app-card--compact">
-      <div class="nhsuk-card__content">
-        <h4 class="nhsuk-card__heading nhsuk-heading-s">
-          <a class="nhsuk-card__link" href="product-page?gravity-iv-set">Gravity IV Administration Set Ultra</a>
-        </h4>
-        <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-2">
-          MedSupply Direct
-        </p>
-        <dl class="nhsuk-summary-list">
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Category</dt>
-            <dd class="nhsuk-summary-list__value">Infusion devices</dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Trusts using this</dt>
-            <dd class="nhsuk-summary-list__value">2 trusts</dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Shared documents</dt>
-            <dd class="nhsuk-summary-list__value">
-              3 documents<br>
-              <span class="nhsuk-body-s nhsuk-u-secondary-text-color">Including usage reports</span>
-            </dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Procurement outcomes</dt>
-            <dd class="nhsuk-summary-list__value">
-              <strong class="nhsuk-tag nhsuk-tag--green">Procured: 2 trusts</strong>
-            </dd>
-          </div>
-        </dl>
-      </div>
-    </div>
-
-    {# Pagination #}
-    <nav class="nhsuk-pagination nhsuk-pagination--numbered" role="navigation" aria-label="Pagination">
-      <ul class="nhsuk-pagination__list">
-        <li class="nhsuk-pagination__item nhsuk-pagination__item--current">
-          <a class="nhsuk-pagination__link" href="?page=1&limit=25" aria-label="Page 1" aria-current="page">1</a>
-        </li>
-        <li class="nhsuk-pagination__item">
-          <a class="nhsuk-pagination__link" href="?page=2&limit=25" aria-label="Page 2">2</a>
-        </li>
-        <li class="nhsuk-pagination__item">
-          <a class="nhsuk-pagination__link" href="?page=3&limit=25" aria-label="Page 3">3</a>
-        </li>
-        <li class="nhsuk-pagination__item">
-          <a class="nhsuk-pagination__link" href="?page=4&limit=25" aria-label="Page 4">4</a>
-        </li>
-        <li class="nhsuk-pagination__item">
-          <a class="nhsuk-pagination__link" href="?page=5&limit=25" aria-label="Page 5">5</a>
-        </li>
-        <li class="nhsuk-pagination__item">
-          <a class="nhsuk-pagination__link" href="?page=6&limit=25" aria-label="Page 6">6</a>
-        </li>
-      </ul>
-      <a href="?page=2&limit=25" class="nhsuk-pagination__next" rel="next">
-        <span class="nhsuk-pagination__title">
-          Next<span class="nhsuk-u-visually-hidden"> page</span>
-        </span>
-        <svg class="nhsuk-icon nhsuk-icon--arrow-right" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="16" height="16" focusable="false" aria-hidden="true">
-          <path d="m14.7 6.3 5 5c.2.2.3.4.3.7 0 .3-.1.5-.3.7l-5 5a1 1 0 0 1-1.4-1.4l3.3-3.3H5a1 1 0 0 1 0-2h11.6l-3.3-3.3a1 1 0 1 1 1.4-1.4Z"></path>
-        </svg>
-      </a>
-    </nav>
-
-  </div>{# /.app-grid-column-results #}
-
-</div>{# /.nhsuk-grid-row #}
-
-
-<!-- ── App-level styles for new chart components only ──────── -->
-<style>
-  .app-dataviz-grid {
-    display: grid;
-    grid-template-columns: 1fr 1fr;
-    gap: 20px;
-  }
-
-  /* Supplier pie layout */
-  .app-pie-wrap {
-    display: flex;
-    align-items: flex-start;
-    gap: 24px;
-  }
-  .app-pie-svg { flex-shrink: 0; }
-
-  /* Supplier legend rows */
-  .app-supplier-legend {
-    flex: 1;
-    display: flex;
-    flex-direction: column;
-    gap: 10px;
-  }
-  .app-supplier-legend__item {
-    display: flex;
-    align-items: flex-start;
-    gap: 8px;
-  }
-  .app-supplier-legend__swatch {
-    width: 12px;
-    height: 12px;
-    border-radius: 2px;
-    flex-shrink: 0;
-    margin-top: 3px;
-  }
-  .app-supplier-legend__body { flex: 1; }
-
-  /* Mini bar under each legend row */
-  .app-supplier-bar-track {
-    height: 5px;
-    background: #d8dde0;
-    border-radius: 2px;
-    overflow: hidden;
-    width: 100%;
-  }
-  .app-supplier-bar-fill {
-    height: 100%;
-    border-radius: 2px;
-  }
-
-  @media (max-width: 768px) {
-    .app-dataviz-grid { grid-template-columns: 1fr; }
-  }
-</style>
-
-
-<!-- ── Canvas chart script ──────────────────────────────────── -->
-<script>
-(function () {
-  // roundRect polyfill for older browsers
-  if (!CanvasRenderingContext2D.prototype.roundRect) {
-    CanvasRenderingContext2D.prototype.roundRect = function (x, y, w, h, r) {
-      this.beginPath();
-      this.moveTo(x + r, y);
-      this.lineTo(x + w - r, y);
-      this.quadraticCurveTo(x + w, y, x + w, y + r);
-      this.lineTo(x + w, y + h - r);
-      this.quadraticCurveTo(x + w, y + h, x + w - r, y + h);
-      this.lineTo(x + r, y + h);
-      this.quadraticCurveTo(x, y + h, x, y + h - r);
-      this.lineTo(x, y + r);
-      this.quadraticCurveTo(x, y, x + r, y);
-      this.closePath();
-    };
-  }
-
-  const canvas = document.getElementById('trustsChart');
-  if (!canvas) return;
-
-  const dpr    = window.devicePixelRatio || 1;
-  const W      = canvas.parentElement.clientWidth || 380;
-  const H      = 200;
-  canvas.width  = W * dpr;
-  canvas.height = H * dpr;
-  canvas.style.width  = W + 'px';
-  canvas.style.height = H + 'px';
-
-  const ctx = canvas.getContext('2d');
-  ctx.scale(dpr, dpr);
-
-  // Product name · similar trusts using (out of 12) · pct of 12
-  const data = [
-    { name: 'PreciseDose PCA System',     similar: 10, pct: 83 },
-    { name: 'VoluMetric Plus Controller', similar: 9,  pct: 75 },
-    { name: 'ElastoFlow Disposable Pump', similar: 8,  pct: 67 },
-    { name: 'SmartPump 300',              similar: 6,  pct: 50 },
-    { name: 'MultiFlow Infusion Hub',     similar: 5,  pct: 42 },
-    { name: 'SafeFlow IV Set',            similar: 4,  pct: 33 },
-  ];
-
-  const padL   = 168;   // label column
-  const padR   = 52;    // count column
-  const padT   = 10;
-  const padB   = 20;    // space for x-axis labels
-  const rowH   = (H - padT - padB) / data.length;
-  const barH   = 13;
-  const barMaxW = W - padL - padR;
-
-  const colFill  = '#005eb8';
-  const colTrack = '#d8dde0';
-  const colText  = '#212b32';
-  const colMuted = '#768692';
-
-  // Grid lines + x-axis labels
-  [0, 25, 50, 75, 100].forEach(pct => {
-    const x = padL + (pct / 100) * barMaxW;
-    ctx.strokeStyle = '#f0f4f5';
-    ctx.lineWidth = 1;
-    ctx.beginPath();
-    ctx.moveTo(x, padT);
-    ctx.lineTo(x, H - padB);
-    ctx.stroke();
-
-    ctx.fillStyle = colMuted;
-    ctx.font = '10px Arial, sans-serif';
-    ctx.textAlign = 'center';
-    ctx.textBaseline = 'top';
-    ctx.fillText(pct + '%', x, H - padB + 4);
-  });
-
-  data.forEach((d, i) => {
-    const midY = padT + i * rowH + rowH / 2;
-    const barY = midY - barH / 2;
-    const fillW = (d.pct / 100) * barMaxW;
-
-    // Label — truncate to fit
-    ctx.fillStyle = colText;
-    ctx.font = '12px Arial, sans-serif';
-    ctx.textAlign = 'right';
-    ctx.textBaseline = 'middle';
-    let label = d.name;
-    while (ctx.measureText(label).width > padL - 10 && label.length > 4) {
-      label = label.slice(0, -4) + '…';
-    }
-    ctx.fillText(label, padL - 8, midY);
-
-    // Track
-    ctx.fillStyle = colTrack;
-    ctx.roundRect(padL, barY, barMaxW, barH, 2);
-    ctx.fill();
-
-    // Fill
-    ctx.fillStyle = colFill;
-    ctx.roundRect(padL, barY, fillW, barH, 2);
-    ctx.fill();
-
-    // Count
-    ctx.fillStyle = colText;
-    ctx.font = 'bold 11px Arial, sans-serif';
-    ctx.textAlign = 'left';
-    ctx.textBaseline = 'middle';
-    ctx.fillText(d.similar + ' / 12', padL + fillW + 6, midY);
-  });
-
-  // Hover tooltip
-  const tooltip = document.getElementById('chartTooltip');
-  canvas.addEventListener('mousemove', function (e) {
-    const rect = canvas.getBoundingClientRect();
-    const mx = e.clientX - rect.left;
-    const my = e.clientY - rect.top;
-    let hit = null;
-    data.forEach((d, i) => {
-      const midY = padT + i * rowH + rowH / 2;
-      const barY = midY - barH / 2;
-      if (mx >= padL && mx <= padL + barMaxW && my >= barY - 4 && my <= barY + barH + 4) {
-        hit = d;
-      }
-    });
-    if (hit) {
-      tooltip.style.display = 'block';
-      tooltip.style.left = (mx + 12) + 'px';
-      tooltip.style.top  = (my - 30) + 'px';
-      tooltip.innerHTML  = '<strong>' + hit.similar + ' of 12</strong> similar trusts procured this';
-    } else {
-      tooltip.style.display = 'none';
-    }
-  });
-  canvas.addEventListener('mouseleave', () => { tooltip.style.display = 'none'; });
-})();
-</script>
-
-{% endblock %}
\ No newline at end of file
diff --git a/app/views/current/search-results-viz.html b/app/views/current/search-results-viz.html
index 5233454..38cfeac 100644
--- a/app/views/current/search-results-viz.html
+++ b/app/views/current/search-results-viz.html
@@ -22,145 +22,129 @@
 
 <div class="nhsuk-grid-row">
   <div class="nhsuk-grid-column-full">
-
     <h1 class="nhsuk-heading-l">Viewing all data for category "Wound care"</h1>
-    
-  
-
   </div>
 </div>
 
+
     <!-- ═══════════════════════════════════════════
-         NHS TRUST EXPERIENCE AT A GLANCE
+         DATA VIZ SECTION
          ═══════════════════════════════════════════ -->
-    <div class="nhsuk-grid-row nhsuk-u-margin-bottom-6" id="experience">
-      <div class="nhsuk-grid-column-two-thirds">
+    <div class="nhsuk-grid-row nhsuk-u-margin-bottom-6">
+      <div class="nhsuk-grid-column-full">
 
         <hr class="nhsuk-u-margin-top-0 nhsuk-u-margin-bottom-5">
-      
-        <p class="nhsuk-body-l nhsuk-u-margin-bottom-5">18 NHS trusts have experience with this product.</p>
-
-        <!-- ── Stat strip ───────────────────────────────────── -->
-        <div class="app-stat-row" role="list">
-          <div class="app-stat" role="listitem">
-            <span class="app-stat__value" style="color:#007f3b;">13</span>
-            <span class="app-stat__label">Procured</span>
-          </div>
-          <div class="app-stat" role="listitem">
-            <span class="app-stat__value" style="color:#005eb8;">3</span>
-            <span class="app-stat__label">Under review</span>
-          </div>
-          <div class="app-stat" role="listitem">
-            <span class="app-stat__value" style="color:#768692;">2</span>
-            <span class="app-stat__label">Not procured</span>
-          </div>
-        </div>
-
-        <!-- ── Procurement donut ────────────────────────────── -->
-        <div class="nhsuk-card nhsuk-u-margin-bottom-4">
-          <div class="nhsuk-card__content">
-            <h3 class="nhsuk-heading-s nhsuk-u-margin-bottom-4">Procurement decisions</h3>
-            <div style="display:flex; align-items:center; gap:32px;">
-              <div style="flex-shrink:0; width:120px; height:120px;">
-                <svg viewBox="0 0 36 36" style="transform:rotate(-90deg); width:100%; height:100%;">
-                  <circle cx="18" cy="18" r="15.9" fill="none" stroke="#007f3b" stroke-width="3.5"
-                          stroke-dasharray="72 28" stroke-dashoffset="0"></circle>
-                  <circle cx="18" cy="18" r="15.9" fill="none" stroke="#005eb8" stroke-width="3.5"
-                          stroke-dasharray="17 83" stroke-dashoffset="-72"></circle>
-                  <circle cx="18" cy="18" r="15.9" fill="none" stroke="#768692" stroke-width="3.5"
-                          stroke-dasharray="11 89" stroke-dashoffset="-89"></circle>
+        <p class="nhsuk-body-l nhsuk-u-margin-bottom-5">18 NHS trusts have experience with products in this category.</p>
+
+        <div class="app-dataviz-grid">
+
+          <!-- ── Chart 1: Supplier market share ───────────── -->
+          <div class="nhsuk-card">
+            <div class="nhsuk-card__content">
+              <h3 class="nhsuk-heading-s nhsuk-u-margin-bottom-1">Supplier market share</h3>
+              <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-4">Based on number of products procured across NHS trusts</p>
+
+              <div class="app-pie-wrap">
+                <svg class="app-pie-svg" width="140" height="140" viewBox="0 0 140 140" aria-hidden="true">
+                  <!-- MedTech Innovations: 34% -->
+                  <path d="M70 70 L70 10 A60 60 0 0 1 124.6 85 Z" fill="#005eb8"/>
+                  <!-- Global Medical Supplies: 24% -->
+                  <path d="M70 70 L124.6 85 A60 60 0 0 1 60.5 129.4 Z" fill="#007f3b"/>
+                  <!-- CareTech Solutions: 18% -->
+                  <path d="M70 70 L60.5 129.4 A60 60 0 0 1 13.2 94.1 Z" fill="#ffb81c"/>
+                  <!-- Pain Management Tech: 14% -->
+                  <path d="M70 70 L13.2 94.1 A60 60 0 0 1 10.5 46.0 Z" fill="#da291c"/>
+                  <!-- Others: 10% -->
+                  <path d="M70 70 L10.5 46.0 A60 60 0 0 1 70 10 Z" fill="#aeb7bd"/>
+                  <!-- Centre hole -->
+                  <circle cx="70" cy="70" r="32" fill="#fff"/>
+                  <text x="70" y="66" text-anchor="middle" font-size="18" font-weight="700" fill="#212b32">143</text>
+                  <text x="70" y="80" text-anchor="middle" font-size="10" fill="#768692">products</text>
                 </svg>
-              </div>
-              <div style="flex:1;">
-                <div class="app-legend">
-                  <div class="app-legend__item">
-                    <span class="app-legend__swatch" style="background:#007f3b;"></span>
-                    <strong>13</strong>&nbsp;Procured
+
+                <div class="app-supplier-legend">
+                  <div class="app-supplier-legend__item">
+                    <div class="app-supplier-legend__swatch" style="background:#005eb8;"></div>
+                    <div class="app-supplier-legend__body">
+                      <p class="nhsuk-body-s nhsuk-u-margin-bottom-0"><strong>MedTech Innovations</strong></p>
+                      <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-1">34% · 49 products</p>
+                      <div class="app-supplier-bar-track"><div class="app-supplier-bar-fill" style="width:100%;background:#005eb8;"></div></div>
+                    </div>
+                  </div>
+                  <div class="app-supplier-legend__item">
+                    <div class="app-supplier-legend__swatch" style="background:#007f3b;"></div>
+                    <div class="app-supplier-legend__body">
+                      <p class="nhsuk-body-s nhsuk-u-margin-bottom-0"><strong>Global Medical Supplies</strong></p>
+                      <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-1">24% · 34 products</p>
+                      <div class="app-supplier-bar-track"><div class="app-supplier-bar-fill" style="width:71%;background:#007f3b;"></div></div>
+                    </div>
                   </div>
-                  <div class="app-legend__item">
-                    <span class="app-legend__swatch" style="background:#005eb8;"></span>
-                    <strong>3</strong>&nbsp;Under review
+                  <div class="app-supplier-legend__item">
+                    <div class="app-supplier-legend__swatch" style="background:#ffb81c;"></div>
+                    <div class="app-supplier-legend__body">
+                      <p class="nhsuk-body-s nhsuk-u-margin-bottom-0"><strong>CareTech Solutions</strong></p>
+                      <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-1">18% · 26 products</p>
+                      <div class="app-supplier-bar-track"><div class="app-supplier-bar-fill" style="width:53%;background:#ffb81c;"></div></div>
+                    </div>
                   </div>
-                  <div class="app-legend__item">
-                    <span class="app-legend__swatch" style="background:#768692;"></span>
-                    <strong>2</strong>&nbsp;Not procured
+                  <div class="app-supplier-legend__item">
+                    <div class="app-supplier-legend__swatch" style="background:#da291c;"></div>
+                    <div class="app-supplier-legend__body">
+                      <p class="nhsuk-body-s nhsuk-u-margin-bottom-0"><strong>Pain Management Tech</strong></p>
+                      <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-1">14% · 20 products</p>
+                      <div class="app-supplier-bar-track"><div class="app-supplier-bar-fill" style="width:41%;background:#da291c;"></div></div>
+                    </div>
+                  </div>
+                  <div class="app-supplier-legend__item">
+                    <div class="app-supplier-legend__swatch" style="background:#aeb7bd;"></div>
+                    <div class="app-supplier-legend__body">
+                      <p class="nhsuk-body-s nhsuk-u-margin-bottom-0"><strong>Others</strong></p>
+                      <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-1">10% · 14 products</p>
+                      <div class="app-supplier-bar-track"><div class="app-supplier-bar-fill" style="width:29%;background:#aeb7bd;"></div></div>
+                    </div>
                   </div>
                 </div>
               </div>
-            </div>
-          </div>
-        </div>
 
-        <!-- ── By NHS region ────────────────────────────────── -->
-        <div class="nhsuk-card nhsuk-u-margin-bottom-4">
-          <div class="nhsuk-card__content">
-            <h3 class="nhsuk-heading-s nhsuk-u-margin-bottom-4">By NHS region</h3>
-            <div>
-              <p class="nhsuk-body-s nhsuk-u-margin-bottom-1">North West</p>
-              <div class="app-bar-track nhsuk-u-margin-bottom-3">
-                <div class="app-bar-fill" style="width:83%;"><span>5</span></div>
-              </div>
-              <p class="nhsuk-body-s nhsuk-u-margin-bottom-1">London</p>
-              <div class="app-bar-track nhsuk-u-margin-bottom-3">
-                <div class="app-bar-fill" style="width:67%;"><span>4</span></div>
-              </div>
-              <p class="nhsuk-body-s nhsuk-u-margin-bottom-1">Midlands</p>
-              <div class="app-bar-track nhsuk-u-margin-bottom-3">
-                <div class="app-bar-fill" style="width:50%;"><span>3</span></div>
-              </div>
-              <p class="nhsuk-body-s nhsuk-u-margin-bottom-1">South East</p>
-              <div class="app-bar-track nhsuk-u-margin-bottom-3">
-                <div class="app-bar-fill" style="width:50%;"><span>3</span></div>
-              </div>
-              <p class="nhsuk-body-s nhsuk-u-margin-bottom-1">Other regions</p>
-              <div class="app-bar-track">
-                <div class="app-bar-fill" style="width:50%;"><span>3</span></div>
-              </div>
             </div>
           </div>
-        </div>
 
-        <!-- ── Willing to discuss ───────────────────────────── -->
-        <div class="nhsuk-card nhsuk-u-margin-bottom-4">
-          <div class="nhsuk-card__content">
-            <h3 class="nhsuk-heading-s nhsuk-u-margin-bottom-4">Willing to discuss</h3>
-            <div style="display:flex; align-items:center; gap:32px;">
-              <div style="flex-shrink:0; width:120px; height:120px; position:relative;">
-                <svg viewBox="0 0 36 36" style="transform:rotate(-90deg); width:100%; height:100%;">
-                  <circle cx="18" cy="18" r="15.9" fill="none" stroke="#f0f4f5" stroke-width="3.5"></circle>
-                  <circle cx="18" cy="18" r="15.9" fill="none" stroke="#007f3b" stroke-width="3.5"
-                          stroke-dasharray="67 33" stroke-dashoffset="0"></circle>
-                </svg>
-                <div style="position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); text-align:center;">
-                  <span style="font-size:22px; font-weight:700; color:#212b32;">12</span><br>
-                  <span style="font-size:11px; color:#4c6272;">contacts</span>
-                </div>
-              </div>
-              <div style="flex:1;">
-                <p class="nhsuk-body-s nhsuk-u-margin-bottom-2"><strong>12 of 18 trusts</strong> are happy to share lessons learned</p>
-                <ul class="nhsuk-list nhsuk-body-s nhsuk-u-margin-bottom-0">
-                  <li>5 Teaching hospitals</li>
-                  <li>4 District generals</li>
-                  <li>3 Community trusts</li>
-                </ul>
+          <!-- ── Chart 2: Products used in trusts like mine ─ -->
+          <div class="nhsuk-card">
+            <div class="nhsuk-card__content">
+              <h3 class="nhsuk-heading-s nhsuk-u-margin-bottom-1">Products used in trusts like mine</h3>
+              <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-4">
+                District general hospitals · North West region · ~500 beds
+                &nbsp;<a href="#" class="nhsuk-link nhsuk-body-s">Change</a>
+              </p>
+
+              <div style="position:relative;">
+                <canvas id="trustsChart" height="200" aria-label="Bar chart showing how many similar trusts use top products in this category"></canvas>
+                <div id="chartTooltip" style="
+                  position:absolute; background:#212b32; color:#fff;
+                  font-size:12px; padding:6px 10px; border-radius:4px;
+                  pointer-events:none; display:none; z-index:10; white-space:nowrap;
+                "></div>
               </div>
+
+              <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-0 nhsuk-u-margin-top-3">
+                Compared against 12 similar trusts in this category.
+              </p>
             </div>
           </div>
-        </div>
+
+        </div>{# /.app-dataviz-grid #}
 
       </div>
     </div>
 
 
 
-
     <div class="nhsuk-grid-row">
   <div class="nhsuk-grid-column-full">
 
-   
-    
     {# Search bar #}
-  <div class="app-filters nhsuk-u-margin-top-5 nhsuk-u-margin-bottom-5">
+    <div class="app-filters nhsuk-u-margin-top-5 nhsuk-u-margin-bottom-5">
       <div class="app-filters-container">
         <form action="" method="get" novalidate="">
           <div class="nhsuk-form-group nhsuk-u-margin-bottom-0">
@@ -168,191 +152,83 @@ <h3 class="nhsuk-heading-s nhsuk-u-margin-bottom-4">Willing to discuss</h3>
               Search again by product, category or supplier
             </label>
             <input class="nhsuk-input nhsuk-input--width-20" id="q" name="q" type="search" value="">
-
-
-
-<button class="nhsuk-button nhsuk-button--secondary nhsuk-u-margin-left-2 app-button--small nhsuk-u-margin-bottom-0" data-module="nhsuk-button" type="submit" data-nhsuk-button-init="">
-  Search
-</button>
-
-
-
+            <button class="nhsuk-button nhsuk-button--secondary nhsuk-u-margin-left-2 app-button--small nhsuk-u-margin-bottom-0" data-module="nhsuk-button" type="submit">
+              Search
+            </button>
           </div>
         </form>
       </div>
-      </div>
+    </div>
 
   </div>
 </div>
 
 
-
-
 <div class="nhsuk-grid-row">
-  
+
   {# Filters Sidebar #}
   <app-auto-submit class="app-grid-column-filters">
-      
+
     <div class="nhsuk-card nhsuk-card--feature app-filters">
       <div class="nhsuk-card__content nhsuk-card__content--feature">
         <h3 class="nhsuk-card__heading nhsuk-card__heading--feature">
           Filter results
         </h3>
-      
+
         {# Supplier maturity Filter #}
         <div class="nhsuk-form-group">
           <fieldset class="nhsuk-fieldset">
             <legend class="nhsuk-fieldset__legend nhsuk-fieldset__legend--s">
               Supplier maturity
             </legend>
-            
-            <div id="category-items" class="nhsuk-checkboxes nhsuk-checkboxes--small" data-module="nhsuk-checkboxes" data-nhsuk-checkboxes-init="">
+            <div class="nhsuk-checkboxes nhsuk-checkboxes--small" data-module="nhsuk-checkboxes">
               <div class="nhsuk-checkboxes__item">
-                <input class="nhsuk-checkboxes__input" id="category-infusion" name="[category]" type="checkbox" value="infusion" checked="">
-                <label class="nhsuk-label nhsuk-checkboxes__label" for="category-infusion">
-                  New (1-2 years old)
+                <input class="nhsuk-checkboxes__input" id="maturity-new" name="[maturity]" type="checkbox" value="new">
+                <label class="nhsuk-label nhsuk-checkboxes__label" for="maturity-new">
+                  New (1–2 years old)
                 </label>
               </div>
-              
               <div class="nhsuk-checkboxes__item">
-                <input class="nhsuk-checkboxes__input" id="category-surgical" name="[category]" type="checkbox" value="surgical">
-                <label class="nhsuk-label nhsuk-checkboxes__label" for="category-surgical">
-                  Mature (2-5 years old)
+                <input class="nhsuk-checkboxes__input" id="maturity-mature" name="[maturity]" type="checkbox" value="mature" checked="">
+                <label class="nhsuk-label nhsuk-checkboxes__label" for="maturity-mature">
+                  Mature (2–5 years old)
                 </label>
               </div>
-              
             </div>
           </fieldset>
         </div>
 
-
-         {# Supplier size Filter #}
+        {# Company size Filter #}
         <div class="nhsuk-form-group">
           <fieldset class="nhsuk-fieldset">
             <legend class="nhsuk-fieldset__legend nhsuk-fieldset__legend--s">
-              Supplier size
+              Company size
             </legend>
-            
-            <div id="category-items" class="nhsuk-checkboxes nhsuk-checkboxes--small" data-module="nhsuk-checkboxes" data-nhsuk-checkboxes-init="">
+            <div class="nhsuk-checkboxes nhsuk-checkboxes--small" data-module="nhsuk-checkboxes">
               <div class="nhsuk-checkboxes__item">
-                <input class="nhsuk-checkboxes__input" id="category-infusion" name="[category]" type="checkbox" value="infusion" checked="">
-                <label class="nhsuk-label nhsuk-checkboxes__label" for="category-infusion">
-                  10-50 employees
+                <input class="nhsuk-checkboxes__input" id="size-small" name="[size]" type="checkbox" value="1-50">
+                <label class="nhsuk-label nhsuk-checkboxes__label" for="size-small">
+                  1–50 employees
                 </label>
               </div>
-              
               <div class="nhsuk-checkboxes__item">
-                <input class="nhsuk-checkboxes__input" id="category-surgical" name="[category]" type="checkbox" value="surgical">
-                <label class="nhsuk-label nhsuk-checkboxes__label" for="category-surgical">
-                  50-250 employees
+                <input class="nhsuk-checkboxes__input" id="size-mid" name="[size]" type="checkbox" value="50-100" checked="">
+                <label class="nhsuk-label nhsuk-checkboxes__label" for="size-mid">
+                  50–100 employees
                 </label>
               </div>
-              
-            </div>
-          </fieldset>
-        </div>
-
-        {# NEW: Trust Similarity Filter #}
-        <div class="nhsuk-form-group">
-          <fieldset class="nhsuk-fieldset">
-            <legend class="nhsuk-fieldset__legend nhsuk-fieldset__legend--s">
-              Evaluated by trusts like mine
-            </legend>
-            <div class="nhsuk-hint" id="trust-hint">
-              Show products evaluated by trusts similar in size, type, or region
-            </div>
-            
-            <div id="trust-items" class="nhsuk-checkboxes nhsuk-checkboxes--small" data-module="nhsuk-checkboxes" data-nhsuk-checkboxes-init="">
               <div class="nhsuk-checkboxes__item">
-                <input class="nhsuk-checkboxes__input" id="trust-similar" name="[trust]" type="checkbox" value="similar">
-                <label class="nhsuk-label nhsuk-checkboxes__label" for="trust-similar">
-                  Similar size to my trust
-                </label>
-              </div>
-              
-              <div class="nhsuk-checkboxes__item">
-                <input class="nhsuk-checkboxes__input" id="trust-teaching" name="[trust]" type="checkbox" value="teaching">
-                <label class="nhsuk-label nhsuk-checkboxes__label" for="trust-teaching">
-                  Teaching hospitals
-                </label>
-              </div>
-              
-              <div class="nhsuk-checkboxes__item">
-                <input class="nhsuk-checkboxes__input" id="trust-region" name="[trust]" type="checkbox" value="region">
-                <label class="nhsuk-label nhsuk-checkboxes__label" for="trust-region">
-                  In my region
-                </label>
-              </div>
-
-              <div class="nhsuk-checkboxes__item">
-                <input class="nhsuk-checkboxes__input" id="trust-specialist" name="[trust]" type="checkbox" value="specialist">
-                <label class="nhsuk-label nhsuk-checkboxes__label" for="trust-specialist">
-                  Specialist trusts
-                </label>
-              </div>
-            </div>
-          </fieldset>
-        </div>
-
-        {# Clinical Trial Status Filter #}
-        <div class="nhsuk-form-group">
-          <fieldset class="nhsuk-fieldset">
-            <legend class="nhsuk-fieldset__legend nhsuk-fieldset__legend--s">
-              Clinical trial status
-            </legend>
-            
-            <div id="trial-items" class="nhsuk-radios nhsuk-radios--small" data-module="nhsuk-radios" data-nhsuk-radios-init="">
-              <div class="nhsuk-radios__item">
-                <input class="nhsuk-radios__input" id="trial-any" name="[trial]" type="radio" value="any" checked="">
-                <label class="nhsuk-label nhsuk-radios__label" for="trial-any">
-                  Any
-                </label>
-              </div>
-              
-              <div class="nhsuk-radios__item">
-                <input class="nhsuk-radios__input" id="trial-yes" name="[trial]" type="radio" value="yes">
-                <label class="nhsuk-label nhsuk-radios__label" for="trial-yes">
-                  Clinical trial available
-                </label>
-              </div>
-              
-              <div class="nhsuk-radios__item">
-                <input class="nhsuk-radios__input" id="trial-no" name="[trial]" type="radio" value="no">
-                <label class="nhsuk-label nhsuk-radios__label" for="trial-no">
-                  No clinical trial
+                <input class="nhsuk-checkboxes__input" id="size-large" name="[size]" type="checkbox" value="100plus">
+                <label class="nhsuk-label nhsuk-checkboxes__label" for="size-large">
+                  100+ employees
                 </label>
               </div>
             </div>
           </fieldset>
         </div>
 
-        {# Supplier Type Filter #}
-        <div class="nhsuk-form-group">
-          <fieldset class="nhsuk-fieldset">
-            <legend class="nhsuk-fieldset__legend nhsuk-fieldset__legend--s">
-              Supplier type
-            </legend>
-            
-            <div id="supplier-items" class="nhsuk-checkboxes nhsuk-checkboxes--small" data-module="nhsuk-checkboxes" data-nhsuk-checkboxes-init="">
-              <div class="nhsuk-checkboxes__item">
-                <input class="nhsuk-checkboxes__input" id="supplier-sme" name="[supplier]" type="checkbox" value="sme">
-                <label class="nhsuk-label nhsuk-checkboxes__label" for="supplier-sme">
-                  SME
-                </label>
-              </div>
-              
-              <div class="nhsuk-checkboxes__item">
-                <input class="nhsuk-checkboxes__input" id="supplier-uk" name="[supplier]" type="checkbox" value="uk-made">
-                <label class="nhsuk-label nhsuk-checkboxes__label" for="supplier-uk">
-                  UK manufactured
-                </label>
-              </div>
-            </div>
-          </fieldset>
-        </div>
-        
         <div class="nhsuk-button-group">
-          <button class="nhsuk-button nhsuk-button--secondary app-button--small" data-module="nhsuk-button" formaction="" formmethod="post" role="search" type="submit" hidden="" data-nhsuk-button-init="">
+          <button class="nhsuk-button nhsuk-button--secondary app-button--small" data-module="nhsuk-button" formaction="" formmethod="post" role="search" type="submit" hidden="">
             Update results
           </button>
         </div>
@@ -363,13 +239,13 @@ <h3 class="nhsuk-card__heading nhsuk-card__heading--feature">
 
   {# Results Column #}
   <div class="app-grid-column-results">
-    
+
     <h3 class="nhsuk-heading-m nhsuk-u-margin-bottom-2">Medical technologies</h3>
     <p class="nhsuk-caption-m nhsuk-u-margin-bottom-4">
       Showing <b>1</b> to <b>25</b> of <b>143</b> products
     </p>
 
-    {# Result 1 - ENHANCED #}
+    {# Result 1 #}
     <div class="nhsuk-card nhsuk-card--clickable app-card--compact">
       <div class="nhsuk-card__content">
         <h4 class="nhsuk-card__heading nhsuk-heading-s">
@@ -378,55 +254,30 @@ <h4 class="nhsuk-card__heading nhsuk-heading-s">
         <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-2">
           MedTech Innovations Ltd
         </p>
-        
-        
         <dl class="nhsuk-summary-list">
           <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">
-              Category
-            </dt>
-            <dd class="nhsuk-summary-list__value">
-              Infusion devices
-            </dd>
+            <dt class="nhsuk-summary-list__key">Category</dt>
+            <dd class="nhsuk-summary-list__value">Infusion devices</dd>
           </div>
-          
-          {# NEW: Show which trusts are using #}
           <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">
-              Trusts using this
-            </dt>
-            <dd class="nhsuk-summary-list__value">
-              8 trusts
-            </dd>
+            <dt class="nhsuk-summary-list__key">Trusts using this</dt>
+            <dd class="nhsuk-summary-list__value">8 trusts</dd>
           </div>
-          
-          {# ENHANCED: Show evaluation variety and recency #}
           <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">
-              Shared documents
-            </dt>
+            <dt class="nhsuk-summary-list__key">Shared documents</dt>
             <dd class="nhsuk-summary-list__value">
-              12 documents
-              <br>
-              <span class="nhsuk-body-s nhsuk-u-secondary-text-color">
-                Including clinical trials, pilot studies and usage reports
-              </span>
+              12 documents<br>
+              <span class="nhsuk-body-s nhsuk-u-secondary-text-color">Including clinical trials, pilot studies and usage reports</span>
             </dd>
           </div>
-          
-          {# NEW: Show procurement outcomes #}
           <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">
-              Procurement outcomes
-            </dt>
+            <dt class="nhsuk-summary-list__key">Procurement outcomes</dt>
             <dd class="nhsuk-summary-list__value">
               <strong class="nhsuk-tag nhsuk-tag--green">Procured: 6 trusts</strong>
               <strong class="nhsuk-tag nhsuk-tag--blue">Under review: 2 trusts</strong>
             </dd>
           </div>
-          
         </dl>
-
         <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-top-3">
           <strong class="nhsuk-tag nhsuk-tag--white">UK manufactured</strong>
           <strong class="nhsuk-tag nhsuk-tag--white">SME</strong>
@@ -434,7 +285,7 @@ <h4 class="nhsuk-card__heading nhsuk-heading-s">
       </div>
     </div>
 
-    {# Result 2 - ENHANCED #}
+    {# Result 2 #}
     <div class="nhsuk-card nhsuk-card--clickable app-card--compact">
       <div class="nhsuk-card__content">
         <h4 class="nhsuk-card__heading nhsuk-heading-s">
@@ -443,55 +294,34 @@ <h4 class="nhsuk-card__heading nhsuk-heading-s">
         <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-2">
           Global Medical Supplies plc
         </p>
-        
-        
         <dl class="nhsuk-summary-list">
           <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">
-              Category
-            </dt>
-            <dd class="nhsuk-summary-list__value">
-              Infusion devices
-            </dd>
+            <dt class="nhsuk-summary-list__key">Category</dt>
+            <dd class="nhsuk-summary-list__value">Infusion devices</dd>
           </div>
-          
           <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">
-              Trusts using this
-            </dt>
-            <dd class="nhsuk-summary-list__value">
-              5 trusts
-            </dd>
+            <dt class="nhsuk-summary-list__key">Trusts using this</dt>
+            <dd class="nhsuk-summary-list__value">5 trusts</dd>
           </div>
-          
           <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">
-              Shared documents
-            </dt>
+            <dt class="nhsuk-summary-list__key">Shared documents</dt>
             <dd class="nhsuk-summary-list__value">
-              8 documents
-              <br>
-              <span class="nhsuk-body-s nhsuk-u-secondary-text-color">
-                Including clinical trials and comparative studies
-              </span>
+              8 documents<br>
+              <span class="nhsuk-body-s nhsuk-u-secondary-text-color">Including clinical trials and comparative studies</span>
             </dd>
           </div>
-          
           <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">
-              Procurement outcomes
-            </dt>
+            <dt class="nhsuk-summary-list__key">Procurement outcomes</dt>
             <dd class="nhsuk-summary-list__value">
               <strong class="nhsuk-tag nhsuk-tag--green">Procured: 4 trusts</strong>
               <strong class="nhsuk-tag nhsuk-tag--yellow">Excluded: 1 trust</strong>
             </dd>
           </div>
-          
         </dl>
       </div>
     </div>
 
-    {# Result 3 - ENHANCED #}
+    {# Result 3 #}
     <div class="nhsuk-card nhsuk-card--clickable app-card--compact">
       <div class="nhsuk-card__content">
         <h4 class="nhsuk-card__heading nhsuk-heading-s">
@@ -500,59 +330,37 @@ <h4 class="nhsuk-card__heading nhsuk-heading-s">
         <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-2">
           CareTech Solutions
         </p>
-      
-        
         <dl class="nhsuk-summary-list">
           <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">
-              Category
-            </dt>
-            <dd class="nhsuk-summary-list__value">
-              Infusion devices
-            </dd>
+            <dt class="nhsuk-summary-list__key">Category</dt>
+            <dd class="nhsuk-summary-list__value">Infusion devices</dd>
           </div>
-          
           <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">
-              Trusts using this
-            </dt>
-            <dd class="nhsuk-summary-list__value">
-              3 trusts
-            </dd>
+            <dt class="nhsuk-summary-list__key">Trusts using this</dt>
+            <dd class="nhsuk-summary-list__value">3 trusts</dd>
           </div>
-          
           <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">
-              Shared documents
-            </dt>
+            <dt class="nhsuk-summary-list__key">Shared documents</dt>
             <dd class="nhsuk-summary-list__value">
-            5 documents
-              <br>
-              <span class="nhsuk-body-s nhsuk-u-secondary-text-color">
-                Including pilot studies and usage reports
-              </span>
+              5 documents<br>
+              <span class="nhsuk-body-s nhsuk-u-secondary-text-color">Including pilot studies and usage reports</span>
             </dd>
           </div>
-          
           <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">
-              Procurement outcomes
-            </dt>
+            <dt class="nhsuk-summary-list__key">Procurement outcomes</dt>
             <dd class="nhsuk-summary-list__value">
               <strong class="nhsuk-tag nhsuk-tag--green">Procured: 2 trusts</strong>
               <strong class="nhsuk-tag nhsuk-tag--blue">Under review: 1 trust</strong>
             </dd>
           </div>
-          
         </dl>
-
         <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-top-3">
           <strong class="nhsuk-tag nhsuk-tag--white">SME</strong>
         </p>
       </div>
     </div>
 
-    {# Result 4 - ENHANCED #}
+    {# Result 4 #}
     <div class="nhsuk-card nhsuk-card--clickable app-card--compact">
       <div class="nhsuk-card__content">
         <h4 class="nhsuk-card__heading nhsuk-heading-s">
@@ -561,59 +369,37 @@ <h4 class="nhsuk-card__heading nhsuk-heading-s">
         <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-2">
           Pain Management Technologies
         </p>
-      
-        
         <dl class="nhsuk-summary-list">
           <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">
-              Category
-            </dt>
-            <dd class="nhsuk-summary-list__value">
-              Infusion devices
-            </dd>
+            <dt class="nhsuk-summary-list__key">Category</dt>
+            <dd class="nhsuk-summary-list__value">Infusion devices</dd>
           </div>
-          
           <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">
-              Trusts using this
-            </dt>
-            <dd class="nhsuk-summary-list__value">
-              123 trusts
-            </dd>
+            <dt class="nhsuk-summary-list__key">Trusts using this</dt>
+            <dd class="nhsuk-summary-list__value">123 trusts</dd>
           </div>
-          
           <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">
-              Shared documents
-            </dt>
+            <dt class="nhsuk-summary-list__key">Shared documents</dt>
             <dd class="nhsuk-summary-list__value">
-              15 documents
-              <br>
-              <span class="nhsuk-body-s nhsuk-u-secondary-text-color">
-                Including clinical trials, business cases and comparative studies
-              </span>
+              15 documents<br>
+              <span class="nhsuk-body-s nhsuk-u-secondary-text-color">Including clinical trials, business cases and comparative studies</span>
             </dd>
           </div>
-          
           <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">
-              Procurement outcomes
-            </dt>
+            <dt class="nhsuk-summary-list__key">Procurement outcomes</dt>
             <dd class="nhsuk-summary-list__value">
               <strong class="nhsuk-tag nhsuk-tag--green">Procured: 10 trusts</strong>
               <strong class="nhsuk-tag nhsuk-tag--blue">Under review: 2 trusts</strong>
             </dd>
           </div>
-        
         </dl>
-
         <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-top-3">
           <strong class="nhsuk-tag nhsuk-tag--white">UK manufactured</strong>
         </p>
       </div>
     </div>
 
-    {# Result 5 - ENHANCED #}
+    {# Result 5 #}
     <div class="nhsuk-card nhsuk-card--clickable app-card--compact">
       <div class="nhsuk-card__content">
         <h4 class="nhsuk-card__heading nhsuk-heading-s">
@@ -622,52 +408,30 @@ <h4 class="nhsuk-card__heading nhsuk-heading-s">
         <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-2">
           MedTech Innovations Ltd
         </p>
-      
-        
         <dl class="nhsuk-summary-list">
           <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">
-              Category
-            </dt>
-            <dd class="nhsuk-summary-list__value">
-              Infusion devices
-            </dd>
+            <dt class="nhsuk-summary-list__key">Category</dt>
+            <dd class="nhsuk-summary-list__value">Infusion devices</dd>
           </div>
-          
           <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">
-              Trusts using this
-            </dt>
-            <dd class="nhsuk-summary-list__value">
-              7 trusts
-            </dd>
+            <dt class="nhsuk-summary-list__key">Trusts using this</dt>
+            <dd class="nhsuk-summary-list__value">7 trusts</dd>
           </div>
-          
           <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">
-              Shared documents
-            </dt>
+            <dt class="nhsuk-summary-list__key">Shared documents</dt>
             <dd class="nhsuk-summary-list__value">
-              9 documents
-              <br>
-              <span class="nhsuk-body-s nhsuk-u-secondary-text-color">
-                Including technical assessments and usage reports
-              </span>
+              9 documents<br>
+              <span class="nhsuk-body-s nhsuk-u-secondary-text-color">Including technical assessments and usage reports</span>
             </dd>
           </div>
-          
           <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">
-              Procurement outcomes
-            </dt>
+            <dt class="nhsuk-summary-list__key">Procurement outcomes</dt>
             <dd class="nhsuk-summary-list__value">
               <strong class="nhsuk-tag nhsuk-tag--green">Procured: 5 trusts</strong>
               <strong class="nhsuk-tag nhsuk-tag--blue">Under review: 2 trusts</strong>
             </dd>
           </div>
-         
         </dl>
-
         <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-top-3">
           <strong class="nhsuk-tag nhsuk-tag--white">UK manufactured</strong>
           <strong class="nhsuk-tag nhsuk-tag--white">SME</strong>
@@ -675,7 +439,7 @@ <h4 class="nhsuk-card__heading nhsuk-heading-s">
       </div>
     </div>
 
-    {# Result 6 - ENHANCED #}
+    {# Result 6 #}
     <div class="nhsuk-card nhsuk-card--clickable app-card--compact">
       <div class="nhsuk-card__content">
         <h4 class="nhsuk-card__heading nhsuk-heading-s">
@@ -684,55 +448,34 @@ <h4 class="nhsuk-card__heading nhsuk-heading-s">
         <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-2">
           Pediatric Care Systems
         </p>
-        
-        
         <dl class="nhsuk-summary-list">
           <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">
-              Category
-            </dt>
-            <dd class="nhsuk-summary-list__value">
-              Infusion devices
-            </dd>
+            <dt class="nhsuk-summary-list__key">Category</dt>
+            <dd class="nhsuk-summary-list__value">Infusion devices</dd>
           </div>
-          
           <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">
-              Trusts using this
-            </dt>
-            <dd class="nhsuk-summary-list__value">
-            4 trusts
-            </dd>
+            <dt class="nhsuk-summary-list__key">Trusts using this</dt>
+            <dd class="nhsuk-summary-list__value">4 trusts</dd>
           </div>
-          
           <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">
-              Shared documents
-            </dt>
+            <dt class="nhsuk-summary-list__key">Shared documents</dt>
             <dd class="nhsuk-summary-list__value">
-              6 documents
-              <br>
-              <span class="nhsuk-body-s nhsuk-u-secondary-text-color">
-                Including pilot studies and safety assessments
-              </span>
+              6 documents<br>
+              <span class="nhsuk-body-s nhsuk-u-secondary-text-color">Including pilot studies and safety assessments</span>
             </dd>
           </div>
-          
           <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">
-              Procurement outcomes
-            </dt>
+            <dt class="nhsuk-summary-list__key">Procurement outcomes</dt>
             <dd class="nhsuk-summary-list__value">
               <strong class="nhsuk-tag nhsuk-tag--green">Procured: 3 trusts</strong>
               <strong class="nhsuk-tag nhsuk-tag--blue">Under review: 1 trust</strong>
             </dd>
           </div>
-        
         </dl>
       </div>
     </div>
 
-    {# Result 7 - ENHANCED #}
+    {# Result 7 #}
     <div class="nhsuk-card nhsuk-card--clickable app-card--compact">
       <div class="nhsuk-card__content">
         <h4 class="nhsuk-card__heading nhsuk-heading-s">
@@ -741,59 +484,37 @@ <h4 class="nhsuk-card__heading nhsuk-heading-s">
         <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-2">
           Disposable Medical Ltd
         </p>
-      
-        
         <dl class="nhsuk-summary-list">
           <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">
-              Category
-            </dt>
-            <dd class="nhsuk-summary-list__value">
-              Infusion devices
-            </dd>
+            <dt class="nhsuk-summary-list__key">Category</dt>
+            <dd class="nhsuk-summary-list__value">Infusion devices</dd>
           </div>
-          
           <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">
-              Trusts using this
-            </dt>
-            <dd class="nhsuk-summary-list__value">
-            9 trusts
-            </dd>
+            <dt class="nhsuk-summary-list__key">Trusts using this</dt>
+            <dd class="nhsuk-summary-list__value">9 trusts</dd>
           </div>
-          
           <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">
-              Shared documents
-            </dt>
+            <dt class="nhsuk-summary-list__key">Shared documents</dt>
             <dd class="nhsuk-summary-list__value">
-              7 documents
-              <br>
-              <span class="nhsuk-body-s nhsuk-u-secondary-text-color">
-                Including clinical trials and patient satisfaction studies
-              </span>
+              7 documents<br>
+              <span class="nhsuk-body-s nhsuk-u-secondary-text-color">Including clinical trials and patient satisfaction studies</span>
             </dd>
           </div>
-          
           <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">
-              Procurement outcomes
-            </dt>
+            <dt class="nhsuk-summary-list__key">Procurement outcomes</dt>
             <dd class="nhsuk-summary-list__value">
               <strong class="nhsuk-tag nhsuk-tag--green">Procured: 8 trusts</strong>
               <strong class="nhsuk-tag nhsuk-tag--blue">Under review: 1 trust</strong>
             </dd>
           </div>
-          
         </dl>
-
         <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-top-3">
           <strong class="nhsuk-tag nhsuk-tag--white">SME</strong>
         </p>
       </div>
     </div>
 
-    {# Result 8 - ENHANCED #}
+    {# Result 8 #}
     <div class="nhsuk-card nhsuk-card--clickable app-card--compact">
       <div class="nhsuk-card__content">
         <h4 class="nhsuk-card__heading nhsuk-heading-s">
@@ -802,55 +523,34 @@ <h4 class="nhsuk-card__heading nhsuk-heading-s">
         <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-2">
           Global Medical Supplies plc
         </p>
-      
-        
         <dl class="nhsuk-summary-list">
           <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">
-              Category
-            </dt>
-            <dd class="nhsuk-summary-list__value">
-              Infusion devices
-            </dd>
+            <dt class="nhsuk-summary-list__key">Category</dt>
+            <dd class="nhsuk-summary-list__value">Infusion devices</dd>
           </div>
-          
           <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">
-              Trusts using this
-            </dt>
-            <dd class="nhsuk-summary-list__value">
-             11 trusts
-            </dd>
+            <dt class="nhsuk-summary-list__key">Trusts using this</dt>
+            <dd class="nhsuk-summary-list__value">11 trusts</dd>
           </div>
-          
           <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">
-              Shared documents
-            </dt>
+            <dt class="nhsuk-summary-list__key">Shared documents</dt>
             <dd class="nhsuk-summary-list__value">
-              14 documents
-              <br>
-              <span class="nhsuk-body-s nhsuk-u-secondary-text-color">
-                Including technical assessments and comparative studies
-              </span>
+              14 documents<br>
+              <span class="nhsuk-body-s nhsuk-u-secondary-text-color">Including technical assessments and comparative studies</span>
             </dd>
           </div>
-          
           <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">
-              Procurement outcomes
-            </dt>
+            <dt class="nhsuk-summary-list__key">Procurement outcomes</dt>
             <dd class="nhsuk-summary-list__value">
               <strong class="nhsuk-tag nhsuk-tag--green">Procured: 9 trusts</strong>
               <strong class="nhsuk-tag nhsuk-tag--blue">Under review: 2 trusts</strong>
             </dd>
           </div>
-          
         </dl>
       </div>
     </div>
 
-    {# Result 9 - ENHANCED #}
+    {# Result 9 #}
     <div class="nhsuk-card nhsuk-card--clickable app-card--compact">
       <div class="nhsuk-card__content">
         <h4 class="nhsuk-card__heading nhsuk-heading-s">
@@ -859,52 +559,30 @@ <h4 class="nhsuk-card__heading nhsuk-heading-s">
         <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-2">
           CareTech Solutions
         </p>
-      
-        
         <dl class="nhsuk-summary-list">
           <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">
-              Category
-            </dt>
-            <dd class="nhsuk-summary-list__value">
-              Infusion devices
-            </dd>
+            <dt class="nhsuk-summary-list__key">Category</dt>
+            <dd class="nhsuk-summary-list__value">Infusion devices</dd>
           </div>
-          
           <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">
-              Trusts using this
-            </dt>
-            <dd class="nhsuk-summary-list__value">
-         6 trusts
-            </dd>
+            <dt class="nhsuk-summary-list__key">Trusts using this</dt>
+            <dd class="nhsuk-summary-list__value">6 trusts</dd>
           </div>
-          
           <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">
-              Shared documents
-            </dt>
+            <dt class="nhsuk-summary-list__key">Shared documents</dt>
             <dd class="nhsuk-summary-list__value">
-            7 documents
-              <br>
-              <span class="nhsuk-body-s nhsuk-u-secondary-text-color">
-                Including technical assessments and pilot studies
-              </span>
+              7 documents<br>
+              <span class="nhsuk-body-s nhsuk-u-secondary-text-color">Including technical assessments and pilot studies</span>
             </dd>
           </div>
-          
           <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">
-              Procurement outcomes
-            </dt>
+            <dt class="nhsuk-summary-list__key">Procurement outcomes</dt>
             <dd class="nhsuk-summary-list__value">
               <strong class="nhsuk-tag nhsuk-tag--green">Procured: 4 trusts</strong>
               <strong class="nhsuk-tag nhsuk-tag--blue">Under review: 2 trusts</strong>
             </dd>
           </div>
-          
         </dl>
-
         <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-top-3">
           <strong class="nhsuk-tag nhsuk-tag--white">UK manufactured</strong>
           <strong class="nhsuk-tag nhsuk-tag--white">SME</strong>
@@ -912,7 +590,7 @@ <h4 class="nhsuk-card__heading nhsuk-heading-s">
       </div>
     </div>
 
-    {# Result 10 - ENHANCED #}
+    {# Result 10 #}
     <div class="nhsuk-card nhsuk-card--clickable app-card--compact">
       <div class="nhsuk-card__content">
         <h4 class="nhsuk-card__heading nhsuk-heading-s">
@@ -921,49 +599,28 @@ <h4 class="nhsuk-card__heading nhsuk-heading-s">
         <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-2">
           MedSupply Direct
         </p>
-      
-        
         <dl class="nhsuk-summary-list">
           <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">
-              Category
-            </dt>
-            <dd class="nhsuk-summary-list__value">
-              Infusion devices
-            </dd>
+            <dt class="nhsuk-summary-list__key">Category</dt>
+            <dd class="nhsuk-summary-list__value">Infusion devices</dd>
           </div>
-          
           <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">
-              Trusts using this
-            </dt>
-            <dd class="nhsuk-summary-list__value">
-          2 trusts
-            </dd>
+            <dt class="nhsuk-summary-list__key">Trusts using this</dt>
+            <dd class="nhsuk-summary-list__value">2 trusts</dd>
           </div>
-          
           <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">
-              Shared documents
-            </dt>
+            <dt class="nhsuk-summary-list__key">Shared documents</dt>
             <dd class="nhsuk-summary-list__value">
-            3 documents
-              <br>
-              <span class="nhsuk-body-s nhsuk-u-secondary-text-color">
-                Including usage reports
-              </span>
+              3 documents<br>
+              <span class="nhsuk-body-s nhsuk-u-secondary-text-color">Including usage reports</span>
             </dd>
           </div>
-          
           <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">
-              Procurement outcomes
-            </dt>
+            <dt class="nhsuk-summary-list__key">Procurement outcomes</dt>
             <dd class="nhsuk-summary-list__value">
               <strong class="nhsuk-tag nhsuk-tag--green">Procured: 2 trusts</strong>
             </dd>
           </div>
-          
         </dl>
       </div>
     </div>
@@ -972,38 +629,25 @@ <h4 class="nhsuk-card__heading nhsuk-heading-s">
     <nav class="nhsuk-pagination nhsuk-pagination--numbered" role="navigation" aria-label="Pagination">
       <ul class="nhsuk-pagination__list">
         <li class="nhsuk-pagination__item nhsuk-pagination__item--current">
-          <a class="nhsuk-pagination__link" href="product-page??page=1&amp;limit=25" aria-label="Page 1" aria-current="page">
-            1
-          </a>
+          <a class="nhsuk-pagination__link" href="?page=1&limit=25" aria-label="Page 1" aria-current="page">1</a>
         </li>
         <li class="nhsuk-pagination__item">
-          <a class="nhsuk-pagination__link" href="product-page??page=2&amp;limit=25" aria-label="Page 2">
-            2
-          </a>
+          <a class="nhsuk-pagination__link" href="?page=2&limit=25" aria-label="Page 2">2</a>
         </li>
         <li class="nhsuk-pagination__item">
-          <a class="nhsuk-pagination__link" href="product-page??page=3&amp;limit=25" aria-label="Page 3">
-            3
-          </a>
+          <a class="nhsuk-pagination__link" href="?page=3&limit=25" aria-label="Page 3">3</a>
         </li>
         <li class="nhsuk-pagination__item">
-          <a class="nhsuk-pagination__link" href="product-page??page=4&amp;limit=25" aria-label="Page 4">
-            4
-          </a>
+          <a class="nhsuk-pagination__link" href="?page=4&limit=25" aria-label="Page 4">4</a>
         </li>
         <li class="nhsuk-pagination__item">
-          <a class="nhsuk-pagination__link" href="product-page??page=5&amp;limit=25" aria-label="Page 5">
-            5
-          </a>
+          <a class="nhsuk-pagination__link" href="?page=5&limit=25" aria-label="Page 5">5</a>
         </li>
         <li class="nhsuk-pagination__item">
-          <a class="nhsuk-pagination__link" href="product-page??page=6&amp;limit=25" aria-label="Page 6">
-            6
-          </a>
+          <a class="nhsuk-pagination__link" href="?page=6&limit=25" aria-label="Page 6">6</a>
         </li>
       </ul>
-
-      <a href="product-page??page=2&amp;limit=25" class="nhsuk-pagination__next" rel="next">
+      <a href="?page=2&limit=25" class="nhsuk-pagination__next" rel="next">
         <span class="nhsuk-pagination__title">
           Next<span class="nhsuk-u-visually-hidden"> page</span>
         </span>
@@ -1013,8 +657,200 @@ <h4 class="nhsuk-card__heading nhsuk-heading-s">
       </a>
     </nav>
 
-  </div>
-
-</div>
+  </div>{# /.app-grid-column-results #}
+
+</div>{# /.nhsuk-grid-row #}
+
+
+<!-- ── App-level styles for new chart components only ──────── -->
+<style>
+  .app-dataviz-grid {
+    display: grid;
+    grid-template-columns: 1fr 1fr;
+    gap: 20px;
+  }
+
+  /* Supplier pie layout */
+  .app-pie-wrap {
+    display: flex;
+    align-items: flex-start;
+    gap: 24px;
+  }
+  .app-pie-svg { flex-shrink: 0; }
+
+  /* Supplier legend rows */
+  .app-supplier-legend {
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+    gap: 10px;
+  }
+  .app-supplier-legend__item {
+    display: flex;
+    align-items: flex-start;
+    gap: 8px;
+  }
+  .app-supplier-legend__swatch {
+    width: 12px;
+    height: 12px;
+    border-radius: 2px;
+    flex-shrink: 0;
+    margin-top: 3px;
+  }
+  .app-supplier-legend__body { flex: 1; }
+
+  /* Mini bar under each legend row */
+  .app-supplier-bar-track {
+    height: 5px;
+    background: #d8dde0;
+    border-radius: 2px;
+    overflow: hidden;
+    width: 100%;
+  }
+  .app-supplier-bar-fill {
+    height: 100%;
+    border-radius: 2px;
+  }
+
+  @media (max-width: 768px) {
+    .app-dataviz-grid { grid-template-columns: 1fr; }
+  }
+</style>
+
+
+<!-- ── Canvas chart script ──────────────────────────────────── -->
+<script>
+(function () {
+  // roundRect polyfill for older browsers
+  if (!CanvasRenderingContext2D.prototype.roundRect) {
+    CanvasRenderingContext2D.prototype.roundRect = function (x, y, w, h, r) {
+      this.beginPath();
+      this.moveTo(x + r, y);
+      this.lineTo(x + w - r, y);
+      this.quadraticCurveTo(x + w, y, x + w, y + r);
+      this.lineTo(x + w, y + h - r);
+      this.quadraticCurveTo(x + w, y + h, x + w - r, y + h);
+      this.lineTo(x + r, y + h);
+      this.quadraticCurveTo(x, y + h, x, y + h - r);
+      this.lineTo(x, y + r);
+      this.quadraticCurveTo(x, y, x + r, y);
+      this.closePath();
+    };
+  }
+
+  const canvas = document.getElementById('trustsChart');
+  if (!canvas) return;
+
+  const dpr    = window.devicePixelRatio || 1;
+  const W      = canvas.parentElement.clientWidth || 380;
+  const H      = 200;
+  canvas.width  = W * dpr;
+  canvas.height = H * dpr;
+  canvas.style.width  = W + 'px';
+  canvas.style.height = H + 'px';
+
+  const ctx = canvas.getContext('2d');
+  ctx.scale(dpr, dpr);
+
+  // Product name · similar trusts using (out of 12) · pct of 12
+  const data = [
+    { name: 'PreciseDose PCA System',     similar: 10, pct: 83 },
+    { name: 'VoluMetric Plus Controller', similar: 9,  pct: 75 },
+    { name: 'ElastoFlow Disposable Pump', similar: 8,  pct: 67 },
+    { name: 'SmartPump 300',              similar: 6,  pct: 50 },
+    { name: 'MultiFlow Infusion Hub',     similar: 5,  pct: 42 },
+    { name: 'SafeFlow IV Set',            similar: 4,  pct: 33 },
+  ];
+
+  const padL   = 168;   // label column
+  const padR   = 52;    // count column
+  const padT   = 10;
+  const padB   = 20;    // space for x-axis labels
+  const rowH   = (H - padT - padB) / data.length;
+  const barH   = 13;
+  const barMaxW = W - padL - padR;
+
+  const colFill  = '#005eb8';
+  const colTrack = '#d8dde0';
+  const colText  = '#212b32';
+  const colMuted = '#768692';
+
+  // Grid lines + x-axis labels
+  [0, 25, 50, 75, 100].forEach(pct => {
+    const x = padL + (pct / 100) * barMaxW;
+    ctx.strokeStyle = '#f0f4f5';
+    ctx.lineWidth = 1;
+    ctx.beginPath();
+    ctx.moveTo(x, padT);
+    ctx.lineTo(x, H - padB);
+    ctx.stroke();
+
+    ctx.fillStyle = colMuted;
+    ctx.font = '10px Arial, sans-serif';
+    ctx.textAlign = 'center';
+    ctx.textBaseline = 'top';
+    ctx.fillText(pct + '%', x, H - padB + 4);
+  });
+
+  data.forEach((d, i) => {
+    const midY = padT + i * rowH + rowH / 2;
+    const barY = midY - barH / 2;
+    const fillW = (d.pct / 100) * barMaxW;
+
+    // Label — truncate to fit
+    ctx.fillStyle = colText;
+    ctx.font = '12px Arial, sans-serif';
+    ctx.textAlign = 'right';
+    ctx.textBaseline = 'middle';
+    let label = d.name;
+    while (ctx.measureText(label).width > padL - 10 && label.length > 4) {
+      label = label.slice(0, -4) + '…';
+    }
+    ctx.fillText(label, padL - 8, midY);
+
+    // Track
+    ctx.fillStyle = colTrack;
+    ctx.roundRect(padL, barY, barMaxW, barH, 2);
+    ctx.fill();
+
+    // Fill
+    ctx.fillStyle = colFill;
+    ctx.roundRect(padL, barY, fillW, barH, 2);
+    ctx.fill();
+
+    // Count
+    ctx.fillStyle = colText;
+    ctx.font = 'bold 11px Arial, sans-serif';
+    ctx.textAlign = 'left';
+    ctx.textBaseline = 'middle';
+    ctx.fillText(d.similar + ' / 12', padL + fillW + 6, midY);
+  });
+
+  // Hover tooltip
+  const tooltip = document.getElementById('chartTooltip');
+  canvas.addEventListener('mousemove', function (e) {
+    const rect = canvas.getBoundingClientRect();
+    const mx = e.clientX - rect.left;
+    const my = e.clientY - rect.top;
+    let hit = null;
+    data.forEach((d, i) => {
+      const midY = padT + i * rowH + rowH / 2;
+      const barY = midY - barH / 2;
+      if (mx >= padL && mx <= padL + barMaxW && my >= barY - 4 && my <= barY + barH + 4) {
+        hit = d;
+      }
+    });
+    if (hit) {
+      tooltip.style.display = 'block';
+      tooltip.style.left = (mx + 12) + 'px';
+      tooltip.style.top  = (my - 30) + 'px';
+      tooltip.innerHTML  = '<strong>' + hit.similar + ' of 12</strong> similar trusts procured this';
+    } else {
+      tooltip.style.display = 'none';
+    }
+  });
+  canvas.addEventListener('mouseleave', () => { tooltip.style.display = 'none'; });
+})();
+</script>
 
 {% endblock %}
\ No newline at end of file
diff --git a/app/views/current/search.html b/app/views/current/search.html
index 31b0fe9..d683f5e 100755
--- a/app/views/current/search.html
+++ b/app/views/current/search.html
@@ -70,7 +70,7 @@ <h3 class="nhsuk-card__heading nhsuk-heading-s">
         <div class="nhsuk-card nhsuk-card--clickable">
           <div class="nhsuk-card__content">
             <h3 class="nhsuk-card__heading nhsuk-heading-s">
-              <a class="nhsuk-card__link" href="category-wound-care">Wound care</a>
+              <a class="nhsuk-card__link" href="search-results-viz">Wound care</a>
             </h3>
             <p class="nhsuk-card__description">Dressings, negative pressure therapy and skin substitutes</p>
             <p class="nhsuk-body-s nhsuk-u-secondary-text-color">183 products · 56 trust evaluations</p>
diff --git a/app/views/index.html b/app/views/index.html
index 7b8551e..9109d44 100755
--- a/app/views/index.html
+++ b/app/views/index.html
@@ -56,7 +56,7 @@ <h2 class="nhsuk-heading-m">Procurement team journey - current (v4)</h2>
       <li><a href="current/category-wound-care">Search results category</a></li>
       <li><a href="current/product-page">Product page 1</a></li>
       <li><a href="current/product-detail">Product page 2</a></li>
-      <li><a href="current/search-results-viz-2">Search results visualisation <span class="nhsuk-tag nhsuk-tag--grey nhsuk-u-margin-left-5">experimental</span></a></li>
+      <li><a href="current/search-results-viz">Search results visualisation <span class="nhsuk-tag nhsuk-tag--grey nhsuk-u-margin-left-5">experimental</span></a></li>
             <li><a href="current/search-results-dashboard">Data Dashboard <span class="nhsuk-tag nhsuk-tag--grey nhsuk-u-margin-left-5">experimental</span></a></li>
 
       <!---

From b1f71bcd80573110bf30f272771e38cae6d29904 Mon Sep 17 00:00:00 2001
From: David Evans <xd.davidevans@gmail.com>
Date: Sun, 1 Mar 2026 21:17:24 +0000
Subject: [PATCH 2/2] wound care sub cats

---
 app/views/current/search-results-viz-all.html | 543 +++++++++++
 .../current/search-results-viz-sub-cat.html   | 673 ++++++++++++++
 app/views/current/search-results-viz.html     | 856 ------------------
 app/views/current/search.html                 |   2 +-
 4 files changed, 1217 insertions(+), 857 deletions(-)
 create mode 100644 app/views/current/search-results-viz-all.html
 create mode 100644 app/views/current/search-results-viz-sub-cat.html
 delete mode 100644 app/views/current/search-results-viz.html

diff --git a/app/views/current/search-results-viz-all.html b/app/views/current/search-results-viz-all.html
new file mode 100644
index 0000000..cb8fca8
--- /dev/null
+++ b/app/views/current/search-results-viz-all.html
@@ -0,0 +1,543 @@
+{% extends prototypeVersion + '/layouts/layout-signed-in.html' %}
+
+{% set pageName = "Search medical technologies - Compass" %}
+{% set serviceHeader = "Compass" %}
+
+{% block beforeContent %}
+{% from "breadcrumb/macro.njk" import breadcrumb %}
+
+{{ breadcrumb({
+  items: [
+    {
+      href: "/",
+      text: "Home"
+    }
+  ],
+  href: "#",
+  text: "Search results"
+}) }}
+{% endblock %}
+
+{% block content %}
+
+
+
+    <!-- ═══════════════════════════════════════════
+         PAGE HEADING + CATEGORY CONTEXT
+         ═══════════════════════════════════════════ -->
+    <div class="nhsuk-grid-row">
+      <div class="nhsuk-grid-column-full">
+        <h1 class="nhsuk-heading-l nhsuk-u-margin-bottom-3">Wound care</h1>
+
+        <!-- nhsuk-details component — GMDN description behind progressive disclosure -->
+        <details class="nhsuk-details nhsuk-u-margin-bottom-4">
+          <summary class="nhsuk-details__summary">
+            <span class="nhsuk-details__summary-text">
+              About this category (GMDN 08 — Dressings and wound care)
+            </span>
+          </summary>
+          <div class="nhsuk-details__text">
+            <p class="nhsuk-body">Products for wound dressing, debridement, infection management and tissue regeneration. This category is part of the GMDN Wound management group and covers advanced dressings, compression therapy, negative pressure wound therapy, debridement, and skin substitutes.</p>
+          </div>
+        </details>
+      </div>
+    </div>
+
+
+    <!-- ═══════════════════════════════════════════
+         SUBCATEGORY NAVIGATION
+         nhsuk-contents-list — canonical NHS pattern
+         for navigating between sections of a category
+         ═══════════════════════════════════════════ -->
+    <div class="nhsuk-grid-row">
+      <div class="nhsuk-grid-column-full">
+
+        <nav class="nhsuk-contents-list nhsuk-u-margin-bottom-0" role="navigation" aria-label="Filter by subcategory">
+          <h2 class="nhsuk-contents-list__title nhsuk-u-font-size-16">Subcategory</h2>
+          <ol class="nhsuk-contents-list__list">
+
+            <li class="nhsuk-contents-list__item">
+              <span class="nhsuk-contents-list__link" aria-current="true">
+                All wound care
+                <span class="nhsuk-u-secondary-text-color nhsuk-u-font-size-14">(143)</span>
+              </span>
+            </li>
+
+            <li class="nhsuk-contents-list__item" href="?cat=wound-care&sub=advanced-dressings">
+              <a class="nhsuk-contents-list__current">
+                Advanced dressings
+                <span class="nhsuk-u-secondary-text-color nhsuk-u-font-size-14">(52)</span>
+              </a>
+            </li>
+
+            <li class="nhsuk-contents-list__item">
+              <a class="nhsuk-contents-list__link" href="?cat=wound-care&sub=antimicrobial">
+                Antimicrobial &amp; infection
+                <span class="nhsuk-u-secondary-text-color nhsuk-u-font-size-14">(31)</span>
+              </a>
+            </li>
+
+            <li class="nhsuk-contents-list__item">
+              <a class="nhsuk-contents-list__link" href="?cat=wound-care&sub=compression">
+                Compression therapy
+                <span class="nhsuk-u-secondary-text-color nhsuk-u-font-size-14">(24)</span>
+              </a>
+            </li>
+
+            <li class="nhsuk-contents-list__item">
+              <a class="nhsuk-contents-list__link" href="?cat=wound-care&sub=negative-pressure">
+                Negative pressure wound therapy
+                <span class="nhsuk-u-secondary-text-color nhsuk-u-font-size-14">(18)</span>
+              </a>
+            </li>
+
+            <li class="nhsuk-contents-list__item">
+              <a class="nhsuk-contents-list__link" href="?cat=wound-care&sub=debridement">
+                Debridement products
+                <span class="nhsuk-u-secondary-text-color nhsuk-u-font-size-14">(11)</span>
+              </a>
+            </li>
+
+            <li class="nhsuk-contents-list__item">
+              <a class="nhsuk-contents-list__link" href="?cat=wound-care&sub=skin-grafts">
+                Skin substitutes &amp; grafts
+                <span class="nhsuk-u-secondary-text-color nhsuk-u-font-size-14">(7)</span>
+              </a>
+            </li>
+
+          </ol>
+        </nav>
+
+      </div>
+    </div>
+
+    <hr class="nhsuk-section-break nhsuk-section-break--m nhsuk-section-break--visible">
+
+
+   
+
+
+    <!-- ═══════════════════════════════════════════
+         DATA VIZ SECTION
+         ═══════════════════════════════════════════ -->
+    <div class="nhsuk-grid-row nhsuk-u-margin-bottom-6">
+    
+
+    
+
+        <div class="app-dataviz-grid">
+            <div class="nhsuk-grid-column-one-half">
+
+          <!-- ── Chart 1: Supplier market share ──────────── -->
+          <div class="nhsuk-card">
+            <div class="nhsuk-card__content">
+              <h3 class="nhsuk-heading-s nhsuk-u-margin-bottom-1">Supplier market share</h3>
+              <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-4">Advanced dressings only &middot; 52 products</p>
+
+              <div class="app-pie-wrap">
+                <svg class="app-pie-svg" width="140" height="140" viewBox="0 0 140 140" aria-hidden="true">
+                  <path d="M70 70 L70 10 A60 60 0 0 1 118 103 Z" fill="#005eb8"/>
+                  <path d="M70 70 L118 103 A60 60 0 0 1 42 127 Z" fill="#007f3b"/>
+                  <path d="M70 70 L42 127 A60 60 0 0 1 14 56 Z" fill="#ffb81c"/>
+                  <path d="M70 70 L14 56 A60 60 0 0 1 70 10 Z" fill="#aeb7bd"/>
+                  <circle cx="70" cy="70" r="32" fill="#fff"/>
+                  <text x="70" y="66" text-anchor="middle" font-size="18" font-weight="700" fill="#212b32">52</text>
+                  <text x="70" y="80" text-anchor="middle" font-size="10" fill="#768692">products</text>
+                </svg>
+
+                <div class="app-supplier-legend">
+                  <div class="app-supplier-legend__item">
+                    <div class="app-supplier-legend__swatch" style="background:#005eb8;"></div>
+                    <div class="app-supplier-legend__body">
+                      <p class="nhsuk-body-s nhsuk-u-margin-bottom-0"><strong>Smith+Nephew</strong></p>
+                      <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-1">38% &middot; 20 products</p>
+                      <div class="app-supplier-bar-track"><div class="app-supplier-bar-fill" style="width:100%;background:#005eb8;"></div></div>
+                    </div>
+                  </div>
+                  <div class="app-supplier-legend__item">
+                    <div class="app-supplier-legend__swatch" style="background:#007f3b;"></div>
+                    <div class="app-supplier-legend__body">
+                      <p class="nhsuk-body-s nhsuk-u-margin-bottom-0"><strong>M&ouml;lnlycke Health Care</strong></p>
+                      <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-1">29% &middot; 15 products</p>
+                      <div class="app-supplier-bar-track"><div class="app-supplier-bar-fill" style="width:76%;background:#007f3b;"></div></div>
+                    </div>
+                  </div>
+                  <div class="app-supplier-legend__item">
+                    <div class="app-supplier-legend__swatch" style="background:#ffb81c;"></div>
+                    <div class="app-supplier-legend__body">
+                      <p class="nhsuk-body-s nhsuk-u-margin-bottom-0"><strong>ConvaTec</strong></p>
+                      <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-1">21% &middot; 11 products</p>
+                      <div class="app-supplier-bar-track"><div class="app-supplier-bar-fill" style="width:55%;background:#ffb81c;"></div></div>
+                    </div>
+                  </div>
+                  <div class="app-supplier-legend__item">
+                    <div class="app-supplier-legend__swatch" style="background:#aeb7bd;"></div>
+                    <div class="app-supplier-legend__body">
+                      <p class="nhsuk-body-s nhsuk-u-margin-bottom-0"><strong>Others</strong></p>
+                      <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-1">12% &middot; 6 products</p>
+                      <div class="app-supplier-bar-track"><div class="app-supplier-bar-fill" style="width:32%;background:#aeb7bd;"></div></div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+
+            </div>
+          </div>
+
+          </div>
+
+
+            <div class="nhsuk-grid-column-one-half">
+
+          <div class="nhsuk-card">
+            <div class="nhsuk-card__content">
+              <p class="compass-card__label">Innovation vs maturity &mdash; trust adoption</p>
+              <div class="nhsuk-u-margin-top-3">
+                <div class="nhsuk-u-display-flex nhsuk-u-justify-content-space-between nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-2">
+                  <span>Emerging (&lt;2 years)</span>
+                  <span>Proven (&gt;5 years)</span>
+                </div>
+                <div class="seg-bar" role="img" aria-label="Segmented bar: 22% under 2 years, 28% 2-5 years, 31% 5-10 years, 19% over 10 years">
+                  <div class="seg-bar__seg" style="flex:22;background:#00a9ce;">22%</div>
+                  <div class="seg-bar__seg" style="flex:28;background:#1d70b8;">28%</div>
+                  <div class="seg-bar__seg" style="flex:31;background:#003087;">31%</div>
+                  <div class="seg-bar__seg" style="flex:19;background:#002060;">19%</div>
+                </div>
+                <div class="seg-legend">
+                  <div class="seg-legend__item"><div class="seg-legend__dot" style="background:#00a9ce;"></div>&lt;2 yrs (22%)</div>
+                  <div class="seg-legend__item"><div class="seg-legend__dot" style="background:#1d70b8;"></div>2&ndash;5 yrs (28%)</div>
+                  <div class="seg-legend__item"><div class="seg-legend__dot" style="background:#003087;"></div>5&ndash;10 yrs (31%)</div>
+                  <div class="seg-legend__item"><div class="seg-legend__dot" style="background:#002060;"></div>10+ yrs (19%)</div>
+                </div>
+              </div>
+
+              <p class="compass-card__label nhsuk-u-margin-top-6">Top innovative products (adopted last 12 months)</p>
+              <div class="innovation-row">
+                <span class="nhsuk-body-s" style="flex:1;"><strong>Collagen Pro Matrix</strong> &mdash; 3 trusts &middot; 4 months old</span>
+                <strong class="nhsuk-tag nhsuk-tag--green">New</strong>
+              </div>
+              <div class="innovation-row">
+                <span class="nhsuk-body-s" style="flex:1;"><strong>WoundSeal Antimicrobial</strong> &mdash; 1 trust &middot; 8 months old</span>
+                <strong class="nhsuk-tag nhsuk-tag--green">New</strong>
+              </div>
+              <div class="innovation-row">
+                <span class="nhsuk-body-s" style="flex:1;"><strong>Mepilex Border Flex</strong> &mdash; 11 trusts &middot; 2 years old</span>
+                <strong class="nhsuk-tag nhsuk-tag--blue">Growing</strong>
+              </div>
+            </div>
+          </div>
+
+        </div>
+
+      
+    </div>
+
+
+    <!-- ═══════════════════════════════════════════
+         SEARCH BAR HERE
+         ═══════════════════════════════════════════ -->
+    
+
+
+    <!-- ═══════════════════════════════════════════
+         FILTER SIDEBAR + RESULTS
+         ═══════════════════════════════════════════ -->
+    <div class="nhsuk-grid-row">
+      <div class="nhsuk-grid-column-full">
+        <div class="app-layout-filter-results">
+
+            {# Filters Sidebar #}
+  <app-auto-submit class="app-grid-column-filters">
+      
+    <div class="nhsuk-card nhsuk-card--feature app-filters">
+      <div class="nhsuk-card__content nhsuk-card__content--feature">
+        <h3 class="nhsuk-card__heading nhsuk-card__heading--feature">
+          Filter results
+        </h3>
+      
+      
+
+
+        {# Clinical Trial Status Filter #}
+        <div class="nhsuk-form-group">
+          <fieldset class="nhsuk-fieldset">
+            <legend class="nhsuk-fieldset__legend nhsuk-fieldset__legend--s">
+              Procured in other trusts
+            </legend>
+            
+            <div id="trial-items" class="nhsuk-radios nhsuk-radios--small" data-module="nhsuk-radios" data-nhsuk-radios-init="">
+              <div class="nhsuk-radios__item">
+                <input class="nhsuk-radios__input" id="trial-any" name="[trial]" type="radio" value="any" checked="">
+                <label class="nhsuk-label nhsuk-radios__label" for="trial-any">
+                  Any
+                </label>
+              </div>
+              
+              
+            
+            </div>
+          </fieldset>
+        </div>
+
+        {# Supplier Type Filter #}
+        <div class="nhsuk-form-group">
+          <fieldset class="nhsuk-fieldset">
+            <legend class="nhsuk-fieldset__legend nhsuk-fieldset__legend--s">
+              Supplier size
+            </legend>
+            
+            <div id="supplier-items" class="nhsuk-checkboxes nhsuk-checkboxes--small" data-module="nhsuk-checkboxes" data-nhsuk-checkboxes-init="">
+              <div class="nhsuk-checkboxes__item">
+                <input class="nhsuk-checkboxes__input" id="supplier-sme" name="[supplier]" type="checkbox" value="sme">
+                <label class="nhsuk-label nhsuk-checkboxes__label" for="supplier-sme">
+                  1-50 employees
+                </label>
+              </div>
+              
+            
+            </div>
+             <div id="supplier-items" class="nhsuk-checkboxes nhsuk-checkboxes--small" data-module="nhsuk-checkboxes" data-nhsuk-checkboxes-init="">
+              <div class="nhsuk-checkboxes__item">
+                <input class="nhsuk-checkboxes__input" id="supplier-sme" name="[supplier]" type="checkbox" value="sme">
+                <label class="nhsuk-label nhsuk-checkboxes__label" for="supplier-sme">
+                  51-250 employees
+                </label>
+              </div>
+              
+            
+            </div>
+
+          </fieldset>
+        </div>
+        
+        <div class="nhsuk-button-group">
+          <button class="nhsuk-button nhsuk-button--secondary app-button--small" data-module="nhsuk-button" formaction="" formmethod="post" role="search" type="submit" hidden="" data-nhsuk-button-init="">
+            Update results
+          </button>
+        </div>
+      </div>
+    </div>
+
+  </app-auto-submit>
+
+
+          <!-- ── Results column ─────────────────────────── -->
+          <div class="app-grid-column-results">
+
+            <h3 class="nhsuk-heading-m nhsuk-u-margin-bottom-2">All wound care products</h3>
+            <p class="nhsuk-caption-m nhsuk-u-margin-bottom-4">
+              Showing 1 to 10 of 182 products
+            </p>
+
+            <!-- Result 1 -->
+            <div class="nhsuk-card nhsuk-card--clickable">
+              <div class="nhsuk-card__content">
+                <h4 class="nhsuk-card__heading nhsuk-heading-s">
+                  <a class="nhsuk-card__link" href="product-page?mepilex-border-flex">Mepilex Border Flex</a>
+                </h4>
+                <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-2">
+                  M&ouml;lnlycke Health Care &middot; Advanced dressings &rsaquo; Foam
+                </p>
+                <dl class="nhsuk-summary-list">
+                  <div class="nhsuk-summary-list__row">
+                    <dt class="nhsuk-summary-list__key">Trusts using this</dt>
+                    <dd class="nhsuk-summary-list__value">11 trusts</dd>
+                  </div>
+                  <div class="nhsuk-summary-list__row">
+                    <dt class="nhsuk-summary-list__key">Shared documents</dt>
+                    <dd class="nhsuk-summary-list__value">
+                      9 documents<br>
+                      <span class="nhsuk-body-s nhsuk-u-secondary-text-color">Including clinical trials and comparative studies</span>
+                    </dd>
+                  </div>
+                  <div class="nhsuk-summary-list__row">
+                    <dt class="nhsuk-summary-list__key">Procurement outcomes</dt>
+                    <dd class="nhsuk-summary-list__value">
+                      <strong class="nhsuk-tag nhsuk-tag--green">Procured: 9 trusts</strong>
+                    
+                    </dd>
+                  </div>
+                </dl>
+                <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-top-3">
+              
+                </p>
+              </div>
+            </div>
+
+            <!-- Result 2 -->
+            <div class="nhsuk-card nhsuk-card--clickable">
+              <div class="nhsuk-card__content">
+                <h4 class="nhsuk-card__heading nhsuk-heading-s">
+                  <a class="nhsuk-card__link" href="product-page?allevyn-life">ALLEVYN Life</a>
+                </h4>
+                <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-2">
+                  Smith+Nephew &middot; Advanced dressings &rsaquo; Foam
+                </p>
+                <dl class="nhsuk-summary-list">
+                  <div class="nhsuk-summary-list__row">
+                    <dt class="nhsuk-summary-list__key">Trusts using this</dt>
+                    <dd class="nhsuk-summary-list__value">8 trusts</dd>
+                  </div>
+                  <div class="nhsuk-summary-list__row">
+                    <dt class="nhsuk-summary-list__key">Shared documents</dt>
+                    <dd class="nhsuk-summary-list__value">
+                      12 documents<br>
+                      <span class="nhsuk-body-s nhsuk-u-secondary-text-color">Including clinical trials, pilot studies and business cases</span>
+                    </dd>
+                  </div>
+                  <div class="nhsuk-summary-list__row">
+                    <dt class="nhsuk-summary-list__key">Procurement outcomes</dt>
+                    <dd class="nhsuk-summary-list__value">
+                      <strong class="nhsuk-tag nhsuk-tag--green">Procured: 7 trusts</strong>
+                  
+                    </dd>
+                  </div>
+                </dl>
+                <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-top-3">
+                
+                </p>
+              </div>
+            </div>
+
+            <!-- Result 3 -->
+            <div class="nhsuk-card nhsuk-card--clickable">
+              <div class="nhsuk-card__content">
+                <h4 class="nhsuk-card__heading nhsuk-heading-s">
+                  <a class="nhsuk-card__link" href="product-page?aquacel-ag">Aquacel Ag+ Extra</a>
+                </h4>
+                <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-2">
+                  ConvaTec &middot; Advanced dressings &rsaquo; Hydrofibre
+                </p>
+                <dl class="nhsuk-summary-list">
+                  <div class="nhsuk-summary-list__row">
+                    <dt class="nhsuk-summary-list__key">Trusts using this</dt>
+                    <dd class="nhsuk-summary-list__value">6 trusts</dd>
+                  </div>
+                  <div class="nhsuk-summary-list__row">
+                    <dt class="nhsuk-summary-list__key">Shared documents</dt>
+                    <dd class="nhsuk-summary-list__value">
+                      7 documents<br>
+                      <span class="nhsuk-body-s nhsuk-u-secondary-text-color">Including comparative studies and infection outcome data</span>
+                    </dd>
+                  </div>
+                  <div class="nhsuk-summary-list__row">
+                    <dt class="nhsuk-summary-list__key">Procurement outcomes</dt>
+                    <dd class="nhsuk-summary-list__value">
+                      <strong class="nhsuk-tag nhsuk-tag--green">Procured: 5 trusts</strong>
+                    
+                    </dd>
+                  </div>
+                </dl>
+              </div>
+            </div>
+
+            <!-- Result 4 — new product -->
+            <div class="nhsuk-card nhsuk-card--clickable">
+              <div class="nhsuk-card__content">
+                <h4 class="nhsuk-card__heading nhsuk-heading-s">
+                  <a class="nhsuk-card__link" href="product-page?collagen-pro-matrix">Collagen Pro Matrix</a>
+                </h4>
+                <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-2">
+                  Advanced Wound Biotech &middot; Advanced dressings &rsaquo; Collagen / tissue regeneration
+                </p>
+                <dl class="nhsuk-summary-list">
+                  <div class="nhsuk-summary-list__row">
+                    <dt class="nhsuk-summary-list__key">Trusts using this</dt>
+                    <dd class="nhsuk-summary-list__value">3 trusts</dd>
+                  </div>
+                  <div class="nhsuk-summary-list__row">
+                    <dt class="nhsuk-summary-list__key">Shared documents</dt>
+                    <dd class="nhsuk-summary-list__value">
+                      4 documents<br>
+                      <span class="nhsuk-body-s nhsuk-u-secondary-text-color">Including pilot studies and early outcomes data</span>
+                    </dd>
+                  </div>
+                  <div class="nhsuk-summary-list__row">
+                    <dt class="nhsuk-summary-list__key">Procurement outcomes</dt>
+                    <dd class="nhsuk-summary-list__value">
+                   
+
+                      <strong class="nhsuk-tag nhsuk-tag--green">Procured: 1 trust</strong>
+                    </dd>
+                  </div>
+                </dl>
+                <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-top-3">
+                  <strong class="nhsuk-tag nhsuk-tag--green">New</strong>
+                  <strong class="nhsuk-tag nhsuk-tag--white">SME</strong>
+                </p>
+              </div>
+            </div>
+
+            <!-- Result 5 -->
+            <div class="nhsuk-card nhsuk-card--clickable">
+              <div class="nhsuk-card__content">
+                <h4 class="nhsuk-card__heading nhsuk-heading-s">
+                  <a class="nhsuk-card__link" href="product-page?biatain-silicone">Biatain Silicone</a>
+                </h4>
+                <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-2">
+                  Coloplast &middot; Advanced dressings &rsaquo; Foam
+                </p>
+                <dl class="nhsuk-summary-list">
+                  <div class="nhsuk-summary-list__row">
+                    <dt class="nhsuk-summary-list__key">Trusts using this</dt>
+                    <dd class="nhsuk-summary-list__value">5 trusts</dd>
+                  </div>
+                  <div class="nhsuk-summary-list__row">
+                    <dt class="nhsuk-summary-list__key">Shared documents</dt>
+                    <dd class="nhsuk-summary-list__value">
+                      6 documents<br>
+                      <span class="nhsuk-body-s nhsuk-u-secondary-text-color">Including clinical trials and usage reports</span>
+                    </dd>
+                  </div>
+                  <div class="nhsuk-summary-list__row">
+                    <dt class="nhsuk-summary-list__key">Procurement outcomes</dt>
+                    <dd class="nhsuk-summary-list__value">
+                      <strong class="nhsuk-tag nhsuk-tag--green">Procured: 4 trusts</strong>
+                    
+                    </dd>
+                  </div>
+                </dl>
+              </div>
+            </div>
+
+            <!-- nhsuk-pagination--numbered -->
+            <nav class="nhsuk-pagination nhsuk-pagination--numbered" role="navigation" aria-label="Pagination">
+              <ul class="nhsuk-pagination__list">
+                <li class="nhsuk-pagination__item nhsuk-pagination__item--current">
+                  <a class="nhsuk-pagination__link" href="?page=1&limit=10" aria-label="Page 1" aria-current="page">1</a>
+                </li>
+                <li class="nhsuk-pagination__item">
+                  <a class="nhsuk-pagination__link" href="?page=2&limit=10" aria-label="Page 2">2</a>
+                </li>
+                <li class="nhsuk-pagination__item">
+                  <a class="nhsuk-pagination__link" href="?page=3&limit=10" aria-label="Page 3">3</a>
+                </li>
+                <li class="nhsuk-pagination__item">
+                  <a class="nhsuk-pagination__link" href="?page=4&limit=10" aria-label="Page 4">4</a>
+                </li>
+                <li class="nhsuk-pagination__item">
+                  <a class="nhsuk-pagination__link" href="?page=5&limit=10" aria-label="Page 5">5</a>
+                </li>
+                <li class="nhsuk-pagination__item">
+                  <a class="nhsuk-pagination__link" href="?page=6&limit=10" aria-label="Page 6">6</a>
+                </li>
+              </ul>
+              <a href="?page=2&limit=10" class="nhsuk-pagination__next" rel="next">
+                <span class="nhsuk-pagination__title">
+                  Next<span class="nhsuk-u-visually-hidden"> page</span>
+                </span>
+                <svg class="nhsuk-icon nhsuk-icon--arrow-right" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="16" height="16" focusable="false" aria-hidden="true">
+                  <path d="m14.7 6.3 5 5c.2.2.3.4.3.7 0 .3-.1.5-.3.7l-5 5a1 1 0 0 1-1.4-1.4l3.3-3.3H5a1 1 0 0 1 0-2h11.6l-3.3-3.3a1 1 0 1 1 1.4-1.4Z"></path>
+                </svg>
+              </a>
+            </nav>
+
+          </div>
+
+        </div>
+      </div>
+    </div>
+
+
+
+{% endblock %}
\ No newline at end of file
diff --git a/app/views/current/search-results-viz-sub-cat.html b/app/views/current/search-results-viz-sub-cat.html
new file mode 100644
index 0000000..ca8e131
--- /dev/null
+++ b/app/views/current/search-results-viz-sub-cat.html
@@ -0,0 +1,673 @@
+{% extends prototypeVersion + '/layouts/layout-signed-in.html' %}
+
+{% set pageName = "Search medical technologies - Compass" %}
+{% set serviceHeader = "Compass" %}
+
+{% block beforeContent %}
+{% from "breadcrumb/macro.njk" import breadcrumb %}
+
+{{ breadcrumb({
+  items: [
+    {
+      href: "/",
+      text: "Home"
+    }
+  ],
+  href: "#",
+  text: "Search results"
+}) }}
+{% endblock %}
+
+{% block content %}
+
+
+
+    <!-- ═══════════════════════════════════════════
+         PAGE HEADING + CATEGORY CONTEXT
+         ═══════════════════════════════════════════ -->
+    <div class="nhsuk-grid-row">
+      <div class="nhsuk-grid-column-full">
+        <h1 class="nhsuk-heading-l nhsuk-u-margin-bottom-3">Wound care</h1>
+
+        <!-- nhsuk-details component — GMDN description behind progressive disclosure -->
+        <details class="nhsuk-details nhsuk-u-margin-bottom-4">
+          <summary class="nhsuk-details__summary">
+            <span class="nhsuk-details__summary-text">
+              About this category (GMDN 08 — Dressings and wound care)
+            </span>
+          </summary>
+          <div class="nhsuk-details__text">
+            <p class="nhsuk-body">Products for wound dressing, debridement, infection management and tissue regeneration. This category is part of the GMDN Wound management group and covers advanced dressings, compression therapy, negative pressure wound therapy, debridement, and skin substitutes.</p>
+          </div>
+        </details>
+      </div>
+    </div>
+
+
+    <!-- ═══════════════════════════════════════════
+         SUBCATEGORY NAVIGATION
+         nhsuk-contents-list — canonical NHS pattern
+         for navigating between sections of a category
+         ═══════════════════════════════════════════ -->
+    <div class="nhsuk-grid-row">
+      <div class="nhsuk-grid-column-full">
+
+        <nav class="nhsuk-contents-list nhsuk-u-margin-bottom-0" role="navigation" aria-label="Filter by subcategory">
+          <h2 class="nhsuk-contents-list__title nhsuk-u-font-size-16">Subcategory</h2>
+          <ol class="nhsuk-contents-list__list">
+
+            <li class="nhsuk-contents-list__item">
+              <a class="nhsuk-contents-list__link" href="?cat=wound-care">
+                All wound care
+                <span class="nhsuk-u-secondary-text-color nhsuk-u-font-size-14">(143)</span>
+              </a>
+            </li>
+
+            <li class="nhsuk-contents-list__item" aria-current="page">
+              <span class="nhsuk-contents-list__current">
+                Advanced dressings
+                <span class="nhsuk-u-secondary-text-color nhsuk-u-font-size-14">(52)</span>
+              </span>
+            </li>
+
+            <li class="nhsuk-contents-list__item">
+              <a class="nhsuk-contents-list__link" href="?cat=wound-care&sub=antimicrobial">
+                Antimicrobial &amp; infection
+                <span class="nhsuk-u-secondary-text-color nhsuk-u-font-size-14">(31)</span>
+              </a>
+            </li>
+
+            <li class="nhsuk-contents-list__item">
+              <a class="nhsuk-contents-list__link" href="?cat=wound-care&sub=compression">
+                Compression therapy
+                <span class="nhsuk-u-secondary-text-color nhsuk-u-font-size-14">(24)</span>
+              </a>
+            </li>
+
+            <li class="nhsuk-contents-list__item">
+              <a class="nhsuk-contents-list__link" href="?cat=wound-care&sub=negative-pressure">
+                Negative pressure wound therapy
+                <span class="nhsuk-u-secondary-text-color nhsuk-u-font-size-14">(18)</span>
+              </a>
+            </li>
+
+            <li class="nhsuk-contents-list__item">
+              <a class="nhsuk-contents-list__link" href="?cat=wound-care&sub=debridement">
+                Debridement products
+                <span class="nhsuk-u-secondary-text-color nhsuk-u-font-size-14">(11)</span>
+              </a>
+            </li>
+
+            <li class="nhsuk-contents-list__item">
+              <a class="nhsuk-contents-list__link" href="?cat=wound-care&sub=skin-grafts">
+                Skin substitutes &amp; grafts
+                <span class="nhsuk-u-secondary-text-color nhsuk-u-font-size-14">(7)</span>
+              </a>
+            </li>
+
+          </ol>
+        </nav>
+
+      </div>
+    </div>
+
+    <hr class="nhsuk-section-break nhsuk-section-break--m nhsuk-section-break--visible">
+
+
+    <!-- ═══════════════════════════════════════════
+         ACTIVE SUBCATEGORY CONTEXT
+         nhsuk-inset-text — confirms active filter,
+         surfaces the clear/reset action
+         ═══════════════════════════════════════════ -->
+    <div class="nhsuk-grid-row">
+      <div class="nhsuk-grid-column-full nhsuk-u-margin-bottom-4">
+        <div class="nhsuk-inset-text">
+          <span class="nhsuk-u-visually-hidden">Information: </span>
+          <p class="nhsuk-body nhsuk-u-margin-bottom-1">
+            <strong>Showing: Advanced dressings</strong>
+          </p>
+          <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-0">
+            Includes foam, hydrocolloid, alginate, hydrogel and film dressings.
+            <a href="?cat=wound-care">Clear subcategory filter and view all wound care</a>
+          </p>
+        </div>
+      </div>
+    </div>
+
+
+    <!-- ═══════════════════════════════════════════
+         DATA VIZ SECTION
+         ═══════════════════════════════════════════ -->
+    <div class="nhsuk-grid-row nhsuk-u-margin-bottom-6">
+      <div class="nhsuk-grid-column-full">
+
+        <hr class="nhsuk-u-margin-top-0 nhsuk-u-margin-bottom-3">
+
+        <p class="nhsuk-body-l nhsuk-u-margin-bottom-1">
+          <strong>14 NHS trusts</strong> have experience with products in <strong>Advanced dressings</strong>.
+        </p>
+        <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-5">
+          Part of Wound care (18 trusts across all subcategories)
+        </p>
+
+        <div class="app-dataviz-grid">
+
+          <!-- ── Chart 1: Supplier market share ──────────── -->
+          <div class="nhsuk-card">
+            <div class="nhsuk-card__content">
+              <h3 class="nhsuk-heading-s nhsuk-u-margin-bottom-1">Supplier market share</h3>
+              <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-4">Advanced dressings only &middot; 52 products</p>
+
+              <div class="app-pie-wrap">
+                <svg class="app-pie-svg" width="140" height="140" viewBox="0 0 140 140" aria-hidden="true">
+                  <path d="M70 70 L70 10 A60 60 0 0 1 118 103 Z" fill="#005eb8"/>
+                  <path d="M70 70 L118 103 A60 60 0 0 1 42 127 Z" fill="#007f3b"/>
+                  <path d="M70 70 L42 127 A60 60 0 0 1 14 56 Z" fill="#ffb81c"/>
+                  <path d="M70 70 L14 56 A60 60 0 0 1 70 10 Z" fill="#aeb7bd"/>
+                  <circle cx="70" cy="70" r="32" fill="#fff"/>
+                  <text x="70" y="66" text-anchor="middle" font-size="18" font-weight="700" fill="#212b32">52</text>
+                  <text x="70" y="80" text-anchor="middle" font-size="10" fill="#768692">products</text>
+                </svg>
+
+                <div class="app-supplier-legend">
+                  <div class="app-supplier-legend__item">
+                    <div class="app-supplier-legend__swatch" style="background:#005eb8;"></div>
+                    <div class="app-supplier-legend__body">
+                      <p class="nhsuk-body-s nhsuk-u-margin-bottom-0"><strong>Smith+Nephew</strong></p>
+                      <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-1">38% &middot; 20 products</p>
+                      <div class="app-supplier-bar-track"><div class="app-supplier-bar-fill" style="width:100%;background:#005eb8;"></div></div>
+                    </div>
+                  </div>
+                  <div class="app-supplier-legend__item">
+                    <div class="app-supplier-legend__swatch" style="background:#007f3b;"></div>
+                    <div class="app-supplier-legend__body">
+                      <p class="nhsuk-body-s nhsuk-u-margin-bottom-0"><strong>M&ouml;lnlycke Health Care</strong></p>
+                      <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-1">29% &middot; 15 products</p>
+                      <div class="app-supplier-bar-track"><div class="app-supplier-bar-fill" style="width:76%;background:#007f3b;"></div></div>
+                    </div>
+                  </div>
+                  <div class="app-supplier-legend__item">
+                    <div class="app-supplier-legend__swatch" style="background:#ffb81c;"></div>
+                    <div class="app-supplier-legend__body">
+                      <p class="nhsuk-body-s nhsuk-u-margin-bottom-0"><strong>ConvaTec</strong></p>
+                      <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-1">21% &middot; 11 products</p>
+                      <div class="app-supplier-bar-track"><div class="app-supplier-bar-fill" style="width:55%;background:#ffb81c;"></div></div>
+                    </div>
+                  </div>
+                  <div class="app-supplier-legend__item">
+                    <div class="app-supplier-legend__swatch" style="background:#aeb7bd;"></div>
+                    <div class="app-supplier-legend__body">
+                      <p class="nhsuk-body-s nhsuk-u-margin-bottom-0"><strong>Others</strong></p>
+                      <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-1">12% &middot; 6 products</p>
+                      <div class="app-supplier-bar-track"><div class="app-supplier-bar-fill" style="width:32%;background:#aeb7bd;"></div></div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+
+            </div>
+          </div>
+
+          <!-- ── Chart 2: Innovation vs maturity ─────────── -->
+          <div class="nhsuk-card">
+            <div class="nhsuk-card__content">
+              <p class="compass-card__label">Innovation vs maturity &mdash; trust adoption</p>
+              <div class="nhsuk-u-margin-top-3">
+                <div class="nhsuk-u-display-flex nhsuk-u-justify-content-space-between nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-2">
+                  <span>Emerging (&lt;2 years)</span>
+                  <span>Proven (&gt;5 years)</span>
+                </div>
+                <div class="seg-bar" role="img" aria-label="Segmented bar: 22% under 2 years, 28% 2-5 years, 31% 5-10 years, 19% over 10 years">
+                  <div class="seg-bar__seg" style="flex:22;background:#00a9ce;">22%</div>
+                  <div class="seg-bar__seg" style="flex:28;background:#1d70b8;">28%</div>
+                  <div class="seg-bar__seg" style="flex:31;background:#003087;">31%</div>
+                  <div class="seg-bar__seg" style="flex:19;background:#002060;">19%</div>
+                </div>
+                <div class="seg-legend">
+                  <div class="seg-legend__item"><div class="seg-legend__dot" style="background:#00a9ce;"></div>&lt;2 yrs (22%)</div>
+                  <div class="seg-legend__item"><div class="seg-legend__dot" style="background:#1d70b8;"></div>2&ndash;5 yrs (28%)</div>
+                  <div class="seg-legend__item"><div class="seg-legend__dot" style="background:#003087;"></div>5&ndash;10 yrs (31%)</div>
+                  <div class="seg-legend__item"><div class="seg-legend__dot" style="background:#002060;"></div>10+ yrs (19%)</div>
+                </div>
+              </div>
+
+              <p class="compass-card__label nhsuk-u-margin-top-6">Top innovative products (adopted last 12 months)</p>
+              <div class="innovation-row">
+                <span class="nhsuk-body-s" style="flex:1;"><strong>Collagen Pro Matrix</strong> &mdash; 3 trusts &middot; 4 months old</span>
+                <strong class="nhsuk-tag nhsuk-tag--green">New</strong>
+              </div>
+              <div class="innovation-row">
+                <span class="nhsuk-body-s" style="flex:1;"><strong>WoundSeal Antimicrobial</strong> &mdash; 1 trust &middot; 8 months old</span>
+                <strong class="nhsuk-tag nhsuk-tag--green">New</strong>
+              </div>
+              <div class="innovation-row">
+                <span class="nhsuk-body-s" style="flex:1;"><strong>Mepilex Border Flex</strong> &mdash; 11 trusts &middot; 2 years old</span>
+                <strong class="nhsuk-tag nhsuk-tag--blue">Growing</strong>
+              </div>
+            </div>
+          </div>
+
+        </div>
+
+      </div>
+    </div>
+
+
+    <!-- ═══════════════════════════════════════════
+         SEARCH BAR HERE
+         ═══════════════════════════════════════════ -->
+    
+
+
+    <!-- ═══════════════════════════════════════════
+         FILTER SIDEBAR + RESULTS
+         ═══════════════════════════════════════════ -->
+    <div class="nhsuk-grid-row">
+      <div class="nhsuk-grid-column-full">
+        <div class="app-layout-filter-results">
+
+            {# Filters Sidebar #}
+  <app-auto-submit class="app-grid-column-filters">
+      
+    <div class="nhsuk-card nhsuk-card--feature app-filters">
+      <div class="nhsuk-card__content nhsuk-card__content--feature">
+        <h3 class="nhsuk-card__heading nhsuk-card__heading--feature">
+          Filter results
+        </h3>
+      
+        {# Product Category Filter #}
+        <div class="nhsuk-form-group">
+          <fieldset class="nhsuk-fieldset">
+            <legend class="nhsuk-fieldset__legend nhsuk-fieldset__legend--s">
+              Product category
+            </legend>
+            
+            <div id="category-items" class="nhsuk-checkboxes nhsuk-checkboxes--small" data-module="nhsuk-checkboxes" data-nhsuk-checkboxes-init="">
+              <div class="nhsuk-checkboxes__item">
+                <input class="nhsuk-checkboxes__input" id="category-infusion" name="[category]" type="checkbox" value="infusion" checked="">
+                <label class="nhsuk-label nhsuk-checkboxes__label" for="category-infusion">
+                  Infusion devices
+                </label>
+              </div>
+              
+              <div class="nhsuk-checkboxes__item">
+                <input class="nhsuk-checkboxes__input" id="category-surgical" name="[category]" type="checkbox" value="surgical">
+                <label class="nhsuk-label nhsuk-checkboxes__label" for="category-surgical">
+                  Surgical instruments
+                </label>
+              </div>
+              
+              <div class="nhsuk-checkboxes__item">
+                <input class="nhsuk-checkboxes__input" id="category-monitoring" name="[category]" type="checkbox" value="monitoring">
+                <label class="nhsuk-label nhsuk-checkboxes__label" for="category-monitoring">
+                  Patient monitoring
+                </label>
+              </div>
+              
+              <div class="nhsuk-checkboxes__item">
+                <input class="nhsuk-checkboxes__input" id="category-diagnostic" name="[category]" type="checkbox" value="diagnostic">
+                <label class="nhsuk-label nhsuk-checkboxes__label" for="category-diagnostic">
+                  Diagnostic equipment
+                </label>
+              </div>
+              
+              <div class="nhsuk-checkboxes__item">
+                <input class="nhsuk-checkboxes__input" id="category-cardiology" name="[category]" type="checkbox" value="cardiology">
+                <label class="nhsuk-label nhsuk-checkboxes__label" for="category-cardiology">
+                  Cardiology devices
+                </label>
+              </div>
+              
+              <div class="nhsuk-checkboxes__item">
+                <input class="nhsuk-checkboxes__input" id="category-respiratory" name="[category]" type="checkbox" value="respiratory">
+                <label class="nhsuk-label nhsuk-checkboxes__label" for="category-respiratory">
+                  Respiratory equipment
+                </label>
+              </div>
+              
+              <div class="nhsuk-checkboxes__item">
+                <input class="nhsuk-checkboxes__input" id="category-imaging" name="[category]" type="checkbox" value="imaging">
+                <label class="nhsuk-label nhsuk-checkboxes__label" for="category-imaging">
+                  Imaging systems
+                </label>
+              </div>
+              
+              <div class="nhsuk-checkboxes__item">
+                <input class="nhsuk-checkboxes__input" id="category-laboratory" name="[category]" type="checkbox" value="laboratory">
+                <label class="nhsuk-label nhsuk-checkboxes__label" for="category-laboratory">
+                  Laboratory equipment
+                </label>
+              </div>
+            </div>
+          </fieldset>
+        </div>
+
+        {# NEW: Trust Similarity Filter #}
+        <div class="nhsuk-form-group">
+          <fieldset class="nhsuk-fieldset">
+            <legend class="nhsuk-fieldset__legend nhsuk-fieldset__legend--s">
+              Evaluated by trusts like mine
+            </legend>
+            <div class="nhsuk-hint" id="trust-hint">
+              Show products evaluated by trusts similar in size, type, or region
+            </div>
+            
+            <div id="trust-items" class="nhsuk-checkboxes nhsuk-checkboxes--small" data-module="nhsuk-checkboxes" data-nhsuk-checkboxes-init="">
+              <div class="nhsuk-checkboxes__item">
+                <input class="nhsuk-checkboxes__input" id="trust-similar" name="[trust]" type="checkbox" value="similar">
+                <label class="nhsuk-label nhsuk-checkboxes__label" for="trust-similar">
+                  Similar size to my trust
+                </label>
+              </div>
+              
+              <div class="nhsuk-checkboxes__item">
+                <input class="nhsuk-checkboxes__input" id="trust-teaching" name="[trust]" type="checkbox" value="teaching">
+                <label class="nhsuk-label nhsuk-checkboxes__label" for="trust-teaching">
+                  Teaching hospitals
+                </label>
+              </div>
+              
+              <div class="nhsuk-checkboxes__item">
+                <input class="nhsuk-checkboxes__input" id="trust-region" name="[trust]" type="checkbox" value="region">
+                <label class="nhsuk-label nhsuk-checkboxes__label" for="trust-region">
+                  In my region
+                </label>
+              </div>
+
+              <div class="nhsuk-checkboxes__item">
+                <input class="nhsuk-checkboxes__input" id="trust-specialist" name="[trust]" type="checkbox" value="specialist">
+                <label class="nhsuk-label nhsuk-checkboxes__label" for="trust-specialist">
+                  Specialist trusts
+                </label>
+              </div>
+            </div>
+          </fieldset>
+        </div>
+
+        {# Clinical Trial Status Filter #}
+        <div class="nhsuk-form-group">
+          <fieldset class="nhsuk-fieldset">
+            <legend class="nhsuk-fieldset__legend nhsuk-fieldset__legend--s">
+              Clinical trial status
+            </legend>
+            
+            <div id="trial-items" class="nhsuk-radios nhsuk-radios--small" data-module="nhsuk-radios" data-nhsuk-radios-init="">
+              <div class="nhsuk-radios__item">
+                <input class="nhsuk-radios__input" id="trial-any" name="[trial]" type="radio" value="any" checked="">
+                <label class="nhsuk-label nhsuk-radios__label" for="trial-any">
+                  Any
+                </label>
+              </div>
+              
+              <div class="nhsuk-radios__item">
+                <input class="nhsuk-radios__input" id="trial-yes" name="[trial]" type="radio" value="yes">
+                <label class="nhsuk-label nhsuk-radios__label" for="trial-yes">
+                  Clinical trial available
+                </label>
+              </div>
+              
+              <div class="nhsuk-radios__item">
+                <input class="nhsuk-radios__input" id="trial-no" name="[trial]" type="radio" value="no">
+                <label class="nhsuk-label nhsuk-radios__label" for="trial-no">
+                  No clinical trial
+                </label>
+              </div>
+            </div>
+          </fieldset>
+        </div>
+
+        {# Supplier Type Filter #}
+        <div class="nhsuk-form-group">
+          <fieldset class="nhsuk-fieldset">
+            <legend class="nhsuk-fieldset__legend nhsuk-fieldset__legend--s">
+              Supplier type
+            </legend>
+            
+            <div id="supplier-items" class="nhsuk-checkboxes nhsuk-checkboxes--small" data-module="nhsuk-checkboxes" data-nhsuk-checkboxes-init="">
+              <div class="nhsuk-checkboxes__item">
+                <input class="nhsuk-checkboxes__input" id="supplier-sme" name="[supplier]" type="checkbox" value="sme">
+                <label class="nhsuk-label nhsuk-checkboxes__label" for="supplier-sme">
+                  SME
+                </label>
+              </div>
+              
+              <div class="nhsuk-checkboxes__item">
+                <input class="nhsuk-checkboxes__input" id="supplier-uk" name="[supplier]" type="checkbox" value="uk-made">
+                <label class="nhsuk-label nhsuk-checkboxes__label" for="supplier-uk">
+                  UK manufactured
+                </label>
+              </div>
+            </div>
+          </fieldset>
+        </div>
+        
+        <div class="nhsuk-button-group">
+          <button class="nhsuk-button nhsuk-button--secondary app-button--small" data-module="nhsuk-button" formaction="" formmethod="post" role="search" type="submit" hidden="" data-nhsuk-button-init="">
+            Update results
+          </button>
+        </div>
+      </div>
+    </div>
+
+  </app-auto-submit>
+
+
+          <!-- ── Results column ─────────────────────────── -->
+          <div class="app-grid-column-results">
+
+            <h3 class="nhsuk-heading-m nhsuk-u-margin-bottom-2">Advanced dressings</h3>
+            <p class="nhsuk-caption-m nhsuk-u-margin-bottom-4">
+              Showing <b>1</b> to <b>10</b> of <b>52</b> products
+            </p>
+
+            <!-- Result 1 -->
+            <div class="nhsuk-card nhsuk-card--clickable">
+              <div class="nhsuk-card__content">
+                <h4 class="nhsuk-card__heading nhsuk-heading-s">
+                  <a class="nhsuk-card__link" href="product-page?mepilex-border-flex">Mepilex Border Flex</a>
+                </h4>
+                <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-2">
+                  M&ouml;lnlycke Health Care &middot; Advanced dressings &rsaquo; Foam
+                </p>
+                <dl class="nhsuk-summary-list">
+                  <div class="nhsuk-summary-list__row">
+                    <dt class="nhsuk-summary-list__key">Trusts using this</dt>
+                    <dd class="nhsuk-summary-list__value">11 trusts</dd>
+                  </div>
+                  <div class="nhsuk-summary-list__row">
+                    <dt class="nhsuk-summary-list__key">Shared documents</dt>
+                    <dd class="nhsuk-summary-list__value">
+                      9 documents<br>
+                      <span class="nhsuk-body-s nhsuk-u-secondary-text-color">Including clinical trials and comparative studies</span>
+                    </dd>
+                  </div>
+                  <div class="nhsuk-summary-list__row">
+                    <dt class="nhsuk-summary-list__key">Procurement outcomes</dt>
+                    <dd class="nhsuk-summary-list__value">
+                      <strong class="nhsuk-tag nhsuk-tag--green">Procured: 9 trusts</strong>
+                      <strong class="nhsuk-tag nhsuk-tag--blue">Under review: 2 trusts</strong>
+                    </dd>
+                  </div>
+                </dl>
+                <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-top-3">
+                  <strong class="nhsuk-tag nhsuk-tag--blue">Growing</strong>
+                </p>
+              </div>
+            </div>
+
+            <!-- Result 2 -->
+            <div class="nhsuk-card nhsuk-card--clickable">
+              <div class="nhsuk-card__content">
+                <h4 class="nhsuk-card__heading nhsuk-heading-s">
+                  <a class="nhsuk-card__link" href="product-page?allevyn-life">ALLEVYN Life</a>
+                </h4>
+                <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-2">
+                  Smith+Nephew &middot; Advanced dressings &rsaquo; Foam
+                </p>
+                <dl class="nhsuk-summary-list">
+                  <div class="nhsuk-summary-list__row">
+                    <dt class="nhsuk-summary-list__key">Trusts using this</dt>
+                    <dd class="nhsuk-summary-list__value">8 trusts</dd>
+                  </div>
+                  <div class="nhsuk-summary-list__row">
+                    <dt class="nhsuk-summary-list__key">Shared documents</dt>
+                    <dd class="nhsuk-summary-list__value">
+                      12 documents<br>
+                      <span class="nhsuk-body-s nhsuk-u-secondary-text-color">Including clinical trials, pilot studies and business cases</span>
+                    </dd>
+                  </div>
+                  <div class="nhsuk-summary-list__row">
+                    <dt class="nhsuk-summary-list__key">Procurement outcomes</dt>
+                    <dd class="nhsuk-summary-list__value">
+                      <strong class="nhsuk-tag nhsuk-tag--green">Procured: 7 trusts</strong>
+                      <strong class="nhsuk-tag nhsuk-tag--blue">Under review: 1 trust</strong>
+                    </dd>
+                  </div>
+                </dl>
+                <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-top-3">
+                  <strong class="nhsuk-tag nhsuk-tag--white">UK manufactured</strong>
+                </p>
+              </div>
+            </div>
+
+            <!-- Result 3 -->
+            <div class="nhsuk-card nhsuk-card--clickable">
+              <div class="nhsuk-card__content">
+                <h4 class="nhsuk-card__heading nhsuk-heading-s">
+                  <a class="nhsuk-card__link" href="product-page?aquacel-ag">Aquacel Ag+ Extra</a>
+                </h4>
+                <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-2">
+                  ConvaTec &middot; Advanced dressings &rsaquo; Hydrofibre
+                </p>
+                <dl class="nhsuk-summary-list">
+                  <div class="nhsuk-summary-list__row">
+                    <dt class="nhsuk-summary-list__key">Trusts using this</dt>
+                    <dd class="nhsuk-summary-list__value">6 trusts</dd>
+                  </div>
+                  <div class="nhsuk-summary-list__row">
+                    <dt class="nhsuk-summary-list__key">Shared documents</dt>
+                    <dd class="nhsuk-summary-list__value">
+                      7 documents<br>
+                      <span class="nhsuk-body-s nhsuk-u-secondary-text-color">Including comparative studies and infection outcome data</span>
+                    </dd>
+                  </div>
+                  <div class="nhsuk-summary-list__row">
+                    <dt class="nhsuk-summary-list__key">Procurement outcomes</dt>
+                    <dd class="nhsuk-summary-list__value">
+                      <strong class="nhsuk-tag nhsuk-tag--green">Procured: 5 trusts</strong>
+                      <strong class="nhsuk-tag nhsuk-tag--blue">Under review: 1 trust</strong>
+                    </dd>
+                  </div>
+                </dl>
+              </div>
+            </div>
+
+            <!-- Result 4 — new product -->
+            <div class="nhsuk-card nhsuk-card--clickable">
+              <div class="nhsuk-card__content">
+                <h4 class="nhsuk-card__heading nhsuk-heading-s">
+                  <a class="nhsuk-card__link" href="product-page?collagen-pro-matrix">Collagen Pro Matrix</a>
+                </h4>
+                <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-2">
+                  Advanced Wound Biotech &middot; Advanced dressings &rsaquo; Collagen / tissue regeneration
+                </p>
+                <dl class="nhsuk-summary-list">
+                  <div class="nhsuk-summary-list__row">
+                    <dt class="nhsuk-summary-list__key">Trusts using this</dt>
+                    <dd class="nhsuk-summary-list__value">3 trusts</dd>
+                  </div>
+                  <div class="nhsuk-summary-list__row">
+                    <dt class="nhsuk-summary-list__key">Shared documents</dt>
+                    <dd class="nhsuk-summary-list__value">
+                      4 documents<br>
+                      <span class="nhsuk-body-s nhsuk-u-secondary-text-color">Including pilot studies and early outcomes data</span>
+                    </dd>
+                  </div>
+                  <div class="nhsuk-summary-list__row">
+                    <dt class="nhsuk-summary-list__key">Procurement outcomes</dt>
+                    <dd class="nhsuk-summary-list__value">
+                      <strong class="nhsuk-tag nhsuk-tag--blue">Under review: 2 trusts</strong>
+                      <strong class="nhsuk-tag nhsuk-tag--green">Procured: 1 trust</strong>
+                    </dd>
+                  </div>
+                </dl>
+                <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-top-3">
+                  <strong class="nhsuk-tag nhsuk-tag--green">New</strong>
+                  <strong class="nhsuk-tag nhsuk-tag--white">SME</strong>
+                </p>
+              </div>
+            </div>
+
+            <!-- Result 5 -->
+            <div class="nhsuk-card nhsuk-card--clickable">
+              <div class="nhsuk-card__content">
+                <h4 class="nhsuk-card__heading nhsuk-heading-s">
+                  <a class="nhsuk-card__link" href="product-page?biatain-silicone">Biatain Silicone</a>
+                </h4>
+                <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-2">
+                  Coloplast &middot; Advanced dressings &rsaquo; Foam
+                </p>
+                <dl class="nhsuk-summary-list">
+                  <div class="nhsuk-summary-list__row">
+                    <dt class="nhsuk-summary-list__key">Trusts using this</dt>
+                    <dd class="nhsuk-summary-list__value">5 trusts</dd>
+                  </div>
+                  <div class="nhsuk-summary-list__row">
+                    <dt class="nhsuk-summary-list__key">Shared documents</dt>
+                    <dd class="nhsuk-summary-list__value">
+                      6 documents<br>
+                      <span class="nhsuk-body-s nhsuk-u-secondary-text-color">Including clinical trials and usage reports</span>
+                    </dd>
+                  </div>
+                  <div class="nhsuk-summary-list__row">
+                    <dt class="nhsuk-summary-list__key">Procurement outcomes</dt>
+                    <dd class="nhsuk-summary-list__value">
+                      <strong class="nhsuk-tag nhsuk-tag--green">Procured: 4 trusts</strong>
+                      <strong class="nhsuk-tag nhsuk-tag--blue">Under review: 1 trust</strong>
+                    </dd>
+                  </div>
+                </dl>
+              </div>
+            </div>
+
+            <!-- nhsuk-pagination--numbered -->
+            <nav class="nhsuk-pagination nhsuk-pagination--numbered" role="navigation" aria-label="Pagination">
+              <ul class="nhsuk-pagination__list">
+                <li class="nhsuk-pagination__item nhsuk-pagination__item--current">
+                  <a class="nhsuk-pagination__link" href="?page=1&limit=10" aria-label="Page 1" aria-current="page">1</a>
+                </li>
+                <li class="nhsuk-pagination__item">
+                  <a class="nhsuk-pagination__link" href="?page=2&limit=10" aria-label="Page 2">2</a>
+                </li>
+                <li class="nhsuk-pagination__item">
+                  <a class="nhsuk-pagination__link" href="?page=3&limit=10" aria-label="Page 3">3</a>
+                </li>
+                <li class="nhsuk-pagination__item">
+                  <a class="nhsuk-pagination__link" href="?page=4&limit=10" aria-label="Page 4">4</a>
+                </li>
+                <li class="nhsuk-pagination__item">
+                  <a class="nhsuk-pagination__link" href="?page=5&limit=10" aria-label="Page 5">5</a>
+                </li>
+                <li class="nhsuk-pagination__item">
+                  <a class="nhsuk-pagination__link" href="?page=6&limit=10" aria-label="Page 6">6</a>
+                </li>
+              </ul>
+              <a href="?page=2&limit=10" class="nhsuk-pagination__next" rel="next">
+                <span class="nhsuk-pagination__title">
+                  Next<span class="nhsuk-u-visually-hidden"> page</span>
+                </span>
+                <svg class="nhsuk-icon nhsuk-icon--arrow-right" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="16" height="16" focusable="false" aria-hidden="true">
+                  <path d="m14.7 6.3 5 5c.2.2.3.4.3.7 0 .3-.1.5-.3.7l-5 5a1 1 0 0 1-1.4-1.4l3.3-3.3H5a1 1 0 0 1 0-2h11.6l-3.3-3.3a1 1 0 1 1 1.4-1.4Z"></path>
+                </svg>
+              </a>
+            </nav>
+
+          </div>
+
+        </div>
+      </div>
+    </div>
+
+
+
+{% endblock %}
\ No newline at end of file
diff --git a/app/views/current/search-results-viz.html b/app/views/current/search-results-viz.html
deleted file mode 100644
index 38cfeac..0000000
--- a/app/views/current/search-results-viz.html
+++ /dev/null
@@ -1,856 +0,0 @@
-{% extends prototypeVersion + '/layouts/layout-signed-in.html' %}
-
-{% set pageName = "Search medical technologies - Compass" %}
-{% set serviceHeader = "Compass" %}
-
-{% block beforeContent %}
-{% from "breadcrumb/macro.njk" import breadcrumb %}
-
-{{ breadcrumb({
-  items: [
-    {
-      href: "/",
-      text: "Home"
-    }
-  ],
-  href: "#",
-  text: "Search results"
-}) }}
-{% endblock %}
-
-{% block content %}
-
-<div class="nhsuk-grid-row">
-  <div class="nhsuk-grid-column-full">
-    <h1 class="nhsuk-heading-l">Viewing all data for category "Wound care"</h1>
-  </div>
-</div>
-
-
-    <!-- ═══════════════════════════════════════════
-         DATA VIZ SECTION
-         ═══════════════════════════════════════════ -->
-    <div class="nhsuk-grid-row nhsuk-u-margin-bottom-6">
-      <div class="nhsuk-grid-column-full">
-
-        <hr class="nhsuk-u-margin-top-0 nhsuk-u-margin-bottom-5">
-        <p class="nhsuk-body-l nhsuk-u-margin-bottom-5">18 NHS trusts have experience with products in this category.</p>
-
-        <div class="app-dataviz-grid">
-
-          <!-- ── Chart 1: Supplier market share ───────────── -->
-          <div class="nhsuk-card">
-            <div class="nhsuk-card__content">
-              <h3 class="nhsuk-heading-s nhsuk-u-margin-bottom-1">Supplier market share</h3>
-              <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-4">Based on number of products procured across NHS trusts</p>
-
-              <div class="app-pie-wrap">
-                <svg class="app-pie-svg" width="140" height="140" viewBox="0 0 140 140" aria-hidden="true">
-                  <!-- MedTech Innovations: 34% -->
-                  <path d="M70 70 L70 10 A60 60 0 0 1 124.6 85 Z" fill="#005eb8"/>
-                  <!-- Global Medical Supplies: 24% -->
-                  <path d="M70 70 L124.6 85 A60 60 0 0 1 60.5 129.4 Z" fill="#007f3b"/>
-                  <!-- CareTech Solutions: 18% -->
-                  <path d="M70 70 L60.5 129.4 A60 60 0 0 1 13.2 94.1 Z" fill="#ffb81c"/>
-                  <!-- Pain Management Tech: 14% -->
-                  <path d="M70 70 L13.2 94.1 A60 60 0 0 1 10.5 46.0 Z" fill="#da291c"/>
-                  <!-- Others: 10% -->
-                  <path d="M70 70 L10.5 46.0 A60 60 0 0 1 70 10 Z" fill="#aeb7bd"/>
-                  <!-- Centre hole -->
-                  <circle cx="70" cy="70" r="32" fill="#fff"/>
-                  <text x="70" y="66" text-anchor="middle" font-size="18" font-weight="700" fill="#212b32">143</text>
-                  <text x="70" y="80" text-anchor="middle" font-size="10" fill="#768692">products</text>
-                </svg>
-
-                <div class="app-supplier-legend">
-                  <div class="app-supplier-legend__item">
-                    <div class="app-supplier-legend__swatch" style="background:#005eb8;"></div>
-                    <div class="app-supplier-legend__body">
-                      <p class="nhsuk-body-s nhsuk-u-margin-bottom-0"><strong>MedTech Innovations</strong></p>
-                      <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-1">34% · 49 products</p>
-                      <div class="app-supplier-bar-track"><div class="app-supplier-bar-fill" style="width:100%;background:#005eb8;"></div></div>
-                    </div>
-                  </div>
-                  <div class="app-supplier-legend__item">
-                    <div class="app-supplier-legend__swatch" style="background:#007f3b;"></div>
-                    <div class="app-supplier-legend__body">
-                      <p class="nhsuk-body-s nhsuk-u-margin-bottom-0"><strong>Global Medical Supplies</strong></p>
-                      <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-1">24% · 34 products</p>
-                      <div class="app-supplier-bar-track"><div class="app-supplier-bar-fill" style="width:71%;background:#007f3b;"></div></div>
-                    </div>
-                  </div>
-                  <div class="app-supplier-legend__item">
-                    <div class="app-supplier-legend__swatch" style="background:#ffb81c;"></div>
-                    <div class="app-supplier-legend__body">
-                      <p class="nhsuk-body-s nhsuk-u-margin-bottom-0"><strong>CareTech Solutions</strong></p>
-                      <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-1">18% · 26 products</p>
-                      <div class="app-supplier-bar-track"><div class="app-supplier-bar-fill" style="width:53%;background:#ffb81c;"></div></div>
-                    </div>
-                  </div>
-                  <div class="app-supplier-legend__item">
-                    <div class="app-supplier-legend__swatch" style="background:#da291c;"></div>
-                    <div class="app-supplier-legend__body">
-                      <p class="nhsuk-body-s nhsuk-u-margin-bottom-0"><strong>Pain Management Tech</strong></p>
-                      <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-1">14% · 20 products</p>
-                      <div class="app-supplier-bar-track"><div class="app-supplier-bar-fill" style="width:41%;background:#da291c;"></div></div>
-                    </div>
-                  </div>
-                  <div class="app-supplier-legend__item">
-                    <div class="app-supplier-legend__swatch" style="background:#aeb7bd;"></div>
-                    <div class="app-supplier-legend__body">
-                      <p class="nhsuk-body-s nhsuk-u-margin-bottom-0"><strong>Others</strong></p>
-                      <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-1">10% · 14 products</p>
-                      <div class="app-supplier-bar-track"><div class="app-supplier-bar-fill" style="width:29%;background:#aeb7bd;"></div></div>
-                    </div>
-                  </div>
-                </div>
-              </div>
-
-            </div>
-          </div>
-
-          <!-- ── Chart 2: Products used in trusts like mine ─ -->
-          <div class="nhsuk-card">
-            <div class="nhsuk-card__content">
-              <h3 class="nhsuk-heading-s nhsuk-u-margin-bottom-1">Products used in trusts like mine</h3>
-              <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-4">
-                District general hospitals · North West region · ~500 beds
-                &nbsp;<a href="#" class="nhsuk-link nhsuk-body-s">Change</a>
-              </p>
-
-              <div style="position:relative;">
-                <canvas id="trustsChart" height="200" aria-label="Bar chart showing how many similar trusts use top products in this category"></canvas>
-                <div id="chartTooltip" style="
-                  position:absolute; background:#212b32; color:#fff;
-                  font-size:12px; padding:6px 10px; border-radius:4px;
-                  pointer-events:none; display:none; z-index:10; white-space:nowrap;
-                "></div>
-              </div>
-
-              <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-0 nhsuk-u-margin-top-3">
-                Compared against 12 similar trusts in this category.
-              </p>
-            </div>
-          </div>
-
-        </div>{# /.app-dataviz-grid #}
-
-      </div>
-    </div>
-
-
-
-    <div class="nhsuk-grid-row">
-  <div class="nhsuk-grid-column-full">
-
-    {# Search bar #}
-    <div class="app-filters nhsuk-u-margin-top-5 nhsuk-u-margin-bottom-5">
-      <div class="app-filters-container">
-        <form action="" method="get" novalidate="">
-          <div class="nhsuk-form-group nhsuk-u-margin-bottom-0">
-            <label class="nhsuk-label" for="q">
-              Search again by product, category or supplier
-            </label>
-            <input class="nhsuk-input nhsuk-input--width-20" id="q" name="q" type="search" value="">
-            <button class="nhsuk-button nhsuk-button--secondary nhsuk-u-margin-left-2 app-button--small nhsuk-u-margin-bottom-0" data-module="nhsuk-button" type="submit">
-              Search
-            </button>
-          </div>
-        </form>
-      </div>
-    </div>
-
-  </div>
-</div>
-
-
-<div class="nhsuk-grid-row">
-
-  {# Filters Sidebar #}
-  <app-auto-submit class="app-grid-column-filters">
-
-    <div class="nhsuk-card nhsuk-card--feature app-filters">
-      <div class="nhsuk-card__content nhsuk-card__content--feature">
-        <h3 class="nhsuk-card__heading nhsuk-card__heading--feature">
-          Filter results
-        </h3>
-
-        {# Supplier maturity Filter #}
-        <div class="nhsuk-form-group">
-          <fieldset class="nhsuk-fieldset">
-            <legend class="nhsuk-fieldset__legend nhsuk-fieldset__legend--s">
-              Supplier maturity
-            </legend>
-            <div class="nhsuk-checkboxes nhsuk-checkboxes--small" data-module="nhsuk-checkboxes">
-              <div class="nhsuk-checkboxes__item">
-                <input class="nhsuk-checkboxes__input" id="maturity-new" name="[maturity]" type="checkbox" value="new">
-                <label class="nhsuk-label nhsuk-checkboxes__label" for="maturity-new">
-                  New (1–2 years old)
-                </label>
-              </div>
-              <div class="nhsuk-checkboxes__item">
-                <input class="nhsuk-checkboxes__input" id="maturity-mature" name="[maturity]" type="checkbox" value="mature" checked="">
-                <label class="nhsuk-label nhsuk-checkboxes__label" for="maturity-mature">
-                  Mature (2–5 years old)
-                </label>
-              </div>
-            </div>
-          </fieldset>
-        </div>
-
-        {# Company size Filter #}
-        <div class="nhsuk-form-group">
-          <fieldset class="nhsuk-fieldset">
-            <legend class="nhsuk-fieldset__legend nhsuk-fieldset__legend--s">
-              Company size
-            </legend>
-            <div class="nhsuk-checkboxes nhsuk-checkboxes--small" data-module="nhsuk-checkboxes">
-              <div class="nhsuk-checkboxes__item">
-                <input class="nhsuk-checkboxes__input" id="size-small" name="[size]" type="checkbox" value="1-50">
-                <label class="nhsuk-label nhsuk-checkboxes__label" for="size-small">
-                  1–50 employees
-                </label>
-              </div>
-              <div class="nhsuk-checkboxes__item">
-                <input class="nhsuk-checkboxes__input" id="size-mid" name="[size]" type="checkbox" value="50-100" checked="">
-                <label class="nhsuk-label nhsuk-checkboxes__label" for="size-mid">
-                  50–100 employees
-                </label>
-              </div>
-              <div class="nhsuk-checkboxes__item">
-                <input class="nhsuk-checkboxes__input" id="size-large" name="[size]" type="checkbox" value="100plus">
-                <label class="nhsuk-label nhsuk-checkboxes__label" for="size-large">
-                  100+ employees
-                </label>
-              </div>
-            </div>
-          </fieldset>
-        </div>
-
-        <div class="nhsuk-button-group">
-          <button class="nhsuk-button nhsuk-button--secondary app-button--small" data-module="nhsuk-button" formaction="" formmethod="post" role="search" type="submit" hidden="">
-            Update results
-          </button>
-        </div>
-      </div>
-    </div>
-
-  </app-auto-submit>
-
-  {# Results Column #}
-  <div class="app-grid-column-results">
-
-    <h3 class="nhsuk-heading-m nhsuk-u-margin-bottom-2">Medical technologies</h3>
-    <p class="nhsuk-caption-m nhsuk-u-margin-bottom-4">
-      Showing <b>1</b> to <b>25</b> of <b>143</b> products
-    </p>
-
-    {# Result 1 #}
-    <div class="nhsuk-card nhsuk-card--clickable app-card--compact">
-      <div class="nhsuk-card__content">
-        <h4 class="nhsuk-card__heading nhsuk-heading-s">
-          <a class="nhsuk-card__link" href="product-page?smartpump-300">SmartPump 300 Infusion System</a>
-        </h4>
-        <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-2">
-          MedTech Innovations Ltd
-        </p>
-        <dl class="nhsuk-summary-list">
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Category</dt>
-            <dd class="nhsuk-summary-list__value">Infusion devices</dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Trusts using this</dt>
-            <dd class="nhsuk-summary-list__value">8 trusts</dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Shared documents</dt>
-            <dd class="nhsuk-summary-list__value">
-              12 documents<br>
-              <span class="nhsuk-body-s nhsuk-u-secondary-text-color">Including clinical trials, pilot studies and usage reports</span>
-            </dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Procurement outcomes</dt>
-            <dd class="nhsuk-summary-list__value">
-              <strong class="nhsuk-tag nhsuk-tag--green">Procured: 6 trusts</strong>
-              <strong class="nhsuk-tag nhsuk-tag--blue">Under review: 2 trusts</strong>
-            </dd>
-          </div>
-        </dl>
-        <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-top-3">
-          <strong class="nhsuk-tag nhsuk-tag--white">UK manufactured</strong>
-          <strong class="nhsuk-tag nhsuk-tag--white">SME</strong>
-        </p>
-      </div>
-    </div>
-
-    {# Result 2 #}
-    <div class="nhsuk-card nhsuk-card--clickable app-card--compact">
-      <div class="nhsuk-card__content">
-        <h4 class="nhsuk-card__heading nhsuk-heading-s">
-          <a class="nhsuk-card__link" href="product-page?safeflow-iv">SafeFlow IV Administration Set</a>
-        </h4>
-        <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-2">
-          Global Medical Supplies plc
-        </p>
-        <dl class="nhsuk-summary-list">
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Category</dt>
-            <dd class="nhsuk-summary-list__value">Infusion devices</dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Trusts using this</dt>
-            <dd class="nhsuk-summary-list__value">5 trusts</dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Shared documents</dt>
-            <dd class="nhsuk-summary-list__value">
-              8 documents<br>
-              <span class="nhsuk-body-s nhsuk-u-secondary-text-color">Including clinical trials and comparative studies</span>
-            </dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Procurement outcomes</dt>
-            <dd class="nhsuk-summary-list__value">
-              <strong class="nhsuk-tag nhsuk-tag--green">Procured: 4 trusts</strong>
-              <strong class="nhsuk-tag nhsuk-tag--yellow">Excluded: 1 trust</strong>
-            </dd>
-          </div>
-        </dl>
-      </div>
-    </div>
-
-    {# Result 3 #}
-    <div class="nhsuk-card nhsuk-card--clickable app-card--compact">
-      <div class="nhsuk-card__content">
-        <h4 class="nhsuk-card__heading nhsuk-heading-s">
-          <a class="nhsuk-card__link" href="product-page?portapump-mini">PortaPump Mini Ambulatory Pump</a>
-        </h4>
-        <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-2">
-          CareTech Solutions
-        </p>
-        <dl class="nhsuk-summary-list">
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Category</dt>
-            <dd class="nhsuk-summary-list__value">Infusion devices</dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Trusts using this</dt>
-            <dd class="nhsuk-summary-list__value">3 trusts</dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Shared documents</dt>
-            <dd class="nhsuk-summary-list__value">
-              5 documents<br>
-              <span class="nhsuk-body-s nhsuk-u-secondary-text-color">Including pilot studies and usage reports</span>
-            </dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Procurement outcomes</dt>
-            <dd class="nhsuk-summary-list__value">
-              <strong class="nhsuk-tag nhsuk-tag--green">Procured: 2 trusts</strong>
-              <strong class="nhsuk-tag nhsuk-tag--blue">Under review: 1 trust</strong>
-            </dd>
-          </div>
-        </dl>
-        <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-top-3">
-          <strong class="nhsuk-tag nhsuk-tag--white">SME</strong>
-        </p>
-      </div>
-    </div>
-
-    {# Result 4 #}
-    <div class="nhsuk-card nhsuk-card--clickable app-card--compact">
-      <div class="nhsuk-card__content">
-        <h4 class="nhsuk-card__heading nhsuk-heading-s">
-          <a class="nhsuk-card__link" href="product-page?precisedose-pca">PreciseDose PCA System</a>
-        </h4>
-        <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-2">
-          Pain Management Technologies
-        </p>
-        <dl class="nhsuk-summary-list">
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Category</dt>
-            <dd class="nhsuk-summary-list__value">Infusion devices</dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Trusts using this</dt>
-            <dd class="nhsuk-summary-list__value">123 trusts</dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Shared documents</dt>
-            <dd class="nhsuk-summary-list__value">
-              15 documents<br>
-              <span class="nhsuk-body-s nhsuk-u-secondary-text-color">Including clinical trials, business cases and comparative studies</span>
-            </dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Procurement outcomes</dt>
-            <dd class="nhsuk-summary-list__value">
-              <strong class="nhsuk-tag nhsuk-tag--green">Procured: 10 trusts</strong>
-              <strong class="nhsuk-tag nhsuk-tag--blue">Under review: 2 trusts</strong>
-            </dd>
-          </div>
-        </dl>
-        <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-top-3">
-          <strong class="nhsuk-tag nhsuk-tag--white">UK manufactured</strong>
-        </p>
-      </div>
-    </div>
-
-    {# Result 5 #}
-    <div class="nhsuk-card nhsuk-card--clickable app-card--compact">
-      <div class="nhsuk-card__content">
-        <h4 class="nhsuk-card__heading nhsuk-heading-s">
-          <a class="nhsuk-card__link" href="product-page?multiflow-hub">MultiFlow Central Infusion Hub</a>
-        </h4>
-        <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-2">
-          MedTech Innovations Ltd
-        </p>
-        <dl class="nhsuk-summary-list">
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Category</dt>
-            <dd class="nhsuk-summary-list__value">Infusion devices</dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Trusts using this</dt>
-            <dd class="nhsuk-summary-list__value">7 trusts</dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Shared documents</dt>
-            <dd class="nhsuk-summary-list__value">
-              9 documents<br>
-              <span class="nhsuk-body-s nhsuk-u-secondary-text-color">Including technical assessments and usage reports</span>
-            </dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Procurement outcomes</dt>
-            <dd class="nhsuk-summary-list__value">
-              <strong class="nhsuk-tag nhsuk-tag--green">Procured: 5 trusts</strong>
-              <strong class="nhsuk-tag nhsuk-tag--blue">Under review: 2 trusts</strong>
-            </dd>
-          </div>
-        </dl>
-        <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-top-3">
-          <strong class="nhsuk-tag nhsuk-tag--white">UK manufactured</strong>
-          <strong class="nhsuk-tag nhsuk-tag--white">SME</strong>
-        </p>
-      </div>
-    </div>
-
-    {# Result 6 #}
-    <div class="nhsuk-card nhsuk-card--clickable app-card--compact">
-      <div class="nhsuk-card__content">
-        <h4 class="nhsuk-card__heading nhsuk-heading-s">
-          <a class="nhsuk-card__link" href="product-page?neonatal-ivac">Neonatal IV Access Kit</a>
-        </h4>
-        <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-2">
-          Pediatric Care Systems
-        </p>
-        <dl class="nhsuk-summary-list">
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Category</dt>
-            <dd class="nhsuk-summary-list__value">Infusion devices</dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Trusts using this</dt>
-            <dd class="nhsuk-summary-list__value">4 trusts</dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Shared documents</dt>
-            <dd class="nhsuk-summary-list__value">
-              6 documents<br>
-              <span class="nhsuk-body-s nhsuk-u-secondary-text-color">Including pilot studies and safety assessments</span>
-            </dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Procurement outcomes</dt>
-            <dd class="nhsuk-summary-list__value">
-              <strong class="nhsuk-tag nhsuk-tag--green">Procured: 3 trusts</strong>
-              <strong class="nhsuk-tag nhsuk-tag--blue">Under review: 1 trust</strong>
-            </dd>
-          </div>
-        </dl>
-      </div>
-    </div>
-
-    {# Result 7 #}
-    <div class="nhsuk-card nhsuk-card--clickable app-card--compact">
-      <div class="nhsuk-card__content">
-        <h4 class="nhsuk-card__heading nhsuk-heading-s">
-          <a class="nhsuk-card__link" href="product-page?elastomeric-pump">ElastoFlow Disposable Infusion Pump</a>
-        </h4>
-        <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-2">
-          Disposable Medical Ltd
-        </p>
-        <dl class="nhsuk-summary-list">
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Category</dt>
-            <dd class="nhsuk-summary-list__value">Infusion devices</dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Trusts using this</dt>
-            <dd class="nhsuk-summary-list__value">9 trusts</dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Shared documents</dt>
-            <dd class="nhsuk-summary-list__value">
-              7 documents<br>
-              <span class="nhsuk-body-s nhsuk-u-secondary-text-color">Including clinical trials and patient satisfaction studies</span>
-            </dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Procurement outcomes</dt>
-            <dd class="nhsuk-summary-list__value">
-              <strong class="nhsuk-tag nhsuk-tag--green">Procured: 8 trusts</strong>
-              <strong class="nhsuk-tag nhsuk-tag--blue">Under review: 1 trust</strong>
-            </dd>
-          </div>
-        </dl>
-        <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-top-3">
-          <strong class="nhsuk-tag nhsuk-tag--white">SME</strong>
-        </p>
-      </div>
-    </div>
-
-    {# Result 8 #}
-    <div class="nhsuk-card nhsuk-card--clickable app-card--compact">
-      <div class="nhsuk-card__content">
-        <h4 class="nhsuk-card__heading nhsuk-heading-s">
-          <a class="nhsuk-card__link" href="product-page?volumetric-plus">VoluMetric Plus Infusion Controller</a>
-        </h4>
-        <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-2">
-          Global Medical Supplies plc
-        </p>
-        <dl class="nhsuk-summary-list">
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Category</dt>
-            <dd class="nhsuk-summary-list__value">Infusion devices</dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Trusts using this</dt>
-            <dd class="nhsuk-summary-list__value">11 trusts</dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Shared documents</dt>
-            <dd class="nhsuk-summary-list__value">
-              14 documents<br>
-              <span class="nhsuk-body-s nhsuk-u-secondary-text-color">Including technical assessments and comparative studies</span>
-            </dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Procurement outcomes</dt>
-            <dd class="nhsuk-summary-list__value">
-              <strong class="nhsuk-tag nhsuk-tag--green">Procured: 9 trusts</strong>
-              <strong class="nhsuk-tag nhsuk-tag--blue">Under review: 2 trusts</strong>
-            </dd>
-          </div>
-        </dl>
-      </div>
-    </div>
-
-    {# Result 9 #}
-    <div class="nhsuk-card nhsuk-card--clickable app-card--compact">
-      <div class="nhsuk-card__content">
-        <h4 class="nhsuk-card__heading nhsuk-heading-s">
-          <a class="nhsuk-card__link" href="product-page?smartsyringe-driver">SmartSyringe Driver Pro</a>
-        </h4>
-        <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-2">
-          CareTech Solutions
-        </p>
-        <dl class="nhsuk-summary-list">
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Category</dt>
-            <dd class="nhsuk-summary-list__value">Infusion devices</dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Trusts using this</dt>
-            <dd class="nhsuk-summary-list__value">6 trusts</dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Shared documents</dt>
-            <dd class="nhsuk-summary-list__value">
-              7 documents<br>
-              <span class="nhsuk-body-s nhsuk-u-secondary-text-color">Including technical assessments and pilot studies</span>
-            </dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Procurement outcomes</dt>
-            <dd class="nhsuk-summary-list__value">
-              <strong class="nhsuk-tag nhsuk-tag--green">Procured: 4 trusts</strong>
-              <strong class="nhsuk-tag nhsuk-tag--blue">Under review: 2 trusts</strong>
-            </dd>
-          </div>
-        </dl>
-        <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-top-3">
-          <strong class="nhsuk-tag nhsuk-tag--white">UK manufactured</strong>
-          <strong class="nhsuk-tag nhsuk-tag--white">SME</strong>
-        </p>
-      </div>
-    </div>
-
-    {# Result 10 #}
-    <div class="nhsuk-card nhsuk-card--clickable app-card--compact">
-      <div class="nhsuk-card__content">
-        <h4 class="nhsuk-card__heading nhsuk-heading-s">
-          <a class="nhsuk-card__link" href="product-page?gravity-iv-set">Gravity IV Administration Set Ultra</a>
-        </h4>
-        <p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-bottom-2">
-          MedSupply Direct
-        </p>
-        <dl class="nhsuk-summary-list">
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Category</dt>
-            <dd class="nhsuk-summary-list__value">Infusion devices</dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Trusts using this</dt>
-            <dd class="nhsuk-summary-list__value">2 trusts</dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Shared documents</dt>
-            <dd class="nhsuk-summary-list__value">
-              3 documents<br>
-              <span class="nhsuk-body-s nhsuk-u-secondary-text-color">Including usage reports</span>
-            </dd>
-          </div>
-          <div class="nhsuk-summary-list__row">
-            <dt class="nhsuk-summary-list__key">Procurement outcomes</dt>
-            <dd class="nhsuk-summary-list__value">
-              <strong class="nhsuk-tag nhsuk-tag--green">Procured: 2 trusts</strong>
-            </dd>
-          </div>
-        </dl>
-      </div>
-    </div>
-
-    {# Pagination #}
-    <nav class="nhsuk-pagination nhsuk-pagination--numbered" role="navigation" aria-label="Pagination">
-      <ul class="nhsuk-pagination__list">
-        <li class="nhsuk-pagination__item nhsuk-pagination__item--current">
-          <a class="nhsuk-pagination__link" href="?page=1&limit=25" aria-label="Page 1" aria-current="page">1</a>
-        </li>
-        <li class="nhsuk-pagination__item">
-          <a class="nhsuk-pagination__link" href="?page=2&limit=25" aria-label="Page 2">2</a>
-        </li>
-        <li class="nhsuk-pagination__item">
-          <a class="nhsuk-pagination__link" href="?page=3&limit=25" aria-label="Page 3">3</a>
-        </li>
-        <li class="nhsuk-pagination__item">
-          <a class="nhsuk-pagination__link" href="?page=4&limit=25" aria-label="Page 4">4</a>
-        </li>
-        <li class="nhsuk-pagination__item">
-          <a class="nhsuk-pagination__link" href="?page=5&limit=25" aria-label="Page 5">5</a>
-        </li>
-        <li class="nhsuk-pagination__item">
-          <a class="nhsuk-pagination__link" href="?page=6&limit=25" aria-label="Page 6">6</a>
-        </li>
-      </ul>
-      <a href="?page=2&limit=25" class="nhsuk-pagination__next" rel="next">
-        <span class="nhsuk-pagination__title">
-          Next<span class="nhsuk-u-visually-hidden"> page</span>
-        </span>
-        <svg class="nhsuk-icon nhsuk-icon--arrow-right" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="16" height="16" focusable="false" aria-hidden="true">
-          <path d="m14.7 6.3 5 5c.2.2.3.4.3.7 0 .3-.1.5-.3.7l-5 5a1 1 0 0 1-1.4-1.4l3.3-3.3H5a1 1 0 0 1 0-2h11.6l-3.3-3.3a1 1 0 1 1 1.4-1.4Z"></path>
-        </svg>
-      </a>
-    </nav>
-
-  </div>{# /.app-grid-column-results #}
-
-</div>{# /.nhsuk-grid-row #}
-
-
-<!-- ── App-level styles for new chart components only ──────── -->
-<style>
-  .app-dataviz-grid {
-    display: grid;
-    grid-template-columns: 1fr 1fr;
-    gap: 20px;
-  }
-
-  /* Supplier pie layout */
-  .app-pie-wrap {
-    display: flex;
-    align-items: flex-start;
-    gap: 24px;
-  }
-  .app-pie-svg { flex-shrink: 0; }
-
-  /* Supplier legend rows */
-  .app-supplier-legend {
-    flex: 1;
-    display: flex;
-    flex-direction: column;
-    gap: 10px;
-  }
-  .app-supplier-legend__item {
-    display: flex;
-    align-items: flex-start;
-    gap: 8px;
-  }
-  .app-supplier-legend__swatch {
-    width: 12px;
-    height: 12px;
-    border-radius: 2px;
-    flex-shrink: 0;
-    margin-top: 3px;
-  }
-  .app-supplier-legend__body { flex: 1; }
-
-  /* Mini bar under each legend row */
-  .app-supplier-bar-track {
-    height: 5px;
-    background: #d8dde0;
-    border-radius: 2px;
-    overflow: hidden;
-    width: 100%;
-  }
-  .app-supplier-bar-fill {
-    height: 100%;
-    border-radius: 2px;
-  }
-
-  @media (max-width: 768px) {
-    .app-dataviz-grid { grid-template-columns: 1fr; }
-  }
-</style>
-
-
-<!-- ── Canvas chart script ──────────────────────────────────── -->
-<script>
-(function () {
-  // roundRect polyfill for older browsers
-  if (!CanvasRenderingContext2D.prototype.roundRect) {
-    CanvasRenderingContext2D.prototype.roundRect = function (x, y, w, h, r) {
-      this.beginPath();
-      this.moveTo(x + r, y);
-      this.lineTo(x + w - r, y);
-      this.quadraticCurveTo(x + w, y, x + w, y + r);
-      this.lineTo(x + w, y + h - r);
-      this.quadraticCurveTo(x + w, y + h, x + w - r, y + h);
-      this.lineTo(x + r, y + h);
-      this.quadraticCurveTo(x, y + h, x, y + h - r);
-      this.lineTo(x, y + r);
-      this.quadraticCurveTo(x, y, x + r, y);
-      this.closePath();
-    };
-  }
-
-  const canvas = document.getElementById('trustsChart');
-  if (!canvas) return;
-
-  const dpr    = window.devicePixelRatio || 1;
-  const W      = canvas.parentElement.clientWidth || 380;
-  const H      = 200;
-  canvas.width  = W * dpr;
-  canvas.height = H * dpr;
-  canvas.style.width  = W + 'px';
-  canvas.style.height = H + 'px';
-
-  const ctx = canvas.getContext('2d');
-  ctx.scale(dpr, dpr);
-
-  // Product name · similar trusts using (out of 12) · pct of 12
-  const data = [
-    { name: 'PreciseDose PCA System',     similar: 10, pct: 83 },
-    { name: 'VoluMetric Plus Controller', similar: 9,  pct: 75 },
-    { name: 'ElastoFlow Disposable Pump', similar: 8,  pct: 67 },
-    { name: 'SmartPump 300',              similar: 6,  pct: 50 },
-    { name: 'MultiFlow Infusion Hub',     similar: 5,  pct: 42 },
-    { name: 'SafeFlow IV Set',            similar: 4,  pct: 33 },
-  ];
-
-  const padL   = 168;   // label column
-  const padR   = 52;    // count column
-  const padT   = 10;
-  const padB   = 20;    // space for x-axis labels
-  const rowH   = (H - padT - padB) / data.length;
-  const barH   = 13;
-  const barMaxW = W - padL - padR;
-
-  const colFill  = '#005eb8';
-  const colTrack = '#d8dde0';
-  const colText  = '#212b32';
-  const colMuted = '#768692';
-
-  // Grid lines + x-axis labels
-  [0, 25, 50, 75, 100].forEach(pct => {
-    const x = padL + (pct / 100) * barMaxW;
-    ctx.strokeStyle = '#f0f4f5';
-    ctx.lineWidth = 1;
-    ctx.beginPath();
-    ctx.moveTo(x, padT);
-    ctx.lineTo(x, H - padB);
-    ctx.stroke();
-
-    ctx.fillStyle = colMuted;
-    ctx.font = '10px Arial, sans-serif';
-    ctx.textAlign = 'center';
-    ctx.textBaseline = 'top';
-    ctx.fillText(pct + '%', x, H - padB + 4);
-  });
-
-  data.forEach((d, i) => {
-    const midY = padT + i * rowH + rowH / 2;
-    const barY = midY - barH / 2;
-    const fillW = (d.pct / 100) * barMaxW;
-
-    // Label — truncate to fit
-    ctx.fillStyle = colText;
-    ctx.font = '12px Arial, sans-serif';
-    ctx.textAlign = 'right';
-    ctx.textBaseline = 'middle';
-    let label = d.name;
-    while (ctx.measureText(label).width > padL - 10 && label.length > 4) {
-      label = label.slice(0, -4) + '…';
-    }
-    ctx.fillText(label, padL - 8, midY);
-
-    // Track
-    ctx.fillStyle = colTrack;
-    ctx.roundRect(padL, barY, barMaxW, barH, 2);
-    ctx.fill();
-
-    // Fill
-    ctx.fillStyle = colFill;
-    ctx.roundRect(padL, barY, fillW, barH, 2);
-    ctx.fill();
-
-    // Count
-    ctx.fillStyle = colText;
-    ctx.font = 'bold 11px Arial, sans-serif';
-    ctx.textAlign = 'left';
-    ctx.textBaseline = 'middle';
-    ctx.fillText(d.similar + ' / 12', padL + fillW + 6, midY);
-  });
-
-  // Hover tooltip
-  const tooltip = document.getElementById('chartTooltip');
-  canvas.addEventListener('mousemove', function (e) {
-    const rect = canvas.getBoundingClientRect();
-    const mx = e.clientX - rect.left;
-    const my = e.clientY - rect.top;
-    let hit = null;
-    data.forEach((d, i) => {
-      const midY = padT + i * rowH + rowH / 2;
-      const barY = midY - barH / 2;
-      if (mx >= padL && mx <= padL + barMaxW && my >= barY - 4 && my <= barY + barH + 4) {
-        hit = d;
-      }
-    });
-    if (hit) {
-      tooltip.style.display = 'block';
-      tooltip.style.left = (mx + 12) + 'px';
-      tooltip.style.top  = (my - 30) + 'px';
-      tooltip.innerHTML  = '<strong>' + hit.similar + ' of 12</strong> similar trusts procured this';
-    } else {
-      tooltip.style.display = 'none';
-    }
-  });
-  canvas.addEventListener('mouseleave', () => { tooltip.style.display = 'none'; });
-})();
-</script>
-
-{% endblock %}
\ No newline at end of file
diff --git a/app/views/current/search.html b/app/views/current/search.html
index d683f5e..bde826f 100755
--- a/app/views/current/search.html
+++ b/app/views/current/search.html
@@ -70,7 +70,7 @@ <h3 class="nhsuk-card__heading nhsuk-heading-s">
         <div class="nhsuk-card nhsuk-card--clickable">
           <div class="nhsuk-card__content">
             <h3 class="nhsuk-card__heading nhsuk-heading-s">
-              <a class="nhsuk-card__link" href="search-results-viz">Wound care</a>
+              <a class="nhsuk-card__link" href="search-results-viz-all">Wound care</a>
             </h3>
             <p class="nhsuk-card__description">Dressings, negative pressure therapy and skin substitutes</p>
             <p class="nhsuk-body-s nhsuk-u-secondary-text-color">183 products · 56 trust evaluations</p>