@riverbankcms/sdk 0.104.1 → 0.107.0

package/dist/styles/index.css

@@ -64,12 +64,17 @@
     text-transform: uppercase;
   }
 
-  /* Eyebrow text - small uppercase labels for section introductions */
+  /* Eyebrow text - small uppercase labels for section introductions.
+     Each property resolves from the optional eyebrow typographic role
+     (--fs/--fw/--ls/--tt-eyebrow, emitted only when the theme sets them),
+     with the historical hardcoded values as fallbacks so existing themes
+     are unchanged. font-family falls back to the body font likewise. */
   .rb-eyebrow {
-    font-size: 0.875rem;
-    font-weight: 600;
-    letter-spacing: 0.025em;
-    text-transform: uppercase;
+    font-family: var(--font-eyebrow, var(--font-body));
+    font-size: var(--fs-eyebrow, 0.875rem);
+    font-weight: var(--fw-eyebrow, 600);
+    letter-spacing: var(--ls-eyebrow, 0.025em);
+    text-transform: var(--tt-eyebrow, uppercase);
   }
   .rb-eyebrow-treatment-accent {
     color: rgb(var(--tb-accent));
@@ -80,11 +85,11 @@
     width: fit-content;
     align-items: center;
     justify-content: center;
-    border: 1px solid color-mix(in srgb, var(--section-text-color, rgb(var(--tb-text))) 46%, transparent);
+    border: 1px solid color-mix(in srgb, var(--rb-surface-text-color, rgb(var(--tb-text, 17 24 39))) 46%, transparent);
     border-radius: 9999px;
-    background: color-mix(in srgb, var(--section-text-color, rgb(var(--tb-text))) 14%, transparent);
+    background: color-mix(in srgb, var(--rb-surface-text-color, rgb(var(--tb-text, 17 24 39))) 14%, transparent);
     padding: 0.5rem 1rem;
-    color: var(--section-text-color, rgb(var(--tb-text)));
+    color: var(--rb-surface-text-color, rgb(var(--tb-text, 17 24 39)));
     line-height: 1;
   }
   .rb-eyebrow-treatment-pill.rb-eyebrow-treatment-accent {
@@ -576,6 +581,50 @@
     }
   }
 
+  /*
+   * Responsive fractional grid tracks (rb-grid-tracks).
+   *
+   * Asymmetric AND responsive grid-template-columns, driven by inline custom
+   * properties the Grid primitive sets per breakpoint from string track
+   * templates:
+   *   --rb-gtc-base / --rb-gtc-sm / --rb-gtc-md / --rb-gtc-lg / --rb-gtc-xl
+   * Each breakpoint falls back to the next smaller one, so only the breakpoints
+   * an author actually sets take effect (e.g. base '1fr' + lg '1fr 0.9fr'
+   * collapses to a single column below lg). Authored here (not per node) so the
+   * @media -> @container conversion (container responsive mode) applies too.
+   */
+  .rb-grid-tracks {
+    grid-template-columns: var(--rb-gtc-base, 1fr);
+  }
+  @media (min-width: 640px) {
+    @scope ([data-rb-responsive-mode="viewport"]) to (:scope [data-rb-responsive-mode]) {
+      .rb-grid-tracks {
+        grid-template-columns: var(--rb-gtc-sm, var(--rb-gtc-base, 1fr));
+      }
+    }
+  }
+  @media (min-width: 768px) {
+    @scope ([data-rb-responsive-mode="viewport"]) to (:scope [data-rb-responsive-mode]) {
+      .rb-grid-tracks {
+        grid-template-columns: var(--rb-gtc-md, var(--rb-gtc-sm, var(--rb-gtc-base, 1fr)));
+      }
+    }
+  }
+  @media (min-width: 1024px) {
+    @scope ([data-rb-responsive-mode="viewport"]) to (:scope [data-rb-responsive-mode]) {
+      .rb-grid-tracks {
+        grid-template-columns: var(--rb-gtc-lg, var(--rb-gtc-md, var(--rb-gtc-sm, var(--rb-gtc-base, 1fr))));
+      }
+    }
+  }
+  @media (min-width: 1280px) {
+    @scope ([data-rb-responsive-mode="viewport"]) to (:scope [data-rb-responsive-mode]) {
+      .rb-grid-tracks {
+        grid-template-columns: var(--rb-gtc-xl, var(--rb-gtc-lg, var(--rb-gtc-md, var(--rb-gtc-sm, var(--rb-gtc-base, 1fr)))));
+      }
+    }
+  }
+
   /* Alignment */
   .rb-items-start {
     align-items: flex-start;
@@ -1761,6 +1810,11 @@
   :where(.theme-scope) .rb-modal {
     width: min(var(--rb-modal-max-width, 560px), 100%);
     background: var(--rb-modal-bg, rgb(var(--tb-surface)));
+    color: var(--rb-modal-text, rgb(var(--tb-text, 17 24 39)));
+    --rb-surface-text-color: var(--rb-modal-text, rgb(var(--tb-text, 17 24 39)));
+    --rb-surface-heading-color: var(--rb-modal-heading, var(--rb-modal-text, rgb(var(--tb-text, 17 24 39))));
+    --rb-surface-link-color: var(--rb-modal-link, var(--rb-modal-text, rgb(var(--tb-text, 17 24 39))));
+    --rb-surface-supporting-color: var(--rb-modal-supporting, var(--rb-modal-text, rgb(var(--tb-text, 17 24 39))));
     border: 1px solid var(--rb-modal-border, rgb(var(--tb-border)));
     border-radius: var(--rb-modal-radius, var(--radius-card));
     box-shadow: var(--rb-modal-shadow, var(--shadow-lg, var(--shadow-elev)));
@@ -1780,7 +1834,7 @@
     font-family: var(--font-heading);
     font-size: 1.0625rem;
     font-weight: 600;
-    color: rgb(var(--tb-text));
+    color: var(--rb-surface-heading-color, var(--rb-surface-text-color, rgb(var(--tb-text, 17 24 39))));
   }
 
   :where(.theme-scope) .rb-modal__close {
@@ -1790,7 +1844,7 @@
     height: 2.25rem;
     padding: 0;
     line-height: 1;
-    color: rgb(var(--tb-mutedText));
+    color: var(--rb-surface-supporting-color, var(--rb-surface-text-color, rgb(var(--tb-mutedText, 100 116 139))));
     cursor: pointer;
     display: grid;
     place-items: center;
@@ -1798,7 +1852,7 @@
   }
 
   :where(.theme-scope) .rb-modal__close:hover {
-    color: rgb(var(--tb-text));
+    color: var(--rb-surface-text-color, rgb(var(--tb-text, 17 24 39)));
     background: rgba(var(--tb-border), 0.2);
   }
 
@@ -1809,7 +1863,7 @@
 
   :where(.theme-scope) .rb-modal__body {
     padding: 0.875rem 1rem 1rem;
-    color: rgb(var(--tb-text));
+    color: var(--rb-surface-text-color, rgb(var(--tb-text, 17 24 39)));
     font-size: 0.9375rem;
     line-height: 1.45;
   }
@@ -1969,7 +2023,7 @@
     & h6 {
       font-family: var(--font-heading);
       /* Color is set by generateTypographyCss.ts with full cascade:
-       --section-heading-color -> --section-text-color -> --hc-hN -> --hc-heading -> inherit */
+       --rb-surface-heading-color -> --rb-surface-text-color -> --hc-hN -> --hc-heading -> global text */
       font-weight: var(--font-weight-heading);
       text-transform: var(--tt-heading);
       font-variant-caps: var(--fv-heading);
@@ -2115,7 +2169,7 @@
 
   /* Neutral prose uses theme text color by default */
   :where(.theme-scope) .rb-prose-neutral {
-    color: var(--section-text-color, rgb(var(--tb-text)));
+    color: var(--rb-surface-text-color, rgb(var(--tb-text, 17 24 39)));
   }
 
   :where(.theme-scope) .rb-prose p,
@@ -2149,8 +2203,14 @@
 
   :where(.theme-scope) .rb-prose a {
     --rb-prose-effective-link-color: var(
-      --section-link-color,
-      var(--rb-prose-link-color, rgb(var(--tb-primary)))
+      --rb-surface-link-color,
+      var(
+        --rb-surface-text-color,
+        var(
+          --rb-prose-link-color,
+          rgb(var(--tb-primary, var(--tb-text, 17 24 39)))
+        )
+      )
     );
     color: var(--rb-prose-effective-link-color);
     text-decoration-line: var(--rb-prose-link-decoration-line, underline);
@@ -2161,14 +2221,11 @@
     );
     text-underline-offset: var(--rb-prose-link-underline-offset, 0.14em);
     text-decoration-color: var(
-      --section-link-decoration-color,
-      var(
-        --rb-prose-link-decoration-color,
-        color-mix(
-          in srgb,
-          var(--rb-prose-effective-link-color) 35%,
-          transparent
-        )
+      --rb-prose-link-decoration-color,
+      color-mix(
+        in srgb,
+        var(--rb-prose-effective-link-color) 35%,
+        transparent
       )
     );
     transition:
@@ -2192,7 +2249,7 @@
 
   :where(.theme-scope) .rb-prose blockquote {
     /* Blockquotes use muted text color */
-    color: var(--section-supporting-color, rgb(var(--tb-mutedText)));
+    color: var(--rb-surface-supporting-color, var(--rb-surface-text-color, rgb(var(--tb-mutedText, 100 116 139))));
     border-left-color: rgb(var(--tb-border));
   }
 
@@ -3216,6 +3273,10 @@
   :where(.theme-scope) .card-surface {
     background: rgb(var(--tb-surface));
     color: rgb(var(--tb-onSurface, var(--tb-text)));
+    --rb-surface-text-color: rgb(var(--tb-onSurface, var(--tb-text)));
+    --rb-surface-heading-color: rgb(var(--tb-onSurface, var(--tb-text)));
+    --rb-surface-link-color: rgb(var(--tb-onSurface, var(--tb-text)));
+    --rb-surface-supporting-color: rgb(var(--tb-onSurface, var(--tb-text)));
     border: 1px solid rgb(var(--tb-border));
     border-radius: var(--radius-card);
     box-shadow: var(--shadow-elev);
@@ -3353,6 +3414,10 @@
   padding: clamp(1rem, 2vw, 1.5rem);
   background: var(--rb-reg-surface-bg, rgb(var(--tb-surface, 248 250 252)));
   color: var(--rb-reg-on-surface, rgb(var(--tb-onSurface, var(--tb-text, 15 23 42))));
+  --rb-surface-text-color: var(--rb-reg-on-surface, rgb(var(--tb-onSurface, var(--tb-text, 15 23 42))));
+  --rb-surface-heading-color: var(--rb-reg-on-surface, rgb(var(--tb-onSurface, var(--tb-text, 15 23 42))));
+  --rb-surface-link-color: var(--rb-reg-on-surface, rgb(var(--tb-onSurface, var(--tb-text, 15 23 42))));
+  --rb-surface-supporting-color: var(--rb-reg-on-surface-muted, var(--rb-reg-on-surface, rgb(var(--tb-onSurface, var(--tb-text, 15 23 42)))));
   transition: border-color var(--rb-block-transition, 150ms) ease;
   width: 100%;
   max-width: 800px;
@@ -6425,6 +6490,357 @@
   }
 }
 
+/* -----------------------------------------------------------------------------
+ * Week Board View
+ * Compact "class day-board": day columns side by side, one card per class,
+ * three-state availability (available / filling / waitlist), and a footer CTA.
+ * ----------------------------------------------------------------------------- */
+
+:where(.theme-scope) :where([data-block="event-calendar"]) .event-week-board {
+  /* Status accent tokens — map the three availability states onto theme colours.
+   * available -> secondary, filling -> accent, waitlist -> muted text. */
+  --ec-status-available: rgb(var(--tb-secondary));
+  --ec-status-filling: rgb(var(--tb-accent));
+  --ec-status-waitlist: rgba(var(--tb-text), 0.4);
+  --event-week-board-cols: 7;
+
+  border: 1px solid var(--ec-border);
+  border-radius: var(--rb-block-radius);
+  background-color: var(--ec-surface);
+  color: var(--ec-text);
+  overflow: hidden;
+}
+
+/* Opt-in raised look: a soft drop shadow so the board lifts off the page.
+ * Generic default (no [data-elevated]) stays flat. */
+:where(.theme-scope) :where([data-block="event-calendar"]) .event-week-board[data-elevated] {
+  box-shadow: 0 14px 34px -24px rgba(var(--tb-text), 0.35);
+}
+
+/* Top bar: title + legend */
+:where(.theme-scope) :where([data-block="event-calendar"]) .event-week-board-top {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 1rem;
+  flex-wrap: wrap;
+  padding: 1.1rem 1.5rem;
+  /* surfaceAlt gives the header/footer a legible tint against the white day-grid
+   * body — the faint `--ec-header-bg` (5% text) is invisible on light palettes. */
+  background-color: rgb(var(--tb-surfaceAlt));
+  border-bottom: 1px solid var(--ec-border-subtle);
+}
+
+:where(.theme-scope) :where([data-block="event-calendar"]) .event-week-board-title {
+  font-size: 0.8125rem;
+  font-weight: 600;
+  letter-spacing: 0.12em;
+  text-transform: uppercase;
+  color: rgb(var(--tb-primary));
+}
+
+:where(.theme-scope) :where([data-block="event-calendar"]) .event-week-board-legend {
+  display: flex;
+  align-items: center;
+  gap: 1.1rem;
+  flex-wrap: wrap;
+  font-size: 0.6875rem;
+  letter-spacing: 0.03em;
+  opacity: 0.75;
+}
+
+:where(.theme-scope) :where([data-block="event-calendar"]) .event-week-board-legend-item {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.4rem;
+}
+
+:where(.theme-scope) :where([data-block="event-calendar"]) .event-week-board-legend-dot {
+  width: 0.55rem;
+  height: 0.55rem;
+  border-radius: 50%;
+  display: inline-block;
+}
+
+:where(.theme-scope) :where([data-block="event-calendar"]) .event-week-board-legend-dot[data-status="available"] {
+  background-color: var(--ec-status-available);
+}
+
+:where(.theme-scope) :where([data-block="event-calendar"]) .event-week-board-legend-dot[data-status="filling"] {
+  background-color: var(--ec-status-filling);
+}
+
+:where(.theme-scope) :where([data-block="event-calendar"]) .event-week-board-legend-dot[data-status="waitlist"] {
+  background-color: var(--ec-status-waitlist);
+}
+
+/* Day columns grid */
+:where(.theme-scope) :where([data-block="event-calendar"]) .event-week-board-grid {
+  display: grid;
+  grid-template-columns: repeat(var(--event-week-board-cols), minmax(0, 1fr));
+}
+
+:where(.theme-scope) :where([data-block="event-calendar"]) .event-week-board-day {
+  display: flex;
+  flex-direction: column;
+  min-height: 15rem;
+  /* Tabular column rule. Driven by the theme border tokens so borderless site
+   * styles (border.width: 'none' -> --rb-border-width: 0) render no grid at all,
+   * while hairline/thin/thick themes get a crisp full-strength divider. */
+  border-right: var(--rb-border-width, 1px) solid rgb(var(--tb-border));
+}
+
+:where(.theme-scope) :where([data-block="event-calendar"]) .event-week-board-day:last-child {
+  border-right: none;
+}
+
+:where(.theme-scope) :where([data-block="event-calendar"]) .event-week-board-day-head {
+  display: flex;
+  align-items: baseline;
+  gap: 0.4rem;
+  padding: 0.9rem 0.9rem 0.65rem;
+  /* Header-row underline — same border-token gating as the column rules. */
+  border-bottom: var(--rb-border-width, 1px) solid rgb(var(--tb-border));
+}
+
+:where(.theme-scope) :where([data-block="event-calendar"]) .event-week-board-day--today .event-week-board-day-head {
+  background-color: var(--ec-today-bg);
+}
+
+:where(.theme-scope) :where([data-block="event-calendar"]) .event-week-board-day-abbr {
+  font-size: 0.6875rem;
+  font-weight: 600;
+  letter-spacing: 0.1em;
+  text-transform: uppercase;
+  opacity: 0.65;
+}
+
+:where(.theme-scope) :where([data-block="event-calendar"]) .event-week-board-day--today .event-week-board-day-abbr {
+  opacity: 1;
+  color: var(--ec-today-text);
+}
+
+:where(.theme-scope) :where([data-block="event-calendar"]) .event-week-board-day-num {
+  font-size: 0.8125rem;
+  font-weight: 600;
+  opacity: 0.5;
+}
+
+:where(.theme-scope) :where([data-block="event-calendar"]) .event-week-board-day-body {
+  display: flex;
+  flex-direction: column;
+  gap: 0.65rem;
+  padding: 0.9rem;
+  flex: 1;
+}
+
+/* Class card */
+:where(.theme-scope) :where([data-block="event-calendar"]) .event-week-board-card {
+  display: flex;
+  flex-direction: column;
+  gap: 0.45rem;
+  padding: 0.8rem 0.85rem;
+  /* Full hairline border at the site style's border strength (0 on borderless
+   * styles), alongside the exaggerated status stripe on the left. `--ec-border-subtle`
+   * (half-strength) reads as no border at all on light palettes. */
+  border: var(--rb-border-width, 1px) solid rgb(var(--tb-border));
+  border-left: 3px solid var(--ec-status-available);
+  border-radius: calc(var(--rb-block-radius) / 1.5);
+  background-color: var(--ec-surface);
+  color: inherit;
+  text-decoration: none;
+  transition:
+    transform var(--rb-block-transition) ease,
+    box-shadow var(--rb-block-transition) ease,
+    border-color var(--rb-block-transition) ease;
+}
+
+:where(.theme-scope) :where([data-block="event-calendar"]) .event-week-board-card[data-status="filling"] {
+  border-left-color: var(--ec-status-filling);
+}
+
+:where(.theme-scope) :where([data-block="event-calendar"]) .event-week-board-card[data-status="waitlist"] {
+  border-left-color: var(--ec-status-waitlist);
+}
+
+:where(.theme-scope) :where([data-block="event-calendar"]) .event-week-board-card:hover {
+  transform: translateY(-2px);
+  box-shadow: 0 6px 16px -8px rgba(var(--tb-text), 0.28);
+  border-color: rgba(var(--tb-primary), 0.4);
+}
+
+:where(.theme-scope) :where([data-block="event-calendar"]) .event-week-board-card:focus-visible {
+  outline: 2px solid rgb(var(--tb-primary));
+  outline-offset: 2px;
+}
+
+:where(.theme-scope) :where([data-block="event-calendar"]) .event-week-board-card-title {
+  font-family: var(--font-heading, inherit);
+  font-size: 0.9375rem;
+  font-weight: 600;
+  line-height: 1.2;
+}
+
+:where(.theme-scope) :where([data-block="event-calendar"]) .event-week-board-card-time {
+  font-size: 0.75rem;
+  letter-spacing: 0.01em;
+  opacity: 0.7;
+}
+
+/* Capacity pill */
+:where(.theme-scope) :where([data-block="event-calendar"]) .event-week-board-card-pill {
+  align-self: flex-start;
+  display: inline-flex;
+  align-items: center;
+  padding: 0.15rem 0.6rem;
+  border-radius: 999px;
+  font-size: 0.6875rem;
+  font-weight: 600;
+  letter-spacing: 0.02em;
+  /* Available (default): a calm neutral/muted pill — not a coloured outline.
+   * Filling -> amber and waitlist -> muted outline are handled by the
+   * data-status overrides below. */
+  border: 1px solid var(--ec-border);
+  background-color: rgba(var(--tb-text), 0.06);
+  color: rgba(var(--tb-text), 0.62);
+  border-color: var(--ec-border);
+}
+
+:where(.theme-scope) :where([data-block="event-calendar"]) .event-week-board-card-pill[data-status="filling"] {
+  background-color: rgba(var(--tb-accent), 0.14);
+  color: var(--ec-status-filling);
+  border-color: rgba(var(--tb-accent), 0.32);
+}
+
+:where(.theme-scope) :where([data-block="event-calendar"]) .event-week-board-card-pill[data-status="waitlist"] {
+  background-color: transparent;
+  color: rgba(var(--tb-text), 0.6);
+  border-color: var(--ec-border);
+}
+
+/* Footer */
+:where(.theme-scope) :where([data-block="event-calendar"]) .event-week-board-foot {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 1rem;
+  flex-wrap: wrap;
+  padding: 1.1rem 1.5rem;
+  /* Matches the header tint (see .event-week-board-top). */
+  background-color: rgb(var(--tb-surfaceAlt));
+  border-top: 1px solid var(--ec-border-subtle);
+}
+
+:where(.theme-scope) :where([data-block="event-calendar"]) .event-week-board-foot-note {
+  margin: 0;
+  font-size: 0.875rem;
+  opacity: 0.75;
+}
+
+/* Responsive: collapse day columns to a stacked list on narrow viewports */
+@media (max-width: 1023px) {
+  :where(.theme-scope) :where([data-block="event-calendar"]) .event-week-board-grid {
+    grid-template-columns: 1fr;
+  }
+
+  :where(.theme-scope) :where([data-block="event-calendar"]) .event-week-board-day {
+    min-height: 0;
+    border-right: none;
+    border-bottom: var(--rb-border-width, 1px) solid rgb(var(--tb-border));
+  }
+
+  :where(.theme-scope) :where([data-block="event-calendar"]) .event-week-board-day:last-child {
+    border-bottom: none;
+  }
+
+  :where(.theme-scope) :where([data-block="event-calendar"]) .event-week-board-day--empty {
+    display: none;
+  }
+
+  :where(.theme-scope) :where([data-block="event-calendar"]) .event-week-board-day-head {
+    border-bottom: none;
+    padding-bottom: 0.25rem;
+  }
+
+  :where(.theme-scope) :where([data-block="event-calendar"]) .event-week-board-day-body {
+    flex-direction: row;
+    flex-wrap: wrap;
+    padding-top: 0.35rem;
+  }
+
+  :where(.theme-scope) :where([data-block="event-calendar"]) .event-week-board-card {
+    flex: 1 1 14rem;
+  }
+}
+
+@media (max-width: 639px) {
+  :where(.theme-scope) :where([data-block="event-calendar"]) .event-week-board-legend {
+    display: none;
+  }
+
+  :where(.theme-scope) :where([data-block="event-calendar"]) .event-week-board-card {
+    flex: 1 1 100%;
+  }
+}
+
+/* -----------------------------------------------------------------------------
+ * Week-board section band
+ * Give the whole week-board section (head + panel) a subtle surface band so it
+ * reads as a distinct zone from the page — the "testimonials band" pattern.
+ * Painted as a pseudo-element above the section's fallback background layer
+ * (z-index -10) but behind the content, so no block-content wiring is needed.
+ * Surface + hairline rules are token-referenced: on a borderless site style
+ * (--rb-border-width: 0) the band keeps its surface tint but drops the rules.
+ * Opt-in only: the band paints when the board root carries [data-banded];
+ * the generic default is bandless.
+ * ----------------------------------------------------------------------------- */
+:where(.theme-scope) [data-slot="section"]:has(.event-calendar--week-board[data-banded])::before {
+  content: "";
+  position: absolute;
+  inset: 0;
+  z-index: -9;
+  background-color: rgb(var(--tb-surfaceAlt));
+  border-block: var(--rb-border-width, 1px) solid rgb(var(--tb-border));
+  pointer-events: none;
+}
+
+/* -----------------------------------------------------------------------------
+ * Event section head — split (heading left, intro right)
+ * Rendered by the block frame (outside [data-block="event-calendar"]) via
+ * eventSectionHeaderLayoutNodes({ splitClassName }). Lays the heading and its
+ * supporting intro out as a two-column head on wide viewports, stacking on
+ * narrow ones. The section band above provides the distinct background.
+ * ----------------------------------------------------------------------------- */
+:where(.theme-scope) .event-section-head--split {
+  display: flex;
+  align-items: flex-end;
+  justify-content: space-between;
+  gap: clamp(1.5rem, 4vw, 3.5rem);
+  flex-wrap: wrap;
+}
+
+:where(.theme-scope) .event-section-head--split > :where(h1, h2, h3) {
+  margin: 0;
+}
+
+:where(.theme-scope) .event-section-head--split > .rb-prose {
+  flex: 1 1 22rem;
+  max-width: 34rem;
+  margin: 0;
+}
+
+@media (max-width: 767px) {
+  :where(.theme-scope) .event-section-head--split {
+    flex-direction: column;
+    align-items: flex-start;
+    gap: 0.75rem;
+  }
+
+  :where(.theme-scope) .event-section-head--split > .rb-prose {
+    flex-basis: auto;
+  }
+}
+
 /* -----------------------------------------------------------------------------
  * Event Calendar Modals
  * Modal overlays for event details and day events list
@@ -6854,7 +7270,7 @@
 }
 
 :where(.theme-scope) .rb-inline-text-accent-contrast {
-  color: var(--section-text-color, rgb(var(--tb-text)));
+  color: var(--rb-surface-text-color, rgb(var(--tb-text, 17 24 39)));
 }
 
 :where(.theme-scope) .rb-inline-text-highlight {
@@ -6865,7 +7281,7 @@
 }
 
 :where(.theme-scope) .rb-inline-text-highlight-soft {
-  background: color-mix(in oklab, var(--section-text-color, rgb(var(--tb-text))) 14%, transparent);
+  background: color-mix(in oklab, var(--rb-surface-text-color, rgb(var(--tb-text, 17 24 39))) 14%, transparent);
 }
 
 :where(.theme-scope) .rb-inline-text-highlight-accent {
@@ -6886,7 +7302,7 @@
 
 /* Eyebrow - color only (typography via .rb-eyebrow) */
 :where(.theme-scope) :where([data-block="hero"]) .hero-eyebrow:not(.rb-eyebrow-treatment-accent) {
-  color: var(--section-text-color, rgb(var(--tb-text)));
+  color: var(--rb-surface-text-color, rgb(var(--tb-text, 17 24 39)));
 }
 
 /* Subheadline - supporting text below headline */
@@ -6896,7 +7312,7 @@
 
 :where(.theme-scope) :where([data-block="hero"]) .hero-subheadline {
   font-size: 1.125rem;
-  color: var(--section-supporting-color, var(--section-text-color, rgb(var(--tb-text))));
+  color: var(--rb-surface-supporting-color, var(--rb-surface-text-color, rgb(var(--tb-mutedText, 100 116 139))));
 }
 
 @media (min-width: 640px) {
@@ -6985,7 +7401,7 @@
 
 /* CTA content/body text */
 :where(.theme-scope) :where([data-block="cta-full"]) .cta-content {
-  color: var(--section-supporting-color, rgb(var(--tb-mutedText)));
+  color: var(--rb-surface-supporting-color, var(--rb-surface-text-color, rgb(var(--tb-mutedText, 100 116 139))));
 }
 
 /* CTA button row container */
@@ -7087,7 +7503,7 @@
 /* Form intro text */
 :where(.theme-scope) :where([data-block="form"]) .form-copy-intro {
   font-size: 1rem;
-  color: var(--section-text-color, rgb(var(--tb-text)));
+  color: var(--rb-surface-text-color, rgb(var(--tb-text, 17 24 39)));
 }
 
 /* =============================================================================
@@ -7448,6 +7864,10 @@
   --rb-modal-overlay-bg: rgb(var(--tb-text, 0 0 0) / 0.6);
   --rb-modal-shadow: var(--shadow-lg, var(--shadow-elev));
   --rb-modal-z-index: 20000;
+  --rb-modal-text: rgb(var(--tb-text, 17 24 39));
+  --rb-modal-heading: rgb(var(--tb-text, 17 24 39));
+  --rb-modal-link: rgb(var(--tb-primary, var(--tb-text, 17 24 39)));
+  --rb-modal-supporting: rgb(var(--tb-mutedText, 100 116 139));
   --shop-card-radius: var(--rb-block-radius, var(--radius-card, 0.75rem));
   --shop-control-radius: var(--rb-input-radius, var(--radius-control, 0.375rem));
 }
@@ -7458,7 +7878,7 @@
 }
 
 :where(.theme-scope) .shop__empty-text {
-  color: rgb(var(--tb-mutedText));
+  color: var(--rb-surface-supporting-color, var(--rb-surface-text-color, rgb(var(--tb-mutedText))));
   font-size: var(--fs-body, 1rem);
 }
 
@@ -7484,7 +7904,7 @@
 :where(.theme-scope) .shop__section-heading {
   font-size: var(--fs-h3, 1.25rem);
   font-weight: 600;
-  color: rgb(var(--tb-text));
+  color: var(--rb-surface-heading-color, var(--rb-surface-text-color, rgb(var(--tb-text))));
   margin-bottom: 1rem;
   font-family: var(--font-heading);
 }
@@ -7502,15 +7922,136 @@
   gap: 1rem;
 }
 
-/* Product card */
-:where(.theme-scope) .shop__card {
-  background: rgb(var(--tb-surface));
-  border: 1px solid rgb(var(--tb-border));
-  border-radius: var(--shop-card-radius);
-  padding: 1.5rem;
-  display: flex;
-  flex-direction: column;
-  gap: 0.75rem;
+/* Compact product register: useful for small, scannable pass/package sets. */
+:where(.theme-scope) .shop--register .shop__section {
+  margin-bottom: 0;
+}
+
+:where(.theme-scope) .shop--register .shop__section-heading {
+  margin-bottom: 1rem;
+  font-size: clamp(1.4rem, 2.2vw, 1.7rem);
+}
+
+:where(.theme-scope) .shop--register .shop__products--register {
+  display: flex;
+  flex-direction: column;
+  border-top: 1px solid color-mix(in oklab, currentColor, transparent 78%);
+}
+
+:where(.theme-scope) .shop--register .shop__card {
+  display: grid;
+  grid-template-columns: minmax(8rem, 0.85fr) auto minmax(12rem, 1.5fr) auto;
+  grid-template-rows: auto;
+  align-items: center;
+  column-gap: clamp(1rem, 3vw, 2.5rem);
+  padding: 1rem 0;
+  border: 0;
+  border-bottom: 1px solid color-mix(in oklab, currentColor, transparent 78%);
+  border-radius: 0;
+  background: transparent;
+  color: inherit;
+  --rb-surface-text-color: inherit;
+  --rb-surface-heading-color: inherit;
+  --rb-surface-link-color: inherit;
+  --rb-surface-supporting-color: inherit;
+}
+
+:where(.theme-scope) .shop--register .shop__card-header {
+  display: contents;
+}
+
+:where(.theme-scope) .shop--register .shop__card-name,
+:where(.theme-scope) .shop--register .shop__card-price,
+:where(.theme-scope) .shop--register .shop__card-details,
+:where(.theme-scope) .shop--register .shop__cta {
+  margin: 0;
+}
+
+:where(.theme-scope) .shop--register .shop__card-name {
+  grid-column: 1;
+  grid-row: 1;
+  font-family: var(--font-heading);
+  font-size: 1.15rem;
+  font-weight: 400;
+}
+
+:where(.theme-scope) .shop--register .shop__card-price {
+  grid-column: 2;
+  grid-row: 1;
+  font-size: 0.98rem;
+  font-weight: 500;
+  white-space: nowrap;
+  color: var(--rb-surface-link-color, var(--rb-surface-text-color, inherit));
+}
+
+:where(.theme-scope) .shop--register .shop__card-description {
+  grid-column: 1 / -1;
+  margin-top: 0.35rem;
+}
+
+:where(.theme-scope) .shop--register .shop__card-details {
+  grid-column: 3;
+  grid-row: 1;
+  display: flex;
+  flex-wrap: wrap;
+  gap: 0.35rem 1rem;
+  color: var(--rb-surface-supporting-color, rgb(var(--tb-mutedText)));
+  font-size: 0.86rem;
+}
+
+:where(.theme-scope) .shop--register .shop__cta {
+  grid-column: 4;
+  grid-row: 1;
+  align-self: center;
+  margin-left: auto;
+}
+
+:where(.theme-scope) .shop--register .shop__card > [role='status'] {
+  grid-column: 1 / -1;
+}
+
+@media (max-width: 767px) {
+  :where(.theme-scope) .shop--register .shop__card {
+    grid-template-columns: minmax(0, 1fr) auto;
+    row-gap: 0.45rem;
+  }
+
+  :where(.theme-scope) .shop--register .shop__card-name {
+    grid-column: 1;
+  }
+
+  :where(.theme-scope) .shop--register .shop__card-price {
+    grid-column: 2;
+    grid-row: 1;
+  }
+
+  :where(.theme-scope) .shop--register .shop__card-details {
+    grid-column: 1 / -1;
+    grid-row: 2;
+  }
+
+  :where(.theme-scope) .shop--register .shop__cta {
+    grid-column: 1 / -1;
+    grid-row: 3;
+    justify-self: start;
+    margin-left: 0;
+  }
+}
+
+/* Product card */
+:where(.theme-scope) .shop__card {
+  background: rgb(var(--tb-surface));
+  color: rgb(var(--tb-text, 17 24 39));
+  --rb-surface-text-color: rgb(var(--tb-text, 17 24 39));
+  --rb-surface-heading-color: rgb(var(--tb-text, 17 24 39));
+  --rb-surface-link-color: rgb(var(--tb-primary, var(--tb-text, 17 24 39)));
+  --rb-surface-supporting-color: rgb(var(--tb-mutedText, 100 116 139));
+  border: 1px solid rgb(var(--tb-border));
+  border-radius: var(--shop-card-radius);
+  padding: 1.5rem;
+  display: flex;
+  flex-direction: column;
+  gap: 0.75rem;
 }
 
 /* No hover shadow (buttons + theme do the emphasis) */
@@ -7525,7 +8066,7 @@
 :where(.theme-scope) .shop__card-name {
   font-size: 1.125rem;
   font-weight: 600;
-  color: rgb(var(--tb-text));
+  color: var(--rb-surface-heading-color, rgb(var(--tb-text)));
   margin: 0;
   font-family: var(--font-heading);
 }
@@ -7533,19 +8074,19 @@
 :where(.theme-scope) .shop__card-price {
   font-size: 1.125rem;
   font-weight: 700;
-  color: rgb(var(--tb-primary));
+  color: var(--rb-surface-link-color, rgb(var(--tb-primary)));
   white-space: nowrap;
 }
 
 :where(.theme-scope) .shop__card-interval {
   font-size: 0.875rem;
   font-weight: 400;
-  color: rgb(var(--tb-mutedText));
+  color: var(--rb-surface-supporting-color, rgb(var(--tb-mutedText)));
 }
 
 :where(.theme-scope) .shop__card-description {
   font-size: 0.875rem;
-  color: rgb(var(--tb-mutedText));
+  color: var(--rb-surface-supporting-color, rgb(var(--tb-mutedText)));
   line-height: 1.5;
   margin: 0;
 }
@@ -7555,7 +8096,7 @@
   flex-wrap: wrap;
   gap: 0.5rem 1rem;
   font-size: 0.875rem;
-  color: rgb(var(--tb-text));
+  color: var(--rb-surface-text-color, rgb(var(--tb-text)));
 }
 
 :where(.theme-scope) .shop__card-credits {
@@ -7563,16 +8104,16 @@
 }
 
 :where(.theme-scope) .shop__card-per-credit {
-  color: rgb(var(--tb-mutedText));
+  color: var(--rb-surface-supporting-color, rgb(var(--tb-mutedText)));
 }
 
 :where(.theme-scope) .shop__card-validity {
-  color: rgb(var(--tb-mutedText));
+  color: var(--rb-surface-supporting-color, rgb(var(--tb-mutedText)));
 }
 
 :where(.theme-scope) .shop__card-unlimited {
   font-weight: 500;
-  color: rgb(var(--tb-secondary, var(--tb-primary)));
+  color: var(--rb-surface-link-color, rgb(var(--tb-secondary, var(--tb-primary))));
 }
 
 /* CTA layout: use theme button classes for visuals */
@@ -7657,6 +8198,11 @@
   border: 1px solid rgb(var(--tb-border));
   border-radius: var(--shop-card-radius);
   background: rgb(var(--tb-surface));
+  color: rgb(var(--tb-text, 17 24 39));
+  --rb-surface-text-color: rgb(var(--tb-text, 17 24 39));
+  --rb-surface-heading-color: rgb(var(--tb-text, 17 24 39));
+  --rb-surface-link-color: rgb(var(--tb-primary, var(--tb-text, 17 24 39)));
+  --rb-surface-supporting-color: rgb(var(--tb-mutedText, 100 116 139));
 }
 
 :where(.theme-scope) :where([data-block="shop"]) .rb-state-icon--success {
@@ -7729,6 +8275,11 @@
   margin: 0 auto;
   padding: 2rem;
   background: var(--cp-card-bg);
+  color: var(--cp-text);
+  --rb-surface-text-color: var(--cp-text);
+  --rb-surface-heading-color: var(--cp-text);
+  --rb-surface-link-color: var(--cp-primary);
+  --rb-surface-supporting-color: var(--cp-muted);
   border: 1px solid var(--cp-card-border);
   border-radius: var(--cp-card-radius);
 }
@@ -7857,6 +8408,11 @@
   padding: 3rem 2rem;
   text-align: center;
   background: var(--cp-card-bg);
+  color: var(--cp-text);
+  --rb-surface-text-color: var(--cp-text);
+  --rb-surface-heading-color: var(--cp-text);
+  --rb-surface-link-color: var(--cp-primary);
+  --rb-surface-supporting-color: var(--cp-muted);
   border: 1px dashed var(--cp-card-border);
   border-radius: var(--cp-card-radius);
 }
@@ -7869,6 +8425,11 @@
 /* Card */
 :where(.theme-scope) :where([data-block="customer-portal"]) .cp-card {
   background: var(--cp-card-bg);
+  color: var(--cp-text);
+  --rb-surface-text-color: var(--cp-text);
+  --rb-surface-heading-color: var(--cp-text);
+  --rb-surface-link-color: var(--cp-primary);
+  --rb-surface-supporting-color: var(--cp-muted);
   border: 1px solid var(--cp-card-border);
   border-radius: var(--cp-card-radius);
   padding: 1.25rem;
@@ -8033,6 +8594,11 @@
 /* Table */
 :where(.theme-scope) :where([data-block="customer-portal"]) .cp-table-wrap {
   background: var(--cp-card-bg);
+  color: var(--cp-text);
+  --rb-surface-text-color: var(--cp-text);
+  --rb-surface-heading-color: var(--cp-text);
+  --rb-surface-link-color: var(--cp-primary);
+  --rb-surface-supporting-color: var(--cp-muted);
   border: 1px solid var(--cp-card-border);
   border-radius: var(--cp-card-radius);
 }
@@ -8594,6 +9160,149 @@
 }
 
 
+/* =============================================================================
+ * Variant: featured-editorial
+ *
+ * An asymmetric layout: a large featured (spruce-ink) quote card beside a
+ * column of stacked white cards. Renders NO avatars. Colours are palette
+ * tokens only. Node structure is built in testimonialsCarousel.ts.
+ * ============================================================================= */
+
+/* Establish an inline-size query container so the head and grid below respond
+ * to the block's own width, not the browser viewport. A viewport @media query
+ * collapses to 1-col in the dashboard's scaled preview canvas (which reads the
+ * dashboard window, not the canvas) and when the block sits in a narrow column;
+ * @container tracks the actual laid-out width — matching the split-grid variant. */
+:where(.theme-scope) :where([data-block="testimonials"]) .rb-testimonials-fe {
+  container-type: inline-size;
+  container-name: rb-testimonials-fe;
+}
+
+/* Section head: heading left, lead-in line to the right; stacks on mobile. */
+:where(.theme-scope) :where([data-block="testimonials"]) .rb-testimonials-fe-head {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  gap: 0.875rem;
+}
+
+:where(.theme-scope) :where([data-block="testimonials"]) .rb-testimonials-fe-leadin {
+  max-width: 30rem;
+}
+
+@container rb-testimonials-fe (min-width: 768px) {
+  :where(.theme-scope) :where([data-block="testimonials"]) .rb-testimonials-fe-head {
+    flex-direction: row;
+    align-items: flex-end;
+    justify-content: space-between;
+    gap: 1.5rem;
+  }
+}
+
+/* Card grid: featured (wider) beside the stacked column. Single column on
+ * small screens. */
+:where(.theme-scope) :where([data-block="testimonials"]) .rb-testimonials-fe-grid {
+  display: grid;
+  grid-template-columns: minmax(0, 1fr);
+  gap: 1.25rem;
+  align-items: stretch;
+}
+
+@container rb-testimonials-fe (min-width: 1024px) {
+  :where(.theme-scope) :where([data-block="testimonials"]) .rb-testimonials-fe-grid {
+    grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
+  }
+}
+
+:where(.theme-scope) :where([data-block="testimonials"]) .rb-testimonials-fe-col {
+  display: grid;
+  gap: 1.25rem;
+  align-content: start;
+}
+
+/* Base card (white surface) */
+:where(.theme-scope) :where([data-block="testimonials"]) .rb-testimonials-fe-card {
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+  border-radius: var(--rb-block-radius);
+  padding: 1.875rem 1.875rem 1.625rem;
+  background: rgb(var(--tb-surface));
+  border: 1px solid rgba(var(--tb-border), 0.9);
+  box-shadow: 0 1px 2px rgba(var(--tb-shadow, 0 0 0), 0.05);
+}
+
+/* Featured (spruce-ink) card */
+:where(.theme-scope) :where([data-block="testimonials"]) .rb-testimonials-fe-card--feature {
+  padding: 2.5rem;
+  background: rgb(var(--tb-primary));
+  border-color: transparent;
+  color: rgb(var(--tb-onPrimary));
+}
+
+/* Amber quote mark, oversized serif */
+:where(.theme-scope) :where([data-block="testimonials"]) .rb-testimonials-fe-qmark {
+  display: block;
+  height: 1.6rem;
+  font-family: var(--font-heading, Georgia, serif);
+  font-style: italic;
+  font-size: 3.375rem;
+  line-height: 0.6;
+  color: rgb(var(--tb-secondary));
+}
+
+/* Quote body. The inner <p> is targeted directly (not via :where) so the
+ * serif display font and sizing win over the theme's base paragraph rule. */
+:where(.theme-scope) :where([data-block="testimonials"]) .rb-testimonials-fe-quote {
+  flex: 1 1 auto;
+  margin-top: 1.25rem;
+}
+
+:where(.theme-scope) :where([data-block="testimonials"]) .rb-testimonials-fe-quote p {
+  margin: 0;
+  font-family: var(--font-heading, Georgia, serif);
+  font-size: 1.15rem;
+  line-height: 1.5;
+  color: rgb(var(--tb-text));
+}
+
+:where(.theme-scope) :where([data-block="testimonials"]) .rb-testimonials-fe-card--feature .rb-testimonials-fe-quote p {
+  color: rgb(var(--tb-onPrimary));
+  font-size: clamp(1.375rem, 2.4vw, 1.6875rem);
+  line-height: 1.42;
+  letter-spacing: -0.01em;
+}
+
+/* Attribution: name (bold) + context line, no avatar */
+:where(.theme-scope) :where([data-block="testimonials"]) .rb-testimonials-fe-meta {
+  display: flex;
+  flex-direction: column;
+  gap: 0.25rem;
+  margin-top: 1.625rem;
+}
+
+:where(.theme-scope) :where([data-block="testimonials"]) .rb-testimonials-fe-name {
+  font-weight: 600;
+  font-size: 0.97rem;
+  color: rgb(var(--tb-text));
+}
+
+:where(.theme-scope) :where([data-block="testimonials"]) .rb-testimonials-fe-context {
+  font-size: 0.78rem;
+  letter-spacing: 0.02em;
+  color: rgb(var(--tb-mutedText));
+}
+
+:where(.theme-scope) :where([data-block="testimonials"]) .rb-testimonials-fe-card--feature .rb-testimonials-fe-name {
+  color: rgb(var(--tb-onPrimary));
+}
+
+:where(.theme-scope) :where([data-block="testimonials"]) .rb-testimonials-fe-card--feature .rb-testimonials-fe-context {
+  color: rgb(var(--tb-onPrimary));
+  opacity: 0.7;
+}
+
+
 /* Testimonials carousel tweaks: arrow styling + gutters + equal-height cards */
 :where(.theme-scope) :where([data-block="testimonials"]) .rb-testimonials-carousel.carousel-root .carousel-nav-btn {
   height: var(--rb-testimonial-carousel-arrow-size);
@@ -9737,7 +10446,7 @@
 
 :where(.theme-scope) :where([data-block="newsletter-signup"]) .newsletter-copy-subtitle {
   font-size: 1rem;
-  color: var(--section-text-color, rgb(var(--tb-text)));
+  color: var(--rb-surface-text-color, rgb(var(--tb-text, 17 24 39)));
   opacity: 0.85;
 }
 
@@ -9786,7 +10495,7 @@
   margin-top: 0.75rem;
   font-size: 1rem;
   line-height: 1.6;
-  color: var(--section-text-color, rgb(var(--tb-text)));
+  color: var(--rb-surface-text-color, rgb(var(--tb-text, 17 24 39)));
   text-align: center;
 }
 
@@ -9823,6 +10532,50 @@
   }
 }
 
+/* =============================================================================
+ * Editorial Split Variant
+ * =============================================================================
+ */
+
+:where(.theme-scope) .newsletter-editorial-split {
+  display: grid;
+  grid-template-columns: minmax(0, 0.9fr) minmax(20rem, 1.1fr);
+  gap: clamp(2.5rem, 7vw, 7rem);
+  align-items: center;
+  text-align: left;
+}
+
+:where(.theme-scope) .newsletter-editorial-split-copy {
+  display: flex;
+  flex-direction: column;
+  gap: var(--rb-gap-sm, 0.75rem);
+}
+
+:where(.theme-scope) .newsletter-editorial-split-form {
+  min-width: 0;
+}
+
+:where(.theme-scope) .newsletter-editorial-split .newsletter-form {
+  max-width: none;
+  margin-inline: 0;
+}
+
+:where(.theme-scope) .newsletter-editorial-split .newsletter-copy-title {
+  font-size: clamp(2rem, 4vw, 3.5rem);
+  font-weight: 500;
+}
+
+:where(.theme-scope) .newsletter-editorial-split .newsletter-privacy-note {
+  text-align: left;
+}
+
+@media (max-width: 767px) {
+  :where(.theme-scope) .newsletter-editorial-split {
+    grid-template-columns: minmax(0, 1fr);
+    gap: 2rem;
+  }
+}
+
 /* =============================================================================
  * Success State
  * =============================================================================
@@ -9867,7 +10620,7 @@
 
 :where(.theme-scope) :where([data-block="contact-newsletter"]) .form-copy-intro,
 :where(.theme-scope) :where([data-block="contact-newsletter"]) .newsletter-copy-subtitle {
-  color: var(--section-text-color, rgb(var(--tb-text)));
+  color: var(--rb-surface-text-color, rgb(var(--tb-text, 17 24 39)));
 }
 
 :where(.theme-scope) :where([data-block="contact-newsletter"]) .contact-newsletter-info {
@@ -10264,7 +11017,7 @@
 
 :where(.theme-scope) .event-compact-row-title {
   margin: 0;
-  color: var(--section-heading-color, rgb(var(--tb-primary, 0 0 0)));
+  color: var(--rb-surface-heading-color, var(--rb-surface-text-color, rgb(var(--tb-primary, var(--tb-text, 17 24 39)))));
   font-family: var(--font-heading, var(--font-body, inherit));
   font-size: clamp(1.05rem, 1rem + 0.35vw, 1.3rem);
   font-weight: 400;
@@ -10842,13 +11595,13 @@
  * bleeds to the card edges and the inner content stack drops its fallback
  * padding so insets don't double up.
  */
-:where(.theme-scope) .rb-feature-card[class*="rb-container-pad-"]:not(.rb-container-pad-none) > .rb-feature-card-media {
+:where(.theme-scope) .rb-feature-card[class*="rb-container-pad-"]:not(.rb-container-pad-none) > .rb-feature-card-media-frame {
   width: calc(100% + 2 * var(--rb-card-pad, 0rem));
   max-width: none;
   margin: calc(-1 * var(--rb-card-pad, 0rem)) calc(-1 * var(--rb-card-pad, 0rem)) 0;
 }
 
-:where(.theme-scope) .rb-feature-card[class*="rb-container-pad-"]:not(.rb-container-pad-none) > .rb-feature-card-media + .rb-feature-card-content {
+:where(.theme-scope) .rb-feature-card[class*="rb-container-pad-"]:not(.rb-container-pad-none) > .rb-feature-card-media-frame + .rb-feature-card-content {
   margin-top: 1.4rem;
 }
 
@@ -10899,63 +11652,184 @@
   background: rgb(var(--tb-primary, 0 0 0));
 }
 
-:where(.theme-scope) .rb-card-treatment-editorial-rule > .rb-feature-card-media {
+:where(.theme-scope) .rb-card-treatment-editorial-rule > .rb-feature-card-media-frame {
   margin-top: 1.6rem;
   border-radius: calc(var(--rb-block-radius, 0.75rem) * 0.5);
 }
 
-:where(.theme-scope) .rb-card-treatment-editorial-rule > .rb-feature-card-content {
-  padding: 1.6rem 0 0.25rem;
+:where(.theme-scope) .rb-feature-card > .rb-bg-surface,
+:where(.theme-scope) .rb-feature-card > .rb-feature-card-media-frame {
+  border-start-start-radius: inherit;
+  border-start-end-radius: inherit;
 }
 
-:where(.theme-scope) .rb-card-treatment-editorial-rule .cta-row .button-ghost {
-  padding-inline: 0;
+/* --- Editorial diptych + pathways ----------------------------------------- */
+
+:where(.theme-scope) .rb-feature-cards-heading--editorial {
+  margin-inline: 0;
+  text-align: left;
 }
 
-/* --- Colour-blocked --------------------------------------------------------- */
+:where(.theme-scope) .rb-feature-cards-eyebrow {
+  margin: 0;
+  color: rgb(var(--tb-accent));
+  font-size: 0.72rem;
+  font-weight: 600;
+  letter-spacing: 0.14em;
+  text-transform: uppercase;
+}
 
-/*
- * Bold, flat cards that each take a different palette colour by position,
- * cycled across the grid, with a staggered vertical offset on wider screens.
- * The background layer (`.rb-bg-surface`) is recoloured per card; the card's
- * text colour is set to the matching on-colour so content stays readable.
- */
-:where(.theme-scope) .rb-card-treatment-color-blocked {
+:where(.theme-scope) .rb-feature-cards-grid--editorial-diptych {
+  grid-template-columns: minmax(0, 1.12fr) minmax(0, 0.88fr);
+  align-items: stretch;
+}
+
+:where(.theme-scope) .rb-feature-cards-grid--editorial-pathways {
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+  align-items: start;
+}
+
+:where(.theme-scope) .rb-feature-cards-grid:is(
+  .rb-feature-cards-grid--editorial-diptych,
+  .rb-feature-cards-grid--editorial-pathways
+) .rb-feature-card {
+  border: 0;
   box-shadow: none;
+  height: auto;
+  min-width: 0;
 }
 
-/* Per-card colour cycle. The `on*` colours are always derived by the palette
- * (expandPalette emits onSurface/onSecondary/onPrimary), so no fallback. */
-:where(.theme-scope) .rb-card-treatment-color-blocked:nth-child(3n + 1) > .rb-bg-surface {
-  background: rgb(var(--tb-surface));
+:where(.theme-scope) .rb-feature-cards-grid:is(
+  .rb-feature-cards-grid--editorial-diptych,
+  .rb-feature-cards-grid--editorial-pathways
+) .rb-feature-card[data-surface-role="open"] > .rb-bg-surface {
+  background: transparent;
 }
-:where(.theme-scope) .rb-card-treatment-color-blocked:nth-child(3n + 1) {
-  color: rgb(var(--tb-onSurface));
+
+:where(.theme-scope) .rb-feature-cards-grid:is(
+  .rb-feature-cards-grid--editorial-diptych,
+  .rb-feature-cards-grid--editorial-pathways
+) .rb-feature-card[data-surface-role="open"] > .rb-feature-card-content {
+  padding-inline: 0;
 }
 
-:where(.theme-scope) .rb-card-treatment-color-blocked:nth-child(3n + 2) > .rb-bg-surface {
-  background: rgb(var(--tb-secondary));
+:where(.theme-scope) .rb-feature-cards-grid--editorial-pathways .rb-feature-card > .rb-bg-surface {
+  background: transparent;
 }
-:where(.theme-scope) .rb-card-treatment-color-blocked:nth-child(3n + 2) {
-  color: rgb(var(--tb-onSecondary));
+
+:where(.theme-scope) .rb-feature-cards-grid--editorial-pathways .rb-feature-card > .rb-feature-card-content {
+  padding-inline: 0;
 }
 
-:where(.theme-scope) .rb-card-treatment-color-blocked:nth-child(3n + 3) > .rb-bg-surface {
+:where(.theme-scope) .rb-feature-cards-grid--editorial-diptych .rb-feature-card[data-surface-role="panel"] {
+  color: rgb(var(--tb-onPrimary));
+  --rb-surface-text-color: rgb(var(--tb-onPrimary));
+  --rb-surface-heading-color: rgb(var(--tb-onPrimary));
+  --rb-surface-link-color: rgb(var(--tb-onPrimary));
+  --rb-surface-supporting-color: color-mix(in oklab, rgb(var(--tb-onPrimary)), transparent 18%);
+}
+
+:where(.theme-scope) .rb-feature-cards-grid--editorial-diptych .rb-feature-card[data-surface-role="panel"] > .rb-bg-surface {
   background: rgb(var(--tb-primary));
+  border-radius: inherit;
 }
-:where(.theme-scope) .rb-card-treatment-color-blocked:nth-child(3n + 3) {
-  color: rgb(var(--tb-onPrimary));
+
+:where(.theme-scope) .rb-feature-cards-grid--editorial-diptych .rb-feature-card[data-surface-role="panel"] > .rb-feature-card-media-frame {
+  width: calc(100% - 2.5rem);
+  margin: 1.25rem 1.25rem 0;
+  border-radius: calc(var(--rb-block-radius, 0.75rem) * 0.55);
 }
 
-/* Body copy carries an inline muted colour from the block; force it to the
- * card's on-colour so it reads on every block (inline style needs !important). */
-:where(.theme-scope) .rb-card-treatment-color-blocked .rb-feature-card-body {
-  color: inherit !important;
-  opacity: 0.9;
+:where(.theme-scope) .rb-feature-cards-grid--editorial-pathways .rb-feature-card-content {
+  padding-top: 1.35rem;
 }
 
-/* The number marker defaults to the brand accent, which collides with the
- * primary-coloured card in the cycle. On colour-blocked cards use the card's
+@media (min-width: 768px) {
+  :where(.theme-scope) .rb-feature-cards-grid--editorial-diptych .rb-feature-card[data-surface-role="panel"] {
+    margin-top: clamp(2rem, 5vw, 4.5rem);
+  }
+
+  :where(.theme-scope) .rb-feature-cards-grid--editorial-pathways .rb-feature-card + .rb-feature-card {
+    border-left: 1px solid color-mix(in oklab, currentColor, transparent 82%);
+    padding-left: clamp(1.5rem, 4vw, 4rem);
+  }
+}
+
+@media (max-width: 767px) {
+  :where(.theme-scope) .rb-feature-cards-grid:is(
+    .rb-feature-cards-grid--editorial-diptych,
+    .rb-feature-cards-grid--editorial-pathways
+  ) {
+    grid-template-columns: minmax(0, 1fr);
+  }
+}
+
+:where(.theme-scope) .rb-card-treatment-editorial-rule > .rb-feature-card-content {
+  padding: 1.6rem 0 0.25rem;
+}
+
+:where(.theme-scope) .rb-card-treatment-editorial-rule .cta-row .button-ghost {
+  padding-inline: 0;
+}
+
+/* --- Colour-blocked --------------------------------------------------------- */
+
+/*
+ * Bold, flat cards that each take a different palette colour by position,
+ * cycled across the grid, with a staggered vertical offset on wider screens.
+ * The background layer (`.rb-bg-surface`) is recoloured per card; the card's
+ * text colour is set to the matching on-colour so content stays readable.
+ */
+:where(.theme-scope) .rb-card-treatment-color-blocked {
+  box-shadow: none;
+}
+
+/* Per-card colour cycle. The `on*` colours are always derived by the palette
+ * (expandPalette emits onSurface/onSecondary/onPrimary), so no fallback. */
+:where(.theme-scope) .rb-card-treatment-color-blocked:nth-child(3n + 1) > .rb-bg-surface {
+  background: rgb(var(--tb-surface));
+}
+:where(.theme-scope) .rb-card-treatment-color-blocked:nth-child(3n + 1) {
+  background: rgb(var(--tb-surface));
+  color: rgb(var(--tb-onSurface));
+  --rb-surface-text-color: rgb(var(--tb-onSurface));
+  --rb-surface-heading-color: rgb(var(--tb-onSurface));
+  --rb-surface-link-color: rgb(var(--tb-onSurface));
+  --rb-surface-supporting-color: rgb(var(--tb-onSurface));
+}
+
+:where(.theme-scope) .rb-card-treatment-color-blocked:nth-child(3n + 2) > .rb-bg-surface {
+  background: rgb(var(--tb-secondary));
+}
+:where(.theme-scope) .rb-card-treatment-color-blocked:nth-child(3n + 2) {
+  background: rgb(var(--tb-secondary));
+  color: rgb(var(--tb-onSecondary));
+  --rb-surface-text-color: rgb(var(--tb-onSecondary));
+  --rb-surface-heading-color: rgb(var(--tb-onSecondary));
+  --rb-surface-link-color: rgb(var(--tb-onSecondary));
+  --rb-surface-supporting-color: rgb(var(--tb-onSecondary));
+}
+
+:where(.theme-scope) .rb-card-treatment-color-blocked:nth-child(3n + 3) > .rb-bg-surface {
+  background: rgb(var(--tb-primary));
+}
+:where(.theme-scope) .rb-card-treatment-color-blocked:nth-child(3n + 3) {
+  background: rgb(var(--tb-primary));
+  color: rgb(var(--tb-onPrimary));
+  --rb-surface-text-color: rgb(var(--tb-onPrimary));
+  --rb-surface-heading-color: rgb(var(--tb-onPrimary));
+  --rb-surface-link-color: rgb(var(--tb-onPrimary));
+  --rb-surface-supporting-color: rgb(var(--tb-onPrimary));
+}
+
+/* Keep the intended visual hierarchy; the body color itself now resolves via
+ * the nearest surface provider instead of requiring an inline override. */
+:where(.theme-scope) .rb-card-treatment-color-blocked .rb-feature-card-body {
+  opacity: 0.9;
+}
+
+/* The number marker defaults to the brand accent, which collides with the
+ * primary-coloured card in the cycle. On colour-blocked cards use the card's
  * own on-colour (the palette guarantees it's legible on that background) and a
  * faint tint of it for the badge, so the number always contrasts. */
 :where(.theme-scope) .rb-card-treatment-color-blocked .rb-feature-card-number-zone {
@@ -10977,12 +11851,12 @@
 }
 
 
-:where(.theme-scope) [data-block="intro"][data-block-look="intro-portrait-bio"][data-block-variant="media-copy"] .rb-intro-media-wrap {
+:where(.theme-scope) [data-block="intro"][data-block-composition="portrait-bio"][data-block-variant="media-copy"] .rb-intro-media-wrap {
   max-width: min(100%, 24rem);
   margin-inline: auto;
 }
 
-:where(.theme-scope) [data-block="intro"][data-block-look="intro-portrait-bio"][data-block-variant="media-copy"] .rb-intro-media {
+:where(.theme-scope) [data-block="intro"][data-block-composition="portrait-bio"][data-block-variant="media-copy"] .rb-intro-media {
   aspect-ratio: 1 / 1 !important;
   border-radius: 9999px;
 }
@@ -10999,18 +11873,913 @@
   }
 }
 
-:where(.theme-scope) [data-block="intro"][data-block-look="intro-editorial-statement"] .rb-intro-title {
+:where(.theme-scope) [data-block="intro"][data-block-composition="editorial-statement"] .rb-intro-title {
   font-size: clamp(2rem, 1.56rem + 1.4vw, 3rem);
   line-height: 1.14;
 }
 
-:where(.theme-scope) [data-block="intro"][data-block-look="intro-editorial-statement"] .rb-intro-copy {
+:where(.theme-scope) [data-block="intro"][data-block-composition="editorial-statement"] .rb-intro-copy {
   gap: var(--rb-space-5, 1.25rem);
 }
 
-:where(.theme-scope) [data-block="intro"][data-block-look="intro-editorial-statement"] .rb-intro-copy .rb-prose {
+:where(.theme-scope) [data-block="intro"][data-block-composition="editorial-statement"] .rb-intro-copy .rb-prose {
   font-size: clamp(1.125rem, 1.02rem + 0.35vw, 1.375rem);
   line-height: 1.65;
 }
 
 
+:where(.theme-scope) :where([data-block="recurring-schedule"]) .recurring-schedule-section {
+  width: min(100%, 66rem);
+  margin-inline: auto;
+}
+
+:where(.theme-scope) :where([data-block="recurring-schedule"]) .recurring-schedule-heading {
+  max-width: 44rem;
+}
+
+:where(.theme-scope) :where([data-block="recurring-schedule"]) .recurring-schedule-header {
+  display: flex;
+  gap: 2rem;
+  align-items: end;
+  justify-content: space-between;
+}
+
+:where(.theme-scope) :where([data-block="recurring-schedule"]) .recurring-schedule-eyebrow {
+  margin: 0;
+  color: rgb(var(--tb-accent));
+  font-size: 0.72rem;
+  font-weight: 600;
+  letter-spacing: 0.14em;
+  text-transform: uppercase;
+}
+
+:where(.theme-scope) :where([data-block="recurring-schedule"]) .recurring-schedule-heading-title {
+  margin: 0;
+  font-size: clamp(2rem, 4.6vw, 3.3rem);
+  line-height: 1.08;
+}
+
+:where(.theme-scope) .recurring-schedule {
+  border-top: 1px solid color-mix(in oklab, currentColor, transparent 78%);
+}
+
+:where(.theme-scope) .recurring-schedule-row {
+  display: grid;
+  grid-template-columns: minmax(9rem, 0.82fr) minmax(16rem, 1.5fr) auto;
+  grid-template-rows: auto auto;
+  column-gap: clamp(1.5rem, 4vw, 2.75rem);
+  row-gap: 0.15rem;
+  align-items: center;
+  padding: 1.4rem 0.75rem;
+  border-bottom: 1px solid color-mix(in oklab, currentColor, transparent 78%);
+  color: inherit;
+}
+
+:where(.theme-scope) .recurring-schedule-day,
+:where(.theme-scope) .recurring-schedule-time,
+:where(.theme-scope) .recurring-schedule-title,
+:where(.theme-scope) .recurring-schedule-venue {
+  margin: 0;
+}
+
+:where(.theme-scope) .recurring-schedule-day {
+  grid-column: 1;
+  grid-row: 1;
+  font-family: var(--font-heading);
+  font-size: clamp(1.25rem, 2vw, 1.5rem);
+  line-height: 1;
+}
+
+:where(.theme-scope) .recurring-schedule-time {
+  grid-column: 1;
+  grid-row: 2;
+  display: flex;
+  gap: 0.35rem;
+  color: var(--rb-surface-supporting-color, rgb(var(--tb-mutedText)));
+  font-size: 0.86rem;
+  font-variant-numeric: tabular-nums;
+}
+
+:where(.theme-scope) .recurring-schedule-details {
+  grid-column: 2;
+  grid-row: 1 / span 2;
+  align-self: center;
+}
+
+:where(.theme-scope) .recurring-schedule-title {
+  font-size: 1.06rem;
+  font-weight: 500;
+}
+
+:where(.theme-scope) .recurring-schedule-venue {
+  margin-top: 0.2rem;
+  color: var(--rb-surface-supporting-color, rgb(var(--tb-mutedText)));
+  font-size: 0.92rem;
+}
+
+:where(.theme-scope) .recurring-schedule-action {
+  grid-column: 3;
+  grid-row: 1 / span 2;
+  min-width: 4.5rem;
+  text-align: right;
+}
+
+:where(.theme-scope) .recurring-schedule-see-all {
+  width: fit-content;
+  color: inherit;
+  text-underline-offset: 0.3em;
+}
+
+:where(.theme-scope) .recurring-schedule-empty {
+  margin: 0;
+  color: var(--rb-surface-supporting-color, rgb(var(--tb-mutedText)));
+}
+
+@media (max-width: 767px) {
+  :where(.theme-scope) :where([data-block="recurring-schedule"]) .recurring-schedule-header {
+    align-items: start;
+    flex-direction: column;
+    gap: 1rem;
+  }
+
+  :where(.theme-scope) .recurring-schedule-row {
+    grid-template-columns: 1fr auto;
+    grid-template-rows: auto auto auto;
+    gap: 0.5rem 1rem;
+    align-items: start;
+  }
+
+  :where(.theme-scope) .recurring-schedule-day {
+    grid-column: 1;
+  }
+
+  :where(.theme-scope) .recurring-schedule-time {
+    grid-column: 1;
+  }
+
+  :where(.theme-scope) .recurring-schedule-details {
+    grid-column: 1 / -1;
+    grid-row: 3;
+    margin-top: 0.35rem;
+  }
+
+  :where(.theme-scope) .recurring-schedule-action {
+    grid-column: 2;
+    grid-row: 1 / span 2;
+  }
+}
+
+
+/* =============================================================================
+ * Event list treatments: registers and dense indexes
+ *
+ * These treatments retain the event list's content and structural layout.
+ * Their contrast relationships come exclusively from the active semantic
+ * section surface and named palette tokens.
+ * ============================================================================= */
+
+:where(.theme-scope)
+  :where(
+    .rb-event-list-treatment-ruled-register,
+    .rb-event-list-treatment-editorial-register,
+    .rb-event-list-treatment-dense-index
+  )
+  .event-card.event-card {
+  position: relative;
+  overflow: visible;
+  border: 0;
+  border-radius: 0;
+  background: transparent;
+  box-shadow: none;
+  color: inherit;
+}
+
+/* Register treatments intentionally prioritise schedule data over imagery. */
+:where(.theme-scope)
+  :where(
+    .rb-event-list-treatment-ruled-register,
+    .rb-event-list-treatment-editorial-register,
+    .rb-event-list-treatment-dense-index
+  )
+  .event-card.event-card
+  .event-card-media {
+  display: none;
+}
+
+:where(.theme-scope)
+  :where(
+    .rb-event-list-treatment-ruled-register,
+    .rb-event-list-treatment-editorial-register,
+    .rb-event-list-treatment-dense-index
+  )
+  .event-card.event-card
+  .card-content {
+  min-width: 0;
+  padding: 1.5rem 0.625rem;
+}
+
+:where(.theme-scope)
+  :where(
+    .rb-event-list-treatment-ruled-register,
+    .rb-event-list-treatment-editorial-register,
+    .rb-event-list-treatment-dense-index
+  )
+  .event-card.event-card
+  .card-title {
+  min-width: 0;
+  margin-bottom: 0.25rem;
+}
+
+:where(.theme-scope)
+  :where(
+    .rb-event-list-treatment-ruled-register,
+    .rb-event-list-treatment-editorial-register,
+    .rb-event-list-treatment-dense-index
+  )
+  .event-card.event-card
+  .event-card-footer {
+  min-width: 8rem;
+  padding-top: 0;
+}
+
+:where(.theme-scope)
+  :where(
+    .rb-event-list-treatment-ruled-register,
+    .rb-event-list-treatment-editorial-register,
+    .rb-event-list-treatment-dense-index
+  )
+  .event-card.event-card
+  .event-card-cta {
+  width: 100%;
+}
+
+/* Ruled register: open rows with quiet rules on the current section surface. */
+:where(.theme-scope)
+  .rb-event-list-treatment-ruled-register
+  .event-card.event-card {
+  border-top: 1px solid color-mix(in oklab, currentColor, transparent 78%);
+}
+
+:where(.theme-scope)
+  .rb-event-list-treatment-ruled-register
+  .event-card.event-card:last-child {
+  border-bottom: 1px solid color-mix(in oklab, currentColor, transparent 78%);
+}
+
+/* Editorial register: generous rows, an accent marker and display-led titles. */
+:where(.theme-scope)
+  .rb-event-list-treatment-editorial-register
+  .event-card.event-card {
+  border-top: 1px solid color-mix(in oklab, rgb(var(--tb-border)), transparent 20%);
+}
+
+:where(.theme-scope)
+  .rb-event-list-treatment-editorial-register
+  .event-card.event-card:last-child {
+  border-bottom: 1px solid color-mix(in oklab, rgb(var(--tb-border)), transparent 20%);
+}
+
+:where(.theme-scope)
+  .rb-event-list-treatment-editorial-register
+  .event-card.event-card::before {
+  content: "";
+  position: absolute;
+  inset-block: 1.75rem;
+  inset-inline-start: 0;
+  width: 0.25rem;
+  border-radius: var(--rb-block-radius, 0.75rem);
+  background: rgb(var(--tb-accent));
+}
+
+:where(.theme-scope)
+  .rb-event-list-treatment-editorial-register
+  .event-card.event-card
+  .card-content {
+  padding-block: 1.875rem;
+  padding-inline-start: clamp(1.25rem, 2.5vw, 2rem);
+}
+
+:where(.theme-scope)
+  .rb-event-list-treatment-editorial-register
+  .event-card.event-card
+  .card-title {
+  font-family: var(--font-heading, var(--font-body, inherit));
+  font-size: clamp(1.5rem, 1.2rem + 1vw, 2rem);
+  font-weight: 500;
+  line-height: 1.15;
+}
+
+/* Dense index: stronger outside rule and reduced row rhythm, without opting
+ * the block into its structurally different compact-list facet. */
+:where(.theme-scope)
+  .rb-event-list-treatment-dense-index
+  .event-card.event-card {
+  border-bottom: 1px solid color-mix(in oklab, currentColor, transparent 62%);
+}
+
+:where(.theme-scope)
+  .rb-event-list-treatment-dense-index
+  .event-card.event-card:first-child {
+  border-top: 2px solid currentColor;
+}
+
+:where(.theme-scope)
+  .rb-event-list-treatment-dense-index
+  .event-card.event-card
+  .card-content {
+  padding-block: 1.125rem;
+}
+
+:where(.theme-scope)
+  .rb-event-list-treatment-dense-index
+  .event-card.event-card
+  .card-title {
+  font-size: 1rem;
+  line-height: 1.35;
+}
+
+@media (min-width: 768px) {
+  :where(.theme-scope)
+    :where(
+      .rb-event-list-treatment-ruled-register,
+      .rb-event-list-treatment-editorial-register,
+      .rb-event-list-treatment-dense-index
+    )
+    .event-card.event-card.event-card--horizontal {
+    display: block;
+  }
+
+  :where(.theme-scope)
+    :where(
+      .rb-event-list-treatment-ruled-register,
+      .rb-event-list-treatment-editorial-register,
+      .rb-event-list-treatment-dense-index
+    )
+    .event-card.event-card.event-card--horizontal
+    .card-content {
+    display: grid;
+    grid-template-columns: minmax(8.5rem, 0.7fr) minmax(15rem, 1.55fr) auto;
+    grid-template-rows: auto auto auto;
+    align-items: center;
+    column-gap: clamp(1.25rem, 3vw, 2.625rem);
+  }
+
+  :where(.theme-scope)
+    :where(
+      .rb-event-list-treatment-ruled-register,
+      .rb-event-list-treatment-editorial-register,
+      .rb-event-list-treatment-dense-index
+    )
+    .event-card.event-card.event-card--horizontal
+    .card-title {
+    grid-column: 2;
+  }
+
+  :where(.theme-scope)
+    :where(
+      .rb-event-list-treatment-ruled-register,
+      .rb-event-list-treatment-editorial-register,
+      .rb-event-list-treatment-dense-index
+    )
+    .event-card.event-card.event-card--horizontal
+    .card-content > div.rb-caption {
+    grid-column: 1;
+    grid-row: 1 / span 6;
+    margin-bottom: 0;
+  }
+
+  :where(.theme-scope)
+    :where(
+      .rb-event-list-treatment-ruled-register,
+      .rb-event-list-treatment-editorial-register,
+      .rb-event-list-treatment-dense-index
+    )
+    .event-card.event-card.event-card--horizontal
+    .card-content > div.rb-mb-3 {
+    grid-column: 2;
+    margin-bottom: 0;
+  }
+
+  :where(.theme-scope)
+    :where(
+      .rb-event-list-treatment-ruled-register,
+      .rb-event-list-treatment-editorial-register,
+      .rb-event-list-treatment-dense-index
+    )
+    .event-card.event-card.event-card--horizontal
+    .card-content > .event-category-badge {
+    grid-column: 2;
+  }
+
+  :where(.theme-scope)
+    :where(
+      .rb-event-list-treatment-ruled-register,
+      .rb-event-list-treatment-editorial-register,
+      .rb-event-list-treatment-dense-index
+    )
+    .event-card.event-card.event-card--horizontal
+    .card-content > .card-body,
+  :where(.theme-scope)
+    :where(
+      .rb-event-list-treatment-ruled-register,
+      .rb-event-list-treatment-editorial-register,
+      .rb-event-list-treatment-dense-index
+    )
+    .event-card.event-card.event-card--horizontal
+    .card-content > .status-muted:not(.event-card-capacity) {
+    grid-column: 2;
+  }
+
+  :where(.theme-scope)
+    :where(
+      .rb-event-list-treatment-ruled-register,
+      .rb-event-list-treatment-editorial-register,
+      .rb-event-list-treatment-dense-index
+    )
+    .event-card.event-card.event-card--horizontal
+    .event-card-footer {
+    grid-column: 3;
+    grid-row: 1 / span 6;
+    flex-direction: column;
+    justify-content: center;
+    align-items: stretch;
+  }
+}
+
+
+/* =============================================================================
+ * Feature-card composition Looks promoted from block-treatment studies.
+ * Palette relationships use named semantic tokens; copy and media stay in the
+ * existing feature-card content contract.
+ * ============================================================================= */
+
+/* Asymmetric emphasis: repeat a 5/7 pair rhythm and give each even card a
+ * semantic secondary surface. This remains useful with more than two cards. */
+:where(.theme-scope)
+  [data-block="feature-cards"][data-block-composition="asymmetric-emphasis"]
+  .rb-feature-cards-grid {
+  align-items: start;
+}
+:where(.theme-scope)
+  [data-block="feature-cards"][data-block-composition="asymmetric-emphasis"]
+  .rb-feature-card {
+  height: auto;
+  overflow: hidden;
+  border: 0;
+  border-radius: 0;
+  background: transparent;
+}
+
+:where(.theme-scope)
+  [data-block="feature-cards"][data-block-composition="asymmetric-emphasis"]
+  .rb-feature-card > .rb-feature-card-content {
+  padding-inline: 0;
+}
+
+:where(.theme-scope)
+  [data-block="feature-cards"][data-block-composition="asymmetric-emphasis"]
+  .rb-feature-card:nth-child(even) {
+  padding: clamp(1.125rem, 2.5vw, 1.875rem);
+  border-radius: calc(var(--rb-block-radius, 0.75rem) * 1.5);
+  background: rgb(var(--tb-secondary));
+  color: rgb(var(--tb-onSecondary));
+  --rb-surface-text-color: rgb(var(--tb-onSecondary));
+  --rb-surface-heading-color: rgb(var(--tb-onSecondary));
+  --rb-surface-link-color: rgb(var(--tb-onSecondary));
+  --rb-surface-supporting-color: rgb(var(--tb-onSecondary));
+}
+
+:where(.theme-scope)
+  [data-block="feature-cards"][data-block-composition="asymmetric-emphasis"]
+  .rb-feature-card:nth-child(even) > .rb-feature-card-media {
+  border-radius: var(--rb-block-radius, 0.75rem);
+}
+
+/* Framed programme: a close-set family of inset cards on a semantic depth
+ * section. The itemSurface recipe supplies each complete surface provider. */
+:where(.theme-scope)
+  [data-block="feature-cards"][data-block-composition="framed-programme"]
+  .rb-feature-cards-grid {
+  gap: clamp(1rem, 2vw, 1.5rem);
+}
+
+:where(.theme-scope)
+  [data-block="feature-cards"][data-block-composition="framed-programme"]
+  .rb-feature-card > .rb-feature-card-media {
+  width: 100%;
+  max-width: 100%;
+  margin: 0;
+  border-radius: var(--rb-block-radius, 0.75rem);
+}
+
+:where(.theme-scope)
+  [data-block="feature-cards"][data-block-composition="framed-programme"]
+  .rb-feature-card > .rb-feature-card-content {
+  padding-inline: 0;
+  padding-bottom: 0;
+}
+
+@media (min-width: 768px) {
+  :where(.theme-scope)
+    [data-block="feature-cards"][data-block-composition="asymmetric-emphasis"]
+    .rb-feature-cards-grid.rb-grid-cols-2 {
+    grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
+  }
+}
+
+
+/* =============================================================================
+ * Offerings Preview composition Looks promoted from the Fran André treatment
+ * study. The outer section surface remains independently configurable. These
+ * rules use expanded semantic palette tokens only.
+ * ============================================================================= */
+
+:where(.theme-scope)
+  [data-block="offerings-preview"]
+  [data-offering-presentation="featured-summary"]
+  .offerings-preview-card-header {
+  text-align: left;
+}
+
+:where(.theme-scope)
+  [data-block="offerings-preview"]
+  .offerings-preview-summary-date {
+  margin: 0;
+  font-family: var(--font-heading, inherit);
+  font-size: clamp(1.125rem, 2.2vw, 1.5rem);
+  font-weight: 650;
+  line-height: 1.22;
+}
+
+:where(.theme-scope)
+  [data-block="offerings-preview"]
+  .offerings-preview-summary-date time {
+  display: inline-block;
+}
+
+:where(.theme-scope)
+  [data-block="offerings-preview"]
+  .offerings-preview-summary-facts {
+  display: grid;
+  gap: 0;
+  margin: clamp(1.25rem, 3vw, 2rem) 0 0;
+}
+
+:where(.theme-scope)
+  [data-block="offerings-preview"]
+  .offerings-preview-summary-facts > div {
+  display: grid;
+  grid-template-columns: minmax(5.5rem, 0.65fr) minmax(0, 1.35fr);
+  gap: 1rem;
+  padding-block: 0.6rem;
+  border-top: 1px solid rgba(var(--tb-border), 0.72);
+}
+
+:where(.theme-scope)
+  [data-block="offerings-preview"]
+  .offerings-preview-summary-facts dt {
+  font-size: 0.72rem;
+  font-weight: 750;
+  letter-spacing: 0.1em;
+  text-transform: uppercase;
+}
+
+:where(.theme-scope)
+  [data-block="offerings-preview"]
+  .offerings-preview-summary-facts dd {
+  min-width: 0;
+  margin: 0;
+  font-weight: 600;
+}
+
+:where(.theme-scope)
+  [data-block="offerings-preview"]:is(
+    [data-block-look="offerings-preview-paired-feature-cards"],
+    [data-block-look="offerings-preview-open-editorial-columns"],
+    [data-block-look="offerings-preview-joined-programme-panel"]
+  )
+  .offerings-preview {
+  container: rb-offerings-preview / inline-size;
+}
+
+:where(.theme-scope)
+  [data-block="offerings-preview"]:is(
+    [data-block-look="offerings-preview-paired-feature-cards"],
+    [data-block-look="offerings-preview-open-editorial-columns"],
+    [data-block-look="offerings-preview-joined-programme-panel"]
+  )
+  .offerings-preview-card {
+  min-width: 0;
+}
+
+:where(.theme-scope)
+  [data-block="offerings-preview"]:is(
+    [data-block-look="offerings-preview-paired-feature-cards"],
+    [data-block-look="offerings-preview-open-editorial-columns"],
+    [data-block-look="offerings-preview-joined-programme-panel"]
+  )
+  .offerings-preview-card-content {
+  padding: clamp(1.4rem, 3.5vw, 2.75rem);
+}
+
+:where(.theme-scope)
+  [data-block="offerings-preview"]:is(
+    [data-block-look="offerings-preview-paired-feature-cards"],
+    [data-block-look="offerings-preview-open-editorial-columns"],
+    [data-block-look="offerings-preview-joined-programme-panel"]
+  )
+  .offerings-preview-card-footer {
+  margin-top: auto;
+  padding-top: clamp(1.25rem, 3vw, 2rem);
+}
+
+/* Paired feature cards: one editorial lead and one supporting route. With a
+ * third group the grid returns to equal columns rather than implying a new
+ * source hierarchy. */
+:where(.theme-scope)
+  [data-block="offerings-preview"][data-block-look="offerings-preview-paired-feature-cards"]
+  .offerings-preview-grid {
+  grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr)) !important;
+  gap: clamp(1rem, 2.5vw, 1.5rem);
+}
+
+:where(.theme-scope)
+  [data-block="offerings-preview"][data-block-look="offerings-preview-paired-feature-cards"]
+  .offerings-preview-card {
+  overflow: hidden;
+  border: 1px solid rgb(var(--tb-border));
+  border-radius: calc(var(--rb-block-radius, 0.75rem) * 1.75);
+  background: rgb(var(--tb-accent-200));
+  color: rgb(var(--tb-onAccent200));
+  --rb-surface-text-color: rgb(var(--tb-onAccent200));
+  --rb-surface-heading-color: rgb(var(--tb-onAccent200));
+  --rb-surface-link-color: rgb(var(--tb-onAccent200));
+  --rb-surface-supporting-color: rgb(var(--tb-onAccent200));
+}
+
+:where(.theme-scope)
+  [data-block="offerings-preview"][data-block-look="offerings-preview-paired-feature-cards"]
+  .offerings-preview-card:first-child {
+  border-color: transparent;
+  background: rgb(var(--tb-primary-950));
+  color: rgb(var(--tb-onPrimary950));
+  box-shadow: 0.55rem 0.55rem 0 rgb(var(--tb-secondary-100));
+  --rb-surface-text-color: rgb(var(--tb-onPrimary950));
+  --rb-surface-heading-color: rgb(var(--tb-onPrimary950));
+  --rb-surface-link-color: rgb(var(--tb-onPrimary950));
+  --rb-surface-supporting-color: rgb(var(--tb-onPrimary950));
+}
+
+:where(.theme-scope)
+  [data-block="offerings-preview"][data-block-look="offerings-preview-paired-feature-cards"]
+  .offerings-preview-card:first-child
+  .offerings-preview-card-title {
+  color: rgb(var(--tb-primary-200));
+}
+
+@container rb-offerings-preview (min-width: 52rem) {
+  :where(.theme-scope)
+    [data-block="offerings-preview"][data-block-look="offerings-preview-paired-feature-cards"]
+    .offerings-preview-grid:has(> .offerings-preview-card:nth-child(2):last-child) {
+    grid-template-columns: minmax(0, 1.22fr) minmax(18rem, 0.78fr) !important;
+  }
+}
+
+/* Open editorial columns: composition and hierarchy without an item fill. */
+:where(.theme-scope)
+  [data-block="offerings-preview"][data-block-look="offerings-preview-open-editorial-columns"]
+  .offerings-preview-grid {
+  grid-template-columns: repeat(auto-fit, minmax(min(100%, 19rem), 1fr)) !important;
+  gap: 0;
+  border-block: 1px solid rgb(var(--tb-border));
+}
+
+:where(.theme-scope)
+  [data-block="offerings-preview"][data-block-look="offerings-preview-open-editorial-columns"]
+  .offerings-preview-card {
+  border: 0;
+  border-radius: 0;
+  background: transparent;
+  color: var(--rb-surface-text-color, rgb(var(--tb-text)));
+}
+
+:where(.theme-scope)
+  [data-block="offerings-preview"][data-block-look="offerings-preview-open-editorial-columns"]
+  .offerings-preview-card + .offerings-preview-card {
+  border-top: 1px solid rgb(var(--tb-border));
+}
+
+@container rb-offerings-preview (min-width: 46rem) {
+  :where(.theme-scope)
+    [data-block="offerings-preview"][data-block-look="offerings-preview-open-editorial-columns"]
+    .offerings-preview-card + .offerings-preview-card {
+    border-top: 0;
+    border-left: 1px solid rgb(var(--tb-border));
+  }
+}
+
+/* Joined programme panel: every group remains independently editable but the
+ * close-set bands read as one upcoming programme. */
+:where(.theme-scope)
+  [data-block="offerings-preview"][data-block-look="offerings-preview-joined-programme-panel"]
+  .offerings-preview {
+  overflow: hidden;
+  gap: 0;
+  border: 1px solid rgb(var(--tb-border));
+  border-radius: calc(var(--rb-block-radius, 0.75rem) * 1.75);
+  background: rgb(var(--tb-surface));
+}
+
+:where(.theme-scope)
+  [data-block="offerings-preview"][data-block-look="offerings-preview-joined-programme-panel"]
+  .offerings-preview-grid {
+  grid-template-columns: minmax(0, 1fr) !important;
+  gap: 0;
+}
+
+:where(.theme-scope)
+  [data-block="offerings-preview"][data-block-look="offerings-preview-joined-programme-panel"]
+  .offerings-preview-card {
+  border: 0;
+  border-radius: 0;
+  background: rgb(var(--tb-secondary-100));
+  color: rgb(var(--tb-onSecondary100));
+  --rb-surface-text-color: rgb(var(--tb-onSecondary100));
+  --rb-surface-heading-color: rgb(var(--tb-onSecondary100));
+  --rb-surface-link-color: rgb(var(--tb-onSecondary100));
+  --rb-surface-supporting-color: rgb(var(--tb-onSecondary100));
+}
+
+:where(.theme-scope)
+  [data-block="offerings-preview"][data-block-look="offerings-preview-joined-programme-panel"]
+  .offerings-preview-card:nth-child(2) {
+  background: rgb(var(--tb-accent-200));
+  color: rgb(var(--tb-onAccent200));
+  --rb-surface-text-color: rgb(var(--tb-onAccent200));
+  --rb-surface-heading-color: rgb(var(--tb-onAccent200));
+  --rb-surface-link-color: rgb(var(--tb-onAccent200));
+  --rb-surface-supporting-color: rgb(var(--tb-onAccent200));
+}
+
+:where(.theme-scope)
+  [data-block="offerings-preview"][data-block-look="offerings-preview-joined-programme-panel"]
+  .offerings-preview-card:nth-child(3) {
+  background: rgb(var(--tb-primary-100));
+  color: rgb(var(--tb-onPrimary100));
+  --rb-surface-text-color: rgb(var(--tb-onPrimary100));
+  --rb-surface-heading-color: rgb(var(--tb-onPrimary100));
+  --rb-surface-link-color: rgb(var(--tb-onPrimary100));
+  --rb-surface-supporting-color: rgb(var(--tb-onPrimary100));
+}
+
+:where(.theme-scope)
+  [data-block="offerings-preview"][data-block-look="offerings-preview-joined-programme-panel"]
+  .offerings-preview-card + .offerings-preview-card {
+  border-top: 1px solid rgb(var(--tb-border));
+}
+
+@container rb-offerings-preview (min-width: 58rem) {
+  :where(.theme-scope)
+    [data-block="offerings-preview"][data-block-look="offerings-preview-joined-programme-panel"]
+    .offerings-preview-card-content {
+    display: grid;
+    grid-template-columns: minmax(15rem, 1.1fr) minmax(19rem, 1.4fr) minmax(10rem, auto);
+    align-items: center;
+    gap: clamp(1.5rem, 4vw, 4rem);
+  }
+
+  :where(.theme-scope)
+    [data-block="offerings-preview"][data-block-look="offerings-preview-joined-programme-panel"]
+    .offerings-preview-card-footer {
+    margin-top: 0;
+    padding-top: 0;
+    justify-content: flex-end;
+  }
+}
+
+
+/* =============================================================================
+ * Featured-editorial testimonial Looks promoted from the Fran André treatment
+ * study. These rules do not set the outer section background.
+ * ============================================================================= */
+
+:where(.theme-scope)
+  [data-block="testimonials"]:is(
+    [data-block-look="testimonials-evergreen-lead"],
+    [data-block-look="testimonials-room-and-response"],
+    [data-block-look="testimonials-open-floor"]
+  )
+  .rb-testimonials-fe-card--feature {
+  background: rgb(var(--tb-secondary-900));
+  color: rgb(var(--tb-onSecondary900));
+  --rb-surface-text-color: rgb(var(--tb-onSecondary900));
+  --rb-surface-heading-color: rgb(var(--tb-onSecondary900));
+  --rb-surface-link-color: rgb(var(--tb-onSecondary900));
+  --rb-surface-supporting-color: rgb(var(--tb-onSecondary900));
+}
+
+:where(.theme-scope)
+  [data-block="testimonials"]:is(
+    [data-block-look="testimonials-evergreen-lead"],
+    [data-block-look="testimonials-room-and-response"],
+    [data-block-look="testimonials-open-floor"]
+  )
+  .rb-testimonials-fe-card--feature
+  .rb-testimonials-fe-qmark {
+  color: rgb(var(--tb-primary-200));
+}
+
+:where(.theme-scope)
+  [data-block="testimonials"]:is(
+    [data-block-look="testimonials-evergreen-lead"],
+    [data-block-look="testimonials-room-and-response"],
+    [data-block-look="testimonials-open-floor"]
+  )
+  .rb-testimonials-fe-card--feature
+  :is(.rb-testimonials-fe-quote p, .rb-testimonials-fe-name, .rb-testimonials-fe-context) {
+  color: rgb(var(--tb-onSecondary900));
+}
+
+/* Evergreen lead: the feature remains dominant while the supporting column
+ * opens into two equal compact voices at wider widths. */
+@container rb-testimonials-fe (min-width: 1024px) {
+  :where(.theme-scope)
+    [data-block="testimonials"][data-block-look="testimonials-evergreen-lead"]
+    .rb-testimonials-fe-grid {
+    grid-template-columns: minmax(0, 1.15fr) minmax(0, 1.55fr);
+  }
+
+  :where(.theme-scope)
+    [data-block="testimonials"][data-block-look="testimonials-evergreen-lead"]
+    .rb-testimonials-fe-col {
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+  }
+}
+
+/* Room and response: a tall lead voice with one soft brand response and one
+ * neutral response in the existing stacked support column. */
+:where(.theme-scope)
+  [data-block="testimonials"][data-block-look="testimonials-room-and-response"]
+  .rb-testimonials-fe-card--feature {
+  min-height: 27rem;
+}
+
+:where(.theme-scope)
+  [data-block="testimonials"][data-block-look="testimonials-room-and-response"]
+  .rb-testimonials-fe-col
+  .rb-testimonials-fe-card:first-child {
+  border-color: transparent;
+  background: rgb(var(--tb-primary-100));
+  color: rgb(var(--tb-onPrimary100));
+  --rb-surface-text-color: rgb(var(--tb-onPrimary100));
+  --rb-surface-heading-color: rgb(var(--tb-onPrimary100));
+  --rb-surface-link-color: rgb(var(--tb-onPrimary100));
+  --rb-surface-supporting-color: rgb(var(--tb-onPrimary100));
+}
+
+:where(.theme-scope)
+  [data-block="testimonials"][data-block-look="testimonials-room-and-response"]
+  .rb-testimonials-fe-col
+  .rb-testimonials-fe-card:first-child
+  :is(.rb-testimonials-fe-quote p, .rb-testimonials-fe-name, .rb-testimonials-fe-context) {
+  color: rgb(var(--tb-onPrimary100));
+}
+
+/* Open floor: the section head becomes an editorial rail while proof occupies
+ * a feature-over-supporting field. */
+@container rb-testimonials-fe (min-width: 1024px) {
+  :where(.theme-scope)
+    [data-block="testimonials"][data-block-look="testimonials-open-floor"]
+    .rb-testimonials-fe {
+    display: grid;
+    grid-template-columns: minmax(15rem, 0.72fr) minmax(0, 1.6fr);
+    align-items: start;
+    gap: clamp(2rem, 5vw, 5rem);
+  }
+
+  :where(.theme-scope)
+    [data-block="testimonials"][data-block-look="testimonials-open-floor"]
+    .rb-testimonials-fe-head {
+    display: block;
+  }
+
+  :where(.theme-scope)
+    [data-block="testimonials"][data-block-look="testimonials-open-floor"]
+    .rb-testimonials-fe-leadin {
+    margin-top: 1.5rem;
+  }
+
+  :where(.theme-scope)
+    [data-block="testimonials"][data-block-look="testimonials-open-floor"]
+    .rb-testimonials-fe-grid {
+    grid-template-columns: minmax(0, 1fr);
+  }
+
+  :where(.theme-scope)
+    [data-block="testimonials"][data-block-look="testimonials-open-floor"]
+    .rb-testimonials-fe-col {
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+  }
+}
+
+