update

src/components/Footer.tsx

@@ -3,7 +3,7 @@ import Headling from "./Headling";
 
 const Footer = () => {
     return (
-        <footer className="px-4 lg:px-xpage flex flex-col items-center gap-14 mt-20">
+        <footer className="px-2 lg:px-xpage flex flex-col items-center gap-14 mt-20">
             <Headling/>
             <Button>
                 Contacte-moi !

src/components/Header.tsx

@@ -4,7 +4,7 @@ import { Icon } from "./Icon";
 
 const Header = () => {
     return (
-        <header className="px-4 lg:px-xpage  w-full flex justify-between   md:py-7 fixed md:sticky top-5 md:top-0 z-30">
+        <header className="px-2 lg:px-xpage  w-full flex justify-between   md:py-7 fixed md:sticky top-5 md:top-0 z-30">
             <Badge zoom={.8}>Qui suis-je 👇🏾 ?</Badge>
             <IconButton>
                 <Icon name="menu"/>

src/components/HeroSection.tsx

@@ -33,7 +33,7 @@ const HeroSection = () => {
                         ))
                     }
                 </div>
-                <p className="px-4  md:px-48 text-[18px] md:text-[20px] text-center  opacity-75">
+                <p className="px-2  md:px-48 text-[18px] md:text-[20px] text-center  opacity-75">
                     Chaque projet est une histoire 🌱, et je m’efforce d’en faire une œuvre mémorable 🎨. Je crée des solutions sur-mesure
                     🛠️ qui allient esthétique et efficacité ⚡, avec un œil attentif aux détails ✨. Ensemble, transformons vos idées
                     en expériences inoubliables 💫.

src/components/Listing.tsx

@@ -12,7 +12,7 @@ const Listing = ({ type , data }: ListingType) => {
 
 
     return (
-        <section className="px-4 lg:px-xpage py-32  flex flex-col items-center gap-28">
+        <section className="px-2 lg:px-xpage py-32  flex flex-col items-center gap-28">
             <Headling />
             {
                 type == "blog" &&