#brxe-3e661e {
position: sticky;
top: 0;
z-index: 9999;
background-color: transparent;
transform: translateY(0);
opacity: 1;
transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.6s cubic-bezier(0.4, 0, 0.2, 1);
will-change: transform, opacity;
}
#brxe-3e661e.hide {
transform: translateY(-100%);
opacity: 0;
pointer-events: none;
}
#brxe-3e661e.bg-visible {
background: linear-gradient(180deg, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0) 100%) !important;
}
document.addEventListener("DOMContentLoaded", () => {
const header = document.querySelector("#brxe-3e661e");
if (!header) return;
let lastScrollY = window.scrollY;
const threshold = 100;
let ticking = false;
function updateHeader() {
const currentScrollY = window.scrollY;
const scrollingDown = currentScrollY > lastScrollY;
if (scrollingDown && currentScrollY > threshold) {
header.classList.add("hide");
header.classList.remove("bg-visible");
} else {
header.classList.remove("hide");
if (currentScrollY > threshold) {
header.classList.add("bg-visible");
} else {
header.classList.remove("bg-visible");
}
}
lastScrollY = currentScrollY;
ticking = false;
}
window.addEventListener("scroll", () => {
if (!ticking) {
requestAnimationFrame(updateHeader);
ticking = true;
}
});
});