"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="GRN GROUP"
                        navItems={[
                            { name: "Работы", id: "projects" },
                            { name: "О нас", id: "philosophy" },
                            { name: "Контакты", id: "contact" }
                        ]}
                        button={{
                            text: "Запрос",                            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="Архитектурная студия GRN GROUP"
                        description="20 лет опыта в строительстве и ремонтных работах. Создаем пространства, которые выдерживают испытание временем, сочетая сдержанность и точность. Каждый проект — это диалог между местом, материалом и намерением."
                        imagePosition="right"
                        imageSrc="https://img.b2bpic.net/free-photo/minimalist-architectural-building-details_23-2151870844.jpg"
                        imageAlt="modern building architecture minimalist interior concrete"
                        buttons={[
                            { text: "Смотреть работы", href: "projects" }
                        ]}
                        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="Мы верим, что архитектура должна говорить тихо. Хороший дизайн не требует объяснений — он существует с целью и сдержанностью, позволяя жильцам пользоваться пространством без отвлечения. Наша практика сосредоточена на понимании контекста, уважении к честности материалов и создании вневременных сред. Мы также предлагаем комплексный ремонт под ключ."
                        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="Избранные проекты"
                        description="Недавние работы, исследующие материальность, форму и пространственную целостность"
                        textboxLayout="default"
                        useInvertedBackground={true}
                        features={[
                            {
                                title: "Резиденция у реки",                                description: "Частный дом, органично вписанный в ландшафт. Бетон, стекло и дерево создают диалог между структурой и природой. Индивидуальный дизайн, учитывающий прибрежный контекст.",                                imageSrc: "https://img.b2bpic.net/free-photo/city-building-sky_23-2148107055.jpg"
                            },
                            {
                                title: "Корпоративная штаб-квартира",                                description: "Минималистичный офисный комплекс с акцентом на естественное освещение и подлинность материалов. Стальная конструкция с каменной облицовкой создает спокойную и сосредоточенную рабочую среду.",                                imageSrc: "https://img.b2bpic.net/free-photo/imposing-building-near-smaller-black-building_23-2148252731.jpg"
                            },
                            {
                                title: "Городская студия",                                description: "Адаптивное повторное использование промышленного склада под творческое рабочее пространство. Тщательное сохранение существующей структуры с сдержанными новыми вмешательствами.",                                imageSrc: "https://img.b2bpic.net/free-photo/concrete-structure-blue-sky_181624-5763.jpg"
                            },
                            {
                                title: "Ботанический павильон",                                description: "Общественная садовая структура, исследующая устойчивые материалы и прозрачный дизайн. Стальной каркас с живыми стенами создает проницаемое пространство для общественных собраний.",                                imageSrc: "https://img.b2bpic.net/free-photo/white-facade-modern-building_181624-6180.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="Наша практика"
                        description="Показатели, которые важны для нас. 20 лет успешной работы."
                        textboxLayout="default"
                        useInvertedBackground={false}
                        gridVariant="uniform-all-items-equal"
                        animationType="slide-up"
                        metrics={[
                            {
                                id: "1",                                value: "20+",                                description: "Лет на рынке"
                            },
                            {
                                id: "2",                                value: "120+",                                description: "Завершенных проектов"
                            },
                            {
                                id: "3",                                value: "4",                                description: "Главных архитекторов"
                            },
                            {
                                id: "4",                                value: "42",                                description: "Членов команды"
                            }
                        ]}
                        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="Свяжитесь с нами"
                        title="Обсудим ваш проект"
                        description="Мы ищем заказы, где вдумчивый дизайн и видение клиента совпадают. Расскажите нам о вашем пространстве, ваших стремлениях, ваших ограничениях."
                        useInvertedBackground={true}
                        imageSrc="https://img.b2bpic.net/free-photo/grey-concrete-building-blue-sky_181624-6496.jpg"
                        imageAlt="studio workspace architects design drafting collaboration"
                        mediaPosition="right"
                        mediaAnimation="slide-up"
                        inputPlaceholder="ваш@email.com"
                        buttonText="Отправить"
                        termsText="Мы ценим ваше обращение. Мы свяжемся с вами в течение 48 часов."
                        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="GRN GROUP"
                        columns={[
                            {
                                title: "Студия",                                items: [
                                    { label: "О нас", href: "philosophy" },
                                    { label: "Работы", href: "projects" }
                                ]
                            },
                            {
                                title: "Связь",                                items: [
                                    { label: "hello@grngroup.com", href: "mailto:hello@grngroup.com" },
                                    { label: "Контакты", href: "contact" }
                                ]
                            },
                            {
                                title: "Услуги",                                items: [
                                    { label: "Жилые объекты", href: "#" },
                                    { label: "Коммерческие объекты", href: "#" },
                                    { label: "Реконструкция", href: "#" },
                                    { label: "Ремонт под ключ", href: "#" }
                                ]
                            }
                        ]}
                        copyrightText="© 2025 GRN GROUP. Вневременная архитектура."
                        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>
    );
}