import { HeroSection } from './components/HeroSection';
import { ScrollLockedSection } from './components/ScrollLockedSection';
import { CtaSection } from './components/CtaSection';
import { Footer } from '../../components/layout/Footer';

const highlightTextClass = 'text-brand-500';

const sections = [
  {
    id: 'datacenter-economy',
    eyebrow: 'Datacenter Economy',
    title: (
      <>
        The Datacenter Economy,{' '}
        <span className={highlightTextClass}>Decentralized</span>
      </>
    ),
    description:
      'GeoMind enables everyone to profit from Cloud and AI infrastructure at any scale. Deploy hardware, sell your capacity to the marketplace, earn from day one.',
    showButton: false,
  },
  {
    id: 'deploy-anywhere',
    eyebrow: 'Deployment Tiers',
    title: (
      <>
        <span className={highlightTextClass}>Deploy</span> Anywhere, Any Scale
      </>
    ),
    description:
      'Tier-H for homes and communities. Tier-S for enterprises and underutilized commercial space. Same economics, different scale.',
    buttonText: 'Explore Hardware Tiers',
    buttonLink: '/technology#hardware-tiers',
  },
  {
    id: 'autonomous-stack',
    eyebrow: 'Plug-and-Play',
    title: (
      <>
        Five Primitives, <span className={highlightTextClass}>Zero Dependencies</span>
      </>
    ),
    description:
      'Hardware ships with OS, Compute, Storage, Network, and GPU built-in. Fully autonomous operation eliminates vendor lock-in completely.',
    buttonText: 'Explore Software Stack',
    buttonLink: '/technology#software-stack',
  },
  {
    id: 'capacity-marketplace',
    eyebrow: 'Glocal Marketplace',
    title: (
      <>
        Local Hardware, <span className={highlightTextClass}>Global</span> Liquidity
      </>
    ),
    description: (
      <>
        Zero-OS partitions capacity into tradeable slices called <strong>Cloud Units (CU)</strong>. Use what you need. Sell idle capacity automatically on the marketplace.
      </>
    ),
    buttonText: 'Explore Marketplace',
    buttonLink: '/technology#marketplace',
  },
  {
    id: 'dual-revenue',
    eyebrow: 'Profit',
    title: (
      <>
        <span className={highlightTextClass}>Earn</span> While You Operate
      </>
    ),
    description:
      'Run your workloads during business hours. Rent excess capacity 24/7. Cloud capacity and infrastructure becomes an income-generating asset, not a cost center.',
    showButton: false,
  },
  {
    id: 'economic-advantage',
    eyebrow: 'Competitive Advantage',
    title: (
      <>
        <span className={highlightTextClass}>Lower Costs</span>, Higher Margins
      </>
    ),
    description:
      'Minimal datacenter build costs. Energy-efficient autonomous operation. No enterprise maintenance overhead. Your competitive advantage is built in.',
    showButton: false,
  },
  {
    id: 'instant-demand',
    eyebrow: 'Offtakers',
    title: (
      <>
        <span className={highlightTextClass}>Built-In</span> Customer Base
      </>
    ),
    description:
      'Initial enterprise offtake partners are in place. Deploy hardware, connect to marketplace, start earning. No customer acquisition needed.',
    buttonText: 'See Use Cases',
    buttonLink: '/usecases',
  },
];

export const HomePage = () => {
  return (
    <div className="flex min-h-screen flex-col bg-black text-white">
      <div className="flex flex-col">
        <HeroSection />
        {sections.map((section) => (
          <ScrollLockedSection key={section.id} {...section} />
        ))}
        <CtaSection />
      </div>
      <Footer />
    </div>
  );
};