/**
 * App entry. Mounts the single-page portfolio with a full-bleed fluid
 * background and the dark vignette overlay that keeps copy readable.
 */

const App = () => {
  const [lang, setLang] = React.useState('ru');

  return (
    <div style={{ background: 'var(--color-midnight-abyss)', color: 'var(--color-comet)', position: 'relative', overflow: 'hidden', minHeight: '100vh' }}>
      <div className="fixed-smoke" aria-hidden="true">
        <div className="smoke-sim">
          <FluidShader />
        </div>
      </div>

      <div style={{ position: 'relative', zIndex: 1 }}>
        <Topbar lang={lang} setLang={setLang} />
        <Hero    lang={lang} />
        <Services lang={lang} />
        <Cases    lang={lang} />
        <Contact  lang={lang} />
        <Footer   lang={lang} />
      </div>
    </div>
  );
};

ReactDOM.createRoot(document.getElementById('root')).render(<App />);