From b218ee744397a0f27eb16586db9c7691049903e7 Mon Sep 17 00:00:00 2001
From: Miguel Angel Simon Sierra <miguel.sierra@heygen.com>
Date: Fri, 10 Jul 2026 04:00:37 -0400
Subject: [PATCH] chore(examples): mark product-promo cursor and comment
 layering intentional

The persistence-tier promotion surfaced two held content_overlap errors
on the hero heading; zooming in shows the collaborative-cursor demo
(cursor badge + typed comment bubble) hovering by design. Opt out with
data-layout-allow-overlap per the finding's own fixHint. The example's 4
pre-existing gsap_css_transform_conflict lint errors stay for a separate
example-maintenance pass.
---
 .../product-promo/compositions/scene2-4-canvas.html       | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/registry/examples/product-promo/compositions/scene2-4-canvas.html b/registry/examples/product-promo/compositions/scene2-4-canvas.html
index 41fa0db25..2c9537337 100644
--- a/registry/examples/product-promo/compositions/scene2-4-canvas.html
+++ b/registry/examples/product-promo/compositions/scene2-4-canvas.html
@@ -72,7 +72,7 @@
       </div>
 
       <!-- Comment Pin & Bubble -->
-      <div class="comment-container">
+      <div class="comment-container" data-layout-allow-overlap>
         <div class="comment-pin">
           <div class="checkmark">✓</div>
         </div>
@@ -82,19 +82,19 @@
       </div>
 
       <!-- Cursors -->
-      <div class="cursor designer-cursor">
+      <div class="cursor designer-cursor" data-layout-allow-overlap>
         <svg width="24" height="24" viewBox="0 0 24 24">
           <path d="M0 0 L 16 16 L 9.5 16 L 6.5 23 L 6.5 16 L 0 16 Z" fill="white" stroke="black" />
         </svg>
         <div class="cursor-label">Designer</div>
       </div>
-      <div class="cursor engineer-cursor">
+      <div class="cursor engineer-cursor" data-layout-allow-overlap>
         <svg width="24" height="24" viewBox="0 0 24 24">
           <path d="M0 0 L 16 16 L 9.5 16 L 6.5 23 L 6.5 16 L 0 16 Z" fill="white" stroke="black" />
         </svg>
         <div class="cursor-label">Engineer</div>
       </div>
-      <div class="cursor pm-cursor">
+      <div class="cursor pm-cursor" data-layout-allow-overlap>
         <svg width="24" height="24" viewBox="0 0 24 24">
           <path d="M0 0 L 16 16 L 9.5 16 L 6.5 23 L 6.5 16 L 0 16 Z" fill="white" stroke="black" />
         </svg>