Add News hub and wire homepage Latest news to a dated content index

New /<lang>/news/ hub aggregates real projects (title+image read from their pages), placeholder news announcements, and blog items, newest-first with type badges and a type filter. Homepage Latest news now shows the newest dated items as badged cards with a working See all to the hub; the News menu link points there too. Dates in news.js are placeholders to replace with real publish dates.

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

en/index.html

@@ -64,7 +64,7 @@
                     <li class="menu-item menu-item-has-children">
                         <a href="#">News</a>
                         <ul class="dropdown-menu">
-                            <li><a href="#">News and Announcements</a></li>
+                            <li><a href="../en/news/">News and Announcements</a></li>
                             <li><a href="#">Press releases</a></li>
                         </ul>
                     </li>
@@ -134,7 +134,7 @@
             <li class="menu-item menu-item-has-children">
                 <a href="#">News</a>
                 <ul class="dropdown-menu">
-                    <li><a href="#">News and Announcements</a></li>
+                    <li><a href="../en/news/">News and Announcements</a></li>
                     <li><a href="#">Press releases</a></li>
                 </ul>
             </li>
@@ -258,38 +258,44 @@
             </div>
         </section>
 
-        <section class="latest-news-section">
+                <section class="latest-news-section">
             <div class="news-header">
                 <h2>Latest news</h2>
-                <p>Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharet.</p>
+                <p>What is new at MSOS, from events and projects to blog stories and announcements.</p>
             </div>
             <div class="news-articles">
-                <article class="news-card">
-                    <img src="../images/4-billwalsh.webp" alt="Pink and blue tinted image of a snowy mountain peak">
+                <article class="news-card" data-type="news">
+                    <a class="news-card-media" href="../en/news/">
+                        <div class="news-ph"><i class="fas fa-bullhorn" aria-hidden="true"></i></div>
+                        <span class="news-badge news-badge--news"><i class="fas fa-bullhorn" aria-hidden="true"></i> News</span>
+                    </a>
                     <div class="card-content">
-                        <p class="author">Alec Whitten • 17 Jan 2022</p>
-                        <h3>Bill Walsh leadership lessons</h3>
-                        <p>Like to know the secrets of transforming a 2-14 team into a 3x Super Bowl...</p>
+                        <p class="author">15 July 2026</p>
+                        <h3><a href="../en/news/">Applications for the 2026/2027 academic year are open</a></h3>
                     </div>
                 </article>
-                <article class="news-card">
-                    <img src="../images/5-pmmentals.webp" alt="A woman presenting in front of a whiteboard with sticky notes to a team">
+                <article class="news-card" data-type="news">
+                    <a class="news-card-media" href="../en/news/">
+                        <div class="news-ph"><i class="fas fa-bullhorn" aria-hidden="true"></i></div>
+                        <span class="news-badge news-badge--news"><i class="fas fa-bullhorn" aria-hidden="true"></i> News</span>
+                    </a>
                     <div class="card-content">
-                        <p class="author">Demi Wilkinson • 16 Jan 2022</p>
-                        <h3>PM mental models</h3>
-                        <p>Mental models are simple expressions of complex processes or relationships.</p>
+                        <p class="author">5 July 2026</p>
+                        <h3><a href="../en/news/">Join our welcome week for new students</a></h3>
                     </div>
                 </article>
-                <article class="news-card">
-                    <img src="../images/6-whatiswireframing.webp" alt="A modern computer desk setup with a large monitor, keyboard, and headphones">
+                <article class="news-card" data-type="news">
+                    <a class="news-card-media" href="../en/news/">
+                        <div class="news-ph"><i class="fas fa-bullhorn" aria-hidden="true"></i></div>
+                        <span class="news-badge news-badge--news"><i class="fas fa-bullhorn" aria-hidden="true"></i> News</span>
+                    </a>
                     <div class="card-content">
-                        <p class="author">Candice Wu • 15 Jan 2022</p>
-                        <h3>What is Wireframing?</h3>
-                        <p>Introduction to Wireframing and its Principles. Learn from the best in the industry.</p>
+                        <p class="author">20 June 2026</p>
+                        <h3><a href="../en/news/">Summer office hours and how to reach us</a></h3>
                     </div>
                 </article>
             </div>
-            <a href="../en/projects/" class="btn btn-secondary">See all</a>
+            <a href="../en/news/" class="btn btn-secondary">See all</a>
         </section>
 
         <section class="testimonials-section">