Let completed-rule titles scroll away on small screens.

The heading still stays in the left column on desktop; on mobile it
moves with the document instead of pinning to the top of the viewport.

Co-authored-by: Cursor <cursoragent@cursor.com>

app/(marketing-case-study)/use-cases/[slug]/rule/_components/UseCaseCompletedRule.view.tsx

@@ -34,7 +34,7 @@ export function UseCaseCompletedRuleView({
   return (
     <>
       {/*
-        Mobile: grid scrolls (title sticky at top of scrollport).
+        Mobile: grid scrolls (title and rule together).
         Desktop: viewport-tall columns; rule scrolls in the right column only.
       */}
       <div
@@ -84,7 +84,7 @@ export function UseCaseCompletedRuleView({
           className={`mx-auto grid w-full min-h-0 flex-1 grid-cols-1 gap-4 px-5 max-md:max-w-[639px] max-md:gap-6 max-md:overflow-y-auto max-md:overscroll-y-contain max-md:pt-[var(--space-800)] max-md:pb-8 md:h-full md:flex-1 md:grid-cols-2 md:grid-rows-1 md:items-start md:justify-items-center md:gap-[var(--measures-spacing-1200,48px)] md:overflow-hidden md:px-12 md:py-0 ${CREATE_FLOW_TWO_COLUMN_MAX_WIDTH_CLASS}`}
         >
           <div
-            className={`relative z-[1] flex flex-col justify-start max-md:sticky max-md:top-0 max-md:z-10 max-md:shrink-0 max-md:pb-4 md:sticky md:top-0 md:z-[1] md:flex md:h-[calc(100dvh-4rem)] md:max-h-[calc(100dvh-4rem)] md:flex-col md:justify-center md:self-start md:overflow-hidden md:pb-8 ${CREATE_FLOW_MD_UP_GRID_CELL_CLASS}`}
+            className={`relative z-[1] flex flex-col justify-start max-md:shrink-0 max-md:pb-4 md:sticky md:top-0 md:z-[1] md:flex md:h-[calc(100dvh-4rem)] md:max-h-[calc(100dvh-4rem)] md:flex-col md:justify-center md:self-start md:overflow-hidden md:pb-8 ${CREATE_FLOW_MD_UP_GRID_CELL_CLASS}`}
             style={{ background: pageBg }}
           >
             <CreateFlowHeaderLockup