Frontend: Update ChiSiamo and Proprietari pages with new layout and images for improved visual appeal

apps/infoalloggi/src/pages/chi-siamo.tsx

@@ -1,5 +1,8 @@
+import { ArrowRight } from "lucide-react";
 import type { NextPage } from "next";
 import Head from "next/head";
+import Image from "next/image";
+import Link from "next/link";
 import { useTranslation } from "~/providers/I18nProvider";
 const ChiSiamo: NextPage = () => {
   const { t } = useTranslation();
@@ -10,10 +13,42 @@ const ChiSiamo: NextPage = () => {
         <title>{t.heads.chi_siamo_titolo}</title>
         <meta name="description" content={t.heads.main_description} />
       </Head>
-      <main className="mx-auto w-full max-w-6xl space-y-8 px-2 py-5 sm:space-y-20 sm:px-8">
+      <main className="mx-auto w-full max-w-6xl space-y-5 px-2 py-5 md:px-8">
         <div className="bg-primary/10 text-primary inline-block rounded-lg px-3 py-1 text-sm">
           {t.chi_siamo.title}
         </div>
+        <div className="mx-auto w-full space-y-5 sm:space-y-14">
+          <section className="relative mx-auto flex max-w-6xl flex-col items-center justify-between gap-8 px-4 py-4 sm:flex-row sm:gap-20 md:px-8">
+            <div className="mx-auto mt-5 flex-1 sm:w-9/12 md:mt-0 md:w-auto">
+              <Image
+                src="/rent_2.webp"
+                alt=""
+                className="w-full rounded-md object-cover"
+                width={1400}
+                height={1050}
+              />
+            </div>
+            <div className="max-w-lg flex-1 py-5 sm:mx-auto sm:text-center md:max-w-max md:text-left">
+              <h3 className="text-3xl font-semibold text-gray-800 md:text-4xl">
+                {t.proprietari.cta2.title1}{" "}
+                <span className="text-indigo-600">
+                  {t.proprietari.cta2.title2}
+                </span>
+                {t.proprietari.cta2.title3}
+              </h3>
+              <p className="mt-3 leading-relaxed text-gray-500">
+                {t.proprietari.cta2.desc}
+              </p>
+              <Link
+                className="mt-5 inline-flex items-center rounded-full bg-indigo-50 px-4 py-2 font-medium text-indigo-600"
+                href="/contatti"
+              >
+                {t.proprietari.contattaci}
+                <ArrowRight className="ml-1 h-5 w-5 duration-150" />
+              </Link>
+            </div>
+          </section>
+
           <div className="flex w-full flex-col gap-8">
             <div className="flex flex-col gap-8 sm:flex-row sm:items-stretch sm:justify-between">
               <div className="border-border w-full basis-1/2 space-y-2 rounded-lg border p-4 hover:bg-neutral-100">
@@ -30,6 +65,37 @@ const ChiSiamo: NextPage = () => {
               <p>{t.chi_siamo.progetto_desc}</p>
             </div>
           </div>
+
+          <section className="relative mx-auto flex max-w-6xl flex-col-reverse items-center justify-between gap-8 px-4 py-4 sm:flex-row sm:gap-20 md:px-8">
+            <div className="max-w-lg flex-1 py-5 sm:mx-auto sm:text-center md:max-w-max md:text-left">
+              <h3 className="text-3xl font-semibold text-gray-800 md:text-4xl">
+                {t.proprietari.cta1.title1}{" "}
+                <span className="text-indigo-600">
+                  {t.proprietari.cta1.title2}
+                </span>
+              </h3>
+              <p className="mt-3 leading-relaxed text-gray-500">
+                {t.proprietari.cta1.desc}
+              </p>
+              <Link
+                className="mt-5 inline-flex items-center rounded-full bg-indigo-50 px-4 py-2 font-medium text-indigo-600"
+                href="/contatti"
+              >
+                {t.proprietari.contattaci}
+                <ArrowRight className="ml-1 h-5 w-5 duration-150" />
+              </Link>
+            </div>
+            <div className="mx-auto mt-5 flex-1 sm:w-9/12 md:mt-0 md:w-auto">
+              <Image
+                src="/rent_0.webp"
+                alt=""
+                className="w-full rounded-md object-cover"
+                width={1400}
+                height={1050}
+              />
+            </div>
+          </section>
+        </div>
       </main>
     </>
   );

apps/infoalloggi/src/pages/proprietari.tsx

@@ -45,8 +45,8 @@ const Proprietari: NextPage = () => {
                 src="/rent_0.webp"
                 alt=""
                 className="w-full rounded-md object-cover"
-                width={800}
+                width={1400}
-                height={300}
+                height={1050}
               />
             </div>
           </section>
@@ -66,8 +66,8 @@ const Proprietari: NextPage = () => {
                 src="/rent_2.webp"
                 alt=""
                 className="w-full rounded-md object-cover"
-                width={800}
+                width={1400}
-                height={300}
+                height={1050}
               />
             </div>
             <div className="max-w-lg flex-1 py-5 sm:mx-auto sm:text-center md:max-w-max md:text-left">