spb/phi-conseil

1import type { Metadata } from "next";2import { home, pages } from "@/lib/content";3import { pageMetadata } from "@/lib/seo";4import { SectionTitle } from "@/components/ui/SectionTitle";5import { ServiceIcon } from "@/components/ui/ServiceIcon";6import { Button } from "@/components/ui/Button";78export const metadata: Metadata = pageMetadata({9  title: pages.services.title,10  description: pages.services.seoDescription,11  path: "/services",12});1314export default function ServicesPage() {15  return (16    <>17      <section className="section-y bg-ivory-100">18        <div className="container-site">19          <SectionTitle as="h1" id="services-title">20            {pages.services.title}21          </SectionTitle>22          <p className="text-lead text-ink-700 mx-auto mt-6 max-w-[42rem] text-center">23            {pages.services.intro}24          </p>25        </div>26      </section>27      <section className="section-y bg-ivory-50" aria-label="Détail des services">28        <div className="container-site grid gap-8 md:grid-cols-2">29          {home.services.items.map((s) => (30            <article31              key={s.slug}32              id={s.slug}33              className="border-pale-300/70 scroll-mt-28 rounded-[var(--radius-lg)] border bg-white/60 p-7 md:p-9"34            >35              <span className="bg-pale-200 text-navy-800 flex h-14 w-14 items-center justify-center rounded-full">36                <ServiceIcon name={s.icon} className="h-7 w-7" />37              </span>38              <h2 className="text-h4 mt-5">{s.title}</h2>39              <p className="text-ink-900 mt-3">{s.summary}</p>40              {s.description ? <p className="text-ink-700 mt-3">{s.description}</p> : null}41            </article>42          ))}43        </div>44        <div className="container-site mt-12 text-center">45          <Button href="/nous-joindre" size="lg">46            Discuter de votre projet47          </Button>48        </div>49      </section>50    </>51  );52}53