import { Box } from '@chakra-ui/react'
import Hero1 from '../components/hero1'
import Hero2 from '../components/hero2'
import Compare from '../components/compare'
import Qa from '../components/qa'
import Oil_info from '../components/oil_info'
import Bestoil from '../components/bestoil'
import Salespoint from '../components/salespoint'
import Header2 from '@/components/header2'
function HomePage() {
  return (
    <>
      <Header2 />
      <Hero1 />
      <Box mt={{ base: "-5vw", sm: "-5vw", md: "-5vw", lg: "-5vw", xl: "-5vw" }}>
        <Hero2 />
      </Box>
      <Compare />
      <Box mt={{ base: "-15vw", sm: "-15vw", md: "0vw", lg: "0vw", xl: "0vw" }}>
        <Qa />
      </Box>
      <Box>
        <Oil_info />
      </Box>
      <Box>
        <Bestoil />
      </Box>
      <Box my={8}>
        <Salespoint />
      </Box>
    </>
  )
}

export default HomePage