document.addEventListener('DOMContentLoaded', function () {
var hero = document.querySelector('.bridge-hero');
if (!hero) return;
// 1) Letters ko animate karo jab hero viewport mein aaye
var observer = new IntersectionObserver(function (entries) {
entries.forEach(function (entry) {
if (entry.isIntersecting) {
hero.classList.add('show-rest'); // o, a, a, d slide in
}
});
}, {
threshold: 0.4
});
observer.observe(hero);
// 2) Scroll ke hisaab se big S ko grow karo (Bridge style)
function handleScroll() {
var rect = hero.getBoundingClientRect();
var windowHeight = window.innerHeight || document.documentElement.clientHeight;
// hero ka top screen ke kis hisse par hai
var triggerLine = windowHeight * 0.35; // screen ke 35% height par line
if (rect.top < triggerLine && rect.bottom > triggerLine) {
// user hero ke beech mein hai → S bohat bada
hero.classList.add('big-letter');
} else {
// upar ya neeche chala gaya → normal size
hero.classList.remove('big-letter');
}
}
window.addEventListener('scroll', handleScroll);
handleScroll(); // page load par bhi check
});