ok

src/components/Carousel.jsx

@@ -71,7 +71,7 @@ const MultiCardCarousel = () => {
   return (
     <div className="flex items-center justify-center min-h-screen py-6 bg-transparent">
       <div className="w-full max-w-7xl">
-        <div className="text-left mx-auto max-w-7xl px-4 lg:px-6">
+        <div className="text-left mx-auto max-w-7xl px-6 lg:px-8">
           <h2 className="font-display text-2xl sm:text-3xl font-semibold tracking-[-0.05em] text-darkgr-700 lg:text-4xl">
             Activities
           </h2>
@@ -98,7 +98,7 @@ const MultiCardCarousel = () => {
               </div>
             ))}
           </div>
-          <div className="absolute inset-x-0 bottom-1/2 flex justify-between px-4 transform -translate-y-1/2">
+          <div className="absolute inset-x-0 bottom-1/2 flex justify-between px-6 transform -translate-y-1/2">
             <button
               className="w-10 h-10 rounded-full text-white font-semibold bg-gold-600"
               onClick={handlePrev}