From 88a10380202a12b9421bb077fdd1e016232ad77b Mon Sep 17 00:00:00 2001
From: bender <kudin.dima@gmail.com>
Date: Sat, 7 Mar 2026 18:00:23 +0000
Subject: [PATCH 1/6] Update src/app/about/page.tsx

---
 src/app/about/page.tsx | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/app/about/page.tsx b/src/app/about/page.tsx
index 92c9d4c..c38a7ba 100644
--- a/src/app/about/page.tsx
+++ b/src/app/about/page.tsx
@@ -100,7 +100,7 @@ export default function AboutPage() {
               icon: Heart,
             },
           ]}
-          imageSrc="http://img.b2bpic.net/free-photo/close-up-portrait-happy-young-beauty-blogger-records-lifestyle-vlog-her-room-using-camera-with_1258-255016.jpg"
+          imageSrc="http://img.b2bpic.net/free-photo/close-up-portrait-happy-young-beauty-blogger-records-lifestyle-vlog-her-room-using-camera-with_1258-255016.jpg?_wi=3"
           imageAlt="Suhag - Video Editing Professional"
           mediaAnimation="slide-up"
           imagePosition="right"
@@ -123,7 +123,7 @@ export default function AboutPage() {
               quote: "I understand that in the fast-paced world of content creation, speed matters. I deliver quick turnarounds without ever compromising on quality. Your videos are ready when you need them.",
               name: "My Commitment",
               role: "Quick Delivery",
-              imageSrc: "http://img.b2bpic.net/free-photo/female-video-creator-working-editing-movie-with-green-screen_482257-120096.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/female-video-creator-working-editing-movie-with-green-screen_482257-120096.jpg?_wi=5",
               imageAlt: "Fast turnaround commitment",
             },
             {
@@ -132,7 +132,7 @@ export default function AboutPage() {
               quote: "Professional video editing shouldn't break the bank. I offer competitive rates for freelancers, small businesses, startups, and established companies. Quality editing is accessible to everyone.",
               name: "My Value Proposition",
               role: "Competitive Rates",
-              imageSrc: "http://img.b2bpic.net/free-photo/man-works-home-high-quality-photo_72229-927.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/man-works-home-high-quality-photo_72229-927.jpg?_wi=4",
               imageAlt: "Affordable pricing",
             },
             {
@@ -141,7 +141,7 @@ export default function AboutPage() {
               quote: "I don't consider a project complete until you're completely satisfied. Unlimited revisions, multiple rounds of feedback, and personal attention to every detail. Your satisfaction is guaranteed.",
               name: "My Promise",
               role: "100% Satisfaction Guarantee",
-              imageSrc: "http://img.b2bpic.net/free-photo/colleagues-working-office-christmas-day-giving-presents_176420-8165.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/colleagues-working-office-christmas-day-giving-presents_176420-8165.jpg?_wi=5",
               imageAlt: "Satisfaction guarantee",
             },
           ]}
@@ -164,7 +164,7 @@ export default function AboutPage() {
             required: true,
           }}
           useInvertedBackground={false}
-          imageSrc="http://img.b2bpic.net/free-photo/colleagues-working-office-christmas-day-giving-presents_176420-8165.jpg"
+          imageSrc="http://img.b2bpic.net/free-photo/colleagues-working-office-christmas-day-giving-presents_176420-8165.jpg?_wi=6"
           imageAlt: "Professional workspace"
           mediaAnimation="slide-up"
           mediaPosition="right"
-- 
2.49.1


From 06d914d1cf9ca55d359b38572101041ead4f0d79 Mon Sep 17 00:00:00 2001
From: bender <kudin.dima@gmail.com>
Date: Sat, 7 Mar 2026 18:00:24 +0000
Subject: [PATCH 2/6] Update src/app/contact/page.tsx

---
 src/app/contact/page.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/app/contact/page.tsx b/src/app/contact/page.tsx
index 5f2dc37..aa976f8 100644
--- a/src/app/contact/page.tsx
+++ b/src/app/contact/page.tsx
@@ -68,7 +68,7 @@ export default function ContactPage() {
             required: true,
           }}
           useInvertedBackground={false}
-          imageSrc="http://img.b2bpic.net/free-photo/colleagues-working-office-christmas-day-giving-presents_176420-8165.jpg"
+          imageSrc="http://img.b2bpic.net/free-photo/colleagues-working-office-christmas-day-giving-presents_176420-8165.jpg?_wi=7"
           imageAlt="modern office contact communication setup"
           mediaAnimation="slide-up"
           mediaPosition="right"
-- 
2.49.1


From 80ccbacbaf0b7b2c7d12fc5b9be4df769ae19299 Mon Sep 17 00:00:00 2001
From: bender <kudin.dima@gmail.com>
Date: Sat, 7 Mar 2026 18:00:24 +0000
Subject: [PATCH 3/6] Update src/app/layout.tsx

---
 src/app/layout.tsx | 1367 ++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 1367 insertions(+)

diff --git a/src/app/layout.tsx b/src/app/layout.tsx
index 83c929f..3c49239 100644
--- a/src/app/layout.tsx
+++ b/src/app/layout.tsx
@@ -1434,6 +1434,1373 @@ export default function RootLayout({
   
   window.parent.postMessage({ type: 'webild-editor-ready' }, '*');
 })();
+`
+          }}
+        />
+      
+        <script
+          dangerouslySetInnerHTML={{
+            __html: `
+(function() {
+  if (window.self === window.top) return;
+
+  if (window.__webildEditorInitialized) return;
+  window.__webildEditorInitialized = true;
+
+  let isActive = false;
+  let hoveredElement = null;
+  let selectedElement = null;
+  let originalContent = null;
+  let isEditing = false;
+  let elementTypeLabel = null;
+  let hoverOverlay = null;
+  let scrollTimeout = null;
+  let isScrolling = false;
+
+  const invalidElements = ['html', 'body', 'script', 'style', 'meta', 'link', 'head', 'noscript', 'title'];
+  const hoverClass = 'webild-hover';
+  const selectedClass = 'webild-selected';
+
+  const style = document.createElement('style');
+  style.id = 'webild-inspector-styles';
+  style.textContent = '' +
+    '.webild-hover {' +
+    '  outline: 2px dashed #4d96ff80 !important;' +
+    '  border-radius: 0 !important;' +
+    '  outline-offset: 2px !important;' +
+    '  cursor: pointer !important;' +
+    '  transition: outline 0.15s ease !important;' +
+    '  background-color: #4d96ff05 !important;' +
+    '}' +
+    '.webild-selected {' +
+    '  outline: 2px solid #4d96ff !important;' +
+    '  outline-offset: 2px !important;' +
+    '  transition: outline 0.15s ease !important;' +
+    '  background-color: #4d96ff05 !important;' +
+    '  border-radius: 0 !important;' +
+    '}' +
+    '[contenteditable="true"].webild-selected {' +
+    '  outline: 2px solid #4d96ff !important;' +
+    '  background-color: #4d96ff05 !important;' +
+    '}' +
+    'img.webild-hover,' +
+    'img.webild-selected,' +
+    'video.webild-hover,' +
+    'video.webild-selected {' +
+    '  outline-offset: 2px !important;' +
+    '}' +
+    '.webild-element-type-label {' +
+    '  position: fixed !important;' +
+    '  z-index: 999999 !important;' +
+    '  background: #4d96ff !important;' +
+    '  color: white !important;' +
+    '  padding: 4px 8px !important;' +
+    '  font-size: 11px !important;' +
+    '  font-weight: 600 !important;' +
+    '  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;' +
+    '  pointer-events: none !important;' +
+    '  white-space: nowrap !important;' +
+    '  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15) !important;' +
+    '  letter-spacing: 0.3px !important;' +
+    '  border: 1px solid #4d96ff20 !important;' +
+    '}' +
+    '.webild-element-type-label.label-top {' +
+    '  border-radius: 6px 6px 0 0 !important;' +
+    '}' +
+    '.webild-element-type-label.label-bottom {' +
+    '  border-radius: 0 0 6px 6px !important;' +
+    '}' +
+    '.webild-hover-overlay {' +
+    '  position: fixed !important;' +
+    '  background-color: #4d96ff15 !important;' +
+    '  pointer-events: none !important;' +
+    '  z-index: 999998 !important;' +
+    '  transition: all 0.15s ease !important;' +
+    '}';
+  document.head.appendChild(style);
+  
+  const getUniqueSelector = (element, assignId = false) => {
+    if (element.dataset && element.dataset.webildSelector) {
+      return element.dataset.webildSelector;
+    }
+    
+    const existingId = element.getAttribute('data-webild-id');
+    if (existingId) {
+      return '[data-webild-id="' + existingId + '"]';
+    }
+    
+    if (assignId) {
+      const uniqueId = 'webild-' + Date.now() + '-' + Math.random().toString(36).substr(2, 9);
+      element.setAttribute('data-webild-id', uniqueId);
+      return '[data-webild-id="' + uniqueId + '"]';
+    }
+    
+    return null;
+  };
+  
+  const getSectionId = (element) => {
+    let current = element;
+    while (current && current !== document.body) {
+      const sectionId = current.getAttribute('data-section');
+      if (sectionId) {
+        return sectionId;
+      }
+      current = current.parentElement;
+    }
+    return 'hero';
+  };
+  
+  const getElementType = (element) => {
+  const tagName = element.tagName.toLowerCase();
+  const computedStyle = window.getComputedStyle(element);
+
+  if (tagName === 'img') {
+    return 'Image';
+  }
+
+  if (tagName === 'video') {
+    return 'Video';
+  }
+
+  const backgroundImage = computedStyle.backgroundImage;
+  if (backgroundImage && backgroundImage !== 'none') {
+    const urlMatch = backgroundImage.match(/url(['"]?([^'")]+)['"]?)/);
+    if (urlMatch && urlMatch[1] && !urlMatch[1].includes('gradient')) {
+      const area = element.offsetWidth * element.offsetHeight;
+      const hasReasonableSize = area > 1000;
+      const hasFewChildren = element.children.length <= 2;
+      
+      if (hasReasonableSize && hasFewChildren) {
+        return 'Image';
+      }
+    }
+  }
+
+    if (tagName === 'button') return 'Button';
+    if (tagName === 'a' && element.getAttribute('href')) return 'Button';
+    if (element.getAttribute('role') === 'button') return 'Button';
+
+    const buttonClasses = ['btn', 'button', 'cta', 'action-button'];
+    const hasButtonClass = buttonClasses.some(cls =>
+      element.classList.contains(cls) || element.classList.contains(\`btn-\${cls}\`)
+    );
+
+    if (hasButtonClass && element.textContent && element.textContent.trim().length > 0) {
+      return 'Button';
+    }
+
+    const textTags = ['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'p', 'span', 'label', 'li'];
+    if (textTags.includes(tagName)) {
+      return 'Text';
+    }
+
+    if (tagName === 'div') {
+      const hasDirectText = Array.from(element.childNodes).some(node => 
+        node.nodeType === Node.TEXT_NODE && node.textContent && node.textContent.trim().length > 0
+      );
+      
+      if (hasDirectText && !element.querySelector('div, section, article, main, header, footer')) {
+        return 'Text';
+      }
+      
+      return 'Div';
+    }
+
+    if (tagName === 'article') {
+      return 'Article';
+    }
+
+    if (tagName === 'a' && !element.getAttribute('href')) {
+      return 'Text';
+    }
+
+    return 'Section';
+  };
+
+  const extractOriginalUrl = (url) => {
+    if (!url) return url;
+
+    if (url.includes('/_next/')) {
+      try {
+        const urlObj = new URL(url);
+        const originalPath = urlObj.searchParams.get('url');
+        if (originalPath) {
+          return originalPath;
+        }
+      } catch (e) {
+        return url;
+      }
+    }
+    
+    if (url.includes('.webild.io/')) {
+      try {
+        const urlObj = new URL(url);
+        return urlObj.pathname;
+      } catch (e) {
+        return url;
+      }
+    }
+
+    return url;
+  };
+
+  const getMediaTypeFromUrl = (url) => {
+    const videoExts = ['.mp4', '.webm', '.ogg', '.mov', '.avi', '.mkv', '.m4v', '.wmv'];
+    const imageExts = ['.jpg', '.jpeg', '.png', '.gif', '.webp', '.svg', '.bmp', '.ico', '.tiff', '.avif'];
+    try {
+      const pathname = new URL(url).pathname.toLowerCase();
+      if (videoExts.some(function(ext) { return pathname.endsWith(ext); })) return 'video';
+      if (imageExts.some(function(ext) { return pathname.endsWith(ext); })) return 'image';
+    } catch(e) {}
+    return 'unknown';
+  };
+
+  const swapMediaElement = (oldEl, newTag, newSrc) => {
+    const newEl = document.createElement(newTag);
+    Array.from(oldEl.attributes).forEach(function(attr) {
+      if (attr.name !== 'src' && attr.name !== 'alt' && attr.name !== 'srcset' && attr.name !== 'autoplay' && attr.name !== 'loop' && attr.name !== 'muted' && attr.name !== 'playsinline') {
+        try { newEl.setAttribute(attr.name, attr.value); } catch(e) {}
+      }
+    });
+    newEl.style.cssText = oldEl.style.cssText;
+    if (newTag === 'video') {
+      newEl.setAttribute('autoplay', '');
+      newEl.setAttribute('loop', '');
+      newEl.setAttribute('muted', '');
+      newEl.setAttribute('playsinline', '');
+    }
+    newEl.src = newSrc;
+    if (oldEl.parentNode) {
+      oldEl.parentNode.replaceChild(newEl, oldEl);
+    }
+    return newEl;
+  };
+
+  const getElementInfo = (element, assignId = false) => {
+    const rect = element.getBoundingClientRect();
+    const tagName = element.tagName.toLowerCase();
+    const selector = getUniqueSelector(element, assignId);
+    const sectionId = getSectionId(element);
+    
+    let className = undefined;
+    try {
+      if (element.className) {
+        if (typeof element.className === 'string') {
+          className = element.className;
+        } else if (element.className.baseVal !== undefined) {
+          className = element.className.baseVal;
+        }
+      }
+    } catch (e) {}
+    
+    const info = {
+      tagName: tagName,
+      id: element.id || undefined,
+      className: className,
+      selector: selector,
+      elementType: null,
+      sectionId: sectionId,
+      boundingBox: {
+        x: rect.left,
+        y: rect.top,
+        width: rect.width,
+        height: rect.height
+      }
+    };
+    
+    if (tagName === 'img') {
+      const originalSrc = extractOriginalUrl(element.src);
+      info.imageData = {
+        src: originalSrc,
+        alt: element.alt || undefined,
+        naturalWidth: element.naturalWidth,
+        naturalHeight: element.naturalHeight,
+        isBackground: false
+      };
+    }
+
+    if (tagName === 'video') {
+      const rawSrc = element.src || element.currentSrc || (element.querySelector('source') && element.querySelector('source').src) || '';
+      const resolvedSrc = extractOriginalUrl(rawSrc);
+      info.imageData = {
+        src: resolvedSrc,
+        alt: element.getAttribute('aria-label') || undefined,
+        isBackground: false,
+        isVideo: true
+      };
+    }
+
+    const computedStyle = window.getComputedStyle(element);
+    const backgroundImage = computedStyle.backgroundImage;
+    if (backgroundImage && backgroundImage !== 'none') {
+      const urlMatch = backgroundImage.match(/url(['"]?([^'")]+)['"]?)/);
+      if (urlMatch) {
+        const originalBgSrc = extractOriginalUrl(urlMatch[1]);
+        if (tagName !== 'img') {
+          info.imageData = {
+            src: originalBgSrc,
+            isBackground: true
+          };
+        } else {
+          if (!info.imageData) info.imageData = {};
+          info.imageData.backgroundImageSrc = originalBgSrc;
+        }
+      }
+    }
+    
+    const elementType = getElementType(element);
+    info.elementType = elementType;
+    
+    if (elementType === 'Button') {
+      const buttonText = element.textContent?.trim() || element.value || element.getAttribute('aria-label') || '';
+      const buttonHref = element.getAttribute('href') ||
+                        element.getAttribute('data-href') ||
+                        element.getAttribute('onclick') ||
+                        element.dataset?.link ||
+                        undefined;
+
+      info.buttonData = {
+        text: buttonText,
+        href: buttonHref
+      };
+    }
+
+    if (elementType === 'Text') {
+      info.textContent = element.textContent || '';
+    }
+    
+    return info;
+  };
+  
+  const isValidElement = (element) => {
+    if (!isActive) return false;
+    const tagName = element.tagName?.toLowerCase();
+    if (invalidElements.includes(tagName)) return false;
+    const isImage = tagName === 'img';
+    const isVideo = tagName === 'video';
+    if (isImage || isVideo) return true;
+    const hasInnerHTML = element.innerHTML && element.innerHTML.trim().length > 0;
+    const hasTextContent = element.textContent && element.textContent.trim().length > 0;
+    const hasChildren = element.children && element.children.length > 0;
+    if (!hasInnerHTML && !hasTextContent && !hasChildren) {
+      return false;
+    }
+    const hasBackgroundImage = window.getComputedStyle(element).backgroundImage !== 'none';
+    if (hasBackgroundImage && !hasChildren && !hasTextContent) {
+      return false;
+    }
+    
+    return true;
+  };
+
+  const getMostSpecificElement = (x, y) => {
+    const elements = document.elementsFromPoint(x, y);
+    const validElements = elements.filter(el =>
+      isValidElement(el) &&
+      !el.classList.contains('webild-hover-overlay') &&
+      !el.classList.contains('webild-element-type-label')
+    );
+
+    if (validElements.length === 0) return null;
+    const scoredElements = validElements.map(element => {
+      let score = 0;
+      const rect = element.getBoundingClientRect();
+      const tagName = element.tagName.toLowerCase();
+      const computedStyle = window.getComputedStyle(element);
+      let depth = 0;
+      let current = element;
+      while (current && current !== document.body) {
+        depth++;
+        current = current.parentElement;
+      }
+      score += depth * 2;
+      const hasDirectText = Array.from(element.childNodes).some(node => 
+        node.nodeType === Node.TEXT_NODE && node.textContent && node.textContent.trim().length > 0
+      );
+
+      const hasImages = element.tagName === 'IMG' || element.tagName === 'VIDEO' || computedStyle.backgroundImage !== 'none' || element.querySelector('img') || element.querySelector('video');
+      const isInteractive = ['BUTTON', 'A', 'INPUT', 'SELECT', 'TEXTAREA'].includes(element.tagName);
+      const hasFewChildren = element.children.length <= 3;
+      const area = rect.width * rect.height;
+      const viewportArea = window.innerWidth * window.innerHeight;
+      const isSmallElement = area < viewportArea * 0.1;
+      if (hasDirectText) score += 20;
+      if (hasImages) score += 15;
+      if (isInteractive) score += 25;
+      if (hasFewChildren) score += 10;
+      if (isSmallElement) score += 5;
+      if (area > viewportArea * 0.3) score -= 30;
+      if (element.hasAttribute('data-section')) score -= 15;
+      if (['h1', 'h2', 'h3', 'h4', 'h5', 'h6'].includes(tagName)) score += 20;
+      if (['p', 'span', 'label'].includes(tagName)) score += 15;
+      if (tagName === 'div' && !hasDirectText && element.children.length > 2) score -= 10;
+
+      return { element, score };
+    });
+    scoredElements.sort((a, b) => b.score - a.score);
+    return scoredElements[0]?.element || validElements[0];
+  };
+
+  const isTextElement = (element) => {
+    const elementType = getElementType(element);
+    return elementType === 'Text';
+  };
+
+  const isButtonElement = (element) => {
+    const elementType = getElementType(element);
+    return elementType === 'Button';
+  };
+
+  const updateButtonText = (element, newText) => {
+    const textNodes = [];
+    const walker = document.createTreeWalker(
+      element,
+      NodeFilter.SHOW_TEXT,
+      null
+    );
+
+    let node;
+    while (node = walker.nextNode()) {
+      if (node.textContent && node.textContent.trim()) {
+        textNodes.push(node);
+      }
+    }
+
+    if (textNodes.length > 0) {
+      textNodes[0].textContent = newText;
+      for (let i = 1; i < textNodes.length; i++) {
+        textNodes[i].textContent = '';
+      }
+    } else {
+      element.textContent = newText;
+    }
+  };
+
+  const makeEditable = (element, clickEvent) => {
+    if (!isTextElement(element)) return;
+    
+    originalContent = element.textContent;
+    element.contentEditable = 'true';
+    
+    if (!element.dataset.webildOriginalWhiteSpace) {
+      const computedStyle = window.getComputedStyle(element);
+      element.dataset.webildOriginalWhiteSpace = computedStyle.whiteSpace;
+      element.dataset.webildOriginalWordWrap = computedStyle.wordWrap;
+      element.dataset.webildOriginalOverflowWrap = computedStyle.overflowWrap;
+      element.dataset.webildOriginalOverflow = computedStyle.overflow;
+    }
+    
+    element.style.whiteSpace = 'pre-wrap';
+    element.style.wordWrap = 'break-word';
+    element.style.overflowWrap = 'break-word';
+    element.style.overflow = 'visible';
+    
+    element.focus();
+    isEditing = true;
+    
+    window.parent.postMessage({
+      type: 'webild-text-editing-started',
+      data: { selector: getElementInfo(element).selector }
+    }, '*');
+    
+    const handleBeforeInput = (e) => {
+      // Prevent deletion if it would leave the element empty
+      const currentText = element.textContent || '';
+      const inputType = e.inputType;
+      
+      // Check if this is a delete operation that would leave the element empty
+      if ((inputType === 'deleteContentBackward' || inputType === 'deleteContentForward' || inputType === 'deleteByCut') && currentText.length <= 1) {
+        e.preventDefault();
+        element.textContent = ' ';
+        // Move cursor to the beginning
+        const range = document.createRange();
+        const sel = window.getSelection();
+        range.setStart(element.firstChild || element, 0);
+        range.collapse(true);
+        sel.removeAllRanges();
+        sel.addRange(range);
+      }
+    };
+    
+    const handleInput = () => {
+      const elementInfo = getElementInfo(element);
+      let currentText = element.textContent;
+      
+      // Ensure there's always at least a space to keep the element editable
+      if (currentText === '' || currentText === null || currentText.length === 0) {
+        element.textContent = ' ';
+        currentText = ' ';
+        // Move cursor to the beginning
+        try {
+          const range = document.createRange();
+          const sel = window.getSelection();
+          range.setStart(element.firstChild || element, 0);
+          range.collapse(true);
+          sel.removeAllRanges();
+          sel.addRange(range);
+        } catch (e) {
+          // Ignore cursor positioning errors
+        }
+      }
+
+      window.parent.postMessage({
+        type: 'webild-element-changed',
+        data: {
+          type: 'updateText',
+          selector: elementInfo.selector,
+          oldValue: originalContent,
+          newValue: currentText,
+          elementType: elementInfo.elementType,
+          sectionId: elementInfo.sectionId,
+          timestamp: Date.now()
+        }
+      }, '*');
+      
+      if (currentText !== originalContent) {
+        window.parent.postMessage({
+          type: 'webild-text-changed',
+          data: { 
+            selector: elementInfo.selector,
+            hasChanges: true
+          }
+        }, '*');
+      }
+    };
+    
+    element.addEventListener('beforeinput', handleBeforeInput);
+    element.addEventListener('input', handleInput);
+    element.dataset.inputHandler = 'true';
+    element.dataset.beforeInputHandler = 'true';
+    
+    if (clickEvent && element.childNodes.length > 0) {
+      try {
+        let range = null;
+        
+        if (document.caretRangeFromPoint) {
+          range = document.caretRangeFromPoint(clickEvent.clientX, clickEvent.clientY);
+        } else if (document.caretPositionFromPoint) {
+          const position = document.caretPositionFromPoint(clickEvent.clientX, clickEvent.clientY);
+          if (position) {
+            range = document.createRange();
+            range.setStart(position.offsetNode, position.offset);
+            range.collapse(true);
+          }
+        }
+        
+        if (range) {
+          const selection = window.getSelection();
+          selection.removeAllRanges();
+          selection.addRange(range);
+        }
+      } catch (e) {
+        console.warn('[Webild] Could not set caret position:', e);
+      }
+    }
+  };
+  
+  const makeUneditable = (element, save = false) => {
+    if (!element || element.contentEditable !== 'true') return;
+    
+    element.contentEditable = 'false';
+    isEditing = false;
+    
+    if (element.dataset.webildOriginalWhiteSpace) {
+      element.style.whiteSpace = element.dataset.webildOriginalWhiteSpace === 'normal' ? '' : element.dataset.webildOriginalWhiteSpace;
+      delete element.dataset.webildOriginalWhiteSpace;
+    }
+    if (element.dataset.webildOriginalWordWrap) {
+      element.style.wordWrap = element.dataset.webildOriginalWordWrap === 'normal' ? '' : element.dataset.webildOriginalWordWrap;
+      delete element.dataset.webildOriginalWordWrap;
+    }
+    if (element.dataset.webildOriginalOverflowWrap) {
+      element.style.overflowWrap = element.dataset.webildOriginalOverflowWrap === 'normal' ? '' : element.dataset.webildOriginalOverflowWrap;
+      delete element.dataset.webildOriginalOverflowWrap;
+    }
+    if (element.dataset.webildOriginalOverflow) {
+      element.style.overflow = element.dataset.webildOriginalOverflow === 'visible' ? '' : element.dataset.webildOriginalOverflow;
+      delete element.dataset.webildOriginalOverflow;
+    }
+    
+    if (element.dataset.beforeInputHandler === 'true') {
+      element.removeEventListener('beforeinput', () => {});
+      delete element.dataset.beforeInputHandler;
+    }
+    
+    if (element.dataset.inputHandler === 'true') {
+      element.removeEventListener('input', () => {});
+      delete element.dataset.inputHandler;
+    }
+    
+    window.parent.postMessage({
+      type: 'webild-text-editing-ended',
+      data: { selector: getElementInfo(element).selector }
+    }, '*');
+    
+    if (save && originalContent !== element.textContent) {
+      const elementInfo = getElementInfo(element);
+      let finalText = element.textContent;
+      
+      // Trim the final text and convert space-only to empty string for saving
+      if (finalText === ' ' || finalText.trim() === '') {
+        finalText = '';
+        // Update the actual element text to empty for display
+        element.textContent = '';
+      }
+      
+      const change = {
+        type: 'updateText',
+        selector: elementInfo.selector,
+        oldValue: originalContent,
+        newValue: finalText,
+        elementType: elementInfo.elementType,
+        sectionId: elementInfo.sectionId,
+        timestamp: Date.now()
+      };
+
+      saveChangeToStorage(change);
+
+      window.parent.postMessage({
+        type: 'webild-element-changed',
+        data: change
+      }, '*');
+    } else if (!save && originalContent !== null) {
+      element.textContent = originalContent;
+    }
+    
+    originalContent = null;
+  };
+  
+  const createHoverOverlay = (element) => {
+    const rect = element.getBoundingClientRect();
+    const overlay = document.createElement('div');
+    overlay.className = 'webild-hover-overlay';
+    overlay.style.cssText = \`
+      position: fixed !important;
+      top: \${rect.top - 2}px !important;
+      left: \${rect.left - 2}px !important;
+      width: \${rect.width + 4}px !important;
+      height: \${rect.height + 4}px !important;
+      background-color: rgba(90, 113, 230, 0.15) !important;
+      pointer-events: none !important;
+      z-index: 999998 !important;
+      transition: all 0.15s ease !important;
+    \`;
+    document.body.appendChild(overlay);
+    return overlay;
+  };
+  
+  const removeHoverOverlay = () => {
+    if (hoverOverlay) {
+      hoverOverlay.remove();
+      hoverOverlay = null;
+    }
+  };
+  
+  const showElementTypeLabel = (element, elementType) => {
+    if (!elementType) return;
+
+    removeElementTypeLabel();
+
+    const rect = element.getBoundingClientRect();
+    elementTypeLabel = document.createElement('div');
+    elementTypeLabel.className = 'webild-element-type-label';
+    const ariaLabel = element.getAttribute('aria-label');
+    let labelText;
+    
+    if (elementType === 'Div') {
+      labelText = 'Div';
+    } else if (elementType === 'Article') {
+      labelText = 'Article';
+    } else if (elementType === 'Section') {
+      labelText = ariaLabel || 'Section';
+    } else {
+      labelText = elementType;
+    }
+    
+    elementTypeLabel.textContent = labelText;
+    document.body.appendChild(elementTypeLabel);
+    const labelRect = elementTypeLabel.getBoundingClientRect();
+    let labelTop = rect.top - labelRect.height - 2;
+    let labelLeft = rect.left - 3;
+    let isLabelOnTop = true;
+    if (labelTop < 0) {
+      labelTop = rect.bottom + 1;
+      isLabelOnTop = false;
+    }
+    if (labelTop + labelRect.height > window.innerHeight) {
+      labelTop = rect.bottom - labelRect.height;
+      isLabelOnTop = false;
+      if (labelTop < 0) {
+        labelTop = rect.top;
+        isLabelOnTop = true;
+      }
+    }
+    if (labelLeft + labelRect.width > window.innerWidth) {
+      labelLeft = window.innerWidth - labelRect.width;
+    }
+    if (labelLeft < 0) {
+      labelLeft = 0;
+    }
+    if (isLabelOnTop) {
+      elementTypeLabel.classList.add('label-top');
+    } else {
+      elementTypeLabel.classList.add('label-bottom');
+    }
+
+    elementTypeLabel.style.cssText = \`
+      left: \${labelLeft}px !important;
+      top: \${labelTop}px !important;
+      transform: none !important;
+    \`;
+  };
+  
+  const removeElementTypeLabel = () => {
+    if (elementTypeLabel) {
+      elementTypeLabel.remove();
+      elementTypeLabel = null;
+    }
+  };
+  
+  const handleMouseOver = (e) => {
+    if (!isActive) return;
+
+    lastMouseX = e.clientX;
+    lastMouseY = e.clientY;
+
+    const target = getMostSpecificElement(e.clientX, e.clientY) || e.target;
+
+    if (!isValidElement(target) || target === hoveredElement || target === selectedElement) {
+      return;
+    }
+    
+    if (hoveredElement && hoveredElement !== selectedElement) {
+      hoveredElement.classList.remove(hoverClass);
+      if (hoveredElement.dataset.webildOriginalPosition) {
+        hoveredElement.style.position = hoveredElement.dataset.webildOriginalPosition === 'none' ? '' : hoveredElement.dataset.webildOriginalPosition;
+        delete hoveredElement.dataset.webildOriginalPosition;
+      }
+      removeHoverOverlay();
+      removeElementTypeLabel();
+    }
+    
+    hoveredElement = target;
+    
+    const computedStyle = window.getComputedStyle(target);
+    const currentPosition = computedStyle.position;
+    
+    if (currentPosition === 'static' || currentPosition === '') {
+      hoveredElement.dataset.webildOriginalPosition = currentPosition || 'none';
+      hoveredElement.style.position = 'relative';
+    }
+    
+    hoveredElement.classList.add(hoverClass);
+    
+    if ((!selectedElement || selectedElement !== target) && !isScrolling) {
+      hoverOverlay = createHoverOverlay(target);
+    }
+    
+    const elementType = getElementType(target);
+    showElementTypeLabel(target, elementType);
+    
+    window.parent.postMessage({
+      type: 'webild-element-hover',
+      data: getElementInfo(target, false)
+    }, '*');
+  };
+  
+  const handleMouseOut = (e) => {
+    if (!isActive) return;
+    
+    if (hoveredElement && hoveredElement !== selectedElement) {
+      hoveredElement.classList.remove(hoverClass);
+      
+      if (hoveredElement.dataset.webildOriginalPosition) {
+        hoveredElement.style.position = hoveredElement.dataset.webildOriginalPosition === 'none' ? '' : hoveredElement.dataset.webildOriginalPosition;
+        delete hoveredElement.dataset.webildOriginalPosition;
+      }
+      
+      removeHoverOverlay();
+      removeElementTypeLabel();
+      
+      hoveredElement = null;
+      
+      window.parent.postMessage({
+        type: 'webild-element-hover',
+        data: null
+      }, '*');
+    }
+  };
+  
+  const handleClick = (e) => {
+  if (!isActive) return;
+
+  if (isEditing) {
+    e.stopPropagation();
+    return;
+  }
+
+  e.preventDefault();
+  e.stopPropagation();
+
+  const target = getMostSpecificElement(e.clientX, e.clientY) || e.target;  
+  if (!isValidElement(target)) return;
+    
+    if (selectedElement && selectedElement !== target) {
+      makeUneditable(selectedElement, false);
+      selectedElement.classList.remove(selectedClass);
+      selectedElement.classList.remove(hoverClass);
+      
+      if (selectedElement.dataset.webildOriginalPosition) {
+        selectedElement.style.position = selectedElement.dataset.webildOriginalPosition === 'none' ? '' : selectedElement.dataset.webildOriginalPosition;
+        delete selectedElement.dataset.webildOriginalPosition;
+      }
+      
+      removeHoverOverlay();
+      removeElementTypeLabel();
+    }
+    
+    if (selectedElement === target) {
+      if (target.dataset.webildOriginalPosition) {
+        target.style.position = target.dataset.webildOriginalPosition === 'none' ? '' : target.dataset.webildOriginalPosition;
+        delete target.dataset.webildOriginalPosition;
+      }
+      
+      removeHoverOverlay();
+      removeElementTypeLabel();
+      
+      selectedElement = null;
+      window.parent.postMessage({
+        type: 'webild-element-selected',
+        data: null
+      }, '*');
+      return;
+    }
+    
+    selectedElement = target;
+    selectedElement.classList.add(selectedClass);
+    
+    removeHoverOverlay();
+    removeElementTypeLabel();
+    
+    if (hoveredElement === target) {
+      hoveredElement.classList.remove(hoverClass);
+      hoveredElement = null;
+    }
+    
+    const elementInfo = getElementInfo(target, true);
+    selectedElement.dataset.webildSelector = elementInfo.selector;
+    showElementTypeLabel(target, elementInfo.elementType);
+    
+    window.parent.postMessage({
+      type: 'webild-element-selected',
+      data: elementInfo
+    }, '*');
+    
+    if (isTextElement(target)) {
+      setTimeout(() => makeEditable(target, e), 50);
+    }
+  };
+  
+  const handleKeyDown = (e) => {
+    if (!isActive) return;
+    if (!isEditing || !selectedElement) return;
+    
+    if (e.key === 'Enter' && !e.shiftKey) {
+      e.preventDefault();
+      makeUneditable(selectedElement, true);
+    } else if (e.key === 'Escape') {
+      e.preventDefault();
+      makeUneditable(selectedElement, false);
+    }
+  };
+  
+  const handleBlur = (e) => {
+    if (!isActive) return;
+    if (isEditing && selectedElement && e.target === selectedElement) {
+      makeUneditable(selectedElement, true);
+    }
+  };
+  
+  let lastMouseX = 0;
+  let lastMouseY = 0;
+
+  const handleScroll = () => {
+    if (!isActive) return;
+    
+    if (isEditing) return;
+    
+    if (selectedElement) {
+      makeUneditable(selectedElement, false);
+      selectedElement.classList.remove(selectedClass);
+      if (selectedElement.dataset.webildOriginalPosition) {
+        selectedElement.style.position = selectedElement.dataset.webildOriginalPosition === 'none' ? '' : selectedElement.dataset.webildOriginalPosition;
+        delete selectedElement.dataset.webildOriginalPosition;
+      }
+      selectedElement = null;
+
+      window.parent.postMessage({
+        type: 'webild-element-selected',
+        data: null
+      }, '*');
+    }
+
+    if (hoveredElement) {
+      hoveredElement.classList.remove(hoverClass);
+      if (hoveredElement.dataset.webildOriginalPosition) {
+        hoveredElement.style.position = hoveredElement.dataset.webildOriginalPosition === 'none' ? '' : hoveredElement.dataset.webildOriginalPosition;
+        delete hoveredElement.dataset.webildOriginalPosition;
+      }
+      hoveredElement = null;
+
+      window.parent.postMessage({
+        type: 'webild-element-hover',
+        data: null
+      }, '*');
+    }
+
+    removeHoverOverlay();
+    removeElementTypeLabel();
+
+    isScrolling = true;
+
+    if (scrollTimeout) {
+      clearTimeout(scrollTimeout);
+    }
+
+    scrollTimeout = setTimeout(() => {
+      isScrolling = false;
+
+      if (lastMouseX > 0 && lastMouseY > 0) {
+        const target = getMostSpecificElement(lastMouseX, lastMouseY);
+        if (target && isValidElement(target) && target !== selectedElement) {
+          hoveredElement = target;
+
+          const computedStyle = window.getComputedStyle(target);
+          const currentPosition = computedStyle.position;
+
+          if (currentPosition === 'static' || currentPosition === '') {
+            hoveredElement.dataset.webildOriginalPosition = currentPosition || 'none';
+            hoveredElement.style.position = 'relative';
+          }
+
+          hoveredElement.classList.add(hoverClass);
+          hoverOverlay = createHoverOverlay(target);
+
+          const elementType = getElementType(target);
+          showElementTypeLabel(target, elementType);
+
+          window.parent.postMessage({
+            type: 'webild-element-hover',
+            data: getElementInfo(target, false)
+          }, '*');
+        }
+      }
+    }, 150);
+
+    window.parent.postMessage({
+      type: 'webild-iframe-scroll'
+    }, '*');
+  };
+  
+  const getStorageKey = () => {
+    const url = new URL(window.location.href);
+    const pathParts = url.pathname.split('/').filter(Boolean);
+    return \`webild-changes-\${pathParts.join('-')}\`;
+  };
+
+  const saveChangeToStorage = (change) => {
+    try {
+      const storageKey = getStorageKey();
+      const existingChanges = JSON.parse(localStorage.getItem(storageKey) || '[]');
+
+      const filteredChanges = existingChanges.filter(c => {
+        return !(c.oldValue === change.oldValue && c.sectionId === change.sectionId);
+      });
+      filteredChanges.push(change);
+
+      localStorage.setItem(storageKey, JSON.stringify(filteredChanges));
+
+      window.parent.postMessage({
+        type: 'webild-change-saved-locally',
+        data: { change, allChanges: filteredChanges }
+      }, '*');
+    } catch (error) {
+      console.error('Failed to save change to localStorage:', error);
+    }
+  };
+
+  const clearLocalChanges = () => {
+    try {
+      const storageKey = getStorageKey();
+      localStorage.removeItem(storageKey);
+      window.parent.postMessage({
+        type: 'webild-local-changes-cleared',
+        data: {}
+      }, '*');
+    } catch (error) {
+      console.error('Failed to clear local changes:', error);
+    }
+  };
+
+  const handleMessage = (e) => {
+    if (!e.data || !e.data.type) return;
+
+    if (e.data.type === 'webild-activate-editor') {
+      if (!isActive) {
+        isActive = true;
+        window.parent.postMessage({ type: 'webild-editor-activated' }, '*');
+      }
+      return;
+    }
+
+    if (e.data.type === 'webild-deactivate-editor') {
+      if (isActive) {
+        isActive = false;
+
+        if (selectedElement) {
+          makeUneditable(selectedElement, false);
+          selectedElement.classList.remove(selectedClass);
+          selectedElement = null;
+        }
+        if (hoveredElement) {
+          hoveredElement.classList.remove(hoverClass);
+          hoveredElement = null;
+        }
+
+        removeHoverOverlay();
+        removeElementTypeLabel();
+        window.parent.postMessage({ type: 'webild-editor-deactivated' }, '*');
+      }
+      return;
+    }
+
+    if (e.data.type === 'webild-clear-local-changes') {
+      clearLocalChanges();
+      return;
+    }
+
+    if (e.data.type === 'webild-cancel-changes') {
+      try {
+        const storageKey = getStorageKey();
+        const savedChanges = localStorage.getItem(storageKey);
+        if (savedChanges) {
+          const changes = JSON.parse(savedChanges);
+          changes.forEach(change => {
+            try {
+              const element = document.querySelector(change.selector);
+              if (!element) return;
+
+              if (change.type === 'updateText') {
+                if (isTextElement(element)) {
+                  element.textContent = change.oldValue;
+                }
+              } else if (change.type === 'updateButton') {
+                if (isButtonElement(element)) {
+                  updateButtonText(element, change.oldValue);
+                }
+              } else if (change.type === 'replaceImage') {
+                const revertTag = element.tagName.toLowerCase();
+                const isBackground = revertTag !== 'img' && revertTag !== 'video';
+                if (isBackground) {
+                  element.style.backgroundImage = change.oldValue ? 'url(' + change.oldValue + ')' : '';
+                } else {
+                  const oldMediaType = getMediaTypeFromUrl(change.oldValue);
+                  if (revertTag === 'video' && oldMediaType === 'image') {
+                    swapMediaElement(element, 'img', change.oldValue);
+                  } else if (revertTag === 'img' && oldMediaType === 'video') {
+                    swapMediaElement(element, 'video', change.oldValue);
+                  } else if (revertTag === 'video') {
+                    element.src = change.oldValue;
+                    element.load();
+                  } else {
+                    element.src = change.oldValue;
+                  }
+                }
+              }
+            } catch (err) {
+              console.warn('[Webild] Failed to revert change:', err);
+            }
+          });
+        }
+        clearLocalChanges();
+      } catch (error) {
+        console.error('[Webild] Failed to cancel changes:', error);
+      }
+      return;
+    }
+
+    if (e.data.type === 'webild-update-text') {
+      const { selector, newValue, oldValue, sectionId } = e.data.data;
+      try {
+        let element = null;
+        
+        if (selectedElement && isTextElement(selectedElement)) {
+          element = selectedElement;
+        }
+        else if (selector) {
+          try {
+            element = document.querySelector(selector);
+          } catch (err) {
+            console.warn('[Webild] Invalid selector:', selector);
+          }
+        }
+        
+        if (!element && sectionId) {
+          const sectionElement = document.querySelector('[data-section="' + sectionId + '"]');
+          if (sectionElement) {
+            const textElements = sectionElement.querySelectorAll('h1, h2, h3, h4, h5, h6, p, span, a, button, div');
+            for (let i = 0; i < textElements.length; i++) {
+              const el = textElements[i];
+              if (isTextElement(el) && el.textContent.trim() === (oldValue || '').trim()) {
+                element = el;
+                const newSelector = getUniqueSelector(element, true);
+                if (newSelector) {
+                  element.dataset.webildSelector = newSelector;
+                }
+                break;
+              }
+            }
+          }
+        }
+        
+        if (element && isTextElement(element)) {
+          element.textContent = newValue;
+          const finalSelector = element.dataset.webildSelector || getUniqueSelector(element, true);
+          
+          window.parent.postMessage({
+            type: 'webild-text-update-success',
+            data: {
+              selector: finalSelector,
+              newValue: newValue
+            }
+          }, '*');
+        } else {
+          window.parent.postMessage({
+            type: 'webild-text-update-failed',
+            data: { selector, newValue }
+          }, '*');
+        }
+      } catch (error) {
+        window.parent.postMessage({
+          type: 'webild-text-update-failed',
+          data: { selector, newValue, error: error.message }
+        }, '*');
+      }
+      return;
+    }
+
+    if (e.data.type === 'webild-update-button') {
+      const { selector, text, href } = e.data.data;
+      try {
+        const element = document.querySelector(selector);
+        if (element && isButtonElement(element)) {
+          if (text !== undefined) {
+            updateButtonText(element, text);
+          }
+          if (href !== undefined) {
+            if (element.tagName.toLowerCase() === 'a') {
+              element.href = href;
+            } else {
+              element.setAttribute('data-href', href);
+            }
+          }
+        }
+      } catch (error) {
+        console.error('[Webild] Invalid selector for button update:', selector, error);
+      }
+      return;
+    }
+
+    if (!isActive) return;
+
+    if (e.data.type === 'webild-replace-image') {
+      const { selector, newSrc, isBackground, allowMediaTypeSwap } = e.data.data;
+      let element = null;
+
+      try {
+        element = document.querySelector(selector);
+      } catch {
+        window.parent.postMessage({
+          type: 'webild-image-replacement-error',
+          data: { selector, message: 'Invalid selector: ' + error.message, success: false }
+        }, '*');
+        return;
+      }
+
+      if (!element) {
+        window.parent.postMessage({
+          type: 'webild-image-replacement-error',
+          data: { selector, message: 'Element not found', success: false }
+        }, '*');
+        return;
+      }
+
+      try {
+        let replaced = false;
+        let oldValue = '';
+
+        if (isBackground) {
+          oldValue = window.getComputedStyle(element).backgroundImage;
+          element.style.backgroundImage = \`url('\${newSrc}')\`;
+          replaced = true;
+        } else if (element.tagName.toLowerCase() === 'img') {
+          oldValue = element.src;
+          const newMediaType = getMediaTypeFromUrl(newSrc);
+          if (newMediaType === 'video' && allowMediaTypeSwap) {
+            const swapped = swapMediaElement(element, 'video', newSrc);
+            if (selectedElement === element) selectedElement = swapped;
+            element = swapped;
+          } else {
+            element.src = newSrc;
+          }
+          replaced = true;
+        } else if (element.tagName.toLowerCase() === 'video') {
+          oldValue = element.src || element.currentSrc || '';
+          const newMediaType = getMediaTypeFromUrl(newSrc);
+          const sources = element.querySelectorAll('source');
+          if (newMediaType === 'image' && allowMediaTypeSwap) {
+            const swapped = swapMediaElement(element, 'img', newSrc);
+            if (selectedElement === element) selectedElement = swapped;
+            element = swapped;
+          } else {
+            if (sources.length > 0) {
+              sources.forEach(function(source) { source.src = newSrc; });
+              element.load();
+            } else {
+              element.src = newSrc;
+              element.load();
+            }
+          }
+          replaced = true;
+        } else {
+          const hasBackgroundImage = window.getComputedStyle(element).backgroundImage !== 'none';
+          if (hasBackgroundImage) {
+            oldValue = window.getComputedStyle(element).backgroundImage;
+            element.style.backgroundImage = \`url('\${newSrc}')\`;
+            replaced = true;
+          }
+        }
+
+        if (replaced) {
+          const elementInfo = getElementInfo(element);
+
+          let cleanOldValue = oldValue;
+          if (oldValue.includes('url(')) {
+            const urlMatch = oldValue.match(/url(['"]?([^'")]+)['"]?)/);
+            if (urlMatch) {
+              cleanOldValue = urlMatch[1];
+            }
+          }
+
+          cleanOldValue = extractOriginalUrl(cleanOldValue);
+
+          const change = {
+            type: 'replaceImage',
+            selector: selector,
+            oldValue: cleanOldValue,
+            newValue: newSrc,
+            elementType: elementInfo.elementType,
+            sectionId: elementInfo.sectionId,
+            timestamp: Date.now()
+          };
+
+          saveChangeToStorage(change);
+
+          window.parent.postMessage({
+            type: 'webild-element-changed',
+            data: change
+          }, '*');
+
+          window.parent.postMessage({
+            type: 'webild-image-replaced',
+            data: { selector, newSrc, success: true }
+          }, '*');
+        } else {
+          window.parent.postMessage({
+            type: 'webild-image-replacement-error',
+            data: { selector, message: 'Could not determine how to replace image', success: false }
+          }, '*');
+        }
+      } catch (error) {
+        window.parent.postMessage({
+          type: 'webild-image-replacement-error',
+          data: { selector, message: error.message || 'Failed to replace image', success: false }
+        }, '*');
+      }
+    }
+  };
+  
+  document.addEventListener('mouseover', handleMouseOver, true);
+  document.addEventListener('mouseout', handleMouseOut, true);
+  document.addEventListener('click', handleClick, true);
+  document.addEventListener('keydown', handleKeyDown, true);
+  document.addEventListener('blur', handleBlur, true);
+  window.addEventListener('scroll', handleScroll, true);
+  window.addEventListener('message', handleMessage, true);
+  
+  let lastPathname = window.location.pathname;
+  
+  const notifyPageChange = () => {
+    window.parent.postMessage({
+      type: 'webild-page-changed',
+      data: { pathname: window.location.pathname }
+    }, '*');
+  };
+  
+  window.addEventListener('popstate', () => {
+    if (lastPathname !== window.location.pathname) {
+      lastPathname = window.location.pathname;
+      notifyPageChange();
+    }
+  }, true);
+  
+  const urlCheckInterval = setInterval(() => {
+    if (lastPathname !== window.location.pathname) {
+      lastPathname = window.location.pathname;
+      notifyPageChange();
+    }
+  }, 500);
+  
+  notifyPageChange();
+  
+  window.webildCleanup = () => {
+    isActive = false;
+    
+    if (selectedElement) {
+      makeUneditable(selectedElement, false);
+    }
+    
+    removeHoverOverlay();
+    removeElementTypeLabel();
+    
+    if (urlCheckInterval) {
+      clearInterval(urlCheckInterval);
+    }
+    
+    document.removeEventListener('mouseover', handleMouseOver, true);
+    document.removeEventListener('mouseout', handleMouseOut, true);
+    document.removeEventListener('click', handleClick, true);
+    document.removeEventListener('keydown', handleKeyDown, true);
+    document.removeEventListener('blur', handleBlur, true);
+    window.removeEventListener('scroll', handleScroll, true);
+    window.removeEventListener('message', handleMessage, true);
+    
+    document.querySelectorAll('.' + hoverClass).forEach(el => {
+      el.classList.remove(hoverClass);
+    });
+    document.querySelectorAll('.' + selectedClass).forEach(el => {
+      el.classList.remove(selectedClass);
+    });
+    
+    const styleEl = document.getElementById('webild-inspector-styles');
+    if (styleEl) styleEl.remove();
+    
+    hoveredElement = null;
+    selectedElement = null;
+  };
+  
+  window.parent.postMessage({ type: 'webild-editor-ready' }, '*');
+})();
 `
           }}
         />
-- 
2.49.1


From a4438c542acf067ef5b2ee93e56f45dbbfd434f6 Mon Sep 17 00:00:00 2001
From: bender <kudin.dima@gmail.com>
Date: Sat, 7 Mar 2026 18:00:24 +0000
Subject: [PATCH 4/6] Update src/app/page.tsx

---
 src/app/page.tsx | 28 ++++++++++++++--------------
 1 file changed, 14 insertions(+), 14 deletions(-)

diff --git a/src/app/page.tsx b/src/app/page.tsx
index 3f29f47..e10db90 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -87,7 +87,7 @@ export default function HomePage() {
           dashboard={{
             title: "Your Video Content Starts Here",
             logoIcon: Film,
-            imageSrc: "http://img.b2bpic.net/free-photo/female-video-creator-working-editing-movie-with-green-screen_482257-120096.jpg",
+            imageSrc: "http://img.b2bpic.net/free-photo/female-video-creator-working-editing-movie-with-green-screen_482257-120096.jpg?_wi=1",
             imageAlt: "Professional video editing workspace",
             buttons: [
               { text: "See Portfolio", href: "/portfolio" },
@@ -165,7 +165,7 @@ export default function HomePage() {
               icon: Headphones,
             },
           ]}
-          imageSrc="http://img.b2bpic.net/free-photo/female-video-creator-working-editing-movie-with-green-screen_482257-120096.jpg"
+          imageSrc="http://img.b2bpic.net/free-photo/female-video-creator-working-editing-movie-with-green-screen_482257-120096.jpg?_wi=2"
           imageAlt="Professional video editing setup"
           mediaAnimation="slide-up"
           imagePosition="right"
@@ -188,7 +188,7 @@ export default function HomePage() {
               title: "YouTube Video Editing",
               description: "Full-length edits with professional color grading, captions, custom thumbnails, and optimized titles. Perfect for channels looking to scale.",
               tag: "YouTube",
-              imageSrc: "http://img.b2bpic.net/free-photo/content-creator-holding-recording-v-mount-battery-review-vlog-professional-acumulator-modern-v-lock-type-technology-social-media-star-influencer-online-distribution_482257-3815.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/content-creator-holding-recording-v-mount-battery-review-vlog-professional-acumulator-modern-v-lock-type-technology-social-media-star-influencer-online-distribution_482257-3815.jpg?_wi=1",
               imageAlt: "YouTube video editing",
             },
             {
@@ -196,7 +196,7 @@ export default function HomePage() {
               title: "Social Media Shorts / Reels / TikTok",
               description: "Fast-paced, eye-catching edits designed to grow your audience. Trending effects, quick cuts, and engaging transitions to maximize views.",
               tag: "Social Media",
-              imageSrc: "http://img.b2bpic.net/free-photo/friends-taking-photos-women-party_23-2149357778.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/friends-taking-photos-women-party_23-2149357778.jpg?_wi=1",
               imageAlt: "Social media shorts editing",
             },
             {
@@ -204,7 +204,7 @@ export default function HomePage() {
               title: "Motion Graphics & Animations",
               description: "Professional logo intros, smooth transitions, visual effects, and animated overlays to elevate your video production quality.",
               tag: "Animation",
-              imageSrc: "http://img.b2bpic.net/free-photo/photo-editor-histogram-setting-concept_53876-120321.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/photo-editor-histogram-setting-concept_53876-120321.jpg?_wi=1",
               imageAlt: "Motion graphics and animation",
             },
             {
@@ -212,7 +212,7 @@ export default function HomePage() {
               title: "Podcast / Audio Editing",
               description: "Clean, professional sound editing for any platform. Noise reduction, background removal, mixing, and mastering for podcast-ready audio.",
               tag: "Audio",
-              imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-people-preparing-podcast_23-2149386533.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-people-preparing-podcast_23-2149386533.jpg?_wi=1",
               imageAlt: "Podcast audio editing",
             },
             {
@@ -220,7 +220,7 @@ export default function HomePage() {
               title: "Color Grading & Correction",
               description: "Enhance your visuals with professional color grading. Cinematic looks, consistent color schemes, and correction for polished final results.",
               tag: "Color",
-              imageSrc: "http://img.b2bpic.net/free-vector/pricing-table-pack_23-2147728368.jpg",
+              imageSrc: "http://img.b2bpic.net/free-vector/pricing-table-pack_23-2147728368.jpg?_wi=1",
               imageAlt: "Color grading and correction",
             },
           ]}
@@ -243,7 +243,7 @@ export default function HomePage() {
               quote: "Suhag's editing took our YouTube videos to the next level. Professional thumbnails, smooth transitions, and perfect pacing. Our watch time increased by 40% within two months!",
               name: "Aman Kumar",
               role: "YouTube Creator",
-              imageSrc: "http://img.b2bpic.net/free-photo/black-woman-streamer-playing-space-shooter-videogames-with-joystick-talking-with-teammates-streaming-open-chat-cyber-performing-rgb-powerful-computer-gaming-room-using-professional-equipment_482257-12662.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/black-woman-streamer-playing-space-shooter-videogames-with-joystick-talking-with-teammates-streaming-open-chat-cyber-performing-rgb-powerful-computer-gaming-room-using-professional-equipment_482257-12662.jpg?_wi=1",
               imageAlt: "Aman Kumar testimonial",
             },
             {
@@ -252,7 +252,7 @@ export default function HomePage() {
               quote: "We needed quick turnaround on our social media content, and Suhag delivered exactly what we wanted. The reels are engaging, trendy, and our engagement shot up significantly.",
               name: "Priya Sharma",
               role: "Marketing Manager, TechBrand Co.",
-              imageSrc: "http://img.b2bpic.net/free-photo/beautiful-young-blogger-women-posing-phone-camera_7502-7218.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/beautiful-young-blogger-women-posing-phone-camera_7502-7218.jpg?_wi=1",
               imageAlt: "Priya Sharma testimonial",
             },
             {
@@ -261,7 +261,7 @@ export default function HomePage() {
               quote: "The audio editing was crisp and professional. Noise removal was flawless, and the final product sounds studio-quality. Highly recommended for podcasters!",
               name: "Rajesh Patel",
               role: "Podcast Host, Tech Talk Daily",
-              imageSrc: "http://img.b2bpic.net/free-photo/man-works-home-high-quality-photo_72229-927.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/man-works-home-high-quality-photo_72229-927.jpg?_wi=1",
               imageAlt: "Rajesh Patel testimonial",
             },
             {
@@ -270,7 +270,7 @@ export default function HomePage() {
               quote: "We commissioned a corporate explainer video and Suhag delivered beyond expectations. The color grading is cinematic, and the animations are smooth and professional.",
               name: "Neha Desai",
               role: "Founder, Creative Solutions",
-              imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-happy-young-beauty-blogger-records-lifestyle-vlog-her-room-using-camera-with_1258-255016.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-happy-young-beauty-blogger-records-lifestyle-vlog-her-room-using-camera-with_1258-255016.jpg?_wi=1",
               imageAlt: "Neha Desai testimonial",
             },
             {
@@ -279,7 +279,7 @@ export default function HomePage() {
               quote: "I appreciated the willingness to make revisions until I was 100% happy. Suhag genuinely cares about client satisfaction and it shows in the final product.",
               name: "Vikram Singh",
               role: "Content Creator, VikramVlog",
-              imageSrc: "http://img.b2bpic.net/free-photo/female-video-creator-working-editing-movie-with-green-screen_482257-120096.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/female-video-creator-working-editing-movie-with-green-screen_482257-120096.jpg?_wi=3",
               imageAlt: "Vikram Singh testimonial",
             },
             {
@@ -288,7 +288,7 @@ export default function HomePage() {
               quote: "As a startup, budget matters. Suhag provided premium-quality editing at competitive rates. Worth every taka. Already using for all our video content.",
               name: "Tanvi Gupta",
               role: "Founder, StartUp Media",
-              imageSrc: "http://img.b2bpic.net/free-photo/colleagues-working-office-christmas-day-giving-presents_176420-8165.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/colleagues-working-office-christmas-day-giving-presents_176420-8165.jpg?_wi=1",
               imageAlt: "Tanvi Gupta testimonial",
             },
           ]}
@@ -311,7 +311,7 @@ export default function HomePage() {
             required: true,
           }}
           useInvertedBackground={false}
-          imageSrc="http://img.b2bpic.net/free-photo/colleagues-working-office-christmas-day-giving-presents_176420-8165.jpg"
+          imageSrc="http://img.b2bpic.net/free-photo/colleagues-working-office-christmas-day-giving-presents_176420-8165.jpg?_wi=2"
           imageAlt="Professional workspace"
           mediaAnimation="slide-up"
           mediaPosition="right"
-- 
2.49.1


From 6ee60a891ae8e8fa6cc58e0b00d53740dac0441f Mon Sep 17 00:00:00 2001
From: bender <kudin.dima@gmail.com>
Date: Sat, 7 Mar 2026 18:00:25 +0000
Subject: [PATCH 5/6] Update src/app/portfolio/page.tsx

---
 src/app/portfolio/page.tsx | 14 +++++++-------
 1 file changed, 7 insertions(+), 7 deletions(-)

diff --git a/src/app/portfolio/page.tsx b/src/app/portfolio/page.tsx
index 9559998..34a1981 100644
--- a/src/app/portfolio/page.tsx
+++ b/src/app/portfolio/page.tsx
@@ -82,7 +82,7 @@ export default function PortfolioPage() {
               title: "YouTube Channel Growth Campaign",
               description: "A comprehensive editing overhaul for a tech YouTuber. We implemented professional color grading, custom animations, and optimized thumbnails resulting in a 45% increase in average views.",
               tag: "YouTube Success",
-              imageSrc: "http://img.b2bpic.net/free-photo/black-woman-streamer-playing-space-shooter-videogames-with-joystick-talking-with-teammates-streaming-open-chat-cyber-performing-rgb-powerful-computer-gaming-room-using-professional-equipment_482257-12662.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/black-woman-streamer-playing-space-shooter-videogames-with-joystick-talking-with-teammates-streaming-open-chat-cyber-performing-rgb-powerful-computer-gaming-room-using-professional-equipment_482257-12662.jpg?_wi=3",
               imageAlt: "YouTube channel growth project",
               buttons: [{ text: "View Case Study", href: "https://www.instagram.com/suhagvisuals" }],
             },
@@ -91,7 +91,7 @@ export default function PortfolioPage() {
               title: "Viral Reels Campaign for E-Commerce Brand",
               description: "Created 12 trending reels for a fashion brand with fast-paced editing, trending audio, and eye-catching transitions. Campaign reached 2M+ impressions in 3 weeks.",
               tag: "Social Media Viral",
-              imageSrc: "http://img.b2bpic.net/free-photo/beautiful-young-blogger-women-posing-phone-camera_7502-7218.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/beautiful-young-blogger-women-posing-phone-camera_7502-7218.jpg?_wi=3",
               imageAlt: "Viral reels project",
               buttons: [{ text: "View More Reels", href: "https://www.instagram.com/suhagvisuals" }],
             },
@@ -100,7 +100,7 @@ export default function PortfolioPage() {
               title: "Corporate Product Explainer Video",
               description: "Delivered a 90-second corporate explainer video with professional motion graphics, seamless transitions, and cinematic color grading for a SaaS startup.",
               tag: "Corporate Video",
-              imageSrc: "http://img.b2bpic.net/free-photo/man-works-home-high-quality-photo_72229-927.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/man-works-home-high-quality-photo_72229-927.jpg?_wi=2",
               imageAlt: "Corporate explainer video project",
               buttons: [{ text: "Watch Video", href: "https://wa.me/8801339608124" }],
             },
@@ -124,7 +124,7 @@ export default function PortfolioPage() {
               quote: "After working with Suhag, our video quality improved dramatically. The editing is professional, the pacing is perfect, and our audience retention time went up by 35%. We've tripled our monthly ad revenue.",
               name: "Deepak Kumar",
               role: "Gaming Channel Owner",
-              imageSrc: "http://img.b2bpic.net/free-photo/female-video-creator-working-editing-movie-with-green-screen_482257-120096.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/female-video-creator-working-editing-movie-with-green-screen_482257-120096.jpg?_wi=4",
               imageAlt: "Deepak Kumar testimonial",
             },
             {
@@ -133,7 +133,7 @@ export default function PortfolioPage() {
               quote: "The reels Suhag created for us went viral multiple times. The editing style perfectly matches our brand, and the engagement rate is through the roof. We went from 10k to 25k followers in just 2 months.",
               name: "Aisha Patel",
               role: "Fashion Influencer",
-              imageSrc: "http://img.b2bpic.net/free-photo/beautiful-young-blogger-women-posing-phone-camera_7502-7218.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/beautiful-young-blogger-women-posing-phone-camera_7502-7218.jpg?_wi=4",
               imageAlt: "Aisha Patel testimonial",
             },
             {
@@ -142,7 +142,7 @@ export default function PortfolioPage() {
               quote: "Our podcast needed professional audio editing and Suhag delivered. The sound quality is crisp, the editing is seamless, and our listeners have commented multiple times about the audio clarity. Couldn't have asked for better.",
               name: "Rohan Gupta",
               role: "Podcast Producer",
-              imageSrc: "http://img.b2bpic.net/free-photo/man-works-home-high-quality-photo_72229-927.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/man-works-home-high-quality-photo_72229-927.jpg?_wi=3",
               imageAlt: "Rohan Gupta testimonial",
             },
           ]}
@@ -165,7 +165,7 @@ export default function PortfolioPage() {
             required: true,
           }}
           useInvertedBackground={false}
-          imageSrc="http://img.b2bpic.net/free-photo/colleagues-working-office-christmas-day-giving-presents_176420-8165.jpg"
+          imageSrc="http://img.b2bpic.net/free-photo/colleagues-working-office-christmas-day-giving-presents_176420-8165.jpg?_wi=4"
           imageAlt: "Professional workspace"
           mediaAnimation="slide-up"
           mediaPosition="right"
-- 
2.49.1


From 5177e2bc725ede3c8582aabbf4d2571e37f61cea Mon Sep 17 00:00:00 2001
From: bender <kudin.dima@gmail.com>
Date: Sat, 7 Mar 2026 18:00:25 +0000
Subject: [PATCH 6/6] Update src/app/services/page.tsx

---
 src/app/services/page.tsx | 18 +++++++++---------
 1 file changed, 9 insertions(+), 9 deletions(-)

diff --git a/src/app/services/page.tsx b/src/app/services/page.tsx
index 4bc0c0c..febd43b 100644
--- a/src/app/services/page.tsx
+++ b/src/app/services/page.tsx
@@ -53,7 +53,7 @@ export default function ServicesPage() {
               title: "YouTube Video Editing",
               description: "Full-length edits with professional color grading, captions, custom thumbnails, and optimized titles. Perfect for channels looking to scale.",
               tag: "YouTube",
-              imageSrc: "http://img.b2bpic.net/free-photo/content-creator-holding-recording-v-mount-battery-review-vlog-professional-acumulator-modern-v-lock-type-technology-social-media-star-influencer-online-distribution_482257-3815.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/content-creator-holding-recording-v-mount-battery-review-vlog-professional-acumulator-modern-v-lock-type-technology-social-media-star-influencer-online-distribution_482257-3815.jpg?_wi=2",
               imageAlt: "youtube video editing professional workflow"
             },
             {
@@ -61,7 +61,7 @@ export default function ServicesPage() {
               title: "Social Media Shorts / Reels / TikTok",
               description: "Fast-paced, eye-catching edits designed to grow your audience. Trending effects, quick cuts, and engaging transitions to maximize views.",
               tag: "Social Media",
-              imageSrc: "http://img.b2bpic.net/free-photo/friends-taking-photos-women-party_23-2149357778.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/friends-taking-photos-women-party_23-2149357778.jpg?_wi=2",
               imageAlt: "social media short form video editing"
             },
             {
@@ -69,7 +69,7 @@ export default function ServicesPage() {
               title: "Motion Graphics & Animations",
               description: "Professional logo intros, smooth transitions, visual effects, and animated overlays to elevate your video production quality.",
               tag: "Animation",
-              imageSrc: "http://img.b2bpic.net/free-photo/photo-editor-histogram-setting-concept_53876-120321.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/photo-editor-histogram-setting-concept_53876-120321.jpg?_wi=2",
               imageAlt: "motion graphics and animation design"
             },
             {
@@ -77,7 +77,7 @@ export default function ServicesPage() {
               title: "Podcast / Audio Editing",
               description: "Clean, professional sound editing for any platform. Noise reduction, background removal, mixing, and mastering for podcast-ready audio.",
               tag: "Audio",
-              imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-people-preparing-podcast_23-2149386533.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-people-preparing-podcast_23-2149386533.jpg?_wi=2",
               imageAlt: "podcast audio editing professional studio"
             },
             {
@@ -85,7 +85,7 @@ export default function ServicesPage() {
               title: "Color Grading & Correction",
               description: "Enhance your visuals with professional color grading. Cinematic looks, consistent color schemes, and correction for polished final results.",
               tag: "Color",
-              imageSrc: "http://img.b2bpic.net/free-vector/pricing-table-pack_23-2147728368.jpg",
+              imageSrc: "http://img.b2bpic.net/free-vector/pricing-table-pack_23-2147728368.jpg?_wi=2",
               imageAlt: "color grading and correction workflow"
             }
           ]}
@@ -108,7 +108,7 @@ export default function ServicesPage() {
               quote: "Suhag's professional editing increased our video quality dramatically. Within just two months, our watch time tripled and subscriber count doubled. The attention to detail is incredible.",
               name: "Aman Kumar",
               role: "YouTube Creator, Tech Reviews",
-              imageSrc: "http://img.b2bpic.net/free-photo/black-woman-streamer-playing-space-shooter-videogames-with-joystick-talking-with-teammates-streaming-open-chat-cyber-performing-rgb-powerful-computer-gaming-room-using-professional-equipment_482257-12662.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/black-woman-streamer-playing-space-shooter-videogames-with-joystick-talking-with-teammates-streaming-open-chat-cyber-performing-rgb-powerful-computer-gaming-room-using-professional-equipment_482257-12662.jpg?_wi=2",
               imageAlt: "Aman Kumar testimonial"
             },
             {
@@ -117,7 +117,7 @@ export default function ServicesPage() {
               quote: "Our Instagram reels are getting 10x more engagement now. Suhag knows exactly what trending content looks like and executes it flawlessly. Best decision for our marketing.",
               name: "Priya Sharma",
               role: "Marketing Manager, TechBrand Co.",
-              imageSrc: "http://img.b2bpic.net/free-photo/beautiful-young-blogger-women-posing-phone-camera_7502-7218.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/beautiful-young-blogger-women-posing-phone-camera_7502-7218.jpg?_wi=2",
               imageAlt: "Priya Sharma testimonial"
             },
             {
@@ -126,7 +126,7 @@ export default function ServicesPage() {
               quote: "Our podcast sounds absolutely professional now. Suhag's audio editing is top-notch - clean, crisp, and ready to publish. Listeners have commented on how much better we sound.",
               name: "Rajesh Patel",
               role: "Podcast Host, Tech Talk Daily",
-              imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-happy-young-beauty-blogger-records-lifestyle-vlog-her-room-using-camera-with_1258-255016.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-happy-young-beauty-blogger-records-lifestyle-vlog-her-room-using-camera-with_1258-255016.jpg?_wi=2",
               imageAlt: "Rajesh Patel testimonial"
             }
           ]}
@@ -164,7 +164,7 @@ export default function ServicesPage() {
             required: true
           }}
           useInvertedBackground={false}
-          imageSrc="http://img.b2bpic.net/free-photo/colleagues-working-office-christmas-day-giving-presents_176420-8165.jpg"
+          imageSrc="http://img.b2bpic.net/free-photo/colleagues-working-office-christmas-day-giving-presents_176420-8165.jpg?_wi=3"
           imageAlt="modern office contact communication setup"
           mediaAnimation="slide-up"
           mediaPosition="right"
-- 
2.49.1