diff --git a/code_export.txt b/code_export.txt
index c72b347..b6769cd 100644
--- a/code_export.txt
+++ b/code_export.txt
@@ -573,14 +573,14 @@ footer hr {
  * Ta datoteka vsebuje stile za glavo (header) spletne strani.
  *
  * 1. Glavni kontejner za glavo
- * 2. Vsebina glave (logotip, navigacija)
+ * 2. Vsebina glave (logotip, navigacija) - POSODOBLJENO
  * 3. Gumbi in akcije v glavi (vključno z izbiro jezika)
- * 4. Stili za namizni "dropdown" meni (PRENOVLJEN DIZAJN)
- * 5. Stili za mobilno glavo in "accordion" meni (optimizirano)
+ * 4. Stili za namizni "dropdown" meni
+ * 5. Stili za mobilno glavo in "accordion" meni
+ * 6. Stili za modalno okno za izbiro jezika na mobilnih napravah
  */
 
 /* 1. Glavni kontejner za glavo */
-
 .dropdown-header-navigation {
     position: absolute;
     width: 100%;
@@ -593,27 +593,21 @@ footer hr {
     z-index: 1000;
 }
 
-/* 2. Vsebina glave (logotip, navigacija) */
+/* 2. Vsebina glave (logotip, navigacija) - POSODOBLJENO */
+.logo-link .logo-img {
+    height: 32px;
+    width: auto;
+    display: block; /* Za zanesljivo obnašanje */
+}
 
-.header-content {
+/* Nov ovoj za desno stran glave */
+.header-right-wrapper {
     display: flex;
     align-items: center;
-    flex-grow: 1; 
-    gap: 48px;
+    gap: 24px; /* Razmik med navigacijo in gumbi */
 }
 
-.header-content > nav {
-    flex-grow: 1;
-    display: flex;
-    height: 100%;
-}
-
-.logo-link .logo-img {
-   height: 32px;
-   width: auto;
-}
-
-/* Osnovna struktura navigacije (UL/LI) */
+/* Osnovna struktura navigacije */
 .navigation {
     list-style: none;
     margin: 0;
@@ -624,10 +618,6 @@ footer hr {
     width: 100%;
 }
 
-.navigation.desktop-nav {
-    justify-content: flex-end; 
-}
-
 .navigation .menu-item {
     position: relative;
     height: 100%;
@@ -635,17 +625,16 @@ footer hr {
     align-items: center;
 }
 
-/* Povezave v glavnem meniju - z več razmika */
+/* Povezave v glavnem meniju */
 .navigation > .menu-item > a {
     text-decoration: none;
     color: #667085;
     font-weight: 600;
     font-size: 16px;
-    padding: 0 20px;
+    padding: 0 16px; /* Prilagojen padding */
     height: 100%;
     display: flex;
     align-items: center;
-    gap: 8px;
     transition: color 0.2s ease-in-out;
     white-space: nowrap;
 }
@@ -654,6 +643,11 @@ footer hr {
     color: #101828;
 }
 
+/* Poudarjanje aktivne strani na namizju */
+.navigation .menu-item.active-page > a {
+    color: #2D738C;
+}
+
 /* Puščica za podmeni */
 .navigation .menu-item-has-children > a::after {
     content: '\f078';
@@ -661,10 +655,10 @@ footer hr {
     font-weight: 900;
     font-size: 12px;
     transition: transform 0.3s ease-in-out;
+    margin-left: 8px;
 }
 
 /* 3. Gumbi in akcije v glavi */
-
 .navigation-actions {
     display: flex;
     align-items: center;
@@ -676,6 +670,7 @@ footer hr {
     position: relative;
     cursor: pointer;
 }
+
 .current-lang {
     display: flex;
     align-items: center;
@@ -688,6 +683,7 @@ footer hr {
 .current-lang:hover { background-color: #F9FAFB; }
 .current-lang span { font-weight: 600; }
 .current-lang .fa-chevron-down { transition: transform 0.3s ease-in-out; }
+
 .lang-dropdown {
     display: block;
     position: absolute;
@@ -711,6 +707,7 @@ footer hr {
     transform: translateY(0);
 }
 .language-selector.active .current-lang .fa-chevron-down { transform: rotate(180deg); }
+
 .lang-dropdown a {
     display: block;
     padding: 10px 12px;
@@ -723,9 +720,7 @@ footer hr {
 }
 .lang-dropdown a:hover { background-color: #F9FAFB; }
 
-
-/* 4. Stili za namizni "dropdown" meni - PRENOVLJEN DIZAJN */
-
+/* 4. Stili za namizni "dropdown" meni */
 .dropdown-menu {
     position: absolute;
     top: 100%;
@@ -745,7 +740,6 @@ footer hr {
     transition: opacity 0.3s ease, transform 0.3s ease, visibility 0.3s;
 }
 
-/* To pravilo povzroča težave na mobilnih napravah in ga bomo spodaj povozili */
 .navigation .menu-item:hover > .dropdown-menu {
     opacity: 1;
     visibility: visible;
@@ -756,9 +750,7 @@ footer hr {
     transform: rotate(180deg);
 }
 
-.dropdown-menu li {
-    padding: 0;
-}
+.dropdown-menu li { padding: 0; }
 
 .dropdown-menu a {
     display: block;
@@ -783,10 +775,9 @@ footer hr {
 
 
 /* ==========================================================================
-   5. Stili za mobilno glavo in "accordion" meni - POPOLNA PRENOVA
+   5. Stili za mobilno glavo in "accordion" meni
    ========================================================================== */
-
-@media (max-width: 1024px) { 
+@media (max-width: 1024px) {
 
     .dropdown-header-navigation {
         position: fixed;
@@ -799,12 +790,8 @@ footer hr {
         z-index: 1002;
     }
     
-    .header-content {
-        flex-grow: 0;
-    }
-
-    .navigation.desktop-nav,
-    .dropdown-header-navigation .container > .navigation-actions {
+    /* Skrij nov ovoj za desno stran na mobilni napravi */
+    .header-right-wrapper {
         display: none;
     }
 
@@ -847,8 +834,8 @@ footer hr {
         align-items: stretch;
         width: 100%;
         gap: 0;
-        border-bottom: 1px solid #EAECF0;
         padding-bottom: 24px;
+        border-bottom: none;
     }
 
     .mobile-nav .menu-item {
@@ -865,15 +852,20 @@ footer hr {
         justify-content: space-between;
         align-items: center;
         width: 100%;
-        padding: 16px 0;
+        padding: 16px;
         font-size: 20px;
         color: #101828;
         font-weight: 600;
         height: auto;
+        box-sizing: border-box;
     }
 
-    html.nav-open .mobile-nav .menu-item.open > a::after {
-        transform: rotate(180deg);
+    .mobile-nav .menu-item.active-page > a {
+        color: #2D738C;
+        font-weight: 700;
+        border-left: 3px solid #2D738C;
+        padding-left: 13px;
+        background-color: transparent;
     }
     
     .mobile-nav .dropdown-menu {
@@ -893,62 +885,33 @@ footer hr {
         transition: max-height 0.3s ease-in-out;
     }
 
-    .mobile-nav .menu-item.open > .dropdown-menu {
-        max-height: 500px;
-    }
-    
-    .mobile-nav .dropdown-menu ul {
-        padding: 0;
-        margin: 0;
-        list-style: none;
-    }
-    
-    .mobile-nav .dropdown-menu li {
-        padding: 0;
-    }
+    .mobile-nav .menu-item.open > .dropdown-menu { max-height: 500px; }
+    .mobile-nav .dropdown-menu ul { padding: 0; margin: 0; list-style: none; }
+    .mobile-nav .dropdown-menu li { padding: 0; }
 
     .mobile-nav .dropdown-menu a {
         display: block;
-        padding: 12px 16px 12px 24px;
+        padding: 12px 16px 12px 45px;
         color: #344054;
         font-weight: 500;
         font-size: 18px;
         border-radius: 6px;
         white-space: normal;
     }
-    .mobile-nav .dropdown-menu a:hover {
-        background-color: #F9FAFB;
-        color: #101828;
-    }
+    .mobile-nav .dropdown-menu a:hover { background-color: #F9FAFB; }
 
-    /* === KLJUČNI POPRAVEK: Onemogočimo namizne :hover efekte na mobilnih napravah === */
-    .mobile-nav .menu-item:hover > .dropdown-menu {
-        /* Preprečimo, da bi namizno pravilo :hover vplivalo na mobilni meni.
-           Na mobilni napravi je stanje odprtosti nadzorovano izključno z razredom .open. */
-        opacity: 1;
-        visibility: visible;
-        transform: none;
-    }
-
-    .mobile-nav .menu-item:hover > a::after {
-        /* Preprečimo obračanje puščice ob :hover dogodku. 
-           Puščica se bo obrnila le, ko je dodan razred .open. */
-        transform: none;
-    }
-    
-    html.nav-open .mobile-nav .menu-item.open > a::after {
-        /* Zagotovimo, da se puščica obrne, ko je meni odprt */
-        transform: rotate(180deg);
-    }
-    /* ================================================================================ */
+    .mobile-nav .menu-item:hover > .dropdown-menu { opacity: 1; visibility: visible; transform: none; }
+    .mobile-nav .menu-item:hover > a::after { transform: none; }
+    html.nav-open .mobile-nav .menu-item.open > a::after { transform: rotate(180deg); }
 
     .mobile-nav-panel .navigation-actions {
         display: flex;
         flex-direction: column;
         gap: 16px;
         width: 100%;
-        margin-top: auto;
+        margin-top: 32px;
         padding-top: 32px;
+        border-top: 1px solid #EAECF0;
     }
 
     .mobile-nav-panel .navigation-actions .btn {
@@ -956,19 +919,108 @@ footer hr {
         max-width: 340px;
         align-self: center;
     }
-
-    .mobile-nav-panel .language-selector {
-        margin-top: 16px;
-        text-align: center;
+    
+    .mobile-nav-panel .language-selector .current-lang {
+        justify-content: center;
+        width: 100%;
+        max-width: 340px;
+        margin: 0 auto;
+        background-color: #F9FAFB;
+        border: 1px solid #EAECF0;
+        box-sizing: border-box;
     }
 
-    .mobile-nav-panel .lang-dropdown {
-        left: 50%;
-        transform: translateX(-50%);
-        right: auto;
-        bottom: calc(100% + 8px);
-        top: auto;
-    }
+    .mobile-nav-panel .lang-dropdown { display: none; }
+}
+
+/* ==========================================================================
+   6. Stili za modalno okno za izbiro jezika
+   ========================================================================== */
+#language-modal-overlay {
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background-color: rgba(16, 24, 40, 0.6);
+    z-index: 2000;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    opacity: 0;
+    visibility: hidden;
+    transition: opacity 0.3s ease, visibility 0.3s ease;
+}
+
+#language-modal-overlay.active {
+    opacity: 1;
+    visibility: visible;
+}
+
+.language-modal-content {
+    background-color: #FFFFFF;
+    border-radius: 16px;
+    padding: 24px;
+    width: 90%;
+    max-width: 400px;
+    box-shadow: 0 12px 24px -4px rgba(16, 24, 40, 0.08);
+    transform: scale(0.95);
+    transition: transform 0.3s ease;
+}
+
+#language-modal-overlay.active .language-modal-content {
+    transform: scale(1);
+}
+
+.language-modal-header {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    margin-bottom: 24px;
+}
+
+.language-modal-header h3 {
+    margin: 0;
+    font-size: 20px;
+    font-weight: 600;
+    color: #101828;
+}
+
+#language-modal-close {
+    background: none;
+    border: none;
+    font-size: 24px;
+    color: #667085;
+    cursor: pointer;
+    padding: 4px;
+    line-height: 1;
+}
+
+.language-modal-body {
+    display: flex;
+    flex-direction: column;
+    gap: 12px;
+}
+
+.language-modal-body a {
+    display: block;
+    padding: 12px 16px;
+    text-align: center;
+    text-decoration: none;
+    font-size: 18px;
+    font-weight: 500;
+    color: #344054;
+    background-color: #F9FAFB;
+    border: 1px solid #EAECF0;
+    border-radius: 8px;
+    transition: background-color 0.2s ease, border-color 0.2s ease;
+}
+
+.language-modal-body a:hover,
+.language-modal-body a.active-lang {
+    background-color: #FFFFFF;
+    border-color: #2D738C;
+    color: #2D738C;
 }"""
 
 
@@ -2848,11 +2900,13 @@ footer hr {
     <!-- START_HEADER -->
 <header class="dropdown-header-navigation">
     <div class="container">
-        <div class="header-content">
-            <a href="../../en/" class="logo-link">
-                <img src="../../images/1-logo.png" alt="Macedonian Student Organisation in Slovenia Logo" class="logo-img">
-            </a>
-            <!-- Desktop Navigation -->
+        <!-- Logotip je zdaj samostojen element na levi strani -->
+        <a href="../../en/" class="logo-link">
+            <img src="../../images/1-logo.png" alt="Macedonian Student Organisation in Slovenia Logo" class="logo-img">
+        </a>
+        
+        <!-- Nov ovoj za vse elemente na desni strani -->
+        <div class="header-right-wrapper">
             <nav>
                 <ul class="navigation desktop-nav">
                     <li class="menu-item menu-item-has-children">
@@ -2897,28 +2951,25 @@ footer hr {
                     </li>
                 </ul>
             </nav>
-        </div>
-
-        <!-- Desktop Buttons -->
-        <div class="navigation-actions">
-            <button class="btn btn-secondary">Become a member</button>
-            <button class="btn btn-primary">Donate</button>
-            <!-- Language Switcher -->
-            <div class="language-selector">
-                <div class="current-lang">
-                    <i class="fas fa-globe"></i>
-                    <span id="current-lang-code">EN</span>
-                    <i class="fas fa-chevron-down"></i>
-                </div>
-                <div class="lang-dropdown">
-                    <a href="#" data-lang="si">Slovenščina (SI)</a>
-                    <a href="#" data-lang="en">English (EN)</a>
-                    <a href="#" data-lang="mk">Македонски (MK)</a>
+            <div class="navigation-actions">
+                <button class="btn btn-secondary">Become a member</button>
+                <button class="btn btn-primary">Donate</button>
+                <div class="language-selector">
+                    <div class="current-lang">
+                        <i class="fas fa-globe"></i>
+                        <span id="current-lang-code">EN</span>
+                        <i class="fas fa-chevron-down"></i>
+                    </div>
+                    <div class="lang-dropdown">
+                        <a href="#" data-lang="si">Slovenščina (SI)</a>
+                        <a href="#" data-lang="en">English (EN)</a>
+                        <a href="#" data-lang="mk">Македонски (MK)</a>
+                    </div>
                 </div>
             </div>
         </div>
 
-        <!-- Mobile Menu Icon (Hamburger/X) -->
+        <!-- Ikona za mobilni meni ostaja ločena za lažje upravljanje -->
         <div class="mobile-menu-icon">
             <i class="fas fa-bars"></i>
             <i class="fas fa-times"></i>
@@ -2926,7 +2977,7 @@ footer hr {
     </div>
 </header>
 
-<!-- Mobile Navigation Panel (ostane znotraj markerjev, a za <header>) -->
+<!-- Panel za mobilno navigacijo (struktura ostaja enaka) -->
 <div class="mobile-nav-panel">
     <nav>
         <ul class="navigation mobile-nav">
@@ -2975,18 +3026,27 @@ footer hr {
     <div class="navigation-actions">
         <button class="btn btn-secondary">Become a member</button>
         <button class="btn btn-primary">Donate</button>
-        <!-- Language Switcher (for mobile) -->
         <div class="language-selector">
-            <div class="current-lang">
+            <button class="current-lang" id="mobile-lang-trigger">
                 <i class="fas fa-globe"></i>
-                <span id="current-lang-code-mobile">EN</span>
-                <i class="fas fa-chevron-down"></i>
-            </div>
-            <div class="lang-dropdown">
-                <a href="#" data-lang="si">Slovenščina (SI)</a>
-                <a href="#" data-lang="en">English (EN)</a>
-                <a href="#" data-lang="mk">Македонски (MK)</a>
-            </div>
+                <span>EN</span>
+                <i class="fas fa-chevron-right"></i>
+            </button>
+        </div>
+    </div>
+</div>
+
+<!-- Modalno okno za izbiro jezika (ostaja enako) -->
+<div id="language-modal-overlay">
+    <div class="language-modal-content">
+        <div class="language-modal-header">
+            <h3>Select Language</h3>
+            <button id="language-modal-close" aria-label="Close language selection">&times;</button>
+        </div>
+        <div class="language-modal-body">
+            <a href="#" data-lang="si">Slovenščina (SI)</a>
+            <a href="#" data-lang="en" class="active-lang">English (EN)</a>
+            <a href="#" data-lang="mk">Македонски (MK)</a>
         </div>
     </div>
 </div>
@@ -3283,7 +3343,7 @@ footer hr {
         <div class="navigation-actions">
             <button class="btn btn-secondary">Become a member</button>
             <button class="btn btn-primary">Donate</button>
-            <!-- Language Switcher -->
+            <!-- Language Switcher (Desktop Dropdown) -->
             <div class="language-selector">
                 <div class="current-lang">
                     <i class="fas fa-globe"></i>
@@ -3306,7 +3366,7 @@ footer hr {
     </div>
 </header>
 
-<!-- Mobile Navigation Panel (ostane znotraj markerjev, a za <header>) -->
+<!-- Mobile Navigation Panel -->
 <div class="mobile-nav-panel">
     <nav>
         <ul class="navigation mobile-nav">
@@ -3355,18 +3415,28 @@ footer hr {
     <div class="navigation-actions">
         <button class="btn btn-secondary">Become a member</button>
         <button class="btn btn-primary">Donate</button>
-        <!-- Language Switcher (for mobile) -->
+        <!-- Language Switcher (Mobile Button - Triggers Modal) -->
         <div class="language-selector">
-            <div class="current-lang">
+            <button class="current-lang" id="mobile-lang-trigger">
                 <i class="fas fa-globe"></i>
-                <span id="current-lang-code-mobile">EN</span>
-                <i class="fas fa-chevron-down"></i>
-            </div>
-            <div class="lang-dropdown">
-                <a href="#" data-lang="si">Slovenščina (SI)</a>
-                <a href="#" data-lang="en">English (EN)</a>
-                <a href="#" data-lang="mk">Македонски (MK)</a>
-            </div>
+                <span>EN</span>
+                <i class="fas fa-chevron-right"></i>
+            </button>
+        </div>
+    </div>
+</div>
+
+<!-- Language Selection Modal (for Mobile) -->
+<div id="language-modal-overlay">
+    <div class="language-modal-content">
+        <div class="language-modal-header">
+            <h3>Select Language</h3>
+            <button id="language-modal-close" aria-label="Close language selection">&times;</button>
+        </div>
+        <div class="language-modal-body">
+            <a href="#" data-lang="si">Slovenščina (SI)</a>
+            <a href="#" data-lang="en" class="active-lang">English (EN)</a>
+            <a href="#" data-lang="mk">Македонски (MK)</a>
         </div>
     </div>
 </div>
@@ -3574,7 +3644,7 @@ footer hr {
             </div>
         </div>
     </div>
-    
+    <script src="../../main.js"></script>
 </footer>
 <!-- END_FOOTER -->
 
@@ -3608,11 +3678,13 @@ footer hr {
     <!-- START_HEADER -->
 <header class="dropdown-header-navigation">
     <div class="container">
-        <div class="header-content">
-            <a href="../../../en/" class="logo-link">
-                <img src="../../../images/1-logo.png" alt="Macedonian Student Organisation in Slovenia Logo" class="logo-img">
-            </a>
-            <!-- Desktop Navigation -->
+        <!-- Logotip je zdaj samostojen element na levi strani -->
+        <a href="../../../en/" class="logo-link">
+            <img src="../../../images/1-logo.png" alt="Macedonian Student Organisation in Slovenia Logo" class="logo-img">
+        </a>
+        
+        <!-- Nov ovoj za vse elemente na desni strani -->
+        <div class="header-right-wrapper">
             <nav>
                 <ul class="navigation desktop-nav">
                     <li class="menu-item menu-item-has-children">
@@ -3657,28 +3729,25 @@ footer hr {
                     </li>
                 </ul>
             </nav>
-        </div>
-
-        <!-- Desktop Buttons -->
-        <div class="navigation-actions">
-            <button class="btn btn-secondary">Become a member</button>
-            <button class="btn btn-primary">Donate</button>
-            <!-- Language Switcher -->
-            <div class="language-selector">
-                <div class="current-lang">
-                    <i class="fas fa-globe"></i>
-                    <span id="current-lang-code">EN</span>
-                    <i class="fas fa-chevron-down"></i>
-                </div>
-                <div class="lang-dropdown">
-                    <a href="#" data-lang="si">Slovenščina (SI)</a>
-                    <a href="#" data-lang="en">English (EN)</a>
-                    <a href="#" data-lang="mk">Македонски (MK)</a>
+            <div class="navigation-actions">
+                <button class="btn btn-secondary">Become a member</button>
+                <button class="btn btn-primary">Donate</button>
+                <div class="language-selector">
+                    <div class="current-lang">
+                        <i class="fas fa-globe"></i>
+                        <span id="current-lang-code">EN</span>
+                        <i class="fas fa-chevron-down"></i>
+                    </div>
+                    <div class="lang-dropdown">
+                        <a href="#" data-lang="si">Slovenščina (SI)</a>
+                        <a href="#" data-lang="en">English (EN)</a>
+                        <a href="#" data-lang="mk">Македонски (MK)</a>
+                    </div>
                 </div>
             </div>
         </div>
 
-        <!-- Mobile Menu Icon (Hamburger/X) -->
+        <!-- Ikona za mobilni meni ostaja ločena za lažje upravljanje -->
         <div class="mobile-menu-icon">
             <i class="fas fa-bars"></i>
             <i class="fas fa-times"></i>
@@ -3686,7 +3755,7 @@ footer hr {
     </div>
 </header>
 
-<!-- Mobile Navigation Panel (ostane znotraj markerjev, a za <header>) -->
+<!-- Panel za mobilno navigacijo (struktura ostaja enaka) -->
 <div class="mobile-nav-panel">
     <nav>
         <ul class="navigation mobile-nav">
@@ -3735,18 +3804,27 @@ footer hr {
     <div class="navigation-actions">
         <button class="btn btn-secondary">Become a member</button>
         <button class="btn btn-primary">Donate</button>
-        <!-- Language Switcher (for mobile) -->
         <div class="language-selector">
-            <div class="current-lang">
+            <button class="current-lang" id="mobile-lang-trigger">
                 <i class="fas fa-globe"></i>
-                <span id="current-lang-code-mobile">EN</span>
-                <i class="fas fa-chevron-down"></i>
-            </div>
-            <div class="lang-dropdown">
-                <a href="#" data-lang="si">Slovenščina (SI)</a>
-                <a href="#" data-lang="en">English (EN)</a>
-                <a href="#" data-lang="mk">Македонски (MK)</a>
-            </div>
+                <span>EN</span>
+                <i class="fas fa-chevron-right"></i>
+            </button>
+        </div>
+    </div>
+</div>
+
+<!-- Modalno okno za izbiro jezika (ostaja enako) -->
+<div id="language-modal-overlay">
+    <div class="language-modal-content">
+        <div class="language-modal-header">
+            <h3>Select Language</h3>
+            <button id="language-modal-close" aria-label="Close language selection">&times;</button>
+        </div>
+        <div class="language-modal-body">
+            <a href="#" data-lang="si">Slovenščina (SI)</a>
+            <a href="#" data-lang="en" class="active-lang">English (EN)</a>
+            <a href="#" data-lang="mk">Македонски (MK)</a>
         </div>
     </div>
 </div>
@@ -4140,7 +4218,7 @@ footer hr {
         <div class="navigation-actions">
             <button class="btn btn-secondary">Become a member</button>
             <button class="btn btn-primary">Donate</button>
-            <!-- Language Switcher -->
+            <!-- Language Switcher (Desktop Dropdown) -->
             <div class="language-selector">
                 <div class="current-lang">
                     <i class="fas fa-globe"></i>
@@ -4163,7 +4241,7 @@ footer hr {
     </div>
 </header>
 
-<!-- KLJUČNA SPREMEMBA: Mobilni panel je zdaj ZUNAJ <header> elementa -->
+<!-- Mobile Navigation Panel -->
 <div class="mobile-nav-panel">
     <nav>
         <ul class="navigation mobile-nav">
@@ -4212,18 +4290,28 @@ footer hr {
     <div class="navigation-actions">
         <button class="btn btn-secondary">Become a member</button>
         <button class="btn btn-primary">Donate</button>
-        <!-- Language Switcher (for mobile) -->
+        <!-- Language Switcher (Mobile Button - Triggers Modal) -->
         <div class="language-selector">
-            <div class="current-lang">
+            <button class="current-lang" id="mobile-lang-trigger">
                 <i class="fas fa-globe"></i>
-                <span id="current-lang-code-mobile">EN</span>
-                <i class="fas fa-chevron-down"></i>
-            </div>
-            <div class="lang-dropdown">
-                <a href="#" data-lang="si">Slovenščina (SI)</a>
-                <a href="#" data-lang="en">English (EN)</a>
-                <a href="#" data-lang="mk">Македонски (MK)</a>
-            </div>
+                <span>EN</span>
+                <i class="fas fa-chevron-right"></i>
+            </button>
+        </div>
+    </div>
+</div>
+
+<!-- Language Selection Modal (for Mobile) -->
+<div id="language-modal-overlay">
+    <div class="language-modal-content">
+        <div class="language-modal-header">
+            <h3>Select Language</h3>
+            <button id="language-modal-close" aria-label="Close language selection">&times;</button>
+        </div>
+        <div class="language-modal-body">
+            <a href="#" data-lang="si">Slovenščina (SI)</a>
+            <a href="#" data-lang="en" class="active-lang">English (EN)</a>
+            <a href="#" data-lang="mk">Македонски (MK)</a>
         </div>
     </div>
 </div>
@@ -4562,11 +4650,13 @@ footer hr {
     <!-- START_HEADER -->
 <header class="dropdown-header-navigation">
     <div class="container">
-        <div class="header-content">
-            <a href="../en/" class="logo-link">
-                <img src="../images/1-logo.png" alt="Macedonian Student Organisation in Slovenia Logo" class="logo-img">
-            </a>
-            <!-- Desktop Navigation -->
+        <!-- Logotip je zdaj samostojen element na levi strani -->
+        <a href="../en/" class="logo-link">
+            <img src="../images/1-logo.png" alt="Macedonian Student Organisation in Slovenia Logo" class="logo-img">
+        </a>
+        
+        <!-- Nov ovoj za vse elemente na desni strani -->
+        <div class="header-right-wrapper">
             <nav>
                 <ul class="navigation desktop-nav">
                     <li class="menu-item menu-item-has-children">
@@ -4611,28 +4701,25 @@ footer hr {
                     </li>
                 </ul>
             </nav>
-        </div>
-
-        <!-- Desktop Buttons -->
-        <div class="navigation-actions">
-            <button class="btn btn-secondary">Become a member</button>
-            <button class="btn btn-primary">Donate</button>
-            <!-- Language Switcher -->
-            <div class="language-selector">
-                <div class="current-lang">
-                    <i class="fas fa-globe"></i>
-                    <span id="current-lang-code">EN</span>
-                    <i class="fas fa-chevron-down"></i>
-                </div>
-                <div class="lang-dropdown">
-                    <a href="#" data-lang="si">Slovenščina (SI)</a>
-                    <a href="#" data-lang="en">English (EN)</a>
-                    <a href="#" data-lang="mk">Македонски (MK)</a>
+            <div class="navigation-actions">
+                <button class="btn btn-secondary">Become a member</button>
+                <button class="btn btn-primary">Donate</button>
+                <div class="language-selector">
+                    <div class="current-lang">
+                        <i class="fas fa-globe"></i>
+                        <span id="current-lang-code">EN</span>
+                        <i class="fas fa-chevron-down"></i>
+                    </div>
+                    <div class="lang-dropdown">
+                        <a href="#" data-lang="si">Slovenščina (SI)</a>
+                        <a href="#" data-lang="en">English (EN)</a>
+                        <a href="#" data-lang="mk">Македонски (MK)</a>
+                    </div>
                 </div>
             </div>
         </div>
 
-        <!-- Mobile Menu Icon (Hamburger/X) -->
+        <!-- Ikona za mobilni meni ostaja ločena za lažje upravljanje -->
         <div class="mobile-menu-icon">
             <i class="fas fa-bars"></i>
             <i class="fas fa-times"></i>
@@ -4640,7 +4727,7 @@ footer hr {
     </div>
 </header>
 
-<!-- Mobile Navigation Panel (ostane znotraj markerjev, a za <header>) -->
+<!-- Panel za mobilno navigacijo (struktura ostaja enaka) -->
 <div class="mobile-nav-panel">
     <nav>
         <ul class="navigation mobile-nav">
@@ -4689,18 +4776,27 @@ footer hr {
     <div class="navigation-actions">
         <button class="btn btn-secondary">Become a member</button>
         <button class="btn btn-primary">Donate</button>
-        <!-- Language Switcher (for mobile) -->
         <div class="language-selector">
-            <div class="current-lang">
+            <button class="current-lang" id="mobile-lang-trigger">
                 <i class="fas fa-globe"></i>
-                <span id="current-lang-code-mobile">EN</span>
-                <i class="fas fa-chevron-down"></i>
-            </div>
-            <div class="lang-dropdown">
-                <a href="#" data-lang="si">Slovenščina (SI)</a>
-                <a href="#" data-lang="en">English (EN)</a>
-                <a href="#" data-lang="mk">Македонски (MK)</a>
-            </div>
+                <span>EN</span>
+                <i class="fas fa-chevron-right"></i>
+            </button>
+        </div>
+    </div>
+</div>
+
+<!-- Modalno okno za izbiro jezika (ostaja enako) -->
+<div id="language-modal-overlay">
+    <div class="language-modal-content">
+        <div class="language-modal-header">
+            <h3>Select Language</h3>
+            <button id="language-modal-close" aria-label="Close language selection">&times;</button>
+        </div>
+        <div class="language-modal-body">
+            <a href="#" data-lang="si">Slovenščina (SI)</a>
+            <a href="#" data-lang="en" class="active-lang">English (EN)</a>
+            <a href="#" data-lang="mk">Македонски (MK)</a>
         </div>
     </div>
 </div>
@@ -5090,7 +5186,7 @@ footer hr {
         <div class="navigation-actions">
             <button class="btn btn-secondary">Become a member</button>
             <button class="btn btn-primary">Donate</button>
-            <!-- Language Switcher -->
+            <!-- Language Switcher (Desktop Dropdown) -->
             <div class="language-selector">
                 <div class="current-lang">
                     <i class="fas fa-globe"></i>
@@ -5113,7 +5209,7 @@ footer hr {
     </div>
 </header>
 
-<!-- KLJUČNA SPREMEMBA: Mobilni panel je zdaj ZUNAJ <header> elementa -->
+<!-- Mobile Navigation Panel -->
 <div class="mobile-nav-panel">
     <nav>
         <ul class="navigation mobile-nav">
@@ -5162,18 +5258,28 @@ footer hr {
     <div class="navigation-actions">
         <button class="btn btn-secondary">Become a member</button>
         <button class="btn btn-primary">Donate</button>
-        <!-- Language Switcher (for mobile) -->
+        <!-- Language Switcher (Mobile Button - Triggers Modal) -->
         <div class="language-selector">
-            <div class="current-lang">
+            <button class="current-lang" id="mobile-lang-trigger">
                 <i class="fas fa-globe"></i>
-                <span id="current-lang-code-mobile">EN</span>
-                <i class="fas fa-chevron-down"></i>
-            </div>
-            <div class="lang-dropdown">
-                <a href="#" data-lang="si">Slovenščina (SI)</a>
-                <a href="#" data-lang="en">English (EN)</a>
-                <a href="#" data-lang="mk">Македонски (MK)</a>
-            </div>
+                <span>EN</span>
+                <i class="fas fa-chevron-right"></i>
+            </button>
+        </div>
+    </div>
+</div>
+
+<!-- Language Selection Modal (for Mobile) -->
+<div id="language-modal-overlay">
+    <div class="language-modal-content">
+        <div class="language-modal-header">
+            <h3>Select Language</h3>
+            <button id="language-modal-close" aria-label="Close language selection">&times;</button>
+        </div>
+        <div class="language-modal-body">
+            <a href="#" data-lang="si">Slovenščina (SI)</a>
+            <a href="#" data-lang="en" class="active-lang">English (EN)</a>
+            <a href="#" data-lang="mk">Македонски (MK)</a>
         </div>
     </div>
 </div>
@@ -5479,7 +5585,6 @@ footer hr {
 </footer>
 <!-- END_FOOTER -->
 
-    <script src="../main.js"></script>
 </body>
 </html>"""
 
@@ -5509,11 +5614,13 @@ footer hr {
     <!-- START_HEADER -->
 <header class="dropdown-header-navigation">
     <div class="container">
-        <div class="header-content">
-            <a href="../../en/" class="logo-link">
-                <img src="../../images/1-logo.png" alt="Macedonian Student Organisation in Slovenia Logo" class="logo-img">
-            </a>
-            <!-- Desktop Navigation -->
+        <!-- Logotip je zdaj samostojen element na levi strani -->
+        <a href="../../en/" class="logo-link">
+            <img src="../../images/1-logo.png" alt="Macedonian Student Organisation in Slovenia Logo" class="logo-img">
+        </a>
+        
+        <!-- Nov ovoj za vse elemente na desni strani -->
+        <div class="header-right-wrapper">
             <nav>
                 <ul class="navigation desktop-nav">
                     <li class="menu-item menu-item-has-children">
@@ -5558,28 +5665,25 @@ footer hr {
                     </li>
                 </ul>
             </nav>
-        </div>
-
-        <!-- Desktop Buttons -->
-        <div class="navigation-actions">
-            <button class="btn btn-secondary">Become a member</button>
-            <button class="btn btn-primary">Donate</button>
-            <!-- Language Switcher -->
-            <div class="language-selector">
-                <div class="current-lang">
-                    <i class="fas fa-globe"></i>
-                    <span id="current-lang-code">EN</span>
-                    <i class="fas fa-chevron-down"></i>
-                </div>
-                <div class="lang-dropdown">
-                    <a href="#" data-lang="si">Slovenščina (SI)</a>
-                    <a href="#" data-lang="en">English (EN)</a>
-                    <a href="#" data-lang="mk">Македонски (MK)</a>
+            <div class="navigation-actions">
+                <button class="btn btn-secondary">Become a member</button>
+                <button class="btn btn-primary">Donate</button>
+                <div class="language-selector">
+                    <div class="current-lang">
+                        <i class="fas fa-globe"></i>
+                        <span id="current-lang-code">EN</span>
+                        <i class="fas fa-chevron-down"></i>
+                    </div>
+                    <div class="lang-dropdown">
+                        <a href="#" data-lang="si">Slovenščina (SI)</a>
+                        <a href="#" data-lang="en">English (EN)</a>
+                        <a href="#" data-lang="mk">Македонски (MK)</a>
+                    </div>
                 </div>
             </div>
         </div>
 
-        <!-- Mobile Menu Icon (Hamburger/X) -->
+        <!-- Ikona za mobilni meni ostaja ločena za lažje upravljanje -->
         <div class="mobile-menu-icon">
             <i class="fas fa-bars"></i>
             <i class="fas fa-times"></i>
@@ -5587,7 +5691,7 @@ footer hr {
     </div>
 </header>
 
-<!-- Mobile Navigation Panel (ostane znotraj markerjev, a za <header>) -->
+<!-- Panel za mobilno navigacijo (struktura ostaja enaka) -->
 <div class="mobile-nav-panel">
     <nav>
         <ul class="navigation mobile-nav">
@@ -5636,18 +5740,27 @@ footer hr {
     <div class="navigation-actions">
         <button class="btn btn-secondary">Become a member</button>
         <button class="btn btn-primary">Donate</button>
-        <!-- Language Switcher (for mobile) -->
         <div class="language-selector">
-            <div class="current-lang">
+            <button class="current-lang" id="mobile-lang-trigger">
                 <i class="fas fa-globe"></i>
-                <span id="current-lang-code-mobile">EN</span>
-                <i class="fas fa-chevron-down"></i>
-            </div>
-            <div class="lang-dropdown">
-                <a href="#" data-lang="si">Slovenščina (SI)</a>
-                <a href="#" data-lang="en">English (EN)</a>
-                <a href="#" data-lang="mk">Македонски (MK)</a>
-            </div>
+                <span>EN</span>
+                <i class="fas fa-chevron-right"></i>
+            </button>
+        </div>
+    </div>
+</div>
+
+<!-- Modalno okno za izbiro jezika (ostaja enako) -->
+<div id="language-modal-overlay">
+    <div class="language-modal-content">
+        <div class="language-modal-header">
+            <h3>Select Language</h3>
+            <button id="language-modal-close" aria-label="Close language selection">&times;</button>
+        </div>
+        <div class="language-modal-body">
+            <a href="#" data-lang="si">Slovenščina (SI)</a>
+            <a href="#" data-lang="en" class="active-lang">English (EN)</a>
+            <a href="#" data-lang="mk">Македонски (MK)</a>
         </div>
     </div>
 </div>
@@ -5898,7 +6011,7 @@ footer hr {
         <div class="navigation-actions">
             <button class="btn btn-secondary">Become a member</button>
             <button class="btn btn-primary">Donate</button>
-            <!-- Language Switcher -->
+            <!-- Language Switcher (Desktop Dropdown) -->
             <div class="language-selector">
                 <div class="current-lang">
                     <i class="fas fa-globe"></i>
@@ -5921,7 +6034,7 @@ footer hr {
     </div>
 </header>
 
-<!-- Mobile Navigation Panel (ostane znotraj markerjev, a za <header>) -->
+<!-- Mobile Navigation Panel -->
 <div class="mobile-nav-panel">
     <nav>
         <ul class="navigation mobile-nav">
@@ -5970,18 +6083,28 @@ footer hr {
     <div class="navigation-actions">
         <button class="btn btn-secondary">Become a member</button>
         <button class="btn btn-primary">Donate</button>
-        <!-- Language Switcher (for mobile) -->
+        <!-- Language Switcher (Mobile Button - Triggers Modal) -->
         <div class="language-selector">
-            <div class="current-lang">
+            <button class="current-lang" id="mobile-lang-trigger">
                 <i class="fas fa-globe"></i>
-                <span id="current-lang-code-mobile">EN</span>
-                <i class="fas fa-chevron-down"></i>
-            </div>
-            <div class="lang-dropdown">
-                <a href="#" data-lang="si">Slovenščina (SI)</a>
-                <a href="#" data-lang="en">English (EN)</a>
-                <a href="#" data-lang="mk">Македонски (MK)</a>
-            </div>
+                <span>EN</span>
+                <i class="fas fa-chevron-right"></i>
+            </button>
+        </div>
+    </div>
+</div>
+
+<!-- Language Selection Modal (for Mobile) -->
+<div id="language-modal-overlay">
+    <div class="language-modal-content">
+        <div class="language-modal-header">
+            <h3>Select Language</h3>
+            <button id="language-modal-close" aria-label="Close language selection">&times;</button>
+        </div>
+        <div class="language-modal-body">
+            <a href="#" data-lang="si">Slovenščina (SI)</a>
+            <a href="#" data-lang="en" class="active-lang">English (EN)</a>
+            <a href="#" data-lang="mk">Македонски (MK)</a>
         </div>
     </div>
 </div>
@@ -6144,7 +6267,7 @@ footer hr {
             </div>
         </div>
     </div>
-    
+    <script src="../../main.js"></script>
 </footer>
 <!-- END_FOOTER -->
 
@@ -6177,11 +6300,13 @@ footer hr {
     <!-- START_HEADER -->
 <header class="dropdown-header-navigation">
     <div class="container">
-        <div class="header-content">
-            <a href="../../../en/" class="logo-link">
-                <img src="../../../images/1-logo.png" alt="Macedonian Student Organisation in Slovenia Logo" class="logo-img">
-            </a>
-            <!-- Desktop Navigation -->
+        <!-- Logotip je zdaj samostojen element na levi strani -->
+        <a href="../../../en/" class="logo-link">
+            <img src="../../../images/1-logo.png" alt="Macedonian Student Organisation in Slovenia Logo" class="logo-img">
+        </a>
+        
+        <!-- Nov ovoj za vse elemente na desni strani -->
+        <div class="header-right-wrapper">
             <nav>
                 <ul class="navigation desktop-nav">
                     <li class="menu-item menu-item-has-children">
@@ -6226,28 +6351,25 @@ footer hr {
                     </li>
                 </ul>
             </nav>
-        </div>
-
-        <!-- Desktop Buttons -->
-        <div class="navigation-actions">
-            <button class="btn btn-secondary">Become a member</button>
-            <button class="btn btn-primary">Donate</button>
-            <!-- Language Switcher -->
-            <div class="language-selector">
-                <div class="current-lang">
-                    <i class="fas fa-globe"></i>
-                    <span id="current-lang-code">EN</span>
-                    <i class="fas fa-chevron-down"></i>
-                </div>
-                <div class="lang-dropdown">
-                    <a href="#" data-lang="si">Slovenščina (SI)</a>
-                    <a href="#" data-lang="en">English (EN)</a>
-                    <a href="#" data-lang="mk">Македонски (MK)</a>
+            <div class="navigation-actions">
+                <button class="btn btn-secondary">Become a member</button>
+                <button class="btn btn-primary">Donate</button>
+                <div class="language-selector">
+                    <div class="current-lang">
+                        <i class="fas fa-globe"></i>
+                        <span id="current-lang-code">EN</span>
+                        <i class="fas fa-chevron-down"></i>
+                    </div>
+                    <div class="lang-dropdown">
+                        <a href="#" data-lang="si">Slovenščina (SI)</a>
+                        <a href="#" data-lang="en">English (EN)</a>
+                        <a href="#" data-lang="mk">Македонски (MK)</a>
+                    </div>
                 </div>
             </div>
         </div>
 
-        <!-- Mobile Menu Icon (Hamburger/X) -->
+        <!-- Ikona za mobilni meni ostaja ločena za lažje upravljanje -->
         <div class="mobile-menu-icon">
             <i class="fas fa-bars"></i>
             <i class="fas fa-times"></i>
@@ -6255,7 +6377,7 @@ footer hr {
     </div>
 </header>
 
-<!-- Mobile Navigation Panel (ostane znotraj markerjev, a za <header>) -->
+<!-- Panel za mobilno navigacijo (struktura ostaja enaka) -->
 <div class="mobile-nav-panel">
     <nav>
         <ul class="navigation mobile-nav">
@@ -6304,18 +6426,27 @@ footer hr {
     <div class="navigation-actions">
         <button class="btn btn-secondary">Become a member</button>
         <button class="btn btn-primary">Donate</button>
-        <!-- Language Switcher (for mobile) -->
         <div class="language-selector">
-            <div class="current-lang">
+            <button class="current-lang" id="mobile-lang-trigger">
                 <i class="fas fa-globe"></i>
-                <span id="current-lang-code-mobile">EN</span>
-                <i class="fas fa-chevron-down"></i>
-            </div>
-            <div class="lang-dropdown">
-                <a href="#" data-lang="si">Slovenščina (SI)</a>
-                <a href="#" data-lang="en">English (EN)</a>
-                <a href="#" data-lang="mk">Македонски (MK)</a>
-            </div>
+                <span>EN</span>
+                <i class="fas fa-chevron-right"></i>
+            </button>
+        </div>
+    </div>
+</div>
+
+<!-- Modalno okno za izbiro jezika (ostaja enako) -->
+<div id="language-modal-overlay">
+    <div class="language-modal-content">
+        <div class="language-modal-header">
+            <h3>Select Language</h3>
+            <button id="language-modal-close" aria-label="Close language selection">&times;</button>
+        </div>
+        <div class="language-modal-body">
+            <a href="#" data-lang="si">Slovenščina (SI)</a>
+            <a href="#" data-lang="en" class="active-lang">English (EN)</a>
+            <a href="#" data-lang="mk">Македонски (MK)</a>
         </div>
     </div>
 </div>
@@ -6575,7 +6706,7 @@ footer hr {
         <div class="navigation-actions">
             <button class="btn btn-secondary">Become a member</button>
             <button class="btn btn-primary">Donate</button>
-            <!-- Language Switcher -->
+            <!-- Language Switcher (Desktop Dropdown) -->
             <div class="language-selector">
                 <div class="current-lang">
                     <i class="fas fa-globe"></i>
@@ -6598,7 +6729,7 @@ footer hr {
     </div>
 </header>
 
-<!-- KLJUČNA SPREMEMBA: Mobilni panel je zdaj ZUNAJ <header> elementa -->
+<!-- Mobile Navigation Panel -->
 <div class="mobile-nav-panel">
     <nav>
         <ul class="navigation mobile-nav">
@@ -6647,18 +6778,28 @@ footer hr {
     <div class="navigation-actions">
         <button class="btn btn-secondary">Become a member</button>
         <button class="btn btn-primary">Donate</button>
-        <!-- Language Switcher (for mobile) -->
+        <!-- Language Switcher (Mobile Button - Triggers Modal) -->
         <div class="language-selector">
-            <div class="current-lang">
+            <button class="current-lang" id="mobile-lang-trigger">
                 <i class="fas fa-globe"></i>
-                <span id="current-lang-code-mobile">EN</span>
-                <i class="fas fa-chevron-down"></i>
-            </div>
-            <div class="lang-dropdown">
-                <a href="#" data-lang="si">Slovenščina (SI)</a>
-                <a href="#" data-lang="en">English (EN)</a>
-                <a href="#" data-lang="mk">Македонски (MK)</a>
-            </div>
+                <span>EN</span>
+                <i class="fas fa-chevron-right"></i>
+            </button>
+        </div>
+    </div>
+</div>
+
+<!-- Language Selection Modal (for Mobile) -->
+<div id="language-modal-overlay">
+    <div class="language-modal-content">
+        <div class="language-modal-header">
+            <h3>Select Language</h3>
+            <button id="language-modal-close" aria-label="Close language selection">&times;</button>
+        </div>
+        <div class="language-modal-body">
+            <a href="#" data-lang="si">Slovenščina (SI)</a>
+            <a href="#" data-lang="en" class="active-lang">English (EN)</a>
+            <a href="#" data-lang="mk">Македонски (MK)</a>
         </div>
     </div>
 </div>
@@ -6863,11 +7004,13 @@ footer hr {
     <!-- START_HEADER -->
 <header class="dropdown-header-navigation">
     <div class="container">
-        <div class="header-content">
-            <a href="../../../en/" class="logo-link">
-                <img src="../../../images/1-logo.png" alt="Macedonian Student Organisation in Slovenia Logo" class="logo-img">
-            </a>
-            <!-- Desktop Navigation -->
+        <!-- Logotip je zdaj samostojen element na levi strani -->
+        <a href="../../../en/" class="logo-link">
+            <img src="../../../images/1-logo.png" alt="Macedonian Student Organisation in Slovenia Logo" class="logo-img">
+        </a>
+        
+        <!-- Nov ovoj za vse elemente na desni strani -->
+        <div class="header-right-wrapper">
             <nav>
                 <ul class="navigation desktop-nav">
                     <li class="menu-item menu-item-has-children">
@@ -6912,28 +7055,25 @@ footer hr {
                     </li>
                 </ul>
             </nav>
-        </div>
-
-        <!-- Desktop Buttons -->
-        <div class="navigation-actions">
-            <button class="btn btn-secondary">Become a member</button>
-            <button class="btn btn-primary">Donate</button>
-            <!-- Language Switcher -->
-            <div class="language-selector">
-                <div class="current-lang">
-                    <i class="fas fa-globe"></i>
-                    <span id="current-lang-code">EN</span>
-                    <i class="fas fa-chevron-down"></i>
-                </div>
-                <div class="lang-dropdown">
-                    <a href="#" data-lang="si">Slovenščina (SI)</a>
-                    <a href="#" data-lang="en">English (EN)</a>
-                    <a href="#" data-lang="mk">Македонски (MK)</a>
+            <div class="navigation-actions">
+                <button class="btn btn-secondary">Become a member</button>
+                <button class="btn btn-primary">Donate</button>
+                <div class="language-selector">
+                    <div class="current-lang">
+                        <i class="fas fa-globe"></i>
+                        <span id="current-lang-code">EN</span>
+                        <i class="fas fa-chevron-down"></i>
+                    </div>
+                    <div class="lang-dropdown">
+                        <a href="#" data-lang="si">Slovenščina (SI)</a>
+                        <a href="#" data-lang="en">English (EN)</a>
+                        <a href="#" data-lang="mk">Македонски (MK)</a>
+                    </div>
                 </div>
             </div>
         </div>
 
-        <!-- Mobile Menu Icon (Hamburger/X) -->
+        <!-- Ikona za mobilni meni ostaja ločena za lažje upravljanje -->
         <div class="mobile-menu-icon">
             <i class="fas fa-bars"></i>
             <i class="fas fa-times"></i>
@@ -6941,7 +7081,7 @@ footer hr {
     </div>
 </header>
 
-<!-- Mobile Navigation Panel (ostane znotraj markerjev, a za <header>) -->
+<!-- Panel za mobilno navigacijo (struktura ostaja enaka) -->
 <div class="mobile-nav-panel">
     <nav>
         <ul class="navigation mobile-nav">
@@ -6990,18 +7130,27 @@ footer hr {
     <div class="navigation-actions">
         <button class="btn btn-secondary">Become a member</button>
         <button class="btn btn-primary">Donate</button>
-        <!-- Language Switcher (for mobile) -->
         <div class="language-selector">
-            <div class="current-lang">
+            <button class="current-lang" id="mobile-lang-trigger">
                 <i class="fas fa-globe"></i>
-                <span id="current-lang-code-mobile">EN</span>
-                <i class="fas fa-chevron-down"></i>
-            </div>
-            <div class="lang-dropdown">
-                <a href="#" data-lang="si">Slovenščina (SI)</a>
-                <a href="#" data-lang="en">English (EN)</a>
-                <a href="#" data-lang="mk">Македонски (MK)</a>
-            </div>
+                <span>EN</span>
+                <i class="fas fa-chevron-right"></i>
+            </button>
+        </div>
+    </div>
+</div>
+
+<!-- Modalno okno za izbiro jezika (ostaja enako) -->
+<div id="language-modal-overlay">
+    <div class="language-modal-content">
+        <div class="language-modal-header">
+            <h3>Select Language</h3>
+            <button id="language-modal-close" aria-label="Close language selection">&times;</button>
+        </div>
+        <div class="language-modal-body">
+            <a href="#" data-lang="si">Slovenščina (SI)</a>
+            <a href="#" data-lang="en" class="active-lang">English (EN)</a>
+            <a href="#" data-lang="mk">Македонски (MK)</a>
         </div>
     </div>
 </div>
@@ -7261,7 +7410,7 @@ footer hr {
         <div class="navigation-actions">
             <button class="btn btn-secondary">Become a member</button>
             <button class="btn btn-primary">Donate</button>
-            <!-- Language Switcher -->
+            <!-- Language Switcher (Desktop Dropdown) -->
             <div class="language-selector">
                 <div class="current-lang">
                     <i class="fas fa-globe"></i>
@@ -7284,7 +7433,7 @@ footer hr {
     </div>
 </header>
 
-<!-- KLJUČNA SPREMEMBA: Mobilni panel je zdaj ZUNAJ <header> elementa -->
+<!-- Mobile Navigation Panel -->
 <div class="mobile-nav-panel">
     <nav>
         <ul class="navigation mobile-nav">
@@ -7333,18 +7482,28 @@ footer hr {
     <div class="navigation-actions">
         <button class="btn btn-secondary">Become a member</button>
         <button class="btn btn-primary">Donate</button>
-        <!-- Language Switcher (for mobile) -->
+        <!-- Language Switcher (Mobile Button - Triggers Modal) -->
         <div class="language-selector">
-            <div class="current-lang">
+            <button class="current-lang" id="mobile-lang-trigger">
                 <i class="fas fa-globe"></i>
-                <span id="current-lang-code-mobile">EN</span>
-                <i class="fas fa-chevron-down"></i>
-            </div>
-            <div class="lang-dropdown">
-                <a href="#" data-lang="si">Slovenščina (SI)</a>
-                <a href="#" data-lang="en">English (EN)</a>
-                <a href="#" data-lang="mk">Македонски (MK)</a>
-            </div>
+                <span>EN</span>
+                <i class="fas fa-chevron-right"></i>
+            </button>
+        </div>
+    </div>
+</div>
+
+<!-- Language Selection Modal (for Mobile) -->
+<div id="language-modal-overlay">
+    <div class="language-modal-content">
+        <div class="language-modal-header">
+            <h3>Select Language</h3>
+            <button id="language-modal-close" aria-label="Close language selection">&times;</button>
+        </div>
+        <div class="language-modal-body">
+            <a href="#" data-lang="si">Slovenščina (SI)</a>
+            <a href="#" data-lang="en" class="active-lang">English (EN)</a>
+            <a href="#" data-lang="mk">Македонски (MK)</a>
         </div>
     </div>
 </div>
@@ -7549,11 +7708,13 @@ footer hr {
     <!-- START_HEADER -->
 <header class="dropdown-header-navigation">
     <div class="container">
-        <div class="header-content">
-            <a href="../../../en/" class="logo-link">
-                <img src="../../../images/1-logo.png" alt="Macedonian Student Organisation in Slovenia Logo" class="logo-img">
-            </a>
-            <!-- Desktop Navigation -->
+        <!-- Logotip je zdaj samostojen element na levi strani -->
+        <a href="../../../en/" class="logo-link">
+            <img src="../../../images/1-logo.png" alt="Macedonian Student Organisation in Slovenia Logo" class="logo-img">
+        </a>
+        
+        <!-- Nov ovoj za vse elemente na desni strani -->
+        <div class="header-right-wrapper">
             <nav>
                 <ul class="navigation desktop-nav">
                     <li class="menu-item menu-item-has-children">
@@ -7598,28 +7759,25 @@ footer hr {
                     </li>
                 </ul>
             </nav>
-        </div>
-
-        <!-- Desktop Buttons -->
-        <div class="navigation-actions">
-            <button class="btn btn-secondary">Become a member</button>
-            <button class="btn btn-primary">Donate</button>
-            <!-- Language Switcher -->
-            <div class="language-selector">
-                <div class="current-lang">
-                    <i class="fas fa-globe"></i>
-                    <span id="current-lang-code">EN</span>
-                    <i class="fas fa-chevron-down"></i>
-                </div>
-                <div class="lang-dropdown">
-                    <a href="#" data-lang="si">Slovenščina (SI)</a>
-                    <a href="#" data-lang="en">English (EN)</a>
-                    <a href="#" data-lang="mk">Македонски (MK)</a>
+            <div class="navigation-actions">
+                <button class="btn btn-secondary">Become a member</button>
+                <button class="btn btn-primary">Donate</button>
+                <div class="language-selector">
+                    <div class="current-lang">
+                        <i class="fas fa-globe"></i>
+                        <span id="current-lang-code">EN</span>
+                        <i class="fas fa-chevron-down"></i>
+                    </div>
+                    <div class="lang-dropdown">
+                        <a href="#" data-lang="si">Slovenščina (SI)</a>
+                        <a href="#" data-lang="en">English (EN)</a>
+                        <a href="#" data-lang="mk">Македонски (MK)</a>
+                    </div>
                 </div>
             </div>
         </div>
 
-        <!-- Mobile Menu Icon (Hamburger/X) -->
+        <!-- Ikona za mobilni meni ostaja ločena za lažje upravljanje -->
         <div class="mobile-menu-icon">
             <i class="fas fa-bars"></i>
             <i class="fas fa-times"></i>
@@ -7627,7 +7785,7 @@ footer hr {
     </div>
 </header>
 
-<!-- Mobile Navigation Panel (ostane znotraj markerjev, a za <header>) -->
+<!-- Panel za mobilno navigacijo (struktura ostaja enaka) -->
 <div class="mobile-nav-panel">
     <nav>
         <ul class="navigation mobile-nav">
@@ -7676,18 +7834,27 @@ footer hr {
     <div class="navigation-actions">
         <button class="btn btn-secondary">Become a member</button>
         <button class="btn btn-primary">Donate</button>
-        <!-- Language Switcher (for mobile) -->
         <div class="language-selector">
-            <div class="current-lang">
+            <button class="current-lang" id="mobile-lang-trigger">
                 <i class="fas fa-globe"></i>
-                <span id="current-lang-code-mobile">EN</span>
-                <i class="fas fa-chevron-down"></i>
-            </div>
-            <div class="lang-dropdown">
-                <a href="#" data-lang="si">Slovenščina (SI)</a>
-                <a href="#" data-lang="en">English (EN)</a>
-                <a href="#" data-lang="mk">Македонски (MK)</a>
-            </div>
+                <span>EN</span>
+                <i class="fas fa-chevron-right"></i>
+            </button>
+        </div>
+    </div>
+</div>
+
+<!-- Modalno okno za izbiro jezika (ostaja enako) -->
+<div id="language-modal-overlay">
+    <div class="language-modal-content">
+        <div class="language-modal-header">
+            <h3>Select Language</h3>
+            <button id="language-modal-close" aria-label="Close language selection">&times;</button>
+        </div>
+        <div class="language-modal-body">
+            <a href="#" data-lang="si">Slovenščina (SI)</a>
+            <a href="#" data-lang="en" class="active-lang">English (EN)</a>
+            <a href="#" data-lang="mk">Македонски (MK)</a>
         </div>
     </div>
 </div>
@@ -7970,7 +8137,7 @@ footer hr {
         <div class="navigation-actions">
             <button class="btn btn-secondary">Become a member</button>
             <button class="btn btn-primary">Donate</button>
-            <!-- Language Switcher -->
+            <!-- Language Switcher (Desktop Dropdown) -->
             <div class="language-selector">
                 <div class="current-lang">
                     <i class="fas fa-globe"></i>
@@ -7993,7 +8160,7 @@ footer hr {
     </div>
 </header>
 
-<!-- KLJUČNA SPREMEMBA: Mobilni panel je zdaj ZUNAJ <header> elementa -->
+<!-- Mobile Navigation Panel -->
 <div class="mobile-nav-panel">
     <nav>
         <ul class="navigation mobile-nav">
@@ -8042,18 +8209,28 @@ footer hr {
     <div class="navigation-actions">
         <button class="btn btn-secondary">Become a member</button>
         <button class="btn btn-primary">Donate</button>
-        <!-- Language Switcher (for mobile) -->
+        <!-- Language Switcher (Mobile Button - Triggers Modal) -->
         <div class="language-selector">
-            <div class="current-lang">
+            <button class="current-lang" id="mobile-lang-trigger">
                 <i class="fas fa-globe"></i>
-                <span id="current-lang-code-mobile">EN</span>
-                <i class="fas fa-chevron-down"></i>
-            </div>
-            <div class="lang-dropdown">
-                <a href="#" data-lang="si">Slovenščina (SI)</a>
-                <a href="#" data-lang="en">English (EN)</a>
-                <a href="#" data-lang="mk">Македонски (MK)</a>
-            </div>
+                <span>EN</span>
+                <i class="fas fa-chevron-right"></i>
+            </button>
+        </div>
+    </div>
+</div>
+
+<!-- Language Selection Modal (for Mobile) -->
+<div id="language-modal-overlay">
+    <div class="language-modal-content">
+        <div class="language-modal-header">
+            <h3>Select Language</h3>
+            <button id="language-modal-close" aria-label="Close language selection">&times;</button>
+        </div>
+        <div class="language-modal-body">
+            <a href="#" data-lang="si">Slovenščina (SI)</a>
+            <a href="#" data-lang="en" class="active-lang">English (EN)</a>
+            <a href="#" data-lang="mk">Македонски (MK)</a>
         </div>
     </div>
 </div>
@@ -8281,11 +8458,13 @@ footer hr {
     <!-- START_HEADER -->
 <header class="dropdown-header-navigation">
     <div class="container">
-        <div class="header-content">
-            <a href="../../../en/" class="logo-link">
-                <img src="../../../images/1-logo.png" alt="Macedonian Student Organisation in Slovenia Logo" class="logo-img">
-            </a>
-            <!-- Desktop Navigation -->
+        <!-- Logotip je zdaj samostojen element na levi strani -->
+        <a href="../../../en/" class="logo-link">
+            <img src="../../../images/1-logo.png" alt="Macedonian Student Organisation in Slovenia Logo" class="logo-img">
+        </a>
+        
+        <!-- Nov ovoj za vse elemente na desni strani -->
+        <div class="header-right-wrapper">
             <nav>
                 <ul class="navigation desktop-nav">
                     <li class="menu-item menu-item-has-children">
@@ -8330,28 +8509,25 @@ footer hr {
                     </li>
                 </ul>
             </nav>
-        </div>
-
-        <!-- Desktop Buttons -->
-        <div class="navigation-actions">
-            <button class="btn btn-secondary">Become a member</button>
-            <button class="btn btn-primary">Donate</button>
-            <!-- Language Switcher -->
-            <div class="language-selector">
-                <div class="current-lang">
-                    <i class="fas fa-globe"></i>
-                    <span id="current-lang-code">EN</span>
-                    <i class="fas fa-chevron-down"></i>
-                </div>
-                <div class="lang-dropdown">
-                    <a href="#" data-lang="si">Slovenščina (SI)</a>
-                    <a href="#" data-lang="en">English (EN)</a>
-                    <a href="#" data-lang="mk">Македонски (MK)</a>
+            <div class="navigation-actions">
+                <button class="btn btn-secondary">Become a member</button>
+                <button class="btn btn-primary">Donate</button>
+                <div class="language-selector">
+                    <div class="current-lang">
+                        <i class="fas fa-globe"></i>
+                        <span id="current-lang-code">EN</span>
+                        <i class="fas fa-chevron-down"></i>
+                    </div>
+                    <div class="lang-dropdown">
+                        <a href="#" data-lang="si">Slovenščina (SI)</a>
+                        <a href="#" data-lang="en">English (EN)</a>
+                        <a href="#" data-lang="mk">Македонски (MK)</a>
+                    </div>
                 </div>
             </div>
         </div>
 
-        <!-- Mobile Menu Icon (Hamburger/X) -->
+        <!-- Ikona za mobilni meni ostaja ločena za lažje upravljanje -->
         <div class="mobile-menu-icon">
             <i class="fas fa-bars"></i>
             <i class="fas fa-times"></i>
@@ -8359,7 +8535,7 @@ footer hr {
     </div>
 </header>
 
-<!-- Mobile Navigation Panel (ostane znotraj markerjev, a za <header>) -->
+<!-- Panel za mobilno navigacijo (struktura ostaja enaka) -->
 <div class="mobile-nav-panel">
     <nav>
         <ul class="navigation mobile-nav">
@@ -8408,18 +8584,27 @@ footer hr {
     <div class="navigation-actions">
         <button class="btn btn-secondary">Become a member</button>
         <button class="btn btn-primary">Donate</button>
-        <!-- Language Switcher (for mobile) -->
         <div class="language-selector">
-            <div class="current-lang">
+            <button class="current-lang" id="mobile-lang-trigger">
                 <i class="fas fa-globe"></i>
-                <span id="current-lang-code-mobile">EN</span>
-                <i class="fas fa-chevron-down"></i>
-            </div>
-            <div class="lang-dropdown">
-                <a href="#" data-lang="si">Slovenščina (SI)</a>
-                <a href="#" data-lang="en">English (EN)</a>
-                <a href="#" data-lang="mk">Македонски (MK)</a>
-            </div>
+                <span>EN</span>
+                <i class="fas fa-chevron-right"></i>
+            </button>
+        </div>
+    </div>
+</div>
+
+<!-- Modalno okno za izbiro jezika (ostaja enako) -->
+<div id="language-modal-overlay">
+    <div class="language-modal-content">
+        <div class="language-modal-header">
+            <h3>Select Language</h3>
+            <button id="language-modal-close" aria-label="Close language selection">&times;</button>
+        </div>
+        <div class="language-modal-body">
+            <a href="#" data-lang="si">Slovenščina (SI)</a>
+            <a href="#" data-lang="en" class="active-lang">English (EN)</a>
+            <a href="#" data-lang="mk">Македонски (MK)</a>
         </div>
     </div>
 </div>
@@ -8694,7 +8879,7 @@ footer hr {
         <div class="navigation-actions">
             <button class="btn btn-secondary">Become a member</button>
             <button class="btn btn-primary">Donate</button>
-            <!-- Language Switcher -->
+            <!-- Language Switcher (Desktop Dropdown) -->
             <div class="language-selector">
                 <div class="current-lang">
                     <i class="fas fa-globe"></i>
@@ -8717,7 +8902,7 @@ footer hr {
     </div>
 </header>
 
-<!-- KLJUČNA SPREMEMBA: Mobilni panel je zdaj ZUNAJ <header> elementa -->
+<!-- Mobile Navigation Panel -->
 <div class="mobile-nav-panel">
     <nav>
         <ul class="navigation mobile-nav">
@@ -8766,18 +8951,28 @@ footer hr {
     <div class="navigation-actions">
         <button class="btn btn-secondary">Become a member</button>
         <button class="btn btn-primary">Donate</button>
-        <!-- Language Switcher (for mobile) -->
+        <!-- Language Switcher (Mobile Button - Triggers Modal) -->
         <div class="language-selector">
-            <div class="current-lang">
+            <button class="current-lang" id="mobile-lang-trigger">
                 <i class="fas fa-globe"></i>
-                <span id="current-lang-code-mobile">EN</span>
-                <i class="fas fa-chevron-down"></i>
-            </div>
-            <div class="lang-dropdown">
-                <a href="#" data-lang="si">Slovenščina (SI)</a>
-                <a href="#" data-lang="en">English (EN)</a>
-                <a href="#" data-lang="mk">Македонски (MK)</a>
-            </div>
+                <span>EN</span>
+                <i class="fas fa-chevron-right"></i>
+            </button>
+        </div>
+    </div>
+</div>
+
+<!-- Language Selection Modal (for Mobile) -->
+<div id="language-modal-overlay">
+    <div class="language-modal-content">
+        <div class="language-modal-header">
+            <h3>Select Language</h3>
+            <button id="language-modal-close" aria-label="Close language selection">&times;</button>
+        </div>
+        <div class="language-modal-body">
+            <a href="#" data-lang="si">Slovenščina (SI)</a>
+            <a href="#" data-lang="en" class="active-lang">English (EN)</a>
+            <a href="#" data-lang="mk">Македонски (MK)</a>
         </div>
     </div>
 </div>
@@ -8997,11 +9192,13 @@ footer hr {
     <!-- START_HEADER -->
 <header class="dropdown-header-navigation">
     <div class="container">
-        <div class="header-content">
-            <a href="../../../en/" class="logo-link">
-                <img src="../../../images/1-logo.png" alt="Macedonian Student Organisation in Slovenia Logo" class="logo-img">
-            </a>
-            <!-- Desktop Navigation -->
+        <!-- Logotip je zdaj samostojen element na levi strani -->
+        <a href="../../../en/" class="logo-link">
+            <img src="../../../images/1-logo.png" alt="Macedonian Student Organisation in Slovenia Logo" class="logo-img">
+        </a>
+        
+        <!-- Nov ovoj za vse elemente na desni strani -->
+        <div class="header-right-wrapper">
             <nav>
                 <ul class="navigation desktop-nav">
                     <li class="menu-item menu-item-has-children">
@@ -9046,28 +9243,25 @@ footer hr {
                     </li>
                 </ul>
             </nav>
-        </div>
-
-        <!-- Desktop Buttons -->
-        <div class="navigation-actions">
-            <button class="btn btn-secondary">Become a member</button>
-            <button class="btn btn-primary">Donate</button>
-            <!-- Language Switcher -->
-            <div class="language-selector">
-                <div class="current-lang">
-                    <i class="fas fa-globe"></i>
-                    <span id="current-lang-code">EN</span>
-                    <i class="fas fa-chevron-down"></i>
-                </div>
-                <div class="lang-dropdown">
-                    <a href="#" data-lang="si">Slovenščina (SI)</a>
-                    <a href="#" data-lang="en">English (EN)</a>
-                    <a href="#" data-lang="mk">Македонски (MK)</a>
+            <div class="navigation-actions">
+                <button class="btn btn-secondary">Become a member</button>
+                <button class="btn btn-primary">Donate</button>
+                <div class="language-selector">
+                    <div class="current-lang">
+                        <i class="fas fa-globe"></i>
+                        <span id="current-lang-code">EN</span>
+                        <i class="fas fa-chevron-down"></i>
+                    </div>
+                    <div class="lang-dropdown">
+                        <a href="#" data-lang="si">Slovenščina (SI)</a>
+                        <a href="#" data-lang="en">English (EN)</a>
+                        <a href="#" data-lang="mk">Македонски (MK)</a>
+                    </div>
                 </div>
             </div>
         </div>
 
-        <!-- Mobile Menu Icon (Hamburger/X) -->
+        <!-- Ikona za mobilni meni ostaja ločena za lažje upravljanje -->
         <div class="mobile-menu-icon">
             <i class="fas fa-bars"></i>
             <i class="fas fa-times"></i>
@@ -9075,7 +9269,7 @@ footer hr {
     </div>
 </header>
 
-<!-- Mobile Navigation Panel (ostane znotraj markerjev, a za <header>) -->
+<!-- Panel za mobilno navigacijo (struktura ostaja enaka) -->
 <div class="mobile-nav-panel">
     <nav>
         <ul class="navigation mobile-nav">
@@ -9124,18 +9318,27 @@ footer hr {
     <div class="navigation-actions">
         <button class="btn btn-secondary">Become a member</button>
         <button class="btn btn-primary">Donate</button>
-        <!-- Language Switcher (for mobile) -->
         <div class="language-selector">
-            <div class="current-lang">
+            <button class="current-lang" id="mobile-lang-trigger">
                 <i class="fas fa-globe"></i>
-                <span id="current-lang-code-mobile">EN</span>
-                <i class="fas fa-chevron-down"></i>
-            </div>
-            <div class="lang-dropdown">
-                <a href="#" data-lang="si">Slovenščina (SI)</a>
-                <a href="#" data-lang="en">English (EN)</a>
-                <a href="#" data-lang="mk">Македонски (MK)</a>
-            </div>
+                <span>EN</span>
+                <i class="fas fa-chevron-right"></i>
+            </button>
+        </div>
+    </div>
+</div>
+
+<!-- Modalno okno za izbiro jezika (ostaja enako) -->
+<div id="language-modal-overlay">
+    <div class="language-modal-content">
+        <div class="language-modal-header">
+            <h3>Select Language</h3>
+            <button id="language-modal-close" aria-label="Close language selection">&times;</button>
+        </div>
+        <div class="language-modal-body">
+            <a href="#" data-lang="si">Slovenščina (SI)</a>
+            <a href="#" data-lang="en" class="active-lang">English (EN)</a>
+            <a href="#" data-lang="mk">Македонски (MK)</a>
         </div>
     </div>
 </div>
@@ -9379,7 +9582,7 @@ footer hr {
         <div class="navigation-actions">
             <button class="btn btn-secondary">Become a member</button>
             <button class="btn btn-primary">Donate</button>
-            <!-- Language Switcher -->
+            <!-- Language Switcher (Desktop Dropdown) -->
             <div class="language-selector">
                 <div class="current-lang">
                     <i class="fas fa-globe"></i>
@@ -9402,7 +9605,7 @@ footer hr {
     </div>
 </header>
 
-<!-- KLJUČNA SPREMEMBA: Mobilni panel je zdaj ZUNAJ <header> elementa -->
+<!-- Mobile Navigation Panel -->
 <div class="mobile-nav-panel">
     <nav>
         <ul class="navigation mobile-nav">
@@ -9451,18 +9654,28 @@ footer hr {
     <div class="navigation-actions">
         <button class="btn btn-secondary">Become a member</button>
         <button class="btn btn-primary">Donate</button>
-        <!-- Language Switcher (for mobile) -->
+        <!-- Language Switcher (Mobile Button - Triggers Modal) -->
         <div class="language-selector">
-            <div class="current-lang">
+            <button class="current-lang" id="mobile-lang-trigger">
                 <i class="fas fa-globe"></i>
-                <span id="current-lang-code-mobile">EN</span>
-                <i class="fas fa-chevron-down"></i>
-            </div>
-            <div class="lang-dropdown">
-                <a href="#" data-lang="si">Slovenščina (SI)</a>
-                <a href="#" data-lang="en">English (EN)</a>
-                <a href="#" data-lang="mk">Македонски (MK)</a>
-            </div>
+                <span>EN</span>
+                <i class="fas fa-chevron-right"></i>
+            </button>
+        </div>
+    </div>
+</div>
+
+<!-- Language Selection Modal (for Mobile) -->
+<div id="language-modal-overlay">
+    <div class="language-modal-content">
+        <div class="language-modal-header">
+            <h3>Select Language</h3>
+            <button id="language-modal-close" aria-label="Close language selection">&times;</button>
+        </div>
+        <div class="language-modal-body">
+            <a href="#" data-lang="si">Slovenščina (SI)</a>
+            <a href="#" data-lang="en" class="active-lang">English (EN)</a>
+            <a href="#" data-lang="mk">Македонски (MK)</a>
         </div>
     </div>
 </div>
@@ -9651,11 +9864,13 @@ footer hr {
     <!-- START_HEADER -->
 <header class="dropdown-header-navigation">
     <div class="container">
-        <div class="header-content">
-            <a href="../../../en/" class="logo-link">
-                <img src="../../../images/1-logo.png" alt="Macedonian Student Organisation in Slovenia Logo" class="logo-img">
-            </a>
-            <!-- Desktop Navigation -->
+        <!-- Logotip je zdaj samostojen element na levi strani -->
+        <a href="../../../en/" class="logo-link">
+            <img src="../../../images/1-logo.png" alt="Macedonian Student Organisation in Slovenia Logo" class="logo-img">
+        </a>
+        
+        <!-- Nov ovoj za vse elemente na desni strani -->
+        <div class="header-right-wrapper">
             <nav>
                 <ul class="navigation desktop-nav">
                     <li class="menu-item menu-item-has-children">
@@ -9700,28 +9915,25 @@ footer hr {
                     </li>
                 </ul>
             </nav>
-        </div>
-
-        <!-- Desktop Buttons -->
-        <div class="navigation-actions">
-            <button class="btn btn-secondary">Become a member</button>
-            <button class="btn btn-primary">Donate</button>
-            <!-- Language Switcher -->
-            <div class="language-selector">
-                <div class="current-lang">
-                    <i class="fas fa-globe"></i>
-                    <span id="current-lang-code">EN</span>
-                    <i class="fas fa-chevron-down"></i>
-                </div>
-                <div class="lang-dropdown">
-                    <a href="#" data-lang="si">Slovenščina (SI)</a>
-                    <a href="#" data-lang="en">English (EN)</a>
-                    <a href="#" data-lang="mk">Македонски (MK)</a>
+            <div class="navigation-actions">
+                <button class="btn btn-secondary">Become a member</button>
+                <button class="btn btn-primary">Donate</button>
+                <div class="language-selector">
+                    <div class="current-lang">
+                        <i class="fas fa-globe"></i>
+                        <span id="current-lang-code">EN</span>
+                        <i class="fas fa-chevron-down"></i>
+                    </div>
+                    <div class="lang-dropdown">
+                        <a href="#" data-lang="si">Slovenščina (SI)</a>
+                        <a href="#" data-lang="en">English (EN)</a>
+                        <a href="#" data-lang="mk">Македонски (MK)</a>
+                    </div>
                 </div>
             </div>
         </div>
 
-        <!-- Mobile Menu Icon (Hamburger/X) -->
+        <!-- Ikona za mobilni meni ostaja ločena za lažje upravljanje -->
         <div class="mobile-menu-icon">
             <i class="fas fa-bars"></i>
             <i class="fas fa-times"></i>
@@ -9729,7 +9941,7 @@ footer hr {
     </div>
 </header>
 
-<!-- Mobile Navigation Panel (ostane znotraj markerjev, a za <header>) -->
+<!-- Panel za mobilno navigacijo (struktura ostaja enaka) -->
 <div class="mobile-nav-panel">
     <nav>
         <ul class="navigation mobile-nav">
@@ -9778,18 +9990,27 @@ footer hr {
     <div class="navigation-actions">
         <button class="btn btn-secondary">Become a member</button>
         <button class="btn btn-primary">Donate</button>
-        <!-- Language Switcher (for mobile) -->
         <div class="language-selector">
-            <div class="current-lang">
+            <button class="current-lang" id="mobile-lang-trigger">
                 <i class="fas fa-globe"></i>
-                <span id="current-lang-code-mobile">EN</span>
-                <i class="fas fa-chevron-down"></i>
-            </div>
-            <div class="lang-dropdown">
-                <a href="#" data-lang="si">Slovenščina (SI)</a>
-                <a href="#" data-lang="en">English (EN)</a>
-                <a href="#" data-lang="mk">Македонски (MK)</a>
-            </div>
+                <span>EN</span>
+                <i class="fas fa-chevron-right"></i>
+            </button>
+        </div>
+    </div>
+</div>
+
+<!-- Modalno okno za izbiro jezika (ostaja enako) -->
+<div id="language-modal-overlay">
+    <div class="language-modal-content">
+        <div class="language-modal-header">
+            <h3>Select Language</h3>
+            <button id="language-modal-close" aria-label="Close language selection">&times;</button>
+        </div>
+        <div class="language-modal-body">
+            <a href="#" data-lang="si">Slovenščina (SI)</a>
+            <a href="#" data-lang="en" class="active-lang">English (EN)</a>
+            <a href="#" data-lang="mk">Македонски (MK)</a>
         </div>
     </div>
 </div>
@@ -10049,7 +10270,7 @@ footer hr {
         <div class="navigation-actions">
             <button class="btn btn-secondary">Become a member</button>
             <button class="btn btn-primary">Donate</button>
-            <!-- Language Switcher -->
+            <!-- Language Switcher (Desktop Dropdown) -->
             <div class="language-selector">
                 <div class="current-lang">
                     <i class="fas fa-globe"></i>
@@ -10072,7 +10293,7 @@ footer hr {
     </div>
 </header>
 
-<!-- KLJUČNA SPREMEMBA: Mobilni panel je zdaj ZUNAJ <header> elementa -->
+<!-- Mobile Navigation Panel -->
 <div class="mobile-nav-panel">
     <nav>
         <ul class="navigation mobile-nav">
@@ -10121,18 +10342,28 @@ footer hr {
     <div class="navigation-actions">
         <button class="btn btn-secondary">Become a member</button>
         <button class="btn btn-primary">Donate</button>
-        <!-- Language Switcher (for mobile) -->
+        <!-- Language Switcher (Mobile Button - Triggers Modal) -->
         <div class="language-selector">
-            <div class="current-lang">
+            <button class="current-lang" id="mobile-lang-trigger">
                 <i class="fas fa-globe"></i>
-                <span id="current-lang-code-mobile">EN</span>
-                <i class="fas fa-chevron-down"></i>
-            </div>
-            <div class="lang-dropdown">
-                <a href="#" data-lang="si">Slovenščina (SI)</a>
-                <a href="#" data-lang="en">English (EN)</a>
-                <a href="#" data-lang="mk">Македонски (MK)</a>
-            </div>
+                <span>EN</span>
+                <i class="fas fa-chevron-right"></i>
+            </button>
+        </div>
+    </div>
+</div>
+
+<!-- Language Selection Modal (for Mobile) -->
+<div id="language-modal-overlay">
+    <div class="language-modal-content">
+        <div class="language-modal-header">
+            <h3>Select Language</h3>
+            <button id="language-modal-close" aria-label="Close language selection">&times;</button>
+        </div>
+        <div class="language-modal-body">
+            <a href="#" data-lang="si">Slovenščina (SI)</a>
+            <a href="#" data-lang="en" class="active-lang">English (EN)</a>
+            <a href="#" data-lang="mk">Македонски (MK)</a>
         </div>
     </div>
 </div>
@@ -10318,32 +10549,30 @@ document.addEventListener('DOMContentLoaded', function() {
 
     /**
      * ===================================================================
-     * 1. OSNOVNA FUNKCIONALNOST MOBILNE NAVIGACIJE (Robustna različica)
+     * 1. OSNOVNA FUNKCIONALNOST MOBILNE NAVIGACIJE
      * ===================================================================
      */
 
-    // === MOBILNI MENI: Robusten toggle na <html> ===
+    // === MOBILNI MENI: Preklop vidnosti menija ===
     try {
         const icon = document.querySelector('.mobile-menu-icon');
-        const root = document.documentElement; // Ciljamo <html>, da se izognemo konfliktom na <body>
+        const root = document.documentElement;
 
         if (!icon) {
             console.error('Mobile menu icon not found.');
         } else {
             icon.addEventListener('click', (e) => {
                 e.preventDefault();
-                e.stopPropagation(); // Preprečimo "bubbling" dogodka, ki bi lahko takoj zaprl meni
+                e.stopPropagation();
                 root.classList.toggle('nav-open');
             });
 
-            // Zapri meni ob kliku izven panela ali ikone
             document.addEventListener('click', (e) => {
                 if (root.classList.contains('nav-open') && !e.target.closest('.mobile-nav-panel') && !e.target.closest('.mobile-menu-icon')) {
                     root.classList.remove('nav-open');
                 }
             });
 
-            // Zapri meni s tipko Escape
             document.addEventListener('keydown', (e) => {
                 if (e.key === 'Escape') {
                     root.classList.remove('nav-open');
@@ -10354,7 +10583,7 @@ document.addEventListener('DOMContentLoaded', function() {
         console.error('Error in Mobile Menu Toggle:', err);
     }
 
-    // --- Mobilni Accordion podmeni (ostane nespremenjen) ---
+    // --- Mobilni Accordion podmeni ---
     try {
         const mobileNav = document.querySelector('.mobile-nav-panel .mobile-nav');
         if (mobileNav) {
@@ -10364,21 +10593,18 @@ document.addEventListener('DOMContentLoaded', function() {
                 const link = item.querySelector('a');
                 if (link) {
                     link.addEventListener('click', (event) => {
-                        // Prepreči privzeto dejanje samo za glavne povezave, ki imajo podmeni
                         if (event.currentTarget.parentElement.classList.contains('menu-item-has-children')) {
                             event.preventDefault();
                         }
 
                         const parentLi = event.currentTarget.parentElement;
 
-                        // Zapri ostale odprte podmenije (efekt harmonike)
                         menuItemsWithChildren.forEach(otherItem => {
                             if (otherItem !== parentLi && otherItem.classList.contains('open')) {
                                 otherItem.classList.remove('open');
                             }
                         });
 
-                        // Preklopi stanje trenutnega podmenija
                         parentLi.classList.toggle('open');
                     });
                 }
@@ -10391,88 +10617,135 @@ document.addEventListener('DOMContentLoaded', function() {
 
     /**
      * ===================================================================
-     * 2. DODATNE FUNKCIONALNOSTI (Jezik, FAQ, itd.)
-     * Te skripte so ločene, da morebitne napake ne vplivajo na meni.
+     * 2. IZBOLJŠAVE UPORABNIŠKE IZKUŠNJE (UX/UI)
      * ===================================================================
      */
 
-    // --- Preklopnik jezika (Language Switcher) ---
-    try {
-        const languageSelectors = document.querySelectorAll('.language-selector');
-        if (languageSelectors.length > 0) {
-            languageSelectors.forEach(selector => {
+    // --- Funkcija za poudarjanje aktivne povezave v navigaciji ---
+    function highlightActiveLink() {
+        try {
+            const currentPath = window.location.pathname;
+            const navLinks = document.querySelectorAll('.navigation a');
+            let bestMatch = null;
+            let longestMatch = 0;
+
+            navLinks.forEach(link => {
+                if (link.closest('.dropdown-menu')) return;
+                
+                const linkPath = new URL(link.href, window.location.origin).pathname;
+
+                if (currentPath.startsWith(linkPath) && linkPath.length > longestMatch) {
+                    longestMatch = linkPath.length;
+                    bestMatch = link;
+                }
+            });
+            
+            if (bestMatch) {
+                const parentMenuItem = bestMatch.closest('.menu-item');
+                if (parentMenuItem) {
+                    parentMenuItem.classList.add('active-page');
+                }
+            }
+        } catch (error) {
+            console.error("Error highlighting active link:", error);
+        }
+    }
+
+
+    // --- Funkcionalnost za preklopnik jezika (Desktop Dropdown + Mobile Modal) ---
+    function setupLanguageSwitcher() {
+        try {
+            // 1. POPRAVLJENA Logika za dinamično generiranje URL-jev
+            const path = window.location.pathname;
+            const pathParts = path.split('/').filter(Boolean);
+            const validLangs = ['en', 'si', 'mk'];
+            let pathWithoutLang = '/';
+
+            if (pathParts.length > 0 && validLangs.includes(pathParts[0])) {
+                // Sestavi pot iz delov, ki sledijo jezikovni kodi
+                pathWithoutLang = '/' + pathParts.slice(1).join('/');
+                // Če se je originalna pot končala s '/', jo dodaj nazaj (za mape)
+                if (path.endsWith('/') && pathWithoutLang !== '/') {
+                    pathWithoutLang += '/';
+                }
+            } else {
+                pathWithoutLang = path;
+            }
+
+            document.querySelectorAll('a[data-lang]').forEach(link => {
+                const targetLang = link.getAttribute('data-lang');
+                // Združi novo jezikovno kodo in preostanek poti
+                const newUrl = `/${targetLang}${pathWithoutLang}`;
+                // Zamenjaj morebitne dvojne poševnice z eno samo, razen na začetku
+                link.setAttribute('href', newUrl.replace(/\/{2,}/g, '/'));
+            });
+
+            // 2. POPRAVLJENA Logika za NAMIZNI dropdown
+            // Uporablja bolj specifičen selektor, ki se ujema z novo HTML strukturo
+            const desktopSelectors = document.querySelectorAll('.header-right-wrapper .language-selector');
+            desktopSelectors.forEach(selector => {
                 const currentLang = selector.querySelector('.current-lang');
                 if (currentLang) {
                     currentLang.addEventListener('click', (event) => {
                         event.stopPropagation();
                         const isActive = selector.classList.contains('active');
-                        languageSelectors.forEach(s => s.classList.remove('active')); // Zapri vse
+                        document.querySelectorAll('.language-selector.active').forEach(s => s.classList.remove('active'));
                         if (!isActive) {
-                            selector.classList.add('active'); // Odpri samo trenutnega
+                            selector.classList.add('active');
                         }
                     });
                 }
             });
-
-            // Globalni listenerji za zapiranje
-            window.addEventListener('click', () => {
-                languageSelectors.forEach(s => s.classList.remove('active'));
-            });
-            window.addEventListener('keydown', (e) => {
-                if (e.key === 'Escape') {
-                    languageSelectors.forEach(s => s.classList.remove('active'));
-                }
-            });
-
-            // Dinamično generiranje URL-jev
-            const path = window.location.pathname;
-            const pathParts = path.split('/').filter(Boolean);
-            const validLangs = ['en', 'si', 'mk'];
-            let currentLangCode = validLangs[0]; // Privzeto na 'en', če ni najden
-            let relativePathAfterLang = path;
-
-            for (const lang of validLangs) {
-                if (pathParts.length > 0 && pathParts[0] === lang) {
-                    currentLangCode = lang;
-                    relativePathAfterLang = '/' + pathParts.slice(1).join('/');
-                    break;
-                }
-            }
             
-            languageSelectors.forEach(selector => {
-                const langLinks = selector.querySelectorAll('.lang-dropdown a[data-lang]');
-                langLinks.forEach(link => {
-                    const targetLang = link.getAttribute('data-lang');
-                    // Zgradi novo pot relativno glede na korensko mapo
-                    const newUrl = `/${targetLang}${relativePathAfterLang === '/' ? '' : relativePathAfterLang}`;
-                    link.setAttribute('href', newUrl);
-                });
+            window.addEventListener('click', () => {
+                desktopSelectors.forEach(s => s.classList.remove('active'));
             });
+
+            // 3. Logika za MOBILNO modalno okno (ostaja enaka, vendar bo zdaj delovala pravilno)
+            const mobileLangButton = document.getElementById('mobile-lang-trigger');
+            const languageModal = document.getElementById('language-modal-overlay');
+            const closeModalButton = document.getElementById('language-modal-close');
+
+            if (mobileLangButton && languageModal && closeModalButton) {
+                mobileLangButton.addEventListener('click', (e) => {
+                    e.preventDefault();
+                    e.stopPropagation();
+                    languageModal.classList.add('active');
+                });
+
+                const closeModal = () => {
+                    languageModal.classList.remove('active');
+                };
+
+                closeModalButton.addEventListener('click', closeModal);
+                languageModal.addEventListener('click', (e) => {
+                    if (e.target === languageModal) closeModal();
+                });
+                document.addEventListener('keydown', (e) => {
+                    if (e.key === 'Escape' && languageModal.classList.contains('active')) closeModal();
+                });
+            }
+
+        } catch (error) {
+            console.error('Error in Language Switcher setup:', error);
         }
-    } catch (error) {
-        console.error('Error in Language Switcher:', error);
     }
-    
+
+
+    /**
+     * ===================================================================
+     * 3. OSTALE FUNKCIONALNOSTI (FAQ, ACTIVITIES, ITD.)
+     * ===================================================================
+     */
+
     // --- FAQ Accordion ---
     try {
-        const faqItems = document.querySelectorAll('.faq-item');
-        if (faqItems.length > 0) {
-            faqItems.forEach(item => {
-                const header = item.querySelector('h3');
-                if (header) {
-                    header.addEventListener('click', () => {
-                        const content = item.querySelector('p');
-                        if (content) {
-                            if (content.style.display === "none" || content.style.display === "") {
-                                content.style.display = "block";
-                            } else {
-                                content.style.display = "none";
-                            }
-                        }
-                    });
-                }
+        document.querySelectorAll('.faq-item h3').forEach(header => {
+            header.addEventListener('click', () => {
+                const faqItem = header.parentElement;
+                faqItem.classList.toggle('open');
             });
-        }
+        });
     } catch (error) {
         console.error('Error in FAQ Accordion:', error);
     }
@@ -10513,6 +10786,15 @@ document.addEventListener('DOMContentLoaded', function() {
     } catch (error) {
         console.error('Error in Activities Tab:', error);
     }
+
+    /**
+     * ===================================================================
+     * 4. ZAGON FUNKCIJ PO NALOŽITVI STRANI
+     * ===================================================================
+     */
+    highlightActiveLink();
+    setupLanguageSwitcher();
+
 });"""
 
 
@@ -10536,6 +10818,487 @@ document.addEventListener('DOMContentLoaded', function() {
     <!-- Поврзување до главната CSS-датотека (поправена патека) -->
     <link rel="stylesheet" href="../css/main.css">
 </head>
+<body>
+
+    <!-- START_HEADER -->
+<header class="dropdown-header-navigation">
+    <div class="container">
+        <!-- Logotip je zdaj samostojen element na levi strani -->
+        <a href="../mk/" class="logo-link">
+            <img src="../images/1-logo.png" alt="Лого на Македонска студентска организација во Словенија" class="logo-img">
+        </a>
+        
+        <!-- Nov ovoj za vse elemente na desni strani -->
+        <div class="header-right-wrapper">
+            <nav>
+                <ul class="navigation desktop-nav">
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">За нас</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Времеплов и достигнувања</a></li>
+                            <li><a href="#">Нашиот тим, мисија, визија и вредности</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">Што работиме</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="../mk/projects/">Настани и проекти</a></li>
+                            <li><a href="#">Блог</a></li>
+                            <li><a href="#">Галерија</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">Вклучи се</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Стани член</a></li>
+                            <li><a href="#">Поддржи ја МСОС</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">За студенти</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Водич за добредојде</a></li>
+                            <li><a href="#">Менторска програма</a></li>
+                            <li><a href="#">Често поставувани прашања</a></li>
+                            <li><a href="#">Запознај ја Словенија</a></li>
+                            <li><a href="#">Запознај ја Северна Македонија</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">Новости</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Соопштенија</a></li>
+                            <li><a href="#">Отворени повици</a></li>
+                            <li><a href="#">Соопштенија за медиуми</a></li>
+                        </ul>
+                    </li>
+                </ul>
+            </nav>
+            <div class="navigation-actions">
+                <button class="btn btn-secondary">Стани член</button>
+                <button class="btn btn-primary">Донирај</button>
+                <div class="language-selector">
+                    <div class="current-lang">
+                        <i class="fas fa-globe"></i>
+                        <span id="current-lang-code">МК</span>
+                        <i class="fas fa-chevron-down"></i>
+                    </div>
+                    <div class="lang-dropdown">
+                        <a href="#" data-lang="si">Slovenščina (SI)</a>
+                        <a href="#" data-lang="en">English (EN)</a>
+                        <a href="#" data-lang="mk">Македонски (МК)</a>
+                    </div>
+                </div>
+            </div>
+        </div>
+
+        <!-- Ikona za mobilni meni ostaja ločena za lažje upravljanje -->
+        <div class="mobile-menu-icon">
+            <i class="fas fa-bars"></i>
+            <i class="fas fa-times"></i>
+        </div>
+    </div>
+</header>
+
+<!-- Panel za mobilno navigacijo -->
+<div class="mobile-nav-panel">
+    <nav>
+        <ul class="navigation mobile-nav">
+            <li class="menu-item menu-item-has-children">
+                <a href="#">За нас</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Времеплов и достигнувања</a></li>
+                    <li><a href="#">Нашиот тим, мисија, визија и вредности</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">Што работиме</a>
+                <ul class="dropdown-menu">
+                    <li><a href="../mk/projects/">Настани и проекти</a></li>
+                    <li><a href="#">Блог</a></li>
+                    <li><a href="#">Галерија</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">Вклучи се</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Стани член</a></li>
+                    <li><a href="#">Поддржи ја МСОС</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">За студенти</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Водич за добредојде</a></li>
+                    <li><a href="#">Менторска програма</a></li>
+                    <li><a href="#">Често поставувани прашања</a></li>
+                    <li><a href="#">Запознај ја Словенија</a></li>
+                    <li><a href="#">Запознај ја Северна Македонија</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">Новости</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Соопштенија</a></li>
+                    <li><a href="#">Отворени повици</a></li>
+                    <li><a href="#">Соопштенија за медиуми</a></li>
+                </ul>
+            </li>
+        </ul>
+    </nav>
+    <div class="navigation-actions">
+        <button class="btn btn-secondary">Стани член</button>
+        <button class="btn btn-primary">Донирај</button>
+        <div class="language-selector">
+            <button class="current-lang" id="mobile-lang-trigger">
+                <i class="fas fa-globe"></i>
+                <span>МК</span>
+                <i class="fas fa-chevron-right"></i>
+            </button>
+        </div>
+    </div>
+</div>
+
+<!-- Modalno okno za izbiro na jazik (za mobilni) -->
+<div id="language-modal-overlay">
+    <div class="language-modal-content">
+        <div class="language-modal-header">
+            <h3>Избери јазик</h3>
+            <button id="language-modal-close" aria-label="Затвори избор на јазик">&times;</button>
+        </div>
+        <div class="language-modal-body">
+            <a href="#" data-lang="si">Slovenščina (SI)</a>
+            <a href="#" data-lang="en">English (EN)</a>
+            <a href="#" data-lang="mk" class="active-lang">Македонски (МК)</a>
+        </div>
+    </div>
+</div>
+<!-- END_HEADER -->
+
+    <main>
+        <section class="hero-section">
+            <div class="hero-background">
+                <div class="hero-image-left" style="background-image: url('../images/2.hero.webp');"></div>
+                <div class="hero-image-right" style="background-image: url('../images/2.hero.webp');"></div>
+            </div>
+            <div class="hero-overlay"></div>
+            <div class="hero-content">
+                <div class="heading-and-supporting-text">
+                    <div class="badge-group">
+                        <div class="badge-content">
+                            <span class="message">Прва официјална МСОС</span>
+                        </div>
+                    </div>
+                    <h1>Ги зајакнуваме младите со вештини за да го променат светот</h1>
+                    <p>Без разлика дали имате тим од 2 или 200 луѓе, нашите заеднички тимски сандачиња ги одржуваат сите на иста страна и во тек со случувањата.</p>
+                </div>
+                <button class="btn btn-primary-orange">Стани член</button>
+            </div>
+        </section>
+
+        <section class="meet-the-team-section">
+            <div class="video-container">
+                <img src="../images/3.activites.webp" alt="Членови на тимот соработуваат" class="video-thumbnail">
+                <div class="video-overlay"></div>
+                <button class="play-button" aria-label="Пушти видео"></button>
+            </div>
+            <div class="team-content">
+                <h2>Запознајте го нашиот неверојатен тим!</h2>
+                <p>Нашата филозофија е едноставна — да вработиме тим од разновидни, страсни луѓе и да поттикнеме култура која ве овластува да ја вршите својата најдобра работа.</p>
+                <button class="btn btn-secondary">Дознај повеќе</button>
+            </div>
+        </section>
+
+        <section class="activities-section">
+            <div class="activities-header">
+                <h2>Активности</h2>
+                <p>Нашата филозофија е едноставна — да вработиме тим од разновидни, страсни луѓе и да поттикнеме култура која ве овластува да ја вршите својата најдобра работа.</p>
+            </div>
+            <div class="activities-content">
+                <div class="activities-nav">
+                    <ul>
+                        <li class="active">Студентско претставување</li>
+                        <li>Образование и култура</li>
+                        <li>Забава и дружење</li>
+                        <li>Студентска поддршка</li>
+                    </ul>
+                    <button class="btn btn-primary-orange">Стани член</button>
+                </div>
+                <div class="activity-details">
+                    <p>Sed molestie penatibus sit bibendum pharetra purus faucibus fames aliquet. Morbi morbi ac sed tempor porta. Dui iaculis vitae fames sapien. Pellentesque urna eget habitasse arcu sed ornare. Dignissim lobortis ultrices maecenas magna ac habitant donec etiam at.</p>
+                    <img src="../images/3.activites.webp" alt="Група насмеани студенти соработуваат">
+                </div>
+            </div>
+        </section>
+
+        <section class="latest-news-section">
+            <div class="news-header">
+                <h2>Најнови вести</h2>
+                <p>Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharet.</p>
+            </div>
+            <div class="news-articles">
+                <article class="news-card">
+                    <img src="../images/4-billwalsh.webp" alt="Слика на снежен планински врв во розови и сини нијанси">
+                    <div class="card-content">
+                        <p class="author">Alec Whitten • 17 Јан 2022</p>
+                        <h3>Лекции за лидерство од Бил Волш</h3>
+                        <p>Сакате да ги дознаете тајните за трансформација на тим со резултат 2-14 во династија со 3x Супер Боул...</p>
+                    </div>
+                </article>
+                <article class="news-card">
+                    <img src="../images/5-pmmentals.webp" alt="Жена презентира пред табла со лепливи белешки на тим">
+                    <div class="card-content">
+                        <p class="author">Demi Wilkinson • 16 Јан 2022</p>
+                        <h3>ПМ ментални модели</h3>
+                        <p>Менталните модели се едноставни изрази на сложени процеси или односи.</p>
+                    </div>
+                </article>
+                <article class="news-card">
+                    <img src="../images/6-whatiswireframing.webp" alt="Модерно компјутерско биро со голем монитор, тастатура и слушалки">
+                    <div class="card-content">
+                        <p class="author">Candice Wu • 15 Јан 2022</p>
+                        <h3>Што е Wireframing?</h3>
+                        <p>Вовед во Wireframing и неговите принципи. Учете од најдобрите во индустријата.</p>
+                    </div>
+                </article>
+            </div>
+            <button class="btn btn-secondary">Види ги сите</button>
+        </section>
+
+        <section class="testimonials-section">
+            <div class="testimonials-intro">
+                <h2>Погледнете што велат нашите партнери за нас</h2>
+                <p>Сè што треба да знаете за производот и наплатата.</p>
+            </div>
+            <div class="testimonials-columns">
+                <div class="testimonial-column">
+                    <div class="testimonial-card">
+                        <h3>Како соработката нè прави подобри</h3>
+                        <p>Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra. Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra feugiat.</p>
+                        <div class="author-info">
+                            <img src="../images/7-graphicdesigner.webp" alt="Александар Поповски">
+                            <div>
+                                <h4>Александар Поповски</h4>
+                                <p>Графички дизајнер во МСОС</p>
+                            </div>
+                        </div>
+                    </div>
+                     <div class="testimonial-card">
+                        <h3>Consectetur vitae ac parturient massa</h3>
+                        <p>Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra. Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra feugiat. Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra.</p>
+                        <div class="author-info">
+                            <img src="../images/11-boy.webp" alt="Друг член на тимот">
+                            <div>
+                                <h4>Александар Поповски</h4>
+                                <p>Графички дизајнер во МСОС</p>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+                 <div class="testimonial-column column-offset">
+                    <div class="testimonial-card">
+                        <h3>Горди партнери</h3>
+                        <p>Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra. Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra feugiat.</p>
+                        <div class="author-info">
+                            <img src="../images/12-girl2.webp" alt="Друг партнер">
+                            <div>
+                                <h4>Александра Поповска</h4>
+                                <p>Графички дизајнер во МСОС</p>
+                            </div>
+                        </div>
+                    </div>
+                    <div class="testimonial-card">
+                        <h3>Нашето искуство со соработката</h3>
+                        <p>Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra. Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra. Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra feugiat.</p>
+                        <div class="author-info">
+                             <img src="../images/10-girl1.webp" alt="Друг член на тимот">
+                            <div>
+                                <h4>Ана Поповска</h4>
+                                <p>Графички дизајнер во МСОС</p>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </section>
+
+        <section class="become-part-section">
+            <div class="become-part-header">
+                <h2>Станете дел од нашиот неверојатен тим</h2>
+                <p>Ние сме 100% тим на далечина, распространет низ целиот свет. Придружете ни се!</p>
+            </div>
+            <img src="../images/9-becomepart.webp" alt="Нашиот неверојатен тим во училница" class="team-photo">
+            
+            <div class="contact-form-container">
+                <form class="contact-form">
+                    <div class="form-row">
+                        <div class="form-group">
+                            <label for="first-name">Име</label>
+                            <input type="text" id="first-name" placeholder="Име">
+                        </div>
+                        <div class="form-group">
+                            <label for="last-name">Презиме</label>
+                            <input type="text" id="last-name" placeholder="Презиме">
+                        </div>
+                    </div>
+                    <div class="form-group">
+                        <label for="email">Е-пошта</label>
+                        <input type="email" id="email" placeholder="student@email.com">
+                    </div>
+                    <div class="form-group">
+                         <label for="phone-number">Телефонски број</label>
+                        <div class="phone-input">
+                            <select id="country-code" aria-label="Код на држава">
+                                <option>MK</option>
+                                <option>SI</option>
+                                <option>US</option>
+                            </select>
+                            <input type="tel" id="phone-number" placeholder="+389 (00) 000-000">
+                        </div>
+                    </div>
+                    <div class="form-group">
+                        <label for="message">Порака</label>
+                        <textarea id="message" rows="5"></textarea>
+                    </div>
+                    <div class="form-group checkbox-group">
+                        <input type="checkbox" id="privacy-policy">
+                        <label for="privacy-policy">Се согласувате со нашата пријателска <a href="#">политика за приватност</a>.</label>
+                    </div>
+                    <button type="submit" class="btn btn-primary">Испрати порака</button>
+                </form>
+            </div>
+        </section>
+
+        <section class="faq-section">
+            <div class="faq-header">
+                <h2>Често поставувани прашања</h2>
+                <p>Сè што треба да знаете за производот и наплатата.</p>
+            </div>
+            <div class="faq-grid">
+                <div class="faq-item">
+                    <div class="faq-icon-container"><i class="fas fa-heart"></i></div>
+                    <h3>Дали е достапен бесплатен пробен период?</h3>
+                    <p>Да, можете да нè пробате бесплатно 30 дена. Нашиот пријателски тим ќе работи со вас за да ве подготви што е можно поскоро.</p>
+                </div>
+                <div class="faq-item">
+                     <div class="faq-icon-container"><i class="fas fa-sync-alt"></i></div>
+                    <h3>Можам ли подоцна да го сменам мојот план?</h3>
+                    <p>Секако. Нашите цени се прилагодуваат со вашата компанија. Разговарајте со нашиот пријателски тим за да најдете решение што ви одговара.</p>
+                </div>
+                <div class="faq-item">
+                     <div class="faq-icon-container"><i class="fas fa-ban"></i></div>
+                    <h3>Каква е вашата политика за откажување?</h3>
+                    <p>Разбираме дека работите се менуваат. Можете да го откажете вашиот план во секое време и ќе ви ја вратиме веќе платената разлика.</p>
+                </div>
+                <div class="faq-item">
+                     <div class="faq-icon-container"><i class="fas fa-plus-circle"></i></div>
+                    <h3>Може ли да се додадат други информации на фактурата?</h3>
+                    <p>Да, можете да нè пробате бесплатно 30 дена. Нашиот пријателски тим ќе работи со вас за да ве подготви што е можно поскоро.</p>
+                </div>
+                <div class="faq-item">
+                     <div class="faq-icon-container"><i class="fas fa-credit-card"></i></div>
+                    <h3>Како функционира наплатата?</h3>
+                    <p>Секако. Нашите цени се прилагодуваат со вашата компанија. Разговарајте со нашиот пријателски тим за да најдете решение што ви одговара.</p>
+                </div>
+                 <div class="faq-item">
+                     <div class="faq-icon-container"><i class="fas fa-envelope"></i></div>
+                    <h3>Како да ја сменам е-поштата на мојата сметка?</h3>
+                    <p>Разбираме дека работите се менуваат. Можете да го откажете вашиот план во секое време и ќе ви ја вратиме разликата.</p>
+                </div>
+            </div>
+            <div class="faq-footer">
+                <div class="avatar-group">
+                     <img src="../images/11-boy.webp" alt="Аватар 1" class="avatar">
+                     <img src="../images/10-girl1.webp" alt="Аватар 2" class="avatar large">
+                     <img src="../images/12-girl2.webp" alt="Аватар 3" class="avatar">
+                </div>
+                <h3>Сè уште имате прашања?</h3>
+                <p>Не можете да го најдете одговорот што го барате? Ве молиме разговарајте со нашиот пријателски тим.</p>
+                <button class="btn btn-primary-orange">Види ги сите ЧПП</button>
+            </div>
+        </section>
+
+    </main>
+
+    <!-- START_FOOTER -->
+<footer>
+    <div class="footer-container">
+        <div class="footer-main">
+            <div class="footer-info">
+                <div class="footer-logo">
+                    <img src="../images/13-whitelogo.png" alt="Лого на Македонска студентска организација во Словенија">
+                </div>
+                <p>
+                    Masarykova cesta 24<br>
+                    1000 Ljubljana, Slovenia<br>
+                    +389 02 123 4567<br>
+                    info.msosorg@gmail.com
+                </p>
+                <div class="social-icons">
+                    <a href="#" aria-label="Facebook"><i class="fab fa-facebook-f"></i></a>
+                    <a href="#" aria-label="Instagram"><i class="fab fa-instagram"></i></a>
+                    <a href="#" aria-label="YouTube"><i class="fab fa-youtube"></i></a>
+                </div>
+            </div>
+            <div class="footer-links">
+                <div class="links-column">
+                    <h4>За студенти</h4>
+                    <a href="#">Блог</a>
+                    <a href="#">Галерија</a>
+                    <a href="#">ЧПП</a>
+                    <a href="#">Брошура</a>
+                </div>
+                <div class="links-column">
+                    <h4>Проекти</h4>
+                    <a href="#">Претстојни</a>
+                    <a href="#">Претходни</a>
+                </div>
+                <div class="links-column">
+                    <h4>Организација</h4>
+                    <a href="#">За нас</a>
+                    <a href="#">Контакт</a>
+                    <a href="#">Документација</a>
+                </div>
+            </div>
+        </div>
+        <hr>
+        <div class="footer-bottom">
+             <p>© МСОС орг 2023 Сите права се задржани.</p>
+            <div class="legal-links">
+                <a href="#">Политика за приватност</a>
+                <a href="#">Политика за колачиња</a>
+                <a href="#">Правни услови</a>
+            </div>
+        </div>
+    </div>
+    <script src="../main.js"></script>
+</footer>
+<!-- END_FOOTER -->
+
+</body>
+</html>"""
+
+
+"./mk/index.html.bak" : 
+"""
+<!DOCTYPE html>
+<html lang="mk">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Македонска Студентска Организација во Словенија</title>
+    
+    <!-- Google Fonts -->
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
+    
+    <!-- Font Awesome (for icons) -->
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css" integrity="sha512-DTOQO9RWCH3ppGqcWaEA1BIZOC6xxalwEsw9c2QQeAIftl+Vegovlnee1c9QX4TctnWMn13TZye+giMm8e2LwA==" crossorigin="anonymous" referrerpolicy="no-referrer" />
+
+    <!-- Поврзување до главната CSS-датотека (поправена патека) -->
+    <link rel="stylesheet" href="../css/main.css">
+</head>
 <body>
 
     <!-- START_HEADER -->
@@ -10911,401 +11674,6 @@ document.addEventListener('DOMContentLoaded', function() {
 </html>"""
 
 
-"./mk/index.html.bak" : 
-"""
-<!DOCTYPE html>
-<html lang="mk">
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Македонска Студентска Организација во Словенија</title>
-    
-    <!-- Google Fonts -->
-    <link rel="preconnect" href="https://fonts.googleapis.com">
-    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
-    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
-    
-    <!-- Font Awesome (for icons) -->
-    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css" integrity="sha512-DTOQO9RWCH3ppGqcWaEA1BIZOC6xxalwEsw9c2QQeAIftl+Vegovlnee1c9QX4TctnWMn13TZye+giMm8e2LwA==" crossorigin="anonymous" referrerpolicy="no-referrer" />
-
-    <!-- Поврзување до главната CSS-датотека (поправена патека) -->
-    <link rel="stylesheet" href="../css/main.css">
-</head>
-<body>
-
-    <!-- START_HEADER -->
-<header class="dropdown-header-navigation">
-    <div class="container">
-        <div class="header-content">
-            <a href="../mk/" class="logo-link">
-                <img src="../images/1-logo.png" alt="Лого на Македонска студентска организација во Словенија" class="logo-img">
-            </a>
-            <!-- Навигација за десктоп -->
-            <nav class="navigation desktop-nav">
-                <a href="#">За нас</a>
-                <a href="#">За студенти</a>
-                <a href="../mk/projects/">Проекти</a>
-            </nav>
-        </div>
-
-        <!-- Копчиња за десктоп -->
-        <div class="navigation-actions">
-            <button class="btn btn-secondary">Стани партнер</button>
-            <button class="btn btn-primary">Донирај</button>
-            <!-- Преклопник за јазик -->
-            <div class="language-selector">
-                <div class="current-lang">
-                    <i class="fas fa-globe"></i>
-                    <span id="current-lang-code">MK</span>
-                    <i class="fas fa-chevron-down"></i>
-                </div>
-                <div class="lang-dropdown">
-                    <a href="#" data-lang="si">Slovenščina (SI)</a>
-                    <a href="#" data-lang="en">English (EN)</a>
-                    <a href="#" data-lang="mk">Македонски (MK)</a>
-                </div>
-            </div>
-        </div>
-
-        <!-- Панел за мобилна навигација -->
-        <div class="mobile-nav-panel">
-            <nav class="navigation mobile-nav">
-                <a href="#">За нас</a>
-                <a href="#">За студенти</a>
-                <a href="../mk/projects/">Проекти</a>
-            </nav>
-            <div class="navigation-actions">
-                <button class="btn btn-secondary">Стани партнер</button>
-                <button class="btn btn-primary">Донирај</button>
-                <!-- Преклопник за јазик (за мобилен) -->
-                <div class="language-selector">
-                    <div class="current-lang">
-                        <i class="fas fa-globe"></i>
-                        <span id="current-lang-code-mobile">MK</span>
-                        <i class="fas fa-chevron-down"></i>
-                    </div>
-                    <div class="lang-dropdown">
-                        <a href="#" data-lang="si">Slovenščina (SI)</a>
-                        <a href="#" data-lang="en">English (EN)</a>
-                        <a href="#" data-lang="mk">Македонски (MK)</a>
-                    </div>
-                </div>
-            </div>
-
-             <!-- Икона за мобилно мени (Хамбургер/X) -->
-            <div class="mobile-menu-icon">
-                <i class="fas fa-bars"></i>
-                <i class="fas fa-times"></i>
-            </div>
-        </div>
-</header>
-<!-- END_HEADER -->
-
-    <main>
-        <section class="hero-section">
-            <div class="hero-background">
-                <div class="hero-image-left" style="background-image: url('../images/2.hero.webp');"></div>
-                <div class="hero-image-right" style="background-image: url('../images/2.hero.webp');"></div>
-            </div>
-            <div class="hero-overlay"></div>
-            <div class="hero-content">
-                <div class="heading-and-supporting-text">
-                    <div class="badge-group">
-                        <div class="badge-content">
-                            <span class="message">Прва официјална МСОС</span>
-                        </div>
-                    </div>
-                    <h1>Ги зајакнуваме младите со вештини за да го променат светот</h1>
-                    <p>Без разлика дали имате тим од 2 или 200 луѓе, нашите заеднички тимски сандачиња ги одржуваат сите на иста страна и во тек со случувањата.</p>
-                </div>
-                <button class="btn btn-primary-orange">Стани член</button>
-            </div>
-        </section>
-
-        <section class="meet-the-team-section">
-            <div class="video-container">
-                <img src="../images/3.activites.webp" alt="Членови на тимот соработуваат" class="video-thumbnail">
-                <div class="video-overlay"></div>
-                <button class="play-button" aria-label="Пушти видео"></button>
-            </div>
-            <div class="team-content">
-                <h2>Запознајте го нашиот неверојатен тим!</h2>
-                <p>Нашата филозофија е едноставна — да вработиме тим од разновидни, страсни луѓе и да поттикнеме култура која ве овластува да ја вршите својата најдобра работа.</p>
-                <button class="btn btn-secondary">Дознај повеќе</button>
-            </div>
-        </section>
-
-        <section class="activities-section">
-            <div class="activities-header">
-                <h2>Активности</h2>
-                <p>Нашата филозофија е едноставна — да вработиме тим од разновидни, страсни луѓе и да поттикнеме култура која ве овластува да ја вршите својата најдобра работа.</p>
-            </div>
-            <div class="activities-content">
-                <div class="activities-nav">
-                    <ul>
-                        <li class="active">Студентско претставување</li>
-                        <li>Образование и култура</li>
-                        <li>Забава и дружење</li>
-                        <li>Студентска поддршка</li>
-                    </ul>
-                    <button class="btn btn-primary-orange">Стани член</button>
-                </div>
-                <div class="activity-details">
-                    <p>Sed molestie penatibus sit bibendum pharetra purus faucibus fames aliquet. Morbi morbi ac sed tempor porta. Dui iaculis vitae fames sapien. Pellentesque urna eget habitasse arcu sed ornare. Dignissim lobortis ultrices maecenas magna ac habitant donec etiam at.</p>
-                    <img src="../images/3.activites.webp" alt="Група насмеани студенти соработуваат">
-                </div>
-            </div>
-        </section>
-
-        <section class="latest-news-section">
-            <div class="news-header">
-                <h2>Најнови вести</h2>
-                <p>Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharet.</p>
-            </div>
-            <div class="news-articles">
-                <article class="news-card">
-                    <img src="../images/4-billwalsh.webp" alt="Слика на снежен планински врв во розови и сини нијанси">
-                    <div class="card-content">
-                        <p class="author">Alec Whitten • 17 Јан 2022</p>
-                        <h3>Лекции за лидерство од Бил Волш</h3>
-                        <p>Сакате да ги дознаете тајните за трансформација на тим со резултат 2-14 во династија со 3x Супер Боул...</p>
-                    </div>
-                </article>
-                <article class="news-card">
-                    <img src="../images/5-pmmentals.webp" alt="Жена презентира пред табла со лепливи белешки на тим">
-                    <div class="card-content">
-                        <p class="author">Demi Wilkinson • 16 Јан 2022</p>
-                        <h3>ПМ ментални модели</h3>
-                        <p>Менталните модели се едноставни изрази на сложени процеси или односи.</p>
-                    </div>
-                </article>
-                <article class="news-card">
-                    <img src="../images/6-whatiswireframing.webp" alt="Модерно компјутерско биро со голем монитор, тастатура и слушалки">
-                    <div class="card-content">
-                        <p class="author">Candice Wu • 15 Јан 2022</p>
-                        <h3>Што е Wireframing?</h3>
-                        <p>Вовед во Wireframing и неговите принципи. Учете од најдобрите во индустријата.</p>
-                    </div>
-                </article>
-            </div>
-            <button class="btn btn-secondary">Види ги сите</button>
-        </section>
-
-        <section class="testimonials-section">
-            <div class="testimonials-intro">
-                <h2>Погледнете што велат нашите партнери за нас</h2>
-                <p>Сè што треба да знаете за производот и наплатата.</p>
-            </div>
-            <div class="testimonials-columns">
-                <div class="testimonial-column">
-                    <div class="testimonial-card">
-                        <h3>Како соработката нè прави подобри</h3>
-                        <p>Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra. Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra feugiat.</p>
-                        <div class="author-info">
-                            <img src="../images/7-graphicdesigner.webp" alt="Александар Поповски">
-                            <div>
-                                <h4>Александар Поповски</h4>
-                                <p>Графички дизајнер во МСОС</p>
-                            </div>
-                        </div>
-                    </div>
-                     <div class="testimonial-card">
-                        <h3>Consectetur vitae ac parturient massa</h3>
-                        <p>Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra. Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra feugiat. Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra.</p>
-                        <div class="author-info">
-                            <img src="../images/11-boy.webp" alt="Друг член на тимот">
-                            <div>
-                                <h4>Александар Поповски</h4>
-                                <p>Графички дизајнер во МСОС</p>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-                 <div class="testimonial-column column-offset">
-                    <div class="testimonial-card">
-                        <h3>Горди партнери</h3>
-                        <p>Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra. Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra feugiat.</p>
-                        <div class="author-info">
-                            <img src="../images/12-girl2.webp" alt="Друг партнер">
-                            <div>
-                                <h4>Александра Поповска</h4>
-                                <p>Графички дизајнер во МСОС</p>
-                            </div>
-                        </div>
-                    </div>
-                    <div class="testimonial-card">
-                        <h3>Нашето искуство со соработката</h3>
-                        <p>Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra. Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra. Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra feugiat.</p>
-                        <div class="author-info">
-                             <img src="../images/10-girl1.webp" alt="Друг член на тимот">
-                            <div>
-                                <h4>Ана Поповска</h4>
-                                <p>Графички дизајнер во МСОС</p>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </section>
-
-        <section class="become-part-section">
-            <div class="become-part-header">
-                <h2>Станете дел од нашиот неверојатен тим</h2>
-                <p>Ние сме 100% тим на далечина, распространет низ целиот свет. Придружете ни се!</p>
-            </div>
-            <img src="../images/9-becomepart.png" alt="Нашиот неверојатен тим во училница" class="team-photo">
-            
-            <div class="contact-form-container">
-                <form class="contact-form">
-                    <div class="form-row">
-                        <div class="form-group">
-                            <label for="first-name">Име</label>
-                            <input type="text" id="first-name" placeholder="Име">
-                        </div>
-                        <div class="form-group">
-                            <label for="last-name">Презиме</label>
-                            <input type="text" id="last-name" placeholder="Презиме">
-                        </div>
-                    </div>
-                    <div class="form-group">
-                        <label for="email">Е-пошта</label>
-                        <input type="email" id="email" placeholder="student@email.com">
-                    </div>
-                    <div class="form-group">
-                         <label for="phone-number">Телефонски број</label>
-                        <div class="phone-input">
-                            <select id="country-code" aria-label="Код на држава">
-                                <option>MK</option>
-                                <option>SI</option>
-                                <option>US</option>
-                            </select>
-                            <input type="tel" id="phone-number" placeholder="+389 (00) 000-000">
-                        </div>
-                    </div>
-                    <div class="form-group">
-                        <label for="message">Порака</label>
-                        <textarea id="message" rows="5"></textarea>
-                    </div>
-                    <div class="form-group checkbox-group">
-                        <input type="checkbox" id="privacy-policy">
-                        <label for="privacy-policy">Се согласувате со нашата пријателска <a href="#">политика за приватност</a>.</label>
-                    </div>
-                    <button type="submit" class="btn btn-primary">Испрати порака</button>
-                </form>
-            </div>
-        </section>
-
-        <section class="faq-section">
-            <div class="faq-header">
-                <h2>Често поставувани прашања</h2>
-                <p>Сè што треба да знаете за производот и наплатата.</p>
-            </div>
-            <div class="faq-grid">
-                <div class="faq-item">
-                    <div class="faq-icon-container"><i class="fas fa-heart"></i></div>
-                    <h3>Дали е достапен бесплатен пробен период?</h3>
-                    <p>Да, можете да нè пробате бесплатно 30 дена. Нашиот пријателски тим ќе работи со вас за да ве подготви што е можно поскоро.</p>
-                </div>
-                <div class="faq-item">
-                     <div class="faq-icon-container"><i class="fas fa-sync-alt"></i></div>
-                    <h3>Можам ли подоцна да го сменам мојот план?</h3>
-                    <p>Секако. Нашите цени се прилагодуваат со вашата компанија. Разговарајте со нашиот пријателски тим за да најдете решение што ви одговара.</p>
-                </div>
-                <div class="faq-item">
-                     <div class="faq-icon-container"><i class="fas fa-ban"></i></div>
-                    <h3>Каква е вашата политика за откажување?</h3>
-                    <p>Разбираме дека работите се менуваат. Можете да го откажете вашиот план во секое време и ќе ви ја вратиме веќе платената разлика.</p>
-                </div>
-                <div class="faq-item">
-                     <div class="faq-icon-container"><i class="fas fa-plus-circle"></i></div>
-                    <h3>Може ли да се додадат други информации на фактурата?</h3>
-                    <p>Да, можете да нè пробате бесплатно 30 дена. Нашиот пријателски тим ќе работи со вас за да ве подготви што е можно поскоро.</p>
-                </div>
-                <div class="faq-item">
-                     <div class="faq-icon-container"><i class="fas fa-credit-card"></i></div>
-                    <h3>Како функционира наплатата?</h3>
-                    <p>Секако. Нашите цени се прилагодуваат со вашата компанија. Разговарајте со нашиот пријателски тим за да најдете решение што ви одговара.</p>
-                </div>
-                 <div class="faq-item">
-                     <div class="faq-icon-container"><i class="fas fa-envelope"></i></div>
-                    <h3>Како да ја сменам е-поштата на мојата сметка?</h3>
-                    <p>Разбираме дека работите се менуваат. Можете да го откажете вашиот план во секое време и ќе ви ја вратиме разликата.</p>
-                </div>
-            </div>
-            <div class="faq-footer">
-                <div class="avatar-group">
-                     <img src="../images/11-boy.webp" alt="Аватар 1" class="avatar">
-                     <img src="../images/10-girl1.webp" alt="Аватар 2" class="avatar large">
-                     <img src="../images/12-girl2.webp" alt="Аватар 3" class="avatar">
-                </div>
-                <h3>Сè уште имате прашања?</h3>
-                <p>Не можете да го најдете одговорот што го барате? Ве молиме разговарајте со нашиот пријателски тим.</p>
-                <button class="btn btn-primary-orange">Види ги сите ЧПП</button>
-            </div>
-        </section>
-
-    </main>
-
-    <!-- START_FOOTER -->
-<footer>
-    <div class="footer-container">
-        <div class="footer-main">
-            <div class="footer-info">
-                <div class="footer-logo">
-                    <img src="../images/13-whitelogo.png" alt="Лого на Македонска студентска организација во Словенија">
-                </div>
-                <p>
-                    Masarykova cesta 24<br>
-                    1000 Ljubljana, Slovenia<br>
-                    +389 02 123 4567<br>
-                    info.msosorg@gmail.com
-                </p>
-                <div class="social-icons">
-                    <a href="#" aria-label="Facebook"><i class="fab fa-facebook-f"></i></a>
-                    <a href="#" aria-label="Instagram"><i class="fab fa-instagram"></i></a>
-                    <a href="#" aria-label="YouTube"><i class="fab fa-youtube"></i></a>
-                </div>
-            </div>
-            <div class="footer-links">
-                <div class="links-column">
-                    <h4>За студенти</h4>
-                    <a href="#">Блог</a>
-                    <a href="#">Галерија</a>
-                    <a href="#">ЧПП</a>
-                    <a href="#">Брошура</a>
-                </div>
-                <div class="links-column">
-                    <h4>Проекти</h4>
-                    <a href="#">Претстојни</a>
-                    <a href="#">Претходни</a>
-                </div>
-                <div class="links-column">
-                    <h4>Организација</h4>
-                    <a href="#">За нас</a>
-                    <a href="#">Контакт</a>
-                    <a href="#">Документација</a>
-                </div>
-            </div>
-        </div>
-        <hr>
-        <div class="footer-bottom">
-             <p>© МСОС орг 2023 Сите права се задржани.</p>
-            <div class="legal-links">
-                <a href="#">Политика за приватност</a>
-                <a href="#">Политика за колачиња</a>
-                <a href="#">Правни услови</a>
-            </div>
-        </div>
-    </div>
-    <script src="../main.js"></script>
-</footer>
-<!-- END_FOOTER -->
-
-    <script src="../main.js"></script>
-</body>
-</html>"""
-
-
 "./mk/projects/index.html" : 
 """
 <!DOCTYPE html>
@@ -11331,69 +11699,156 @@ document.addEventListener('DOMContentLoaded', function() {
     <!-- START_HEADER -->
 <header class="dropdown-header-navigation">
     <div class="container">
-        <div class="header-content">
-            <a href="../../mk/" class="logo-link">
-                <img src="../../images/1-logo.png" alt="Лого на Македонска студентска организација во Словенија" class="logo-img">
-            </a>
-            <!-- Навигација за десктоп -->
-            <nav class="navigation desktop-nav">
-                <a href="#">За нас</a>
-                <a href="#">За студенти</a>
-                <a href="../../mk/projects/">Проекти</a>
-            </nav>
-        </div>
-
-        <!-- Копчиња за десктоп -->
-        <div class="navigation-actions">
-            <button class="btn btn-secondary">Стани партнер</button>
-            <button class="btn btn-primary">Донирај</button>
-            <!-- Преклопник за јазик -->
-            <div class="language-selector">
-                <div class="current-lang">
-                    <i class="fas fa-globe"></i>
-                    <span id="current-lang-code">MK</span>
-                    <i class="fas fa-chevron-down"></i>
-                </div>
-                <div class="lang-dropdown">
-                    <a href="#" data-lang="si">Slovenščina (SI)</a>
-                    <a href="#" data-lang="en">English (EN)</a>
-                    <a href="#" data-lang="mk">Македонски (MK)</a>
-                </div>
-            </div>
-        </div>
-
-        <!-- Панел за мобилна навигација -->
-        <div class="mobile-nav-panel">
-            <nav class="navigation mobile-nav">
-                <a href="#">За нас</a>
-                <a href="#">За студенти</a>
-                <a href="../../mk/projects/">Проекти</a>
+        <!-- Logotip je zdaj samostojen element na levi strani -->
+        <a href="../../mk/" class="logo-link">
+            <img src="../../images/1-logo.png" alt="Лого на Македонска студентска организација во Словенија" class="logo-img">
+        </a>
+        
+        <!-- Nov ovoj za vse elemente na desni strani -->
+        <div class="header-right-wrapper">
+            <nav>
+                <ul class="navigation desktop-nav">
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">За нас</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Времеплов и достигнувања</a></li>
+                            <li><a href="#">Нашиот тим, мисија, визија и вредности</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">Што работиме</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="../../mk/projects/">Настани и проекти</a></li>
+                            <li><a href="#">Блог</a></li>
+                            <li><a href="#">Галерија</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">Вклучи се</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Стани член</a></li>
+                            <li><a href="#">Поддржи ја МСОС</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">За студенти</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Водич за добредојде</a></li>
+                            <li><a href="#">Менторска програма</a></li>
+                            <li><a href="#">Често поставувани прашања</a></li>
+                            <li><a href="#">Запознај ја Словенија</a></li>
+                            <li><a href="#">Запознај ја Северна Македонија</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">Новости</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Соопштенија</a></li>
+                            <li><a href="#">Отворени повици</a></li>
+                            <li><a href="#">Соопштенија за медиуми</a></li>
+                        </ul>
+                    </li>
+                </ul>
             </nav>
             <div class="navigation-actions">
-                <button class="btn btn-secondary">Стани партнер</button>
+                <button class="btn btn-secondary">Стани член</button>
                 <button class="btn btn-primary">Донирај</button>
-                <!-- Преклопник за јазик (за мобилен) -->
                 <div class="language-selector">
                     <div class="current-lang">
                         <i class="fas fa-globe"></i>
-                        <span id="current-lang-code-mobile">MK</span>
+                        <span id="current-lang-code">МК</span>
                         <i class="fas fa-chevron-down"></i>
                     </div>
                     <div class="lang-dropdown">
                         <a href="#" data-lang="si">Slovenščina (SI)</a>
                         <a href="#" data-lang="en">English (EN)</a>
-                        <a href="#" data-lang="mk">Македонски (MK)</a>
+                        <a href="#" data-lang="mk">Македонски (МК)</a>
                     </div>
                 </div>
             </div>
-
-             <!-- Икона за мобилно мени (Хамбургер/X) -->
-            <div class="mobile-menu-icon">
-                <i class="fas fa-bars"></i>
-                <i class="fas fa-times"></i>
-            </div>
         </div>
+
+        <!-- Ikona za mobilni meni ostaja ločena za lažje upravljanje -->
+        <div class="mobile-menu-icon">
+            <i class="fas fa-bars"></i>
+            <i class="fas fa-times"></i>
+        </div>
+    </div>
 </header>
+
+<!-- Panel za mobilno navigacijo -->
+<div class="mobile-nav-panel">
+    <nav>
+        <ul class="navigation mobile-nav">
+            <li class="menu-item menu-item-has-children">
+                <a href="#">За нас</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Времеплов и достигнувања</a></li>
+                    <li><a href="#">Нашиот тим, мисија, визија и вредности</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">Што работиме</a>
+                <ul class="dropdown-menu">
+                    <li><a href="../../mk/projects/">Настани и проекти</a></li>
+                    <li><a href="#">Блог</a></li>
+                    <li><a href="#">Галерија</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">Вклучи се</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Стани член</a></li>
+                    <li><a href="#">Поддржи ја МСОС</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">За студенти</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Водич за добредојде</a></li>
+                    <li><a href="#">Менторска програма</a></li>
+                    <li><a href="#">Често поставувани прашања</a></li>
+                    <li><a href="#">Запознај ја Словенија</a></li>
+                    <li><a href="#">Запознај ја Северна Македонија</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">Новости</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Соопштенија</a></li>
+                    <li><a href="#">Отворени повици</a></li>
+                    <li><a href="#">Соопштенија за медиуми</a></li>
+                </ul>
+            </li>
+        </ul>
+    </nav>
+    <div class="navigation-actions">
+        <button class="btn btn-secondary">Стани член</button>
+        <button class="btn btn-primary">Донирај</button>
+        <div class="language-selector">
+            <button class="current-lang" id="mobile-lang-trigger">
+                <i class="fas fa-globe"></i>
+                <span>МК</span>
+                <i class="fas fa-chevron-right"></i>
+            </button>
+        </div>
+    </div>
+</div>
+
+<!-- Modalno okno za izbiro na jazik (za mobilni) -->
+<div id="language-modal-overlay">
+    <div class="language-modal-content">
+        <div class="language-modal-header">
+            <h3>Избери јазик</h3>
+            <button id="language-modal-close" aria-label="Затвори избор на јазик">&times;</button>
+        </div>
+        <div class="language-modal-body">
+            <a href="#" data-lang="si">Slovenščina (SI)</a>
+            <a href="#" data-lang="en">English (EN)</a>
+            <a href="#" data-lang="mk" class="active-lang">Македонски (МК)</a>
+        </div>
+    </div>
+</div>
 <!-- END_HEADER -->
 
     <main class="page-content">
@@ -11810,7 +12265,7 @@ document.addEventListener('DOMContentLoaded', function() {
             </div>
         </div>
     </div>
-    
+    <script src="../../main.js"></script>
 </footer>
 <!-- END_FOOTER -->
 
@@ -11845,69 +12300,156 @@ document.addEventListener('DOMContentLoaded', function() {
     <!-- START_HEADER -->
 <header class="dropdown-header-navigation">
     <div class="container">
-        <div class="header-content">
-            <a href="../../../mk/" class="logo-link">
-                <img src="../../../images/1-logo.png" alt="Лого на Македонска студентска организација во Словенија" class="logo-img">
-            </a>
-            <!-- Навигација за десктоп -->
-            <nav class="navigation desktop-nav">
-                <a href="#">За нас</a>
-                <a href="#">За студенти</a>
-                <a href="../../../mk/projects/">Проекти</a>
-            </nav>
-        </div>
-
-        <!-- Копчиња за десктоп -->
-        <div class="navigation-actions">
-            <button class="btn btn-secondary">Стани партнер</button>
-            <button class="btn btn-primary">Донирај</button>
-            <!-- Преклопник за јазик -->
-            <div class="language-selector">
-                <div class="current-lang">
-                    <i class="fas fa-globe"></i>
-                    <span id="current-lang-code">MK</span>
-                    <i class="fas fa-chevron-down"></i>
-                </div>
-                <div class="lang-dropdown">
-                    <a href="#" data-lang="si">Slovenščina (SI)</a>
-                    <a href="#" data-lang="en">English (EN)</a>
-                    <a href="#" data-lang="mk">Македонски (MK)</a>
-                </div>
-            </div>
-        </div>
-
-        <!-- Панел за мобилна навигација -->
-        <div class="mobile-nav-panel">
-            <nav class="navigation mobile-nav">
-                <a href="#">За нас</a>
-                <a href="#">За студенти</a>
-                <a href="../../../mk/projects/">Проекти</a>
+        <!-- Logotip je zdaj samostojen element na levi strani -->
+        <a href="../../../mk/" class="logo-link">
+            <img src="../../../images/1-logo.png" alt="Лого на Македонска студентска организација во Словенија" class="logo-img">
+        </a>
+        
+        <!-- Nov ovoj za vse elemente na desni strani -->
+        <div class="header-right-wrapper">
+            <nav>
+                <ul class="navigation desktop-nav">
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">За нас</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Времеплов и достигнувања</a></li>
+                            <li><a href="#">Нашиот тим, мисија, визија и вредности</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">Што работиме</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="../../../mk/projects/">Настани и проекти</a></li>
+                            <li><a href="#">Блог</a></li>
+                            <li><a href="#">Галерија</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">Вклучи се</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Стани член</a></li>
+                            <li><a href="#">Поддржи ја МСОС</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">За студенти</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Водич за добредојде</a></li>
+                            <li><a href="#">Менторска програма</a></li>
+                            <li><a href="#">Често поставувани прашања</a></li>
+                            <li><a href="#">Запознај ја Словенија</a></li>
+                            <li><a href="#">Запознај ја Северна Македонија</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">Новости</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Соопштенија</a></li>
+                            <li><a href="#">Отворени повици</a></li>
+                            <li><a href="#">Соопштенија за медиуми</a></li>
+                        </ul>
+                    </li>
+                </ul>
             </nav>
             <div class="navigation-actions">
-                <button class="btn btn-secondary">Стани партнер</button>
+                <button class="btn btn-secondary">Стани член</button>
                 <button class="btn btn-primary">Донирај</button>
-                <!-- Преклопник за јазик (за мобилен) -->
                 <div class="language-selector">
                     <div class="current-lang">
                         <i class="fas fa-globe"></i>
-                        <span id="current-lang-code-mobile">MK</span>
+                        <span id="current-lang-code">МК</span>
                         <i class="fas fa-chevron-down"></i>
                     </div>
                     <div class="lang-dropdown">
                         <a href="#" data-lang="si">Slovenščina (SI)</a>
                         <a href="#" data-lang="en">English (EN)</a>
-                        <a href="#" data-lang="mk">Македонски (MK)</a>
+                        <a href="#" data-lang="mk">Македонски (МК)</a>
                     </div>
                 </div>
             </div>
-
-             <!-- Икона за мобилно мени (Хамбургер/X) -->
-            <div class="mobile-menu-icon">
-                <i class="fas fa-bars"></i>
-                <i class="fas fa-times"></i>
-            </div>
         </div>
+
+        <!-- Ikona za mobilni meni ostaja ločena za lažje upravljanje -->
+        <div class="mobile-menu-icon">
+            <i class="fas fa-bars"></i>
+            <i class="fas fa-times"></i>
+        </div>
+    </div>
 </header>
+
+<!-- Panel za mobilno navigacijo -->
+<div class="mobile-nav-panel">
+    <nav>
+        <ul class="navigation mobile-nav">
+            <li class="menu-item menu-item-has-children">
+                <a href="#">За нас</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Времеплов и достигнувања</a></li>
+                    <li><a href="#">Нашиот тим, мисија, визија и вредности</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">Што работиме</a>
+                <ul class="dropdown-menu">
+                    <li><a href="../../../mk/projects/">Настани и проекти</a></li>
+                    <li><a href="#">Блог</a></li>
+                    <li><a href="#">Галерија</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">Вклучи се</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Стани член</a></li>
+                    <li><a href="#">Поддржи ја МСОС</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">За студенти</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Водич за добредојде</a></li>
+                    <li><a href="#">Менторска програма</a></li>
+                    <li><a href="#">Често поставувани прашања</a></li>
+                    <li><a href="#">Запознај ја Словенија</a></li>
+                    <li><a href="#">Запознај ја Северна Македонија</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">Новости</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Соопштенија</a></li>
+                    <li><a href="#">Отворени повици</a></li>
+                    <li><a href="#">Соопштенија за медиуми</a></li>
+                </ul>
+            </li>
+        </ul>
+    </nav>
+    <div class="navigation-actions">
+        <button class="btn btn-secondary">Стани член</button>
+        <button class="btn btn-primary">Донирај</button>
+        <div class="language-selector">
+            <button class="current-lang" id="mobile-lang-trigger">
+                <i class="fas fa-globe"></i>
+                <span>МК</span>
+                <i class="fas fa-chevron-right"></i>
+            </button>
+        </div>
+    </div>
+</div>
+
+<!-- Modalno okno za izbiro na jazik (za mobilni) -->
+<div id="language-modal-overlay">
+    <div class="language-modal-content">
+        <div class="language-modal-header">
+            <h3>Избери јазик</h3>
+            <button id="language-modal-close" aria-label="Затвори избор на јазик">&times;</button>
+        </div>
+        <div class="language-modal-body">
+            <a href="#" data-lang="si">Slovenščina (SI)</a>
+            <a href="#" data-lang="en">English (EN)</a>
+            <a href="#" data-lang="mk" class="active-lang">Македонски (МК)</a>
+        </div>
+    </div>
+</div>
 <!-- END_HEADER -->
 
     <main class="article-page">
@@ -12193,7 +12735,7 @@ document.addEventListener('DOMContentLoaded', function() {
                 <p>Сè започна со едноставна желба – да се собереме, да се запознаеме и да ја почувствуваме Македонија, иако сме далеку од неа. Кристијан Поповски, тогаш студент на Економскиот факултет во Љубљана, ја сподели својата идеја со неколку колеги, а одговорот беше неверојатен. За помалку од две недели, преку 40 студенти се пријавија во организацискиот тим. Секој понесе дел од својот ентузијазам и време, а заедничкиот дух и желбата за поврзување ја претворија оваа спонтана иницијатива во настан што долго ќе го паметиме.</p>
                 
                 <figure class="article-inline-image">
-                    <img src="../../../images/msnl-2.png" alt="Подготовки и состаноци за македонската студентска вечер">
+                    <img src="../../../images/msnl-2.webp" alt="Подготовки и состаноци за македонската студентска вечер">
                     <figcaption>Фотографии од подготовките и состаноците за организирање на македонската студентска вечер</figcaption>
                 </figure>
                 
@@ -12373,69 +12915,156 @@ document.addEventListener('DOMContentLoaded', function() {
     <!-- START_HEADER -->
 <header class="dropdown-header-navigation">
     <div class="container">
-        <div class="header-content">
-            <a href="../../../mk/" class="logo-link">
-                <img src="../../../images/1-logo.png" alt="Лого на Македонска студентска организација во Словенија" class="logo-img">
-            </a>
-            <!-- Навигација за десктоп -->
-            <nav class="navigation desktop-nav">
-                <a href="#">За нас</a>
-                <a href="#">За студенти</a>
-                <a href="../../../mk/projects/">Проекти</a>
-            </nav>
-        </div>
-
-        <!-- Копчиња за десктоп -->
-        <div class="navigation-actions">
-            <button class="btn btn-secondary">Стани партнер</button>
-            <button class="btn btn-primary">Донирај</button>
-            <!-- Преклопник за јазик -->
-            <div class="language-selector">
-                <div class="current-lang">
-                    <i class="fas fa-globe"></i>
-                    <span id="current-lang-code">MK</span>
-                    <i class="fas fa-chevron-down"></i>
-                </div>
-                <div class="lang-dropdown">
-                    <a href="#" data-lang="si">Slovenščina (SI)</a>
-                    <a href="#" data-lang="en">English (EN)</a>
-                    <a href="#" data-lang="mk">Македонски (MK)</a>
-                </div>
-            </div>
-        </div>
-
-        <!-- Панел за мобилна навигација -->
-        <div class="mobile-nav-panel">
-            <nav class="navigation mobile-nav">
-                <a href="#">За нас</a>
-                <a href="#">За студенти</a>
-                <a href="../../../mk/projects/">Проекти</a>
+        <!-- Logotip je zdaj samostojen element na levi strani -->
+        <a href="../../../mk/" class="logo-link">
+            <img src="../../../images/1-logo.png" alt="Лого на Македонска студентска организација во Словенија" class="logo-img">
+        </a>
+        
+        <!-- Nov ovoj za vse elemente na desni strani -->
+        <div class="header-right-wrapper">
+            <nav>
+                <ul class="navigation desktop-nav">
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">За нас</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Времеплов и достигнувања</a></li>
+                            <li><a href="#">Нашиот тим, мисија, визија и вредности</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">Што работиме</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="../../../mk/projects/">Настани и проекти</a></li>
+                            <li><a href="#">Блог</a></li>
+                            <li><a href="#">Галерија</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">Вклучи се</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Стани член</a></li>
+                            <li><a href="#">Поддржи ја МСОС</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">За студенти</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Водич за добредојде</a></li>
+                            <li><a href="#">Менторска програма</a></li>
+                            <li><a href="#">Често поставувани прашања</a></li>
+                            <li><a href="#">Запознај ја Словенија</a></li>
+                            <li><a href="#">Запознај ја Северна Македонија</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">Новости</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Соопштенија</a></li>
+                            <li><a href="#">Отворени повици</a></li>
+                            <li><a href="#">Соопштенија за медиуми</a></li>
+                        </ul>
+                    </li>
+                </ul>
             </nav>
             <div class="navigation-actions">
-                <button class="btn btn-secondary">Стани партнер</button>
+                <button class="btn btn-secondary">Стани член</button>
                 <button class="btn btn-primary">Донирај</button>
-                <!-- Преклопник за јазик (за мобилен) -->
                 <div class="language-selector">
                     <div class="current-lang">
                         <i class="fas fa-globe"></i>
-                        <span id="current-lang-code-mobile">MK</span>
+                        <span id="current-lang-code">МК</span>
                         <i class="fas fa-chevron-down"></i>
                     </div>
                     <div class="lang-dropdown">
                         <a href="#" data-lang="si">Slovenščina (SI)</a>
                         <a href="#" data-lang="en">English (EN)</a>
-                        <a href="#" data-lang="mk">Македонски (MK)</a>
+                        <a href="#" data-lang="mk">Македонски (МК)</a>
                     </div>
                 </div>
             </div>
-
-             <!-- Икона за мобилно мени (Хамбургер/X) -->
-            <div class="mobile-menu-icon">
-                <i class="fas fa-bars"></i>
-                <i class="fas fa-times"></i>
-            </div>
         </div>
+
+        <!-- Ikona za mobilni meni ostaja ločena za lažje upravljanje -->
+        <div class="mobile-menu-icon">
+            <i class="fas fa-bars"></i>
+            <i class="fas fa-times"></i>
+        </div>
+    </div>
 </header>
+
+<!-- Panel za mobilno navigacijo -->
+<div class="mobile-nav-panel">
+    <nav>
+        <ul class="navigation mobile-nav">
+            <li class="menu-item menu-item-has-children">
+                <a href="#">За нас</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Времеплов и достигнувања</a></li>
+                    <li><a href="#">Нашиот тим, мисија, визија и вредности</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">Што работиме</a>
+                <ul class="dropdown-menu">
+                    <li><a href="../../../mk/projects/">Настани и проекти</a></li>
+                    <li><a href="#">Блог</a></li>
+                    <li><a href="#">Галерија</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">Вклучи се</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Стани член</a></li>
+                    <li><a href="#">Поддржи ја МСОС</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">За студенти</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Водич за добредојде</a></li>
+                    <li><a href="#">Менторска програма</a></li>
+                    <li><a href="#">Често поставувани прашања</a></li>
+                    <li><a href="#">Запознај ја Словенија</a></li>
+                    <li><a href="#">Запознај ја Северна Македонија</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">Новости</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Соопштенија</a></li>
+                    <li><a href="#">Отворени повици</a></li>
+                    <li><a href="#">Соопштенија за медиуми</a></li>
+                </ul>
+            </li>
+        </ul>
+    </nav>
+    <div class="navigation-actions">
+        <button class="btn btn-secondary">Стани член</button>
+        <button class="btn btn-primary">Донирај</button>
+        <div class="language-selector">
+            <button class="current-lang" id="mobile-lang-trigger">
+                <i class="fas fa-globe"></i>
+                <span>МК</span>
+                <i class="fas fa-chevron-right"></i>
+            </button>
+        </div>
+    </div>
+</div>
+
+<!-- Modalno okno za izbiro na jazik (za mobilni) -->
+<div id="language-modal-overlay">
+    <div class="language-modal-content">
+        <div class="language-modal-header">
+            <h3>Избери јазик</h3>
+            <button id="language-modal-close" aria-label="Затвори избор на јазик">&times;</button>
+        </div>
+        <div class="language-modal-body">
+            <a href="#" data-lang="si">Slovenščina (SI)</a>
+            <a href="#" data-lang="en">English (EN)</a>
+            <a href="#" data-lang="mk" class="active-lang">Македонски (МК)</a>
+        </div>
+    </div>
+</div>
 <!-- END_HEADER -->
 
     <main class="article-page">
@@ -12795,7 +13424,7 @@ document.addEventListener('DOMContentLoaded', function() {
                 <p>Посебен момент на настанот беше обраќањето на конзулот од Амбасадата на Република Словенија во Северна Македонија, господинот Мартин Глазар. Тој накратко ги претстави најважните чекори од процесот за добивање дозвола за привремен престој – една од најголемите грижи и предизвици за сите странски студенти во Словенија. На тој начин, идните студенти добија појасна слика за тоа што ги очекува и како полесно да се справат со административните процедури.</p>
                 
                 <figure class="article-inline-image">
-                    <img src="../../../images/event3-photo-9.png" alt="Конзулот ги запознава студентите со процесот за добивање привремена дозвола за престој">
+                    <img src="../../../images/event3-photo-9.webp" alt="Конзулот ги запознава студентите со процесот за добивање привремена дозвола за престој">
                     <figcaption>Фотографија од конзулот кој на интересен начин ги запознава студентите со процесот за добивање на привремена дозвола за престој!</figcaption>
                 </figure>
 
@@ -12947,69 +13576,156 @@ document.addEventListener('DOMContentLoaded', function() {
     <!-- START_HEADER -->
 <header class="dropdown-header-navigation">
     <div class="container">
-        <div class="header-content">
-            <a href="../../../mk/" class="logo-link">
-                <img src="../../../images/1-logo.png" alt="Лого на Македонска студентска организација во Словенија" class="logo-img">
-            </a>
-            <!-- Навигација за десктоп -->
-            <nav class="navigation desktop-nav">
-                <a href="#">За нас</a>
-                <a href="#">За студенти</a>
-                <a href="../../../mk/projects/">Проекти</a>
-            </nav>
-        </div>
-
-        <!-- Копчиња за десктоп -->
-        <div class="navigation-actions">
-            <button class="btn btn-secondary">Стани партнер</button>
-            <button class="btn btn-primary">Донирај</button>
-            <!-- Преклопник за јазик -->
-            <div class="language-selector">
-                <div class="current-lang">
-                    <i class="fas fa-globe"></i>
-                    <span id="current-lang-code">MK</span>
-                    <i class="fas fa-chevron-down"></i>
-                </div>
-                <div class="lang-dropdown">
-                    <a href="#" data-lang="si">Slovenščina (SI)</a>
-                    <a href="#" data-lang="en">English (EN)</a>
-                    <a href="#" data-lang="mk">Македонски (MK)</a>
-                </div>
-            </div>
-        </div>
-
-        <!-- Панел за мобилна навигација -->
-        <div class="mobile-nav-panel">
-            <nav class="navigation mobile-nav">
-                <a href="#">За нас</a>
-                <a href="#">За студенти</a>
-                <a href="../../../mk/projects/">Проекти</a>
+        <!-- Logotip je zdaj samostojen element na levi strani -->
+        <a href="../../../mk/" class="logo-link">
+            <img src="../../../images/1-logo.png" alt="Лого на Македонска студентска организација во Словенија" class="logo-img">
+        </a>
+        
+        <!-- Nov ovoj za vse elemente na desni strani -->
+        <div class="header-right-wrapper">
+            <nav>
+                <ul class="navigation desktop-nav">
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">За нас</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Времеплов и достигнувања</a></li>
+                            <li><a href="#">Нашиот тим, мисија, визија и вредности</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">Што работиме</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="../../../mk/projects/">Настани и проекти</a></li>
+                            <li><a href="#">Блог</a></li>
+                            <li><a href="#">Галерија</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">Вклучи се</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Стани член</a></li>
+                            <li><a href="#">Поддржи ја МСОС</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">За студенти</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Водич за добредојде</a></li>
+                            <li><a href="#">Менторска програма</a></li>
+                            <li><a href="#">Често поставувани прашања</a></li>
+                            <li><a href="#">Запознај ја Словенија</a></li>
+                            <li><a href="#">Запознај ја Северна Македонија</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">Новости</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Соопштенија</a></li>
+                            <li><a href="#">Отворени повици</a></li>
+                            <li><a href="#">Соопштенија за медиуми</a></li>
+                        </ul>
+                    </li>
+                </ul>
             </nav>
             <div class="navigation-actions">
-                <button class="btn btn-secondary">Стани партнер</button>
+                <button class="btn btn-secondary">Стани член</button>
                 <button class="btn btn-primary">Донирај</button>
-                <!-- Преклопник за јазик (за мобилен) -->
                 <div class="language-selector">
                     <div class="current-lang">
                         <i class="fas fa-globe"></i>
-                        <span id="current-lang-code-mobile">MK</span>
+                        <span id="current-lang-code">МК</span>
                         <i class="fas fa-chevron-down"></i>
                     </div>
                     <div class="lang-dropdown">
                         <a href="#" data-lang="si">Slovenščina (SI)</a>
                         <a href="#" data-lang="en">English (EN)</a>
-                        <a href="#" data-lang="mk">Македонски (MK)</a>
+                        <a href="#" data-lang="mk">Македонски (МК)</a>
                     </div>
                 </div>
             </div>
-
-             <!-- Икона за мобилно мени (Хамбургер/X) -->
-            <div class="mobile-menu-icon">
-                <i class="fas fa-bars"></i>
-                <i class="fas fa-times"></i>
-            </div>
         </div>
+
+        <!-- Ikona za mobilni meni ostaja ločena za lažje upravljanje -->
+        <div class="mobile-menu-icon">
+            <i class="fas fa-bars"></i>
+            <i class="fas fa-times"></i>
+        </div>
+    </div>
 </header>
+
+<!-- Panel za mobilno navigacijo -->
+<div class="mobile-nav-panel">
+    <nav>
+        <ul class="navigation mobile-nav">
+            <li class="menu-item menu-item-has-children">
+                <a href="#">За нас</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Времеплов и достигнувања</a></li>
+                    <li><a href="#">Нашиот тим, мисија, визија и вредности</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">Што работиме</a>
+                <ul class="dropdown-menu">
+                    <li><a href="../../../mk/projects/">Настани и проекти</a></li>
+                    <li><a href="#">Блог</a></li>
+                    <li><a href="#">Галерија</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">Вклучи се</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Стани член</a></li>
+                    <li><a href="#">Поддржи ја МСОС</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">За студенти</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Водич за добредојде</a></li>
+                    <li><a href="#">Менторска програма</a></li>
+                    <li><a href="#">Често поставувани прашања</a></li>
+                    <li><a href="#">Запознај ја Словенија</a></li>
+                    <li><a href="#">Запознај ја Северна Македонија</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">Новости</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Соопштенија</a></li>
+                    <li><a href="#">Отворени повици</a></li>
+                    <li><a href="#">Соопштенија за медиуми</a></li>
+                </ul>
+            </li>
+        </ul>
+    </nav>
+    <div class="navigation-actions">
+        <button class="btn btn-secondary">Стани член</button>
+        <button class="btn btn-primary">Донирај</button>
+        <div class="language-selector">
+            <button class="current-lang" id="mobile-lang-trigger">
+                <i class="fas fa-globe"></i>
+                <span>МК</span>
+                <i class="fas fa-chevron-right"></i>
+            </button>
+        </div>
+    </div>
+</div>
+
+<!-- Modalno okno za izbiro na jazik (za mobilni) -->
+<div id="language-modal-overlay">
+    <div class="language-modal-content">
+        <div class="language-modal-header">
+            <h3>Избери јазик</h3>
+            <button id="language-modal-close" aria-label="Затвори избор на јазик">&times;</button>
+        </div>
+        <div class="language-modal-body">
+            <a href="#" data-lang="si">Slovenščina (SI)</a>
+            <a href="#" data-lang="en">English (EN)</a>
+            <a href="#" data-lang="mk" class="active-lang">Македонски (МК)</a>
+        </div>
+    </div>
+</div>
 <!-- END_HEADER -->
 
     <main class="article-page">
@@ -13357,7 +14073,7 @@ document.addEventListener('DOMContentLoaded', function() {
                 <p>Овојпат спомените од вечерта ги должиме на Христина Траковска, која беше фотограф и се погрижи сите тие моменти да останат забележани и да можеме повторно да ги проживуваме преку фотографии.</p>
                 
                 <figure class="article-inline-image">
-                    <img src="../../../images/event4-img-10.png" alt="Поздравен говор на Н.Е. амбасадор господинот Грегор Прескер.">
+                    <img src="../../../images/event4-img-10.webp" alt="Поздравен говор на Н.Е. амбасадор господинот Грегор Прескер.">
                     <figcaption>Фотографија од поздравниот говор на Н.Е. амбасадор господинот Грегор Прескер.</figcaption>
                 </figure>
 
@@ -13505,69 +14221,156 @@ document.addEventListener('DOMContentLoaded', function() {
     <!-- START_HEADER -->
 <header class="dropdown-header-navigation">
     <div class="container">
-        <div class="header-content">
-            <a href="../../../mk/" class="logo-link">
-                <img src="../../../images/1-logo.png" alt="Лого на Македонска студентска организација во Словенија" class="logo-img">
-            </a>
-            <!-- Навигација за десктоп -->
-            <nav class="navigation desktop-nav">
-                <a href="#">За нас</a>
-                <a href="#">За студенти</a>
-                <a href="../../../mk/projects/">Проекти</a>
-            </nav>
-        </div>
-
-        <!-- Копчиња за десктоп -->
-        <div class="navigation-actions">
-            <button class="btn btn-secondary">Стани партнер</button>
-            <button class="btn btn-primary">Донирај</button>
-            <!-- Преклопник за јазик -->
-            <div class="language-selector">
-                <div class="current-lang">
-                    <i class="fas fa-globe"></i>
-                    <span id="current-lang-code">MK</span>
-                    <i class="fas fa-chevron-down"></i>
-                </div>
-                <div class="lang-dropdown">
-                    <a href="#" data-lang="si">Slovenščina (SI)</a>
-                    <a href="#" data-lang="en">English (EN)</a>
-                    <a href="#" data-lang="mk">Македонски (MK)</a>
-                </div>
-            </div>
-        </div>
-
-        <!-- Панел за мобилна навигација -->
-        <div class="mobile-nav-panel">
-            <nav class="navigation mobile-nav">
-                <a href="#">За нас</a>
-                <a href="#">За студенти</a>
-                <a href="../../../mk/projects/">Проекти</a>
+        <!-- Logotip je zdaj samostojen element na levi strani -->
+        <a href="../../../mk/" class="logo-link">
+            <img src="../../../images/1-logo.png" alt="Лого на Македонска студентска организација во Словенија" class="logo-img">
+        </a>
+        
+        <!-- Nov ovoj za vse elemente na desni strani -->
+        <div class="header-right-wrapper">
+            <nav>
+                <ul class="navigation desktop-nav">
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">За нас</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Времеплов и достигнувања</a></li>
+                            <li><a href="#">Нашиот тим, мисија, визија и вредности</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">Што работиме</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="../../../mk/projects/">Настани и проекти</a></li>
+                            <li><a href="#">Блог</a></li>
+                            <li><a href="#">Галерија</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">Вклучи се</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Стани член</a></li>
+                            <li><a href="#">Поддржи ја МСОС</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">За студенти</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Водич за добредојде</a></li>
+                            <li><a href="#">Менторска програма</a></li>
+                            <li><a href="#">Често поставувани прашања</a></li>
+                            <li><a href="#">Запознај ја Словенија</a></li>
+                            <li><a href="#">Запознај ја Северна Македонија</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">Новости</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Соопштенија</a></li>
+                            <li><a href="#">Отворени повици</a></li>
+                            <li><a href="#">Соопштенија за медиуми</a></li>
+                        </ul>
+                    </li>
+                </ul>
             </nav>
             <div class="navigation-actions">
-                <button class="btn btn-secondary">Стани партнер</button>
+                <button class="btn btn-secondary">Стани член</button>
                 <button class="btn btn-primary">Донирај</button>
-                <!-- Преклопник за јазик (за мобилен) -->
                 <div class="language-selector">
                     <div class="current-lang">
                         <i class="fas fa-globe"></i>
-                        <span id="current-lang-code-mobile">MK</span>
+                        <span id="current-lang-code">МК</span>
                         <i class="fas fa-chevron-down"></i>
                     </div>
                     <div class="lang-dropdown">
                         <a href="#" data-lang="si">Slovenščina (SI)</a>
                         <a href="#" data-lang="en">English (EN)</a>
-                        <a href="#" data-lang="mk">Македонски (MK)</a>
+                        <a href="#" data-lang="mk">Македонски (МК)</a>
                     </div>
                 </div>
             </div>
-
-             <!-- Икона за мобилно мени (Хамбургер/X) -->
-            <div class="mobile-menu-icon">
-                <i class="fas fa-bars"></i>
-                <i class="fas fa-times"></i>
-            </div>
         </div>
+
+        <!-- Ikona za mobilni meni ostaja ločena za lažje upravljanje -->
+        <div class="mobile-menu-icon">
+            <i class="fas fa-bars"></i>
+            <i class="fas fa-times"></i>
+        </div>
+    </div>
 </header>
+
+<!-- Panel za mobilno navigacijo -->
+<div class="mobile-nav-panel">
+    <nav>
+        <ul class="navigation mobile-nav">
+            <li class="menu-item menu-item-has-children">
+                <a href="#">За нас</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Времеплов и достигнувања</a></li>
+                    <li><a href="#">Нашиот тим, мисија, визија и вредности</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">Што работиме</a>
+                <ul class="dropdown-menu">
+                    <li><a href="../../../mk/projects/">Настани и проекти</a></li>
+                    <li><a href="#">Блог</a></li>
+                    <li><a href="#">Галерија</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">Вклучи се</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Стани член</a></li>
+                    <li><a href="#">Поддржи ја МСОС</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">За студенти</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Водич за добредојде</a></li>
+                    <li><a href="#">Менторска програма</a></li>
+                    <li><a href="#">Често поставувани прашања</a></li>
+                    <li><a href="#">Запознај ја Словенија</a></li>
+                    <li><a href="#">Запознај ја Северна Македонија</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">Новости</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Соопштенија</a></li>
+                    <li><a href="#">Отворени повици</a></li>
+                    <li><a href="#">Соопштенија за медиуми</a></li>
+                </ul>
+            </li>
+        </ul>
+    </nav>
+    <div class="navigation-actions">
+        <button class="btn btn-secondary">Стани член</button>
+        <button class="btn btn-primary">Донирај</button>
+        <div class="language-selector">
+            <button class="current-lang" id="mobile-lang-trigger">
+                <i class="fas fa-globe"></i>
+                <span>МК</span>
+                <i class="fas fa-chevron-right"></i>
+            </button>
+        </div>
+    </div>
+</div>
+
+<!-- Modalno okno za izbiro na jazik (za mobilni) -->
+<div id="language-modal-overlay">
+    <div class="language-modal-content">
+        <div class="language-modal-header">
+            <h3>Избери јазик</h3>
+            <button id="language-modal-close" aria-label="Затвори избор на јазик">&times;</button>
+        </div>
+        <div class="language-modal-body">
+            <a href="#" data-lang="si">Slovenščina (SI)</a>
+            <a href="#" data-lang="en">English (EN)</a>
+            <a href="#" data-lang="mk" class="active-lang">Македонски (МК)</a>
+        </div>
+    </div>
+</div>
 <!-- END_HEADER -->
 
     <main class="article-page">
@@ -13876,7 +14679,7 @@ document.addEventListener('DOMContentLoaded', function() {
                 <p>Се гледаме повторно и следната година – уште поопуштени и со уште повеќе кафе!</p>
                 
                 <figure class="article-inline-image">
-                    <img src="../../../images/event4-image7.png" alt="Колаж од фотографии на кои се прикажани студенти, шолји за кафе и бурек.">
+                    <img src="../../../images/event4-image7.webp" alt="Колаж од фотографии на кои се прикажани студенти, шолји за кафе и бурек.">
                     <figcaption>Убава дружба, многу спомени и заеднички пребродени испитни стресови.</figcaption>
                 </figure>
             </div>
@@ -14289,6 +15092,487 @@ if __name__ == "__main__":
     <!-- Povezava na glavno CSS datoteko (popravljena pot) -->
     <link rel="stylesheet" href="../css/main.css">
 </head>
+<body>
+
+    <!-- START_HEADER -->
+<header class="dropdown-header-navigation">
+    <div class="container">
+        <!-- Logotip je zdaj samostojen element na levi strani -->
+        <a href="../si/" class="logo-link">
+            <img src="../images/1-logo.png" alt="Logotip Makedonske študentske organizacije v Sloveniji" class="logo-img">
+        </a>
+        
+        <!-- Nov ovoj za vse elemente na desni strani -->
+        <div class="header-right-wrapper">
+            <nav>
+                <ul class="navigation desktop-nav">
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">O nas</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Časovnica in dosežki</a></li>
+                            <li><a href="#">Naša ekipa, poslanstvo, vizija in vrednote</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">Kaj delamo</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="../si/projects/">Dogodki in projekti</a></li>
+                            <li><a href="#">Blog</a></li>
+                            <li><a href="#">Galerija</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">Vključi se</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Postani član</a></li>
+                            <li><a href="#">Podpri MŠOS</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">Za študente</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Vodič za bruce</a></li>
+                            <li><a href="#">Mentorski program</a></li>
+                            <li><a href="#">Pogosta vprašanja</a></li>
+                            <li><a href="#">Spoznaj Slovenijo</a></li>
+                            <li><a href="#">Spoznaj Severno Makedonijo</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">Novice</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Obvestila</a></li>
+                            <li><a href="#">Odprti pozivi</a></li>
+                            <li><a href="#">Sporočila za javnost</a></li>
+                        </ul>
+                    </li>
+                </ul>
+            </nav>
+            <div class="navigation-actions">
+                <button class="btn btn-secondary">Postani član</button>
+                <button class="btn btn-primary">Doniraj</button>
+                <div class="language-selector">
+                    <div class="current-lang">
+                        <i class="fas fa-globe"></i>
+                        <span id="current-lang-code">SI</span>
+                        <i class="fas fa-chevron-down"></i>
+                    </div>
+                    <div class="lang-dropdown">
+                        <a href="#" data-lang="si">Slovenščina (SI)</a>
+                        <a href="#" data-lang="en">English (EN)</a>
+                        <a href="#" data-lang="mk">Македонски (МК)</a>
+                    </div>
+                </div>
+            </div>
+        </div>
+
+        <!-- Ikona za mobilni meni ostaja ločena za lažje upravljanje -->
+        <div class="mobile-menu-icon">
+            <i class="fas fa-bars"></i>
+            <i class="fas fa-times"></i>
+        </div>
+    </div>
+</header>
+
+<!-- Panel za mobilno navigacijo -->
+<div class="mobile-nav-panel">
+    <nav>
+        <ul class="navigation mobile-nav">
+            <li class="menu-item menu-item-has-children">
+                <a href="#">O nas</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Časovnica in dosežki</a></li>
+                    <li><a href="#">Naša ekipa, poslanstvo, vizija in vrednote</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">Kaj delamo</a>
+                <ul class="dropdown-menu">
+                    <li><a href="../si/projects/">Dogodki in projekti</a></li>
+                    <li><a href="#">Blog</a></li>
+                    <li><a href="#">Galerija</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">Vključi se</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Postani član</a></li>
+                    <li><a href="#">Podpri MŠOS</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">Za študente</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Vodič za bruce</a></li>
+                    <li><a href="#">Mentorski program</a></li>
+                    <li><a href="#">Pogosta vprašanja</a></li>
+                    <li><a href="#">Spoznaj Slovenijo</a></li>
+                    <li><a href="#">Spoznaj Severno Makedonijo</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">Novice</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Obvestila</a></li>
+                    <li><a href="#">Odprti pozivi</a></li>
+                    <li><a href="#">Sporočila za javnost</a></li>
+                </ul>
+            </li>
+        </ul>
+    </nav>
+    <div class="navigation-actions">
+        <button class="btn btn-secondary">Postani član</button>
+        <button class="btn btn-primary">Doniraj</button>
+        <div class="language-selector">
+            <button class="current-lang" id="mobile-lang-trigger">
+                <i class="fas fa-globe"></i>
+                <span>SI</span>
+                <i class="fas fa-chevron-right"></i>
+            </button>
+        </div>
+    </div>
+</div>
+
+<!-- Modalno okno za izbiro jezika (za mobilni) -->
+<div id="language-modal-overlay">
+    <div class="language-modal-content">
+        <div class="language-modal-header">
+            <h3>Izberi jezik</h3>
+            <button id="language-modal-close" aria-label="Zapri izbiro jezika">&times;</button>
+        </div>
+        <div class="language-modal-body">
+            <a href="#" data-lang="si" class="active-lang">Slovenščina (SI)</a>
+            <a href="#" data-lang="en">English (EN)</a>
+            <a href="#" data-lang="mk">Македонски (МК)</a>
+        </div>
+    </div>
+</div>
+<!-- END_HEADER -->
+
+    <main>
+        <section class="hero-section">
+            <div class="hero-background">
+                <div class="hero-image-left" style="background-image: url('../images/2.hero.webp');"></div>
+                <div class="hero-image-right" style="background-image: url('../images/2.hero.webp');"></div>
+            </div>
+            <div class="hero-overlay"></div>
+            <div class="hero-content">
+                <div class="heading-and-supporting-text">
+                    <div class="badge-group">
+                        <div class="badge-content">
+                            <span class="message">Prva uradna MSOS</span>
+                        </div>
+                    </div>
+                    <h1>Opolnomočimo mlade z veščinami za spreminjanje sveta</h1>
+                    <p>Ne glede na to, ali imate ekipo 2 ali 200 ljudi, naši skupni timski nabiralniki ohranjajo vse na isti strani in v koraku z dogajanjem.</p>
+                </div>
+                <button class="btn btn-primary-orange">Postani član</button>
+            </div>
+        </section>
+
+        <section class="meet-the-team-section">
+            <div class="video-container">
+                <img src="../images/3.activites.webp" alt="Člani ekipe pri sodelovanju" class="video-thumbnail">
+                <div class="video-overlay"></div>
+                <button class="play-button" aria-label="Predvajaj video"></button>
+            </div>
+            <div class="team-content">
+                <h2>Spoznajte našo izjemno ekipo!</h2>
+                <p>Naša filozofija je preprosta — zaposliti ekipo raznolikih, strastnih ljudi in gojiti kulturo, ki vas opolnomoči, da opravite svoje najboljše delo.</p>
+                <button class="btn btn-secondary">Več o tem</button>
+            </div>
+        </section>
+
+        <section class="activities-section">
+            <div class="activities-header">
+                <h2>Aktivnosti</h2>
+                <p>Naša filozofija je preprosta — zaposliti ekipo raznolikih, strastnih ljudi in gojiti kulturo, ki vas opolnomoči, da opravite svoje najboljše delo.</p>
+            </div>
+            <div class="activities-content">
+                <div class="activities-nav">
+                    <ul>
+                        <li class="active">Študentsko predstavništvo</li>
+                        <li>Izobraževanje in kultura</li>
+                        <li>Zabava in druženje</li>
+                        <li>Študentska podpora</li>
+                    </ul>
+                    <button class="btn btn-primary-orange">Postani član</button>
+                </div>
+                <div class="activity-details">
+                    <p>Sed molestie penatibus sit bibendum pharetra purus faucibus fames aliquet. Morbi morbi ac sed tempor porta. Dui iaculis vitae fames sapien. Pellentesque urna eget habitasse arcu sed ornare. Dignissim lobortis ultrices maecenas magna ac habitant donec etiam at.</p>
+                    <img src="../images/3.activites.webp" alt="Skupina nasmejanih študentov pri sodelovanju">
+                </div>
+            </div>
+        </section>
+
+        <section class="latest-news-section">
+            <div class="news-header">
+                <h2>Zadnje novice</h2>
+                <p>Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharet.</p>
+            </div>
+            <div class="news-articles">
+                <article class="news-card">
+                    <img src="../images/4-billwalsh.webp" alt="Roza in modro obarvana podoba zasneženega vrha gore">
+                    <div class="card-content">
+                        <p class="author">Alec Whitten • 17 Jan 2022</p>
+                        <h3>Lekcije vodenja Billa Walsha</h3>
+                        <p>Bi radi izvedeli skrivnosti preoblikovanja ekipe z rezultatom 2-14 v trikratne zmagovalce Super Bowla...</p>
+                    </div>
+                </article>
+                <article class="news-card">
+                    <img src="../images/5-pmmentals.webp" alt="Ženska predstavlja pred belo tablo z listki ekipi">
+                    <div class="card-content">
+                        <p class="author">Demi Wilkinson • 16 Jan 2022</p>
+                        <h3>Mentalni modeli za PM</h3>
+                        <p>Mentalni modeli so preprosti izrazi kompleksnih procesov ali odnosov.</p>
+                    </div>
+                </article>
+                <article class="news-card">
+                    <img src="../images/6-whatiswireframing.webp" alt="Moderna računalniška miza z velikim monitorjem, tipkovnico in slušalkami">
+                    <div class="card-content">
+                        <p class="author">Candice Wu • 15 Jan 2022</p>
+                        <h3>Kaj je žični model (Wireframing)?</h3>
+                        <p>Uvod v žično modeliranje in njegova načela. Učite se od najboljših v industriji.</p>
+                    </div>
+                </article>
+            </div>
+            <button class="btn btn-secondary">Poglej vse</button>
+        </section>
+
+        <section class="testimonials-section">
+            <div class="testimonials-intro">
+                <h2>Poglejte, kaj o nas pravijo naši partnerji</h2>
+                <p>Vse, kar morate vedeti o produktu in zaračunavanju.</p>
+            </div>
+            <div class="testimonials-columns">
+                <div class="testimonial-column">
+                    <div class="testimonial-card">
+                        <h3>Kako nas sodelovanje izboljša</h3>
+                        <p>Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra. Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra feugiat.</p>
+                        <div class="author-info">
+                            <img src="../images/7-graphicdesigner.webp" alt="Aleksandar Popovski">
+                            <div>
+                                <h4>Aleksandar Popovski</h4>
+                                <p>Grafični oblikovalec pri MSOS</p>
+                            </div>
+                        </div>
+                    </div>
+                     <div class="testimonial-card">
+                        <h3>Consectetur vitae ac parturient massa</h3>
+                        <p>Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra. Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra feugiat. Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra.</p>
+                        <div class="author-info">
+                            <img src="../images/11-boy.webp" alt="Drug član ekipe">
+                            <div>
+                                <h4>Aleksandar Popovski</h4>
+                                <p>Grafični oblikovalec pri MSOS</p>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+                 <div class="testimonial-column column-offset">
+                    <div class="testimonial-card">
+                        <h3>Ponosni partnerji</h3>
+                        <p>Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra. Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra feugiat.</p>
+                        <div class="author-info">
+                            <img src="../images/12-girl2.webp" alt="Drug partner">
+                            <div>
+                                <h4>Aleksandar Popovski</h4>
+                                <p>Grafični oblikovalec pri MSOS</p>
+                            </div>
+                        </div>
+                    </div>
+                    <div class="testimonial-card">
+                        <h3>Naša izkušnja sodelovanja</h3>
+                        <p>Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra. Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra. Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra feugiat.</p>
+                        <div class="author-info">
+                             <img src="../images/10-girl1.webp" alt="Druga članica ekipe">
+                            <div>
+                                <h4>Aleksandar Popovski</h4>
+                                <p>Grafični oblikovalec pri MSOS</p>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </section>
+
+        <section class="become-part-section">
+            <div class="become-part-header">
+                <h2>Postanite del naše izjemne ekipe</h2>
+                <p>Smo 100% oddaljena ekipa, razpršena po vsem svetu. Pridružite se nam!</p>
+            </div>
+            <img src="../images/9-becomepart.webp" alt="Naša izjemna ekipa v učilnici" class="team-photo">
+            
+            <div class="contact-form-container">
+                <form class="contact-form">
+                    <div class="form-row">
+                        <div class="form-group">
+                            <label for="first-name">Ime</label>
+                            <input type="text" id="first-name" placeholder="Ime">
+                        </div>
+                        <div class="form-group">
+                            <label for="last-name">Priimek</label>
+                            <input type="text" id="last-name" placeholder="Priimek">
+                        </div>
+                    </div>
+                    <div class="form-group">
+                        <label for="email">E-pošta</label>
+                        <input type="email" id="email" placeholder="student@email.com">
+                    </div>
+                    <div class="form-group">
+                         <label for="phone-number">Telefonska številka</label>
+                        <div class="phone-input">
+                            <select id="country-code" aria-label="Klicna koda države">
+                                <option>SI</option>
+                                <option>MK</option>
+                                <option>US</option>
+                            </select>
+                            <input type="tel" id="phone-number" placeholder="+386 (00) 000-000">
+                        </div>
+                    </div>
+                    <div class="form-group">
+                        <label for="message">Sporočilo</label>
+                        <textarea id="message" rows="5"></textarea>
+                    </div>
+                    <div class="form-group checkbox-group">
+                        <input type="checkbox" id="privacy-policy">
+                        <label for="privacy-policy">Strinjate se z našo prijazno <a href="#">politiko zasebnosti</a>.</label>
+                    </div>
+                    <button type="submit" class="btn btn-primary">Pošlji sporočilo</button>
+                </form>
+            </div>
+        </section>
+
+        <section class="faq-section">
+            <div class="faq-header">
+                <h2>Pogosto zastavljena vprašanja</h2>
+                <p>Vse, kar morate vedeti o produktu in zaračunavanju.</p>
+            </div>
+            <div class="faq-grid">
+                <div class="faq-item">
+                    <div class="faq-icon-container"><i class="fas fa-heart"></i></div>
+                    <h3>Ali je na voljo brezplačen preizkus?</h3>
+                    <p>Da, lahko nas brezplačno preizkušate 30 dni. Naša prijazna ekipa bo sodelovala z vami, da boste čim prej začeli.</p>
+                </div>
+                <div class="faq-item">
+                     <div class="faq-icon-container"><i class="fas fa-sync-alt"></i></div>
+                    <h3>Ali lahko kasneje zamenjam svoj načrt?</h3>
+                    <p>Seveda. Naše cene se prilagajajo vašemu podjetju. Poklepetajte z našo prijazno ekipo in poiščite rešitev, ki vam ustreza.</p>
+                </div>
+                <div class="faq-item">
+                     <div class="faq-icon-container"><i class="fas fa-ban"></i></div>
+                    <h3>Kakšna je vaša politika odpovedi?</h3>
+                    <p>Razumemo, da se stvari spreminjajo. Svoj načrt lahko kadar koli prekličete in povrnili vam bomo že plačano razliko.</p>
+                </div>
+                <div class="faq-item">
+                     <div class="faq-icon-container"><i class="fas fa-plus-circle"></i></div>
+                    <h3>Ali se lahko na račun dodajo druge informacije?</h3>
+                    <p>Da, lahko nas brezplačno preizkušate 30 dni. Naša prijazna ekipa bo sodelovala z vami, da boste čim prej začeli.</p>
+                </div>
+                <div class="faq-item">
+                     <div class="faq-icon-container"><i class="fas fa-credit-card"></i></div>
+                    <h3>Kako poteka zaračunavanje?</h3>
+                    <p>Seveda. Naše cene se prilagajajo vašemu podjetju. Poklepetajte z našo prijazno ekipo in poiščite rešitev, ki vam ustreza.</p>
+                </div>
+                 <div class="faq-item">
+                     <div class="faq-icon-container"><i class="fas fa-envelope"></i></div>
+                    <h3>Kako spremenim e-pošto svojega računa?</h3>
+                    <p>Razumemo, da se stvari spreminjajo. Svoj načrt lahko kadar koli prekličete in povrnili vam bomo razliko.</p>
+                </div>
+            </div>
+            <div class="faq-footer">
+                <div class="avatar-group">
+                     <img src="../images/11-boy.webp" alt="Avatar 1" class="avatar">
+                     <img src="../images/10-girl1.webp" alt="Avatar 2" class="avatar large">
+                     <img src="../images/12-girl2.webp" alt="Avatar 3" class="avatar">
+                </div>
+                <h3>Imate še vprašanja?</h3>
+                <p>Ne najdete odgovora, ki ga iščete? Prosimo, poklepetajte z našo prijazno ekipo.</p>
+                <button class="btn btn-primary-orange">Poglej vsa vprašanja</button>
+            </div>
+        </section>
+
+    </main>
+
+    <!-- START_FOOTER -->
+<footer>
+    <div class="footer-container">
+        <div class="footer-main">
+            <div class="footer-info">
+                <div class="footer-logo">
+                    <img src="../images/13-whitelogo.png" alt="Logotip Makedonske študentske organizacije v Sloveniji">
+                </div>
+                <p>
+                    Masarykova cesta 24<br>
+                    1000 Ljubljana, Slovenija<br>
+                    +389 02 123 4567<br>
+                    info.msosorg@gmail.com
+                </p>
+                <div class="social-icons">
+                    <a href="#" aria-label="Facebook"><i class="fab fa-facebook-f"></i></a>
+                    <a href="#" aria-label="Instagram"><i class="fab fa-instagram"></i></a>
+                    <a href="#" aria-label="YouTube"><i class="fab fa-youtube"></i></a>
+                </div>
+            </div>
+            <div class="footer-links">
+                <div class="links-column">
+                    <h4>Za študente</h4>
+                    <a href="#">Blog</a>
+                    <a href="#">Galerija</a>
+                    <a href="#">Pogosta vprašanja</a>
+                    <a href="#">Brošura</a>
+                </div>
+                <div class="links-column">
+                    <h4>Projekti</h4>
+                    <a href="#">Prihajajoči</a>
+                    <a href="#">Pretekli</a>
+                </div>
+                <div class="links-column">
+                    <h4>Organizacija</h4>
+                    <a href="#">O nas</a>
+                    <a href="#">Kontakt</a>
+                    <a href="#">Dokumentacija</a>
+                </div>
+            </div>
+        </div>
+        <hr>
+        <div class="footer-bottom">
+             <p>© MŠOS org 2023 Vse pravice pridržane.</p>
+            <div class="legal-links">
+                <a href="#">Politika zasebnosti</a>
+                <a href="#">Politika piškotkov</a>
+                <a href="#">Pravni pogoji</a>
+            </div>
+        </div>
+    </div>
+    <script src="../main.js"></script>
+</footer>
+<!-- END_FOOTER -->
+
+</body>
+</html>"""
+
+
+"./si/index.html.bak" : 
+"""
+<!DOCTYPE html>
+<html lang="sl">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Makedonska Študentska Organizacija v Sloveniji</title>
+    
+    <!-- Google Fonts -->
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
+    
+    <!-- Font Awesome (for icons) -->
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css" integrity="sha512-DTOQO9RWCH3ppGqcWaEA1BIZOC6xxalwEsw9c2QQeAIftl+Vegovlnee1c9QX4TctnWMn13TZye+giMm8e2LwA==" crossorigin="anonymous" referrerpolicy="no-referrer" />
+
+    <!-- Povezava na glavno CSS datoteko (popravljena pot) -->
+    <link rel="stylesheet" href="../css/main.css">
+</head>
 <body>
 
     <!-- START_HEADER -->
@@ -14664,401 +15948,6 @@ if __name__ == "__main__":
 </html>"""
 
 
-"./si/index.html.bak" : 
-"""
-<!DOCTYPE html>
-<html lang="sl">
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Makedonska Študentska Organizacija v Sloveniji</title>
-    
-    <!-- Google Fonts -->
-    <link rel="preconnect" href="https://fonts.googleapis.com">
-    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
-    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
-    
-    <!-- Font Awesome (for icons) -->
-    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css" integrity="sha512-DTOQO9RWCH3ppGqcWaEA1BIZOC6xxalwEsw9c2QQeAIftl+Vegovlnee1c9QX4TctnWMn13TZye+giMm8e2LwA==" crossorigin="anonymous" referrerpolicy="no-referrer" />
-
-    <!-- Povezava na glavno CSS datoteko (popravljena pot) -->
-    <link rel="stylesheet" href="../css/main.css">
-</head>
-<body>
-
-    <!-- START_HEADER -->
-<header class="dropdown-header-navigation">
-    <div class="container">
-        <div class="header-content">
-            <a href="../si/" class="logo-link">
-                <img src="../images/1-logo.png" alt="Logotip Makedonske študentske organizacije v Sloveniji" class="logo-img">
-            </a>
-            <!-- Navigacija za namizje -->
-            <nav class="navigation desktop-nav">
-                <a href="#">O nas</a>
-                <a href="#">Za študente</a>
-                <a href="../si/projects/">Projekti</a>
-            </nav>
-        </div>
-
-        <!-- Gumbi za namizje -->
-        <div class="navigation-actions">
-            <button class="btn btn-secondary">Postanite partner</button>
-            <button class="btn btn-primary">Donirajte</button>
-            <!-- Zamenjan preklopnik jezika -->
-            <div class="language-selector">
-                <div class="current-lang">
-                    <i class="fas fa-globe"></i>
-                    <span id="current-lang-code">SI</span>
-                    <i class="fas fa-chevron-down"></i>
-                </div>
-                <div class="lang-dropdown">
-                    <a href="#" data-lang="si">Slovenščina (SI)</a>
-                    <a href="#" data-lang="en">English (EN)</a>
-                    <a href="#" data-lang="mk">Македонски (MK)</a>
-                </div>
-            </div>
-        </div>
-
-        <!-- Panel za mobilno navigacijo -->
-        <div class="mobile-nav-panel">
-            <nav class="navigation mobile-nav">
-                <a href="#">O nas</a>
-                <a href="#">Za študente</a>
-                <a href="../si/projects/">Projekti</a>
-            </nav>
-            <div class="navigation-actions">
-                <button class="btn btn-secondary">Postanite partner</button>
-                <button class="btn btn-primary">Donirajte</button>
-                 <!-- Zamenjan preklopnik jezika (tudi za mobilni meni) -->
-                <div class="language-selector">
-                    <div class="current-lang">
-                        <i class="fas fa-globe"></i>
-                        <span id="current-lang-code-mobile">SI</span>
-                        <i class="fas fa-chevron-down"></i>
-                    </div>
-                    <div class="lang-dropdown">
-                        <a href="#" data-lang="si">Slovenščina (SI)</a>
-                        <a href="#" data-lang="en">English (EN)</a>
-                        <a href="#" data-lang="mk">Македонски (MK)</a>
-                    </div>
-                </div>
-            </div>
-
-             <!-- Ikona za mobilni meni (Hamburger/X) -->
-            <div class="mobile-menu-icon">
-                <i class="fas fa-bars"></i>
-                <i class="fas fa-times"></i>
-            </div>
-        </div>
-</header>
-<!-- END_HEADER -->
-
-    <main>
-        <section class="hero-section">
-            <div class="hero-background">
-                <div class="hero-image-left" style="background-image: url('../images/2.hero.webp');"></div>
-                <div class="hero-image-right" style="background-image: url('../images/2.hero.webp');"></div>
-            </div>
-            <div class="hero-overlay"></div>
-            <div class="hero-content">
-                <div class="heading-and-supporting-text">
-                    <div class="badge-group">
-                        <div class="badge-content">
-                            <span class="message">Prva uradna MSOS</span>
-                        </div>
-                    </div>
-                    <h1>Opolnomočimo mlade z veščinami za spreminjanje sveta</h1>
-                    <p>Ne glede na to, ali imate ekipo 2 ali 200 ljudi, naši skupni timski nabiralniki ohranjajo vse na isti strani in v koraku z dogajanjem.</p>
-                </div>
-                <button class="btn btn-primary-orange">Postani član</button>
-            </div>
-        </section>
-
-        <section class="meet-the-team-section">
-            <div class="video-container">
-                <img src="../images/3.activites.webp" alt="Člani ekipe pri sodelovanju" class="video-thumbnail">
-                <div class="video-overlay"></div>
-                <button class="play-button" aria-label="Predvajaj video"></button>
-            </div>
-            <div class="team-content">
-                <h2>Spoznajte našo izjemno ekipo!</h2>
-                <p>Naša filozofija je preprosta — zaposliti ekipo raznolikih, strastnih ljudi in gojiti kulturo, ki vas opolnomoči, da opravite svoje najboljše delo.</p>
-                <button class="btn btn-secondary">Več o tem</button>
-            </div>
-        </section>
-
-        <section class="activities-section">
-            <div class="activities-header">
-                <h2>Aktivnosti</h2>
-                <p>Naša filozofija je preprosta — zaposliti ekipo raznolikih, strastnih ljudi in gojiti kulturo, ki vas opolnomoči, da opravite svoje najboljše delo.</p>
-            </div>
-            <div class="activities-content">
-                <div class="activities-nav">
-                    <ul>
-                        <li class="active">Študentsko predstavništvo</li>
-                        <li>Izobraževanje in kultura</li>
-                        <li>Zabava in druženje</li>
-                        <li>Študentska podpora</li>
-                    </ul>
-                    <button class="btn btn-primary-orange">Postani član</button>
-                </div>
-                <div class="activity-details">
-                    <p>Sed molestie penatibus sit bibendum pharetra purus faucibus fames aliquet. Morbi morbi ac sed tempor porta. Dui iaculis vitae fames sapien. Pellentesque urna eget habitasse arcu sed ornare. Dignissim lobortis ultrices maecenas magna ac habitant donec etiam at.</p>
-                    <img src="../images/3.activites.webp" alt="Skupina nasmejanih študentov pri sodelovanju">
-                </div>
-            </div>
-        </section>
-
-        <section class="latest-news-section">
-            <div class="news-header">
-                <h2>Zadnje novice</h2>
-                <p>Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharet.</p>
-            </div>
-            <div class="news-articles">
-                <article class="news-card">
-                    <img src="../images/4-billwalsh.webp" alt="Roza in modro obarvana podoba zasneženega vrha gore">
-                    <div class="card-content">
-                        <p class="author">Alec Whitten • 17 Jan 2022</p>
-                        <h3>Lekcije vodenja Billa Walsha</h3>
-                        <p>Bi radi izvedeli skrivnosti preoblikovanja ekipe z rezultatom 2-14 v trikratne zmagovalce Super Bowla...</p>
-                    </div>
-                </article>
-                <article class="news-card">
-                    <img src="../images/5-pmmentals.webp" alt="Ženska predstavlja pred belo tablo z listki ekipi">
-                    <div class="card-content">
-                        <p class="author">Demi Wilkinson • 16 Jan 2022</p>
-                        <h3>Mentalni modeli za PM</h3>
-                        <p>Mentalni modeli so preprosti izrazi kompleksnih procesov ali odnosov.</p>
-                    </div>
-                </article>
-                <article class="news-card">
-                    <img src="../images/6-whatiswireframing.webp" alt="Moderna računalniška miza z velikim monitorjem, tipkovnico in slušalkami">
-                    <div class="card-content">
-                        <p class="author">Candice Wu • 15 Jan 2022</p>
-                        <h3>Kaj je žični model (Wireframing)?</h3>
-                        <p>Uvod v žično modeliranje in njegova načela. Učite se od najboljših v industriji.</p>
-                    </div>
-                </article>
-            </div>
-            <button class="btn btn-secondary">Poglej vse</button>
-        </section>
-
-        <section class="testimonials-section">
-            <div class="testimonials-intro">
-                <h2>Poglejte, kaj o nas pravijo naši partnerji</h2>
-                <p>Vse, kar morate vedeti o produktu in zaračunavanju.</p>
-            </div>
-            <div class="testimonials-columns">
-                <div class="testimonial-column">
-                    <div class="testimonial-card">
-                        <h3>Kako nas sodelovanje izboljša</h3>
-                        <p>Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra. Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra feugiat.</p>
-                        <div class="author-info">
-                            <img src="../images/7-graphicdesigner.webp" alt="Aleksandar Popovski">
-                            <div>
-                                <h4>Aleksandar Popovski</h4>
-                                <p>Grafični oblikovalec pri MSOS</p>
-                            </div>
-                        </div>
-                    </div>
-                     <div class="testimonial-card">
-                        <h3>Consectetur vitae ac parturient massa</h3>
-                        <p>Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra. Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra feugiat. Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra.</p>
-                        <div class="author-info">
-                            <img src="../images/11-boy.webp" alt="Drug član ekipe">
-                            <div>
-                                <h4>Aleksandar Popovski</h4>
-                                <p>Grafični oblikovalec pri MSOS</p>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-                 <div class="testimonial-column column-offset">
-                    <div class="testimonial-card">
-                        <h3>Ponosni partnerji</h3>
-                        <p>Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra. Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra feugiat.</p>
-                        <div class="author-info">
-                            <img src="../images/12-girl2.webp" alt="Drug partner">
-                            <div>
-                                <h4>Aleksandar Popovski</h4>
-                                <p>Grafični oblikovalec pri MSOS</p>
-                            </div>
-                        </div>
-                    </div>
-                    <div class="testimonial-card">
-                        <h3>Naša izkušnja sodelovanja</h3>
-                        <p>Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra. Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra. Dignissim senectus ut senectus curabitur condimentum gravida cras nibh ac. Lorem scelerisque tortor rhoncus viverra pharetra feugiat.</p>
-                        <div class="author-info">
-                             <img src="../images/10-girl1.webp" alt="Druga članica ekipe">
-                            <div>
-                                <h4>Aleksandar Popovski</h4>
-                                <p>Grafični oblikovalec pri MSOS</p>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </section>
-
-        <section class="become-part-section">
-            <div class="become-part-header">
-                <h2>Postanite del naše izjemne ekipe</h2>
-                <p>Smo 100% oddaljena ekipa, razpršena po vsem svetu. Pridružite se nam!</p>
-            </div>
-            <img src="../images/9-becomepart.png" alt="Naša izjemna ekipa v učilnici" class="team-photo">
-            
-            <div class="contact-form-container">
-                <form class="contact-form">
-                    <div class="form-row">
-                        <div class="form-group">
-                            <label for="first-name">Ime</label>
-                            <input type="text" id="first-name" placeholder="Ime">
-                        </div>
-                        <div class="form-group">
-                            <label for="last-name">Priimek</label>
-                            <input type="text" id="last-name" placeholder="Priimek">
-                        </div>
-                    </div>
-                    <div class="form-group">
-                        <label for="email">E-pošta</label>
-                        <input type="email" id="email" placeholder="student@email.com">
-                    </div>
-                    <div class="form-group">
-                         <label for="phone-number">Telefonska številka</label>
-                        <div class="phone-input">
-                            <select id="country-code" aria-label="Klicna koda države">
-                                <option>SI</option>
-                                <option>MK</option>
-                                <option>US</option>
-                            </select>
-                            <input type="tel" id="phone-number" placeholder="+386 (00) 000-000">
-                        </div>
-                    </div>
-                    <div class="form-group">
-                        <label for="message">Sporočilo</label>
-                        <textarea id="message" rows="5"></textarea>
-                    </div>
-                    <div class="form-group checkbox-group">
-                        <input type="checkbox" id="privacy-policy">
-                        <label for="privacy-policy">Strinjate se z našo prijazno <a href="#">politiko zasebnosti</a>.</label>
-                    </div>
-                    <button type="submit" class="btn btn-primary">Pošlji sporočilo</button>
-                </form>
-            </div>
-        </section>
-
-        <section class="faq-section">
-            <div class="faq-header">
-                <h2>Pogosto zastavljena vprašanja</h2>
-                <p>Vse, kar morate vedeti o produktu in zaračunavanju.</p>
-            </div>
-            <div class="faq-grid">
-                <div class="faq-item">
-                    <div class="faq-icon-container"><i class="fas fa-heart"></i></div>
-                    <h3>Ali je na voljo brezplačen preizkus?</h3>
-                    <p>Da, lahko nas brezplačno preizkušate 30 dni. Naša prijazna ekipa bo sodelovala z vami, da boste čim prej začeli.</p>
-                </div>
-                <div class="faq-item">
-                     <div class="faq-icon-container"><i class="fas fa-sync-alt"></i></div>
-                    <h3>Ali lahko kasneje zamenjam svoj načrt?</h3>
-                    <p>Seveda. Naše cene se prilagajajo vašemu podjetju. Poklepetajte z našo prijazno ekipo in poiščite rešitev, ki vam ustreza.</p>
-                </div>
-                <div class="faq-item">
-                     <div class="faq-icon-container"><i class="fas fa-ban"></i></div>
-                    <h3>Kakšna je vaša politika odpovedi?</h3>
-                    <p>Razumemo, da se stvari spreminjajo. Svoj načrt lahko kadar koli prekličete in povrnili vam bomo že plačano razliko.</p>
-                </div>
-                <div class="faq-item">
-                     <div class="faq-icon-container"><i class="fas fa-plus-circle"></i></div>
-                    <h3>Ali se lahko na račun dodajo druge informacije?</h3>
-                    <p>Da, lahko nas brezplačno preizkušate 30 dni. Naša prijazna ekipa bo sodelovala z vami, da boste čim prej začeli.</p>
-                </div>
-                <div class="faq-item">
-                     <div class="faq-icon-container"><i class="fas fa-credit-card"></i></div>
-                    <h3>Kako poteka zaračunavanje?</h3>
-                    <p>Seveda. Naše cene se prilagajajo vašemu podjetju. Poklepetajte z našo prijazno ekipo in poiščite rešitev, ki vam ustreza.</p>
-                </div>
-                 <div class="faq-item">
-                     <div class="faq-icon-container"><i class="fas fa-envelope"></i></div>
-                    <h3>Kako spremenim e-pošto svojega računa?</h3>
-                    <p>Razumemo, da se stvari spreminjajo. Svoj načrt lahko kadar koli prekličete in povrnili vam bomo razliko.</p>
-                </div>
-            </div>
-            <div class="faq-footer">
-                <div class="avatar-group">
-                     <img src="../images/11-boy.webp" alt="Avatar 1" class="avatar">
-                     <img src="../images/10-girl1.webp" alt="Avatar 2" class="avatar large">
-                     <img src="../images/12-girl2.webp" alt="Avatar 3" class="avatar">
-                </div>
-                <h3>Imate še vprašanja?</h3>
-                <p>Ne najdete odgovora, ki ga iščete? Prosimo, poklepetajte z našo prijazno ekipo.</p>
-                <button class="btn btn-primary-orange">Poglej vsa vprašanja</button>
-            </div>
-        </section>
-
-    </main>
-
-    <!-- START_FOOTER -->
-<footer>
-    <div class="footer-container">
-        <div class="footer-main">
-            <div class="footer-info">
-                <div class="footer-logo">
-                    <img src="../images/13-whitelogo.png" alt="Logotip Makedonske študentske organizacije v Sloveniji">
-                </div>
-                <p>
-                    Masarykova cesta 24<br>
-                    1000 Ljubljana, Slovenija<br>
-                    +389 02 123 4567<br>
-                    info.msosorg@gmail.com
-                </p>
-                <div class="social-icons">
-                    <a href="#" aria-label="Facebook"><i class="fab fa-facebook-f"></i></a>
-                    <a href="#" aria-label="Instagram"><i class="fab fa-instagram"></i></a>
-                    <a href="#" aria-label="YouTube"><i class="fab fa-youtube"></i></a>
-                </div>
-            </div>
-            <div class="footer-links">
-                <div class="links-column">
-                    <h4>Za študente</h4>
-                    <a href="#">Blog</a>
-                    <a href="#">Galerija</a>
-                    <a href="#">Pogosta vprašanja</a>
-                    <a href="#">Brošura</a>
-                </div>
-                <div class="links-column">
-                    <h4>Projekti</h4>
-                    <a href="#">Prihajajoči</a>
-                    <a href="#">Pretekli</a>
-                </div>
-                <div class="links-column">
-                    <h4>Organizacija</h4>
-                    <a href="#">O nas</a>
-                    <a href="#">Kontakt</a>
-                    <a href="#">Dokumentacija</a>
-                </div>
-            </div>
-        </div>
-        <hr>
-        <div class="footer-bottom">
-             <p>© MŠOS org 2023 Vse pravice pridržane.</p>
-            <div class="legal-links">
-                <a href="#">Politika zasebnosti</a>
-                <a href="#">Politika piškotkov</a>
-                <a href="#">Pravni pogoji</a>
-            </div>
-        </div>
-    </div>
-    <script src="../main.js"></script>
-</footer>
-<!-- END_FOOTER -->
-
-    <script src="../main.js"></script>
-</body>
-</html>"""
-
-
 "./si/projects/index.html" : 
 """
 <!DOCTYPE html>
@@ -15084,69 +15973,156 @@ if __name__ == "__main__":
     <!-- START_HEADER -->
 <header class="dropdown-header-navigation">
     <div class="container">
-        <div class="header-content">
-            <a href="../../si/" class="logo-link">
-                <img src="../../images/1-logo.png" alt="Logotip Makedonske študentske organizacije v Sloveniji" class="logo-img">
-            </a>
-            <!-- Navigacija za namizje -->
-            <nav class="navigation desktop-nav">
-                <a href="#">O nas</a>
-                <a href="#">Za študente</a>
-                <a href="../../si/projects/">Projekti</a>
-            </nav>
-        </div>
-
-        <!-- Gumbi za namizje -->
-        <div class="navigation-actions">
-            <button class="btn btn-secondary">Postanite partner</button>
-            <button class="btn btn-primary">Donirajte</button>
-            <!-- Zamenjan preklopnik jezika -->
-            <div class="language-selector">
-                <div class="current-lang">
-                    <i class="fas fa-globe"></i>
-                    <span id="current-lang-code">SI</span>
-                    <i class="fas fa-chevron-down"></i>
-                </div>
-                <div class="lang-dropdown">
-                    <a href="#" data-lang="si">Slovenščina (SI)</a>
-                    <a href="#" data-lang="en">English (EN)</a>
-                    <a href="#" data-lang="mk">Македонски (MK)</a>
-                </div>
-            </div>
-        </div>
-
-        <!-- Panel za mobilno navigacijo -->
-        <div class="mobile-nav-panel">
-            <nav class="navigation mobile-nav">
-                <a href="#">O nas</a>
-                <a href="#">Za študente</a>
-                <a href="../../si/projects/">Projekti</a>
+        <!-- Logotip je zdaj samostojen element na levi strani -->
+        <a href="../../si/" class="logo-link">
+            <img src="../../images/1-logo.png" alt="Logotip Makedonske študentske organizacije v Sloveniji" class="logo-img">
+        </a>
+        
+        <!-- Nov ovoj za vse elemente na desni strani -->
+        <div class="header-right-wrapper">
+            <nav>
+                <ul class="navigation desktop-nav">
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">O nas</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Časovnica in dosežki</a></li>
+                            <li><a href="#">Naša ekipa, poslanstvo, vizija in vrednote</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">Kaj delamo</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="../../si/projects/">Dogodki in projekti</a></li>
+                            <li><a href="#">Blog</a></li>
+                            <li><a href="#">Galerija</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">Vključi se</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Postani član</a></li>
+                            <li><a href="#">Podpri MŠOS</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">Za študente</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Vodič za bruce</a></li>
+                            <li><a href="#">Mentorski program</a></li>
+                            <li><a href="#">Pogosta vprašanja</a></li>
+                            <li><a href="#">Spoznaj Slovenijo</a></li>
+                            <li><a href="#">Spoznaj Severno Makedonijo</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">Novice</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Obvestila</a></li>
+                            <li><a href="#">Odprti pozivi</a></li>
+                            <li><a href="#">Sporočila za javnost</a></li>
+                        </ul>
+                    </li>
+                </ul>
             </nav>
             <div class="navigation-actions">
-                <button class="btn btn-secondary">Postanite partner</button>
-                <button class="btn btn-primary">Donirajte</button>
-                 <!-- Zamenjan preklopnik jezika (tudi za mobilni meni) -->
+                <button class="btn btn-secondary">Postani član</button>
+                <button class="btn btn-primary">Doniraj</button>
                 <div class="language-selector">
                     <div class="current-lang">
                         <i class="fas fa-globe"></i>
-                        <span id="current-lang-code-mobile">SI</span>
+                        <span id="current-lang-code">SI</span>
                         <i class="fas fa-chevron-down"></i>
                     </div>
                     <div class="lang-dropdown">
                         <a href="#" data-lang="si">Slovenščina (SI)</a>
                         <a href="#" data-lang="en">English (EN)</a>
-                        <a href="#" data-lang="mk">Македонски (MK)</a>
+                        <a href="#" data-lang="mk">Македонски (МК)</a>
                     </div>
                 </div>
             </div>
-
-             <!-- Ikona za mobilni meni (Hamburger/X) -->
-            <div class="mobile-menu-icon">
-                <i class="fas fa-bars"></i>
-                <i class="fas fa-times"></i>
-            </div>
         </div>
+
+        <!-- Ikona za mobilni meni ostaja ločena za lažje upravljanje -->
+        <div class="mobile-menu-icon">
+            <i class="fas fa-bars"></i>
+            <i class="fas fa-times"></i>
+        </div>
+    </div>
 </header>
+
+<!-- Panel za mobilno navigacijo -->
+<div class="mobile-nav-panel">
+    <nav>
+        <ul class="navigation mobile-nav">
+            <li class="menu-item menu-item-has-children">
+                <a href="#">O nas</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Časovnica in dosežki</a></li>
+                    <li><a href="#">Naša ekipa, poslanstvo, vizija in vrednote</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">Kaj delamo</a>
+                <ul class="dropdown-menu">
+                    <li><a href="../../si/projects/">Dogodki in projekti</a></li>
+                    <li><a href="#">Blog</a></li>
+                    <li><a href="#">Galerija</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">Vključi se</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Postani član</a></li>
+                    <li><a href="#">Podpri MŠOS</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">Za študente</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Vodič za bruce</a></li>
+                    <li><a href="#">Mentorski program</a></li>
+                    <li><a href="#">Pogosta vprašanja</a></li>
+                    <li><a href="#">Spoznaj Slovenijo</a></li>
+                    <li><a href="#">Spoznaj Severno Makedonijo</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">Novice</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Obvestila</a></li>
+                    <li><a href="#">Odprti pozivi</a></li>
+                    <li><a href="#">Sporočila za javnost</a></li>
+                </ul>
+            </li>
+        </ul>
+    </nav>
+    <div class="navigation-actions">
+        <button class="btn btn-secondary">Postani član</button>
+        <button class="btn btn-primary">Doniraj</button>
+        <div class="language-selector">
+            <button class="current-lang" id="mobile-lang-trigger">
+                <i class="fas fa-globe"></i>
+                <span>SI</span>
+                <i class="fas fa-chevron-right"></i>
+            </button>
+        </div>
+    </div>
+</div>
+
+<!-- Modalno okno za izbiro jezika (za mobilni) -->
+<div id="language-modal-overlay">
+    <div class="language-modal-content">
+        <div class="language-modal-header">
+            <h3>Izberi jezik</h3>
+            <button id="language-modal-close" aria-label="Zapri izbiro jezika">&times;</button>
+        </div>
+        <div class="language-modal-body">
+            <a href="#" data-lang="si" class="active-lang">Slovenščina (SI)</a>
+            <a href="#" data-lang="en">English (EN)</a>
+            <a href="#" data-lang="mk">Македонски (МК)</a>
+        </div>
+    </div>
+</div>
 <!-- END_HEADER -->
 
     <main class="page-content">
@@ -15563,7 +16539,7 @@ if __name__ == "__main__":
             </div>
         </div>
     </div>
-    
+    <script src="../../main.js"></script>
 </footer>
 <!-- END_FOOTER -->
 
@@ -15598,69 +16574,156 @@ if __name__ == "__main__":
     <!-- START_HEADER -->
 <header class="dropdown-header-navigation">
     <div class="container">
-        <div class="header-content">
-            <a href="../../../si/" class="logo-link">
-                <img src="../../../images/1-logo.png" alt="Logotip Makedonske študentske organizacije v Sloveniji" class="logo-img">
-            </a>
-            <!-- Navigacija za namizje -->
-            <nav class="navigation desktop-nav">
-                <a href="#">O nas</a>
-                <a href="#">Za študente</a>
-                <a href="../../../si/projects/">Projekti</a>
-            </nav>
-        </div>
-
-        <!-- Gumbi za namizje -->
-        <div class="navigation-actions">
-            <button class="btn btn-secondary">Postanite partner</button>
-            <button class="btn btn-primary">Donirajte</button>
-            <!-- Zamenjan preklopnik jezika -->
-            <div class="language-selector">
-                <div class="current-lang">
-                    <i class="fas fa-globe"></i>
-                    <span id="current-lang-code">SI</span>
-                    <i class="fas fa-chevron-down"></i>
-                </div>
-                <div class="lang-dropdown">
-                    <a href="#" data-lang="si">Slovenščina (SI)</a>
-                    <a href="#" data-lang="en">English (EN)</a>
-                    <a href="#" data-lang="mk">Македонски (MK)</a>
-                </div>
-            </div>
-        </div>
-
-        <!-- Panel za mobilno navigacijo -->
-        <div class="mobile-nav-panel">
-            <nav class="navigation mobile-nav">
-                <a href="#">O nas</a>
-                <a href="#">Za študente</a>
-                <a href="../../../si/projects/">Projekti</a>
+        <!-- Logotip je zdaj samostojen element na levi strani -->
+        <a href="../../../si/" class="logo-link">
+            <img src="../../../images/1-logo.png" alt="Logotip Makedonske študentske organizacije v Sloveniji" class="logo-img">
+        </a>
+        
+        <!-- Nov ovoj za vse elemente na desni strani -->
+        <div class="header-right-wrapper">
+            <nav>
+                <ul class="navigation desktop-nav">
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">O nas</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Časovnica in dosežki</a></li>
+                            <li><a href="#">Naša ekipa, poslanstvo, vizija in vrednote</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">Kaj delamo</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="../../../si/projects/">Dogodki in projekti</a></li>
+                            <li><a href="#">Blog</a></li>
+                            <li><a href="#">Galerija</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">Vključi se</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Postani član</a></li>
+                            <li><a href="#">Podpri MŠOS</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">Za študente</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Vodič za bruce</a></li>
+                            <li><a href="#">Mentorski program</a></li>
+                            <li><a href="#">Pogosta vprašanja</a></li>
+                            <li><a href="#">Spoznaj Slovenijo</a></li>
+                            <li><a href="#">Spoznaj Severno Makedonijo</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">Novice</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Obvestila</a></li>
+                            <li><a href="#">Odprti pozivi</a></li>
+                            <li><a href="#">Sporočila za javnost</a></li>
+                        </ul>
+                    </li>
+                </ul>
             </nav>
             <div class="navigation-actions">
-                <button class="btn btn-secondary">Postanite partner</button>
-                <button class="btn btn-primary">Donirajte</button>
-                 <!-- Zamenjan preklopnik jezika (tudi za mobilni meni) -->
+                <button class="btn btn-secondary">Postani član</button>
+                <button class="btn btn-primary">Doniraj</button>
                 <div class="language-selector">
                     <div class="current-lang">
                         <i class="fas fa-globe"></i>
-                        <span id="current-lang-code-mobile">SI</span>
+                        <span id="current-lang-code">SI</span>
                         <i class="fas fa-chevron-down"></i>
                     </div>
                     <div class="lang-dropdown">
                         <a href="#" data-lang="si">Slovenščina (SI)</a>
                         <a href="#" data-lang="en">English (EN)</a>
-                        <a href="#" data-lang="mk">Македонски (MK)</a>
+                        <a href="#" data-lang="mk">Македонски (МК)</a>
                     </div>
                 </div>
             </div>
-
-             <!-- Ikona za mobilni meni (Hamburger/X) -->
-            <div class="mobile-menu-icon">
-                <i class="fas fa-bars"></i>
-                <i class="fas fa-times"></i>
-            </div>
         </div>
+
+        <!-- Ikona za mobilni meni ostaja ločena za lažje upravljanje -->
+        <div class="mobile-menu-icon">
+            <i class="fas fa-bars"></i>
+            <i class="fas fa-times"></i>
+        </div>
+    </div>
 </header>
+
+<!-- Panel za mobilno navigacijo -->
+<div class="mobile-nav-panel">
+    <nav>
+        <ul class="navigation mobile-nav">
+            <li class="menu-item menu-item-has-children">
+                <a href="#">O nas</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Časovnica in dosežki</a></li>
+                    <li><a href="#">Naša ekipa, poslanstvo, vizija in vrednote</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">Kaj delamo</a>
+                <ul class="dropdown-menu">
+                    <li><a href="../../../si/projects/">Dogodki in projekti</a></li>
+                    <li><a href="#">Blog</a></li>
+                    <li><a href="#">Galerija</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">Vključi se</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Postani član</a></li>
+                    <li><a href="#">Podpri MŠOS</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">Za študente</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Vodič za bruce</a></li>
+                    <li><a href="#">Mentorski program</a></li>
+                    <li><a href="#">Pogosta vprašanja</a></li>
+                    <li><a href="#">Spoznaj Slovenijo</a></li>
+                    <li><a href="#">Spoznaj Severno Makedonijo</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">Novice</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Obvestila</a></li>
+                    <li><a href="#">Odprti pozivi</a></li>
+                    <li><a href="#">Sporočila za javnost</a></li>
+                </ul>
+            </li>
+        </ul>
+    </nav>
+    <div class="navigation-actions">
+        <button class="btn btn-secondary">Postani član</button>
+        <button class="btn btn-primary">Doniraj</button>
+        <div class="language-selector">
+            <button class="current-lang" id="mobile-lang-trigger">
+                <i class="fas fa-globe"></i>
+                <span>SI</span>
+                <i class="fas fa-chevron-right"></i>
+            </button>
+        </div>
+    </div>
+</div>
+
+<!-- Modalno okno za izbiro jezika (za mobilni) -->
+<div id="language-modal-overlay">
+    <div class="language-modal-content">
+        <div class="language-modal-header">
+            <h3>Izberi jezik</h3>
+            <button id="language-modal-close" aria-label="Zapri izbiro jezika">&times;</button>
+        </div>
+        <div class="language-modal-body">
+            <a href="#" data-lang="si" class="active-lang">Slovenščina (SI)</a>
+            <a href="#" data-lang="en">English (EN)</a>
+            <a href="#" data-lang="mk">Македонски (МК)</a>
+        </div>
+    </div>
+</div>
 <!-- END_HEADER -->
 
     <main class="article-page">
@@ -15909,7 +16972,7 @@ if __name__ == "__main__":
                 <p>Vse se je začelo s preprosto željo – da se zberemo, spoznamo in začutimo Makedonijo, čeprav smo daleč od nje. Kristijan Popovski, takrat študent Ekonomske fakultete v Ljubljani, je svojo idejo delil z nekaj kolegi, odziv pa je bil neverjeten. V manj kot dveh tednih se je v organizacijsko ekipo vključilo več kot 40 študentov. Vsak je prispeval svoj entuziazem in čas, skupni duh in želja po povezovanju pa sta to spontano pobudo spremenila v dogodek, ki si ga bomo dolgo zapomnili.</p>
                 
                 <figure class="article-inline-image">
-                    <img src="../../../images/msnl-2.png" alt="Priprave in sestanki za Makedonsko študentsko noč">
+                    <img src="../../../images/msnl-2.webp" alt="Priprave in sestanki za Makedonsko študentsko noč">
                     <figcaption>Fotografije s priprav in sestankov za organizacijo Makedonske študentske noči.</figcaption>
                 </figure>
                 
@@ -16052,69 +17115,156 @@ if __name__ == "__main__":
     <!-- START_HEADER -->
 <header class="dropdown-header-navigation">
     <div class="container">
-        <div class="header-content">
-            <a href="../../../si/" class="logo-link">
-                <img src="../../../images/1-logo.png" alt="Logotip Makedonske študentske organizacije v Sloveniji" class="logo-img">
-            </a>
-            <!-- Navigacija za namizje -->
-            <nav class="navigation desktop-nav">
-                <a href="#">O nas</a>
-                <a href="#">Za študente</a>
-                <a href="../../../si/projects/">Projekti</a>
-            </nav>
-        </div>
-
-        <!-- Gumbi za namizje -->
-        <div class="navigation-actions">
-            <button class="btn btn-secondary">Postanite partner</button>
-            <button class="btn btn-primary">Donirajte</button>
-            <!-- Zamenjan preklopnik jezika -->
-            <div class="language-selector">
-                <div class="current-lang">
-                    <i class="fas fa-globe"></i>
-                    <span id="current-lang-code">SI</span>
-                    <i class="fas fa-chevron-down"></i>
-                </div>
-                <div class="lang-dropdown">
-                    <a href="#" data-lang="si">Slovenščina (SI)</a>
-                    <a href="#" data-lang="en">English (EN)</a>
-                    <a href="#" data-lang="mk">Македонски (MK)</a>
-                </div>
-            </div>
-        </div>
-
-        <!-- Panel za mobilno navigacijo -->
-        <div class="mobile-nav-panel">
-            <nav class="navigation mobile-nav">
-                <a href="#">O nas</a>
-                <a href="#">Za študente</a>
-                <a href="../../../si/projects/">Projekti</a>
+        <!-- Logotip je zdaj samostojen element na levi strani -->
+        <a href="../../../si/" class="logo-link">
+            <img src="../../../images/1-logo.png" alt="Logotip Makedonske študentske organizacije v Sloveniji" class="logo-img">
+        </a>
+        
+        <!-- Nov ovoj za vse elemente na desni strani -->
+        <div class="header-right-wrapper">
+            <nav>
+                <ul class="navigation desktop-nav">
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">O nas</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Časovnica in dosežki</a></li>
+                            <li><a href="#">Naša ekipa, poslanstvo, vizija in vrednote</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">Kaj delamo</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="../../../si/projects/">Dogodki in projekti</a></li>
+                            <li><a href="#">Blog</a></li>
+                            <li><a href="#">Galerija</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">Vključi se</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Postani član</a></li>
+                            <li><a href="#">Podpri MŠOS</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">Za študente</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Vodič za bruce</a></li>
+                            <li><a href="#">Mentorski program</a></li>
+                            <li><a href="#">Pogosta vprašanja</a></li>
+                            <li><a href="#">Spoznaj Slovenijo</a></li>
+                            <li><a href="#">Spoznaj Severno Makedonijo</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">Novice</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Obvestila</a></li>
+                            <li><a href="#">Odprti pozivi</a></li>
+                            <li><a href="#">Sporočila za javnost</a></li>
+                        </ul>
+                    </li>
+                </ul>
             </nav>
             <div class="navigation-actions">
-                <button class="btn btn-secondary">Postanite partner</button>
-                <button class="btn btn-primary">Donirajte</button>
-                 <!-- Zamenjan preklopnik jezika (tudi za mobilni meni) -->
+                <button class="btn btn-secondary">Postani član</button>
+                <button class="btn btn-primary">Doniraj</button>
                 <div class="language-selector">
                     <div class="current-lang">
                         <i class="fas fa-globe"></i>
-                        <span id="current-lang-code-mobile">SI</span>
+                        <span id="current-lang-code">SI</span>
                         <i class="fas fa-chevron-down"></i>
                     </div>
                     <div class="lang-dropdown">
                         <a href="#" data-lang="si">Slovenščina (SI)</a>
                         <a href="#" data-lang="en">English (EN)</a>
-                        <a href="#" data-lang="mk">Македонски (MK)</a>
+                        <a href="#" data-lang="mk">Македонски (МК)</a>
                     </div>
                 </div>
             </div>
-
-             <!-- Ikona za mobilni meni (Hamburger/X) -->
-            <div class="mobile-menu-icon">
-                <i class="fas fa-bars"></i>
-                <i class="fas fa-times"></i>
-            </div>
         </div>
+
+        <!-- Ikona za mobilni meni ostaja ločena za lažje upravljanje -->
+        <div class="mobile-menu-icon">
+            <i class="fas fa-bars"></i>
+            <i class="fas fa-times"></i>
+        </div>
+    </div>
 </header>
+
+<!-- Panel za mobilno navigacijo -->
+<div class="mobile-nav-panel">
+    <nav>
+        <ul class="navigation mobile-nav">
+            <li class="menu-item menu-item-has-children">
+                <a href="#">O nas</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Časovnica in dosežki</a></li>
+                    <li><a href="#">Naša ekipa, poslanstvo, vizija in vrednote</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">Kaj delamo</a>
+                <ul class="dropdown-menu">
+                    <li><a href="../../../si/projects/">Dogodki in projekti</a></li>
+                    <li><a href="#">Blog</a></li>
+                    <li><a href="#">Galerija</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">Vključi se</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Postani član</a></li>
+                    <li><a href="#">Podpri MŠOS</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">Za študente</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Vodič za bruce</a></li>
+                    <li><a href="#">Mentorski program</a></li>
+                    <li><a href="#">Pogosta vprašanja</a></li>
+                    <li><a href="#">Spoznaj Slovenijo</a></li>
+                    <li><a href="#">Spoznaj Severno Makedonijo</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">Novice</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Obvestila</a></li>
+                    <li><a href="#">Odprti pozivi</a></li>
+                    <li><a href="#">Sporočila za javnost</a></li>
+                </ul>
+            </li>
+        </ul>
+    </nav>
+    <div class="navigation-actions">
+        <button class="btn btn-secondary">Postani član</button>
+        <button class="btn btn-primary">Doniraj</button>
+        <div class="language-selector">
+            <button class="current-lang" id="mobile-lang-trigger">
+                <i class="fas fa-globe"></i>
+                <span>SI</span>
+                <i class="fas fa-chevron-right"></i>
+            </button>
+        </div>
+    </div>
+</div>
+
+<!-- Modalno okno za izbiro jezika (za mobilni) -->
+<div id="language-modal-overlay">
+    <div class="language-modal-content">
+        <div class="language-modal-header">
+            <h3>Izberi jezik</h3>
+            <button id="language-modal-close" aria-label="Zapri izbiro jezika">&times;</button>
+        </div>
+        <div class="language-modal-body">
+            <a href="#" data-lang="si" class="active-lang">Slovenščina (SI)</a>
+            <a href="#" data-lang="en">English (EN)</a>
+            <a href="#" data-lang="mk">Македонски (МК)</a>
+        </div>
+    </div>
+</div>
 <!-- END_HEADER -->
 
     <main class="article-page">
@@ -16474,7 +17624,7 @@ if __name__ == "__main__":
                 <p>Poseben trenutek dogodka je bil nagovor konzula Veleposlaništva Republike Slovenije v Severni Makedoniji, gospoda Martina Glazarja. Na kratko je predstavil najpomembnejše korake postopka za pridobitev začasnega dovoljenja za prebivanje – eno največjih skrbi in izzivov za vse tuje študente v Sloveniji. Na ta način so bodoči študenti dobili jasnejšo sliko o tem, kaj jih čaka in kako se lažje spopasti z administrativnimi postopki.</p>
                 
                 <figure class="article-inline-image">
-                    <img src="../../../images/event3-photo-9.png" alt="Konzul seznanja študente s postopkom pridobitve začasnega dovoljenja za prebivanje">
+                    <img src="../../../images/event3-photo-9.webp" alt="Konzul seznanja študente s postopkom pridobitve začasnega dovoljenja za prebivanje">
                     <figcaption>Fotografija konzula, ki na zanimiv način seznanja študente s postopkom pridobitve začasnega dovoljenja za prebivanje!</figcaption>
                 </figure>
 
@@ -16626,69 +17776,156 @@ if __name__ == "__main__":
     <!-- START_HEADER -->
 <header class="dropdown-header-navigation">
     <div class="container">
-        <div class="header-content">
-            <a href="../../../si/" class="logo-link">
-                <img src="../../../images/1-logo.png" alt="Logotip Makedonske študentske organizacije v Sloveniji" class="logo-img">
-            </a>
-            <!-- Navigacija za namizje -->
-            <nav class="navigation desktop-nav">
-                <a href="#">O nas</a>
-                <a href="#">Za študente</a>
-                <a href="../../../si/projects/">Projekti</a>
-            </nav>
-        </div>
-
-        <!-- Gumbi za namizje -->
-        <div class="navigation-actions">
-            <button class="btn btn-secondary">Postanite partner</button>
-            <button class="btn btn-primary">Donirajte</button>
-            <!-- Zamenjan preklopnik jezika -->
-            <div class="language-selector">
-                <div class="current-lang">
-                    <i class="fas fa-globe"></i>
-                    <span id="current-lang-code">SI</span>
-                    <i class="fas fa-chevron-down"></i>
-                </div>
-                <div class="lang-dropdown">
-                    <a href="#" data-lang="si">Slovenščina (SI)</a>
-                    <a href="#" data-lang="en">English (EN)</a>
-                    <a href="#" data-lang="mk">Македонски (MK)</a>
-                </div>
-            </div>
-        </div>
-
-        <!-- Panel za mobilno navigacijo -->
-        <div class="mobile-nav-panel">
-            <nav class="navigation mobile-nav">
-                <a href="#">O nas</a>
-                <a href="#">Za študente</a>
-                <a href="../../../si/projects/">Projekti</a>
+        <!-- Logotip je zdaj samostojen element na levi strani -->
+        <a href="../../../si/" class="logo-link">
+            <img src="../../../images/1-logo.png" alt="Logotip Makedonske študentske organizacije v Sloveniji" class="logo-img">
+        </a>
+        
+        <!-- Nov ovoj za vse elemente na desni strani -->
+        <div class="header-right-wrapper">
+            <nav>
+                <ul class="navigation desktop-nav">
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">O nas</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Časovnica in dosežki</a></li>
+                            <li><a href="#">Naša ekipa, poslanstvo, vizija in vrednote</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">Kaj delamo</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="../../../si/projects/">Dogodki in projekti</a></li>
+                            <li><a href="#">Blog</a></li>
+                            <li><a href="#">Galerija</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">Vključi se</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Postani član</a></li>
+                            <li><a href="#">Podpri MŠOS</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">Za študente</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Vodič za bruce</a></li>
+                            <li><a href="#">Mentorski program</a></li>
+                            <li><a href="#">Pogosta vprašanja</a></li>
+                            <li><a href="#">Spoznaj Slovenijo</a></li>
+                            <li><a href="#">Spoznaj Severno Makedonijo</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">Novice</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Obvestila</a></li>
+                            <li><a href="#">Odprti pozivi</a></li>
+                            <li><a href="#">Sporočila za javnost</a></li>
+                        </ul>
+                    </li>
+                </ul>
             </nav>
             <div class="navigation-actions">
-                <button class="btn btn-secondary">Postanite partner</button>
-                <button class="btn btn-primary">Donirajte</button>
-                 <!-- Zamenjan preklopnik jezika (tudi za mobilni meni) -->
+                <button class="btn btn-secondary">Postani član</button>
+                <button class="btn btn-primary">Doniraj</button>
                 <div class="language-selector">
                     <div class="current-lang">
                         <i class="fas fa-globe"></i>
-                        <span id="current-lang-code-mobile">SI</span>
+                        <span id="current-lang-code">SI</span>
                         <i class="fas fa-chevron-down"></i>
                     </div>
                     <div class="lang-dropdown">
                         <a href="#" data-lang="si">Slovenščina (SI)</a>
                         <a href="#" data-lang="en">English (EN)</a>
-                        <a href="#" data-lang="mk">Македонски (MK)</a>
+                        <a href="#" data-lang="mk">Македонски (МК)</a>
                     </div>
                 </div>
             </div>
-
-             <!-- Ikona za mobilni meni (Hamburger/X) -->
-            <div class="mobile-menu-icon">
-                <i class="fas fa-bars"></i>
-                <i class="fas fa-times"></i>
-            </div>
         </div>
+
+        <!-- Ikona za mobilni meni ostaja ločena za lažje upravljanje -->
+        <div class="mobile-menu-icon">
+            <i class="fas fa-bars"></i>
+            <i class="fas fa-times"></i>
+        </div>
+    </div>
 </header>
+
+<!-- Panel za mobilno navigacijo -->
+<div class="mobile-nav-panel">
+    <nav>
+        <ul class="navigation mobile-nav">
+            <li class="menu-item menu-item-has-children">
+                <a href="#">O nas</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Časovnica in dosežki</a></li>
+                    <li><a href="#">Naša ekipa, poslanstvo, vizija in vrednote</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">Kaj delamo</a>
+                <ul class="dropdown-menu">
+                    <li><a href="../../../si/projects/">Dogodki in projekti</a></li>
+                    <li><a href="#">Blog</a></li>
+                    <li><a href="#">Galerija</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">Vključi se</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Postani član</a></li>
+                    <li><a href="#">Podpri MŠOS</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">Za študente</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Vodič za bruce</a></li>
+                    <li><a href="#">Mentorski program</a></li>
+                    <li><a href="#">Pogosta vprašanja</a></li>
+                    <li><a href="#">Spoznaj Slovenijo</a></li>
+                    <li><a href="#">Spoznaj Severno Makedonijo</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">Novice</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Obvestila</a></li>
+                    <li><a href="#">Odprti pozivi</a></li>
+                    <li><a href="#">Sporočila za javnost</a></li>
+                </ul>
+            </li>
+        </ul>
+    </nav>
+    <div class="navigation-actions">
+        <button class="btn btn-secondary">Postani član</button>
+        <button class="btn btn-primary">Doniraj</button>
+        <div class="language-selector">
+            <button class="current-lang" id="mobile-lang-trigger">
+                <i class="fas fa-globe"></i>
+                <span>SI</span>
+                <i class="fas fa-chevron-right"></i>
+            </button>
+        </div>
+    </div>
+</div>
+
+<!-- Modalno okno za izbiro jezika (za mobilni) -->
+<div id="language-modal-overlay">
+    <div class="language-modal-content">
+        <div class="language-modal-header">
+            <h3>Izberi jezik</h3>
+            <button id="language-modal-close" aria-label="Zapri izbiro jezika">&times;</button>
+        </div>
+        <div class="language-modal-body">
+            <a href="#" data-lang="si" class="active-lang">Slovenščina (SI)</a>
+            <a href="#" data-lang="en">English (EN)</a>
+            <a href="#" data-lang="mk">Македонски (МК)</a>
+        </div>
+    </div>
+</div>
 <!-- END_HEADER -->
 
     <main class="article-page">
@@ -16999,7 +18236,7 @@ if __name__ == "__main__":
                 <p>Tokratne spomine na večer dolgujemo Hristini Trakovski, ki je bila fotografinja in je poskrbela, da so vsi ti trenutki ostali zabeleženi in jih lahko ponovno podoživimo skozi fotografije.</p>
                 
                 <figure class="article-inline-image">
-                    <img src="../../../images/event4-img-10.png" alt="Pozdravni govor N.E. veleposlanika gospoda Gregorja Preskerja.">
+                    <img src="../../../images/event4-img-10.webp" alt="Pozdravni govor N.E. veleposlanika gospoda Gregorja Preskerja.">
                     <figcaption>Fotografija pozdravnega govora N.E. veleposlanika gospoda Gregorja Preskerja.</figcaption>
                 </figure>
 
@@ -17110,69 +18347,156 @@ if __name__ == "__main__":
     <!-- START_HEADER -->
 <header class="dropdown-header-navigation">
     <div class="container">
-        <div class="header-content">
-            <a href="../../../si/" class="logo-link">
-                <img src="../../../images/1-logo.png" alt="Logotip Makedonske študentske organizacije v Sloveniji" class="logo-img">
-            </a>
-            <!-- Navigacija za namizje -->
-            <nav class="navigation desktop-nav">
-                <a href="#">O nas</a>
-                <a href="#">Za študente</a>
-                <a href="../../../si/projects/">Projekti</a>
-            </nav>
-        </div>
-
-        <!-- Gumbi za namizje -->
-        <div class="navigation-actions">
-            <button class="btn btn-secondary">Postanite partner</button>
-            <button class="btn btn-primary">Donirajte</button>
-            <!-- Zamenjan preklopnik jezika -->
-            <div class="language-selector">
-                <div class="current-lang">
-                    <i class="fas fa-globe"></i>
-                    <span id="current-lang-code">SI</span>
-                    <i class="fas fa-chevron-down"></i>
-                </div>
-                <div class="lang-dropdown">
-                    <a href="#" data-lang="si">Slovenščina (SI)</a>
-                    <a href="#" data-lang="en">English (EN)</a>
-                    <a href="#" data-lang="mk">Македонски (MK)</a>
-                </div>
-            </div>
-        </div>
-
-        <!-- Panel za mobilno navigacijo -->
-        <div class="mobile-nav-panel">
-            <nav class="navigation mobile-nav">
-                <a href="#">O nas</a>
-                <a href="#">Za študente</a>
-                <a href="../../../si/projects/">Projekti</a>
+        <!-- Logotip je zdaj samostojen element na levi strani -->
+        <a href="../../../si/" class="logo-link">
+            <img src="../../../images/1-logo.png" alt="Logotip Makedonske študentske organizacije v Sloveniji" class="logo-img">
+        </a>
+        
+        <!-- Nov ovoj za vse elemente na desni strani -->
+        <div class="header-right-wrapper">
+            <nav>
+                <ul class="navigation desktop-nav">
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">O nas</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Časovnica in dosežki</a></li>
+                            <li><a href="#">Naša ekipa, poslanstvo, vizija in vrednote</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">Kaj delamo</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="../../../si/projects/">Dogodki in projekti</a></li>
+                            <li><a href="#">Blog</a></li>
+                            <li><a href="#">Galerija</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">Vključi se</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Postani član</a></li>
+                            <li><a href="#">Podpri MŠOS</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">Za študente</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Vodič za bruce</a></li>
+                            <li><a href="#">Mentorski program</a></li>
+                            <li><a href="#">Pogosta vprašanja</a></li>
+                            <li><a href="#">Spoznaj Slovenijo</a></li>
+                            <li><a href="#">Spoznaj Severno Makedonijo</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">Novice</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Obvestila</a></li>
+                            <li><a href="#">Odprti pozivi</a></li>
+                            <li><a href="#">Sporočila za javnost</a></li>
+                        </ul>
+                    </li>
+                </ul>
             </nav>
             <div class="navigation-actions">
-                <button class="btn btn-secondary">Postanite partner</button>
-                <button class="btn btn-primary">Donirajte</button>
-                 <!-- Zamenjan preklopnik jezika (tudi za mobilni meni) -->
+                <button class="btn btn-secondary">Postani član</button>
+                <button class="btn btn-primary">Doniraj</button>
                 <div class="language-selector">
                     <div class="current-lang">
                         <i class="fas fa-globe"></i>
-                        <span id="current-lang-code-mobile">SI</span>
+                        <span id="current-lang-code">SI</span>
                         <i class="fas fa-chevron-down"></i>
                     </div>
                     <div class="lang-dropdown">
                         <a href="#" data-lang="si">Slovenščina (SI)</a>
                         <a href="#" data-lang="en">English (EN)</a>
-                        <a href="#" data-lang="mk">Македонски (MK)</a>
+                        <a href="#" data-lang="mk">Македонски (МК)</a>
                     </div>
                 </div>
             </div>
-
-             <!-- Ikona za mobilni meni (Hamburger/X) -->
-            <div class="mobile-menu-icon">
-                <i class="fas fa-bars"></i>
-                <i class="fas fa-times"></i>
-            </div>
         </div>
+
+        <!-- Ikona za mobilni meni ostaja ločena za lažje upravljanje -->
+        <div class="mobile-menu-icon">
+            <i class="fas fa-bars"></i>
+            <i class="fas fa-times"></i>
+        </div>
+    </div>
 </header>
+
+<!-- Panel za mobilno navigacijo -->
+<div class="mobile-nav-panel">
+    <nav>
+        <ul class="navigation mobile-nav">
+            <li class="menu-item menu-item-has-children">
+                <a href="#">O nas</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Časovnica in dosežki</a></li>
+                    <li><a href="#">Naša ekipa, poslanstvo, vizija in vrednote</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">Kaj delamo</a>
+                <ul class="dropdown-menu">
+                    <li><a href="../../../si/projects/">Dogodki in projekti</a></li>
+                    <li><a href="#">Blog</a></li>
+                    <li><a href="#">Galerija</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">Vključi se</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Postani član</a></li>
+                    <li><a href="#">Podpri MŠOS</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">Za študente</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Vodič za bruce</a></li>
+                    <li><a href="#">Mentorski program</a></li>
+                    <li><a href="#">Pogosta vprašanja</a></li>
+                    <li><a href="#">Spoznaj Slovenijo</a></li>
+                    <li><a href="#">Spoznaj Severno Makedonijo</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">Novice</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Obvestila</a></li>
+                    <li><a href="#">Odprti pozivi</a></li>
+                    <li><a href="#">Sporočila za javnost</a></li>
+                </ul>
+            </li>
+        </ul>
+    </nav>
+    <div class="navigation-actions">
+        <button class="btn btn-secondary">Postani član</button>
+        <button class="btn btn-primary">Doniraj</button>
+        <div class="language-selector">
+            <button class="current-lang" id="mobile-lang-trigger">
+                <i class="fas fa-globe"></i>
+                <span>SI</span>
+                <i class="fas fa-chevron-right"></i>
+            </button>
+        </div>
+    </div>
+</div>
+
+<!-- Modalno okno za izbiro jezika (za mobilni) -->
+<div id="language-modal-overlay">
+    <div class="language-modal-content">
+        <div class="language-modal-header">
+            <h3>Izberi jezik</h3>
+            <button id="language-modal-close" aria-label="Zapri izbiro jezika">&times;</button>
+        </div>
+        <div class="language-modal-body">
+            <a href="#" data-lang="si" class="active-lang">Slovenščina (SI)</a>
+            <a href="#" data-lang="en">English (EN)</a>
+            <a href="#" data-lang="mk">Македонски (МК)</a>
+        </div>
+    </div>
+</div>
 <!-- END_HEADER -->
 
     <main class="article-page">
@@ -17446,7 +18770,7 @@ if __name__ == "__main__":
                 <p>Se vidimo ponovno prihodnje leto – še bolj sproščeni in z še več kave!</p>
                 
                 <figure class="article-inline-image">
-                    <img src="../../../images/event4-image7.png" alt="Kolaž fotografij, ki prikazuje študente, skodelice za kavo in burek.">
+                    <img src="../../../images/event4-image7.webp" alt="Kolaž fotografij, ki prikazuje študente, skodelice za kavo in burek.">
                     <figcaption>Dobra družba, veliko spominov in skupaj premagan izpitni stres.</figcaption>
                 </figure>
             </div>
@@ -19928,11 +21252,13 @@ footer hr {
 <!-- START_HEADER -->
 <header class="dropdown-header-navigation">
     <div class="container">
-        <div class="header-content">
-            <a href="{{ROOT_PREFIX}}en/" class="logo-link">
-                <img src="{{ROOT_PREFIX}}images/1-logo.png" alt="Macedonian Student Organisation in Slovenia Logo" class="logo-img">
-            </a>
-            <!-- Desktop Navigation -->
+        <!-- Logotip je zdaj samostojen element na levi strani -->
+        <a href="{{ROOT_PREFIX}}en/" class="logo-link">
+            <img src="{{ROOT_PREFIX}}images/1-logo.png" alt="Macedonian Student Organisation in Slovenia Logo" class="logo-img">
+        </a>
+        
+        <!-- Nov ovoj za vse elemente na desni strani -->
+        <div class="header-right-wrapper">
             <nav>
                 <ul class="navigation desktop-nav">
                     <li class="menu-item menu-item-has-children">
@@ -19977,28 +21303,25 @@ footer hr {
                     </li>
                 </ul>
             </nav>
-        </div>
-
-        <!-- Desktop Buttons -->
-        <div class="navigation-actions">
-            <button class="btn btn-secondary">Become a member</button>
-            <button class="btn btn-primary">Donate</button>
-            <!-- Language Switcher -->
-            <div class="language-selector">
-                <div class="current-lang">
-                    <i class="fas fa-globe"></i>
-                    <span id="current-lang-code">EN</span>
-                    <i class="fas fa-chevron-down"></i>
-                </div>
-                <div class="lang-dropdown">
-                    <a href="#" data-lang="si">Slovenščina (SI)</a>
-                    <a href="#" data-lang="en">English (EN)</a>
-                    <a href="#" data-lang="mk">Македонски (MK)</a>
+            <div class="navigation-actions">
+                <button class="btn btn-secondary">Become a member</button>
+                <button class="btn btn-primary">Donate</button>
+                <div class="language-selector">
+                    <div class="current-lang">
+                        <i class="fas fa-globe"></i>
+                        <span id="current-lang-code">EN</span>
+                        <i class="fas fa-chevron-down"></i>
+                    </div>
+                    <div class="lang-dropdown">
+                        <a href="#" data-lang="si">Slovenščina (SI)</a>
+                        <a href="#" data-lang="en">English (EN)</a>
+                        <a href="#" data-lang="mk">Македонски (MK)</a>
+                    </div>
                 </div>
             </div>
         </div>
 
-        <!-- Mobile Menu Icon (Hamburger/X) -->
+        <!-- Ikona za mobilni meni ostaja ločena za lažje upravljanje -->
         <div class="mobile-menu-icon">
             <i class="fas fa-bars"></i>
             <i class="fas fa-times"></i>
@@ -20006,7 +21329,7 @@ footer hr {
     </div>
 </header>
 
-<!-- Mobile Navigation Panel (ostane znotraj markerjev, a za <header>) -->
+<!-- Panel za mobilno navigacijo (struktura ostaja enaka) -->
 <div class="mobile-nav-panel">
     <nav>
         <ul class="navigation mobile-nav">
@@ -20055,18 +21378,27 @@ footer hr {
     <div class="navigation-actions">
         <button class="btn btn-secondary">Become a member</button>
         <button class="btn btn-primary">Donate</button>
-        <!-- Language Switcher (for mobile) -->
         <div class="language-selector">
-            <div class="current-lang">
+            <button class="current-lang" id="mobile-lang-trigger">
                 <i class="fas fa-globe"></i>
-                <span id="current-lang-code-mobile">EN</span>
-                <i class="fas fa-chevron-down"></i>
-            </div>
-            <div class="lang-dropdown">
-                <a href="#" data-lang="si">Slovenščina (SI)</a>
-                <a href="#" data-lang="en">English (EN)</a>
-                <a href="#" data-lang="mk">Македонски (MK)</a>
-            </div>
+                <span>EN</span>
+                <i class="fas fa-chevron-right"></i>
+            </button>
+        </div>
+    </div>
+</div>
+
+<!-- Modalno okno za izbiro jezika (ostaja enako) -->
+<div id="language-modal-overlay">
+    <div class="language-modal-content">
+        <div class="language-modal-header">
+            <h3>Select Language</h3>
+            <button id="language-modal-close" aria-label="Close language selection">&times;</button>
+        </div>
+        <div class="language-modal-body">
+            <a href="#" data-lang="si">Slovenščina (SI)</a>
+            <a href="#" data-lang="en" class="active-lang">English (EN)</a>
+            <a href="#" data-lang="mk">Македонски (MK)</a>
         </div>
     </div>
 </div>
@@ -20136,69 +21468,156 @@ footer hr {
 <!-- START_HEADER -->
 <header class="dropdown-header-navigation">
     <div class="container">
-        <div class="header-content">
-            <a href="{{ROOT_PREFIX}}mk/" class="logo-link">
-                <img src="{{ROOT_PREFIX}}images/1-logo.png" alt="Лого на Македонска студентска организација во Словенија" class="logo-img">
-            </a>
-            <!-- Навигација за десктоп -->
-            <nav class="navigation desktop-nav">
-                <a href="#">За нас</a>
-                <a href="#">За студенти</a>
-                <a href="{{ROOT_PREFIX}}mk/projects/">Проекти</a>
-            </nav>
-        </div>
-
-        <!-- Копчиња за десктоп -->
-        <div class="navigation-actions">
-            <button class="btn btn-secondary">Стани партнер</button>
-            <button class="btn btn-primary">Донирај</button>
-            <!-- Преклопник за јазик -->
-            <div class="language-selector">
-                <div class="current-lang">
-                    <i class="fas fa-globe"></i>
-                    <span id="current-lang-code">MK</span>
-                    <i class="fas fa-chevron-down"></i>
-                </div>
-                <div class="lang-dropdown">
-                    <a href="#" data-lang="si">Slovenščina (SI)</a>
-                    <a href="#" data-lang="en">English (EN)</a>
-                    <a href="#" data-lang="mk">Македонски (MK)</a>
-                </div>
-            </div>
-        </div>
-
-        <!-- Панел за мобилна навигација -->
-        <div class="mobile-nav-panel">
-            <nav class="navigation mobile-nav">
-                <a href="#">За нас</a>
-                <a href="#">За студенти</a>
-                <a href="{{ROOT_PREFIX}}mk/projects/">Проекти</a>
+        <!-- Logotip je zdaj samostojen element na levi strani -->
+        <a href="{{ROOT_PREFIX}}mk/" class="logo-link">
+            <img src="{{ROOT_PREFIX}}images/1-logo.png" alt="Лого на Македонска студентска организација во Словенија" class="logo-img">
+        </a>
+        
+        <!-- Nov ovoj za vse elemente na desni strani -->
+        <div class="header-right-wrapper">
+            <nav>
+                <ul class="navigation desktop-nav">
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">За нас</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Времеплов и достигнувања</a></li>
+                            <li><a href="#">Нашиот тим, мисија, визија и вредности</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">Што работиме</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="{{ROOT_PREFIX}}mk/projects/">Настани и проекти</a></li>
+                            <li><a href="#">Блог</a></li>
+                            <li><a href="#">Галерија</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">Вклучи се</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Стани член</a></li>
+                            <li><a href="#">Поддржи ја МСОС</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">За студенти</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Водич за добредојде</a></li>
+                            <li><a href="#">Менторска програма</a></li>
+                            <li><a href="#">Често поставувани прашања</a></li>
+                            <li><a href="#">Запознај ја Словенија</a></li>
+                            <li><a href="#">Запознај ја Северна Македонија</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">Новости</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Соопштенија</a></li>
+                            <li><a href="#">Отворени повици</a></li>
+                            <li><a href="#">Соопштенија за медиуми</a></li>
+                        </ul>
+                    </li>
+                </ul>
             </nav>
             <div class="navigation-actions">
-                <button class="btn btn-secondary">Стани партнер</button>
+                <button class="btn btn-secondary">Стани член</button>
                 <button class="btn btn-primary">Донирај</button>
-                <!-- Преклопник за јазик (за мобилен) -->
                 <div class="language-selector">
                     <div class="current-lang">
                         <i class="fas fa-globe"></i>
-                        <span id="current-lang-code-mobile">MK</span>
+                        <span id="current-lang-code">МК</span>
                         <i class="fas fa-chevron-down"></i>
                     </div>
                     <div class="lang-dropdown">
                         <a href="#" data-lang="si">Slovenščina (SI)</a>
                         <a href="#" data-lang="en">English (EN)</a>
-                        <a href="#" data-lang="mk">Македонски (MK)</a>
+                        <a href="#" data-lang="mk">Македонски (МК)</a>
                     </div>
                 </div>
             </div>
-
-             <!-- Икона за мобилно мени (Хамбургер/X) -->
-            <div class="mobile-menu-icon">
-                <i class="fas fa-bars"></i>
-                <i class="fas fa-times"></i>
-            </div>
         </div>
+
+        <!-- Ikona za mobilni meni ostaja ločena za lažje upravljanje -->
+        <div class="mobile-menu-icon">
+            <i class="fas fa-bars"></i>
+            <i class="fas fa-times"></i>
+        </div>
+    </div>
 </header>
+
+<!-- Panel za mobilno navigacijo -->
+<div class="mobile-nav-panel">
+    <nav>
+        <ul class="navigation mobile-nav">
+            <li class="menu-item menu-item-has-children">
+                <a href="#">За нас</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Времеплов и достигнувања</a></li>
+                    <li><a href="#">Нашиот тим, мисија, визија и вредности</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">Што работиме</a>
+                <ul class="dropdown-menu">
+                    <li><a href="{{ROOT_PREFIX}}mk/projects/">Настани и проекти</a></li>
+                    <li><a href="#">Блог</a></li>
+                    <li><a href="#">Галерија</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">Вклучи се</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Стани член</a></li>
+                    <li><a href="#">Поддржи ја МСОС</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">За студенти</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Водич за добредојде</a></li>
+                    <li><a href="#">Менторска програма</a></li>
+                    <li><a href="#">Често поставувани прашања</a></li>
+                    <li><a href="#">Запознај ја Словенија</a></li>
+                    <li><a href="#">Запознај ја Северна Македонија</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">Новости</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Соопштенија</a></li>
+                    <li><a href="#">Отворени повици</a></li>
+                    <li><a href="#">Соопштенија за медиуми</a></li>
+                </ul>
+            </li>
+        </ul>
+    </nav>
+    <div class="navigation-actions">
+        <button class="btn btn-secondary">Стани член</button>
+        <button class="btn btn-primary">Донирај</button>
+        <div class="language-selector">
+            <button class="current-lang" id="mobile-lang-trigger">
+                <i class="fas fa-globe"></i>
+                <span>МК</span>
+                <i class="fas fa-chevron-right"></i>
+            </button>
+        </div>
+    </div>
+</div>
+
+<!-- Modalno okno za izbiro na jazik (za mobilni) -->
+<div id="language-modal-overlay">
+    <div class="language-modal-content">
+        <div class="language-modal-header">
+            <h3>Избери јазик</h3>
+            <button id="language-modal-close" aria-label="Затвори избор на јазик">&times;</button>
+        </div>
+        <div class="language-modal-body">
+            <a href="#" data-lang="si">Slovenščina (SI)</a>
+            <a href="#" data-lang="en">English (EN)</a>
+            <a href="#" data-lang="mk" class="active-lang">Македонски (МК)</a>
+        </div>
+    </div>
+</div>
 <!-- END_HEADER -->"""
 
 
@@ -20265,69 +21684,156 @@ footer hr {
 <!-- START_HEADER -->
 <header class="dropdown-header-navigation">
     <div class="container">
-        <div class="header-content">
-            <a href="{{ROOT_PREFIX}}si/" class="logo-link">
-                <img src="{{ROOT_PREFIX}}images/1-logo.png" alt="Logotip Makedonske študentske organizacije v Sloveniji" class="logo-img">
-            </a>
-            <!-- Navigacija za namizje -->
-            <nav class="navigation desktop-nav">
-                <a href="#">O nas</a>
-                <a href="#">Za študente</a>
-                <a href="{{ROOT_PREFIX}}si/projects/">Projekti</a>
-            </nav>
-        </div>
-
-        <!-- Gumbi za namizje -->
-        <div class="navigation-actions">
-            <button class="btn btn-secondary">Postanite partner</button>
-            <button class="btn btn-primary">Donirajte</button>
-            <!-- Zamenjan preklopnik jezika -->
-            <div class="language-selector">
-                <div class="current-lang">
-                    <i class="fas fa-globe"></i>
-                    <span id="current-lang-code">SI</span>
-                    <i class="fas fa-chevron-down"></i>
-                </div>
-                <div class="lang-dropdown">
-                    <a href="#" data-lang="si">Slovenščina (SI)</a>
-                    <a href="#" data-lang="en">English (EN)</a>
-                    <a href="#" data-lang="mk">Македонски (MK)</a>
-                </div>
-            </div>
-        </div>
-
-        <!-- Panel za mobilno navigacijo -->
-        <div class="mobile-nav-panel">
-            <nav class="navigation mobile-nav">
-                <a href="#">O nas</a>
-                <a href="#">Za študente</a>
-                <a href="{{ROOT_PREFIX}}si/projects/">Projekti</a>
+        <!-- Logotip je zdaj samostojen element na levi strani -->
+        <a href="{{ROOT_PREFIX}}si/" class="logo-link">
+            <img src="{{ROOT_PREFIX}}images/1-logo.png" alt="Logotip Makedonske študentske organizacije v Sloveniji" class="logo-img">
+        </a>
+        
+        <!-- Nov ovoj za vse elemente na desni strani -->
+        <div class="header-right-wrapper">
+            <nav>
+                <ul class="navigation desktop-nav">
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">O nas</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Časovnica in dosežki</a></li>
+                            <li><a href="#">Naša ekipa, poslanstvo, vizija in vrednote</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">Kaj delamo</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="{{ROOT_PREFIX}}si/projects/">Dogodki in projekti</a></li>
+                            <li><a href="#">Blog</a></li>
+                            <li><a href="#">Galerija</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">Vključi se</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Postani član</a></li>
+                            <li><a href="#">Podpri MŠOS</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">Za študente</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Vodič za bruce</a></li>
+                            <li><a href="#">Mentorski program</a></li>
+                            <li><a href="#">Pogosta vprašanja</a></li>
+                            <li><a href="#">Spoznaj Slovenijo</a></li>
+                            <li><a href="#">Spoznaj Severno Makedonijo</a></li>
+                        </ul>
+                    </li>
+                    <li class="menu-item menu-item-has-children">
+                        <a href="#">Novice</a>
+                        <ul class="dropdown-menu">
+                            <li><a href="#">Obvestila</a></li>
+                            <li><a href="#">Odprti pozivi</a></li>
+                            <li><a href="#">Sporočila za javnost</a></li>
+                        </ul>
+                    </li>
+                </ul>
             </nav>
             <div class="navigation-actions">
-                <button class="btn btn-secondary">Postanite partner</button>
-                <button class="btn btn-primary">Donirajte</button>
-                 <!-- Zamenjan preklopnik jezika (tudi za mobilni meni) -->
+                <button class="btn btn-secondary">Postani član</button>
+                <button class="btn btn-primary">Doniraj</button>
                 <div class="language-selector">
                     <div class="current-lang">
                         <i class="fas fa-globe"></i>
-                        <span id="current-lang-code-mobile">SI</span>
+                        <span id="current-lang-code">SI</span>
                         <i class="fas fa-chevron-down"></i>
                     </div>
                     <div class="lang-dropdown">
                         <a href="#" data-lang="si">Slovenščina (SI)</a>
                         <a href="#" data-lang="en">English (EN)</a>
-                        <a href="#" data-lang="mk">Македонски (MK)</a>
+                        <a href="#" data-lang="mk">Македонски (МК)</a>
                     </div>
                 </div>
             </div>
-
-             <!-- Ikona za mobilni meni (Hamburger/X) -->
-            <div class="mobile-menu-icon">
-                <i class="fas fa-bars"></i>
-                <i class="fas fa-times"></i>
-            </div>
         </div>
+
+        <!-- Ikona za mobilni meni ostaja ločena za lažje upravljanje -->
+        <div class="mobile-menu-icon">
+            <i class="fas fa-bars"></i>
+            <i class="fas fa-times"></i>
+        </div>
+    </div>
 </header>
+
+<!-- Panel za mobilno navigacijo -->
+<div class="mobile-nav-panel">
+    <nav>
+        <ul class="navigation mobile-nav">
+            <li class="menu-item menu-item-has-children">
+                <a href="#">O nas</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Časovnica in dosežki</a></li>
+                    <li><a href="#">Naša ekipa, poslanstvo, vizija in vrednote</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">Kaj delamo</a>
+                <ul class="dropdown-menu">
+                    <li><a href="{{ROOT_PREFIX}}si/projects/">Dogodki in projekti</a></li>
+                    <li><a href="#">Blog</a></li>
+                    <li><a href="#">Galerija</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">Vključi se</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Postani član</a></li>
+                    <li><a href="#">Podpri MŠOS</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">Za študente</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Vodič za bruce</a></li>
+                    <li><a href="#">Mentorski program</a></li>
+                    <li><a href="#">Pogosta vprašanja</a></li>
+                    <li><a href="#">Spoznaj Slovenijo</a></li>
+                    <li><a href="#">Spoznaj Severno Makedonijo</a></li>
+                </ul>
+            </li>
+            <li class="menu-item menu-item-has-children">
+                <a href="#">Novice</a>
+                <ul class="dropdown-menu">
+                    <li><a href="#">Obvestila</a></li>
+                    <li><a href="#">Odprti pozivi</a></li>
+                    <li><a href="#">Sporočila za javnost</a></li>
+                </ul>
+            </li>
+        </ul>
+    </nav>
+    <div class="navigation-actions">
+        <button class="btn btn-secondary">Postani član</button>
+        <button class="btn btn-primary">Doniraj</button>
+        <div class="language-selector">
+            <button class="current-lang" id="mobile-lang-trigger">
+                <i class="fas fa-globe"></i>
+                <span>SI</span>
+                <i class="fas fa-chevron-right"></i>
+            </button>
+        </div>
+    </div>
+</div>
+
+<!-- Modalno okno za izbiro jezika (za mobilni) -->
+<div id="language-modal-overlay">
+    <div class="language-modal-content">
+        <div class="language-modal-header">
+            <h3>Izberi jezik</h3>
+            <button id="language-modal-close" aria-label="Zapri izbiro jezika">&times;</button>
+        </div>
+        <div class="language-modal-body">
+            <a href="#" data-lang="si" class="active-lang">Slovenščina (SI)</a>
+            <a href="#" data-lang="en">English (EN)</a>
+            <a href="#" data-lang="mk">Македонски (МК)</a>
+        </div>
+    </div>
+</div>
 <!-- END_HEADER -->"""
 
 
diff --git a/css/pages/_about.css b/css/pages/_about.css
index 204b7c5..e092ff2 100644
--- a/css/pages/_about.css
+++ b/css/pages/_about.css
@@ -1,134 +1,459 @@
+/* css/pages/_about.css */
+
 /* ==========================================================================
-   About Us Page Specific Styles
+   About Us Page Specific Styles (Redesign)
    ========================================================================== */
 
 /**
- * This file contains styles used exclusively on the About us page.
+ * This file contains styles used exclusively on the "Our team, mission, vision & core values" page.
  *
- * 1. Meet the team section
- * 2. Our values section
- * 3. Mission and Vision
- * 4. Mobile Styles
+ * 1. Leadership Team Section
+ * 2. Our Core Values Section
+ * 3. Mission and Vision Section
+ * 4. Call to Action (FAQ) Section
+ * 5. Mobile Styles for the page
  */
 
-/* 1. Meet the team section */
+/* ==========================================================================
+   1. Leadership Team Section
+   ========================================================================== */
+
 .team-section {
-    padding: 96px 80px;
+    padding: 48px 80px 96px;
+    background-color: #FFFFFF;
     text-align: center;
 }
 
-.team-members-grid {
+.team-section .page-header-section {
+    padding: 0;
+    margin-bottom: 64px;
+}
+
+.team-grid {
     display: flex;
     justify-content: center;
-    gap: 16px;
-    flex-wrap: wrap; /* Allows wrapping on smaller screens */
+    gap: 32px;
+    flex-wrap: wrap;
     max-width: 1280px;
     margin: 0 auto;
 }
 
-.team-member-card {
-    flex: 1; 
-    min-width: 240px; 
-    max-width: 243px; /* Adjusted max-width to fit 5 cards in a 1280px container with gaps */
-    background-color: #F9FAFB;
-    text-align: center;
-    padding: 24px;
+.member-card {
+    position: relative;
+    width: 326px;
+    height: 400px;
     border-radius: 16px;
+    overflow: hidden;
+    color: #FFFFFF;
+    background-size: cover; 
+    background-position: center;
+    transition: transform 0.3s ease-in-out;
+}
+
+.member-card::after {
+    content: '';
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    width: 100%;
+    height: 60%;
+    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.8) 100%);
+    z-index: 1;
+    transition: opacity 0.3s ease-in-out;
+}
+
+.member-card::before {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background-color: #2D738C;
+    opacity: 0;
+    z-index: 2;
+    transition: opacity 0.3s ease-in-out;
+}
+
+.member-content {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    padding: 24px;
     box-sizing: border-box;
     display: flex;
     flex-direction: column;
-    align-items: center;
-}
-
-.team-member-card img {
-    width: 80px;
-    height: 80px;
-    border-radius: 50%;
-    object-fit: cover;
-    margin-bottom: 20px;
-}
-
-.team-member-card h4 {
-    margin: 0 0 4px 0;
-    font-size: 18px;
-    font-weight: 600;
-    color: #101828;
-}
-
-.team-member-card .role {
-    color: #FA7850;
-    font-size: 16px;
-    font-weight: 400;
-    margin-bottom: 8px;
-    min-height: 48px; /* Added min-height for alignment */
-    display: flex;
-    align-items: center;
     justify-content: center;
+    align-items: center;
+    z-index: 3;
 }
 
-.team-member-card .description {
-    font-size: 14px;
-    color: #667085;
-    flex-grow: 1; /* Allows the description to take up remaining space */
+.member-socials {
+    display: flex;
+    gap: 32px;
+    opacity: 0;
+    visibility: hidden;
+    transform: translateY(10px);
+    transition: opacity 0.3s ease, transform 0.3s ease, visibility 0s 0.3s;
 }
 
-.team-member-card .social-icon-btn {
-    margin-top: 16px;
-    border-color: #EAECF0; 
+.member-socials a {
+    color: #FFFFFF;
+    font-size: 32px;
+    text-decoration: none;
+    transition: color 0.2s ease, transform 0.2s ease;
+}
+
+.member-socials a:hover {
+    color: #FA7850;
+    transform: scale(1.1);
+}
+
+.member-info {
+    text-align: center;
+    transform: translateY(115px);
+    transition: transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
+}
+
+.member-card h4 {
+    margin: 0 0 4px 0;
+    font-size: 24px;
+    font-weight: 600;
+    line-height: 29px;
+    text-transform: uppercase;
+}
+
+.member-card .role {
+    margin: 0;
+    font-size: 16px;
+    font-weight: 500;
+    color: #FFE16E;
+    text-transform: uppercase;
+}
+
+/* Hover effects only for devices that support it (desktops) */
+@media (hover: hover) {
+    .member-card:hover::before {
+        opacity: 0.8;
+    }
+    .member-card:hover::after {
+        opacity: 0;
+    }
+    .member-card:hover .member-socials {
+        opacity: 1;
+        visibility: visible;
+        transform: translateY(0);
+        transition: opacity 0.3s 0.1s ease, transform 0.3s 0.1s ease, visibility 0s 0s;
+    }
+    .member-card:hover .member-info {
+        transform: translateY(40px);
+    }
 }
 
 
-/* 2. Our values section */
-.values-section {
+#member-kristijan { background-image: url('../../images/about_kristijan.jpg'); }
+#member-lea { background-image: url('../../images/about_lea.jpg'); }
+#member-marko { background-image: url('../../images/about_marko.jpg'); }
+#member-marija { background-image: url('../../images/about_marija.jpg'); }
+#member-monika { background-image: url('../../images/about_monika.jpg'); }
+
+
+/* ==========================================================================
+   2. Our Core Values Section
+   ========================================================================== */
+   
+.core-values-section {
+    padding: 80px 80px 120px;
     background-color: #F9FAFB;
 }
 
-/* 3. Mission and Vision */
-.mission-vision {
-    display: flex;
-    justify-content: center;
-    gap: 32px;
+.core-values-section > .page-header-section {
+    padding: 0;
+    margin-bottom: 64px;
+    background: transparent;
+    text-align: center;
+}
+
+.core-values-section > .page-header-section h2 {
+    font-size: 36px;
+    font-weight: 600;
+    line-height: 44px;
+    letter-spacing: -0.02em;
+    color: #101828;
+}
+
+.core-values-section > .page-header-section p {
+    font-size: 20px;
+    line-height: 30px;
+    color: #667085;
     max-width: 768px;
-    margin: 64px auto 0;
-    text-align: left;
+    margin: 20px auto 0;
 }
 
-.mission-vision > div {
-    flex: 1;
+.values-container {
+    max-width: 1062px;
+    margin: 0 auto;
+    display: flex;
+    flex-direction: column;
+    gap: 64px;
 }
 
-.mission-vision h4 {
+.value-row {
     display: flex;
     align-items: center;
-    gap: 8px;
-    margin: 0 0 8px 0;
+    gap: 24px;
 }
 
-/* 4. Mobile Styles for About Us page */
-@media (max-width: 1280px) {
-    .team-members-grid {
-        justify-content: center; /* Center items when they wrap */
-    }
+.value-row:nth-child(even) {
+    flex-direction: row-reverse;
+}
+
+.value-image {
+    flex-basis: 519px;
+    flex-shrink: 0;
+}
+
+.value-image img {
+    width: 100%;
+    height: 270px;
+    border-radius: 16px;
+    object-fit: cover;
+}
+
+.value-content {
+    flex: 1;
+    text-align: left;
+    max-width: 519px;
+}
+
+.value-content h3 {
+    font-size: 24px;
+    font-weight: 600;
+    line-height: 1.2;
+    color: #101828;
+    margin: 0 0 16px 0;
+}
+
+.value-content p {
+    font-size: 16px;
+    line-height: 24px;
+    color: #667085;
+    margin: 0;
+}
+
+/* ==========================================================================
+   3. Mission and Vision Section
+   ========================================================================== */
+
+.mission-vision-section {
+    padding: 96px 80px;
+    background-color: #FFFFFF;
+}
+
+.mission-vision-section .page-header-section {
+    margin-bottom: 48px;
+    padding: 0;
+}
+
+.mission-vision-section .page-header-section h2 {
+    font-size: 36px;
+    font-weight: 600;
+    color: #101828;
+    text-align: center;
+}
+
+.mission-vision-grid {
+    display: flex;
+    justify-content: center;
+    gap: 40px;
+    max-width: 1060px;
+    margin: 0 auto;
+}
+
+.mission-box,
+.vision-box {
+    position: relative;
+    flex: 1;
+    height: 200px;
+    background: #F9FAFB;
+    border-radius: 12px;
+    cursor: pointer;
+    overflow: hidden;
+}
+
+.box-content {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    padding: 40px;
+    box-sizing: border-box;
+    text-align: center;
+    transition: opacity 0.4s ease-in-out, transform 0.4s ease-in-out;
+}
+
+.box-content p {
+    font-family: 'Inter', sans-serif;
+    font-size: 18px;
+    line-height: 1.2;
+    color: #667085;
+    margin: 0;
+}
+
+.box-content img {
+    width: 100%;
+    height: 100%;
+    object-fit: contain;
+}
+
+.mission-icon-content,
+.vision-icon-content {
+    padding: 0;
+}
+
+/* --- Animation Logic --- */
+.mission-text-content { opacity: 1; transform: translateY(0); }
+.mission-icon-content { opacity: 0; transform: translateY(20px); }
+.vision-text-content { opacity: 0; transform: translateY(20px); }
+.vision-icon-content { opacity: 1; transform: translateY(0); }
+
+@media (hover: hover) {
+    .mission-vision-grid.show-vision .mission-text-content { opacity: 0; transform: translateY(-20px); }
+    .mission-vision-grid.show-vision .mission-icon-content { opacity: 1; transform: translateY(0); }
+    .mission-vision-grid.show-vision .vision-text-content { opacity: 1; transform: translateY(0); }
+    .mission-vision-grid.show-vision .vision-icon-content { opacity: 0; transform: translateY(-20px); }
+}
+
+/* ==========================================================================
+   4. Call to Action (FAQ) Section
+   ========================================================================== */
+
+.faq-cta-section {
+    padding: 96px 80px;
+    background-color: #FFFFFF;
+}
+
+.faq-cta-container {
+    max-width: 1280px;
+    margin: 0 auto;
+    padding: 40px 32px;
+    background-color: #F9FAFB;
+    border-radius: 16px;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: 32px;
+}
+
+.avatar-group {
+    display: flex;
+    position: relative;
+    width: 120px;
+    height: 56px;
+    justify-content: center;
+    align-items: center;
+}
+.avatar {
+    width: 48px;
+    height: 48px;
+    border-radius: 50%;
+    border: 2px solid #FFFFFF;
+    position: absolute;
+    object-fit: cover;
+}
+.avatar:nth-child(1) { left: 0; z-index: 1;}
+.avatar:nth-child(2) { left: 50%; transform: translateX(-50%); z-index: 2;}
+.avatar:nth-child(3) { right: 0; z-index: 1;}
+
+.avatar.large {
+    width: 56px;
+    height: 56px;
+}
+
+.faq-cta-container h3 {
+    font-size: 20px;
+    font-weight: 500;
+    color: #101828;
+    margin: 0;
+    margin-top: -8px;
+}
+
+.faq-cta-container p {
+    font-size: 18px;
+    line-height: 28px;
+    color: #667085;
+    margin: -24px 0 0 0;
+}
+
+/* ==========================================================================
+   5. Mobile Styles for About Us Page
+   ========================================================================== */
+@media (max-width: 1024px) {
+    .team-grid { max-width: 700px; }
+    .values-container { gap: 64px; }
+    .value-row { gap: 32px; }
+    .value-image { flex-basis: 45%; min-width: 0; }
 }
 
 @media (max-width: 768px) {
-    .team-section {
+    .team-section,
+    .core-values-section,
+    .mission-vision-section,
+    .faq-cta-section {
         padding: 64px 24px;
     }
+    
+    .team-section .page-header-section { margin-bottom: 48px; }
+    .team-grid { flex-direction: column; align-items: center; gap: 24px; }
+    .member-card { width: 100%; max-width: 326px; height: 400px; }
+    
+    /* Core Values on Mobile */
+    .core-values-section .page-header-section { margin-bottom: 48px; }
+    .core-values-section > .page-header-section h2 { font-size: 32px; line-height: 40px; }
+    .core-values-section > .page-header-section p { font-size: 18px; line-height: 28px; }
 
-    .team-members-grid {
+    .values-container { gap: 48px; }
+    .value-row, .value-row:nth-child(even) { flex-direction: column; gap: 24px; }
+    .value-row .value-content { order: 1; }
+    .value-row .value-image { order: 2; }
+    .value-image { width: 100%; flex-basis: auto; }
+    .value-content { text-align: center; max-width: 100%; }
+    .value-content h3 { font-size: 24px; line-height: 32px; }
+    .value-content p { font-size: 16px; line-height: 26px; }
+
+    /* Mission and Vision on Mobile */
+    .mission-vision-grid { flex-direction: column; gap: 24px; }
+    .mission-box, .vision-box { cursor: default; height: auto; padding: 32px; }
+    
+    .box-content {
+        position: static;
+        transform: none !important;
+        opacity: 1 !important;
+        padding: 0;
+    }
+    .mission-box, .vision-box {
+        display: flex;
         flex-direction: column;
-        align-items: center;
-        gap: 24px;
+        gap: 16px;
+    }
+    .mission-icon-content, .vision-icon-content {
+        order: 1;
+        opacity: 1 !important; /* Ensure icons are visible */
+        transform: none !important;
+    }
+    .mission-text-content, .vision-text-content {
+        order: 2;
+        opacity: 1 !important; /* Ensure text is visible */
+        transform: none !important;
     }
     
-    .team-member-card {
-        max-width: 100%;
-        min-width: 280px;
-    }
-
-    .mission-vision {
-        flex-direction: column;
-        text-align: center;
-    }
+    .faq-cta-container { padding: 32px; }
+    .faq-cta-container h3 { font-size: 18px; }
+    .faq-cta-container p { font-size: 16px; line-height: 24px; }
 }
\ No newline at end of file
diff --git a/en/about-us/index.html b/en/about-us/index.html
index a94f759..6c77c3d 100644
--- a/en/about-us/index.html
+++ b/en/about-us/index.html
@@ -3,7 +3,7 @@
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>About Us - Macedonian Student Organisation in Slovenia</title>
+    <title>Our Team, Mission, Vision & Core Values - MSOS</title>
     
     <!-- Google Fonts -->
     <link rel="preconnect" href="https://fonts.googleapis.com">
@@ -177,151 +177,168 @@
         <!-- About Us Header Section -->
         <section class="page-header-section">
             <div class="container text-center">
-                <span class="page-subtitle">About us</span>
-                <h1>About MSOS</h1>
-                <p class="page-description">Learn more about the company and the team behind it.</p>
+                <span class="page-subtitle" style="text-transform: uppercase;">About us</span>
+                <h1>Our team, mission, vision & core values</h1>
+                <p class="page-description">MSOS is more than an organization - it is the energy of the team behind it. Our members are the heart and driving force that inspires us, writing this story and shaping student life in Slovenia.</p>
             </div>
         </section>
 
-        <!-- MSOS Foundation Section -->
-        <section class="meet-the-team-section">
-            <div class="team-content">
-                <p class="article-publish-date" style="text-align: left;">3rd October 2023</p>
-                <h2>MSOS Foundation</h2>
-                <p style="text-align: left;">Whether you have a team of 2 or 200, our shared team inboxes keep everyone on the same page and in the loop. Whether you have a team of 2 or 200, our shared team inboxes keep everyone on the same page and in the loop.</p>
-                <div class="navigation-arrows" style="display: flex; gap: 1rem; margin-top: 2rem;">
-                    <button class="social-icon-btn"><i class="fas fa-arrow-left"></i></button>
-                    <button class="social-icon-btn"><i class="fas fa-arrow-right"></i></button>
-                </div>
-            </div>
-            <div class="video-container">
-                <img src="../../images/msos_foundation.jpg" alt="MSOS Foundation members" class="video-thumbnail">
-            </div>
-        </section>
-
-        <!-- Meet our team section -->
+        <!-- Leadership Team Section -->
         <section class="team-section">
-            <div class="become-part-header">
-                <h2>Meet our team</h2>
-                <p>Our philosophy is simple — hire a team of diverse, passionate people and foster a culture that empowers you to do you best work.</p>
+            <div class="page-header-section">
+                <h2>Leadership team</h2>
             </div>
-            <div class="team-members-grid">
-                <!-- Team Member 1 -->
-                <div class="team-member-card">
-                    <img src="../../images/kristijan_popovski.jpg" alt="Kristijan Popovski">
-                    <h4>Kristijan Popovski</h4>
-                    <p class="role">Founder & CEO</p>
-                    <p class="description">Former co-founder of Opendoor. Early staff at Spotify and Clearbit.</p>
-                    <a href="#" class="social-icon-btn"><i class="fab fa-linkedin-in"></i></a>
+            <div class="team-grid">
+                <!-- Kristijan Popovski -->
+                <div class="member-card" id="member-kristijan">
+                    <div class="member-content">
+                        <div class="member-socials">
+                            <a href="mailto:kristijan.popovski@msosorg.com" aria-label="Email Kristijan Popovski"><i class="fas fa-envelope"></i></a>
+                            <a href="https://www.linkedin.com/in/popovski-k?utm_source=share&utm_campaign=share_via&utm_content=profile&utm_medium=ios_app" target="_blank" aria-label="LinkedIn profile of Kristijan Popovski"><i class="fab fa-linkedin-in"></i></a>
+                            <a href="https://www.instagram.com/popovski.k/" target="_blank" aria-label="Instagram profile of Kristijan Popovski"><i class="fab fa-instagram"></i></a>
+                        </div>
+                        <div class="member-info">
+                            <h4>Kristijan Popovski</h4>
+                            <p class="role">Founder and President</p>
+                        </div>
+                    </div>
                 </div>
-                <!-- Team Member 2 -->
-                <div class="team-member-card">
-                    <img src="../../images/bisera_nikolovska.jpg" alt="Bisera Nikolovska">
-                    <h4>Bisera Nikolovska</h4>
-                    <p class="role">Former PM for Linear, Lambda School, and On Deck.</p>
-                    <p class="description">Lead engineering teams at Figma, Pitch, and Protocol Labs.</p>
-                    <a href="#" class="social-icon-btn"><i class="fab fa-linkedin-in"></i></a>
+                <!-- Lea Janachkovska -->
+                <div class="member-card" id="member-lea">
+                    <div class="member-content">
+                         <div class="member-socials">
+                            <a href="mailto:lea.janackovska@msosorg.com" aria-label="Email Lea Janachkovska"><i class="fas fa-envelope"></i></a>
+                            <a href="https://www.linkedin.com/in/lea-janachkovska-9833b9246?utm_source=share&utm_campaign=share_via&utm_content=profile&utm_medium=ios_app" target="_blank" aria-label="LinkedIn profile of Lea Janachkovska"><i class="fab fa-linkedin-in"></i></a>
+                            <a href="https://www.instagram.com/lea_janackovska?igsh=djl0M2hjMXc0cWF2" target="_blank" aria-label="Instagram profile of Lea Janachkovska"><i class="fab fa-instagram"></i></a>
+                        </div>
+                        <div class="member-info">
+                            <h4>Lea Janachkovska</h4>
+                            <p class="role">Board Member</p>
+                        </div>
+                    </div>
                 </div>
-                <!-- Team Member 3 -->
-                <div class="team-member-card">
-                    <img src="../../images/kiara_lazic.jpg" alt="Kiara Lazic">
-                    <h4>Kiara Lazic</h4>
-                    <p class="role">Media and public relations</p>
-                    <p class="description">Lead engineering teams at Figma, Pitch, and Protocol Labs.</p>
-                    <a href="#" class="social-icon-btn"><i class="fab fa-linkedin-in"></i></a>
+                <!-- Marko Arsov -->
+                <div class="member-card" id="member-marko">
+                    <div class="member-content">
+                         <div class="member-socials">
+                            <a href="mailto:marko.arsov@msosorg.com" aria-label="Email Marko Arsov"><i class="fas fa-envelope"></i></a>
+                            <a href="https://www.linkedin.com/in/marko-arsov-3313202b9?utm_source=share&utm_campaign=share_via&utm_content=profile&utm_medium=ios_app" target="_blank" aria-label="LinkedIn profile of Marko Arsov"><i class="fab fa-linkedin-in"></i></a>
+                            <a href="https://www.instagram.com/marko.arsov?igsh=OXh6dnRkNGNuZmpw" target="_blank" aria-label="Instagram profile of Marko Arsov"><i class="fab fa-instagram"></i></a>
+                        </div>
+                        <div class="member-info">
+                            <h4>Marko Arsov</h4>
+                            <p class="role">Board Member</p>
+                        </div>
+                    </div>
                 </div>
-                <!-- Team Member 4 -->
-                <div class="team-member-card">
-                    <img src="../../images/leon_shumanski.jpg" alt="Leon Shumanski">
-                    <h4>Leon Shumanski</h4>
-                    <p class="role">Former frontend dev for Linear, Coinbase, and Postscript.</p>
-                    <p class="description">Lead engineering teams at Figma, Pitch, and Protocol Labs.</p>
-                    <a href="#" class="social-icon-btn"><i class="fab fa-linkedin-in"></i></a>
+                <!-- Marija Koshtrevska -->
+                <div class="member-card" id="member-marija">
+                    <div class="member-content">
+                         <div class="member-socials">
+                            <a href="mailto:marija.koshtrevska@msosorg.com" aria-label="Email Marija Koshtrevska"><i class="fas fa-envelope"></i></a>
+                            <a href="https://www.linkedin.com/in/marija-koshtrevska?utm_source=share&utm_campaign=share_via&utm_content=profile&utm_medium=ios_app" target="_blank" aria-label="LinkedIn profile of Marija Koshtrevska"><i class="fab fa-linkedin-in"></i></a>
+                            <a href="https://www.instagram.com/koshtrevska_10?igsh=eng3a2RlNHA5NGRn" target="_blank" aria-label="Instagram profile of Marija Koshtrevska"><i class="fab fa-instagram"></i></a>
+                        </div>
+                        <div class="member-info">
+                            <h4>Marija Koshtrevska</h4>
+                            <p class="role">Board Member</p>
+                        </div>
+                    </div>
                 </div>
-                 <!-- Team Member 5 -->
-                <div class="team-member-card">
-                    <img src="../../images/leon_shumanski.jpg" alt="Leon Shumanski">
-                    <h4>Leon Shumanski</h4>
-                    <p class="role">Former frontend dev for Linear, Coinbase, and Postscript.</p>
-                    <p class="description">Lead engineering teams at Figma, Pitch, and Protocol Labs.</p>
-                    <a href="#" class="social-icon-btn"><i class="fab fa-linkedin-in"></i></a>
+                <!-- Monika Velinova -->
+                <div class="member-card" id="member-monika">
+                    <div class="member-content">
+                         <div class="member-socials">
+                            <a href="mailto:monika.velinova@msosorg.com" aria-label="Email Monika Velinova"><i class="fas fa-envelope"></i></a>
+                            <a href="https://www.linkedin.com/in/monika-velinova-21632517a?utm_source=share&utm_campaign=share_via&utm_content=profile&utm_medium=ios_app" target="_blank" aria-label="LinkedIn profile of Monika Velinova"><i class="fab fa-linkedin-in"></i></a>
+                            <a href="https://www.instagram.com/monivelinova?igsh=MTUxOGRmNjNkeXdiaA==" target="_blank" aria-label="Instagram profile of Monika Velinova"><i class="fab fa-instagram"></i></a>
+                        </div>
+                        <div class="member-info">
+                            <h4>Monika Velinova</h4>
+                            <p class="role">Board Member</p>
+                        </div>
+                    </div>
                 </div>
             </div>
         </section>
 
-        <!-- Our values section -->
-        <section class="faq-section values-section">
-            <div class="faq-header">
-                <h2>Our values</h2>
-                <p>Our shared values keep us connected and guide us as one team.</p>
+        <!-- Our Core Values Section -->
+        <section class="core-values-section">
+            <div class="page-header-section">
+                <h2>Our core values</h2>
+                <p class="page-description">Our shared values keep us connected and guide us as one team.</p>
             </div>
-            <div class="faq-grid" style="max-width: 1024px;">
-                <div class="faq-item"><div class="faq-icon-container"><i class="fas fa-users"></i></div><h3>Care about our team</h3><p>Understand what matters to our employees. Give them what they need to do their best work.</p></div>
-                <div class="faq-item"><div class="faq-icon-container"><i class="fas fa-heart"></i></div><h3>Be excellent to each other</h3><p>No games. No bullshit. We rely on our peers to improve. Be open, honest and kind.</p></div>
-                <div class="faq-item"><div class="faq-icon-container"><i class="fas fa-chart-line"></i></div><h3>Pride in what we do</h3><p>Value quality and integrity in everything we do. At all times. No exceptions.</p></div>
-                <div class="faq-item"><div class="faq-icon-container"><i class="fas fa-smile"></i></div><h3>Don't f*#& the customer</h3><p>Understand customers' stated and unstated needs. Make them wildly successful.</p></div>
-                <div class="faq-item"><div class="faq-icon-container"><i class="fas fa-rocket"></i></div><h3>Do the impossible</h3><p>Be energized by difficult problems. Revel in unknowns. Ask “Why?”, but always question, “Why not?”</p></div>
-                <div class="faq-item"><div class="faq-icon-container"><i class="fas fa-bolt"></i></div><h3>Sweat the small stuff</h3><p>We believe the best products come from the best attention to detail. Sweat the small stuff.</p></div>
-            </div>
-            <div class="mission-vision">
-                <div>
-                    <h4><i class="fas fa-flag"></i> Mission</h4>
-                    <p>Understand customers' stated and unstated needs. Make them wildly successful.</p>
+            <div class="values-container">
+                <div class="value-row">
+                    <div class="value-content">
+                        <h3>Volunteer spirit</h3>
+                        <p>The strength of MSOS comes from giving our time and energy selflessly. Every project, event, and idea in MSOS is built on the hard work of our amazing volunteers. Our volunteer spirit is a testament to the dedication, passion, and collaborative energy of our community and the reason why we grow stronger together.</p>
+                    </div>
+                    <div class="value-image">
+                        <img src="../../images/about_volunteer_spirit.jpg" alt="A group of volunteers working together with positive energy.">
+                    </div>
                 </div>
-                <div>
-                    <h4><i class="fas fa-eye"></i> Vision</h4>
-                    <p>Be energized by difficult problems. Revel in unknowns. Ask “Why?”, but always question, “Why not?”</p>
+                <div class="value-row">
+                    <div class="value-image">
+                        <img src="../../images/about_solidarity_and_care_for_each_other.jpg" alt="Students supporting each other in a friendly and caring manner.">
+                    </div>
+                    <div class="value-content">
+                        <h3>Solidarity & care for each other</h3>
+                        <p>We are more than a group of students, but a family. We look after one another and support each other not just with studies, but also with everyday challenges. We are here to listen, help, and celebrate successes together. It's about giving without expecting anything in return and creating a safe, warm, and uplifting environment where everyone feels they belong.</p>
+                    </div>
+                </div>
+                <div class="value-row">
+                    <div class="value-content">
+                        <h3>Love for our roots & ambition for the future</h3>
+                        <p>We are proud of where we come from and carry our Macedonian heritage with us, while striving for a brighter future. Our roots give us strength, and our ambition pushes us forward. Our ambition drives us to be professional, innovative, and influential leaders and role models in our host country.</p>
+                    </div>
+                    <div class="value-image">
+                        <img src="../../images/about_love_for_our_roots_ambition_for_the_future.jpg" alt="A blend of traditional Macedonian culture and modern ambitious students.">
+                    </div>
                 </div>
             </div>
         </section>
 
-        <!-- Become Part Section -->
-        <section class="become-part-section" style="background-color: #FFFFFF;">
-            <div class="become-part-header">
-                <h2>Become part of our amazing team</h2>
-                <p>We're a 100% remote team spread all across the world. Join us!</p>
+        <!-- Mission and Vision Section -->
+        <section class="mission-vision-section">
+            <div class="page-header-section">
+                <h2>Mission and Vision</h2>
             </div>
-            <img src="../../images/amazing_team.png" alt="Our amazing team in a classroom setting" class="team-photo">
-            
-            <div class="contact-form-container">
-                <form class="contact-form">
-                    <div class="form-row">
-                        <div class="form-group">
-                            <label for="first-name">First name</label>
-                            <input type="text" id="first-name" placeholder="First name">
-                        </div>
-                        <div class="form-group">
-                            <label for="last-name">Last name</label>
-                            <input type="text" id="last-name" placeholder="Last name">
-                        </div>
+            <div class="mission-vision-grid" id="mission-vision-interactive">
+                <!-- Mission Box -->
+                <div class="mission-box">
+                    <div class="box-content mission-text-content">
+                        <p>The mission of MSOS is to represent the interests, improve the lives, and ease the studies of Macedonian students in the Republic of Slovenia.</p>
                     </div>
-                    <div class="form-group">
-                        <label for="email">Email</label>
-                        <input type="email" id="email" placeholder="student@email.com">
+                    <div class="box-content mission-icon-content">
+                        <img src="../../images/about_mission.png" alt="Mission Icon">
                     </div>
-                    <div class="form-group">
-                         <label for="phone-number">Phone number</label>
-                        <div class="phone-input">
-                            <select id="country-code" aria-label="Country code">
-                                <option>SL</option>
-                                <option>US</option>
-                                <option>MK</option>
-                            </select>
-                            <input type="tel" id="phone-number" placeholder="+386 (00) 000-000">
-                        </div>
+                </div>
+                <!-- Vision Box -->
+                <div class="vision-box">
+                    <div class="box-content vision-text-content">
+                        <p>The vision of the MSOS is to provide a voice, a home, and support for Macedonian students in the Republic of Slovenia, while encouraging their active involvement in projects of common interest.</p>
                     </div>
-                    <div class="form-group">
-                        <label for="message">Message</label>
-                        <textarea id="message" rows="5"></textarea>
+                    <div class="box-content vision-icon-content">
+                        <img src="../../images/about_vision.png" alt="Vision Icon">
                     </div>
-                    <div class="form-group checkbox-group">
-                        <input type="checkbox" id="privacy-policy">
-                        <label for="privacy-policy">You agree to our friendly <a href="#">privacy policy</a>.</label>
-                    </div>
-                    <button type="submit" class="btn btn-primary">Send message</button>
-                </form>
+                </div>
             </div>
         </section>
+
+        <!-- FAQ Call to Action Section -->
+        <section class="faq-cta-section">
+             <div class="faq-cta-container">
+                <div class="avatar-group">
+                     <img src="../../images/about_marija_min.jpg" alt="Avatar of Marija" class="avatar">
+                     <img src="../../images/about_kristijan_min.jpg" alt="Avatar of Kristijan" class="avatar large">
+                     <img src="../../images/about_lea_min.jpg" alt="Avatar of Lea" class="avatar">
+                </div>
+                <h3>Have any questions?</h3>
+                <p class="page-description" style="margin: 0;">Can't find the answer you're looking for? Please chat to our friendly team.</p>
+                <a href="#" class="btn btn-primary-orange">See all FAQs</a>
+             </div>
+        </section>
     </main>
 
     <!-- START_FOOTER -->
@@ -378,7 +395,6 @@
     <script src="../../main.js"></script>
 </footer>
 <!-- END_FOOTER -->
-
     
 </body>
 </html>
\ No newline at end of file
diff --git a/en/about-us/index.html.bak b/en/about-us/index.html.bak
index 02d858b..f6ba4af 100644
--- a/en/about-us/index.html.bak
+++ b/en/about-us/index.html.bak
@@ -3,7 +3,7 @@
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>About Us - Macedonian Student Organisation in Slovenia</title>
+    <title>Our Team, Mission, Vision & Core Values - MSOS</title>
     
     <!-- Google Fonts -->
     <link rel="preconnect" href="https://fonts.googleapis.com">
@@ -19,368 +19,375 @@
 <body>
 
     <!-- START_HEADER -->
-<header class="dropdown-header-navigation">
-    <div class="container">
-        <div class="header-content">
+    <header class="dropdown-header-navigation">
+        <div class="container">
             <a href="../../en/" class="logo-link">
                 <img src="../../images/1-logo.png" alt="Macedonian Student Organisation in Slovenia Logo" class="logo-img">
             </a>
-            <!-- Desktop Navigation -->
-            <nav>
-                <ul class="navigation desktop-nav">
-                    <li class="menu-item menu-item-has-children">
-                        <a href="#">Who We Are</a>
-                        <ul class="dropdown-menu">
-                            <li><a href="#">Timeline & Milestones</a></li>
-                            <li><a href="#">Our team, mission, vision & core values</a></li>
-                        </ul>
-                    </li>
-                    <li class="menu-item menu-item-has-children">
-                        <a href="#">What We Do</a>
-                        <ul class="dropdown-menu">
-                            <li><a href="../../en/projects/">Event & Projects</a></li>
-                            <li><a href="#">Blog</a></li>
-                            <li><a href="#">Gallery</a></li>
-                        </ul>
-                    </li>
-                    <li class="menu-item menu-item-has-children">
-                        <a href="#">Get Involved</a>
-                        <ul class="dropdown-menu">
-                            <li><a href="#">Become a member</a></li>
-                            <li><a href="#">Support MSOS</a></li>
-                        </ul>
-                    </li>
-                    <li class="menu-item menu-item-has-children">
-                        <a href="#">For Students</a>
-                        <ul class="dropdown-menu">
-                            <li><a href="#">Student Welcome Guide</a></li>
-                            <li><a href="#">Mentorship Programme</a></li>
-                            <li><a href="#">FAQs</a></li>
-                            <li><a href="#">Get to know Slovenia</a></li>
-                            <li><a href="#">Get to know North Macedonia</a></li>
-                        </ul>
-                    </li>
-                    <li class="menu-item menu-item-has-children">
-                        <a href="#">News</a>
-                        <ul class="dropdown-menu">
-                            <li><a href="#">Announcements</a></li>
-                            <li><a href="#">Open calls</a></li>
-                            <li><a href="#">Press releases</a></li>
-                        </ul>
-                    </li>
-                </ul>
-            </nav>
+            <div class="header-right-wrapper">
+                <nav>
+                    <ul class="navigation desktop-nav">
+                        <li class="menu-item menu-item-has-children">
+                            <a href="#">Who We Are</a>
+                            <ul class="dropdown-menu">
+                                <li><a href="#">Timeline & Milestones</a></li>
+                                <li><a href="#">Our team, mission, vision & core values</a></li>
+                            </ul>
+                        </li>
+                        <li class="menu-item menu-item-has-children">
+                            <a href="#">What We Do</a>
+                            <ul class="dropdown-menu">
+                                <li><a href="../../en/projects/">Event & Projects</a></li>
+                                <li><a href="#">Blog</a></li>
+                                <li><a href="#">Gallery</a></li>
+                            </ul>
+                        </li>
+                        <li class="menu-item menu-item-has-children">
+                            <a href="#">Get Involved</a>
+                            <ul class="dropdown-menu">
+                                <li><a href="#">Become a member</a></li>
+                                <li><a href="#">Support MSOS</a></li>
+                            </ul>
+                        </li>
+                        <li class="menu-item menu-item-has-children">
+                            <a href="#">For Students</a>
+                            <ul class="dropdown-menu">
+                                <li><a href="#">Student Welcome Guide</a></li>
+                                <li><a href="#">Mentorship Programme</a></li>
+                                <li><a href="#">FAQs</a></li>
+                                <li><a href="#">Get to know Slovenia</a></li>
+                                <li><a href="#">Get to know North Macedonia</a></li>
+                            </ul>
+                        </li>
+                        <li class="menu-item menu-item-has-children">
+                            <a href="#">News</a>
+                            <ul class="dropdown-menu">
+                                <li><a href="#">Announcements</a></li>
+                                <li><a href="#">Open calls</a></li>
+                                <li><a href="#">Press releases</a></li>
+                            </ul>
+                        </li>
+                    </ul>
+                </nav>
+                <div class="navigation-actions">
+                    <button class="btn btn-secondary">Become a member</button>
+                    <button class="btn btn-primary">Donate</button>
+                    <div class="language-selector">
+                        <div class="current-lang">
+                            <i class="fas fa-globe"></i>
+                            <span id="current-lang-code">EN</span>
+                            <i class="fas fa-chevron-down"></i>
+                        </div>
+                        <div class="lang-dropdown">
+                            <a href="#" data-lang="si">Slovenščina (SI)</a>
+                            <a href="#" data-lang="en">English (EN)</a>
+                            <a href="#" data-lang="mk">Македонски (MK)</a>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div class="mobile-menu-icon">
+                <i class="fas fa-bars"></i>
+                <i class="fas fa-times"></i>
+            </div>
         </div>
+    </header>
 
-        <!-- Desktop Buttons -->
+    <div class="mobile-nav-panel">
+        <nav>
+            <ul class="navigation mobile-nav">
+                <li class="menu-item menu-item-has-children">
+                    <a href="#">Who We Are</a>
+                    <ul class="dropdown-menu">
+                        <li><a href="#">Timeline & Milestones</a></li>
+                        <li><a href="#">Our team, mission, vision & core values</a></li>
+                    </ul>
+                </li>
+                <li class="menu-item menu-item-has-children">
+                    <a href="#">What We Do</a>
+                    <ul class="dropdown-menu">
+                        <li><a href="../../en/projects/">Event & Projects</a></li>
+                        <li><a href="#">Blog</a></li>
+                        <li><a href="#">Gallery</a></li>
+                    </ul>
+                </li>
+                <li class="menu-item menu-item-has-children">
+                    <a href="#">Get Involved</a>
+                    <ul class="dropdown-menu">
+                        <li><a href="#">Become a member</a></li>
+                        <li><a href="#">Support MSOS</a></li>
+                    </ul>
+                </li>
+                <li class="menu-item menu-item-has-children">
+                    <a href="#">For Students</a>
+                    <ul class="dropdown-menu">
+                        <li><a href="#">Student Welcome Guide</a></li>
+                        <li><a href="#">Mentorship Programme</a></li>
+                        <li><a href="#">FAQs</a></li>
+                        <li><a href="#">Get to know Slovenia</a></li>
+                        <li><a href="#">Get to know North Macedonia</a></li>
+                    </ul>
+                </li>
+                <li class="menu-item menu-item-has-children">
+                    <a href="#">News</a>
+                    <ul class="dropdown-menu">
+                        <li><a href="#">Announcements</a></li>
+                        <li><a href="#">Open calls</a></li>
+                        <li><a href="#">Press releases</a></li>
+                    </ul>
+                </li>
+            </ul>
+        </nav>
         <div class="navigation-actions">
             <button class="btn btn-secondary">Become a member</button>
             <button class="btn btn-primary">Donate</button>
-            <!-- Language Switcher (Desktop Dropdown) -->
             <div class="language-selector">
-                <div class="current-lang">
+                <button class="current-lang" id="mobile-lang-trigger">
                     <i class="fas fa-globe"></i>
-                    <span id="current-lang-code">EN</span>
-                    <i class="fas fa-chevron-down"></i>
-                </div>
-                <div class="lang-dropdown">
-                    <a href="#" data-lang="si">Slovenščina (SI)</a>
-                    <a href="#" data-lang="en">English (EN)</a>
-                    <a href="#" data-lang="mk">Македонски (MK)</a>
-                </div>
+                    <span>EN</span>
+                    <i class="fas fa-chevron-right"></i>
+                </button>
             </div>
         </div>
+    </div>
 
-        <!-- Mobile Menu Icon (Hamburger/X) -->
-        <div class="mobile-menu-icon">
-            <i class="fas fa-bars"></i>
-            <i class="fas fa-times"></i>
+    <div id="language-modal-overlay">
+        <div class="language-modal-content">
+            <div class="language-modal-header">
+                <h3>Select Language</h3>
+                <button id="language-modal-close" aria-label="Close language selection">&times;</button>
+            </div>
+            <div class="language-modal-body">
+                <a href="#" data-lang="si">Slovenščina (SI)</a>
+                <a href="#" data-lang="en" class="active-lang">English (EN)</a>
+                <a href="#" data-lang="mk">Македонски (MK)</a>
+            </div>
         </div>
     </div>
-</header>
-
-<!-- Mobile Navigation Panel -->
-<div class="mobile-nav-panel">
-    <nav>
-        <ul class="navigation mobile-nav">
-            <li class="menu-item menu-item-has-children">
-                <a href="#">Who We Are</a>
-                <ul class="dropdown-menu">
-                    <li><a href="#">Timeline & Milestones</a></li>
-                    <li><a href="#">Our team, mission, vision & core values</a></li>
-                </ul>
-            </li>
-            <li class="menu-item menu-item-has-children">
-                <a href="#">What We Do</a>
-                <ul class="dropdown-menu">
-                    <li><a href="../../en/projects/">Event & Projects</a></li>
-                    <li><a href="#">Blog</a></li>
-                    <li><a href="#">Gallery</a></li>
-                </ul>
-            </li>
-            <li class="menu-item menu-item-has-children">
-                <a href="#">Get Involved</a>
-                <ul class="dropdown-menu">
-                    <li><a href="#">Become a member</a></li>
-                    <li><a href="#">Support MSOS</a></li>
-                </ul>
-            </li>
-            <li class="menu-item menu-item-has-children">
-                <a href="#">For Students</a>
-                <ul class="dropdown-menu">
-                    <li><a href="#">Student Welcome Guide</a></li>
-                    <li><a href="#">Mentorship Programme</a></li>
-                    <li><a href="#">FAQs</a></li>
-                    <li><a href="#">Get to know Slovenia</a></li>
-                    <li><a href="#">Get to know North Macedonia</a></li>
-                </ul>
-            </li>
-            <li class="menu-item menu-item-has-children">
-                <a href="#">News</a>
-                <ul class="dropdown-menu">
-                    <li><a href="#">Announcements</a></li>
-                    <li><a href="#">Open calls</a></li>
-                    <li><a href="#">Press releases</a></li>
-                </ul>
-            </li>
-        </ul>
-    </nav>
-    <div class="navigation-actions">
-        <button class="btn btn-secondary">Become a member</button>
-        <button class="btn btn-primary">Donate</button>
-        <!-- Language Switcher (Mobile Button - Triggers Modal) -->
-        <div class="language-selector">
-            <button class="current-lang" id="mobile-lang-trigger">
-                <i class="fas fa-globe"></i>
-                <span>EN</span>
-                <i class="fas fa-chevron-right"></i>
-            </button>
-        </div>
-    </div>
-</div>
-
-<!-- Language Selection Modal (for Mobile) -->
-<div id="language-modal-overlay">
-    <div class="language-modal-content">
-        <div class="language-modal-header">
-            <h3>Select Language</h3>
-            <button id="language-modal-close" aria-label="Close language selection">&times;</button>
-        </div>
-        <div class="language-modal-body">
-            <a href="#" data-lang="si">Slovenščina (SI)</a>
-            <a href="#" data-lang="en" class="active-lang">English (EN)</a>
-            <a href="#" data-lang="mk">Македонски (MK)</a>
-        </div>
-    </div>
-</div>
-<!-- END_HEADER -->
+    <!-- END_HEADER -->
 
     <main class="page-content">
         <!-- About Us Header Section -->
         <section class="page-header-section">
             <div class="container text-center">
-                <span class="page-subtitle">About us</span>
-                <h1>About MSOS</h1>
-                <p class="page-description">Learn more about the company and the team behind it.</p>
+                <span class="page-subtitle" style="text-transform: uppercase;">About us</span>
+                <h1>Our team, mission, vision & core values</h1>
+                <p class="page-description">MSOS is more than an organization - it is the energy of the team behind it. Our members are the heart and driving force that inspires us, writing this story and shaping student life in Slovenia.</p>
             </div>
         </section>
 
-        <!-- MSOS Foundation Section -->
-        <section class="meet-the-team-section">
-            <div class="team-content">
-                <p class="article-publish-date" style="text-align: left;">3rd October 2023</p>
-                <h2>MSOS Foundation</h2>
-                <p style="text-align: left;">Whether you have a team of 2 or 200, our shared team inboxes keep everyone on the same page and in the loop. Whether you have a team of 2 or 200, our shared team inboxes keep everyone on the same page and in the loop.</p>
-                <div class="navigation-arrows" style="display: flex; gap: 1rem; margin-top: 2rem;">
-                    <button class="social-icon-btn"><i class="fas fa-arrow-left"></i></button>
-                    <button class="social-icon-btn"><i class="fas fa-arrow-right"></i></button>
-                </div>
-            </div>
-            <div class="video-container">
-                <img src="../../images/msos_foundation.jpg" alt="MSOS Foundation members" class="video-thumbnail">
-            </div>
-        </section>
-
-        <!-- Meet our team section -->
+        <!-- Leadership Team Section -->
         <section class="team-section">
-            <div class="become-part-header">
-                <h2>Meet our team</h2>
-                <p>Our philosophy is simple — hire a team of diverse, passionate people and foster a culture that empowers you to do you best work.</p>
+            <div class="page-header-section">
+                <h2>Leadership team</h2>
             </div>
-            <div class="team-members-grid">
-                <!-- Team Member 1 -->
-                <div class="team-member-card">
-                    <img src="../../images/kristijan_popovski.jpg" alt="Kristijan Popovski">
-                    <h4>Kristijan Popovski</h4>
-                    <p class="role">Founder & CEO</p>
-                    <p class="description">Former co-founder of Opendoor. Early staff at Spotify and Clearbit.</p>
-                    <a href="#" class="social-icon-btn"><i class="fab fa-linkedin-in"></i></a>
+            <div class="team-grid">
+                <!-- Kristijan Popovski -->
+                <div class="member-card" id="member-kristijan">
+                    <div class="member-content">
+                        <div class="member-socials">
+                            <a href="mailto:kristijan.popovski@msosorg.com" aria-label="Email Kristijan Popovski"><i class="fas fa-envelope"></i></a>
+                            <a href="https://www.linkedin.com/in/popovski-k?utm_source=share&utm_campaign=share_via&utm_content=profile&utm_medium=ios_app" target="_blank" aria-label="LinkedIn profile of Kristijan Popovski"><i class="fab fa-linkedin-in"></i></a>
+                            <a href="https://www.instagram.com/popovski.k/" target="_blank" aria-label="Instagram profile of Kristijan Popovski"><i class="fab fa-instagram"></i></a>
+                        </div>
+                        <div class="member-info">
+                            <h4>Kristijan Popovski</h4>
+                            <p class="role">Founder and President</p>
+                        </div>
+                    </div>
                 </div>
-                <!-- Team Member 2 -->
-                <div class="team-member-card">
-                    <img src="../../images/bisera_nikolovska.jpg" alt="Bisera Nikolovska">
-                    <h4>Bisera Nikolovska</h4>
-                    <p class="role">Former PM for Linear, Lambda School, and On Deck.</p>
-                    <p class="description">Lead engineering teams at Figma, Pitch, and Protocol Labs.</p>
-                    <a href="#" class="social-icon-btn"><i class="fab fa-linkedin-in"></i></a>
+                <!-- Lea Janachkovska -->
+                <div class="member-card" id="member-lea">
+                    <div class="member-content">
+                         <div class="member-socials">
+                            <a href="mailto:lea.janackovska@msosorg.com" aria-label="Email Lea Janachkovska"><i class="fas fa-envelope"></i></a>
+                            <a href="https://www.linkedin.com/in/lea-janachkovska-9833b9246?utm_source=share&utm_campaign=share_via&utm_content=profile&utm_medium=ios_app" target="_blank" aria-label="LinkedIn profile of Lea Janachkovska"><i class="fab fa-linkedin-in"></i></a>
+                            <a href="https://www.instagram.com/lea_janackovska?igsh=djl0M2hjMXc0cWF2" target="_blank" aria-label="Instagram profile of Lea Janachkovska"><i class="fab fa-instagram"></i></a>
+                        </div>
+                        <div class="member-info">
+                            <h4>Lea Janachkovska</h4>
+                            <p class="role">Board Member</p>
+                        </div>
+                    </div>
                 </div>
-                <!-- Team Member 3 -->
-                <div class="team-member-card">
-                    <img src="../../images/kiara_lazic.jpg" alt="Kiara Lazic">
-                    <h4>Kiara Lazic</h4>
-                    <p class="role">Media and public relations</p>
-                    <p class="description">Lead engineering teams at Figma, Pitch, and Protocol Labs.</p>
-                    <a href="#" class="social-icon-btn"><i class="fab fa-linkedin-in"></i></a>
+                <!-- Marko Arsov -->
+                <div class="member-card" id="member-marko">
+                    <div class="member-content">
+                         <div class="member-socials">
+                            <a href="mailto:marko.arsov@msosorg.com" aria-label="Email Marko Arsov"><i class="fas fa-envelope"></i></a>
+                            <a href="https://www.linkedin.com/in/marko-arsov-3313202b9?utm_source=share&utm_campaign=share_via&utm_content=profile&utm_medium=ios_app" target="_blank" aria-label="LinkedIn profile of Marko Arsov"><i class="fab fa-linkedin-in"></i></a>
+                            <a href="https://www.instagram.com/marko.arsov?igsh=OXh6dnRkNGNuZmpw" target="_blank" aria-label="Instagram profile of Marko Arsov"><i class="fab fa-instagram"></i></a>
+                        </div>
+                        <div class="member-info">
+                            <h4>Marko Arsov</h4>
+                            <p class="role">Board Member</p>
+                        </div>
+                    </div>
                 </div>
-                <!-- Team Member 4 -->
-                <div class="team-member-card">
-                    <img src="../../images/leon_shumanski.jpg" alt="Leon Shumanski">
-                    <h4>Leon Shumanski</h4>
-                    <p class="role">Former frontend dev for Linear, Coinbase, and Postscript.</p>
-                    <p class="description">Lead engineering teams at Figma, Pitch, and Protocol Labs.</p>
-                    <a href="#" class="social-icon-btn"><i class="fab fa-linkedin-in"></i></a>
+                <!-- Marija Koshtrevska -->
+                <div class="member-card" id="member-marija">
+                    <div class="member-content">
+                         <div class="member-socials">
+                            <a href="mailto:marija.koshtrevska@msosorg.com" aria-label="Email Marija Koshtrevska"><i class="fas fa-envelope"></i></a>
+                            <a href="https://www.linkedin.com/in/marija-koshtrevska?utm_source=share&utm_campaign=share_via&utm_content=profile&utm_medium=ios_app" target="_blank" aria-label="LinkedIn profile of Marija Koshtrevska"><i class="fab fa-linkedin-in"></i></a>
+                            <a href="https://www.instagram.com/koshtrevska_10?igsh=eng3a2RlNHA5NGRn" target="_blank" aria-label="Instagram profile of Marija Koshtrevska"><i class="fab fa-instagram"></i></a>
+                        </div>
+                        <div class="member-info">
+                            <h4>Marija Koshtrevska</h4>
+                            <p class="role">Board Member</p>
+                        </div>
+                    </div>
                 </div>
-                 <!-- Team Member 5 -->
-                <div class="team-member-card">
-                    <img src="../../images/leon_shumanski.jpg" alt="Leon Shumanski">
-                    <h4>Leon Shumanski</h4>
-                    <p class="role">Former frontend dev for Linear, Coinbase, and Postscript.</p>
-                    <p class="description">Lead engineering teams at Figma, Pitch, and Protocol Labs.</p>
-                    <a href="#" class="social-icon-btn"><i class="fab fa-linkedin-in"></i></a>
+                <!-- Monika Velinova -->
+                <div class="member-card" id="member-monika">
+                    <div class="member-content">
+                         <div class="member-socials">
+                            <a href="mailto:monika.velinova@msosorg.com" aria-label="Email Monika Velinova"><i class="fas fa-envelope"></i></a>
+                            <a href="https://www.linkedin.com/in/monika-velinova-21632517a?utm_source=share&utm_campaign=share_via&utm_content=profile&utm_medium=ios_app" target="_blank" aria-label="LinkedIn profile of Monika Velinova"><i class="fab fa-linkedin-in"></i></a>
+                            <a href="https://www.instagram.com/monivelinova?igsh=MTUxOGRmNjNkeXdiaA==" target="_blank" aria-label="Instagram profile of Monika Velinova"><i class="fab fa-instagram"></i></a>
+                        </div>
+                        <div class="member-info">
+                            <h4>Monika Velinova</h4>
+                            <p class="role">Board Member</p>
+                        </div>
+                    </div>
                 </div>
             </div>
         </section>
 
-        <!-- Our values section -->
-        <section class="faq-section values-section">
-            <div class="faq-header">
-                <h2>Our values</h2>
-                <p>Our shared values keep us connected and guide us as one team.</p>
+        <!-- Our Core Values Section -->
+        <section class="core-values-section">
+            <div class="page-header-section">
+                <h2>Our core values</h2>
+                <p class="page-description">Our shared values keep us connected and guide us as one team.</p>
             </div>
-            <div class="faq-grid" style="max-width: 1024px;">
-                <div class="faq-item"><div class="faq-icon-container"><i class="fas fa-users"></i></div><h3>Care about our team</h3><p>Understand what matters to our employees. Give them what they need to do their best work.</p></div>
-                <div class="faq-item"><div class="faq-icon-container"><i class="fas fa-heart"></i></div><h3>Be excellent to each other</h3><p>No games. No bullshit. We rely on our peers to improve. Be open, honest and kind.</p></div>
-                <div class="faq-item"><div class="faq-icon-container"><i class="fas fa-chart-line"></i></div><h3>Pride in what we do</h3><p>Value quality and integrity in everything we do. At all times. No exceptions.</p></div>
-                <div class="faq-item"><div class="faq-icon-container"><i class="fas fa-smile"></i></div><h3>Don't f*#& the customer</h3><p>Understand customers' stated and unstated needs. Make them wildly successful.</p></div>
-                <div class="faq-item"><div class="faq-icon-container"><i class="fas fa-rocket"></i></div><h3>Do the impossible</h3><p>Be energized by difficult problems. Revel in unknowns. Ask “Why?”, but always question, “Why not?”</p></div>
-                <div class="faq-item"><div class="faq-icon-container"><i class="fas fa-bolt"></i></div><h3>Sweat the small stuff</h3><p>We believe the best products come from the best attention to detail. Sweat the small stuff.</p></div>
-            </div>
-            <div class="mission-vision">
-                <div>
-                    <h4><i class="fas fa-flag"></i> Mission</h4>
-                    <p>Understand customers' stated and unstated needs. Make them wildly successful.</p>
+            <div class="values-container">
+                <div class="value-row">
+                    <div class="value-content">
+                        <h3>Volunteer spirit</h3>
+                        <p>The strength of MSOS comes from giving our time and energy selflessly. Every project, event, and idea in MSOS is built on the hard work of our amazing volunteers. Our volunteer spirit is a testament to the dedication, passion, and collaborative energy of our community and the reason why we grow stronger together.</p>
+                    </div>
+                    <div class="value-image">
+                        <img src="../../images/about_volunteer_spirit.jpg" alt="A group of volunteers working together with positive energy.">
+                    </div>
                 </div>
-                <div>
-                    <h4><i class="fas fa-eye"></i> Vision</h4>
-                    <p>Be energized by difficult problems. Revel in unknowns. Ask “Why?”, but always question, “Why not?”</p>
+                <div class="value-row">
+                    <div class="value-image">
+                        <img src="../../images/about_solidarity_and_care_for_each_other.jpg" alt="Students supporting each other in a friendly and caring manner.">
+                    </div>
+                    <div class="value-content">
+                        <h3>Solidarity & care for each other</h3>
+                        <p>We are more than a group of students, but a family. We look after one another and support each other not just with studies, but also with everyday challenges. We are here to listen, help, and celebrate successes together. It's about giving without expecting anything in return and creating a safe, warm, and uplifting environment where everyone feels they belong.</p>
+                    </div>
+                </div>
+                <div class="value-row">
+                    <div class="value-content">
+                        <h3>Love for our roots & ambition for the future</h3>
+                        <p>We are proud of where we come from and carry our Macedonian heritage with us, while striving for a brighter future. Our roots give us strength, and our ambition pushes us forward. Our ambition drives us to be professional, innovative, and influential leaders and role models in our host country.</p>
+                    </div>
+                    <div class="value-image">
+                        <img src="../../images/about_love_for_our_roots_ambition_for_the_future.jpg" alt="A blend of traditional Macedonian culture and modern ambitious students.">
+                    </div>
                 </div>
             </div>
         </section>
 
-        <!-- Become Part Section -->
-        <section class="become-part-section" style="background-color: #FFFFFF;">
-            <div class="become-part-header">
-                <h2>Become part of our amazing team</h2>
-                <p>We're a 100% remote team spread all across the world. Join us!</p>
+        <!-- Mission and Vision Section -->
+        <section class="mission-vision-section">
+            <div class="page-header-section">
+                <h2>Mission and Vision</h2>
             </div>
-            <img src="../../images/amazing_team.png" alt="Our amazing team in a classroom setting" class="team-photo">
-            
-            <div class="contact-form-container">
-                <form class="contact-form">
-                    <div class="form-row">
-                        <div class="form-group">
-                            <label for="first-name">First name</label>
-                            <input type="text" id="first-name" placeholder="First name">
-                        </div>
-                        <div class="form-group">
-                            <label for="last-name">Last name</label>
-                            <input type="text" id="last-name" placeholder="Last name">
-                        </div>
+            <div class="mission-vision-grid" id="mission-vision-interactive">
+                <!-- Mission Box -->
+                <div class="mission-box">
+                    <div class="box-content mission-text-content">
+                        <p>The mission of MSOS is to represent the interests, improve the lives, and ease the studies of Macedonian students in the Republic of Slovenia.</p>
                     </div>
-                    <div class="form-group">
-                        <label for="email">Email</label>
-                        <input type="email" id="email" placeholder="student@email.com">
+                    <div class="box-content mission-icon-content">
+                        <img src="../../images/about_mission.png" alt="Mission Icon">
                     </div>
-                    <div class="form-group">
-                         <label for="phone-number">Phone number</label>
-                        <div class="phone-input">
-                            <select id="country-code" aria-label="Country code">
-                                <option>SL</option>
-                                <option>US</option>
-                                <option>MK</option>
-                            </select>
-                            <input type="tel" id="phone-number" placeholder="+386 (00) 000-000">
-                        </div>
+                </div>
+                <!-- Vision Box -->
+                <div class="vision-box">
+                    <div class="box-content vision-text-content">
+                        <p>The vision of the MSOS is to provide a voice, a home, and support for Macedonian students in the Republic of Slovenia, while encouraging their active involvement in projects of common interest.</p>
                     </div>
-                    <div class="form-group">
-                        <label for="message">Message</label>
-                        <textarea id="message" rows="5"></textarea>
+                    <div class="box-content vision-icon-content">
+                        <img src="../../images/about_vision.png" alt="Vision Icon">
                     </div>
-                    <div class="form-group checkbox-group">
-                        <input type="checkbox" id="privacy-policy">
-                        <label for="privacy-policy">You agree to our friendly <a href="#">privacy policy</a>.</label>
-                    </div>
-                    <button type="submit" class="btn btn-primary">Send message</button>
-                </form>
+                </div>
             </div>
         </section>
+
+        <!-- FAQ Call to Action Section -->
+        <section class="faq-cta-section">
+             <div class="faq-cta-container">
+                <div class="avatar-group">
+                     <img src="../../images/about_marija_min.jpg" alt="Avatar of Marija" class="avatar">
+                     <img src="../../images/about_kristijan_min.jpg" alt="Avatar of Kristijan" class="avatar large">
+                     <img src="../../images/about_lea_min.jpg" alt="Avatar of Lea" class="avatar">
+                </div>
+                <h3>Have any questions?</h3>
+                <p class="page-description" style="margin: 0;">Can't find the answer you're looking for? Please chat to our friendly team.</p>
+                <a href="#" class="btn btn-primary-orange">See all FAQs</a>
+             </div>
+        </section>
     </main>
 
     <!-- START_FOOTER -->
-<footer>
-    <div class="footer-container">
-        <div class="footer-main">
-            <div class="footer-info">
-                <div class="footer-logo">
-                    <img src="../../images/13-whitelogo.png" alt="Macedonian Student Organisation in Slovenia Logo">
+    <footer>
+        <div class="footer-container">
+            <div class="footer-main">
+                <div class="footer-info">
+                    <div class="footer-logo">
+                        <img src="../../images/13-whitelogo.png" alt="Macedonian Student Organisation in Slovenia Logo">
+                    </div>
+                    <p>
+                        Masarykova cesta 24<br>
+                        1000 Ljubljana, Slovenia<br>
+                        +389 02 123 4567<br>
+                        info.msosorg@gmail.com
+                    </p>
+                    <div class="social-icons">
+                        <a href="#" aria-label="Facebook"><i class="fab fa-facebook-f"></i></a>
+                        <a href="#" aria-label="Instagram"><i class="fab fa-instagram"></i></a>
+                        <a href="#" aria-label="YouTube"><i class="fab fa-youtube"></i></a>
+                    </div>
                 </div>
-                <p>
-                    Masarykova cesta 24<br>
-                    1000 Ljubljana, Slovenia<br>
-                    +389 02 123 4567<br>
-                    info.msosorg@gmail.com
-                </p>
-                <div class="social-icons">
-                    <a href="#" aria-label="Facebook"><i class="fab fa-facebook-f"></i></a>
-                    <a href="#" aria-label="Instagram"><i class="fab fa-instagram"></i></a>
-                    <a href="#" aria-label="YouTube"><i class="fab fa-youtube"></i></a>
+                <div class="footer-links">
+                    <div class="links-column">
+                        <h4>For students</h4>
+                        <a href="#">Blog</a>
+                        <a href="#">Gallery</a>
+                        <a href="#">FAQs</a>
+                        <a href="#">Brochure</a>
+                    </div>
+                    <div class="links-column">
+                        <h4>Projects</h4>
+                        <a href="#">Upcoming</a>
+                        <a href="#">Previous</a>
+                    </div>
+                    <div class="links-column">
+                        <h4>Organisation</h4>
+                        <a href="#">About us</a>
+                        <a href="#">Contact</a>
+                        <a href="#">Documentation</a>
+                    </div>
                 </div>
             </div>
-            <div class="footer-links">
-                <div class="links-column">
-                    <h4>For students</h4>
-                    <a href="#">Blog</a>
-                    <a href="#">Gallery</a>
-                    <a href="#">FAQs</a>
-                    <a href="#">Brochure</a>
-                </div>
-                <div class="links-column">
-                    <h4>Projects</h4>
-                    <a href="#">Upcoming</a>
-                    <a href="#">Previous</a>
-                </div>
-                <div class="links-column">
-                    <h4>Organisation</h4>
-                    <a href="#">About us</a>
-                    <a href="#">Contact</a>
-                    <a href="#">Documentation</a>
+            <hr>
+            <div class="footer-bottom">
+                 <p>© MSOS org 2023 All rights reserved.</p>
+                <div class="legal-links">
+                    <a href="#">Privacy policy</a>
+                    <a href="#">Cookie Policy</a>
+                    <a href="#">Legal Terms</a>
                 </div>
             </div>
         </div>
-        <hr>
-        <div class="footer-bottom">
-             <p>© MSOS org 2023 All rights reserved.</p>
-            <div class="legal-links">
-                <a href="#">Privacy policy</a>
-                <a href="#">Cookie Policy</a>
-                <a href="#">Legal Terms</a>
-            </div>
-        </div>
-    </div>
-    <script src="../../main.js"></script>
-</footer>
-<!-- END_FOOTER -->
-
+        <script src="../../main.js"></script>
+    </footer>
+    <!-- END_FOOTER -->
     
 </body>
 </html>
\ No newline at end of file
diff --git a/images/about_kristijan.jpg b/images/about_kristijan.jpg
new file mode 100644
index 0000000..e1252b0
Binary files /dev/null and b/images/about_kristijan.jpg differ
diff --git a/images/about_kristijan_min.jpg b/images/about_kristijan_min.jpg
new file mode 100644
index 0000000..8ef12b9
Binary files /dev/null and b/images/about_kristijan_min.jpg differ
diff --git a/images/about_lea.jpg b/images/about_lea.jpg
new file mode 100644
index 0000000..15b000f
Binary files /dev/null and b/images/about_lea.jpg differ
diff --git a/images/about_lea_min.jpg b/images/about_lea_min.jpg
new file mode 100644
index 0000000..7781dac
Binary files /dev/null and b/images/about_lea_min.jpg differ
diff --git a/images/about_love_for_our_roots_ambition_for_the_future.jpg b/images/about_love_for_our_roots_ambition_for_the_future.jpg
new file mode 100644
index 0000000..25d1107
Binary files /dev/null and b/images/about_love_for_our_roots_ambition_for_the_future.jpg differ
diff --git a/images/about_marija.jpg b/images/about_marija.jpg
new file mode 100644
index 0000000..8bb7f8c
Binary files /dev/null and b/images/about_marija.jpg differ
diff --git a/images/about_marija_min.jpg b/images/about_marija_min.jpg
new file mode 100644
index 0000000..d831034
Binary files /dev/null and b/images/about_marija_min.jpg differ
diff --git a/images/about_marko.jpg b/images/about_marko.jpg
new file mode 100644
index 0000000..a9bf0e1
Binary files /dev/null and b/images/about_marko.jpg differ
diff --git a/images/about_mission.png b/images/about_mission.png
new file mode 100644
index 0000000..990cedf
Binary files /dev/null and b/images/about_mission.png differ
diff --git a/images/about_monika.jpg b/images/about_monika.jpg
new file mode 100644
index 0000000..f728f13
Binary files /dev/null and b/images/about_monika.jpg differ
diff --git a/images/about_solidarity_and_care_for_each_other.jpg b/images/about_solidarity_and_care_for_each_other.jpg
new file mode 100644
index 0000000..3b60ea3
Binary files /dev/null and b/images/about_solidarity_and_care_for_each_other.jpg differ
diff --git a/images/about_vision.png b/images/about_vision.png
new file mode 100644
index 0000000..b78d591
Binary files /dev/null and b/images/about_vision.png differ
diff --git a/images/about_volunteer_spirit.jpg b/images/about_volunteer_spirit.jpg
new file mode 100644
index 0000000..80f137c
Binary files /dev/null and b/images/about_volunteer_spirit.jpg differ
diff --git a/main.js b/main.js
index 0642253..775162f 100644
--- a/main.js
+++ b/main.js
@@ -242,7 +242,31 @@ document.addEventListener('DOMContentLoaded', function() {
 
     /**
      * ===================================================================
-     * 4. ZAGON FUNKCIJ PO NALOŽITVI STRANI
+     * 4. INTERAKTIVNA SEKCIJA "MISSION & VISION"
+     * ===================================================================
+     */
+    try {
+        const missionVisionContainer = document.getElementById('mission-vision-interactive');
+        
+        if (missionVisionContainer) {
+            const missionBox = missionVisionContainer.querySelector('.mission-box');
+            const visionBox = missionVisionContainer.querySelector('.vision-box');
+
+            missionBox.addEventListener('mouseenter', () => {
+                missionVisionContainer.classList.remove('show-vision');
+            });
+
+            visionBox.addEventListener('mouseenter', () => {
+                missionVisionContainer.classList.add('show-vision');
+            });
+        }
+    } catch(error) {
+        console.error('Error in Mission/Vision interaction setup:', error);
+    }
+
+    /**
+     * ===================================================================
+     * 5. ZAGON FUNKCIJ PO NALOŽITVI STRANI
      * ===================================================================
      */
     highlightActiveLink();