"use client";

import ReactLenis from "lenis/react";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
import HeroSplit from "@/components/sections/hero/HeroSplit";
import TextAbout from "@/components/sections/about/TextAbout";
import FeatureCardSix from "@/components/sections/feature/FeatureCardSix";
import MetricCardTwo from "@/components/sections/metrics/MetricCardTwo";
import ContactSplit from "@/components/sections/contact/ContactSplit";
import FooterBaseReveal from "@/components/sections/footer/FooterBaseReveal";

export default function ArchitectureStudioPage() {
    return (
        <ThemeProvider
            defaultButtonVariant="expand-hover"
            defaultTextAnimation="reveal-blur"
            borderRadius="soft"
            contentWidth="smallMedium"
            sizing="largeSizeMediumTitles"
            background="aurora"
            cardStyle="glass-elevated"
            primaryButtonStyle="double-inset"
            secondaryButtonStyle="solid"
            headingFontWeight="bold"
        >
            <ReactLenis root>
                <div id="nav" data-section="nav">
                    <NavbarLayoutFloatingInline
                        brandName="PubliFlow"
                        navItems={[
                            { name: "Fonctionnalités", id: "projects" },
                            { name: "Pourquoi PubliFlow?", id: "philosophy" },
                            { name: "Contact", id: "contact" }
                        ]}
                        button={{
                            text: "Essai Gratuit",                            href: "contact"
                        }}
                        className="text-xs tracking-widest uppercase"
                        navItemClassName="text-sm font-light tracking-wide"
                        buttonClassName="px-6 py-2 text-sm tracking-widest uppercase"
                    />
                </div>

                <div id="hero" data-section="hero">
                    <HeroSplit
                        background={{ variant: "plain" }}
                        title="PubliFlow: Votre Studio d'Édition Tout-en-Un."
                        description="Centralisez, collaborez et publiez avec notre suite dédiée aux éditeurs et auteurs freelances. De la première ébauche au livre final, gérez tout en un seul lieu."
                        imagePosition="right"
                        imageSrc="http://img.b2bpic.net/free-photo/successful-corporation-young-business-team_1423-247.jpg"
                        imageAlt="Bureau moderne avec ordinateur portable affichant un logiciel d'édition de livres"
                        buttons={[
                            { text: "Découvrir les Fonctionnalités", href: "projects" },
                            { text: "Commencer l'Essai", href: "contact" }
                        ]}
                        mediaAnimation="slide-up"
                        className="py-24 md:py-32"
                        containerClassName="max-w-7xl"
                        titleClassName="text-5xl md:text-7xl font-light tracking-tight leading-tight"
                        descriptionClassName="text-sm md:text-xl font-light leading-relaxed"
                        buttonClassName="px-8 py-3 text-sm tracking-widest uppercase mt-2"
                    />
                </div>

                <div id="philosophy" data-section="philosophy">
                    <TextAbout
                        title="Libérez votre potentiel éditorial. PubliFlow est conçu pour simplifier chaque étape du processus, vous permettant de vous concentrer sur l'essentiel : créer et publier des œuvres exceptionnelles. Finis les outils dispersés, bonjour l'efficacité."
                        useInvertedBackground={false}
                        className="py-32 md:py-48"
                        containerClassName="max-w-4xl"
                        titleClassName="text-3xl md:text-5xl font-light leading-relaxed text-center"
                    />
                </div>

                <div id="projects" data-section="projects">
                    <FeatureCardSix
                        title="Fonctionnalités Clés"
                        description="Une suite complète pour maîtriser chaque aspect de votre projet éditorial."
                        textboxLayout="default"
                        useInvertedBackground={true}
                        features={[
                            {
                                title: "1. Édition & Création Collaborative",                                description: "Éditeur de texte en temps réel, gestion avancée des versions et annotations contextuelles pour une collaboration fluide.",                                imageSrc: "http://img.b2bpic.net/free-photo/laptop-notebook-wooden-desk_181624-22372.jpg"
                            },
                            {
                                title: "2. CRM & Pipeline Éditorial",                                description: "Kanban de suivi des manuscrits, gestion centralisée des contacts et historique des communications pour une organisation sans faille.",                                imageSrc: "http://img.b2bpic.net/free-photo/female-web-designer-with-papers-notes-office_23-2149749882.jpg"
                            },
                            {
                                title: "3. Pilotage Financier & Administratif",                                description: "Suivi des royalties et contrats, privilèges partenaires exclusifs et facturation intégrée pour une gestion sereine.",                                imageSrc: "http://img.b2bpic.net/free-photo/old-woman-reads-news-laptop-closeup-hands_169016-27302.jpg"
                            },
                            {
                                title: "4. Automatisation & Finalisation",                                description: "Export multiformat, rapports de lecture générés et gestion des deadlines pour une publication efficace.",                                imageSrc: "http://img.b2bpic.net/free-photo/woman-reading-book-side-view_23-2149887873.jpg"
                            }
                        ]}
                        className="py-32 md:py-48"
                        textBoxTitleClassName="text-4xl md:text-6xl font-light tracking-tight"
                        textBoxDescriptionClassName="text-base md:text-lg font-light"
                        cardTitleClassName="text-4xl md:text-5xl font-light tracking-tight mb-4"
                        cardDescriptionClassName="text-lg md:text-xl font-light leading-relaxed"
                        stepNumberClassName="mb-4"
                    />
                </div>

                <div id="metrics" data-section="metrics">
                    <MetricCardTwo
                        title="L'Impact PubliFlow"
                        description="Des chiffres qui parlent de notre engagement envers votre succès."
                        textboxLayout="default"
                        useInvertedBackground={false}
                        gridVariant="uniform-all-items-equal"
                        animationType="slide-up"
                        metrics={[
                            {
                                id: "1",                                value: "1000+",                                description: "Éditeurs & Auteurs"
                            },
                            {
                                id: "2",                                value: "5000+",                                description: "Projets Gérés"
                            },
                            {
                                id: "3",                                value: "98%",                                description: "Satisfaction Client"
                            },
                            {
                                id: "4",                                value: "30%",                                description: "Gain de Temps Moyen"
                            }
                        ]}
                        className="py-24 md:py-32"
                        textBoxTitleClassName="text-4xl md:text-6xl font-light tracking-tight"
                        textBoxDescriptionClassName="text-base md:text-lg font-light"
                        valueClassName="text-9xl md:text-7xl font-light"
                        metricDescriptionClassName="text-sm md:text-base font-light uppercase tracking-wide"
                    />
                </div>

                <div id="contact" data-section="contact">
                    <ContactSplit
                        background={{ variant: "plain" }}
                        tag="Lancez-vous"
                        title="Prêt à Transformer Votre Édition?"
                        description="Rejoignez la communauté PubliFlow et découvrez comment notre plateforme peut révolutionner votre quotidien d'éditeur ou d'auteur freelance."
                        useInvertedBackground={true}
                        imageSrc="http://img.b2bpic.net/free-photo/office-desk-still-life_23-2148111406.jpg"
                        imageAlt="Personne travaillant sur un ordinateur portable dans un espace moderne et lumineux"
                        mediaPosition="right"
                        mediaAnimation="slide-up"
                        inputPlaceholder="Votre email professionnel"
                        buttonText="Démarrer l'Essai Gratuit"
                        termsText="En vous inscrivant, vous acceptez nos conditions d'utilisation."
                        className="py-32 md:py-48"
                        tagClassName="text-sm uppercase tracking-widest"
                        titleClassName="text-4xl md:text-5xl font-light tracking-tight leading-tight mt-4"
                        descriptionClassName="text-base md:text-lg font-light leading-relaxed mt-3"
                        buttonClassName="px-8 py-3 text-sm tracking-widest uppercase"
                        termsClassName="text-sm font-light mt-4"
                    />
                </div>

                <div id="footer" data-section="footer">
                    <FooterBaseReveal
                        logoText="PubliFlow"
                        columns={[
                            {
                                title: "Produit",                                items: [
                                    { label: "Fonctionnalités", href: "projects" },
                                    { label: "Essai Gratuit", href: "contact" }
                                ]
                            },
                            {
                                title: "Ressources",                                items: [
                                    { label: "Aide", href: "#" },
                                    { label: "Blog", href: "#" }
                                ]
                            },
                            {
                                title: "Entreprise",                                items: [
                                    { label: "À Propos", href: "philosophy" },
                                    { label: "Contact", href: "contact" }
                                ]
                            }
                        ]}
                        copyrightText="© 2024 PubliFlow. Tous droits réservés."
                        className="mt-0"
                        columnTitleClassName="text-base uppercase tracking-widest font-light mb-0"
                        columnItemClassName="text-base font-light"
                        copyrightTextClassName="text-sm font-light"
                    />
                </div>
            </ReactLenis>
        </ThemeProvider>
    );
}