(function(){const grid=document.getElementById('stepsGridMob');const cards=Array.from(grid.querySelectorAll('.step-card-mob'));const descTitle=document.getElementById('descTitleMob');const descText=document.getElementById('descTextMob');let currentIndex=0;function setDescription(index){const card=cards[index];descTitle.textContent=card.dataset.title;descText.textContent=card.dataset.desc;cards.forEach((c,i)=>c.classList.toggle('active-mob',i===index));currentIndex=index;}function getClosestCard(){const gridRect=grid.getBoundingClientRect();const gridCenter=gridRect.left+gridRect.width/2;let closest=cards[0];let minDist=Infinity;cards.forEach(card=>{const cardRect=card.getBoundingClientRect();const cardCenter=cardRect.left+cardRect.width/2;const dist=Math.abs(cardCenter-gridCenter);if(dist<minDist){minDist=dist;closest=card;}});return closest;}grid.addEventListener('scroll',()=>{const closest=getClosestCard();const newIndex=cards.indexOf(closest);if(newIndex!==currentIndex){setDescription(newIndex);}},{passive:true});cards.forEach((card,index)=>{card.addEventListener('click',()=>{card.scrollIntoView({behavior:'auto',block:'nearest',inline:'center'});});});if(cards.length>0){setDescription(0);}})();