Become a Member: bento benefits, merged/redesigned join form, floating CTA, fixes

Why become a member
- Rebuild the benefits grid as a 3x3 bento: 7 icon cards + 2 real event photos
  (with captions), fixes the orphan card, adds hover motion. Swap the blank
  fa-house-heart (Pro) for fa-house-user (Free) on "Feel at home".

Join form
- Merge the duplicate "There is a place for you here" section into the form's
  path step (student / supporter cards now carry the descriptions); drop the
  separate section. New heading "There is a place for you here"; centred layout.
- Redesign the choice cards: colour-coded (student orange / supporter teal)
  icon circles, descriptions, hover lift + "Choose this" reveal.
- Fix the stray "Support MSOS" submit button showing on the path step.

Conversion + polish
- Floating "Become a member" CTA that appears after the hero and hides near the
  form/final CTA, so the ask stays reachable without scrolling to the bottom.
- More space between section titles and their cards (numbers, reals, tests,
  showcase, benefits).
- Testimonials: Elena -> Katerina (Koper); un-swap Ana (Maribor) and Marko
  (Ljubljana); remove the "sample quotes" placeholder note.

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

member-form.js

@@ -25,6 +25,28 @@
         nums.forEach(function (n) { io.observe(n); });
     }
 
+    /* ---- floating "Become a member" CTA: show after the hero, hide near the form/footer ---- */
+    (function () {
+        var sticky = document.querySelector('.mm-sticky-cta');
+        if (!sticky) return;
+        var hero = document.querySelector('.mm-hero');
+        var joinForm = document.getElementById('join-form');
+        var finalCta = document.querySelector('.mm-final');
+        function update() {
+            var pastHero = hero ? (window.scrollY > hero.offsetHeight - 100) : (window.scrollY > 500);
+            var nearTarget = [joinForm, finalCta].some(function (el) {
+                if (!el) return false;
+                var r = el.getBoundingClientRect();
+                return r.top < window.innerHeight * 0.85 && r.bottom > 0;
+            });
+            if (pastHero && !nearTarget) { sticky.hidden = false; sticky.classList.remove('is-hiding'); }
+            else if (!sticky.hidden) { sticky.classList.add('is-hiding'); }
+        }
+        window.addEventListener('scroll', update, { passive: true });
+        window.addEventListener('resize', update);
+        update();
+    })();
+
     /* ---- multi-step form ---- */
     var form = document.querySelector('.ms-form');
     if (!form) return;
@@ -99,7 +121,8 @@
         var last = state.idx === total - 1;
         var onPath = state.order[state.idx] === 'path';
         next.hidden = last || onPath;
-        submit.hidden = !last;
+        // never show submit on the path step (you advance by picking a card)
+        submit.hidden = !last || onPath;
         if (last) submit.textContent = state.path === 'student' ? submit.getAttribute('data-student') : submit.getAttribute('data-supporter');
         alertBox.hidden = true;
     }