diff --git a/docs/catalog/blocks/mk-clone-wall-transition.mdx b/docs/catalog/blocks/mk-clone-wall-transition.mdx
new file mode 100644
index 000000000..170069210
--- /dev/null
+++ b/docs/catalog/blocks/mk-clone-wall-transition.mdx
@@ -0,0 +1,44 @@
+---
+title: "Text Clone Wall Transition"
+description: "Overlay transition: a tiled word wall covers the frame, inverts via difference blending, and clears — hard-cut the content beneath while covered"
+---
+
+# Text Clone Wall Transition
+
+Overlay transition: a tiled word wall covers the frame, inverts via difference blending, and clears — hard-cut the content beneath while covered
+
+`transition` `typography` `wipe`
+
+<video className="w-full aspect-video rounded-xl object-cover bg-zinc-100 dark:bg-zinc-800" src="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/mk-clone-wall-transition.mp4" poster="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/mk-clone-wall-transition.png" autoPlay muted loop playsInline />
+
+## Install
+
+<CodeGroup>
+
+```bash Terminal
+npx hyperframes add mk-clone-wall-transition
+```
+
+</CodeGroup>
+
+## Details
+
+| Property | Value |
+| --- | --- |
+| Type | Block |
+| Dimensions | 1920×1080 |
+| Duration | 2.4s |
+
+## Files
+
+| File | Target | Type |
+| --- | --- | --- |
+| `mk-clone-wall-transition.html` | `compositions/mk-clone-wall-transition.html` | hyperframes:composition |
+
+## Usage
+
+After installing, add the block to your host composition:
+
+```html
+<div data-composition-id="mk-clone-wall-transition" data-composition-src="compositions/mk-clone-wall-transition.html" data-start="0" data-duration="2.4" data-track-index="1" data-width="1920" data-height="1080"></div>
+```
diff --git a/registry/blocks/mk-clone-wall-transition/mk-clone-wall-transition.html b/registry/blocks/mk-clone-wall-transition/mk-clone-wall-transition.html
new file mode 100644
index 000000000..7b088e812
--- /dev/null
+++ b/registry/blocks/mk-clone-wall-transition/mk-clone-wall-transition.html
@@ -0,0 +1,217 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <script src="https://cdn.jsdelivr.net/npm/gsap@3.14.2/dist/gsap.min.js"></script>
+    <style>
+      *,
+      *::before,
+      *::after {
+        margin: 0;
+        padding: 0;
+        box-sizing: border-box;
+      }
+      body {
+        background: transparent;
+        overflow: hidden;
+      }
+      #mk-cw-root {
+        /* ---- mk tokens: override in the host to re-skin the family ---- */
+        --mk-font: "Inter", -apple-system, sans-serif;
+        --mk-ink: #1d1d1f;
+        --mk-paper: #ffffff;
+        --mk-blob-1: #ff7ac8;
+        --mk-blob-2: #45d6c8;
+        --mk-radius-card: 40px;
+        --mk-shadow: 0 30px 80px rgba(0, 0, 0, 0.22);
+
+        position: relative;
+        width: 1920px;
+        height: 1080px;
+        overflow: hidden;
+        background: transparent;
+      }
+      /* the wall: paper sheet + tiled word rows + inversion layer, exits as one */
+      #mk-cw-wall {
+        position: absolute;
+        inset: 0;
+        background: var(--mk-paper);
+        /* no overflow:hidden — the composition root clips; isolation keeps the
+           difference blend scoped to the wall's own tiles */
+        isolation: isolate;
+      }
+      .mk-cw-row {
+        position: absolute;
+        white-space: nowrap;
+        font-family: var(--mk-font);
+        font-weight: 600;
+        letter-spacing: -0.02em;
+        color: var(--mk-ink);
+        line-height: 1;
+      }
+      .mk-cw-tile {
+        display: inline-block;
+      }
+      /* inversion sweep — a paper-colored rect in difference blend:
+         a paper-colored rect XORs the wall, flipping paper<->ink as it arrives */
+      #mk-cw-invert {
+        position: absolute;
+        inset: 0;
+        background: var(--mk-paper);
+        mix-blend-mode: difference;
+      }
+      /* the outgoing frame shrinking to a rounded card mid-transition */
+      #mk-cw-card {
+        position: absolute;
+        top: 0;
+        left: 0;
+        width: 1920px;
+        height: 1080px;
+        border-radius: 0;
+        overflow: hidden;
+        background: linear-gradient(120deg, #fdfbfd 0%, var(--mk-blob-1) 38%, var(--mk-blob-2) 100%);
+        box-shadow: var(--mk-shadow);
+        transform-origin: 50% 50%;
+      }
+      #mk-cw-card img {
+        position: absolute;
+        inset: 0;
+        width: 100%;
+        height: 100%;
+        object-fit: cover;
+      }
+    </style>
+  </head>
+  <body>
+    <div
+      id="mk-cw-root"
+      data-composition-id="mk-clone-wall-transition"
+      data-start="0"
+      data-duration="2.4"
+      data-width="1920"
+      data-height="1080"
+    >
+      <div id="mk-cw-wall" data-layout-allow-overflow>
+        <div id="mk-cw-tiles" data-layout-allow-overflow></div>
+        <div id="mk-cw-invert" data-layout-allow-overflow></div>
+      </div>
+      <div id="mk-cw-card" data-layout-allow-overflow></div>
+      <div
+        id="mk-cw-drv"
+        class="clip"
+        data-start="0"
+        data-duration="2.4"
+        data-track-index="0"
+        style="position:absolute;width:1px;height:1px;opacity:0;pointer-events:none"
+      ></div>
+    </div>
+    <script>
+      (function () {
+        window.__timelines = window.__timelines || {};
+
+        /* ---- published parameters (inspector-style CONFIG) ----
+           Overlay-transition model: place this block spanning the host's cut
+           point (e.g. start 0.9s before the cut). The wall fully covers the
+           frame from ~0.6s to ~1.9s local — hard-cut the content beneath
+           anywhere in that window. */
+        var CONFIG = {
+          // no scheme param — scheme-agnostic; re-skin via the --mk-* tokens
+          word: "HyperFrames", // the cloned word
+          fontSize: 240, // px — the tiled text size
+          spreadX: 90, // px gap between tiles (tile spread X)
+          spreadY: 60, // px gap between rows (Spread Y)
+          brickOffset: true, // alternate rows offset by half a tile
+          card: {
+            enabled: true, // outgoing-frame card. In real use set src to a
+            src: null, //     still of the outgoing clip; null = family gradient
+          },
+          driftX: -46, // slow wall drift during the hold
+        };
+
+        var W = 1920,
+          H = 1080,
+          DUR = 2.4;
+
+        var root = document.getElementById("mk-cw-root");
+        var wall = document.getElementById("mk-cw-wall");
+        var tilesBox = document.getElementById("mk-cw-tiles");
+        var invert = document.getElementById("mk-cw-invert");
+        var card = document.getElementById("mk-cw-card");
+
+        /* build the tile wall — rows of repeated words, brick-offset */
+        var rowH = CONFIG.fontSize + CONFIG.spreadY;
+        var rows = Math.ceil(H / rowH) + 1;
+        /* rough tile width estimate to fill each row past both edges */
+        var tileW = CONFIG.word.length * CONFIG.fontSize * 0.58 + CONFIG.spreadX;
+        var perRow = Math.ceil(W / tileW) + 2;
+        for (var r = 0; r < rows; r++) {
+          var row = document.createElement("div");
+          row.id = "mk-cw-row-" + r;
+          row.className = "mk-cw-row";
+          /* rows intentionally run past the canvas and sit beneath the card */
+          row.setAttribute("data-layout-allow-overflow", "");
+          row.setAttribute("data-layout-allow-occlusion", "");
+          row.style.fontSize = CONFIG.fontSize + "px";
+          row.style.top = r * rowH - CONFIG.fontSize * 0.35 + "px";
+          var offset = CONFIG.brickOffset && r % 2 === 1 ? -Math.round(tileW / 2) : 0;
+          row.style.left = offset - tileW + "px";
+          for (var c = 0; c < perRow + 1; c++) {
+            var tile = document.createElement("span");
+            tile.className = "mk-cw-tile";
+            tile.textContent = CONFIG.word;
+            tile.style.marginRight = CONFIG.spreadX + "px";
+            row.appendChild(tile);
+          }
+          tilesBox.appendChild(row);
+        }
+
+        if (CONFIG.card.enabled && CONFIG.card.src) {
+          var img = document.createElement("img");
+          img.src = CONFIG.card.src;
+          card.appendChild(img);
+        }
+        if (!CONFIG.card.enabled) card.style.display = "none";
+
+        var tl = gsap.timeline({ paused: true });
+
+        /* The wall sits in place from t=0, fully hidden beneath the
+           full-bleed card — the card's shrink IS the wall's reveal. */
+
+        /* 0.2–0.95  outgoing frame shrinks to a rounded card on the wall */
+        if (CONFIG.card.enabled) {
+          tl.to(
+            card,
+            {
+              top: 330,
+              left: 640,
+              width: 640,
+              height: 420,
+              borderRadius: 40,
+              duration: 0.75,
+              ease: "power3.inOut",
+            },
+            0.2
+          );
+          /* 1.35–1.75  card is put away */
+          tl.to(card, { scale: 0.6, opacity: 0, duration: 0.4, ease: "power2.in" }, 1.35);
+        }
+
+        /* slow drift keeps the wall alive during the hold */
+        tl.to(tilesBox, { x: CONFIG.driftX, duration: 1.8, ease: "sine.inOut" }, 0.3);
+
+        /* 0.85–1.5  inversion sweeps in and STAYS — wall flips ink<->paper */
+        gsap.set(invert, { x: -W });
+        tl.to(invert, { x: 0, duration: 0.65, ease: "power3.inOut" }, 0.85);
+
+        /* 1.9–2.35  the inverted wall fades off, revealing the cut beneath */
+        tl.to(wall, { opacity: 0, duration: 0.45, ease: "power2.inOut" }, 1.9);
+
+        /* hard kills — wall and card die the moment their fades complete */
+        if (CONFIG.card.enabled) tl.set(card, { visibility: "hidden" }, 1.76);
+        tl.set(root, { visibility: "hidden" }, 2.36);
+
+        window.__timelines["mk-clone-wall-transition"] = tl;
+      })();
+    </script>
+  </body>
+</html>
diff --git a/registry/blocks/mk-clone-wall-transition/registry-item.json b/registry/blocks/mk-clone-wall-transition/registry-item.json
new file mode 100644
index 000000000..4b6d9fa15
--- /dev/null
+++ b/registry/blocks/mk-clone-wall-transition/registry-item.json
@@ -0,0 +1,24 @@
+{
+  "$schema": "https://hyperframes.heygen.com/schema/registry-item.json",
+  "name": "mk-clone-wall-transition",
+  "type": "hyperframes:block",
+  "title": "Text Clone Wall Transition",
+  "description": "Overlay transition: a tiled word wall covers the frame, inverts via difference blending, and clears \u2014 hard-cut the content beneath while covered",
+  "tags": [
+    "transition",
+    "typography",
+    "wipe"
+  ],
+  "dimensions": {
+    "width": 1920,
+    "height": 1080
+  },
+  "duration": 2.4,
+  "files": [
+    {
+      "path": "mk-clone-wall-transition.html",
+      "target": "compositions/mk-clone-wall-transition.html",
+      "type": "hyperframes:composition"
+    }
+  ]
+}
diff --git a/registry/registry.json b/registry/registry.json
index 3efed99e1..005934f09 100644
--- a/registry/registry.json
+++ b/registry/registry.json
@@ -575,6 +575,10 @@
       "name": "mk-placeholder-grid",
       "type": "hyperframes:block"
     },
+    {
+      "name": "mk-clone-wall-transition",
+      "type": "hyperframes:block"
+    },
     {
       "name": "parallax-zoom",
       "type": "hyperframes:component"
