Clusters: link lesson plans and slides from each sub-cluster

assets/scss/custom.scss

@@ -623,6 +623,103 @@
   color: #1264ab;
 }
 
+/* ---- Lesson plans (data/lesson_plans.json) ----
+   One green marks lesson-plan sets everywhere: the dot on sub-cluster headers,
+   cluster stats and sidebar entries, the filter chip, and the teaching-materials strip. */
+$lp-green: #2f6b4f;
+
+.lp-dot {
+  display: inline-block;
+  width: 0.5rem;
+  height: 0.5rem;
+  border-radius: 50%;
+  background: $lp-green;
+  margin-left: 0.35rem;
+  vertical-align: 0.05em;
+  flex-shrink: 0;
+}
+.cluster-stats .lp-dot { margin-left: 0; width: 0.45rem; height: 0.45rem; }
+/* Sidebar sub-cluster: dot sits beside the reference count so it never wraps onto its own line */
+.cluster-nav-subs .badge .lp-dot { margin: 0 0.35rem 0 0; vertical-align: 0; }
+
+.lp-strip {
+  background: #fff;
+  border: 1px solid rgba(0,0,0,0.08);
+  border-left: 4px solid $lp-green;
+  border-radius: 4px;
+  padding: 0.45rem 0.7rem 0.4rem;
+  margin: 0.15rem 0 0.55rem;
+}
+/* Set topic, shown only when it differs from the sub-cluster it sits under (data: "heading") */
+.lp-strip__heading { text-transform: none; letter-spacing: 0; }
+.lp-strip__label {
+  display: block;
+  font-size: 0.58rem;
+  font-weight: 700;
+  text-transform: uppercase;
+  letter-spacing: 0.5px;
+  color: $lp-green;
+  margin-bottom: 0.25rem;
+}
+.lp-strip__chips {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 0.3rem;
+  margin-bottom: 0.3rem;
+}
+.lp-chip {
+  font-size: 0.7rem;
+  font-weight: 600;
+  color: #333;
+  background: rgba($lp-green,0.07);
+  border: 1px solid rgba($lp-green,0.2);
+  border-radius: 3px;
+  padding: 0.12rem 0.45rem;
+  max-width: 100%;
+  overflow-wrap: anywhere;
+}
+.lp-chip__formats {
+  font-weight: 400;
+  color: #777;
+}
+.lp-chip a {
+  color: $lp-green;
+  font-weight: 600;
+  text-decoration: underline;
+  text-decoration-color: rgba($lp-green,0.35);
+  text-underline-offset: 2px;
+}
+.lp-chip a:hover { color: #1f4a36; text-decoration-color: currentColor; }
+.lp-strip__meta {
+  font-size: 0.62rem;
+  line-height: 1.45;
+  color: #777;
+  margin: 0;
+}
+.lp-strip__meta a { color: #555; text-decoration: underline; text-decoration-color: rgba(0,0,0,0.25); }
+.lp-strip__meta a:hover { color: $lp-green; }
+
+/* Lesson-plan filter: a .fr-specificity-toggle checkbox whose label includes the dot */
+.lp-filter-toggle .lp-dot { margin: 0 0.2rem 0 0; }
+
+/* Lesson-plan filter on (.lp-filter-on set by featured-resources.js): hide everything without a set */
+.lp-filter-on .cluster-section:not([data-lp]),
+.lp-filter-on .acc-section:not([data-lp]),
+.lp-filter-on .cluster-nav-group:not([data-lp]),
+.lp-filter-on .cluster-nav-subs .nav-item:not([data-lp]) {
+  display: none;
+}
+/* Remaining sub-clusters lose their visible neighbour, so drop the divider on the first one shown */
+.lp-filter-on .acc-section[data-lp] { border-top: 0; }
+.lp-filter-on .acc-section[data-lp] ~ .acc-section[data-lp] { border-top: 1px solid rgba(0,0,0,0.06); }
+.lp-filter-empty { display: none; }
+.lp-filter-on .lp-filter-empty {
+  display: block;
+  font-size: 0.8rem;
+  color: #666;
+  padding: 1rem 0;
+}
+
 /* ---- Publication list ---- */
 .publication-list {
   padding-left: 1.5rem;
@@ -2175,7 +2272,7 @@ h1.clusters-site-heading.clusters-hub-page__title {
   display: flex;
   flex-wrap: wrap;
   gap: 0.75rem;
-  align-items: flex-start;
+  align-items: center;
   margin-bottom: 0.75rem;
   padding: 0.65rem 0.75rem;
   background: rgba(255,255,255,0.5);
@@ -2228,6 +2325,7 @@ h1.clusters-site-heading.clusters-hub-page__title {
   display: flex;
   align-items: center;
   gap: 0.3rem;
+  margin: 0; /* Bootstrap gives <label> a bottom margin, which lifts it off the button row */
   font-size: 0.68rem;
   color: #666;
   cursor: pointer;