@riverbankcms/sdk 0.79.0 → 0.81.0

package/dist/styles/index.css

@@ -1576,40 +1576,51 @@
   }
 
   .rb-container-pad-none {
-    padding: 0;
+    --rb-card-pad: 0rem;
+    padding: calc(var(--rb-card-pad) + var(--rb-opening-content-clearance, 0px)) var(--rb-card-pad) var(--rb-card-pad);
   }
   .rb-container-pad-compact {
-    padding: 1rem;
+    --rb-card-pad: 1rem;
+    padding: calc(var(--rb-card-pad) + var(--rb-opening-content-clearance, 0px)) var(--rb-card-pad) var(--rb-card-pad);
   }
   .rb-container-pad-cozy {
-    padding: 1.5rem;
+    --rb-card-pad: 1.5rem;
+    padding: calc(var(--rb-card-pad) + var(--rb-opening-content-clearance, 0px)) var(--rb-card-pad) var(--rb-card-pad);
   }
   .rb-container-pad-medium {
-    padding: 1.5rem;
+    --rb-card-pad: 1.5rem;
+    padding: calc(var(--rb-card-pad) + var(--rb-opening-content-clearance, 0px)) var(--rb-card-pad) var(--rb-card-pad);
   }
   .rb-container-pad-comfortable {
-    padding: 2rem;
+    --rb-card-pad: 2rem;
+    padding: calc(var(--rb-card-pad) + var(--rb-opening-content-clearance, 0px)) var(--rb-card-pad) var(--rb-card-pad);
   }
   .rb-container-pad-spacious {
-    padding: 2.5rem;
+    --rb-card-pad: 2.5rem;
+    padding: calc(var(--rb-card-pad) + var(--rb-opening-content-clearance, 0px)) var(--rb-card-pad) var(--rb-card-pad);
   }
 
   @media (min-width: 640px) {
     @scope ([data-rb-responsive-mode="viewport"]) to (:scope [data-rb-responsive-mode]) {
       .rb-container-pad-compact {
-        padding: 1.5rem;
+        --rb-card-pad: 1.5rem;
+        padding: calc(var(--rb-card-pad) + var(--rb-opening-content-clearance, 0px)) var(--rb-card-pad) var(--rb-card-pad);
       }
       .rb-container-pad-cozy {
-        padding: 2rem;
+        --rb-card-pad: 2rem;
+        padding: calc(var(--rb-card-pad) + var(--rb-opening-content-clearance, 0px)) var(--rb-card-pad) var(--rb-card-pad);
       }
       .rb-container-pad-medium {
-        padding: 2rem;
+        --rb-card-pad: 2rem;
+        padding: calc(var(--rb-card-pad) + var(--rb-opening-content-clearance, 0px)) var(--rb-card-pad) var(--rb-card-pad);
       }
       .rb-container-pad-comfortable {
-        padding: 2.5rem;
+        --rb-card-pad: 2.5rem;
+        padding: calc(var(--rb-card-pad) + var(--rb-opening-content-clearance, 0px)) var(--rb-card-pad) var(--rb-card-pad);
       }
       .rb-container-pad-spacious {
-        padding: 3.5rem;
+        --rb-card-pad: 3.5rem;
+        padding: calc(var(--rb-card-pad) + var(--rb-opening-content-clearance, 0px)) var(--rb-card-pad) var(--rb-card-pad);
       }
     }
   }
@@ -1782,8 +1793,32 @@
   /* Shared: Site document overlay header clearance                             */
   /* -------------------------------------------------------------------------- */
 
-  :where(.theme-scope) :where([data-site-document-overlay-content='true']) :where([data-block]):first-of-type > :where([data-slot='section']) > :where(.rb-container) {
-    padding-top: calc(var(--site-overlay-header-clearance, 0px) + var(--site-overlay-opening-content-extra-pad, 0px));
+  :where(.theme-scope)
+    :where([data-site-document-overlay-content='true'])
+    :where([data-page-block-position='first'], [data-page-block-position='only'])
+    > :where([data-slot='section'])
+    > .rb-container {
+    --rb-opening-content-clearance: calc(
+      var(--site-overlay-header-clearance, 0px) +
+        var(--site-overlay-opening-content-extra-pad, clamp(1rem, 2vw, 1.75rem))
+    );
+  }
+
+  :where(.theme-scope)
+    :where([data-site-document-overlay-content='true'])
+    :where([data-page-block-position='first'], [data-page-block-position='only'])
+    > :where([data-slot='section'])
+    > .rb-container:not([class*='rb-container-pad-']) {
+    padding-top: var(--rb-opening-content-clearance, 0px);
+  }
+
+  :where(.theme-scope)
+    :where([data-site-document-overlay-content='true'])
+    :where([data-page-block-position='first'], [data-page-block-position='only'])
+    > :where([data-slot='section'])
+    > .rb-container
+    :where([class*='rb-container-pad-']) {
+    --rb-opening-content-clearance: 0px;
   }
 
   /* -------------------------------------------------------------------------- */
@@ -1869,6 +1904,22 @@
     }
   }
 
+  /* -------------------------------------------------------------------------- */
+  /* Header: Mobile floating/glass backing                                      */
+  /* -------------------------------------------------------------------------- */
+
+  :where(.theme-scope) .header-variant-floating .header-mobile-bar {
+    align-items: flex-start;
+    margin-top: 0.75rem;
+  }
+
+  :where(.theme-scope) .header-variant-floating .nav-mobile-toggle {
+    border: 1px solid rgb(var(--tb-border) / 0.82);
+    background: rgb(var(--tb-surface) / 0.96);
+    color: rgb(var(--tb-text));
+    box-shadow: none;
+  }
+
   /*
  * Theme Scope Styles
  *
@@ -2039,7 +2090,7 @@
 
   /* Neutral prose uses theme text color by default */
   :where(.theme-scope) .rb-prose-neutral {
-    color: rgb(var(--tb-text));
+    color: var(--section-text-color, rgb(var(--tb-text)));
   }
 
   :where(.theme-scope) .rb-prose p,
@@ -2072,8 +2123,11 @@
   }
 
   :where(.theme-scope) .rb-prose a {
-    /* Global prose link style with theme-level overrides */
-    color: var(--rb-prose-link-color, rgb(var(--tb-primary)));
+    --rb-prose-effective-link-color: var(
+      --section-link-color,
+      var(--rb-prose-link-color, rgb(var(--tb-primary)))
+    );
+    color: var(--rb-prose-effective-link-color);
     text-decoration-line: var(--rb-prose-link-decoration-line, underline);
     text-decoration-style: var(--rb-prose-link-underline-style, solid);
     text-decoration-thickness: var(
@@ -2082,8 +2136,15 @@
     );
     text-underline-offset: var(--rb-prose-link-underline-offset, 0.14em);
     text-decoration-color: var(
-      --rb-prose-link-decoration-color,
-      rgba(var(--tb-primary), 0.3)
+      --section-link-decoration-color,
+      var(
+        --rb-prose-link-decoration-color,
+        color-mix(
+          in srgb,
+          var(--rb-prose-effective-link-color) 35%,
+          transparent
+        )
+      )
     );
     transition:
       color 150ms ease,
@@ -2093,20 +2154,20 @@
   :where(.theme-scope) .rb-prose a:hover {
     color: var(
       --rb-prose-link-hover-color,
-      var(--rb-prose-link-color, rgb(var(--tb-primary)))
+      var(--rb-prose-effective-link-color)
     );
     text-decoration-color: var(
       --rb-prose-link-hover-decoration-color,
       var(
         --rb-prose-link-hover-color,
-        var(--rb-prose-link-color, rgb(var(--tb-primary)))
+        var(--rb-prose-effective-link-color)
       )
     );
   }
 
   :where(.theme-scope) .rb-prose blockquote {
     /* Blockquotes use muted text color */
-    color: rgb(var(--tb-mutedText));
+    color: var(--section-supporting-color, rgb(var(--tb-mutedText)));
     border-left-color: rgb(var(--tb-border));
   }
 
@@ -2737,6 +2798,13 @@
     transition: padding 300ms var(--motion-ease, ease);
   }
 
+  :where(.theme-scope)
+    .header-variant-classic
+    .rb-header-layout:has(.header-logo-accommodation-popout-badge) {
+    padding-top: 0.5rem;
+    padding-bottom: 0.5rem;
+  }
+
   /* Vertical variants need more breathing room
    Note: header-variant-* is on Section (ancestor), rb-header-layout on inner div */
   :where(.theme-scope) .header-variant-centered .rb-header-layout {
@@ -2797,6 +2865,85 @@
     transition: height 300ms var(--motion-ease, ease);
   }
 
+  :where(.theme-scope) .header-logo-size-compact.rb-header-logo-sm {
+    height: 2rem;
+  }
+  :where(.theme-scope) .header-logo-size-compact.rb-header-logo-lg {
+    height: 2.5rem;
+  }
+  :where(.theme-scope) .header-logo-size-standard.rb-header-logo-sm {
+    height: 2.5rem;
+  }
+  :where(.theme-scope) .header-logo-size-standard.rb-header-logo-lg {
+    height: 3rem;
+  }
+  :where(.theme-scope) .header-logo-size-generous.rb-header-logo-sm {
+    height: 3.5rem;
+  }
+  :where(.theme-scope) .header-logo-size-generous.rb-header-logo-lg {
+    height: 4.5rem;
+  }
+  :where(.theme-scope) .header-logo-size-display.rb-header-logo-sm {
+    height: 7.5rem;
+  }
+  :where(.theme-scope) .header-logo-size-display.rb-header-logo-lg {
+    height: 8rem;
+  }
+
+  :where(.theme-scope) .header-logo-accommodation-plate,
+  :where(.theme-scope) .header-logo-accommodation-centered-badge,
+  :where(.theme-scope) .header-logo-accommodation-popout-badge,
+  :where(.theme-scope) .header-logo-accommodation-centered-masthead {
+    border-radius: var(--radius-md, 0.5rem);
+    background: var(--color-surface, #fff);
+    box-shadow: var(--shadow-sm, 0 1px 2px rgb(0 0 0 / 0.08));
+    padding: 0.5rem;
+    transition:
+      margin 300ms var(--motion-ease, ease),
+      padding 300ms var(--motion-ease, ease);
+  }
+
+  :where(.theme-scope) .header-logo-accommodation-popout-badge {
+    position: relative;
+    z-index: 1;
+    margin-block: 0 -1.25rem;
+  }
+
+  :where(.theme-scope)
+    .header-logo-size-display.header-logo-accommodation-popout-badge {
+    margin-block: 0 -4rem;
+  }
+
+  :where(.theme-scope)
+    .rb-header-shrink.header-scrolled.header-variant-classic
+    .header-logo-size-display.header-logo-accommodation-plate,
+  :where(.theme-scope)
+    .rb-header-shrink.header-scrolled.header-variant-classic
+    .header-logo-size-display.header-logo-accommodation-popout-badge,
+  :where(.theme-scope)
+    .rb-header-shrink.header-scrolled.header-variant-classic
+    .header-logo-size-display.header-logo-accommodation-centered-masthead,
+  :where(.theme-scope)
+    .rb-header-shrink.header-scrolled.header-variant-centered
+    .header-logo-size-display.header-logo-accommodation-centered-badge,
+  :where(.theme-scope)
+    .rb-header-shrink.header-scrolled.header-variant-centered
+    .header-logo-size-display.header-logo-accommodation-centered-masthead {
+    position: relative;
+    z-index: 1;
+    margin-block: 0 -2.75rem;
+  }
+
+  :where(.theme-scope)
+    .rb-header-shrink.header-scrolled.header-variant-centered
+    .rb-header-layout {
+    gap: 0.75rem;
+  }
+
+  :where(.theme-scope) .header-logo-accommodation-centered-masthead {
+    padding: 0.75rem 1rem;
+  }
+
   /* Site title base font size (replaces rb-text-lg / rb-text-xl utilities) */
   :where(.theme-scope) .header-logo-text {
     font-size: 1.125rem; /* matches rb-text-lg */
@@ -2833,11 +2980,72 @@
   :where(.theme-scope) .rb-header-shrink.header-scrolled .rb-header-logo-lg {
     height: 2.5rem;
   }
+  :where(.theme-scope)
+    .rb-header-shrink.header-scrolled
+    .header-logo-size-generous.rb-header-logo-sm {
+    height: 2.75rem;
+  }
+  :where(.theme-scope)
+    .rb-header-shrink.header-scrolled
+    .header-logo-size-generous.rb-header-logo-lg {
+    height: 3.25rem;
+  }
+  :where(.theme-scope)
+    .rb-header-shrink.header-scrolled
+    .header-logo-size-display.rb-header-logo-sm,
+  :where(.theme-scope)
+    .rb-header-shrink.header-scrolled
+    .header-logo-size-display.rb-header-logo-lg {
+    height: 3.75rem;
+  }
   :where(.theme-scope) .rb-header-shrink.header-scrolled .header-logo-text {
     font-size: 0.875rem;
   }
 
   @media (max-width: 767px) {
+    :where(.theme-scope) .header-logo-size-generous.rb-header-logo-sm,
+    :where(.theme-scope) .header-logo-size-generous.rb-header-logo-lg {
+      height: 3rem;
+    }
+
+    :where(.theme-scope) .header-logo-size-display.rb-header-logo-sm,
+    :where(.theme-scope) .header-logo-size-display.rb-header-logo-lg {
+      height: 5.5rem;
+    }
+
+    :where(.theme-scope)
+      .rb-header-shrink.header-scrolled
+      .header-logo-size-display.rb-header-logo-sm,
+    :where(.theme-scope)
+      .rb-header-shrink.header-scrolled
+      .header-logo-size-display.rb-header-logo-lg {
+      height: 3.5rem;
+    }
+
+    :where(.theme-scope) .header-logo-accommodation-popout-badge {
+      margin-block: 0;
+    }
+
+    :where(.theme-scope)
+      .rb-header-shrink.header-scrolled
+      .header-logo-size-display.header-logo-accommodation-plate,
+    :where(.theme-scope)
+      .rb-header-shrink.header-scrolled
+      .header-logo-size-display.header-logo-accommodation-popout-badge,
+    :where(.theme-scope)
+      .rb-header-shrink.header-scrolled
+      .header-logo-size-display.header-logo-accommodation-centered-masthead,
+    :where(.theme-scope)
+      .rb-header-shrink.header-scrolled
+      .header-logo-size-display.header-logo-accommodation-centered-badge,
+    :where(.theme-scope)
+      .rb-header-shrink.header-scrolled
+      .header-logo-size-display.header-logo-accommodation-centered-masthead {
+      position: relative;
+      z-index: 1;
+      margin-block: 0 -2.75rem;
+    }
+
     :where(.theme-scope) .rb-header-shrink.header-scrolled .header-logo-text {
       font-size: 0.75rem;
     }
@@ -6095,7 +6303,7 @@
 /* Subheadline - supporting text below headline */
 :where(.theme-scope) :where([data-block="hero"]) .hero-subheadline {
   font-size: 1.125rem;
-  color: var(--section-text-color, rgb(var(--tb-text)));
+  color: var(--section-supporting-color, var(--section-text-color, rgb(var(--tb-text))));
 }
 
 @media (min-width: 640px) {
@@ -6184,7 +6392,7 @@
 
 /* CTA content/body text */
 :where(.theme-scope) :where([data-block="cta-full"]) .cta-content {
-  color: rgb(var(--tb-mutedText));
+  color: var(--section-supporting-color, rgb(var(--tb-mutedText)));
 }
 
 /* CTA button row container */
@@ -6286,7 +6494,7 @@
 /* Form intro text */
 :where(.theme-scope) :where([data-block="form"]) .form-copy-intro {
   font-size: 1rem;
-  color: rgb(var(--tb-text));
+  color: var(--section-text-color, rgb(var(--tb-text)));
 }
 
 /* =============================================================================
@@ -7611,11 +7819,13 @@
 }
 
 :where(.theme-scope) :where([data-block="testimonials"]) .rb-testimonial-quote {
+  display: var(--rb-testimonial-quote-display, block);
+  font-family: var(--rb-testimonial-quote-font, inherit);
   font-size: var(--rb-testimonial-quote-size);
   line-height: 1;
-  font-weight: 700;
+  font-weight: var(--rb-testimonial-quote-weight, 700);
   opacity: var(--rb-testimonial-quote-opacity);
-  color: rgb(var(--tb-primary));
+  color: var(--rb-testimonial-quote-color, rgb(var(--tb-primary)));
 }
 
 :where(.theme-scope) :where([data-block="testimonials"]) .rb-card-treatment-accent-quote .rb-testimonial-quote {
@@ -7624,6 +7834,59 @@
   opacity: 1;
 }
 
+/* Open editorial testimonial card: boxless, with a hairline rule before the
+ * attribution, an accent ring on the avatar, and comfortable prose. The quote
+ * mark itself is owned by the site-style quote treatment (see the
+ * --rb-testimonial-quote-* vars), not by these rules.
+ *
+ * `editorial-open` is the current non-carded look; `editorial-serif-quote` is
+ * retained for content saved before the decomposition. */
+:where(.theme-scope) :where([data-block="testimonials"]) .rb-testimonial-card.rb-card-treatment-editorial-open,
+:where(.theme-scope) :where([data-block="testimonials"]) .rb-testimonial-card.rb-card-treatment-editorial-serif-quote {
+  background: transparent;
+  border: 0;
+  border-radius: 0;
+  padding: 0.25rem clamp(0.5rem, 1.5vw, 1.5rem);
+}
+
+/* styledCard always renders an inner white rb-bg-surface fill layer; a boxless
+ * card must clear it so the section band shows through (otherwise: white box). */
+:where(.theme-scope) :where([data-block="testimonials"]) .rb-card-treatment-editorial-open > .rb-bg-surface,
+:where(.theme-scope) :where([data-block="testimonials"]) .rb-card-treatment-editorial-serif-quote > .rb-bg-surface {
+  background: transparent;
+}
+
+:where(.theme-scope) :where([data-block="testimonials"]) .rb-card-treatment-editorial-open .rb-prose,
+:where(.theme-scope) :where([data-block="testimonials"]) .rb-card-treatment-editorial-serif-quote .rb-prose {
+  font-size: 1.0625rem;
+  line-height: 1.7;
+}
+
+:where(.theme-scope) :where([data-block="testimonials"]) .rb-card-treatment-editorial-open .rb-testimonial-attribution,
+:where(.theme-scope) :where([data-block="testimonials"]) .rb-card-treatment-editorial-serif-quote .rb-testimonial-attribution {
+  margin-top: 1.25rem;
+  padding-top: 1.25rem;
+  border-top: 1px solid rgba(var(--tb-border), 0.75);
+}
+
+:where(.theme-scope) :where([data-block="testimonials"]) .rb-card-treatment-editorial-open .rb-testimonial-avatar,
+:where(.theme-scope) :where([data-block="testimonials"]) .rb-card-treatment-editorial-serif-quote .rb-testimonial-avatar {
+  box-shadow:
+    0 0 0 2px rgb(var(--tb-surface)),
+    0 0 0 4px rgba(var(--tb-primary), 0.3);
+}
+
+
+/* Split grid: title column + cards. On desktop the title takes one quarter and
+ * the cards fill the remaining three quarters (so title + 3 cards each read as
+ * a quarter). Stacks on mobile. */
+@media (min-width: 1024px) {
+  :where(.theme-scope) :where([data-block="testimonials"]) .rb-testimonials-split-grid {
+    grid-template-columns: minmax(0, 1fr) minmax(0, 3fr);
+    align-items: start;
+  }
+}
+
 
 /* Testimonials carousel tweaks: arrow styling + gutters + equal-height cards */
 :where(.theme-scope) :where([data-block="testimonials"]) .rb-testimonials-carousel.carousel-root .carousel-nav-btn {
@@ -8771,7 +9034,7 @@
 
 :where(.theme-scope) :where([data-block="newsletter-signup"]) .newsletter-copy-subtitle {
   font-size: 1rem;
-  color: rgb(var(--tb-text));
+  color: var(--section-text-color, rgb(var(--tb-text)));
   opacity: 0.85;
 }
 
@@ -8819,7 +9082,7 @@
 :where(.theme-scope) .newsletter-privacy-note {
   margin-top: 0.75rem;
   font-size: 0.75rem;
-  color: rgb(var(--tb-muted-text));
+  color: var(--section-supporting-color, rgb(var(--tb-mutedText)));
   text-align: center;
 }
 
@@ -9083,10 +9346,16 @@
     rgb(var(--tb-border, 229 231 235)),
     rgb(var(--tb-text, 17 24 39)) 4%
   );
+  --event-compact-secondary-text: color-mix(
+    in oklab,
+    rgb(var(--tb-text, 17 24 39)),
+    rgb(var(--tb-background, 255 255 255)) 28%
+  );
 
   width: min(100%, 92rem);
   margin-inline: auto;
   overflow: hidden;
+  container: event-compact-list / inline-size;
   border: 1px solid var(--event-compact-divider-color);
   border-radius: 1rem;
   background: rgb(var(--tb-background, 255 255 255));
@@ -9103,10 +9372,10 @@
 
 :where(.theme-scope) .event-compact-row {
   display: grid;
-  grid-template-columns: clamp(5.5rem, 8vw, 8rem) minmax(0, 1fr) clamp(15rem, 24vw, 21rem);
+  grid-template-columns: clamp(4.5rem, 6vw, 6.25rem) minmax(0, 1fr);
   align-items: center;
-  min-height: 8.75rem;
-  padding: 1.55rem clamp(1.5rem, 3vw, 2.6rem);
+  min-height: 6rem;
+  padding: 1rem clamp(1.25rem, 2.6vw, 2.25rem);
   border-bottom: 1px solid var(--event-compact-divider-color);
   transition: background-color 150ms ease;
 }
@@ -9123,13 +9392,21 @@
   display: grid;
   grid-template-rows: 1rem minmax(2.7rem, auto) 1rem;
   place-items: center;
-  gap: 0.35rem;
+  gap: 0;
   min-width: 0;
-  padding-right: clamp(1rem, 2vw, 1.75rem);
+  padding-right: clamp(0.8rem, 1.6vw, 1.35rem);
   text-align: center;
   text-decoration: none;
 }
 
+:where(.theme-scope) .event-compact-row-body {
+  min-width: 0;
+  display: flex;
+  align-items: center;
+  height: 100%;
+  border-left: 1px solid var(--event-compact-divider-color);
+}
+
 :where(.theme-scope) .event-compact-row-date-weekday,
 :where(.theme-scope) .event-compact-row-date-month {
   display: grid;
@@ -9145,10 +9422,10 @@
 :where(.theme-scope) .event-compact-row-date-day {
   display: grid;
   place-items: center;
-  min-block-size: clamp(2.7rem, 4.5vw, 3.7rem);
+  min-block-size: clamp(2rem, 3vw, 2.6rem);
   color: rgb(var(--tb-text, 17 24 39));
   font-family: var(--font-heading, var(--font-body, inherit));
-  font-size: clamp(2.3rem, 4.2vw, 3.35rem);
+  font-size: clamp(1.7rem, 1.35rem + 1.1vw, 2.35rem);
   font-weight: 400;
   line-height: 1;
 }
@@ -9156,21 +9433,21 @@
 :where(.theme-scope) .event-compact-row-content {
   min-width: 0;
   display: flex;
+  flex: 1 1 18rem;
   flex-direction: column;
-  gap: 1rem;
+  gap: 0.625rem;
   height: 100%;
   justify-content: center;
-  padding-inline: clamp(1.4rem, 3vw, 3.2rem);
-  border-left: 1px solid var(--event-compact-divider-color);
+  padding-inline: clamp(1rem, 2.4vw, 2.4rem);
 }
 
 :where(.theme-scope) .event-compact-row-title {
   margin: 0;
   color: rgb(var(--tb-text, 17 24 39));
   font-family: var(--font-heading, var(--font-body, inherit));
-  font-size: clamp(1.55rem, 2.6vw, 2.4rem);
+  font-size: clamp(1.05rem, 1rem + 0.35vw, 1.3rem);
   font-weight: 400;
-  line-height: 1.05;
+  line-height: 1.2;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
@@ -9181,8 +9458,8 @@
   align-items: center;
   gap: 0.9rem;
   min-width: 0;
-  color: rgb(var(--tb-text, 17 24 39));
-  font-size: clamp(0.9375rem, 1.4vw, 1.0625rem);
+  color: var(--event-compact-secondary-text);
+  font-size: 0.875rem;
   line-height: 1.35;
 }
 
@@ -9215,16 +9492,17 @@
 }
 
 :where(.theme-scope) .event-compact-row-price {
-  color: rgb(var(--tb-secondary, var(--tb-primary, 0 0 0)));
-  font-weight: 600;
+  color: inherit;
+  font-weight: inherit;
 }
 
 :where(.theme-scope) .event-compact-row-action {
   display: grid;
+  flex: 0 1 clamp(14rem, 22vw, 19rem);
   align-content: center;
-  gap: 1rem;
+  gap: 0.75rem;
   height: 100%;
-  padding-left: clamp(1.5rem, 3vw, 3.2rem);
+  padding-left: clamp(1.1rem, 2.4vw, 2.4rem);
   border-left: 1px solid var(--event-compact-divider-color);
 }
 
@@ -9232,8 +9510,8 @@
   display: inline-flex;
   align-items: center;
   gap: 0.65rem;
-  color: rgb(var(--tb-text, 17 24 39));
-  font-size: clamp(0.9375rem, 1.45vw, 1.0625rem);
+  color: var(--event-compact-secondary-text);
+  font-size: 0.875rem;
   line-height: 1.3;
   white-space: nowrap;
 }
@@ -9244,6 +9522,10 @@
   flex-shrink: 0;
 }
 
+:where(.theme-scope) .event-compact-row-action-price {
+  display: none;
+}
+
 :where(.theme-scope) .event-compact-row-status {
   color: rgb(var(--tb-muted, var(--tb-text, 17 24 39)));
   font-weight: 500;
@@ -9271,52 +9553,213 @@
   }
 
   :where(.theme-scope) .event-compact-row {
-    grid-template-columns: 4.75rem minmax(0, 1fr);
+    grid-template-columns: 4.25rem minmax(0, 1fr);
     min-height: 0;
-    padding: 1.25rem;
-    row-gap: 1.1rem;
+    padding: 1rem;
+    row-gap: 0.85rem;
   }
 
   :where(.theme-scope) .event-compact-row-date {
-    padding-right: 0.9rem;
+    align-self: start;
+    grid-row: 1;
+    padding-right: 0.75rem;
+  }
+
+  :where(.theme-scope) .event-compact-row-body {
+    flex-direction: column;
+    align-items: stretch;
+    gap: 0.85rem;
+    height: auto;
+    padding-left: 0.9rem;
   }
 
   :where(.theme-scope) .event-compact-row-date-day {
-    font-size: 2.35rem;
+    font-size: 1.65rem;
   }
 
   :where(.theme-scope) .event-compact-row-content {
-    gap: 0.75rem;
-    padding-left: 1.1rem;
-    padding-right: 0;
+    flex: none;
+    gap: 0.625rem;
+    height: auto;
+    padding-inline: 0;
   }
 
   :where(.theme-scope) .event-compact-row-title {
-    font-size: clamp(1.35rem, 8vw, 1.9rem);
+    font-size: 1.15rem;
+    overflow: visible;
+    text-overflow: clip;
     white-space: normal;
+    overflow-wrap: break-word;
+  }
+
+  :where(.theme-scope) .event-compact-row-venue {
+    max-width: 100%;
+  }
+
+  :where(.theme-scope) .event-compact-row-venue svg {
+    flex-shrink: 0;
   }
 
   :where(.theme-scope) .event-compact-row-meta {
+    flex-direction: column;
+    align-items: flex-start;
     flex-wrap: wrap;
-    gap: 0.5rem 0.8rem;
+    gap: 0.35rem;
+  }
+
+  :where(.theme-scope) .event-compact-row-meta .event-compact-row-price {
+    display: none;
+  }
+
+  :where(.theme-scope) .event-compact-row-teacher::before,
+  :where(.theme-scope) .event-compact-row-price::before {
+    content: none;
   }
 
   :where(.theme-scope) .event-compact-row-action {
-    grid-column: 1 / -1;
+    flex: none;
     grid-template-columns: minmax(0, 1fr);
-    gap: 0.85rem;
+    gap: 0.7rem;
+    height: auto;
+    width: 100%;
     padding-left: 0;
-    padding-top: 1rem;
-    border-left: none;
-    border-top: 1px solid var(--event-compact-divider-color);
+    padding-top: 0;
+    border-left: 0;
+    border-top: 0;
   }
 
   :where(.theme-scope) .event-compact-row-datetime {
+    display: flex;
+    flex-wrap: wrap;
     white-space: normal;
   }
 
+  :where(.theme-scope) .event-compact-row-action-price {
+    display: inline-flex;
+    align-items: center;
+    gap: 0.55rem;
+  }
+
+  :where(.theme-scope) .event-compact-row-action-price::before {
+    content: "\00b7";
+  }
+
   :where(.theme-scope) .event-compact-row-cta {
+    width: min(100%, 12rem);
+    min-height: 2.65rem;
+    justify-content: space-between;
+    gap: 0.65rem;
+    padding-inline: 1rem;
+  }
+
+  :where(.theme-scope) .event-compact-row-cta span {
+    min-width: 0;
+  }
+}
+
+@container event-compact-list (max-width: 48rem) {
+  :where(.theme-scope) .event-compact-row {
+    grid-template-columns: 4.25rem minmax(0, 1fr);
+    min-height: 0;
+    padding: 1rem;
+    row-gap: 0.85rem;
+  }
+
+  :where(.theme-scope) .event-compact-row-date {
+    align-self: start;
+    grid-row: 1;
+    padding-right: 0.75rem;
+  }
+
+  :where(.theme-scope) .event-compact-row-body {
+    flex-direction: column;
+    align-items: stretch;
+    gap: 0.85rem;
+    height: auto;
+    padding-left: 0.9rem;
+  }
+
+  :where(.theme-scope) .event-compact-row-date-day {
+    font-size: 1.65rem;
+  }
+
+  :where(.theme-scope) .event-compact-row-content {
+    flex: none;
+    gap: 0.625rem;
+    height: auto;
+    padding-inline: 0;
+  }
+
+  :where(.theme-scope) .event-compact-row-title {
+    font-size: 1.15rem;
+    overflow: visible;
+    text-overflow: clip;
+    white-space: normal;
+    overflow-wrap: break-word;
+  }
+
+  :where(.theme-scope) .event-compact-row-venue {
+    max-width: 100%;
+  }
+
+  :where(.theme-scope) .event-compact-row-venue svg {
+    flex-shrink: 0;
+  }
+
+  :where(.theme-scope) .event-compact-row-meta {
+    flex-direction: column;
+    align-items: flex-start;
+    flex-wrap: wrap;
+    gap: 0.35rem;
+  }
+
+  :where(.theme-scope) .event-compact-row-meta .event-compact-row-price {
+    display: none;
+  }
+
+  :where(.theme-scope) .event-compact-row-teacher::before,
+  :where(.theme-scope) .event-compact-row-price::before {
+    content: none;
+  }
+
+  :where(.theme-scope) .event-compact-row-action {
+    flex: none;
+    grid-template-columns: minmax(0, 1fr);
+    gap: 0.7rem;
+    height: auto;
     width: 100%;
+    padding-left: 0;
+    padding-top: 0;
+    border-left: 0;
+    border-top: 0;
+  }
+
+  :where(.theme-scope) .event-compact-row-datetime {
+    display: flex;
+    flex-wrap: wrap;
+    white-space: normal;
+  }
+
+  :where(.theme-scope) .event-compact-row-action-price {
+    display: inline-flex;
+    align-items: center;
+    gap: 0.55rem;
+  }
+
+  :where(.theme-scope) .event-compact-row-action-price::before {
+    content: "\00b7";
+  }
+
+  :where(.theme-scope) .event-compact-row-cta {
+    width: min(100%, 12rem);
+    min-height: 2.65rem;
+    justify-content: space-between;
+    gap: 0.65rem;
+    padding-inline: 1rem;
+  }
+
+  :where(.theme-scope) .event-compact-row-cta span {
+    min-width: 0;
   }
 }
 
@@ -9375,19 +9818,31 @@
  * =============================================================================
  */
 
-:where(.theme-scope) .rb-heading-decoration {
-  display: block;
-  flex: 0 0 auto;
-  pointer-events: none;
+/*
+ * The mark sits inside a full-width block row so it inherits the heading group's
+ * `text-align`: a centred heading centres the mark, a left-aligned heading keeps
+ * it at the start. The heading stacks are flexbox, where `text-align` positions
+ * inline content but not flex items — so the row (a stretched block flex item)
+ * is what carries the alignment, and the inline-block mark follows it. Alignment
+ * is never configured directly; it follows the heading.
+ */
+:where(.theme-scope) .rb-heading-decoration-group {
+  display: flex;
+  flex-direction: column;
+  gap: 0;
 }
 
-:where(.theme-scope) .rb-heading-decoration-placement-after-heading {
+:where(.theme-scope) .rb-heading-decoration-row {
+  display: block;
+  width: 100%;
   margin-top: 0.35rem;
+  line-height: 0;
+  pointer-events: none;
 }
 
-:where(.theme-scope) .rb-heading-decoration-placement-under-centered-heading {
-  margin-left: auto;
-  margin-right: auto;
+:where(.theme-scope) .rb-heading-decoration {
+  display: inline-block;
+  vertical-align: top;
 }
 
 :where(.theme-scope) .rb-heading-decoration-organic-squiggle {
@@ -9486,4 +9941,225 @@
   height: 1.5rem;
 }
 
+/* --- Card marker mode (icons / numbers / none) -----------------------------
+ *
+ * The icon zone and the number zone both sit in the DOM; the grid's
+ * `data-card-marker` attribute decides which shows. The default (legacy
+ * content with no attribute) shows icons and hides the number zone.
+ */
+:where(.theme-scope) .rb-feature-card-number-zone {
+  display: none; /* shown only in numbers mode */
+  align-items: center;
+  justify-content: center;
+  flex: 0 0 auto;
+  width: 2.5rem;
+  height: 2.5rem;
+  margin-bottom: 0.125rem;
+  border-radius: var(--rb-block-radius, 0.75rem);
+  background-color: rgb(var(--tb-primary) / 10%);
+  color: rgb(var(--tb-primary));
+  counter-increment: rb-feature-card-number;
+}
+:where(.theme-scope) .rb-feature-card-number-zone::before {
+  content: counter(rb-feature-card-number, decimal-leading-zero);
+  font-weight: 700;
+  font-size: 0.95rem;
+  line-height: 1;
+}
+
+:where(.theme-scope) .rb-feature-cards-grid {
+  counter-reset: rb-feature-card-number;
+}
+
+:where(.theme-scope) [data-card-marker="numbers"] .rb-feature-card-number-zone {
+  display: inline-flex;
+}
+:where(.theme-scope) [data-card-marker="numbers"] .rb-feature-card-icon-zone {
+  display: none;
+}
+:where(.theme-scope) [data-card-marker="none"] .rb-feature-card-icon-zone,
+:where(.theme-scope) [data-card-marker="none"] .rb-feature-card-number-zone {
+  display: none;
+}
+
+
+/* =============================================================================
+ * Shared: Card treatments
+ *
+ * Visual treatments referenced from `_cardStyles.treatment` (see
+ * cardStylesOverrideSchema). Class names are emitted by the boxStyles
+ * transform in @riverbankcms/blocks.
+ *
+ * Also contains feature-card media/padding behaviour shared by all looks:
+ * - card images bleed to the card edges (flush photo tops)
+ * - card-level padding replaces the content stack's fallback padding so the
+ *   two never stack up
+ * ============================================================================= */
+
+/* --- Feature card media + padding behaviour (all looks) -------------------- */
+
+/*
+ * When a look gives the card real padding (rb-container-pad-*), the image
+ * 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 {
+  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 {
+  margin-top: 1.4rem;
+}
+
+:where(.theme-scope) .rb-feature-card[class*="rb-container-pad-"]:not(.rb-container-pad-none) > .rb-feature-card-content {
+  padding: 0;
+}
+
+/* --- Soft panel ------------------------------------------------------------ */
+
+:where(.theme-scope) .rb-card-treatment-soft-panel {
+  transition: transform 250ms ease, box-shadow 250ms ease;
+}
+
+@media (prefers-reduced-motion: no-preference) {
+  :where(.theme-scope) .rb-card-treatment-soft-panel:hover {
+    transform: translateY(-3px);
+    box-shadow: 0 0.875rem 1.875rem rgba(var(--tb-shadow, 0 0 0), 0.1);
+  }
+}
+
+:where(.theme-scope) .rb-card-treatment-soft-panel .cta-row .button-ghost {
+  padding-inline: 0;
+}
+
+/* --- Editorial rule --------------------------------------------------------- */
+
+/*
+ * Boxless open column: no background, no border box, a short brand rule
+ * sitting on a full-width hairline at the top of the column.
+ */
+:where(.theme-scope) .rb-card-treatment-editorial-rule {
+  margin-top: 1rem;
+  border-top: 1px solid
+    color-mix(in oklab, rgb(var(--tb-border, 229 231 235)), transparent 25%);
+}
+
+:where(.theme-scope) .rb-card-treatment-editorial-rule > .rb-bg-surface {
+  background: transparent;
+}
+
+:where(.theme-scope) .rb-card-treatment-editorial-rule::before {
+  content: "";
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 2.75rem;
+  height: 2px;
+  background: rgb(var(--tb-primary, 0 0 0));
+}
+
+:where(.theme-scope) .rb-card-treatment-editorial-rule > .rb-feature-card-media {
+  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-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) {
+  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) {
+  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) {
+  color: rgb(var(--tb-onPrimary));
+}
+
+/* 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;
+}
+
+/* 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 {
+  color: inherit;
+  background-color: color-mix(in oklab, currentColor, transparent 88%);
+}
+
+/* Staggered offset: drop the middle column on wider screens. Scoped to a 3-up
+ * grid (`.rb-grid-cols-3`) so 2-/4-column grids don't get a misaligned stagger;
+ * the colour cycle still reads as a diagonal at any column count. */
+@media (min-width: 768px) {
+  :where(.theme-scope) .rb-grid-cols-3 .rb-card-treatment-color-blocked:nth-child(3n + 2) {
+    margin-top: 2.75rem;
+    /* Override the card's `h-full` so the grid's stretch shrinks the card by the
+     * margin (a genuinely shorter card) instead of keeping full height and
+     * overflowing the section, which clips the rounded bottom corners. */
+    height: auto;
+  }
+}
+
+
+:where(.theme-scope) [data-block="intro"][data-block-look="intro-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 {
+  aspect-ratio: 1 / 1 !important;
+  border-radius: 9999px;
+}
+
+:where(.theme-scope) [data-block="intro"][data-block-look="intro-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 {
+  gap: var(--rb-space-5, 1.25rem);
+}
+
+:where(.theme-scope) [data-block="intro"][data-block-look="intro-editorial-statement"] .rb-intro-copy .rb-prose {
+  font-size: clamp(1.125rem, 1.02rem + 0.35vw, 1.375rem);
+  line-height: 1.65;
+}
+