update

o-nas.html

@@ -339,6 +339,125 @@ nav ul li a:hover::after {
     width: 20px;
 }
 
+/* Aktuality Section */
+.aktuality {
+    padding: 80px 0;
+    background: linear-gradient(to bottom, rgba(255, 255, 255, 0.8), var(--primary));
+}
+
+.aktuality-container {
+    max-width: 1200px;
+    margin: 0 auto;
+    padding: 0 20px;
+}
+
+.aktuality-title {
+    font-family: 'Playfair Display', serif;
+    font-size: 36px;
+    margin-bottom: 60px;
+    color: var(--accent);
+    text-align: center;
+}
+
+.aktuality-grid {
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
+    gap: 30px;
+}
+
+.aktuality-card {
+    background: linear-gradient(135deg, rgba(255, 255, 255, 0.7), rgba(245, 245, 245, 0.8));
+    backdrop-filter: blur(5px);
+    border-radius: 8px;
+    padding: 30px;
+    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
+    border: 1px solid rgba(201, 169, 95, 0.1);
+    transition: var(--transition);
+    position: relative;
+    overflow: hidden;
+}
+
+.aktuality-card:hover {
+    transform: translateY(-5px);
+    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.2);
+    border-color: rgba(201, 169, 95, 0.3);
+}
+
+.aktuality-badge {
+    position: absolute;
+    top: 15px;
+    right: 15px;
+    background: var(--accent);
+    color: var(--primary);
+    padding: 5px 12px;
+    border-radius: 20px;
+    font-size: 12px;
+    font-weight: 600;
+    text-transform: uppercase;
+}
+
+.aktuality-date {
+    color: var(--text-dark);
+    font-size: 14px;
+    margin-bottom: 15px;
+    display: flex;
+    align-items: center;
+}
+
+.aktuality-date i {
+    color: var(--accent);
+    margin-right: 8px;
+}
+
+.aktuality-card h3 {
+    font-size: 22px;
+    margin-bottom: 15px;
+    color: var(--accent);
+    line-height: 1.3;
+}
+
+.aktuality-card p {
+    font-size: 16px;
+    line-height: 1.6;
+    color: var(--text-dark);
+    margin-bottom: 20px;
+}
+
+.aktuality-link {
+    color: var(--accent);
+    text-decoration: none;
+    font-weight: 600;
+    display: inline-flex;
+    align-items: center;
+    transition: var(--transition);
+}
+
+.aktuality-link:hover {
+    transform: translateX(5px);
+}
+
+.aktuality-link i {
+    margin-left: 5px;
+    transition: var(--transition);
+}
+
+.aktuality-link:hover i {
+    transform: translateX(3px);
+}
+
+.aktuality-loading,
+.aktuality-error,
+.aktuality-empty {
+    text-align: center;
+    padding: 40px;
+    color: var(--text-dark);
+    font-size: 16px;
+}
+
+.aktuality-error {
+    color: #e74c3c;
+}
+
 /* CTA Section */
 .cta {
     padding: 80px 0;
@@ -659,6 +778,9 @@ footer::before {
     .info-grid {
         grid-template-columns: 1fr;
     }
+    .aktuality-grid {
+        grid-template-columns: 1fr;
+    }
     .footer-container {
         grid-template-columns: 1fr;
     }
@@ -799,6 +921,19 @@ footer::before {
         </div>
     </section>
 
+    <!-- Aktuality Section -->
+    <section class="aktuality">
+        <div class="aktuality-container">
+            <h2 class="aktuality-title">Aktuality</h2>
+            <div class="aktuality-grid">
+                <!-- Aktuality budou načteny z XML souboru pomocí JavaScriptu -->
+                <div class="aktuality-loading">
+                    <p>Načítám aktuality...</p>
+                </div>
+            </div>
+        </div>
+    </section>
+
     <!-- CTA Section -->
     <section class="cta">
         <div class="cta-container">
@@ -858,6 +993,7 @@ footer::before {
         </div>
     </footer>
 
+    <script src="aktuality.js"></script>
     <script>
         document.addEventListener('DOMContentLoaded', function() {
             const hamburger = document.getElementById('hamburger');