/* Scoped to: interior-product-showcase-template-crafting */
(function() {
  'use strict';
  var componentRoots = document.querySelectorAll('[data-component-slug="interior-product-showcase-template-crafting"]');
  componentRoots.forEach(function(componentRoot) {
    // Helper to query within component, with fallback to document for sibling elements
    var $ = function(sel) { 
      return componentRoot.querySelector(sel) || document.querySelector('[data-component-slug="interior-product-showcase-template-crafting"] ~ ' + sel) || document.querySelector(sel);
    };
    var $$ = function(sel) { 
      var results = componentRoot.querySelectorAll(sel);
      return results.length ? results : document.querySelectorAll(sel);
    };
    // Original component JS runs in this scope
    (function() { const section = document.currentScript.closest('.crafting-section'); const textEl = section.querySelector('.crafting-text'); if (!textEl) return; const fullText = textEl.textContent.trim(); textEl.innerHTML = ""; const chars = []; fullText.split("").forEach(char => { const span = document.createElement("span"); span.textContent = char; span.style.color = "#999999"; textEl.appendChild(span); chars.push(span); }); function handleScroll() { const rect = textEl.getBoundingClientRect(); const windowHeight = window.innerHeight; const start = windowHeight * 0.85; const end = windowHeight * 0.3; let progress = (start - rect.top) / (start - end); progress = Math.min(Math.max(progress, 0), 1); const visibleChars = Math.floor(progress * chars.length); chars.forEach((char, i) => { char.style.color = i < visibleChars ? "#000000" : "#999999"; }); } window.addEventListener('scroll', handleScroll); window.addEventListener('resize', handleScroll); handleScroll(); })();
  });
})();