import Navbar from '@/components/landing/Navbar';
import Hero from '@/components/landing/Hero';
import Features from '@/components/landing/Features';
import HowItWorks from '@/components/landing/HowItWorks';
import Pricing from '@/components/landing/Pricing';

const TRUST_LOGOS = ['odoo', 'ACSONE', 'VENTURE', 'CYBROSYS', 'Camptocamp', 'Shuva', 'PRAGMATIC'];

export default function Landing() {
  return (
    <>
      <Navbar />
      <main>
        <Hero />
        <Features />
        <HowItWorks />
        <Pricing />

        {/* Trust logos */}
        <section className="py-12 border-t border-gray-100">
          <div className="max-w-7xl mx-auto px-4 text-center">
            <p className="text-xs text-gray-400 mb-6 uppercase tracking-widest">
              Trusted by Odoo professionals teams worldwide
            </p>
            <div className="flex flex-wrap items-center justify-center gap-8">
              {TRUST_LOGOS.map((name) => (
                <span key={name} className="text-sm font-semibold text-gray-400 hover:text-gray-600 transition-colors">
                  {name}
                </span>
              ))}
            </div>
          </div>
        </section>

        {/* Footer */}
        <footer id="contact" className="bg-gray-900 text-gray-400 py-12">
          <div className="max-w-7xl mx-auto px-4 flex flex-col sm:flex-row justify-between gap-6 text-xs">
            <div>
              <div className="flex items-center gap-2 mb-2">
                <div className="w-6 h-6 rounded gradient-brand" />
                <span className="text-white font-semibold text-sm">OdooMCP Cloud</span>
              </div>
              <p>Secure MCP Server for Odoo ERP</p>
              <p className="mt-3">
                <a href="mailto:hello@odoomcp.cloud" className="hover:text-white transition-colors">
                  hello@odoomcp.cloud
                </a>
              </p>
            </div>
            <div className="flex gap-12">
              <div className="space-y-2">
                <p className="text-white font-medium">Product</p>
                <p><a href="#features" className="hover:text-white transition-colors">Features</a></p>
                <p><a href="#pricing" className="hover:text-white transition-colors">Pricing</a></p>
              </div>
              <div className="space-y-2">
                <p className="text-white font-medium">Company</p>
                <p><a href="#contact" className="hover:text-white transition-colors">Contact</a></p>
              </div>
            </div>
          </div>
          <div className="max-w-7xl mx-auto px-4 mt-8 pt-6 border-t border-gray-800 text-xs text-center">
            © {new Date().getFullYear()} OdooMCP Cloud. All rights reserved.
          </div>
        </footer>
      </main>
    </>
  );
}