import Header from './components/Header';
import Hero from './components/Hero';
import DownloadSection from './components/DownloadSection';
import Features from './components/Features';
import WhatYouCanDo from './components/WhatYouCanDo';
import WhyAramland from './components/WhyAramland';
import FreeTrial from './components/FreeTrial';
import BlogSection from './components/BlogSection';
// import ScientificBenefits from './components/ScientificBenefits';
import CallToAction from './components/CallToAction';
import Footer from './components/Footer';
import { SEOHead } from './components/SEOHead';

function App() {
  return (
    <>

      <SEOHead
        title="آرام جان - تمرین تنفسی و مدیتیشن"
        description="اپلیکیشن آرام جان - همراه شما برای رسیدن به آرامش درونی با مدیتیشن‌های فارسی، تمرین‌های تنفسی و موسیقی آرامش‌بخش"
        canonical="/" ogImage="../app/og-image.png" />

      <div className="min-h-screen bg-gradient-to-b from-blue-50 via-white to-green-50" dir="rtl">
        <Header />

        <main className="max-w-5xl mx-auto px-6 sm:px-8 lg:px-10 py-24 space-y-32">

          <div id="download">
            <Hero />
          </div>

          <div id="features">
            <Features />
          </div>

          <div id="what-you-can-do">
            <WhatYouCanDo />
          </div>

          <div id="why-aramland">
            <WhyAramland />
          </div>
          <BlogSection />
          <div id="free-trial">
            <FreeTrial />
          </div>

          <div id="call-to-action">
            <CallToAction />
          </div>
        </main>
        <div id='footer'>
          <Footer />
        </div>
      </div>
    </>
  );
}

export default App;