
import React from 'react';
import { Helmet } from 'react-helmet';
import { Link } from 'react-router-dom';
import { Button } from '@/components/ui/button.jsx';
import { Card, CardContent } from '@/components/ui/card.jsx';
import { Sparkles, Layers, Infinity, ShieldCheck, ArrowRightLeft } from 'lucide-react';

export default function PatrimonioTecnologicoPage() {
  return (
    <>
      <Helmet>
        <title>Patrimônio Tecnológico™ | LCP Valuation</title>
        <meta name="description" content="Tecnologia transformada em patrimônio. A nova categoria de valorização imobiliária." />
      </Helmet>

      <main className="min-h-screen pt-24 bg-background">
        <section className="py-24 max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 text-center border-b border-border">
          <div className="mb-12">
            <div className="text-primary font-bold tracking-widest text-sm mb-4">NOVA CATEGORIA</div>
            <h1 className="text-5xl md:text-7xl font-bold mb-8 text-balance">Patrimônio Tecnológico™</h1>
            <p className="text-xl text-foreground/80 leading-relaxed mb-6">
              A arquitetura constrói os espaços. A decoração veste os ambientes. A tecnologia cria a alma da casa. Mas apenas o <strong>Patrimônio Tecnológico™</strong> garante que esse ecossistema seja um ativo de valor tangível.
            </p>
          </div>
        </section>

        <section className="py-24 bg-secondary">
          <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
            <div className="grid md:grid-cols-2 gap-16 items-center">
              <div className="prose prose-lg dark:prose-invert prose-headings:font-bold max-w-none text-secondary-foreground/80">
                <h2 className="text-3xl mb-6 text-secondary-foreground">O que é?</h2>
                <p>
                  Historicamente, sistemas de automação e equipamentos de áudio/vídeo eram vistos como despesas. Gadgets isolados que ficavam obsoletos rapidamente. O conceito de Patrimônio Tecnológico™, cunhado e chancelado pela LCP, inverte essa lógica.
                </p>
                <p>
                  Trata-se da infraestrutura tecnológica projetada, documentada e mantida como um ativo estrutural do imóvel, atestado pelo Passaporte Tecnológico™. É a garantia para compradores e investidores de que a inteligência da casa possui valor duradouro de revenda.
                </p>
              </div>
              <div className="relative">
                 <img src="https://images.unsplash.com/photo-1691566766396-a353cd124a27" alt="Interior Sofisticado" className="rounded-2xl object-cover h-[400px] w-full shadow-2xl" />
                 <div className="absolute inset-0 ring-1 ring-inset ring-border/20 rounded-2xl pointer-events-none" />
              </div>
            </div>
          </div>
        </section>

        <section className="py-24 bg-background">
          <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
            <div className="text-center mb-16">
              <h2 className="text-3xl md:text-5xl font-bold mb-4">Os 5 Elementos do Patrimônio Tecnológico™</h2>
              <p className="text-lg text-foreground/70 max-w-2xl mx-auto">As bases que sustentam o valor e a perenidade da tecnologia aplicada ao alto padrão.</p>
            </div>

            <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-5 gap-6">
              <Card className="bg-card border-border hover:border-primary/40 transition-colors lg:col-span-2">
                <CardContent className="p-8">
                  <Sparkles className="h-8 w-8 text-primary mb-4" />
                  <h3 className="font-bold text-xl mb-3">Experiência</h3>
                  <p className="text-card-foreground/70 text-sm leading-relaxed">Ambientes mais intuitivos, confortáveis e sofisticados. A tecnologia eleva a percepção de moradia e entrega o verdadeiro luxo: a ausência de atrito.</p>
                </CardContent>
              </Card>
              <Card className="bg-card border-border hover:border-primary/40 transition-colors lg:col-span-3">
                <CardContent className="p-8">
                  <Layers className="h-8 w-8 text-primary mb-4" />
                  <h3 className="font-bold text-xl mb-3">Integração</h3>
                  <p className="text-card-foreground/70 text-sm leading-relaxed">Sistemas dispersos causam dor de cabeça. O Patrimônio Tecnológico exige que iluminação, clima, mídia e segurança funcionem como um único ecossistema orgânico e centralizado.</p>
                </CardContent>
              </Card>
              <Card className="bg-card border-border hover:border-primary/40 transition-colors lg:col-span-2">
                <CardContent className="p-8">
                  <Infinity className="h-8 w-8 text-primary mb-4" />
                  <h3 className="font-bold text-xl mb-3">Continuidade</h3>
                  <p className="text-card-foreground/70 text-sm leading-relaxed">A tecnologia evolui junto com o imóvel. Sem abandono pós-obra, garantimos atualizações e suporte contínuo para evitar a obsolescência.</p>
                </CardContent>
              </Card>
              <Card className="bg-card border-border hover:border-primary/40 transition-colors lg:col-span-2">
                <CardContent className="p-8">
                  <ShieldCheck className="h-8 w-8 text-primary mb-4" />
                  <h3 className="font-bold text-xl mb-3">Certificação</h3>
                  <p className="text-card-foreground/70 text-sm leading-relaxed">O valor não é subjetivo. Ele é atestado de forma técnica e documental através da chancela e da Certificação CVT™.</p>
                </CardContent>
              </Card>
              <Card className="bg-card border-border hover:border-primary/40 transition-colors lg:col-span-1 md:col-span-2">
                <CardContent className="p-8 flex flex-col items-start justify-center h-full">
                  <ArrowRightLeft className="h-8 w-8 text-primary mb-4" />
                  <h3 className="font-bold text-xl mb-3">Transferência</h3>
                  <p className="text-card-foreground/70 text-sm leading-relaxed">O patrimônio tecnológico acompanha o imóvel ao longo do tempo de maneira segura.</p>
                </CardContent>
              </Card>
            </div>
          </div>
        </section>

        <section className="py-24 bg-secondary border-y border-border overflow-hidden relative">
          <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
            <div className="grid md:grid-cols-2 gap-16 items-center">
              <div className="order-2 md:order-1 relative">
                 <img src="https://images.unsplash.com/photo-1699225741963-5e8e15e40719" alt="Alto Padrão" className="rounded-2xl object-cover h-[500px] w-full shadow-2xl" />
              </div>
              <div className="order-1 md:order-2">
                <h2 className="text-3xl md:text-4xl font-bold mb-6 text-secondary-foreground">Por Que Isso Importa?</h2>
                <div className="prose prose-lg dark:prose-invert text-secondary-foreground/80 leading-relaxed mb-10">
                  <p>
                    Compradores de alto padrão não compram mais apenas metros quadrados e tijolos. Eles adquirem experiências integradas e qualidade de vida ininterrupta.
                  </p>
                  <p>
                    Um imóvel que ostenta um Patrimônio Tecnológico chancelado garante ao comprador que ele não herdará problemas técnicos ou sistemas engessados, mas sim uma infraestrutura pensada para recebê-lo de forma fluida. O resultado comercial é liquidez e um prêmio de valor perceptível no momento do fechamento.
                  </p>
                </div>

                <h2 className="text-3xl md:text-4xl font-bold mb-6 text-secondary-foreground">Patrimônio Que Evolui</h2>
                <div className="prose prose-lg dark:prose-invert text-secondary-foreground/80 leading-relaxed">
                  <p>
                    Ao contrário de acabamentos estáticos que degradam com o tempo, a infraestrutura certificada possibilita atualizações de software e hardware sem intervenções brutais. É um ativo em constante crescimento e valorização.
                  </p>
                </div>
              </div>
            </div>
          </div>
        </section>

        <section className="py-24 bg-background">
          <div className="max-w-4xl mx-auto px-4 text-center">
             <div className="bg-primary/5 p-10 md:p-16 rounded-3xl border border-primary/20">
                <h2 className="text-3xl md:text-4xl font-bold mb-6 text-foreground">Visão Para Investidores</h2>
                <p className="text-lg text-foreground/80 leading-relaxed mb-8">
                  Enxergamos a adoção precoce de tecnologias certificadas como o maior diferencial competitivo atual para construtoras e investidores. Assim como as certificações verdes redefiniram os edifícios corporativos na última década, o Patrimônio Tecnológico™ está redefinindo o ágio no residencial premium hoje.
                </p>
                <Button asChild size="lg" className="bg-primary text-primary-foreground">
                  <Link to="/avaliacao-exclusiva">Solicitar Avaliação Exclusiva</Link>
                </Button>
             </div>
          </div>
        </section>
      </main>
    </>
  );
}
