Fix mobile element ordering for workshop pages

- Added display: contents technique for flexible mobile reordering
- First workshop-section now appears directly after h2 title on mobile
- Ensures 'Komu je delavnica namenjena?' section displays correctly on delavnica-od-tujca-do-sosolca
- Mobile order: image, title, first section, benefits, other sections, PDF button

css/style.css

@@ -7669,3 +7669,64 @@ html, body {
     text-align: left !important;
   }
 }
+
+
+/* --- Sprememba vrstnega reda za DELAVNICE na mobilnih napravah --- */
+@media (max-width: 768px) {
+  /* 1. Odpremo "škatle", da lahko elemente prosto premešamo */
+  .workshop-grid {
+    display: flex !important;
+    flex-direction: column !important;
+  }
+  
+  .workshop-text, .workshop-image {
+    display: contents !important; /* To odstrani meje stolpcev na mobilniku */
+  }
+  
+  /* 2. Določimo vrstni red (ORDER) */
+  /* A) Slika in opomba pod njo - NA VRHU */
+  .workshop-image-frame {
+    order: 1 !important;
+    margin-bottom: 1rem !important;
+  }
+  
+  .workshop-image-note {
+    order: 2 !important;
+    margin-bottom: 1.5rem !important;
+  }
+  
+  /* B) Naslov in bold uvod - V SREDINI */
+  .workshop-text h2 {
+    order: 3 !important;
+    margin-top: 0 !important;
+    margin-bottom: 0.5rem !important;
+  }
+  
+  .workshop-text .workshop-lead {
+    order: 4 !important;
+    margin-bottom: 2rem !important;
+  }
+  
+  /* C) Prva sekcija (Komu je delavnica namenjena?) - TAKOJ ZA NASLOVOM */
+  .workshop-section:first-of-type {
+    order: 4 !important;
+    margin-bottom: 2rem !important;
+  }
+  
+  /* D) Rezultati - ZA PRVO SEKCIJO */
+  .workshop-benefits {
+    order: 5 !important;
+    margin-bottom: 2rem !important;
+  }
+  
+  /* E) Ostale podrobnosti in gumb - NA DNU */
+  .workshop-section {
+    order: 6 !important;
+    margin-bottom: 1rem !important;
+  }
+  
+  .pdf-button {
+    order: 7 !important;
+    margin-top: 1rem !important;
+  }
+}