function BStickyAsk() {
  const [show, setShow] = React.useState(false);

  React.useEffect(() => {
    function onScroll() {
      const hero = document.getElementById('b-hero');
      const ask = document.getElementById('b-ask');
      const pastHero = hero ? hero.getBoundingClientRect().bottom < 0 : false;
      const askVisible = ask
        ? ask.getBoundingClientRect().top < window.innerHeight && ask.getBoundingClientRect().bottom > 0
        : false;
      setShow(pastHero && !askVisible);
    }
    window.addEventListener('scroll', onScroll, { passive: true });
    onScroll();
    return () => window.removeEventListener('scroll', onScroll);
  }, []);

  function go() {
    const ask = document.getElementById('b-ask');
    if (ask) ask.scrollIntoView({ behavior: 'smooth', block: 'start' });
  }

  return (
    <div className={'b-sticky' + (show ? '' : ' is-hidden')}>
      <button type="button" onClick={go}>Fit-Check anfragen</button>
    </div>
  );
}
