import { useEffect } from 'react'
import NavBar from './components/NavBar'
import Introduction from './sections/Introduction'
import Philosophy from './sections/Philosophy'
import SkillsGallery from './sections/SkillsGallery'
import Experience from './sections/Experience'
import Credentials from './sections/Credentials'

export default function App() {
  useEffect(() => {
    // Smooth scroll for anchor links
    document.documentElement.style.scrollBehavior = 'smooth'
    return () => {
      document.documentElement.style.scrollBehavior = ''
    }
  }, [])

  return (
    <div className="min-h-screen bg-slate-50 text-slate-800">
      <NavBar />
      <main className="pt-16">
        <Introduction />
        <Philosophy />
        <SkillsGallery />
        <Experience />
        <Credentials />
      </main>
    </div>
  )
}
