"use client";

import dynamic from "next/dynamic";
import { Suspense } from "react";
import About from "./components/About";
import Contact from "./components/Contact";
import Experience from "./components/Experience";
import Footer from "./components/Footer";
import Hero from "./components/Hero";
import { SectionLoading } from "./components/SectionLoading";
import Skills from "./components/Skills";
import { WorkModalities } from "./components/WorkModalities";

const Projects = dynamic(() => import("./components/Projects"));

export default function Home() {
  return (
    <div className="flex min-h-screen flex-col overflow-x-hidden">
      <main className="ds-main">
        <Hero />
        <About />
        <Skills />
        <Experience />
        <Suspense
          fallback={<SectionLoading message="Carregando projetos..." />}
        >
          <Projects />
        </Suspense>
        <WorkModalities />
        <Contact />
      </main>
      <Footer />
    </div>
  );
}