function App() {
  const [lang, setLangRaw] = React.useState(() => localStorage.getItem('best-lang') || 'th');
  const setLang = (l) => { setLangRaw(l); localStorage.setItem('best-lang', l); };
  // Only support 3 main languages for content; others fall back to EN
  const contentLang = ['th','en','zh'].includes(lang) ? lang : 'en';
  const [overDark, setOverDark] = React.useState(true);
  React.useEffect(() => {
    const onScroll = () => {
      const hero = document.getElementById('hero');
      if (!hero) return;
      const heroBottom = hero.offsetTop + hero.offsetHeight;
      setOverDark(window.scrollY < heroBottom - 80);
    };
    window.addEventListener('scroll', onScroll);
    return () => window.removeEventListener('scroll', onScroll);
  }, []);
  return (
    <>
      <Nav lang={lang} setLang={setLang} overDark={overDark} />
      <Hero lang={contentLang} />
      <Stats lang={contentLang} />
      <About lang={contentLang} />
      <Services lang={contentLang} />
      <Certs lang={contentLang} />
      <Gallery lang={contentLang} />
      <Clients lang={contentLang} />
      <News lang={contentLang} />
      <Careers lang={contentLang} />
      <Quote lang={contentLang} />
      <Contact lang={contentLang} />
      <Footer lang={contentLang} />
      <ChatWidget />
      <CookieBanner />
    </>
  );
}
ReactDOM.createRoot(document.getElementById('root')).render(<App />);