diff --git a/.env b/.env
index 90eaa48..ed9a3f8 100644
--- a/.env
+++ b/.env
@@ -1,2 +1,3 @@
-VITE_API_URL=http://192.168.1.224:4002
-# VITE_API_URL=http://194.26.138.94:4002
\ No newline at end of file
+# VITE_API_URL=http://192.168.1.224:4002
+# VITE_API_URL=http://194.26.138.94:4002
+VITE_API_URL=http://localhost:4002
\ No newline at end of file
diff --git a/src/components/AboutMarasiDrive.tsx b/src/components/AboutMarasiDrive.tsx
index b54b8da..fb0424f 100644
--- a/src/components/AboutMarasiDrive.tsx
+++ b/src/components/AboutMarasiDrive.tsx
@@ -1,7 +1,6 @@
 import {
   marasiDriveFeatures,
   marasiDriveDescriptionBadges,
-  marasiDriveExpandable,
   marasiDriveMapCards,
 } from "../data/aboutMarasiDrive";
 import MarariDriveNeighboursSlider from "./MarasiDriveNeighboursSlider";
@@ -82,7 +81,7 @@ function AboutMarasiDrive() {
       <div className="2xl:sticky relative 2xl:top-[-134vw]">
         <section className="bg-white w-full overflow-clip 2xl:pt-[9.444vw] 2xl:px-[2.222vw] 2xl:pb-[2.222vw] md:max-2xl:pt-[104px] md:max-2xl:px-6 md:max-2xl:pb-8 pt-16 px-4 pb-8 flex flex-col 2xl:gap-[4.444vw] md:max-2xl:gap-12 gap-10">
           <div className="flex flex-col 2xl:gap-[2.222vw] md:max-2xl:gap-8 gap-6 items-center">
-            <h2 className="font-mixcase-unmixed md:text-h1 text-[28px] leading-none text-center max-md:whitespace-pre-line ">
+            <h2 className="font-mixcase-unmixed text-h1 text-center max-md:whitespace-pre-line">
               {`What makes
               a Rove Home?`}
             </h2>
@@ -106,8 +105,9 @@ function AboutMarasiDrive() {
         </section>
         <section className="bg-white w-full overflow-clip flex flex-col 2xl:gap-[4.444vw] gap-12 2xl:pt-[9.444vw] 2xl:px-[2.222vw] 2xl:pb-[2.222vw] md:max-2xl:pt-[104px] md:max-2xl:px-6 md:max-2xl:pb-8 pt-16 px-4 pb-8">
           <div className="flex flex-col 2xl:gap-[2.222vw] md:max-2xl:gap-8 gap-6 items-center">
-            <h2 className="font-mixcase-unmixed text-h1 text-center">
-              Expandable Living Solutions
+            <h2 className="font-mixcase-unmixed text-h1 text-center max-md:whitespace-pre-line">
+              {`Expandable living 
+              solutions`}
             </h2>
             <p className="text-s opacity-70 whitespace-pre-line text-center">
               {`ORI introduces a revolutionary solution to apartment living,
@@ -119,16 +119,28 @@ function AboutMarasiDrive() {
               ))}
             </div>
           </div>
-          <div className="flex gap-[1.111vw]">
-            {marasiDriveExpandable.map((image) => (
-              <div key={image}>
-                <img
-                  src={image}
-                  alt="Expandable Living Solutions"
-                  className="rounded-[1.111vw]"
-                />
-              </div>
-            ))}
+          <div className="2xl:flex max-2xl:grid 2xl:grid-cols-3 md:max-2xl:grid-cols-2 grid-cols-1 2xl:gap-[1.111vw] gap-4">
+            <div>
+              <img
+                src="/images/about-complex/marasi-drive/living_solution1.jpg"
+                alt=""
+                className="2xl:rounded-[1.111vw] rounded-2xl w-full object-cover md:max-2xl:aspect-square"
+              />
+            </div>
+            <div>
+              <img
+                src="/images/about-complex/marasi-drive/living_solution2.jpg"
+                alt=""
+                className="2xl:rounded-[1.111vw] rounded-2xl w-full object-cover md:max-2xl:aspect-square"
+              />
+            </div>
+            <div className="md:max-2xl:col-span-2">
+              <img
+                src="/images/about-complex/marasi-drive/living_solution3.jpg"
+                alt=""
+                className="2xl:rounded-[1.111vw] rounded-2xl w-full object-cover max-2xl:aspect-[12/9]"
+              />
+            </div>
           </div>
         </section>
         <section className="bg-white w-full overflow-clip flex flex-col 2xl:gap-[4.444vw] 2xl:pt-[9.444vw] 2xl:pb-[15vw] 2xl:px-[2.222vw] md:max-2xl:pt-[104px] md:max-2xl:px-6 md:max-2xl:pb-8 pt-16 px-4 max-md:pb-8">
diff --git a/src/components/MarasiDriveInteriorsSlider.tsx b/src/components/MarasiDriveInteriorsSlider.tsx
index b6522d1..686d8ac 100644
--- a/src/components/MarasiDriveInteriorsSlider.tsx
+++ b/src/components/MarasiDriveInteriorsSlider.tsx
@@ -77,14 +77,14 @@ function MarasiDriveInteriorsSlider() {
       <Button
         onlyIcon
         disabled={currentIndex === marasiDriveInspiredInteriors.length - 1}
-        className="!bg-[#F3F3F2] absolute 2xl:right-[27.778vw] top-[15.833vw]"
+        className="absolute 2xl:right-[27.778vw] top-[15.833vw]"
         onClick={() =>
           setCurrentIndex(
             Math.min(currentIndex + 1, marasiDriveInspiredInteriors.length - 1)
           )
         }
       >
-        <span className="2xl:size-[1.389vw] size-5 text-[#0D1922] in-disabled:text-[#0D1922]/40">
+        <span className="2xl:size-[1.389vw] size-5">
           <ChevronRightIcon />
         </span>
       </Button>
diff --git a/src/components/UnitCard.tsx b/src/components/UnitCard.tsx
index 55ffadc..60162aa 100644
--- a/src/components/UnitCard.tsx
+++ b/src/components/UnitCard.tsx
@@ -25,6 +25,7 @@ function UnitCard({ unit }: { unit: Unit }) {
 
   return (
     <Link
+      target="_blank"
       to={`/complex/${complexNameToSlug(unit.project)}/${unit.unitNo}`}
       className="2xl:p-[1.111vw] p-4 2xl:rounded-[1.111vw] rounded-2xl flex flex-col justify-between 2xl:gap-[1.111vw] gap-4 bg-white 2xl:aspect-[332/396] md:max-2xl:aspect-[352/396] aspect-[328/396]"
     >
diff --git a/src/components/UnitTypeItem.tsx b/src/components/UnitTypeItem.tsx
index 15f634f..2b93401 100644
--- a/src/components/UnitTypeItem.tsx
+++ b/src/components/UnitTypeItem.tsx
@@ -21,6 +21,14 @@ function UnitTypeItem({
   texts,
   area,
 }: UnitTypeItemProps) {
+  function handleShare() {
+    // navigator.clipboard.writeText(window.location.href);
+    navigator.share({
+      title: title,
+      url: window.location.href,
+    });
+  }
+
   return (
     <div className="2xl:p-[2.222vw] md:max-2xl:p-[3.125vw] p-4 bg-white flex 2xl:gap-[2.222vw] md:max-2xl:gap-8 gap-6 max-2xl:flex-col">
       <div className="bg-[#F3F3F2] 2xl:aspect-[1028/664] md:max-2xl:aspect-[720/616] aspect-square 2xl:w-[71.389vw] w-full 2xl:rounded-[1.111vw] md:max-2xl:rounded-2xl rounded-xl" />
@@ -33,7 +41,7 @@ function UnitTypeItem({
                 {area}
               </p>
             </div>
-            <Button onlyIcon variant="secondary">
+            <Button onlyIcon variant="secondary" onClick={handleShare}>
               <span className="2xl:size-[1.389vw] size-5 text-[#0D1922]">
                 <ShareIcon />
               </span>
@@ -69,10 +77,12 @@ function UnitTypeItem({
           </div>
         </div>
         <div className="2xl:gap-[0.556vw] flex 2xl:flex-col sticky 2xl:bottom-[2.222vw] bottom-0 md:max-2xl:-mx-6 md:max-2xl:p-6 max-md:-mx-4 max-md:p-4 bg-white md:max-2xl:gap-4 gap-2 max-2xl:rounded-t-2xl max-2xl:shadow-[0_-4px_20px_#0000000D]">
-          <Button variant="secondary" className="!bg-[#F3F3F2] w-full">
+          <Button variant="primary" className="w-full">
             Virtual tour
           </Button>
-          <Button className="w-full">Show options</Button>
+          <Button variant="cta" className="w-full">
+            Show options
+          </Button>
         </div>
       </div>
     </div>
diff --git a/src/pages/ApartmentItem.tsx b/src/components/_ApartmentItem.tsx
similarity index 95%
rename from src/pages/ApartmentItem.tsx
rename to src/components/_ApartmentItem.tsx
index a634ea4..b5aaaf7 100644
--- a/src/pages/ApartmentItem.tsx
+++ b/src/components/_ApartmentItem.tsx
@@ -1,7 +1,7 @@
-import HeartIcon from "../components/icons/HeartIcon";
-import PlayIcon from "../components/icons/PlayIcon";
-import ShareIcon from "../components/icons/ShareIcon";
-import Button from "../components/ui/Button";
+import HeartIcon from "./icons/HeartIcon";
+import PlayIcon from "./icons/PlayIcon";
+import ShareIcon from "./icons/ShareIcon";
+import Button from "./ui/Button";
 
 interface ApartmentItemProps {
   title: string;
diff --git a/src/components/ui/BrochureButton.tsx b/src/components/ui/BrochureButton.tsx
index 8b6d051..fe5e58a 100644
--- a/src/components/ui/BrochureButton.tsx
+++ b/src/components/ui/BrochureButton.tsx
@@ -20,9 +20,9 @@ export default function BrochureButton({
 
   return (
     <Button
-      variant="secondary"
+      variant="primary"
       size="large"
-      className="w-full !bg-[#F3F3F2] !justify-between group hover:!bg-[#F3F3F2]"
+      className="w-full !justify-between group"
       onClick={handleDownload}
     >
       <span className="text-nowrap text-caption-m group-hover:text-[#0D1922] transition-colors duration-300">
diff --git a/src/components/ui/Button.tsx b/src/components/ui/Button.tsx
index b03f225..1bdb41a 100644
--- a/src/components/ui/Button.tsx
+++ b/src/components/ui/Button.tsx
@@ -3,7 +3,7 @@ import { clsx } from "clsx";
 
 interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
   children: React.ReactNode;
-  variant?: "link" | "primary" | "secondary" | "tertiary";
+  variant?: "link" | "primary" | "secondary" | "tertiary" | "cta";
   className?: string;
   size?: "small" | "medium" | "large";
   onlyIcon?: boolean;
@@ -42,9 +42,12 @@ function Button({
               : "2xl:px-[0.889vw] 2xl:py-[0.556vw] 2xl:gap-[0.278vw] 2xl:text-[0.833vw] px-3 py-2 gap-1 text-btn-s"),
         ],
         variant === "link" && "text-sm text-black/50 w-fit",
+        variant === "cta" &&
+          "bg-[#00BED7] hover:!bg-[#0AB3C9] text-white disabled:!bg-[#0D1922]/8 disabled:!text-[#0D1922]/40",
         variant === "primary" &&
-          "!bg-[#f3f3f2] text-white hover:!bg-[#0AB3C9] active:!bg-[#00A7BD] disabled:!bg-[#0D1922]/8 disabled:!text-[#0D1922]/40",
-        variant === "secondary" && "bg-white text-[#0D1922]/70",
+          "bg-[#F3F3F2] hover:!bg-[#E2E2DC] disabled:!bg-[#0D1922]/8 disabled:!text-[#0D1922]/40",
+        variant === "secondary" &&
+          "bg-white hover:!bg-white/80 text-[#0D1922]/70 disabled:!bg-[#0D1922]/8 disabled:!text-[#0D1922]/40",
         variant === "tertiary" &&
           "text-xs leading-[135%] text-[#0D1922]/70 !px-0 hover:!text-[#0D1922] disabled:!bg-transparent",
         roundedFull ? "rounded-full" : "2xl:rounded-[0.833vw] rounded-xl",
diff --git a/src/data/aboutMarasiDrive.ts b/src/data/aboutMarasiDrive.ts
index 37ef7a7..bd395c6 100644
--- a/src/data/aboutMarasiDrive.ts
+++ b/src/data/aboutMarasiDrive.ts
@@ -1,7 +1,7 @@
 export const marasiDriveDescriptionBadges = [
-  "Expandable Living Solutions",
-  "Heartbeat Location",
-  "Inspired Interiors",
+  "Expandable living solutions",
+  "Heartbeat location",
+  "Inspired interiors",
 ] as const;
 
 export const marasiDriveFeatures = [
@@ -27,12 +27,6 @@ export const marasiDriveFeatures = [
   },
 ] as const;
 
-export const marasiDriveExpandable = [
-  "/images/about-complex/marasi-drive/living_solution1.jpg",
-  "/images/about-complex/marasi-drive/living_solution2.jpg",
-  "/images/about-complex/marasi-drive/living_solution3.jpg",
-] as const;
-
 export const marasiDriveInspiredInteriors = [
   {
     name: "Studio flex",
diff --git a/src/index.css b/src/index.css
index 51f96fd..cac09c0 100644
--- a/src/index.css
+++ b/src/index.css
@@ -18,7 +18,7 @@ button {
 }
 
 @utility text-h1 {
-  @apply 2xl:text-[3.889vw] text-[56px] leading-none;
+  @apply 2xl:text-[3.889vw] md:max-2xl:text-[56px] text-[28px] leading-none;
 }
 
 @utility text-h15 {
diff --git a/src/layout/DefaultLayout.tsx b/src/layout/DefaultLayout.tsx
index 6b98ecd..0bd83bd 100644
--- a/src/layout/DefaultLayout.tsx
+++ b/src/layout/DefaultLayout.tsx
@@ -2,10 +2,15 @@ import Header from "../components/Header";
 import { Outlet, useLocation } from "react-router";
 import Footer from "../components/Footer";
 import clsx from "clsx";
+import { useEffect } from "react";
 
 function DefaultLayout() {
   const { pathname } = useLocation();
 
+  useEffect(() => {
+    window.scrollTo(0, 0);
+  }, [pathname]);
+
   return (
     <div
       className={clsx(
diff --git a/src/layout/LayoutWithoutFooter.tsx b/src/layout/LayoutWithoutFooter.tsx
index e46cd96..21a18ae 100644
--- a/src/layout/LayoutWithoutFooter.tsx
+++ b/src/layout/LayoutWithoutFooter.tsx
@@ -1,7 +1,14 @@
 import Header from "../components/Header";
-import { Outlet } from "react-router";
+import { Outlet, useLocation } from "react-router";
+import { useEffect } from "react";
 
 function LayoutWithoutFooter() {
+  const { pathname } = useLocation();
+
+  useEffect(() => {
+    window.scrollTo(0, 0);
+  }, [pathname]);
+
   return (
     <div className="flex flex-col select-none min-h-dvh">
       <Header />
diff --git a/src/main.tsx b/src/main.tsx
index 20febe6..b4645e6 100644
--- a/src/main.tsx
+++ b/src/main.tsx
@@ -9,7 +9,7 @@ import ComplexPage from "./pages/ComplexPage.tsx";
 import FloorsPage from "./pages/FloorsPage.tsx";
 import UnitTypesPage from "./pages/UnitTypesPage.tsx";
 import AboutIRTHPage from "./pages/AboutIRTHPage.tsx";
-import FavoritesPage from "./pages/FavouritesPage.tsx";
+import FavoritesPage from "./pages/FavoritesPage.tsx";
 import SearchPage from "./pages/SearchPage.tsx";
 import LayoutWithoutFooter from "./layout/LayoutWithoutFooter.tsx";
 import { queryClient } from "./lib/queryClient.ts";
diff --git a/src/pages/FavouritesPage.tsx b/src/pages/FavoritesPage.tsx
similarity index 98%
rename from src/pages/FavouritesPage.tsx
rename to src/pages/FavoritesPage.tsx
index c3f6a59..898f451 100644
--- a/src/pages/FavouritesPage.tsx
+++ b/src/pages/FavoritesPage.tsx
@@ -123,7 +123,7 @@ function FavoritesPage() {
                 </p>
               </div>
               <Button
-                variant="primary"
+                variant="cta"
                 size="large"
                 onClick={() => navigate("/search")}
               >
@@ -155,8 +155,7 @@ function FavoritesPage() {
             <div className="flex justify-between">
               <Button
                 onlyIcon
-                variant="secondary"
-                className="!bg-[#F3F3F2]"
+                variant="primary"
                 onClick={handlePrev}
                 disabled={currentUnit === 0}
               >
@@ -184,7 +183,7 @@ function FavoritesPage() {
               </div>
               <Button
                 onlyIcon
-                variant="secondary"
+                variant="primary"
                 disabled={
                   filteredFavoriteUnits.length - currentUnit <=
                   (innerWidth >= 1440 ? 4 : 2)
@@ -358,7 +357,7 @@ function FavoritesPage() {
                         />
                       )}
                     </div>
-                    <Button size="large" className="w-full">
+                    <Button variant="cta" size="large" className="w-full">
                       Book
                     </Button>
                   </div>
diff --git a/src/pages/UnitPage.tsx b/src/pages/UnitPage.tsx
index 7459863..bef6e7d 100644
--- a/src/pages/UnitPage.tsx
+++ b/src/pages/UnitPage.tsx
@@ -41,6 +41,13 @@ function UnitPage() {
 
   if (!unit) return null;
 
+  function handleShare() {
+    navigator.share({
+      title: `${unit!.unitType} - ${unit!.unitNo}`,
+      url: window.location.href,
+    });
+  }
+
   return (
     <div className="2xl:p-[2.222vw] md:max-2xl:p-6 p-4 max-2xl:pb-0 bg-white flex 2xl:gap-[2.222vw] md:max-2xl:gap-8 gap-6 max-2xl:flex-col">
       <div className="bg-[#F3F3F2] 2xl:aspect-[1028/664] md:max-2xl:aspect-[720/616] aspect-square 2xl:w-[71.389vw] w-full 2xl:rounded-[1.111vw] md:max-2xl:rounded-2xl rounded-xl" />
@@ -76,7 +83,7 @@ function UnitPage() {
                   )}
                 </span>
               </Button>
-              <Button variant="tertiary" onlyIcon>
+              <Button variant="tertiary" onlyIcon onClick={handleShare}>
                 <span className="2xl:size-[1.389vw] size-5">
                   <ShareIcon />
                 </span>
@@ -136,7 +143,7 @@ function UnitPage() {
           >
             Virtual tour
           </Button>
-          <Button size="large" className="w-full">
+          <Button variant="cta" size="large" className="w-full">
             Book
           </Button>
         </div>