Landing/About/guide polish + Proxify-style category filter bar

About Us:
- Replace the appreciation photo with an Apple-style scrolling marquee that
  focal-zooms the centred photo (main.js + _about.css); heading now sits above
  the carousel; remove the "Have any questions?" FAQ CTA (EN/MK/SI).

Landing hero:
- Turn the flat blue overlay into a Proxify-style radial vignette (light centre
  over the CTA, dark edges) and raise the "Become a member" button.

Filter bar (Events & Projects / Blog / News, EN/MK/SI):
- Add a shared Proxify-style rounded pill bar with a trailing search icon that
  swaps to a search field and opens a results dropdown (thumbnail + category +
  title). New css/pages/_filterbar.css + filter-search.js, layered on top of the
  existing filter/pagination JS. Blog category icons preserved.
- Balance the News filter bar spacing between the header and the cards.

Student Welcome Guide:
- Widen the intro paragraphs, constrain the full-bleed disclaimer to a normal
  centred width, and add space before the route configurator.

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

si/about-us/index.html

@@ -358,17 +358,31 @@
         <!-- FAQ Call to Action Section -->
         <!-- Appreciation to members & friends (photos are placeholders; names pending full list) -->
         <section class="appreciation-section">
-            <div class="page-header-section">
+            <div class="appr-intro">
                 <h2>Naši člani in prijatelji</h2>
                 <p class="appr-lead">MSOS so njegovi ljudje. S hvaležnostjo vsem, ki so bili del naše zgodbe — in vsem, ki jo še pišejo z nami.</p>
             </div>
-            <div class="about-hero appreciation-hero" aria-label="Člani in prijatelji MSOS">
-                <div class="about-hero-slide is-active" style="background-image:url('../../images/event4-img-1.webp')"></div>
-                <div class="about-hero-slide" style="background-image:url('../../images/event3-photo-1.webp')"></div>
-                <div class="about-hero-slide" style="background-image:url('../../images/msnl-1.webp')"></div>
-                <div class="about-hero-slide" style="background-image:url('../../images/event4-image2.webp')"></div>
-                <div class="about-hero-slide" style="background-image:url('../../images/event3-photo-5.webp')"></div>
-                <div class="about-hero-overlay"></div>
+            <!-- Scrolling photo carousel (Apple-style focal zoom) -->
+            <div class="appr-marquee" aria-label="Člani in prijatelji MSOS">
+                <div class="appr-track">
+                    <div class="appr-card"><img loading="lazy" decoding="async" src="../../images/event4-img-1.webp" alt="Člani MSOS na dogodku"></div>
+                    <div class="appr-card"><img loading="lazy" decoding="async" src="../../images/event3-photo-1.webp" alt="Člani MSOS na dogodku"></div>
+                    <div class="appr-card"><img loading="lazy" decoding="async" src="../../images/msnl-1.webp" alt="Makedonski študentski večer v Ljubljani"></div>
+                    <div class="appr-card"><img loading="lazy" decoding="async" src="../../images/event4-image2.webp" alt="Člani MSOS na dogodku"></div>
+                    <div class="appr-card"><img loading="lazy" decoding="async" src="../../images/event3-photo-5.webp" alt="Člani MSOS na dogodku"></div>
+                    <div class="appr-card"><img loading="lazy" decoding="async" src="../../images/msnl-3.webp" alt="Makedonski študentski večer v Ljubljani"></div>
+                    <div class="appr-card"><img loading="lazy" decoding="async" src="../../images/event4-img-7.webp" alt="Člani MSOS na dogodku"></div>
+                    <div class="appr-card"><img loading="lazy" decoding="async" src="../../images/event3-photo-8.webp" alt="Člani MSOS na dogodku"></div>
+                    <!-- duplicate set for a seamless infinite loop (aria-hidden) -->
+                    <div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/event4-img-1.webp" alt=""></div>
+                    <div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/event3-photo-1.webp" alt=""></div>
+                    <div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/msnl-1.webp" alt=""></div>
+                    <div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/event4-image2.webp" alt=""></div>
+                    <div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/event3-photo-5.webp" alt=""></div>
+                    <div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/msnl-3.webp" alt=""></div>
+                    <div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/event4-img-7.webp" alt=""></div>
+                    <div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/event3-photo-8.webp" alt=""></div>
+                </div>
             </div>
             <div class="appreciation-names">
                 <span class="appr-name">Kristijan P.</span>
@@ -379,19 +393,6 @@
             </div>
             <p class="appreciation-note">Začasno — celoten seznam članov in prijateljev je v pripravi.</p>
         </section>
-
-        <section class="faq-cta-section">
-             <div class="faq-cta-container">
-                <div class="avatar-group">
-                     <img width="1197" height="1197" loading="lazy" decoding="async" src="../../images/about_marija_min.webp" alt="Avatar Marije" class="avatar">
-                     <img width="1083" height="1083" loading="lazy" decoding="async" src="../../images/about_kristijan_min.webp" alt="Avatar Kristijana" class="avatar large">
-                     <img width="1099" height="1099" loading="lazy" decoding="async" src="../../images/about_lea_min.webp" alt="Avatar Lee" class="avatar">
-                </div>
-                <h3>Imate kakšno vprašanje?</h3>
-                <p class="page-description" style="margin: 0;">Ne najdete odgovora, ki ga iščete? Poklepetajte z našo prijazno ekipo.</p>
-                <a href="#" class="btn btn-primary-orange">Ogled vseh pogostih vprašanj</a>
-             </div>
-        </section>
     </main>
 
     <!-- START_FOOTER -->

si/blog/index.html

@@ -436,6 +436,7 @@
     <script src="../../blog-filter.js"></script>
 
     <script src="../../main.js"></script>
+    <script src="../../filter-search.js"></script>
 <link rel="stylesheet" href="/assistant.css">
 <script src="/assistant.js" defer></script>
 </body>

si/news/index.html

@@ -489,6 +489,7 @@
 <!-- END_FOOTER -->
     <script src="../../main.js"></script>
     <script src="../../news-filter.js"></script>
+    <script src="../../filter-search.js"></script>
 
 <link rel="stylesheet" href="/assistant.css">
 <script src="/assistant.js" defer></script>

si/projects/index.html

@@ -435,6 +435,7 @@
     <!-- Povezava do glavne JS datoteke -->
     
     <script src="../../main.js"></script>
+    <script src="../../filter-search.js"></script>
 <link rel="stylesheet" href="/assistant.css">
 <script src="/assistant.js" defer></script>
 </body>