Project pages: move membership CTA into the ToC sidebar (Proxify-style)

Add a compact "Like what we do?" CTA box directly below the table of contents
in the left sidebar. The ToC already scrolls internally when long, so the box
stays pinned in the same visual field. The full-width bottom CTA is hidden on
desktop where a sidebar CTA exists (via :has()) and remains the mobile fallback.

Applied to the 4 project pages that have a ToC sidebar; the others (all MK/SI +
3 EN) have no sidebar and keep the bottom CTA.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

css/pages/_article.css

@@ -746,3 +746,31 @@
 .article-page--prose .article-layout-container { display: block; }
 .article-page--prose .article-container { max-width: 760px; margin: 0 auto; }
 .article-page--prose .mobile-article-header { display: none; }
+
+/* ---- Sidebar CTA: sits under the table of contents (Proxify-style) ---- */
+.sidebar-cta {
+    flex-shrink: 0;
+    margin-top: 18px;
+    background: linear-gradient(160deg, #21596E 0%, #143240 100%);
+    border-radius: 16px;
+    padding: 20px 18px;
+    text-align: center;
+    color: #FFFFFF;
+}
+.sidebar-cta-title { font-size: 16px; font-weight: 700; line-height: 1.3; margin: 0 0 14px; }
+.sidebar-cta-btn {
+    display: block; background: #FA7850; color: #FFFFFF; font-weight: 600; font-size: 14px;
+    padding: 11px 14px; border-radius: 10px; text-decoration: none;
+    transition: background 0.18s ease;
+}
+.sidebar-cta-btn:hover { background: #E8613B; }
+.sidebar-cta-note { font-size: 12px; line-height: 17px; color: rgba(255,255,255,0.78); margin: 12px 0 0; }
+.sidebar-cta-note a { color: #FFFFFF; text-decoration: underline; text-underline-offset: 2px; }
+
+/* Where a page has the sidebar CTA (i.e. it has a ToC), the desktop bottom CTA is
+   redundant, so hide it above the mobile breakpoint. Pages without a ToC sidebar
+   keep the bottom CTA on every screen. On mobile the sidebar is hidden, so the
+   bottom CTA always shows. */
+@media (min-width: 769px) {
+    .article-page:has(.sidebar-cta) .article-support-cta { display: none; }
+}

en/projects/macedonian-student-night-in-ljubljana/index.html

@@ -219,6 +219,11 @@
                         <li><a href="#a-beginning">A Beginning to Remember</a></li>
                     </ul>
                 </nav>
+                            <div class="sidebar-cta">
+                    <p class="sidebar-cta-title">Like what we do?</p>
+                    <a class="sidebar-cta-btn" href="../../../en/become-a-member/">Become a member</a>
+                    <p class="sidebar-cta-note">Or <a href="../../../en/support/">support MSOS</a> so we can create even more moments like this.</p>
+                </div>
             </aside>
 
             <article class="article-container">

en/projects/meet-student-slovenia-2023/index.html

@@ -222,6 +222,11 @@
                         <li><a href="#see-you">See you in Slovenia!</a></li>
                     </ul>
                 </nav>
+                            <div class="sidebar-cta">
+                    <p class="sidebar-cta-title">Like what we do?</p>
+                    <a class="sidebar-cta-btn" href="../../../en/become-a-member/">Become a member</a>
+                    <p class="sidebar-cta-note">Or <a href="../../../en/support/">support MSOS</a> so we can create even more moments like this.</p>
+                </div>
             </aside>
 
             <article class="article-container">

en/projects/meet-student-slovenia-2024/index.html

@@ -221,6 +221,11 @@
                         <li><a href="#see-you">See you in Slovenia!</a></li>
                     </ul>
                 </nav>
+                            <div class="sidebar-cta">
+                    <p class="sidebar-cta-title">Like what we do?</p>
+                    <a class="sidebar-cta-btn" href="../../../en/become-a-member/">Become a member</a>
+                    <p class="sidebar-cta-note">Or <a href="../../../en/support/">support MSOS</a> so we can create even more moments like this.</p>
+                </div>
             </aside>
             
             <article class="article-container">

en/projects/morning-coffee-in-front-of-ctk/index.html

@@ -219,6 +219,11 @@
                         <li><a href="#coffee-and-burek">Coffee and Burek as motivation</a></li>
                     </ul>
                 </nav>
+                            <div class="sidebar-cta">
+                    <p class="sidebar-cta-title">Like what we do?</p>
+                    <a class="sidebar-cta-btn" href="../../../en/become-a-member/">Become a member</a>
+                    <p class="sidebar-cta-note">Or <a href="../../../en/support/">support MSOS</a> so we can create even more moments like this.</p>
+                </div>
             </aside>
 
             <article class="article-container">