fix: complete mobile carousel and social updates

views/blocks/recent-posts/recent-posts.css

@@ -75,6 +75,11 @@
     position: relative;
 }
 
+.recent-posts__controls,
+.recent-posts__pagination {
+    display: none;
+}
+
 .recent-posts__grid::before {
     background: var(--color-cwc-blue-03);
     content: "";
@@ -273,10 +278,57 @@
         top: min(184px, calc(100cqw * 250 / 397));
     }
 
-    .recent-posts__card:nth-child(n + 2) {
+    .recent-posts__card {
         display: none;
     }
 
+    .recent-posts__card.is-active {
+        display: flex;
+    }
+
+    .recent-posts__controls {
+        display: block;
+    }
+
+    .recent-posts__control {
+        align-items: center;
+        background: var(--color-secondary);
+        border: 0;
+        border-radius: 50%;
+        color: var(--color-white);
+        display: flex;
+        height: 3rem;
+        justify-content: center;
+        padding: 0;
+        position: absolute;
+        top: 10rem;
+        width: 3rem;
+        z-index: 3;
+    }
+
+    .recent-posts__control:hover,
+    .recent-posts__control:focus-visible {
+        background: var(--color-secondary-800);
+    }
+
+    .recent-posts__control svg {
+        fill: none;
+        height: 1.75rem;
+        stroke: currentColor;
+        stroke-linecap: round;
+        stroke-linejoin: round;
+        stroke-width: 2.5;
+        width: 1.75rem;
+    }
+
+    .recent-posts__control--previous {
+        left: -1.5rem;
+    }
+
+    .recent-posts__control--next {
+        right: -1.5rem;
+    }
+
     .recent-posts__image-link {
         border-radius: 0.5rem 0.5rem 0 0;
     }
@@ -303,17 +355,38 @@
     .recent-posts__footer {
         align-items: center;
         flex-direction: column;
-        gap: 1.25rem;
-        margin-top: 1.4rem;
+        margin-top: 1.25rem;
     }
 
-    .recent-posts__footer::before {
-        background:
-            radial-gradient(circle, var(--color-cwc-blue-01) 0 0.2rem, transparent 0.22rem) left center / 0.75rem 0.5rem repeat-x;
+    .recent-posts__pagination {
+        display: flex;
+        gap: 0.75rem;
+        justify-content: center;
+        margin-top: 1.5rem;
+    }
+
+    .recent-posts__dot {
+        align-items: center;
+        background: transparent;
+        border: 0;
+        display: flex;
+        height: 1.5rem;
+        justify-content: center;
+        padding: 0;
+        width: 1.5rem;
+    }
+
+    .recent-posts__dot::before {
+        background: var(--color-cwc-blue-01);
+        border-radius: 50%;
         content: "";
-        display: block;
         height: 0.5rem;
-        width: 2.25rem;
+        opacity: 0.45;
+        width: 0.5rem;
+    }
+
+    .recent-posts__dot.is-active::before {
+        opacity: 1;
     }
 
     .recent-posts__blog-link.button {