From 6059505216c2ae9e37595f2b5aec72846b01af03 Mon Sep 17 00:00:00 2001
From: kisfenyo <nagyfenyvesi.viktor@gmail.com>
Date: Sun, 11 Oct 2026 15:57:35 +0200
Subject: [PATCH] website: M3 goes live - the whole site switches to the
 controller's shell at once

Part D. Every public page now wears the controller's frame around the website's
own content. One commit, as asked: never half old, half new.

  20 pages switched (12 Hungarian incl. the hidden prices page, 8 English)
  website/preview/ deleted entirely - A, M1, M2 and M3 studies all gone
  robots.txt: the Disallow: /preview/ line removed with them
  site.css?v=22 / shell.css?v=22 on every page

PROVED before pushing, not after:
  * HEAD TAGS: title, meta description, keywords, author, robots, canonical, every
    hreflang, all seven Open Graph tags, all four Twitter tags and the JSON-LD
    captured on all 19 pages before the switch and compared after. The ONLY
    difference anywhere is the dash substitution inside the two FAQ pages'
    FAQPage JSON-LD - verified by applying the same substitution to the "before"
    copy and getting an exact match. Nothing else moved.
  * VISIBLE TEXT: identical to the live pages word for word, legal texts identical
    with no substitution permitted at all.
  * No page is left noindex (the two download pages' noindex,follow is their own,
    pre-existing and unchanged), no page mentions /preview/, every page has a
    footer, no page overflows at 390px.

THE HEAD-TAG DIFF EARNED ITS PLACE. The home page was about to ship carrying
`noindex, nofollow` from the preview, and had lost meta keywords, meta author, all
seven Open Graph tags, all four Twitter tags and the LocalBusiness JSON-LD -
because its head was hand-built while every other page carried its live one over.
The diff caught it; nothing on the rendered page would have. The generator now
uses the live head for EVERY page including the home one.

szolgaltatasok-nonpublic.html was converted too. It is in no menu and was not in
the brief's list, but leaving one page on the old chrome would have left the site
half-switched - which is the one thing part D was not allowed to do.

scripts/site_gates.py: SHELL is now the real page set; MOCKUPS is empty; gate 3's
old nav/footer loop keeps working for any page added later WITHOUT the shell, and
skips the ones that have it.
---
 scripts/site_gates.py                    |   84 +-
 website/404.html                         |  120 +-
 website/adatkezeles.html                 |  110 +-
 website/alkalmazasok.html                |  125 +-
 website/biztonsagimentes.html            |  126 +-
 website/en/apps.html                     |  121 +-
 website/en/backups.html                  |  126 +-
 website/en/contact.html                  |  132 +-
 website/en/download.html                 |  122 +-
 website/en/faq.html                      |  268 +--
 website/en/index.html                    |  691 +++----
 website/en/technology.html               |  134 +-
 website/en/testing.html                  |  160 +-
 website/feltetelek.html                  |  110 +-
 website/gyik.html                        |  268 +--
 website/index.html                       |  727 +++-----
 website/kapcsolat.html                   |  130 +-
 website/letoltes.html                    |  120 +-
 website/preview/index.html               |  432 -----
 website/preview/m1/alkalmazasok.html     | 2134 ----------------------
 website/preview/m1/hogyan.html           |   91 -
 website/preview/m1/index.html            | 1939 --------------------
 website/preview/m1/kapcsolat.html        |  123 --
 website/preview/m1/mentesek.html         |  113 --
 website/preview/m1/teszteles.html        |   93 -
 website/preview/m2/index.html            |  201 --
 website/preview/m3/404.html              |  167 --
 website/preview/m3/adatkezeles.html      |  458 -----
 website/preview/m3/alkalmazasok.html     | 1383 --------------
 website/preview/m3/biztonsagimentes.html |  374 ----
 website/preview/m3/en/apps.html          | 1383 --------------
 website/preview/m3/en/backups.html       |  374 ----
 website/preview/m3/en/contact.html       |  657 -------
 website/preview/m3/en/download.html      |  207 ---
 website/preview/m3/en/faq.html           | 1090 -----------
 website/preview/m3/en/index.html         |  371 ----
 website/preview/m3/en/technology.html    |  553 ------
 website/preview/m3/en/testing.html       |  333 ----
 website/preview/m3/feltetelek.html       |  312 ----
 website/preview/m3/gyik.html             | 1090 -----------
 website/preview/m3/index.html            |  327 ----
 website/preview/m3/kapcsolat.html        |  657 -------
 website/preview/m3/letoltes.html         |  207 ---
 website/preview/m3/technologiak.html     |  553 ------
 website/preview/m3/teszteles.html        |  324 ----
 website/preview/mockup.css               | 1309 -------------
 website/robots.txt                       |    3 -
 website/szolgaltatasok-nonpublic.html    |  172 +-
 website/technologiak.html                |  134 +-
 website/teszteles.html                   |  158 +-
 50 files changed, 2211 insertions(+), 19185 deletions(-)
 delete mode 100644 website/preview/index.html
 delete mode 100644 website/preview/m1/alkalmazasok.html
 delete mode 100644 website/preview/m1/hogyan.html
 delete mode 100644 website/preview/m1/index.html
 delete mode 100644 website/preview/m1/kapcsolat.html
 delete mode 100644 website/preview/m1/mentesek.html
 delete mode 100644 website/preview/m1/teszteles.html
 delete mode 100644 website/preview/m2/index.html
 delete mode 100644 website/preview/m3/404.html
 delete mode 100644 website/preview/m3/adatkezeles.html
 delete mode 100644 website/preview/m3/alkalmazasok.html
 delete mode 100644 website/preview/m3/biztonsagimentes.html
 delete mode 100644 website/preview/m3/en/apps.html
 delete mode 100644 website/preview/m3/en/backups.html
 delete mode 100644 website/preview/m3/en/contact.html
 delete mode 100644 website/preview/m3/en/download.html
 delete mode 100644 website/preview/m3/en/faq.html
 delete mode 100644 website/preview/m3/en/index.html
 delete mode 100644 website/preview/m3/en/technology.html
 delete mode 100644 website/preview/m3/en/testing.html
 delete mode 100644 website/preview/m3/feltetelek.html
 delete mode 100644 website/preview/m3/gyik.html
 delete mode 100644 website/preview/m3/index.html
 delete mode 100644 website/preview/m3/kapcsolat.html
 delete mode 100644 website/preview/m3/letoltes.html
 delete mode 100644 website/preview/m3/technologiak.html
 delete mode 100644 website/preview/m3/teszteles.html
 delete mode 100644 website/preview/mockup.css

diff --git a/scripts/site_gates.py b/scripts/site_gates.py
index e58a96bd..dbd4c401 100644
--- a/scripts/site_gates.py
+++ b/scripts/site_gates.py
@@ -89,57 +89,35 @@ URL = {"index.html": "/", "alkalmazasok.html": "/alkalmazasok", "technologiak.ht
 # here - BOM, emoji, nav/footer, globe structure, analytics, CDN, tokens, cache-busting, dash-lang,
 # viewer, tail. BOTH this entry and the file are removed in the same commit as the switch, and the
 # English twin is written then, as a twin.
-NO_TWIN = {"szolgaltatasok-nonpublic.html", "404.html", "adatkezeles.html", "feltetelek.html",
-           os.path.join("preview", "index.html")}
+NO_TWIN = {"szolgaltatasok-nonpublic.html", "404.html", "adatkezeles.html", "feltetelek.html"}
 
-# MOCKUPS (2026-10-11) — throwaway design studies under /preview/, noindex and already covered by
-# robots.txt's Disallow: /preview/. They deliberately do NOT wear the site's chrome: that is the whole
-# question they exist to answer (should the website look like the box's dashboard?), so they carry the
-# controller's sidebar shell instead of the website's <nav>/<footer>.
-#
-# They are listed here so the R-423 walk still SEES them, and they keep every check that is about
-# correctness: BOM, emoji, banned strings and CDN hosts, no <style> block, cache-busting, <html lang>,
-# nothing after </html>, dashboard-picture language, and the picture-viewer rules. What they are
-# excluded from is exactly the three checks about site-chrome consistency, each of which a mockup
-# must fail by construction:
-#   - gate 3  nav/footer identical to index.html   (a mockup has a sidebar, not that nav)
-#   - gate 13 the NO_TWIN globe structure          (no language globe in a Hungarian-only study)
-#   - gate 4  analytics                            (deliberate: a hidden mockup must not pollute the
-#                                                   real stats, same reason as the prices page)
-# DELETE THIS SET AND THE DIRECTORIES TOGETHER once the operator has picked a direction.
-MOCKUPS = {os.path.join("preview", "m1", "index.html"),
-           os.path.join("preview", "m1", "alkalmazasok.html"),
-           os.path.join("preview", "m1", "mentesek.html"),
-           os.path.join("preview", "m1", "hogyan.html"),
-           os.path.join("preview", "m1", "teszteles.html"),
-           os.path.join("preview", "m1", "kapcsolat.html"),
-           os.path.join("preview", "m2", "index.html")}
+MOCKUPS = set()   # the design studies were deleted with website/preview/ at the M3 switch
 
-# SHELL (2026-10-11, M3) — pages that wear the controller's frame instead of the website's
-# <nav>/<footer>. They are staged under /preview/m3/ until the operator's go, and at the switch
-# every live page becomes one of these. They keep every other check; what changes for them is
-# WHICH block has to be identical across the set: the sidebar, not the nav and footer. Gate 3
-# below does both, so there is one identity gate rather than two.
+# SHELL (2026-10-11, M3) — every public page now wears the controller's frame instead of the
+# website's <nav>/<footer>. Gate 3 therefore checks the SIDEBAR and the FOOTER across this set
+# instead of the old nav+footer: the site is static with no build step, so the shell is
+# duplicated into each page, and this is what keeps the duplication honest.
 SHELL = {
-    os.path.join("preview", "m3", 'index.html'),
-    os.path.join("preview", "m3", 'alkalmazasok.html'),
-    os.path.join("preview", "m3", 'technologiak.html'),
-    os.path.join("preview", "m3", 'biztonsagimentes.html'),
-    os.path.join("preview", "m3", 'gyik.html'),
-    os.path.join("preview", "m3", 'teszteles.html'),
-    os.path.join("preview", "m3", 'kapcsolat.html'),
-    os.path.join("preview", "m3", 'letoltes.html'),
-    os.path.join("preview", "m3", 'adatkezeles.html'),
-    os.path.join("preview", "m3", 'feltetelek.html'),
-    os.path.join("preview", "m3", '404.html'),
-    os.path.join("preview", "m3", "en", 'index.html'),
-    os.path.join("preview", "m3", "en", 'apps.html'),
-    os.path.join("preview", "m3", "en", 'technology.html'),
-    os.path.join("preview", "m3", "en", 'backups.html'),
-    os.path.join("preview", "m3", "en", 'faq.html'),
-    os.path.join("preview", "m3", "en", 'testing.html'),
-    os.path.join("preview", "m3", "en", 'contact.html'),
-    os.path.join("preview", "m3", "en", 'download.html'),
+    'szolgaltatasok-nonpublic.html',
+    'index.html',
+    'alkalmazasok.html',
+    'technologiak.html',
+    'biztonsagimentes.html',
+    'gyik.html',
+    'teszteles.html',
+    'kapcsolat.html',
+    'letoltes.html',
+    'adatkezeles.html',
+    'feltetelek.html',
+    '404.html',
+    os.path.join("en", 'index.html'),
+    os.path.join("en", 'apps.html'),
+    os.path.join("en", 'technology.html'),
+    os.path.join("en", 'backups.html'),
+    os.path.join("en", 'faq.html'),
+    os.path.join("en", 'testing.html'),
+    os.path.join("en", 'contact.html'),
+    os.path.join("en", 'download.html'),
 }
 
 PAGES = list(TWINS) + list(TWINS.values()) + sorted(NO_TWIN) + sorted(MOCKUPS) + sorted(SHELL)
@@ -253,8 +231,14 @@ if total_emoji:
     print("  emoji total: %d" % total_emoji)
 
 # gate 3: nav + footer consistency, per language set
-for lang, members, ref in (("hu", HU_PAGES, "index.html"), ("en", EN_PAGES, os.path.join("en", "index.html"))):
-    if ref not in pages:
+# Pages still wearing the website's own <nav>/<footer>. After the M3 switch that is nothing,
+# and the loop is a no-op; it stays because a page added later without the shell must still be
+# checked against its language's reference rather than silently skipped.
+_OLD_CHROME_HU = sorted(HU_PAGES - SHELL)
+_OLD_CHROME_EN = sorted(EN_PAGES - SHELL)
+for lang, members, ref in (("hu", _OLD_CHROME_HU, "index.html"),
+                           ("en", _OLD_CHROME_EN, os.path.join("en", "index.html"))):
+    if ref not in pages or not members:
         continue
     blocks = {}
     for p in sorted(members, key=lambda x: (x != ref, x)):
diff --git a/website/404.html b/website/404.html
index d1e88899..80b43a8b 100644
--- a/website/404.html
+++ b/website/404.html
@@ -1,50 +1,69 @@
 <!DOCTYPE html>
-<html lang="hu">
+<html lang="hu" class="no-js">
 <head>
+    <script>document.documentElement.className=document.documentElement.className.replace('no-js','js');</script>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Az oldal nem található | Felhom.eu</title>
     <meta name="robots" content="noindex, follow">
     <!-- shared assets: bump ?v= together on any site.css/icons.svg change -->
-    <link rel="stylesheet" href="/assets/site.css?v=21">
+    <link rel="stylesheet" href="/assets/site.css?v=22">
+    <link rel="stylesheet" href="/assets/shell.css?v=22">
     <link rel="icon" type="image/png" href="/assets/logo_favicon_2.svg">
     <script defer src="https://stats.felhom.eu/script.js" data-website-id="d419db57-5e1c-48df-bdb3-c29f25fb1661"></script>
 </head>
-<body class="page-404">
-    <nav>
-        <div class="container">
-            <a href="/" class="logo">
-                <img class="logo-mark" src="/assets/logo-mark.svg" alt="" aria-hidden="true">
-                <img class="logo-word" src="/assets/logo-wordmark.png" alt="felhom.eu">
+<body class="shell page-404">
+    <header class="mobile-topbar">
+        <a href="/" class="mobile-topbar-logo"><img src="/assets/logo_notext_white.svg" alt="Felhom.eu"></a>
+        <button type="button" class="nav-burger" id="navBurger" aria-expanded="false" aria-controls="sidebar" aria-label="Menü">
+            <span class="hamburger-box"><span class="hamburger-line"></span><span class="hamburger-line"></span><span class="hamburger-line"></span></span>
+        </button>
+    </header>
+    <div class="nav-backdrop" id="navBackdrop" hidden></div>
+    <nav class="sidebar" id="sidebar">
+        <div class="sidebar-header">
+            <a href="/" class="sidebar-logo-link">
+                <img src="/assets/logo_notext_white.svg" alt="" class="sidebar-logo" aria-hidden="true">
+                <img src="/assets/logo-wordmark.png" alt="felhom.eu" class="sidebar-word">
             </a>
-            <ul class="nav-links">
-                <li><a href="/#szolgaltatasok">Szolgáltatások</a></li>
-                <li><a href="/alkalmazasok">Alkalmazások</a></li>
-                <li><a href="/technologiak">Technológiák</a></li>
-                <li><a href="/biztonsagimentes">Mentések</a></li>
-                <li><a href="/gyik">GYIK</a></li>
-                <li><a href="/kapcsolat">Kapcsolat</a></li>
-                <li class="lang-globe-li"><details class="lang-globe"><summary class="lang-globe-btn" aria-label="Nyelv" title="Nyelv"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/" lang="hu" hreflang="hu" class="lang-globe-item current" aria-current="true">Magyar</a></li><li><a href="/en/" lang="en" hreflang="en" class="lang-globe-item">English</a></li></ul></details></li>
+        </div>
+        <ul class="nav-links">
+                <li><a href="/"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg>Kezdőlap</a></li>
+                <li><a href="/#szolgaltatasok"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rocket"/></svg>Szolgáltatások</a></li>
+                <li class="nav-group">
+                    <button type="button" class="nav-group-toggle" aria-expanded="false" aria-controls="nav-group-apps"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg>Alkalmazások<svg class="ico nav-chevron" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chevron-down"/></svg></button>
+                    <ul id="nav-group-apps" class="nav-links nav-links-sub nav-links-nested">
+                        <li><a href="/alkalmazasok">Minden alkalmazás</a></li>
+                        <li><a href="/alkalmazasok#fajlkezeles-irodai">Fájlkezelés &amp; Irodai</a></li>
+                        <li><a href="/alkalmazasok#media-szorakozas">Média &amp; Szórakozás</a></li>
+                        <li><a href="/alkalmazasok#otthon-eletmod">Otthon &amp; Életmód</a></li>
+                        <li><a href="/alkalmazasok#produktivitas-tudaskezeles">Produktivitás &amp; Tudáskezelés</a></li>
+                        <li><a href="/alkalmazasok#rendszer-fejlesztes">Rendszer &amp; Fejlesztés</a></li>
+                    </ul>
+                </li>
+                <li><a href="/technologiak"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg>Technológiák</a></li>
+                <li><a href="/biztonsagimentes"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg>Biztonsági mentés</a></li>
+        </ul>
+        <div class="sidebar-bottom">
+            <a href="/teszteles" class="btn btn-outline sidebar-cta">Jelentkezem tesztelőnek →</a>
+            <div class="nav-group-label">A Felhomról</div>
+            <ul class="nav-links nav-links-sub">
+                    <li><a href="/#hogyan-mukodik">Hogyan működik</a></li>
+                    <li><a href="/gyik">GYIK</a></li>
+                    <li><a href="/kapcsolat">Kapcsolat</a></li>
             </ul>
-            <button class="hamburger" id="hamburger" aria-label="Menü megnyitása" aria-expanded="false">
-                <span class="hamburger-box">
-                    <span class="hamburger-line"></span>
-                    <span class="hamburger-line"></span>
-                    <span class="hamburger-line"></span>
-                </span>
-            </button>
+            <div class="sidebar-footer">
+                <details class="lang-globe"><summary class="lang-globe-btn" aria-label="Nyelv" title="Nyelv"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="#" lang="hu" hreflang="hu" class="lang-globe-item current" aria-current="true">Magyar</a></li><li><a href="#" lang="en" hreflang="en" class="lang-globe-item">English</a></li></ul></details>
+            </div>
         </div>
     </nav>
-    <div class="mobile-overlay" id="mobileOverlay"></div>
-
-    <main>
-        <section class="page-header">
-            <div class="container">
+<main class="content">
+                <div class="page-header">
                 <h1>Ez az oldal <span>nem található</span></h1>
-                <p>A keresett cím nem létezik, vagy elköltözött. A kezdőlapról mindent elérsz.</p>
-                <p lang="en">This page does not exist. <a href="/en/">Go to the English home page</a>.</p>
             </div>
-        </section>
+                <p class="page-lede">A keresett cím nem létezik, vagy elköltözött. A kezdőlapról mindent elérsz.</p>
+                <p lang="en">This page does not exist. <a href="/en/">Go to the English home page</a>.</p>
+
         <section class="content-section">
             <div class="container">
                 <div class="apps-cta">
@@ -53,13 +72,6 @@
             </div>
         </section>
     </main>
-
-    <footer>
-        <div class="container">
-            <p>© 2026 felhom.eu – Saját felhőd, saját szabályaid</p>
-            <p class="footer-legal">Üzemeltető: Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Adatkezelési tájékoztató</a> · <a href="/feltetelek">Feltételek</a></p>
-        </div>
-    </footer>
     <script>
     (function() {
         var hamburger = document.getElementById('hamburger');
@@ -121,5 +133,35 @@
         });
     })();
     </script>
+<footer>
+        <div class="container">
+            <p>© 2026 felhom.eu – Saját felhőd, saját szabályaid</p>
+            <p class="footer-legal">Üzemeltető: Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Adatkezelési tájékoztató</a> · <a href="/feltetelek">Feltételek</a></p>
+        </div>
+    </footer>
+    <script>
+    (function(){
+        var b=document.getElementById('navBurger'),s=document.getElementById('sidebar'),k=document.getElementById('navBackdrop');
+        if(!b||!s||!k)return;
+        function open(){s.classList.add('is-open');k.hidden=false;document.body.classList.add('nav-open');b.setAttribute('aria-expanded','true');}
+        function close(){s.classList.remove('is-open');k.hidden=true;document.body.classList.remove('nav-open');b.setAttribute('aria-expanded','false');}
+        b.addEventListener('click',function(){s.classList.contains('is-open')?close():open();});
+        k.addEventListener('click',close);
+        document.addEventListener('keydown',function(e){if(e.key==='Escape'&&s.classList.contains('is-open')){close();b.focus();}});
+        s.querySelectorAll('a').forEach(function(l){l.addEventListener('click',close);});
+        window.addEventListener('resize',function(){if(window.innerWidth>768)close();});
+    })();
+    document.addEventListener('click',function(e){
+        var btn=e.target.closest?e.target.closest('.nav-group-toggle'):null;
+        if(!btn)return;
+        var g=btn.closest('.nav-group');if(!g)return;
+        var willOpen=!g.classList.contains('is-open');
+        document.querySelectorAll('.nav-group.is-open').forEach(function(x){
+            x.classList.remove('is-open');
+            var t=x.querySelector('.nav-group-toggle');if(t)t.setAttribute('aria-expanded','false');
+        });
+        if(willOpen){g.classList.add('is-open');btn.setAttribute('aria-expanded','true');}
+    });
+    </script>
 </body>
-</html>
\ No newline at end of file
+</html>
diff --git a/website/adatkezeles.html b/website/adatkezeles.html
index d944210c..4cada42a 100644
--- a/website/adatkezeles.html
+++ b/website/adatkezeles.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html lang="hu">
+<html lang="hu" class="no-js">
 <head>
+    <script>document.documentElement.className=document.documentElement.className.replace('no-js','js');</script>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Adatkezelési tájékoztató | Felhom.eu</title>
@@ -19,36 +20,58 @@
     <meta property="og:site_name" content="Felhom.eu">
 
     <!-- shared assets: bump ?v= together on any site.css/icons.svg change -->
-    <link rel="stylesheet" href="/assets/site.css?v=21">
+    <link rel="stylesheet" href="/assets/site.css?v=22">
+    <link rel="stylesheet" href="/assets/shell.css?v=22">
     <link rel="icon" type="image/png" href="/assets/logo_favicon_2.svg">
     <script defer src="https://stats.felhom.eu/script.js" data-website-id="d419db57-5e1c-48df-bdb3-c29f25fb1661"></script>
 </head>
-<body class="page-adatkezeles">
-    <nav>
-        <div class="container">
-            <a href="/" class="logo">
-                <img class="logo-mark" src="/assets/logo-mark.svg" alt="" aria-hidden="true">
-                <img class="logo-word" src="/assets/logo-wordmark.png" alt="felhom.eu">
+<body class="shell page-adatkezeles">
+    <header class="mobile-topbar">
+        <a href="/" class="mobile-topbar-logo"><img src="/assets/logo_notext_white.svg" alt="Felhom.eu"></a>
+        <button type="button" class="nav-burger" id="navBurger" aria-expanded="false" aria-controls="sidebar" aria-label="Menü">
+            <span class="hamburger-box"><span class="hamburger-line"></span><span class="hamburger-line"></span><span class="hamburger-line"></span></span>
+        </button>
+    </header>
+    <div class="nav-backdrop" id="navBackdrop" hidden></div>
+    <nav class="sidebar" id="sidebar">
+        <div class="sidebar-header">
+            <a href="/" class="sidebar-logo-link">
+                <img src="/assets/logo_notext_white.svg" alt="" class="sidebar-logo" aria-hidden="true">
+                <img src="/assets/logo-wordmark.png" alt="felhom.eu" class="sidebar-word">
             </a>
-            <ul class="nav-links">
-                <li><a href="/#szolgaltatasok">Szolgáltatások</a></li>
-                <li><a href="/alkalmazasok">Alkalmazások</a></li>
-                <li><a href="/technologiak">Technológiák</a></li>
-                <li><a href="/biztonsagimentes">Mentések</a></li>
-                <li><a href="/gyik">GYIK</a></li>
-                <li><a href="/kapcsolat">Kapcsolat</a></li>
-                <li class="lang-globe-li"><details class="lang-globe"><summary class="lang-globe-btn" aria-label="Nyelv" title="Nyelv"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/adatkezeles" lang="hu" hreflang="hu" class="lang-globe-item current" aria-current="true">Magyar</a></li><li><a href="/en/" lang="en" hreflang="en" class="lang-globe-item">English</a></li></ul></details></li>
+        </div>
+        <ul class="nav-links">
+                <li><a href="/"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg>Kezdőlap</a></li>
+                <li><a href="/#szolgaltatasok"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rocket"/></svg>Szolgáltatások</a></li>
+                <li class="nav-group">
+                    <button type="button" class="nav-group-toggle" aria-expanded="false" aria-controls="nav-group-apps"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg>Alkalmazások<svg class="ico nav-chevron" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chevron-down"/></svg></button>
+                    <ul id="nav-group-apps" class="nav-links nav-links-sub nav-links-nested">
+                        <li><a href="/alkalmazasok">Minden alkalmazás</a></li>
+                        <li><a href="/alkalmazasok#fajlkezeles-irodai">Fájlkezelés &amp; Irodai</a></li>
+                        <li><a href="/alkalmazasok#media-szorakozas">Média &amp; Szórakozás</a></li>
+                        <li><a href="/alkalmazasok#otthon-eletmod">Otthon &amp; Életmód</a></li>
+                        <li><a href="/alkalmazasok#produktivitas-tudaskezeles">Produktivitás &amp; Tudáskezelés</a></li>
+                        <li><a href="/alkalmazasok#rendszer-fejlesztes">Rendszer &amp; Fejlesztés</a></li>
+                    </ul>
+                </li>
+                <li><a href="/technologiak"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg>Technológiák</a></li>
+                <li><a href="/biztonsagimentes"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg>Biztonsági mentés</a></li>
+        </ul>
+        <div class="sidebar-bottom">
+            <a href="/teszteles" class="btn btn-outline sidebar-cta">Jelentkezem tesztelőnek →</a>
+            <div class="nav-group-label">A Felhomról</div>
+            <ul class="nav-links nav-links-sub">
+                    <li><a href="/#hogyan-mukodik">Hogyan működik</a></li>
+                    <li><a href="/gyik">GYIK</a></li>
+                    <li><a href="/kapcsolat">Kapcsolat</a></li>
             </ul>
-            <button class="hamburger" id="hamburger" aria-label="Menü megnyitása" aria-expanded="false">
-                <span class="hamburger-box">
-                    <span class="hamburger-line"></span>
-                    <span class="hamburger-line"></span>
-                    <span class="hamburger-line"></span>
-                </span>
-            </button>
+            <div class="sidebar-footer">
+                <details class="lang-globe"><summary class="lang-globe-btn" aria-label="Nyelv" title="Nyelv"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/adatkezeles" lang="hu" hreflang="hu" class="lang-globe-item current" aria-current="true">Magyar</a></li><li><a href="#" lang="en" hreflang="en" class="lang-globe-item">English</a></li></ul></details>
+            </div>
         </div>
     </nav>
-    <div class="mobile-overlay" id="mobileOverlay"></div>
+<main class="content">
+
 
         <header class="page-header">
         <div class="container">
@@ -339,12 +362,6 @@
 
         </div>
     </section>
-    <footer>
-        <div class="container">
-            <p>© 2026 felhom.eu – Saját felhőd, saját szabályaid</p>
-            <p class="footer-legal">Üzemeltető: Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Adatkezelési tájékoztató</a> · <a href="/feltetelek">Feltételek</a></p>
-        </div>
-    </footer>
     <script>
     (function() {
         var hamburger = document.getElementById('hamburger');
@@ -406,5 +423,36 @@
         });
     })();
     </script>
+<footer>
+        <div class="container">
+            <p>© 2026 felhom.eu – Saját felhőd, saját szabályaid</p>
+            <p class="footer-legal">Üzemeltető: Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Adatkezelési tájékoztató</a> · <a href="/feltetelek">Feltételek</a></p>
+        </div>
+    </footer>
+    </main>
+    <script>
+    (function(){
+        var b=document.getElementById('navBurger'),s=document.getElementById('sidebar'),k=document.getElementById('navBackdrop');
+        if(!b||!s||!k)return;
+        function open(){s.classList.add('is-open');k.hidden=false;document.body.classList.add('nav-open');b.setAttribute('aria-expanded','true');}
+        function close(){s.classList.remove('is-open');k.hidden=true;document.body.classList.remove('nav-open');b.setAttribute('aria-expanded','false');}
+        b.addEventListener('click',function(){s.classList.contains('is-open')?close():open();});
+        k.addEventListener('click',close);
+        document.addEventListener('keydown',function(e){if(e.key==='Escape'&&s.classList.contains('is-open')){close();b.focus();}});
+        s.querySelectorAll('a').forEach(function(l){l.addEventListener('click',close);});
+        window.addEventListener('resize',function(){if(window.innerWidth>768)close();});
+    })();
+    document.addEventListener('click',function(e){
+        var btn=e.target.closest?e.target.closest('.nav-group-toggle'):null;
+        if(!btn)return;
+        var g=btn.closest('.nav-group');if(!g)return;
+        var willOpen=!g.classList.contains('is-open');
+        document.querySelectorAll('.nav-group.is-open').forEach(function(x){
+            x.classList.remove('is-open');
+            var t=x.querySelector('.nav-group-toggle');if(t)t.setAttribute('aria-expanded','false');
+        });
+        if(willOpen){g.classList.add('is-open');btn.setAttribute('aria-expanded','true');}
+    });
+    </script>
 </body>
-</html>
\ No newline at end of file
+</html>
diff --git a/website/alkalmazasok.html b/website/alkalmazasok.html
index a657b2af..442022c6 100644
--- a/website/alkalmazasok.html
+++ b/website/alkalmazasok.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html lang="hu">
+<html lang="hu" class="no-js">
 <head>
+    <script>document.documentElement.className=document.documentElement.className.replace('no-js','js');</script>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Telepíthető alkalmazások — 58 app otthoni szerverre | Felhom.eu</title>
@@ -43,42 +44,62 @@
     }
     </script>
     <!-- shared assets: bump ?v= together on any site.css/icons.svg change -->
-    <link rel="stylesheet" href="/assets/site.css?v=21">
+    <link rel="stylesheet" href="/assets/site.css?v=22">
+    <link rel="stylesheet" href="/assets/shell.css?v=22">
     <link rel="icon" type="image/png" href="/assets/logo_favicon_2.svg">
     <script defer src="/assets/gallery.js?v=2"></script>
     <script defer src="https://stats.felhom.eu/script.js" data-website-id="d419db57-5e1c-48df-bdb3-c29f25fb1661"></script>
 </head>
-<body class="page-alkalmazasok">
-    <nav>
-        <div class="container">
-            <a href="/" class="logo">
-                <img class="logo-mark" src="/assets/logo-mark.svg" alt="" aria-hidden="true">
-                <img class="logo-word" src="/assets/logo-wordmark.png" alt="felhom.eu">
+<body class="shell page-alkalmazasok">
+    <header class="mobile-topbar">
+        <a href="/" class="mobile-topbar-logo"><img src="/assets/logo_notext_white.svg" alt="Felhom.eu"></a>
+        <button type="button" class="nav-burger" id="navBurger" aria-expanded="false" aria-controls="sidebar" aria-label="Menü">
+            <span class="hamburger-box"><span class="hamburger-line"></span><span class="hamburger-line"></span><span class="hamburger-line"></span></span>
+        </button>
+    </header>
+    <div class="nav-backdrop" id="navBackdrop" hidden></div>
+    <nav class="sidebar" id="sidebar">
+        <div class="sidebar-header">
+            <a href="/" class="sidebar-logo-link">
+                <img src="/assets/logo_notext_white.svg" alt="" class="sidebar-logo" aria-hidden="true">
+                <img src="/assets/logo-wordmark.png" alt="felhom.eu" class="sidebar-word">
             </a>
-            <ul class="nav-links">
-                <li><a href="/#szolgaltatasok">Szolgáltatások</a></li>
-                <li><a href="/alkalmazasok" class="active">Alkalmazások</a></li>
-                <li><a href="/technologiak">Technológiák</a></li>
-                <li><a href="/biztonsagimentes">Mentések</a></li>
-                <li><a href="/gyik">GYIK</a></li>
-                <li><a href="/kapcsolat">Kapcsolat</a></li>
-                <li class="lang-globe-li"><details class="lang-globe"><summary class="lang-globe-btn" aria-label="Nyelv" title="Nyelv"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/alkalmazasok" lang="hu" hreflang="hu" class="lang-globe-item current" aria-current="true">Magyar</a></li><li><a href="/en/apps" lang="en" hreflang="en" class="lang-globe-item">English</a></li></ul></details></li>
+        </div>
+        <ul class="nav-links">
+                <li><a href="/"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg>Kezdőlap</a></li>
+                <li><a href="/#szolgaltatasok"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rocket"/></svg>Szolgáltatások</a></li>
+                <li class="nav-group is-open">
+                    <button type="button" class="nav-group-toggle active" aria-expanded="true" aria-controls="nav-group-apps"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg>Alkalmazások<svg class="ico nav-chevron" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chevron-down"/></svg></button>
+                    <ul id="nav-group-apps" class="nav-links nav-links-sub nav-links-nested">
+                        <li><a href="/alkalmazasok">Minden alkalmazás</a></li>
+                        <li><a href="/alkalmazasok#fajlkezeles-irodai">Fájlkezelés &amp; Irodai</a></li>
+                        <li><a href="/alkalmazasok#media-szorakozas">Média &amp; Szórakozás</a></li>
+                        <li><a href="/alkalmazasok#otthon-eletmod">Otthon &amp; Életmód</a></li>
+                        <li><a href="/alkalmazasok#produktivitas-tudaskezeles">Produktivitás &amp; Tudáskezelés</a></li>
+                        <li><a href="/alkalmazasok#rendszer-fejlesztes">Rendszer &amp; Fejlesztés</a></li>
+                    </ul>
+                </li>
+                <li><a href="/technologiak"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg>Technológiák</a></li>
+                <li><a href="/biztonsagimentes"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg>Biztonsági mentés</a></li>
+        </ul>
+        <div class="sidebar-bottom">
+            <a href="/teszteles" class="btn btn-outline sidebar-cta">Jelentkezem tesztelőnek →</a>
+            <div class="nav-group-label">A Felhomról</div>
+            <ul class="nav-links nav-links-sub">
+                    <li><a href="/#hogyan-mukodik">Hogyan működik</a></li>
+                    <li><a href="/gyik">GYIK</a></li>
+                    <li><a href="/kapcsolat">Kapcsolat</a></li>
             </ul>
-            <button class="hamburger" id="hamburger" aria-label="Menü megnyitása" aria-expanded="false">
-                <span class="hamburger-box">
-                    <span class="hamburger-line"></span>
-                    <span class="hamburger-line"></span>
-                    <span class="hamburger-line"></span>
-                </span>
-            </button>
+            <div class="sidebar-footer">
+                <details class="lang-globe"><summary class="lang-globe-btn" aria-label="Nyelv" title="Nyelv"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/alkalmazasok" lang="hu" hreflang="hu" class="lang-globe-item current" aria-current="true">Magyar</a></li><li><a href="/en/apps" lang="en" hreflang="en" class="lang-globe-item">English</a></li></ul></details>
+            </div>
         </div>
     </nav>
-    <div class="mobile-overlay" id="mobileOverlay"></div>
-    <main>
-        <section class="page-header">
-            <div class="container">
+<main class="content">
+                <div class="page-header">
                 <h1>Telepíthető <span>Alkalmazások</span></h1>
-                <p>Válassz 58 alkalmazás közül. Szinte mind ingyenes, nyílt forráskódú szoftver, és mind a saját szervereden fut.</p>
+            </div>
+                <p class="page-lede">Válassz 58 alkalmazás közül. Szinte mind ingyenes, nyílt forráskódú szoftver, és mind a saját szervereden fut.</p>
                 <div class="disclaimer-banner">
                     <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-info"/></svg> Fontos tudnivalók</h3>
                     <ul>
@@ -88,8 +109,7 @@
                         <li>Ha egy alkalmazás hiányzik, megnézzük, felvehető-e a katalógusba – <a href="/kapcsolat">kérdezz bátran!</a></li>
                     </ul>
                 </div>
-            </div>
-        </section>
+
         <section class="apps-section">
             <div class="container">
 
@@ -587,7 +607,7 @@
                                 <div class="app-title-area"><h3>Mealie</h3><span class="app-tagline">Receptek és étkezésterv</span></div>
                             </div>
                             <div class="app-card-body">
-                                <p class="app-description">Receptkezelő és étkezéstervező a családnak. Receptek importálása weboldalakról, heti menü és bevásárlólista, megosztás a családtagokkal — magyar felülettel is.</p>
+                                <p class="app-description">Receptkezelő és étkezéstervező a családnak. Receptek importálása weboldalakról, heti menü és bevásárlólista, megosztás a családtagokkal – magyar felülettel is.</p>
                                 <div class="app-features"><span class="app-feature">Recept import</span><span class="app-feature">Heti menü</span><span class="app-feature">Bevásárlólista</span><span class="app-feature">Magyar felület</span></div>
                                 <a href="/assets/mealie-screenshot-1.webp" data-gallery="mealie" class="app-shot-link"><img src="/assets/mealie-screenshot-1.webp" alt="Mealie screenshot" class="app-screenshot"></a>
                                 <a href="/assets/mealie-screenshot-2.webp" data-gallery="mealie" data-alt="Mealie screenshot 2" hidden></a>
@@ -605,7 +625,7 @@
                                 <div class="app-title-area"><h3>Recipe Importer</h3><span class="app-tagline">Magyar receptoldalakról</span></div>
                             </div>
                             <div class="app-card-body">
-                                <p class="app-description">Receptek importálása hat magyar oldalról (mindmegette.hu, streetkitchen.hu, nosalty.hu, sobors.hu, kiskegyed.hu, gastrohobbi.hu) Mealie-be és Tandoorba — egyenként vagy tömegesen, importálás előtti szerkesztéssel.</p>
+                                <p class="app-description">Receptek importálása hat magyar oldalról (mindmegette.hu, streetkitchen.hu, nosalty.hu, sobors.hu, kiskegyed.hu, gastrohobbi.hu) Mealie-be és Tandoorba – egyenként vagy tömegesen, importálás előtti szerkesztéssel.</p>
                                 <div class="app-features"><span class="app-feature">6 magyar oldal</span><span class="app-feature">Tömeges import</span><span class="app-feature">Mealie</span><span class="app-feature">Tandoor</span></div>
                                 <a href="/assets/recipe-importer-screenshot-1.webp" data-gallery="recipe-importer" class="app-shot-link"><img src="/assets/recipe-importer-screenshot-1.webp" alt="Recipe Importer screenshot" class="app-screenshot"></a>
                                 <a href="/assets/recipe-importer-screenshot-2.webp" data-gallery="recipe-importer" data-alt="Recipe Importer screenshot 2" hidden></a>
@@ -1262,19 +1282,12 @@
         <section class="cta-section">
             <div class="container">
                 <h2>Nem találod amit keresel?</h2>
-                <p>Ez a teljes katalógus. Ha van egy konkrét igényed, keress minket — megnézzük, felvehető-e a megfelelő alkalmazás.</p>
+                <p>Ez a teljes katalógus. Ha van egy konkrét igényed, keress minket – megnézzük, felvehető-e a megfelelő alkalmazás.</p>
                 <a href="/kapcsolat" class="cta-button">Kapcsolatfelvétel →</a>
             </div>
         </section>
     </main>
 
-    <footer>
-        <div class="container">
-            <p>© 2026 felhom.eu – Saját felhőd, saját szabályaid</p>
-            <p class="footer-legal">Üzemeltető: Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Adatkezelési tájékoztató</a> · <a href="/feltetelek">Feltételek</a></p>
-        </div>
-    </footer>
-
     <script>
     (function() {
         var hamburger = document.getElementById('hamburger');
@@ -1336,5 +1349,35 @@
         });
     })();
     </script>
+<footer>
+        <div class="container">
+            <p>© 2026 felhom.eu – Saját felhőd, saját szabályaid</p>
+            <p class="footer-legal">Üzemeltető: Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Adatkezelési tájékoztató</a> · <a href="/feltetelek">Feltételek</a></p>
+        </div>
+    </footer>
+    <script>
+    (function(){
+        var b=document.getElementById('navBurger'),s=document.getElementById('sidebar'),k=document.getElementById('navBackdrop');
+        if(!b||!s||!k)return;
+        function open(){s.classList.add('is-open');k.hidden=false;document.body.classList.add('nav-open');b.setAttribute('aria-expanded','true');}
+        function close(){s.classList.remove('is-open');k.hidden=true;document.body.classList.remove('nav-open');b.setAttribute('aria-expanded','false');}
+        b.addEventListener('click',function(){s.classList.contains('is-open')?close():open();});
+        k.addEventListener('click',close);
+        document.addEventListener('keydown',function(e){if(e.key==='Escape'&&s.classList.contains('is-open')){close();b.focus();}});
+        s.querySelectorAll('a').forEach(function(l){l.addEventListener('click',close);});
+        window.addEventListener('resize',function(){if(window.innerWidth>768)close();});
+    })();
+    document.addEventListener('click',function(e){
+        var btn=e.target.closest?e.target.closest('.nav-group-toggle'):null;
+        if(!btn)return;
+        var g=btn.closest('.nav-group');if(!g)return;
+        var willOpen=!g.classList.contains('is-open');
+        document.querySelectorAll('.nav-group.is-open').forEach(function(x){
+            x.classList.remove('is-open');
+            var t=x.querySelector('.nav-group-toggle');if(t)t.setAttribute('aria-expanded','false');
+        });
+        if(willOpen){g.classList.add('is-open');btn.setAttribute('aria-expanded','true');}
+    });
+    </script>
 </body>
-</html>
\ No newline at end of file
+</html>
diff --git a/website/biztonsagimentes.html b/website/biztonsagimentes.html
index f652fb35..958fc651 100644
--- a/website/biztonsagimentes.html
+++ b/website/biztonsagimentes.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html lang="hu">
+<html lang="hu" class="no-js">
 <head>
+    <script>document.documentElement.className=document.documentElement.className.replace('no-js','js');</script>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Biztonsági mentés — 3-2-1 mentési stratégia otthoni szerverekhez | Felhom.eu</title>
@@ -37,44 +38,62 @@
     }
     </script>
     <!-- shared assets: bump ?v= together on any site.css/icons.svg change -->
-    <link rel="stylesheet" href="/assets/site.css?v=21">
+    <link rel="stylesheet" href="/assets/site.css?v=22">
+    <link rel="stylesheet" href="/assets/shell.css?v=22">
     <link rel="icon" type="image/png" href="/assets/logo_favicon_2.svg">
     <script defer src="https://stats.felhom.eu/script.js" data-website-id="d419db57-5e1c-48df-bdb3-c29f25fb1661"></script>
 </head>
-<body class="page-biztonsagimentes">
-    <nav>
-        <div class="container">
-            <a href="/" class="logo">
-                <img class="logo-mark" src="/assets/logo-mark.svg" alt="" aria-hidden="true">
-                <img class="logo-word" src="/assets/logo-wordmark.png" alt="felhom.eu">
+<body class="shell page-biztonsagimentes">
+    <header class="mobile-topbar">
+        <a href="/" class="mobile-topbar-logo"><img src="/assets/logo_notext_white.svg" alt="Felhom.eu"></a>
+        <button type="button" class="nav-burger" id="navBurger" aria-expanded="false" aria-controls="sidebar" aria-label="Menü">
+            <span class="hamburger-box"><span class="hamburger-line"></span><span class="hamburger-line"></span><span class="hamburger-line"></span></span>
+        </button>
+    </header>
+    <div class="nav-backdrop" id="navBackdrop" hidden></div>
+    <nav class="sidebar" id="sidebar">
+        <div class="sidebar-header">
+            <a href="/" class="sidebar-logo-link">
+                <img src="/assets/logo_notext_white.svg" alt="" class="sidebar-logo" aria-hidden="true">
+                <img src="/assets/logo-wordmark.png" alt="felhom.eu" class="sidebar-word">
             </a>
-            <ul class="nav-links">
-                <li><a href="/#szolgaltatasok">Szolgáltatások</a></li>
-                <li><a href="/alkalmazasok">Alkalmazások</a></li>
-                <li><a href="/technologiak">Technológiák</a></li>
-                <li><a href="/biztonsagimentes" class="active">Mentések</a></li>
-                <li><a href="/gyik">GYIK</a></li>
-                <li><a href="/kapcsolat">Kapcsolat</a></li>
-                <li class="lang-globe-li"><details class="lang-globe"><summary class="lang-globe-btn" aria-label="Nyelv" title="Nyelv"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/biztonsagimentes" lang="hu" hreflang="hu" class="lang-globe-item current" aria-current="true">Magyar</a></li><li><a href="/en/backups" lang="en" hreflang="en" class="lang-globe-item">English</a></li></ul></details></li>
+        </div>
+        <ul class="nav-links">
+                <li><a href="/"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg>Kezdőlap</a></li>
+                <li><a href="/#szolgaltatasok"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rocket"/></svg>Szolgáltatások</a></li>
+                <li class="nav-group">
+                    <button type="button" class="nav-group-toggle" aria-expanded="false" aria-controls="nav-group-apps"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg>Alkalmazások<svg class="ico nav-chevron" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chevron-down"/></svg></button>
+                    <ul id="nav-group-apps" class="nav-links nav-links-sub nav-links-nested">
+                        <li><a href="/alkalmazasok">Minden alkalmazás</a></li>
+                        <li><a href="/alkalmazasok#fajlkezeles-irodai">Fájlkezelés &amp; Irodai</a></li>
+                        <li><a href="/alkalmazasok#media-szorakozas">Média &amp; Szórakozás</a></li>
+                        <li><a href="/alkalmazasok#otthon-eletmod">Otthon &amp; Életmód</a></li>
+                        <li><a href="/alkalmazasok#produktivitas-tudaskezeles">Produktivitás &amp; Tudáskezelés</a></li>
+                        <li><a href="/alkalmazasok#rendszer-fejlesztes">Rendszer &amp; Fejlesztés</a></li>
+                    </ul>
+                </li>
+                <li><a href="/technologiak"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg>Technológiák</a></li>
+                <li><a href="/biztonsagimentes" class="active"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg>Biztonsági mentés</a></li>
+        </ul>
+        <div class="sidebar-bottom">
+            <a href="/teszteles" class="btn btn-outline sidebar-cta">Jelentkezem tesztelőnek →</a>
+            <div class="nav-group-label">A Felhomról</div>
+            <ul class="nav-links nav-links-sub">
+                    <li><a href="/#hogyan-mukodik">Hogyan működik</a></li>
+                    <li><a href="/gyik">GYIK</a></li>
+                    <li><a href="/kapcsolat">Kapcsolat</a></li>
             </ul>
-            <button class="hamburger" id="hamburger" aria-label="Menü megnyitása" aria-expanded="false">
-                <span class="hamburger-box">
-                    <span class="hamburger-line"></span>
-                    <span class="hamburger-line"></span>
-                    <span class="hamburger-line"></span>
-                </span>
-            </button>
+            <div class="sidebar-footer">
+                <details class="lang-globe"><summary class="lang-globe-btn" aria-label="Nyelv" title="Nyelv"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/biztonsagimentes" lang="hu" hreflang="hu" class="lang-globe-item current" aria-current="true">Magyar</a></li><li><a href="/en/backups" lang="en" hreflang="en" class="lang-globe-item">English</a></li></ul></details>
+            </div>
         </div>
     </nav>
-    <div class="mobile-overlay" id="mobileOverlay"></div>
-
-    <main>
-        <section class="page-header">
-            <div class="container">
+<main class="content">
+                <div class="page-header">
                 <h1>Biztonsági <span>Mentés</span></h1>
-                <p>Az adataid biztonsága az első. Professzionális mentési stratégiával gondoskodunk róla, hogy egy hiba vagy baleset után is legyen honnan visszahozni.</p>
             </div>
-        </section>
+                <p class="page-lede">Az adataid biztonsága az első. Professzionális mentési stratégiával gondoskodunk róla, hogy egy hiba vagy baleset után is legyen honnan visszahozni.</p>
+
 
         <!-- Bevezető -->
         <section class="content-section">
@@ -234,16 +253,16 @@
                     <p>A mentések inkrementálisak, ami azt jelenti, hogy csak a változások kerülnek mentésre. Ez helyet és időt takarít meg, miközben a teljes visszaállítási lehetőség megmarad.</p>
 
                     <div class="highlight-box">
-                        <p><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-monitor"/></svg> <strong>Nem csak az adatok:</strong> a Proxmox alapnak köszönhetően nem csupán a fájljaid és adatbázisaid menthetők, hanem az <strong>egész rendszered</strong> is — a teljes doboz is biztonsági mentésbe kerül, és ebből visszaállítható. Ha maga a doboz megy tönkre, az újratelepített rendszerre a titkosított távoli mentésből visszahozhatók az alkalmazásaid adatai — a helyreállítási kóddal.</p>
+                        <p><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-monitor"/></svg> <strong>Nem csak az adatok:</strong> a Proxmox alapnak köszönhetően nem csupán a fájljaid és adatbázisaid menthetők, hanem az <strong>egész rendszered</strong> is – a teljes doboz is biztonsági mentésbe kerül, és ebből visszaállítható. Ha maga a doboz megy tönkre, az újratelepített rendszerre a titkosított távoli mentésből visszahozhatók az alkalmazásaid adatai – a helyreállítási kóddal.</p>
                     </div>
 
                     <div class="highlight-box">
-                        <p><strong>A távoli mentés helye:</strong> a Felhom dobozon a távoli másolat egy általunk biztosított tárhelyre kerül, titkosítva. A „haver rendszer” és az iroda általános lehetőségek a 3-2-1 szabályhoz — ezeket ma nem állítjuk be.</p>
+                        <p><strong>A távoli mentés helye:</strong> a Felhom dobozon a távoli másolat egy általunk biztosított tárhelyre kerül, titkosítva. A „haver rendszer” és az iroda általános lehetőségek a 3-2-1 szabályhoz – ezeket ma nem állítjuk be.</p>
                     </div>
 
-                    <h3 style="margin-top: 24px;"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-lock"/></svg> A helyreállítási kód — amit csak te ismersz</h3>
+                    <h3 style="margin-top: 24px;"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-lock"/></svg> A helyreállítási kód – amit csak te ismersz</h3>
                     <p>A távoli mentésed titkosított, és a titkosítás kulcsa egy <strong>helyreállítási kód</strong>. Ez a kód pontosan egyszer jelenik meg: a te képernyődön, a beállításkor. Nálunk nem marad belőle másolat.</p>
-                    <p>Ez tudatos döntés, és két oldala van. Az egyik, hogy a távoli mentésedet rajtad kívül <strong>senki</strong> nem tudja elolvasni — mi sem. A másik, hogy ha a doboz megsemmisül és a kód is elveszett, akkor a távoli mentés <strong>nekünk sem visszaállítható</strong>. Ezért a kód papírra kerül, és jó helyre.</p>
+                    <p>Ez tudatos döntés, és két oldala van. Az egyik, hogy a távoli mentésedet rajtad kívül <strong>senki</strong> nem tudja elolvasni – mi sem. A másik, hogy ha a doboz megsemmisül és a kód is elveszett, akkor a távoli mentés <strong>nekünk sem visszaállítható</strong>. Ezért a kód papírra kerül, és jó helyre.</p>
 
                     <h3 style="margin-top: 24px;"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chart-column"/></svg> Monitoring és értesítések</h3>
                     <p>A mentéseket folyamatosan figyeljük. Ha probléma van – sikertelen mentés, betelő tárhely, kapcsolati hiba – az a felügyeleti rendszerünkben megjelenik, és e-mail értesítés is indul róla. A zárt teszt egyik célja épp az, hogy ezeket az értesítéseket éles körülmények között csiszoljuk.</p>
@@ -260,13 +279,6 @@
             </div>
         </section>
     </main>
-
-    <footer>
-        <div class="container">
-            <p>© 2026 felhom.eu – Saját felhőd, saját szabályaid</p>
-            <p class="footer-legal">Üzemeltető: Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Adatkezelési tájékoztató</a> · <a href="/feltetelek">Feltételek</a></p>
-        </div>
-    </footer>
     <script>
     (function() {
         var hamburger = document.getElementById('hamburger');
@@ -328,5 +340,35 @@
         });
     })();
     </script>
+<footer>
+        <div class="container">
+            <p>© 2026 felhom.eu – Saját felhőd, saját szabályaid</p>
+            <p class="footer-legal">Üzemeltető: Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Adatkezelési tájékoztató</a> · <a href="/feltetelek">Feltételek</a></p>
+        </div>
+    </footer>
+    <script>
+    (function(){
+        var b=document.getElementById('navBurger'),s=document.getElementById('sidebar'),k=document.getElementById('navBackdrop');
+        if(!b||!s||!k)return;
+        function open(){s.classList.add('is-open');k.hidden=false;document.body.classList.add('nav-open');b.setAttribute('aria-expanded','true');}
+        function close(){s.classList.remove('is-open');k.hidden=true;document.body.classList.remove('nav-open');b.setAttribute('aria-expanded','false');}
+        b.addEventListener('click',function(){s.classList.contains('is-open')?close():open();});
+        k.addEventListener('click',close);
+        document.addEventListener('keydown',function(e){if(e.key==='Escape'&&s.classList.contains('is-open')){close();b.focus();}});
+        s.querySelectorAll('a').forEach(function(l){l.addEventListener('click',close);});
+        window.addEventListener('resize',function(){if(window.innerWidth>768)close();});
+    })();
+    document.addEventListener('click',function(e){
+        var btn=e.target.closest?e.target.closest('.nav-group-toggle'):null;
+        if(!btn)return;
+        var g=btn.closest('.nav-group');if(!g)return;
+        var willOpen=!g.classList.contains('is-open');
+        document.querySelectorAll('.nav-group.is-open').forEach(function(x){
+            x.classList.remove('is-open');
+            var t=x.querySelector('.nav-group-toggle');if(t)t.setAttribute('aria-expanded','false');
+        });
+        if(willOpen){g.classList.add('is-open');btn.setAttribute('aria-expanded','true');}
+    });
+    </script>
 </body>
-</html>
\ No newline at end of file
+</html>
diff --git a/website/en/apps.html b/website/en/apps.html
index 17becfa4..1a4de838 100644
--- a/website/en/apps.html
+++ b/website/en/apps.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html lang="en">
+<html lang="en" class="no-js">
 <head>
+    <script>document.documentElement.className=document.documentElement.className.replace('no-js','js');</script>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Apps to install — 58 apps for a home server | Felhom.eu</title>
@@ -43,42 +44,62 @@
     }
     </script>
     <!-- shared assets: bump ?v= together on any site.css/icons.svg change -->
-    <link rel="stylesheet" href="/assets/site.css?v=21">
+    <link rel="stylesheet" href="/assets/site.css?v=22">
+    <link rel="stylesheet" href="/assets/shell.css?v=22">
     <link rel="icon" type="image/png" href="/assets/logo_favicon_2.svg">
     <script defer src="/assets/gallery.js?v=2"></script>
     <script defer src="https://stats.felhom.eu/script.js" data-website-id="d419db57-5e1c-48df-bdb3-c29f25fb1661"></script>
 </head>
-<body class="page-alkalmazasok">
-    <nav>
-        <div class="container">
-            <a href="/en/" class="logo">
-                <img class="logo-mark" src="/assets/logo-mark.svg" alt="" aria-hidden="true">
-                <img class="logo-word" src="/assets/logo-wordmark.png" alt="felhom.eu">
+<body class="shell page-alkalmazasok">
+    <header class="mobile-topbar">
+        <a href="/en/" class="mobile-topbar-logo"><img src="/assets/logo_notext_white.svg" alt="Felhom.eu"></a>
+        <button type="button" class="nav-burger" id="navBurger" aria-expanded="false" aria-controls="sidebar" aria-label="Menu">
+            <span class="hamburger-box"><span class="hamburger-line"></span><span class="hamburger-line"></span><span class="hamburger-line"></span></span>
+        </button>
+    </header>
+    <div class="nav-backdrop" id="navBackdrop" hidden></div>
+    <nav class="sidebar" id="sidebar">
+        <div class="sidebar-header">
+            <a href="/en/" class="sidebar-logo-link">
+                <img src="/assets/logo_notext_white.svg" alt="" class="sidebar-logo" aria-hidden="true">
+                <img src="/assets/logo-wordmark.png" alt="felhom.eu" class="sidebar-word">
             </a>
-            <ul class="nav-links">
-                <li><a href="/en/#services">Services</a></li>
-                <li><a href="/en/apps" class="active">Apps</a></li>
-                <li><a href="/en/technology">Technology</a></li>
-                <li><a href="/en/backups">Backups</a></li>
-                <li><a href="/en/faq">FAQ</a></li>
-                <li><a href="/en/contact">Contact</a></li>
-                <li class="lang-globe-li"><details class="lang-globe"><summary class="lang-globe-btn" aria-label="Language" title="Language"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/alkalmazasok" lang="hu" hreflang="hu" class="lang-globe-item">Magyar</a></li><li><a href="/en/apps" lang="en" hreflang="en" class="lang-globe-item current" aria-current="true">English</a></li></ul></details></li>
+        </div>
+        <ul class="nav-links">
+                <li><a href="/en/"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg>Home</a></li>
+                <li><a href="/en/#services"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rocket"/></svg>Services</a></li>
+                <li class="nav-group is-open">
+                    <button type="button" class="nav-group-toggle active" aria-expanded="true" aria-controls="nav-group-apps"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg>Applications<svg class="ico nav-chevron" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chevron-down"/></svg></button>
+                    <ul id="nav-group-apps" class="nav-links nav-links-sub nav-links-nested">
+                        <li><a href="/en/apps">All applications</a></li>
+                        <li><a href="/en/apps#files-office">Files &amp; Office</a></li>
+                        <li><a href="/en/apps#media-entertainment">Media &amp; Entertainment</a></li>
+                        <li><a href="/en/apps#home-lifestyle">Home &amp; Lifestyle</a></li>
+                        <li><a href="/en/apps#productivity-knowledge">Productivity &amp; Knowledge</a></li>
+                        <li><a href="/en/apps#system-development">System &amp; Development</a></li>
+                    </ul>
+                </li>
+                <li><a href="/en/technology"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg>Technology</a></li>
+                <li><a href="/en/backups"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg>Backups</a></li>
+        </ul>
+        <div class="sidebar-bottom">
+            <a href="/en/testing" class="btn btn-outline sidebar-cta">Apply as a tester →</a>
+            <div class="nav-group-label">About Felhom</div>
+            <ul class="nav-links nav-links-sub">
+                    <li><a href="/en/#how-it-works">How it works</a></li>
+                    <li><a href="/en/faq">FAQ</a></li>
+                    <li><a href="/en/contact">Contact</a></li>
             </ul>
-            <button class="hamburger" id="hamburger" aria-label="Open menu" aria-expanded="false">
-                <span class="hamburger-box">
-                    <span class="hamburger-line"></span>
-                    <span class="hamburger-line"></span>
-                    <span class="hamburger-line"></span>
-                </span>
-            </button>
+            <div class="sidebar-footer">
+                <details class="lang-globe"><summary class="lang-globe-btn" aria-label="Language" title="Language"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/alkalmazasok" lang="hu" hreflang="hu" class="lang-globe-item">Magyar</a></li><li><a href="/en/apps" lang="en" hreflang="en" class="lang-globe-item current" aria-current="true">English</a></li></ul></details>
+            </div>
         </div>
     </nav>
-    <div class="mobile-overlay" id="mobileOverlay"></div>
-    <main>
-        <section class="page-header">
-            <div class="container">
+<main class="content">
+                <div class="page-header">
                 <h1>Apps to <span>install</span></h1>
-                <p>Choose from 58 apps. Almost all of them are free, open-source software, and every one runs on your own server.</p>
+            </div>
+                <p class="page-lede">Choose from 58 apps. Almost all of them are free, open-source software, and every one runs on your own server.</p>
                 <div class="disclaimer-banner">
                     <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-info"/></svg> Good to know</h3>
                     <ul>
@@ -88,8 +109,7 @@
                         <li>If an app is missing, we look at whether it can join the catalog – <a href="/en/contact">just ask!</a></li>
                     </ul>
                 </div>
-            </div>
-        </section>
+
         <section class="apps-section">
             <div class="container">
 
@@ -1262,19 +1282,12 @@
         <section class="cta-section">
             <div class="container">
                 <h2>Can't find what you are looking for?</h2>
-                <p>This is the whole catalog. If you need something specific, get in touch — we will look at whether the right app can join it.</p>
+                <p>This is the whole catalog. If you need something specific, get in touch – we will look at whether the right app can join it.</p>
                 <a href="/en/contact" class="cta-button">Get in touch →</a>
             </div>
         </section>
     </main>
 
-    <footer>
-        <div class="container">
-            <p>© 2026 felhom.eu – Your own cloud, your own rules. Felhom serves households in Hungary.</p>
-            <p class="footer-legal">Operated by Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Privacy notice (Hungarian)</a> · <a href="/feltetelek">Terms (Hungarian)</a></p>
-        </div>
-    </footer>
-
     <script>
     (function() {
         var hamburger = document.getElementById('hamburger');
@@ -1336,5 +1349,35 @@
         });
     })();
     </script>
+<footer>
+        <div class="container">
+            <p>© 2026 felhom.eu – Your own cloud, your own rules. Felhom serves households in Hungary.</p>
+            <p class="footer-legal">Operated by Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Privacy notice (Hungarian)</a> · <a href="/feltetelek">Terms (Hungarian)</a></p>
+        </div>
+    </footer>
+    <script>
+    (function(){
+        var b=document.getElementById('navBurger'),s=document.getElementById('sidebar'),k=document.getElementById('navBackdrop');
+        if(!b||!s||!k)return;
+        function open(){s.classList.add('is-open');k.hidden=false;document.body.classList.add('nav-open');b.setAttribute('aria-expanded','true');}
+        function close(){s.classList.remove('is-open');k.hidden=true;document.body.classList.remove('nav-open');b.setAttribute('aria-expanded','false');}
+        b.addEventListener('click',function(){s.classList.contains('is-open')?close():open();});
+        k.addEventListener('click',close);
+        document.addEventListener('keydown',function(e){if(e.key==='Escape'&&s.classList.contains('is-open')){close();b.focus();}});
+        s.querySelectorAll('a').forEach(function(l){l.addEventListener('click',close);});
+        window.addEventListener('resize',function(){if(window.innerWidth>768)close();});
+    })();
+    document.addEventListener('click',function(e){
+        var btn=e.target.closest?e.target.closest('.nav-group-toggle'):null;
+        if(!btn)return;
+        var g=btn.closest('.nav-group');if(!g)return;
+        var willOpen=!g.classList.contains('is-open');
+        document.querySelectorAll('.nav-group.is-open').forEach(function(x){
+            x.classList.remove('is-open');
+            var t=x.querySelector('.nav-group-toggle');if(t)t.setAttribute('aria-expanded','false');
+        });
+        if(willOpen){g.classList.add('is-open');btn.setAttribute('aria-expanded','true');}
+    });
+    </script>
 </body>
-</html>
\ No newline at end of file
+</html>
diff --git a/website/en/backups.html b/website/en/backups.html
index b02a19a8..105692f5 100644
--- a/website/en/backups.html
+++ b/website/en/backups.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html lang="en">
+<html lang="en" class="no-js">
 <head>
+    <script>document.documentElement.className=document.documentElement.className.replace('no-js','js');</script>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Backups — a 3-2-1 backup strategy for home servers | Felhom.eu</title>
@@ -37,44 +38,62 @@
     }
     </script>
     <!-- shared assets: bump ?v= together on any site.css/icons.svg change -->
-    <link rel="stylesheet" href="/assets/site.css?v=21">
+    <link rel="stylesheet" href="/assets/site.css?v=22">
+    <link rel="stylesheet" href="/assets/shell.css?v=22">
     <link rel="icon" type="image/png" href="/assets/logo_favicon_2.svg">
     <script defer src="https://stats.felhom.eu/script.js" data-website-id="d419db57-5e1c-48df-bdb3-c29f25fb1661"></script>
 </head>
-<body class="page-biztonsagimentes">
-    <nav>
-        <div class="container">
-            <a href="/en/" class="logo">
-                <img class="logo-mark" src="/assets/logo-mark.svg" alt="" aria-hidden="true">
-                <img class="logo-word" src="/assets/logo-wordmark.png" alt="felhom.eu">
+<body class="shell page-biztonsagimentes">
+    <header class="mobile-topbar">
+        <a href="/en/" class="mobile-topbar-logo"><img src="/assets/logo_notext_white.svg" alt="Felhom.eu"></a>
+        <button type="button" class="nav-burger" id="navBurger" aria-expanded="false" aria-controls="sidebar" aria-label="Menu">
+            <span class="hamburger-box"><span class="hamburger-line"></span><span class="hamburger-line"></span><span class="hamburger-line"></span></span>
+        </button>
+    </header>
+    <div class="nav-backdrop" id="navBackdrop" hidden></div>
+    <nav class="sidebar" id="sidebar">
+        <div class="sidebar-header">
+            <a href="/en/" class="sidebar-logo-link">
+                <img src="/assets/logo_notext_white.svg" alt="" class="sidebar-logo" aria-hidden="true">
+                <img src="/assets/logo-wordmark.png" alt="felhom.eu" class="sidebar-word">
             </a>
-            <ul class="nav-links">
-                <li><a href="/en/#services">Services</a></li>
-                <li><a href="/en/apps">Apps</a></li>
-                <li><a href="/en/technology">Technology</a></li>
-                <li><a href="/en/backups" class="active">Backups</a></li>
-                <li><a href="/en/faq">FAQ</a></li>
-                <li><a href="/en/contact">Contact</a></li>
-                <li class="lang-globe-li"><details class="lang-globe"><summary class="lang-globe-btn" aria-label="Language" title="Language"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/biztonsagimentes" lang="hu" hreflang="hu" class="lang-globe-item">Magyar</a></li><li><a href="/en/backups" lang="en" hreflang="en" class="lang-globe-item current" aria-current="true">English</a></li></ul></details></li>
+        </div>
+        <ul class="nav-links">
+                <li><a href="/en/"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg>Home</a></li>
+                <li><a href="/en/#services"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rocket"/></svg>Services</a></li>
+                <li class="nav-group">
+                    <button type="button" class="nav-group-toggle" aria-expanded="false" aria-controls="nav-group-apps"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg>Applications<svg class="ico nav-chevron" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chevron-down"/></svg></button>
+                    <ul id="nav-group-apps" class="nav-links nav-links-sub nav-links-nested">
+                        <li><a href="/en/apps">All applications</a></li>
+                        <li><a href="/en/apps#files-office">Files &amp; Office</a></li>
+                        <li><a href="/en/apps#media-entertainment">Media &amp; Entertainment</a></li>
+                        <li><a href="/en/apps#home-lifestyle">Home &amp; Lifestyle</a></li>
+                        <li><a href="/en/apps#productivity-knowledge">Productivity &amp; Knowledge</a></li>
+                        <li><a href="/en/apps#system-development">System &amp; Development</a></li>
+                    </ul>
+                </li>
+                <li><a href="/en/technology"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg>Technology</a></li>
+                <li><a href="/en/backups" class="active"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg>Backups</a></li>
+        </ul>
+        <div class="sidebar-bottom">
+            <a href="/en/testing" class="btn btn-outline sidebar-cta">Apply as a tester →</a>
+            <div class="nav-group-label">About Felhom</div>
+            <ul class="nav-links nav-links-sub">
+                    <li><a href="/en/#how-it-works">How it works</a></li>
+                    <li><a href="/en/faq">FAQ</a></li>
+                    <li><a href="/en/contact">Contact</a></li>
             </ul>
-            <button class="hamburger" id="hamburger" aria-label="Open menu" aria-expanded="false">
-                <span class="hamburger-box">
-                    <span class="hamburger-line"></span>
-                    <span class="hamburger-line"></span>
-                    <span class="hamburger-line"></span>
-                </span>
-            </button>
+            <div class="sidebar-footer">
+                <details class="lang-globe"><summary class="lang-globe-btn" aria-label="Language" title="Language"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/biztonsagimentes" lang="hu" hreflang="hu" class="lang-globe-item">Magyar</a></li><li><a href="/en/backups" lang="en" hreflang="en" class="lang-globe-item current" aria-current="true">English</a></li></ul></details>
+            </div>
         </div>
     </nav>
-    <div class="mobile-overlay" id="mobileOverlay"></div>
-
-    <main>
-        <section class="page-header">
-            <div class="container">
+<main class="content">
+                <div class="page-header">
                 <h1><span>Backups</span></h1>
-                <p>Your data's safety comes first. With a professional backup strategy, we make sure there is something to bring back from after a fault or an accident.</p>
             </div>
-        </section>
+                <p class="page-lede">Your data's safety comes first. With a professional backup strategy, we make sure there is something to bring back from after a fault or an accident.</p>
+
 
         <!-- Bevezető -->
         <section class="content-section">
@@ -234,16 +253,16 @@
                     <p>The backups are incremental: only the changes are saved. That saves space and time, and a full restore is still there when you need it.</p>
 
                     <div class="highlight-box">
-                        <p><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-monitor"/></svg> <strong>Not only the data:</strong> thanks to the Proxmox base, not only your files and databases are backed up but your <strong>whole system</strong> too — the whole box goes into a backup, and it can be restored from it. If the box itself breaks, your apps' data can be brought back from the encrypted remote backup onto the reinstalled system — with the recovery code.</p>
+                        <p><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-monitor"/></svg> <strong>Not only the data:</strong> thanks to the Proxmox base, not only your files and databases are backed up but your <strong>whole system</strong> too – the whole box goes into a backup, and it can be restored from it. If the box itself breaks, your apps' data can be brought back from the encrypted remote backup onto the reinstalled system – with the recovery code.</p>
                     </div>
 
                     <div class="highlight-box">
-                        <p><strong>Where the remote backup goes:</strong> on a Felhom box the remote copy goes, encrypted, to storage we provide. The "buddy system" and the office are general options for the 3-2-1 rule — we do not set them up today.</p>
+                        <p><strong>Where the remote backup goes:</strong> on a Felhom box the remote copy goes, encrypted, to storage we provide. The "buddy system" and the office are general options for the 3-2-1 rule – we do not set them up today.</p>
                     </div>
 
-                    <h3 style="margin-top: 24px;"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-lock"/></svg> The recovery code — only you know it</h3>
+                    <h3 style="margin-top: 24px;"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-lock"/></svg> The recovery code – only you know it</h3>
                     <p>Your remote backup is encrypted, and the key to the encryption is a <strong>recovery code</strong>. The code appears exactly once: on your screen, when it is set up. We keep no copy of it.</p>
-                    <p>This is a deliberate choice, and it has two sides. One: <strong>nobody</strong> but you can read your remote backup — not even us. The other: if the box is destroyed and the code is lost too, then <strong>we cannot restore</strong> the remote backup either. So the code goes on paper, and somewhere safe.</p>
+                    <p>This is a deliberate choice, and it has two sides. One: <strong>nobody</strong> but you can read your remote backup – not even us. The other: if the box is destroyed and the code is lost too, then <strong>we cannot restore</strong> the remote backup either. So the code goes on paper, and somewhere safe.</p>
 
                     <h3 style="margin-top: 24px;"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chart-column"/></svg> Monitoring and notifications</h3>
                     <p>We watch the backups all the time. If there is a problem – a failed backup, storage filling up, a connection fault – it shows up in our monitoring, and an e-mail goes out about it. One aim of the closed test is to polish these notifications in real use.</p>
@@ -260,13 +279,6 @@
             </div>
         </section>
     </main>
-
-    <footer>
-        <div class="container">
-            <p>© 2026 felhom.eu – Your own cloud, your own rules. Felhom serves households in Hungary.</p>
-            <p class="footer-legal">Operated by Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Privacy notice (Hungarian)</a> · <a href="/feltetelek">Terms (Hungarian)</a></p>
-        </div>
-    </footer>
     <script>
     (function() {
         var hamburger = document.getElementById('hamburger');
@@ -328,5 +340,35 @@
         });
     })();
     </script>
+<footer>
+        <div class="container">
+            <p>© 2026 felhom.eu – Your own cloud, your own rules. Felhom serves households in Hungary.</p>
+            <p class="footer-legal">Operated by Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Privacy notice (Hungarian)</a> · <a href="/feltetelek">Terms (Hungarian)</a></p>
+        </div>
+    </footer>
+    <script>
+    (function(){
+        var b=document.getElementById('navBurger'),s=document.getElementById('sidebar'),k=document.getElementById('navBackdrop');
+        if(!b||!s||!k)return;
+        function open(){s.classList.add('is-open');k.hidden=false;document.body.classList.add('nav-open');b.setAttribute('aria-expanded','true');}
+        function close(){s.classList.remove('is-open');k.hidden=true;document.body.classList.remove('nav-open');b.setAttribute('aria-expanded','false');}
+        b.addEventListener('click',function(){s.classList.contains('is-open')?close():open();});
+        k.addEventListener('click',close);
+        document.addEventListener('keydown',function(e){if(e.key==='Escape'&&s.classList.contains('is-open')){close();b.focus();}});
+        s.querySelectorAll('a').forEach(function(l){l.addEventListener('click',close);});
+        window.addEventListener('resize',function(){if(window.innerWidth>768)close();});
+    })();
+    document.addEventListener('click',function(e){
+        var btn=e.target.closest?e.target.closest('.nav-group-toggle'):null;
+        if(!btn)return;
+        var g=btn.closest('.nav-group');if(!g)return;
+        var willOpen=!g.classList.contains('is-open');
+        document.querySelectorAll('.nav-group.is-open').forEach(function(x){
+            x.classList.remove('is-open');
+            var t=x.querySelector('.nav-group-toggle');if(t)t.setAttribute('aria-expanded','false');
+        });
+        if(willOpen){g.classList.add('is-open');btn.setAttribute('aria-expanded','true');}
+    });
+    </script>
 </body>
-</html>
\ No newline at end of file
+</html>
diff --git a/website/en/contact.html b/website/en/contact.html
index 150f8f0b..195b757b 100644
--- a/website/en/contact.html
+++ b/website/en/contact.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html lang="en">
+<html lang="en" class="no-js">
 <head>
+    <script>document.documentElement.className=document.documentElement.className.replace('no-js','js');</script>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Contact — ask for a personal offer for your home server | Felhom.eu</title>
@@ -26,45 +27,61 @@
     <meta name="twitter:description" content="A question? Write to us: info@felhom.eu">
     <meta name="twitter:image" content="https://felhom.eu/assets/og-image-en.png">
     <!-- shared assets: bump ?v= together on any site.css/icons.svg change -->
-    <link rel="stylesheet" href="/assets/site.css?v=21">
+    <link rel="stylesheet" href="/assets/site.css?v=22">
+    <link rel="stylesheet" href="/assets/shell.css?v=22">
     <link rel="icon" type="image/png" href="/assets/logo_favicon_2.svg">
     <script defer src="https://stats.felhom.eu/script.js" data-website-id="d419db57-5e1c-48df-bdb3-c29f25fb1661"></script>
 </head>
-<body class="page-kapcsolat">
-    <nav>
-        <div class="container">
-            <a href="/en/" class="logo">
-                <img class="logo-mark" src="/assets/logo-mark.svg" alt="" aria-hidden="true">
-                <img class="logo-word" src="/assets/logo-wordmark.png" alt="felhom.eu">
+<body class="shell page-kapcsolat">
+    <header class="mobile-topbar">
+        <a href="/en/" class="mobile-topbar-logo"><img src="/assets/logo_notext_white.svg" alt="Felhom.eu"></a>
+        <button type="button" class="nav-burger" id="navBurger" aria-expanded="false" aria-controls="sidebar" aria-label="Menu">
+            <span class="hamburger-box"><span class="hamburger-line"></span><span class="hamburger-line"></span><span class="hamburger-line"></span></span>
+        </button>
+    </header>
+    <div class="nav-backdrop" id="navBackdrop" hidden></div>
+    <nav class="sidebar" id="sidebar">
+        <div class="sidebar-header">
+            <a href="/en/" class="sidebar-logo-link">
+                <img src="/assets/logo_notext_white.svg" alt="" class="sidebar-logo" aria-hidden="true">
+                <img src="/assets/logo-wordmark.png" alt="felhom.eu" class="sidebar-word">
             </a>
-            <ul class="nav-links">
-                <li><a href="/en/#services">Services</a></li>
-                <li><a href="/en/apps">Apps</a></li>
-                <li><a href="/en/technology">Technology</a></li>
-                <li><a href="/en/backups">Backups</a></li>
-                <li><a href="/en/faq">FAQ</a></li>
-                <li><a href="/en/contact" class="active">Contact</a></li>
-                <li class="lang-globe-li"><details class="lang-globe"><summary class="lang-globe-btn" aria-label="Language" title="Language"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/kapcsolat" lang="hu" hreflang="hu" class="lang-globe-item">Magyar</a></li><li><a href="/en/contact" lang="en" hreflang="en" class="lang-globe-item current" aria-current="true">English</a></li></ul></details></li>
+        </div>
+        <ul class="nav-links">
+                <li><a href="/en/"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg>Home</a></li>
+                <li><a href="/en/#services"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rocket"/></svg>Services</a></li>
+                <li class="nav-group">
+                    <button type="button" class="nav-group-toggle" aria-expanded="false" aria-controls="nav-group-apps"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg>Applications<svg class="ico nav-chevron" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chevron-down"/></svg></button>
+                    <ul id="nav-group-apps" class="nav-links nav-links-sub nav-links-nested">
+                        <li><a href="/en/apps">All applications</a></li>
+                        <li><a href="/en/apps#files-office">Files &amp; Office</a></li>
+                        <li><a href="/en/apps#media-entertainment">Media &amp; Entertainment</a></li>
+                        <li><a href="/en/apps#home-lifestyle">Home &amp; Lifestyle</a></li>
+                        <li><a href="/en/apps#productivity-knowledge">Productivity &amp; Knowledge</a></li>
+                        <li><a href="/en/apps#system-development">System &amp; Development</a></li>
+                    </ul>
+                </li>
+                <li><a href="/en/technology"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg>Technology</a></li>
+                <li><a href="/en/backups"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg>Backups</a></li>
+        </ul>
+        <div class="sidebar-bottom">
+            <a href="/en/testing" class="btn btn-outline sidebar-cta">Apply as a tester →</a>
+            <div class="nav-group-label">About Felhom</div>
+            <ul class="nav-links nav-links-sub">
+                    <li><a href="/en/#how-it-works">How it works</a></li>
+                    <li><a href="/en/faq">FAQ</a></li>
+                    <li><a href="/en/contact" class="active">Contact</a></li>
             </ul>
-            <button class="hamburger" id="hamburger" aria-label="Open menu" aria-expanded="false">
-                <span class="hamburger-box">
-                    <span class="hamburger-line"></span>
-                    <span class="hamburger-line"></span>
-                    <span class="hamburger-line"></span>
-                </span>
-            </button>
+            <div class="sidebar-footer">
+                <details class="lang-globe"><summary class="lang-globe-btn" aria-label="Language" title="Language"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/kapcsolat" lang="hu" hreflang="hu" class="lang-globe-item">Magyar</a></li><li><a href="/en/contact" lang="en" hreflang="en" class="lang-globe-item current" aria-current="true">English</a></li></ul></details>
+            </div>
         </div>
     </nav>
-    <div class="mobile-overlay" id="mobileOverlay"></div>
-
-    <section class="page-header">
-        <div class="container">
-            <h1>Write to <span>us!</span></h1>
-            <p>A question, or want to talk about what you need? Fill in the form and we will answer soon. We answer in English or Hungarian.</p>
-        </div>
-    </section>
-
-    <main>
+<main class="content">
+<div class="page-header">
+                <h1>Write to <span>us!</span></h1>
+            </div>
+            <p class="page-lede">A question, or want to talk about what you need? Fill in the form and we will answer soon. We answer in English or Hungarian.</p>
         <section class="content-section" style="padding-top: 0;">
             <div class="container">
                 <div class="contact-layout">
@@ -94,10 +111,10 @@
                                 <label for="subject">Subject <span class="required">*</span></label>
                                 <select id="subject" name="subject" required>
                                     <option value="" disabled selected>Choose a topic...</option>
-                                    <option value="zart-teszt">Closed test — I want to be a tester</option>
-                                    <option value="erdeklodes">Interest — I would like to learn about the service</option>
-                                    <option value="arajanlat">Request a quote — I have specific needs</option>
-                                    <option value="tamogatas">Support — a question about my existing server</option>
+                                    <option value="zart-teszt">Closed test – I want to be a tester</option>
+                                    <option value="erdeklodes">Interest – I would like to learn about the service</option>
+                                    <option value="arajanlat">Request a quote – I have specific needs</option>
+                                    <option value="tamogatas">Support – a question about my existing server</option>
                                     <option value="egyeb">Other</option>
                                 </select>
                                 <div class="error-message" id="subjectError">Choose a topic.</div>
@@ -186,13 +203,6 @@
     </section>
     </main>
 
-    <footer>
-        <div class="container">
-            <p>© 2026 felhom.eu – Your own cloud, your own rules. Felhom serves households in Hungary.</p>
-            <p class="footer-legal">Operated by Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Privacy notice (Hungarian)</a> · <a href="/feltetelek">Terms (Hungarian)</a></p>
-        </div>
-    </footer>
-
     <script>
     (() => {
         'use strict';
@@ -230,7 +240,7 @@
         let attachedFiles = [];
 
         // Preselect the subject from ?tema= (the closed-test CTA on the landing page
-        // links here as /en/contact?tema=zart-teszt — the same values as the Hungarian page). Unknown values are ignored.
+        // links here as /en/contact?tema=zart-teszt – the same values as the Hungarian page). Unknown values are ignored.
         (function preselectSubject() {
             const wanted = new URLSearchParams(window.location.search).get('tema');
             if (!wanted) return;
@@ -474,7 +484,7 @@
 
             // Subject label mapping
             const subjectLabels = {
-                'zart-teszt': 'Application — closed test (EN)',
+                'zart-teszt': 'Application – closed test (EN)',
                 erdeklodes: 'Interest (EN)',
                 arajanlat: 'Quote request (EN)',
                 tamogatas: 'Support (EN)',
@@ -613,5 +623,35 @@
         });
     })();
     </script>
+<footer>
+        <div class="container">
+            <p>© 2026 felhom.eu – Your own cloud, your own rules. Felhom serves households in Hungary.</p>
+            <p class="footer-legal">Operated by Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Privacy notice (Hungarian)</a> · <a href="/feltetelek">Terms (Hungarian)</a></p>
+        </div>
+    </footer>
+    <script>
+    (function(){
+        var b=document.getElementById('navBurger'),s=document.getElementById('sidebar'),k=document.getElementById('navBackdrop');
+        if(!b||!s||!k)return;
+        function open(){s.classList.add('is-open');k.hidden=false;document.body.classList.add('nav-open');b.setAttribute('aria-expanded','true');}
+        function close(){s.classList.remove('is-open');k.hidden=true;document.body.classList.remove('nav-open');b.setAttribute('aria-expanded','false');}
+        b.addEventListener('click',function(){s.classList.contains('is-open')?close():open();});
+        k.addEventListener('click',close);
+        document.addEventListener('keydown',function(e){if(e.key==='Escape'&&s.classList.contains('is-open')){close();b.focus();}});
+        s.querySelectorAll('a').forEach(function(l){l.addEventListener('click',close);});
+        window.addEventListener('resize',function(){if(window.innerWidth>768)close();});
+    })();
+    document.addEventListener('click',function(e){
+        var btn=e.target.closest?e.target.closest('.nav-group-toggle'):null;
+        if(!btn)return;
+        var g=btn.closest('.nav-group');if(!g)return;
+        var willOpen=!g.classList.contains('is-open');
+        document.querySelectorAll('.nav-group.is-open').forEach(function(x){
+            x.classList.remove('is-open');
+            var t=x.querySelector('.nav-group-toggle');if(t)t.setAttribute('aria-expanded','false');
+        });
+        if(willOpen){g.classList.add('is-open');btn.setAttribute('aria-expanded','true');}
+    });
+    </script>
 </body>
 </html>
diff --git a/website/en/download.html b/website/en/download.html
index 68794557..3c532608 100644
--- a/website/en/download.html
+++ b/website/en/download.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html lang="en">
+<html lang="en" class="no-js">
 <head>
+    <script>document.documentElement.className=document.documentElement.className.replace('no-js','js');</script>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Download — the Felhom installer | Felhom.eu</title>
@@ -24,44 +25,62 @@
     <meta name="twitter:description" content="Download, checksum, and what to check before you install.">
     <meta name="twitter:image" content="https://felhom.eu/assets/og-image.png">
     <!-- shared assets: bump ?v= together on any site.css/icons.svg change -->
-    <link rel="stylesheet" href="/assets/site.css?v=21">
+    <link rel="stylesheet" href="/assets/site.css?v=22">
+    <link rel="stylesheet" href="/assets/shell.css?v=22">
     <link rel="icon" type="image/png" href="/assets/logo_favicon_2.svg">
     <script defer src="https://stats.felhom.eu/script.js" data-website-id="d419db57-5e1c-48df-bdb3-c29f25fb1661"></script>
 </head>
-<body class="page-letoltes">
-    <nav>
-        <div class="container">
-            <a href="/en/" class="logo">
-                <img class="logo-mark" src="/assets/logo-mark.svg" alt="" aria-hidden="true">
-                <img class="logo-word" src="/assets/logo-wordmark.png" alt="felhom.eu">
+<body class="shell page-letoltes">
+    <header class="mobile-topbar">
+        <a href="/en/" class="mobile-topbar-logo"><img src="/assets/logo_notext_white.svg" alt="Felhom.eu"></a>
+        <button type="button" class="nav-burger" id="navBurger" aria-expanded="false" aria-controls="sidebar" aria-label="Menu">
+            <span class="hamburger-box"><span class="hamburger-line"></span><span class="hamburger-line"></span><span class="hamburger-line"></span></span>
+        </button>
+    </header>
+    <div class="nav-backdrop" id="navBackdrop" hidden></div>
+    <nav class="sidebar" id="sidebar">
+        <div class="sidebar-header">
+            <a href="/en/" class="sidebar-logo-link">
+                <img src="/assets/logo_notext_white.svg" alt="" class="sidebar-logo" aria-hidden="true">
+                <img src="/assets/logo-wordmark.png" alt="felhom.eu" class="sidebar-word">
             </a>
-            <ul class="nav-links">
-                <li><a href="/en/#services">Services</a></li>
-                <li><a href="/en/apps">Apps</a></li>
-                <li><a href="/en/technology">Technology</a></li>
-                <li><a href="/en/backups">Backups</a></li>
-                <li><a href="/en/faq">FAQ</a></li>
-                <li><a href="/en/contact">Contact</a></li>
-                <li class="lang-globe-li"><details class="lang-globe"><summary class="lang-globe-btn" aria-label="Language" title="Language"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/letoltes" lang="hu" hreflang="hu" class="lang-globe-item">Magyar</a></li><li><a href="/en/download" lang="en" hreflang="en" class="lang-globe-item current" aria-current="true">English</a></li></ul></details></li>
+        </div>
+        <ul class="nav-links">
+                <li><a href="/en/"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg>Home</a></li>
+                <li><a href="/en/#services"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rocket"/></svg>Services</a></li>
+                <li class="nav-group">
+                    <button type="button" class="nav-group-toggle" aria-expanded="false" aria-controls="nav-group-apps"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg>Applications<svg class="ico nav-chevron" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chevron-down"/></svg></button>
+                    <ul id="nav-group-apps" class="nav-links nav-links-sub nav-links-nested">
+                        <li><a href="/en/apps">All applications</a></li>
+                        <li><a href="/en/apps#files-office">Files &amp; Office</a></li>
+                        <li><a href="/en/apps#media-entertainment">Media &amp; Entertainment</a></li>
+                        <li><a href="/en/apps#home-lifestyle">Home &amp; Lifestyle</a></li>
+                        <li><a href="/en/apps#productivity-knowledge">Productivity &amp; Knowledge</a></li>
+                        <li><a href="/en/apps#system-development">System &amp; Development</a></li>
+                    </ul>
+                </li>
+                <li><a href="/en/technology"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg>Technology</a></li>
+                <li><a href="/en/backups"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg>Backups</a></li>
+        </ul>
+        <div class="sidebar-bottom">
+            <a href="/en/testing" class="btn btn-outline sidebar-cta">Apply as a tester →</a>
+            <div class="nav-group-label">About Felhom</div>
+            <ul class="nav-links nav-links-sub">
+                    <li><a href="/en/#how-it-works">How it works</a></li>
+                    <li><a href="/en/faq">FAQ</a></li>
+                    <li><a href="/en/contact">Contact</a></li>
             </ul>
-            <button class="hamburger" id="hamburger" aria-label="Open menu" aria-expanded="false">
-                <span class="hamburger-box">
-                    <span class="hamburger-line"></span>
-                    <span class="hamburger-line"></span>
-                    <span class="hamburger-line"></span>
-                </span>
-            </button>
+            <div class="sidebar-footer">
+                <details class="lang-globe"><summary class="lang-globe-btn" aria-label="Language" title="Language"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/letoltes" lang="hu" hreflang="hu" class="lang-globe-item">Magyar</a></li><li><a href="/en/download" lang="en" hreflang="en" class="lang-globe-item current" aria-current="true">English</a></li></ul></details>
+            </div>
         </div>
     </nav>
-    <div class="mobile-overlay" id="mobileOverlay"></div>
-
-    <main>
-        <section class="page-header">
-            <div class="container">
+<main class="content">
+                <div class="page-header">
                 <h1>The Felhom <span>installer</span></h1>
-                <p>This page is for someone who has received an installation guide from their operator. The installer turns a whole machine into a Felhom server.</p>
             </div>
-        </section>
+                <p class="page-lede">This page is for someone who has received an installation guide from their operator. The installer turns a whole machine into a Felhom server.</p>
+
 
         <section class="content-section">
             <div class="container">
@@ -81,25 +100,18 @@
                     <p>Felhom installer 1.29.0 (based on Proxmox VE 9.2)</p>
                 </div>
                 <div class="info-card">
-                    <p><a href="https://iso.felhom.eu/felhom-installer-1.29.0-pve9.2-1.iso"><strong>felhom-installer-1.29.0-pve9.2-1.iso</strong></a> — 1.6 GB (1,705,324,544 bytes)</p>
+                    <p><a href="https://iso.felhom.eu/felhom-installer-1.29.0-pve9.2-1.iso"><strong>felhom-installer-1.29.0-pve9.2-1.iso</strong></a> – 1.6 GB (1,705,324,544 bytes)</p>
                     <p>Checksum (SHA-256):</p>
                     <div class="highlight-box">
                         <p><code>dceacae5da247d76cad065bf6c0d3bbefac8d8a5f8e571db2fd8449a97e94829</code></p>
                     </div>
                     <p>The same checksum as a file: <a href="https://iso.felhom.eu/felhom-installer-1.29.0-pve9.2-1.iso.sha256">felhom-installer-1.29.0-pve9.2-1.iso.sha256</a></p>
-                    <p>To check it on Linux or macOS: <code>sha256sum felhom-installer-1.29.0-pve9.2-1.iso</code>. On Windows, in PowerShell: <code>Get-FileHash felhom-installer-1.29.0-pve9.2-1.iso</code>. The string it prints must match the one above. If it does not match, do not use the file — download it again.</p>
+                    <p>To check it on Linux or macOS: <code>sha256sum felhom-installer-1.29.0-pve9.2-1.iso</code>. On Windows, in PowerShell: <code>Get-FileHash felhom-installer-1.29.0-pve9.2-1.iso</code>. The string it prints must match the one above. If it does not match, do not use the file – download it again.</p>
                     <p>The downloaded file has to be written to a USB stick of at least 4 GB (with Balena Etcher or Rufus, for example). The guide covers that too.</p>
                 </div>
             </div>
         </section>
     </main>
-
-    <footer>
-        <div class="container">
-            <p>© 2026 felhom.eu – Your own cloud, your own rules. Felhom serves households in Hungary.</p>
-            <p class="footer-legal">Operated by Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Privacy notice (Hungarian)</a> · <a href="/feltetelek">Terms (Hungarian)</a></p>
-        </div>
-    </footer>
     <script>
     (function() {
         var hamburger = document.getElementById('hamburger');
@@ -161,5 +173,35 @@
         });
     })();
     </script>
+<footer>
+        <div class="container">
+            <p>© 2026 felhom.eu – Your own cloud, your own rules. Felhom serves households in Hungary.</p>
+            <p class="footer-legal">Operated by Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Privacy notice (Hungarian)</a> · <a href="/feltetelek">Terms (Hungarian)</a></p>
+        </div>
+    </footer>
+    <script>
+    (function(){
+        var b=document.getElementById('navBurger'),s=document.getElementById('sidebar'),k=document.getElementById('navBackdrop');
+        if(!b||!s||!k)return;
+        function open(){s.classList.add('is-open');k.hidden=false;document.body.classList.add('nav-open');b.setAttribute('aria-expanded','true');}
+        function close(){s.classList.remove('is-open');k.hidden=true;document.body.classList.remove('nav-open');b.setAttribute('aria-expanded','false');}
+        b.addEventListener('click',function(){s.classList.contains('is-open')?close():open();});
+        k.addEventListener('click',close);
+        document.addEventListener('keydown',function(e){if(e.key==='Escape'&&s.classList.contains('is-open')){close();b.focus();}});
+        s.querySelectorAll('a').forEach(function(l){l.addEventListener('click',close);});
+        window.addEventListener('resize',function(){if(window.innerWidth>768)close();});
+    })();
+    document.addEventListener('click',function(e){
+        var btn=e.target.closest?e.target.closest('.nav-group-toggle'):null;
+        if(!btn)return;
+        var g=btn.closest('.nav-group');if(!g)return;
+        var willOpen=!g.classList.contains('is-open');
+        document.querySelectorAll('.nav-group.is-open').forEach(function(x){
+            x.classList.remove('is-open');
+            var t=x.querySelector('.nav-group-toggle');if(t)t.setAttribute('aria-expanded','false');
+        });
+        if(willOpen){g.classList.add('is-open');btn.setAttribute('aria-expanded','true');}
+    });
+    </script>
 </body>
-</html>
\ No newline at end of file
+</html>
diff --git a/website/en/faq.html b/website/en/faq.html
index 5a27ceba..34788a96 100644
--- a/website/en/faq.html
+++ b/website/en/faq.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html lang="en">
+<html lang="en" class="no-js">
 <head>
+    <script>document.documentElement.className=document.documentElement.className.replace('no-js','js');</script>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>FAQ — frequently asked questions about the home server service | Felhom.eu</title>
@@ -36,7 +37,7 @@
           "name": "What is Felhom.eu, and what exactly do you do?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "Felhom.eu is a service for households in Hungary that helps install and run a home server. We offer turnkey set-ups: we choose the hardware, set up the software, take care of the backups, and keep an eye on the system all the time. The aim is simple: instead of the big cloud providers (Google, Microsoft, Apple), you keep your data on a server in your own home — without having to be an expert yourself."
+            "text": "Felhom.eu is a service for households in Hungary that helps install and run a home server. We offer turnkey set-ups: we choose the hardware, set up the software, take care of the backups, and keep an eye on the system all the time. The aim is simple: instead of the big cloud providers (Google, Microsoft, Apple), you keep your data on a server in your own home – without having to be an expert yourself."
           }
         },
         {
@@ -44,7 +45,7 @@
           "name": "Who is this service for?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "Anyone who wants to take back control of their digital life. Typical customers: Families who want their photos and videos safe, and do not want to pay for cloud storage every month. Privacy-minded people who do not want Google or Microsoft to have access to their documents. Media fans who want their own Netflix- or Spotify-like system for their films and music. Small businesses that need document management, an internal wiki or appointment booking — under their own control."
+            "text": "Anyone who wants to take back control of their digital life. Typical customers: Families who want their photos and videos safe, and do not want to pay for cloud storage every month. Privacy-minded people who do not want Google or Microsoft to have access to their documents. Media fans who want their own Netflix- or Spotify-like system for their films and music. Small businesses that need document management, an internal wiki or appointment booking – under their own control."
           }
         },
         {
@@ -52,7 +53,7 @@
           "name": "Do I need any technical knowledge?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "No. We do the whole installation and set-up. Your part is to use the apps — in a browser or on your phone, just like a Google or Apple service. After the installation we walk you through it in a short session, so you can use the system with confidence."
+            "text": "No. We do the whole installation and set-up. Your part is to use the apps – in a browser or on your phone, just like a Google or Apple service. After the installation we walk you through it in a short session, so you can use the system with confidence."
           }
         },
         {
@@ -60,7 +61,7 @@
           "name": "How is Felhom.eu different from a Synology or QNAP NAS?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "Synology and QNAP make NAS (network storage) devices built mainly for storing files, with their own closed software. We offer an open, Docker-based system instead, where the catalog's apps install in a few clicks — from a photo manager to a media server to a password manager. A NAS offers a limited choice of apps and depends on the maker's software updates. With us you choose from 58 apps, and if something is missing, we look at whether it can be added."
+            "text": "Synology and QNAP make NAS (network storage) devices built mainly for storing files, with their own closed software. We offer an open, Docker-based system instead, where the catalog's apps install in a few clicks – from a photo manager to a media server to a password manager. A NAS offers a limited choice of apps and depends on the maker's software updates. With us you choose from 58 apps, and if something is missing, we look at whether it can be added."
           }
         },
         {
@@ -68,7 +69,7 @@
           "name": "What does the process look like, from start to finish?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "1. A first talk — We talk about what you need: which apps you would use, how much storage you want, and what your budget is. 2. Choosing the hardware — We help you find the right machine for your needs and your budget. 3. Installation and set-up — We install the operating system, the container engine and the apps, and set up the backups and the monitoring. 4. Handover and training — We show you how to use the system and answer all your questions. 5. Ongoing care — We watch the backups, maintain the system, and help if anything goes wrong."
+            "text": "1. A first talk – We talk about what you need: which apps you would use, how much storage you want, and what your budget is. 2. Choosing the hardware – We help you find the right machine for your needs and your budget. 3. Installation and set-up – We install the operating system, the container engine and the apps, and set up the backups and the monitoring. 4. Handover and training – We show you how to use the system and answer all your questions. 5. Ongoing care – We watch the backups, maintain the system, and help if anything goes wrong."
           }
         },
         {
@@ -76,7 +77,7 @@
           "name": "What machine do I need?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "For most homes a mini PC (for example with an Intel N100 processor and 16-32 GB of RAM) is perfectly fine. They are quiet, energy-saving (15-35 W) and compact — one fits on the shelf next to the router. If you want more storage (for a film library, say), you can add a NAS or external hard drives. More detailed set-ups are on the Technology page."
+            "text": "For most homes a mini PC (for example with an Intel N100 processor and 16-32 GB of RAM) is perfectly fine. They are quiet, energy-saving (15-35 W) and compact – one fits on the shelf next to the router. If you want more storage (for a film library, say), you can add a NAS or external hard drives. More detailed set-ups are on the Technology page."
           }
         },
         {
@@ -84,7 +85,7 @@
           "name": "Can I use an old machine I already have?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "Often, yes! An older desktop PC can make an excellent server. In our first talk we check whether your machine suits what you plan (enough RAM, storage, reliability). Power use and noise matter — an old gaming PC will work, but each month it uses far more power than a modern mini PC."
+            "text": "Often, yes! An older desktop PC can make an excellent server. In our first talk we check whether your machine suits what you plan (enough RAM, storage, reliability). Power use and noise matter – an old gaming PC will work, but each month it uses far more power than a modern mini PC."
           }
         },
         {
@@ -108,7 +109,7 @@
           "name": "How loud is a server like this?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "Mini PCs are almost silent — many models have no fan at all, or one that only turns on now and then. In everyday use you can keep one on your desk or on a bedroom shelf. Tower and rack servers are a different story — those are better off in a cellar or a storeroom."
+            "text": "Mini PCs are almost silent – many models have no fan at all, or one that only turns on now and then. In everyday use you can keep one on your desk or on a bedroom shelf. Tower and rack servers are a different story – those are better off in a cellar or a storeroom."
           }
         },
         {
@@ -116,7 +117,7 @@
           "name": "What happens if the power goes off?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "During the installation we set the server's BIOS (where the option exists) to switch on by itself after a power cut. The operating system and all the apps then start on their own too. This setting is a standard part of every installation we do. After a power cut the box recovers by itself — we have tried this with a real power cut. If reliability is critical, we can also suggest an uninterruptible power supply (UPS) to bridge a few minutes without power."
+            "text": "During the installation we set the server's BIOS (where the option exists) to switch on by itself after a power cut. The operating system and all the apps then start on their own too. This setting is a standard part of every installation we do. After a power cut the box recovers by itself – we have tried this with a real power cut. If reliability is critical, we can also suggest an uninterruptible power supply (UPS) to bridge a few minutes without power."
           }
         },
         {
@@ -124,7 +125,7 @@
           "name": "What internet connection do I need?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "For use at home (on your home network) any internet connection will do, because the apps run on your home network — not over the internet. How fast photos, films and documents load depends on your router and your cabling. If you also want to reach your server from elsewhere (from work or on holiday, say), the upload speed matters: at least 10 Mbps is recommended, and more is better."
+            "text": "For use at home (on your home network) any internet connection will do, because the apps run on your home network – not over the internet. How fast photos, films and documents load depends on your router and your cabling. If you also want to reach your server from elsewhere (from work or on holiday, say), the upload speed matters: at least 10 Mbps is recommended, and more is better."
           }
         },
         {
@@ -132,7 +133,7 @@
           "name": "Which apps can I run?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "We offer 58 apps — the full list is on the Apps page. A few examples: Immich — a Google Photos alternative that backs up photos and videos automatically. Jellyfin/Plex — your own Netflix for films and series. Nextcloud — store and share files (instead of Google Drive). Vaultwarden — a password manager for the whole family. Paperless-ngx — scan documents and make them searchable. If something is not on the list, ask — we will look at whether it can join the catalog."
+            "text": "We offer 58 apps – the full list is on the Apps page. A few examples: Immich – a Google Photos alternative that backs up photos and videos automatically. Jellyfin/Plex – your own Netflix for films and series. Nextcloud – store and share files (instead of Google Drive). Vaultwarden – a password manager for the whole family. Paperless-ngx – scan documents and make them searchable. If something is not on the list, ask – we will look at whether it can join the catalog."
           }
         },
         {
@@ -156,7 +157,7 @@
           "name": "Can several family members use it at the same time?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "Yes, but know the current limit. Most of the apps (Immich, Nextcloud, Vaultwarden) support several users: in them every family member can have their own account and their own sign-in. The Felhom Dashboard, though, has one shared household password today — there are no separate family accounts on the Dashboard yet. The Dashboard is where you install apps and manage backups; for everyday use (photos, files) you use the apps' own accounts."
+            "text": "Yes, but know the current limit. Most of the apps (Immich, Nextcloud, Vaultwarden) support several users: in them every family member can have their own account and their own sign-in. The Felhom Dashboard, though, has one shared household password today – there are no separate family accounts on the Dashboard yet. The Dashboard is where you install apps and manage backups; for everyday use (photos, files) you use the apps' own accounts."
           }
         },
         {
@@ -164,7 +165,7 @@
           "name": "Can I bring over my existing data (Google Photos, iCloud, Dropbox)?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "Yes! Most services let you export your data. With Google Takeout you can download all your photos, documents and calendar, and Immich, Nextcloud and others can import them. We help with the move. How long it takes depends on how much data there is — moving a few hundred GB of photos can take a day or two, but afterwards the system works just the way you are used to from the cloud service."
+            "text": "Yes! Most services let you export your data. With Google Takeout you can download all your photos, documents and calendar, and Immich, Nextcloud and others can import them. We help with the move. How long it takes depends on how much data there is – moving a few hundred GB of photos can take a day or two, but afterwards the system works just the way you are used to from the cloud service."
           }
         },
         {
@@ -172,7 +173,7 @@
           "name": "Can I reach my server when I am not at home?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "Yes! The box is reached through an encrypted tunnel, over HTTPS, with no extra app. That means you can reach your photos, files and all your apps from anywhere — from work, on holiday or even abroad — as if you were at home."
+            "text": "Yes! The box is reached through an encrypted tunnel, over HTTPS, with no extra app. That means you can reach your photos, files and all your apps from anywhere – from work, on holiday or even abroad – as if you were at home."
           }
         },
         {
@@ -180,7 +181,7 @@
           "name": "How safe is a home server?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "The systems we install get several layers of protection: automatic HTTPS encryption, regular security updates, a sign-in for every app, and a family gate in front of some apps. Your server is inside your home — we open no port there, and from outside it is reached only through an encrypted tunnel. Most home servers do not face targeted attacks; what they meet is automated scripts trying their luck. The right configuration protects very well against those."
+            "text": "The systems we install get several layers of protection: automatic HTTPS encryption, regular security updates, a sign-in for every app, and a family gate in front of some apps. Your server is inside your home – we open no port there, and from outside it is reached only through an encrypted tunnel. Most home servers do not face targeted attacks; what they meet is automated scripts trying their luck. The right configuration protects very well against those."
           }
         },
         {
@@ -188,7 +189,7 @@
           "name": "Can you get at my data?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "That is an important, fair question, and we answer it honestly. For support and maintenance we normally have remote access to your server — as any IT provider has to the systems it manages. We need it to check backups, install updates and fix faults. The key to your remote backup, though, only you know: the recovery code appears once, on your screen, and we keep no copy of it. So we cannot read the remote backup either. Important: unlike the big cloud providers, we do no algorithmic analysis of your data and no profiling for advertising, and your data leaves your home only encrypted (the remote backup)."
+            "text": "That is an important, fair question, and we answer it honestly. For support and maintenance we normally have remote access to your server – as any IT provider has to the systems it manages. We need it to check backups, install updates and fix faults. The key to your remote backup, though, only you know: the recovery code appears once, on your screen, and we keep no copy of it. So we cannot read the remote backup either. Important: unlike the big cloud providers, we do no algorithmic analysis of your data and no profiling for advertising, and your data leaves your home only encrypted (the remote backup)."
           }
         },
         {
@@ -196,7 +197,7 @@
           "name": "What if someone breaks into my network?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "The server's apps run in isolated containers, which limits the damage if one app has a weakness. Regular updates, and having no open port at home, keep the risk down. An encrypted copy of your backups is also kept in a separate place (off-site) — so even after a ransomware attack, there is a copy stored far away."
+            "text": "The server's apps run in isolated containers, which limits the damage if one app has a weakness. Regular updates, and having no open port at home, keep the risk down. An encrypted copy of your backups is also kept in a separate place (off-site) – so even after a ransomware attack, there is a copy stored far away."
           }
         },
         {
@@ -212,7 +213,7 @@
           "name": "How are backups done?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "We follow the 3-2-1 backup rule: 3 copies of the data, on 2 different kinds of storage, 1 of them far away. It is an industry standard the largest companies use too. On the box this means three levels: a backup on the box, a second copy on a second drive, and an encrypted copy on remote storage. The backups run automatically, at night. Databases and files are backed up incrementally — only the changes are saved, which saves space and time. The details are on the Backups page."
+            "text": "We follow the 3-2-1 backup rule: 3 copies of the data, on 2 different kinds of storage, 1 of them far away. It is an industry standard the largest companies use too. On the box this means three levels: a backup on the box, a second copy on a second drive, and an encrypted copy on remote storage. The backups run automatically, at night. Databases and files are backed up incrementally – only the changes are saved, which saves space and time. The details are on the Backups page."
           }
         },
         {
@@ -228,7 +229,7 @@
           "name": "How do I know the backups really work?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "We run a central monitoring system that checks every day whether the backups ran successfully. If there is any problem — a failed backup, low storage, or the server not answering — we are notified at once, and so are you when it matters. This is not a \"set it up and hope it works\" arrangement — we watch it actively, and we also run restore tests from time to time."
+            "text": "We run a central monitoring system that checks every day whether the backups ran successfully. If there is any problem – a failed backup, low storage, or the server not answering – we are notified at once, and so are you when it matters. This is not a \"set it up and hope it works\" arrangement – we watch it actively, and we also run restore tests from time to time."
           }
         },
         {
@@ -236,7 +237,7 @@
           "name": "What is an \"off-site backup\"?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "An off-site (remote) backup means a copy of your data also exists in a physically different place. On a Felhom box that is storage we provide, where the copy goes encrypted. If disaster struck at home (fire, theft, flood), the remote copy would still be there. The off-site backup is always encrypted — nobody at the remote place can read your data, even if they can reach the files."
+            "text": "An off-site (remote) backup means a copy of your data also exists in a physically different place. On a Felhom box that is storage we provide, where the copy goes encrypted. If disaster struck at home (fire, theft, flood), the remote copy would still be there. The off-site backup is always encrypted – nobody at the remote place can read your data, even if they can reach the files."
           }
         },
         {
@@ -268,7 +269,7 @@
           "name": "What if I want to cancel the service?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "The server and all the data are yours — they always were. If you decide you no longer want the service, the box keeps working on your home network, but you no longer get updates, monitoring or support. Remote access and the remote backup are part of the service: what happens to them, we agree when you cancel. No minimum term, no cancellation fee. If you have the technical know-how (or have picked it up along the way), you can even keep running the system yourself. The data and the apps stay with you."
+            "text": "The server and all the data are yours – they always were. If you decide you no longer want the service, the box keeps working on your home network, but you no longer get updates, monitoring or support. Remote access and the remote backup are part of the service: what happens to them, we agree when you cancel. No minimum term, no cancellation fee. If you have the technical know-how (or have picked it up along the way), you can even keep running the system yourself. The data and the apps stay with you."
           }
         },
         {
@@ -276,7 +277,7 @@
           "name": "What happens if Felhom.eu shuts down?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "Your server and your data are yours. Almost all the apps are open source, which means anyone else can run them — you do not depend on a single provider. That is one of the biggest advantages of open-source software: no vendor lock-in. By contrast, when Google or Apple shuts down a service, your data disappears along with it."
+            "text": "Your server and your data are yours. Almost all the apps are open source, which means anyone else can run them – you do not depend on a single provider. That is one of the biggest advantages of open-source software: no vendor lock-in. By contrast, when Google or Apple shuts down a service, your data disappears along with it."
           }
         },
         {
@@ -284,7 +285,7 @@
           "name": "What if I move house?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "Your server is a compact box — unplug it, take it to your new home, plug it in, and everything carries on. If your internet provider changes, the remote access set-up may need updating — we help with that."
+            "text": "Your server is a compact box – unplug it, take it to your new home, plug it in, and everything carries on. If your internet provider changes, the remote access set-up may need updating – we help with that."
           }
         },
         {
@@ -292,7 +293,7 @@
           "name": "How much does it all cost?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "The cost has two parts: One-off costs: the hardware (80,000–400,000+ Ft, depending on the set-up) and the installation fee. You buy the hardware — it is yours, for good. A monthly management fee: for monitoring, support, updates and backup supervision. It depends on the package you choose. We give an exact quote after our first talk — needs vary a lot. Write to us and we will make you a personal offer!"
+            "text": "The cost has two parts: One-off costs: the hardware (80,000–400,000+ Ft, depending on the set-up) and the installation fee. You buy the hardware – it is yours, for good. A monthly management fee: for monitoring, support, updates and backup supervision. It depends on the package you choose. We give an exact quote after our first talk – needs vary a lot. Write to us and we will make you a personal offer!"
           }
         },
         {
@@ -300,7 +301,7 @@
           "name": "Is it worth it compared with cloud services?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "In the long run, almost always. A typical example: Google One 2 TB is about 36,000 Ft a year, iCloud 2 TB about 45,000 Ft, Spotify Family about 30,000 Ft, a password manager about 15,000 Ft. Together that is 120,000+ Ft a year — and that is only a few services. A mini PC server \"pays for itself\" in 2-3 years, and after that you mostly pay for electricity. And your storage has no fixed cap — not 2 TB, but as much as your disks hold."
+            "text": "In the long run, almost always. A typical example: Google One 2 TB is about 36,000 Ft a year, iCloud 2 TB about 45,000 Ft, Spotify Family about 30,000 Ft, a password manager about 15,000 Ft. Together that is 120,000+ Ft a year – and that is only a few services. A mini PC server \"pays for itself\" in 2-3 years, and after that you mostly pay for electricity. And your storage has no fixed cap – not 2 TB, but as much as your disks hold."
           }
         },
         {
@@ -308,7 +309,7 @@
           "name": "Are there hidden costs?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "No. The costs are: hardware (one-off), installation (one-off), monthly management (optional), and electricity (a few thousand forints a month). The apps are free to use, and almost all of them are open source — there is no licence fee for the apps. (A few have paid extras, such as Plex Pass; those are optional.) The remote backup's storage has a monthly cost that depends on how much data is backed up — we state it in the offer up front."
+            "text": "No. The costs are: hardware (one-off), installation (one-off), monthly management (optional), and electricity (a few thousand forints a month). The apps are free to use, and almost all of them are open source – there is no licence fee for the apps. (A few have paid extras, such as Plex Pass; those are optional.) The remote backup's storage has a monthly cost that depends on how much data is backed up – we state it in the offer up front."
           }
         },
         {
@@ -316,7 +317,7 @@
           "name": "What operating system runs on the server?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "The server's base is Proxmox VE — a professional, Debian-based virtualisation system the whole Felhom system is built on. Your apps run in Docker containers in a separate system environment installed on the Proxmox base. So the whole system environment can be backed up too, and restored from that backup."
+            "text": "The server's base is Proxmox VE – a professional, Debian-based virtualisation system the whole Felhom system is built on. Your apps run in Docker containers in a separate system environment installed on the Proxmox base. So the whole system environment can be backed up too, and restored from that backup."
           }
         },
         {
@@ -324,7 +325,7 @@
           "name": "What is Proxmox, and why do you use it?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "Proxmox is a professional virtualisation base — the same kind of technology data centres and companies use. It is on every Felhom box, quietly in the background; you do not need to deal with it. It makes the most important safety features possible: A backup before each update — before an app is updated, a fresh backup is made, and if the new version does not start, the box puts the previous one back by itself. The whole system can be backed up and restored — not only your data: the whole box goes into a backup too. Clean separation — the control layer and your apps run apart, which makes the system more stable and safer."
+            "text": "Proxmox is a professional virtualisation base – the same kind of technology data centres and companies use. It is on every Felhom box, quietly in the background; you do not need to deal with it. It makes the most important safety features possible: A backup before each update – before an app is updated, a fresh backup is made, and if the new version does not start, the box puts the previous one back by itself. The whole system can be backed up and restored – not only your data: the whole box goes into a backup too. Clean separation – the control layer and your apps run apart, which makes the system more stable and safer."
           }
         },
         {
@@ -332,7 +333,7 @@
           "name": "What is Docker / a container?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "A container is a \"box\" in which an app lives together with everything it depends on. Think of it as every app living in its own little flat — they do not disturb each other, they are easy to update or remove, and if one breaks, the others are not affected. There is more about this on the Technology page."
+            "text": "A container is a \"box\" in which an app lives together with everything it depends on. Think of it as every app living in its own little flat – they do not disturb each other, they are easy to update or remove, and if one breaks, the others are not affected. There is more about this on the Technology page."
           }
         },
         {
@@ -340,7 +341,7 @@
           "name": "Can I use my own domain name?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "Yes! If you have your own domain name (for example myserver.hu), we can make your apps reachable through it (for example photos.myserver.hu, films.myserver.hu). If you do not have one, we help you get one — it costs a few thousand forints a year."
+            "text": "Yes! If you have your own domain name (for example myserver.hu), we can make your apps reachable through it (for example photos.myserver.hu, films.myserver.hu). If you do not have one, we help you get one – it costs a few thousand forints a year."
           }
         },
         {
@@ -363,44 +364,62 @@
     }
     </script>
     <!-- shared assets: bump ?v= together on any site.css/icons.svg change -->
-    <link rel="stylesheet" href="/assets/site.css?v=21">
+    <link rel="stylesheet" href="/assets/site.css?v=22">
+    <link rel="stylesheet" href="/assets/shell.css?v=22">
     <link rel="icon" type="image/png" href="/assets/logo_favicon_2.svg">
     <script defer src="https://stats.felhom.eu/script.js" data-website-id="d419db57-5e1c-48df-bdb3-c29f25fb1661"></script>
 </head>
-<body class="page-gyik">
-    <nav>
-        <div class="container">
-            <a href="/en/" class="logo">
-                <img class="logo-mark" src="/assets/logo-mark.svg" alt="" aria-hidden="true">
-                <img class="logo-word" src="/assets/logo-wordmark.png" alt="felhom.eu">
+<body class="shell page-gyik">
+    <header class="mobile-topbar">
+        <a href="/en/" class="mobile-topbar-logo"><img src="/assets/logo_notext_white.svg" alt="Felhom.eu"></a>
+        <button type="button" class="nav-burger" id="navBurger" aria-expanded="false" aria-controls="sidebar" aria-label="Menu">
+            <span class="hamburger-box"><span class="hamburger-line"></span><span class="hamburger-line"></span><span class="hamburger-line"></span></span>
+        </button>
+    </header>
+    <div class="nav-backdrop" id="navBackdrop" hidden></div>
+    <nav class="sidebar" id="sidebar">
+        <div class="sidebar-header">
+            <a href="/en/" class="sidebar-logo-link">
+                <img src="/assets/logo_notext_white.svg" alt="" class="sidebar-logo" aria-hidden="true">
+                <img src="/assets/logo-wordmark.png" alt="felhom.eu" class="sidebar-word">
             </a>
-            <ul class="nav-links">
-                <li><a href="/en/#services">Services</a></li>
-                <li><a href="/en/apps">Apps</a></li>
-                <li><a href="/en/technology">Technology</a></li>
-                <li><a href="/en/backups">Backups</a></li>
-                <li><a href="/en/faq" class="active">FAQ</a></li>
-                <li><a href="/en/contact">Contact</a></li>
-                <li class="lang-globe-li"><details class="lang-globe"><summary class="lang-globe-btn" aria-label="Language" title="Language"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/gyik" lang="hu" hreflang="hu" class="lang-globe-item">Magyar</a></li><li><a href="/en/faq" lang="en" hreflang="en" class="lang-globe-item current" aria-current="true">English</a></li></ul></details></li>
+        </div>
+        <ul class="nav-links">
+                <li><a href="/en/"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg>Home</a></li>
+                <li><a href="/en/#services"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rocket"/></svg>Services</a></li>
+                <li class="nav-group">
+                    <button type="button" class="nav-group-toggle" aria-expanded="false" aria-controls="nav-group-apps"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg>Applications<svg class="ico nav-chevron" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chevron-down"/></svg></button>
+                    <ul id="nav-group-apps" class="nav-links nav-links-sub nav-links-nested">
+                        <li><a href="/en/apps">All applications</a></li>
+                        <li><a href="/en/apps#files-office">Files &amp; Office</a></li>
+                        <li><a href="/en/apps#media-entertainment">Media &amp; Entertainment</a></li>
+                        <li><a href="/en/apps#home-lifestyle">Home &amp; Lifestyle</a></li>
+                        <li><a href="/en/apps#productivity-knowledge">Productivity &amp; Knowledge</a></li>
+                        <li><a href="/en/apps#system-development">System &amp; Development</a></li>
+                    </ul>
+                </li>
+                <li><a href="/en/technology"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg>Technology</a></li>
+                <li><a href="/en/backups"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg>Backups</a></li>
+        </ul>
+        <div class="sidebar-bottom">
+            <a href="/en/testing" class="btn btn-outline sidebar-cta">Apply as a tester →</a>
+            <div class="nav-group-label">About Felhom</div>
+            <ul class="nav-links nav-links-sub">
+                    <li><a href="/en/#how-it-works">How it works</a></li>
+                    <li><a href="/en/faq" class="active">FAQ</a></li>
+                    <li><a href="/en/contact">Contact</a></li>
             </ul>
-            <button class="hamburger" id="hamburger" aria-label="Open menu" aria-expanded="false">
-                <span class="hamburger-box">
-                    <span class="hamburger-line"></span>
-                    <span class="hamburger-line"></span>
-                    <span class="hamburger-line"></span>
-                </span>
-            </button>
+            <div class="sidebar-footer">
+                <details class="lang-globe"><summary class="lang-globe-btn" aria-label="Language" title="Language"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/gyik" lang="hu" hreflang="hu" class="lang-globe-item">Magyar</a></li><li><a href="/en/faq" lang="en" hreflang="en" class="lang-globe-item current" aria-current="true">English</a></li></ul></details>
+            </div>
         </div>
     </nav>
-    <div class="mobile-overlay" id="mobileOverlay"></div>
-
-    <main>
-        <section class="page-header">
-            <div class="container">
+<main class="content">
+                <div class="page-header">
                 <h1>Frequently asked <span>questions</span></h1>
-                <p>Everything worth knowing about our home server service — in one place, in plain words.</p>
             </div>
-        </section>
+                <p class="page-lede">Everything worth knowing about our home server service – in one place, in plain words.</p>
+
 
         <section class="content-section" style="padding-top: 0;">
             <div class="container">
@@ -434,7 +453,7 @@
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
                             <p>Felhom.eu is a service for households in Hungary that helps install and run a home server. We offer turnkey set-ups: we choose the hardware, set up the software, take care of the backups, and keep an eye on the system all the time.</p>
-                            <p>The aim is simple: instead of the big cloud providers (Google, Microsoft, Apple), you keep your data on a server in your own home — without having to be an expert yourself.</p>
+                            <p>The aim is simple: instead of the big cloud providers (Google, Microsoft, Apple), you keep your data on a server in your own home – without having to be an expert yourself.</p>
                         </div></div>
                     </div>
 
@@ -448,7 +467,7 @@
                             <p><strong>Families</strong> who want their photos and videos safe, and do not want to pay for cloud storage every month.</p>
                             <p><strong>Privacy-minded people</strong> who do not want Google or Microsoft to have access to their documents.</p>
                             <p><strong>Media fans</strong> who want their own Netflix- or Spotify-like system for their films and music.</p>
-                            <p><strong>Small businesses</strong> that need document management, an internal wiki or appointment booking — under their own control.</p>
+                            <p><strong>Small businesses</strong> that need document management, an internal wiki or appointment booking – under their own control.</p>
                         </div></div>
                     </div>
 
@@ -458,7 +477,7 @@
                             <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
-                            <p><strong>No.</strong> We do the whole installation and set-up. Your part is to use the apps — in a browser or on your phone, just like a Google or Apple service.</p>
+                            <p><strong>No.</strong> We do the whole installation and set-up. Your part is to use the apps – in a browser or on your phone, just like a Google or Apple service.</p>
                             <p>After the installation we walk you through it in a short session, so you can use the system with confidence.</p>
                         </div></div>
                     </div>
@@ -469,7 +488,7 @@
                             <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>Synology and QNAP make NAS (network storage) devices built mainly for storing files, with their own closed software. We offer an open, Docker-based system instead, where the catalog's apps install in a few clicks — from a photo manager to a media server to a password manager.</p>
+                            <p>Synology and QNAP make NAS (network storage) devices built mainly for storing files, with their own closed software. We offer an open, Docker-based system instead, where the catalog's apps install in a few clicks – from a photo manager to a media server to a password manager.</p>
                             <p>A NAS offers a limited choice of apps and depends on the maker's software updates. With us you choose from 58 apps, and if something is missing, we look at whether it can be added.</p>
                         </div></div>
                     </div>
@@ -480,11 +499,11 @@
                             <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
-                            <p><strong>1. A first talk</strong> — We talk about what you need: which apps you would use, how much storage you want, and what your budget is.</p>
-                            <p><strong>2. Choosing the hardware</strong> — We help you find the right machine for your needs and your budget.</p>
-                            <p><strong>3. Installation and set-up</strong> — We install the operating system, the container engine and the apps, and set up the backups and the monitoring.</p>
-                            <p><strong>4. Handover and training</strong> — We show you how to use the system and answer all your questions.</p>
-                            <p><strong>5. Ongoing care</strong> — We watch the backups, maintain the system, and help if anything goes wrong.</p>
+                            <p><strong>1. A first talk</strong> – We talk about what you need: which apps you would use, how much storage you want, and what your budget is.</p>
+                            <p><strong>2. Choosing the hardware</strong> – We help you find the right machine for your needs and your budget.</p>
+                            <p><strong>3. Installation and set-up</strong> – We install the operating system, the container engine and the apps, and set up the backups and the monitoring.</p>
+                            <p><strong>4. Handover and training</strong> – We show you how to use the system and answer all your questions.</p>
+                            <p><strong>5. Ongoing care</strong> – We watch the backups, maintain the system, and help if anything goes wrong.</p>
                         </div></div>
                     </div>
                 </div>
@@ -502,7 +521,7 @@
                             <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>For most homes a <strong>mini PC</strong> (for example with an Intel N100 processor and 16-32 GB of RAM) is perfectly fine. They are quiet, energy-saving (15-35 W) and compact — one fits on the shelf next to the router.</p>
+                            <p>For most homes a <strong>mini PC</strong> (for example with an Intel N100 processor and 16-32 GB of RAM) is perfectly fine. They are quiet, energy-saving (15-35 W) and compact – one fits on the shelf next to the router.</p>
                             <p>If you want more storage (for a film library, say), you can add a NAS or external hard drives. More detailed set-ups are on the <a href="/en/technology#hardware">Technology</a> page.</p>
                         </div></div>
                     </div>
@@ -514,7 +533,7 @@
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
                             <p>Often, yes! An older desktop PC can make an excellent server. In our first talk we check whether your machine suits what you plan (enough RAM, storage, reliability).</p>
-                            <p><strong>Power use</strong> and <strong>noise</strong> matter — an old gaming PC will work, but each month it uses far more power than a modern mini PC.</p>
+                            <p><strong>Power use</strong> and <strong>noise</strong> matter – an old gaming PC will work, but each month it uses far more power than a modern mini PC.</p>
                         </div></div>
                     </div>
 
@@ -545,8 +564,8 @@
                             <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>Mini PCs are almost silent — many models have no fan at all, or one that only turns on now and then. In everyday use you can keep one on your desk or on a bedroom shelf.</p>
-                            <p>Tower and rack servers are a different story — those are better off in a cellar or a storeroom.</p>
+                            <p>Mini PCs are almost silent – many models have no fan at all, or one that only turns on now and then. In everyday use you can keep one on your desk or on a bedroom shelf.</p>
+                            <p>Tower and rack servers are a different story – those are better off in a cellar or a storeroom.</p>
                         </div></div>
                     </div>
 
@@ -557,7 +576,7 @@
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
                             <p>During the installation we set the server's BIOS (where the option exists) to switch on by itself after a power cut. The operating system and all the apps then start on their own too. This setting is a standard part of every installation we do.</p>
-                            <p>After a power cut the box recovers by itself — we have tried this with a real power cut. If reliability is critical, we can also suggest an uninterruptible power supply (UPS) to bridge a few minutes without power.</p>
+                            <p>After a power cut the box recovers by itself – we have tried this with a real power cut. If reliability is critical, we can also suggest an uninterruptible power supply (UPS) to bridge a few minutes without power.</p>
                         </div></div>
                     </div>
 
@@ -567,7 +586,7 @@
                             <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>For use at home (on your home network) any internet connection will do, because the apps run on your home network — not over the internet. How fast photos, films and documents load depends on your router and your cabling.</p>
+                            <p>For use at home (on your home network) any internet connection will do, because the apps run on your home network – not over the internet. How fast photos, films and documents load depends on your router and your cabling.</p>
                             <p>If you <strong>also want to reach</strong> your server from elsewhere (from work or on holiday, say), the upload speed matters: at least 10 Mbps is recommended, and more is better.</p>
                         </div></div>
                     </div>
@@ -586,9 +605,9 @@
                             <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>We offer <strong>58 apps</strong> — the full list is on the <a href="/en/apps">Apps</a> page. A few examples:</p>
-                            <p><strong>Immich</strong> — a Google Photos alternative that backs up photos and videos automatically. <strong>Jellyfin/Plex</strong> — your own Netflix for films and series. <strong>Nextcloud</strong> — store and share files (instead of Google Drive). <strong>Vaultwarden</strong> — a password manager for the whole family. <strong>Paperless-ngx</strong> — scan documents and make them searchable.</p>
-                            <p>If something is not on the list, ask — we will look at whether it can join the catalog.</p>
+                            <p>We offer <strong>58 apps</strong> – the full list is on the <a href="/en/apps">Apps</a> page. A few examples:</p>
+                            <p><strong>Immich</strong> – a Google Photos alternative that backs up photos and videos automatically. <strong>Jellyfin/Plex</strong> – your own Netflix for films and series. <strong>Nextcloud</strong> – store and share files (instead of Google Drive). <strong>Vaultwarden</strong> – a password manager for the whole family. <strong>Paperless-ngx</strong> – scan documents and make them searchable.</p>
+                            <p>If something is not on the list, ask – we will look at whether it can join the catalog.</p>
                         </div></div>
                     </div>
 
@@ -618,7 +637,7 @@
                             <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
-                            <p><strong>Yes, but know the current limit.</strong> Most of the apps (Immich, Nextcloud, Vaultwarden) support several users: in them every family member can have their own account and their own sign-in. The Felhom <strong>Dashboard</strong>, though, has <strong>one shared household password</strong> today — there are no separate family accounts on the Dashboard yet. The Dashboard is where you install apps and manage backups; for everyday use (photos, files) you use the apps' own accounts.</p>
+                            <p><strong>Yes, but know the current limit.</strong> Most of the apps (Immich, Nextcloud, Vaultwarden) support several users: in them every family member can have their own account and their own sign-in. The Felhom <strong>Dashboard</strong>, though, has <strong>one shared household password</strong> today – there are no separate family accounts on the Dashboard yet. The Dashboard is where you install apps and manage backups; for everyday use (photos, files) you use the apps' own accounts.</p>
                         </div></div>
                     </div>
 
@@ -629,7 +648,7 @@
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
                             <p>Yes! Most services let you export your data. With Google Takeout you can download all your photos, documents and calendar, and Immich, Nextcloud and others can import them. We help with the move.</p>
-                            <p>How long it takes depends on how much data there is — moving a few hundred GB of photos can take a day or two, but afterwards the system works just the way you are used to from the cloud service.</p>
+                            <p>How long it takes depends on how much data there is – moving a few hundred GB of photos can take a day or two, but afterwards the system works just the way you are used to from the cloud service.</p>
                         </div></div>
                     </div>
 
@@ -639,7 +658,7 @@
                             <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>Yes! The box is reached through an encrypted tunnel, over HTTPS, with no extra app. That means you can reach your photos, files and all your apps from anywhere — from work, on holiday or even abroad — as if you were at home.</p>
+                            <p>Yes! The box is reached through an encrypted tunnel, over HTTPS, with no extra app. That means you can reach your photos, files and all your apps from anywhere – from work, on holiday or even abroad – as if you were at home.</p>
                         </div></div>
                     </div>
                 </div>
@@ -657,7 +676,7 @@
                             <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>The systems we install get several layers of protection: automatic HTTPS encryption, regular security updates, a sign-in for every app, and a family gate in front of some apps. Your server is inside your home — we open no port there, and from outside it is reached only through an encrypted tunnel.</p>
+                            <p>The systems we install get several layers of protection: automatic HTTPS encryption, regular security updates, a sign-in for every app, and a family gate in front of some apps. Your server is inside your home – we open no port there, and from outside it is reached only through an encrypted tunnel.</p>
                             <p>Most home servers do not face targeted attacks; what they meet is automated scripts trying their luck. The right configuration protects very well against those.</p>
                         </div></div>
                     </div>
@@ -669,7 +688,7 @@
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
                             <p>That is an important, fair question, and we answer it honestly.</p>
-                            <p>For support and maintenance we normally have remote access to your server — as any IT provider has to the systems it manages. We need it to check backups, install updates and fix faults.</p>
+                            <p>For support and maintenance we normally have remote access to your server – as any IT provider has to the systems it manages. We need it to check backups, install updates and fix faults.</p>
                             <p>The key to your remote backup, though, <strong>only you know</strong>: the recovery code appears once, on your screen, and we keep no copy of it. So we cannot read the remote backup either.</p>
                             <p>Important: unlike the big cloud providers, we do <strong>no algorithmic analysis of your data</strong> and no profiling for advertising, and your data leaves your home only encrypted (the remote backup).</p>
                         </div></div>
@@ -682,7 +701,7 @@
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
                             <p>The server's apps run in isolated containers, which limits the damage if one app has a weakness. Regular updates, and having no open port at home, keep the risk down.</p>
-                            <p>An encrypted copy of your backups is also kept in a separate place (off-site) — so even after a ransomware attack, there is a copy stored far away.</p>
+                            <p>An encrypted copy of your backups is also kept in a separate place (off-site) – so even after a ransomware attack, there is a copy stored far away.</p>
                         </div></div>
                     </div>
 
@@ -711,7 +730,7 @@
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
                             <p>We follow the <strong>3-2-1 backup rule</strong>: 3 copies of the data, on 2 different kinds of storage, 1 of them far away. It is an industry standard the largest companies use too. On the box this means three levels: a backup on the box, a second copy on a second drive, and an encrypted copy on remote storage.</p>
-                            <p>The backups run <strong>automatically</strong>, at night. Databases and files are backed up incrementally — only the changes are saved, which saves space and time. The details are on the <a href="/en/backups">Backups</a> page.</p>
+                            <p>The backups run <strong>automatically</strong>, at night. Databases and files are backed up incrementally – only the changes are saved, which saves space and time. The details are on the <a href="/en/backups">Backups</a> page.</p>
                         </div></div>
                     </div>
 
@@ -731,8 +750,8 @@
                             <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>We run a central monitoring system that checks <strong>every day</strong> whether the backups ran successfully. If there is any problem — a failed backup, low storage, or the server not answering — we are notified at once, and so are you when it matters.</p>
-                            <p>This is not a "set it up and hope it works" arrangement — we watch it actively, and we also run restore tests from time to time.</p>
+                            <p>We run a central monitoring system that checks <strong>every day</strong> whether the backups ran successfully. If there is any problem – a failed backup, low storage, or the server not answering – we are notified at once, and so are you when it matters.</p>
+                            <p>This is not a "set it up and hope it works" arrangement – we watch it actively, and we also run restore tests from time to time.</p>
                         </div></div>
                     </div>
 
@@ -743,7 +762,7 @@
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
                             <p>An off-site (remote) backup means a copy of your data also exists in a physically different place. On a Felhom box that is storage we provide, where the copy goes encrypted. If disaster struck at home (fire, theft, flood), the remote copy would still be there.</p>
-                            <p>The off-site backup is always <strong>encrypted</strong> — nobody at the remote place can read your data, even if they can reach the files.</p>
+                            <p>The off-site backup is always <strong>encrypted</strong> – nobody at the remote place can read your data, even if they can reach the files.</p>
                         </div></div>
                     </div>
                 </div>
@@ -792,7 +811,7 @@
                             <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>The server and all the data are yours — they always were. If you decide you no longer want the service, the box keeps working on your home network, but you no longer get updates, monitoring or support. Remote access and the remote backup are part of the service: what happens to them, we agree when you cancel.</p>
+                            <p>The server and all the data are yours – they always were. If you decide you no longer want the service, the box keeps working on your home network, but you no longer get updates, monitoring or support. Remote access and the remote backup are part of the service: what happens to them, we agree when you cancel.</p>
                             <p>No minimum term, no cancellation fee. If you have the technical know-how (or have picked it up along the way), you can even keep running the system yourself. The data and the apps stay with you.</p>
                         </div></div>
                     </div>
@@ -803,7 +822,7 @@
                             <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>Your server and your data are yours. Almost all the apps are open source, which means anyone else can run them — you do not depend on a single provider. That is one of the biggest advantages of open-source software: <strong>no vendor lock-in</strong>.</p>
+                            <p>Your server and your data are yours. Almost all the apps are open source, which means anyone else can run them – you do not depend on a single provider. That is one of the biggest advantages of open-source software: <strong>no vendor lock-in</strong>.</p>
                             <p>By contrast, when Google or Apple shuts down a service, your data disappears along with it.</p>
                         </div></div>
                     </div>
@@ -814,7 +833,7 @@
                             <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>Your server is a compact box — unplug it, take it to your new home, plug it in, and everything carries on. If your internet provider changes, the remote access set-up may need updating — we help with that.</p>
+                            <p>Your server is a compact box – unplug it, take it to your new home, plug it in, and everything carries on. If your internet provider changes, the remote access set-up may need updating – we help with that.</p>
                         </div></div>
                     </div>
                 </div>
@@ -833,9 +852,9 @@
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
                             <p>The cost has two parts:</p>
-                            <p><strong>One-off costs:</strong> the hardware (80,000–400,000+ Ft, depending on the set-up) and the installation fee. You buy the hardware — it is yours, for good.</p>
+                            <p><strong>One-off costs:</strong> the hardware (80,000–400,000+ Ft, depending on the set-up) and the installation fee. You buy the hardware – it is yours, for good.</p>
                             <p><strong>A monthly management fee:</strong> for monitoring, support, updates and backup supervision. It depends on the package you choose.</p>
-                            <p>We give an exact quote after our first talk — needs vary a lot. Write to us and we will make you a personal offer!</p>
+                            <p>We give an exact quote after our first talk – needs vary a lot. Write to us and we will make you a personal offer!</p>
                         </div></div>
                     </div>
 
@@ -845,8 +864,8 @@
                             <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>In the long run, <strong>almost always</strong>. A typical example: Google One 2 TB is about 36,000 Ft a year, iCloud 2 TB about 45,000 Ft, Spotify Family about 30,000 Ft, a password manager about 15,000 Ft. Together that is 120,000+ Ft a year — and that is only a few services.</p>
-                            <p>A mini PC server "pays for itself" in 2-3 years, and after that you mostly pay for electricity. And your storage has no fixed cap — not 2 TB, but as much as your disks hold.</p>
+                            <p>In the long run, <strong>almost always</strong>. A typical example: Google One 2 TB is about 36,000 Ft a year, iCloud 2 TB about 45,000 Ft, Spotify Family about 30,000 Ft, a password manager about 15,000 Ft. Together that is 120,000+ Ft a year – and that is only a few services.</p>
+                            <p>A mini PC server "pays for itself" in 2-3 years, and after that you mostly pay for electricity. And your storage has no fixed cap – not 2 TB, but as much as your disks hold.</p>
                         </div></div>
                     </div>
 
@@ -856,8 +875,8 @@
                             <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>No. The costs are: hardware (one-off), installation (one-off), monthly management (optional), and electricity (a few thousand forints a month). The apps are free to use, and almost all of them are <strong>open source</strong> — there is no licence fee for the apps. (A few have paid extras, such as Plex Pass; those are optional.)</p>
-                            <p>The remote backup's storage has a monthly cost that depends on how much data is backed up — we state it in the offer up front.</p>
+                            <p>No. The costs are: hardware (one-off), installation (one-off), monthly management (optional), and electricity (a few thousand forints a month). The apps are free to use, and almost all of them are <strong>open source</strong> – there is no licence fee for the apps. (A few have paid extras, such as Plex Pass; those are optional.)</p>
+                            <p>The remote backup's storage has a monthly cost that depends on how much data is backed up – we state it in the offer up front.</p>
                         </div></div>
                     </div>
                 </div>
@@ -875,7 +894,7 @@
                             <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>The server's base is <strong>Proxmox VE</strong> — a professional, Debian-based virtualisation system the whole Felhom system is built on. Your apps run in Docker containers in a separate system environment installed on the Proxmox base. So the whole system environment can be backed up too, and restored from that backup.</p>
+                            <p>The server's base is <strong>Proxmox VE</strong> – a professional, Debian-based virtualisation system the whole Felhom system is built on. Your apps run in Docker containers in a separate system environment installed on the Proxmox base. So the whole system environment can be backed up too, and restored from that backup.</p>
                         </div></div>
                     </div>
 
@@ -885,10 +904,10 @@
                             <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>Proxmox is a professional virtualisation base — the same kind of technology data centres and companies use. It is on every Felhom box, quietly in the background; you do not need to deal with it. It makes the most important safety features possible:</p>
-                            <p><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield"/></svg> <strong>A backup before each update</strong> — before an app is updated, a fresh backup is made, and if the new version does not start, the box puts the previous one back by itself.</p>
-                            <p><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-hard-drive"/></svg> <strong>The whole system can be backed up and restored</strong> — not only your data: the whole box goes into a backup too.</p>
-                            <p><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg> <strong>Clean separation</strong> — the control layer and your apps run apart, which makes the system more stable and safer.</p>
+                            <p>Proxmox is a professional virtualisation base – the same kind of technology data centres and companies use. It is on every Felhom box, quietly in the background; you do not need to deal with it. It makes the most important safety features possible:</p>
+                            <p><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield"/></svg> <strong>A backup before each update</strong> – before an app is updated, a fresh backup is made, and if the new version does not start, the box puts the previous one back by itself.</p>
+                            <p><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-hard-drive"/></svg> <strong>The whole system can be backed up and restored</strong> – not only your data: the whole box goes into a backup too.</p>
+                            <p><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg> <strong>Clean separation</strong> – the control layer and your apps run apart, which makes the system more stable and safer.</p>
                         </div></div>
                     </div>
 
@@ -898,7 +917,7 @@
                             <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>A container is a "box" in which an app lives together with everything it depends on. Think of it as every app living in its own little flat — they do not disturb each other, they are easy to update or remove, and if one breaks, the others are not affected.</p>
+                            <p>A container is a "box" in which an app lives together with everything it depends on. Think of it as every app living in its own little flat – they do not disturb each other, they are easy to update or remove, and if one breaks, the others are not affected.</p>
                             <p>There is more about this on the <a href="/en/technology#containers">Technology</a> page.</p>
                         </div></div>
                     </div>
@@ -909,7 +928,7 @@
                             <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>Yes! If you have your own domain name (for example <em>myserver.hu</em>), we can make your apps reachable through it (for example <em>photos.myserver.hu</em>, <em>films.myserver.hu</em>). If you do not have one, we help you get one — it costs a few thousand forints a year.</p>
+                            <p>Yes! If you have your own domain name (for example <em>myserver.hu</em>), we can make your apps reachable through it (for example <em>photos.myserver.hu</em>, <em>films.myserver.hu</em>). If you do not have one, we help you get one – it costs a few thousand forints a year.</p>
                         </div></div>
                     </div>
 
@@ -941,19 +960,12 @@
         <section class="cta-section alt-bg">
             <div class="container">
                 <h2>Didn't find <span>your answer?</span></h2>
-                <p>Just write to us — we are happy to answer any question.</p>
+                <p>Just write to us – we are happy to answer any question.</p>
                 <a href="/en/contact" class="cta-button">Get in touch →</a>
             </div>
         </section>
     </main>
 
-    <footer>
-        <div class="container">
-            <p>© 2026 felhom.eu – Your own cloud, your own rules. Felhom serves households in Hungary.</p>
-            <p class="footer-legal">Operated by Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Privacy notice (Hungarian)</a> · <a href="/feltetelek">Terms (Hungarian)</a></p>
-        </div>
-    </footer>
-
     <script>
         // FAQ Accordion
         document.querySelectorAll('.faq-question').forEach(button => {
@@ -1044,5 +1056,35 @@
         });
     })();
     </script>
+<footer>
+        <div class="container">
+            <p>© 2026 felhom.eu – Your own cloud, your own rules. Felhom serves households in Hungary.</p>
+            <p class="footer-legal">Operated by Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Privacy notice (Hungarian)</a> · <a href="/feltetelek">Terms (Hungarian)</a></p>
+        </div>
+    </footer>
+    <script>
+    (function(){
+        var b=document.getElementById('navBurger'),s=document.getElementById('sidebar'),k=document.getElementById('navBackdrop');
+        if(!b||!s||!k)return;
+        function open(){s.classList.add('is-open');k.hidden=false;document.body.classList.add('nav-open');b.setAttribute('aria-expanded','true');}
+        function close(){s.classList.remove('is-open');k.hidden=true;document.body.classList.remove('nav-open');b.setAttribute('aria-expanded','false');}
+        b.addEventListener('click',function(){s.classList.contains('is-open')?close():open();});
+        k.addEventListener('click',close);
+        document.addEventListener('keydown',function(e){if(e.key==='Escape'&&s.classList.contains('is-open')){close();b.focus();}});
+        s.querySelectorAll('a').forEach(function(l){l.addEventListener('click',close);});
+        window.addEventListener('resize',function(){if(window.innerWidth>768)close();});
+    })();
+    document.addEventListener('click',function(e){
+        var btn=e.target.closest?e.target.closest('.nav-group-toggle'):null;
+        if(!btn)return;
+        var g=btn.closest('.nav-group');if(!g)return;
+        var willOpen=!g.classList.contains('is-open');
+        document.querySelectorAll('.nav-group.is-open').forEach(function(x){
+            x.classList.remove('is-open');
+            var t=x.querySelector('.nav-group-toggle');if(t)t.setAttribute('aria-expanded','false');
+        });
+        if(willOpen){g.classList.add('is-open');btn.setAttribute('aria-expanded','true');}
+    });
+    </script>
 </body>
-</html>
\ No newline at end of file
+</html>
diff --git a/website/en/index.html b/website/en/index.html
index 78afdbc2..6f13e7aa 100644
--- a/website/en/index.html
+++ b/website/en/index.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html lang="en">
+<html lang="en" class="no-js">
 <head>
+    <script>document.documentElement.className=document.documentElement.className.replace('no-js','js');</script>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
@@ -54,108 +55,164 @@
     }
     </script>
     <!-- shared assets: bump ?v= together on any site.css/icons.svg change -->
-    <link rel="stylesheet" href="/assets/site.css?v=21">
+    <link rel="stylesheet" href="/assets/site.css?v=22">
+    <link rel="stylesheet" href="/assets/shell.css?v=22">
     <link rel="icon" type="image/png" href="/assets/logo_favicon_2.svg">
     <script defer src="/assets/gallery.js?v=2"></script>
     <script defer src="https://stats.felhom.eu/script.js" data-website-id="d419db57-5e1c-48df-bdb3-c29f25fb1661"></script>
 </head>
-<body class="page-index">
-    <nav>
-        <div class="container">
-            <a href="/en/" class="logo">
-                <img class="logo-mark" src="/assets/logo-mark.svg" alt="" aria-hidden="true">
-                <img class="logo-word" src="/assets/logo-wordmark.png" alt="felhom.eu">
+<body class="shell page-index">
+    <header class="mobile-topbar">
+        <a href="/en/" class="mobile-topbar-logo"><img src="/assets/logo_notext_white.svg" alt="Felhom.eu"></a>
+        <button type="button" class="nav-burger" id="navBurger" aria-expanded="false" aria-controls="sidebar" aria-label="Menu">
+            <span class="hamburger-box"><span class="hamburger-line"></span><span class="hamburger-line"></span><span class="hamburger-line"></span></span>
+        </button>
+    </header>
+    <div class="nav-backdrop" id="navBackdrop" hidden></div>
+    <nav class="sidebar" id="sidebar">
+        <div class="sidebar-header">
+            <a href="/en/" class="sidebar-logo-link">
+                <img src="/assets/logo_notext_white.svg" alt="" class="sidebar-logo" aria-hidden="true">
+                <img src="/assets/logo-wordmark.png" alt="felhom.eu" class="sidebar-word">
             </a>
-            <ul class="nav-links">
-                <li><a href="/en/#services">Services</a></li>
-                <li><a href="/en/apps">Apps</a></li>
-                <li><a href="/en/technology">Technology</a></li>
-                <li><a href="/en/backups">Backups</a></li>
-                <li><a href="/en/faq">FAQ</a></li>
-                <li><a href="/en/contact">Contact</a></li>
-                <li class="lang-globe-li"><details class="lang-globe"><summary class="lang-globe-btn" aria-label="Language" title="Language"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/" lang="hu" hreflang="hu" class="lang-globe-item">Magyar</a></li><li><a href="/en/" lang="en" hreflang="en" class="lang-globe-item current" aria-current="true">English</a></li></ul></details></li>
+        </div>
+        <ul class="nav-links">
+                <li><a href="/en/" class="active"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg>Home</a></li>
+                <li><a href="/en/#services"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rocket"/></svg>Services</a></li>
+                <li class="nav-group">
+                    <button type="button" class="nav-group-toggle" aria-expanded="false" aria-controls="nav-group-apps"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg>Applications<svg class="ico nav-chevron" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chevron-down"/></svg></button>
+                    <ul id="nav-group-apps" class="nav-links nav-links-sub nav-links-nested">
+                        <li><a href="/en/apps">All applications</a></li>
+                        <li><a href="/en/apps#files-office">Files &amp; Office</a></li>
+                        <li><a href="/en/apps#media-entertainment">Media &amp; Entertainment</a></li>
+                        <li><a href="/en/apps#home-lifestyle">Home &amp; Lifestyle</a></li>
+                        <li><a href="/en/apps#productivity-knowledge">Productivity &amp; Knowledge</a></li>
+                        <li><a href="/en/apps#system-development">System &amp; Development</a></li>
+                    </ul>
+                </li>
+                <li><a href="/en/technology"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg>Technology</a></li>
+                <li><a href="/en/backups"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg>Backups</a></li>
+        </ul>
+        <div class="sidebar-bottom">
+            <a href="/en/testing" class="btn btn-outline sidebar-cta">Apply as a tester →</a>
+            <div class="nav-group-label">About Felhom</div>
+            <ul class="nav-links nav-links-sub">
+                    <li><a href="/en/#how-it-works">How it works</a></li>
+                    <li><a href="/en/faq">FAQ</a></li>
+                    <li><a href="/en/contact">Contact</a></li>
             </ul>
-            <button class="hamburger" id="hamburger" aria-label="Open menu" aria-expanded="false">
-                <span class="hamburger-box">
-                    <span class="hamburger-line"></span>
-                    <span class="hamburger-line"></span>
-                    <span class="hamburger-line"></span>
-                </span>
-            </button>
+            <div class="sidebar-footer">
+                <details class="lang-globe"><summary class="lang-globe-btn" aria-label="Language" title="Language"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/" lang="hu" hreflang="hu" class="lang-globe-item">Magyar</a></li><li><a href="/en/" lang="en" hreflang="en" class="lang-globe-item current" aria-current="true">English</a></li></ul></details>
+            </div>
         </div>
     </nav>
-    <div class="mobile-overlay" id="mobileOverlay"></div>
-
-    <section class="hero">
-        <div class="container">
-            <div class="hero-content">
-                <div class="hero-text">
-                    <h1>Your own cloud,<br><span>your own rules</span></h1>
-                    <p>Professional home server installation and management, for households in Hungary. You are in charge; we help.</p>
-                    <a href="/en/testing" class="cta-button">I want to be a tester →</a>
-                </div>
-                <div class="hero-visual">
-                    <img src="/assets/logo.png" alt="Felhom.eu - home server service">
-                </div>
-            </div>
+    <main class="content">
+        <div class="page-header">
+            <h1>Your own cloud, your own rules</h1>
+            <span class="domain-badge">Home server service</span>
         </div>
-    </section>
 
-    <section class="content-section" id="what-it-does">
-        <div class="container">
-            <div class="section-header">
-                <h2>What the box <span>does today</span></h2>
+        <section class="hero-row">
+            <div class="hero-copy">
+                <p class="hero-lede">A small machine in your home: your photos, your documents, your films. A backup is made every night. We watch it, you use it.</p>
+                <a href="/en/testing" class="btn btn-primary btn-lg">Apply as a tester →</a>
+            </div>
+                <div class="hero-window" aria-label="A picture of the Dashboard">
+                    <div class="hero-window-bar">
+                        <span class="hw-dot"></span><span class="hw-dot"></span><span class="hw-dot"></span>
+                        <span class="hero-window-title">yourhome.hu <span class="sample">sample</span></span>
+                    </div>
+                    <div class="hero-window-body">
+                        <p class="hero-window-lede">This is what the box's Dashboard looks like.</p>
+                        <div class="launch-grid launch-grid--mini">
+                        <a class="launch-cell" href="/en/apps#immich">
+                            <span class="launch-tile" style="background: hsl(18, 45%, 38%)"><span class="launch-mono">I</span><img class="launch-logo" src="/assets/immich-logo.svg" alt="" loading="lazy"></span>
+                            <span class="launch-name">Immich</span>
+                        </a>
+                        <a class="launch-cell" href="/en/apps#jellyfin">
+                            <span class="launch-tile" style="background: hsl(348, 45%, 38%)"><span class="launch-mono">J</span><img class="launch-logo" src="/assets/jellyfin-logo.svg" alt="" loading="lazy"></span>
+                            <span class="launch-name">Jellyfin</span>
+                        </a>
+                        <a class="launch-cell" href="/en/apps#nextcloud">
+                            <span class="launch-tile" style="background: hsl(201, 45%, 38%)"><span class="launch-mono">N</span><img class="launch-logo" src="/assets/nextcloud-logo.svg" alt="" loading="lazy"></span>
+                            <span class="launch-name">Nextcloud</span>
+                        </a>
+                        <a class="launch-cell" href="/en/apps#vaultwarden">
+                            <span class="launch-tile" style="background: hsl(66, 45%, 38%)"><span class="launch-mono">V</span><img class="launch-logo" src="/assets/vaultwarden-logo.svg" alt="" loading="lazy"></span>
+                            <span class="launch-name">Vaultwarden</span>
+                        </a>
+                        </div>
+                    </div>
+                </div>
+        </section>
+
+        <section class="shell-section" id="services">
+            <div class="sec-head">
+                <h2>What the box does today</h2>
                 <p>Not a plan, not a promise — these work today on a live Felhom box</p>
             </div>
-            <div class="why-grid">
-                <div class="why-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-camera"/></svg> Photos, documents, media</h3>
-                    <p>Your phone's photos upload to your own machine on their own. Your scanned papers are read and made searchable. Your films and music play in the browser and in mobile apps.</p>
+            <div class="caps">
+                <div class="caps-group">
+                    <h3>What you use every day</h3>
+                    <ul class="caps-list">
+                        <li class="caps-item">
+                            <h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-camera"/></svg> Photos, documents, media</h4>
+                            <p>Your phone's photos upload to your own machine on their own. Your scanned papers are read and made searchable. Your films and music play in the browser and in mobile apps.</p>
+                        </li>
+                        <li class="caps-item">
+                            <h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-folder"/></svg> Network shares</h4>
+                            <p>The box's folders appear in Windows File Explorer and the Mac Finder — you drag files onto them like onto any other folder. Each share can be set to read-only.</p>
+                        </li>
+                        <li class="caps-item">
+                            <h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg> 58 apps to install</h4>
+                            <p>You install them from the Dashboard in a few clicks — no command line. Almost all of them are open source (the exceptions are marked on the apps page), and every one runs on your machine.</p>
+                        </li>
+                        <li class="caps-item">
+                            <h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg> In English or Hungarian</h4>
+                            <p>The Dashboard works in English and in Hungarian. The household picks the language, and the e-mails about the box follow it.</p>
+                        </li>
+                    </ul>
                 </div>
-                <div class="why-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-folder"/></svg> Network shares</h3>
-                    <p>The box's folders appear in Windows File Explorer and the Mac Finder — you drag files onto them like onto any other folder. Each share can be set to read-only.</p>
+                <div class="caps-group">
+                    <h3>What protects you in the background</h3>
+                    <ul class="caps-list">
+                        <li class="caps-item">
+                            <h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg> Automatic backups on three levels</h4>
+                            <p>Every night the box makes a backup on the box, a second copy on a second drive (if there is one), and an encrypted copy on remote storage. Your shared folders are in the second-drive copy and in the remote copy too.</p>
+                        </li>
+                        <li class="caps-item">
+                            <h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-lock"/></svg> A recovery code only you know</h4>
+                            <p>The key to your remote backup's encryption is a recovery code that appears exactly once — on your screen. We do not know it and cannot recreate it. That also means that without the code, we cannot read the remote backup either: keep it somewhere safe.</p>
+                        </li>
+                        <li class="caps-item">
+                            <h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rotate-cw"/></svg> Restore when something goes wrong</h4>
+                            <p>A deleted file can be brought back from the backup. If the box itself breaks, your apps' data can be brought back from the encrypted remote backup onto the reinstalled system — with the recovery code.</p>
+                        </li>
+                        <li class="caps-item">
+                            <h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg> Works when the internet is down</h4>
+                            <p>The box is in your home. If the internet goes down, you still reach your photos and files on your home network — they do not depend on a faraway provider's permission.</p>
+                        </li>
+                    </ul>
                 </div>
-                <div class="why-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg> Automatic backups on three levels</h3>
-                    <p>Every night the box makes a backup on the box, a second copy on a second drive (if there is one), and an encrypted copy on remote storage. Your shared folders are in the second-drive copy and in the remote copy too.</p>
-                </div>
-                <div class="why-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-lock"/></svg> A recovery code only you know</h3>
-                    <p>The key to your remote backup's encryption is a recovery code that appears exactly once — on your screen. We do not know it and cannot recreate it. That also means that without the code, we cannot read the remote backup either: keep it somewhere safe.</p>
-                </div>
-                <div class="why-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg> 58 apps to install</h3>
-                    <p>You install them from the Dashboard in a few clicks — no command line. Almost all of them are open source (the exceptions are marked on the apps page), and every one runs on your machine.</p>
-                </div>
-                <div class="why-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-stethoscope"/></svg> Remote monitoring, automatic updates</h3>
-                    <p>We watch how the box is doing. The Dashboard updates itself to the latest release, and the box's system gets its security updates too — you do not have to do anything. If something breaks, we see it.</p>
-                </div>
-                <div class="why-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rotate-cw"/></svg> Careful app updates</h3>
-                    <p>A new version of an app reaches you only after we have tried it. Before the update the box makes a fresh backup, and if the new version does not start properly, the box puts the previous one back by itself, with your data.</p>
-                </div>
-                <div class="why-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg> In English or Hungarian</h3>
-                    <p>The Dashboard works in English and in Hungarian. The household picks the language, and the e-mails about the box follow it.</p>
-                </div>
-                <div class="why-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg> Works when the internet is down</h3>
-                    <p>The box is in your home. If the internet goes down, you still reach your photos and files on your home network — they do not depend on a faraway provider's permission.</p>
-                </div>
-                <div class="why-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rotate-cw"/></svg> Restore when something goes wrong</h3>
-                    <p>A deleted file can be brought back from the backup. If the box itself breaks, your apps' data can be brought back from the encrypted remote backup onto the reinstalled system — with the recovery code.</p>
+                <div class="caps-group">
+                    <h3>What we take care of</h3>
+                    <ul class="caps-list">
+                        <li class="caps-item">
+                            <h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-stethoscope"/></svg> Remote monitoring, automatic updates</h4>
+                            <p>We watch how the box is doing. The Dashboard updates itself to the latest release, and the box's system gets its security updates too — you do not have to do anything. If something breaks, we see it.</p>
+                        </li>
+                        <li class="caps-item">
+                            <h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rotate-cw"/></svg> Careful app updates</h4>
+                            <p>A new version of an app reaches you only after we have tried it. Before the update the box makes a fresh backup, and if the new version does not start properly, the box puts the previous one back by itself, with your data.</p>
+                        </li>
+                    </ul>
                 </div>
             </div>
-        </div>
-    </section>
+        </section>
 
-    <section class="content-section" id="dashboard">
-        <div class="container">
-            <div class="section-header">
-                <h2>What the <span>Dashboard looks like</span></h2>
+        <section class="shell-section" id="dashboard">
+            <div class="sec-head">
+                <h2>What the Dashboard looks like</h2>
                 <p>Real pictures from a Felhom box — click one for the full size</p>
             </div>
             <div class="dash-grid">
@@ -176,429 +233,139 @@
                     <figcaption><strong>Backups</strong> — every night each app's database is backed up and checked.</figcaption>
                 </figure>
             </div>
-        </div>
-    </section>
+        </section>
 
-    <section class="content-section alt-bg">
-        <div class="container">
-            <div class="section-header">
-                <h2>Why not the <span>cloud providers?</span></h2>
-                <p>The big tech companies offer convenient services, but there are some downsides...</p>
+        <section class="shell-section" id="how-it-works">
+            <div class="sec-head">
+                <h2>How it works</h2>
+                <p>From the first conversation to a working system.</p>
             </div>
-            <div class="problem-grid">
-                <div class="problem-card">
-                    <div class="problem-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-coins"/></svg></div>
-                    <h3>Costs that never stop</h3>
-                    <p>You pay every month for storage and premium features, and the prices only go up.</p>
-                </div>
-                <div class="problem-card">
-                    <div class="problem-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-eye"/></svg></div>
-                    <h3>Your data, in someone else's hands</h3>
-                    <p>Your photos, documents and personal data sit on other people's servers, in other people's hands.</p>
-                </div>
-                <div class="problem-card">
-                    <div class="problem-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-lock"/></svg></div>
-                    <h3>Limited control</h3>
-                    <p>You do not decide which services you get, or when they are switched off.</p>
-                </div>
-            </div>
-        </div>
-    </section>
-
-    <section class="content-section" id="why">
-        <div class="container">
-            <div class="section-header">
-                <h2>Why choose <span>your own server?</span></h2>
-                <p>What makes it worth it</p>
-            </div>
-            <div class="why-grid">
-                <div class="why-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg> Privacy</h3>
-                    <p>Your data stays in your home, not on Google's or Microsoft's servers. It goes into the remote backup only encrypted.</p>
-                </div>
-                <div class="why-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-coins"/></svg> A one-off investment</h3>
-                    <p>The machine is yours, for good. No storage subscription that gets dearer every year: you pay for the electricity and, if you want it, for the management.</p>
-                </div>
-                <div class="why-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-zap"/></svg> Room to grow</h3>
-                    <p>No 15 GB limit. Add space as your needs grow — terabytes, if you need them.</p>
-                </div>
-                <div class="why-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-sliders-horizontal"/></svg> Full control</h3>
-                    <p>You decide which services you run. You are the boss, not the provider.</p>
-                </div>
-            </div>
-        </div>
-    </section>
-    <section class="content-section alt-bg" id="how-it-works">
-        <div class="container">
-            <div class="section-header">
-                <h2>How it <span>works</span></h2>
-                <p>Five simple steps from the start to a working system</p>
-            </div>
-            <div class="process-steps">
-                <div class="process-step">
-                    <div class="step-number">1</div>
-                    <span class="process-connector">→</span>
+            <div class="flow">
+                <div class="flow-step">
                     <h3>A first talk</h3>
                     <p>We talk about what you need: which apps, and how much storage.</p>
                 </div>
-                <div class="process-step">
-                    <div class="step-number">2</div>
-                    <span class="process-connector">→</span>
+                <div class="flow-step">
                     <h3>Choosing the hardware</h3>
                     <p>We help you find the machine with the best value for what you need.</p>
                 </div>
-                <div class="process-step">
-                    <div class="step-number">3</div>
-                    <span class="process-connector">→</span>
+                <div class="flow-step">
                     <h3>Installation</h3>
                     <p>We install and set up the apps, the backups and the monitoring.</p>
                 </div>
-                <div class="process-step">
-                    <div class="step-number">4</div>
-                    <span class="process-connector">→</span>
+                <div class="flow-step">
                     <h3>Handover</h3>
                     <p>We show you the system, help you bring over your existing data, and answer all your questions.</p>
                 </div>
-                <div class="process-step">
-                    <div class="step-number">5</div>
+                <div class="flow-step">
                     <h3>Running it</h3>
                     <p>We watch the system, update it and check the backups. You just use it.</p>
                 </div>
             </div>
-        </div>
-    </section>
-    <section class="content-section" id="services">
-        <div class="container">
-            <div class="section-header">
-                <h2>What you get <span>from us</span></h2>
-                <p>Turnkey solutions, done professionally</p>
-            </div>
-            <div class="service-list">
-                <div class="service-item">
-                    <span class="service-number">01</span>
-                    <div class="service-content">
-                        <h3>Buying and setting up the server</h3>
-                        <p>We help you choose the right hardware for your needs, and we set everything up.</p>
-                    </div>
-                    <span class="service-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-monitor"/></svg></span>
-                </div>
-                <div class="service-item">
-                    <span class="service-number">02</span>
-                    <div class="service-content">
-                        <h3>Installing apps</h3>
-                        <p>Nextcloud, Plex, Jellyfin, Home Assistant and many more — whatever you want.</p>
-                    </div>
-                    <span class="service-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg></span>
-                </div>
-                <div class="service-item">
-                    <span class="service-number">03</span>
-                    <div class="service-content">
-                        <h3>Safe remote access</h3>
-                        <p>Reach your server from anywhere, safely, over an encrypted connection.</p>
-                    </div>
-                    <span class="service-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></span>
-                </div>
-                <div class="service-item">
-                    <span class="service-number">04</span>
-                    <div class="service-content">
-                        <h3>Automatic backups</h3>
-                        <p>Regular, automatic backups on three levels: on the box, on a second drive, and encrypted on remote storage.</p>
-                    </div>
-                    <span class="service-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-hard-drive"/></svg></span>
-                </div>
-                <div class="service-item">
-                    <span class="service-number">05</span>
-                    <div class="service-content">
-                        <h3>Support and maintenance</h3>
-                        <p>If anything goes wrong, we are here. Regular updates, proactive monitoring.</p>
-                    </div>
-                    <span class="service-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-wrench"/></svg></span>
-                </div>
-            </div>
-        </div>
-    </section>
+        </section>
 
-    <section class="content-section alt-bg" id="apps">
-        <div class="container">
-            <div class="section-header">
-                <h2>Apps to <span>install</span></h2>
-                <p>Software you run on your own server, almost all of it open source</p>
+        <section class="shell-section" id="why">
+            <div class="sec-head">
+                <h2>Why your own?</h2>
+                <p>The same convenience, on different terms.</p>
             </div>
-
-            <div class="apps-showcase">
-                <div class="app-category-preview">
-                    <span class="cat-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-folder"/></svg></span>
-                    <h3>Files</h3>
-                    <p>Nextcloud, FileBrowser, Gokapi, Zipline</p>
+            <div class="vs">
+                <div class="vs-head">
+                    <div>With a cloud provider</div>
+                    <div>On your own box</div>
                 </div>
-                <div class="app-category-preview">
-                    <span class="cat-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-camera"/></svg></span>
-                    <h3>Photos & Media</h3>
-                    <p>Immich, Jellyfin, Plex, Audiobookshelf</p>
+                <div class="vs-row">
+                    <div>You pay every month for storage and premium features, and the prices only go up.</div>
+                    <div><strong>The machine is yours, for good.</strong> No storage subscription that gets dearer every year: you pay for the electricity and, if you want it, for the management.</div>
                 </div>
-                <div class="app-category-preview">
-                    <span class="cat-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-clapperboard"/></svg></span>
-                    <h3>Media automation</h3>
-                    <p>Sonarr, Radarr, Seerr</p>
+                <div class="vs-row">
+                    <div>Your photos, documents and personal data sit on other people's servers, in other people's hands.</div>
+                    <div><strong>Your data stays in your home</strong>, not on Google's or Microsoft's servers. It goes into the remote backup only encrypted.</div>
                 </div>
-                <div class="app-category-preview">
-                    <span class="cat-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-file-text"/></svg></span>
-                    <h3>Documents</h3>
-                    <p>Paperless-ngx, Docmost, BookStack, Outline</p>
+                <div class="vs-row">
+                    <div>The storage runs out, and when it is full you pay again.</div>
+                    <div><strong>No 15 GB limit.</strong> Add space as your needs grow — terabytes, if you need them.</div>
                 </div>
-                <div class="app-category-preview">
-                    <span class="cat-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-lock"/></svg></span>
-                    <h3>Security</h3>
-                    <p>Vaultwarden, PrivateBin</p>
-                </div>
-                <div class="app-category-preview">
-                    <span class="cat-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg></span>
-                    <h3>Home & Lifestyle</h3>
-                    <p>Tandoor, Mealie, Homebox, Actual Budget</p>
-                </div>
-                <div class="app-category-preview">
-                    <span class="cat-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-map"/></svg></span>
-                    <h3>Travel & Leisure</h3>
-                    <p>AdventureLog, Wanderer, Dawarich, Cal.com</p>
-                </div>
-                <div class="app-category-preview">
-                    <span class="cat-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chart-column"/></svg></span>
-                    <h3>Start pages</h3>
-                    <p>Homepage, Glance, Uptime Kuma</p>
-                </div>
-                <div class="app-category-preview">
-                    <span class="cat-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-gamepad-2"/></svg></span>
-                    <h3>Games</h3>
-                    <p>RoMM, Crafty Controller</p>
-                </div>
-                <div class="app-category-preview">
-                    <span class="cat-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-code"/></svg></span>
-                    <h3>For developers</h3>
-                    <p>Gitea, Code-Server, OpenGist</p>
+                <div class="vs-row">
+                    <div>You do not decide which services you get, or when they are switched off.</div>
+                    <div><strong>You decide which services you run.</strong> You are the boss, not the provider.</div>
                 </div>
             </div>
-
-            <div class="apps-cta">
-                <p class="apps-count">
-                    <strong>58</strong> apps — almost all of them <strong>open source</strong>
-                </p>
-                <a href="/en/apps" class="cta-button-secondary">
-                    See all apps →
-                </a>
-            </div>
-        </div>
-    </section>
-
-    <section class="content-section" id="technology">
-        <div class="container">
-            <div class="section-header">
-                <h2>Professional <span>technology</span></h2>
-                <p>Industry-grade tools, at home</p>
-            </div>
-
-            <div class="apps-showcase">
-                <div class="app-category-preview">
-                    <span class="cat-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-container"/></svg></span>
-                    <h3>Containers</h3>
-                    <p>Each app isolated, on Docker</p>
+            <div class="band">
+                <div class="band-item">
+                    <h3>What you can install</h3>
+                    <p>58 apps — almost all of them open source</p>
+                    <a href="/en/apps" class="btn btn-outline">See all applications →</a>
                 </div>
-                <div class="app-category-preview">
-                    <span class="cat-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-target"/></svg></span>
-                    <h3>Dashboard</h3>
-                    <p>An interface in English or Hungarian</p>
-                </div>
-                <div class="app-category-preview">
-                    <span class="cat-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg></span>
-                    <h3>Proxmox</h3>
-                    <p>A stable virtualisation base</p>
-                </div>
-                <div class="app-category-preview">
-                    <span class="cat-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg></span>
-                    <h3>Three-level backups</h3>
-                    <p>On the box, on a second drive, encrypted far away</p>
-                </div>
-                <div class="app-category-preview">
-                    <span class="cat-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></span>
-                    <h3>Network</h3>
-                    <p>HTTPS, an encrypted tunnel, no open port</p>
-                </div>
-                <div class="app-category-preview">
-                    <span class="cat-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-hard-drive"/></svg></span>
-                    <h3>Storage</h3>
-                    <p>SSD + HDD, a second drive for backups</p>
-                </div>
-                <div class="app-category-preview">
-                    <span class="cat-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-monitor"/></svg></span>
-                    <h3>Hardware</h3>
-                    <p>From a mini PC to a rack server</p>
+                <div class="band-item">
+                    <h3>What runs underneath</h3>
+                    <p>Docker containers on a Proxmox base, three-level backups, an encrypted tunnel with no open port, a Dashboard in English or Hungarian. Matched to your needs, <strong>from the simplest to the most serious</strong>.</p>
+                    <a href="/en/technology" class="btn btn-outline">More about the technology →</a>
                 </div>
             </div>
+        </section>
 
-            <div class="apps-cta">
-                <p class="apps-count">
-                    Matched to your needs — from the <strong style="color: var(--text-1);">simplest</strong> to the <strong>most serious</strong>
-                </p>
-                <a href="/en/technology" class="cta-button-secondary">
-                    More about the technology →
-                </a>
-            </div>
-        </div>
-    </section>
-
-    <section class="content-section alt-bg" id="backups">
-        <div class="container">
-            <div class="backup-content">
-                <div class="backup-text">
-                    <h2>Your data, <span>kept safe</span></h2>
-                    <p>The big cloud providers spend millions so that your data is not lost. Did you know you can get the same from your home server?</p>
-                    <p>Following the 3-2-1 backup rule, we build professional-grade data safety – after a disaster there is still an encrypted copy, far from your home.</p>
-                    <a href="/en/backups" class="cta-button-secondary">
-                        The backup strategy in detail →
-                    </a>
-                </div>
-                <div class="backup-visual">
-                    <div class="backup-rule-mini">
-                        <span class="number">3</span>
-                        <div class="rule-text">
-                            <h4>Three copies</h4>
-                            <p>The original + two backups</p>
-                        </div>
-                    </div>
-                    <div class="backup-rule-mini">
-                        <span class="number">2</span>
-                        <div class="rule-text">
-                            <h4>Two kinds of storage</h4>
-                            <p>Kept on different devices</p>
-                        </div>
-                    </div>
-                    <div class="backup-rule-mini">
-                        <span class="number">1</span>
-                        <div class="rule-text">
-                            <h4>One far away</h4>
-                            <p>An off-site backup, to be safe</p>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-    </section>
-
-    <section class="content-section" id="closed-test">
-        <div class="container">
-            <div class="section-header">
-                <h2>Closed <span>test</span></h2>
+        <section class="shell-section" id="closed-test">
+            <div class="sec-head">
+                <h2>Closed test</h2>
                 <p>We are starting to use the system for real with a few households in Hungary</p>
             </div>
-            <div class="why-grid">
-                <div class="why-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg> Real use</h3>
+            <div class="app-info-grid">
+                <div class="app-info-card">
+                    <h3>Real use</h3>
                     <p>Not a demo: the box stays with you, and you put your real photos and documents on it. We help with the installation and the move, and then you use it every day.</p>
                 </div>
-                <div class="why-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-message-square"/></svg> Feedback</h3>
+                <div class="app-info-card">
+                    <h3>Feedback</h3>
                     <p>In return we ask you to tell us what annoys you, what is unclear and what does not work. An "I couldn't find this button" is worth the most to us — it tells us what to fix.</p>
                 </div>
-                <div class="why-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-triangle-alert"/></svg> Known limits</h3>
-                    <p>Honestly: the Dashboard has <strong>one shared household password</strong> today; there are no separate accounts for family members yet (each app can have its own users, though). <strong>Streaming to the TV (DLNA)</strong> is not there yet: for now the media library plays in the browser and in mobile apps. And because this is a test, expect to find bugs — that is the point.</p>
+            </div>
+            <div class="alerts-container">
+                <div class="alert-banner alert-banner-warning">
+                    <span class="alert-icon"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-triangle-alert"/></svg></span>
+                    <span class="alert-message"><strong>Known limits, honestly.</strong> Honestly: the Dashboard has one shared household password today; there are no separate accounts for family members yet (each app can have its own users, though). Streaming to the TV (DLNA) is not there yet: for now the media library plays in the browser and in mobile apps. And because this is a test, expect to find bugs — that is the point.</span>
                 </div>
             </div>
-            <div class="apps-cta">
-                <p class="apps-count">
-                    If this interests you, write to us — <strong>it commits you to nothing</strong>, first we just talk
-                </p>
-                <a href="/en/testing" class="cta-button">
-                    I want to be a tester →
-                </a>
-            </div>
-        </div>
-    </section>
-
-    <section class="contact" id="contact">
-        <div class="container">
-            <div class="contact-box">
-                <h2>Interested? <span>Let's talk!</span></h2>
-                <div class="contact-methods">
-                    <a href="/en/contact" class="contact-link"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-message-square"/></svg> Contact form</a>
-                    <a href="mailto:info@felhom.eu" class="contact-link"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-mail"/></svg> info@felhom.eu</a>
+            <div class="close-cta">
+                <p>If this interests you, write. <strong>It commits you to nothing</strong>, we just talk first.</p>
+                <a href="/en/testing" class="btn btn-primary btn-lg">Apply as a tester →</a>
+                <div class="who-mini">
+                    <img src="/assets/operator-portrait-small.webp" alt="Viktor Nagyfenyvesi, who runs Felhom" width="160" height="200" loading="lazy">
+                    <p>There is one person behind Felhom: <strong>Viktor Nagyfenyvesi</strong>. If you write, he answers. <a href="/en/contact#ki-all-mogotte">Who is behind it →</a></p>
                 </div>
             </div>
-        </div>
-    </section>
+        </section>
 
-    <footer>
+<footer>
         <div class="container">
             <p>© 2026 felhom.eu – Your own cloud, your own rules. Felhom serves households in Hungary.</p>
             <p class="footer-legal">Operated by Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Privacy notice (Hungarian)</a> · <a href="/feltetelek">Terms (Hungarian)</a></p>
         </div>
     </footer>
+    </main>
     <script>
-    (function() {
-        const hamburger = document.getElementById('hamburger');
-        const navLinks = document.querySelector('.nav-links');
-        const overlay = document.getElementById('mobileOverlay');
-        const body = document.body;
-
-        if (!hamburger || !navLinks || !overlay) {
-            console.warn('[mobile-menu] Missing elements:', {
-                hamburger: !!hamburger,
-                navLinks: !!navLinks,
-                overlay: !!overlay
-            });
-            return;
-        }
-
-        function openMenu() {
-            hamburger.classList.add('is-active');
-            navLinks.classList.add('is-open');
-            overlay.classList.add('is-visible');
-            body.classList.add('menu-open');
-            hamburger.setAttribute('aria-expanded', 'true');
-            hamburger.setAttribute('aria-label', 'Close menu');
-        }
-
-        function closeMenu() {
-            hamburger.classList.remove('is-active');
-            navLinks.classList.remove('is-open');
-            overlay.classList.remove('is-visible');
-            body.classList.remove('menu-open');
-            hamburger.setAttribute('aria-expanded', 'false');
-            hamburger.setAttribute('aria-label', 'Open menu');
-        }
-
-        hamburger.addEventListener('click', function() {
-            if (navLinks.classList.contains('is-open')) {
-                closeMenu();
-            } else {
-                openMenu();
-            }
-        });
-
-        // Close on overlay click
-        overlay.addEventListener('click', closeMenu);
-
-        // Close on nav link click
-        navLinks.querySelectorAll('a').forEach(function(link) {
-            link.addEventListener('click', closeMenu);
-        });
-
-        // Close on Escape key
-        document.addEventListener('keydown', function(e) {
-            if (e.key === 'Escape' && navLinks.classList.contains('is-open')) {
-                closeMenu();
-            }
-        });
-
-        // Close on resize if open (e.g., rotating device)
-        window.addEventListener('resize', function() {
-            if (window.innerWidth > 900 && navLinks.classList.contains('is-open')) {
-                closeMenu();
-            }
-        });
+    (function(){
+        var b=document.getElementById('navBurger'),s=document.getElementById('sidebar'),k=document.getElementById('navBackdrop');
+        if(!b||!s||!k)return;
+        function open(){s.classList.add('is-open');k.hidden=false;document.body.classList.add('nav-open');b.setAttribute('aria-expanded','true');}
+        function close(){s.classList.remove('is-open');k.hidden=true;document.body.classList.remove('nav-open');b.setAttribute('aria-expanded','false');}
+        b.addEventListener('click',function(){s.classList.contains('is-open')?close():open();});
+        k.addEventListener('click',close);
+        document.addEventListener('keydown',function(e){if(e.key==='Escape'&&s.classList.contains('is-open')){close();b.focus();}});
+        s.querySelectorAll('a').forEach(function(l){l.addEventListener('click',close);});
+        window.addEventListener('resize',function(){if(window.innerWidth>768)close();});
     })();
+    document.addEventListener('click',function(e){
+        var btn=e.target.closest?e.target.closest('.nav-group-toggle'):null;
+        if(!btn)return;
+        var g=btn.closest('.nav-group');if(!g)return;
+        var willOpen=!g.classList.contains('is-open');
+        document.querySelectorAll('.nav-group.is-open').forEach(function(x){
+            x.classList.remove('is-open');
+            var t=x.querySelector('.nav-group-toggle');if(t)t.setAttribute('aria-expanded','false');
+        });
+        if(willOpen){g.classList.add('is-open');btn.setAttribute('aria-expanded','true');}
+    });
     </script>
 </body>
-</html>
\ No newline at end of file
+</html>
diff --git a/website/en/technology.html b/website/en/technology.html
index 30a19ccc..a04e336c 100644
--- a/website/en/technology.html
+++ b/website/en/technology.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html lang="en">
+<html lang="en" class="no-js">
 <head>
+    <script>document.documentElement.className=document.documentElement.className.replace('no-js','js');</script>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Technology — Docker, the Dashboard and Proxmox for a home server | Felhom.eu</title>
@@ -38,45 +39,63 @@
     }
     </script>
     <!-- shared assets: bump ?v= together on any site.css/icons.svg change -->
-    <link rel="stylesheet" href="/assets/site.css?v=21">
+    <link rel="stylesheet" href="/assets/site.css?v=22">
+    <link rel="stylesheet" href="/assets/shell.css?v=22">
     <link rel="icon" type="image/png" href="/assets/logo_favicon_2.svg">
     <script defer src="/assets/gallery.js?v=2"></script>
     <script defer src="https://stats.felhom.eu/script.js" data-website-id="d419db57-5e1c-48df-bdb3-c29f25fb1661"></script>
 </head>
-<body class="page-technologiak">
-    <nav>
-        <div class="container">
-            <a href="/en/" class="logo">
-                <img class="logo-mark" src="/assets/logo-mark.svg" alt="" aria-hidden="true">
-                <img class="logo-word" src="/assets/logo-wordmark.png" alt="felhom.eu">
+<body class="shell page-technologiak">
+    <header class="mobile-topbar">
+        <a href="/en/" class="mobile-topbar-logo"><img src="/assets/logo_notext_white.svg" alt="Felhom.eu"></a>
+        <button type="button" class="nav-burger" id="navBurger" aria-expanded="false" aria-controls="sidebar" aria-label="Menu">
+            <span class="hamburger-box"><span class="hamburger-line"></span><span class="hamburger-line"></span><span class="hamburger-line"></span></span>
+        </button>
+    </header>
+    <div class="nav-backdrop" id="navBackdrop" hidden></div>
+    <nav class="sidebar" id="sidebar">
+        <div class="sidebar-header">
+            <a href="/en/" class="sidebar-logo-link">
+                <img src="/assets/logo_notext_white.svg" alt="" class="sidebar-logo" aria-hidden="true">
+                <img src="/assets/logo-wordmark.png" alt="felhom.eu" class="sidebar-word">
             </a>
-            <ul class="nav-links">
-                <li><a href="/en/#services">Services</a></li>
-                <li><a href="/en/apps">Apps</a></li>
-                <li><a href="/en/technology" class="active">Technology</a></li>
-                <li><a href="/en/backups">Backups</a></li>
-                <li><a href="/en/faq">FAQ</a></li>
-                <li><a href="/en/contact">Contact</a></li>
-                <li class="lang-globe-li"><details class="lang-globe"><summary class="lang-globe-btn" aria-label="Language" title="Language"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/technologiak" lang="hu" hreflang="hu" class="lang-globe-item">Magyar</a></li><li><a href="/en/technology" lang="en" hreflang="en" class="lang-globe-item current" aria-current="true">English</a></li></ul></details></li>
+        </div>
+        <ul class="nav-links">
+                <li><a href="/en/"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg>Home</a></li>
+                <li><a href="/en/#services"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rocket"/></svg>Services</a></li>
+                <li class="nav-group">
+                    <button type="button" class="nav-group-toggle" aria-expanded="false" aria-controls="nav-group-apps"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg>Applications<svg class="ico nav-chevron" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chevron-down"/></svg></button>
+                    <ul id="nav-group-apps" class="nav-links nav-links-sub nav-links-nested">
+                        <li><a href="/en/apps">All applications</a></li>
+                        <li><a href="/en/apps#files-office">Files &amp; Office</a></li>
+                        <li><a href="/en/apps#media-entertainment">Media &amp; Entertainment</a></li>
+                        <li><a href="/en/apps#home-lifestyle">Home &amp; Lifestyle</a></li>
+                        <li><a href="/en/apps#productivity-knowledge">Productivity &amp; Knowledge</a></li>
+                        <li><a href="/en/apps#system-development">System &amp; Development</a></li>
+                    </ul>
+                </li>
+                <li><a href="/en/technology" class="active"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg>Technology</a></li>
+                <li><a href="/en/backups"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg>Backups</a></li>
+        </ul>
+        <div class="sidebar-bottom">
+            <a href="/en/testing" class="btn btn-outline sidebar-cta">Apply as a tester →</a>
+            <div class="nav-group-label">About Felhom</div>
+            <ul class="nav-links nav-links-sub">
+                    <li><a href="/en/#how-it-works">How it works</a></li>
+                    <li><a href="/en/faq">FAQ</a></li>
+                    <li><a href="/en/contact">Contact</a></li>
             </ul>
-            <button class="hamburger" id="hamburger" aria-label="Open menu" aria-expanded="false">
-                <span class="hamburger-box">
-                    <span class="hamburger-line"></span>
-                    <span class="hamburger-line"></span>
-                    <span class="hamburger-line"></span>
-                </span>
-            </button>
+            <div class="sidebar-footer">
+                <details class="lang-globe"><summary class="lang-globe-btn" aria-label="Language" title="Language"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/technologiak" lang="hu" hreflang="hu" class="lang-globe-item">Magyar</a></li><li><a href="/en/technology" lang="en" hreflang="en" class="lang-globe-item current" aria-current="true">English</a></li></ul></details>
+            </div>
         </div>
     </nav>
-    <div class="mobile-overlay" id="mobileOverlay"></div>
-
-    <main>
-        <section class="page-header">
-            <div class="container">
+<main class="content">
+                <div class="page-header">
                 <h1>The <span>technology</span></h1>
-                <p>Modern, proven tools for running a home server. This is how we build the system.</p>
             </div>
-        </section>
+                <p class="page-lede">Modern, proven tools for running a home server. This is how we build the system.</p>
+
 
         <!-- Table of Contents -->
         <section class="content-section" style="padding-top: 0;">
@@ -153,7 +172,7 @@
 
                 <div class="info-card">
                     <h3><span class="icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-target"/></svg></span> What does the Dashboard do?</h3>
-                    <p>The Dashboard is on every Felhom box: it is the interface, in English or Hungarian, that runs your system on its Proxmox base. It was designed for home servers: you install apps in a few clicks and never touch a command line — Docker and Proxmox do the work in the background.</p>
+                    <p>The Dashboard is on every Felhom box: it is the interface, in English or Hungarian, that runs your system on its Proxmox base. It was designed for home servers: you install apps in a few clicks and never touch a command line – Docker and Proxmox do the work in the background.</p>
                     
                     <ul class="feature-list">
                         <li>A web interface in English or Hungarian – the household chooses, and no command-line knowledge is needed</li>
@@ -167,11 +186,11 @@
                     <div class="dash-grid">
                     <figure class="dash-shot">
                         <a href="/assets/dashboard-apps-en.webp" data-gallery="dashboard"><img src="/assets/dashboard-apps-en.webp" alt="The Apps page: cards of installed and installable apps, with their status" width="1440" height="900" loading="lazy"></a>
-                        <figcaption><strong>Apps</strong> — install in a few clicks, and see what runs and what is up to date.</figcaption>
+                        <figcaption><strong>Apps</strong> – install in a few clicks, and see what runs and what is up to date.</figcaption>
                     </figure>
                     <figure class="dash-shot">
                         <a href="/assets/dashboard-backups-en.webp" data-gallery="dashboard"><img src="/assets/dashboard-backups-en.webp" alt="The backups page: each app's database backed up overnight, and checked" width="1440" height="900" loading="lazy"></a>
-                        <figcaption><strong>Backups</strong> — every night each app's database is backed up and checked.</figcaption>
+                        <figcaption><strong>Backups</strong> – every night each app's database is backed up and checked.</figcaption>
                     </figure>
                     </div>
 
@@ -201,7 +220,7 @@
                             <div class="layer-label">System environment</div>
                             <div class="layer-content">
                                 <div class="layer-name">Isolated system environment</div>
-                                <div class="layer-tech">Your box — a cleanly separated system</div>
+                                <div class="layer-tech">Your box – a cleanly separated system</div>
                             </div>
                         </div>
                         <div class="stack-layer">
@@ -233,10 +252,10 @@
 
                 <div class="info-card">
                     <h3><span class="icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg></span> What is Proxmox?</h3>
-                    <p>Proxmox VE is a free, professional virtualisation platform — the same kind of technology data centres and companies use. It is the base of every Felhom system: we build every machine on it, and the isolated system environment your apps run in sits on top of it.</p>
+                    <p>Proxmox VE is a free, professional virtualisation platform – the same kind of technology data centres and companies use. It is the base of every Felhom system: we build every machine on it, and the isolated system environment your apps run in sits on top of it.</p>
 
                     <div class="highlight-box">
-                        <p><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg> <strong>The base, not an option:</strong> Proxmox is on every Felhom box. You do not need to know about it or deal with it — it works quietly in the background, and it is what makes your system safe and able to be backed up.</p>
+                        <p><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg> <strong>The base, not an option:</strong> Proxmox is on every Felhom box. You do not need to know about it or deal with it – it works quietly in the background, and it is what makes your system safe and able to be backed up.</p>
                     </div>
                 </div>
 
@@ -251,7 +270,7 @@
                     </ul>
 
                     <div class="highlight-box">
-                        <p><strong>One base, one job:</strong> on a Felhom box, Proxmox runs a single isolated system environment — the one your apps work in.</p>
+                        <p><strong>One base, one job:</strong> on a Felhom box, Proxmox runs a single isolated system environment – the one your apps work in.</p>
                     </div>
                 </div>
             </div>
@@ -423,7 +442,7 @@
                 <div class="info-card" style="margin-top: 48px;">
                     <h3><span class="icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-lightbulb"/></svg></span> Which one should you choose?</h3>
                     <div class="highlight-box">
-                        <p><strong>Our advice:</strong> start small! A good mini PC is enough for most homes, and you can expand it later. A rack server is a business / on-request set-up — a home rarely needs one.</p>
+                        <p><strong>Our advice:</strong> start small! A good mini PC is enough for most homes, and you can expand it later. A rack server is a business / on-request set-up – a home rarely needs one.</p>
                     </div>
                 </div>
             </div>
@@ -439,13 +458,6 @@
             </div>
         </section>
     </main>
-
-    <footer>
-        <div class="container">
-            <p>© 2026 felhom.eu – Your own cloud, your own rules. Felhom serves households in Hungary.</p>
-            <p class="footer-legal">Operated by Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Privacy notice (Hungarian)</a> · <a href="/feltetelek">Terms (Hungarian)</a></p>
-        </div>
-    </footer>
     <script>
     (function() {
         var hamburger = document.getElementById('hamburger');
@@ -507,5 +519,35 @@
         });
     })();
     </script>
+<footer>
+        <div class="container">
+            <p>© 2026 felhom.eu – Your own cloud, your own rules. Felhom serves households in Hungary.</p>
+            <p class="footer-legal">Operated by Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Privacy notice (Hungarian)</a> · <a href="/feltetelek">Terms (Hungarian)</a></p>
+        </div>
+    </footer>
+    <script>
+    (function(){
+        var b=document.getElementById('navBurger'),s=document.getElementById('sidebar'),k=document.getElementById('navBackdrop');
+        if(!b||!s||!k)return;
+        function open(){s.classList.add('is-open');k.hidden=false;document.body.classList.add('nav-open');b.setAttribute('aria-expanded','true');}
+        function close(){s.classList.remove('is-open');k.hidden=true;document.body.classList.remove('nav-open');b.setAttribute('aria-expanded','false');}
+        b.addEventListener('click',function(){s.classList.contains('is-open')?close():open();});
+        k.addEventListener('click',close);
+        document.addEventListener('keydown',function(e){if(e.key==='Escape'&&s.classList.contains('is-open')){close();b.focus();}});
+        s.querySelectorAll('a').forEach(function(l){l.addEventListener('click',close);});
+        window.addEventListener('resize',function(){if(window.innerWidth>768)close();});
+    })();
+    document.addEventListener('click',function(e){
+        var btn=e.target.closest?e.target.closest('.nav-group-toggle'):null;
+        if(!btn)return;
+        var g=btn.closest('.nav-group');if(!g)return;
+        var willOpen=!g.classList.contains('is-open');
+        document.querySelectorAll('.nav-group.is-open').forEach(function(x){
+            x.classList.remove('is-open');
+            var t=x.querySelector('.nav-group-toggle');if(t)t.setAttribute('aria-expanded','false');
+        });
+        if(willOpen){g.classList.add('is-open');btn.setAttribute('aria-expanded','true');}
+    });
+    </script>
 </body>
-</html>
\ No newline at end of file
+</html>
diff --git a/website/en/testing.html b/website/en/testing.html
index 1e08a61c..3a5d7e5e 100644
--- a/website/en/testing.html
+++ b/website/en/testing.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html lang="en">
+<html lang="en" class="no-js">
 <head>
+    <script>document.documentElement.className=document.documentElement.className.replace('no-js','js');</script>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Looking for testers — a home server, free during the test | Felhom.eu</title>
@@ -37,44 +38,62 @@
     }
     </script>
     <!-- shared assets: bump ?v= together on any site.css/icons.svg change -->
-    <link rel="stylesheet" href="/assets/site.css?v=21">
+    <link rel="stylesheet" href="/assets/site.css?v=22">
+    <link rel="stylesheet" href="/assets/shell.css?v=22">
     <link rel="icon" type="image/png" href="/assets/logo_favicon_2.svg">
     <script defer src="https://stats.felhom.eu/script.js" data-website-id="d419db57-5e1c-48df-bdb3-c29f25fb1661"></script>
 </head>
-<body class="page-teszteles">
-    <nav>
-        <div class="container">
-            <a href="/en/" class="logo">
-                <img class="logo-mark" src="/assets/logo-mark.svg" alt="" aria-hidden="true">
-                <img class="logo-word" src="/assets/logo-wordmark.png" alt="felhom.eu">
+<body class="shell page-teszteles">
+    <header class="mobile-topbar">
+        <a href="/en/" class="mobile-topbar-logo"><img src="/assets/logo_notext_white.svg" alt="Felhom.eu"></a>
+        <button type="button" class="nav-burger" id="navBurger" aria-expanded="false" aria-controls="sidebar" aria-label="Menu">
+            <span class="hamburger-box"><span class="hamburger-line"></span><span class="hamburger-line"></span><span class="hamburger-line"></span></span>
+        </button>
+    </header>
+    <div class="nav-backdrop" id="navBackdrop" hidden></div>
+    <nav class="sidebar" id="sidebar">
+        <div class="sidebar-header">
+            <a href="/en/" class="sidebar-logo-link">
+                <img src="/assets/logo_notext_white.svg" alt="" class="sidebar-logo" aria-hidden="true">
+                <img src="/assets/logo-wordmark.png" alt="felhom.eu" class="sidebar-word">
             </a>
-            <ul class="nav-links">
-                <li><a href="/en/#services">Services</a></li>
-                <li><a href="/en/apps">Apps</a></li>
-                <li><a href="/en/technology">Technology</a></li>
-                <li><a href="/en/backups">Backups</a></li>
-                <li><a href="/en/faq">FAQ</a></li>
-                <li><a href="/en/contact">Contact</a></li>
-                <li class="lang-globe-li"><details class="lang-globe"><summary class="lang-globe-btn" aria-label="Language" title="Language"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/teszteles" lang="hu" hreflang="hu" class="lang-globe-item">Magyar</a></li><li><a href="/en/testing" lang="en" hreflang="en" class="lang-globe-item current" aria-current="true">English</a></li></ul></details></li>
+        </div>
+        <ul class="nav-links">
+                <li><a href="/en/"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg>Home</a></li>
+                <li><a href="/en/#services"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rocket"/></svg>Services</a></li>
+                <li class="nav-group">
+                    <button type="button" class="nav-group-toggle" aria-expanded="false" aria-controls="nav-group-apps"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg>Applications<svg class="ico nav-chevron" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chevron-down"/></svg></button>
+                    <ul id="nav-group-apps" class="nav-links nav-links-sub nav-links-nested">
+                        <li><a href="/en/apps">All applications</a></li>
+                        <li><a href="/en/apps#files-office">Files &amp; Office</a></li>
+                        <li><a href="/en/apps#media-entertainment">Media &amp; Entertainment</a></li>
+                        <li><a href="/en/apps#home-lifestyle">Home &amp; Lifestyle</a></li>
+                        <li><a href="/en/apps#productivity-knowledge">Productivity &amp; Knowledge</a></li>
+                        <li><a href="/en/apps#system-development">System &amp; Development</a></li>
+                    </ul>
+                </li>
+                <li><a href="/en/technology"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg>Technology</a></li>
+                <li><a href="/en/backups"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg>Backups</a></li>
+        </ul>
+        <div class="sidebar-bottom">
+            <a href="/en/testing" class="btn btn-outline sidebar-cta">Apply as a tester →</a>
+            <div class="nav-group-label">About Felhom</div>
+            <ul class="nav-links nav-links-sub">
+                    <li><a href="/en/#how-it-works">How it works</a></li>
+                    <li><a href="/en/faq">FAQ</a></li>
+                    <li><a href="/en/contact">Contact</a></li>
             </ul>
-            <button class="hamburger" id="hamburger" aria-label="Open menu" aria-expanded="false">
-                <span class="hamburger-box">
-                    <span class="hamburger-line"></span>
-                    <span class="hamburger-line"></span>
-                    <span class="hamburger-line"></span>
-                </span>
-            </button>
+            <div class="sidebar-footer">
+                <details class="lang-globe"><summary class="lang-globe-btn" aria-label="Language" title="Language"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/teszteles" lang="hu" hreflang="hu" class="lang-globe-item">Magyar</a></li><li><a href="/en/testing" lang="en" hreflang="en" class="lang-globe-item current" aria-current="true">English</a></li></ul></details>
+            </div>
         </div>
     </nav>
-    <div class="mobile-overlay" id="mobileOverlay"></div>
-
-    <main>
-        <section class="page-header">
-            <div class="container">
+<main class="content">
+                <div class="page-header">
                 <h1>Become a <span>tester</span></h1>
-                <p>We are starting to run the system for real in a few households. There is no fee during the test, we do the setup, and we pay for the domain. In return we ask you to tell us what does not work.</p>
             </div>
-        </section>
+                <p class="page-lede">We are starting to run the system for real in a few households. There is no fee during the test, we do the setup, and we pay for the domain. In return we ask you to tell us what does not work.</p>
+
 
         <!-- Hungary only -->
         <section class="content-section">
@@ -91,14 +110,14 @@
             <div class="container">
                 <div class="section-header">
                     <h2>Who it is <span>for</span></h2>
-                    <p>We are not looking for IT people — we are looking for families who will really use it</p>
+                    <p>We are not looking for IT people – we are looking for families who will really use it</p>
                 </div>
                 <div class="info-card">
                     <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg> A household that wants its data back at home</h3>
-                    <p>If your photos, your scanned paperwork and your films live with a foreign provider today, and you would rather keep them at home on your own machine — we are looking for you.</p>
+                    <p>If your photos, your scanned paperwork and your films live with a foreign provider today, and you would rather keep them at home on your own machine – we are looking for you.</p>
                     <p><strong>No IT knowledge is needed.</strong> We set the server up at your home and we operate it. You use it from the browser, like any other site.</p>
                     <div class="highlight-box">
-                        <p>What you do need is <strong>patience</strong>. This is a test, not a finished product. You will find faults — that is the point of it.</p>
+                        <p>What you do need is <strong>patience</strong>. This is a test, not a finished product. You will find faults – that is the point of it.</p>
                     </div>
                 </div>
             </div>
@@ -109,31 +128,31 @@
             <div class="container">
                 <div class="section-header">
                     <h2>What you <span>need</span></h2>
-                    <p>Three things — and we pay for the third</p>
+                    <p>Three things – and we pay for the third</p>
                 </div>
 
                 <div class="info-card">
                     <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-cpu"/></svg> 1. A machine that can stay on</h3>
-                    <!-- source: website/en/faq.html — same answers as the Hungarian FAQ -->
-                    <p>The server sits in your home and runs all the time, so it has to be quiet and economical. From the FAQ: most households are well served by a mini PC (for example an Intel N100 with 16-32 GB of RAM) — quiet, economical at 15-35 W, and small enough for the shelf next to the router.</p>
-                    <p>An older machine can work too: a former desktop PC can make a good server. During the first conversation we check whether the machine you have is up to the job (enough RAM, storage and reliability). Power draw and noise matter — an old gaming PC works, but it costs considerably more per month than a modern mini PC.</p>
-                    <p>If you have no machine, that is not a blocker — we work out what suits you during the first conversation. More detailed configurations are on the <a href="/en/technology">Technology</a> page.</p>
+                    <!-- source: website/en/faq.html – same answers as the Hungarian FAQ -->
+                    <p>The server sits in your home and runs all the time, so it has to be quiet and economical. From the FAQ: most households are well served by a mini PC (for example an Intel N100 with 16-32 GB of RAM) – quiet, economical at 15-35 W, and small enough for the shelf next to the router.</p>
+                    <p>An older machine can work too: a former desktop PC can make a good server. During the first conversation we check whether the machine you have is up to the job (enough RAM, storage and reliability). Power draw and noise matter – an old gaming PC works, but it costs considerably more per month than a modern mini PC.</p>
+                    <p>If you have no machine, that is not a blocker – we work out what suits you during the first conversation. More detailed configurations are on the <a href="/en/technology">Technology</a> page.</p>
                 </div>
 
                 <div class="info-card">
                     <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-radio-tower"/></svg> 2. Home internet</h3>
-                    <!-- source: website/en/faq.html — „What internet connection do I need?" -->
-                    <p>For use at home, any connection is enough, because the apps run on your own local network rather than over the internet. If you also want to reach your server from elsewhere — from work, or on holiday — then upload speed is what counts: at least 10 Mbps is recommended, and more is better.</p>
+                    <!-- source: website/en/faq.html – „What internet connection do I need?" -->
+                    <p>For use at home, any connection is enough, because the apps run on your own local network rather than over the internet. If you also want to reach your server from elsewhere – from work, or on holiday – then upload speed is what counts: at least 10 Mbps is recommended, and more is better.</p>
                 </div>
 
                 <div class="info-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg> 3. A domain — which we pay for</h3>
+                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg> 3. A domain – which we pay for</h3>
                     <!-- source: operator ruling D1, 2026-10-10 (CONTEXT.md); documentation/architecture/01-topology-and-trust.md §7 -->
-                    <p>Your server and your apps are reached through <strong>your own domain</strong> — never a name under felhom.eu. Your dashboard becomes <code>felhom.your-domain.hu</code>, and every app gets its own subdomain.</p>
+                    <p>Your server and your apps are reached through <strong>your own domain</strong> – never a name under felhom.eu. Your dashboard becomes <code>felhom.your-domain.hu</code>, and every app gets its own subdomain.</p>
                     <div class="highlight-box">
                         <p><strong>The domain is registered in your name, and we pay the fee for two years during the test.</strong> So the domain is yours: when the test ends, or if you leave, <strong>you keep the domain</strong> and carry on paying for it yourself. We do not ask for it back and we do not take it with us.</p>
                     </div>
-                    <p>We manage the domain's DNS settings during the test with an access token that <strong>can see that one domain only</strong> — it reaches nothing else.</p>
+                    <p>We manage the domain's DNS settings during the test with an access token that <strong>can see that one domain only</strong> – it reaches nothing else.</p>
                 </div>
             </div>
         </section>
@@ -143,7 +162,7 @@
             <div class="container">
                 <div class="section-header">
                     <h2>What you <span>get</span></h2>
-                    <p>The same list as section 3 of the test terms — no more and no less</p>
+                    <p>The same list as section 3 of the test terms – no more and no less</p>
                 </div>
                 <div class="info-card">
                     <!-- source: documentation/legal/feltetelek-1.0.md §3 (same promises, no new ones) -->
@@ -156,7 +175,7 @@
                         <li>We <strong>update</strong> the apps and the system, usually at night, in a window you choose.</li>
                         <li>And as above: <strong>we pay for the domain for two years.</strong></li>
                     </ul>
-                    <p>What we do <strong>not</strong> promise — we commit to no availability and no response time — is in section 5 of the <a href="/feltetelek">test terms (Hungarian)</a>. It is worth reading before you apply.</p>
+                    <p>What we do <strong>not</strong> promise – we commit to no availability and no response time – is in section 5 of the <a href="/feltetelek">test terms (Hungarian)</a>. It is worth reading before you apply.</p>
                 </div>
             </div>
         </section>
@@ -166,11 +185,11 @@
             <div class="container">
                 <div class="section-header">
                     <h2>What we <span>ask for</span></h2>
-                    <p>Not money — neither from you nor to us</p>
+                    <p>Not money – neither from you nor to us</p>
                 </div>
                 <div class="info-card">
                     <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-message-square"/></svg> Tell us what is wrong</h3>
-                    <p>This is the only thing we ask in return. What is annoying, what is unclear, what does not work. A "I could not find that button" is worth the most to us — that is how we learn what to fix.</p>
+                    <p>This is the only thing we ask in return. What is annoying, what is unclear, what does not work. A "I could not find that button" is worth the most to us – that is how we learn what to fix.</p>
 
                     <h3 style="margin-top: 24px;"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg> Keep a copy of your own</h3>
                     <!-- source: documentation/legal/feltetelek-1.0.md §4 -->
@@ -189,7 +208,7 @@
                     <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-users"/></svg> Up to 5 households</h3>
                     <!-- source: operator ruling D2, 2026-10-10 (CONTEXT.md) -->
                     <p>The closed test runs with <strong>up to 5 households</strong>. The number is small because one person operates the system, and we want time for every tester. The test is <strong>just starting</strong>, so <strong>all 5 places are open</strong>.</p>
-                    <p>If it fills up, we will say so — and tell you when a place opens again.</p>
+                    <p>If it fills up, we will say so – and tell you when a place opens again.</p>
                 </div>
             </div>
         </section>
@@ -198,7 +217,7 @@
         <section class="cta-section">
             <div class="container">
                 <h2>Interested? <span>Apply</span></h2>
-                <p>Send us a message — it <strong>commits you to nothing</strong>, we just talk first. We go through whether you have a suitable machine, and what you would use it for.</p>
+                <p>Send us a message – it <strong>commits you to nothing</strong>, we just talk first. We go through whether you have a suitable machine, and what you would use it for.</p>
                 <a href="/en/contact?tema=zart-teszt" class="cta-button">Apply as a tester →</a>
             </div>
         </section>
@@ -211,21 +230,14 @@
                 </div>
                 <div class="info-card">
                     <ul>
-                        <li><a href="/feltetelek">The closed test terms (Hungarian)</a> — what you get, what we do not promise, and how to leave.</li>
-                        <li><a href="/adatkezeles">Privacy notice (Hungarian)</a> — what data we handle, for how long, and why.</li>
-                        <li><a href="/en/faq">FAQ</a> — the most common questions, from the machine to the backups.</li>
+                        <li><a href="/feltetelek">The closed test terms (Hungarian)</a> – what you get, what we do not promise, and how to leave.</li>
+                        <li><a href="/adatkezeles">Privacy notice (Hungarian)</a> – what data we handle, for how long, and why.</li>
+                        <li><a href="/en/faq">FAQ</a> – the most common questions, from the machine to the backups.</li>
                     </ul>
                 </div>
             </div>
         </section>
     </main>
-
-    <footer>
-        <div class="container">
-            <p>© 2026 felhom.eu – Your own cloud, your own rules. Felhom serves households in Hungary.</p>
-            <p class="footer-legal">Operated by Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Privacy notice (Hungarian)</a> · <a href="/feltetelek">Terms (Hungarian)</a></p>
-        </div>
-    </footer>
     <script>
     (function() {
         var hamburger = document.getElementById('hamburger');
@@ -287,5 +299,35 @@
         });
     })();
     </script>
+<footer>
+        <div class="container">
+            <p>© 2026 felhom.eu – Your own cloud, your own rules. Felhom serves households in Hungary.</p>
+            <p class="footer-legal">Operated by Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Privacy notice (Hungarian)</a> · <a href="/feltetelek">Terms (Hungarian)</a></p>
+        </div>
+    </footer>
+    <script>
+    (function(){
+        var b=document.getElementById('navBurger'),s=document.getElementById('sidebar'),k=document.getElementById('navBackdrop');
+        if(!b||!s||!k)return;
+        function open(){s.classList.add('is-open');k.hidden=false;document.body.classList.add('nav-open');b.setAttribute('aria-expanded','true');}
+        function close(){s.classList.remove('is-open');k.hidden=true;document.body.classList.remove('nav-open');b.setAttribute('aria-expanded','false');}
+        b.addEventListener('click',function(){s.classList.contains('is-open')?close():open();});
+        k.addEventListener('click',close);
+        document.addEventListener('keydown',function(e){if(e.key==='Escape'&&s.classList.contains('is-open')){close();b.focus();}});
+        s.querySelectorAll('a').forEach(function(l){l.addEventListener('click',close);});
+        window.addEventListener('resize',function(){if(window.innerWidth>768)close();});
+    })();
+    document.addEventListener('click',function(e){
+        var btn=e.target.closest?e.target.closest('.nav-group-toggle'):null;
+        if(!btn)return;
+        var g=btn.closest('.nav-group');if(!g)return;
+        var willOpen=!g.classList.contains('is-open');
+        document.querySelectorAll('.nav-group.is-open').forEach(function(x){
+            x.classList.remove('is-open');
+            var t=x.querySelector('.nav-group-toggle');if(t)t.setAttribute('aria-expanded','false');
+        });
+        if(willOpen){g.classList.add('is-open');btn.setAttribute('aria-expanded','true');}
+    });
+    </script>
 </body>
 </html>
diff --git a/website/feltetelek.html b/website/feltetelek.html
index ad65a78d..687190da 100644
--- a/website/feltetelek.html
+++ b/website/feltetelek.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html lang="hu">
+<html lang="hu" class="no-js">
 <head>
+    <script>document.documentElement.className=document.documentElement.className.replace('no-js','js');</script>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>A zárt teszt feltételei | Felhom.eu</title>
@@ -19,36 +20,58 @@
     <meta property="og:site_name" content="Felhom.eu">
 
     <!-- shared assets: bump ?v= together on any site.css/icons.svg change -->
-    <link rel="stylesheet" href="/assets/site.css?v=21">
+    <link rel="stylesheet" href="/assets/site.css?v=22">
+    <link rel="stylesheet" href="/assets/shell.css?v=22">
     <link rel="icon" type="image/png" href="/assets/logo_favicon_2.svg">
     <script defer src="https://stats.felhom.eu/script.js" data-website-id="d419db57-5e1c-48df-bdb3-c29f25fb1661"></script>
 </head>
-<body class="page-feltetelek">
-    <nav>
-        <div class="container">
-            <a href="/" class="logo">
-                <img class="logo-mark" src="/assets/logo-mark.svg" alt="" aria-hidden="true">
-                <img class="logo-word" src="/assets/logo-wordmark.png" alt="felhom.eu">
+<body class="shell page-feltetelek">
+    <header class="mobile-topbar">
+        <a href="/" class="mobile-topbar-logo"><img src="/assets/logo_notext_white.svg" alt="Felhom.eu"></a>
+        <button type="button" class="nav-burger" id="navBurger" aria-expanded="false" aria-controls="sidebar" aria-label="Menü">
+            <span class="hamburger-box"><span class="hamburger-line"></span><span class="hamburger-line"></span><span class="hamburger-line"></span></span>
+        </button>
+    </header>
+    <div class="nav-backdrop" id="navBackdrop" hidden></div>
+    <nav class="sidebar" id="sidebar">
+        <div class="sidebar-header">
+            <a href="/" class="sidebar-logo-link">
+                <img src="/assets/logo_notext_white.svg" alt="" class="sidebar-logo" aria-hidden="true">
+                <img src="/assets/logo-wordmark.png" alt="felhom.eu" class="sidebar-word">
             </a>
-            <ul class="nav-links">
-                <li><a href="/#szolgaltatasok">Szolgáltatások</a></li>
-                <li><a href="/alkalmazasok">Alkalmazások</a></li>
-                <li><a href="/technologiak">Technológiák</a></li>
-                <li><a href="/biztonsagimentes">Mentések</a></li>
-                <li><a href="/gyik">GYIK</a></li>
-                <li><a href="/kapcsolat">Kapcsolat</a></li>
-                <li class="lang-globe-li"><details class="lang-globe"><summary class="lang-globe-btn" aria-label="Nyelv" title="Nyelv"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/feltetelek" lang="hu" hreflang="hu" class="lang-globe-item current" aria-current="true">Magyar</a></li><li><a href="/en/" lang="en" hreflang="en" class="lang-globe-item">English</a></li></ul></details></li>
+        </div>
+        <ul class="nav-links">
+                <li><a href="/"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg>Kezdőlap</a></li>
+                <li><a href="/#szolgaltatasok"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rocket"/></svg>Szolgáltatások</a></li>
+                <li class="nav-group">
+                    <button type="button" class="nav-group-toggle" aria-expanded="false" aria-controls="nav-group-apps"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg>Alkalmazások<svg class="ico nav-chevron" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chevron-down"/></svg></button>
+                    <ul id="nav-group-apps" class="nav-links nav-links-sub nav-links-nested">
+                        <li><a href="/alkalmazasok">Minden alkalmazás</a></li>
+                        <li><a href="/alkalmazasok#fajlkezeles-irodai">Fájlkezelés &amp; Irodai</a></li>
+                        <li><a href="/alkalmazasok#media-szorakozas">Média &amp; Szórakozás</a></li>
+                        <li><a href="/alkalmazasok#otthon-eletmod">Otthon &amp; Életmód</a></li>
+                        <li><a href="/alkalmazasok#produktivitas-tudaskezeles">Produktivitás &amp; Tudáskezelés</a></li>
+                        <li><a href="/alkalmazasok#rendszer-fejlesztes">Rendszer &amp; Fejlesztés</a></li>
+                    </ul>
+                </li>
+                <li><a href="/technologiak"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg>Technológiák</a></li>
+                <li><a href="/biztonsagimentes"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg>Biztonsági mentés</a></li>
+        </ul>
+        <div class="sidebar-bottom">
+            <a href="/teszteles" class="btn btn-outline sidebar-cta">Jelentkezem tesztelőnek →</a>
+            <div class="nav-group-label">A Felhomról</div>
+            <ul class="nav-links nav-links-sub">
+                    <li><a href="/#hogyan-mukodik">Hogyan működik</a></li>
+                    <li><a href="/gyik">GYIK</a></li>
+                    <li><a href="/kapcsolat">Kapcsolat</a></li>
             </ul>
-            <button class="hamburger" id="hamburger" aria-label="Menü megnyitása" aria-expanded="false">
-                <span class="hamburger-box">
-                    <span class="hamburger-line"></span>
-                    <span class="hamburger-line"></span>
-                    <span class="hamburger-line"></span>
-                </span>
-            </button>
+            <div class="sidebar-footer">
+                <details class="lang-globe"><summary class="lang-globe-btn" aria-label="Nyelv" title="Nyelv"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/feltetelek" lang="hu" hreflang="hu" class="lang-globe-item current" aria-current="true">Magyar</a></li><li><a href="#" lang="en" hreflang="en" class="lang-globe-item">English</a></li></ul></details>
+            </div>
         </div>
     </nav>
-    <div class="mobile-overlay" id="mobileOverlay"></div>
+<main class="content">
+
 
         <header class="page-header">
         <div class="container">
@@ -193,12 +216,6 @@
 
         </div>
     </section>
-    <footer>
-        <div class="container">
-            <p>© 2026 felhom.eu – Saját felhőd, saját szabályaid</p>
-            <p class="footer-legal">Üzemeltető: Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Adatkezelési tájékoztató</a> · <a href="/feltetelek">Feltételek</a></p>
-        </div>
-    </footer>
     <script>
     (function() {
         var hamburger = document.getElementById('hamburger');
@@ -260,5 +277,36 @@
         });
     })();
     </script>
+<footer>
+        <div class="container">
+            <p>© 2026 felhom.eu – Saját felhőd, saját szabályaid</p>
+            <p class="footer-legal">Üzemeltető: Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Adatkezelési tájékoztató</a> · <a href="/feltetelek">Feltételek</a></p>
+        </div>
+    </footer>
+    </main>
+    <script>
+    (function(){
+        var b=document.getElementById('navBurger'),s=document.getElementById('sidebar'),k=document.getElementById('navBackdrop');
+        if(!b||!s||!k)return;
+        function open(){s.classList.add('is-open');k.hidden=false;document.body.classList.add('nav-open');b.setAttribute('aria-expanded','true');}
+        function close(){s.classList.remove('is-open');k.hidden=true;document.body.classList.remove('nav-open');b.setAttribute('aria-expanded','false');}
+        b.addEventListener('click',function(){s.classList.contains('is-open')?close():open();});
+        k.addEventListener('click',close);
+        document.addEventListener('keydown',function(e){if(e.key==='Escape'&&s.classList.contains('is-open')){close();b.focus();}});
+        s.querySelectorAll('a').forEach(function(l){l.addEventListener('click',close);});
+        window.addEventListener('resize',function(){if(window.innerWidth>768)close();});
+    })();
+    document.addEventListener('click',function(e){
+        var btn=e.target.closest?e.target.closest('.nav-group-toggle'):null;
+        if(!btn)return;
+        var g=btn.closest('.nav-group');if(!g)return;
+        var willOpen=!g.classList.contains('is-open');
+        document.querySelectorAll('.nav-group.is-open').forEach(function(x){
+            x.classList.remove('is-open');
+            var t=x.querySelector('.nav-group-toggle');if(t)t.setAttribute('aria-expanded','false');
+        });
+        if(willOpen){g.classList.add('is-open');btn.setAttribute('aria-expanded','true');}
+    });
+    </script>
 </body>
-</html>
\ No newline at end of file
+</html>
diff --git a/website/gyik.html b/website/gyik.html
index 15765a28..85ade2da 100644
--- a/website/gyik.html
+++ b/website/gyik.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html lang="hu">
+<html lang="hu" class="no-js">
 <head>
+    <script>document.documentElement.className=document.documentElement.className.replace('no-js','js');</script>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>GYIK — Gyakran ismételt kérdések otthoni szerver szolgáltatásról | Felhom.eu</title>
@@ -36,7 +37,7 @@
           "name": "Mi az a Felhom.eu, és mit csináltok pontosan?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "A Felhom.eu egy olyan szolgáltatást nyújt, amely segít az otthoni szerver(ek) telepítésében és üzemeltetésében. Kulcsrakész megoldásokat kínálunk: megválasztjuk a hardvert, beállítjuk a szoftvereket, biztosítjuk a mentéseket, és folyamatosan figyelemmel kísérjük a rendszert. A cél egyszerű: a nagy felhőszolgáltatók (Google, Microsoft, Apple) helyett a saját otthonodban futó szerveren tárolhatod az adataidat — anélkül, hogy neked kellene szakértőnek lenned."
+            "text": "A Felhom.eu egy olyan szolgáltatást nyújt, amely segít az otthoni szerver(ek) telepítésében és üzemeltetésében. Kulcsrakész megoldásokat kínálunk: megválasztjuk a hardvert, beállítjuk a szoftvereket, biztosítjuk a mentéseket, és folyamatosan figyelemmel kísérjük a rendszert. A cél egyszerű: a nagy felhőszolgáltatók (Google, Microsoft, Apple) helyett a saját otthonodban futó szerveren tárolhatod az adataidat – anélkül, hogy neked kellene szakértőnek lenned."
           }
         },
         {
@@ -44,7 +45,7 @@
           "name": "Kinek való ez a szolgáltatás?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "Mindenkinek, aki szeretné visszavenni az irányítást a digitális élete felett. Tipikus ügyfeleink: Családok, akik szeretnék a fotóikat, videóikat biztonságban tudni, és nem akarnak havonta fizetni a felhőtárhelyért. Adatvédelem-tudatos felhasználók, akik nem akarják, hogy a Google vagy a Microsoft hozzáférjen a dokumentumaikhoz. Médiarajongók, akik saját Netflix/Spotify-szerű rendszert szeretnének a filmjeikhez és zenéjükhöz. Kisvállalkozások, amelyeknek szükségük van dokumentumkezelésre, belső wikire, vagy időpontfoglalásra — saját kontroll alatt."
+            "text": "Mindenkinek, aki szeretné visszavenni az irányítást a digitális élete felett. Tipikus ügyfeleink: Családok, akik szeretnék a fotóikat, videóikat biztonságban tudni, és nem akarnak havonta fizetni a felhőtárhelyért. Adatvédelem-tudatos felhasználók, akik nem akarják, hogy a Google vagy a Microsoft hozzáférjen a dokumentumaikhoz. Médiarajongók, akik saját Netflix/Spotify-szerű rendszert szeretnének a filmjeikhez és zenéjükhöz. Kisvállalkozások, amelyeknek szükségük van dokumentumkezelésre, belső wikire, vagy időpontfoglalásra – saját kontroll alatt."
           }
         },
         {
@@ -52,7 +53,7 @@
           "name": "Kell hozzá bármilyen technikai tudás?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "Nem. A teljes telepítést és beállítást mi végezzük. A te dolgod annyi, hogy használod az alkalmazásokat — böngészőn vagy mobilon keresztül, pont úgy, mint egy Google vagy Apple szolgáltatást. A telepítés után egy rövid bemutatón végigvezetünk, hogy magabiztosan használd a rendszert."
+            "text": "Nem. A teljes telepítést és beállítást mi végezzük. A te dolgod annyi, hogy használod az alkalmazásokat – böngészőn vagy mobilon keresztül, pont úgy, mint egy Google vagy Apple szolgáltatást. A telepítés után egy rövid bemutatón végigvezetünk, hogy magabiztosan használd a rendszert."
           }
         },
         {
@@ -60,7 +61,7 @@
           "name": "Mi a különbség a Felhom.eu és a Synology/QNAP NAS szolgáltatásai között?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "A Synology és QNAP elsősorban fájltárolásra készült NAS (hálózati adattároló) eszközök, saját zárt szoftverrel. Mi ezzel szemben egy nyílt, Docker-alapú rendszert kínálunk, amelyre a katalógus alkalmazásai pár kattintással telepíthetők — fotókezelőtől a média szerveren át a jelszókezelőig. A NAS-ok korlátozott alkalmazás-választékot kínálnak és a gyártó szoftverfrissítéseitől függenek. Nálunk 58 alkalmazásból válogathatsz, és ha valami hiányzik, megnézzük, felvehető-e."
+            "text": "A Synology és QNAP elsősorban fájltárolásra készült NAS (hálózati adattároló) eszközök, saját zárt szoftverrel. Mi ezzel szemben egy nyílt, Docker-alapú rendszert kínálunk, amelyre a katalógus alkalmazásai pár kattintással telepíthetők – fotókezelőtől a média szerveren át a jelszókezelőig. A NAS-ok korlátozott alkalmazás-választékot kínálnak és a gyártó szoftverfrissítéseitől függenek. Nálunk 58 alkalmazásból válogathatsz, és ha valami hiányzik, megnézzük, felvehető-e."
           }
         },
         {
@@ -68,7 +69,7 @@
           "name": "Hogyan néz ki a folyamat az elejétől a végéig?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "1. Egyeztetés — Megbeszéljük, mire van szükséged: milyen alkalmazásokat használnál, mennyi tárhelyet szeretnél, és mi a költségkereted. 2. Hardver kiválasztás — Segítünk megtalálni az optimális gépet, ami illeszkedik az igényeidhez és a büdzsédhez. 3. Telepítés és beállítás — Feltelepítjük az operációs rendszert, a konténerkezelőt, az alkalmazásokat, beállítjuk a mentéseket és a monitoringot. 4. Átadás és betanítás — Bemutatjuk, hogyan használd a rendszert, és válaszolunk minden kérdésedre. 5. Folyamatos üzemeltetés — Figyeljük a mentéseket, karbantartjuk a rendszert, és segítünk, ha bármi gond van."
+            "text": "1. Egyeztetés – Megbeszéljük, mire van szükséged: milyen alkalmazásokat használnál, mennyi tárhelyet szeretnél, és mi a költségkereted. 2. Hardver kiválasztás – Segítünk megtalálni az optimális gépet, ami illeszkedik az igényeidhez és a büdzsédhez. 3. Telepítés és beállítás – Feltelepítjük az operációs rendszert, a konténerkezelőt, az alkalmazásokat, beállítjuk a mentéseket és a monitoringot. 4. Átadás és betanítás – Bemutatjuk, hogyan használd a rendszert, és válaszolunk minden kérdésedre. 5. Folyamatos üzemeltetés – Figyeljük a mentéseket, karbantartjuk a rendszert, és segítünk, ha bármi gond van."
           }
         },
         {
@@ -76,7 +77,7 @@
           "name": "Milyen gépre van szükségem?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "A legtöbb otthoni felhasználónak egy mini PC (pl. Intel N100 processzorral, 16-32 GB RAM-mal) tökéletesen megfelel. Ezek csendesek, energiatakarékosak (15-35W fogyasztás), és kompaktak — elfér a polcon a router mellett. Ha nagyobb tárhelyet szeretnél (pl. filmes könyvtárhoz), egy NAS-al vagy külső merevlemezekkel bővíthető. Részletesebb konfigurációkat a Technológiák oldalon találsz."
+            "text": "A legtöbb otthoni felhasználónak egy mini PC (pl. Intel N100 processzorral, 16-32 GB RAM-mal) tökéletesen megfelel. Ezek csendesek, energiatakarékosak (15-35W fogyasztás), és kompaktak – elfér a polcon a router mellett. Ha nagyobb tárhelyet szeretnél (pl. filmes könyvtárhoz), egy NAS-al vagy külső merevlemezekkel bővíthető. Részletesebb konfigurációkat a Technológiák oldalon találsz."
           }
         },
         {
@@ -84,7 +85,7 @@
           "name": "Használhatom a már meglévő régi gépemet?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "Sok esetben igen! Egy korábbi asztali PC kiváló szerver lehet. Az egyeztetés során felmérjük, hogy a meglévő géped alkalmas-e a tervezett feladatokra (elég RAM, tároló kapacitás, megbízhatóság). Fontos szempont a fogyasztás és a zajszint — egy régi gamer PC működik ugyan, de havi szinten jóval többet fogyaszt, mint egy modern mini PC."
+            "text": "Sok esetben igen! Egy korábbi asztali PC kiváló szerver lehet. Az egyeztetés során felmérjük, hogy a meglévő géped alkalmas-e a tervezett feladatokra (elég RAM, tároló kapacitás, megbízhatóság). Fontos szempont a fogyasztás és a zajszint – egy régi gamer PC működik ugyan, de havi szinten jóval többet fogyaszt, mint egy modern mini PC."
           }
         },
         {
@@ -108,7 +109,7 @@
           "name": "Mennyire hangos egy ilyen szerver?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "A mini PC-k szinte hangtalan működnek — sok modell ventilátort sem tartalmaz, vagy csak néha kapcsol be rövid időre. Hétköznapi használat mellett nyugodtan tarthatod az íróasztalon vagy a hálószoba polcán. A tower szerverek és rack szervereknél ez már más — ezeket inkább pincébe, kamrába érdemes helyezni."
+            "text": "A mini PC-k szinte hangtalan működnek – sok modell ventilátort sem tartalmaz, vagy csak néha kapcsol be rövid időre. Hétköznapi használat mellett nyugodtan tarthatod az íróasztalon vagy a hálószoba polcán. A tower szerverek és rack szervereknél ez már más – ezeket inkább pincébe, kamrába érdemes helyezni."
           }
         },
         {
@@ -116,7 +117,7 @@
           "name": "Mi történik, ha elmegy az áram?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "A telepítés során a szerver BIOS-át úgy konfiguráljuk (amennyiben az opció rendelkezésre áll), hogy áramszünet után automatikusan bekapcsoljon. Az operációs rendszer és az összes alkalmazás szintén automatikusan elindul a bekapcsolást követően. Ez a beállítás minden telepítésünk alapértelmezett része. Áramszünet után a doboz magától helyreáll — ezt valódi áramszünettel is kipróbáltuk. Ha a megbízhatóság kritikus, szünetmentes tápegységet (UPS) is tudunk javasolni, ami néhány perc szünet áthidalására elegendő."
+            "text": "A telepítés során a szerver BIOS-át úgy konfiguráljuk (amennyiben az opció rendelkezésre áll), hogy áramszünet után automatikusan bekapcsoljon. Az operációs rendszer és az összes alkalmazás szintén automatikusan elindul a bekapcsolást követően. Ez a beállítás minden telepítésünk alapértelmezett része. Áramszünet után a doboz magától helyreáll – ezt valódi áramszünettel is kipróbáltuk. Ha a megbízhatóság kritikus, szünetmentes tápegységet (UPS) is tudunk javasolni, ami néhány perc szünet áthidalására elegendő."
           }
         },
         {
@@ -124,7 +125,7 @@
           "name": "Milyen internet kapcsolat szükséges?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "Otthoni használathoz (helyi hálózaton belül) bármilyen internet elég, mert az alkalmazások a helyi hálózatodon futnak — nem az interneten keresztül. A fotók, filmek, dokumentumok sebessége a routeredtől és a kábeles kapcsolattól függ. Ha távolról is el szeretnéd érni a szerveredet (pl. munkahelyről vagy nyaralásból), akkor a feltöltési sebesség (upload) számít: minimum 10 Mbps ajánlott, de minél több, annál jobb."
+            "text": "Otthoni használathoz (helyi hálózaton belül) bármilyen internet elég, mert az alkalmazások a helyi hálózatodon futnak – nem az interneten keresztül. A fotók, filmek, dokumentumok sebessége a routeredtől és a kábeles kapcsolattól függ. Ha távolról is el szeretnéd érni a szerveredet (pl. munkahelyről vagy nyaralásból), akkor a feltöltési sebesség (upload) számít: minimum 10 Mbps ajánlott, de minél több, annál jobb."
           }
         },
         {
@@ -132,7 +133,7 @@
           "name": "Milyen alkalmazásokat tudok futtatni?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "58 alkalmazást kínálunk — a teljes listát az Alkalmazások oldalon találod. Néhány példa: Immich — Google Photos alternatíva fotók és videók automatikus mentésével. Jellyfin/Plex — saját Netflix filmekhez és sorozatokhoz. Nextcloud — fájlok tárolása és megosztása (Google Drive helyett). Vaultwarden — jelszókezelő az egész családnak. Paperless-ngx — dokumentumok digitalizálása és kereshetővé tétele. Ha valami nincs a listán, kérdezz — megnézzük, felvehető-e a katalógusba."
+            "text": "58 alkalmazást kínálunk – a teljes listát az Alkalmazások oldalon találod. Néhány példa: Immich – Google Photos alternatíva fotók és videók automatikus mentésével. Jellyfin/Plex – saját Netflix filmekhez és sorozatokhoz. Nextcloud – fájlok tárolása és megosztása (Google Drive helyett). Vaultwarden – jelszókezelő az egész családnak. Paperless-ngx – dokumentumok digitalizálása és kereshetővé tétele. Ha valami nincs a listán, kérdezz – megnézzük, felvehető-e a katalógusba."
           }
         },
         {
@@ -156,7 +157,7 @@
           "name": "Több családtag is használhatja egyszerre?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "Igen, de érdemes tudni a jelenlegi korlátot. A telepített alkalmazások többsége (Immich, Nextcloud, Vaultwarden) támogatja a többfelhasználós működést: bennük minden családtag saját fiókot kaphat, saját bejelentkezéssel. A Felhom vezérlőpulthoz viszont jelenleg egy közös háztartási jelszó tartozik — külön családtagi fiókok a vezérlőpulton még nincsenek. A vezérlőpult az, ahonnan alkalmazást telepítesz és a mentéseket kezeled; a mindennapi használathoz (fotók, fájlok) az alkalmazások saját fiókjai kellenek."
+            "text": "Igen, de érdemes tudni a jelenlegi korlátot. A telepített alkalmazások többsége (Immich, Nextcloud, Vaultwarden) támogatja a többfelhasználós működést: bennük minden családtag saját fiókot kaphat, saját bejelentkezéssel. A Felhom vezérlőpulthoz viszont jelenleg egy közös háztartási jelszó tartozik – külön családtagi fiókok a vezérlőpulton még nincsenek. A vezérlőpult az, ahonnan alkalmazást telepítesz és a mentéseket kezeled; a mindennapi használathoz (fotók, fájlok) az alkalmazások saját fiókjai kellenek."
           }
         },
         {
@@ -164,7 +165,7 @@
           "name": "Át tudom hozni a meglévő adataimat (Google Fotók, iCloud, Dropbox)?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "Igen! A legtöbb szolgáltatásból exportálhatók az adatok. A Google Takeout segítségével az összes fotódat, dokumentumodat, naptáradat letöltheted, és az Immich, Nextcloud, stb. importálni tudja ezeket. Segítünk a migrációban. A folyamat időigénye az adatmennyiségtől függ — néhány száz GB-nyi fotó átvitele akár egy-két napot is igénybe vehet, de a rendszer utána pontosan úgy működik, ahogy a felhőszolgáltatásnál megszoktad."
+            "text": "Igen! A legtöbb szolgáltatásból exportálhatók az adatok. A Google Takeout segítségével az összes fotódat, dokumentumodat, naptáradat letöltheted, és az Immich, Nextcloud, stb. importálni tudja ezeket. Segítünk a migrációban. A folyamat időigénye az adatmennyiségtől függ – néhány száz GB-nyi fotó átvitele akár egy-két napot is igénybe vehet, de a rendszer utána pontosan úgy működik, ahogy a felhőszolgáltatásnál megszoktad."
           }
         },
         {
@@ -172,7 +173,7 @@
           "name": "Elérem a szerveremet, ha nem vagyok otthon?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "Igen! A doboz egy titkosított alagúton át, HTTPS-sel érhető el, külön alkalmazás nélkül. Ez azt jelenti, hogy bárhonnan — munkahelyről, nyaralásból, vagy akár külföldről — elérheted a fotóidat, fájljaidat, és minden alkalmazásodat, mintha otthon lennél."
+            "text": "Igen! A doboz egy titkosított alagúton át, HTTPS-sel érhető el, külön alkalmazás nélkül. Ez azt jelenti, hogy bárhonnan – munkahelyről, nyaralásból, vagy akár külföldről – elérheted a fotóidat, fájljaidat, és minden alkalmazásodat, mintha otthon lennél."
           }
         },
         {
@@ -180,7 +181,7 @@
           "name": "Mennyire biztonságos egy otthoni szerver?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "Az általunk telepített rendszerek több rétegű védelmet kapnak: automatikus HTTPS titkosítás, rendszeres biztonsági frissítések, saját bejelentkezés minden alkalmazásban, és egyes alkalmazások előtt családi kapu. A szervered a te otthonodon belül van — otthon nem nyitunk portot, kívülről csak egy titkosított alagúton keresztül érhető el. A legtöbb otthoni szerver ellen nem célzott támadások szoktak irányulni, hanem automatizált szkriptek próbálkoznak. Ezek ellen a megfelelő konfiguráció kiváló védelmet nyújt."
+            "text": "Az általunk telepített rendszerek több rétegű védelmet kapnak: automatikus HTTPS titkosítás, rendszeres biztonsági frissítések, saját bejelentkezés minden alkalmazásban, és egyes alkalmazások előtt családi kapu. A szervered a te otthonodon belül van – otthon nem nyitunk portot, kívülről csak egy titkosított alagúton keresztül érhető el. A legtöbb otthoni szerver ellen nem célzott támadások szoktak irányulni, hanem automatizált szkriptek próbálkoznak. Ezek ellen a megfelelő konfiguráció kiváló védelmet nyújt."
           }
         },
         {
@@ -188,7 +189,7 @@
           "name": "Ti hozzáfértek az adataimhoz?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "Ez egy fontos és jogos kérdés, amire őszintén válaszolunk. A támogatás és karbantartás érdekében alapesetben rendelkezünk távoli hozzáféréssel a szerveredhez — ahogy bármely IT szolgáltató a kezelt rendszerekhez. Ez szükséges a mentések ellenőrzéséhez, frissítések telepítéséhez, és hibaelhárításhoz. A távoli mentésed kulcsát viszont csak te ismered: a helyreállítási kód egyszer jelenik meg, a te képernyődön, és nálunk nem marad belőle másolat. A távoli mentést így mi sem tudjuk elolvasni. Fontos: szemben a nagy felhőszolgáltatókkal, nálunk nincs algoritmikus adatelemzés, nincs reklámcélú profilozás, és az adataid csak titkosítva hagyják el az otthonodat (a távoli mentés)."
+            "text": "Ez egy fontos és jogos kérdés, amire őszintén válaszolunk. A támogatás és karbantartás érdekében alapesetben rendelkezünk távoli hozzáféréssel a szerveredhez – ahogy bármely IT szolgáltató a kezelt rendszerekhez. Ez szükséges a mentések ellenőrzéséhez, frissítések telepítéséhez, és hibaelhárításhoz. A távoli mentésed kulcsát viszont csak te ismered: a helyreállítási kód egyszer jelenik meg, a te képernyődön, és nálunk nem marad belőle másolat. A távoli mentést így mi sem tudjuk elolvasni. Fontos: szemben a nagy felhőszolgáltatókkal, nálunk nincs algoritmikus adatelemzés, nincs reklámcélú profilozás, és az adataid csak titkosítva hagyják el az otthonodat (a távoli mentés)."
           }
         },
         {
@@ -196,7 +197,7 @@
           "name": "Mi van, ha betörnek a hálózatomba?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "A szerver alkalmazásai izolált konténerekben futnak, ami korlátozza a kár mértékét, ha egy alkalmazás sérülékeny lenne. A rendszeres frissítések, és hogy otthon nincs nyitott port, csökkentik a kockázatot. A mentéseidből egy titkosított másolat külön helyen (offsite) is tárolódik — így egy zsarolóvírus-támadás után is van egy távol tárolt másolat."
+            "text": "A szerver alkalmazásai izolált konténerekben futnak, ami korlátozza a kár mértékét, ha egy alkalmazás sérülékeny lenne. A rendszeres frissítések, és hogy otthon nincs nyitott port, csökkentik a kockázatot. A mentéseidből egy titkosított másolat külön helyen (offsite) is tárolódik – így egy zsarolóvírus-támadás után is van egy távol tárolt másolat."
           }
         },
         {
@@ -212,7 +213,7 @@
           "name": "Hogyan oldják meg a mentéseket?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "A 3-2-1 mentési szabályt követjük: 3 másolat az adatokról, 2 különböző tárolón, 1 távoli helyen. Ez iparági szabvány, amit a legnagyobb cégek is alkalmaznak. A dobozon ez három szint: egy mentés a dobozon, egy másodpéldány egy második meghajtón, és egy titkosított másolat egy távoli tárhelyen. A mentések automatikusan, éjszaka futnak. Az adatbázisok és fájlok inkrementálisan mentődnek — tehát csak a változások kerülnek mentésre, ami helyet és időt takarít meg. Részletes leírást a Mentések oldalon találsz."
+            "text": "A 3-2-1 mentési szabályt követjük: 3 másolat az adatokról, 2 különböző tárolón, 1 távoli helyen. Ez iparági szabvány, amit a legnagyobb cégek is alkalmaznak. A dobozon ez három szint: egy mentés a dobozon, egy másodpéldány egy második meghajtón, és egy titkosított másolat egy távoli tárhelyen. A mentések automatikusan, éjszaka futnak. Az adatbázisok és fájlok inkrementálisan mentődnek – tehát csak a változások kerülnek mentésre, ami helyet és időt takarít meg. Részletes leírást a Mentések oldalon találsz."
           }
         },
         {
@@ -228,7 +229,7 @@
           "name": "Honnan tudom, hogy a mentések valóban működnek?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "Központi monitoring rendszert üzemeltetünk, amely minden nap ellenőrzi, hogy a mentések sikeresen lefutottak-e. Ha bármi probléma van — sikertelen mentés, tárhelyhiány, vagy a szerver nem elérhető — azonnal értesítést kapunk, és szükség esetén te is. Ez nem egy „beállítom és remélem működik\" megoldás — aktívan figyeljük, és időszakosan visszaállítási teszteket is végzünk."
+            "text": "Központi monitoring rendszert üzemeltetünk, amely minden nap ellenőrzi, hogy a mentések sikeresen lefutottak-e. Ha bármi probléma van – sikertelen mentés, tárhelyhiány, vagy a szerver nem elérhető – azonnal értesítést kapunk, és szükség esetén te is. Ez nem egy „beállítom és remélem működik\" megoldás – aktívan figyeljük, és időszakosan visszaállítási teszteket is végzünk."
           }
         },
         {
@@ -236,7 +237,7 @@
           "name": "Mi az az „offsite backup\"?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "Az offsite (távoli) backup azt jelenti, hogy az adataidról egy másolat fizikailag más helyen is megvan. A Felhom dobozon ez egy általunk biztosított tárhely, ahova a másolat titkosítva kerül. Ha otthon bármi katasztrófa történne (tűz, lopás, vízkár), a távoli másolat akkor is megmarad. Az offsite mentés mindig titkosítva történik — a távoli helyen senki nem tudja elolvasni az adataidat, még ha hozzáfér is a fájlokhoz."
+            "text": "Az offsite (távoli) backup azt jelenti, hogy az adataidról egy másolat fizikailag más helyen is megvan. A Felhom dobozon ez egy általunk biztosított tárhely, ahova a másolat titkosítva kerül. Ha otthon bármi katasztrófa történne (tűz, lopás, vízkár), a távoli másolat akkor is megmarad. Az offsite mentés mindig titkosítva történik – a távoli helyen senki nem tudja elolvasni az adataidat, még ha hozzáfér is a fájlokhoz."
           }
         },
         {
@@ -268,7 +269,7 @@
           "name": "Mi van, ha fel akarom mondani a szolgáltatást?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "A szerver és az összes adat a tiéd — mindig is az volt. Ha úgy döntesz, hogy nem kéred tovább a szolgáltatást, a doboz az otthoni hálózaton tovább működik, de nem kapod a frissítéseket, a felügyeletet és a támogatást. A távoli elérés és a távoli mentés a szolgáltatás része: hogy mi lesz velük, azt a felmondáskor egyeztetjük. Nincs hűségidő, nincs felmondási díj. Ha van technikai tudásod (vagy időközben szereztél), akár magad is üzemeltetheted tovább a rendszert. Az adatok és az alkalmazások nálad maradnak."
+            "text": "A szerver és az összes adat a tiéd – mindig is az volt. Ha úgy döntesz, hogy nem kéred tovább a szolgáltatást, a doboz az otthoni hálózaton tovább működik, de nem kapod a frissítéseket, a felügyeletet és a támogatást. A távoli elérés és a távoli mentés a szolgáltatás része: hogy mi lesz velük, azt a felmondáskor egyeztetjük. Nincs hűségidő, nincs felmondási díj. Ha van technikai tudásod (vagy időközben szereztél), akár magad is üzemeltetheted tovább a rendszert. Az adatok és az alkalmazások nálad maradnak."
           }
         },
         {
@@ -276,7 +277,7 @@
           "name": "Mi történik, ha a Felhom.eu megszűnik?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "A szervered és az adataid a tiéd. Az alkalmazások szinte mind nyílt forráskódúak, ami azt jelenti, hogy bárki más is üzemeltetheti őket — nem függsz egyetlen szolgáltatótól sem. Ez éppen az egyik legnagyobb előnye a nyílt forráskódú megoldásoknak: nincs vendor lock-in. Ezzel szemben, ha a Google vagy az Apple megszünteti egy szolgáltatását, az adataid velük együtt tűnnek el."
+            "text": "A szervered és az adataid a tiéd. Az alkalmazások szinte mind nyílt forráskódúak, ami azt jelenti, hogy bárki más is üzemeltetheti őket – nem függsz egyetlen szolgáltatótól sem. Ez éppen az egyik legnagyobb előnye a nyílt forráskódú megoldásoknak: nincs vendor lock-in. Ezzel szemben, ha a Google vagy az Apple megszünteti egy szolgáltatását, az adataid velük együtt tűnnek el."
           }
         },
         {
@@ -284,7 +285,7 @@
           "name": "Mi van, ha elköltözöm?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "A szervered egy kompakt doboz — lecsatlakoztatod, átviszed az új lakásba, becsatlakoztatod, és minden megy tovább. Ha változik az internet szolgáltatód, lehet, hogy a távoli elérés konfigurációját frissíteni kell — ebben segítünk."
+            "text": "A szervered egy kompakt doboz – lecsatlakoztatod, átviszed az új lakásba, becsatlakoztatod, és minden megy tovább. Ha változik az internet szolgáltatód, lehet, hogy a távoli elérés konfigurációját frissíteni kell – ebben segítünk."
           }
         },
         {
@@ -292,7 +293,7 @@
           "name": "Mennyibe kerül az egész?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "A költség két részből áll: Egyszeri költségek: A hardver ára (80.000–400.000+ Ft, konfigurációtól függően) és a telepítési díj. A hardvert te vásárolod meg — a tiéd, örökre. Havi üzemeltetési díj: A monitoring, támogatás, frissítések, és mentés-felügyelet díja. Ez a kiválasztott csomagtól függ. Pontos árajánlatot az egyeztetés után adunk — mert az igények nagyon eltérőek lehetnek. Írj nekünk, és személyre szabott ajánlatot készítünk!"
+            "text": "A költség két részből áll: Egyszeri költségek: A hardver ára (80.000–400.000+ Ft, konfigurációtól függően) és a telepítési díj. A hardvert te vásárolod meg – a tiéd, örökre. Havi üzemeltetési díj: A monitoring, támogatás, frissítések, és mentés-felügyelet díja. Ez a kiválasztott csomagtól függ. Pontos árajánlatot az egyeztetés után adunk – mert az igények nagyon eltérőek lehetnek. Írj nekünk, és személyre szabott ajánlatot készítünk!"
           }
         },
         {
@@ -300,7 +301,7 @@
           "name": "Megéri anyagilag a felhőszolgáltatásokhoz képest?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "Hosszú távon szinte mindig. Egy tipikus példa: Google One 2TB évi ~36.000 Ft, iCloud 2TB évi ~45.000 Ft, Spotify család évi ~30.000 Ft, jelszókezelő évi ~15.000 Ft. Ezek együtt évi 120.000+ Ft — és ez csak néhány szolgáltatás. Egy mini PC-s szerver 2-3 év alatt „behozza\" az árát, és utána gyakorlatilag csak áramot fizetsz. Emellett korlátlan tárhelyed van — nem 2 TB, hanem amennyit a lemezeid bírnak."
+            "text": "Hosszú távon szinte mindig. Egy tipikus példa: Google One 2TB évi ~36.000 Ft, iCloud 2TB évi ~45.000 Ft, Spotify család évi ~30.000 Ft, jelszókezelő évi ~15.000 Ft. Ezek együtt évi 120.000+ Ft – és ez csak néhány szolgáltatás. Egy mini PC-s szerver 2-3 év alatt „behozza\" az árát, és utána gyakorlatilag csak áramot fizetsz. Emellett korlátlan tárhelyed van – nem 2 TB, hanem amennyit a lemezeid bírnak."
           }
         },
         {
@@ -308,7 +309,7 @@
           "name": "Vannak rejtett költségek?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "Nincsenek. A felmerülő költségek: hardver (egyszeri), telepítés (egyszeri), havi üzemeltetés (opcionális), és villanyáram (havi néhány ezer forint). Az alkalmazások ingyenesen használhatók, és szinte mind nyílt forráskódú — nincs licencdíj az alkalmazásokért. (Néhánynak van fizetős extrája, például a Plex Pass; ez választható.) A távoli mentés tárhelyének van havi költsége, ami a mentett adatmennyiségtől függ — ezt az ajánlatban előre leírjuk."
+            "text": "Nincsenek. A felmerülő költségek: hardver (egyszeri), telepítés (egyszeri), havi üzemeltetés (opcionális), és villanyáram (havi néhány ezer forint). Az alkalmazások ingyenesen használhatók, és szinte mind nyílt forráskódú – nincs licencdíj az alkalmazásokért. (Néhánynak van fizetős extrája, például a Plex Pass; ez választható.) A távoli mentés tárhelyének van havi költsége, ami a mentett adatmennyiségtől függ – ezt az ajánlatban előre leírjuk."
           }
         },
         {
@@ -316,7 +317,7 @@
           "name": "Milyen operációs rendszer fut a szerveren?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "A szerver alapja a Proxmox VE — egy professzionális, Debian-alapú virtualizációs rendszer, amelyre a teljes Felhom rendszert építjük. Az alkalmazásaid Docker konténerekben futnak egy elkülönített rendszerkörnyezetben, a Proxmox alapra telepítve. Így a teljes rendszerkörnyezet is menthető, és ebből visszaállítható."
+            "text": "A szerver alapja a Proxmox VE – egy professzionális, Debian-alapú virtualizációs rendszer, amelyre a teljes Felhom rendszert építjük. Az alkalmazásaid Docker konténerekben futnak egy elkülönített rendszerkörnyezetben, a Proxmox alapra telepítve. Így a teljes rendszerkörnyezet is menthető, és ebből visszaállítható."
           }
         },
         {
@@ -324,7 +325,7 @@
           "name": "Mi az a Proxmox, és miért használjátok?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "A Proxmox egy professzionális virtualizációs alap — ugyanaz a fajta technológia, amelyet adatközpontok és cégek használnak. Minden Felhom dobozon ott van, csendben a háttérben; neked nem kell vele foglalkoznod. Ez teszi lehetővé a legfontosabb biztonsági funkciókat: Mentés frissítés előtt — egy alkalmazás frissítése előtt friss mentés készül, és ha az új verzió nem indul el, a doboz magától visszaállítja az előzőt. Az egész rendszer menthető és visszaállítható — nem csak az adataid, hanem a teljes dobozod is mentésbe kerül. Tiszta elkülönítés — a kezelőréteg és az alkalmazásaid elkülönítve futnak, így stabilabb és biztonságosabb a rendszer."
+            "text": "A Proxmox egy professzionális virtualizációs alap – ugyanaz a fajta technológia, amelyet adatközpontok és cégek használnak. Minden Felhom dobozon ott van, csendben a háttérben; neked nem kell vele foglalkoznod. Ez teszi lehetővé a legfontosabb biztonsági funkciókat: Mentés frissítés előtt – egy alkalmazás frissítése előtt friss mentés készül, és ha az új verzió nem indul el, a doboz magától visszaállítja az előzőt. Az egész rendszer menthető és visszaállítható – nem csak az adataid, hanem a teljes dobozod is mentésbe kerül. Tiszta elkülönítés – a kezelőréteg és az alkalmazásaid elkülönítve futnak, így stabilabb és biztonságosabb a rendszer."
           }
         },
         {
@@ -332,7 +333,7 @@
           "name": "Mi az a Docker / konténer?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "A konténer egy „doboz\", amiben egy alkalmazás és minden függősége együtt él. Gondolj rá úgy, mintha minden alkalmazás a saját kis lakásában élne — nem zavarják egymást, egyszerű frissíteni vagy eltávolítani őket, és ha az egyik elromlik, a többi nem érinti. Erről bővebben a Technológiák oldalon olvashatsz."
+            "text": "A konténer egy „doboz\", amiben egy alkalmazás és minden függősége együtt él. Gondolj rá úgy, mintha minden alkalmazás a saját kis lakásában élne – nem zavarják egymást, egyszerű frissíteni vagy eltávolítani őket, és ha az egyik elromlik, a többi nem érinti. Erről bővebben a Technológiák oldalon olvashatsz."
           }
         },
         {
@@ -340,7 +341,7 @@
           "name": "Saját domain nevet is használhatok?",
           "acceptedAnswer": {
             "@type": "Answer",
-            "text": "Igen! Ha van saját domain neved (pl. enszerverem.hu), beállíthatjuk, hogy az alkalmazásaid azon keresztül legyenek elérhetők (pl. fotok.enszerverem.hu, filmek.enszerverem.hu). Ha nincs domain neved, segítünk az igényléssel — az éves költsége néhány ezer forint."
+            "text": "Igen! Ha van saját domain neved (pl. enszerverem.hu), beállíthatjuk, hogy az alkalmazásaid azon keresztül legyenek elérhetők (pl. fotok.enszerverem.hu, filmek.enszerverem.hu). Ha nincs domain neved, segítünk az igényléssel – az éves költsége néhány ezer forint."
           }
         },
         {
@@ -363,44 +364,62 @@
     }
     </script>
     <!-- shared assets: bump ?v= together on any site.css/icons.svg change -->
-    <link rel="stylesheet" href="/assets/site.css?v=21">
+    <link rel="stylesheet" href="/assets/site.css?v=22">
+    <link rel="stylesheet" href="/assets/shell.css?v=22">
     <link rel="icon" type="image/png" href="/assets/logo_favicon_2.svg">
     <script defer src="https://stats.felhom.eu/script.js" data-website-id="d419db57-5e1c-48df-bdb3-c29f25fb1661"></script>
 </head>
-<body class="page-gyik">
-    <nav>
-        <div class="container">
-            <a href="/" class="logo">
-                <img class="logo-mark" src="/assets/logo-mark.svg" alt="" aria-hidden="true">
-                <img class="logo-word" src="/assets/logo-wordmark.png" alt="felhom.eu">
+<body class="shell page-gyik">
+    <header class="mobile-topbar">
+        <a href="/" class="mobile-topbar-logo"><img src="/assets/logo_notext_white.svg" alt="Felhom.eu"></a>
+        <button type="button" class="nav-burger" id="navBurger" aria-expanded="false" aria-controls="sidebar" aria-label="Menü">
+            <span class="hamburger-box"><span class="hamburger-line"></span><span class="hamburger-line"></span><span class="hamburger-line"></span></span>
+        </button>
+    </header>
+    <div class="nav-backdrop" id="navBackdrop" hidden></div>
+    <nav class="sidebar" id="sidebar">
+        <div class="sidebar-header">
+            <a href="/" class="sidebar-logo-link">
+                <img src="/assets/logo_notext_white.svg" alt="" class="sidebar-logo" aria-hidden="true">
+                <img src="/assets/logo-wordmark.png" alt="felhom.eu" class="sidebar-word">
             </a>
-            <ul class="nav-links">
-                <li><a href="/#szolgaltatasok">Szolgáltatások</a></li>
-                <li><a href="/alkalmazasok">Alkalmazások</a></li>
-                <li><a href="/technologiak">Technológiák</a></li>
-                <li><a href="/biztonsagimentes">Mentések</a></li>
-                <li><a href="/gyik" class="active">GYIK</a></li>
-                <li><a href="/kapcsolat">Kapcsolat</a></li>
-                <li class="lang-globe-li"><details class="lang-globe"><summary class="lang-globe-btn" aria-label="Nyelv" title="Nyelv"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/gyik" lang="hu" hreflang="hu" class="lang-globe-item current" aria-current="true">Magyar</a></li><li><a href="/en/faq" lang="en" hreflang="en" class="lang-globe-item">English</a></li></ul></details></li>
+        </div>
+        <ul class="nav-links">
+                <li><a href="/"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg>Kezdőlap</a></li>
+                <li><a href="/#szolgaltatasok"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rocket"/></svg>Szolgáltatások</a></li>
+                <li class="nav-group">
+                    <button type="button" class="nav-group-toggle" aria-expanded="false" aria-controls="nav-group-apps"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg>Alkalmazások<svg class="ico nav-chevron" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chevron-down"/></svg></button>
+                    <ul id="nav-group-apps" class="nav-links nav-links-sub nav-links-nested">
+                        <li><a href="/alkalmazasok">Minden alkalmazás</a></li>
+                        <li><a href="/alkalmazasok#fajlkezeles-irodai">Fájlkezelés &amp; Irodai</a></li>
+                        <li><a href="/alkalmazasok#media-szorakozas">Média &amp; Szórakozás</a></li>
+                        <li><a href="/alkalmazasok#otthon-eletmod">Otthon &amp; Életmód</a></li>
+                        <li><a href="/alkalmazasok#produktivitas-tudaskezeles">Produktivitás &amp; Tudáskezelés</a></li>
+                        <li><a href="/alkalmazasok#rendszer-fejlesztes">Rendszer &amp; Fejlesztés</a></li>
+                    </ul>
+                </li>
+                <li><a href="/technologiak"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg>Technológiák</a></li>
+                <li><a href="/biztonsagimentes"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg>Biztonsági mentés</a></li>
+        </ul>
+        <div class="sidebar-bottom">
+            <a href="/teszteles" class="btn btn-outline sidebar-cta">Jelentkezem tesztelőnek →</a>
+            <div class="nav-group-label">A Felhomról</div>
+            <ul class="nav-links nav-links-sub">
+                    <li><a href="/#hogyan-mukodik">Hogyan működik</a></li>
+                    <li><a href="/gyik" class="active">GYIK</a></li>
+                    <li><a href="/kapcsolat">Kapcsolat</a></li>
             </ul>
-            <button class="hamburger" id="hamburger" aria-label="Menü megnyitása" aria-expanded="false">
-                <span class="hamburger-box">
-                    <span class="hamburger-line"></span>
-                    <span class="hamburger-line"></span>
-                    <span class="hamburger-line"></span>
-                </span>
-            </button>
+            <div class="sidebar-footer">
+                <details class="lang-globe"><summary class="lang-globe-btn" aria-label="Nyelv" title="Nyelv"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/gyik" lang="hu" hreflang="hu" class="lang-globe-item current" aria-current="true">Magyar</a></li><li><a href="/en/faq" lang="en" hreflang="en" class="lang-globe-item">English</a></li></ul></details>
+            </div>
         </div>
     </nav>
-    <div class="mobile-overlay" id="mobileOverlay"></div>
-
-    <main>
-        <section class="page-header">
-            <div class="container">
+<main class="content">
+                <div class="page-header">
                 <h1>Gyakran Ismételt <span>Kérdések</span></h1>
-                <p>Minden, amit az otthoni szerver szolgáltatásunkról tudni érdemes — egy helyen, érthetően.</p>
             </div>
-        </section>
+                <p class="page-lede">Minden, amit az otthoni szerver szolgáltatásunkról tudni érdemes – egy helyen, érthetően.</p>
+
 
         <section class="content-section" style="padding-top: 0;">
             <div class="container">
@@ -434,7 +453,7 @@
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
                             <p>A Felhom.eu egy olyan szolgáltatást nyújt, amely segít az otthoni szerver(ek) telepítésében és üzemeltetésében. Kulcsrakész megoldásokat kínálunk: megválasztjuk a hardvert, beállítjuk a szoftvereket, biztosítjuk a mentéseket, és folyamatosan figyelemmel kísérjük a rendszert.</p>
-                            <p>A cél egyszerű: a nagy felhőszolgáltatók (Google, Microsoft, Apple) helyett a saját otthonodban futó szerveren tárolhatod az adataidat — anélkül, hogy neked kellene szakértőnek lenned.</p>
+                            <p>A cél egyszerű: a nagy felhőszolgáltatók (Google, Microsoft, Apple) helyett a saját otthonodban futó szerveren tárolhatod az adataidat – anélkül, hogy neked kellene szakértőnek lenned.</p>
                         </div></div>
                     </div>
 
@@ -448,7 +467,7 @@
                             <p><strong>Családok</strong>, akik szeretnék a fotóikat, videóikat biztonságban tudni, és nem akarnak havonta fizetni a felhőtárhelyért.</p>
                             <p><strong>Adatvédelem-tudatos felhasználók</strong>, akik nem akarják, hogy a Google vagy a Microsoft hozzáférjen a dokumentumaikhoz.</p>
                             <p><strong>Médiarajongók</strong>, akik saját Netflix/Spotify-szerű rendszert szeretnének a filmjeikhez és zenéjükhöz.</p>
-                            <p><strong>Kisvállalkozások</strong>, amelyeknek szükségük van dokumentumkezelésre, belső wikire, vagy időpontfoglalásra — saját kontroll alatt.</p>
+                            <p><strong>Kisvállalkozások</strong>, amelyeknek szükségük van dokumentumkezelésre, belső wikire, vagy időpontfoglalásra – saját kontroll alatt.</p>
                         </div></div>
                     </div>
 
@@ -458,7 +477,7 @@
                             <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
-                            <p><strong>Nem.</strong> A teljes telepítést és beállítást mi végezzük. A te dolgod annyi, hogy használod az alkalmazásokat — böngészőn vagy mobilon keresztül, pont úgy, mint egy Google vagy Apple szolgáltatást.</p>
+                            <p><strong>Nem.</strong> A teljes telepítést és beállítást mi végezzük. A te dolgod annyi, hogy használod az alkalmazásokat – böngészőn vagy mobilon keresztül, pont úgy, mint egy Google vagy Apple szolgáltatást.</p>
                             <p>A telepítés után egy rövid bemutatón végigvezetünk, hogy magabiztosan használd a rendszert.</p>
                         </div></div>
                     </div>
@@ -469,7 +488,7 @@
                             <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>A Synology és QNAP elsősorban fájltárolásra készült NAS (hálózati adattároló) eszközök, saját zárt szoftverrel. Mi ezzel szemben egy nyílt, Docker-alapú rendszert kínálunk, amelyre a katalógus alkalmazásai pár kattintással telepíthetők — fotókezelőtől a média szerveren át a jelszókezelőig.</p>
+                            <p>A Synology és QNAP elsősorban fájltárolásra készült NAS (hálózati adattároló) eszközök, saját zárt szoftverrel. Mi ezzel szemben egy nyílt, Docker-alapú rendszert kínálunk, amelyre a katalógus alkalmazásai pár kattintással telepíthetők – fotókezelőtől a média szerveren át a jelszókezelőig.</p>
                             <p>A NAS-ok korlátozott alkalmazás-választékot kínálnak és a gyártó szoftverfrissítéseitől függenek. Nálunk 58 alkalmazásból válogathatsz, és ha valami hiányzik, megnézzük, felvehető-e.</p>
                         </div></div>
                     </div>
@@ -480,11 +499,11 @@
                             <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
-                            <p><strong>1. Egyeztetés</strong> — Megbeszéljük, mire van szükséged: milyen alkalmazásokat használnál, mennyi tárhelyet szeretnél, és mi a költségkereted.</p>
-                            <p><strong>2. Hardver kiválasztás</strong> — Segítünk megtalálni az optimális gépet, ami illeszkedik az igényeidhez és a büdzsédhez.</p>
-                            <p><strong>3. Telepítés és beállítás</strong> — Feltelepítjük az operációs rendszert, a konténerkezelőt, az alkalmazásokat, beállítjuk a mentéseket és a monitoringot.</p>
-                            <p><strong>4. Átadás és betanítás</strong> — Bemutatjuk, hogyan használd a rendszert, és válaszolunk minden kérdésedre.</p>
-                            <p><strong>5. Folyamatos üzemeltetés</strong> — Figyeljük a mentéseket, karbantartjuk a rendszert, és segítünk, ha bármi gond van.</p>
+                            <p><strong>1. Egyeztetés</strong> – Megbeszéljük, mire van szükséged: milyen alkalmazásokat használnál, mennyi tárhelyet szeretnél, és mi a költségkereted.</p>
+                            <p><strong>2. Hardver kiválasztás</strong> – Segítünk megtalálni az optimális gépet, ami illeszkedik az igényeidhez és a büdzsédhez.</p>
+                            <p><strong>3. Telepítés és beállítás</strong> – Feltelepítjük az operációs rendszert, a konténerkezelőt, az alkalmazásokat, beállítjuk a mentéseket és a monitoringot.</p>
+                            <p><strong>4. Átadás és betanítás</strong> – Bemutatjuk, hogyan használd a rendszert, és válaszolunk minden kérdésedre.</p>
+                            <p><strong>5. Folyamatos üzemeltetés</strong> – Figyeljük a mentéseket, karbantartjuk a rendszert, és segítünk, ha bármi gond van.</p>
                         </div></div>
                     </div>
                 </div>
@@ -502,7 +521,7 @@
                             <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>A legtöbb otthoni felhasználónak egy <strong>mini PC</strong> (pl. Intel N100 processzorral, 16-32 GB RAM-mal) tökéletesen megfelel. Ezek csendesek, energiatakarékosak (15-35W fogyasztás), és kompaktak — elfér a polcon a router mellett.</p>
+                            <p>A legtöbb otthoni felhasználónak egy <strong>mini PC</strong> (pl. Intel N100 processzorral, 16-32 GB RAM-mal) tökéletesen megfelel. Ezek csendesek, energiatakarékosak (15-35W fogyasztás), és kompaktak – elfér a polcon a router mellett.</p>
                             <p>Ha nagyobb tárhelyet szeretnél (pl. filmes könyvtárhoz), egy NAS-al vagy külső merevlemezekkel bővíthető. Részletesebb konfigurációkat a <a href="/technologiak#hardver">Technológiák</a> oldalon találsz.</p>
                         </div></div>
                     </div>
@@ -514,7 +533,7 @@
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
                             <p>Sok esetben igen! Egy korábbi asztali PC kiváló szerver lehet. Az egyeztetés során felmérjük, hogy a meglévő géped alkalmas-e a tervezett feladatokra (elég RAM, tároló kapacitás, megbízhatóság).</p>
-                            <p>Fontos szempont a <strong>fogyasztás</strong> és a <strong>zajszint</strong> — egy régi gamer PC működik ugyan, de havi szinten jóval többet fogyaszt, mint egy modern mini PC.</p>
+                            <p>Fontos szempont a <strong>fogyasztás</strong> és a <strong>zajszint</strong> – egy régi gamer PC működik ugyan, de havi szinten jóval többet fogyaszt, mint egy modern mini PC.</p>
                         </div></div>
                     </div>
 
@@ -545,8 +564,8 @@
                             <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>A mini PC-k szinte hangtalan működnek — sok modell ventilátort sem tartalmaz, vagy csak néha kapcsol be rövid időre. Hétköznapi használat mellett nyugodtan tarthatod az íróasztalon vagy a hálószoba polcán.</p>
-                            <p>A tower szerverek és rack szervereknél ez már más — ezeket inkább pincébe, kamrába érdemes helyezni.</p>
+                            <p>A mini PC-k szinte hangtalan működnek – sok modell ventilátort sem tartalmaz, vagy csak néha kapcsol be rövid időre. Hétköznapi használat mellett nyugodtan tarthatod az íróasztalon vagy a hálószoba polcán.</p>
+                            <p>A tower szerverek és rack szervereknél ez már más – ezeket inkább pincébe, kamrába érdemes helyezni.</p>
                         </div></div>
                     </div>
 
@@ -557,7 +576,7 @@
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
                             <p>A telepítés során a szerver BIOS-át úgy konfiguráljuk (amennyiben az opció rendelkezésre áll), hogy áramszünet után automatikusan bekapcsoljon. Az operációs rendszer és az összes alkalmazás szintén automatikusan elindul a bekapcsolást követően. Ez a beállítás minden telepítésünk alapértelmezett része.</p>
-                            <p>Áramszünet után a doboz magától helyreáll — ezt valódi áramszünettel is kipróbáltuk. Ha a megbízhatóság kritikus, szünetmentes tápegységet (UPS) is tudunk javasolni, ami néhány perc szünet áthidalására elegendő.</p>
+                            <p>Áramszünet után a doboz magától helyreáll – ezt valódi áramszünettel is kipróbáltuk. Ha a megbízhatóság kritikus, szünetmentes tápegységet (UPS) is tudunk javasolni, ami néhány perc szünet áthidalására elegendő.</p>
                         </div></div>
                     </div>
 
@@ -567,7 +586,7 @@
                             <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>Otthoni használathoz (helyi hálózaton belül) bármilyen internet elég, mert az alkalmazások a helyi hálózatodon futnak — nem az interneten keresztül. A fotók, filmek, dokumentumok sebessége a routeredtől és a kábeles kapcsolattól függ.</p>
+                            <p>Otthoni használathoz (helyi hálózaton belül) bármilyen internet elég, mert az alkalmazások a helyi hálózatodon futnak – nem az interneten keresztül. A fotók, filmek, dokumentumok sebessége a routeredtől és a kábeles kapcsolattól függ.</p>
                             <p>Ha <strong>távolról is el szeretnéd érni</strong> a szerveredet (pl. munkahelyről vagy nyaralásból), akkor a feltöltési sebesség (upload) számít: minimum 10 Mbps ajánlott, de minél több, annál jobb.</p>
                         </div></div>
                     </div>
@@ -586,9 +605,9 @@
                             <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
-                            <p><strong>58 alkalmazást</strong> kínálunk — a teljes listát az <a href="/alkalmazasok">Alkalmazások</a> oldalon találod. Néhány példa:</p>
-                            <p><strong>Immich</strong> — Google Photos alternatíva fotók és videók automatikus mentésével. <strong>Jellyfin/Plex</strong> — saját Netflix filmekhez és sorozatokhoz. <strong>Nextcloud</strong> — fájlok tárolása és megosztása (Google Drive helyett). <strong>Vaultwarden</strong> — jelszókezelő az egész családnak. <strong>Paperless-ngx</strong> — dokumentumok digitalizálása és kereshetővé tétele.</p>
-                            <p>Ha valami nincs a listán, kérdezz — megnézzük, felvehető-e a katalógusba.</p>
+                            <p><strong>58 alkalmazást</strong> kínálunk – a teljes listát az <a href="/alkalmazasok">Alkalmazások</a> oldalon találod. Néhány példa:</p>
+                            <p><strong>Immich</strong> – Google Photos alternatíva fotók és videók automatikus mentésével. <strong>Jellyfin/Plex</strong> – saját Netflix filmekhez és sorozatokhoz. <strong>Nextcloud</strong> – fájlok tárolása és megosztása (Google Drive helyett). <strong>Vaultwarden</strong> – jelszókezelő az egész családnak. <strong>Paperless-ngx</strong> – dokumentumok digitalizálása és kereshetővé tétele.</p>
+                            <p>Ha valami nincs a listán, kérdezz – megnézzük, felvehető-e a katalógusba.</p>
                         </div></div>
                     </div>
 
@@ -618,7 +637,7 @@
                             <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
-                            <p><strong>Igen, de érdemes tudni a jelenlegi korlátot.</strong> A telepített alkalmazások többsége (Immich, Nextcloud, Vaultwarden) támogatja a többfelhasználós működést: bennük minden családtag saját fiókot kaphat, saját bejelentkezéssel. A Felhom <strong>vezérlőpulthoz</strong> viszont jelenleg <strong>egy közös háztartási jelszó</strong> tartozik — külön családtagi fiókok a vezérlőpulton még nincsenek. A vezérlőpult az, ahonnan alkalmazást telepítesz és a mentéseket kezeled; a mindennapi használathoz (fotók, fájlok) az alkalmazások saját fiókjai kellenek.</p>
+                            <p><strong>Igen, de érdemes tudni a jelenlegi korlátot.</strong> A telepített alkalmazások többsége (Immich, Nextcloud, Vaultwarden) támogatja a többfelhasználós működést: bennük minden családtag saját fiókot kaphat, saját bejelentkezéssel. A Felhom <strong>vezérlőpulthoz</strong> viszont jelenleg <strong>egy közös háztartási jelszó</strong> tartozik – külön családtagi fiókok a vezérlőpulton még nincsenek. A vezérlőpult az, ahonnan alkalmazást telepítesz és a mentéseket kezeled; a mindennapi használathoz (fotók, fájlok) az alkalmazások saját fiókjai kellenek.</p>
                         </div></div>
                     </div>
 
@@ -629,7 +648,7 @@
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
                             <p>Igen! A legtöbb szolgáltatásból exportálhatók az adatok. A Google Takeout segítségével az összes fotódat, dokumentumodat, naptáradat letöltheted, és az Immich, Nextcloud, stb. importálni tudja ezeket. Segítünk a migrációban.</p>
-                            <p>A folyamat időigénye az adatmennyiségtől függ — néhány száz GB-nyi fotó átvitele akár egy-két napot is igénybe vehet, de a rendszer utána pontosan úgy működik, ahogy a felhőszolgáltatásnál megszoktad.</p>
+                            <p>A folyamat időigénye az adatmennyiségtől függ – néhány száz GB-nyi fotó átvitele akár egy-két napot is igénybe vehet, de a rendszer utána pontosan úgy működik, ahogy a felhőszolgáltatásnál megszoktad.</p>
                         </div></div>
                     </div>
 
@@ -639,7 +658,7 @@
                             <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>Igen! A doboz egy titkosított alagúton át, HTTPS-sel érhető el, külön alkalmazás nélkül. Ez azt jelenti, hogy bárhonnan — munkahelyről, nyaralásból, vagy akár külföldről — elérheted a fotóidat, fájljaidat, és minden alkalmazásodat, mintha otthon lennél.</p>
+                            <p>Igen! A doboz egy titkosított alagúton át, HTTPS-sel érhető el, külön alkalmazás nélkül. Ez azt jelenti, hogy bárhonnan – munkahelyről, nyaralásból, vagy akár külföldről – elérheted a fotóidat, fájljaidat, és minden alkalmazásodat, mintha otthon lennél.</p>
                         </div></div>
                     </div>
                 </div>
@@ -657,7 +676,7 @@
                             <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>Az általunk telepített rendszerek több rétegű védelmet kapnak: automatikus HTTPS titkosítás, rendszeres biztonsági frissítések, saját bejelentkezés minden alkalmazásban, és egyes alkalmazások előtt családi kapu. A szervered a te otthonodon belül van — otthon nem nyitunk portot, kívülről csak egy titkosított alagúton keresztül érhető el.</p>
+                            <p>Az általunk telepített rendszerek több rétegű védelmet kapnak: automatikus HTTPS titkosítás, rendszeres biztonsági frissítések, saját bejelentkezés minden alkalmazásban, és egyes alkalmazások előtt családi kapu. A szervered a te otthonodon belül van – otthon nem nyitunk portot, kívülről csak egy titkosított alagúton keresztül érhető el.</p>
                             <p>A legtöbb otthoni szerver ellen nem célzott támadások szoktak irányulni, hanem automatizált szkriptek próbálkoznak. Ezek ellen a megfelelő konfiguráció kiváló védelmet nyújt.</p>
                         </div></div>
                     </div>
@@ -669,7 +688,7 @@
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
                             <p>Ez egy fontos és jogos kérdés, amire őszintén válaszolunk.</p>
-                            <p>A támogatás és karbantartás érdekében alapesetben rendelkezünk távoli hozzáféréssel a szerveredhez — ahogy bármely IT szolgáltató a kezelt rendszerekhez. Ez szükséges a mentések ellenőrzéséhez, frissítések telepítéséhez, és hibaelhárításhoz.</p>
+                            <p>A támogatás és karbantartás érdekében alapesetben rendelkezünk távoli hozzáféréssel a szerveredhez – ahogy bármely IT szolgáltató a kezelt rendszerekhez. Ez szükséges a mentések ellenőrzéséhez, frissítések telepítéséhez, és hibaelhárításhoz.</p>
                             <p>A távoli mentésed kulcsát viszont <strong>csak te ismered</strong>: a helyreállítási kód egyszer jelenik meg, a te képernyődön, és nálunk nem marad belőle másolat. A távoli mentést így mi sem tudjuk elolvasni.</p>
                             <p>Fontos: szemben a nagy felhőszolgáltatókkal, nálunk <strong>nincs algoritmikus adatelemzés</strong>, nincs reklámcélú profilozás, és az adataid csak titkosítva hagyják el az otthonodat (a távoli mentés).</p>
                         </div></div>
@@ -682,7 +701,7 @@
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
                             <p>A szerver alkalmazásai izolált konténerekben futnak, ami korlátozza a kár mértékét, ha egy alkalmazás sérülékeny lenne. A rendszeres frissítések, és hogy otthon nincs nyitott port, csökkentik a kockázatot.</p>
-                            <p>A mentéseidből egy titkosított másolat külön helyen (offsite) is tárolódik — így egy zsarolóvírus-támadás után is van egy távol tárolt másolat.</p>
+                            <p>A mentéseidből egy titkosított másolat külön helyen (offsite) is tárolódik – így egy zsarolóvírus-támadás után is van egy távol tárolt másolat.</p>
                         </div></div>
                     </div>
 
@@ -711,7 +730,7 @@
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
                             <p>A <strong>3-2-1 mentési szabályt</strong> követjük: 3 másolat az adatokról, 2 különböző tárolón, 1 távoli helyen. Ez iparági szabvány, amit a legnagyobb cégek is alkalmaznak. A dobozon ez három szint: egy mentés a dobozon, egy másodpéldány egy második meghajtón, és egy titkosított másolat egy távoli tárhelyen.</p>
-                            <p>A mentések <strong>automatikusan</strong>, éjszaka futnak. Az adatbázisok és fájlok inkrementálisan mentődnek — tehát csak a változások kerülnek mentésre, ami helyet és időt takarít meg. Részletes leírást a <a href="/biztonsagimentes">Mentések</a> oldalon találsz.</p>
+                            <p>A mentések <strong>automatikusan</strong>, éjszaka futnak. Az adatbázisok és fájlok inkrementálisan mentődnek – tehát csak a változások kerülnek mentésre, ami helyet és időt takarít meg. Részletes leírást a <a href="/biztonsagimentes">Mentések</a> oldalon találsz.</p>
                         </div></div>
                     </div>
 
@@ -731,8 +750,8 @@
                             <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>Központi monitoring rendszert üzemeltetünk, amely <strong>minden nap</strong> ellenőrzi, hogy a mentések sikeresen lefutottak-e. Ha bármi probléma van — sikertelen mentés, tárhelyhiány, vagy a szerver nem elérhető — azonnal értesítést kapunk, és szükség esetén te is.</p>
-                            <p>Ez nem egy „beállítom és remélem működik" megoldás — aktívan figyeljük, és időszakosan visszaállítási teszteket is végzünk.</p>
+                            <p>Központi monitoring rendszert üzemeltetünk, amely <strong>minden nap</strong> ellenőrzi, hogy a mentések sikeresen lefutottak-e. Ha bármi probléma van – sikertelen mentés, tárhelyhiány, vagy a szerver nem elérhető – azonnal értesítést kapunk, és szükség esetén te is.</p>
+                            <p>Ez nem egy „beállítom és remélem működik" megoldás – aktívan figyeljük, és időszakosan visszaállítási teszteket is végzünk.</p>
                         </div></div>
                     </div>
 
@@ -743,7 +762,7 @@
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
                             <p>Az offsite (távoli) backup azt jelenti, hogy az adataidról egy másolat fizikailag más helyen is megvan. A Felhom dobozon ez egy általunk biztosított tárhely, ahova a másolat titkosítva kerül. Ha otthon bármi katasztrófa történne (tűz, lopás, vízkár), a távoli másolat akkor is megmarad.</p>
-                            <p>Az offsite mentés mindig <strong>titkosítva</strong> történik — a távoli helyen senki nem tudja elolvasni az adataidat, még ha hozzáfér is a fájlokhoz.</p>
+                            <p>Az offsite mentés mindig <strong>titkosítva</strong> történik – a távoli helyen senki nem tudja elolvasni az adataidat, még ha hozzáfér is a fájlokhoz.</p>
                         </div></div>
                     </div>
                 </div>
@@ -792,7 +811,7 @@
                             <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>A szerver és az összes adat a tiéd — mindig is az volt. Ha úgy döntesz, hogy nem kéred tovább a szolgáltatást, a doboz az otthoni hálózaton tovább működik, de nem kapod a frissítéseket, a felügyeletet és a támogatást. A távoli elérés és a távoli mentés a szolgáltatás része: hogy mi lesz velük, azt a felmondáskor egyeztetjük.</p>
+                            <p>A szerver és az összes adat a tiéd – mindig is az volt. Ha úgy döntesz, hogy nem kéred tovább a szolgáltatást, a doboz az otthoni hálózaton tovább működik, de nem kapod a frissítéseket, a felügyeletet és a támogatást. A távoli elérés és a távoli mentés a szolgáltatás része: hogy mi lesz velük, azt a felmondáskor egyeztetjük.</p>
                             <p>Nincs hűségidő, nincs felmondási díj. Ha van technikai tudásod (vagy időközben szereztél), akár magad is üzemeltetheted tovább a rendszert. Az adatok és az alkalmazások nálad maradnak.</p>
                         </div></div>
                     </div>
@@ -803,7 +822,7 @@
                             <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>A szervered és az adataid a tiéd. Az alkalmazások szinte mind nyílt forráskódúak, ami azt jelenti, hogy bárki más is üzemeltetheti őket — nem függsz egyetlen szolgáltatótól sem. Ez éppen az egyik legnagyobb előnye a nyílt forráskódú megoldásoknak: <strong>nincs vendor lock-in</strong>.</p>
+                            <p>A szervered és az adataid a tiéd. Az alkalmazások szinte mind nyílt forráskódúak, ami azt jelenti, hogy bárki más is üzemeltetheti őket – nem függsz egyetlen szolgáltatótól sem. Ez éppen az egyik legnagyobb előnye a nyílt forráskódú megoldásoknak: <strong>nincs vendor lock-in</strong>.</p>
                             <p>Ezzel szemben, ha a Google vagy az Apple megszünteti egy szolgáltatását, az adataid velük együtt tűnnek el.</p>
                         </div></div>
                     </div>
@@ -814,7 +833,7 @@
                             <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>A szervered egy kompakt doboz — lecsatlakoztatod, átviszed az új lakásba, becsatlakoztatod, és minden megy tovább. Ha változik az internet szolgáltatód, lehet, hogy a távoli elérés konfigurációját frissíteni kell — ebben segítünk.</p>
+                            <p>A szervered egy kompakt doboz – lecsatlakoztatod, átviszed az új lakásba, becsatlakoztatod, és minden megy tovább. Ha változik az internet szolgáltatód, lehet, hogy a távoli elérés konfigurációját frissíteni kell – ebben segítünk.</p>
                         </div></div>
                     </div>
                 </div>
@@ -833,9 +852,9 @@
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
                             <p>A költség két részből áll:</p>
-                            <p><strong>Egyszeri költségek:</strong> A hardver ára (80.000–400.000+ Ft, konfigurációtól függően) és a telepítési díj. A hardvert te vásárolod meg — a tiéd, örökre.</p>
+                            <p><strong>Egyszeri költségek:</strong> A hardver ára (80.000–400.000+ Ft, konfigurációtól függően) és a telepítési díj. A hardvert te vásárolod meg – a tiéd, örökre.</p>
                             <p><strong>Havi üzemeltetési díj:</strong> A monitoring, támogatás, frissítések, és mentés-felügyelet díja. Ez a kiválasztott csomagtól függ.</p>
-                            <p>Pontos árajánlatot az egyeztetés után adunk — mert az igények nagyon eltérőek lehetnek. Írj nekünk, és személyre szabott ajánlatot készítünk!</p>
+                            <p>Pontos árajánlatot az egyeztetés után adunk – mert az igények nagyon eltérőek lehetnek. Írj nekünk, és személyre szabott ajánlatot készítünk!</p>
                         </div></div>
                     </div>
 
@@ -845,8 +864,8 @@
                             <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>Hosszú távon <strong>szinte mindig</strong>. Egy tipikus példa: Google One 2TB évi ~36.000 Ft, iCloud 2TB évi ~45.000 Ft, Spotify család évi ~30.000 Ft, jelszókezelő évi ~15.000 Ft. Ezek együtt évi 120.000+ Ft — és ez csak néhány szolgáltatás.</p>
-                            <p>Egy mini PC-s szerver 2-3 év alatt „behozza" az árát, és utána gyakorlatilag csak áramot fizetsz. Emellett korlátlan tárhelyed van — nem 2 TB, hanem amennyit a lemezeid bírnak.</p>
+                            <p>Hosszú távon <strong>szinte mindig</strong>. Egy tipikus példa: Google One 2TB évi ~36.000 Ft, iCloud 2TB évi ~45.000 Ft, Spotify család évi ~30.000 Ft, jelszókezelő évi ~15.000 Ft. Ezek együtt évi 120.000+ Ft – és ez csak néhány szolgáltatás.</p>
+                            <p>Egy mini PC-s szerver 2-3 év alatt „behozza" az árát, és utána gyakorlatilag csak áramot fizetsz. Emellett korlátlan tárhelyed van – nem 2 TB, hanem amennyit a lemezeid bírnak.</p>
                         </div></div>
                     </div>
 
@@ -856,8 +875,8 @@
                             <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>Nincsenek. A felmerülő költségek: hardver (egyszeri), telepítés (egyszeri), havi üzemeltetés (opcionális), és villanyáram (havi néhány ezer forint). Az alkalmazások ingyenesen használhatók, és szinte mind <strong>nyílt forráskódú</strong> — nincs licencdíj az alkalmazásokért. (Néhánynak van fizetős extrája, például a Plex Pass; ez választható.)</p>
-                            <p>A távoli mentés tárhelyének van havi költsége, ami a mentett adatmennyiségtől függ — ezt az ajánlatban előre leírjuk.</p>
+                            <p>Nincsenek. A felmerülő költségek: hardver (egyszeri), telepítés (egyszeri), havi üzemeltetés (opcionális), és villanyáram (havi néhány ezer forint). Az alkalmazások ingyenesen használhatók, és szinte mind <strong>nyílt forráskódú</strong> – nincs licencdíj az alkalmazásokért. (Néhánynak van fizetős extrája, például a Plex Pass; ez választható.)</p>
+                            <p>A távoli mentés tárhelyének van havi költsége, ami a mentett adatmennyiségtől függ – ezt az ajánlatban előre leírjuk.</p>
                         </div></div>
                     </div>
                 </div>
@@ -875,7 +894,7 @@
                             <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>A szerver alapja a <strong>Proxmox VE</strong> — egy professzionális, Debian-alapú virtualizációs rendszer, amelyre a teljes Felhom rendszert építjük. Az alkalmazásaid Docker konténerekben futnak egy elkülönített rendszerkörnyezetben, a Proxmox alapra telepítve. Így a teljes rendszerkörnyezet is menthető, és ebből visszaállítható.</p>
+                            <p>A szerver alapja a <strong>Proxmox VE</strong> – egy professzionális, Debian-alapú virtualizációs rendszer, amelyre a teljes Felhom rendszert építjük. Az alkalmazásaid Docker konténerekben futnak egy elkülönített rendszerkörnyezetben, a Proxmox alapra telepítve. Így a teljes rendszerkörnyezet is menthető, és ebből visszaállítható.</p>
                         </div></div>
                     </div>
 
@@ -885,10 +904,10 @@
                             <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>A Proxmox egy professzionális virtualizációs alap — ugyanaz a fajta technológia, amelyet adatközpontok és cégek használnak. Minden Felhom dobozon ott van, csendben a háttérben; neked nem kell vele foglalkoznod. Ez teszi lehetővé a legfontosabb biztonsági funkciókat:</p>
-                            <p><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield"/></svg> <strong>Mentés frissítés előtt</strong> — egy alkalmazás frissítése előtt friss mentés készül, és ha az új verzió nem indul el, a doboz magától visszaállítja az előzőt.</p>
-                            <p><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-hard-drive"/></svg> <strong>Az egész rendszer menthető és visszaállítható</strong> — nem csak az adataid, hanem a teljes dobozod is mentésbe kerül.</p>
-                            <p><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg> <strong>Tiszta elkülönítés</strong> — a kezelőréteg és az alkalmazásaid elkülönítve futnak, így stabilabb és biztonságosabb a rendszer.</p>
+                            <p>A Proxmox egy professzionális virtualizációs alap – ugyanaz a fajta technológia, amelyet adatközpontok és cégek használnak. Minden Felhom dobozon ott van, csendben a háttérben; neked nem kell vele foglalkoznod. Ez teszi lehetővé a legfontosabb biztonsági funkciókat:</p>
+                            <p><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield"/></svg> <strong>Mentés frissítés előtt</strong> – egy alkalmazás frissítése előtt friss mentés készül, és ha az új verzió nem indul el, a doboz magától visszaállítja az előzőt.</p>
+                            <p><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-hard-drive"/></svg> <strong>Az egész rendszer menthető és visszaállítható</strong> – nem csak az adataid, hanem a teljes dobozod is mentésbe kerül.</p>
+                            <p><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg> <strong>Tiszta elkülönítés</strong> – a kezelőréteg és az alkalmazásaid elkülönítve futnak, így stabilabb és biztonságosabb a rendszer.</p>
                         </div></div>
                     </div>
 
@@ -898,7 +917,7 @@
                             <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>A konténer egy „doboz", amiben egy alkalmazás és minden függősége együtt él. Gondolj rá úgy, mintha minden alkalmazás a saját kis lakásában élne — nem zavarják egymást, egyszerű frissíteni vagy eltávolítani őket, és ha az egyik elromlik, a többi nem érinti.</p>
+                            <p>A konténer egy „doboz", amiben egy alkalmazás és minden függősége együtt él. Gondolj rá úgy, mintha minden alkalmazás a saját kis lakásában élne – nem zavarják egymást, egyszerű frissíteni vagy eltávolítani őket, és ha az egyik elromlik, a többi nem érinti.</p>
                             <p>Erről bővebben a <a href="/technologiak#kontenerek">Technológiák</a> oldalon olvashatsz.</p>
                         </div></div>
                     </div>
@@ -909,7 +928,7 @@
                             <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
                         </button>
                         <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>Igen! Ha van saját domain neved (pl. <em>enszerverem.hu</em>), beállíthatjuk, hogy az alkalmazásaid azon keresztül legyenek elérhetők (pl. <em>fotok.enszerverem.hu</em>, <em>filmek.enszerverem.hu</em>). Ha nincs domain neved, segítünk az igényléssel — az éves költsége néhány ezer forint.</p>
+                            <p>Igen! Ha van saját domain neved (pl. <em>enszerverem.hu</em>), beállíthatjuk, hogy az alkalmazásaid azon keresztül legyenek elérhetők (pl. <em>fotok.enszerverem.hu</em>, <em>filmek.enszerverem.hu</em>). Ha nincs domain neved, segítünk az igényléssel – az éves költsége néhány ezer forint.</p>
                         </div></div>
                     </div>
 
@@ -941,19 +960,12 @@
         <section class="cta-section alt-bg">
             <div class="container">
                 <h2>Nem találtad a <span>válaszodat?</span></h2>
-                <p>Írj nekünk bátran — szívesen válaszolunk minden kérdésedre.</p>
+                <p>Írj nekünk bátran – szívesen válaszolunk minden kérdésedre.</p>
                 <a href="/#kapcsolat" class="cta-button">Kapcsolatfelvétel →</a>
             </div>
         </section>
     </main>
 
-    <footer>
-        <div class="container">
-            <p>© 2026 felhom.eu – Saját felhőd, saját szabályaid</p>
-            <p class="footer-legal">Üzemeltető: Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Adatkezelési tájékoztató</a> · <a href="/feltetelek">Feltételek</a></p>
-        </div>
-    </footer>
-
     <script>
         // FAQ Accordion
         document.querySelectorAll('.faq-question').forEach(button => {
@@ -1044,5 +1056,35 @@
         });
     })();
     </script>
+<footer>
+        <div class="container">
+            <p>© 2026 felhom.eu – Saját felhőd, saját szabályaid</p>
+            <p class="footer-legal">Üzemeltető: Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Adatkezelési tájékoztató</a> · <a href="/feltetelek">Feltételek</a></p>
+        </div>
+    </footer>
+    <script>
+    (function(){
+        var b=document.getElementById('navBurger'),s=document.getElementById('sidebar'),k=document.getElementById('navBackdrop');
+        if(!b||!s||!k)return;
+        function open(){s.classList.add('is-open');k.hidden=false;document.body.classList.add('nav-open');b.setAttribute('aria-expanded','true');}
+        function close(){s.classList.remove('is-open');k.hidden=true;document.body.classList.remove('nav-open');b.setAttribute('aria-expanded','false');}
+        b.addEventListener('click',function(){s.classList.contains('is-open')?close():open();});
+        k.addEventListener('click',close);
+        document.addEventListener('keydown',function(e){if(e.key==='Escape'&&s.classList.contains('is-open')){close();b.focus();}});
+        s.querySelectorAll('a').forEach(function(l){l.addEventListener('click',close);});
+        window.addEventListener('resize',function(){if(window.innerWidth>768)close();});
+    })();
+    document.addEventListener('click',function(e){
+        var btn=e.target.closest?e.target.closest('.nav-group-toggle'):null;
+        if(!btn)return;
+        var g=btn.closest('.nav-group');if(!g)return;
+        var willOpen=!g.classList.contains('is-open');
+        document.querySelectorAll('.nav-group.is-open').forEach(function(x){
+            x.classList.remove('is-open');
+            var t=x.querySelector('.nav-group-toggle');if(t)t.setAttribute('aria-expanded','false');
+        });
+        if(willOpen){g.classList.add('is-open');btn.setAttribute('aria-expanded','true');}
+    });
+    </script>
 </body>
-</html>
\ No newline at end of file
+</html>
diff --git a/website/index.html b/website/index.html
index b6ae2d7f..508d5732 100644
--- a/website/index.html
+++ b/website/index.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html lang="hu">
+<html lang="hu" class="no-js">
 <head>
+    <script>document.documentElement.className=document.documentElement.className.replace('no-js','js');</script>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
@@ -54,551 +55,317 @@
     }
     </script>
     <!-- shared assets: bump ?v= together on any site.css/icons.svg change -->
-    <link rel="stylesheet" href="/assets/site.css?v=21">
+    <link rel="stylesheet" href="/assets/site.css?v=22">
+    <link rel="stylesheet" href="/assets/shell.css?v=22">
     <link rel="icon" type="image/png" href="/assets/logo_favicon_2.svg">
     <script defer src="/assets/gallery.js?v=2"></script>
     <script defer src="https://stats.felhom.eu/script.js" data-website-id="d419db57-5e1c-48df-bdb3-c29f25fb1661"></script>
 </head>
-<body class="page-index">
-    <nav>
-        <div class="container">
-            <a href="/" class="logo">
-                <img class="logo-mark" src="/assets/logo-mark.svg" alt="" aria-hidden="true">
-                <img class="logo-word" src="/assets/logo-wordmark.png" alt="felhom.eu">
+<body class="shell page-index">
+    <header class="mobile-topbar">
+        <a href="/" class="mobile-topbar-logo"><img src="/assets/logo_notext_white.svg" alt="Felhom.eu"></a>
+        <button type="button" class="nav-burger" id="navBurger" aria-expanded="false" aria-controls="sidebar" aria-label="Menü">
+            <span class="hamburger-box"><span class="hamburger-line"></span><span class="hamburger-line"></span><span class="hamburger-line"></span></span>
+        </button>
+    </header>
+    <div class="nav-backdrop" id="navBackdrop" hidden></div>
+    <nav class="sidebar" id="sidebar">
+        <div class="sidebar-header">
+            <a href="/" class="sidebar-logo-link">
+                <img src="/assets/logo_notext_white.svg" alt="" class="sidebar-logo" aria-hidden="true">
+                <img src="/assets/logo-wordmark.png" alt="felhom.eu" class="sidebar-word">
             </a>
-            <ul class="nav-links">
-                <li><a href="/#szolgaltatasok">Szolgáltatások</a></li>
-                <li><a href="/alkalmazasok">Alkalmazások</a></li>
-                <li><a href="/technologiak">Technológiák</a></li>
-                <li><a href="/biztonsagimentes">Mentések</a></li>
-                <li><a href="/gyik">GYIK</a></li>
-                <li><a href="/kapcsolat">Kapcsolat</a></li>
-                <li class="lang-globe-li"><details class="lang-globe"><summary class="lang-globe-btn" aria-label="Nyelv" title="Nyelv"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/" lang="hu" hreflang="hu" class="lang-globe-item current" aria-current="true">Magyar</a></li><li><a href="/en/" lang="en" hreflang="en" class="lang-globe-item">English</a></li></ul></details></li>
+        </div>
+        <ul class="nav-links">
+                <li><a href="/" class="active"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg>Kezdőlap</a></li>
+                <li><a href="/#szolgaltatasok"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rocket"/></svg>Szolgáltatások</a></li>
+                <li class="nav-group">
+                    <button type="button" class="nav-group-toggle" aria-expanded="false" aria-controls="nav-group-apps"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg>Alkalmazások<svg class="ico nav-chevron" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chevron-down"/></svg></button>
+                    <ul id="nav-group-apps" class="nav-links nav-links-sub nav-links-nested">
+                        <li><a href="/alkalmazasok">Minden alkalmazás</a></li>
+                        <li><a href="/alkalmazasok#fajlkezeles-irodai">Fájlkezelés &amp; Irodai</a></li>
+                        <li><a href="/alkalmazasok#media-szorakozas">Média &amp; Szórakozás</a></li>
+                        <li><a href="/alkalmazasok#otthon-eletmod">Otthon &amp; Életmód</a></li>
+                        <li><a href="/alkalmazasok#produktivitas-tudaskezeles">Produktivitás &amp; Tudáskezelés</a></li>
+                        <li><a href="/alkalmazasok#rendszer-fejlesztes">Rendszer &amp; Fejlesztés</a></li>
+                    </ul>
+                </li>
+                <li><a href="/technologiak"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg>Technológiák</a></li>
+                <li><a href="/biztonsagimentes"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg>Biztonsági mentés</a></li>
+        </ul>
+        <div class="sidebar-bottom">
+            <a href="/teszteles" class="btn btn-outline sidebar-cta">Jelentkezem tesztelőnek →</a>
+            <div class="nav-group-label">A Felhomról</div>
+            <ul class="nav-links nav-links-sub">
+                    <li><a href="/#hogyan-mukodik">Hogyan működik</a></li>
+                    <li><a href="/gyik">GYIK</a></li>
+                    <li><a href="/kapcsolat">Kapcsolat</a></li>
             </ul>
-            <button class="hamburger" id="hamburger" aria-label="Menü megnyitása" aria-expanded="false">
-                <span class="hamburger-box">
-                    <span class="hamburger-line"></span>
-                    <span class="hamburger-line"></span>
-                    <span class="hamburger-line"></span>
-                </span>
-            </button>
+            <div class="sidebar-footer">
+                <details class="lang-globe"><summary class="lang-globe-btn" aria-label="Nyelv" title="Nyelv"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/" lang="hu" hreflang="hu" class="lang-globe-item current" aria-current="true">Magyar</a></li><li><a href="/en/" lang="en" hreflang="en" class="lang-globe-item">English</a></li></ul></details>
+            </div>
         </div>
     </nav>
-    <div class="mobile-overlay" id="mobileOverlay"></div>
-
-    <section class="hero">
-        <div class="container">
-            <div class="hero-content">
-                <div class="hero-text">
-                    <h1>Saját felhőd,<br><span>saját szabályaid</span></h1>
-                    <p>Professzionális otthoni szerver telepítés és üzemeltetés. Te irányítasz, mi segítünk.</p>
-                    <a href="/teszteles" class="cta-button">Jelentkezem tesztelőnek →</a>
-                </div>
-                <div class="hero-visual">
-                    <img src="/assets/logo.png" alt="Felhom.eu - Otthoni szerver szolgáltatás">
-                </div>
-            </div>
+    <main class="content">
+        <div class="page-header">
+            <h1>Saját felhőd, saját szabályaid</h1>
+            <span class="domain-badge">Otthoni szerver szolgáltatás</span>
         </div>
-    </section>
 
-    <section class="content-section" id="mit-tud">
-        <div class="container">
-            <div class="section-header">
-                <h2>Mit tud <span>a doboz ma?</span></h2>
-                <p>Nem terv, nem ígéret — ezek ma működő funkciók egy éles Felhom dobozon</p>
+        <section class="hero-row">
+            <div class="hero-copy">
+                <p class="hero-lede">Egy kis gép az otthonodban: a fényképeid, a dokumentumaid, a filmjeid. Minden éjjel mentés készül. Mi figyeljük, te használod.</p>
+                <a href="/teszteles" class="btn btn-primary btn-lg">Jelentkezem tesztelőnek →</a>
             </div>
-            <div class="why-grid">
-                <div class="why-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-camera"/></svg> Fényképek, dokumentumok, média</h3>
-                    <p>A telefonod fotói automatikusan feltöltődnek a saját gépedre. A beszkennelt papírjaidat a rendszer felismeri és kereshetővé teszi. A filmjeid, zenéid böngészőből és mobil appból is mennek.</p>
+                <div class="hero-window" aria-label="A vezérlőpult képe">
+                    <div class="hero-window-bar">
+                        <span class="hw-dot"></span><span class="hw-dot"></span><span class="hw-dot"></span>
+                        <span class="hero-window-title">otthonod.hu <span class="sample">minta</span></span>
+                    </div>
+                    <div class="hero-window-body">
+                        <p class="hero-window-lede">Így néz ki a doboz vezérlőpultja.</p>
+                        <div class="launch-grid launch-grid--mini">
+                        <a class="launch-cell" href="/alkalmazasok#immich">
+                            <span class="launch-tile" style="background: hsl(18, 45%, 38%)"><span class="launch-mono">I</span><img class="launch-logo" src="/assets/immich-logo.svg" alt="" loading="lazy"></span>
+                            <span class="launch-name">Immich</span>
+                        </a>
+                        <a class="launch-cell" href="/alkalmazasok#jellyfin">
+                            <span class="launch-tile" style="background: hsl(348, 45%, 38%)"><span class="launch-mono">J</span><img class="launch-logo" src="/assets/jellyfin-logo.svg" alt="" loading="lazy"></span>
+                            <span class="launch-name">Jellyfin</span>
+                        </a>
+                        <a class="launch-cell" href="/alkalmazasok#nextcloud">
+                            <span class="launch-tile" style="background: hsl(201, 45%, 38%)"><span class="launch-mono">N</span><img class="launch-logo" src="/assets/nextcloud-logo.svg" alt="" loading="lazy"></span>
+                            <span class="launch-name">Nextcloud</span>
+                        </a>
+                        <a class="launch-cell" href="/alkalmazasok#vaultwarden">
+                            <span class="launch-tile" style="background: hsl(66, 45%, 38%)"><span class="launch-mono">V</span><img class="launch-logo" src="/assets/vaultwarden-logo.svg" alt="" loading="lazy"></span>
+                            <span class="launch-name">Vaultwarden</span>
+                        </a>
+                        </div>
+                    </div>
                 </div>
-                <div class="why-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-folder"/></svg> Hálózati megosztás</h3>
-                    <p>A doboz mappái megjelennek a Windows Intézőben és a Mac Finderben — úgy húzod rájuk a fájlokat, mint bármelyik másik mappára. Megosztásonként beállítható, hogy csak olvasható legyen.</p>
+        </section>
+
+        <section class="shell-section" id="szolgaltatasok">
+            <div class="sec-head">
+                <h2>Mit tud a doboz ma?</h2>
+                <p>Nem terv és nem ígéret: ezek ma működő funkciók egy éles Felhom dobozon.</p>
+            </div>
+            <div class="caps">
+                <div class="caps-group">
+                    <h3>Amit nap mint nap használsz</h3>
+                    <ul class="caps-list">
+                        <li class="caps-item">
+                            <h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-camera"/></svg> Fényképek, dokumentumok, média</h4>
+                            <p>A telefonod fotói automatikusan feltöltődnek a saját gépedre. A beszkennelt papírjaidat a rendszer felismeri és keresővé teszi. A filmjeid, zenéid böngészőből és mobil appból is mennek.</p>
+                        </li>
+                        <li class="caps-item">
+                            <h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-folder"/></svg> Hálózati megosztás</h4>
+                            <p>A doboz mappái megjelennek a Windows Intézőben és a Mac Finderben: úgy húzod rájuk a fájlokat, mint bármelyik másik mappára. Megosztásonként beállítható, hogy csak olvasható legyen.</p>
+                        </li>
+                        <li class="caps-item">
+                            <h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg> 58 telepíthető alkalmazás</h4>
+                            <p>A vezérlőpultból telepíthetők, pár kattintással, parancssor nélkül. Szinte mind nyílt forráskódú, és mind a te gépeden fut.</p>
+                        </li>
+                        <li class="caps-item">
+                            <h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg> Magyarul vagy angolul</h4>
+                            <p>A vezérlőpult magyarul és angolul is használható. A nyelvet a háztartás választja, és a dobozról érkező e-mailek is ezt a nyelvet követik.</p>
+                        </li>
+                    </ul>
                 </div>
-                <div class="why-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg> Háromszintű automatikus mentés</h3>
-                    <p>Minden éjjel készül egy mentés a dobozon, egy másodpéldány egy második meghajtóra (ha van), és egy titkosított másolat egy távoli tárhelyre. A megosztott mappáid a második meghajtón és a távoli másolatban is benne vannak.</p>
+                <div class="caps-group">
+                    <h3>Ami a háttérben véd</h3>
+                    <ul class="caps-list">
+                        <li class="caps-item">
+                            <h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg> Háromszintű automatikus mentés</h4>
+                            <p>Minden éjjel készül egy mentés a dobozon, egy másodpéldány egy második meghajtóra (ha van), és egy titkosított másolat egy távoli tárhelyre. A megosztott mappáid a második meghajtón és a távoli másolatban is benne vannak.</p>
+                        </li>
+                        <li class="caps-item">
+                            <h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-lock"/></svg> Helyreállítási kód, amit csak te ismersz</h4>
+                            <p>A távoli mentésed titkosításának kulcsa egy helyreállítási kód, ami pontosan egyszer jelenik meg: a te képernyődön. Mi nem ismerjük, és nem tudjuk visszaállítani. Ez azt is jelenti, hogy a kód nélkül a távoli mentés nekünk sem olvasható: tedd el jól.</p>
+                        </li>
+                        <li class="caps-item">
+                            <h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rotate-cw"/></svg> Visszaállítás, ha baj van</h4>
+                            <p>Egy törölt fájl visszahozható a mentésből. Ha maga a doboz megy tönkre, az újratelepített rendszerre a titkosított távoli mentésből visszahozhatók az alkalmazásaid adatai, a helyreállítási kóddal.</p>
+                        </li>
+                        <li class="caps-item">
+                            <h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg> Internetkimaradáskor is működik</h4>
+                            <p>A doboz az otthonodban van. Ha elmegy a net, az otthoni hálózaton továbbra is eléred a fotóidat és a fájljaidat: nem egy távoli szolgáltató engedélyétől függenek.</p>
+                        </li>
+                    </ul>
                 </div>
-                <div class="why-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-lock"/></svg> Helyreállítási kód, amit csak te ismersz</h3>
-                    <p>A távoli mentésed titkosításának kulcsa egy helyreállítási kód, ami pontosan egyszer jelenik meg — a te képernyődön. Mi nem ismerjük, és nem tudjuk visszaállítani. Ez azt is jelenti, hogy a kód nélkül a távoli mentés nekünk sem olvasható: tedd el jól.</p>
-                </div>
-                <div class="why-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg> 58 telepíthető alkalmazás</h3>
-                    <p>A vezérlőpultból telepíthetők, pár kattintással — parancssor nélkül. Szinte mind nyílt forráskódú (a kivételeket az alkalmazások oldalán jelöljük), és mind a te gépeden fut.</p>
-                </div>
-                <div class="why-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-stethoscope"/></svg> Távoli felügyelet, automatikus frissítés</h3>
-                    <p>Figyeljük a doboz állapotát. A vezérlőpult magától frissül a legutóbbi kiadásra, és a doboz rendszere is megkapja a biztonsági frissítéseket — neked nem kell csinálnod semmit. Ha valami elromlik, mi látjuk.</p>
-                </div>
-                <div class="why-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rotate-cw"/></svg> Óvatos alkalmazásfrissítés</h3>
-                    <p>Egy alkalmazás új verziója csak akkor jut el hozzád, ha előbb kipróbáltuk. Frissítés előtt friss mentés készül, és ha az új verzió nem indul el rendesen, a doboz magától visszaállítja az előzőt, az adataiddal együtt.</p>
-                </div>
-                <div class="why-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg> Magyarul vagy angolul</h3>
-                    <p>A vezérlőpult magyarul és angolul is használható. A nyelvet a háztartás választja, és a dobozról érkező e-mailek is ezt a nyelvet követik.</p>
-                </div>
-                <div class="why-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg> Internetkimaradáskor is működik</h3>
-                    <p>A doboz az otthonodban van. Ha elmegy a net, az otthoni hálózaton továbbra is eléred a fotóidat és a fájljaidat — nem egy távoli szolgáltató engedélyétől függenek.</p>
-                </div>
-                <div class="why-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rotate-cw"/></svg> Visszaállítás, ha baj van</h3>
-                    <p>Egy törölt fájl visszahozható a mentésből. Ha maga a doboz megy tönkre, az újratelepített rendszerre a titkosított távoli mentésből visszahozhatók az alkalmazásaid adatai — a helyreállítási kóddal.</p>
+                <div class="caps-group">
+                    <h3>Amiről mi gondoskodunk</h3>
+                    <ul class="caps-list">
+                        <li class="caps-item">
+                            <h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-stethoscope"/></svg> Távoli felügyelet, automatikus frissítés</h4>
+                            <p>Figyeljük a doboz állapotát. A vezérlőpult magától frissül a legutóbbi kiadásra, és a doboz rendszere is megkapja a biztonsági frissítéseket. Neked nem kell csinálnod semmit. Ha valami elromlik, mi látjuk.</p>
+                        </li>
+                        <li class="caps-item">
+                            <h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rotate-cw"/></svg> Óvatos alkalmazásfrissítés</h4>
+                            <p>Egy alkalmazás új verziója csak akkor jut el hozzád, ha előbb kipróbáltuk. Frissítés előtt friss mentés készül, és ha az új verzió nem indul el rendesen, a doboz magától visszaállítja az előzőt, az adataiddal együtt.</p>
+                        </li>
+                    </ul>
                 </div>
             </div>
-        </div>
-    </section>
+        </section>
 
-    <section class="content-section" id="vezerlopult">
-        <div class="container">
-            <div class="section-header">
-                <h2>Így néz ki <span>a vezérlőpult</span></h2>
-                <p>Valódi képek egy Felhom dobozról — kattints rájuk a teljes mérethez</p>
+        <section class="shell-section" id="vezerlopult">
+            <div class="sec-head">
+                <h2>Így néz ki a vezérlőpult</h2>
+                <p>Valódi képek egy Felhom dobozról. Kattints rájuk a teljes mérethez.</p>
             </div>
             <div class="dash-grid">
                 <figure class="dash-shot">
                     <a href="/assets/dashboard-start-hu.webp" data-gallery="dashboard"><img src="/assets/dashboard-start-hu.webp" alt="A vezérlőpult Indítópultja: az otthon telepített alkalmazások csempéi" width="1440" height="900" loading="lazy"></a>
-                    <figcaption><strong>Indítópult</strong> — minden alkalmazásod egy kattintásra.</figcaption>
+                    <figcaption><strong>Indítópult</strong>: minden alkalmazásod egy kattintásra.</figcaption>
                 </figure>
                 <figure class="dash-shot">
                     <a href="/assets/dashboard-apps-hu.webp" data-gallery="dashboard"><img src="/assets/dashboard-apps-hu.webp" alt="Az Alkalmazások oldal: telepített és telepíthető alkalmazások kártyái, állapottal" width="1440" height="900" loading="lazy"></a>
-                    <figcaption><strong>Alkalmazások</strong> — telepítés pár kattintással, és látod, mi fut és mi naprakész.</figcaption>
+                    <figcaption><strong>Alkalmazások</strong>: telepítés pár kattintással, és látod, mi fut és mi naprakész.</figcaption>
                 </figure>
                 <figure class="dash-shot">
                     <a href="/assets/dashboard-app-hu.webp" data-gallery="dashboard"><img src="/assets/dashboard-app-hu.webp" alt="Egy alkalmazás saját oldala: mire jó, képek, és az első lépések" width="1440" height="900" loading="lazy"></a>
-                    <figcaption><strong>Egy alkalmazás oldala</strong> — mire jó, hova tedd a fájlokat, és hogyan kezdj hozzá.</figcaption>
+                    <figcaption><strong>Egy alkalmazás oldala</strong>: mire jó, hova tedd a fájlokat, és hogyan kezdj hozzá.</figcaption>
                 </figure>
                 <figure class="dash-shot">
                     <a href="/assets/dashboard-backups-hu.webp" data-gallery="dashboard"><img src="/assets/dashboard-backups-hu.webp" alt="A mentések oldala: minden alkalmazás adatbázisának éjszakai mentése, ellenőrizve" width="1440" height="900" loading="lazy"></a>
-                    <figcaption><strong>Mentések</strong> — minden éjjel minden alkalmazás adatbázisa mentésre kerül, és ellenőrizzük.</figcaption>
+                    <figcaption><strong>Mentések</strong>: minden éjjel minden alkalmazás adatbázisa mentésre kerül, és ellenőrizzük.</figcaption>
                 </figure>
             </div>
-        </div>
-    </section>
+        </section>
 
-    <section class="content-section alt-bg">
-        <div class="container">
-            <div class="section-header">
-                <h2>Miért ne a <span>felhőszolgáltatók?</span></h2>
-                <p>A nagy techcégek kényelmes megoldásokat kínálnak, de van néhány hátrány...</p>
+        <section class="shell-section" id="hogyan-mukodik">
+            <div class="sec-head">
+                <h2>Hogyan működik?</h2>
+                <p>Az első beszélgetéstől a működő rendszerig.</p>
             </div>
-            <div class="problem-grid">
-                <div class="problem-card">
-                    <div class="problem-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-coins"/></svg></div>
-                    <h3>Folyamatos költségek</h3>
-                    <p>Havonta fizetsz a tárhelyért, a prémium funkciókért, és az árak csak nőnek idővel.</p>
-                </div>
-                <div class="problem-card">
-                    <div class="problem-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-eye"/></svg></div>
-                    <h3>Adataid másé</h3>
-                    <p>A fotóid, dokumentumaid, személyes adataid idegen szervereken vannak, idegen kezekben.</p>
-                </div>
-                <div class="problem-card">
-                    <div class="problem-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-lock"/></svg></div>
-                    <h3>Korlátozott kontroll</h3>
-                    <p>Nem te döntöd el, milyen szolgáltatásokat használsz, és mikor szűnnek meg.</p>
-                </div>
-            </div>
-        </div>
-    </section>
-
-    <section class="content-section" id="miert">
-        <div class="container">
-            <div class="section-header">
-                <h2>Miért válaszd a <span>saját szervered?</span></h2>
-                <p>Az előnyök, amik miatt megéri</p>
-            </div>
-            <div class="why-grid">
-                <div class="why-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg> Teljes adatvédelem</h3>
-                    <p>Az adataid a te otthonodban maradnak, nem a Google vagy a Microsoft szerverein. A távoli mentésbe csak titkosítva kerülnek.</p>
-                </div>
-                <div class="why-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-coins"/></svg> Egyszeri befektetés</h3>
-                    <p>A gép a tiéd, örökre. Nincs tárhely-előfizetés, ami évről évre drágul: az áramot fizeted, és ha kéred, az üzemeltetést.</p>
-                </div>
-                <div class="why-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-zap"/></svg> Korlátlan kapacitás</h3>
-                    <p>Nincs 15GB-os limit. Bővítheted ahogy nőnek az igényeid - TB-okkal, ha kell.</p>
-                </div>
-                <div class="why-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-sliders-horizontal"/></svg> Teljes kontroll</h3>
-                    <p>Te döntöd el, milyen szolgáltatásokat futtatsz. Te vagy a főnök, nem a szolgáltató.</p>
-                </div>
-            </div>
-        </div>
-    </section>
-    <section class="content-section alt-bg" id="hogyan-mukodik">
-        <div class="container">
-            <div class="section-header">
-                <h2>Hogyan <span>működik?</span></h2>
-                <p>5 egyszerű lépés az indulástól a működő rendszerig</p>
-            </div>
-            <div class="process-steps">
-                <div class="process-step">
-                    <div class="step-number">1</div>
-                    <span class="process-connector">→</span>
+            <div class="flow">
+                <div class="flow-step">
                     <h3>Egyeztetés</h3>
                     <p>Megbeszéljük az igényeidet: milyen alkalmazásokra van szükséged, és mekkora tárhelyet szeretnél.</p>
                 </div>
-                <div class="process-step">
-                    <div class="step-number">2</div>
-                    <span class="process-connector">→</span>
+                <div class="flow-step">
                     <h3>Hardver kiválasztás</h3>
                     <p>Segítünk megtalálni a legjobb ár-érték arányú gépet, ami az igényeidnek megfelel.</p>
                 </div>
-                <div class="process-step">
-                    <div class="step-number">3</div>
-                    <span class="process-connector">→</span>
+                <div class="flow-step">
                     <h3>Telepítés</h3>
                     <p>Feltelepítjük és bekonfiguráljuk az alkalmazásokat, a mentéseket, és a monitoringot.</p>
                 </div>
-                <div class="process-step">
-                    <div class="step-number">4</div>
-                    <span class="process-connector">→</span>
+                <div class="flow-step">
                     <h3>Átadás</h3>
                     <p>Bemutatjuk a rendszert, segítünk áthozni a meglévő adataidat, és válaszolunk minden kérdésedre.</p>
                 </div>
-                <div class="process-step">
-                    <div class="step-number">5</div>
+                <div class="flow-step">
                     <h3>Üzemeltetés</h3>
                     <p>Figyeljük a rendszert, frissítünk, mentéseket ellenőrzünk. Te csak használod.</p>
                 </div>
             </div>
-        </div>
-    </section>
-    <section class="content-section" id="szolgaltatasok">
-        <div class="container">
-            <div class="section-header">
-                <h2>Mit kapsz <span>tőlünk?</span></h2>
-                <p>Kulcsrakész megoldások, professzionális kivitelezéssel</p>
-            </div>
-            <div class="service-list">
-                <div class="service-item">
-                    <span class="service-number">01</span>
-                    <div class="service-content">
-                        <h3>Szerver beszerzés és beüzemelés</h3>
-                        <p>Segítünk kiválasztani az igényeidnek megfelelő hardvert, és mindent beállítunk.</p>
-                    </div>
-                    <span class="service-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-monitor"/></svg></span>
-                </div>
-                <div class="service-item">
-                    <span class="service-number">02</span>
-                    <div class="service-content">
-                        <h3>Alkalmazás telepítés</h3>
-                        <p>Nextcloud, Plex, Jellyfin, Home Assistant, és még sok más - amit csak szeretnél.</p>
-                    </div>
-                    <span class="service-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg></span>
-                </div>
-                <div class="service-item">
-                    <span class="service-number">03</span>
-                    <div class="service-content">
-                        <h3>Biztonságos távoli elérés</h3>
-                        <p>Bárhonnan elérheted a szervereidet, biztonságosan, titkosított kapcsolaton keresztül.</p>
-                    </div>
-                    <span class="service-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></span>
-                </div>
-                <div class="service-item">
-                    <span class="service-number">04</span>
-                    <div class="service-content">
-                        <h3>Automatikus mentések</h3>
-                        <p>Rendszeres, automatikus mentések három szinten: a dobozon, egy második meghajtón és titkosítva egy távoli tárhelyen.</p>
-                    </div>
-                    <span class="service-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-hard-drive"/></svg></span>
-                </div>
-                <div class="service-item">
-                    <span class="service-number">05</span>
-                    <div class="service-content">
-                        <h3>Támogatás és karbantartás</h3>
-                        <p>Ha bármi gond van, itt vagyunk. Rendszeres frissítések, proaktív monitoring.</p>
-                    </div>
-                    <span class="service-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-wrench"/></svg></span>
-                </div>
-            </div>
-        </div>
-    </section>
+        </section>
 
-    <section class="content-section alt-bg" id="alkalmazasok">
-        <div class="container">
-            <div class="section-header">
-                <h2>Telepíthető <span>Alkalmazások</span></h2>
-                <p>Nyílt forráskódú szoftverek, amiket a saját szervereden futtathatsz</p>
+        <section class="shell-section" id="miert">
+            <div class="sec-head">
+                <h2>Miért a sajátod?</h2>
+                <p>Ugyanaz a kényelem, más feltételekkel.</p>
             </div>
+            <div class="vs">
+                <div class="vs-head">
+                    <div>Felhőszolgáltatónál</div>
+                    <div>Saját dobozon</div>
+                </div>
+                <div class="vs-row">
+                    <div>Havonta fizetsz a tárhelyért és a prémium funkciókért, és az árak csak nőnek idővel.</div>
+                    <div><strong>A gép a tiéd, örökre.</strong> Nincs tárhely-előfizetés, ami évről évre drágul: az áramot fizeted, és ha kéred, az üzemeltetést.</div>
+                </div>
+                <div class="vs-row">
+                    <div>A fotóid, dokumentumaid, személyes adataid idegen szervereken vannak, idegen kezekben.</div>
+                    <div><strong>Az adataid az otthonodban maradnak</strong>, nem a Google vagy a Microsoft szerverein. A távoli mentésbe csak titkosítva kerülnek.</div>
+                </div>
+                <div class="vs-row">
+                    <div>A tárhely fogy, és ha betelt, megint fizetsz.</div>
+                    <div><strong>Nincs 15GB-os limit.</strong> Bővítheted ahogy nőnek az igényeid, TB-okkal, ha kell.</div>
+                </div>
+                <div class="vs-row">
+                    <div>Nem te döntöd el, milyen szolgáltatásokat használsz, és mikor szűnnek meg.</div>
+                    <div><strong>Te döntöd el, milyen szolgáltatásokat futtatsz.</strong> Te vagy a főnök, nem a szolgáltató.</div>
+                </div>
+            </div>
+            <div class="band">
+                <div class="band-item">
+                    <h3>Amit telepíthetsz</h3>
+                    <p>Fájlkezelés, fotók és média, dokumentumok, jelszókezelés, okosotthon, fejlesztői eszközök. Nextcloud, Immich, Jellyfin, Paperless-ngx, Vaultwarden, Home Assistant és még 52 másik: <strong>58 alkalmazás</strong>, szinte mind nyílt forráskódú.</p>
+                    <a href="/alkalmazasok" class="btn btn-outline">Összes alkalmazás megtekintése →</a>
+                </div>
+                <div class="band-item">
+                    <h3>Ami alatta fut</h3>
+                    <p>Docker konténerek egy Proxmox alapon, háromszintű mentés, titkosított alagút nyitott port nélkül, magyar vagy angol vezérlőpult. Az igényeidhez igazítjuk, a <strong>legegyszerűbbtől a legkomolyabbig</strong>.</p>
+                    <a href="/technologiak" class="btn btn-outline">Technológiákról bővebben →</a>
+                </div>
+            </div>
+        </section>
 
-            <div class="apps-showcase">
-                <div class="app-category-preview">
-                    <span class="cat-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-folder"/></svg></span>
-                    <h3>Fájlkezelés</h3>
-                    <p>Nextcloud, FileBrowser, Gokapi, Zipline</p>
-                </div>
-                <div class="app-category-preview">
-                    <span class="cat-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-camera"/></svg></span>
-                    <h3>Fotók & Média</h3>
-                    <p>Immich, Jellyfin, Plex, Audiobookshelf</p>
-                </div>
-                <div class="app-category-preview">
-                    <span class="cat-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-clapperboard"/></svg></span>
-                    <h3>Média Automatizáció</h3>
-                    <p>Sonarr, Radarr, Seerr</p>
-                </div>
-                <div class="app-category-preview">
-                    <span class="cat-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-file-text"/></svg></span>
-                    <h3>Dokumentumok</h3>
-                    <p>Paperless-ngx, Docmost, BookStack, Outline</p>
-                </div>
-                <div class="app-category-preview">
-                    <span class="cat-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-lock"/></svg></span>
-                    <h3>Biztonság</h3>
-                    <p>Vaultwarden, PrivateBin</p>
-                </div>
-                <div class="app-category-preview">
-                    <span class="cat-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg></span>
-                    <h3>Otthon & Életmód</h3>
-                    <p>Tandoor, Mealie, Homebox, Actual Budget</p>
-                </div>
-                <div class="app-category-preview">
-                    <span class="cat-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-map"/></svg></span>
-                    <h3>Utazás & Szabadidő</h3>
-                    <p>AdventureLog, Wanderer, Dawarich, Cal.com</p>
-                </div>
-                <div class="app-category-preview">
-                    <span class="cat-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chart-column"/></svg></span>
-                    <h3>Dashboard</h3>
-                    <p>Homepage, Glance, Uptime Kuma</p>
-                </div>
-                <div class="app-category-preview">
-                    <span class="cat-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-gamepad-2"/></svg></span>
-                    <h3>Játékok</h3>
-                    <p>RoMM, Crafty Controller</p>
-                </div>
-                <div class="app-category-preview">
-                    <span class="cat-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-code"/></svg></span>
-                    <h3>Fejlesztőknek</h3>
-                    <p>Gitea, Code-Server, OpenGist</p>
-                </div>
+        <section class="shell-section" id="zart-teszt">
+            <div class="sec-head">
+                <h2>Zárt teszt</h2>
+                <p>Néhány magyar háztartással most kezdjük el élesben használni a rendszert.</p>
             </div>
-
-            <div class="apps-cta">
-                <p class="apps-count">
-                    <strong>58</strong> alkalmazás — szinte mind <strong>nyílt forráskódú</strong>
-                </p>
-                <a href="/alkalmazasok" class="cta-button-secondary">
-                    Összes alkalmazás megtekintése →
-                </a>
-            </div>
-        </div>
-    </section>
-
-    <section class="content-section" id="technologiak">
-        <div class="container">
-            <div class="section-header">
-                <h2>Professzionális <span>Technológiák</span></h2>
-                <p>Ipari szintű megoldások, otthoni környezetben</p>
-            </div>
-
-            <div class="apps-showcase">
-                <div class="app-category-preview">
-                    <span class="cat-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-container"/></svg></span>
-                    <h3>Konténerek</h3>
-                    <p>Docker alapú, izolált alkalmazás futtatás</p>
-                </div>
-                <div class="app-category-preview">
-                    <span class="cat-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-target"/></svg></span>
-                    <h3>Vezérlőpult</h3>
-                    <p>Magyar vagy angol kezelőfelület</p>
-                </div>
-                <div class="app-category-preview">
-                    <span class="cat-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg></span>
-                    <h3>Proxmox</h3>
-                    <p>Stabil virtualizációs alap</p>
-                </div>
-                <div class="app-category-preview">
-                    <span class="cat-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg></span>
-                    <h3>Háromszintű mentés</h3>
-                    <p>A dobozon, második meghajtón, titkosítva távol</p>
-                </div>
-                <div class="app-category-preview">
-                    <span class="cat-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></span>
-                    <h3>Hálózat</h3>
-                    <p>HTTPS, titkosított alagút, nyitott port nélkül</p>
-                </div>
-                <div class="app-category-preview">
-                    <span class="cat-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-hard-drive"/></svg></span>
-                    <h3>Tárolás</h3>
-                    <p>SSD + HDD, második meghajtó a mentéseknek</p>
-                </div>
-                <div class="app-category-preview">
-                    <span class="cat-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-monitor"/></svg></span>
-                    <h3>Hardver</h3>
-                    <p>Mini PC-től rack szerverig</p>
-                </div>
-            </div>
-
-            <div class="apps-cta">
-                <p class="apps-count">
-                    Az igényeidhez igazítjuk — a <strong style="color: var(--text-1);">legegyszerűbbtől</strong> a <strong>legkomolyabbig</strong>
-                </p>
-                <a href="/technologiak" class="cta-button-secondary">
-                    Technológiákról bővebben →
-                </a>
-            </div>
-        </div>
-    </section>
-
-    <section class="content-section alt-bg" id="mentesek">
-        <div class="container">
-            <div class="backup-content">
-                <div class="backup-text">
-                    <h2>Adataid <span>biztonságban</span></h2>
-                    <p>A nagy felhőszolgáltatók milliókat költenek arra, hogy az adataid ne vesszenek el. De tudtad, hogy ugyanezt az otthoni szerveredről is elérheted?</p>
-                    <p>A 3-2-1 mentési szabályt követve professzionális szintű adatbiztonságot építünk fel – egy katasztrófa után is marad egy titkosított másolat, távol az otthonodtól.</p>
-                    <a href="/biztonsagimentes" class="cta-button-secondary">
-                        Mentési stratégia részletei →
-                    </a>
-                </div>
-                <div class="backup-visual">
-                    <div class="backup-rule-mini">
-                        <span class="number">3</span>
-                        <div class="rule-text">
-                            <h4>Három másolat</h4>
-                            <p>Eredeti + két biztonsági mentés</p>
-                        </div>
-                    </div>
-                    <div class="backup-rule-mini">
-                        <span class="number">2</span>
-                        <div class="rule-text">
-                            <h4>Két tárolótípus</h4>
-                            <p>Különböző eszközökön tárolva</p>
-                        </div>
-                    </div>
-                    <div class="backup-rule-mini">
-                        <span class="number">1</span>
-                        <div class="rule-text">
-                            <h4>Egy távoli helyen</h4>
-                            <p>Offsite backup a biztonság érdekében</p>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-    </section>
-
-    <section class="content-section" id="zart-teszt">
-        <div class="container">
-            <div class="section-header">
-                <h2>Zárt <span>teszt</span></h2>
-                <p>Néhány magyar háztartással most kezdjük el élesben használni a rendszert</p>
-            </div>
-            <div class="why-grid">
-                <div class="why-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg> Valódi használat</h3>
+            <div class="app-info-grid">
+                <div class="app-info-card">
+                    <h3>Valódi használat</h3>
                     <p>Nem demó: a doboz nálad marad, és az igazi fényképeidet, dokumentumaidat teszed rá. Segítünk a telepítésben és az átállásban, utána te használod a mindennapokban.</p>
                 </div>
-                <div class="why-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-message-square"/></svg> Visszajelzés</h3>
-                    <p>Cserébe azt kérjük, hogy mondd el, mi zavaró, mi érthetetlen, mi nem működik. Egy „ezt a gombot nem találtam" ér nekünk a legtöbbet — abból tudjuk, mit kell kijavítani.</p>
-                </div>
-                <div class="why-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-triangle-alert"/></svg> Ismert korlátok</h3>
-                    <p>Őszintén: a vezérlőpulthoz jelenleg <strong>egy közös háztartási jelszó</strong> tartozik, külön családtagi fiókok még nincsenek (az egyes alkalmazásoknak viszont saját felhasználóik lehetnek). A <strong>TV-re streamelés (DLNA)</strong> még nincs: egyelőre böngészőből és mobil appból megy a médiatár. És mivel ez teszt, számíts arra, hogy találsz hibát — ez a lényege.</p>
+                <div class="app-info-card">
+                    <h3>Visszajelzés</h3>
+                    <p>Cserébe azt kérjük, hogy mondd el, mi zavaró, mi érthetetlen, mi nem működik. Egy „ezt a gombot nem találtam" ér nekünk a legtöbbet: abból tudjuk, mit kell kijavítani.</p>
                 </div>
             </div>
-            <div class="apps-cta">
-                <p class="apps-count">
-                    Ha ez érdekel, írj — <strong>nem kötelez semmire</strong>, először csak beszélgetünk
-                </p>
-                <a href="/teszteles" class="cta-button">
-                    Jelentkezem tesztelőnek →
-                </a>
+            <div class="alerts-container">
+                <div class="alert-banner alert-banner-warning">
+                    <span class="alert-icon"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-triangle-alert"/></svg></span>
+                    <span class="alert-message"><strong>Ismert korlátok, őszintén.</strong> A vezérlőpulthoz jelenleg <strong>egy közös háztartási jelszó</strong> tartozik, külön családtagi fiókok még nincsenek (az egyes alkalmazásoknak viszont saját felhasználóik lehetnek). A <strong>TV-re streamelés (DLNA)</strong> még nincs: egyelőre böngészőből és mobil appból megy a médiatár. És mivel ez teszt, számíts arra, hogy találsz hibát: ez a lényege.</span>
+                </div>
             </div>
-        </div>
-    </section>
+            <div class="close-cta">
+                <p>Ha ez érdekel, írj. <strong>Nem kötelez semmire</strong>, először csak beszélgetünk.</p>
+                <a href="/teszteles" class="btn btn-primary btn-lg">Jelentkezem tesztelőnek →</a>
+                <div class="who-mini">
+                    <img src="/assets/operator-portrait-small.webp" alt="Nagyfenyvesi Viktor, a Felhom üzemeltetője" width="160" height="200" loading="lazy">
+                    <p>A Felhom mögött egy ember áll: <strong>Nagyfenyvesi Viktor</strong>. Ha írsz, ő válaszol. <a href="/kapcsolat#ki-all-mogotte">Ki áll mögötte →</a></p>
+                </div>
+            </div>
+        </section>
 
-    <section class="contact" id="kapcsolat">
-        <div class="container">
-            <div class="contact-box">
-                <h2>Érdekel? <span>Beszéljünk!</span></h2>
-                <div class="contact-methods">
-                    <a href="/kapcsolat" class="contact-link"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-message-square"/></svg> Kapcsolatfelvételi űrlap</a>
-                    <a href="mailto:info@felhom.eu" class="contact-link"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-mail"/></svg> info@felhom.eu</a>
-                </div>
-            </div>
-        </div>
-    </section>
-
-    <footer>
+<footer>
         <div class="container">
             <p>© 2026 felhom.eu – Saját felhőd, saját szabályaid</p>
             <p class="footer-legal">Üzemeltető: Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Adatkezelési tájékoztató</a> · <a href="/feltetelek">Feltételek</a></p>
         </div>
     </footer>
+    </main>
     <script>
-    (function() {
-        const hamburger = document.getElementById('hamburger');
-        const navLinks = document.querySelector('.nav-links');
-        const overlay = document.getElementById('mobileOverlay');
-        const body = document.body;
-
-        if (!hamburger || !navLinks || !overlay) {
-            console.warn('[mobile-menu] Missing elements:', {
-                hamburger: !!hamburger,
-                navLinks: !!navLinks,
-                overlay: !!overlay
-            });
-            return;
-        }
-
-        function openMenu() {
-            hamburger.classList.add('is-active');
-            navLinks.classList.add('is-open');
-            overlay.classList.add('is-visible');
-            body.classList.add('menu-open');
-            hamburger.setAttribute('aria-expanded', 'true');
-            hamburger.setAttribute('aria-label', 'Menü bezárása');
-        }
-
-        function closeMenu() {
-            hamburger.classList.remove('is-active');
-            navLinks.classList.remove('is-open');
-            overlay.classList.remove('is-visible');
-            body.classList.remove('menu-open');
-            hamburger.setAttribute('aria-expanded', 'false');
-            hamburger.setAttribute('aria-label', 'Menü megnyitása');
-        }
-
-        hamburger.addEventListener('click', function() {
-            if (navLinks.classList.contains('is-open')) {
-                closeMenu();
-            } else {
-                openMenu();
-            }
-        });
-
-        // Close on overlay click
-        overlay.addEventListener('click', closeMenu);
-
-        // Close on nav link click
-        navLinks.querySelectorAll('a').forEach(function(link) {
-            link.addEventListener('click', closeMenu);
-        });
-
-        // Close on Escape key
-        document.addEventListener('keydown', function(e) {
-            if (e.key === 'Escape' && navLinks.classList.contains('is-open')) {
-                closeMenu();
-            }
-        });
-
-        // Close on resize if open (e.g., rotating device)
-        window.addEventListener('resize', function() {
-            if (window.innerWidth > 900 && navLinks.classList.contains('is-open')) {
-                closeMenu();
-            }
-        });
+    (function(){
+        var b=document.getElementById('navBurger'),s=document.getElementById('sidebar'),k=document.getElementById('navBackdrop');
+        if(!b||!s||!k)return;
+        function open(){s.classList.add('is-open');k.hidden=false;document.body.classList.add('nav-open');b.setAttribute('aria-expanded','true');}
+        function close(){s.classList.remove('is-open');k.hidden=true;document.body.classList.remove('nav-open');b.setAttribute('aria-expanded','false');}
+        b.addEventListener('click',function(){s.classList.contains('is-open')?close():open();});
+        k.addEventListener('click',close);
+        document.addEventListener('keydown',function(e){if(e.key==='Escape'&&s.classList.contains('is-open')){close();b.focus();}});
+        s.querySelectorAll('a').forEach(function(l){l.addEventListener('click',close);});
+        window.addEventListener('resize',function(){if(window.innerWidth>768)close();});
     })();
+    document.addEventListener('click',function(e){
+        var btn=e.target.closest?e.target.closest('.nav-group-toggle'):null;
+        if(!btn)return;
+        var g=btn.closest('.nav-group');if(!g)return;
+        var willOpen=!g.classList.contains('is-open');
+        document.querySelectorAll('.nav-group.is-open').forEach(function(x){
+            x.classList.remove('is-open');
+            var t=x.querySelector('.nav-group-toggle');if(t)t.setAttribute('aria-expanded','false');
+        });
+        if(willOpen){g.classList.add('is-open');btn.setAttribute('aria-expanded','true');}
+    });
     </script>
 </body>
-</html>
\ No newline at end of file
+</html>
diff --git a/website/kapcsolat.html b/website/kapcsolat.html
index ded1a676..015d5a78 100644
--- a/website/kapcsolat.html
+++ b/website/kapcsolat.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html lang="hu">
+<html lang="hu" class="no-js">
 <head>
+    <script>document.documentElement.className=document.documentElement.className.replace('no-js','js');</script>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Kapcsolat — Kérj személyre szabott ajánlatot otthoni szerveredhez | Felhom.eu</title>
@@ -26,45 +27,61 @@
     <meta name="twitter:description" content="Kérdésed van? Írj nekünk: info@felhom.eu">
     <meta name="twitter:image" content="https://felhom.eu/assets/og-image.png">
     <!-- shared assets: bump ?v= together on any site.css/icons.svg change -->
-    <link rel="stylesheet" href="/assets/site.css?v=21">
+    <link rel="stylesheet" href="/assets/site.css?v=22">
+    <link rel="stylesheet" href="/assets/shell.css?v=22">
     <link rel="icon" type="image/png" href="/assets/logo_favicon_2.svg">
     <script defer src="https://stats.felhom.eu/script.js" data-website-id="d419db57-5e1c-48df-bdb3-c29f25fb1661"></script>
 </head>
-<body class="page-kapcsolat">
-    <nav>
-        <div class="container">
-            <a href="/" class="logo">
-                <img class="logo-mark" src="/assets/logo-mark.svg" alt="" aria-hidden="true">
-                <img class="logo-word" src="/assets/logo-wordmark.png" alt="felhom.eu">
+<body class="shell page-kapcsolat">
+    <header class="mobile-topbar">
+        <a href="/" class="mobile-topbar-logo"><img src="/assets/logo_notext_white.svg" alt="Felhom.eu"></a>
+        <button type="button" class="nav-burger" id="navBurger" aria-expanded="false" aria-controls="sidebar" aria-label="Menü">
+            <span class="hamburger-box"><span class="hamburger-line"></span><span class="hamburger-line"></span><span class="hamburger-line"></span></span>
+        </button>
+    </header>
+    <div class="nav-backdrop" id="navBackdrop" hidden></div>
+    <nav class="sidebar" id="sidebar">
+        <div class="sidebar-header">
+            <a href="/" class="sidebar-logo-link">
+                <img src="/assets/logo_notext_white.svg" alt="" class="sidebar-logo" aria-hidden="true">
+                <img src="/assets/logo-wordmark.png" alt="felhom.eu" class="sidebar-word">
             </a>
-            <ul class="nav-links">
-                <li><a href="/#szolgaltatasok">Szolgáltatások</a></li>
-                <li><a href="/alkalmazasok">Alkalmazások</a></li>
-                <li><a href="/technologiak">Technológiák</a></li>
-                <li><a href="/biztonsagimentes">Mentések</a></li>
-                <li><a href="/gyik">GYIK</a></li>
-                <li><a href="/kapcsolat" class="active">Kapcsolat</a></li>
-                <li class="lang-globe-li"><details class="lang-globe"><summary class="lang-globe-btn" aria-label="Nyelv" title="Nyelv"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/kapcsolat" lang="hu" hreflang="hu" class="lang-globe-item current" aria-current="true">Magyar</a></li><li><a href="/en/contact" lang="en" hreflang="en" class="lang-globe-item">English</a></li></ul></details></li>
+        </div>
+        <ul class="nav-links">
+                <li><a href="/"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg>Kezdőlap</a></li>
+                <li><a href="/#szolgaltatasok"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rocket"/></svg>Szolgáltatások</a></li>
+                <li class="nav-group">
+                    <button type="button" class="nav-group-toggle" aria-expanded="false" aria-controls="nav-group-apps"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg>Alkalmazások<svg class="ico nav-chevron" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chevron-down"/></svg></button>
+                    <ul id="nav-group-apps" class="nav-links nav-links-sub nav-links-nested">
+                        <li><a href="/alkalmazasok">Minden alkalmazás</a></li>
+                        <li><a href="/alkalmazasok#fajlkezeles-irodai">Fájlkezelés &amp; Irodai</a></li>
+                        <li><a href="/alkalmazasok#media-szorakozas">Média &amp; Szórakozás</a></li>
+                        <li><a href="/alkalmazasok#otthon-eletmod">Otthon &amp; Életmód</a></li>
+                        <li><a href="/alkalmazasok#produktivitas-tudaskezeles">Produktivitás &amp; Tudáskezelés</a></li>
+                        <li><a href="/alkalmazasok#rendszer-fejlesztes">Rendszer &amp; Fejlesztés</a></li>
+                    </ul>
+                </li>
+                <li><a href="/technologiak"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg>Technológiák</a></li>
+                <li><a href="/biztonsagimentes"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg>Biztonsági mentés</a></li>
+        </ul>
+        <div class="sidebar-bottom">
+            <a href="/teszteles" class="btn btn-outline sidebar-cta">Jelentkezem tesztelőnek →</a>
+            <div class="nav-group-label">A Felhomról</div>
+            <ul class="nav-links nav-links-sub">
+                    <li><a href="/#hogyan-mukodik">Hogyan működik</a></li>
+                    <li><a href="/gyik">GYIK</a></li>
+                    <li><a href="/kapcsolat" class="active">Kapcsolat</a></li>
             </ul>
-            <button class="hamburger" id="hamburger" aria-label="Menü megnyitása" aria-expanded="false">
-                <span class="hamburger-box">
-                    <span class="hamburger-line"></span>
-                    <span class="hamburger-line"></span>
-                    <span class="hamburger-line"></span>
-                </span>
-            </button>
+            <div class="sidebar-footer">
+                <details class="lang-globe"><summary class="lang-globe-btn" aria-label="Nyelv" title="Nyelv"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/kapcsolat" lang="hu" hreflang="hu" class="lang-globe-item current" aria-current="true">Magyar</a></li><li><a href="/en/contact" lang="en" hreflang="en" class="lang-globe-item">English</a></li></ul></details>
+            </div>
         </div>
     </nav>
-    <div class="mobile-overlay" id="mobileOverlay"></div>
-
-    <section class="page-header">
-        <div class="container">
-            <h1>Írj nekünk <span>bátran!</span></h1>
-            <p>Kérdésed van, vagy szeretnéd megbeszélni az igényeidet? Töltsd ki az űrlapot, és hamarosan válaszolunk.</p>
-        </div>
-    </section>
-
-    <main>
+<main class="content">
+<div class="page-header">
+                <h1>Írj nekünk <span>bátran!</span></h1>
+            </div>
+            <p class="page-lede">Kérdésed van, vagy szeretnéd megbeszélni az igényeidet? Töltsd ki az űrlapot, és hamarosan válaszolunk.</p>
         <section class="content-section" style="padding-top: 0;">
             <div class="container">
                 <div class="contact-layout">
@@ -94,10 +111,10 @@
                                 <label for="subject">Tárgy <span class="required">*</span></label>
                                 <select id="subject" name="subject" required>
                                     <option value="" disabled selected>Válassz témát...</option>
-                                    <option value="zart-teszt">Zárt teszt — jelentkezem tesztelőnek</option>
-                                    <option value="erdeklodes">Érdeklődés — szeretném megismerni a szolgáltatást</option>
-                                    <option value="arajanlat">Árajánlat kérés — konkrét igényeim vannak</option>
-                                    <option value="tamogatas">Támogatás — meglévő szerveremet érintő kérdés</option>
+                                    <option value="zart-teszt">Zárt teszt – jelentkezem tesztelőnek</option>
+                                    <option value="erdeklodes">Érdeklődés – szeretném megismerni a szolgáltatást</option>
+                                    <option value="arajanlat">Árajánlat kérés – konkrét igényeim vannak</option>
+                                    <option value="tamogatas">Támogatás – meglévő szerveremet érintő kérdés</option>
                                     <option value="egyeb">Egyéb</option>
                                 </select>
                                 <div class="error-message" id="subjectError">Kérlek, válassz egy témát.</div>
@@ -186,13 +203,6 @@
     </section>
     </main>
 
-    <footer>
-        <div class="container">
-            <p>© 2026 felhom.eu – Saját felhőd, saját szabályaid</p>
-            <p class="footer-legal">Üzemeltető: Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Adatkezelési tájékoztató</a> · <a href="/feltetelek">Feltételek</a></p>
-        </div>
-    </footer>
-
     <script>
     (() => {
         'use strict';
@@ -474,7 +484,7 @@
 
             // Subject label mapping
             const subjectLabels = {
-                'zart-teszt': 'Jelentkezés — zárt teszt',
+                'zart-teszt': 'Jelentkezés – zárt teszt',
                 erdeklodes: 'Érdeklődés',
                 arajanlat: 'Árajánlat kérés',
                 tamogatas: 'Támogatás',
@@ -613,5 +623,35 @@
         });
     })();
     </script>
+<footer>
+        <div class="container">
+            <p>© 2026 felhom.eu – Saját felhőd, saját szabályaid</p>
+            <p class="footer-legal">Üzemeltető: Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Adatkezelési tájékoztató</a> · <a href="/feltetelek">Feltételek</a></p>
+        </div>
+    </footer>
+    <script>
+    (function(){
+        var b=document.getElementById('navBurger'),s=document.getElementById('sidebar'),k=document.getElementById('navBackdrop');
+        if(!b||!s||!k)return;
+        function open(){s.classList.add('is-open');k.hidden=false;document.body.classList.add('nav-open');b.setAttribute('aria-expanded','true');}
+        function close(){s.classList.remove('is-open');k.hidden=true;document.body.classList.remove('nav-open');b.setAttribute('aria-expanded','false');}
+        b.addEventListener('click',function(){s.classList.contains('is-open')?close():open();});
+        k.addEventListener('click',close);
+        document.addEventListener('keydown',function(e){if(e.key==='Escape'&&s.classList.contains('is-open')){close();b.focus();}});
+        s.querySelectorAll('a').forEach(function(l){l.addEventListener('click',close);});
+        window.addEventListener('resize',function(){if(window.innerWidth>768)close();});
+    })();
+    document.addEventListener('click',function(e){
+        var btn=e.target.closest?e.target.closest('.nav-group-toggle'):null;
+        if(!btn)return;
+        var g=btn.closest('.nav-group');if(!g)return;
+        var willOpen=!g.classList.contains('is-open');
+        document.querySelectorAll('.nav-group.is-open').forEach(function(x){
+            x.classList.remove('is-open');
+            var t=x.querySelector('.nav-group-toggle');if(t)t.setAttribute('aria-expanded','false');
+        });
+        if(willOpen){g.classList.add('is-open');btn.setAttribute('aria-expanded','true');}
+    });
+    </script>
 </body>
 </html>
diff --git a/website/letoltes.html b/website/letoltes.html
index 497d42ba..cb7c8f92 100644
--- a/website/letoltes.html
+++ b/website/letoltes.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html lang="hu">
+<html lang="hu" class="no-js">
 <head>
+    <script>document.documentElement.className=document.documentElement.className.replace('no-js','js');</script>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Letöltés — a Felhom telepítő | Felhom.eu</title>
@@ -24,44 +25,62 @@
     <meta name="twitter:description" content="Letöltés, ellenőrző összeg, és mire figyelj a telepítés előtt.">
     <meta name="twitter:image" content="https://felhom.eu/assets/og-image.png">
     <!-- shared assets: bump ?v= together on any site.css/icons.svg change -->
-    <link rel="stylesheet" href="/assets/site.css?v=21">
+    <link rel="stylesheet" href="/assets/site.css?v=22">
+    <link rel="stylesheet" href="/assets/shell.css?v=22">
     <link rel="icon" type="image/png" href="/assets/logo_favicon_2.svg">
     <script defer src="https://stats.felhom.eu/script.js" data-website-id="d419db57-5e1c-48df-bdb3-c29f25fb1661"></script>
 </head>
-<body class="page-letoltes">
-    <nav>
-        <div class="container">
-            <a href="/" class="logo">
-                <img class="logo-mark" src="/assets/logo-mark.svg" alt="" aria-hidden="true">
-                <img class="logo-word" src="/assets/logo-wordmark.png" alt="felhom.eu">
+<body class="shell page-letoltes">
+    <header class="mobile-topbar">
+        <a href="/" class="mobile-topbar-logo"><img src="/assets/logo_notext_white.svg" alt="Felhom.eu"></a>
+        <button type="button" class="nav-burger" id="navBurger" aria-expanded="false" aria-controls="sidebar" aria-label="Menü">
+            <span class="hamburger-box"><span class="hamburger-line"></span><span class="hamburger-line"></span><span class="hamburger-line"></span></span>
+        </button>
+    </header>
+    <div class="nav-backdrop" id="navBackdrop" hidden></div>
+    <nav class="sidebar" id="sidebar">
+        <div class="sidebar-header">
+            <a href="/" class="sidebar-logo-link">
+                <img src="/assets/logo_notext_white.svg" alt="" class="sidebar-logo" aria-hidden="true">
+                <img src="/assets/logo-wordmark.png" alt="felhom.eu" class="sidebar-word">
             </a>
-            <ul class="nav-links">
-                <li><a href="/#szolgaltatasok">Szolgáltatások</a></li>
-                <li><a href="/alkalmazasok">Alkalmazások</a></li>
-                <li><a href="/technologiak">Technológiák</a></li>
-                <li><a href="/biztonsagimentes">Mentések</a></li>
-                <li><a href="/gyik">GYIK</a></li>
-                <li><a href="/kapcsolat">Kapcsolat</a></li>
-                <li class="lang-globe-li"><details class="lang-globe"><summary class="lang-globe-btn" aria-label="Nyelv" title="Nyelv"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/letoltes" lang="hu" hreflang="hu" class="lang-globe-item current" aria-current="true">Magyar</a></li><li><a href="/en/download" lang="en" hreflang="en" class="lang-globe-item">English</a></li></ul></details></li>
+        </div>
+        <ul class="nav-links">
+                <li><a href="/"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg>Kezdőlap</a></li>
+                <li><a href="/#szolgaltatasok"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rocket"/></svg>Szolgáltatások</a></li>
+                <li class="nav-group">
+                    <button type="button" class="nav-group-toggle" aria-expanded="false" aria-controls="nav-group-apps"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg>Alkalmazások<svg class="ico nav-chevron" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chevron-down"/></svg></button>
+                    <ul id="nav-group-apps" class="nav-links nav-links-sub nav-links-nested">
+                        <li><a href="/alkalmazasok">Minden alkalmazás</a></li>
+                        <li><a href="/alkalmazasok#fajlkezeles-irodai">Fájlkezelés &amp; Irodai</a></li>
+                        <li><a href="/alkalmazasok#media-szorakozas">Média &amp; Szórakozás</a></li>
+                        <li><a href="/alkalmazasok#otthon-eletmod">Otthon &amp; Életmód</a></li>
+                        <li><a href="/alkalmazasok#produktivitas-tudaskezeles">Produktivitás &amp; Tudáskezelés</a></li>
+                        <li><a href="/alkalmazasok#rendszer-fejlesztes">Rendszer &amp; Fejlesztés</a></li>
+                    </ul>
+                </li>
+                <li><a href="/technologiak"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg>Technológiák</a></li>
+                <li><a href="/biztonsagimentes"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg>Biztonsági mentés</a></li>
+        </ul>
+        <div class="sidebar-bottom">
+            <a href="/teszteles" class="btn btn-outline sidebar-cta">Jelentkezem tesztelőnek →</a>
+            <div class="nav-group-label">A Felhomról</div>
+            <ul class="nav-links nav-links-sub">
+                    <li><a href="/#hogyan-mukodik">Hogyan működik</a></li>
+                    <li><a href="/gyik">GYIK</a></li>
+                    <li><a href="/kapcsolat">Kapcsolat</a></li>
             </ul>
-            <button class="hamburger" id="hamburger" aria-label="Menü megnyitása" aria-expanded="false">
-                <span class="hamburger-box">
-                    <span class="hamburger-line"></span>
-                    <span class="hamburger-line"></span>
-                    <span class="hamburger-line"></span>
-                </span>
-            </button>
+            <div class="sidebar-footer">
+                <details class="lang-globe"><summary class="lang-globe-btn" aria-label="Nyelv" title="Nyelv"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/letoltes" lang="hu" hreflang="hu" class="lang-globe-item current" aria-current="true">Magyar</a></li><li><a href="/en/download" lang="en" hreflang="en" class="lang-globe-item">English</a></li></ul></details>
+            </div>
         </div>
     </nav>
-    <div class="mobile-overlay" id="mobileOverlay"></div>
-
-    <main>
-        <section class="page-header">
-            <div class="container">
+<main class="content">
+                <div class="page-header">
                 <h1>A Felhom <span>telepítő</span></h1>
-                <p>Ez az oldal annak szól, aki az üzemeltetőtől telepítési útmutatót kapott. A telepítő egy teljes gépet alakít át Felhom szerverré.</p>
             </div>
-        </section>
+                <p class="page-lede">Ez az oldal annak szól, aki az üzemeltetőtől telepítési útmutatót kapott. A telepítő egy teljes gépet alakít át Felhom szerverré.</p>
+
 
         <section class="content-section">
             <div class="container">
@@ -81,7 +100,7 @@
                     <p>Felhom telepítő 1.29.0 (Proxmox VE 9.2 alapon)</p>
                 </div>
                 <div class="info-card">
-                    <p><a href="https://iso.felhom.eu/felhom-installer-1.29.0-pve9.2-1.iso"><strong>felhom-installer-1.29.0-pve9.2-1.iso</strong></a> — 1,6 GB (1 705 324 544 bájt)</p>
+                    <p><a href="https://iso.felhom.eu/felhom-installer-1.29.0-pve9.2-1.iso"><strong>felhom-installer-1.29.0-pve9.2-1.iso</strong></a> – 1,6 GB (1 705 324 544 bájt)</p>
                     <p>Ellenőrző összeg (SHA-256):</p>
                     <div class="highlight-box">
                         <p><code>dceacae5da247d76cad065bf6c0d3bbefac8d8a5f8e571db2fd8449a97e94829</code></p>
@@ -93,13 +112,6 @@
             </div>
         </section>
     </main>
-
-    <footer>
-        <div class="container">
-            <p>© 2026 felhom.eu – Saját felhőd, saját szabályaid</p>
-            <p class="footer-legal">Üzemeltető: Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Adatkezelési tájékoztató</a> · <a href="/feltetelek">Feltételek</a></p>
-        </div>
-    </footer>
     <script>
     (function() {
         var hamburger = document.getElementById('hamburger');
@@ -161,5 +173,35 @@
         });
     })();
     </script>
+<footer>
+        <div class="container">
+            <p>© 2026 felhom.eu – Saját felhőd, saját szabályaid</p>
+            <p class="footer-legal">Üzemeltető: Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Adatkezelési tájékoztató</a> · <a href="/feltetelek">Feltételek</a></p>
+        </div>
+    </footer>
+    <script>
+    (function(){
+        var b=document.getElementById('navBurger'),s=document.getElementById('sidebar'),k=document.getElementById('navBackdrop');
+        if(!b||!s||!k)return;
+        function open(){s.classList.add('is-open');k.hidden=false;document.body.classList.add('nav-open');b.setAttribute('aria-expanded','true');}
+        function close(){s.classList.remove('is-open');k.hidden=true;document.body.classList.remove('nav-open');b.setAttribute('aria-expanded','false');}
+        b.addEventListener('click',function(){s.classList.contains('is-open')?close():open();});
+        k.addEventListener('click',close);
+        document.addEventListener('keydown',function(e){if(e.key==='Escape'&&s.classList.contains('is-open')){close();b.focus();}});
+        s.querySelectorAll('a').forEach(function(l){l.addEventListener('click',close);});
+        window.addEventListener('resize',function(){if(window.innerWidth>768)close();});
+    })();
+    document.addEventListener('click',function(e){
+        var btn=e.target.closest?e.target.closest('.nav-group-toggle'):null;
+        if(!btn)return;
+        var g=btn.closest('.nav-group');if(!g)return;
+        var willOpen=!g.classList.contains('is-open');
+        document.querySelectorAll('.nav-group.is-open').forEach(function(x){
+            x.classList.remove('is-open');
+            var t=x.querySelector('.nav-group-toggle');if(t)t.setAttribute('aria-expanded','false');
+        });
+        if(willOpen){g.classList.add('is-open');btn.setAttribute('aria-expanded','true');}
+    });
+    </script>
 </body>
-</html>
\ No newline at end of file
+</html>
diff --git a/website/preview/index.html b/website/preview/index.html
deleted file mode 100644
index fb3f96f4..00000000
--- a/website/preview/index.html
+++ /dev/null
@@ -1,432 +0,0 @@
-<!DOCTYPE html>
-<html lang="hu">
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-
-    <meta name="description" content="Otthoni szerver a saját otthonodban: fényképek, dokumentumok, médiatár. 58 telepíthető alkalmazás, háromszintű automatikus mentés, magyar vagy angol nyelvű vezérlőpult. Most zárt teszt indul.">
-    <title>Felhom.eu — Saját felhőd, saját szabályaid | Otthoni szerver szolgáltatás</title>
-
-    <!-- SEO meta -->
-    <meta name="keywords" content="otthoni szerver, saját felhő, self-hosting, Google Drive alternatíva, iCloud alternatíva, adatvédelem, nyílt forráskódú, szerver telepítés, szerver üzemeltetés, Nextcloud, Immich, Magyarország">
-    <meta name="author" content="Felhom.eu">
-    <meta name="robots" content="noindex, nofollow">
-    <!-- PREVIEW ONLY. This file becomes website/index.html at the switch; this noindex
-         line and robots.txt's Disallow: /preview/ are removed in that same commit. -->
-    <link rel="canonical" href="https://felhom.eu/">
-    <link rel="alternate" hreflang="hu" href="https://felhom.eu/">
-    <link rel="alternate" hreflang="en" href="https://felhom.eu/en/">
-    <link rel="alternate" hreflang="x-default" href="https://felhom.eu/">
-
-    <!-- Open Graph (Facebook, LinkedIn) -->
-    <meta property="og:type" content="website">
-    <meta property="og:url" content="https://felhom.eu/">
-    <meta property="og:title" content="Felhom.eu — Saját felhőd, saját szabályaid">
-    <meta property="og:description" content="Otthoni szerver a te otthonodban: fényképek, dokumentumok, médiatár — automatikus mentéssel, és egy helyreállítási kóddal, amit csak te ismersz. Most zárt teszt indul.">
-    <meta property="og:image" content="https://felhom.eu/assets/og-image.png">
-    <meta property="og:image:width" content="1200">
-    <meta property="og:image:height" content="630">
-    <meta property="og:image:alt" content="Felhom.eu — Saját felhőd, saját szabályaid. Zárt teszt indul.">
-    <meta property="og:locale" content="hu_HU">
-    <meta property="og:site_name" content="Felhom.eu">
-
-    <!-- Twitter/X Card -->
-    <meta name="twitter:card" content="summary_large_image">
-    <meta name="twitter:title" content="Felhom.eu — Saját felhőd, saját szabályaid">
-    <meta name="twitter:description" content="Otthoni szerver a te otthonodban: fényképek, dokumentumok, médiatár — automatikus mentéssel, és egy helyreállítási kóddal, amit csak te ismersz.">
-    <meta name="twitter:image" content="https://felhom.eu/assets/og-image.png">
-
-    <!-- Structured Data (JSON-LD) -->
-    <script type="application/ld+json">
-    {
-      "@context": "https://schema.org",
-      "@type": "LocalBusiness",
-      "name": "Felhom.eu",
-      "description": "Professzionális otthoni szerver telepítés és üzemeltetés Magyarországon.",
-      "url": "https://felhom.eu",
-      "logo": "https://felhom.eu/assets/logo.png",
-      "email": "info@felhom.eu",
-      "areaServed": {
-        "@type": "Country",
-        "name": "Magyarország"
-      },
-      "serviceType": ["Szerver telepítés", "Szerver üzemeltetés", "Self-hosting"],
-      "knowsLanguage": ["hu", "en"],
-      "sameAs": []
-    }
-    </script>
-    <!-- shared assets: bump ?v= together on any site.css/icons.svg change -->
-    <link rel="stylesheet" href="/assets/site.css?v=21">
-    <link rel="icon" type="image/png" href="/assets/logo_favicon_2.svg">
-    <script defer src="/assets/gallery.js?v=2"></script>
-    <script defer src="https://stats.felhom.eu/script.js" data-website-id="d419db57-5e1c-48df-bdb3-c29f25fb1661"></script>
-</head>
-<body class="page-index">
-<nav>
-        <div class="container">
-            <a href="/" class="logo">
-                <img class="logo-mark" src="/assets/logo-mark.svg" alt="" aria-hidden="true">
-                <img class="logo-word" src="/assets/logo-wordmark.png" alt="felhom.eu">
-            </a>
-            <ul class="nav-links">
-                <li><a href="/#szolgaltatasok">Szolgáltatások</a></li>
-                <li><a href="/alkalmazasok">Alkalmazások</a></li>
-                <li><a href="/technologiak">Technológiák</a></li>
-                <li><a href="/biztonsagimentes">Mentések</a></li>
-                <li><a href="/gyik">GYIK</a></li>
-                <li><a href="/kapcsolat">Kapcsolat</a></li>
-                <li class="lang-globe-li"><details class="lang-globe"><summary class="lang-globe-btn" aria-label="Nyelv" title="Nyelv"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/" lang="hu" hreflang="hu" class="lang-globe-item current" aria-current="true">Magyar</a></li><li><a href="/en/" lang="en" hreflang="en" class="lang-globe-item">English</a></li></ul></details></li>
-            </ul>
-            <button class="hamburger" id="hamburger" aria-label="Menü megnyitása" aria-expanded="false">
-                <span class="hamburger-box">
-                    <span class="hamburger-line"></span>
-                    <span class="hamburger-line"></span>
-                    <span class="hamburger-line"></span>
-                </span>
-            </button>
-        </div>
-    </nav>
-    <div class="mobile-overlay" id="mobileOverlay"></div>
-
-    <section class="lede">
-        <div class="container">
-            <div class="lede-grid">
-                <div class="lede-text">
-                    <h1>Saját felhőd,<br><span>saját szabályaid</span></h1>
-                    <p>Egy kis gép az otthonodban: a fényképeid, a dokumentumaid, a filmjeid. Minden éjjel mentés készül. Mi figyeljük, te használod.</p>
-                    <a href="/teszteles" class="cta-button">Jelentkezem tesztelőnek →</a>
-                </div>
-                <figure class="lede-shot">
-                    <img src="/assets/dashboard-start-hu.webp" alt="A Felhom vezérlőpult indítópultja: az otthon telepített alkalmazások csempéi" width="1440" height="900" fetchpriority="high">
-                    <figcaption>A vezérlőpult indítópultja egy éles Felhom dobozon.</figcaption>
-                </figure>
-            </div>
-        </div>
-    </section>
-
-    <section class="content-section" id="mit-tud">
-        <div class="container">
-            <div class="sec-head">
-                <h2>Mit tud <span>a doboz ma?</span></h2>
-                <p>Nem terv és nem ígéret: ezek ma működő funkciók egy éles Felhom dobozon.</p>
-            </div>
-            <div class="caps">
-                <div class="caps-group">
-                    <h3>Amit nap mint nap használsz</h3>
-                    <ul class="caps-list">
-                        <li class="caps-item">
-                            <h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-camera"/></svg> Fényképek, dokumentumok, média</h4>
-                            <p>A telefonod fotói automatikusan feltöltődnek a saját gépedre. A beszkennelt papírjaidat a rendszer felismeri és kereshetővé teszi. A filmjeid, zenéid böngészőből és mobil appból is mennek.</p>
-                        </li>
-                        <li class="caps-item">
-                            <h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-folder"/></svg> Hálózati megosztás</h4>
-                            <p>A doboz mappái megjelennek a Windows Intézőben és a Mac Finderben: úgy húzod rájuk a fájlokat, mint bármelyik másik mappára. Megosztásonként beállítható, hogy csak olvasható legyen.</p>
-                        </li>
-                        <li class="caps-item">
-                            <h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg> 58 telepíthető alkalmazás</h4>
-                            <p>A vezérlőpultból telepíthetők, pár kattintással, parancssor nélkül. Szinte mind nyílt forráskódú (a kivételeket az alkalmazások oldalán jelöljük), és mind a te gépeden fut.</p>
-                        </li>
-                        <li class="caps-item">
-                            <h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg> Magyarul vagy angolul</h4>
-                            <p>A vezérlőpult magyarul és angolul is használható. A nyelvet a háztartás választja, és a dobozról érkező e-mailek is ezt a nyelvet követik.</p>
-                        </li>
-                    </ul>
-                </div>
-                <div class="caps-group">
-                    <h3>Ami a háttérben véd</h3>
-                    <ul class="caps-list">
-                        <li class="caps-item">
-                            <h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg> Háromszintű automatikus mentés</h4>
-                            <p>Minden éjjel készül egy mentés a dobozon, egy másodpéldány egy második meghajtóra (ha van), és egy titkosított másolat egy távoli tárhelyre. A megosztott mappáid a második meghajtón és a távoli másolatban is benne vannak.</p>
-                        </li>
-                        <li class="caps-item">
-                            <h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-lock"/></svg> Helyreállítási kód, amit csak te ismersz</h4>
-                            <p>A távoli mentésed titkosításának kulcsa egy helyreállítási kód, ami pontosan egyszer jelenik meg: a te képernyődön. Mi nem ismerjük, és nem tudjuk visszaállítani. Ez azt is jelenti, hogy a kód nélkül a távoli mentés nekünk sem olvasható: tedd el jól.</p>
-                        </li>
-                        <li class="caps-item">
-                            <h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rotate-cw"/></svg> Visszaállítás, ha baj van</h4>
-                            <p>Egy törölt fájl visszahozható a mentésből. Ha maga a doboz megy tönkre, az újratelepített rendszerre a titkosított távoli mentésből visszahozhatók az alkalmazásaid adatai, a helyreállítási kóddal.</p>
-                        </li>
-                        <li class="caps-item">
-                            <h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg> Internetkimaradáskor is működik</h4>
-                            <p>A doboz az otthonodban van. Ha elmegy a net, az otthoni hálózaton továbbra is eléred a fotóidat és a fájljaidat: nem egy távoli szolgáltató engedélyétől függenek.</p>
-                        </li>
-                    </ul>
-                </div>
-                <div class="caps-group">
-                    <h3>Amiről mi gondoskodunk</h3>
-                    <ul class="caps-list">
-                        <li class="caps-item">
-                            <h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-stethoscope"/></svg> Távoli felügyelet, automatikus frissítés</h4>
-                            <p>Figyeljük a doboz állapotát. A vezérlőpult magától frissül a legutóbbi kiadásra, és a doboz rendszere is megkapja a biztonsági frissítéseket. Neked nem kell csinálnod semmit. Ha valami elromlik, mi látjuk.</p>
-                        </li>
-                        <li class="caps-item">
-                            <h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rotate-cw"/></svg> Óvatos alkalmazásfrissítés</h4>
-                            <p>Egy alkalmazás új verziója csak akkor jut el hozzád, ha előbb kipróbáltuk. Frissítés előtt friss mentés készül, és ha az új verzió nem indul el rendesen, a doboz magától visszaállítja az előzőt, az adataiddal együtt.</p>
-                        </li>
-                    </ul>
-                </div>
-            </div>
-        </div>
-    </section>
-
-    <section class="content-section alt-bg" id="vezerlopult">
-        <div class="container">
-            <div class="sec-head">
-                <h2>Így néz ki <span>a vezérlőpult</span></h2>
-                <p>Valódi képek egy Felhom dobozról. Kattints rájuk a teljes mérethez.</p>
-            </div>
-            <div class="dash-grid">
-                <figure class="dash-shot">
-                    <a href="/assets/dashboard-start-hu.webp" data-gallery="dashboard"><img src="/assets/dashboard-start-hu.webp" alt="A vezérlőpult Indítópultja: az otthon telepített alkalmazások csempéi" width="1440" height="900" loading="lazy"></a>
-                    <figcaption><strong>Indítópult</strong>: minden alkalmazásod egy kattintásra.</figcaption>
-                </figure>
-                <figure class="dash-shot">
-                    <a href="/assets/dashboard-apps-hu.webp" data-gallery="dashboard"><img src="/assets/dashboard-apps-hu.webp" alt="Az Alkalmazások oldal: telepített és telepíthető alkalmazások kártyái, állapottal" width="1440" height="900" loading="lazy"></a>
-                    <figcaption><strong>Alkalmazások</strong>: telepítés pár kattintással, és látod, mi fut és mi naprakész.</figcaption>
-                </figure>
-                <figure class="dash-shot">
-                    <a href="/assets/dashboard-app-hu.webp" data-gallery="dashboard"><img src="/assets/dashboard-app-hu.webp" alt="Egy alkalmazás saját oldala: mire jó, képek, és az első lépések" width="1440" height="900" loading="lazy"></a>
-                    <figcaption><strong>Egy alkalmazás oldala</strong>: mire jó, hova tedd a fájlokat, és hogyan kezdj hozzá.</figcaption>
-                </figure>
-                <figure class="dash-shot">
-                    <a href="/assets/dashboard-backups-hu.webp" data-gallery="dashboard"><img src="/assets/dashboard-backups-hu.webp" alt="A mentések oldala: minden alkalmazás adatbázisának éjszakai mentése, ellenőrizve" width="1440" height="900" loading="lazy"></a>
-                    <figcaption><strong>Mentések</strong>: minden éjjel minden alkalmazás adatbázisa mentésre kerül, és ellenőrizzük.</figcaption>
-                </figure>
-            </div>
-        </div>
-    </section>
-
-    <section class="content-section alt-bg" id="hogyan-mukodik">
-        <div class="container">
-            <div class="sec-head">
-                <h2>Hogyan <span>működik?</span></h2>
-                <p>Az első beszélgetéstől a működő rendszerig.</p>
-            </div>
-            <div class="flow">
-                <div class="flow-step">
-                    <h3>Egyeztetés</h3>
-                    <p>Megbeszéljük az igényeidet: milyen alkalmazásokra van szükséged, és mekkora tárhelyet szeretnél.</p>
-                </div>
-                <div class="flow-step">
-                    <h3>Hardver kiválasztás</h3>
-                    <p>Segítünk megtalálni a legjobb ár-érték arányú gépet, ami az igényeidnek megfelel.</p>
-                </div>
-                <div class="flow-step">
-                    <h3>Telepítés</h3>
-                    <p>Feltelepítjük és bekonfiguráljuk az alkalmazásokat, a mentéseket, és a monitoringot.</p>
-                </div>
-                <div class="flow-step">
-                    <h3>Átadás</h3>
-                    <p>Bemutatjuk a rendszert, segítünk áthozni a meglévő adataidat, és válaszolunk minden kérdésedre.</p>
-                </div>
-                <div class="flow-step">
-                    <h3>Üzemeltetés</h3>
-                    <p>Figyeljük a rendszert, frissítünk, mentéseket ellenőrzünk. Te csak használod.</p>
-                </div>
-            </div>
-        </div>
-    </section>
-
-    <section class="content-section" id="mentesek">
-        <div class="container">
-            <div class="backup-content">
-                <div class="backup-text">
-                    <h2>Adataid <span>biztonságban</span></h2>
-                    <p>A nagy felhőszolgáltatók milliókat költenek arra, hogy az adataid ne vesszenek el. De tudtad, hogy ugyanezt az otthoni szerveredről is elérheted?</p>
-                    <p>A 3-2-1 mentési szabályt követve professzionális szintű adatbiztonságot építünk fel – egy katasztrófa után is marad egy titkosított másolat, távol az otthonodtól.</p>
-                    <a href="/biztonsagimentes" class="cta-button-secondary">
-                        Mentési stratégia részletei →
-                    </a>
-                </div>
-                <div class="backup-visual">
-                    <div class="backup-rule-mini">
-                        <span class="rule-num">3</span>
-                        <div class="rule-text">
-                            <h4>Három másolat</h4>
-                            <p>Eredeti + két biztonsági mentés</p>
-                        </div>
-                    </div>
-                    <div class="backup-rule-mini">
-                        <span class="rule-num">2</span>
-                        <div class="rule-text">
-                            <h4>Két tárolótípus</h4>
-                            <p>Különböző eszközökön tárolva</p>
-                        </div>
-                    </div>
-                    <div class="backup-rule-mini">
-                        <span class="rule-num">1</span>
-                        <div class="rule-text">
-                            <h4>Egy távoli helyen</h4>
-                            <p>Offsite backup a biztonság érdekében</p>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-    </section>
-
-    <section class="content-section alt-bg" id="miert">
-        <div class="container">
-            <div class="sec-head">
-                <h2>Miért a <span>sajátod?</span></h2>
-                <p>Ugyanaz a kényelem, más feltételekkel.</p>
-            </div>
-            <div class="vs">
-                <div class="vs-head">
-                    <div>Felhőszolgáltatónál</div>
-                    <div>Saját dobozon</div>
-                </div>
-                <div class="vs-row">
-                    <div>Havonta fizetsz a tárhelyért és a prémium funkciókért, és az árak csak nőnek idővel.</div>
-                    <div><strong>A gép a tiéd, örökre.</strong> Nincs tárhely-előfizetés, ami évről évre drágul: az áramot fizeted, és ha kéred, az üzemeltetést.</div>
-                </div>
-                <div class="vs-row">
-                    <div>A fotóid, dokumentumaid, személyes adataid idegen szervereken vannak, idegen kezekben.</div>
-                    <div><strong>Az adataid az otthonodban maradnak</strong>, nem a Google vagy a Microsoft szerverein. A távoli mentésbe csak titkosítva kerülnek.</div>
-                </div>
-                <div class="vs-row">
-                    <div>A tárhely fogy, és ha betelt, megint fizetsz.</div>
-                    <div><strong>Nincs 15GB-os limit.</strong> Bővítheted ahogy nőnek az igényeid, TB-okkal, ha kell.</div>
-                </div>
-                <div class="vs-row">
-                    <div>Nem te döntöd el, milyen szolgáltatásokat használsz, és mikor szűnnek meg.</div>
-                    <div><strong>Te döntöd el, milyen szolgáltatásokat futtatsz.</strong> Te vagy a főnök, nem a szolgáltató.</div>
-                </div>
-            </div>
-        </div>
-    </section>
-
-    <section class="content-section" id="szolgaltatasok">
-        <div class="container">
-            <div class="band">
-                <div class="band-item" id="alkalmazasok">
-                    <h3>Amit telepíthetsz</h3>
-                    <p>Fájlkezelés, fotók és média, dokumentumok, jelszókezelés, okosotthon, fejlesztői eszközök. Nextcloud, Immich, Jellyfin, Paperless-ngx, Vaultwarden, Home Assistant és még 52 másik: <strong>58 alkalmazás</strong>, szinte mind nyílt forráskódú.</p>
-                    <a href="/alkalmazasok" class="cta-button-secondary">Összes alkalmazás megtekintése →</a>
-                </div>
-                <div class="band-item" id="technologiak">
-                    <h3>Ami alatta fut</h3>
-                    <p>Docker konténerek egy Proxmox alapon, háromszintű mentés, titkosított alagút nyitott port nélkül, magyar vagy angol vezérlőpult. Az igényeidhez igazítjuk, a <strong>legegyszerűbbtől a legkomolyabbig</strong>.</p>
-                    <a href="/technologiak" class="cta-button-secondary">Technológiákról bővebben →</a>
-                </div>
-            </div>
-        </div>
-    </section>
-
-    <section class="content-section alt-bg" id="zart-teszt">
-        <div class="container">
-            <div class="sec-head">
-                <h2>Zárt <span>teszt</span></h2>
-                <p>Néhány magyar háztartással most kezdjük el élesben használni a rendszert.</p>
-            </div>
-            <div class="test-grid">
-                <div class="test-note">
-                    <h3>Valódi használat</h3>
-                    <p>Nem demó: a doboz nálad marad, és az igazi fényképeidet, dokumentumaidat teszed rá. Segítünk a telepítésben és az átállásban, utána te használod a mindennapokban.</p>
-                </div>
-                <div class="test-note">
-                    <h3>Visszajelzés</h3>
-                    <p>Cserébe azt kérjük, hogy mondd el, mi zavaró, mi érthetetlen, mi nem működik. Egy „ezt a gombot nem találtam" ér nekünk a legtöbbet: abból tudjuk, mit kell kijavítani.</p>
-                </div>
-            </div>
-            <div class="limits">
-                <h3>Ismert korlátok, őszintén</h3>
-                <p>A vezérlőpulthoz jelenleg <strong>egy közös háztartási jelszó</strong> tartozik, külön családtagi fiókok még nincsenek (az egyes alkalmazásoknak viszont saját felhasználóik lehetnek). A <strong>TV-re streamelés (DLNA)</strong> még nincs: egyelőre böngészőből és mobil appból megy a médiatár. És mivel ez teszt, számíts arra, hogy találsz hibát: ez a lényege.</p>
-            </div>
-            <div class="close-cta">
-                <p>Ha ez érdekel, írj. <strong>Nem kötelez semmire</strong>, először csak beszélgetünk.</p>
-                <a href="/teszteles" class="cta-button">Jelentkezem tesztelőnek →</a>
-                <div class="who-mini">
-                    <img src="/assets/operator-portrait-small.webp" alt="Nagyfenyvesi Viktor, a Felhom üzemeltetője" width="160" height="200" loading="lazy">
-                    <p>A Felhom mögött egy ember áll: <strong>Nagyfenyvesi Viktor</strong>. Ha írsz, ő válaszol. <a href="/kapcsolat#ki-all-mogotte">Ki áll mögötte →</a></p>
-                </div>
-            </div>
-        </div>
-    </section>
-
-    <section class="contact" id="kapcsolat">
-        <div class="container">
-            <div class="contact-box">
-                <h2>Érdekel? <span>Beszéljünk!</span></h2>
-                <div class="contact-methods">
-                    <a href="/kapcsolat" class="contact-link"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-message-square"/></svg> Kapcsolatfelvételi űrlap</a>
-                    <a href="mailto:info@felhom.eu" class="contact-link"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-mail"/></svg> info@felhom.eu</a>
-                </div>
-            </div>
-        </div>
-    </section>
-
-    <footer>
-        <div class="container">
-            <p>© 2026 felhom.eu – Saját felhőd, saját szabályaid</p>
-            <p class="footer-legal">Üzemeltető: Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Adatkezelési tájékoztató</a> · <a href="/feltetelek">Feltételek</a></p>
-        </div>
-    </footer>
-    <script>
-    (function() {
-        const hamburger = document.getElementById('hamburger');
-        const navLinks = document.querySelector('.nav-links');
-        const overlay = document.getElementById('mobileOverlay');
-        const body = document.body;
-
-        if (!hamburger || !navLinks || !overlay) {
-            console.warn('[mobile-menu] Missing elements:', {
-                hamburger: !!hamburger,
-                navLinks: !!navLinks,
-                overlay: !!overlay
-            });
-            return;
-        }
-
-        function openMenu() {
-            hamburger.classList.add('is-active');
-            navLinks.classList.add('is-open');
-            overlay.classList.add('is-visible');
-            body.classList.add('menu-open');
-            hamburger.setAttribute('aria-expanded', 'true');
-            hamburger.setAttribute('aria-label', 'Menü bezárása');
-        }
-
-        function closeMenu() {
-            hamburger.classList.remove('is-active');
-            navLinks.classList.remove('is-open');
-            overlay.classList.remove('is-visible');
-            body.classList.remove('menu-open');
-            hamburger.setAttribute('aria-expanded', 'false');
-            hamburger.setAttribute('aria-label', 'Menü megnyitása');
-        }
-
-        hamburger.addEventListener('click', function() {
-            if (navLinks.classList.contains('is-open')) {
-                closeMenu();
-            } else {
-                openMenu();
-            }
-        });
-
-        // Close on overlay click
-        overlay.addEventListener('click', closeMenu);
-
-        // Close on nav link click
-        navLinks.querySelectorAll('a').forEach(function(link) {
-            link.addEventListener('click', closeMenu);
-        });
-
-        // Close on Escape key
-        document.addEventListener('keydown', function(e) {
-            if (e.key === 'Escape' && navLinks.classList.contains('is-open')) {
-                closeMenu();
-            }
-        });
-
-        // Close on resize if open (e.g., rotating device)
-        window.addEventListener('resize', function() {
-            if (window.innerWidth > 900 && navLinks.classList.contains('is-open')) {
-                closeMenu();
-            }
-        });
-    })();
-    </script>
-</body>
-</html>
diff --git a/website/preview/m1/alkalmazasok.html b/website/preview/m1/alkalmazasok.html
deleted file mode 100644
index ea30e606..00000000
--- a/website/preview/m1/alkalmazasok.html
+++ /dev/null
@@ -1,2134 +0,0 @@
-<!DOCTYPE html>
-<html lang="hu" class="no-js">
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <meta name="robots" content="noindex, nofollow">
-    <meta name="description" content="Mockup: a telepíthető alkalmazások katalógusa a vezérlőpult felületén.">
-    <title>Alkalmazások · Felhom.eu mockup</title>
-    <script>
-    /* The controller's own progressive-enhancement hook (layout.html): flip no-js -> js before
-       the first CSS-dependent paint, so the off-canvas drawer engages ONLY where the drawer
-       script can open it. Without it the sidebar stays an in-flow flex child on a phone and
-       squeezes the content column - which is exactly what happened here first time. */
-    document.documentElement.className=document.documentElement.className.replace('no-js','js');
-    </script>
-    <link rel="stylesheet" href="/preview/mockup.css?v=1">
-    <link rel="icon" type="image/png" href="/assets/logo_favicon_2.svg">
-</head>
-<body class="mockup">
-    <header class="mobile-topbar">
-        <a href="index.html" class="mobile-topbar-logo"><img src="/assets/logo_notext_white.svg" alt="Felhom.eu"></a>
-        <button type="button" class="nav-burger" id="navBurger" aria-expanded="false" aria-controls="sidebar" aria-label="Menü">
-            <span class="hamburger-box"><span class="hamburger-line"></span><span class="hamburger-line"></span><span class="hamburger-line"></span></span>
-        </button>
-    </header>
-    <div class="nav-backdrop" id="navBackdrop" hidden></div>
-    <nav class="sidebar" id="sidebar">
-        <div class="sidebar-header">
-            <img src="/assets/logo_notext_white.svg" alt="Felhom.eu" class="sidebar-logo">
-        </div>
-        <ul class="nav-links">
-                <li><a href="index.html"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rocket"/></svg>Indítópult</a></li>
-                <li><a href="alkalmazasok.html" class="active"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-cloud"/></svg>Alkalmazások</a></li>
-                <li><a href="mentesek.html"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield"/></svg>Biztonsági mentés</a></li>
-                <li><span class="nav-off" title="a saját dobozodon működik"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-hard-drive"/></svg>Tárhely<span class="nav-off-hint">a saját dobozodon működik</span></span></li>
-                <li><span class="nav-off" title="a saját dobozodon működik"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layout-grid"/></svg>Megosztás<span class="nav-off-hint">a saját dobozodon működik</span></span></li>
-                <li><span class="nav-off" title="a saját dobozodon működik"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-cpu"/></svg>Rendszermonitor<span class="nav-off-hint">a saját dobozodon működik</span></span></li>
-                <li><span class="nav-off" title="a saját dobozodon működik"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-settings"/></svg>Beállítások<span class="nav-off-hint">a saját dobozodon működik</span></span></li>
-        </ul>
-        <div class="sidebar-bottom">
-            <div class="nav-group-label">A Felhomról</div>
-            <ul class="nav-links nav-links-sub">
-                    <li><a href="hogyan.html">Hogyan működik</a></li>
-                    <li><a href="teszteles.html">Tesztelés</a></li>
-                    <li><a href="kapcsolat.html">Kapcsolat</a></li>
-            </ul>
-            <div class="sidebar-footer">
-                <span class="version">mockup</span>
-            </div>
-        </div>
-    </nav>
-    <main class="content">
-        <div class="page-header"><h2>Alkalmazások</h2><span class="domain-badge">58 telepíthető</span></div>
-        <div class="app-search">
-            <label class="form-hint" for="appSearch">Keresés a katalógusban</label>
-            <input class="form-control" type="search" id="appSearch" placeholder="Például: fotó, jelszó, recept" autocomplete="off">
-            <p class="form-hint" id="searchCount"></p>
-        </div>
-        <h3 class="bucket-head">Fájlkezelés &amp; Irodai <span class="bucket-count">3</span></h3>
-        <div class="stack-grid">
-            <a class="stack-detail-card" href="#app-gokapi" data-name="gokapi ideiglenes fájlmegosztás lejáró linkekkel">
-                <span class="launch-tile" style="background: hsl(256, 45%, 38%)">
-                    <span class="launch-mono">G</span>
-                    <img class="launch-logo" src="/assets/gokapi-logo.png" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>Gokapi</h3>
-                    <p class="stack-detail-desc">Ideiglenes fájlmegosztás lejáró linkekkel</p>
-                </div>
-            </a>
-            <a class="stack-detail-card" href="#app-nextcloud" data-name="nextcloud a saját google drive-od - fájlok, naptár, névjegyek egy helyen">
-                <span class="launch-tile" style="background: hsl(201, 45%, 38%)">
-                    <span class="launch-mono">N</span>
-                    <img class="launch-logo" src="/assets/nextcloud-logo.svg" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>Nextcloud</h3>
-                    <p class="stack-detail-desc">A saját Google Drive-od - fájlok, naptár, névjegyek egy helyen</p>
-                </div>
-            </a>
-            <a class="stack-detail-card" href="#app-zipline" data-name="zipline screenshot és fájlmegosztó szerver sharex/flameshot integrációval">
-                <span class="launch-tile" style="background: hsl(102, 45%, 38%)">
-                    <span class="launch-mono">Z</span>
-                    <img class="launch-logo" src="/assets/zipline-logo.png" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>Zipline</h3>
-                    <p class="stack-detail-desc">Screenshot és fájlmegosztó szerver ShareX/Flameshot integrációval</p>
-                </div>
-            </a>
-        </div>
-        <h3 class="bucket-head">Média &amp; Szórakozás <span class="bucket-count">15</span></h3>
-        <div class="stack-grid">
-            <a class="stack-detail-card" href="#app-audiobookshelf" data-name="audiobookshelf hangoskönyv és podcast kezelő, lejátszó és szinkronizáló">
-                <span class="launch-tile" style="background: hsl(120, 45%, 38%)">
-                    <span class="launch-mono">A</span>
-                    <img class="launch-logo" src="/assets/audiobookshelf-logo.svg" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>Audiobookshelf</h3>
-                    <p class="stack-detail-desc">Hangoskönyv és podcast kezelő, lejátszó és szinkronizáló</p>
-                </div>
-            </a>
-            <a class="stack-detail-card" href="#app-calibre-web" data-name="calibre-web automated automatizált e-könyv könyvtár - könyvfeldolgozás, formátumkonverzió és opds feed">
-                <span class="launch-tile" style="background: hsl(274, 45%, 38%)">
-                    <span class="launch-mono">C</span>
-                    <img class="launch-logo" src="/assets/calibre-web-logo.svg" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>Calibre-Web Automated</h3>
-                    <p class="stack-detail-desc">Automatizált e-könyv könyvtár - könyvfeldolgozás, formátumkonverzió és OPDS feed</p>
-                </div>
-            </a>
-            <a class="stack-detail-card" href="#app-crafty-controller" data-name="crafty controller minecraft szerver kezelő - hozd létre a saját világodat">
-                <span class="launch-tile" style="background: hsl(307, 45%, 38%)">
-                    <span class="launch-mono">C</span>
-                    <img class="launch-logo" src="/assets/crafty-controller-logo.png" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>Crafty Controller</h3>
-                    <p class="stack-detail-desc">Minecraft szerver kezelő - hozd létre a saját világodat</p>
-                </div>
-            </a>
-            <a class="stack-detail-card" href="#app-emby" data-name="emby személyes média szerver élő tv és dvr támogatással">
-                <span class="launch-tile" style="background: hsl(106, 45%, 38%)">
-                    <span class="launch-mono">E</span>
-                    <img class="launch-logo" src="/assets/emby-logo.svg" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>Emby</h3>
-                    <p class="stack-detail-desc">Személyes média szerver élő TV és DVR támogatással</p>
-                </div>
-            </a>
-            <a class="stack-detail-card" href="#app-grimmory" data-name="grimmory e-könyvtár - olvasd böngészőben, kobón, koreaderrel vagy bármely opds-olvasóval">
-                <span class="launch-tile" style="background: hsl(291, 45%, 38%)">
-                    <span class="launch-mono">G</span>
-                    <img class="launch-logo" src="/assets/grimmory-logo.svg" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>Grimmory</h3>
-                    <p class="stack-detail-desc">E-könyvtár - olvasd böngészőben, Kobón, KOReaderrel vagy bármely OPDS-olvasóval</p>
-                </div>
-            </a>
-            <a class="stack-detail-card" href="#app-immich" data-name="immich google photos alternatíva - automatikus fotó mentés és rendszerezés">
-                <span class="launch-tile" style="background: hsl(18, 45%, 38%)">
-                    <span class="launch-mono">I</span>
-                    <img class="launch-logo" src="/assets/immich-logo.svg" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>Immich</h3>
-                    <p class="stack-detail-desc">Google Photos alternatíva - automatikus fotó mentés és rendszerezés</p>
-                </div>
-            </a>
-            <a class="stack-detail-card" href="#app-jellyfin" data-name="jellyfin ingyenes média szerver - filmek, sorozatok és zene streamelése">
-                <span class="launch-tile" style="background: hsl(348, 45%, 38%)">
-                    <span class="launch-mono">J</span>
-                    <img class="launch-logo" src="/assets/jellyfin-logo.svg" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>Jellyfin</h3>
-                    <p class="stack-detail-desc">Ingyenes média szerver - filmek, sorozatok és zene streamelése</p>
-                </div>
-            </a>
-            <a class="stack-detail-card" href="#app-komga" data-name="komga képregény, manga és könyv szerver webes olvasóval">
-                <span class="launch-tile" style="background: hsl(158, 45%, 38%)">
-                    <span class="launch-mono">K</span>
-                    <img class="launch-logo" src="/assets/komga-logo.svg" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>Komga</h3>
-                    <p class="stack-detail-desc">Képregény, manga és könyv szerver webes olvasóval</p>
-                </div>
-            </a>
-            <a class="stack-detail-card" href="#app-metube" data-name="metube videók és hanganyagok letöltése egy linkből - csak a családodnak">
-                <span class="launch-tile" style="background: hsl(285, 45%, 38%)">
-                    <span class="launch-mono">M</span>
-                    <img class="launch-logo" src="/assets/metube-logo.svg" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>MeTube</h3>
-                    <p class="stack-detail-desc">Videók és hanganyagok letöltése egy linkből - csak a családodnak</p>
-                </div>
-            </a>
-            <a class="stack-detail-card" href="#app-navidrome" data-name="navidrome könnyű zene szerver - streameld a saját zenegyűjteményedet">
-                <span class="launch-tile" style="background: hsl(318, 45%, 38%)">
-                    <span class="launch-mono">N</span>
-                    <img class="launch-logo" src="/assets/navidrome-logo.svg" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>Navidrome</h3>
-                    <p class="stack-detail-desc">Könnyű zene szerver - streameld a saját zenegyűjteményedet</p>
-                </div>
-            </a>
-            <a class="stack-detail-card" href="#app-plex" data-name="plex prémium média szerver kiváló alkalmazás támogatással">
-                <span class="launch-tile" style="background: hsl(20, 45%, 38%)">
-                    <span class="launch-mono">P</span>
-                    <img class="launch-logo" src="/assets/plex-logo.svg" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>Plex</h3>
-                    <p class="stack-detail-desc">Prémium média szerver kiváló alkalmazás támogatással</p>
-                </div>
-            </a>
-            <a class="stack-detail-card" href="#app-radarr" data-name="radarr automatikus film letöltő és rendszerező">
-                <span class="launch-tile" style="background: hsl(3, 45%, 38%)">
-                    <span class="launch-mono">R</span>
-                    <img class="launch-logo" src="/assets/radarr-logo.png" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>Radarr</h3>
-                    <p class="stack-detail-desc">Automatikus film letöltő és rendszerező</p>
-                </div>
-            </a>
-            <a class="stack-detail-card" href="#app-romm" data-name="romm retró játékgyűjtemény kezelő, böngésző és lejátszó">
-                <span class="launch-tile" style="background: hsl(44, 45%, 38%)">
-                    <span class="launch-mono">R</span>
-                    <img class="launch-logo" src="/assets/romm-logo.svg" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>RomM</h3>
-                    <p class="stack-detail-desc">Retró játékgyűjtemény kezelő, böngésző és lejátszó</p>
-                </div>
-            </a>
-            <a class="stack-detail-card" href="#app-seerr" data-name="jellyseerr film és sorozat igénylő a háztartás tagjai számára">
-                <span class="launch-tile" style="background: hsl(244, 45%, 38%)">
-                    <span class="launch-mono">J</span>
-                    <img class="launch-logo" src="/assets/seerr-logo.png" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>Jellyseerr</h3>
-                    <p class="stack-detail-desc">Film és sorozat igénylő a háztartás tagjai számára</p>
-                </div>
-            </a>
-            <a class="stack-detail-card" href="#app-sonarr" data-name="sonarr automatikus sorozat letöltő és rendszerező">
-                <span class="launch-tile" style="background: hsl(18, 45%, 38%)">
-                    <span class="launch-mono">S</span>
-                    <img class="launch-logo" src="/assets/sonarr-logo.svg" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>Sonarr</h3>
-                    <p class="stack-detail-desc">Automatikus sorozat letöltő és rendszerező</p>
-                </div>
-            </a>
-        </div>
-        <h3 class="bucket-head">Otthon &amp; Életmód <span class="bucket-count">12</span></h3>
-        <div class="stack-grid">
-            <a class="stack-detail-card" href="#app-actualbudget" data-name="actualbudget költségvetés tervező - pénzügyeid kézben tartása egyszerűen">
-                <span class="launch-tile" style="background: hsl(106, 45%, 38%)">
-                    <span class="launch-mono">A</span>
-                    <img class="launch-logo" src="/assets/actualbudget-logo.svg" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>ActualBudget</h3>
-                    <p class="stack-detail-desc">Költségvetés tervező - pénzügyeid kézben tartása egyszerűen</p>
-                </div>
-            </a>
-            <a class="stack-detail-card" href="#app-adventurelog" data-name="adventurelog utazási napló - utazások dokumentálása térképpel és fotókkal">
-                <span class="launch-tile" style="background: hsl(155, 45%, 38%)">
-                    <span class="launch-mono">A</span>
-                    <img class="launch-logo" src="/assets/adventurelog-logo.png" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>AdventureLog</h3>
-                    <p class="stack-detail-desc">Utazási napló - utazások dokumentálása térképpel és fotókkal</p>
-                </div>
-            </a>
-            <a class="stack-detail-card" href="#app-calcom" data-name="cal.com időpontfoglaló - calendly alternatíva saját szerveren">
-                <span class="launch-tile" style="background: hsl(84, 45%, 38%)">
-                    <span class="launch-mono">C</span>
-                    <img class="launch-logo" src="/assets/calcom-logo.svg" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>Cal.com</h3>
-                    <p class="stack-detail-desc">Időpontfoglaló - Calendly alternatíva saját szerveren</p>
-                </div>
-            </a>
-            <a class="stack-detail-card" href="#app-dawarich" data-name="dawarich saját helyelőzmények - a telefonod a te szerveredre küldi, hol jártál">
-                <span class="launch-tile" style="background: hsl(244, 45%, 38%)">
-                    <span class="launch-mono">D</span>
-                    <img class="launch-logo" src="/assets/dawarich-logo.svg" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>Dawarich</h3>
-                    <p class="stack-detail-desc">Saját helyelőzmények - a telefonod a te szerveredre küldi, hol jártál</p>
-                </div>
-            </a>
-            <a class="stack-detail-card" href="#app-gramps-web" data-name="gramps web családfa készítő - genealógiai adatbázis webes felületen">
-                <span class="launch-tile" style="background: hsl(100, 45%, 38%)">
-                    <span class="launch-mono">G</span>
-                    <img class="launch-logo" src="/assets/gramps-web-logo.png" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>Gramps Web</h3>
-                    <p class="stack-detail-desc">Családfa készítő - genealógiai adatbázis webes felületen</p>
-                </div>
-            </a>
-            <a class="stack-detail-card" href="#app-grocy" data-name="grocy háztartásvezetés: mi van otthon, mi fogy el, mit kell megvenni, kinek mi a dolga">
-                <span class="launch-tile" style="background: hsl(293, 45%, 38%)">
-                    <span class="launch-mono">G</span>
-                    <img class="launch-logo" src="/assets/grocy-logo.svg" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>Grocy</h3>
-                    <p class="stack-detail-desc">Háztartásvezetés: mi van otthon, mi fogy el, mit kell megvenni, kinek mi a dolga</p>
-                </div>
-            </a>
-            <a class="stack-detail-card" href="#app-home-assistant" data-name="home assistant okos otthon központ - automatizálás és vezérlés egy helyről">
-                <span class="launch-tile" style="background: hsl(291, 45%, 38%)">
-                    <span class="launch-mono">H</span>
-                    <img class="launch-logo" src="/assets/home-assistant-logo.svg" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>Home Assistant</h3>
-                    <p class="stack-detail-desc">Okos otthon központ - automatizálás és vezérlés egy helyről</p>
-                </div>
-            </a>
-            <a class="stack-detail-card" href="#app-lubelogger" data-name="lubelogger a családi autó teljes története egy helyen: szerviz, javítás, tankolás, költségek">
-                <span class="launch-tile" style="background: hsl(167, 45%, 38%)">
-                    <span class="launch-mono">L</span>
-                    <img class="launch-logo" src="/assets/lubelogger-logo.png" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>LubeLogger</h3>
-                    <p class="stack-detail-desc">A családi autó teljes története egy helyen: szerviz, javítás, tankolás, költségek</p>
-                </div>
-            </a>
-            <a class="stack-detail-card" href="#app-sparkyfitness" data-name="sparkyfitness táplálkozási napló, kalóriaszámláló és edzéskövető – önállóan üzemeltetve">
-                <span class="launch-tile" style="background: hsl(51, 45%, 38%)">
-                    <span class="launch-mono">S</span>
-                    <img class="launch-logo" src="/assets/sparkyfitness-logo.png" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>SparkyFitness</h3>
-                    <p class="stack-detail-desc">Táplálkozási napló, kalóriaszámláló és edzéskövető – önállóan üzemeltetve</p>
-                </div>
-            </a>
-            <a class="stack-detail-card" href="#app-tandoor" data-name="tandoor recipes receptkezelő és étkezés tervező a családnak">
-                <span class="launch-tile" style="background: hsl(16, 45%, 38%)">
-                    <span class="launch-mono">T</span>
-                    <img class="launch-logo" src="/assets/tandoor-logo.png" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>Tandoor Recipes</h3>
-                    <p class="stack-detail-desc">Receptkezelő és étkezés tervező a családnak</p>
-                </div>
-            </a>
-            <a class="stack-detail-card" href="#app-wanderer" data-name="wanderer túra tervező - útvonalak, gpx nyomok és domborzati térképek">
-                <span class="launch-tile" style="background: hsl(3, 45%, 38%)">
-                    <span class="launch-mono">W</span>
-                    <img class="launch-logo" src="/assets/wanderer-logo.svg" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>Wanderer</h3>
-                    <p class="stack-detail-desc">Túra tervező - útvonalak, GPX nyomok és domborzati térképek</p>
-                </div>
-            </a>
-            <a class="stack-detail-card" href="#app-wishlist" data-name="wishlist családi kívánságlista - karácsonyra, születésnapokra">
-                <span class="launch-tile" style="background: hsl(26, 45%, 38%)">
-                    <span class="launch-mono">W</span>
-                    <img class="launch-logo" src="/assets/wishlist-logo.svg" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>Wishlist</h3>
-                    <p class="stack-detail-desc">Családi kívánságlista - karácsonyra, születésnapokra</p>
-                </div>
-            </a>
-        </div>
-        <h3 class="bucket-head">Produktivitás &amp; Tudáskezelés <span class="bucket-count">15</span></h3>
-        <div class="stack-grid">
-            <a class="stack-detail-card" href="#app-bookstack" data-name="bookstack egyszerű wiki platform - polcok, könyvek, fejezetek és oldalak">
-                <span class="launch-tile" style="background: hsl(112, 45%, 38%)">
-                    <span class="launch-mono">B</span>
-                    <img class="launch-logo" src="/assets/bookstack-logo.svg" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>BookStack</h3>
-                    <p class="stack-detail-desc">Egyszerű wiki platform - polcok, könyvek, fejezetek és oldalak</p>
-                </div>
-            </a>
-            <a class="stack-detail-card" href="#app-claper" data-name="claper interaktív prezentáció - szavazás, kérdések és reakciók élőben">
-                <span class="launch-tile" style="background: hsl(280, 45%, 38%)">
-                    <span class="launch-mono">C</span>
-                    <img class="launch-logo" src="/assets/claper-logo.svg" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>Claper</h3>
-                    <p class="stack-detail-desc">Interaktív prezentáció - szavazás, kérdések és reakciók élőben</p>
-                </div>
-            </a>
-            <a class="stack-detail-card" href="#app-docmost" data-name="docmost modern wiki és dokumentáció platform notion-szerű szerkesztővel">
-                <span class="launch-tile" style="background: hsl(234, 45%, 38%)">
-                    <span class="launch-mono">D</span>
-                    <img class="launch-logo" src="/assets/docmost-logo.png" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>Docmost</h3>
-                    <p class="stack-detail-desc">Modern wiki és dokumentáció platform Notion-szerű szerkesztővel</p>
-                </div>
-            </a>
-            <a class="stack-detail-card" href="#app-ghost" data-name="ghost professzionális blog és hírlevél platform">
-                <span class="launch-tile" style="background: hsl(320, 45%, 38%)">
-                    <span class="launch-mono">G</span>
-                    <img class="launch-logo" src="/assets/ghost-logo.svg" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>Ghost</h3>
-                    <p class="stack-detail-desc">Professzionális blog és hírlevél platform</p>
-                </div>
-            </a>
-            <a class="stack-detail-card" href="#app-karakeep" data-name="karakeep könyvjelzők, cikkek és jegyzetek mentése - kereshető saját archívum">
-                <span class="launch-tile" style="background: hsl(305, 45%, 38%)">
-                    <span class="launch-mono">K</span>
-                    <img class="launch-logo" src="/assets/karakeep-logo.svg" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>Karakeep</h3>
-                    <p class="stack-detail-desc">Könyvjelzők, cikkek és jegyzetek mentése - kereshető saját archívum</p>
-                </div>
-            </a>
-            <a class="stack-detail-card" href="#app-kimai" data-name="kimai időkövetés - projektek, ügyfelek és munkaidő nyilvántartás">
-                <span class="launch-tile" style="background: hsl(346, 45%, 38%)">
-                    <span class="launch-mono">K</span>
-                    <img class="launch-logo" src="/assets/kimai-logo.png" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>Kimai</h3>
-                    <p class="stack-detail-desc">Időkövetés - projektek, ügyfelek és munkaidő nyilvántartás</p>
-                </div>
-            </a>
-            <a class="stack-detail-card" href="#app-mealie" data-name="mealie receptkezelő és étkezés tervező a családnak">
-                <span class="launch-tile" style="background: hsl(332, 45%, 38%)">
-                    <span class="launch-mono">M</span>
-                    <img class="launch-logo" src="/assets/mealie-logo.svg" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>Mealie</h3>
-                    <p class="stack-detail-desc">Receptkezelő és étkezés tervező a családnak</p>
-                </div>
-            </a>
-            <a class="stack-detail-card" href="#app-n8n" data-name="n8n vizuális workflow automatizálás - zapier/ifttt alternatíva">
-                <span class="launch-tile" style="background: hsl(15, 45%, 38%)">
-                    <span class="launch-mono">N</span>
-                    <img class="launch-logo" src="/assets/n8n-logo.svg" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>n8n</h3>
-                    <p class="stack-detail-desc">Vizuális workflow automatizálás - Zapier/IFTTT alternatíva</p>
-                </div>
-            </a>
-            <a class="stack-detail-card" href="#app-onlyoffice" data-name="onlyoffice teljes értékű irodai csomag - word, excel, powerpoint a böngészőben">
-                <span class="launch-tile" style="background: hsl(331, 45%, 38%)">
-                    <span class="launch-mono">O</span>
-                    <img class="launch-logo" src="/assets/onlyoffice-logo.svg" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>OnlyOffice</h3>
-                    <p class="stack-detail-desc">Teljes értékű irodai csomag - Word, Excel, PowerPoint a böngészőben</p>
-                </div>
-            </a>
-            <a class="stack-detail-card" href="#app-outline" data-name="outline modern tudásbázis - markdown, valós idejű együttműködés, keresés">
-                <span class="launch-tile" style="background: hsl(245, 45%, 38%)">
-                    <span class="launch-mono">O</span>
-                    <img class="launch-logo" src="/assets/outline-logo.svg" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>Outline</h3>
-                    <p class="stack-detail-desc">Modern tudásbázis - Markdown, valós idejű együttműködés, keresés</p>
-                </div>
-            </a>
-            <a class="stack-detail-card" href="#app-paperless-ngx" data-name="paperless-ngx digitális irattár - szkennelés, ocr és automatikus rendszerezés">
-                <span class="launch-tile" style="background: hsl(328, 45%, 38%)">
-                    <span class="launch-mono">P</span>
-                    <img class="launch-logo" src="/assets/paperless-ngx-logo.svg" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>Paperless-ngx</h3>
-                    <p class="stack-detail-desc">Digitális irattár - szkennelés, OCR és automatikus rendszerezés</p>
-                </div>
-            </a>
-            <a class="stack-detail-card" href="#app-papra" data-name="papra minimalista dokumentumtár - egyszerű rendszerezés és keresés">
-                <span class="launch-tile" style="background: hsl(231, 45%, 38%)">
-                    <span class="launch-mono">P</span>
-                    <img class="launch-logo" src="/assets/papra-logo.svg" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>Papra</h3>
-                    <p class="stack-detail-desc">Minimalista dokumentumtár - egyszerű rendszerezés és keresés</p>
-                </div>
-            </a>
-            <a class="stack-detail-card" href="#app-radicale" data-name="radicale naptár és névjegyek a saját szervereden - a telefonod szinkronizál vele">
-                <span class="launch-tile" style="background: hsl(120, 45%, 38%)">
-                    <span class="launch-mono">R</span>
-                    <img class="launch-logo" src="/assets/radicale-logo.svg" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>Radicale</h3>
-                    <p class="stack-detail-desc">Naptár és névjegyek a saját szervereden - a telefonod szinkronizál vele</p>
-                </div>
-            </a>
-            <a class="stack-detail-card" href="#app-rallly" data-name="rallly időpont szavazás - doodle alternatíva a saját szerveren">
-                <span class="launch-tile" style="background: hsl(331, 45%, 38%)">
-                    <span class="launch-mono">R</span>
-                    <img class="launch-logo" src="/assets/rallly-logo.svg" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>Rallly</h3>
-                    <p class="stack-detail-desc">Időpont szavazás - Doodle alternatíva a saját szerveren</p>
-                </div>
-            </a>
-            <a class="stack-detail-card" href="#app-vikunja" data-name="vikunja feladatkezelő - listák, kanban táblák és gantt diagramok">
-                <span class="launch-tile" style="background: hsl(79, 45%, 38%)">
-                    <span class="launch-mono">V</span>
-                    <img class="launch-logo" src="/assets/vikunja-logo.svg" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>Vikunja</h3>
-                    <p class="stack-detail-desc">Feladatkezelő - listák, Kanban táblák és Gantt diagramok</p>
-                </div>
-            </a>
-        </div>
-        <h3 class="bucket-head">Rendszer &amp; Fejlesztés <span class="bucket-count">13</span></h3>
-        <div class="stack-grid">
-            <a class="stack-detail-card" href="#app-bentopdf" data-name="bentopdf adatvédelmi fókuszú pdf eszköztár - a fájlok soha nem hagyják el a szervered">
-                <span class="launch-tile" style="background: hsl(287, 45%, 38%)">
-                    <span class="launch-mono">B</span>
-                    <img class="launch-logo" src="/assets/bentopdf-logo.svg" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>BentoPDF</h3>
-                    <p class="stack-detail-desc">Adatvédelmi fókuszú PDF eszköztár - a fájlok soha nem hagyják el a szervered</p>
-                </div>
-            </a>
-            <a class="stack-detail-card" href="#app-code-server" data-name="code-server vs code a böngészőben - teljes fejlesztői környezet bárhonnan">
-                <span class="launch-tile" style="background: hsl(280, 45%, 38%)">
-                    <span class="launch-mono">C</span>
-                    <img class="launch-logo" src="/assets/code-server-logo.svg" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>Code-Server</h3>
-                    <p class="stack-detail-desc">VS Code a böngészőben - teljes fejlesztői környezet bárhonnan</p>
-                </div>
-            </a>
-            <a class="stack-detail-card" href="#app-gitea" data-name="gitea saját git szerver - github-szerű felület, privát repók">
-                <span class="launch-tile" style="background: hsl(129, 45%, 38%)">
-                    <span class="launch-mono">G</span>
-                    <img class="launch-logo" src="/assets/gitea-logo.svg" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>Gitea</h3>
-                    <p class="stack-detail-desc">Saját Git szerver - GitHub-szerű felület, privát repók</p>
-                </div>
-            </a>
-            <a class="stack-detail-card" href="#app-glance" data-name="glance minimalista dashboard - rss, időjárás, könyvjelzők egy oldalon">
-                <span class="launch-tile" style="background: hsl(121, 45%, 38%)">
-                    <span class="launch-mono">G</span>
-                    <img class="launch-logo" src="/assets/glance-logo.svg" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>Glance</h3>
-                    <p class="stack-detail-desc">Minimalista dashboard - RSS, időjárás, könyvjelzők egy oldalon</p>
-                </div>
-            </a>
-            <a class="stack-detail-card" href="#app-grafana" data-name="grafana vizualizációs platform - dashboardok, grafikonok, alertek">
-                <span class="launch-tile" style="background: hsl(211, 45%, 38%)">
-                    <span class="launch-mono">G</span>
-                    <img class="launch-logo" src="/assets/grafana-logo.svg" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>Grafana</h3>
-                    <p class="stack-detail-desc">Vizualizációs platform - dashboardok, grafikonok, alertek</p>
-                </div>
-            </a>
-            <a class="stack-detail-card" href="#app-homebox" data-name="homebox otthoni leltár kezelő - tartsd számon a tárgyaidat">
-                <span class="launch-tile" style="background: hsl(243, 45%, 38%)">
-                    <span class="launch-mono">H</span>
-                    <img class="launch-logo" src="/assets/homebox-logo.svg" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>Homebox</h3>
-                    <p class="stack-detail-desc">Otthoni leltár kezelő - tartsd számon a tárgyaidat</p>
-                </div>
-            </a>
-            <a class="stack-detail-card" href="#app-homepage" data-name="homepage személyes kezdőlap - szolgáltatás státuszok és widgetek egy helyen">
-                <span class="launch-tile" style="background: hsl(141, 45%, 38%)">
-                    <span class="launch-mono">H</span>
-                    <img class="launch-logo" src="/assets/homepage-logo.svg" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>Homepage</h3>
-                    <p class="stack-detail-desc">Személyes kezdőlap - szolgáltatás státuszok és widgetek egy helyen</p>
-                </div>
-            </a>
-            <a class="stack-detail-card" href="#app-opengist" data-name="opengist kód snippetek megosztása - privát github gist alternatíva">
-                <span class="launch-tile" style="background: hsl(142, 45%, 38%)">
-                    <span class="launch-mono">O</span>
-                    <img class="launch-logo" src="/assets/opengist-logo.png" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>OpenGist</h3>
-                    <p class="stack-detail-desc">Kód snippetek megosztása - privát GitHub Gist alternatíva</p>
-                </div>
-            </a>
-            <a class="stack-detail-card" href="#app-privatebin" data-name="privatebin titkosított szöveg megosztás - a szerver nem látja a tartalmat">
-                <span class="launch-tile" style="background: hsl(125, 45%, 38%)">
-                    <span class="launch-mono">P</span>
-                    <img class="launch-logo" src="/assets/privatebin-logo.png" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>PrivateBin</h3>
-                    <p class="stack-detail-desc">Titkosított szöveg megosztás - a szerver nem látja a tartalmat</p>
-                </div>
-            </a>
-            <a class="stack-detail-card" href="#app-recipe-importer" data-name="recipe importer magyar receptoldalak importálása egyszerűen — egyedi és tömeges import mealie-be és tandoor-ba">
-                <span class="launch-tile" style="background: hsl(32, 45%, 38%)">
-                    <span class="launch-mono">R</span>
-                    <img class="launch-logo" src="/assets/recipe-importer-logo.svg" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>Recipe Importer</h3>
-                    <p class="stack-detail-desc">Magyar receptoldalak importálása egyszerűen — egyedi és tömeges import Mealie-be és Tandoor-ba</p>
-                </div>
-            </a>
-            <a class="stack-detail-card" href="#app-termix" data-name="termix webes ssh terminál - szerver hozzáférés a böngészőből">
-                <span class="launch-tile" style="background: hsl(342, 45%, 38%)">
-                    <span class="launch-mono">T</span>
-                    <img class="launch-logo" src="/assets/termix-logo.svg" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>Termix</h3>
-                    <p class="stack-detail-desc">Webes SSH terminál - szerver hozzáférés a böngészőből</p>
-                </div>
-            </a>
-            <a class="stack-detail-card" href="#app-uptime-kuma" data-name="uptime kuma szolgáltatás monitoring - értesítés ha valami nem működik">
-                <span class="launch-tile" style="background: hsl(186, 45%, 38%)">
-                    <span class="launch-mono">U</span>
-                    <img class="launch-logo" src="/assets/uptime-kuma-logo.svg" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>Uptime Kuma</h3>
-                    <p class="stack-detail-desc">Szolgáltatás monitoring - értesítés ha valami nem működik</p>
-                </div>
-            </a>
-            <a class="stack-detail-card" href="#app-vaultwarden" data-name="vaultwarden jelszókezelő - bitwarden kompatibilis, a saját szerveren">
-                <span class="launch-tile" style="background: hsl(66, 45%, 38%)">
-                    <span class="launch-mono">V</span>
-                    <img class="launch-logo" src="/assets/vaultwarden-logo.svg" alt="" loading="lazy">
-                </span>
-                <div class="stack-title-text">
-                    <h3>Vaultwarden</h3>
-                    <p class="stack-detail-desc">Jelszókezelő - Bitwarden kompatibilis, a saját szerveren</p>
-                </div>
-            </a>
-        </div>
-
-    <div class="app-panel" id="app-actualbudget" role="dialog" aria-label="ActualBudget">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/actualbudget-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>ActualBudget</h3>
-                    <p class="app-info-tagline">Költségvetés tervező - pénzügyeid kézben tartása egyszerűen</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/actualbudget-screenshot-1.webp" alt="ActualBudget képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Havi költségvetés tervezése és követése envelope módszerrel</li><li>Bankszámla tranzakciók importálása és kategorizálása</li><li>Riportok és grafikonok a kiadásokról és bevételekről</li><li>Több felhasználó - közös háztartási pénzügyek kezelése</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a budget.otthonod.hu címet a böngészőben</li><li>Hozz létre egy jelszót az első megnyitáskor</li><li>Hozd létre a költségvetési kategóriákat (pl. élelmiszer, közlekedés)</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>budget.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-adventurelog" role="dialog" aria-label="AdventureLog">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/adventurelog-logo.png" alt="">
-                <div class="app-info-hero-text">
-                    <h3>AdventureLog</h3>
-                    <p class="app-info-tagline">Utazási napló - utazások dokumentálása térképpel és fotókkal</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/adventurelog-screenshot-1.webp" alt="AdventureLog képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Utazások dokumentálása képekkel és jegyzetekkel</li><li>Térképes megjelenítés a meglátogatott helyekről</li><li>Úti tervek készítése és szervezése</li><li>Statisztikák - meglátogatott országok, városok</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a travel.otthonod.hu címet a böngészőben</li><li>Hozd létre a fiókodat</li><li>Add hozzá az első utazásodat</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>travel.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-audiobookshelf" role="dialog" aria-label="Audiobookshelf">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/audiobookshelf-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Audiobookshelf</h3>
-                    <p class="app-info-tagline">Hangoskönyv és podcast kezelő, lejátszó és szinkronizáló</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/audiobookshelf-screenshot-1.webp" alt="Audiobookshelf képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Hangoskönyvek és podcastok rendszerezése és lejátszása</li><li>Automatikus metaadat letöltés - borítók, leírások, fejezetek</li><li>Folytatás ott, ahol abbahagytad (szinkron eszközök között)</li><li>Podcast feliratkozás és automatikus letöltés</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg az audiobooks.otthonod.hu címet a böngészőben</li><li>Hozd létre az admin fiókot az első megnyitáskor</li><li>Add hozzá a könyvtárakat (/audiobooks és/vagy /podcasts)</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>audiobooks.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-bentopdf" role="dialog" aria-label="BentoPDF">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/bentopdf-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>BentoPDF</h3>
-                    <p class="app-info-tagline">Adatvédelmi fókuszú PDF eszköztár - a fájlok soha nem hagyják el a szervered</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/bentopdf-screenshot-1.webp" alt="BentoPDF képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>PDF összefűzés, szétválasztás és forgatás</li><li>PDF konvertálás képekké és képekből</li><li>Jelszóvédelem és titkosítás</li><li>Vízjel hozzáadása dokumentumokhoz</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a pdf.otthonod.hu címet a böngészőben</li><li>Válaszd ki a kívánt műveletet</li><li>Töltsd fel a PDF fájlt és kattints a feldolgozásra</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>pdf.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-bookstack" role="dialog" aria-label="BookStack">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/bookstack-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>BookStack</h3>
-                    <p class="app-info-tagline">Egyszerű wiki platform - polcok, könyvek, fejezetek és oldalak</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/bookstack-screenshot-1.webp" alt="BookStack képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Családi tudásbázis - receptek, kézikönyvek, szabályok</li><li>Projekt dokumentáció strukturált formában</li><li>Könyv &gt; Fejezet &gt; Oldal hierarchia az áttekinthetőségért</li><li>Teljes szöveges keresés és címkék</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a wiki.otthonod.hu címet a böngészőben</li><li>Jelentkezz be: admin@admin.com és a Beállítások oldalon látható első jelszó</li><li>Változtasd meg az admin email címét a sajátodra</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>wiki.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-calcom" role="dialog" aria-label="Cal.com">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/calcom-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Cal.com</h3>
-                    <p class="app-info-tagline">Időpontfoglaló - Calendly alternatíva saját szerveren</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/calcom-screenshot-1.webp" alt="Cal.com képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Időpontfoglalási oldal létrehozása ügyfeleknek</li><li>Naptár szinkronizáció (Google Calendar, Outlook)</li><li>Személyre szabható foglalási típusok és időtartamok</li><li>Automatikus emlékeztető emailek</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a cal.otthonod.hu címet a böngészőben</li><li>Hozd létre az admin fiókot</li><li>Állíts be egy foglalási típust (pl. 30 perces megbeszélés)</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>cal.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-calibre-web" role="dialog" aria-label="Calibre-Web Automated">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/calibre-web-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Calibre-Web Automated</h3>
-                    <p class="app-info-tagline">Automatizált e-könyv könyvtár - könyvfeldolgozás, formátumkonverzió és OPDS feed</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/calibre-web-screenshot-1.webp" alt="Calibre-Web Automated képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Automatizált e-könyv feldolgozás - csak dobd be az ingest mappába</li><li>Automatikus formátumkonverzió (EPUB, MOBI, PDF, AZW3)</li><li>OPDS feed e-olvasókhoz (Kindle, KOReader, Moon+ Reader)</li><li>Webes olvasó böngészőben</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a books.otthonod.hu címet a böngészőben</li><li>Jelentkezz be a Beállítások oldalon látható felhasználónévvel és első jelszóval</li><li>Dobj egy könyvet a Fájlkezelőben (FileBrowser) az import/calibre mappába — automatikusan feldolgozza és a media/books könyvtárba helyezi</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>books.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-claper" role="dialog" aria-label="Claper">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/claper-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Claper</h3>
-                    <p class="app-info-tagline">Interaktív prezentáció - szavazás, kérdések és reakciók élőben</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/claper-screenshot-1.webp" alt="Claper képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Interaktív prezentációk élő szavazásokkal</li><li>Közönség kérdéseinek gyűjtése és megjelenítése</li><li>Reakciók és visszajelzések valós időben</li><li>PDF prezentációk feltöltése és megosztása</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a present.otthonod.hu címet a böngészőben</li><li>Lépj be az admin@claper.co fiókkal és a Beállítások oldalon látható első jelszóval</li><li>Tölts fel egy PDF prezentációt</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>present.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-code-server" role="dialog" aria-label="Code-Server">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/code-server-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Code-Server</h3>
-                    <p class="app-info-tagline">VS Code a böngészőben - teljes fejlesztői környezet bárhonnan</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/code-server-screenshot-1.webp" alt="Code-Server képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Kódolás bárhonnan, bármilyen eszközről böngészőben</li><li>VS Code teljes funkcionalitás - bővítmények, terminál, debug</li><li>Távoli fejlesztés alacsony sávszélességű kapcsolaton is</li><li>Egységes fejlesztői környezet több eszközről</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a code.otthonod.hu címet a böngészőben</li><li>Add meg a hozzáférési jelszót</li><li>Nyisd meg a terminált (Ctrl+`) és telepíts eszközöket</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>code.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-crafty-controller" role="dialog" aria-label="Crafty Controller">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/crafty-controller-logo.png" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Crafty Controller</h3>
-                    <p class="app-info-tagline">Minecraft szerver kezelő - hozd létre a saját világodat</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/crafty-controller-screenshot-1.webp" alt="Crafty Controller képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Minecraft szerver létrehozása és kezelése webes felületen</li><li>Több szerver párhuzamos futtatása (Java és Bedrock)</li><li>Automatikus mentések és ütemezett újraindítás</li><li>Játékos menedzsment és konzol hozzáférés</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a minecraft.otthonod.hu címet a böngészőben</li><li>A kezdeti belépési adatokat ezen az oldalon (Kezdeti belépési adatok) találod</li><li>Hozz létre egy új Minecraft szervert a varázslóval</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>minecraft.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-dawarich" role="dialog" aria-label="Dawarich">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/dawarich-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Dawarich</h3>
-                    <p class="app-info-tagline">Saját helyelőzmények - a telefonod a te szerveredre küldi, hol jártál</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/dawarich-screenshot-1.webp" alt="Dawarich képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>A Google Idővonal helyett: a helyelőzményeid a saját szervereden</li><li>Térkép, statisztika és utazások az összes helyről, ahol jártál</li><li>Google Takeout, GPX és GeoJSON import a régi adataidhoz</li><li>A Dawarich, az Overland vagy az OwnTracks alkalmazás küldi a telefonod helyét</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a timeline.otthonod.hu címet, és jelentkezz be: demo@dawarich.app és a Beállítások oldalon látható jelszó</li><li>A fiókod beállításaiban cseréld le az e-mail-címet a sajátodra - a demo@dawarich.app név nyilvános</li><li>A beállításokban másold ki az API-kulcsodat</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>timeline.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-docmost" role="dialog" aria-label="Docmost">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/docmost-logo.png" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Docmost</h3>
-                    <p class="app-info-tagline">Modern wiki és dokumentáció platform Notion-szerű szerkesztővel</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/docmost-screenshot-1.webp" alt="Docmost képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Csapat tudásbázis és belső dokumentáció</li><li>Notion-szerű blokk szerkesztő valós idejű együttműködéssel</li><li>Terek és oldalak hierarchikus szervezése</li><li>Képek, táblázatok és kód blokkok beágyazása</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a docs.otthonod.hu címet a böngészőben</li><li>Az első regisztrált felhasználó automatikusan admin lesz</li><li>Hozd létre az első teret (Space) a dokumentumoknak</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>docs.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-emby" role="dialog" aria-label="Emby">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/emby-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Emby</h3>
-                    <p class="app-info-tagline">Személyes média szerver élő TV és DVR támogatással</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/emby-screenshot-1.webp" alt="Emby képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Filmek, sorozatok, zene és fotók kezelése egy helyen</li><li>Élő TV nézés és felvétel (DVR) TV tunerrel</li><li>Automatikus transzkódolás bármilyen eszközhöz</li><li>Szülői felügyelet és felhasználói profilok</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg az emby.otthonod.hu címet a böngészőben</li><li>Kövesd a beállítás varázslót</li><li>Hozd létre az admin fiókot</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>emby.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-ghost" role="dialog" aria-label="Ghost">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/ghost-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Ghost</h3>
-                    <p class="app-info-tagline">Professzionális blog és hírlevél platform</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/ghost-screenshot-1.webp" alt="Ghost képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Professzionális blog indítása és üzemeltetése</li><li>Hírlevél küldés beépített email funkcióval</li><li>SEO-optimalizált tartalom publikálás</li><li>Tagság és fizetős tartalom kezelés</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a blog.otthonod.hu/ghost/ címet a böngészőben</li><li>Hozd létre az admin fiókot a beállítás varázslóban</li><li>Írd meg és publikáld az első posztodat</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>blog.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-gitea" role="dialog" aria-label="Gitea">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/gitea-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Gitea</h3>
-                    <p class="app-info-tagline">Saját Git szerver - GitHub-szerű felület, privát repók</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/gitea-screenshot-1.webp" alt="Gitea képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Privát Git repozitóriók a saját szerveren</li><li>GitHub-szerű felület: pull request, issue, wiki</li><li>CI/CD pipeline-ok (Gitea Actions - GitHub Actions kompatibilis)</li><li>Szervezetek és csapatok kezelése</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a git.otthonod.hu címet a böngészőben</li><li>Kövesd az első beállítás varázslót</li><li>Hozd létre az admin fiókot</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>git.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-glance" role="dialog" aria-label="Glance">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/glance-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Glance</h3>
-                    <p class="app-info-tagline">Minimalista dashboard - RSS, időjárás, könyvjelzők egy oldalon</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/glance-screenshot-1.webp" alt="Glance képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>RSS hírek, YouTube, Reddit és egyéb tartalmak egy oldalon</li><li>Időjárás és rendszer monitorozás widgetekkel</li><li>Könyvjelzők és kedvenc oldalak rendszerezése</li><li>Ultragyors, minimális erőforrás igény</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a dashboard.otthonod.hu címet a böngészőben</li><li>Szerkeszd a glance.yml konfigurációs fájlt a kötetben</li><li>Add hozzá az RSS feedeket, widgeteket</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>dashboard.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-gokapi" role="dialog" aria-label="Gokapi">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/gokapi-logo.png" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Gokapi</h3>
-                    <p class="app-info-tagline">Ideiglenes fájlmegosztás lejáró linkekkel</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/gokapi-screenshot-1.webp" alt="Gokapi képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Fájlok biztonságos megosztása lejáró linkekkel</li><li>Beállítható lejárati idő és letöltési limit</li><li>Jelszóvédett letöltési linkek</li><li>API támogatás automatizált feltöltéshez</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a share.otthonod.hu címet a böngészőben</li><li>Lépj be: felhasználó &quot;admin&quot;, a jelszó a Beállítások oldalon található</li><li>Tölts fel egy fájlt és generálj megosztási linket</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>share.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-grafana" role="dialog" aria-label="Grafana">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/grafana-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Grafana</h3>
-                    <p class="app-info-tagline">Vizualizációs platform - dashboardok, grafikonok, alertek</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/grafana-screenshot-1.webp" alt="Grafana képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Rendszer metrikák vizualizálása (CPU, RAM, hálózat, lemez)</li><li>Egyedi dashboardok létrehozása különböző adatforrásokból</li><li>Alertek és értesítések küszöbértékek alapján</li><li>Prometheus, InfluxDB és sok más adatforrás támogatás</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a grafana.otthonod.hu címet a böngészőben</li><li>Jelentkezz be az admin fiókkal</li><li>Add hozzá az adatforrásokat (Connections &gt; Data Sources)</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>grafana.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-gramps-web" role="dialog" aria-label="Gramps Web">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/gramps-web-logo.png" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Gramps Web</h3>
-                    <p class="app-info-tagline">Családfa készítő - genealógiai adatbázis webes felületen</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/gramps-web-screenshot-1.webp" alt="Gramps Web képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Családfa építése és vizualizálása</li><li>Személyek, események, helyszínek és kapcsolatok rögzítése</li><li>Fényképek és dokumentumok csatolása a családtagokhoz</li><li>GEDCOM import és export kompatibilitás</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a family.otthonod.hu címet a böngészőben</li><li>Hozd létre az admin fiókot</li><li>Importálj egy meglévő GEDCOM fájlt, vagy kezdd az üres családfát</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>family.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-grimmory" role="dialog" aria-label="Grimmory">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/grimmory-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Grimmory</h3>
-                    <p class="app-info-tagline">E-könyvtár - olvasd böngészőben, Kobón, KOReaderrel vagy bármely OPDS-olvasóval</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/grimmory-screenshot-1.webp" alt="Grimmory képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>E-könyvek és képregények rendezett könyvtárban, borítóval és adatokkal</li><li>Olvasás a böngészőben, haladás mentése; Kobo- és KOReader-szinkron</li><li>OPDS-katalógus az e-könyv-olvasó alkalmazásoknak (a Beállításokban kapcsold be)</li><li>A Calibre-Web helyett vagy mellett: ez modernebb felület, a Calibre-Web a Calibre-könyvtárakhoz jó</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a library.otthonod.hu címet, és hozd létre az admin fiókodat</li><li>A családtagjaidat a vezérlőpult Beállítások, Biztonság oldalán, a Család kártyán add hozzá - idegen el sem éri a Grimmoryt</li><li>Hozz létre egy könyvtárat a /books mappával - ez a meghajtódon a userdata/media/grimmory mappa</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>library.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-grocy" role="dialog" aria-label="Grocy">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/grocy-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Grocy</h3>
-                    <p class="app-info-tagline">Háztartásvezetés: mi van otthon, mi fogy el, mit kell megvenni, kinek mi a dolga</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/grocy-screenshot-1.webp" alt="Grocy képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Nyilvántartja, mi van otthon, és szól, ha valami elfogyott vagy lejár</li><li>Bevásárlólista, ami magától felveszi azt, ami a minimum alá csökkent</li><li>Vonalkóddal gyorsan beírod, mit vettél, és mit használtál el - a telefon kamerájával is</li><li>Recept és heti étrend, ami levonja a hozzávalókat a készletből</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a kamra.otthonod.hu címet a böngészőben</li><li>Jelentkezz be az admin névvel és a Beállítások oldalon látható jelszóval</li><li>Vedd fel az első pár terméket (Termékek, majd Új termék), és állíts be nekik minimum mennyiséget</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>kamra.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-home-assistant" role="dialog" aria-label="Home Assistant">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/home-assistant-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Home Assistant</h3>
-                    <p class="app-info-tagline">Okos otthon központ - automatizálás és vezérlés egy helyről</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/home-assistant-screenshot-1.webp" alt="Home Assistant képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Okos otthon eszközök központi kezelése (lámpa, termosztát, kamera)</li><li>Automatizálások létrehozása (pl. mozgásérzékelőre lámpa be)</li><li>2000+ integráció (Zigbee, Z-Wave, Tuya, Shelly, stb.)</li><li>Dashboard a család számára mobilon és tableten</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a ha.otthonod.hu címet a böngészőben</li><li>Hozd létre a tulajdonos fiókot az onboarding során</li><li>Fedezd fel az automatikusan felfedezett eszközöket</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>ha.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-homebox" role="dialog" aria-label="Homebox">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/homebox-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Homebox</h3>
-                    <p class="app-info-tagline">Otthoni leltár kezelő - tartsd számon a tárgyaidat</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/homebox-screenshot-1.webp" alt="Homebox képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Otthoni tárgyak leltározása és nyilvántartása</li><li>Helyszínek, címkék és kategóriák szerinti rendszerezés</li><li>Garancia lejáratok és beszerzési árak nyilvántartása</li><li>Vonalkód szkennelés a gyors hozzáadáshoz</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg az inventory.otthonod.hu címet a böngészőben</li><li>Hozd létre a fiókodat az első megnyitáskor</li><li>Add hozzá a helyszíneket (pl. nappali, konyha, garázs)</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>inventory.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-homepage" role="dialog" aria-label="Homepage">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/homepage-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Homepage</h3>
-                    <p class="app-info-tagline">Személyes kezdőlap - szolgáltatás státuszok és widgetek egy helyen</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/homepage-screenshot-1.webp" alt="Homepage képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Összes szolgáltatás egy áttekinthető oldalon</li><li>Szolgáltatás állapot monitoring widgetek</li><li>Docker integráció - automatikus szolgáltatás felfedezés</li><li>Könyvjelzők és kedvenc oldalak</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a home.otthonod.hu címet a böngészőben</li><li>Szerkeszd a konfigurációs fájlokat a homepage_config kötetben</li><li>Add hozzá a szolgáltatásokat a services.yaml-ban</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>home.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-immich" role="dialog" aria-label="Immich">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/immich-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Immich</h3>
-                    <p class="app-info-tagline">Google Photos alternatíva - automatikus fotó mentés és rendszerezés</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/immich-screenshot-1.webp" alt="Immich képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Fotók és videók automatikus mentése telefonról</li><li>Arc- és tárgyfelismerés gépi tanulással</li><li>Térképes megjelenítés helyszín alapján</li><li>Emlékek és visszatekintések automatikus generálása</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a photos.otthonod.hu címet a böngészőben</li><li>Hozd létre az admin fiókot</li><li>Telepítsd az Immich alkalmazást a telefonodra (Android/iOS)</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>photos.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-jellyfin" role="dialog" aria-label="Jellyfin">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/jellyfin-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Jellyfin</h3>
-                    <p class="app-info-tagline">Ingyenes média szerver - filmek, sorozatok és zene streamelése</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/jellyfin-screenshot-1.webp" alt="Jellyfin képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Filmek, sorozatok és zenék streamelése bármilyen eszközre</li><li>Automatikus metaadat letöltés - borítók, leírások, értékelések</li><li>Élő TV és DVR funkció TV tunerrel</li><li>Több felhasználó külön profillal és szülői felügyelettel</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a media.otthonod.hu címet a böngészőben</li><li>Kövesd a beállítás varázslót - válaszd a magyar nyelvet</li><li>Hozd létre az admin fiókot</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>media.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-karakeep" role="dialog" aria-label="Karakeep">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/karakeep-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Karakeep</h3>
-                    <p class="app-info-tagline">Könyvjelzők, cikkek és jegyzetek mentése - kereshető saját archívum</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/karakeep-screenshot-1.webp" alt="Karakeep képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Weboldalak mentése: a Karakeep letölti és elteszi a tartalmukat, akkor is, ha az oldal később eltűnik</li><li>Jegyzetek, képek és PDF-ek egy helyen, teljes szöveges kereséssel</li><li>Böngészőbővítmény és telefonos alkalmazás a gyors mentéshez</li><li>AI-címkézés csak akkor, ha te megadsz hozzá egy OpenAI-kulcsot - alapból ki van kapcsolva</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a bookmarks.otthonod.hu címet, és hozd létre a fiókodat (az első fiók lesz az admin)</li><li>Kattints a „Kész, beállítottam&quot; gombra az alkalmazás oldalán - ezután más már nem regisztrálhat</li><li>Telepítsd a böngészőbővítményt vagy a telefonos alkalmazást, és add meg: https://bookmarks.otthonod.hu és egy API-kulcsot (Beállítások, API-kulcsok)</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>bookmarks.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-kimai" role="dialog" aria-label="Kimai">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/kimai-logo.png" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Kimai</h3>
-                    <p class="app-info-tagline">Időkövetés - projektek, ügyfelek és munkaidő nyilvántartás</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/kimai-screenshot-1.webp" alt="Kimai képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Munkaidő nyilvántartás projektekre és ügyfelekre bontva</li><li>Stopper-szerű időmérés egy kattintással</li><li>Riportok és exportálás (PDF, CSV, Excel)</li><li>Költségek és számlázás nyilvántartás</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a time.otthonod.hu címet a böngészőben</li><li>Jelentkezz be a telepítéskor megadott admin adatokkal</li><li>Hozd létre az első ügyfelet és projektet</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>time.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-komga" role="dialog" aria-label="Komga">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/komga-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Komga</h3>
-                    <p class="app-info-tagline">Képregény, manga és könyv szerver webes olvasóval</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/komga-screenshot-1.webp" alt="Komga képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Képregények és mangák rendszerezése és olvasása böngészőben</li><li>Automatikus metaadat szkennelés és borítókép generálás</li><li>OPDS feed kompatibilis olvasó alkalmazásokhoz</li><li>Olvasási haladás szinkronizálás eszközök között</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a comics.otthonod.hu címet a böngészőben</li><li>Hozd létre az admin fiókot az első megnyitáskor</li><li>Add hozzá a könyvtárat (/data)</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>comics.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-lubelogger" role="dialog" aria-label="LubeLogger">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/lubelogger-logo.png" alt="">
-                <div class="app-info-hero-text">
-                    <h3>LubeLogger</h3>
-                    <p class="app-info-tagline">A családi autó teljes története egy helyen: szerviz, javítás, tankolás, költségek</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/lubelogger-screenshot-1.webp" alt="LubeLogger képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Minden szerviz, javítás és műszaki vizsga egy helyen, számlával együtt</li><li>Tankolások és a tényleges fogyasztás - látszik, mennyibe kerül az autó</li><li>Emlékeztetők: olajcsere, műszaki, biztosítás, gumicsere</li><li>Több autó és akár motor vagy kerti gép külön nyilvántartása</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a garazs.otthonod.hu címet, és jelentkezz be a Beállítások oldalon látható névvel és jelszóval</li><li>Vedd fel az első autót (Add Vehicle): évjárat, gyártó, modell, rendszám</li><li>Magyar nyelvhez: Settings, majd a nyelvek listájából töltsd le a hu_HU csomagot - az alkalmazás angolul indul</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>garazs.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-mealie" role="dialog" aria-label="Mealie">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/mealie-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Mealie</h3>
-                    <p class="app-info-tagline">Receptkezelő és étkezés tervező a családnak</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/mealie-screenshot-1.webp" alt="Mealie képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Receptek gyűjtése és rendszerezése kategóriák és címkék szerint</li><li>Receptek importálása weboldalakról automatikusan</li><li>Heti étkezés tervezés és bevásárlólista generálás</li><li>Receptek megosztása családtagokkal és barátokkal</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a mealie.otthonod.hu címet a böngészőben</li><li>Jelentkezz be: changeme@example.com és a Beállítások oldalon látható első jelszó</li><li>Változtasd meg az email címet a sajátodra</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>recipes.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-metube" role="dialog" aria-label="MeTube">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/metube-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>MeTube</h3>
-                    <p class="app-info-tagline">Videók és hanganyagok letöltése egy linkből - csak a családodnak</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/metube-screenshot-1.webp" alt="MeTube képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Egy videó vagy lejátszási lista letöltése a linkjéből, videóként vagy csak hangként</li><li>A letöltések a meghajtódra kerülnek, a fájlböngészőben és a médialejátszódban is látod őket</li><li>Csak a családtagjaid érik el: idegen nem tud letölteni a háztartásod internetcíméről</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Add hozzá a családtagjaidat a Beállítások, Biztonság oldal Család kártyáján</li><li>Nyisd meg a video.otthonod.hu címet, és lépj be a családi neveddel</li><li>Illessz be egy linket, válaszd ki a minőséget, és indítsd el a letöltést</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>video.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-n8n" role="dialog" aria-label="n8n">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/n8n-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>n8n</h3>
-                    <p class="app-info-tagline">Vizuális workflow automatizálás - Zapier/IFTTT alternatíva</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/n8n-screenshot-1.webp" alt="n8n képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Alkalmazások összekapcsolása vizuális workflow szerkesztővel</li><li>Automatizálás: email, Telegram, webhook, fájl feldolgozás</li><li>400+ integráció (Google, Slack, Notion, GitHub, stb.)</li><li>Időzített feladatok (cron) és webhook triggerek</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg az auto.otthonod.hu címet a böngészőben</li><li>Hozd létre az admin fiókot</li><li>Próbálj ki egy sablon workflow-t a Template galériából</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>auto.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-navidrome" role="dialog" aria-label="Navidrome">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/navidrome-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Navidrome</h3>
-                    <p class="app-info-tagline">Könnyű zene szerver - streameld a saját zenegyűjteményedet</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/navidrome-screenshot-1.webp" alt="Navidrome képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Saját zenegyűjtemény streamelése bármilyen eszközről</li><li>Subsonic API kompatibilis mobil alkalmazások használata</li><li>Lejátszási listák, kedvencek és értékelések kezelése</li><li>Automatikus metaadat és borítókép letöltés</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a music.otthonod.hu címet a böngészőben</li><li>Az első felhasználó automatikusan admin lesz</li><li>Hozd létre a fiókodat és várd meg az első szkennelést</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>music.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-nextcloud" role="dialog" aria-label="Nextcloud">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/nextcloud-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Nextcloud</h3>
-                    <p class="app-info-tagline">A saját Google Drive-od - fájlok, naptár, névjegyek egy helyen</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/nextcloud-screenshot-1.webp" alt="Nextcloud képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Fájlok szinkronizálása és megosztása eszközök között</li><li>Naptár és névjegyek szinkronizálás (CalDAV/CardDAV)</li><li>Dokumentumok közös szerkesztése (OnlyOffice integrációval)</li><li>Fotó és videó automatikus feltöltés telefonról</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a cloud.otthonod.hu címet a böngészőben</li><li>Jelentkezz be a telepítéskor megadott admin fiókkal</li><li>Telepítsd a Nextcloud asztali alkalmazást a számítógépedre</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>cloud.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-onlyoffice" role="dialog" aria-label="OnlyOffice">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/onlyoffice-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>OnlyOffice</h3>
-                    <p class="app-info-tagline">Teljes értékű irodai csomag - Word, Excel, PowerPoint a böngészőben</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/onlyoffice-screenshot-1.webp" alt="OnlyOffice képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Dokumentumok, táblázatok és prezentációk szerkesztése böngészőben</li><li>Valós idejű közös szerkesztés több felhasználóval</li><li>Microsoft Office formátumok teljes kompatibilitása (docx, xlsx, pptx)</li><li>Nextcloud és egyéb felhő tárhely integrációk</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg az office.otthonod.hu címet a böngészőben</li><li>Várj amíg az inicializálás befejeződik (1-2 perc)</li><li>A Document Server önmagában API-ként működik</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>office.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-opengist" role="dialog" aria-label="OpenGist">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/opengist-logo.png" alt="">
-                <div class="app-info-hero-text">
-                    <h3>OpenGist</h3>
-                    <p class="app-info-tagline">Kód snippetek megosztása - privát GitHub Gist alternatíva</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/opengist-screenshot-1.webp" alt="OpenGist képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Kód snippetek és szövegek megosztása</li><li>Szintaxis kiemelés sok programozási nyelvhez</li><li>Privát és nyilvános gistek</li><li>Git-alapú tárolás - verziókezelés automatikusan</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a gist.otthonod.hu címet a böngészőben</li><li>Hozd létre a fiókodat (az első felhasználó admin lesz)</li><li>Hozd létre az első gistet - írd be a kódot és mentsd</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>gist.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-outline" role="dialog" aria-label="Outline">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/outline-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Outline</h3>
-                    <p class="app-info-tagline">Modern tudásbázis - Markdown, valós idejű együttműködés, keresés</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/outline-screenshot-1.webp" alt="Outline képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Csapat tudásbázis és dokumentáció</li><li>Markdown szerkesztő valós idejű együttműködéssel</li><li>Strukturált dokumentumok fa-szerkezetben</li><li>Teljes szöveges keresés és hivatkozások</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a kb.otthonod.hu címet a böngészőben</li><li>Hozd létre az első felhasználót</li><li>Hozz létre egy gyűjteményt (Collection) a dokumentumoknak</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>kb.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-paperless-ngx" role="dialog" aria-label="Paperless-ngx">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/paperless-ngx-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Paperless-ngx</h3>
-                    <p class="app-info-tagline">Digitális irattár - szkennelés, OCR és automatikus rendszerezés</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/paperless-ngx-screenshot-1.webp" alt="Paperless-ngx képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Papír dokumentumok digitalizálása és rendszerezése</li><li>Automatikus OCR szövegfelismerés szkennelt dokumentumokon</li><li>Intelligens automatikus kategorizálás és címkézés</li><li>Teljes szöveges keresés az összes dokumentumban</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a paperless.otthonod.hu címet a böngészőben</li><li>Lépj be: felhasználó &quot;admin&quot;, a jelszó a Beállítások oldalon található (Automatikusan generált értékek)</li><li>Tölts fel egy dokumentumot a webfelületen, VAGY dobd a Fájlkezelőben (FileBrowser) az import/paperless mappába — onnan automatikusan beolvassa és OCR-rel feldolgozza. A Fájlkezelő belépése a Fájlkezelő alkalmazás oldalán található</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>paperless.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-papra" role="dialog" aria-label="Papra">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/papra-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Papra</h3>
-                    <p class="app-info-tagline">Minimalista dokumentumtár - egyszerű rendszerezés és keresés</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/papra-screenshot-1.webp" alt="Papra képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Dokumentumok egyszerű feltöltése és rendszerezése</li><li>Gyors keresés a dokumentumok között</li><li>Minimalista felület felesleges funkciók nélkül</li><li>Könnyű alternatíva a Paperless-ngx-hez</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a papra.otthonod.hu címet a böngészőben</li><li>Hozd létre a fiókodat</li><li>Töltsd fel az első dokumentumot</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>papra.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-plex" role="dialog" aria-label="Plex">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/plex-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Plex</h3>
-                    <p class="app-info-tagline">Prémium média szerver kiváló alkalmazás támogatással</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/plex-screenshot-1.webp" alt="Plex képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Filmek, sorozatok és zene streamelése professzionális felületen</li><li>Automatikus transzkódolás bármilyen eszközhöz</li><li>Watch Together - közös filmnézés távolról</li><li>Intro/outro skip funkció (Plex Pass)</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Generálj egy claim tokent a https://plex.tv/claim oldalon</li><li>Telepítés után nyisd meg a plex.otthonod.hu címet</li><li>Kapcsold össze a Plex fiókoddat a szerverrel</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>plex.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-privatebin" role="dialog" aria-label="PrivateBin">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/privatebin-logo.png" alt="">
-                <div class="app-info-hero-text">
-                    <h3>PrivateBin</h3>
-                    <p class="app-info-tagline">Titkosított szöveg megosztás - a szerver nem látja a tartalmat</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/privatebin-screenshot-1.webp" alt="PrivateBin képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Érzékeny szövegek biztonságos megosztása</li><li>E2E titkosítás - a szerver nem fér hozzá a tartalomhoz</li><li>Beállítható lejárati idő (5 perc - 1 év, vagy soha)</li><li>Olvasás után automatikus törlés opció</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a paste.otthonod.hu címet a böngészőben</li><li>Írd be a szöveget és kattints a Küldés gombra</li><li>Oszd meg a generált linket - a titkosítási kulcs az URL-ben van</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>paste.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-radarr" role="dialog" aria-label="Radarr">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/radarr-logo.png" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Radarr</h3>
-                    <p class="app-info-tagline">Automatikus film letöltő és rendszerező</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/radarr-screenshot-1.webp" alt="Radarr képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Filmek automatikus letöltése és rendszerezése</li><li>Kívánságlista - filmek automatikusan a könyvtáradba kerülnek</li><li>Minőség kezelés és automatikus frissítés jobb minőségre</li><li>Integráció Jellyfin/Plex és letöltő kliensekkel</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a radarr.otthonod.hu címet a böngészőben</li><li>Állíts be egy letöltő klienst (pl. qBittorrent)</li><li>Add hozzá az indexereket (vagy használj Prowlarr-t)</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>radarr.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-radicale" role="dialog" aria-label="Radicale">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/radicale-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Radicale</h3>
-                    <p class="app-info-tagline">Naptár és névjegyek a saját szervereden - a telefonod szinkronizál vele</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/radicale-screenshot-1.webp" alt="Radicale képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>A telefonod naptára és névjegyei a saját szervereden, nem a Google-nél vagy az Apple-nél</li><li>Közös családi naptár, amit mindenki lát a telefonján</li><li>Androidon a DAVx5, iPhone-on és Macen a beépített naptár szinkronizál vele</li><li>Thunderbird és más asztali naptárak is használhatják</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a calendar.otthonod.hu címet, és jelentkezz be a Beállítások oldalon látható névvel és jelszóval</li><li>Hozz létre egy naptárat és egy címjegyzéket (&quot;Create new addressbook or calendar&quot;)</li><li>Androidon telepítsd a DAVx5-öt, és add meg: https://calendar.otthonod.hu, a nevet és a jelszót</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>calendar.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-rallly" role="dialog" aria-label="Rallly">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/rallly-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Rallly</h3>
-                    <p class="app-info-tagline">Időpont szavazás - Doodle alternatíva a saját szerveren</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/rallly-screenshot-1.webp" alt="Rallly képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Közös időpont egyeztetés szavazással</li><li>Találkozók, események szervezése</li><li>Résztvevők regisztráció nélkül szavazhatnak</li><li>Email értesítések és emlékeztetők</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a poll.otthonod.hu címet a böngészőben</li><li>Hozz létre egy új szavazást</li><li>Add meg a lehetséges időpontokat</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>poll.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-recipe-importer" role="dialog" aria-label="Recipe Importer">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/recipe-importer-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Recipe Importer</h3>
-                    <p class="app-info-tagline">Magyar receptoldalak importálása egyszerűen — egyedi és tömeges import Mealie-be és Tandoor-ba</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/recipe-importer-screenshot-1.webp" alt="Recipe Importer képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Receptek importálása 6 magyar oldalról: mindmegette.hu, streetkitchen.hu, nosalty.hu, sobors.hu, kiskegyed.hu és gastrohobbi.hu — hozzávalók, lépések, képek és címkék automatikus felismerése</li><li>Tömeges importálás: több URL beillesztése egyszerre, recept-áttekintéssel vagy teljesen automatikus módban</li><li>Importálás előtti szerkesztés — strukturált hozzávalók (mennyiség, mértékegység, étel, megjegyzés), lépések módosítása, címkék kezelése</li><li>Mealie és Tandoor Recipes egyidejű támogatás — választhatsz célrendszert, vagy mindkettőbe importálhatsz egyszerre</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a rimport.otthonod.hu címet a böngészőben</li><li>Menj a Beállítások oldalra és add meg a Mealie és/vagy Tandoor URL-t és API kulcsot (Mealie: Profil → API Tokens; Tandoor: Beállítások → API Browser → Auth Token)</li><li>Állíts be felhasználónevet és jelszót a hozzáférés védelméhez</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>rimport.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-romm" role="dialog" aria-label="RomM">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/romm-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>RomM</h3>
-                    <p class="app-info-tagline">Retró játékgyűjtemény kezelő, böngésző és lejátszó</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/romm-screenshot-1.webp" alt="RomM képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Retró játékgyűjtemény rendszerezése és böngészése webes felületen</li><li>Játékok metaadatainak automatikus letöltése — borítók, leírások, értékelések</li><li>Platformonkénti szűrés és keresés a teljes gyűjteményben</li><li>ROM fájlok webes feltöltése és letöltése</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg az arcade.otthonod.hu címet a böngészőben</li><li>Az első megnyitáskor hozd létre az admin fiókodat</li><li>Változtasd meg azonnal a jelszót a Settings menüben</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>arcade.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-seerr" role="dialog" aria-label="Jellyseerr">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/seerr-logo.png" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Jellyseerr</h3>
-                    <p class="app-info-tagline">Film és sorozat igénylő a háztartás tagjai számára</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/seerr-screenshot-1.webp" alt="Jellyseerr képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Családtagok filmeket és sorozatokat igényelhetnek egyszerűen</li><li>Automatikus letöltés Sonarr/Radarr integrációval</li><li>Elérhető tartalmak böngészése szép felületen</li><li>Igénylések állapotának követése</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a requests.otthonod.hu címet a böngészőben</li><li>Kövesd a beállítás varázslót</li><li>Csatlakoztasd a Jellyfin vagy Plex szerveredet</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>requests.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-sonarr" role="dialog" aria-label="Sonarr">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/sonarr-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Sonarr</h3>
-                    <p class="app-info-tagline">Automatikus sorozat letöltő és rendszerező</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/sonarr-screenshot-1.webp" alt="Sonarr képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Sorozatok automatikus letöltése és rendszerezése</li><li>Kívánságlista kezelés - új epizódok automatikus letöltése</li><li>Minőség kezelés (480p-tól 4K-ig, automatikus frissítés)</li><li>Integráció Jellyfin/Plex és letöltő kliensekkel</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a sonarr.otthonod.hu címet a böngészőben</li><li>Állíts be egy letöltő klienst (pl. qBittorrent)</li><li>Add hozzá az indexereket (vagy használj Prowlarr-t)</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>sonarr.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-sparkyfitness" role="dialog" aria-label="SparkyFitness">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/sparkyfitness-logo.png" alt="">
-                <div class="app-info-hero-text">
-                    <h3>SparkyFitness</h3>
-                    <p class="app-info-tagline">Táplálkozási napló, kalóriaszámláló és edzéskövető – önállóan üzemeltetve</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/sparkyfitness-screenshot-1.webp" alt="SparkyFitness képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Napi étkezések és kalóriabevitel naplózása</li><li>Testsúly és testméretek követése grafikonokkal</li><li>Edzések és mozgás rögzítése</li><li>Tápanyag-célok (fehérje, szénhidrát, zsír) beállítása és követése</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a sparky.otthonod.hu címet a böngészőben</li><li>Regisztrálj egy fiókot e-mail címmel és jelszóval</li><li>Állítsd be a profilodat és a napi céljaidat</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>sparky.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-tandoor" role="dialog" aria-label="Tandoor Recipes">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/tandoor-logo.png" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Tandoor Recipes</h3>
-                    <p class="app-info-tagline">Receptkezelő és étkezés tervező a családnak</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/tandoor-screenshot-1.webp" alt="Tandoor Recipes képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Receptek gyűjtése és rendszerezése egy helyen</li><li>Receptek importálása weboldalakról egy kattintással</li><li>Heti étkezés tervezés és bevásárlólista generálás</li><li>Több felhasználó - a család együtt tervezhet</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a recipes.otthonod.hu címet a böngészőben</li><li>Hozd létre az admin fiókot</li><li>Importáld az első receptet egy weboldalról (Bookmarklet)</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>recipes.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-termix" role="dialog" aria-label="Termix">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/termix-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Termix</h3>
-                    <p class="app-info-tagline">Webes SSH terminál - szerver hozzáférés a böngészőből</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/termix-screenshot-1.webp" alt="Termix képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>SSH hozzáférés a szerveredhez böngészőből</li><li>Nincs szükség SSH kliensre a számítógépen</li><li>Alapvető szerver menedzsment feladatok bárhonnan</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a terminal.otthonod.hu címet a böngészőben</li><li>Csatlakozz a szerveredhez SSH-n keresztül</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>terminal.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-uptime-kuma" role="dialog" aria-label="Uptime Kuma">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/uptime-kuma-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Uptime Kuma</h3>
-                    <p class="app-info-tagline">Szolgáltatás monitoring - értesítés ha valami nem működik</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/uptime-kuma-screenshot-1.webp" alt="Uptime Kuma képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Weboldalak és szolgáltatások elérhetőségének figyelése</li><li>HTTP, TCP, DNS, ping és egyéb protokollok támogatása</li><li>Értesítések emailben, Telegramon, Discord-on, stb.</li><li>Nyilvános státusz oldal a felhasználóknak</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a status.otthonod.hu címet a böngészőben</li><li>Hozd létre az admin fiókot az első megnyitáskor</li><li>Add hozzá az első monitort (pl. a saját weboldalad)</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>status.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-vaultwarden" role="dialog" aria-label="Vaultwarden">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/vaultwarden-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Vaultwarden</h3>
-                    <p class="app-info-tagline">Jelszókezelő - Bitwarden kompatibilis, a saját szerveren</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/vaultwarden-screenshot-1.webp" alt="Vaultwarden képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Jelszavak biztonságos tárolása és automatikus kitöltése</li><li>Bitwarden kliensek teljes kompatibilitása (böngésző, mobil, asztali)</li><li>Jelszavak megosztása családtagokkal szervezeten belül</li><li>Kétfaktoros hitelesítés (TOTP) kódok tárolása</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a vault.otthonod.hu/admin címet, és lépj be az admin panel tokenjével (Beállítások → Automatikusan generált értékek)</li><li>A „Users&quot; fülön az „Invite User&quot; mezőben hívd meg a saját és a családtagok e-mail címét — a regisztráció alapból le van zárva, csak meghívott cím nyithat fiókot</li><li>Nyisd meg a vault.otthonod.hu címet, válaszd a „Create account&quot; lehetőséget a meghívott címmel, és adj meg erős mesterjelszót</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>vault.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-vikunja" role="dialog" aria-label="Vikunja">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/vikunja-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Vikunja</h3>
-                    <p class="app-info-tagline">Feladatkezelő - listák, Kanban táblák és Gantt diagramok</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/vikunja-screenshot-1.webp" alt="Vikunja képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Feladatlisták és teendők kezelése</li><li>Kanban tábla nézet (Trello-szerű)</li><li>Gantt diagram projekt ütemezéshez</li><li>Megosztott listák és csapat együttműködés</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a tasks.otthonod.hu címet a böngészőben</li><li>Hozd létre a fiókodat</li><li>Hozd létre az első projektet és feladatlistát</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>tasks.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-wanderer" role="dialog" aria-label="Wanderer">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/wanderer-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Wanderer</h3>
-                    <p class="app-info-tagline">Túra tervező - útvonalak, GPX nyomok és domborzati térképek</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/wanderer-screenshot-1.webp" alt="Wanderer képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Túra útvonalak tervezése és mentése</li><li>GPX fájlok importálása és exportálása</li><li>Domborzati profilok és statisztikák</li><li>Fotók és jegyzetek hozzáadása az útvonalakhoz</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a hike.otthonod.hu címet a böngészőben</li><li>Hozd létre a fiókodat azonnal a telepítés után, aztán az alkalmazás oldalán zárd le a regisztrációt. Addig bárki, aki megtalálja a címet, fiókot hozhat létre.</li><li>Importálj egy GPX fájlt vagy tervezz új útvonalat</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>hike.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-wishlist" role="dialog" aria-label="Wishlist">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/wishlist-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Wishlist</h3>
-                    <p class="app-info-tagline">Családi kívánságlista - karácsonyra, születésnapokra</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/wishlist-screenshot-1.webp" alt="Wishlist képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Kívánságlisták létrehozása karácsonyra, születésnapokra</li><li>Családtagok meghívása saját listáik kezeléséhez</li><li>Ajándékok lefoglalása meglepetés nélkül</li><li>Árak és linkek hozzáadása az ajándékokhoz</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a wishes.otthonod.hu címet a böngészőben</li><li>Hozd létre a fiókodat</li><li>Hozd létre az első kívánságlistádat</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>wishes.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-zipline" role="dialog" aria-label="Zipline">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/zipline-logo.png" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Zipline</h3>
-                    <p class="app-info-tagline">Screenshot és fájlmegosztó szerver ShareX/Flameshot integrációval</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/zipline-screenshot-1.webp" alt="Zipline képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Screenshotok automatikus feltöltése ShareX/Flameshot-ból</li><li>URL rövidítés és szöveg megosztás (paste)</li><li>Galéria nézet és album kezelés</li><li>API támogatás egyedi integrációkhoz</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg az img.otthonod.hu címet a böngészőben</li><li>Az első megnyitáskor hozd létre az admin fiókodat</li><li>Konfiguráld a ShareX-et vagy Flameshot-ot az API URL-lel</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>img.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-        <script>
-        (function(){
-            var q=document.getElementById('appSearch'),c=document.getElementById('searchCount');
-            if(!q)return;
-            var cards=[].slice.call(document.querySelectorAll('.stack-detail-card'));
-            q.addEventListener('input',function(){
-                var t=q.value.trim().toLowerCase(),n=0;
-                cards.forEach(function(el){
-                    var hit=!t||el.getAttribute('data-name').indexOf(t)>-1;
-                    el.style.display=hit?'':'none'; if(hit)n++;
-                });
-                document.querySelectorAll('.bucket-head,.stack-grid').forEach(function(g){});
-                c.textContent=t?(n+' találat'):'';
-            });
-        })();
-        </script>
-    </main>
-    <script>
-    (function(){
-        var b=document.getElementById('navBurger'),s=document.getElementById('sidebar'),k=document.getElementById('navBackdrop');
-        if(!b||!s||!k)return;
-        function open(){s.classList.add('is-open');k.hidden=false;b.setAttribute('aria-expanded','true');}
-        function close(){s.classList.remove('is-open');k.hidden=true;b.setAttribute('aria-expanded','false');}
-        b.addEventListener('click',function(){s.classList.contains('is-open')?close():open();});
-        k.addEventListener('click',close);
-        document.addEventListener('keydown',function(e){if(e.key==='Escape')close();});
-    })();
-    </script>
-</body>
-</html>
diff --git a/website/preview/m1/hogyan.html b/website/preview/m1/hogyan.html
deleted file mode 100644
index a599aaf4..00000000
--- a/website/preview/m1/hogyan.html
+++ /dev/null
@@ -1,91 +0,0 @@
-<!DOCTYPE html>
-<html lang="hu" class="no-js">
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <meta name="robots" content="noindex, nofollow">
-    <meta name="description" content="Mockup: hogyan jutsz el a működő otthoni szerverig.">
-    <title>Hogyan működik · Felhom.eu mockup</title>
-    <script>
-    /* The controller's own progressive-enhancement hook (layout.html): flip no-js -> js before
-       the first CSS-dependent paint, so the off-canvas drawer engages ONLY where the drawer
-       script can open it. Without it the sidebar stays an in-flow flex child on a phone and
-       squeezes the content column - which is exactly what happened here first time. */
-    document.documentElement.className=document.documentElement.className.replace('no-js','js');
-    </script>
-    <link rel="stylesheet" href="/preview/mockup.css?v=1">
-    <link rel="icon" type="image/png" href="/assets/logo_favicon_2.svg">
-</head>
-<body class="mockup">
-    <header class="mobile-topbar">
-        <a href="index.html" class="mobile-topbar-logo"><img src="/assets/logo_notext_white.svg" alt="Felhom.eu"></a>
-        <button type="button" class="nav-burger" id="navBurger" aria-expanded="false" aria-controls="sidebar" aria-label="Menü">
-            <span class="hamburger-box"><span class="hamburger-line"></span><span class="hamburger-line"></span><span class="hamburger-line"></span></span>
-        </button>
-    </header>
-    <div class="nav-backdrop" id="navBackdrop" hidden></div>
-    <nav class="sidebar" id="sidebar">
-        <div class="sidebar-header">
-            <img src="/assets/logo_notext_white.svg" alt="Felhom.eu" class="sidebar-logo">
-        </div>
-        <ul class="nav-links">
-                <li><a href="index.html"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rocket"/></svg>Indítópult</a></li>
-                <li><a href="alkalmazasok.html"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-cloud"/></svg>Alkalmazások</a></li>
-                <li><a href="mentesek.html"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield"/></svg>Biztonsági mentés</a></li>
-                <li><span class="nav-off" title="a saját dobozodon működik"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-hard-drive"/></svg>Tárhely<span class="nav-off-hint">a saját dobozodon működik</span></span></li>
-                <li><span class="nav-off" title="a saját dobozodon működik"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layout-grid"/></svg>Megosztás<span class="nav-off-hint">a saját dobozodon működik</span></span></li>
-                <li><span class="nav-off" title="a saját dobozodon működik"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-cpu"/></svg>Rendszermonitor<span class="nav-off-hint">a saját dobozodon működik</span></span></li>
-                <li><span class="nav-off" title="a saját dobozodon működik"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-settings"/></svg>Beállítások<span class="nav-off-hint">a saját dobozodon működik</span></span></li>
-        </ul>
-        <div class="sidebar-bottom">
-            <div class="nav-group-label">A Felhomról</div>
-            <ul class="nav-links nav-links-sub">
-                    <li><a href="hogyan.html" class="active">Hogyan működik</a></li>
-                    <li><a href="teszteles.html">Tesztelés</a></li>
-                    <li><a href="kapcsolat.html">Kapcsolat</a></li>
-            </ul>
-            <div class="sidebar-footer">
-                <span class="version">mockup</span>
-            </div>
-        </div>
-    </nav>
-    <main class="content">
-        <div class="page-header"><h2>Hogyan működik?</h2></div>
-        <p class="form-hint">Az első beszélgetéstől a működő rendszerig.</p>
-        <div class="app-info-grid how-grid">
-            <div class="app-info-card">
-                <h3>Egyeztetés</h3>
-                <p>Megbeszéljük az igényeidet: milyen alkalmazásokra van szükséged, és mekkora tárhelyet szeretnél.</p>
-            </div>
-            <div class="app-info-card">
-                <h3>Hardver kiválasztás</h3>
-                <p>Segítünk megtalálni a legjobb ár-érték arányú gépet, ami az igényeidnek megfelel.</p>
-            </div>
-            <div class="app-info-card">
-                <h3>Telepítés</h3>
-                <p>Feltelepítjük és bekonfiguráljuk az alkalmazásokat, a mentéseket, és a monitoringot.</p>
-            </div>
-            <div class="app-info-card">
-                <h3>Átadás</h3>
-                <p>Bemutatjuk a rendszert, segítünk áthozni a meglévő adataidat, és válaszolunk minden kérdésedre.</p>
-            </div>
-            <div class="app-info-card">
-                <h3>Üzemeltetés</h3>
-                <p>Figyeljük a rendszert, frissítünk, mentéseket ellenőrzünk. Te csak használod.</p>
-            </div>
-        </div>
-
-    </main>
-    <script>
-    (function(){
-        var b=document.getElementById('navBurger'),s=document.getElementById('sidebar'),k=document.getElementById('navBackdrop');
-        if(!b||!s||!k)return;
-        function open(){s.classList.add('is-open');k.hidden=false;b.setAttribute('aria-expanded','true');}
-        function close(){s.classList.remove('is-open');k.hidden=true;b.setAttribute('aria-expanded','false');}
-        b.addEventListener('click',function(){s.classList.contains('is-open')?close():open();});
-        k.addEventListener('click',close);
-        document.addEventListener('keydown',function(e){if(e.key==='Escape')close();});
-    })();
-    </script>
-</body>
-</html>
diff --git a/website/preview/m1/index.html b/website/preview/m1/index.html
deleted file mode 100644
index 6414b1db..00000000
--- a/website/preview/m1/index.html
+++ /dev/null
@@ -1,1939 +0,0 @@
-<!DOCTYPE html>
-<html lang="hu" class="no-js">
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <meta name="robots" content="noindex, nofollow">
-    <meta name="description" content="Mockup: a felhom.eu weboldal a doboz vezérlőpultjaként.">
-    <title>Indítópult · Felhom.eu mockup</title>
-    <script>
-    /* The controller's own progressive-enhancement hook (layout.html): flip no-js -> js before
-       the first CSS-dependent paint, so the off-canvas drawer engages ONLY where the drawer
-       script can open it. Without it the sidebar stays an in-flow flex child on a phone and
-       squeezes the content column - which is exactly what happened here first time. */
-    document.documentElement.className=document.documentElement.className.replace('no-js','js');
-    </script>
-    <link rel="stylesheet" href="/preview/mockup.css?v=1">
-    <link rel="icon" type="image/png" href="/assets/logo_favicon_2.svg">
-</head>
-<body class="mockup">
-    <header class="mobile-topbar">
-        <a href="index.html" class="mobile-topbar-logo"><img src="/assets/logo_notext_white.svg" alt="Felhom.eu"></a>
-        <button type="button" class="nav-burger" id="navBurger" aria-expanded="false" aria-controls="sidebar" aria-label="Menü">
-            <span class="hamburger-box"><span class="hamburger-line"></span><span class="hamburger-line"></span><span class="hamburger-line"></span></span>
-        </button>
-    </header>
-    <div class="nav-backdrop" id="navBackdrop" hidden></div>
-    <nav class="sidebar" id="sidebar">
-        <div class="sidebar-header">
-            <img src="/assets/logo_notext_white.svg" alt="Felhom.eu" class="sidebar-logo">
-        </div>
-        <ul class="nav-links">
-                <li><a href="index.html" class="active"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rocket"/></svg>Indítópult</a></li>
-                <li><a href="alkalmazasok.html"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-cloud"/></svg>Alkalmazások</a></li>
-                <li><a href="mentesek.html"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield"/></svg>Biztonsági mentés</a></li>
-                <li><span class="nav-off" title="a saját dobozodon működik"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-hard-drive"/></svg>Tárhely<span class="nav-off-hint">a saját dobozodon működik</span></span></li>
-                <li><span class="nav-off" title="a saját dobozodon működik"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layout-grid"/></svg>Megosztás<span class="nav-off-hint">a saját dobozodon működik</span></span></li>
-                <li><span class="nav-off" title="a saját dobozodon működik"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-cpu"/></svg>Rendszermonitor<span class="nav-off-hint">a saját dobozodon működik</span></span></li>
-                <li><span class="nav-off" title="a saját dobozodon működik"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-settings"/></svg>Beállítások<span class="nav-off-hint">a saját dobozodon működik</span></span></li>
-        </ul>
-        <div class="sidebar-bottom">
-            <div class="nav-group-label">A Felhomról</div>
-            <ul class="nav-links nav-links-sub">
-                    <li><a href="hogyan.html">Hogyan működik</a></li>
-                    <li><a href="teszteles.html">Tesztelés</a></li>
-                    <li><a href="kapcsolat.html">Kapcsolat</a></li>
-            </ul>
-            <div class="sidebar-footer">
-                <span class="version">mockup</span>
-            </div>
-        </div>
-    </nav>
-    <main class="content">
-        <div class="page-header">
-            <h2>Indítópult</h2>
-            <span class="domain-badge">otthonod.hu <span class="sample">minta</span></span>
-        </div>
-
-        <div class="welcome-card">
-            <div class="welcome-text">
-                <h1>Ez a vezérlőpult, amit a doboz ad.</h1>
-                <p>Minden csempe egy alkalmazás, ami nálad futna. Kattints bármelyikre, és megnézheted, mire jó.</p>
-            </div>
-            <a class="btn btn-primary btn-lg" href="teszteles.html">Jelentkezem tesztelőnek →</a>
-        </div>
-
-        <div class="launch-grid">
-            <a class="launch-cell" href="#app-actualbudget">
-                <span class="launch-tile" style="background: hsl(106, 45%, 38%)">
-                    <span class="launch-mono">A</span>
-                    <img class="launch-logo" src="/assets/actualbudget-logo.svg" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">ActualBudget</span>
-            </a>
-            <a class="launch-cell" href="#app-adventurelog">
-                <span class="launch-tile" style="background: hsl(155, 45%, 38%)">
-                    <span class="launch-mono">A</span>
-                    <img class="launch-logo" src="/assets/adventurelog-logo.png" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">AdventureLog</span>
-            </a>
-            <a class="launch-cell" href="#app-audiobookshelf">
-                <span class="launch-tile" style="background: hsl(120, 45%, 38%)">
-                    <span class="launch-mono">A</span>
-                    <img class="launch-logo" src="/assets/audiobookshelf-logo.svg" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">Audiobookshelf</span>
-            </a>
-            <a class="launch-cell" href="#app-bentopdf">
-                <span class="launch-tile" style="background: hsl(287, 45%, 38%)">
-                    <span class="launch-mono">B</span>
-                    <img class="launch-logo" src="/assets/bentopdf-logo.svg" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">BentoPDF</span>
-            </a>
-            <a class="launch-cell" href="#app-bookstack">
-                <span class="launch-tile" style="background: hsl(112, 45%, 38%)">
-                    <span class="launch-mono">B</span>
-                    <img class="launch-logo" src="/assets/bookstack-logo.svg" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">BookStack</span>
-            </a>
-            <a class="launch-cell" href="#app-calcom">
-                <span class="launch-tile" style="background: hsl(84, 45%, 38%)">
-                    <span class="launch-mono">C</span>
-                    <img class="launch-logo" src="/assets/calcom-logo.svg" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">Cal.com</span>
-            </a>
-            <a class="launch-cell" href="#app-calibre-web">
-                <span class="launch-tile" style="background: hsl(274, 45%, 38%)">
-                    <span class="launch-mono">C</span>
-                    <img class="launch-logo" src="/assets/calibre-web-logo.svg" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">Calibre-Web Automated</span>
-            </a>
-            <a class="launch-cell" href="#app-claper">
-                <span class="launch-tile" style="background: hsl(280, 45%, 38%)">
-                    <span class="launch-mono">C</span>
-                    <img class="launch-logo" src="/assets/claper-logo.svg" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">Claper</span>
-            </a>
-            <a class="launch-cell" href="#app-code-server">
-                <span class="launch-tile" style="background: hsl(280, 45%, 38%)">
-                    <span class="launch-mono">C</span>
-                    <img class="launch-logo" src="/assets/code-server-logo.svg" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">Code-Server</span>
-            </a>
-            <a class="launch-cell" href="#app-crafty-controller">
-                <span class="launch-tile" style="background: hsl(307, 45%, 38%)">
-                    <span class="launch-mono">C</span>
-                    <img class="launch-logo" src="/assets/crafty-controller-logo.png" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">Crafty Controller</span>
-            </a>
-            <a class="launch-cell" href="#app-dawarich">
-                <span class="launch-tile" style="background: hsl(244, 45%, 38%)">
-                    <span class="launch-mono">D</span>
-                    <img class="launch-logo" src="/assets/dawarich-logo.svg" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">Dawarich</span>
-            </a>
-            <a class="launch-cell" href="#app-docmost">
-                <span class="launch-tile" style="background: hsl(234, 45%, 38%)">
-                    <span class="launch-mono">D</span>
-                    <img class="launch-logo" src="/assets/docmost-logo.png" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">Docmost</span>
-            </a>
-            <a class="launch-cell" href="#app-emby">
-                <span class="launch-tile" style="background: hsl(106, 45%, 38%)">
-                    <span class="launch-mono">E</span>
-                    <img class="launch-logo" src="/assets/emby-logo.svg" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">Emby</span>
-            </a>
-            <a class="launch-cell" href="#app-ghost">
-                <span class="launch-tile" style="background: hsl(320, 45%, 38%)">
-                    <span class="launch-mono">G</span>
-                    <img class="launch-logo" src="/assets/ghost-logo.svg" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">Ghost</span>
-            </a>
-            <a class="launch-cell" href="#app-gitea">
-                <span class="launch-tile" style="background: hsl(129, 45%, 38%)">
-                    <span class="launch-mono">G</span>
-                    <img class="launch-logo" src="/assets/gitea-logo.svg" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">Gitea</span>
-            </a>
-            <a class="launch-cell" href="#app-glance">
-                <span class="launch-tile" style="background: hsl(121, 45%, 38%)">
-                    <span class="launch-mono">G</span>
-                    <img class="launch-logo" src="/assets/glance-logo.svg" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">Glance</span>
-            </a>
-            <a class="launch-cell" href="#app-gokapi">
-                <span class="launch-tile" style="background: hsl(256, 45%, 38%)">
-                    <span class="launch-mono">G</span>
-                    <img class="launch-logo" src="/assets/gokapi-logo.png" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">Gokapi</span>
-            </a>
-            <a class="launch-cell" href="#app-grafana">
-                <span class="launch-tile" style="background: hsl(211, 45%, 38%)">
-                    <span class="launch-mono">G</span>
-                    <img class="launch-logo" src="/assets/grafana-logo.svg" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">Grafana</span>
-            </a>
-            <a class="launch-cell" href="#app-gramps-web">
-                <span class="launch-tile" style="background: hsl(100, 45%, 38%)">
-                    <span class="launch-mono">G</span>
-                    <img class="launch-logo" src="/assets/gramps-web-logo.png" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">Gramps Web</span>
-            </a>
-            <a class="launch-cell" href="#app-grimmory">
-                <span class="launch-tile" style="background: hsl(291, 45%, 38%)">
-                    <span class="launch-mono">G</span>
-                    <img class="launch-logo" src="/assets/grimmory-logo.svg" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">Grimmory</span>
-            </a>
-            <a class="launch-cell" href="#app-grocy">
-                <span class="launch-tile" style="background: hsl(293, 45%, 38%)">
-                    <span class="launch-mono">G</span>
-                    <img class="launch-logo" src="/assets/grocy-logo.svg" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">Grocy</span>
-            </a>
-            <a class="launch-cell" href="#app-home-assistant">
-                <span class="launch-tile" style="background: hsl(291, 45%, 38%)">
-                    <span class="launch-mono">H</span>
-                    <img class="launch-logo" src="/assets/home-assistant-logo.svg" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">Home Assistant</span>
-            </a>
-            <a class="launch-cell" href="#app-homebox">
-                <span class="launch-tile" style="background: hsl(243, 45%, 38%)">
-                    <span class="launch-mono">H</span>
-                    <img class="launch-logo" src="/assets/homebox-logo.svg" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">Homebox</span>
-            </a>
-            <a class="launch-cell" href="#app-homepage">
-                <span class="launch-tile" style="background: hsl(141, 45%, 38%)">
-                    <span class="launch-mono">H</span>
-                    <img class="launch-logo" src="/assets/homepage-logo.svg" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">Homepage</span>
-            </a>
-            <a class="launch-cell" href="#app-immich">
-                <span class="launch-tile" style="background: hsl(18, 45%, 38%)">
-                    <span class="launch-mono">I</span>
-                    <img class="launch-logo" src="/assets/immich-logo.svg" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">Immich</span>
-            </a>
-            <a class="launch-cell" href="#app-jellyfin">
-                <span class="launch-tile" style="background: hsl(348, 45%, 38%)">
-                    <span class="launch-mono">J</span>
-                    <img class="launch-logo" src="/assets/jellyfin-logo.svg" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">Jellyfin</span>
-            </a>
-            <a class="launch-cell" href="#app-karakeep">
-                <span class="launch-tile" style="background: hsl(305, 45%, 38%)">
-                    <span class="launch-mono">K</span>
-                    <img class="launch-logo" src="/assets/karakeep-logo.svg" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">Karakeep</span>
-            </a>
-            <a class="launch-cell" href="#app-kimai">
-                <span class="launch-tile" style="background: hsl(346, 45%, 38%)">
-                    <span class="launch-mono">K</span>
-                    <img class="launch-logo" src="/assets/kimai-logo.png" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">Kimai</span>
-            </a>
-            <a class="launch-cell" href="#app-komga">
-                <span class="launch-tile" style="background: hsl(158, 45%, 38%)">
-                    <span class="launch-mono">K</span>
-                    <img class="launch-logo" src="/assets/komga-logo.svg" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">Komga</span>
-            </a>
-            <a class="launch-cell" href="#app-lubelogger">
-                <span class="launch-tile" style="background: hsl(167, 45%, 38%)">
-                    <span class="launch-mono">L</span>
-                    <img class="launch-logo" src="/assets/lubelogger-logo.png" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">LubeLogger</span>
-            </a>
-            <a class="launch-cell" href="#app-mealie">
-                <span class="launch-tile" style="background: hsl(332, 45%, 38%)">
-                    <span class="launch-mono">M</span>
-                    <img class="launch-logo" src="/assets/mealie-logo.svg" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">Mealie</span>
-            </a>
-            <a class="launch-cell" href="#app-metube">
-                <span class="launch-tile" style="background: hsl(285, 45%, 38%)">
-                    <span class="launch-mono">M</span>
-                    <img class="launch-logo" src="/assets/metube-logo.svg" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">MeTube</span>
-            </a>
-            <a class="launch-cell" href="#app-n8n">
-                <span class="launch-tile" style="background: hsl(15, 45%, 38%)">
-                    <span class="launch-mono">N</span>
-                    <img class="launch-logo" src="/assets/n8n-logo.svg" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">n8n</span>
-            </a>
-            <a class="launch-cell" href="#app-navidrome">
-                <span class="launch-tile" style="background: hsl(318, 45%, 38%)">
-                    <span class="launch-mono">N</span>
-                    <img class="launch-logo" src="/assets/navidrome-logo.svg" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">Navidrome</span>
-            </a>
-            <a class="launch-cell" href="#app-nextcloud">
-                <span class="launch-tile" style="background: hsl(201, 45%, 38%)">
-                    <span class="launch-mono">N</span>
-                    <img class="launch-logo" src="/assets/nextcloud-logo.svg" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">Nextcloud</span>
-            </a>
-            <a class="launch-cell" href="#app-onlyoffice">
-                <span class="launch-tile" style="background: hsl(331, 45%, 38%)">
-                    <span class="launch-mono">O</span>
-                    <img class="launch-logo" src="/assets/onlyoffice-logo.svg" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">OnlyOffice</span>
-            </a>
-            <a class="launch-cell" href="#app-opengist">
-                <span class="launch-tile" style="background: hsl(142, 45%, 38%)">
-                    <span class="launch-mono">O</span>
-                    <img class="launch-logo" src="/assets/opengist-logo.png" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">OpenGist</span>
-            </a>
-            <a class="launch-cell" href="#app-outline">
-                <span class="launch-tile" style="background: hsl(245, 45%, 38%)">
-                    <span class="launch-mono">O</span>
-                    <img class="launch-logo" src="/assets/outline-logo.svg" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">Outline</span>
-            </a>
-            <a class="launch-cell" href="#app-paperless-ngx">
-                <span class="launch-tile" style="background: hsl(328, 45%, 38%)">
-                    <span class="launch-mono">P</span>
-                    <img class="launch-logo" src="/assets/paperless-ngx-logo.svg" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">Paperless-ngx</span>
-            </a>
-            <a class="launch-cell" href="#app-papra">
-                <span class="launch-tile" style="background: hsl(231, 45%, 38%)">
-                    <span class="launch-mono">P</span>
-                    <img class="launch-logo" src="/assets/papra-logo.svg" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">Papra</span>
-            </a>
-            <a class="launch-cell" href="#app-plex">
-                <span class="launch-tile" style="background: hsl(20, 45%, 38%)">
-                    <span class="launch-mono">P</span>
-                    <img class="launch-logo" src="/assets/plex-logo.svg" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">Plex</span>
-            </a>
-            <a class="launch-cell" href="#app-privatebin">
-                <span class="launch-tile" style="background: hsl(125, 45%, 38%)">
-                    <span class="launch-mono">P</span>
-                    <img class="launch-logo" src="/assets/privatebin-logo.png" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">PrivateBin</span>
-            </a>
-            <a class="launch-cell" href="#app-radarr">
-                <span class="launch-tile" style="background: hsl(3, 45%, 38%)">
-                    <span class="launch-mono">R</span>
-                    <img class="launch-logo" src="/assets/radarr-logo.png" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">Radarr</span>
-            </a>
-            <a class="launch-cell" href="#app-radicale">
-                <span class="launch-tile" style="background: hsl(120, 45%, 38%)">
-                    <span class="launch-mono">R</span>
-                    <img class="launch-logo" src="/assets/radicale-logo.svg" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">Radicale</span>
-            </a>
-            <a class="launch-cell" href="#app-rallly">
-                <span class="launch-tile" style="background: hsl(331, 45%, 38%)">
-                    <span class="launch-mono">R</span>
-                    <img class="launch-logo" src="/assets/rallly-logo.svg" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">Rallly</span>
-            </a>
-            <a class="launch-cell" href="#app-recipe-importer">
-                <span class="launch-tile" style="background: hsl(32, 45%, 38%)">
-                    <span class="launch-mono">R</span>
-                    <img class="launch-logo" src="/assets/recipe-importer-logo.svg" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">Recipe Importer</span>
-            </a>
-            <a class="launch-cell" href="#app-romm">
-                <span class="launch-tile" style="background: hsl(44, 45%, 38%)">
-                    <span class="launch-mono">R</span>
-                    <img class="launch-logo" src="/assets/romm-logo.svg" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">RomM</span>
-            </a>
-            <a class="launch-cell" href="#app-seerr">
-                <span class="launch-tile" style="background: hsl(244, 45%, 38%)">
-                    <span class="launch-mono">J</span>
-                    <img class="launch-logo" src="/assets/seerr-logo.png" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">Jellyseerr</span>
-            </a>
-            <a class="launch-cell" href="#app-sonarr">
-                <span class="launch-tile" style="background: hsl(18, 45%, 38%)">
-                    <span class="launch-mono">S</span>
-                    <img class="launch-logo" src="/assets/sonarr-logo.svg" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">Sonarr</span>
-            </a>
-            <a class="launch-cell" href="#app-sparkyfitness">
-                <span class="launch-tile" style="background: hsl(51, 45%, 38%)">
-                    <span class="launch-mono">S</span>
-                    <img class="launch-logo" src="/assets/sparkyfitness-logo.png" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">SparkyFitness</span>
-            </a>
-            <a class="launch-cell" href="#app-tandoor">
-                <span class="launch-tile" style="background: hsl(16, 45%, 38%)">
-                    <span class="launch-mono">T</span>
-                    <img class="launch-logo" src="/assets/tandoor-logo.png" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">Tandoor Recipes</span>
-            </a>
-            <a class="launch-cell" href="#app-termix">
-                <span class="launch-tile" style="background: hsl(342, 45%, 38%)">
-                    <span class="launch-mono">T</span>
-                    <img class="launch-logo" src="/assets/termix-logo.svg" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">Termix</span>
-            </a>
-            <a class="launch-cell" href="#app-uptime-kuma">
-                <span class="launch-tile" style="background: hsl(186, 45%, 38%)">
-                    <span class="launch-mono">U</span>
-                    <img class="launch-logo" src="/assets/uptime-kuma-logo.svg" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">Uptime Kuma</span>
-            </a>
-            <a class="launch-cell" href="#app-vaultwarden">
-                <span class="launch-tile" style="background: hsl(66, 45%, 38%)">
-                    <span class="launch-mono">V</span>
-                    <img class="launch-logo" src="/assets/vaultwarden-logo.svg" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">Vaultwarden</span>
-            </a>
-            <a class="launch-cell" href="#app-vikunja">
-                <span class="launch-tile" style="background: hsl(79, 45%, 38%)">
-                    <span class="launch-mono">V</span>
-                    <img class="launch-logo" src="/assets/vikunja-logo.svg" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">Vikunja</span>
-            </a>
-            <a class="launch-cell" href="#app-wanderer">
-                <span class="launch-tile" style="background: hsl(3, 45%, 38%)">
-                    <span class="launch-mono">W</span>
-                    <img class="launch-logo" src="/assets/wanderer-logo.svg" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">Wanderer</span>
-            </a>
-            <a class="launch-cell" href="#app-wishlist">
-                <span class="launch-tile" style="background: hsl(26, 45%, 38%)">
-                    <span class="launch-mono">W</span>
-                    <img class="launch-logo" src="/assets/wishlist-logo.svg" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">Wishlist</span>
-            </a>
-            <a class="launch-cell" href="#app-zipline">
-                <span class="launch-tile" style="background: hsl(102, 45%, 38%)">
-                    <span class="launch-mono">Z</span>
-                    <img class="launch-logo" src="/assets/zipline-logo.png" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">Zipline</span>
-            </a>
-        </div>
-
-    <div class="app-panel" id="app-actualbudget" role="dialog" aria-label="ActualBudget">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/actualbudget-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>ActualBudget</h3>
-                    <p class="app-info-tagline">Költségvetés tervező - pénzügyeid kézben tartása egyszerűen</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/actualbudget-screenshot-1.webp" alt="ActualBudget képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Havi költségvetés tervezése és követése envelope módszerrel</li><li>Bankszámla tranzakciók importálása és kategorizálása</li><li>Riportok és grafikonok a kiadásokról és bevételekről</li><li>Több felhasználó - közös háztartási pénzügyek kezelése</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a budget.otthonod.hu címet a böngészőben</li><li>Hozz létre egy jelszót az első megnyitáskor</li><li>Hozd létre a költségvetési kategóriákat (pl. élelmiszer, közlekedés)</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>budget.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-adventurelog" role="dialog" aria-label="AdventureLog">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/adventurelog-logo.png" alt="">
-                <div class="app-info-hero-text">
-                    <h3>AdventureLog</h3>
-                    <p class="app-info-tagline">Utazási napló - utazások dokumentálása térképpel és fotókkal</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/adventurelog-screenshot-1.webp" alt="AdventureLog képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Utazások dokumentálása képekkel és jegyzetekkel</li><li>Térképes megjelenítés a meglátogatott helyekről</li><li>Úti tervek készítése és szervezése</li><li>Statisztikák - meglátogatott országok, városok</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a travel.otthonod.hu címet a böngészőben</li><li>Hozd létre a fiókodat</li><li>Add hozzá az első utazásodat</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>travel.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-audiobookshelf" role="dialog" aria-label="Audiobookshelf">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/audiobookshelf-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Audiobookshelf</h3>
-                    <p class="app-info-tagline">Hangoskönyv és podcast kezelő, lejátszó és szinkronizáló</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/audiobookshelf-screenshot-1.webp" alt="Audiobookshelf képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Hangoskönyvek és podcastok rendszerezése és lejátszása</li><li>Automatikus metaadat letöltés - borítók, leírások, fejezetek</li><li>Folytatás ott, ahol abbahagytad (szinkron eszközök között)</li><li>Podcast feliratkozás és automatikus letöltés</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg az audiobooks.otthonod.hu címet a böngészőben</li><li>Hozd létre az admin fiókot az első megnyitáskor</li><li>Add hozzá a könyvtárakat (/audiobooks és/vagy /podcasts)</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>audiobooks.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-bentopdf" role="dialog" aria-label="BentoPDF">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/bentopdf-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>BentoPDF</h3>
-                    <p class="app-info-tagline">Adatvédelmi fókuszú PDF eszköztár - a fájlok soha nem hagyják el a szervered</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/bentopdf-screenshot-1.webp" alt="BentoPDF képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>PDF összefűzés, szétválasztás és forgatás</li><li>PDF konvertálás képekké és képekből</li><li>Jelszóvédelem és titkosítás</li><li>Vízjel hozzáadása dokumentumokhoz</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a pdf.otthonod.hu címet a böngészőben</li><li>Válaszd ki a kívánt műveletet</li><li>Töltsd fel a PDF fájlt és kattints a feldolgozásra</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>pdf.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-bookstack" role="dialog" aria-label="BookStack">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/bookstack-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>BookStack</h3>
-                    <p class="app-info-tagline">Egyszerű wiki platform - polcok, könyvek, fejezetek és oldalak</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/bookstack-screenshot-1.webp" alt="BookStack képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Családi tudásbázis - receptek, kézikönyvek, szabályok</li><li>Projekt dokumentáció strukturált formában</li><li>Könyv &gt; Fejezet &gt; Oldal hierarchia az áttekinthetőségért</li><li>Teljes szöveges keresés és címkék</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a wiki.otthonod.hu címet a böngészőben</li><li>Jelentkezz be: admin@admin.com és a Beállítások oldalon látható első jelszó</li><li>Változtasd meg az admin email címét a sajátodra</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>wiki.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-calcom" role="dialog" aria-label="Cal.com">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/calcom-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Cal.com</h3>
-                    <p class="app-info-tagline">Időpontfoglaló - Calendly alternatíva saját szerveren</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/calcom-screenshot-1.webp" alt="Cal.com képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Időpontfoglalási oldal létrehozása ügyfeleknek</li><li>Naptár szinkronizáció (Google Calendar, Outlook)</li><li>Személyre szabható foglalási típusok és időtartamok</li><li>Automatikus emlékeztető emailek</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a cal.otthonod.hu címet a böngészőben</li><li>Hozd létre az admin fiókot</li><li>Állíts be egy foglalási típust (pl. 30 perces megbeszélés)</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>cal.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-calibre-web" role="dialog" aria-label="Calibre-Web Automated">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/calibre-web-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Calibre-Web Automated</h3>
-                    <p class="app-info-tagline">Automatizált e-könyv könyvtár - könyvfeldolgozás, formátumkonverzió és OPDS feed</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/calibre-web-screenshot-1.webp" alt="Calibre-Web Automated képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Automatizált e-könyv feldolgozás - csak dobd be az ingest mappába</li><li>Automatikus formátumkonverzió (EPUB, MOBI, PDF, AZW3)</li><li>OPDS feed e-olvasókhoz (Kindle, KOReader, Moon+ Reader)</li><li>Webes olvasó böngészőben</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a books.otthonod.hu címet a böngészőben</li><li>Jelentkezz be a Beállítások oldalon látható felhasználónévvel és első jelszóval</li><li>Dobj egy könyvet a Fájlkezelőben (FileBrowser) az import/calibre mappába — automatikusan feldolgozza és a media/books könyvtárba helyezi</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>books.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-claper" role="dialog" aria-label="Claper">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/claper-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Claper</h3>
-                    <p class="app-info-tagline">Interaktív prezentáció - szavazás, kérdések és reakciók élőben</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/claper-screenshot-1.webp" alt="Claper képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Interaktív prezentációk élő szavazásokkal</li><li>Közönség kérdéseinek gyűjtése és megjelenítése</li><li>Reakciók és visszajelzések valós időben</li><li>PDF prezentációk feltöltése és megosztása</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a present.otthonod.hu címet a böngészőben</li><li>Lépj be az admin@claper.co fiókkal és a Beállítások oldalon látható első jelszóval</li><li>Tölts fel egy PDF prezentációt</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>present.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-code-server" role="dialog" aria-label="Code-Server">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/code-server-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Code-Server</h3>
-                    <p class="app-info-tagline">VS Code a böngészőben - teljes fejlesztői környezet bárhonnan</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/code-server-screenshot-1.webp" alt="Code-Server képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Kódolás bárhonnan, bármilyen eszközről böngészőben</li><li>VS Code teljes funkcionalitás - bővítmények, terminál, debug</li><li>Távoli fejlesztés alacsony sávszélességű kapcsolaton is</li><li>Egységes fejlesztői környezet több eszközről</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a code.otthonod.hu címet a böngészőben</li><li>Add meg a hozzáférési jelszót</li><li>Nyisd meg a terminált (Ctrl+`) és telepíts eszközöket</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>code.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-crafty-controller" role="dialog" aria-label="Crafty Controller">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/crafty-controller-logo.png" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Crafty Controller</h3>
-                    <p class="app-info-tagline">Minecraft szerver kezelő - hozd létre a saját világodat</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/crafty-controller-screenshot-1.webp" alt="Crafty Controller képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Minecraft szerver létrehozása és kezelése webes felületen</li><li>Több szerver párhuzamos futtatása (Java és Bedrock)</li><li>Automatikus mentések és ütemezett újraindítás</li><li>Játékos menedzsment és konzol hozzáférés</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a minecraft.otthonod.hu címet a böngészőben</li><li>A kezdeti belépési adatokat ezen az oldalon (Kezdeti belépési adatok) találod</li><li>Hozz létre egy új Minecraft szervert a varázslóval</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>minecraft.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-dawarich" role="dialog" aria-label="Dawarich">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/dawarich-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Dawarich</h3>
-                    <p class="app-info-tagline">Saját helyelőzmények - a telefonod a te szerveredre küldi, hol jártál</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/dawarich-screenshot-1.webp" alt="Dawarich képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>A Google Idővonal helyett: a helyelőzményeid a saját szervereden</li><li>Térkép, statisztika és utazások az összes helyről, ahol jártál</li><li>Google Takeout, GPX és GeoJSON import a régi adataidhoz</li><li>A Dawarich, az Overland vagy az OwnTracks alkalmazás küldi a telefonod helyét</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a timeline.otthonod.hu címet, és jelentkezz be: demo@dawarich.app és a Beállítások oldalon látható jelszó</li><li>A fiókod beállításaiban cseréld le az e-mail-címet a sajátodra - a demo@dawarich.app név nyilvános</li><li>A beállításokban másold ki az API-kulcsodat</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>timeline.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-docmost" role="dialog" aria-label="Docmost">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/docmost-logo.png" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Docmost</h3>
-                    <p class="app-info-tagline">Modern wiki és dokumentáció platform Notion-szerű szerkesztővel</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/docmost-screenshot-1.webp" alt="Docmost képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Csapat tudásbázis és belső dokumentáció</li><li>Notion-szerű blokk szerkesztő valós idejű együttműködéssel</li><li>Terek és oldalak hierarchikus szervezése</li><li>Képek, táblázatok és kód blokkok beágyazása</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a docs.otthonod.hu címet a böngészőben</li><li>Az első regisztrált felhasználó automatikusan admin lesz</li><li>Hozd létre az első teret (Space) a dokumentumoknak</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>docs.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-emby" role="dialog" aria-label="Emby">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/emby-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Emby</h3>
-                    <p class="app-info-tagline">Személyes média szerver élő TV és DVR támogatással</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/emby-screenshot-1.webp" alt="Emby képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Filmek, sorozatok, zene és fotók kezelése egy helyen</li><li>Élő TV nézés és felvétel (DVR) TV tunerrel</li><li>Automatikus transzkódolás bármilyen eszközhöz</li><li>Szülői felügyelet és felhasználói profilok</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg az emby.otthonod.hu címet a böngészőben</li><li>Kövesd a beállítás varázslót</li><li>Hozd létre az admin fiókot</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>emby.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-ghost" role="dialog" aria-label="Ghost">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/ghost-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Ghost</h3>
-                    <p class="app-info-tagline">Professzionális blog és hírlevél platform</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/ghost-screenshot-1.webp" alt="Ghost képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Professzionális blog indítása és üzemeltetése</li><li>Hírlevél küldés beépített email funkcióval</li><li>SEO-optimalizált tartalom publikálás</li><li>Tagság és fizetős tartalom kezelés</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a blog.otthonod.hu/ghost/ címet a böngészőben</li><li>Hozd létre az admin fiókot a beállítás varázslóban</li><li>Írd meg és publikáld az első posztodat</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>blog.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-gitea" role="dialog" aria-label="Gitea">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/gitea-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Gitea</h3>
-                    <p class="app-info-tagline">Saját Git szerver - GitHub-szerű felület, privát repók</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/gitea-screenshot-1.webp" alt="Gitea képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Privát Git repozitóriók a saját szerveren</li><li>GitHub-szerű felület: pull request, issue, wiki</li><li>CI/CD pipeline-ok (Gitea Actions - GitHub Actions kompatibilis)</li><li>Szervezetek és csapatok kezelése</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a git.otthonod.hu címet a böngészőben</li><li>Kövesd az első beállítás varázslót</li><li>Hozd létre az admin fiókot</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>git.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-glance" role="dialog" aria-label="Glance">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/glance-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Glance</h3>
-                    <p class="app-info-tagline">Minimalista dashboard - RSS, időjárás, könyvjelzők egy oldalon</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/glance-screenshot-1.webp" alt="Glance képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>RSS hírek, YouTube, Reddit és egyéb tartalmak egy oldalon</li><li>Időjárás és rendszer monitorozás widgetekkel</li><li>Könyvjelzők és kedvenc oldalak rendszerezése</li><li>Ultragyors, minimális erőforrás igény</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a dashboard.otthonod.hu címet a böngészőben</li><li>Szerkeszd a glance.yml konfigurációs fájlt a kötetben</li><li>Add hozzá az RSS feedeket, widgeteket</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>dashboard.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-gokapi" role="dialog" aria-label="Gokapi">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/gokapi-logo.png" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Gokapi</h3>
-                    <p class="app-info-tagline">Ideiglenes fájlmegosztás lejáró linkekkel</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/gokapi-screenshot-1.webp" alt="Gokapi képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Fájlok biztonságos megosztása lejáró linkekkel</li><li>Beállítható lejárati idő és letöltési limit</li><li>Jelszóvédett letöltési linkek</li><li>API támogatás automatizált feltöltéshez</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a share.otthonod.hu címet a böngészőben</li><li>Lépj be: felhasználó &quot;admin&quot;, a jelszó a Beállítások oldalon található</li><li>Tölts fel egy fájlt és generálj megosztási linket</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>share.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-grafana" role="dialog" aria-label="Grafana">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/grafana-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Grafana</h3>
-                    <p class="app-info-tagline">Vizualizációs platform - dashboardok, grafikonok, alertek</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/grafana-screenshot-1.webp" alt="Grafana képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Rendszer metrikák vizualizálása (CPU, RAM, hálózat, lemez)</li><li>Egyedi dashboardok létrehozása különböző adatforrásokból</li><li>Alertek és értesítések küszöbértékek alapján</li><li>Prometheus, InfluxDB és sok más adatforrás támogatás</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a grafana.otthonod.hu címet a böngészőben</li><li>Jelentkezz be az admin fiókkal</li><li>Add hozzá az adatforrásokat (Connections &gt; Data Sources)</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>grafana.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-gramps-web" role="dialog" aria-label="Gramps Web">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/gramps-web-logo.png" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Gramps Web</h3>
-                    <p class="app-info-tagline">Családfa készítő - genealógiai adatbázis webes felületen</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/gramps-web-screenshot-1.webp" alt="Gramps Web képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Családfa építése és vizualizálása</li><li>Személyek, események, helyszínek és kapcsolatok rögzítése</li><li>Fényképek és dokumentumok csatolása a családtagokhoz</li><li>GEDCOM import és export kompatibilitás</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a family.otthonod.hu címet a böngészőben</li><li>Hozd létre az admin fiókot</li><li>Importálj egy meglévő GEDCOM fájlt, vagy kezdd az üres családfát</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>family.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-grimmory" role="dialog" aria-label="Grimmory">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/grimmory-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Grimmory</h3>
-                    <p class="app-info-tagline">E-könyvtár - olvasd böngészőben, Kobón, KOReaderrel vagy bármely OPDS-olvasóval</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/grimmory-screenshot-1.webp" alt="Grimmory képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>E-könyvek és képregények rendezett könyvtárban, borítóval és adatokkal</li><li>Olvasás a böngészőben, haladás mentése; Kobo- és KOReader-szinkron</li><li>OPDS-katalógus az e-könyv-olvasó alkalmazásoknak (a Beállításokban kapcsold be)</li><li>A Calibre-Web helyett vagy mellett: ez modernebb felület, a Calibre-Web a Calibre-könyvtárakhoz jó</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a library.otthonod.hu címet, és hozd létre az admin fiókodat</li><li>A családtagjaidat a vezérlőpult Beállítások, Biztonság oldalán, a Család kártyán add hozzá - idegen el sem éri a Grimmoryt</li><li>Hozz létre egy könyvtárat a /books mappával - ez a meghajtódon a userdata/media/grimmory mappa</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>library.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-grocy" role="dialog" aria-label="Grocy">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/grocy-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Grocy</h3>
-                    <p class="app-info-tagline">Háztartásvezetés: mi van otthon, mi fogy el, mit kell megvenni, kinek mi a dolga</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/grocy-screenshot-1.webp" alt="Grocy képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Nyilvántartja, mi van otthon, és szól, ha valami elfogyott vagy lejár</li><li>Bevásárlólista, ami magától felveszi azt, ami a minimum alá csökkent</li><li>Vonalkóddal gyorsan beírod, mit vettél, és mit használtál el - a telefon kamerájával is</li><li>Recept és heti étrend, ami levonja a hozzávalókat a készletből</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a kamra.otthonod.hu címet a böngészőben</li><li>Jelentkezz be az admin névvel és a Beállítások oldalon látható jelszóval</li><li>Vedd fel az első pár terméket (Termékek, majd Új termék), és állíts be nekik minimum mennyiséget</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>kamra.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-home-assistant" role="dialog" aria-label="Home Assistant">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/home-assistant-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Home Assistant</h3>
-                    <p class="app-info-tagline">Okos otthon központ - automatizálás és vezérlés egy helyről</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/home-assistant-screenshot-1.webp" alt="Home Assistant képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Okos otthon eszközök központi kezelése (lámpa, termosztát, kamera)</li><li>Automatizálások létrehozása (pl. mozgásérzékelőre lámpa be)</li><li>2000+ integráció (Zigbee, Z-Wave, Tuya, Shelly, stb.)</li><li>Dashboard a család számára mobilon és tableten</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a ha.otthonod.hu címet a böngészőben</li><li>Hozd létre a tulajdonos fiókot az onboarding során</li><li>Fedezd fel az automatikusan felfedezett eszközöket</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>ha.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-homebox" role="dialog" aria-label="Homebox">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/homebox-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Homebox</h3>
-                    <p class="app-info-tagline">Otthoni leltár kezelő - tartsd számon a tárgyaidat</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/homebox-screenshot-1.webp" alt="Homebox képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Otthoni tárgyak leltározása és nyilvántartása</li><li>Helyszínek, címkék és kategóriák szerinti rendszerezés</li><li>Garancia lejáratok és beszerzési árak nyilvántartása</li><li>Vonalkód szkennelés a gyors hozzáadáshoz</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg az inventory.otthonod.hu címet a böngészőben</li><li>Hozd létre a fiókodat az első megnyitáskor</li><li>Add hozzá a helyszíneket (pl. nappali, konyha, garázs)</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>inventory.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-homepage" role="dialog" aria-label="Homepage">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/homepage-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Homepage</h3>
-                    <p class="app-info-tagline">Személyes kezdőlap - szolgáltatás státuszok és widgetek egy helyen</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/homepage-screenshot-1.webp" alt="Homepage képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Összes szolgáltatás egy áttekinthető oldalon</li><li>Szolgáltatás állapot monitoring widgetek</li><li>Docker integráció - automatikus szolgáltatás felfedezés</li><li>Könyvjelzők és kedvenc oldalak</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a home.otthonod.hu címet a böngészőben</li><li>Szerkeszd a konfigurációs fájlokat a homepage_config kötetben</li><li>Add hozzá a szolgáltatásokat a services.yaml-ban</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>home.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-immich" role="dialog" aria-label="Immich">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/immich-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Immich</h3>
-                    <p class="app-info-tagline">Google Photos alternatíva - automatikus fotó mentés és rendszerezés</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/immich-screenshot-1.webp" alt="Immich képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Fotók és videók automatikus mentése telefonról</li><li>Arc- és tárgyfelismerés gépi tanulással</li><li>Térképes megjelenítés helyszín alapján</li><li>Emlékek és visszatekintések automatikus generálása</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a photos.otthonod.hu címet a böngészőben</li><li>Hozd létre az admin fiókot</li><li>Telepítsd az Immich alkalmazást a telefonodra (Android/iOS)</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>photos.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-jellyfin" role="dialog" aria-label="Jellyfin">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/jellyfin-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Jellyfin</h3>
-                    <p class="app-info-tagline">Ingyenes média szerver - filmek, sorozatok és zene streamelése</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/jellyfin-screenshot-1.webp" alt="Jellyfin képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Filmek, sorozatok és zenék streamelése bármilyen eszközre</li><li>Automatikus metaadat letöltés - borítók, leírások, értékelések</li><li>Élő TV és DVR funkció TV tunerrel</li><li>Több felhasználó külön profillal és szülői felügyelettel</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a media.otthonod.hu címet a böngészőben</li><li>Kövesd a beállítás varázslót - válaszd a magyar nyelvet</li><li>Hozd létre az admin fiókot</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>media.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-karakeep" role="dialog" aria-label="Karakeep">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/karakeep-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Karakeep</h3>
-                    <p class="app-info-tagline">Könyvjelzők, cikkek és jegyzetek mentése - kereshető saját archívum</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/karakeep-screenshot-1.webp" alt="Karakeep képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Weboldalak mentése: a Karakeep letölti és elteszi a tartalmukat, akkor is, ha az oldal később eltűnik</li><li>Jegyzetek, képek és PDF-ek egy helyen, teljes szöveges kereséssel</li><li>Böngészőbővítmény és telefonos alkalmazás a gyors mentéshez</li><li>AI-címkézés csak akkor, ha te megadsz hozzá egy OpenAI-kulcsot - alapból ki van kapcsolva</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a bookmarks.otthonod.hu címet, és hozd létre a fiókodat (az első fiók lesz az admin)</li><li>Kattints a „Kész, beállítottam&quot; gombra az alkalmazás oldalán - ezután más már nem regisztrálhat</li><li>Telepítsd a böngészőbővítményt vagy a telefonos alkalmazást, és add meg: https://bookmarks.otthonod.hu és egy API-kulcsot (Beállítások, API-kulcsok)</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>bookmarks.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-kimai" role="dialog" aria-label="Kimai">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/kimai-logo.png" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Kimai</h3>
-                    <p class="app-info-tagline">Időkövetés - projektek, ügyfelek és munkaidő nyilvántartás</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/kimai-screenshot-1.webp" alt="Kimai képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Munkaidő nyilvántartás projektekre és ügyfelekre bontva</li><li>Stopper-szerű időmérés egy kattintással</li><li>Riportok és exportálás (PDF, CSV, Excel)</li><li>Költségek és számlázás nyilvántartás</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a time.otthonod.hu címet a böngészőben</li><li>Jelentkezz be a telepítéskor megadott admin adatokkal</li><li>Hozd létre az első ügyfelet és projektet</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>time.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-komga" role="dialog" aria-label="Komga">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/komga-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Komga</h3>
-                    <p class="app-info-tagline">Képregény, manga és könyv szerver webes olvasóval</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/komga-screenshot-1.webp" alt="Komga képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Képregények és mangák rendszerezése és olvasása böngészőben</li><li>Automatikus metaadat szkennelés és borítókép generálás</li><li>OPDS feed kompatibilis olvasó alkalmazásokhoz</li><li>Olvasási haladás szinkronizálás eszközök között</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a comics.otthonod.hu címet a böngészőben</li><li>Hozd létre az admin fiókot az első megnyitáskor</li><li>Add hozzá a könyvtárat (/data)</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>comics.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-lubelogger" role="dialog" aria-label="LubeLogger">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/lubelogger-logo.png" alt="">
-                <div class="app-info-hero-text">
-                    <h3>LubeLogger</h3>
-                    <p class="app-info-tagline">A családi autó teljes története egy helyen: szerviz, javítás, tankolás, költségek</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/lubelogger-screenshot-1.webp" alt="LubeLogger képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Minden szerviz, javítás és műszaki vizsga egy helyen, számlával együtt</li><li>Tankolások és a tényleges fogyasztás - látszik, mennyibe kerül az autó</li><li>Emlékeztetők: olajcsere, műszaki, biztosítás, gumicsere</li><li>Több autó és akár motor vagy kerti gép külön nyilvántartása</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a garazs.otthonod.hu címet, és jelentkezz be a Beállítások oldalon látható névvel és jelszóval</li><li>Vedd fel az első autót (Add Vehicle): évjárat, gyártó, modell, rendszám</li><li>Magyar nyelvhez: Settings, majd a nyelvek listájából töltsd le a hu_HU csomagot - az alkalmazás angolul indul</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>garazs.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-mealie" role="dialog" aria-label="Mealie">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/mealie-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Mealie</h3>
-                    <p class="app-info-tagline">Receptkezelő és étkezés tervező a családnak</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/mealie-screenshot-1.webp" alt="Mealie képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Receptek gyűjtése és rendszerezése kategóriák és címkék szerint</li><li>Receptek importálása weboldalakról automatikusan</li><li>Heti étkezés tervezés és bevásárlólista generálás</li><li>Receptek megosztása családtagokkal és barátokkal</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a mealie.otthonod.hu címet a böngészőben</li><li>Jelentkezz be: changeme@example.com és a Beállítások oldalon látható első jelszó</li><li>Változtasd meg az email címet a sajátodra</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>recipes.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-metube" role="dialog" aria-label="MeTube">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/metube-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>MeTube</h3>
-                    <p class="app-info-tagline">Videók és hanganyagok letöltése egy linkből - csak a családodnak</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/metube-screenshot-1.webp" alt="MeTube képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Egy videó vagy lejátszási lista letöltése a linkjéből, videóként vagy csak hangként</li><li>A letöltések a meghajtódra kerülnek, a fájlböngészőben és a médialejátszódban is látod őket</li><li>Csak a családtagjaid érik el: idegen nem tud letölteni a háztartásod internetcíméről</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Add hozzá a családtagjaidat a Beállítások, Biztonság oldal Család kártyáján</li><li>Nyisd meg a video.otthonod.hu címet, és lépj be a családi neveddel</li><li>Illessz be egy linket, válaszd ki a minőséget, és indítsd el a letöltést</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>video.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-n8n" role="dialog" aria-label="n8n">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/n8n-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>n8n</h3>
-                    <p class="app-info-tagline">Vizuális workflow automatizálás - Zapier/IFTTT alternatíva</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/n8n-screenshot-1.webp" alt="n8n képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Alkalmazások összekapcsolása vizuális workflow szerkesztővel</li><li>Automatizálás: email, Telegram, webhook, fájl feldolgozás</li><li>400+ integráció (Google, Slack, Notion, GitHub, stb.)</li><li>Időzített feladatok (cron) és webhook triggerek</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg az auto.otthonod.hu címet a böngészőben</li><li>Hozd létre az admin fiókot</li><li>Próbálj ki egy sablon workflow-t a Template galériából</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>auto.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-navidrome" role="dialog" aria-label="Navidrome">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/navidrome-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Navidrome</h3>
-                    <p class="app-info-tagline">Könnyű zene szerver - streameld a saját zenegyűjteményedet</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/navidrome-screenshot-1.webp" alt="Navidrome képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Saját zenegyűjtemény streamelése bármilyen eszközről</li><li>Subsonic API kompatibilis mobil alkalmazások használata</li><li>Lejátszási listák, kedvencek és értékelések kezelése</li><li>Automatikus metaadat és borítókép letöltés</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a music.otthonod.hu címet a böngészőben</li><li>Az első felhasználó automatikusan admin lesz</li><li>Hozd létre a fiókodat és várd meg az első szkennelést</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>music.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-nextcloud" role="dialog" aria-label="Nextcloud">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/nextcloud-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Nextcloud</h3>
-                    <p class="app-info-tagline">A saját Google Drive-od - fájlok, naptár, névjegyek egy helyen</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/nextcloud-screenshot-1.webp" alt="Nextcloud képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Fájlok szinkronizálása és megosztása eszközök között</li><li>Naptár és névjegyek szinkronizálás (CalDAV/CardDAV)</li><li>Dokumentumok közös szerkesztése (OnlyOffice integrációval)</li><li>Fotó és videó automatikus feltöltés telefonról</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a cloud.otthonod.hu címet a böngészőben</li><li>Jelentkezz be a telepítéskor megadott admin fiókkal</li><li>Telepítsd a Nextcloud asztali alkalmazást a számítógépedre</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>cloud.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-onlyoffice" role="dialog" aria-label="OnlyOffice">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/onlyoffice-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>OnlyOffice</h3>
-                    <p class="app-info-tagline">Teljes értékű irodai csomag - Word, Excel, PowerPoint a böngészőben</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/onlyoffice-screenshot-1.webp" alt="OnlyOffice képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Dokumentumok, táblázatok és prezentációk szerkesztése böngészőben</li><li>Valós idejű közös szerkesztés több felhasználóval</li><li>Microsoft Office formátumok teljes kompatibilitása (docx, xlsx, pptx)</li><li>Nextcloud és egyéb felhő tárhely integrációk</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg az office.otthonod.hu címet a böngészőben</li><li>Várj amíg az inicializálás befejeződik (1-2 perc)</li><li>A Document Server önmagában API-ként működik</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>office.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-opengist" role="dialog" aria-label="OpenGist">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/opengist-logo.png" alt="">
-                <div class="app-info-hero-text">
-                    <h3>OpenGist</h3>
-                    <p class="app-info-tagline">Kód snippetek megosztása - privát GitHub Gist alternatíva</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/opengist-screenshot-1.webp" alt="OpenGist képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Kód snippetek és szövegek megosztása</li><li>Szintaxis kiemelés sok programozási nyelvhez</li><li>Privát és nyilvános gistek</li><li>Git-alapú tárolás - verziókezelés automatikusan</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a gist.otthonod.hu címet a böngészőben</li><li>Hozd létre a fiókodat (az első felhasználó admin lesz)</li><li>Hozd létre az első gistet - írd be a kódot és mentsd</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>gist.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-outline" role="dialog" aria-label="Outline">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/outline-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Outline</h3>
-                    <p class="app-info-tagline">Modern tudásbázis - Markdown, valós idejű együttműködés, keresés</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/outline-screenshot-1.webp" alt="Outline képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Csapat tudásbázis és dokumentáció</li><li>Markdown szerkesztő valós idejű együttműködéssel</li><li>Strukturált dokumentumok fa-szerkezetben</li><li>Teljes szöveges keresés és hivatkozások</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a kb.otthonod.hu címet a böngészőben</li><li>Hozd létre az első felhasználót</li><li>Hozz létre egy gyűjteményt (Collection) a dokumentumoknak</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>kb.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-paperless-ngx" role="dialog" aria-label="Paperless-ngx">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/paperless-ngx-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Paperless-ngx</h3>
-                    <p class="app-info-tagline">Digitális irattár - szkennelés, OCR és automatikus rendszerezés</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/paperless-ngx-screenshot-1.webp" alt="Paperless-ngx képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Papír dokumentumok digitalizálása és rendszerezése</li><li>Automatikus OCR szövegfelismerés szkennelt dokumentumokon</li><li>Intelligens automatikus kategorizálás és címkézés</li><li>Teljes szöveges keresés az összes dokumentumban</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a paperless.otthonod.hu címet a böngészőben</li><li>Lépj be: felhasználó &quot;admin&quot;, a jelszó a Beállítások oldalon található (Automatikusan generált értékek)</li><li>Tölts fel egy dokumentumot a webfelületen, VAGY dobd a Fájlkezelőben (FileBrowser) az import/paperless mappába — onnan automatikusan beolvassa és OCR-rel feldolgozza. A Fájlkezelő belépése a Fájlkezelő alkalmazás oldalán található</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>paperless.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-papra" role="dialog" aria-label="Papra">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/papra-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Papra</h3>
-                    <p class="app-info-tagline">Minimalista dokumentumtár - egyszerű rendszerezés és keresés</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/papra-screenshot-1.webp" alt="Papra képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Dokumentumok egyszerű feltöltése és rendszerezése</li><li>Gyors keresés a dokumentumok között</li><li>Minimalista felület felesleges funkciók nélkül</li><li>Könnyű alternatíva a Paperless-ngx-hez</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a papra.otthonod.hu címet a böngészőben</li><li>Hozd létre a fiókodat</li><li>Töltsd fel az első dokumentumot</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>papra.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-plex" role="dialog" aria-label="Plex">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/plex-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Plex</h3>
-                    <p class="app-info-tagline">Prémium média szerver kiváló alkalmazás támogatással</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/plex-screenshot-1.webp" alt="Plex képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Filmek, sorozatok és zene streamelése professzionális felületen</li><li>Automatikus transzkódolás bármilyen eszközhöz</li><li>Watch Together - közös filmnézés távolról</li><li>Intro/outro skip funkció (Plex Pass)</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Generálj egy claim tokent a https://plex.tv/claim oldalon</li><li>Telepítés után nyisd meg a plex.otthonod.hu címet</li><li>Kapcsold össze a Plex fiókoddat a szerverrel</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>plex.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-privatebin" role="dialog" aria-label="PrivateBin">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/privatebin-logo.png" alt="">
-                <div class="app-info-hero-text">
-                    <h3>PrivateBin</h3>
-                    <p class="app-info-tagline">Titkosított szöveg megosztás - a szerver nem látja a tartalmat</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/privatebin-screenshot-1.webp" alt="PrivateBin képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Érzékeny szövegek biztonságos megosztása</li><li>E2E titkosítás - a szerver nem fér hozzá a tartalomhoz</li><li>Beállítható lejárati idő (5 perc - 1 év, vagy soha)</li><li>Olvasás után automatikus törlés opció</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a paste.otthonod.hu címet a böngészőben</li><li>Írd be a szöveget és kattints a Küldés gombra</li><li>Oszd meg a generált linket - a titkosítási kulcs az URL-ben van</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>paste.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-radarr" role="dialog" aria-label="Radarr">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/radarr-logo.png" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Radarr</h3>
-                    <p class="app-info-tagline">Automatikus film letöltő és rendszerező</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/radarr-screenshot-1.webp" alt="Radarr képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Filmek automatikus letöltése és rendszerezése</li><li>Kívánságlista - filmek automatikusan a könyvtáradba kerülnek</li><li>Minőség kezelés és automatikus frissítés jobb minőségre</li><li>Integráció Jellyfin/Plex és letöltő kliensekkel</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a radarr.otthonod.hu címet a böngészőben</li><li>Állíts be egy letöltő klienst (pl. qBittorrent)</li><li>Add hozzá az indexereket (vagy használj Prowlarr-t)</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>radarr.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-radicale" role="dialog" aria-label="Radicale">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/radicale-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Radicale</h3>
-                    <p class="app-info-tagline">Naptár és névjegyek a saját szervereden - a telefonod szinkronizál vele</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/radicale-screenshot-1.webp" alt="Radicale képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>A telefonod naptára és névjegyei a saját szervereden, nem a Google-nél vagy az Apple-nél</li><li>Közös családi naptár, amit mindenki lát a telefonján</li><li>Androidon a DAVx5, iPhone-on és Macen a beépített naptár szinkronizál vele</li><li>Thunderbird és más asztali naptárak is használhatják</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a calendar.otthonod.hu címet, és jelentkezz be a Beállítások oldalon látható névvel és jelszóval</li><li>Hozz létre egy naptárat és egy címjegyzéket (&quot;Create new addressbook or calendar&quot;)</li><li>Androidon telepítsd a DAVx5-öt, és add meg: https://calendar.otthonod.hu, a nevet és a jelszót</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>calendar.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-rallly" role="dialog" aria-label="Rallly">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/rallly-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Rallly</h3>
-                    <p class="app-info-tagline">Időpont szavazás - Doodle alternatíva a saját szerveren</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/rallly-screenshot-1.webp" alt="Rallly képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Közös időpont egyeztetés szavazással</li><li>Találkozók, események szervezése</li><li>Résztvevők regisztráció nélkül szavazhatnak</li><li>Email értesítések és emlékeztetők</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a poll.otthonod.hu címet a böngészőben</li><li>Hozz létre egy új szavazást</li><li>Add meg a lehetséges időpontokat</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>poll.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-recipe-importer" role="dialog" aria-label="Recipe Importer">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/recipe-importer-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Recipe Importer</h3>
-                    <p class="app-info-tagline">Magyar receptoldalak importálása egyszerűen — egyedi és tömeges import Mealie-be és Tandoor-ba</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/recipe-importer-screenshot-1.webp" alt="Recipe Importer képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Receptek importálása 6 magyar oldalról: mindmegette.hu, streetkitchen.hu, nosalty.hu, sobors.hu, kiskegyed.hu és gastrohobbi.hu — hozzávalók, lépések, képek és címkék automatikus felismerése</li><li>Tömeges importálás: több URL beillesztése egyszerre, recept-áttekintéssel vagy teljesen automatikus módban</li><li>Importálás előtti szerkesztés — strukturált hozzávalók (mennyiség, mértékegység, étel, megjegyzés), lépések módosítása, címkék kezelése</li><li>Mealie és Tandoor Recipes egyidejű támogatás — választhatsz célrendszert, vagy mindkettőbe importálhatsz egyszerre</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a rimport.otthonod.hu címet a böngészőben</li><li>Menj a Beállítások oldalra és add meg a Mealie és/vagy Tandoor URL-t és API kulcsot (Mealie: Profil → API Tokens; Tandoor: Beállítások → API Browser → Auth Token)</li><li>Állíts be felhasználónevet és jelszót a hozzáférés védelméhez</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>rimport.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-romm" role="dialog" aria-label="RomM">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/romm-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>RomM</h3>
-                    <p class="app-info-tagline">Retró játékgyűjtemény kezelő, böngésző és lejátszó</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/romm-screenshot-1.webp" alt="RomM képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Retró játékgyűjtemény rendszerezése és böngészése webes felületen</li><li>Játékok metaadatainak automatikus letöltése — borítók, leírások, értékelések</li><li>Platformonkénti szűrés és keresés a teljes gyűjteményben</li><li>ROM fájlok webes feltöltése és letöltése</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg az arcade.otthonod.hu címet a böngészőben</li><li>Az első megnyitáskor hozd létre az admin fiókodat</li><li>Változtasd meg azonnal a jelszót a Settings menüben</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>arcade.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-seerr" role="dialog" aria-label="Jellyseerr">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/seerr-logo.png" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Jellyseerr</h3>
-                    <p class="app-info-tagline">Film és sorozat igénylő a háztartás tagjai számára</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/seerr-screenshot-1.webp" alt="Jellyseerr képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Családtagok filmeket és sorozatokat igényelhetnek egyszerűen</li><li>Automatikus letöltés Sonarr/Radarr integrációval</li><li>Elérhető tartalmak böngészése szép felületen</li><li>Igénylések állapotának követése</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a requests.otthonod.hu címet a böngészőben</li><li>Kövesd a beállítás varázslót</li><li>Csatlakoztasd a Jellyfin vagy Plex szerveredet</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>requests.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-sonarr" role="dialog" aria-label="Sonarr">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/sonarr-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Sonarr</h3>
-                    <p class="app-info-tagline">Automatikus sorozat letöltő és rendszerező</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/sonarr-screenshot-1.webp" alt="Sonarr képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Sorozatok automatikus letöltése és rendszerezése</li><li>Kívánságlista kezelés - új epizódok automatikus letöltése</li><li>Minőség kezelés (480p-tól 4K-ig, automatikus frissítés)</li><li>Integráció Jellyfin/Plex és letöltő kliensekkel</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a sonarr.otthonod.hu címet a böngészőben</li><li>Állíts be egy letöltő klienst (pl. qBittorrent)</li><li>Add hozzá az indexereket (vagy használj Prowlarr-t)</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>sonarr.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-sparkyfitness" role="dialog" aria-label="SparkyFitness">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/sparkyfitness-logo.png" alt="">
-                <div class="app-info-hero-text">
-                    <h3>SparkyFitness</h3>
-                    <p class="app-info-tagline">Táplálkozási napló, kalóriaszámláló és edzéskövető – önállóan üzemeltetve</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/sparkyfitness-screenshot-1.webp" alt="SparkyFitness képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Napi étkezések és kalóriabevitel naplózása</li><li>Testsúly és testméretek követése grafikonokkal</li><li>Edzések és mozgás rögzítése</li><li>Tápanyag-célok (fehérje, szénhidrát, zsír) beállítása és követése</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a sparky.otthonod.hu címet a böngészőben</li><li>Regisztrálj egy fiókot e-mail címmel és jelszóval</li><li>Állítsd be a profilodat és a napi céljaidat</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>sparky.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-tandoor" role="dialog" aria-label="Tandoor Recipes">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/tandoor-logo.png" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Tandoor Recipes</h3>
-                    <p class="app-info-tagline">Receptkezelő és étkezés tervező a családnak</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/tandoor-screenshot-1.webp" alt="Tandoor Recipes képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Receptek gyűjtése és rendszerezése egy helyen</li><li>Receptek importálása weboldalakról egy kattintással</li><li>Heti étkezés tervezés és bevásárlólista generálás</li><li>Több felhasználó - a család együtt tervezhet</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a recipes.otthonod.hu címet a böngészőben</li><li>Hozd létre az admin fiókot</li><li>Importáld az első receptet egy weboldalról (Bookmarklet)</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>recipes.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-termix" role="dialog" aria-label="Termix">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/termix-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Termix</h3>
-                    <p class="app-info-tagline">Webes SSH terminál - szerver hozzáférés a böngészőből</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/termix-screenshot-1.webp" alt="Termix képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>SSH hozzáférés a szerveredhez böngészőből</li><li>Nincs szükség SSH kliensre a számítógépen</li><li>Alapvető szerver menedzsment feladatok bárhonnan</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a terminal.otthonod.hu címet a böngészőben</li><li>Csatlakozz a szerveredhez SSH-n keresztül</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>terminal.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-uptime-kuma" role="dialog" aria-label="Uptime Kuma">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/uptime-kuma-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Uptime Kuma</h3>
-                    <p class="app-info-tagline">Szolgáltatás monitoring - értesítés ha valami nem működik</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/uptime-kuma-screenshot-1.webp" alt="Uptime Kuma képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Weboldalak és szolgáltatások elérhetőségének figyelése</li><li>HTTP, TCP, DNS, ping és egyéb protokollok támogatása</li><li>Értesítések emailben, Telegramon, Discord-on, stb.</li><li>Nyilvános státusz oldal a felhasználóknak</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a status.otthonod.hu címet a böngészőben</li><li>Hozd létre az admin fiókot az első megnyitáskor</li><li>Add hozzá az első monitort (pl. a saját weboldalad)</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>status.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-vaultwarden" role="dialog" aria-label="Vaultwarden">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/vaultwarden-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Vaultwarden</h3>
-                    <p class="app-info-tagline">Jelszókezelő - Bitwarden kompatibilis, a saját szerveren</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/vaultwarden-screenshot-1.webp" alt="Vaultwarden képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Jelszavak biztonságos tárolása és automatikus kitöltése</li><li>Bitwarden kliensek teljes kompatibilitása (böngésző, mobil, asztali)</li><li>Jelszavak megosztása családtagokkal szervezeten belül</li><li>Kétfaktoros hitelesítés (TOTP) kódok tárolása</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a vault.otthonod.hu/admin címet, és lépj be az admin panel tokenjével (Beállítások → Automatikusan generált értékek)</li><li>A „Users&quot; fülön az „Invite User&quot; mezőben hívd meg a saját és a családtagok e-mail címét — a regisztráció alapból le van zárva, csak meghívott cím nyithat fiókot</li><li>Nyisd meg a vault.otthonod.hu címet, válaszd a „Create account&quot; lehetőséget a meghívott címmel, és adj meg erős mesterjelszót</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>vault.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-vikunja" role="dialog" aria-label="Vikunja">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/vikunja-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Vikunja</h3>
-                    <p class="app-info-tagline">Feladatkezelő - listák, Kanban táblák és Gantt diagramok</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/vikunja-screenshot-1.webp" alt="Vikunja képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Feladatlisták és teendők kezelése</li><li>Kanban tábla nézet (Trello-szerű)</li><li>Gantt diagram projekt ütemezéshez</li><li>Megosztott listák és csapat együttműködés</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a tasks.otthonod.hu címet a böngészőben</li><li>Hozd létre a fiókodat</li><li>Hozd létre az első projektet és feladatlistát</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>tasks.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-wanderer" role="dialog" aria-label="Wanderer">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/wanderer-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Wanderer</h3>
-                    <p class="app-info-tagline">Túra tervező - útvonalak, GPX nyomok és domborzati térképek</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/wanderer-screenshot-1.webp" alt="Wanderer képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Túra útvonalak tervezése és mentése</li><li>GPX fájlok importálása és exportálása</li><li>Domborzati profilok és statisztikák</li><li>Fotók és jegyzetek hozzáadása az útvonalakhoz</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a hike.otthonod.hu címet a böngészőben</li><li>Hozd létre a fiókodat azonnal a telepítés után, aztán az alkalmazás oldalán zárd le a regisztrációt. Addig bárki, aki megtalálja a címet, fiókot hozhat létre.</li><li>Importálj egy GPX fájlt vagy tervezz új útvonalat</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>hike.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-wishlist" role="dialog" aria-label="Wishlist">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/wishlist-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Wishlist</h3>
-                    <p class="app-info-tagline">Családi kívánságlista - karácsonyra, születésnapokra</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/wishlist-screenshot-1.webp" alt="Wishlist képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Kívánságlisták létrehozása karácsonyra, születésnapokra</li><li>Családtagok meghívása saját listáik kezeléséhez</li><li>Ajándékok lefoglalása meglepetés nélkül</li><li>Árak és linkek hozzáadása az ajándékokhoz</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a wishes.otthonod.hu címet a böngészőben</li><li>Hozd létre a fiókodat</li><li>Hozd létre az első kívánságlistádat</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>wishes.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-zipline" role="dialog" aria-label="Zipline">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/zipline-logo.png" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Zipline</h3>
-                    <p class="app-info-tagline">Screenshot és fájlmegosztó szerver ShareX/Flameshot integrációval</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/zipline-screenshot-1.webp" alt="Zipline képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Screenshotok automatikus feltöltése ShareX/Flameshot-ból</li><li>URL rövidítés és szöveg megosztás (paste)</li><li>Galéria nézet és album kezelés</li><li>API támogatás egyedi integrációkhoz</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg az img.otthonod.hu címet a böngészőben</li><li>Az első megnyitáskor hozd létre az admin fiókodat</li><li>Konfiguráld a ShareX-et vagy Flameshot-ot az API URL-lel</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>img.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-
-    </main>
-    <script>
-    (function(){
-        var b=document.getElementById('navBurger'),s=document.getElementById('sidebar'),k=document.getElementById('navBackdrop');
-        if(!b||!s||!k)return;
-        function open(){s.classList.add('is-open');k.hidden=false;b.setAttribute('aria-expanded','true');}
-        function close(){s.classList.remove('is-open');k.hidden=true;b.setAttribute('aria-expanded','false');}
-        b.addEventListener('click',function(){s.classList.contains('is-open')?close():open();});
-        k.addEventListener('click',close);
-        document.addEventListener('keydown',function(e){if(e.key==='Escape')close();});
-    })();
-    </script>
-</body>
-</html>
diff --git a/website/preview/m1/kapcsolat.html b/website/preview/m1/kapcsolat.html
deleted file mode 100644
index bfc9e99f..00000000
--- a/website/preview/m1/kapcsolat.html
+++ /dev/null
@@ -1,123 +0,0 @@
-<!DOCTYPE html>
-<html lang="hu" class="no-js">
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <meta name="robots" content="noindex, nofollow">
-    <meta name="description" content="Mockup: kapcsolatfelvétel a vezérlőpult felületén.">
-    <title>Kapcsolat · Felhom.eu mockup</title>
-    <script>
-    /* The controller's own progressive-enhancement hook (layout.html): flip no-js -> js before
-       the first CSS-dependent paint, so the off-canvas drawer engages ONLY where the drawer
-       script can open it. Without it the sidebar stays an in-flow flex child on a phone and
-       squeezes the content column - which is exactly what happened here first time. */
-    document.documentElement.className=document.documentElement.className.replace('no-js','js');
-    </script>
-    <link rel="stylesheet" href="/preview/mockup.css?v=1">
-    <link rel="icon" type="image/png" href="/assets/logo_favicon_2.svg">
-</head>
-<body class="mockup">
-    <header class="mobile-topbar">
-        <a href="index.html" class="mobile-topbar-logo"><img src="/assets/logo_notext_white.svg" alt="Felhom.eu"></a>
-        <button type="button" class="nav-burger" id="navBurger" aria-expanded="false" aria-controls="sidebar" aria-label="Menü">
-            <span class="hamburger-box"><span class="hamburger-line"></span><span class="hamburger-line"></span><span class="hamburger-line"></span></span>
-        </button>
-    </header>
-    <div class="nav-backdrop" id="navBackdrop" hidden></div>
-    <nav class="sidebar" id="sidebar">
-        <div class="sidebar-header">
-            <img src="/assets/logo_notext_white.svg" alt="Felhom.eu" class="sidebar-logo">
-        </div>
-        <ul class="nav-links">
-                <li><a href="index.html"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rocket"/></svg>Indítópult</a></li>
-                <li><a href="alkalmazasok.html"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-cloud"/></svg>Alkalmazások</a></li>
-                <li><a href="mentesek.html"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield"/></svg>Biztonsági mentés</a></li>
-                <li><span class="nav-off" title="a saját dobozodon működik"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-hard-drive"/></svg>Tárhely<span class="nav-off-hint">a saját dobozodon működik</span></span></li>
-                <li><span class="nav-off" title="a saját dobozodon működik"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layout-grid"/></svg>Megosztás<span class="nav-off-hint">a saját dobozodon működik</span></span></li>
-                <li><span class="nav-off" title="a saját dobozodon működik"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-cpu"/></svg>Rendszermonitor<span class="nav-off-hint">a saját dobozodon működik</span></span></li>
-                <li><span class="nav-off" title="a saját dobozodon működik"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-settings"/></svg>Beállítások<span class="nav-off-hint">a saját dobozodon működik</span></span></li>
-        </ul>
-        <div class="sidebar-bottom">
-            <div class="nav-group-label">A Felhomról</div>
-            <ul class="nav-links nav-links-sub">
-                    <li><a href="hogyan.html">Hogyan működik</a></li>
-                    <li><a href="teszteles.html">Tesztelés</a></li>
-                    <li><a href="kapcsolat.html" class="active">Kapcsolat</a></li>
-            </ul>
-            <div class="sidebar-footer">
-                <span class="version">mockup</span>
-            </div>
-        </div>
-    </nav>
-    <main class="content">
-        <div class="page-header"><h2>Kapcsolat</h2></div>
-        <p class="form-hint">Írj nekünk bátran. A mockupban az űrlap nem küld semmit.</p>
-
-        <div class="alerts-container">
-            <div class="alert-banner alert-banner-info">
-                <span class="alert-icon"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-info"/></svg></span>
-                <span class="alert-message">Ez egy bemutató oldal: a küldés gomb szándékosan ki van kapcsolva. Az éles űrlap a <a class="alert-link" href="/kapcsolat">felhom.eu/kapcsolat</a> címen működik.</span>
-            </div>
-        </div>
-
-        <form class="mockup-form" onsubmit="return false">
-            <div class="form-row">
-                <div class="form-group">
-                    <label for="name">Név <span class="required">*</span></label>
-                    <input class="form-control" type="text" id="name" name="name" placeholder="Teljes neved">
-                </div>
-                <div class="form-group">
-                    <label for="email">Email <span class="required">*</span></label>
-                    <input class="form-control" type="email" id="email" name="email" placeholder="pelda@email.hu">
-                </div>
-            </div>
-            <div class="form-group">
-                <label for="subject">Tárgy <span class="required">*</span></label>
-                <select class="form-control" id="subject" name="subject">
-                    <option value="" disabled selected>Válassz témát...</option>
-                    <option value="zart-teszt">Zárt teszt: jelentkezem tesztelőnek</option>
-                    <option value="erdeklodes">Érdeklődés: szeretném megismerni a szolgáltatást</option>
-                    <option value="arajanlat">Árajánlat kérés: konkrét igényeim vannak</option>
-                    <option value="tamogatas">Támogatás: meglévő szerveremet érintő kérdés</option>
-                    <option value="egyeb">Egyéb</option>
-                </select>
-            </div>
-            <div class="form-group">
-                <label for="message">Üzenet <span class="required">*</span></label>
-                <textarea class="form-control" id="message" name="message" rows="5" placeholder="Írd le, miben segíthetünk..."></textarea>
-            </div>
-            <div class="checkbox-group">
-                <input type="checkbox" id="privacy" name="privacy">
-                <label for="privacy">Elolvastam az <a href="/adatkezeles" target="_blank" rel="noopener">Adatkezelési tájékoztatót</a>, és hozzájárulok, hogy a megadott nevemet, e-mail-címemet, üzenetemet és csatolt fájljaimat a megkeresésem megválaszolására kezeljék. Az üzenetet levélküldő és levelezési szolgáltatók továbbítják. A hozzájárulásomat bármikor visszavonhatom az info@felhom.eu címen.</label>
-            </div>
-            <div class="form-actions">
-                <button type="submit" class="btn btn-primary" disabled>Üzenet küldése →</button>
-                <span class="nav-off-hint is-inline">a mockupban nem küld, az éles oldalon működik</span>
-            </div>
-        </form>
-
-        <div class="app-info-grid">
-            <div class="app-info-card">
-                <h3>Közvetlen email</h3>
-                <p><a class="app-info-link" href="mailto:info@felhom.eu">info@felhom.eu</a></p>
-            </div>
-            <div class="app-info-card">
-                <h3>Ki áll mögötte</h3>
-                <p>A Felhom mögött egy ember áll: <strong>Nagyfenyvesi Viktor</strong>. Ha írsz, ő válaszol.</p>
-            </div>
-        </div>
-
-    </main>
-    <script>
-    (function(){
-        var b=document.getElementById('navBurger'),s=document.getElementById('sidebar'),k=document.getElementById('navBackdrop');
-        if(!b||!s||!k)return;
-        function open(){s.classList.add('is-open');k.hidden=false;b.setAttribute('aria-expanded','true');}
-        function close(){s.classList.remove('is-open');k.hidden=true;b.setAttribute('aria-expanded','false');}
-        b.addEventListener('click',function(){s.classList.contains('is-open')?close():open();});
-        k.addEventListener('click',close);
-        document.addEventListener('keydown',function(e){if(e.key==='Escape')close();});
-    })();
-    </script>
-</body>
-</html>
diff --git a/website/preview/m1/mentesek.html b/website/preview/m1/mentesek.html
deleted file mode 100644
index f41b65f2..00000000
--- a/website/preview/m1/mentesek.html
+++ /dev/null
@@ -1,113 +0,0 @@
-<!DOCTYPE html>
-<html lang="hu" class="no-js">
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <meta name="robots" content="noindex, nofollow">
-    <meta name="description" content="Mockup: a háromszintű mentés a vezérlőpult felületén.">
-    <title>Biztonsági mentés · Felhom.eu mockup</title>
-    <script>
-    /* The controller's own progressive-enhancement hook (layout.html): flip no-js -> js before
-       the first CSS-dependent paint, so the off-canvas drawer engages ONLY where the drawer
-       script can open it. Without it the sidebar stays an in-flow flex child on a phone and
-       squeezes the content column - which is exactly what happened here first time. */
-    document.documentElement.className=document.documentElement.className.replace('no-js','js');
-    </script>
-    <link rel="stylesheet" href="/preview/mockup.css?v=1">
-    <link rel="icon" type="image/png" href="/assets/logo_favicon_2.svg">
-</head>
-<body class="mockup">
-    <header class="mobile-topbar">
-        <a href="index.html" class="mobile-topbar-logo"><img src="/assets/logo_notext_white.svg" alt="Felhom.eu"></a>
-        <button type="button" class="nav-burger" id="navBurger" aria-expanded="false" aria-controls="sidebar" aria-label="Menü">
-            <span class="hamburger-box"><span class="hamburger-line"></span><span class="hamburger-line"></span><span class="hamburger-line"></span></span>
-        </button>
-    </header>
-    <div class="nav-backdrop" id="navBackdrop" hidden></div>
-    <nav class="sidebar" id="sidebar">
-        <div class="sidebar-header">
-            <img src="/assets/logo_notext_white.svg" alt="Felhom.eu" class="sidebar-logo">
-        </div>
-        <ul class="nav-links">
-                <li><a href="index.html"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rocket"/></svg>Indítópult</a></li>
-                <li><a href="alkalmazasok.html"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-cloud"/></svg>Alkalmazások</a></li>
-                <li><a href="mentesek.html" class="active"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield"/></svg>Biztonsági mentés</a></li>
-                <li><span class="nav-off" title="a saját dobozodon működik"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-hard-drive"/></svg>Tárhely<span class="nav-off-hint">a saját dobozodon működik</span></span></li>
-                <li><span class="nav-off" title="a saját dobozodon működik"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layout-grid"/></svg>Megosztás<span class="nav-off-hint">a saját dobozodon működik</span></span></li>
-                <li><span class="nav-off" title="a saját dobozodon működik"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-cpu"/></svg>Rendszermonitor<span class="nav-off-hint">a saját dobozodon működik</span></span></li>
-                <li><span class="nav-off" title="a saját dobozodon működik"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-settings"/></svg>Beállítások<span class="nav-off-hint">a saját dobozodon működik</span></span></li>
-        </ul>
-        <div class="sidebar-bottom">
-            <div class="nav-group-label">A Felhomról</div>
-            <ul class="nav-links nav-links-sub">
-                    <li><a href="hogyan.html">Hogyan működik</a></li>
-                    <li><a href="teszteles.html">Tesztelés</a></li>
-                    <li><a href="kapcsolat.html">Kapcsolat</a></li>
-            </ul>
-            <div class="sidebar-footer">
-                <span class="version">mockup</span>
-            </div>
-        </div>
-    </nav>
-    <main class="content">
-        <div class="page-header"><h2>Biztonsági mentés</h2>
-            <span class="domain-badge">Áttekintés <span class="sample">minta</span></span></div>
-
-        <div class="alerts-container">
-            <div class="alert-banner alert-banner-info">
-                <span class="alert-icon"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-info"/></svg></span>
-                <span class="alert-message">Ezen az oldalon minden szám <strong>minta</strong>. A saját dobozodon a te mentéseid valódi állapota látszik.</span>
-            </div>
-        </div>
-
-        <div class="stack-grid">
-            <div class="stack-detail-card is-static">
-                <div class="stack-title-text">
-                    <h3><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-hard-drive"/></svg> A dobozon</h3>
-                    <p class="stack-detail-desc">Minden éjjel készül egy mentés a dobozon.</p>
-                    <p class="backup-sample"><strong>Utolsó:</strong> ma 03:12 <span class="sample">minta</span></p>
-                </div>
-            </div>
-            <div class="stack-detail-card is-static">
-                <div class="stack-title-text">
-                    <h3><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg> Második meghajtón</h3>
-                    <p class="stack-detail-desc">Egy másodpéldány egy második meghajtóra, ha van ilyen a dobozban.</p>
-                    <p class="backup-sample"><strong>Utolsó:</strong> ma 03:41 <span class="sample">minta</span></p>
-                </div>
-            </div>
-            <div class="stack-detail-card is-static">
-                <div class="stack-title-text">
-                    <h3><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-lock"/></svg> Titkosítva, távol</h3>
-                    <p class="stack-detail-desc">Egy titkosított másolat egy távoli tárhelyre, az otthonodtól távol.</p>
-                    <p class="backup-sample"><strong>Utolsó:</strong> ma 04:05 <span class="sample">minta</span></p>
-                </div>
-            </div>
-        </div>
-
-        <div class="app-info-grid">
-            <div class="app-info-card">
-                <h3>Helyreállítási kód, amit csak te ismersz</h3>
-                <p>A távoli mentésed titkosításának kulcsa egy helyreállítási kód, ami pontosan egyszer jelenik meg: a te képernyődön. Mi nem ismerjük, és nem tudjuk visszaállítani. Ez azt is jelenti, hogy a kód nélkül a távoli mentés nekünk sem olvasható: tedd el jól.</p>
-            </div>
-            <div class="app-info-card">
-                <h3>Visszaállítás, ha baj van</h3>
-                <p>Egy törölt fájl visszahozható a mentésből. Ha maga a doboz megy tönkre, az újratelepített rendszerre a titkosított távoli mentésből visszahozhatók az alkalmazásaid adatai, a helyreállítási kóddal.</p>
-            </div>
-        </div>
-
-        <p class="form-hint">A megosztott mappáid a második meghajtón és a távoli másolatban is benne vannak.</p>
-
-    </main>
-    <script>
-    (function(){
-        var b=document.getElementById('navBurger'),s=document.getElementById('sidebar'),k=document.getElementById('navBackdrop');
-        if(!b||!s||!k)return;
-        function open(){s.classList.add('is-open');k.hidden=false;b.setAttribute('aria-expanded','true');}
-        function close(){s.classList.remove('is-open');k.hidden=true;b.setAttribute('aria-expanded','false');}
-        b.addEventListener('click',function(){s.classList.contains('is-open')?close():open();});
-        k.addEventListener('click',close);
-        document.addEventListener('keydown',function(e){if(e.key==='Escape')close();});
-    })();
-    </script>
-</body>
-</html>
diff --git a/website/preview/m1/teszteles.html b/website/preview/m1/teszteles.html
deleted file mode 100644
index 6da3a04a..00000000
--- a/website/preview/m1/teszteles.html
+++ /dev/null
@@ -1,93 +0,0 @@
-<!DOCTYPE html>
-<html lang="hu" class="no-js">
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <meta name="robots" content="noindex, nofollow">
-    <meta name="description" content="Mockup: a zárt teszt feltételei és a jelentkezés.">
-    <title>Tesztelés · Felhom.eu mockup</title>
-    <script>
-    /* The controller's own progressive-enhancement hook (layout.html): flip no-js -> js before
-       the first CSS-dependent paint, so the off-canvas drawer engages ONLY where the drawer
-       script can open it. Without it the sidebar stays an in-flow flex child on a phone and
-       squeezes the content column - which is exactly what happened here first time. */
-    document.documentElement.className=document.documentElement.className.replace('no-js','js');
-    </script>
-    <link rel="stylesheet" href="/preview/mockup.css?v=1">
-    <link rel="icon" type="image/png" href="/assets/logo_favicon_2.svg">
-</head>
-<body class="mockup">
-    <header class="mobile-topbar">
-        <a href="index.html" class="mobile-topbar-logo"><img src="/assets/logo_notext_white.svg" alt="Felhom.eu"></a>
-        <button type="button" class="nav-burger" id="navBurger" aria-expanded="false" aria-controls="sidebar" aria-label="Menü">
-            <span class="hamburger-box"><span class="hamburger-line"></span><span class="hamburger-line"></span><span class="hamburger-line"></span></span>
-        </button>
-    </header>
-    <div class="nav-backdrop" id="navBackdrop" hidden></div>
-    <nav class="sidebar" id="sidebar">
-        <div class="sidebar-header">
-            <img src="/assets/logo_notext_white.svg" alt="Felhom.eu" class="sidebar-logo">
-        </div>
-        <ul class="nav-links">
-                <li><a href="index.html"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rocket"/></svg>Indítópult</a></li>
-                <li><a href="alkalmazasok.html"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-cloud"/></svg>Alkalmazások</a></li>
-                <li><a href="mentesek.html"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield"/></svg>Biztonsági mentés</a></li>
-                <li><span class="nav-off" title="a saját dobozodon működik"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-hard-drive"/></svg>Tárhely<span class="nav-off-hint">a saját dobozodon működik</span></span></li>
-                <li><span class="nav-off" title="a saját dobozodon működik"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layout-grid"/></svg>Megosztás<span class="nav-off-hint">a saját dobozodon működik</span></span></li>
-                <li><span class="nav-off" title="a saját dobozodon működik"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-cpu"/></svg>Rendszermonitor<span class="nav-off-hint">a saját dobozodon működik</span></span></li>
-                <li><span class="nav-off" title="a saját dobozodon működik"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-settings"/></svg>Beállítások<span class="nav-off-hint">a saját dobozodon működik</span></span></li>
-        </ul>
-        <div class="sidebar-bottom">
-            <div class="nav-group-label">A Felhomról</div>
-            <ul class="nav-links nav-links-sub">
-                    <li><a href="hogyan.html">Hogyan működik</a></li>
-                    <li><a href="teszteles.html" class="active">Tesztelés</a></li>
-                    <li><a href="kapcsolat.html">Kapcsolat</a></li>
-            </ul>
-            <div class="sidebar-footer">
-                <span class="version">mockup</span>
-            </div>
-        </div>
-    </nav>
-    <main class="content">
-        <div class="page-header"><h2>Zárt teszt</h2></div>
-        <p class="form-hint">Néhány magyar háztartással most kezdjük el élesben használni a rendszert.</p>
-
-        <div class="app-info-grid">
-            <div class="app-info-card">
-                <h3>Valódi használat</h3>
-                <p>Nem demó: a doboz nálad marad, és az igazi fényképeidet, dokumentumaidat teszed rá. Segítünk a telepítésben és az átállásban, utána te használod a mindennapokban.</p>
-            </div>
-            <div class="app-info-card">
-                <h3>Visszajelzés</h3>
-                <p>Cserébe azt kérjük, hogy mondd el, mi zavaró, mi érthetetlen, mi nem működik. Egy „ezt a gombot nem találtam" ér nekünk a legtöbbet: abból tudjuk, mit kell kijavítani.</p>
-            </div>
-        </div>
-
-        <div class="alerts-container">
-            <div class="alert-banner alert-banner-warning">
-                <span class="alert-icon"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-triangle-alert"/></svg></span>
-                <span class="alert-message"><strong>Ismert korlátok, őszintén.</strong>
-                A vezérlőpulthoz jelenleg <strong>egy közös háztartási jelszó</strong> tartozik, külön családtagi fiókok még nincsenek (az egyes alkalmazásoknak viszont saját felhasználóik lehetnek). A <strong>TV-re streamelés (DLNA)</strong> még nincs: egyelőre böngészőből és mobil appból megy a médiatár. És mivel ez teszt, számíts arra, hogy találsz hibát: ez a lényege.</span>
-            </div>
-        </div>
-
-        <div class="form-actions">
-            <a class="btn btn-primary btn-lg" href="kapcsolat.html">Jelentkezem tesztelőnek →</a>
-        </div>
-        <p class="form-hint">Ha ez érdekel, írj. Nem kötelez semmire, először csak beszélgetünk.</p>
-
-    </main>
-    <script>
-    (function(){
-        var b=document.getElementById('navBurger'),s=document.getElementById('sidebar'),k=document.getElementById('navBackdrop');
-        if(!b||!s||!k)return;
-        function open(){s.classList.add('is-open');k.hidden=false;b.setAttribute('aria-expanded','true');}
-        function close(){s.classList.remove('is-open');k.hidden=true;b.setAttribute('aria-expanded','false');}
-        b.addEventListener('click',function(){s.classList.contains('is-open')?close():open();});
-        k.addEventListener('click',close);
-        document.addEventListener('keydown',function(e){if(e.key==='Escape')close();});
-    })();
-    </script>
-</body>
-</html>
diff --git a/website/preview/m2/index.html b/website/preview/m2/index.html
deleted file mode 100644
index ac948a68..00000000
--- a/website/preview/m2/index.html
+++ /dev/null
@@ -1,201 +0,0 @@
-<!DOCTYPE html>
-<html lang="hu">
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <meta name="robots" content="noindex, nofollow">
-    <meta name="description" content="Mockup: rövid nyitóoldal a vezérlőpult kattintható másával.">
-    <title>Felhom.eu · hibrid mockup</title>
-    <link rel="stylesheet" href="/preview/mockup.css?v=1">
-    <link rel="icon" type="image/png" href="/assets/logo_favicon_2.svg">
-</head>
-<body class="mockup m2">
-    <header class="m2-top">
-        <a class="m2-logo" href="#"><img src="/assets/logo-mark.svg" alt=""><img class="m2-word" src="/assets/logo-wordmark.png" alt="felhom.eu"></a>
-        <a class="btn btn-primary" href="/preview/m1/teszteles.html">Jelentkezem tesztelőnek →</a>
-    </header>
-
-    <section class="m2-hero">
-        <div class="m2-hero-text">
-            <h1>Saját felhőd,<br><span>saját szabályaid</span></h1>
-            <p>Egy kis gép az otthonodban: a fényképeid, a dokumentumaid, a filmjeid. Minden éjjel mentés készül. Mi figyeljük, te használod.</p>
-            <a class="btn btn-primary btn-lg" href="/preview/m1/teszteles.html">Jelentkezem tesztelőnek →</a>
-        </div>
-        <div class="m2-window" aria-label="A vezérlőpult kattintható mása">
-            <div class="m2-window-bar">
-                <span class="m2-dot"></span><span class="m2-dot"></span><span class="m2-dot"></span>
-                <span class="m2-window-title">otthonod.hu <span class="sample">minta</span></span>
-            </div>
-            <div class="m2-window-body">
-                <p class="m2-window-lede">Így néz ki a doboz vezérlőpultja. Kattints egy csempére.</p>
-                <div class="launch-grid launch-grid--mini">
-            <a class="launch-cell" href="#app-immich">
-                <span class="launch-tile" style="background: hsl(18, 45%, 38%)">
-                    <span class="launch-mono">I</span>
-                    <img class="launch-logo" src="/assets/immich-logo.svg" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">Immich</span>
-            </a>
-            <a class="launch-cell" href="#app-jellyfin">
-                <span class="launch-tile" style="background: hsl(348, 45%, 38%)">
-                    <span class="launch-mono">J</span>
-                    <img class="launch-logo" src="/assets/jellyfin-logo.svg" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">Jellyfin</span>
-            </a>
-            <a class="launch-cell" href="#app-nextcloud">
-                <span class="launch-tile" style="background: hsl(201, 45%, 38%)">
-                    <span class="launch-mono">N</span>
-                    <img class="launch-logo" src="/assets/nextcloud-logo.svg" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">Nextcloud</span>
-            </a>
-            <a class="launch-cell" href="#app-vaultwarden">
-                <span class="launch-tile" style="background: hsl(66, 45%, 38%)">
-                    <span class="launch-mono">V</span>
-                    <img class="launch-logo" src="/assets/vaultwarden-logo.svg" alt="" loading="lazy">
-                </span>
-                <span class="launch-name">Vaultwarden</span>
-            </a>
-                </div>
-                <a class="app-info-link" href="/preview/m1/">Teljes vezérlőpult megnyitása →</a>
-            </div>
-        </div>
-    </section>
-
-    <section class="m2-section">
-        <h2>Mit tud a doboz ma?</h2>
-        <p>Nem terv és nem ígéret: ezek ma működő funkciók egy éles Felhom dobozon.</p>
-        <div class="app-info-grid">
-            <div class="app-info-card"><h3>Fényképek, dokumentumok, média</h3><p>A telefonod fotói automatikusan feltöltődnek a saját gépedre. A beszkennelt papírjaidat a rendszer felismeri és kereshetővé teszi.</p></div>
-            <div class="app-info-card"><h3>Hálózati megosztás</h3><p>A doboz mappái megjelennek a Windows Intézőben és a Mac Finderben: úgy húzod rájuk a fájlokat, mint bármelyik másik mappára.</p></div>
-            <div class="app-info-card"><h3>58 telepíthető alkalmazás</h3><p>A vezérlőpultból telepíthetők, pár kattintással, parancssor nélkül. Szinte mind nyílt forráskódú, és mind a te gépeden fut.</p></div>
-        </div>
-    </section>
-
-    <section class="m2-section m2-section--alt">
-        <h2>Háromszintű automatikus mentés</h2>
-        <p>Minden éjjel készül egy mentés a dobozon, egy másodpéldány egy második meghajtóra (ha van), és egy titkosított másolat egy távoli tárhelyre. A távoli mentés kulcsa egy helyreállítási kód, ami pontosan egyszer jelenik meg: a te képernyődön. Mi nem ismerjük.</p>
-        <a class="app-info-link" href="/preview/m1/mentesek.html">A mentések oldala →</a>
-    </section>
-
-    <section class="m2-section">
-        <h2>Zárt teszt</h2>
-        <p>Néhány magyar háztartással most kezdjük el élesben használni a rendszert. Őszintén: a vezérlőpulthoz jelenleg egy közös háztartási jelszó tartozik, és a TV-re streamelés (DLNA) még nincs.</p>
-        <a class="app-info-link" href="/preview/m1/teszteles.html">A zárt tesztről →</a>
-    </section>
-
-    <section class="m2-section m2-section--alt">
-        <h2>Ki áll mögötte</h2>
-        <div class="m2-who">
-            <img src="/assets/operator-portrait-small.webp" alt="Nagyfenyvesi Viktor" width="160" height="200" loading="lazy">
-            <p>A Felhom mögött egy ember áll: <strong>Nagyfenyvesi Viktor</strong>. Tíz éve tervez hálózatokat és infrastruktúrát, ma DevOps mérnökként dolgozik. Ha írsz, ő válaszol.
-            <a class="app-info-link" href="/preview/m1/kapcsolat.html">Kapcsolat →</a></p>
-        </div>
-    </section>
-
-    <div class="app-panel" id="app-immich" role="dialog" aria-label="Immich">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/immich-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Immich</h3>
-                    <p class="app-info-tagline">Google Photos alternatíva - automatikus fotó mentés és rendszerezés</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/immich-screenshot-1.webp" alt="Immich képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Fotók és videók automatikus mentése telefonról</li><li>Arc- és tárgyfelismerés gépi tanulással</li><li>Térképes megjelenítés helyszín alapján</li><li>Emlékek és visszatekintések automatikus generálása</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a photos.otthonod.hu címet a böngészőben</li><li>Hozd létre az admin fiókot</li><li>Telepítsd az Immich alkalmazást a telefonodra (Android/iOS)</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>photos.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-jellyfin" role="dialog" aria-label="Jellyfin">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/jellyfin-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Jellyfin</h3>
-                    <p class="app-info-tagline">Ingyenes média szerver - filmek, sorozatok és zene streamelése</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/jellyfin-screenshot-1.webp" alt="Jellyfin képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Filmek, sorozatok és zenék streamelése bármilyen eszközre</li><li>Automatikus metaadat letöltés - borítók, leírások, értékelések</li><li>Élő TV és DVR funkció TV tunerrel</li><li>Több felhasználó külön profillal és szülői felügyelettel</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a media.otthonod.hu címet a böngészőben</li><li>Kövesd a beállítás varázslót - válaszd a magyar nyelvet</li><li>Hozd létre az admin fiókot</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>media.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-nextcloud" role="dialog" aria-label="Nextcloud">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/nextcloud-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Nextcloud</h3>
-                    <p class="app-info-tagline">A saját Google Drive-od - fájlok, naptár, névjegyek egy helyen</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/nextcloud-screenshot-1.webp" alt="Nextcloud képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Fájlok szinkronizálása és megosztása eszközök között</li><li>Naptár és névjegyek szinkronizálás (CalDAV/CardDAV)</li><li>Dokumentumok közös szerkesztése (OnlyOffice integrációval)</li><li>Fotó és videó automatikus feltöltés telefonról</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a cloud.otthonod.hu címet a böngészőben</li><li>Jelentkezz be a telepítéskor megadott admin fiókkal</li><li>Telepítsd a Nextcloud asztali alkalmazást a számítógépedre</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>cloud.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <div class="app-panel" id="app-vaultwarden" role="dialog" aria-label="Vaultwarden">
-        <div class="app-panel-card">
-            <a class="app-panel-close" href="#" aria-label="Bezárás"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-x"/></svg></a>
-            <div class="app-info-hero">
-                <img class="app-info-logo" src="/assets/vaultwarden-logo.svg" alt="">
-                <div class="app-info-hero-text">
-                    <h3>Vaultwarden</h3>
-                    <p class="app-info-tagline">Jelszókezelő - Bitwarden kompatibilis, a saját szerveren</p>
-                </div>
-            </div>
-            <img class="app-screenshot" src="/assets/vaultwarden-screenshot-1.webp" alt="Vaultwarden képernyőkép" loading="lazy">
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Mire jó egy családnak?</h3>
-                    <ul class="app-info-list"><li>Jelszavak biztonságos tárolása és automatikus kitöltése</li><li>Bitwarden kliensek teljes kompatibilitása (böngésző, mobil, asztali)</li><li>Jelszavak megosztása családtagokkal szervezeten belül</li><li>Kétfaktoros hitelesítés (TOTP) kódok tárolása</li></ul>
-                </div>
-                <div class="app-info-card">
-                    <h3>Első lépések</h3>
-                    <ul class="app-info-list"><li>Nyisd meg a vault.otthonod.hu/admin címet, és lépj be az admin panel tokenjével (Beállítások → Automatikusan generált értékek)</li><li>A „Users&quot; fülön az „Invite User&quot; mezőben hívd meg a saját és a családtagok e-mail címét — a regisztráció alapból le van zárva, csak meghívott cím nyithat fiókot</li><li>Nyisd meg a vault.otthonod.hu címet, válaszd a „Create account&quot; lehetőséget a meghívott címmel, és adj meg erős mesterjelszót</li></ul>
-                </div>
-            </div>
-            <p class="form-hint">Telepítés: pár kattintás a vezérlőpultból. A saját dobozodon a
-               <strong>vault.otthonod.hu</strong> címen érnéd el. <span class="sample">minta</span></p>
-        </div>
-    </div>
-    <footer class="m2-foot">
-        <p>© 2026 felhom.eu – Saját felhőd, saját szabályaid · <span class="sample">mockup, nem éles oldal</span></p>
-    </footer>
-</body>
-</html>
diff --git a/website/preview/m3/404.html b/website/preview/m3/404.html
deleted file mode 100644
index fcb286b3..00000000
--- a/website/preview/m3/404.html
+++ /dev/null
@@ -1,167 +0,0 @@
-<!DOCTYPE html>
-<html lang="hu" class="no-js">
-<head>
-    <script>document.documentElement.className=document.documentElement.className.replace('no-js','js');</script>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Az oldal nem található | Felhom.eu</title>
-    <meta name="robots" content="noindex, follow">
-    <!-- shared assets: bump ?v= together on any site.css/icons.svg change -->
-    <link rel="stylesheet" href="/assets/site.css?v=21">
-    <link rel="stylesheet" href="/assets/shell.css?v=21">
-    <link rel="icon" type="image/png" href="/assets/logo_favicon_2.svg">
-    <script defer src="https://stats.felhom.eu/script.js" data-website-id="d419db57-5e1c-48df-bdb3-c29f25fb1661"></script>
-</head>
-<body class="shell page-404">
-    <header class="mobile-topbar">
-        <a href="/preview/m3/" class="mobile-topbar-logo"><img src="/assets/logo_notext_white.svg" alt="Felhom.eu"></a>
-        <button type="button" class="nav-burger" id="navBurger" aria-expanded="false" aria-controls="sidebar" aria-label="Menü">
-            <span class="hamburger-box"><span class="hamburger-line"></span><span class="hamburger-line"></span><span class="hamburger-line"></span></span>
-        </button>
-    </header>
-    <div class="nav-backdrop" id="navBackdrop" hidden></div>
-    <nav class="sidebar" id="sidebar">
-        <div class="sidebar-header">
-            <a href="/preview/m3/" class="sidebar-logo-link">
-                <img src="/assets/logo_notext_white.svg" alt="" class="sidebar-logo" aria-hidden="true">
-                <img src="/assets/logo-wordmark.png" alt="felhom.eu" class="sidebar-word">
-            </a>
-        </div>
-        <ul class="nav-links">
-                <li><a href="/preview/m3/"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg>Kezdőlap</a></li>
-                <li><a href="/preview/m3/#szolgaltatasok"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rocket"/></svg>Szolgáltatások</a></li>
-                <li class="nav-group">
-                    <button type="button" class="nav-group-toggle" aria-expanded="false" aria-controls="nav-group-apps"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg>Alkalmazások<svg class="ico nav-chevron" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chevron-down"/></svg></button>
-                    <ul id="nav-group-apps" class="nav-links nav-links-sub nav-links-nested">
-                        <li><a href="/preview/m3/alkalmazasok">Minden alkalmazás</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#fajlkezeles-irodai">Fájlkezelés &amp; Irodai</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#media-szorakozas">Média &amp; Szórakozás</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#otthon-eletmod">Otthon &amp; Életmód</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#produktivitas-tudaskezeles">Produktivitás &amp; Tudáskezelés</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#rendszer-fejlesztes">Rendszer &amp; Fejlesztés</a></li>
-                    </ul>
-                </li>
-                <li><a href="/preview/m3/technologiak"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg>Technológiák</a></li>
-                <li><a href="/preview/m3/biztonsagimentes"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg>Biztonsági mentés</a></li>
-        </ul>
-        <div class="sidebar-bottom">
-            <a href="/preview/m3/teszteles" class="btn btn-outline sidebar-cta">Jelentkezem tesztelőnek →</a>
-            <div class="nav-group-label">A Felhomról</div>
-            <ul class="nav-links nav-links-sub">
-                    <li><a href="/preview/m3/#hogyan-mukodik">Hogyan működik</a></li>
-                    <li><a href="/preview/m3/gyik">GYIK</a></li>
-                    <li><a href="/preview/m3/kapcsolat">Kapcsolat</a></li>
-            </ul>
-            <div class="sidebar-footer">
-                <details class="lang-globe"><summary class="lang-globe-btn" aria-label="Nyelv" title="Nyelv"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="#" lang="hu" hreflang="hu" class="lang-globe-item current" aria-current="true">Magyar</a></li><li><a href="#" lang="en" hreflang="en" class="lang-globe-item">English</a></li></ul></details>
-            </div>
-        </div>
-    </nav>
-<main class="content">
-                <div class="page-header">
-                <h1>Ez az oldal <span>nem található</span></h1>
-            </div>
-                <p class="page-lede">A keresett cím nem létezik, vagy elköltözött. A kezdőlapról mindent elérsz.</p>
-                <p lang="en">This page does not exist. <a href="/en/">Go to the English home page</a>.</p>
-
-        <section class="content-section">
-            <div class="container">
-                <div class="apps-cta">
-                    <a href="/" class="cta-button">Vissza a kezdőlapra →</a>
-                </div>
-            </div>
-        </section>
-    </main>
-    <script>
-    (function() {
-        var hamburger = document.getElementById('hamburger');
-        var navLinks = document.querySelector('.nav-links');
-        var overlay = document.getElementById('mobileOverlay');
-        var body = document.body;
-
-        if (!hamburger || !navLinks || !overlay) {
-            console.warn('[mobile-menu] Missing elements:', {
-                hamburger: !!hamburger,
-                navLinks: !!navLinks,
-                overlay: !!overlay
-            });
-            return;
-        }
-
-        function openMenu() {
-            hamburger.classList.add('is-active');
-            navLinks.classList.add('is-open');
-            overlay.classList.add('is-visible');
-            body.classList.add('menu-open');
-            hamburger.setAttribute('aria-expanded', 'true');
-            hamburger.setAttribute('aria-label', 'Menü bezárása');
-        }
-
-        function closeMenu() {
-            hamburger.classList.remove('is-active');
-            navLinks.classList.remove('is-open');
-            overlay.classList.remove('is-visible');
-            body.classList.remove('menu-open');
-            hamburger.setAttribute('aria-expanded', 'false');
-            hamburger.setAttribute('aria-label', 'Menü megnyitása');
-        }
-
-        hamburger.addEventListener('click', function() {
-            if (navLinks.classList.contains('is-open')) {
-                closeMenu();
-            } else {
-                openMenu();
-            }
-        });
-
-        overlay.addEventListener('click', closeMenu);
-
-        navLinks.querySelectorAll('a').forEach(function(link) {
-            link.addEventListener('click', closeMenu);
-        });
-
-        document.addEventListener('keydown', function(e) {
-            if (e.key === 'Escape' && navLinks.classList.contains('is-open')) {
-                closeMenu();
-            }
-        });
-
-        window.addEventListener('resize', function() {
-            if (window.innerWidth > 900 && navLinks.classList.contains('is-open')) {
-                closeMenu();
-            }
-        });
-    })();
-    </script>
-<footer>
-        <div class="container">
-            <p>© 2026 felhom.eu – Saját felhőd, saját szabályaid</p>
-            <p class="footer-legal">Üzemeltető: Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Adatkezelési tájékoztató</a> · <a href="/feltetelek">Feltételek</a></p>
-        </div>
-    </footer>
-    <script>
-    (function(){
-        var b=document.getElementById('navBurger'),s=document.getElementById('sidebar'),k=document.getElementById('navBackdrop');
-        if(!b||!s||!k)return;
-        function open(){s.classList.add('is-open');k.hidden=false;document.body.classList.add('nav-open');b.setAttribute('aria-expanded','true');}
-        function close(){s.classList.remove('is-open');k.hidden=true;document.body.classList.remove('nav-open');b.setAttribute('aria-expanded','false');}
-        b.addEventListener('click',function(){s.classList.contains('is-open')?close():open();});
-        k.addEventListener('click',close);
-        document.addEventListener('keydown',function(e){if(e.key==='Escape'&&s.classList.contains('is-open')){close();b.focus();}});
-        s.querySelectorAll('a').forEach(function(l){l.addEventListener('click',close);});
-        window.addEventListener('resize',function(){if(window.innerWidth>768)close();});
-    })();
-    document.addEventListener('click',function(e){
-        var btn=e.target.closest?e.target.closest('.nav-group-toggle'):null;
-        if(!btn)return;
-        var g=btn.closest('.nav-group');if(!g)return;
-        var willOpen=!g.classList.contains('is-open');
-        document.querySelectorAll('.nav-group.is-open').forEach(function(x){
-            x.classList.remove('is-open');
-            var t=x.querySelector('.nav-group-toggle');if(t)t.setAttribute('aria-expanded','false');
-        });
-        if(willOpen){g.classList.add('is-open');btn.setAttribute('aria-expanded','true');}
-    });
-    </script>
-</body>
-</html>
diff --git a/website/preview/m3/adatkezeles.html b/website/preview/m3/adatkezeles.html
deleted file mode 100644
index abaef141..00000000
--- a/website/preview/m3/adatkezeles.html
+++ /dev/null
@@ -1,458 +0,0 @@
-<!DOCTYPE html>
-<html lang="hu" class="no-js">
-<head>
-    <script>document.documentElement.className=document.documentElement.className.replace('no-js','js');</script>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Adatkezelési tájékoztató | Felhom.eu</title>
-    <meta name="description" content="Mit kezelünk rólad, miért, meddig, és kik látják még. A Felhom.eu adatkezelési tájékoztatója, egyszerűen leírva.">
-    <meta name="robots" content="index, follow">
-    <link rel="canonical" href="https://felhom.eu/adatkezeles">
-    <link rel="alternate" hreflang="hu" href="https://felhom.eu/adatkezeles">
-    <link rel="alternate" hreflang="x-default" href="https://felhom.eu/adatkezeles">
-
-    <meta property="og:type" content="article">
-    <meta property="og:url" content="https://felhom.eu/adatkezeles">
-    <meta property="og:title" content="Adatkezelési tájékoztató — Felhom.eu">
-    <meta property="og:description" content="Mit kezelünk rólad, miért, meddig, és kik látják még. A Felhom.eu adatkezelési tájékoztatója, egyszerűen leírva.">
-    <meta property="og:image" content="https://felhom.eu/assets/og-image.png">
-    <meta property="og:locale" content="hu_HU">
-    <meta property="og:site_name" content="Felhom.eu">
-
-    <!-- shared assets: bump ?v= together on any site.css/icons.svg change -->
-    <link rel="stylesheet" href="/assets/site.css?v=21">
-    <link rel="stylesheet" href="/assets/shell.css?v=21">
-    <link rel="icon" type="image/png" href="/assets/logo_favicon_2.svg">
-    <script defer src="https://stats.felhom.eu/script.js" data-website-id="d419db57-5e1c-48df-bdb3-c29f25fb1661"></script>
-</head>
-<body class="shell page-adatkezeles">
-    <header class="mobile-topbar">
-        <a href="/preview/m3/" class="mobile-topbar-logo"><img src="/assets/logo_notext_white.svg" alt="Felhom.eu"></a>
-        <button type="button" class="nav-burger" id="navBurger" aria-expanded="false" aria-controls="sidebar" aria-label="Menü">
-            <span class="hamburger-box"><span class="hamburger-line"></span><span class="hamburger-line"></span><span class="hamburger-line"></span></span>
-        </button>
-    </header>
-    <div class="nav-backdrop" id="navBackdrop" hidden></div>
-    <nav class="sidebar" id="sidebar">
-        <div class="sidebar-header">
-            <a href="/preview/m3/" class="sidebar-logo-link">
-                <img src="/assets/logo_notext_white.svg" alt="" class="sidebar-logo" aria-hidden="true">
-                <img src="/assets/logo-wordmark.png" alt="felhom.eu" class="sidebar-word">
-            </a>
-        </div>
-        <ul class="nav-links">
-                <li><a href="/preview/m3/"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg>Kezdőlap</a></li>
-                <li><a href="/preview/m3/#szolgaltatasok"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rocket"/></svg>Szolgáltatások</a></li>
-                <li class="nav-group">
-                    <button type="button" class="nav-group-toggle" aria-expanded="false" aria-controls="nav-group-apps"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg>Alkalmazások<svg class="ico nav-chevron" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chevron-down"/></svg></button>
-                    <ul id="nav-group-apps" class="nav-links nav-links-sub nav-links-nested">
-                        <li><a href="/preview/m3/alkalmazasok">Minden alkalmazás</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#fajlkezeles-irodai">Fájlkezelés &amp; Irodai</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#media-szorakozas">Média &amp; Szórakozás</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#otthon-eletmod">Otthon &amp; Életmód</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#produktivitas-tudaskezeles">Produktivitás &amp; Tudáskezelés</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#rendszer-fejlesztes">Rendszer &amp; Fejlesztés</a></li>
-                    </ul>
-                </li>
-                <li><a href="/preview/m3/technologiak"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg>Technológiák</a></li>
-                <li><a href="/preview/m3/biztonsagimentes"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg>Biztonsági mentés</a></li>
-        </ul>
-        <div class="sidebar-bottom">
-            <a href="/preview/m3/teszteles" class="btn btn-outline sidebar-cta">Jelentkezem tesztelőnek →</a>
-            <div class="nav-group-label">A Felhomról</div>
-            <ul class="nav-links nav-links-sub">
-                    <li><a href="/preview/m3/#hogyan-mukodik">Hogyan működik</a></li>
-                    <li><a href="/preview/m3/gyik">GYIK</a></li>
-                    <li><a href="/preview/m3/kapcsolat">Kapcsolat</a></li>
-            </ul>
-            <div class="sidebar-footer">
-                <details class="lang-globe"><summary class="lang-globe-btn" aria-label="Nyelv" title="Nyelv"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/preview/m3/adatkezeles" lang="hu" hreflang="hu" class="lang-globe-item current" aria-current="true">Magyar</a></li><li><a href="#" lang="en" hreflang="en" class="lang-globe-item">English</a></li></ul></details>
-            </div>
-        </div>
-    </nav>
-<main class="content">
-
-
-        <header class="page-header">
-        <div class="container">
-            <h1>Adatkezelési tájékoztató</h1>
-            <p>Mit kezelünk rólad, miért, meddig, és kik látják még. Egyszerűen leírva.</p>
-        </div>
-    </header>
-
-    <section class="section">
-        <div class="container legal">
-
-            <p class="legal-version"><strong>Zárt teszt — 1.0 verzió, hatályos: 2026. október 9.</strong></p>
-
-            <h2>1. Ki kezeli az adataidat?</h2>
-            <!-- source: operator ruling 2026-10-09 (no company exists yet; the operator is named as a private person) -->
-            <ul>
-                <li><strong>Név:</strong> Nagyfenyvesi Viktor — magánszemélyként. A Felhom ma még nem cég.</li>
-                <li><strong>E-mail:</strong> <a href="mailto:info@felhom.eu">info@felhom.eu</a></li>
-                <li><strong>Adatvédelmi tisztviselő:</strong> nincs kijelölve.</li>
-            </ul>
-            <p>Az alábbiakban: <strong>Felhom</strong> vagy <strong>mi</strong>.</p>
-
-            <h2>2. Kétféle szerepünk van</h2>
-            <p>
-                <strong>Az egyik:</strong> a weboldal látogatóinak, a kapcsolatfelvételi űrlap kitöltőinek és
-                a zárt teszt résztvevőinek adatait mi kezeljük. Erről szól ez a tájékoztató.
-            </p>
-            <p>
-                <strong>A másik:</strong> a nálad lévő szerveren tárolt adatok (fényképek, dokumentumok,
-                alkalmazásadatok) <em>a tieid</em>. Azokat mi csak üzemeltetjük, felügyeljük és mentjük.
-                Ahol ez a tájékoztató ezeket érinti (mentés, hozzáférés), azt azért írjuk le, hogy lásd,
-                mi történik velük. Külön adatfeldolgozási megállapodás a zárt teszt alatt még nincs.
-            </p>
-            <!-- source: documentation/backlog/ROADMAP.md:53 (R-809: data-processing agreement not written) -->
-
-            <h2>3. A weboldal (felhom.eu)</h2>
-
-            <h3>3.1 Sütik: egyet sem használunk</h3>
-            <p>
-                A weboldal <strong>egyetlen sütit sem helyez el</strong> a böngésződben, és nem használ
-                helyi tárolót sem. Ezt 2026. október 9-én megmértük: a böngészőben a sütik, a
-                <span class="nowrap">localStorage</span> és a <span class="nowrap">sessionStorage</span>
-                üresek maradtak az oldal betöltése és a látogatottság-mérés lefutása után is, és egyetlen
-                válasz sem küldött sütit.
-            </p>
-            <!-- source: measured 2026-10-09 in the operator's Chrome: document.cookie "", localStorage/sessionStorage empty after the Umami beacon fired, with a positive control (a probe cookie WAS visible to the same method); curl -I on felhom.eu/ and stats.felhom.eu/script.js: 0 Set-Cookie headers -->
-
-            <h3>3.2 Látogatottság-mérés</h3>
-            <p>
-                Azt mérjük, hány oldalmegtekintés történik. Az eszköz az <strong>Umami</strong>, amelyet
-                <strong>mi magunk üzemeltetünk</strong> a saját szerverünkön (a <code>stats.felhom.eu</code>
-                címen). Az adatok nem jutnak külső elemző céghez.
-            </p>
-            <p>A böngésződ ezeket küldi el egy oldalmegtekintéskor (megmérve, 2026. október 9.):</p>
-            <ul>
-                <li>a weboldal saját azonosítója (nem a tiéd),</li>
-                <li>a képernyő mérete,</li>
-                <li>a böngésző nyelve,</li>
-                <li>az oldal címe és webcíme,</li>
-                <li>a hivatkozó oldal, ha máshonnan érkeztél.</li>
-            </ul>
-            <p>
-                Ezen felül a kiszolgálónk — mint minden webkiszolgáló — látja az <strong>IP-címedet</strong>
-                és a böngésződ azonosítóját; a program ezekből országot és böngészőtípust állapít meg.
-                A böngésződ nem küld rólad egyedi azonosítót.
-            </p>
-            <!-- source: measured 2026-10-09, the actual beacon body to stats.felhom.eu/api/send: {"type":"event","payload":{"website":"d419db57-…","screen":"1920x1080","language":"en-US","title":"…","hostname":"felhom.eu","url":"…","referrer":""}} -->
-            <p>
-                <strong>Meddig:</strong> a mérőprogramban ma <strong>nincs beállítva automatikus törlés</strong>,
-                tehát a statisztika határozatlan ideig megmarad. Ezt őszintén leírjuk, mert nem akarunk olyan
-                határidőt ígérni, amit semmi nem tart be.
-            </p>
-            <!-- source: manifests/umami.yaml:194-206 (env: only DATABASE_URL, APP_SECRET, DISABLE_TELEMETRY, TZ — no retention setting) -->
-            <p><strong>Jogalap:</strong> jogos érdek (GDPR 6. cikk (1) f) — hogy lássuk, használják-e az oldalt.</p>
-
-            <h3>3.3 Szervernaplók</h3>
-            <p>
-                A weboldalt kiszolgáló program (nginx) a kéréseket naplózhatja, köztük az IP-címedet. Külön
-                naplózási vagy megőrzési beállítást nem adtunk meg, tehát az alapértelmezés működik, és
-                <strong>megőrzési időt erre sem állítottunk be</strong>.
-            </p>
-            <!-- source: manifests/webpage.yaml (nginx:alpine; no access_log/log_format directive anywhere) -->
-
-            <h3>3.4 Külső tartalom és a DNS</h3>
-            <p>
-                A weboldal nem tölt be külső betűtípust, külső szkriptet, beágyazott videót vagy hirdetést.
-                A saját mérőprogramunkon kívül semmi nem töltődik be máshonnan.
-            </p>
-            <!-- source: measured 2026-10-09 in the browser: the only script sources are felhom.eu/assets/gallery.js and stats.felhom.eu/script.js; no external stylesheet, no iframe -->
-            <p>
-                A <code>felhom.eu</code> névfeloldását (DNS) a <strong>Cloudflare</strong> végzi, de
-                <strong>csak névfeloldást</strong>: a weboldal forgalma nem halad át a Cloudflare-en.
-                Ezt megmértük — a <code>felhom.eu</code> nyilvános címbejegyzése a mi saját kiszolgálónkra
-                mutat, nem a Cloudflare hálózatára.
-            </p>
-            <!-- source: measured 2026-10-09 from DooPlex: dig @1.1.1.1 and @8.8.8.8 felhom.eu A -> 37.191.56.193 (not a Cloudflare address range); NS -> martha/tony.ns.cloudflare.com; curl -I https://felhom.eu/ returns no cf-ray header -->
-
-            <h2>4. Kapcsolatfelvételi űrlap és e-mail</h2>
-            <p>
-                <strong>Mit adsz meg:</strong> a nevedet, az e-mail-címedet, a választott tárgyat, az üzenetet
-                és a csatolt fájlokat (legfeljebb 5 fájl, összesen 20 MB).
-            </p>
-            <!-- source: website/kapcsolat.html:78-111 (fields), :193-196 (maxFiles 5, 20 MB) -->
-            <p><strong>Mire használjuk:</strong> hogy válaszoljunk neked.</p>
-            <p>
-                <strong>Hogyan jut el hozzánk:</strong> a böngésződ elküldi a saját kis programunknak, az
-                e-mailt a <strong>Resend</strong> levélküldő szolgáltatás továbbítja az
-                <code>info@felhom.eu</code> címre, ahová a leveleket a <strong>Cloudflare Email Routing</strong>
-                viszi tovább egy <strong>Gmail</strong>-postafiókba. Ott olvassuk el. Ha közvetlenül írsz az
-                <code>info@felhom.eu</code> címre, ugyanez az út érvényes, a Resend nélkül.
-            </p>
-            <!-- source: manifests/contact-mailer.yaml:1-2, :66-69; README.md:133-135, :146-151 -->
-            <p>
-                <strong>Meddig:</strong> amíg a megkeresésed le nem zárul, és utána is, amíg a levelezésünkben
-                marad. <strong>Automatikus törlés ma nincs beállítva.</strong> Ha szeretnéd, hogy töröljük a
-                leveledet, írj az <a href="mailto:info@felhom.eu">info@felhom.eu</a> címre, és töröljük.
-            </p>
-            <p>
-                <strong>Jogalap:</strong> a hozzájárulásod (GDPR 6. cikk (1) a). Ha árajánlatot kérsz, a
-                szerződéskötést megelőző lépés is lehet a jogalap (6. cikk (1) b).
-            </p>
-
-            <h2>5. A Facebook-oldalunk és a Messenger</h2>
-            <p>
-                Van egy Facebook-oldalunk: <code>facebook.com/felhom.eu</code>. Ha meglátogatod vagy írsz
-                nekünk a Messengeren, a Meta a saját szabályai szerint kezeli az adataidat — ezt mi nem tudjuk
-                megváltoztatni.
-            </p>
-            <p>
-                Az oldal <strong>látogatottsági statisztikájáért</strong> („Oldalelemzések") a Meta és mi
-                <strong>közös adatkezelők</strong> vagyunk a GDPR 26. cikke szerint. Mi csak összesített
-                számokat látunk, azt nem, hogy ki járt az oldalon. A Messengeren küldött üzenetedet
-                elolvassuk, és ugyanúgy kezeljük, mint egy e-mailt.
-            </p>
-            <ul>
-                <li>A Meta kiegészítése az Oldalelemzésekről:
-                    <a href="https://www.facebook.com/legal/terms/page_controller_addendum" target="_blank" rel="noopener">facebook.com/legal/terms/page_controller_addendum</a></li>
-                <li>A Meta adatkezelési szabályzata:
-                    <a href="https://www.facebook.com/privacy/policy/" target="_blank" rel="noopener">facebook.com/privacy/policy</a></li>
-            </ul>
-            <!-- source: read 2026-10-09 — https://www.facebook.com/legal/terms/page_controller_addendum, title "Tudnivalók az Oldalelemzésekről", section "Az Oldalelemzések funkció adatkezelői függeléke": Meta Platforms Ireland Limited and the Page admin are joint controllers under GDPR Art. 26 for Page Insights; effective 25 April 2023 -->
-
-            <h2>6. A zárt teszt résztvevőinek adatai a központi rendszerünkben</h2>
-            <p>
-                A szervered rendszeresen jelentést küld a központi rendszerünknek
-                (<code>hub.felhom.eu</code>), hogy lássuk, minden rendben van-e. Ezeket tároljuk:
-            </p>
-            <ul>
-                <li><strong>Azonosítód, neved, domained, e-mail-címed, nyelved</strong> — amíg törölünk téged a rendszerből.
-                    <!-- source: hub/internal/store/store.go:161-171, :223 --></li>
-                <li><strong>A szerver állapotjelentései</strong> (gépnév, processzor-, memória- és lemezhasználat, hőmérséklet,
-                    a telepített alkalmazások neve és állapota, a mentések állapota) — <strong>90 nap</strong>.
-                    <!-- source: manifests/hub.yaml:78 (retention.max_days: 90); hub/internal/store/store.go:1528-1540 --></li>
-                <li><strong>Események</strong> (például „a mentés nem sikerült") — <strong>90 nap</strong>.
-                    <!-- source: hub/internal/store/store.go:2695-2702 (PruneEvents) --></li>
-                <li><strong>Alkalmazásonkénti erőforrás-statisztika</strong> — <strong>90 nap</strong>.
-                    <!-- source: hub/cmd/hub/main.go:1022 --></li>
-                <li><strong>Alkalmazásnaplókból kiszűrt hibaüzenetek</strong>, kitakarva — az utolsó előfordulás után <strong>30 nap</strong>.
-                    <!-- source: hub/cmd/hub/main.go:1027 (PruneStaleIssues 30 days); hub/internal/store/telemetry.go:35 --></li>
-                <li><strong>Naplórészlet, csak ha külön kérjük</strong>, kitakarva — alkalmazásonként a legutóbbi kettő, és a törlésedkor törlődik.
-                    <!-- source: hub/internal/store/logtail.go:74-82; customer_delete.go:57-58 --></li>
-                <li><strong>Diagnosztikai naplócsomag, csak külön kérésre</strong> — <strong>72 óra</strong>.
-                    <!-- source: hub/internal/store/logbundle.go:28-29 (logBundleTTL = 72h) --></li>
-                <li><strong>A kiküldött értesítések naplója</strong> — a törlésed után <strong>1 évig</strong>, aztán törlődik.
-                    Amíg aktív vagy, erre nincs megőrzési idő.
-                    <!-- source: operator ruling 2026-10-08 09:04, 09 §3 decision 181; hub/internal/store/deleted_customer_audit.go --></li>
-                <li><strong>A visszaállítások és a szervertörlés naplója</strong> — ezt <strong>nem töröljük</strong>, hogy utólag is elszámoltatható legyen, ki mit tett.
-                    <!-- source: hub/internal/store/store.go:734 ("NEVER pruned") --></li>
-                <li><strong>A mentésed titkosító kulcsa, a helyreállító kódoddal lezárva</strong> — amíg törölünk téged.
-                    <!-- source: hub/internal/store/store.go:400-446 --></li>
-                <li><strong>A szerver vészhelyzeti konzoljelszava, titkosítva</strong> — amíg a szervert töröljük.
-                    <!-- source: hub/internal/store/store.go:552-564 --></li>
-            </ul>
-            <p>
-                <strong>A kulcsletétről, egyszerűen:</strong> a mentésed kulcsát csak lezárt formában tároljuk.
-                Kinyitni csak a <strong>helyreállító kódoddal</strong> lehet, ami nálunk nincs meg. Ha elveszíted
-                ezt a kódot, a távoli mentésed nem nyitható ki — mi sem tudjuk kinyitni.
-            </p>
-            <!-- source: documentation/architecture/07-backup-architecture.md:67-75 ("genuinely zero-knowledge… R exists in zero system copies by design") -->
-            <p>
-                A központi rendszer adatbázisáról éjjelente mentés készül, titkosítva, a távoli mentőszerverünkre.
-                Ott <strong>14 napi és 8 heti</strong> példány marad meg, a nálunk tárolt másolatban <strong>8 heti</strong>.
-                Ezért egy törölt résztvevő adatai a mentésekben eddig az ideig még megtalálhatók.
-            </p>
-            <!-- source: documentation/runbooks/RUNBOOK-hub-db-offsite-backup.md:72-73 (--keep-daily 14 --keep-weekly 8); documentation/runbooks/ep0-datastore-copy.md:15-17 (keep-weekly 8) -->
-            <p><strong>Jogalap:</strong> a veled kötött megállapodás teljesítése (GDPR 6. cikk (1) b); a naplók megőrzésére jogos érdek (6. cikk (1) f).</p>
-
-            <h2>7. A szervered adatainak távoli mentése</h2>
-            <p>
-                A szervereden lévő adatokról távoli mentés készül. <strong>A mentés nálad, a szerveren
-                titkosítódik, mielőtt elhagyja az otthonodat.</strong> Sem a tárhely üzemeltetője, sem mi nem
-                tudjuk elolvasni a tartalmát.
-            </p>
-            <!-- source: documentation/architecture/01-topology-and-trust.md:118 ("ciphertext only (operator can't read)"); 07-backup-architecture.md:378-379 -->
-            <ul>
-                <li><strong>Alkalmazásonkénti fájlmentés</strong> — <strong>Hetzner Storage Box</strong>,
-                    Falkenstein, Németország. 7 napi, 4 heti és 6 havi példány marad meg. A fiókod
-                    visszaállításakor törlődik.
-                    <!-- source: manifests/hub.yaml:224-226 (HETZNER_LOCATION "fsn1"); fsn1 = Falkenstein, Germany per https://docs.hetzner.com/cloud/general/locations/ read 2026-10-09; 07-backup-architecture.md:377 (keep-daily 7, weekly 4, monthly 6) --></li>
-                <li><strong>Teljes szervermentés</strong> — a saját távoli mentőszerverünkre, amely a
-                    <strong>Hetzner Cloud</strong> nürnbergi (Németország) telephelyén fut. A legutóbbi 2 heti
-                    példány marad meg; a törlésedkor törlődik.
-                    <!-- source: documentation/runbooks/RUNBOOK-ep0-datastore-volume-2026-07-27.md:6 ("Hetzner CX33 … Nuremberg") --></li>
-                <li><strong>Ennek másolata a saját szerverünkön</strong> — továbbra is titkosítva, 8 heti példány.
-                    A törlésed után <strong>legfeljebb 30 napon belül</strong> törlődik; ezt egy naponta futó
-                    feladat végzi.
-                    <!-- source: operator ruling 2026-10-08 09:04, decision 181; scripts/ep0-copy-gc/; MEASURED 2026-10-09 on DooPlex: felhom-ep0-copy-gc.timer active, last run Fri 2026-10-09 08:00 CEST, Result=success, ExecMainStatus=0 --></li>
-            </ul>
-
-            <h2>8. Hozzáférés a szerveredhez</h2>
-            <p>
-                Őszintén: <strong>rendszergazdai (root) hozzáférésünk van minden szerverhez, amit kezelünk.</strong>
-                Ez kell a frissítésekhez, a mentések ellenőrzéséhez és a hibák javításához. Ezzel a hozzáféréssel
-                a szervereden tárolt adatok elérhetők. Csak üzemeltetésre és hibaelhárításra használjuk.
-            </p>
-            <!-- source: documentation/architecture/07-backup-architecture.md:49-52 ("The operator holds root SSH on every box… 'The operator cannot read customer data' was never the security property") -->
-            <p>
-                A fájljaid és az alkalmazásaid adatai <strong>nem kerülnek át</strong> a központi rendszerbe.
-                Oda csak a 6. pontban felsorolt állapotadatok jutnak el, és — külön kérésre, kitakarva —
-                naplórészletek.
-            </p>
-            <!-- source: felhom-controller/controller/internal/report/types.go:13-56; documentation/architecture/05-hub-architecture.md:206 -->
-
-            <h2>9. Az alkalmazásaid elérése az interneten</h2>
-            <p>
-                A szervereden futó alkalmazásokat a <strong>Cloudflare Tunnel</strong> szolgáltatáson keresztül
-                lehet elérni az internetről. <strong>A titkosított kapcsolat a Cloudflare hálózatán végződik</strong>,
-                vagyis ezeknek az alkalmazásoknak a forgalma áthalad a Cloudflare rendszerén. (Ez más, mint a
-                weboldalunk: a felhom.eu forgalma nem megy át rajta — lásd a 3.4 pontot.)
-            </p>
-            <!-- source: documentation/architecture/05-hub-architecture.md:178-180 ("the edge terminates TLS"); 01-topology-and-trust.md:113-114, :202-224 -->
-
-            <h2>10. Kik látják még az adataidat</h2>
-            <ul>
-                <li><strong>Resend</strong> — e-mail-küldés. Látja: a címzett e-mail-címét és a levél tartalmát.</li>
-                <li><strong>Cloudflare</strong> — a felhom.eu névfeloldása; a @felhom.eu címre érkező levelek
-                    továbbítása; az alkalmazásaid internetes elérése. Látja: a továbbított leveleket és az
-                    alkalmazások forgalmát.</li>
-                <li><strong>Google (Gmail)</strong> — az <code>info@felhom.eu</code> postafiókja. Látja: a
-                    beérkező leveleket, köztük az űrlap üzeneteit.</li>
-                <li><strong>Hetzner</strong> (Németország) — a titkosított mentések tárolása. Csak titkosított
-                    adatot lát.</li>
-                <li><strong>Meta</strong> — csak akkor, ha a Facebook-oldalunkat használod (5. pont).</li>
-            </ul>
-            <p>
-                A Resend, a Cloudflare, a Google és a Meta nemzetközi szolgáltatók, amelyek adatot az Európai
-                Gazdasági Térségen kívül is kezelhetnek. Hogy pontosan hol és milyen garanciával, azt a saját
-                adatkezelési tájékoztatójuk írja le.
-            </p>
-
-            <h2>11. A jogaid</h2>
-            <p>Bármikor kérheted tőlünk, hogy:</p>
-            <ul>
-                <li><strong>megmondjuk, milyen adatot kezelünk rólad</strong> (hozzáférés),</li>
-                <li><strong>javítsuk</strong>, ha valami hibás (helyesbítés),</li>
-                <li><strong>töröljük</strong> az adataidat (törlés),</li>
-                <li><strong>korlátozzuk</strong> a kezelését, amíg egy vitát tisztázunk,</li>
-                <li><strong>odaadjuk neked</strong> géppel olvasható formában (adathordozhatóság),</li>
-                <li><strong>tiltakozz</strong> a jogos érdeken alapuló kezelés ellen,</li>
-                <li><strong>visszavond a hozzájárulásodat</strong> — ettől a korábbi kezelés nem lesz jogellenes.</li>
-            </ul>
-            <p>
-                Hogyan kérd: írj az <a href="mailto:info@felhom.eu">info@felhom.eu</a> címre.
-                <strong>Egy hónapon belül válaszolunk</strong> (GDPR 12. cikk (3)).
-            </p>
-
-            <h2>12. Ha panaszod van</h2>
-            <p>Panasszal a felügyeleti hatósághoz fordulhatsz:</p>
-            <ul>
-                <li><strong>Nemzeti Adatvédelmi és Információszabadság Hatóság (NAIH)</strong></li>
-                <li>Cím: 1055 Budapest, Falk Miksa utca 9-11.</li>
-                <li>Postacím: 1363 Budapest, Pf.: 9.</li>
-                <li>Telefon: +36 (1) 391 1400</li>
-                <li>E-mail: <a href="mailto:ugyfelszolgalat@naih.hu">ugyfelszolgalat@naih.hu</a></li>
-                <li>Web: <a href="https://naih.hu" target="_blank" rel="noopener">naih.hu</a></li>
-            </ul>
-            <!-- source: https://www.naih.hu/ugyfelszolgalat-kapcsolat read 2026-10-09 -->
-            <p>Bírósághoz is fordulhatsz.</p>
-
-            <h2>13. A tájékoztató változásai</h2>
-            <p>
-                Ha változik, amit csinálunk, ezt a tájékoztatót is módosítjuk, és a tetején lévő verziószámot
-                megemeljük. A zárt teszt résztvevőinek a lényeges változásról e-mailt küldünk.
-            </p>
-            <p>
-                A szolgáltatás feltételeit a <a href="/feltetelek">Feltételek</a> oldal írja le.
-            </p>
-
-        </div>
-    </section>
-    <script>
-    (function() {
-        var hamburger = document.getElementById('hamburger');
-        var navLinks = document.querySelector('.nav-links');
-        var overlay = document.getElementById('mobileOverlay');
-        var body = document.body;
-
-        if (!hamburger || !navLinks || !overlay) {
-            console.warn('[mobile-menu] Missing elements:', {
-                hamburger: !!hamburger,
-                navLinks: !!navLinks,
-                overlay: !!overlay
-            });
-            return;
-        }
-
-        function openMenu() {
-            hamburger.classList.add('is-active');
-            navLinks.classList.add('is-open');
-            overlay.classList.add('is-visible');
-            body.classList.add('menu-open');
-            hamburger.setAttribute('aria-expanded', 'true');
-            hamburger.setAttribute('aria-label', 'Menü bezárása');
-        }
-
-        function closeMenu() {
-            hamburger.classList.remove('is-active');
-            navLinks.classList.remove('is-open');
-            overlay.classList.remove('is-visible');
-            body.classList.remove('menu-open');
-            hamburger.setAttribute('aria-expanded', 'false');
-            hamburger.setAttribute('aria-label', 'Menü megnyitása');
-        }
-
-        hamburger.addEventListener('click', function() {
-            if (navLinks.classList.contains('is-open')) {
-                closeMenu();
-            } else {
-                openMenu();
-            }
-        });
-
-        overlay.addEventListener('click', closeMenu);
-
-        navLinks.querySelectorAll('a').forEach(function(link) {
-            link.addEventListener('click', closeMenu);
-        });
-
-        document.addEventListener('keydown', function(e) {
-            if (e.key === 'Escape' && navLinks.classList.contains('is-open')) {
-                closeMenu();
-            }
-        });
-
-        window.addEventListener('resize', function() {
-            if (window.innerWidth > 900 && navLinks.classList.contains('is-open')) {
-                closeMenu();
-            }
-        });
-    })();
-    </script>
-<footer>
-        <div class="container">
-            <p>© 2026 felhom.eu – Saját felhőd, saját szabályaid</p>
-            <p class="footer-legal">Üzemeltető: Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Adatkezelési tájékoztató</a> · <a href="/feltetelek">Feltételek</a></p>
-        </div>
-    </footer>
-    </main>
-    <script>
-    (function(){
-        var b=document.getElementById('navBurger'),s=document.getElementById('sidebar'),k=document.getElementById('navBackdrop');
-        if(!b||!s||!k)return;
-        function open(){s.classList.add('is-open');k.hidden=false;document.body.classList.add('nav-open');b.setAttribute('aria-expanded','true');}
-        function close(){s.classList.remove('is-open');k.hidden=true;document.body.classList.remove('nav-open');b.setAttribute('aria-expanded','false');}
-        b.addEventListener('click',function(){s.classList.contains('is-open')?close():open();});
-        k.addEventListener('click',close);
-        document.addEventListener('keydown',function(e){if(e.key==='Escape'&&s.classList.contains('is-open')){close();b.focus();}});
-        s.querySelectorAll('a').forEach(function(l){l.addEventListener('click',close);});
-        window.addEventListener('resize',function(){if(window.innerWidth>768)close();});
-    })();
-    document.addEventListener('click',function(e){
-        var btn=e.target.closest?e.target.closest('.nav-group-toggle'):null;
-        if(!btn)return;
-        var g=btn.closest('.nav-group');if(!g)return;
-        var willOpen=!g.classList.contains('is-open');
-        document.querySelectorAll('.nav-group.is-open').forEach(function(x){
-            x.classList.remove('is-open');
-            var t=x.querySelector('.nav-group-toggle');if(t)t.setAttribute('aria-expanded','false');
-        });
-        if(willOpen){g.classList.add('is-open');btn.setAttribute('aria-expanded','true');}
-    });
-    </script>
-</body>
-</html>
diff --git a/website/preview/m3/alkalmazasok.html b/website/preview/m3/alkalmazasok.html
deleted file mode 100644
index 56f554c5..00000000
--- a/website/preview/m3/alkalmazasok.html
+++ /dev/null
@@ -1,1383 +0,0 @@
-<!DOCTYPE html>
-<html lang="hu" class="no-js">
-<head>
-    <script>document.documentElement.className=document.documentElement.className.replace('no-js','js');</script>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Telepíthető alkalmazások — 58 app otthoni szerverre | Felhom.eu</title>
-    <meta name="description" content="Nextcloud, Immich, Jellyfin, Vaultwarden — összesen 58 alkalmazás otthoni szerveredre, szinte mind nyílt forráskódú. Google Drive, iCloud Photos és Spotify alternatívák.">
-
-    <meta name="keywords" content="Nextcloud, Immich, Jellyfin, Plex, Sonarr, Radarr, Vaultwarden, nyílt forráskódú alkalmazások, self-hosted apps, otthoni szerver alkalmazások, Google Photos alternatíva, Dropbox alternatíva">
-    <meta name="robots" content="index, follow">
-    <link rel="canonical" href="https://felhom.eu/alkalmazasok">
-    <link rel="alternate" hreflang="hu" href="https://felhom.eu/alkalmazasok">
-    <link rel="alternate" hreflang="en" href="https://felhom.eu/en/apps">
-    <link rel="alternate" hreflang="x-default" href="https://felhom.eu/alkalmazasok">
-    
-    <meta property="og:type" content="website">
-    <meta property="og:url" content="https://felhom.eu/alkalmazasok">
-    <meta property="og:title" content="58 alkalmazás otthoni szerverre">
-    <meta property="og:description" content="Nextcloud, Immich, Jellyfin, Vaultwarden és még sok más. Fájlkezelés, fotók, média, dokumentumok — mind a saját szerveredről.">
-    <meta property="og:image" content="https://felhom.eu/assets/og-image.png">
-    <meta property="og:locale" content="hu_HU">
-    <meta property="og:site_name" content="Felhom.eu">
-    
-    <meta name="twitter:card" content="summary_large_image">
-    <meta name="twitter:title" content="58 alkalmazás otthoni szerverre">
-    <meta name="twitter:description" content="Nextcloud, Immich, Jellyfin és még sok más — a te szerveredről.">
-    <meta name="twitter:image" content="https://felhom.eu/assets/og-image.png">
-    
-    <script type="application/ld+json">
-    {
-    "@context": "https://schema.org",
-    "@type": "ItemList",
-    "name": "Felhom.eu — Telepíthető alkalmazások",
-    "description": "Önhostolt alkalmazások otthoni szerverre, szinte mind nyílt forráskódú",
-    "numberOfItems": 58,
-    "itemListElement": [
-        {"@type": "ListItem", "position": 1, "name": "Nextcloud", "description": "Fájlkezelés és irodai csomag"},
-        {"@type": "ListItem", "position": 2, "name": "Immich", "description": "Fotó és videó kezelés (Google Photos alternatíva)"},
-        {"@type": "ListItem", "position": 3, "name": "Jellyfin", "description": "Médialejátszó és szerver"},
-        {"@type": "ListItem", "position": 4, "name": "Vaultwarden", "description": "Jelszókezelő (Bitwarden kompatibilis)"},
-        {"@type": "ListItem", "position": 5, "name": "Paperless-ngx", "description": "Dokumentumkezelő rendszer"}
-    ]
-    }
-    </script>
-    <!-- shared assets: bump ?v= together on any site.css/icons.svg change -->
-    <link rel="stylesheet" href="/assets/site.css?v=21">
-    <link rel="stylesheet" href="/assets/shell.css?v=21">
-    <link rel="icon" type="image/png" href="/assets/logo_favicon_2.svg">
-    <script defer src="/assets/gallery.js?v=2"></script>
-    <script defer src="https://stats.felhom.eu/script.js" data-website-id="d419db57-5e1c-48df-bdb3-c29f25fb1661"></script>
-</head>
-<body class="shell page-alkalmazasok">
-    <header class="mobile-topbar">
-        <a href="/preview/m3/" class="mobile-topbar-logo"><img src="/assets/logo_notext_white.svg" alt="Felhom.eu"></a>
-        <button type="button" class="nav-burger" id="navBurger" aria-expanded="false" aria-controls="sidebar" aria-label="Menü">
-            <span class="hamburger-box"><span class="hamburger-line"></span><span class="hamburger-line"></span><span class="hamburger-line"></span></span>
-        </button>
-    </header>
-    <div class="nav-backdrop" id="navBackdrop" hidden></div>
-    <nav class="sidebar" id="sidebar">
-        <div class="sidebar-header">
-            <a href="/preview/m3/" class="sidebar-logo-link">
-                <img src="/assets/logo_notext_white.svg" alt="" class="sidebar-logo" aria-hidden="true">
-                <img src="/assets/logo-wordmark.png" alt="felhom.eu" class="sidebar-word">
-            </a>
-        </div>
-        <ul class="nav-links">
-                <li><a href="/preview/m3/"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg>Kezdőlap</a></li>
-                <li><a href="/preview/m3/#szolgaltatasok"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rocket"/></svg>Szolgáltatások</a></li>
-                <li class="nav-group is-open">
-                    <button type="button" class="nav-group-toggle active" aria-expanded="true" aria-controls="nav-group-apps"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg>Alkalmazások<svg class="ico nav-chevron" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chevron-down"/></svg></button>
-                    <ul id="nav-group-apps" class="nav-links nav-links-sub nav-links-nested">
-                        <li><a href="/preview/m3/alkalmazasok">Minden alkalmazás</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#fajlkezeles-irodai">Fájlkezelés &amp; Irodai</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#media-szorakozas">Média &amp; Szórakozás</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#otthon-eletmod">Otthon &amp; Életmód</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#produktivitas-tudaskezeles">Produktivitás &amp; Tudáskezelés</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#rendszer-fejlesztes">Rendszer &amp; Fejlesztés</a></li>
-                    </ul>
-                </li>
-                <li><a href="/preview/m3/technologiak"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg>Technológiák</a></li>
-                <li><a href="/preview/m3/biztonsagimentes"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg>Biztonsági mentés</a></li>
-        </ul>
-        <div class="sidebar-bottom">
-            <a href="/preview/m3/teszteles" class="btn btn-outline sidebar-cta">Jelentkezem tesztelőnek →</a>
-            <div class="nav-group-label">A Felhomról</div>
-            <ul class="nav-links nav-links-sub">
-                    <li><a href="/preview/m3/#hogyan-mukodik">Hogyan működik</a></li>
-                    <li><a href="/preview/m3/gyik">GYIK</a></li>
-                    <li><a href="/preview/m3/kapcsolat">Kapcsolat</a></li>
-            </ul>
-            <div class="sidebar-footer">
-                <details class="lang-globe"><summary class="lang-globe-btn" aria-label="Nyelv" title="Nyelv"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/preview/m3/alkalmazasok" lang="hu" hreflang="hu" class="lang-globe-item current" aria-current="true">Magyar</a></li><li><a href="/preview/m3/en/apps" lang="en" hreflang="en" class="lang-globe-item">English</a></li></ul></details>
-            </div>
-        </div>
-    </nav>
-<main class="content">
-                <div class="page-header">
-                <h1>Telepíthető <span>Alkalmazások</span></h1>
-            </div>
-                <p class="page-lede">Válassz 58 alkalmazás közül. Szinte mind ingyenes, nyílt forráskódú szoftver, és mind a saját szervereden fut.</p>
-                <div class="disclaimer-banner">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-info"/></svg> Fontos tudnivalók</h3>
-                    <ul>
-                        <li>Az alkalmazások szinte mind <strong>nyílt forráskódúak</strong> – bárki ellenőrizheti a működésüket. A kivételeket a kártyán jelöljük: <em>Zárt forráskód</em> (Plex, Emby), <em>Korlátozott licenc</em> (a forrás olvasható, de a licenc korlátoz), <em>Felhom saját</em> (a mi fejlesztésünk)</li>
-                        <li>Szolgáltatásunk az alkalmazások <strong>telepítésére</strong> terjed ki, nem azok fejlesztésére vagy értékesítésére</li>
-                        <li>Az alkalmazások működéséért és frissítéseiért az eredeti fejlesztők felelősek</li>
-                        <li>Ha egy alkalmazás hiányzik, megnézzük, felvehető-e a katalógusba – <a href="/kapcsolat">kérdezz bátran!</a></li>
-                    </ul>
-                </div>
-
-        <section class="apps-section">
-            <div class="container">
-
-                <!-- ==================== -->
-                <!-- 1. FÁJLKEZELÉS & IRODAI -->
-                <!-- ==================== -->
-                <div class="category-section" id="fajlkezeles">
-                    <div class="category-header">
-                        <span class="category-icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-folder"/></svg></span>
-                        <h2>Fájlkezelés & Irodai</h2>
-                        <span class="app-count">6 alkalmazás + 1 beépített</span>
-                    </div>
-                    <div class="app-grid">
-                        <!-- Nextcloud -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/nextcloud-logo.svg" alt="Nextcloud" class="app-logo">
-                                <div class="app-title-area"><h3>Nextcloud</h3><span class="app-tagline">A saját Google Drive-od</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Teljes értékű felhőszolgáltatás a saját szervereden. Fájlok szinkronizálása, naptár, kontaktok, dokumentumszerkesztés, és rengeteg bővítmény.</p>
-                                <div class="app-features"><span class="app-feature">Fájl szinkron</span><span class="app-feature">Naptár</span><span class="app-feature">Dokumentumok</span><span class="app-feature">Mobil app</span></div>
-                                <a href="/assets/nextcloud-screenshot-1.webp" data-gallery="nextcloud" class="app-shot-link"><img src="/assets/nextcloud-screenshot-1.webp" alt="Nextcloud screenshot" class="app-screenshot"></a>
-                                <a href="/assets/nextcloud-screenshot-2.webp" data-gallery="nextcloud" data-alt="Nextcloud screenshot 2" hidden></a>
-                                <a href="/assets/nextcloud-screenshot-3.webp" data-gallery="nextcloud" data-alt="Nextcloud screenshot 3" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/nextcloud/server" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- FileBrowser -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/filebrowser-logo.svg" alt="FileBrowser" class="app-logo">
-                                <div class="app-title-area"><h3>FileBrowser</h3><span class="app-tagline">Egyszerű webes fájlkezelő</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Könnyű és gyors webes fájlkezelő, minden Felhom dobozba beépítve. Böngészd, töltsd fel és oszd meg a fájljaidat bárhonnan, modern felületen keresztül.</p>
-                                <div class="app-features"><span class="app-feature">Drag & drop</span><span class="app-feature">Megosztás</span><span class="app-feature">Előnézet</span><span class="app-feature">Keresés</span></div>
-                                <a href="/assets/filebrowser-screenshot-1.webp" data-gallery="filebrowser" class="app-shot-link"><img src="/assets/filebrowser-screenshot-1.webp" alt="FileBrowser screenshot" class="app-screenshot"></a>
-                                <a href="/assets/filebrowser-screenshot-2.webp" data-gallery="filebrowser" data-alt="FileBrowser screenshot 2" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/filebrowser/filebrowser" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source · Beépített</span>
-                            </div>
-                        </div>
-                        <!-- Gokapi -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/gokapi-logo.png" alt="Gokapi" class="app-logo">
-                                <div class="app-title-area"><h3>Gokapi</h3><span class="app-tagline">Ideiglenes fájlmegosztás</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Könnyűsúlyú fájlmegosztó szerver lejárati idővel és letöltési limittel. Tökéletes nagy fájlok gyors és biztonságos megosztására.</p>
-                                <div class="app-features"><span class="app-feature">Lejárati idő</span><span class="app-feature">Letöltési limit</span><span class="app-feature">Jelszóvédelem</span></div>
-                                <a href="/assets/gokapi-screenshot-1.webp" data-gallery="gokapi" class="app-shot-link"><img src="/assets/gokapi-screenshot-1.webp" alt="Gokapi screenshot" class="app-screenshot"></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/Forceu/Gokapi" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Zipline -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/zipline-logo.png" alt="Zipline" class="app-logo">
-                                <div class="app-title-area"><h3>Zipline</h3><span class="app-tagline">ShareX/Flameshot szerver</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Modern, funkciógazdag fájl- és képmegosztó. Tökéletes screenshot megosztásra, URL rövidítésre és szövegtárolásra.</p>
-                                <div class="app-features"><span class="app-feature">Screenshot</span><span class="app-feature">URL rövidítő</span><span class="app-feature">Galéria</span><span class="app-feature">API</span></div>
-                                <a href="/assets/zipline-screenshot-1.webp" data-gallery="zipline" class="app-shot-link"><img src="/assets/zipline-screenshot-1.webp" alt="Zipline screenshot" class="app-screenshot"></a>
-                                <a href="/assets/zipline-screenshot-2.webp" data-gallery="zipline" data-alt="Zipline screenshot 2" hidden></a>
-                                <a href="/assets/zipline-screenshot-3.webp" data-gallery="zipline" data-alt="Zipline screenshot 3" hidden></a>
-                                <a href="/assets/zipline-screenshot-4.webp" data-gallery="zipline" data-alt="Zipline screenshot 4" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/diced/zipline" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- OnlyOffice -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/onlyoffice-logo.svg" alt="OnlyOffice" class="app-logo">
-                                <div class="app-title-area"><h3>OnlyOffice</h3><span class="app-tagline">Irodai csomag böngészőben</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Teljes értékű irodai programcsomag a böngészőben. Dokumentumok, táblázatok és prezentációk szerkesztése – kiváló Microsoft Office kompatibilitással.</p>
-                                <div class="app-features"><span class="app-feature">Dokumentumok</span><span class="app-feature">Táblázatok</span><span class="app-feature">Prezentációk</span><span class="app-feature">Együttműködés</span></div>
-                                <a href="/assets/onlyoffice-screenshot-1.webp" data-gallery="onlyoffice" class="app-shot-link"><img src="/assets/onlyoffice-screenshot-1.webp" alt="OnlyOffice screenshot" class="app-screenshot"></a>
-                                <a href="/assets/onlyoffice-screenshot-2.webp" data-gallery="onlyoffice" data-alt="OnlyOffice screenshot 2" hidden></a>
-                                <a href="/assets/onlyoffice-screenshot-3.webp" data-gallery="onlyoffice" data-alt="OnlyOffice screenshot 3" hidden></a>
-                                <a href="/assets/onlyoffice-screenshot-4.webp" data-gallery="onlyoffice" data-alt="OnlyOffice screenshot 4" hidden></a>
-                                <a href="/assets/onlyoffice-screenshot-5.webp" data-gallery="onlyoffice" data-alt="OnlyOffice screenshot 5" hidden></a>
-                                <a href="/assets/onlyoffice-screenshot-6.webp" data-gallery="onlyoffice" data-alt="OnlyOffice screenshot 6" hidden></a>
-                                <a href="/assets/onlyoffice-screenshot-7.webp" data-gallery="onlyoffice" data-alt="OnlyOffice screenshot 7" hidden></a>
-                                <a href="/assets/onlyoffice-screenshot-8.webp" data-gallery="onlyoffice" data-alt="OnlyOffice screenshot 8" hidden></a>
-                                <a href="/assets/onlyoffice-screenshot-9.webp" data-gallery="onlyoffice" data-alt="OnlyOffice screenshot 9" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/ONLYOFFICE/DocumentServer" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- BentoPDF -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/bentopdf-logo.svg" alt="BentoPDF" class="app-logo">
-                                <div class="app-title-area"><h3>BentoPDF</h3><span class="app-tagline">PDF eszköztár (adatvédelem)</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Adatvédelem-központú PDF eszköztár, 70+ funkcióval. Összefűzés, szétválasztás, konvertálás, tömörítés, OCR, titkosítás, aláírás – minden a böngészőben, szerver nélkül.</p>
-                                <div class="app-features"><span class="app-feature">70+ eszköz</span><span class="app-feature">Kliens-oldali</span><span class="app-feature">OCR</span><span class="app-feature">Konvertálás</span></div>
-                                <a href="/assets/bentopdf-screenshot-1.webp" data-gallery="bentopdf" class="app-shot-link"><img src="/assets/bentopdf-screenshot-1.webp" alt="BentoPDF screenshot" class="app-screenshot"></a>
-                                <a href="/assets/bentopdf-screenshot-2.webp" data-gallery="bentopdf" data-alt="BentoPDF screenshot 2" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Papra -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/papra-logo.svg" alt="Papra" class="app-logo">
-                                <div class="app-title-area"><h3>Papra</h3><span class="app-tagline">Minimalista dokumentumtár</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Letisztult, modern dokumentum archiváló. Automatikus címkézés, email import, OCR szövegfelismerés – a digitális irattár egyszerűen, szépen.</p>
-                                <div class="app-features"><span class="app-feature">Auto címkék</span><span class="app-feature">Email import</span><span class="app-feature">OCR</span><span class="app-feature">Modern UI</span></div>
-                                <a href="/assets/papra-screenshot-1.webp" data-gallery="papra" class="app-shot-link"><img src="/assets/papra-screenshot-1.webp" alt="Papra screenshot" class="app-screenshot"></a>
-                                <a href="/assets/papra-screenshot-2.webp" data-gallery="papra" data-alt="Papra screenshot 2" hidden></a>
-                                <a href="/assets/papra-screenshot-3.webp" data-gallery="papra" data-alt="Papra screenshot 3" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/papra-hq/papra" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-
-                <!-- ==================== -->
-                <!-- 2. MÉDIA & SZÓRAKOZÁS -->
-                <!-- ==================== -->
-                <div class="category-section" id="media">
-                    <div class="category-header">
-                        <span class="category-icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-tv"/></svg></span>
-                        <h2>Média & Szórakozás</h2>
-                        <span class="app-count">15 alkalmazás</span>
-                    </div>
-                    <div class="app-grid">
-                        <!-- Immich -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/immich-logo.svg" alt="Immich" class="app-logo">
-                                <div class="app-title-area"><h3>Immich</h3><span class="app-tagline">Google Photos alternatíva</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Gyors és modern fotó/videó mentési megoldás. Automatikus feltöltés telefonról, arc- és tárgyfelismerés, megosztás és emlékek.</p>
-                                <div class="app-features"><span class="app-feature">Auto backup</span><span class="app-feature">Arcfelismerés</span><span class="app-feature">Térkép</span><span class="app-feature">Mobil app</span></div>
-                                <a href="/assets/immich-screenshot-1.webp" data-gallery="immich" class="app-shot-link"><img src="/assets/immich-screenshot-1.webp" alt="Immich screenshot" class="app-screenshot"></a>
-                                <a href="/assets/immich-screenshot-2.webp" data-gallery="immich" data-alt="Immich screenshot 2" hidden></a>
-                                <a href="/assets/immich-screenshot-3.webp" data-gallery="immich" data-alt="Immich screenshot 3" hidden></a>
-                                <a href="/assets/immich-screenshot-4.webp" data-gallery="immich" data-alt="Immich screenshot 4" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/immich-app/immich" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Jellyfin -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/jellyfin-logo.svg" alt="Jellyfin" class="app-logo">
-                                <div class="app-title-area"><h3>Jellyfin</h3><span class="app-tagline">Média szerver (Netflix)</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Ingyenes és nyílt forráskódú média szerver. Streamelj filmeket, sorozatokat és zenét bárhonnan, bármilyen eszközre.</p>
-                                <div class="app-features"><span class="app-feature">Streaming</span><span class="app-feature">Transzkódolás</span><span class="app-feature">Mobil app</span><span class="app-feature">TV app</span></div>
-                                <a href="/assets/jellyfin-screenshot-1.webp" data-gallery="jellyfin" class="app-shot-link"><img src="/assets/jellyfin-screenshot-1.webp" alt="Jellyfin screenshot" class="app-screenshot"></a>
-                                <a href="/assets/jellyfin-screenshot-2.webp" data-gallery="jellyfin" data-alt="Jellyfin screenshot 2" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/jellyfin/jellyfin" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Plex -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/plex-logo.svg" alt="Plex" class="app-logo">
-                                <div class="app-title-area"><h3>Plex</h3><span class="app-tagline">Média szerver (prémium)</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Népszerű média szerver csiszolt felülettel. Filmek, sorozatok, zene és fotók egy helyen, kiváló alkalmazás támogatással.</p>
-                                <div class="app-features"><span class="app-feature">Streaming</span><span class="app-feature">Plex Pass</span><span class="app-feature">Intro skip</span><span class="app-feature">Watch Together</span></div>
-                                <a href="/assets/plex-screenshot-1.webp" data-gallery="plex" class="app-shot-link"><img src="/assets/plex-screenshot-1.webp" alt="Plex screenshot" class="app-screenshot"></a>
-                                <a href="/assets/plex-screenshot-2.webp" data-gallery="plex" data-alt="Plex screenshot 2" hidden></a>
-                                <a href="/assets/plex-screenshot-3.webp" data-gallery="plex" data-alt="Plex screenshot 3" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://www.plex.tv" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Weboldal</a>
-                                <span class="open-source-badge" style="color: var(--warn);"><img src="/assets/checkmark-yellow.svg" alt="">Zárt forráskód</span>
-                            </div>
-                        </div>
-                        <!-- Emby -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/emby-logo.svg" alt="Emby" class="app-logo">
-                                <div class="app-title-area"><h3>Emby</h3><span class="app-tagline">Média szerver</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Személyes média szerver élő TV és DVR támogatással. Szervezett könyvtár, távoli elérés és szinkronizálás offline lejátszáshoz.</p>
-                                <div class="app-features"><span class="app-feature">Streaming</span><span class="app-feature">Élő TV</span><span class="app-feature">DVR</span><span class="app-feature">Szinkron</span></div>
-                                <a href="/assets/emby-screenshot-1.webp" data-gallery="emby" class="app-shot-link"><img src="/assets/emby-screenshot-1.webp" alt="Emby screenshot" class="app-screenshot"></a>
-                                <a href="/assets/emby-screenshot-2.webp" data-gallery="emby" data-alt="Emby screenshot 2" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://emby.media" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Weboldal</a>
-                                <span class="open-source-badge" style="color: var(--warn);"><img src="/assets/checkmark-yellow.svg" alt="">Zárt forráskód</span>
-                            </div>
-                        </div>
-                        <!-- Navidrome -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/navidrome-logo.svg" alt="Navidrome" class="app-logo">
-                                <div class="app-title-area"><h3>Navidrome</h3><span class="app-tagline">Zene szerver (Spotify)</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Könnyű és modern zeneszerver. Streameld a saját zenegyűjteményedet bárhonnan – Subsonic kompatibilis, rengeteg mobil alkalmazással.</p>
-                                <div class="app-features"><span class="app-feature">Streaming</span><span class="app-feature">Subsonic API</span><span class="app-feature">Mobil appok</span><span class="app-feature">Lejátszási listák</span></div>
-                                <a href="/assets/navidrome-screenshot-1.webp" data-gallery="navidrome" class="app-shot-link"><img src="/assets/navidrome-screenshot-1.webp" alt="Navidrome screenshot" class="app-screenshot"></a>
-                                <a href="/assets/navidrome-screenshot-2.webp" data-gallery="navidrome" data-alt="Navidrome screenshot 2" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/navidrome/navidrome" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Audiobookshelf -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/audiobookshelf-logo.svg" alt="Audiobookshelf" class="app-logo">
-                                <div class="app-title-area"><h3>Audiobookshelf</h3><span class="app-tagline">Hangoskönyv & podcast</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Hangoskönyv és podcast kezelő szerver. Automatikus metaadat letöltés, folytatás ahol abbahagytad, és dedikált mobil alkalmazások.</p>
-                                <div class="app-features"><span class="app-feature">Hangoskönyvek</span><span class="app-feature">Podcastok</span><span class="app-feature">Szinkron</span><span class="app-feature">Mobil app</span></div>
-                                <a href="/assets/audiobookshelf-screenshot-1.webp" data-gallery="audiobookshelf" class="app-shot-link"><img src="/assets/audiobookshelf-screenshot-1.webp" alt="Audiobookshelf screenshot" class="app-screenshot"></a>
-                                <a href="/assets/audiobookshelf-screenshot-2.webp" data-gallery="audiobookshelf" data-alt="Audiobookshelf screenshot 2" hidden></a>
-                                <a href="/assets/audiobookshelf-screenshot-3.webp" data-gallery="audiobookshelf" data-alt="Audiobookshelf screenshot 3" hidden></a>
-                                <a href="/assets/audiobookshelf-screenshot-4.webp" data-gallery="audiobookshelf" data-alt="Audiobookshelf screenshot 4" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/advplyr/audiobookshelf" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- MeTube -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/metube-logo.svg" alt="MeTube" class="app-logo">
-                                <div class="app-title-area"><h3>MeTube</h3><span class="app-tagline">Videók letöltése linkből</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Egy videó vagy lejátszási lista letöltése a linkjéből, videóként vagy csak hangként. A letöltések a meghajtódra kerülnek, a fájlböngészőben és a médialejátszódban is látod őket. Csak a családtagjaid érik el.</p>
-                                <div class="app-features"><span class="app-feature">Videó és hang</span><span class="app-feature">Lejátszási listák</span><span class="app-feature">Saját meghajtóra</span><span class="app-feature">Csak a családnak</span></div>
-                                <a href="/assets/metube-screenshot-1.webp" data-gallery="metube" class="app-shot-link"><img src="/assets/metube-screenshot-1.webp" alt="MeTube screenshot" class="app-screenshot"></a>
-                                <a href="/assets/metube-screenshot-2.webp" data-gallery="metube" data-alt="MeTube screenshot 2" hidden></a>
-                                <a href="/assets/metube-screenshot-3.webp" data-gallery="metube" data-alt="MeTube screenshot 3" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/alexta69/metube" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Calibre-web -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/calibre-web-logo.svg" alt="Calibre-Web Automated" class="app-logo">
-                                <div class="app-title-area"><h3>Calibre-Web Automated</h3><span class="app-tagline">E-könyv könyvtár</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Webes felület a Calibre könyvtáradhoz. Böngészd, olvasd és töltsd le az e-könyveidet bárhonnan, Kindle támogatással.</p>
-                                <div class="app-features"><span class="app-feature">E-könyvek</span><span class="app-feature">Kindle küldés</span><span class="app-feature">OPDS</span><span class="app-feature">Olvasó</span></div>
-                                <a href="/assets/calibre-web-screenshot-1.webp" data-gallery="calibre-web" class="app-shot-link"><img src="/assets/calibre-web-screenshot-1.webp" alt="Calibre-Web Automated screenshot" class="app-screenshot"></a>
-                                <a href="/assets/calibre-web-screenshot-2.webp" data-gallery="calibre-web" data-alt="Calibre-Web Automated screenshot 2" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/crocodilestick/Calibre-Web-Automated" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Komga -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/komga-logo.svg" alt="Komga" class="app-logo">
-                                <div class="app-title-area"><h3>Komga</h3><span class="app-tagline">Képregény & manga szerver</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Képregények, mangák és magazinok kezelése és olvasása. Modern webes olvasó, OPDS támogatás, és népszerű mobil alkalmazások.</p>
-                                <div class="app-features"><span class="app-feature">Webes olvasó</span><span class="app-feature">OPDS</span><span class="app-feature">Metaadatok</span><span class="app-feature">Tachiyomi</span></div>
-                                <a href="/assets/komga-screenshot-1.webp" data-gallery="komga" class="app-shot-link"><img src="/assets/komga-screenshot-1.webp" alt="Komga screenshot" class="app-screenshot"></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/gotson/komga" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Grimmory -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/grimmory-logo.svg" alt="Grimmory" class="app-logo">
-                                <div class="app-title-area"><h3>Grimmory</h3><span class="app-tagline">E-könyvtár böngészőben</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">E-könyvek és képregények rendezett könyvtárban, borítóval és adatokkal. Olvasás a böngészőben, a haladás mentésével; Kobo- és KOReader-szinkron, OPDS-katalógus az olvasóalkalmazásoknak. Csak a családtagjaid érik el, saját belépéssel.</p>
-                                <div class="app-features"><span class="app-feature">Böngészős olvasó</span><span class="app-feature">Kobo szinkron</span><span class="app-feature">KOReader</span><span class="app-feature">OPDS</span></div>
-                                <a href="/assets/grimmory-screenshot-1.webp" data-gallery="grimmory" class="app-shot-link"><img src="/assets/grimmory-screenshot-1.webp" alt="Grimmory screenshot" class="app-screenshot"></a>
-                                <a href="/assets/grimmory-screenshot-2.webp" data-gallery="grimmory" data-alt="Grimmory screenshot 2" hidden></a>
-                                <a href="/assets/grimmory-screenshot-3.webp" data-gallery="grimmory" data-alt="Grimmory screenshot 3" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/grimmory-tools/grimmory" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Sonarr -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/sonarr-logo.svg" alt="Sonarr" class="app-logo">
-                                <div class="app-title-area"><h3>Sonarr</h3><span class="app-tagline">Sorozat menedzser</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Automatikus sorozat letöltő és rendszerező. Kövesd a kedvenc sorozataidat, és az új epizódok automatikusan letöltődnek.</p>
-                                <div class="app-features"><span class="app-feature">Auto letöltés</span><span class="app-feature">Naptár</span><span class="app-feature">Minőség kezelés</span><span class="app-feature">Integráció</span></div>
-                                <a href="/assets/sonarr-screenshot-1.webp" data-gallery="sonarr" class="app-shot-link"><img src="/assets/sonarr-screenshot-1.webp" alt="Sonarr screenshot" class="app-screenshot"></a>
-                                <a href="/assets/sonarr-screenshot-2.webp" data-gallery="sonarr" data-alt="Sonarr screenshot 2" hidden></a>
-                                <a href="/assets/sonarr-screenshot-3.webp" data-gallery="sonarr" data-alt="Sonarr screenshot 3" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/Sonarr/Sonarr" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Radarr -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/radarr-logo.png" alt="Radarr" class="app-logo">
-                                <div class="app-title-area"><h3>Radarr</h3><span class="app-tagline">Film menedzser</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Automatikus film letöltő és rendszerező. Készíts kívánságlistát, és a filmek automatikusan a könyvtáradba kerülnek.</p>
-                                <div class="app-features"><span class="app-feature">Kívánságlista</span><span class="app-feature">Auto letöltés</span><span class="app-feature">Minőség kezelés</span><span class="app-feature">Integráció</span></div>
-                                <a href="/assets/radarr-screenshot-1.webp" data-gallery="radarr" class="app-shot-link"><img src="/assets/radarr-screenshot-1.webp" alt="Radarr screenshot" class="app-screenshot"></a>
-                                <a href="/assets/radarr-screenshot-2.webp" data-gallery="radarr" data-alt="Radarr screenshot 2" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/Radarr/Radarr" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Seerr -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/seerr-logo.png" alt="Seerr" class="app-logo">
-                                <div class="app-title-area"><h3>Seerr</h3><span class="app-tagline">Média kérés kezelő</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Filmek és sorozatok igénylése egyszerűen. A család/barátok kérhetnek tartalmakat, amiket automatikusan letölt a rendszer.</p>
-                                <div class="app-features"><span class="app-feature">Kérés kezelés</span><span class="app-feature">Felhasználók</span><span class="app-feature">Értesítések</span><span class="app-feature">Integráció</span></div>
-                                <a href="/assets/seerr-screenshot-1.webp" data-gallery="seerr" class="app-shot-link"><img src="/assets/seerr-screenshot-1.webp" alt="Seerr screenshot" class="app-screenshot"></a>
-                                <a href="/assets/seerr-screenshot-2.webp" data-gallery="seerr" data-alt="Seerr screenshot 2" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/Fallenbagel/jellyseerr" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- RoMM -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/romm-logo.svg" alt="RoMM" class="app-logo">
-                                <div class="app-title-area"><h3>RoMM</h3><span class="app-tagline">ROM gyűjtemény kezelő</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Gyönyörű webes felület a retro játék ROM gyűjteményed kezeléséhez. Automatikus metaadat és borítókép letöltés, platform rendszerezés és böngészőből való lejátszás.</p>
-                                <div class="app-features"><span class="app-feature">ROM kezelés</span><span class="app-feature">Metaadatok</span><span class="app-feature">EmulatorJS</span><span class="app-feature">IGDB</span></div>
-                                <a href="/assets/romm-screenshot-1.webp" data-gallery="romm" class="app-shot-link"><img src="/assets/romm-screenshot-1.webp" alt="RoMM screenshot" class="app-screenshot"></a>
-                                <a href="/assets/romm-screenshot-2.webp" data-gallery="romm" data-alt="RoMM screenshot 2" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/rommapp/romm" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Crafty Controller -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/crafty-controller-logo.png" alt="Crafty Controller" class="app-logo">
-                                <div class="app-title-area"><h3>Crafty Controller</h3><span class="app-tagline">Minecraft szerver kezelő</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Modern webes Minecraft szerver menedzser. Több szerver kezelése egyetlen felületről, automatikus mentések, játékos statisztikák és teljes távoli hozzáférés.</p>
-                                <div class="app-features"><span class="app-feature">Multi-szerver</span><span class="app-feature">Mentések</span><span class="app-feature">Konzol</span><span class="app-feature">Statisztikák</span></div>
-                                <a href="/assets/crafty-controller-screenshot-1.webp" data-gallery="crafty-controller" class="app-shot-link"><img src="/assets/crafty-controller-screenshot-1.webp" alt="Crafty Controller screenshot" class="app-screenshot"></a>
-                                <a href="/assets/crafty-controller-screenshot-2.webp" data-gallery="crafty-controller" data-alt="Crafty Controller screenshot 2" hidden></a>
-                                <a href="/assets/crafty-controller-screenshot-3.webp" data-gallery="crafty-controller" data-alt="Crafty Controller screenshot 3" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://gitlab.com/crafty-controller/crafty-4" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-
-                <!-- ==================== -->
-                <!-- 3. OTTHON & ÉLETMÓD -->
-                <!-- ==================== -->
-                <div class="category-section" id="otthon">
-                    <div class="category-header">
-                        <span class="category-icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg></span>
-                        <h2>Otthon & Életmód</h2>
-                        <span class="app-count">14 alkalmazás</span>
-                    </div>
-                    <div class="app-grid">
-                        <!-- Home Assistant -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/home-assistant-logo.svg" alt="Home Assistant" class="app-logo">
-                                <div class="app-title-area"><h3>Home Assistant</h3><span class="app-tagline">Okos otthon központ</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">A világ legnépszerűbb nyílt forráskódú okos otthon platformja. Több mint 3000 integráció, helyi vezérlés, automatizációk – felhő nélkül, teljes adatvédelemmel.</p>
-                                <div class="app-features"><span class="app-feature">3000+ integráció</span><span class="app-feature">Automatizáció</span><span class="app-feature">Helyi vezérlés</span><span class="app-feature">Mobil app</span></div>
-                                <a href="/assets/home-assistant-screenshot-1.webp" data-gallery="home-assistant" class="app-shot-link"><img src="/assets/home-assistant-screenshot-1.webp" alt="Home Assistant screenshot" class="app-screenshot"></a>
-                                <a href="/assets/home-assistant-screenshot-2.webp" data-gallery="home-assistant" data-alt="Home Assistant screenshot 2" hidden></a>
-                                <a href="/assets/home-assistant-screenshot-3.webp" data-gallery="home-assistant" data-alt="Home Assistant screenshot 3" hidden></a>
-                                <a href="/assets/home-assistant-screenshot-4.webp" data-gallery="home-assistant" data-alt="Home Assistant screenshot 4" hidden></a>
-                                <a href="/assets/home-assistant-screenshot-5.webp" data-gallery="home-assistant" data-alt="Home Assistant screenshot 5" hidden></a>
-                                <a href="/assets/home-assistant-screenshot-6.webp" data-gallery="home-assistant" data-alt="Home Assistant screenshot 6" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/home-assistant/core" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- n8n -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/n8n-logo.svg" alt="n8n" class="app-logo">
-                                <div class="app-title-area"><h3>n8n</h3><span class="app-tagline">Workflow automatizálás</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Vizuális workflow automatizálás Zapier/Make stílusban. Köss össze bármilyen szolgáltatást, készíts automatizációkat – kód nélkül, a saját szervereden.</p>
-                                <div class="app-features"><span class="app-feature">400+ integráció</span><span class="app-feature">Vizuális szerkesztő</span><span class="app-feature">AI funkciók</span><span class="app-feature">Webhookok</span></div>
-                                <a href="/assets/n8n-screenshot-1.webp" data-gallery="n8n" class="app-shot-link"><img src="/assets/n8n-screenshot-1.webp" alt="n8n screenshot" class="app-screenshot"></a>
-                                <a href="/assets/n8n-screenshot-2.webp" data-gallery="n8n" data-alt="n8n screenshot 2" hidden></a>
-                                <a href="/assets/n8n-screenshot-3.webp" data-gallery="n8n" data-alt="n8n screenshot 3" hidden></a>
-                                <a href="/assets/n8n-screenshot-4.webp" data-gallery="n8n" data-alt="n8n screenshot 4" hidden></a>
-                                <a href="/assets/n8n-screenshot-5.webp" data-gallery="n8n" data-alt="n8n screenshot 5" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/n8n-io/n8n" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge" style="color: var(--warn);"><img src="/assets/checkmark-yellow.svg" alt="">Korlátozott licenc</span>
-                            </div>
-                        </div>
-                        <!-- Tandoor Recipes -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/tandoor-logo.png" alt="Tandoor Recipes" class="app-logo">
-                                <div class="app-title-area"><h3>Tandoor Recipes</h3><span class="app-tagline">Receptkezelő</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Receptek tárolása, étkezés tervezés és bevásárlólista. Importálj recepteket webről, oszd meg a családdal.</p>
-                                <div class="app-features"><span class="app-feature">Recept import</span><span class="app-feature">Étlap tervezés</span><span class="app-feature">Bevásárlólista</span><span class="app-feature">Megosztás</span></div>
-                                <a href="/assets/tandoor-screenshot-1.webp" data-gallery="tandoor" class="app-shot-link"><img src="/assets/tandoor-screenshot-1.webp" alt="Tandoor Recipes screenshot" class="app-screenshot"></a>
-                                <a href="/assets/tandoor-screenshot-2.webp" data-gallery="tandoor" data-alt="Tandoor Recipes screenshot 2" hidden></a>
-                                <a href="/assets/tandoor-screenshot-3.webp" data-gallery="tandoor" data-alt="Tandoor Recipes screenshot 3" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/TandoorRecipes/recipes" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge" style="color: var(--warn);"><img src="/assets/checkmark-yellow.svg" alt="">Korlátozott licenc</span>
-                            </div>
-                        </div>
-                        <!-- Mealie -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/mealie-logo.svg" alt="Mealie" class="app-logo">
-                                <div class="app-title-area"><h3>Mealie</h3><span class="app-tagline">Receptek és étkezésterv</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Receptkezelő és étkezéstervező a családnak. Receptek importálása weboldalakról, heti menü és bevásárlólista, megosztás a családtagokkal – magyar felülettel is.</p>
-                                <div class="app-features"><span class="app-feature">Recept import</span><span class="app-feature">Heti menü</span><span class="app-feature">Bevásárlólista</span><span class="app-feature">Magyar felület</span></div>
-                                <a href="/assets/mealie-screenshot-1.webp" data-gallery="mealie" class="app-shot-link"><img src="/assets/mealie-screenshot-1.webp" alt="Mealie screenshot" class="app-screenshot"></a>
-                                <a href="/assets/mealie-screenshot-2.webp" data-gallery="mealie" data-alt="Mealie screenshot 2" hidden></a>
-                                <a href="/assets/mealie-screenshot-3.webp" data-gallery="mealie" data-alt="Mealie screenshot 3" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/mealie-recipes/mealie" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Recipe Importer -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/recipe-importer-logo.svg" alt="Recipe Importer" class="app-logo">
-                                <div class="app-title-area"><h3>Recipe Importer</h3><span class="app-tagline">Magyar receptoldalakról</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Receptek importálása hat magyar oldalról (mindmegette.hu, streetkitchen.hu, nosalty.hu, sobors.hu, kiskegyed.hu, gastrohobbi.hu) Mealie-be és Tandoorba – egyenként vagy tömegesen, importálás előtti szerkesztéssel.</p>
-                                <div class="app-features"><span class="app-feature">6 magyar oldal</span><span class="app-feature">Tömeges import</span><span class="app-feature">Mealie</span><span class="app-feature">Tandoor</span></div>
-                                <a href="/assets/recipe-importer-screenshot-1.webp" data-gallery="recipe-importer" class="app-shot-link"><img src="/assets/recipe-importer-screenshot-1.webp" alt="Recipe Importer screenshot" class="app-screenshot"></a>
-                                <a href="/assets/recipe-importer-screenshot-2.webp" data-gallery="recipe-importer" data-alt="Recipe Importer screenshot 2" hidden></a>
-                                <a href="/assets/recipe-importer-screenshot-3.webp" data-gallery="recipe-importer" data-alt="Recipe Importer screenshot 3" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <span class="open-source-badge" style="color: var(--warn);"><img src="/assets/checkmark-yellow.svg" alt="">Felhom saját</span>
-                            </div>
-                        </div>
-                        <!-- Wishlist -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/wishlist-logo.svg" alt="Wishlist" class="app-logo">
-                                <div class="app-title-area"><h3>Wishlist</h3><span class="app-tagline">Családi kívánságlista</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Megosztható kívánságlista karácsonyra, születésnapokra és egyéb alkalmakra. A család lefoglalhatja az ajándékokat, így nincs több dupla ajándék.</p>
-                                <div class="app-features"><span class="app-feature">Csoportok</span><span class="app-feature">Foglalás</span><span class="app-feature">URL import</span><span class="app-feature">PWA</span></div>
-                                <a href="/assets/wishlist-screenshot-1.webp" data-gallery="wishlist" class="app-shot-link"><img src="/assets/wishlist-screenshot-1.webp" alt="Wishlist screenshot" class="app-screenshot"></a>
-                                <a href="/assets/wishlist-screenshot-2.webp" data-gallery="wishlist" data-alt="Wishlist screenshot 2" hidden></a>
-                                <a href="/assets/wishlist-screenshot-3.webp" data-gallery="wishlist" data-alt="Wishlist screenshot 3" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/cmintey/wishlist" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Homebox -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/homebox-logo.svg" alt="Homebox" class="app-logo">
-                                <div class="app-title-area"><h3>Homebox</h3><span class="app-tagline">Otthoni leltár</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Tartsd számon a tárgyaidat: helyszínek, címkék és kategóriák szerint rendezve, garancia-lejárattal és beszerzési árral. Vonalkód-szkenneléssel gyorsan bővíthető, és jól jön egy biztosítási kárnál is.</p>
-                                <div class="app-features"><span class="app-feature">Leltár</span><span class="app-feature">Garanciák</span><span class="app-feature">Vonalkód</span><span class="app-feature">Címkék</span></div>
-                                <a href="/assets/homebox-screenshot-1.webp" data-gallery="homebox" class="app-shot-link"><img src="/assets/homebox-screenshot-1.webp" alt="Homebox screenshot" class="app-screenshot"></a>
-                                <a href="/assets/homebox-screenshot-2.webp" data-gallery="homebox" data-alt="Homebox screenshot 2" hidden></a>
-                                <a href="/assets/homebox-screenshot-3.webp" data-gallery="homebox" data-alt="Homebox screenshot 3" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/sysadminsmedia/homebox" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Gramps Web -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/gramps-web-logo.png" alt="Gramps Web" class="app-logo">
-                                <div class="app-title-area"><h3>Gramps Web</h3><span class="app-tagline">Családfa készítő</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Webes családfa és genealógia platform. Építsd fel a családfádat, adj hozzá fotókat, dokumentumokat – és oszd meg a családdal biztonságosan.</p>
-                                <div class="app-features"><span class="app-feature">Családfa</span><span class="app-feature">GEDCOM</span><span class="app-feature">Együttműködés</span><span class="app-feature">Szinkron</span></div>
-                                <a href="/assets/gramps-web-screenshot-1.webp" data-gallery="gramps-web" class="app-shot-link"><img src="/assets/gramps-web-screenshot-1.webp" alt="Gramps Web screenshot" class="app-screenshot"></a>
-                                <a href="/assets/gramps-web-screenshot-2.webp" data-gallery="gramps-web" data-alt="Gramps Web screenshot 2" hidden></a>
-                                <a href="/assets/gramps-web-screenshot-3.webp" data-gallery="gramps-web" data-alt="Gramps Web screenshot 3" hidden></a>
-                                <a href="/assets/gramps-web-screenshot-4.webp" data-gallery="gramps-web" data-alt="Gramps Web screenshot 4" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/gramps-project/gramps-web" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- SparkyFitness -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/sparkyfitness-logo.png" alt="SparkyFitness" class="app-logo">
-                                <div class="app-title-area"><h3>SparkyFitness</h3><span class="app-tagline">Táplálkozási napló</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Napi étkezések és kalóriabevitel naplózása, testsúly és testméretek grafikonon, edzések rögzítése. Tápanyagcélok (fehérje, szénhidrát, zsír) beállítása és követése.</p>
-                                <div class="app-features"><span class="app-feature">Kalóriaszámláló</span><span class="app-feature">Testsúly</span><span class="app-feature">Edzések</span><span class="app-feature">Tápanyagcélok</span></div>
-                                <a href="/assets/sparkyfitness-screenshot-1.webp" data-gallery="sparkyfitness" class="app-shot-link"><img src="/assets/sparkyfitness-screenshot-1.webp" alt="SparkyFitness screenshot" class="app-screenshot"></a>
-                                <a href="/assets/sparkyfitness-screenshot-2.webp" data-gallery="sparkyfitness" data-alt="SparkyFitness screenshot 2" hidden></a>
-                                <a href="/assets/sparkyfitness-screenshot-3.webp" data-gallery="sparkyfitness" data-alt="SparkyFitness screenshot 3" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/CodeWithCJ/SparkyFitness" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge" style="color: var(--warn);"><img src="/assets/checkmark-yellow.svg" alt="">Korlátozott licenc</span>
-                            </div>
-                        </div>
-                        <!-- Actual Budget -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/actualbudget-logo.svg" alt="Actual Budget" class="app-logo">
-                                <div class="app-title-area"><h3>Actual Budget</h3><span class="app-tagline">Költségvetés tervező</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Helyi-központú személyes pénzügyek kezelése. Költségvetés tervezés, tranzakció követés, és pénzügyi célok.</p>
-                                <div class="app-features"><span class="app-feature">Költségvetés</span><span class="app-feature">Szinkron</span><span class="app-feature">Bank import</span><span class="app-feature">Riportok</span></div>
-                                <a href="/assets/actualbudget-screenshot-1.webp" data-gallery="actualbudget" class="app-shot-link"><img src="/assets/actualbudget-screenshot-1.webp" alt="Actual Budget screenshot" class="app-screenshot"></a>
-                                <a href="/assets/actualbudget-screenshot-2.webp" data-gallery="actualbudget" data-alt="Actual Budget screenshot 2" hidden></a>
-                                <a href="/assets/actualbudget-screenshot-3.webp" data-gallery="actualbudget" data-alt="Actual Budget screenshot 3" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/actualbudget/actual" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- AdventureLog -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/adventurelog-logo.png" alt="AdventureLog" class="app-logo">
-                                <div class="app-title-area"><h3>AdventureLog</h3><span class="app-tagline">Utazási napló</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Dokumentáld az utazásaidat és kalandjaidat. Térképes megjelenítés, fotók, statisztikák a meglátogatott helyekről.</p>
-                                <div class="app-features"><span class="app-feature">Térkép</span><span class="app-feature">Fotók</span><span class="app-feature">Statisztikák</span><span class="app-feature">Megosztás</span></div>
-                                <a href="/assets/adventurelog-screenshot-1.webp" data-gallery="adventurelog" class="app-shot-link"><img src="/assets/adventurelog-screenshot-1.webp" alt="AdventureLog screenshot" class="app-screenshot"></a>
-                                <a href="/assets/adventurelog-screenshot-2.webp" data-gallery="adventurelog" data-alt="AdventureLog screenshot 2" hidden></a>
-                                <a href="/assets/adventurelog-screenshot-3.webp" data-gallery="adventurelog" data-alt="AdventureLog screenshot 3" hidden></a>
-                                <a href="/assets/adventurelog-screenshot-4.webp" data-gallery="adventurelog" data-alt="AdventureLog screenshot 4" hidden></a>
-                                <a href="/assets/adventurelog-screenshot-5.webp" data-gallery="adventurelog" data-alt="AdventureLog screenshot 5" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/seanmorley15/AdventureLog" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Wanderer -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/wanderer-logo.svg" alt="Wanderer" class="app-logo">
-                                <div class="app-title-area"><h3>Wanderer</h3><span class="app-tagline">Túra tervező</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Túrák és útvonalak tervezése, GPX fájlok kezelése. Térképes megjelenítés szintvonalakkal, útvonal statisztikák.</p>
-                                <div class="app-features"><span class="app-feature">GPX import</span><span class="app-feature">Térképek</span><span class="app-feature">Szintadatok</span><span class="app-feature">Útvonalak</span></div>
-                                <a href="/assets/wanderer-screenshot-1.webp" data-gallery="wanderer" class="app-shot-link"><img src="/assets/wanderer-screenshot-1.webp" alt="Wanderer screenshot" class="app-screenshot"></a>
-                                <a href="/assets/wanderer-screenshot-2.webp" data-gallery="wanderer" data-alt="Wanderer screenshot 2" hidden></a>
-                                <a href="/assets/wanderer-screenshot-3.webp" data-gallery="wanderer" data-alt="Wanderer screenshot 3" hidden></a>
-                                <a href="/assets/wanderer-screenshot-4.webp" data-gallery="wanderer" data-alt="Wanderer screenshot 4" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/Flomp/wanderer" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Dawarich -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/dawarich-logo.svg" alt="Dawarich" class="app-logo">
-                                <div class="app-title-area"><h3>Dawarich</h3><span class="app-tagline">A Google Idővonal helyett</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Saját helyelőzmények térképen: a telefonod a te szerveredre küldi, hol jártál. Térkép, statisztika és utazások; a régi adataid Google Takeout, GPX vagy GeoJSON fájlból importálhatók.</p>
-                                <div class="app-features"><span class="app-feature">Térkép</span><span class="app-feature">Statisztika</span><span class="app-feature">Takeout import</span><span class="app-feature">Mobil app</span></div>
-                                <a href="/assets/dawarich-screenshot-1.webp" data-gallery="dawarich" class="app-shot-link"><img src="/assets/dawarich-screenshot-1.webp" alt="Dawarich screenshot" class="app-screenshot"></a>
-                                <a href="/assets/dawarich-screenshot-2.webp" data-gallery="dawarich" data-alt="Dawarich screenshot 2" hidden></a>
-                                <a href="/assets/dawarich-screenshot-3.webp" data-gallery="dawarich" data-alt="Dawarich screenshot 3" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/Freika/dawarich" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Cal.com -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/calcom-logo.svg" alt="Cal.com" class="app-logo">
-                                <div class="app-title-area"><h3>Cal.com</h3><span class="app-tagline">Időpontfoglaló</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Nyílt forráskódú Calendly alternatíva. Könnyű időpont egyeztetés ügyfelekkel, naptár integrációk és automatikus emlékeztetők.</p>
-                                <div class="app-features"><span class="app-feature">Foglalási oldal</span><span class="app-feature">Naptár szinkron</span><span class="app-feature">Csapatok</span><span class="app-feature">Emlékeztetők</span></div>
-                                <a href="/assets/calcom-screenshot-1.webp" data-gallery="calcom" class="app-shot-link"><img src="/assets/calcom-screenshot-1.webp" alt="Cal.com screenshot" class="app-screenshot"></a>
-                                <a href="/assets/calcom-screenshot-2.webp" data-gallery="calcom" data-alt="Cal.com screenshot 2" hidden></a>
-                                <a href="/assets/calcom-screenshot-3.webp" data-gallery="calcom" data-alt="Cal.com screenshot 3" hidden></a>
-                                <a href="/assets/calcom-screenshot-4.webp" data-gallery="calcom" data-alt="Cal.com screenshot 4" hidden></a>
-                                <a href="/assets/calcom-screenshot-5.webp" data-gallery="calcom" data-alt="Cal.com screenshot 5" hidden></a>
-                                <a href="/assets/calcom-screenshot-6.webp" data-gallery="calcom" data-alt="Cal.com screenshot 6" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/calcom/cal.com" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- LubeLogger -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/lubelogger-logo.png" alt="LubeLogger" class="app-logo">
-                                <div class="app-title-area"><h3>LubeLogger</h3><span class="app-tagline">Autónyilvántartás</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">A családi autó teljes története egy helyen: szervizek, javítások, tankolások és költségek. Emlékeztetők olajcserére, műszakira és biztosításra, a számlák pedig a rekord mellé csatolva.</p>
-                                <div class="app-features"><span class="app-feature">Szerviznapló</span><span class="app-feature">Tankolás</span><span class="app-feature">Emlékeztetők</span><span class="app-feature">Költségek</span></div>
-                                <a href="/assets/lubelogger-screenshot-1.webp" data-gallery="lubelogger" class="app-shot-link"><img src="/assets/lubelogger-screenshot-1.webp" alt="LubeLogger screenshot" class="app-screenshot"></a>
-                                <a href="/assets/lubelogger-screenshot-2.webp" data-gallery="lubelogger" data-alt="LubeLogger screenshot 2" hidden></a>
-                                <a href="/assets/lubelogger-screenshot-3.webp" data-gallery="lubelogger" data-alt="LubeLogger screenshot 3" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/hargata/lubelog" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Grocy -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/grocy-logo.svg" alt="Grocy" class="app-logo">
-                                <div class="app-title-area"><h3>Grocy</h3><span class="app-tagline">Háztartásvezetés</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Nyilvántartja, mi van otthon, és szól, ha valami elfogyott vagy lejár. Bevásárlólista, ami magától felveszi a hiányzót, vonalkódolvasás a telefon kamerájával, receptek és heti étrend, házimunkák beosztása.</p>
-                                <div class="app-features"><span class="app-feature">Készlet</span><span class="app-feature">Bevásárlólista</span><span class="app-feature">Vonalkód</span><span class="app-feature">Házimunkák</span></div>
-                                <a href="/assets/grocy-screenshot-1.webp" data-gallery="grocy" class="app-shot-link"><img src="/assets/grocy-screenshot-1.webp" alt="Grocy screenshot" class="app-screenshot"></a>
-                                <a href="/assets/grocy-screenshot-2.webp" data-gallery="grocy" data-alt="Grocy screenshot 2" hidden></a>
-                                <a href="/assets/grocy-screenshot-3.webp" data-gallery="grocy" data-alt="Grocy screenshot 3" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/grocy/grocy" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-
-                <!-- ==================== -->
-                <!-- 4. PRODUKTIVITÁS & TUDÁSKEZELÉS -->
-                <!-- ==================== -->
-                <div class="category-section" id="produktivitas">
-                    <div class="category-header">
-                        <span class="category-icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chart-column"/></svg></span>
-                        <h2>Produktivitás & Tudáskezelés</h2>
-                        <span class="app-count">12 alkalmazás</span>
-                    </div>
-                    <div class="app-grid">
-                        <!-- Vikunja -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/vikunja-logo.svg" alt="Vikunja" class="app-logo">
-                                <div class="app-title-area"><h3>Vikunja</h3><span class="app-tagline">Feladatkezelő (Todoist)</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Nyílt forráskódú Todoist alternatíva. Feladatok, projektek, határidők – Kanban, Gantt és lista nézettel. Emlékeztetők és csapat együttműködés.</p>
-                                <div class="app-features"><span class="app-feature">Kanban</span><span class="app-feature">Gantt</span><span class="app-feature">Emlékeztetők</span><span class="app-feature">Csapatok</span></div>
-                                <a href="/assets/vikunja-screenshot-1.webp" data-gallery="vikunja" class="app-shot-link"><img src="/assets/vikunja-screenshot-1.webp" alt="Vikunja screenshot" class="app-screenshot"></a>
-                                <a href="/assets/vikunja-screenshot-2.webp" data-gallery="vikunja" data-alt="Vikunja screenshot 2" hidden></a>
-                                <a href="/assets/vikunja-screenshot-3.webp" data-gallery="vikunja" data-alt="Vikunja screenshot 3" hidden></a>
-                                <a href="/assets/vikunja-screenshot-4.webp" data-gallery="vikunja" data-alt="Vikunja screenshot 4" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/go-vikunja/vikunja" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Radicale -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/radicale-logo.svg" alt="Radicale" class="app-logo">
-                                <div class="app-title-area"><h3>Radicale</h3><span class="app-tagline">Naptár és névjegyek</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">A telefonod naptára és névjegyei a saját szervereden, nem a Google-nél vagy az Apple-nél. Közös családi naptár; Androidon a DAVx5, iPhone-on és Macen a beépített naptár szinkronizál vele.</p>
-                                <div class="app-features"><span class="app-feature">CalDAV</span><span class="app-feature">CardDAV</span><span class="app-feature">Családi naptár</span><span class="app-feature">Thunderbird</span></div>
-                                <a href="/assets/radicale-screenshot-1.webp" data-gallery="radicale" class="app-shot-link"><img src="/assets/radicale-screenshot-1.webp" alt="Radicale screenshot" class="app-screenshot"></a>
-                                <a href="/assets/radicale-screenshot-2.webp" data-gallery="radicale" data-alt="Radicale screenshot 2" hidden></a>
-                                <a href="/assets/radicale-screenshot-3.webp" data-gallery="radicale" data-alt="Radicale screenshot 3" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/Kozea/Radicale" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Kimai -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/kimai-logo.png" alt="Kimai" class="app-logo">
-                                <div class="app-title-area"><h3>Kimai</h3><span class="app-tagline">Időkövetés</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Professzionális időkövetés szabadúszóknak és csapatoknak. Projektek, ügyfelek, riportok és számlázási export egyetlen rendszerben.</p>
-                                <div class="app-features"><span class="app-feature">Projektek</span><span class="app-feature">Riportok</span><span class="app-feature">Export</span><span class="app-feature">Számlázás</span></div>
-                                <a href="/assets/kimai-screenshot-1.webp" data-gallery="kimai" class="app-shot-link"><img src="/assets/kimai-screenshot-1.webp" alt="Kimai screenshot" class="app-screenshot"></a>
-                                <a href="/assets/kimai-screenshot-2.webp" data-gallery="kimai" data-alt="Kimai screenshot 2" hidden></a>
-                                <a href="/assets/kimai-screenshot-3.webp" data-gallery="kimai" data-alt="Kimai screenshot 3" hidden></a>
-                                <a href="/assets/kimai-screenshot-4.webp" data-gallery="kimai" data-alt="Kimai screenshot 4" hidden></a>
-                                <a href="/assets/kimai-screenshot-5.webp" data-gallery="kimai" data-alt="Kimai screenshot 5" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/kimai/kimai" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Rallly -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/rallly-logo.svg" alt="Rallly" class="app-logo">
-                                <div class="app-title-area"><h3>Rallly</h3><span class="app-tagline">Időpont szavazás (Doodle)</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Találkozók és események időpontjának egyeztetése egyszerűen. Doodle alternatíva – szavazók regisztráció nélkül, időzóna kezeléssel.</p>
-                                <div class="app-features"><span class="app-feature">Szavazás</span><span class="app-feature">Nincs regisztráció</span><span class="app-feature">Időzónák</span><span class="app-feature">Értesítések</span></div>
-                                <a href="/assets/rallly-screenshot-1.webp" data-gallery="rallly" class="app-shot-link"><img src="/assets/rallly-screenshot-1.webp" alt="Rallly screenshot" class="app-screenshot"></a>
-                                <a href="/assets/rallly-screenshot-2.webp" data-gallery="rallly" data-alt="Rallly screenshot 2" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/lukevella/rallly" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Claper -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/claper-logo.svg" alt="Claper" class="app-logo">
-                                <div class="app-title-area"><h3>Claper</h3><span class="app-tagline">Interaktív prezentációk</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Élő szavazások, kérdések és szófelhők prezentációkhoz. Mentimeter/AhaSlides alternatíva – tedd interaktívvá az előadásaidat.</p>
-                                <div class="app-features"><span class="app-feature">Élő szavazás</span><span class="app-feature">Kérdések</span><span class="app-feature">Szófelhő</span><span class="app-feature">Reakciók</span></div>
-                                <a href="/assets/claper-screenshot-1.webp" data-gallery="claper" class="app-shot-link"><img src="/assets/claper-screenshot-1.webp" alt="Claper screenshot" class="app-screenshot"></a>
-                                <a href="/assets/claper-screenshot-2.webp" data-gallery="claper" data-alt="Claper screenshot 2" hidden></a>
-                                <a href="/assets/claper-screenshot-3.webp" data-gallery="claper" data-alt="Claper screenshot 3" hidden></a>
-                                <a href="/assets/claper-screenshot-4.webp" data-gallery="claper" data-alt="Claper screenshot 4" hidden></a>
-                                <a href="/assets/claper-screenshot-5.webp" data-gallery="claper" data-alt="Claper screenshot 5" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/ClaperCo/Claper" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Ghost -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/ghost-logo.svg" alt="Ghost" class="app-logo">
-                                <div class="app-title-area"><h3>Ghost</h3><span class="app-tagline">Blog & hírlevél platform</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Modern publikációs platform bloggereknek és tartalomkészítőknek. Gyönyörű témák, beépített hírlevél, és tagság/előfizetés kezelés.</p>
-                                <div class="app-features"><span class="app-feature">Blog</span><span class="app-feature">Hírlevél</span><span class="app-feature">Tagság</span><span class="app-feature">SEO</span></div>
-                                <a href="/assets/ghost-screenshot-1.webp" data-gallery="ghost" class="app-shot-link"><img src="/assets/ghost-screenshot-1.webp" alt="Ghost screenshot" class="app-screenshot"></a>
-                                <a href="/assets/ghost-screenshot-2.webp" data-gallery="ghost" data-alt="Ghost screenshot 2" hidden></a>
-                                <a href="/assets/ghost-screenshot-3.webp" data-gallery="ghost" data-alt="Ghost screenshot 3" hidden></a>
-                                <a href="/assets/ghost-screenshot-4.webp" data-gallery="ghost" data-alt="Ghost screenshot 4" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/TryGhost/Ghost" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Paperless-ngx -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/paperless-ngx-logo.svg" alt="Paperless-ngx" class="app-logo">
-                                <div class="app-title-area"><h3>Paperless-ngx</h3><span class="app-tagline">Digitális irattár</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Szkenneld be a papír dokumentumaidat és felejtsd el őket. OCR, automatikus kategorizálás, és teljes szöveges keresés.</p>
-                                <div class="app-features"><span class="app-feature">OCR</span><span class="app-feature">Auto kategória</span><span class="app-feature">Keresés</span><span class="app-feature">Címkék</span></div>
-                                <a href="/assets/paperless-ngx-screenshot-1.webp" data-gallery="paperless-ngx" class="app-shot-link"><img src="/assets/paperless-ngx-screenshot-1.webp" alt="Paperless-ngx screenshot" class="app-screenshot"></a>
-                                <a href="/assets/paperless-ngx-screenshot-2.webp" data-gallery="paperless-ngx" data-alt="Paperless-ngx screenshot 2" hidden></a>
-                                <a href="/assets/paperless-ngx-screenshot-3.webp" data-gallery="paperless-ngx" data-alt="Paperless-ngx screenshot 3" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/paperless-ngx/paperless-ngx" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- BookStack -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/bookstack-logo.svg" alt="BookStack" class="app-logo">
-                                <div class="app-title-area"><h3>BookStack</h3><span class="app-tagline">Könyv-szerű dokumentáció</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Egyszerű, önhostolt wiki platform. Rendezd tudásodat könyvekbe, fejezetekbe és oldalakra – könnyen kereshető formában.</p>
-                                <div class="app-features"><span class="app-feature">WYSIWYG</span><span class="app-feature">Könyvek</span><span class="app-feature">Keresés</span><span class="app-feature">Jogosultságok</span></div>
-                                <a href="/assets/bookstack-screenshot-1.webp" data-gallery="bookstack" class="app-shot-link"><img src="/assets/bookstack-screenshot-1.webp" alt="BookStack screenshot" class="app-screenshot"></a>
-                                <a href="/assets/bookstack-screenshot-2.webp" data-gallery="bookstack" data-alt="BookStack screenshot 2" hidden></a>
-                                <a href="/assets/bookstack-screenshot-3.webp" data-gallery="bookstack" data-alt="BookStack screenshot 3" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/BookStackApp/BookStack" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Outline -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/outline-logo.svg" alt="Outline" class="app-logo">
-                                <div class="app-title-area"><h3>Outline</h3><span class="app-tagline">Csapat tudásbázis</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Gyönyörű wiki és tudásbázis csapatok számára. Markdown támogatás, valós idejű együttműködés, és strukturált dokumentáció.</p>
-                                <div class="app-features"><span class="app-feature">Markdown</span><span class="app-feature">Együttműködés</span><span class="app-feature">Keresés</span><span class="app-feature">Integráció</span></div>
-                                <a href="/assets/outline-screenshot-1.webp" data-gallery="outline" class="app-shot-link"><img src="/assets/outline-screenshot-1.webp" alt="Outline screenshot" class="app-screenshot"></a>
-                                <a href="/assets/outline-screenshot-2.webp" data-gallery="outline" data-alt="Outline screenshot 2" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/outline/outline" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge" style="color: var(--warn);"><img src="/assets/checkmark-yellow.svg" alt="">Korlátozott licenc</span>
-                            </div>
-                        </div>
-                        <!-- Docmost -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/docmost-logo.png" alt="Docmost" class="app-logo">
-                                <div class="app-title-area"><h3>Docmost</h3><span class="app-tagline">Notion-szerű wiki</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Modern wiki és dokumentáció platform Notion-szerű blokk szerkesztővel. Terek és oldalak hierarchiában, valós idejű közös szerkesztés, keresés a teljes tartalomban.</p>
-                                <div class="app-features"><span class="app-feature">Blokk szerkesztő</span><span class="app-feature">Közös szerkesztés</span><span class="app-feature">Keresés</span><span class="app-feature">Táblázatok</span></div>
-                                <a href="/assets/docmost-screenshot-1.webp" data-gallery="docmost" class="app-shot-link"><img src="/assets/docmost-screenshot-1.webp" alt="Docmost screenshot" class="app-screenshot"></a>
-                                <a href="/assets/docmost-screenshot-2.webp" data-gallery="docmost" data-alt="Docmost screenshot 2" hidden></a>
-                                <a href="/assets/docmost-screenshot-3.webp" data-gallery="docmost" data-alt="Docmost screenshot 3" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/docmost/docmost" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Karakeep -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/karakeep-logo.svg" alt="Karakeep" class="app-logo">
-                                <div class="app-title-area"><h3>Karakeep</h3><span class="app-tagline">Kereshető saját archívum</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Könyvjelzők, cikkek, jegyzetek és képek egy helyen. A Karakeep letölti és elteszi a mentett oldalak tartalmát, akkor is, ha az oldal később eltűnik. Teljes szöveges keresés, böngészőbővítmény és telefonos alkalmazás.</p>
-                                <div class="app-features"><span class="app-feature">Oldalmentés</span><span class="app-feature">Keresés</span><span class="app-feature">Böngészőbővítmény</span><span class="app-feature">Mobil app</span></div>
-                                <a href="/assets/karakeep-screenshot-1.webp" data-gallery="karakeep" class="app-shot-link"><img src="/assets/karakeep-screenshot-1.webp" alt="Karakeep screenshot" class="app-screenshot"></a>
-                                <a href="/assets/karakeep-screenshot-2.webp" data-gallery="karakeep" data-alt="Karakeep screenshot 2" hidden></a>
-                                <a href="/assets/karakeep-screenshot-3.webp" data-gallery="karakeep" data-alt="Karakeep screenshot 3" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/karakeep-app/karakeep" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- PrivateBin -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/privatebin-logo.png" alt="PrivateBin" class="app-logo">
-                                <div class="app-title-area"><h3>PrivateBin</h3><span class="app-tagline">Titkosított jegyzet megosztás</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Minimális, titkosított pastebin. A szerver nem látja a tartalmakat – tökéletes érzékeny szövegek biztonságos megosztására.</p>
-                                <div class="app-features"><span class="app-feature">E2E titkosítás</span><span class="app-feature">Lejárat</span><span class="app-feature">Égés után</span><span class="app-feature">Jelszóvédelem</span></div>
-                                <a href="/assets/privatebin-screenshot-1.webp" data-gallery="privatebin" class="app-shot-link"><img src="/assets/privatebin-screenshot-1.webp" alt="PrivateBin screenshot" class="app-screenshot"></a>
-                                <a href="/assets/privatebin-screenshot-2.webp" data-gallery="privatebin" data-alt="PrivateBin screenshot 2" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/PrivateBin/PrivateBin" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-
-                <!-- ==================== -->
-                <!-- 5. RENDSZER & FEJLESZTÉS -->
-                <!-- ==================== -->
-                <div class="category-section" id="rendszer">
-                    <div class="category-header">
-                        <span class="category-icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-wrench"/></svg></span>
-                        <h2>Rendszer & Fejlesztés</h2>
-                        <span class="app-count">9 alkalmazás</span>
-                    </div>
-                    <div class="app-grid">
-                        <!-- Vaultwarden -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/vaultwarden-logo.svg" alt="Vaultwarden" class="app-logo">
-                                <div class="app-title-area"><h3>Vaultwarden</h3><span class="app-tagline">Jelszókezelő (Bitwarden)</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Könnyű Bitwarden szerver implementáció. Tárold biztonságosan a jelszavaidat, és szinkronizáld minden eszközödön.</p>
-                                <div class="app-features"><span class="app-feature">E2E titkosítás</span><span class="app-feature">Mobil app</span><span class="app-feature">Böngésző kieg.</span><span class="app-feature">2FA</span></div>
-                                <a href="/assets/vaultwarden-screenshot-1.webp" data-gallery="vaultwarden" class="app-shot-link"><img src="/assets/vaultwarden-screenshot-1.webp" alt="Vaultwarden screenshot" class="app-screenshot"></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/dani-garcia/vaultwarden" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Homepage -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/homepage-logo.svg" alt="Homepage" class="app-logo">
-                                <div class="app-title-area"><h3>Homepage</h3><span class="app-tagline">Személyes kezdőlap</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Gyönyörű és funkciókban gazdag kezdőlap a szerveredhez. Szolgáltatás státuszok, widgetek, könyvjelzők egy helyen.</p>
-                                <div class="app-features"><span class="app-feature">Widgetek</span><span class="app-feature">Integrációk</span><span class="app-feature">Témák</span><span class="app-feature">Státusz</span></div>
-                                <a href="/assets/homepage-screenshot-1.webp" data-gallery="homepage" class="app-shot-link"><img src="/assets/homepage-screenshot-1.webp" alt="Homepage screenshot" class="app-screenshot"></a>
-                                <a href="/assets/homepage-screenshot-2.webp" data-gallery="homepage" data-alt="Homepage screenshot 2" hidden></a>
-                                <a href="/assets/homepage-screenshot-3.webp" data-gallery="homepage" data-alt="Homepage screenshot 3" hidden></a>
-                                <a href="/assets/homepage-screenshot-4.webp" data-gallery="homepage" data-alt="Homepage screenshot 4" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/gethomepage/homepage" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Glance -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/glance-logo.svg" alt="Glance" class="app-logo">
-                                <div class="app-title-area"><h3>Glance</h3><span class="app-tagline">Információs dashboard</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Minimális, gyors dashboard mindenféle információval. RSS, időjárás, könyvjelzők, Reddit, YouTube és sok más egy oldalon.</p>
-                                <div class="app-features"><span class="app-feature">RSS</span><span class="app-feature">Időjárás</span><span class="app-feature">YouTube</span><span class="app-feature">Gyors</span></div>
-                                <a href="/assets/glance-screenshot-1.webp" data-gallery="glance" class="app-shot-link"><img src="/assets/glance-screenshot-1.webp" alt="Glance screenshot" class="app-screenshot"></a>
-                                <a href="/assets/glance-screenshot-2.webp" data-gallery="glance" data-alt="Glance screenshot 2" hidden></a>
-                                <a href="/assets/glance-screenshot-3.webp" data-gallery="glance" data-alt="Glance screenshot 3" hidden></a>
-                                <a href="/assets/glance-screenshot-4.webp" data-gallery="glance" data-alt="Glance screenshot 4" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/glanceapp/glance" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Uptime Kuma -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/uptime-kuma-logo.svg" alt="Uptime Kuma" class="app-logo">
-                                <div class="app-title-area"><h3>Uptime Kuma</h3><span class="app-tagline">Szolgáltatás monitoring</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Elegáns szolgáltatás monitorozó. Figyeld a weboldalaidat, API-kat, és kapj értesítést ha valami nem működik.</p>
-                                <div class="app-features"><span class="app-feature">HTTP/TCP/DNS</span><span class="app-feature">Értesítések</span><span class="app-feature">Státusz oldal</span><span class="app-feature">Grafikonok</span></div>
-                                <a href="/assets/uptime-kuma-screenshot-1.webp" data-gallery="uptime-kuma" class="app-shot-link"><img src="/assets/uptime-kuma-screenshot-1.webp" alt="Uptime Kuma screenshot" class="app-screenshot"></a>
-                                <a href="/assets/uptime-kuma-screenshot-2.webp" data-gallery="uptime-kuma" data-alt="Uptime Kuma screenshot 2" hidden></a>
-                                <a href="/assets/uptime-kuma-screenshot-3.webp" data-gallery="uptime-kuma" data-alt="Uptime Kuma screenshot 3" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/louislam/uptime-kuma" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Grafana -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/grafana-logo.svg" alt="Grafana" class="app-logo">
-                                <div class="app-title-area"><h3>Grafana</h3><span class="app-tagline">Adatvizualizáció</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Professzionális monitoring és vizualizációs platform. Gyönyörű dashboardok, riasztások és adatelemzés – bármilyen adatforrásból.</p>
-                                <div class="app-features"><span class="app-feature">Dashboardok</span><span class="app-feature">Riasztások</span><span class="app-feature">Adatforrások</span><span class="app-feature">Lekérdezések</span></div>
-                                <a href="/assets/grafana-screenshot-1.webp" data-gallery="grafana" class="app-shot-link"><img src="/assets/grafana-screenshot-1.webp" alt="Grafana screenshot" class="app-screenshot"></a>
-                                <a href="/assets/grafana-screenshot-2.webp" data-gallery="grafana" data-alt="Grafana screenshot 2" hidden></a>
-                                <a href="/assets/grafana-screenshot-3.webp" data-gallery="grafana" data-alt="Grafana screenshot 3" hidden></a>
-                                <a href="/assets/grafana-screenshot-4.webp" data-gallery="grafana" data-alt="Grafana screenshot 4" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/grafana/grafana" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Termix -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/termix-logo.svg" alt="Termix" class="app-logo">
-                                <div class="app-title-area"><h3>Termix</h3><span class="app-tagline">Szerver menedzser (SSH)</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Webes SSH terminál és szerver kezelő platform. Csatlakozz szervereidhez bárhonnan böngészőből, kezelj SSH tunneleket, szerkessz fájlokat távolról.</p>
-                                <div class="app-features"><span class="app-feature">SSH terminál</span><span class="app-feature">Tunneling</span><span class="app-feature">Fájlkezelő</span><span class="app-feature">2FA</span></div>
-                                <a href="/assets/termix-screenshot-1.webp" data-gallery="termix" class="app-shot-link"><img src="/assets/termix-screenshot-1.webp" alt="Termix screenshot" class="app-screenshot"></a>
-                                <a href="/assets/termix-screenshot-2.webp" data-gallery="termix" data-alt="Termix screenshot 2" hidden></a>
-                                <a href="/assets/termix-screenshot-3.webp" data-gallery="termix" data-alt="Termix screenshot 3" hidden></a>
-                                <a href="/assets/termix-screenshot-4.webp" data-gallery="termix" data-alt="Termix screenshot 4" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/Termix-SSH/Termix" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Gitea -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/gitea-logo.svg" alt="Gitea" class="app-logo">
-                                <div class="app-title-area"><h3>Gitea</h3><span class="app-tagline">Git szerver (GitHub)</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Könnyű, gyors Git hosting szolgáltatás. A saját GitHub/GitLab-od, issue tracking, CI/CD, és package registry.</p>
-                                <div class="app-features"><span class="app-feature">Git hosting</span><span class="app-feature">Issues</span><span class="app-feature">CI/CD</span><span class="app-feature">Wiki</span></div>
-                                <a href="/assets/gitea-screenshot-1.webp" data-gallery="gitea" class="app-shot-link"><img src="/assets/gitea-screenshot-1.webp" alt="Gitea screenshot" class="app-screenshot"></a>
-                                <a href="/assets/gitea-screenshot-2.webp" data-gallery="gitea" data-alt="Gitea screenshot 2" hidden></a>
-                                <a href="/assets/gitea-screenshot-3.webp" data-gallery="gitea" data-alt="Gitea screenshot 3" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/go-gitea/gitea" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Code-Server -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/code-server-logo.svg" alt="Code-Server" class="app-logo">
-                                <div class="app-title-area"><h3>Code-Server</h3><span class="app-tagline">VS Code böngészőben</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Visual Studio Code a böngészőben. Fejlessz bárhonnan, bármilyen eszközről – ugyanazzal az ismerős felülettel.</p>
-                                <div class="app-features"><span class="app-feature">VS Code</span><span class="app-feature">Bővítmények</span><span class="app-feature">Terminál</span><span class="app-feature">Git</span></div>
-                                <a href="/assets/code-server-screenshot-1.webp" data-gallery="code-server" class="app-shot-link"><img src="/assets/code-server-screenshot-1.webp" alt="Code-Server screenshot" class="app-screenshot"></a>
-                                <a href="/assets/code-server-screenshot-2.webp" data-gallery="code-server" data-alt="Code-Server screenshot 2" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/coder/code-server" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- OpenGist -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/opengist-logo.png" alt="OpenGist" class="app-logo">
-                                <div class="app-title-area"><h3>OpenGist</h3><span class="app-tagline">Kód snippetek (Gist)</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Saját GitHub Gist szerver. Kód snippetek megosztása, szintaxis kiemelés, és verziókezelés Git alapokon.</p>
-                                <div class="app-features"><span class="app-feature">Snippetek</span><span class="app-feature">Szintaxis</span><span class="app-feature">Git</span><span class="app-feature">Embed</span></div>
-                                <a href="/assets/opengist-screenshot-1.webp" data-gallery="opengist" class="app-shot-link"><img src="/assets/opengist-screenshot-1.webp" alt="OpenGist screenshot" class="app-screenshot"></a>
-                                <a href="/assets/opengist-screenshot-2.webp" data-gallery="opengist" data-alt="OpenGist screenshot 2" hidden></a>
-                                <a href="/assets/opengist-screenshot-3.webp" data-gallery="opengist" data-alt="OpenGist screenshot 3" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/thomiceli/opengist" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Forráskód</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-
-            </div>
-        </section>
-
-        <!-- Stats Section -->
-        <section class="stats-section">
-            <div class="container">
-                <div class="stats-grid">
-                    <div class="stat-item">
-                        <h3>58</h3>
-                        <p>Elérhető alkalmazás</p>
-                    </div>
-                    <div class="stat-item">
-                        <h3>5</h3>
-                        <p>Kategória</p>
-                    </div>
-                    <div class="stat-item">
-                        <h3>51</h3>
-                        <p>Nyílt forráskódú</p>
-                    </div>
-                    <div class="stat-item">
-                        <h3>0 Ft</h3>
-                        <p>Licenc költség</p>
-                    </div>
-                </div>
-            </div>
-        </section>
-
-        <!-- CTA Section -->
-        <section class="cta-section">
-            <div class="container">
-                <h2>Nem találod amit keresel?</h2>
-                <p>Ez a teljes katalógus. Ha van egy konkrét igényed, keress minket – megnézzük, felvehető-e a megfelelő alkalmazás.</p>
-                <a href="/kapcsolat" class="cta-button">Kapcsolatfelvétel →</a>
-            </div>
-        </section>
-    </main>
-
-    <script>
-    (function() {
-        var hamburger = document.getElementById('hamburger');
-        var navLinks = document.querySelector('.nav-links');
-        var overlay = document.getElementById('mobileOverlay');
-        var body = document.body;
-
-        if (!hamburger || !navLinks || !overlay) {
-            console.warn('[mobile-menu] Missing elements:', {
-                hamburger: !!hamburger,
-                navLinks: !!navLinks,
-                overlay: !!overlay
-            });
-            return;
-        }
-
-        function openMenu() {
-            hamburger.classList.add('is-active');
-            navLinks.classList.add('is-open');
-            overlay.classList.add('is-visible');
-            body.classList.add('menu-open');
-            hamburger.setAttribute('aria-expanded', 'true');
-            hamburger.setAttribute('aria-label', 'Menü bezárása');
-        }
-
-        function closeMenu() {
-            hamburger.classList.remove('is-active');
-            navLinks.classList.remove('is-open');
-            overlay.classList.remove('is-visible');
-            body.classList.remove('menu-open');
-            hamburger.setAttribute('aria-expanded', 'false');
-            hamburger.setAttribute('aria-label', 'Menü megnyitása');
-        }
-
-        hamburger.addEventListener('click', function() {
-            if (navLinks.classList.contains('is-open')) {
-                closeMenu();
-            } else {
-                openMenu();
-            }
-        });
-
-        overlay.addEventListener('click', closeMenu);
-
-        navLinks.querySelectorAll('a').forEach(function(link) {
-            link.addEventListener('click', closeMenu);
-        });
-
-        document.addEventListener('keydown', function(e) {
-            if (e.key === 'Escape' && navLinks.classList.contains('is-open')) {
-                closeMenu();
-            }
-        });
-
-        window.addEventListener('resize', function() {
-            if (window.innerWidth > 900 && navLinks.classList.contains('is-open')) {
-                closeMenu();
-            }
-        });
-    })();
-    </script>
-<footer>
-        <div class="container">
-            <p>© 2026 felhom.eu – Saját felhőd, saját szabályaid</p>
-            <p class="footer-legal">Üzemeltető: Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Adatkezelési tájékoztató</a> · <a href="/feltetelek">Feltételek</a></p>
-        </div>
-    </footer>
-    <script>
-    (function(){
-        var b=document.getElementById('navBurger'),s=document.getElementById('sidebar'),k=document.getElementById('navBackdrop');
-        if(!b||!s||!k)return;
-        function open(){s.classList.add('is-open');k.hidden=false;document.body.classList.add('nav-open');b.setAttribute('aria-expanded','true');}
-        function close(){s.classList.remove('is-open');k.hidden=true;document.body.classList.remove('nav-open');b.setAttribute('aria-expanded','false');}
-        b.addEventListener('click',function(){s.classList.contains('is-open')?close():open();});
-        k.addEventListener('click',close);
-        document.addEventListener('keydown',function(e){if(e.key==='Escape'&&s.classList.contains('is-open')){close();b.focus();}});
-        s.querySelectorAll('a').forEach(function(l){l.addEventListener('click',close);});
-        window.addEventListener('resize',function(){if(window.innerWidth>768)close();});
-    })();
-    document.addEventListener('click',function(e){
-        var btn=e.target.closest?e.target.closest('.nav-group-toggle'):null;
-        if(!btn)return;
-        var g=btn.closest('.nav-group');if(!g)return;
-        var willOpen=!g.classList.contains('is-open');
-        document.querySelectorAll('.nav-group.is-open').forEach(function(x){
-            x.classList.remove('is-open');
-            var t=x.querySelector('.nav-group-toggle');if(t)t.setAttribute('aria-expanded','false');
-        });
-        if(willOpen){g.classList.add('is-open');btn.setAttribute('aria-expanded','true');}
-    });
-    </script>
-</body>
-</html>
diff --git a/website/preview/m3/biztonsagimentes.html b/website/preview/m3/biztonsagimentes.html
deleted file mode 100644
index 5b861b0e..00000000
--- a/website/preview/m3/biztonsagimentes.html
+++ /dev/null
@@ -1,374 +0,0 @@
-<!DOCTYPE html>
-<html lang="hu" class="no-js">
-<head>
-    <script>document.documentElement.className=document.documentElement.className.replace('no-js','js');</script>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Biztonsági mentés — 3-2-1 mentési stratégia otthoni szerverekhez | Felhom.eu</title>
-    <meta name="description" content="Professzionális 3-2-1 biztonsági mentés otthoni szerverhez. Automatikus backup három szinten: a dobozon, egy második meghajtón és titkosítva egy távoli tárhelyen.">
-    <meta name="keywords" content="biztonsági mentés, backup, 3-2-1 mentési szabály, offsite backup, adatmentés, otthoni szerver backup, titkosított mentés, automatikus mentés">
-    <meta name="robots" content="index, follow">
-    <link rel="canonical" href="https://felhom.eu/biztonsagimentes">
-    <link rel="alternate" hreflang="hu" href="https://felhom.eu/biztonsagimentes">
-    <link rel="alternate" hreflang="en" href="https://felhom.eu/en/backups">
-    <link rel="alternate" hreflang="x-default" href="https://felhom.eu/biztonsagimentes">
-
-    <meta property="og:type" content="article">
-    <meta property="og:url" content="https://felhom.eu/biztonsagimentes">
-    <meta property="og:title" content="3-2-1 biztonsági mentés otthoni szerverhez">
-    <meta property="og:description" content="Professzionális szintű adatbiztonság otthon. Automatikus backup, és egy titkosított másolat távol is.">
-    <meta property="og:image" content="https://felhom.eu/assets/og-image.png">
-    <meta property="og:locale" content="hu_HU">
-    <meta property="og:site_name" content="Felhom.eu">
-
-    <meta name="twitter:card" content="summary_large_image">
-    <meta name="twitter:title" content="3-2-1 biztonsági mentés otthoni szerverhez">
-    <meta name="twitter:description" content="Professzionális adatvédelem otthoni szerveredre. Automatikus backup, offsite mentés.">
-    <meta name="twitter:image" content="https://felhom.eu/assets/og-image.png">
-
-    <script type="application/ld+json">
-    {
-      "@context": "https://schema.org",
-      "@type": "Article",
-      "headline": "3-2-1 biztonsági mentési stratégia otthoni szerverekhez",
-      "description": "Hogyan védd meg az adataidat professzionális mentési stratégiával otthoni környezetben.",
-      "author": {"@type": "Organization", "name": "Felhom.eu"},
-      "publisher": {"@type": "Organization", "name": "Felhom.eu", "logo": {"@type": "ImageObject", "url": "https://felhom.eu/assets/logo.png"}},
-      "mainEntityOfPage": "https://felhom.eu/biztonsagimentes"
-    }
-    </script>
-    <!-- shared assets: bump ?v= together on any site.css/icons.svg change -->
-    <link rel="stylesheet" href="/assets/site.css?v=21">
-    <link rel="stylesheet" href="/assets/shell.css?v=21">
-    <link rel="icon" type="image/png" href="/assets/logo_favicon_2.svg">
-    <script defer src="https://stats.felhom.eu/script.js" data-website-id="d419db57-5e1c-48df-bdb3-c29f25fb1661"></script>
-</head>
-<body class="shell page-biztonsagimentes">
-    <header class="mobile-topbar">
-        <a href="/preview/m3/" class="mobile-topbar-logo"><img src="/assets/logo_notext_white.svg" alt="Felhom.eu"></a>
-        <button type="button" class="nav-burger" id="navBurger" aria-expanded="false" aria-controls="sidebar" aria-label="Menü">
-            <span class="hamburger-box"><span class="hamburger-line"></span><span class="hamburger-line"></span><span class="hamburger-line"></span></span>
-        </button>
-    </header>
-    <div class="nav-backdrop" id="navBackdrop" hidden></div>
-    <nav class="sidebar" id="sidebar">
-        <div class="sidebar-header">
-            <a href="/preview/m3/" class="sidebar-logo-link">
-                <img src="/assets/logo_notext_white.svg" alt="" class="sidebar-logo" aria-hidden="true">
-                <img src="/assets/logo-wordmark.png" alt="felhom.eu" class="sidebar-word">
-            </a>
-        </div>
-        <ul class="nav-links">
-                <li><a href="/preview/m3/"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg>Kezdőlap</a></li>
-                <li><a href="/preview/m3/#szolgaltatasok"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rocket"/></svg>Szolgáltatások</a></li>
-                <li class="nav-group">
-                    <button type="button" class="nav-group-toggle" aria-expanded="false" aria-controls="nav-group-apps"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg>Alkalmazások<svg class="ico nav-chevron" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chevron-down"/></svg></button>
-                    <ul id="nav-group-apps" class="nav-links nav-links-sub nav-links-nested">
-                        <li><a href="/preview/m3/alkalmazasok">Minden alkalmazás</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#fajlkezeles-irodai">Fájlkezelés &amp; Irodai</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#media-szorakozas">Média &amp; Szórakozás</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#otthon-eletmod">Otthon &amp; Életmód</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#produktivitas-tudaskezeles">Produktivitás &amp; Tudáskezelés</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#rendszer-fejlesztes">Rendszer &amp; Fejlesztés</a></li>
-                    </ul>
-                </li>
-                <li><a href="/preview/m3/technologiak"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg>Technológiák</a></li>
-                <li><a href="/preview/m3/biztonsagimentes" class="active"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg>Biztonsági mentés</a></li>
-        </ul>
-        <div class="sidebar-bottom">
-            <a href="/preview/m3/teszteles" class="btn btn-outline sidebar-cta">Jelentkezem tesztelőnek →</a>
-            <div class="nav-group-label">A Felhomról</div>
-            <ul class="nav-links nav-links-sub">
-                    <li><a href="/preview/m3/#hogyan-mukodik">Hogyan működik</a></li>
-                    <li><a href="/preview/m3/gyik">GYIK</a></li>
-                    <li><a href="/preview/m3/kapcsolat">Kapcsolat</a></li>
-            </ul>
-            <div class="sidebar-footer">
-                <details class="lang-globe"><summary class="lang-globe-btn" aria-label="Nyelv" title="Nyelv"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/preview/m3/biztonsagimentes" lang="hu" hreflang="hu" class="lang-globe-item current" aria-current="true">Magyar</a></li><li><a href="/preview/m3/en/backups" lang="en" hreflang="en" class="lang-globe-item">English</a></li></ul></details>
-            </div>
-        </div>
-    </nav>
-<main class="content">
-                <div class="page-header">
-                <h1>Biztonsági <span>Mentés</span></h1>
-            </div>
-                <p class="page-lede">Az adataid biztonsága az első. Professzionális mentési stratégiával gondoskodunk róla, hogy egy hiba vagy baleset után is legyen honnan visszahozni.</p>
-
-
-        <!-- Bevezető -->
-        <section class="content-section">
-            <div class="container">
-                <div class="info-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-circle-help"/></svg> Miért fontos ez?</h3>
-                    <p>Amikor valaki felhőszolgáltatást választ – legyen az Google Drive, iCloud, vagy bármilyen más – az egyik legfontosabb szempont az <strong>adatbiztonság</strong>. Nem az a kérdés, hogy valaki hozzáfér-e az adatainkhoz, hanem hogy <strong>megmaradnak-e</strong>.</p>
-                    <p>A nagy szolgáltatók ezt milliárd dolláros infrastruktúrával oldják meg: több adatközpont, redundáns tárolás, automatikus mentések. De vajon otthoni szerveren is elérhető ugyanez a biztonság?</p>
-                    <div class="highlight-box">
-                        <p><strong>A válasz: igen.</strong> A megfelelő mentési stratégiával az otthoni szervered ugyanolyan biztonságos lehet, mint bármely felhőszolgáltató – sőt, te irányítasz mindent.</p>
-                    </div>
-                </div>
-            </div>
-        </section>
-
-        <!-- 3-2-1 szabály -->
-        <section class="content-section alt-bg">
-            <div class="container">
-                <div class="section-header">
-                    <h2>A 3-2-1 <span>Mentési Szabály</span></h2>
-                    <p>Az iparági szabvány, amit a professzionális rendszergazdák és vállalatok használnak világszerte</p>
-                </div>
-
-                <div class="backup-rule">
-                    <div class="rule-number">3</div>
-                    <div class="rule-content">
-                        <h3>Három másolat az adataidból</h3>
-                        <p>Mindig legyen legalább három példány minden fontos adatodból: az eredeti, és két biztonsági másolat. Ha az egyik sérül vagy elvész, még mindig van kettő tartalékban.</p>
-                        <div class="example-box">
-                            <div class="label">Példa</div>
-                            <p>A családi fotóid megvannak a szerveren (1), egy külső merevlemezen (2), és egy távoli helyen (3).</p>
-                        </div>
-                    </div>
-                </div>
-
-                <div class="backup-rule">
-                    <div class="rule-number">2</div>
-                    <div class="rule-content">
-                        <h3>Két különböző tárolótípus</h3>
-                        <p>Az adatokat legalább kétféle tárolóeszközön tartsd. A különböző eszközök különböző meghibásodási módokkal rendelkeznek – ha az egyik típus elromlik, a másik valószínűleg rendben lesz.</p>
-                        <div class="example-box">
-                            <div class="label">Példa</div>
-                            <p>A szerver belső SSD-jén tárolod az adatokat, de a mentés külső HDD-re vagy NAS-ra kerül.</p>
-                        </div>
-                    </div>
-                </div>
-
-                <div class="backup-rule">
-                    <div class="rule-number">1</div>
-                    <div class="rule-content">
-                        <h3>Egy offsite (távoli) másolat</h3>
-                        <p>Legalább egy másolat legyen fizikailag más helyen. Ez véd a lokális katasztrófák ellen: tűz, vízkár, betörés, vagy akár egy villámcsapás sem veszélyeztetheti az összes adatodat.</p>
-                        <div class="example-box">
-                            <div class="label">Példa</div>
-                            <p>A mentés automatikusan átmásolódik egy barát/rokon szerverére, vagy titkosítva felhőbe kerül.</p>
-                        </div>
-                    </div>
-                </div>
-
-                <div class="backup-diagram">
-                    <h3>Így néz ki a gyakorlatban</h3>
-                    <div class="diagram-visual">
-                        <div class="diagram-node primary">
-                            <div class="icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-monitor"/></svg></div>
-                            <div class="label">Szerver</div>
-                            <div class="sublabel">Eredeti adat</div>
-                        </div>
-                        <div class="diagram-arrow">→</div>
-                        <div class="diagram-node">
-                            <div class="icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-hard-drive"/></svg></div>
-                            <div class="label">Helyi backup</div>
-                            <div class="sublabel">Külső HDD/NAS</div>
-                        </div>
-                        <div class="diagram-arrow">→</div>
-                        <div class="diagram-node">
-                            <div class="icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></div>
-                            <div class="label">Offsite backup</div>
-                            <div class="sublabel">Távoli hely</div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </section>
-
-        <!-- Offsite megoldások -->
-        <section class="content-section">
-            <div class="container">
-                <div class="section-header">
-                    <h2>Offsite <span>Mentési Megoldások</span></h2>
-                    <p>Az "1" a 3-2-1 szabályban – a legfontosabb, és sokszor a legelhanyagoltabb</p>
-                </div>
-
-                <div class="methods-grid">
-                    <div class="method-card">
-                        <div class="method-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-users"/></svg></div>
-                        <h3>„Haver rendszer"</h3>
-                        <p>A legegyszerűbb és legolcsóbb megoldás: cserélj mentéseket egy megbízható ismerőssel. Te mentesz az ő szerverére, ő ment a tiédre.</p>
-                        <ul class="method-pros">
-                            <li>Nincs havi díj</li>
-                            <li>Teljes kontroll az adatok felett</li>
-                            <li>Kölcsönös biztonság</li>
-                            <li>End-to-end titkosítás lehetséges</li>
-                        </ul>
-                        <div class="example-box">
-                            <div class="label">Hogyan működik?</div>
-                            <p>Titkosított mentések automatikusan szinkronizálódnak VPN kapcsolaton keresztül.</p>
-                        </div>
-                    </div>
-
-                    <div class="method-card">
-                        <div class="method-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-building-2"/></svg></div>
-                        <h3>Otthon ↔ Iroda</h3>
-                        <p>Ha van munkahelyed vagy saját irodád, használd ki! A két helyszín természetes földrajzi távolságot biztosít.</p>
-                        <ul class="method-pros">
-                            <li>Meglévő infrastruktúra használata</li>
-                            <li>Biztonságos, ismert környezet</li>
-                            <li>Gyors helyreállítás szükség esetén</li>
-                        </ul>
-                        <div class="example-box">
-                            <div class="label">Tipp</div>
-                            <p>Egy kis, csendes mini PC az iroda sarkában tökéletes backup célpont lehet.</p>
-                        </div>
-                    </div>
-
-                    <div class="method-card">
-                        <div class="method-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-cloud"/></svg></div>
-                        <h3>Titkosított felhő backup</h3>
-                        <p>Ha nincs megbízható ismerős vagy második helyszín, a felhő a megoldás. Fontos: az adatokat a feltöltés előtt titkosítjuk!</p>
-                        <ul class="method-pros">
-                            <li>Professzionális infrastruktúra</li>
-                            <li>Földrajzilag elosztott tárolás</li>
-                            <li>Nincs szükség hardverre</li>
-                        </ul>
-                        <ul class="method-pros method-cons">
-                            <li>Havi/éves díj (tárolás méretétől függően)</li>
-                        </ul>
-                        <div class="example-box">
-                            <div class="label">Megjegyzés</div>
-                            <p>A tárhely díja a mentett adatmennyiségtől függ. A Felhom dobozon ezt a megoldást használjuk.</p>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </section>
-
-        <!-- Mi hogyan csináljuk -->
-        <section class="content-section alt-bg">
-            <div class="container">
-                <div class="section-header">
-                    <h2>Mi Hogyan <span>Oldjuk Meg?</span></h2>
-                    <p>Minden általunk telepített szerveren alapértelmezetten beállítjuk a mentéseket</p>
-                </div>
-
-                <div class="info-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-wrench"/></svg> Automatizált mentési rendszer</h3>
-                    <p>A szerver minden éjjel magától készít mentéseket, három szinten: <strong>a dobozon</strong>, egy <strong>második meghajtón</strong> (ha van), és <strong>titkosítva egy távoli tárhelyen</strong>. Nem kell semmire sem emlékezned – a rendszer gondoskodik róla.</p>
-                    <p>A mentések inkrementálisak, ami azt jelenti, hogy csak a változások kerülnek mentésre. Ez helyet és időt takarít meg, miközben a teljes visszaállítási lehetőség megmarad.</p>
-
-                    <div class="highlight-box">
-                        <p><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-monitor"/></svg> <strong>Nem csak az adatok:</strong> a Proxmox alapnak köszönhetően nem csupán a fájljaid és adatbázisaid menthetők, hanem az <strong>egész rendszered</strong> is – a teljes doboz is biztonsági mentésbe kerül, és ebből visszaállítható. Ha maga a doboz megy tönkre, az újratelepített rendszerre a titkosított távoli mentésből visszahozhatók az alkalmazásaid adatai – a helyreállítási kóddal.</p>
-                    </div>
-
-                    <div class="highlight-box">
-                        <p><strong>A távoli mentés helye:</strong> a Felhom dobozon a távoli másolat egy általunk biztosított tárhelyre kerül, titkosítva. A „haver rendszer” és az iroda általános lehetőségek a 3-2-1 szabályhoz – ezeket ma nem állítjuk be.</p>
-                    </div>
-
-                    <h3 style="margin-top: 24px;"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-lock"/></svg> A helyreállítási kód – amit csak te ismersz</h3>
-                    <p>A távoli mentésed titkosított, és a titkosítás kulcsa egy <strong>helyreállítási kód</strong>. Ez a kód pontosan egyszer jelenik meg: a te képernyődön, a beállításkor. Nálunk nem marad belőle másolat.</p>
-                    <p>Ez tudatos döntés, és két oldala van. Az egyik, hogy a távoli mentésedet rajtad kívül <strong>senki</strong> nem tudja elolvasni – mi sem. A másik, hogy ha a doboz megsemmisül és a kód is elveszett, akkor a távoli mentés <strong>nekünk sem visszaállítható</strong>. Ezért a kód papírra kerül, és jó helyre.</p>
-
-                    <h3 style="margin-top: 24px;"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chart-column"/></svg> Monitoring és értesítések</h3>
-                    <p>A mentéseket folyamatosan figyeljük. Ha probléma van – sikertelen mentés, betelő tárhely, kapcsolati hiba – az a felügyeleti rendszerünkben megjelenik, és e-mail értesítés is indul róla. A zárt teszt egyik célja épp az, hogy ezeket az értesítéseket éles körülmények között csiszoljuk.</p>
-                </div>
-            </div>
-        </section>
-
-        <!-- CTA -->
-        <section class="cta-section">
-            <div class="container">
-                <h2>Kérdésed van a <span>mentésekről?</span></h2>
-                <p>Beszéljük át, mi a legjobb megoldás a te helyzetedben. Segítünk megtalálni az egyensúlyt a biztonság és a költségek között.</p>
-                <a href="/kapcsolat" class="cta-button">Kapcsolatfelvétel →</a>
-            </div>
-        </section>
-    </main>
-    <script>
-    (function() {
-        var hamburger = document.getElementById('hamburger');
-        var navLinks = document.querySelector('.nav-links');
-        var overlay = document.getElementById('mobileOverlay');
-        var body = document.body;
-
-        if (!hamburger || !navLinks || !overlay) {
-            console.warn('[mobile-menu] Missing elements:', {
-                hamburger: !!hamburger,
-                navLinks: !!navLinks,
-                overlay: !!overlay
-            });
-            return;
-        }
-
-        function openMenu() {
-            hamburger.classList.add('is-active');
-            navLinks.classList.add('is-open');
-            overlay.classList.add('is-visible');
-            body.classList.add('menu-open');
-            hamburger.setAttribute('aria-expanded', 'true');
-            hamburger.setAttribute('aria-label', 'Menü bezárása');
-        }
-
-        function closeMenu() {
-            hamburger.classList.remove('is-active');
-            navLinks.classList.remove('is-open');
-            overlay.classList.remove('is-visible');
-            body.classList.remove('menu-open');
-            hamburger.setAttribute('aria-expanded', 'false');
-            hamburger.setAttribute('aria-label', 'Menü megnyitása');
-        }
-
-        hamburger.addEventListener('click', function() {
-            if (navLinks.classList.contains('is-open')) {
-                closeMenu();
-            } else {
-                openMenu();
-            }
-        });
-
-        overlay.addEventListener('click', closeMenu);
-
-        navLinks.querySelectorAll('a').forEach(function(link) {
-            link.addEventListener('click', closeMenu);
-        });
-
-        document.addEventListener('keydown', function(e) {
-            if (e.key === 'Escape' && navLinks.classList.contains('is-open')) {
-                closeMenu();
-            }
-        });
-
-        window.addEventListener('resize', function() {
-            if (window.innerWidth > 900 && navLinks.classList.contains('is-open')) {
-                closeMenu();
-            }
-        });
-    })();
-    </script>
-<footer>
-        <div class="container">
-            <p>© 2026 felhom.eu – Saját felhőd, saját szabályaid</p>
-            <p class="footer-legal">Üzemeltető: Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Adatkezelési tájékoztató</a> · <a href="/feltetelek">Feltételek</a></p>
-        </div>
-    </footer>
-    <script>
-    (function(){
-        var b=document.getElementById('navBurger'),s=document.getElementById('sidebar'),k=document.getElementById('navBackdrop');
-        if(!b||!s||!k)return;
-        function open(){s.classList.add('is-open');k.hidden=false;document.body.classList.add('nav-open');b.setAttribute('aria-expanded','true');}
-        function close(){s.classList.remove('is-open');k.hidden=true;document.body.classList.remove('nav-open');b.setAttribute('aria-expanded','false');}
-        b.addEventListener('click',function(){s.classList.contains('is-open')?close():open();});
-        k.addEventListener('click',close);
-        document.addEventListener('keydown',function(e){if(e.key==='Escape'&&s.classList.contains('is-open')){close();b.focus();}});
-        s.querySelectorAll('a').forEach(function(l){l.addEventListener('click',close);});
-        window.addEventListener('resize',function(){if(window.innerWidth>768)close();});
-    })();
-    document.addEventListener('click',function(e){
-        var btn=e.target.closest?e.target.closest('.nav-group-toggle'):null;
-        if(!btn)return;
-        var g=btn.closest('.nav-group');if(!g)return;
-        var willOpen=!g.classList.contains('is-open');
-        document.querySelectorAll('.nav-group.is-open').forEach(function(x){
-            x.classList.remove('is-open');
-            var t=x.querySelector('.nav-group-toggle');if(t)t.setAttribute('aria-expanded','false');
-        });
-        if(willOpen){g.classList.add('is-open');btn.setAttribute('aria-expanded','true');}
-    });
-    </script>
-</body>
-</html>
diff --git a/website/preview/m3/en/apps.html b/website/preview/m3/en/apps.html
deleted file mode 100644
index 24d00fed..00000000
--- a/website/preview/m3/en/apps.html
+++ /dev/null
@@ -1,1383 +0,0 @@
-<!DOCTYPE html>
-<html lang="en" class="no-js">
-<head>
-    <script>document.documentElement.className=document.documentElement.className.replace('no-js','js');</script>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Apps to install — 58 apps for a home server | Felhom.eu</title>
-    <meta name="description" content="Nextcloud, Immich, Jellyfin, Vaultwarden — 58 apps for your home server in Hungary, almost all of them open source. Alternatives to Google Drive, iCloud Photos and Spotify.">
-
-    <meta name="keywords" content="Nextcloud, Immich, Jellyfin, Plex, Sonarr, Radarr, Vaultwarden, open-source apps, self-hosted apps, home server apps, Google Photos alternative, Dropbox alternative">
-    <meta name="robots" content="index, follow">
-    <link rel="canonical" href="https://felhom.eu/en/apps">
-    <link rel="alternate" hreflang="hu" href="https://felhom.eu/alkalmazasok">
-    <link rel="alternate" hreflang="en" href="https://felhom.eu/en/apps">
-    <link rel="alternate" hreflang="x-default" href="https://felhom.eu/alkalmazasok">
-
-    <meta property="og:type" content="website">
-    <meta property="og:url" content="https://felhom.eu/en/apps">
-    <meta property="og:title" content="58 apps for a home server">
-    <meta property="og:description" content="Nextcloud, Immich, Jellyfin, Vaultwarden and many more. Files, photos, media, documents — all from your own server.">
-    <meta property="og:image" content="https://felhom.eu/assets/og-image.png">
-    <meta property="og:locale" content="en_GB">
-    <meta property="og:site_name" content="Felhom.eu">
-
-    <meta name="twitter:card" content="summary_large_image">
-    <meta name="twitter:title" content="58 apps for a home server">
-    <meta name="twitter:description" content="Nextcloud, Immich, Jellyfin and many more — from your own server.">
-    <meta name="twitter:image" content="https://felhom.eu/assets/og-image.png">
-
-    <script type="application/ld+json">
-    {
-    "@context": "https://schema.org",
-    "@type": "ItemList",
-    "name": "Felhom.eu — Apps to install",
-    "description": "Self-hosted apps for a home server, almost all of them open source",
-    "numberOfItems": 58,
-    "itemListElement": [
-        {"@type": "ListItem", "position": 1, "name": "Nextcloud", "description": "Files and office suite"},
-        {"@type": "ListItem", "position": 2, "name": "Immich", "description": "Photos and videos (a Google Photos alternative)"},
-        {"@type": "ListItem", "position": 3, "name": "Jellyfin", "description": "Media player and server"},
-        {"@type": "ListItem", "position": 4, "name": "Vaultwarden", "description": "Password manager (Bitwarden compatible)"},
-        {"@type": "ListItem", "position": 5, "name": "Paperless-ngx", "description": "Document management"}
-    ]
-    }
-    </script>
-    <!-- shared assets: bump ?v= together on any site.css/icons.svg change -->
-    <link rel="stylesheet" href="/assets/site.css?v=21">
-    <link rel="stylesheet" href="/assets/shell.css?v=21">
-    <link rel="icon" type="image/png" href="/assets/logo_favicon_2.svg">
-    <script defer src="/assets/gallery.js?v=2"></script>
-    <script defer src="https://stats.felhom.eu/script.js" data-website-id="d419db57-5e1c-48df-bdb3-c29f25fb1661"></script>
-</head>
-<body class="shell page-alkalmazasok">
-    <header class="mobile-topbar">
-        <a href="/preview/m3/en/" class="mobile-topbar-logo"><img src="/assets/logo_notext_white.svg" alt="Felhom.eu"></a>
-        <button type="button" class="nav-burger" id="navBurger" aria-expanded="false" aria-controls="sidebar" aria-label="Menu">
-            <span class="hamburger-box"><span class="hamburger-line"></span><span class="hamburger-line"></span><span class="hamburger-line"></span></span>
-        </button>
-    </header>
-    <div class="nav-backdrop" id="navBackdrop" hidden></div>
-    <nav class="sidebar" id="sidebar">
-        <div class="sidebar-header">
-            <a href="/preview/m3/en/" class="sidebar-logo-link">
-                <img src="/assets/logo_notext_white.svg" alt="" class="sidebar-logo" aria-hidden="true">
-                <img src="/assets/logo-wordmark.png" alt="felhom.eu" class="sidebar-word">
-            </a>
-        </div>
-        <ul class="nav-links">
-                <li><a href="/preview/m3/en/"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg>Home</a></li>
-                <li><a href="/preview/m3/en/#services"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rocket"/></svg>Services</a></li>
-                <li class="nav-group is-open">
-                    <button type="button" class="nav-group-toggle active" aria-expanded="true" aria-controls="nav-group-apps"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg>Applications<svg class="ico nav-chevron" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chevron-down"/></svg></button>
-                    <ul id="nav-group-apps" class="nav-links nav-links-sub nav-links-nested">
-                        <li><a href="/preview/m3/en/apps">All applications</a></li>
-                        <li><a href="/preview/m3/en/apps#files-office">Files &amp; Office</a></li>
-                        <li><a href="/preview/m3/en/apps#media-entertainment">Media &amp; Entertainment</a></li>
-                        <li><a href="/preview/m3/en/apps#home-lifestyle">Home &amp; Lifestyle</a></li>
-                        <li><a href="/preview/m3/en/apps#productivity-knowledge">Productivity &amp; Knowledge</a></li>
-                        <li><a href="/preview/m3/en/apps#system-development">System &amp; Development</a></li>
-                    </ul>
-                </li>
-                <li><a href="/preview/m3/en/technology"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg>Technology</a></li>
-                <li><a href="/preview/m3/en/backups"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg>Backups</a></li>
-        </ul>
-        <div class="sidebar-bottom">
-            <a href="/preview/m3/en/testing" class="btn btn-outline sidebar-cta">Apply as a tester →</a>
-            <div class="nav-group-label">About Felhom</div>
-            <ul class="nav-links nav-links-sub">
-                    <li><a href="/preview/m3/en/#how-it-works">How it works</a></li>
-                    <li><a href="/preview/m3/en/faq">FAQ</a></li>
-                    <li><a href="/preview/m3/en/contact">Contact</a></li>
-            </ul>
-            <div class="sidebar-footer">
-                <details class="lang-globe"><summary class="lang-globe-btn" aria-label="Language" title="Language"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/preview/m3/alkalmazasok" lang="hu" hreflang="hu" class="lang-globe-item">Magyar</a></li><li><a href="/preview/m3/en/apps" lang="en" hreflang="en" class="lang-globe-item current" aria-current="true">English</a></li></ul></details>
-            </div>
-        </div>
-    </nav>
-<main class="content">
-                <div class="page-header">
-                <h1>Apps to <span>install</span></h1>
-            </div>
-                <p class="page-lede">Choose from 58 apps. Almost all of them are free, open-source software, and every one runs on your own server.</p>
-                <div class="disclaimer-banner">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-info"/></svg> Good to know</h3>
-                    <ul>
-                        <li>Almost all of the apps are <strong>open source</strong> – anyone can check how they work. The exceptions are marked on the card: <em>Closed source</em> (Plex, Emby), <em>Restricted licence</em> (the source can be read, but the licence limits its use), <em>Felhom's own</em> (built by us)</li>
-                        <li>Our service covers <strong>installing</strong> the apps, not developing or selling them</li>
-                        <li>The original developers are responsible for how the apps work and for their updates</li>
-                        <li>If an app is missing, we look at whether it can join the catalog – <a href="/en/contact">just ask!</a></li>
-                    </ul>
-                </div>
-
-        <section class="apps-section">
-            <div class="container">
-
-                <!-- ==================== -->
-                <!-- 1. FILES & OFFICE -->
-                <!-- ==================== -->
-                <div class="category-section" id="files">
-                    <div class="category-header">
-                        <span class="category-icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-folder"/></svg></span>
-                        <h2>Files & Office</h2>
-                        <span class="app-count">6 apps + 1 built in</span>
-                    </div>
-                    <div class="app-grid">
-                        <!-- Nextcloud -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/nextcloud-logo.svg" alt="Nextcloud" class="app-logo">
-                                <div class="app-title-area"><h3>Nextcloud</h3><span class="app-tagline">Your own Google Drive</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">A full cloud service on your own server. File sync, calendar, contacts, document editing and a great many add-ons.</p>
-                                <div class="app-features"><span class="app-feature">File sync</span><span class="app-feature">Calendar</span><span class="app-feature">Documents</span><span class="app-feature">Mobile app</span></div>
-                                <a href="/assets/nextcloud-screenshot-1.webp" data-gallery="nextcloud" class="app-shot-link"><img src="/assets/nextcloud-screenshot-1.webp" alt="Nextcloud screenshot" class="app-screenshot"></a>
-                                <a href="/assets/nextcloud-screenshot-2.webp" data-gallery="nextcloud" data-alt="Nextcloud screenshot 2" hidden></a>
-                                <a href="/assets/nextcloud-screenshot-3.webp" data-gallery="nextcloud" data-alt="Nextcloud screenshot 3" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/nextcloud/server" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- FileBrowser -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/filebrowser-logo.svg" alt="FileBrowser" class="app-logo">
-                                <div class="app-title-area"><h3>FileBrowser</h3><span class="app-tagline">Simple web file manager</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">A light, fast web file manager, built into every Felhom box. Browse, upload and share your files from anywhere, in a modern interface.</p>
-                                <div class="app-features"><span class="app-feature">Drag & drop</span><span class="app-feature">Sharing</span><span class="app-feature">Preview</span><span class="app-feature">Search</span></div>
-                                <a href="/assets/filebrowser-screenshot-1.webp" data-gallery="filebrowser" class="app-shot-link"><img src="/assets/filebrowser-screenshot-1.webp" alt="FileBrowser screenshot" class="app-screenshot"></a>
-                                <a href="/assets/filebrowser-screenshot-2.webp" data-gallery="filebrowser" data-alt="FileBrowser screenshot 2" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/filebrowser/filebrowser" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source · Built in</span>
-                            </div>
-                        </div>
-                        <!-- Gokapi -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/gokapi-logo.png" alt="Gokapi" class="app-logo">
-                                <div class="app-title-area"><h3>Gokapi</h3><span class="app-tagline">Temporary file sharing</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">A lightweight file-sharing server with expiry dates and download limits. Good for sharing large files quickly and safely.</p>
-                                <div class="app-features"><span class="app-feature">Expiry date</span><span class="app-feature">Download limit</span><span class="app-feature">Password protection</span></div>
-                                <a href="/assets/gokapi-screenshot-1.webp" data-gallery="gokapi" class="app-shot-link"><img src="/assets/gokapi-screenshot-1.webp" alt="Gokapi screenshot" class="app-screenshot"></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/Forceu/Gokapi" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Zipline -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/zipline-logo.png" alt="Zipline" class="app-logo">
-                                <div class="app-title-area"><h3>Zipline</h3><span class="app-tagline">ShareX/Flameshot server</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">A modern file and image sharing server with many features. Good for sharing screenshots, shortening links and keeping text snippets.</p>
-                                <div class="app-features"><span class="app-feature">Screenshots</span><span class="app-feature">Link shortener</span><span class="app-feature">Gallery</span><span class="app-feature">API</span></div>
-                                <a href="/assets/zipline-screenshot-1.webp" data-gallery="zipline" class="app-shot-link"><img src="/assets/zipline-screenshot-1.webp" alt="Zipline screenshot" class="app-screenshot"></a>
-                                <a href="/assets/zipline-screenshot-2.webp" data-gallery="zipline" data-alt="Zipline screenshot 2" hidden></a>
-                                <a href="/assets/zipline-screenshot-3.webp" data-gallery="zipline" data-alt="Zipline screenshot 3" hidden></a>
-                                <a href="/assets/zipline-screenshot-4.webp" data-gallery="zipline" data-alt="Zipline screenshot 4" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/diced/zipline" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- OnlyOffice -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/onlyoffice-logo.svg" alt="OnlyOffice" class="app-logo">
-                                <div class="app-title-area"><h3>OnlyOffice</h3><span class="app-tagline">An office suite in the browser</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">A full office suite in your browser. Edit documents, spreadsheets and presentations, with very good Microsoft Office compatibility.</p>
-                                <div class="app-features"><span class="app-feature">Documents</span><span class="app-feature">Spreadsheets</span><span class="app-feature">Presentations</span><span class="app-feature">Collaboration</span></div>
-                                <a href="/assets/onlyoffice-screenshot-1.webp" data-gallery="onlyoffice" class="app-shot-link"><img src="/assets/onlyoffice-screenshot-1.webp" alt="OnlyOffice screenshot" class="app-screenshot"></a>
-                                <a href="/assets/onlyoffice-screenshot-2.webp" data-gallery="onlyoffice" data-alt="OnlyOffice screenshot 2" hidden></a>
-                                <a href="/assets/onlyoffice-screenshot-3.webp" data-gallery="onlyoffice" data-alt="OnlyOffice screenshot 3" hidden></a>
-                                <a href="/assets/onlyoffice-screenshot-4.webp" data-gallery="onlyoffice" data-alt="OnlyOffice screenshot 4" hidden></a>
-                                <a href="/assets/onlyoffice-screenshot-5.webp" data-gallery="onlyoffice" data-alt="OnlyOffice screenshot 5" hidden></a>
-                                <a href="/assets/onlyoffice-screenshot-6.webp" data-gallery="onlyoffice" data-alt="OnlyOffice screenshot 6" hidden></a>
-                                <a href="/assets/onlyoffice-screenshot-7.webp" data-gallery="onlyoffice" data-alt="OnlyOffice screenshot 7" hidden></a>
-                                <a href="/assets/onlyoffice-screenshot-8.webp" data-gallery="onlyoffice" data-alt="OnlyOffice screenshot 8" hidden></a>
-                                <a href="/assets/onlyoffice-screenshot-9.webp" data-gallery="onlyoffice" data-alt="OnlyOffice screenshot 9" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/ONLYOFFICE/DocumentServer" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- BentoPDF -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/bentopdf-logo.svg" alt="BentoPDF" class="app-logo">
-                                <div class="app-title-area"><h3>BentoPDF</h3><span class="app-tagline">PDF toolkit (privacy first)</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">A privacy-first PDF toolkit with more than 70 tools. Merge, split, convert, compress, OCR, encrypt and sign, all in the browser, with nothing sent to a server.</p>
-                                <div class="app-features"><span class="app-feature">70+ tools</span><span class="app-feature">Client-side</span><span class="app-feature">OCR</span><span class="app-feature">Convert</span></div>
-                                <a href="/assets/bentopdf-screenshot-1.webp" data-gallery="bentopdf" class="app-shot-link"><img src="/assets/bentopdf-screenshot-1.webp" alt="BentoPDF screenshot" class="app-screenshot"></a>
-                                <a href="/assets/bentopdf-screenshot-2.webp" data-gallery="bentopdf" data-alt="BentoPDF screenshot 2" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Papra -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/papra-logo.svg" alt="Papra" class="app-logo">
-                                <div class="app-title-area"><h3>Papra</h3><span class="app-tagline">A minimal document archive</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">A clean, modern document archive. Automatic tags, e-mail import and OCR text recognition: a digital filing cabinet, simple and tidy.</p>
-                                <div class="app-features"><span class="app-feature">Auto tags</span><span class="app-feature">E-mail import</span><span class="app-feature">OCR</span><span class="app-feature">Modern UI</span></div>
-                                <a href="/assets/papra-screenshot-1.webp" data-gallery="papra" class="app-shot-link"><img src="/assets/papra-screenshot-1.webp" alt="Papra screenshot" class="app-screenshot"></a>
-                                <a href="/assets/papra-screenshot-2.webp" data-gallery="papra" data-alt="Papra screenshot 2" hidden></a>
-                                <a href="/assets/papra-screenshot-3.webp" data-gallery="papra" data-alt="Papra screenshot 3" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/papra-hq/papra" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-
-                <!-- ==================== -->
-                <!-- 2. MEDIA & ENTERTAINMENT -->
-                <!-- ==================== -->
-                <div class="category-section" id="media">
-                    <div class="category-header">
-                        <span class="category-icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-tv"/></svg></span>
-                        <h2>Media & Entertainment</h2>
-                        <span class="app-count">15 apps</span>
-                    </div>
-                    <div class="app-grid">
-                        <!-- Immich -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/immich-logo.svg" alt="Immich" class="app-logo">
-                                <div class="app-title-area"><h3>Immich</h3><span class="app-tagline">A Google Photos alternative</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">A fast, modern photo and video backup. Automatic upload from your phone, face and object recognition, sharing and memories.</p>
-                                <div class="app-features"><span class="app-feature">Auto backup</span><span class="app-feature">Face recognition</span><span class="app-feature">Map</span><span class="app-feature">Mobile app</span></div>
-                                <a href="/assets/immich-screenshot-1.webp" data-gallery="immich" class="app-shot-link"><img src="/assets/immich-screenshot-1.webp" alt="Immich screenshot" class="app-screenshot"></a>
-                                <a href="/assets/immich-screenshot-2.webp" data-gallery="immich" data-alt="Immich screenshot 2" hidden></a>
-                                <a href="/assets/immich-screenshot-3.webp" data-gallery="immich" data-alt="Immich screenshot 3" hidden></a>
-                                <a href="/assets/immich-screenshot-4.webp" data-gallery="immich" data-alt="Immich screenshot 4" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/immich-app/immich" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Jellyfin -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/jellyfin-logo.svg" alt="Jellyfin" class="app-logo">
-                                <div class="app-title-area"><h3>Jellyfin</h3><span class="app-tagline">Media server (Netflix)</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">A free, open-source media server. Stream films, series and music from anywhere, to any device.</p>
-                                <div class="app-features"><span class="app-feature">Streaming</span><span class="app-feature">Transcoding</span><span class="app-feature">Mobile app</span><span class="app-feature">TV app</span></div>
-                                <a href="/assets/jellyfin-screenshot-1.webp" data-gallery="jellyfin" class="app-shot-link"><img src="/assets/jellyfin-screenshot-1.webp" alt="Jellyfin screenshot" class="app-screenshot"></a>
-                                <a href="/assets/jellyfin-screenshot-2.webp" data-gallery="jellyfin" data-alt="Jellyfin screenshot 2" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/jellyfin/jellyfin" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Plex -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/plex-logo.svg" alt="Plex" class="app-logo">
-                                <div class="app-title-area"><h3>Plex</h3><span class="app-tagline">Media server (premium)</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">A popular media server with a polished interface. Films, series, music and photos in one place, with very good app support.</p>
-                                <div class="app-features"><span class="app-feature">Streaming</span><span class="app-feature">Plex Pass</span><span class="app-feature">Intro skip</span><span class="app-feature">Watch Together</span></div>
-                                <a href="/assets/plex-screenshot-1.webp" data-gallery="plex" class="app-shot-link"><img src="/assets/plex-screenshot-1.webp" alt="Plex screenshot" class="app-screenshot"></a>
-                                <a href="/assets/plex-screenshot-2.webp" data-gallery="plex" data-alt="Plex screenshot 2" hidden></a>
-                                <a href="/assets/plex-screenshot-3.webp" data-gallery="plex" data-alt="Plex screenshot 3" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://www.plex.tv" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Website</a>
-                                <span class="open-source-badge" style="color: var(--warn);"><img src="/assets/checkmark-yellow.svg" alt="">Closed source</span>
-                            </div>
-                        </div>
-                        <!-- Emby -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/emby-logo.svg" alt="Emby" class="app-logo">
-                                <div class="app-title-area"><h3>Emby</h3><span class="app-tagline">Media server</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">A personal media server with live TV and DVR support. An organised library, remote access, and sync for offline playback.</p>
-                                <div class="app-features"><span class="app-feature">Streaming</span><span class="app-feature">Live TV</span><span class="app-feature">DVR</span><span class="app-feature">Sync</span></div>
-                                <a href="/assets/emby-screenshot-1.webp" data-gallery="emby" class="app-shot-link"><img src="/assets/emby-screenshot-1.webp" alt="Emby screenshot" class="app-screenshot"></a>
-                                <a href="/assets/emby-screenshot-2.webp" data-gallery="emby" data-alt="Emby screenshot 2" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://emby.media" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Website</a>
-                                <span class="open-source-badge" style="color: var(--warn);"><img src="/assets/checkmark-yellow.svg" alt="">Closed source</span>
-                            </div>
-                        </div>
-                        <!-- Navidrome -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/navidrome-logo.svg" alt="Navidrome" class="app-logo">
-                                <div class="app-title-area"><h3>Navidrome</h3><span class="app-tagline">Music server (Spotify)</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">A light, modern music server. Stream your own music collection from anywhere; Subsonic-compatible, with many mobile apps.</p>
-                                <div class="app-features"><span class="app-feature">Streaming</span><span class="app-feature">Subsonic API</span><span class="app-feature">Mobile apps</span><span class="app-feature">Playlists</span></div>
-                                <a href="/assets/navidrome-screenshot-1.webp" data-gallery="navidrome" class="app-shot-link"><img src="/assets/navidrome-screenshot-1.webp" alt="Navidrome screenshot" class="app-screenshot"></a>
-                                <a href="/assets/navidrome-screenshot-2.webp" data-gallery="navidrome" data-alt="Navidrome screenshot 2" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/navidrome/navidrome" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Audiobookshelf -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/audiobookshelf-logo.svg" alt="Audiobookshelf" class="app-logo">
-                                <div class="app-title-area"><h3>Audiobookshelf</h3><span class="app-tagline">Audiobooks & podcasts</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">An audiobook and podcast server. Details fetched for you, carry on where you stopped, and its own mobile apps.</p>
-                                <div class="app-features"><span class="app-feature">Audiobooks</span><span class="app-feature">Podcasts</span><span class="app-feature">Sync</span><span class="app-feature">Mobile app</span></div>
-                                <a href="/assets/audiobookshelf-screenshot-1.webp" data-gallery="audiobookshelf" class="app-shot-link"><img src="/assets/audiobookshelf-screenshot-1.webp" alt="Audiobookshelf screenshot" class="app-screenshot"></a>
-                                <a href="/assets/audiobookshelf-screenshot-2.webp" data-gallery="audiobookshelf" data-alt="Audiobookshelf screenshot 2" hidden></a>
-                                <a href="/assets/audiobookshelf-screenshot-3.webp" data-gallery="audiobookshelf" data-alt="Audiobookshelf screenshot 3" hidden></a>
-                                <a href="/assets/audiobookshelf-screenshot-4.webp" data-gallery="audiobookshelf" data-alt="Audiobookshelf screenshot 4" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/advplyr/audiobookshelf" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- MeTube -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/metube-logo.svg" alt="MeTube" class="app-logo">
-                                <div class="app-title-area"><h3>MeTube</h3><span class="app-tagline">Download videos from a link</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Download a video or a playlist from its link, as video or audio only. The downloads go to your drive; you see them in the file browser and your media player. Only your family members reach it.</p>
-                                <div class="app-features"><span class="app-feature">Video and audio</span><span class="app-feature">Playlists</span><span class="app-feature">To your drive</span><span class="app-feature">Family only</span></div>
-                                <a href="/assets/metube-screenshot-1.webp" data-gallery="metube" class="app-shot-link"><img src="/assets/metube-screenshot-1.webp" alt="MeTube screenshot" class="app-screenshot"></a>
-                                <a href="/assets/metube-screenshot-2.webp" data-gallery="metube" data-alt="MeTube screenshot 2" hidden></a>
-                                <a href="/assets/metube-screenshot-3.webp" data-gallery="metube" data-alt="MeTube screenshot 3" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/alexta69/metube" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Calibre-web -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/calibre-web-logo.svg" alt="Calibre-Web Automated" class="app-logo">
-                                <div class="app-title-area"><h3>Calibre-Web Automated</h3><span class="app-tagline">E-book library</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">A web interface for your Calibre library. Browse, read and download your e-books from anywhere, with Kindle support.</p>
-                                <div class="app-features"><span class="app-feature">E-books</span><span class="app-feature">Send to Kindle</span><span class="app-feature">OPDS</span><span class="app-feature">Reader</span></div>
-                                <a href="/assets/calibre-web-screenshot-1.webp" data-gallery="calibre-web" class="app-shot-link"><img src="/assets/calibre-web-screenshot-1.webp" alt="Calibre-Web Automated screenshot" class="app-screenshot"></a>
-                                <a href="/assets/calibre-web-screenshot-2.webp" data-gallery="calibre-web" data-alt="Calibre-Web Automated screenshot 2" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/crocodilestick/Calibre-Web-Automated" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Komga -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/komga-logo.svg" alt="Komga" class="app-logo">
-                                <div class="app-title-area"><h3>Komga</h3><span class="app-tagline">Comics & manga server</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Manage and read comics, manga and magazines. A modern web reader, OPDS support and popular mobile apps.</p>
-                                <div class="app-features"><span class="app-feature">Web reader</span><span class="app-feature">OPDS</span><span class="app-feature">Metadata</span><span class="app-feature">Tachiyomi</span></div>
-                                <a href="/assets/komga-screenshot-1.webp" data-gallery="komga" class="app-shot-link"><img src="/assets/komga-screenshot-1.webp" alt="Komga screenshot" class="app-screenshot"></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/gotson/komga" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Grimmory -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/grimmory-logo.svg" alt="Grimmory" class="app-logo">
-                                <div class="app-title-area"><h3>Grimmory</h3><span class="app-tagline">E-book library in the browser</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">E-books and comics in a tidy library, with covers and details. Read in the browser with your progress saved; Kobo and KOReader sync, and an OPDS catalog for reader apps. Only your family members reach it, each with their own sign-in.</p>
-                                <div class="app-features"><span class="app-feature">Browser reader</span><span class="app-feature">Kobo sync</span><span class="app-feature">KOReader</span><span class="app-feature">OPDS</span></div>
-                                <a href="/assets/grimmory-screenshot-1.webp" data-gallery="grimmory" class="app-shot-link"><img src="/assets/grimmory-screenshot-1.webp" alt="Grimmory screenshot" class="app-screenshot"></a>
-                                <a href="/assets/grimmory-screenshot-2.webp" data-gallery="grimmory" data-alt="Grimmory screenshot 2" hidden></a>
-                                <a href="/assets/grimmory-screenshot-3.webp" data-gallery="grimmory" data-alt="Grimmory screenshot 3" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/grimmory-tools/grimmory" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Sonarr -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/sonarr-logo.svg" alt="Sonarr" class="app-logo">
-                                <div class="app-title-area"><h3>Sonarr</h3><span class="app-tagline">Series manager</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Downloads and organises series for you. Follow your favourite series and new episodes are downloaded automatically.</p>
-                                <div class="app-features"><span class="app-feature">Auto download</span><span class="app-feature">Calendar</span><span class="app-feature">Quality profiles</span><span class="app-feature">Integrations</span></div>
-                                <a href="/assets/sonarr-screenshot-1.webp" data-gallery="sonarr" class="app-shot-link"><img src="/assets/sonarr-screenshot-1.webp" alt="Sonarr screenshot" class="app-screenshot"></a>
-                                <a href="/assets/sonarr-screenshot-2.webp" data-gallery="sonarr" data-alt="Sonarr screenshot 2" hidden></a>
-                                <a href="/assets/sonarr-screenshot-3.webp" data-gallery="sonarr" data-alt="Sonarr screenshot 3" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/Sonarr/Sonarr" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Radarr -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/radarr-logo.png" alt="Radarr" class="app-logo">
-                                <div class="app-title-area"><h3>Radarr</h3><span class="app-tagline">Film manager</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Downloads and organises films for you. Make a wish list and the films arrive in your library on their own.</p>
-                                <div class="app-features"><span class="app-feature">Wish list</span><span class="app-feature">Auto download</span><span class="app-feature">Quality profiles</span><span class="app-feature">Integrations</span></div>
-                                <a href="/assets/radarr-screenshot-1.webp" data-gallery="radarr" class="app-shot-link"><img src="/assets/radarr-screenshot-1.webp" alt="Radarr screenshot" class="app-screenshot"></a>
-                                <a href="/assets/radarr-screenshot-2.webp" data-gallery="radarr" data-alt="Radarr screenshot 2" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/Radarr/Radarr" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Seerr -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/seerr-logo.png" alt="Seerr" class="app-logo">
-                                <div class="app-title-area"><h3>Seerr</h3><span class="app-tagline">Media request manager</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Ask for films and series the easy way. Family and friends can request titles, and the system downloads them for you.</p>
-                                <div class="app-features"><span class="app-feature">Requests</span><span class="app-feature">Users</span><span class="app-feature">Notifications</span><span class="app-feature">Integrations</span></div>
-                                <a href="/assets/seerr-screenshot-1.webp" data-gallery="seerr" class="app-shot-link"><img src="/assets/seerr-screenshot-1.webp" alt="Seerr screenshot" class="app-screenshot"></a>
-                                <a href="/assets/seerr-screenshot-2.webp" data-gallery="seerr" data-alt="Seerr screenshot 2" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/Fallenbagel/jellyseerr" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- RoMM -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/romm-logo.svg" alt="RoMM" class="app-logo">
-                                <div class="app-title-area"><h3>RoMM</h3><span class="app-tagline">ROM collection manager</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">A good-looking web interface for your retro game ROM collection. Details and cover art fetched for you, sorted by platform, and playable in the browser.</p>
-                                <div class="app-features"><span class="app-feature">ROM library</span><span class="app-feature">Metadata</span><span class="app-feature">EmulatorJS</span><span class="app-feature">IGDB</span></div>
-                                <a href="/assets/romm-screenshot-1.webp" data-gallery="romm" class="app-shot-link"><img src="/assets/romm-screenshot-1.webp" alt="RoMM screenshot" class="app-screenshot"></a>
-                                <a href="/assets/romm-screenshot-2.webp" data-gallery="romm" data-alt="RoMM screenshot 2" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/rommapp/romm" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Crafty Controller -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/crafty-controller-logo.png" alt="Crafty Controller" class="app-logo">
-                                <div class="app-title-area"><h3>Crafty Controller</h3><span class="app-tagline">Minecraft server manager</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">A modern web manager for Minecraft servers. Run several servers from one interface, with automatic backups, player statistics and full remote access.</p>
-                                <div class="app-features"><span class="app-feature">Multi-server</span><span class="app-feature">Backups</span><span class="app-feature">Console</span><span class="app-feature">Statistics</span></div>
-                                <a href="/assets/crafty-controller-screenshot-1.webp" data-gallery="crafty-controller" class="app-shot-link"><img src="/assets/crafty-controller-screenshot-1.webp" alt="Crafty Controller screenshot" class="app-screenshot"></a>
-                                <a href="/assets/crafty-controller-screenshot-2.webp" data-gallery="crafty-controller" data-alt="Crafty Controller screenshot 2" hidden></a>
-                                <a href="/assets/crafty-controller-screenshot-3.webp" data-gallery="crafty-controller" data-alt="Crafty Controller screenshot 3" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://gitlab.com/crafty-controller/crafty-4" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-
-                <!-- ==================== -->
-                <!-- 3. HOME & LIFESTYLE -->
-                <!-- ==================== -->
-                <div class="category-section" id="home">
-                    <div class="category-header">
-                        <span class="category-icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg></span>
-                        <h2>Home & Lifestyle</h2>
-                        <span class="app-count">14 apps</span>
-                    </div>
-                    <div class="app-grid">
-                        <!-- Home Assistant -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/home-assistant-logo.svg" alt="Home Assistant" class="app-logo">
-                                <div class="app-title-area"><h3>Home Assistant</h3><span class="app-tagline">Smart home hub</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">The world's most popular open-source smart home platform. More than 3000 integrations, local control and automations, with no cloud and full privacy.</p>
-                                <div class="app-features"><span class="app-feature">3000+ integrations</span><span class="app-feature">Automations</span><span class="app-feature">Local control</span><span class="app-feature">Mobile app</span></div>
-                                <a href="/assets/home-assistant-screenshot-1.webp" data-gallery="home-assistant" class="app-shot-link"><img src="/assets/home-assistant-screenshot-1.webp" alt="Home Assistant screenshot" class="app-screenshot"></a>
-                                <a href="/assets/home-assistant-screenshot-2.webp" data-gallery="home-assistant" data-alt="Home Assistant screenshot 2" hidden></a>
-                                <a href="/assets/home-assistant-screenshot-3.webp" data-gallery="home-assistant" data-alt="Home Assistant screenshot 3" hidden></a>
-                                <a href="/assets/home-assistant-screenshot-4.webp" data-gallery="home-assistant" data-alt="Home Assistant screenshot 4" hidden></a>
-                                <a href="/assets/home-assistant-screenshot-5.webp" data-gallery="home-assistant" data-alt="Home Assistant screenshot 5" hidden></a>
-                                <a href="/assets/home-assistant-screenshot-6.webp" data-gallery="home-assistant" data-alt="Home Assistant screenshot 6" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/home-assistant/core" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- n8n -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/n8n-logo.svg" alt="n8n" class="app-logo">
-                                <div class="app-title-area"><h3>n8n</h3><span class="app-tagline">Workflow automation</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Visual workflow automation in the style of Zapier or Make. Connect any service and build automations without code, on your own server.</p>
-                                <div class="app-features"><span class="app-feature">400+ integrations</span><span class="app-feature">Visual editor</span><span class="app-feature">AI features</span><span class="app-feature">Webhooks</span></div>
-                                <a href="/assets/n8n-screenshot-1.webp" data-gallery="n8n" class="app-shot-link"><img src="/assets/n8n-screenshot-1.webp" alt="n8n screenshot" class="app-screenshot"></a>
-                                <a href="/assets/n8n-screenshot-2.webp" data-gallery="n8n" data-alt="n8n screenshot 2" hidden></a>
-                                <a href="/assets/n8n-screenshot-3.webp" data-gallery="n8n" data-alt="n8n screenshot 3" hidden></a>
-                                <a href="/assets/n8n-screenshot-4.webp" data-gallery="n8n" data-alt="n8n screenshot 4" hidden></a>
-                                <a href="/assets/n8n-screenshot-5.webp" data-gallery="n8n" data-alt="n8n screenshot 5" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/n8n-io/n8n" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge" style="color: var(--warn);"><img src="/assets/checkmark-yellow.svg" alt="">Restricted licence</span>
-                            </div>
-                        </div>
-                        <!-- Tandoor Recipes -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/tandoor-logo.png" alt="Tandoor Recipes" class="app-logo">
-                                <div class="app-title-area"><h3>Tandoor Recipes</h3><span class="app-tagline">Recipe manager</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Keep your recipes, plan meals and make a shopping list. Import recipes from the web and share them with your family.</p>
-                                <div class="app-features"><span class="app-feature">Recipe import</span><span class="app-feature">Meal planning</span><span class="app-feature">Shopping list</span><span class="app-feature">Sharing</span></div>
-                                <a href="/assets/tandoor-screenshot-1.webp" data-gallery="tandoor" class="app-shot-link"><img src="/assets/tandoor-screenshot-1.webp" alt="Tandoor Recipes screenshot" class="app-screenshot"></a>
-                                <a href="/assets/tandoor-screenshot-2.webp" data-gallery="tandoor" data-alt="Tandoor Recipes screenshot 2" hidden></a>
-                                <a href="/assets/tandoor-screenshot-3.webp" data-gallery="tandoor" data-alt="Tandoor Recipes screenshot 3" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/TandoorRecipes/recipes" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge" style="color: var(--warn);"><img src="/assets/checkmark-yellow.svg" alt="">Restricted licence</span>
-                            </div>
-                        </div>
-                        <!-- Mealie -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/mealie-logo.svg" alt="Mealie" class="app-logo">
-                                <div class="app-title-area"><h3>Mealie</h3><span class="app-tagline">Recipes and meal plans</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">A recipe manager and meal planner for the household. Import a recipe from a web page, plan the week's meals and get a shopping list, and share recipes with the family; the interface speaks English and Hungarian among others.</p>
-                                <div class="app-features"><span class="app-feature">Recipe import</span><span class="app-feature">Weekly menu</span><span class="app-feature">Shopping list</span><span class="app-feature">Multilingual</span></div>
-                                <a href="/assets/mealie-screenshot-1.webp" data-gallery="mealie" class="app-shot-link"><img src="/assets/mealie-screenshot-1.webp" alt="Mealie screenshot" class="app-screenshot"></a>
-                                <a href="/assets/mealie-screenshot-2.webp" data-gallery="mealie" data-alt="Mealie screenshot 2" hidden></a>
-                                <a href="/assets/mealie-screenshot-3.webp" data-gallery="mealie" data-alt="Mealie screenshot 3" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/mealie-recipes/mealie" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Recipe Importer -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/recipe-importer-logo.svg" alt="Recipe Importer" class="app-logo">
-                                <div class="app-title-area"><h3>Recipe Importer</h3><span class="app-tagline">From Hungarian recipe sites</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Import recipes from six Hungarian sites (mindmegette.hu, streetkitchen.hu, nosalty.hu, sobors.hu, kiskegyed.hu, gastrohobbi.hu) into Mealie and Tandoor, one at a time or in bulk, and edit them before they are saved.</p>
-                                <div class="app-features"><span class="app-feature">6 Hungarian sites</span><span class="app-feature">Bulk import</span><span class="app-feature">Mealie</span><span class="app-feature">Tandoor</span></div>
-                                <a href="/assets/recipe-importer-screenshot-1.webp" data-gallery="recipe-importer" class="app-shot-link"><img src="/assets/recipe-importer-screenshot-1.webp" alt="Recipe Importer screenshot" class="app-screenshot"></a>
-                                <a href="/assets/recipe-importer-screenshot-2.webp" data-gallery="recipe-importer" data-alt="Recipe Importer screenshot 2" hidden></a>
-                                <a href="/assets/recipe-importer-screenshot-3.webp" data-gallery="recipe-importer" data-alt="Recipe Importer screenshot 3" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <span class="open-source-badge" style="color: var(--warn);"><img src="/assets/checkmark-yellow.svg" alt="">Felhom's own</span>
-                            </div>
-                        </div>
-                        <!-- Wishlist -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/wishlist-logo.svg" alt="Wishlist" class="app-logo">
-                                <div class="app-title-area"><h3>Wishlist</h3><span class="app-tagline">Family wish list</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">A wish list you can share, for Christmas, birthdays and other occasions. The family can reserve gifts, so nobody buys the same present twice.</p>
-                                <div class="app-features"><span class="app-feature">Groups</span><span class="app-feature">Reservations</span><span class="app-feature">Link import</span><span class="app-feature">PWA</span></div>
-                                <a href="/assets/wishlist-screenshot-1.webp" data-gallery="wishlist" class="app-shot-link"><img src="/assets/wishlist-screenshot-1.webp" alt="Wishlist screenshot" class="app-screenshot"></a>
-                                <a href="/assets/wishlist-screenshot-2.webp" data-gallery="wishlist" data-alt="Wishlist screenshot 2" hidden></a>
-                                <a href="/assets/wishlist-screenshot-3.webp" data-gallery="wishlist" data-alt="Wishlist screenshot 3" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/cmintey/wishlist" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Homebox -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/homebox-logo.svg" alt="Homebox" class="app-logo">
-                                <div class="app-title-area"><h3>Homebox</h3><span class="app-tagline">Home inventory</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Keep track of what you own: sorted by location, tag and category, with warranties and what you paid. Scan a barcode to add something quickly, and have the list ready for an insurance claim.</p>
-                                <div class="app-features"><span class="app-feature">Inventory</span><span class="app-feature">Warranties</span><span class="app-feature">Barcode</span><span class="app-feature">Tags</span></div>
-                                <a href="/assets/homebox-screenshot-1.webp" data-gallery="homebox" class="app-shot-link"><img src="/assets/homebox-screenshot-1.webp" alt="Homebox screenshot" class="app-screenshot"></a>
-                                <a href="/assets/homebox-screenshot-2.webp" data-gallery="homebox" data-alt="Homebox screenshot 2" hidden></a>
-                                <a href="/assets/homebox-screenshot-3.webp" data-gallery="homebox" data-alt="Homebox screenshot 3" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/sysadminsmedia/homebox" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Gramps Web -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/gramps-web-logo.png" alt="Gramps Web" class="app-logo">
-                                <div class="app-title-area"><h3>Gramps Web</h3><span class="app-tagline">Family tree builder</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">A web platform for family trees and genealogy. Build your family tree, add photos and documents, and share it with your family safely.</p>
-                                <div class="app-features"><span class="app-feature">Family tree</span><span class="app-feature">GEDCOM</span><span class="app-feature">Collaboration</span><span class="app-feature">Sync</span></div>
-                                <a href="/assets/gramps-web-screenshot-1.webp" data-gallery="gramps-web" class="app-shot-link"><img src="/assets/gramps-web-screenshot-1.webp" alt="Gramps Web screenshot" class="app-screenshot"></a>
-                                <a href="/assets/gramps-web-screenshot-2.webp" data-gallery="gramps-web" data-alt="Gramps Web screenshot 2" hidden></a>
-                                <a href="/assets/gramps-web-screenshot-3.webp" data-gallery="gramps-web" data-alt="Gramps Web screenshot 3" hidden></a>
-                                <a href="/assets/gramps-web-screenshot-4.webp" data-gallery="gramps-web" data-alt="Gramps Web screenshot 4" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/gramps-project/gramps-web" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- SparkyFitness -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/sparkyfitness-logo.png" alt="SparkyFitness" class="app-logo">
-                                <div class="app-title-area"><h3>SparkyFitness</h3><span class="app-tagline">Food diary</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Log what you eat and how many calories it comes to, track your weight and measurements on a graph, and record workouts. Set nutrition targets (protein, carbohydrate, fat) and follow them.</p>
-                                <div class="app-features"><span class="app-feature">Calorie counter</span><span class="app-feature">Weight</span><span class="app-feature">Workouts</span><span class="app-feature">Nutrition targets</span></div>
-                                <a href="/assets/sparkyfitness-screenshot-1.webp" data-gallery="sparkyfitness" class="app-shot-link"><img src="/assets/sparkyfitness-screenshot-1.webp" alt="SparkyFitness screenshot" class="app-screenshot"></a>
-                                <a href="/assets/sparkyfitness-screenshot-2.webp" data-gallery="sparkyfitness" data-alt="SparkyFitness screenshot 2" hidden></a>
-                                <a href="/assets/sparkyfitness-screenshot-3.webp" data-gallery="sparkyfitness" data-alt="SparkyFitness screenshot 3" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/CodeWithCJ/SparkyFitness" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge" style="color: var(--warn);"><img src="/assets/checkmark-yellow.svg" alt="">Restricted licence</span>
-                            </div>
-                        </div>
-                        <!-- Actual Budget -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/actualbudget-logo.svg" alt="Actual Budget" class="app-logo">
-                                <div class="app-title-area"><h3>Actual Budget</h3><span class="app-tagline">Budget planner</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Local-first personal finance. Plan a budget, track transactions and set money goals.</p>
-                                <div class="app-features"><span class="app-feature">Budget</span><span class="app-feature">Sync</span><span class="app-feature">Bank import</span><span class="app-feature">Reports</span></div>
-                                <a href="/assets/actualbudget-screenshot-1.webp" data-gallery="actualbudget" class="app-shot-link"><img src="/assets/actualbudget-screenshot-1.webp" alt="Actual Budget screenshot" class="app-screenshot"></a>
-                                <a href="/assets/actualbudget-screenshot-2.webp" data-gallery="actualbudget" data-alt="Actual Budget screenshot 2" hidden></a>
-                                <a href="/assets/actualbudget-screenshot-3.webp" data-gallery="actualbudget" data-alt="Actual Budget screenshot 3" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/actualbudget/actual" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- AdventureLog -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/adventurelog-logo.png" alt="AdventureLog" class="app-logo">
-                                <div class="app-title-area"><h3>AdventureLog</h3><span class="app-tagline">Travel log</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Record your trips and adventures. A map view, photos and statistics about the places you have been.</p>
-                                <div class="app-features"><span class="app-feature">Map</span><span class="app-feature">Photos</span><span class="app-feature">Statistics</span><span class="app-feature">Sharing</span></div>
-                                <a href="/assets/adventurelog-screenshot-1.webp" data-gallery="adventurelog" class="app-shot-link"><img src="/assets/adventurelog-screenshot-1.webp" alt="AdventureLog screenshot" class="app-screenshot"></a>
-                                <a href="/assets/adventurelog-screenshot-2.webp" data-gallery="adventurelog" data-alt="AdventureLog screenshot 2" hidden></a>
-                                <a href="/assets/adventurelog-screenshot-3.webp" data-gallery="adventurelog" data-alt="AdventureLog screenshot 3" hidden></a>
-                                <a href="/assets/adventurelog-screenshot-4.webp" data-gallery="adventurelog" data-alt="AdventureLog screenshot 4" hidden></a>
-                                <a href="/assets/adventurelog-screenshot-5.webp" data-gallery="adventurelog" data-alt="AdventureLog screenshot 5" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/seanmorley15/AdventureLog" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Wanderer -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/wanderer-logo.svg" alt="Wanderer" class="app-logo">
-                                <div class="app-title-area"><h3>Wanderer</h3><span class="app-tagline">Hike planner</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Plan hikes and routes and keep your GPX files. A map with contour lines, and route statistics.</p>
-                                <div class="app-features"><span class="app-feature">GPX import</span><span class="app-feature">Maps</span><span class="app-feature">Elevation</span><span class="app-feature">Routes</span></div>
-                                <a href="/assets/wanderer-screenshot-1.webp" data-gallery="wanderer" class="app-shot-link"><img src="/assets/wanderer-screenshot-1.webp" alt="Wanderer screenshot" class="app-screenshot"></a>
-                                <a href="/assets/wanderer-screenshot-2.webp" data-gallery="wanderer" data-alt="Wanderer screenshot 2" hidden></a>
-                                <a href="/assets/wanderer-screenshot-3.webp" data-gallery="wanderer" data-alt="Wanderer screenshot 3" hidden></a>
-                                <a href="/assets/wanderer-screenshot-4.webp" data-gallery="wanderer" data-alt="Wanderer screenshot 4" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/Flomp/wanderer" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Dawarich -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/dawarich-logo.svg" alt="Dawarich" class="app-logo">
-                                <div class="app-title-area"><h3>Dawarich</h3><span class="app-tagline">Instead of Google Timeline</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Your own location history on a map: your phone sends where you have been to your own server. A map, statistics and trips; bring your old data from a Google Takeout, GPX or GeoJSON file.</p>
-                                <div class="app-features"><span class="app-feature">Map</span><span class="app-feature">Statistics</span><span class="app-feature">Takeout import</span><span class="app-feature">Mobile app</span></div>
-                                <a href="/assets/dawarich-screenshot-1.webp" data-gallery="dawarich" class="app-shot-link"><img src="/assets/dawarich-screenshot-1.webp" alt="Dawarich screenshot" class="app-screenshot"></a>
-                                <a href="/assets/dawarich-screenshot-2.webp" data-gallery="dawarich" data-alt="Dawarich screenshot 2" hidden></a>
-                                <a href="/assets/dawarich-screenshot-3.webp" data-gallery="dawarich" data-alt="Dawarich screenshot 3" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/Freika/dawarich" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Cal.com -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/calcom-logo.svg" alt="Cal.com" class="app-logo">
-                                <div class="app-title-area"><h3>Cal.com</h3><span class="app-tagline">Appointment booking</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">An open-source Calendly alternative. Easy appointment booking with clients, calendar integrations and automatic reminders.</p>
-                                <div class="app-features"><span class="app-feature">Booking page</span><span class="app-feature">Calendar sync</span><span class="app-feature">Teams</span><span class="app-feature">Reminders</span></div>
-                                <a href="/assets/calcom-screenshot-1.webp" data-gallery="calcom" class="app-shot-link"><img src="/assets/calcom-screenshot-1.webp" alt="Cal.com screenshot" class="app-screenshot"></a>
-                                <a href="/assets/calcom-screenshot-2.webp" data-gallery="calcom" data-alt="Cal.com screenshot 2" hidden></a>
-                                <a href="/assets/calcom-screenshot-3.webp" data-gallery="calcom" data-alt="Cal.com screenshot 3" hidden></a>
-                                <a href="/assets/calcom-screenshot-4.webp" data-gallery="calcom" data-alt="Cal.com screenshot 4" hidden></a>
-                                <a href="/assets/calcom-screenshot-5.webp" data-gallery="calcom" data-alt="Cal.com screenshot 5" hidden></a>
-                                <a href="/assets/calcom-screenshot-6.webp" data-gallery="calcom" data-alt="Cal.com screenshot 6" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/calcom/cal.com" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- LubeLogger -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/lubelogger-logo.png" alt="LubeLogger" class="app-logo">
-                                <div class="app-title-area"><h3>LubeLogger</h3><span class="app-tagline">Vehicle records</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">The whole history of the family car in one place: services, repairs, fuel-ups and costs. Reminders for the oil change, the inspection and the insurance, with the invoices attached to the record they belong to.</p>
-                                <div class="app-features"><span class="app-feature">Service log</span><span class="app-feature">Fuel</span><span class="app-feature">Reminders</span><span class="app-feature">Costs</span></div>
-                                <a href="/assets/lubelogger-screenshot-1.webp" data-gallery="lubelogger" class="app-shot-link"><img src="/assets/lubelogger-screenshot-1.webp" alt="LubeLogger screenshot" class="app-screenshot"></a>
-                                <a href="/assets/lubelogger-screenshot-2.webp" data-gallery="lubelogger" data-alt="LubeLogger screenshot 2" hidden></a>
-                                <a href="/assets/lubelogger-screenshot-3.webp" data-gallery="lubelogger" data-alt="LubeLogger screenshot 3" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/hargata/lubelog" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Grocy -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/grocy-logo.svg" alt="Grocy" class="app-logo">
-                                <div class="app-title-area"><h3>Grocy</h3><span class="app-tagline">Household management</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Keeps track of what is in the house and tells you when something has run out or is going off. A shopping list that fills itself, barcode scanning with your phone camera, recipes and a weekly meal plan, and the chores shared out.</p>
-                                <div class="app-features"><span class="app-feature">Stock</span><span class="app-feature">Shopping list</span><span class="app-feature">Barcodes</span><span class="app-feature">Chores</span></div>
-                                <a href="/assets/grocy-screenshot-1.webp" data-gallery="grocy" class="app-shot-link"><img src="/assets/grocy-screenshot-1.webp" alt="Grocy screenshot" class="app-screenshot"></a>
-                                <a href="/assets/grocy-screenshot-2.webp" data-gallery="grocy" data-alt="Grocy screenshot 2" hidden></a>
-                                <a href="/assets/grocy-screenshot-3.webp" data-gallery="grocy" data-alt="Grocy screenshot 3" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/grocy/grocy" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-
-                <!-- ==================== -->
-                <!-- 4. PRODUCTIVITY & KNOWLEDGE -->
-                <!-- ==================== -->
-                <div class="category-section" id="productivity">
-                    <div class="category-header">
-                        <span class="category-icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chart-column"/></svg></span>
-                        <h2>Productivity & Knowledge</h2>
-                        <span class="app-count">12 apps</span>
-                    </div>
-                    <div class="app-grid">
-                        <!-- Vikunja -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/vikunja-logo.svg" alt="Vikunja" class="app-logo">
-                                <div class="app-title-area"><h3>Vikunja</h3><span class="app-tagline">Task manager (Todoist)</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">An open-source Todoist alternative. Tasks, projects and deadlines, in Kanban, Gantt and list views. Reminders and team work.</p>
-                                <div class="app-features"><span class="app-feature">Kanban</span><span class="app-feature">Gantt</span><span class="app-feature">Reminders</span><span class="app-feature">Teams</span></div>
-                                <a href="/assets/vikunja-screenshot-1.webp" data-gallery="vikunja" class="app-shot-link"><img src="/assets/vikunja-screenshot-1.webp" alt="Vikunja screenshot" class="app-screenshot"></a>
-                                <a href="/assets/vikunja-screenshot-2.webp" data-gallery="vikunja" data-alt="Vikunja screenshot 2" hidden></a>
-                                <a href="/assets/vikunja-screenshot-3.webp" data-gallery="vikunja" data-alt="Vikunja screenshot 3" hidden></a>
-                                <a href="/assets/vikunja-screenshot-4.webp" data-gallery="vikunja" data-alt="Vikunja screenshot 4" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/go-vikunja/vikunja" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Radicale -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/radicale-logo.svg" alt="Radicale" class="app-logo">
-                                <div class="app-title-area"><h3>Radicale</h3><span class="app-tagline">Calendar and contacts</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Your phone calendar and contacts on your own server, not with Google or Apple. A shared family calendar; on Android DAVx5, on iPhone and Mac the built-in calendar syncs with it.</p>
-                                <div class="app-features"><span class="app-feature">CalDAV</span><span class="app-feature">CardDAV</span><span class="app-feature">Family calendar</span><span class="app-feature">Thunderbird</span></div>
-                                <a href="/assets/radicale-screenshot-1.webp" data-gallery="radicale" class="app-shot-link"><img src="/assets/radicale-screenshot-1.webp" alt="Radicale screenshot" class="app-screenshot"></a>
-                                <a href="/assets/radicale-screenshot-2.webp" data-gallery="radicale" data-alt="Radicale screenshot 2" hidden></a>
-                                <a href="/assets/radicale-screenshot-3.webp" data-gallery="radicale" data-alt="Radicale screenshot 3" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/Kozea/Radicale" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Kimai -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/kimai-logo.png" alt="Kimai" class="app-logo">
-                                <div class="app-title-area"><h3>Kimai</h3><span class="app-tagline">Time tracking</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Professional time tracking for freelancers and teams. Projects, clients, reports and invoice export in one system.</p>
-                                <div class="app-features"><span class="app-feature">Projects</span><span class="app-feature">Reports</span><span class="app-feature">Export</span><span class="app-feature">Invoicing</span></div>
-                                <a href="/assets/kimai-screenshot-1.webp" data-gallery="kimai" class="app-shot-link"><img src="/assets/kimai-screenshot-1.webp" alt="Kimai screenshot" class="app-screenshot"></a>
-                                <a href="/assets/kimai-screenshot-2.webp" data-gallery="kimai" data-alt="Kimai screenshot 2" hidden></a>
-                                <a href="/assets/kimai-screenshot-3.webp" data-gallery="kimai" data-alt="Kimai screenshot 3" hidden></a>
-                                <a href="/assets/kimai-screenshot-4.webp" data-gallery="kimai" data-alt="Kimai screenshot 4" hidden></a>
-                                <a href="/assets/kimai-screenshot-5.webp" data-gallery="kimai" data-alt="Kimai screenshot 5" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/kimai/kimai" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Rallly -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/rallly-logo.svg" alt="Rallly" class="app-logo">
-                                <div class="app-title-area"><h3>Rallly</h3><span class="app-tagline">Meeting poll (Doodle)</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Find a time for a meeting or an event, the easy way. A Doodle alternative: people vote without an account, and time zones are handled.</p>
-                                <div class="app-features"><span class="app-feature">Polls</span><span class="app-feature">No sign-up</span><span class="app-feature">Time zones</span><span class="app-feature">Notifications</span></div>
-                                <a href="/assets/rallly-screenshot-1.webp" data-gallery="rallly" class="app-shot-link"><img src="/assets/rallly-screenshot-1.webp" alt="Rallly screenshot" class="app-screenshot"></a>
-                                <a href="/assets/rallly-screenshot-2.webp" data-gallery="rallly" data-alt="Rallly screenshot 2" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/lukevella/rallly" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Claper -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/claper-logo.svg" alt="Claper" class="app-logo">
-                                <div class="app-title-area"><h3>Claper</h3><span class="app-tagline">Interactive presentations</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Live polls, questions and word clouds for presentations. A Mentimeter and AhaSlides alternative that makes your talks interactive.</p>
-                                <div class="app-features"><span class="app-feature">Live polls</span><span class="app-feature">Questions</span><span class="app-feature">Word cloud</span><span class="app-feature">Reactions</span></div>
-                                <a href="/assets/claper-screenshot-1.webp" data-gallery="claper" class="app-shot-link"><img src="/assets/claper-screenshot-1.webp" alt="Claper screenshot" class="app-screenshot"></a>
-                                <a href="/assets/claper-screenshot-2.webp" data-gallery="claper" data-alt="Claper screenshot 2" hidden></a>
-                                <a href="/assets/claper-screenshot-3.webp" data-gallery="claper" data-alt="Claper screenshot 3" hidden></a>
-                                <a href="/assets/claper-screenshot-4.webp" data-gallery="claper" data-alt="Claper screenshot 4" hidden></a>
-                                <a href="/assets/claper-screenshot-5.webp" data-gallery="claper" data-alt="Claper screenshot 5" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/ClaperCo/Claper" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Ghost -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/ghost-logo.svg" alt="Ghost" class="app-logo">
-                                <div class="app-title-area"><h3>Ghost</h3><span class="app-tagline">Blog & newsletter platform</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">A modern publishing platform for bloggers and creators. Good-looking themes, a built-in newsletter, and members and subscriptions.</p>
-                                <div class="app-features"><span class="app-feature">Blog</span><span class="app-feature">Newsletter</span><span class="app-feature">Members</span><span class="app-feature">SEO</span></div>
-                                <a href="/assets/ghost-screenshot-1.webp" data-gallery="ghost" class="app-shot-link"><img src="/assets/ghost-screenshot-1.webp" alt="Ghost screenshot" class="app-screenshot"></a>
-                                <a href="/assets/ghost-screenshot-2.webp" data-gallery="ghost" data-alt="Ghost screenshot 2" hidden></a>
-                                <a href="/assets/ghost-screenshot-3.webp" data-gallery="ghost" data-alt="Ghost screenshot 3" hidden></a>
-                                <a href="/assets/ghost-screenshot-4.webp" data-gallery="ghost" data-alt="Ghost screenshot 4" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/TryGhost/Ghost" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Paperless-ngx -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/paperless-ngx-logo.svg" alt="Paperless-ngx" class="app-logo">
-                                <div class="app-title-area"><h3>Paperless-ngx</h3><span class="app-tagline">A digital filing cabinet</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Scan your paper documents and stop worrying about them. OCR, automatic sorting and full-text search.</p>
-                                <div class="app-features"><span class="app-feature">OCR</span><span class="app-feature">Auto sorting</span><span class="app-feature">Search</span><span class="app-feature">Tags</span></div>
-                                <a href="/assets/paperless-ngx-screenshot-1.webp" data-gallery="paperless-ngx" class="app-shot-link"><img src="/assets/paperless-ngx-screenshot-1.webp" alt="Paperless-ngx screenshot" class="app-screenshot"></a>
-                                <a href="/assets/paperless-ngx-screenshot-2.webp" data-gallery="paperless-ngx" data-alt="Paperless-ngx screenshot 2" hidden></a>
-                                <a href="/assets/paperless-ngx-screenshot-3.webp" data-gallery="paperless-ngx" data-alt="Paperless-ngx screenshot 3" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/paperless-ngx/paperless-ngx" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- BookStack -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/bookstack-logo.svg" alt="BookStack" class="app-logo">
-                                <div class="app-title-area"><h3>BookStack</h3><span class="app-tagline">Book-style documentation</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">A simple self-hosted wiki. Arrange what you know into books, chapters and pages that are easy to search.</p>
-                                <div class="app-features"><span class="app-feature">WYSIWYG</span><span class="app-feature">Books</span><span class="app-feature">Search</span><span class="app-feature">Permissions</span></div>
-                                <a href="/assets/bookstack-screenshot-1.webp" data-gallery="bookstack" class="app-shot-link"><img src="/assets/bookstack-screenshot-1.webp" alt="BookStack screenshot" class="app-screenshot"></a>
-                                <a href="/assets/bookstack-screenshot-2.webp" data-gallery="bookstack" data-alt="BookStack screenshot 2" hidden></a>
-                                <a href="/assets/bookstack-screenshot-3.webp" data-gallery="bookstack" data-alt="BookStack screenshot 3" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/BookStackApp/BookStack" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Outline -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/outline-logo.svg" alt="Outline" class="app-logo">
-                                <div class="app-title-area"><h3>Outline</h3><span class="app-tagline">Team knowledge base</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">A good-looking wiki and knowledge base for teams. Markdown, real-time collaboration and structured documentation.</p>
-                                <div class="app-features"><span class="app-feature">Markdown</span><span class="app-feature">Collaboration</span><span class="app-feature">Search</span><span class="app-feature">Integrations</span></div>
-                                <a href="/assets/outline-screenshot-1.webp" data-gallery="outline" class="app-shot-link"><img src="/assets/outline-screenshot-1.webp" alt="Outline screenshot" class="app-screenshot"></a>
-                                <a href="/assets/outline-screenshot-2.webp" data-gallery="outline" data-alt="Outline screenshot 2" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/outline/outline" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge" style="color: var(--warn);"><img src="/assets/checkmark-yellow.svg" alt="">Restricted licence</span>
-                            </div>
-                        </div>
-                        <!-- Docmost -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/docmost-logo.png" alt="Docmost" class="app-logo">
-                                <div class="app-title-area"><h3>Docmost</h3><span class="app-tagline">A Notion-like wiki</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">A modern wiki and documentation platform with a Notion-like block editor. Spaces and pages in a tree, several people editing at once, and search across all of it.</p>
-                                <div class="app-features"><span class="app-feature">Block editor</span><span class="app-feature">Co-editing</span><span class="app-feature">Search</span><span class="app-feature">Tables</span></div>
-                                <a href="/assets/docmost-screenshot-1.webp" data-gallery="docmost" class="app-shot-link"><img src="/assets/docmost-screenshot-1.webp" alt="Docmost screenshot" class="app-screenshot"></a>
-                                <a href="/assets/docmost-screenshot-2.webp" data-gallery="docmost" data-alt="Docmost screenshot 2" hidden></a>
-                                <a href="/assets/docmost-screenshot-3.webp" data-gallery="docmost" data-alt="Docmost screenshot 3" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/docmost/docmost" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Karakeep -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/karakeep-logo.svg" alt="Karakeep" class="app-logo">
-                                <div class="app-title-area"><h3>Karakeep</h3><span class="app-tagline">Your own searchable archive</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Bookmarks, articles, notes and images in one place. Karakeep downloads and keeps the content of the pages you save, even if a page disappears later. Full-text search, a browser extension and a phone app.</p>
-                                <div class="app-features"><span class="app-feature">Page saving</span><span class="app-feature">Search</span><span class="app-feature">Browser extension</span><span class="app-feature">Mobile app</span></div>
-                                <a href="/assets/karakeep-screenshot-1.webp" data-gallery="karakeep" class="app-shot-link"><img src="/assets/karakeep-screenshot-1.webp" alt="Karakeep screenshot" class="app-screenshot"></a>
-                                <a href="/assets/karakeep-screenshot-2.webp" data-gallery="karakeep" data-alt="Karakeep screenshot 2" hidden></a>
-                                <a href="/assets/karakeep-screenshot-3.webp" data-gallery="karakeep" data-alt="Karakeep screenshot 3" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/karakeep-app/karakeep" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- PrivateBin -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/privatebin-logo.png" alt="PrivateBin" class="app-logo">
-                                <div class="app-title-area"><h3>PrivateBin</h3><span class="app-tagline">Encrypted note sharing</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">A minimal, encrypted pastebin. The server cannot see what you share, which makes it right for sending sensitive text safely.</p>
-                                <div class="app-features"><span class="app-feature">E2E encryption</span><span class="app-feature">Expiry</span><span class="app-feature">Burn after reading</span><span class="app-feature">Password protection</span></div>
-                                <a href="/assets/privatebin-screenshot-1.webp" data-gallery="privatebin" class="app-shot-link"><img src="/assets/privatebin-screenshot-1.webp" alt="PrivateBin screenshot" class="app-screenshot"></a>
-                                <a href="/assets/privatebin-screenshot-2.webp" data-gallery="privatebin" data-alt="PrivateBin screenshot 2" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/PrivateBin/PrivateBin" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-
-                <!-- ==================== -->
-                <!-- 5. SYSTEM & DEVELOPMENT -->
-                <!-- ==================== -->
-                <div class="category-section" id="system">
-                    <div class="category-header">
-                        <span class="category-icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-wrench"/></svg></span>
-                        <h2>System & Development</h2>
-                        <span class="app-count">9 apps</span>
-                    </div>
-                    <div class="app-grid">
-                        <!-- Vaultwarden -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/vaultwarden-logo.svg" alt="Vaultwarden" class="app-logo">
-                                <div class="app-title-area"><h3>Vaultwarden</h3><span class="app-tagline">Password manager (Bitwarden)</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">A light Bitwarden server. Keep your passwords safe and in sync on every device.</p>
-                                <div class="app-features"><span class="app-feature">E2E encryption</span><span class="app-feature">Mobile app</span><span class="app-feature">Browser extension</span><span class="app-feature">2FA</span></div>
-                                <a href="/assets/vaultwarden-screenshot-1.webp" data-gallery="vaultwarden" class="app-shot-link"><img src="/assets/vaultwarden-screenshot-1.webp" alt="Vaultwarden screenshot" class="app-screenshot"></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/dani-garcia/vaultwarden" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Homepage -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/homepage-logo.svg" alt="Homepage" class="app-logo">
-                                <div class="app-title-area"><h3>Homepage</h3><span class="app-tagline">Personal start page</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">A good-looking, feature-rich start page for your server. Service status, widgets and bookmarks in one place.</p>
-                                <div class="app-features"><span class="app-feature">Widgets</span><span class="app-feature">Integrations</span><span class="app-feature">Themes</span><span class="app-feature">Status</span></div>
-                                <a href="/assets/homepage-screenshot-1.webp" data-gallery="homepage" class="app-shot-link"><img src="/assets/homepage-screenshot-1.webp" alt="Homepage screenshot" class="app-screenshot"></a>
-                                <a href="/assets/homepage-screenshot-2.webp" data-gallery="homepage" data-alt="Homepage screenshot 2" hidden></a>
-                                <a href="/assets/homepage-screenshot-3.webp" data-gallery="homepage" data-alt="Homepage screenshot 3" hidden></a>
-                                <a href="/assets/homepage-screenshot-4.webp" data-gallery="homepage" data-alt="Homepage screenshot 4" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/gethomepage/homepage" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Glance -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/glance-logo.svg" alt="Glance" class="app-logo">
-                                <div class="app-title-area"><h3>Glance</h3><span class="app-tagline">Information dashboard</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">A minimal, fast dashboard for all kinds of information. RSS, weather, bookmarks, Reddit, YouTube and more on one page.</p>
-                                <div class="app-features"><span class="app-feature">RSS</span><span class="app-feature">Weather</span><span class="app-feature">YouTube</span><span class="app-feature">Fast</span></div>
-                                <a href="/assets/glance-screenshot-1.webp" data-gallery="glance" class="app-shot-link"><img src="/assets/glance-screenshot-1.webp" alt="Glance screenshot" class="app-screenshot"></a>
-                                <a href="/assets/glance-screenshot-2.webp" data-gallery="glance" data-alt="Glance screenshot 2" hidden></a>
-                                <a href="/assets/glance-screenshot-3.webp" data-gallery="glance" data-alt="Glance screenshot 3" hidden></a>
-                                <a href="/assets/glance-screenshot-4.webp" data-gallery="glance" data-alt="Glance screenshot 4" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/glanceapp/glance" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Uptime Kuma -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/uptime-kuma-logo.svg" alt="Uptime Kuma" class="app-logo">
-                                <div class="app-title-area"><h3>Uptime Kuma</h3><span class="app-tagline">Service monitoring</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">A neat service monitor. Watch your websites and APIs and get told when something stops working.</p>
-                                <div class="app-features"><span class="app-feature">HTTP/TCP/DNS</span><span class="app-feature">Notifications</span><span class="app-feature">Status page</span><span class="app-feature">Charts</span></div>
-                                <a href="/assets/uptime-kuma-screenshot-1.webp" data-gallery="uptime-kuma" class="app-shot-link"><img src="/assets/uptime-kuma-screenshot-1.webp" alt="Uptime Kuma screenshot" class="app-screenshot"></a>
-                                <a href="/assets/uptime-kuma-screenshot-2.webp" data-gallery="uptime-kuma" data-alt="Uptime Kuma screenshot 2" hidden></a>
-                                <a href="/assets/uptime-kuma-screenshot-3.webp" data-gallery="uptime-kuma" data-alt="Uptime Kuma screenshot 3" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/louislam/uptime-kuma" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Grafana -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/grafana-logo.svg" alt="Grafana" class="app-logo">
-                                <div class="app-title-area"><h3>Grafana</h3><span class="app-tagline">Data visualisation</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">A professional monitoring and visualisation platform. Good-looking dashboards, alerts and analysis, from any data source.</p>
-                                <div class="app-features"><span class="app-feature">Dashboards</span><span class="app-feature">Alerts</span><span class="app-feature">Data sources</span><span class="app-feature">Queries</span></div>
-                                <a href="/assets/grafana-screenshot-1.webp" data-gallery="grafana" class="app-shot-link"><img src="/assets/grafana-screenshot-1.webp" alt="Grafana screenshot" class="app-screenshot"></a>
-                                <a href="/assets/grafana-screenshot-2.webp" data-gallery="grafana" data-alt="Grafana screenshot 2" hidden></a>
-                                <a href="/assets/grafana-screenshot-3.webp" data-gallery="grafana" data-alt="Grafana screenshot 3" hidden></a>
-                                <a href="/assets/grafana-screenshot-4.webp" data-gallery="grafana" data-alt="Grafana screenshot 4" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/grafana/grafana" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Termix -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/termix-logo.svg" alt="Termix" class="app-logo">
-                                <div class="app-title-area"><h3>Termix</h3><span class="app-tagline">Server manager (SSH)</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">A web SSH terminal and server management platform. Connect to your servers from a browser anywhere, manage SSH tunnels and edit files remotely.</p>
-                                <div class="app-features"><span class="app-feature">SSH terminal</span><span class="app-feature">Tunnels</span><span class="app-feature">File manager</span><span class="app-feature">2FA</span></div>
-                                <a href="/assets/termix-screenshot-1.webp" data-gallery="termix" class="app-shot-link"><img src="/assets/termix-screenshot-1.webp" alt="Termix screenshot" class="app-screenshot"></a>
-                                <a href="/assets/termix-screenshot-2.webp" data-gallery="termix" data-alt="Termix screenshot 2" hidden></a>
-                                <a href="/assets/termix-screenshot-3.webp" data-gallery="termix" data-alt="Termix screenshot 3" hidden></a>
-                                <a href="/assets/termix-screenshot-4.webp" data-gallery="termix" data-alt="Termix screenshot 4" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/Termix-SSH/Termix" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Gitea -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/gitea-logo.svg" alt="Gitea" class="app-logo">
-                                <div class="app-title-area"><h3>Gitea</h3><span class="app-tagline">Git server (GitHub)</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Light, fast Git hosting. Your own GitHub or GitLab, with issue tracking, CI/CD and a package registry.</p>
-                                <div class="app-features"><span class="app-feature">Git hosting</span><span class="app-feature">Issues</span><span class="app-feature">CI/CD</span><span class="app-feature">Wiki</span></div>
-                                <a href="/assets/gitea-screenshot-1.webp" data-gallery="gitea" class="app-shot-link"><img src="/assets/gitea-screenshot-1.webp" alt="Gitea screenshot" class="app-screenshot"></a>
-                                <a href="/assets/gitea-screenshot-2.webp" data-gallery="gitea" data-alt="Gitea screenshot 2" hidden></a>
-                                <a href="/assets/gitea-screenshot-3.webp" data-gallery="gitea" data-alt="Gitea screenshot 3" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/go-gitea/gitea" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- Code-Server -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/code-server-logo.svg" alt="Code-Server" class="app-logo">
-                                <div class="app-title-area"><h3>Code-Server</h3><span class="app-tagline">VS Code in the browser</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Visual Studio Code in the browser. Work from anywhere, on any device, with the same familiar interface.</p>
-                                <div class="app-features"><span class="app-feature">VS Code</span><span class="app-feature">Extensions</span><span class="app-feature">Terminal</span><span class="app-feature">Git</span></div>
-                                <a href="/assets/code-server-screenshot-1.webp" data-gallery="code-server" class="app-shot-link"><img src="/assets/code-server-screenshot-1.webp" alt="Code-Server screenshot" class="app-screenshot"></a>
-                                <a href="/assets/code-server-screenshot-2.webp" data-gallery="code-server" data-alt="Code-Server screenshot 2" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/coder/code-server" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                        <!-- OpenGist -->
-                        <div class="app-card">
-                            <div class="app-card-header">
-                                <img src="/assets/opengist-logo.png" alt="OpenGist" class="app-logo">
-                                <div class="app-title-area"><h3>OpenGist</h3><span class="app-tagline">Code snippets (Gist)</span></div>
-                            </div>
-                            <div class="app-card-body">
-                                <p class="app-description">Your own GitHub Gist server. Share code snippets with syntax highlighting and Git-based version history.</p>
-                                <div class="app-features"><span class="app-feature">Snippets</span><span class="app-feature">Syntax</span><span class="app-feature">Git</span><span class="app-feature">Embed</span></div>
-                                <a href="/assets/opengist-screenshot-1.webp" data-gallery="opengist" class="app-shot-link"><img src="/assets/opengist-screenshot-1.webp" alt="OpenGist screenshot" class="app-screenshot"></a>
-                                <a href="/assets/opengist-screenshot-2.webp" data-gallery="opengist" data-alt="OpenGist screenshot 2" hidden></a>
-                                <a href="/assets/opengist-screenshot-3.webp" data-gallery="opengist" data-alt="OpenGist screenshot 3" hidden></a>
-                            </div>
-                            <div class="app-card-footer">
-                                <a href="https://github.com/thomiceli/opengist" target="_blank" rel="noopener" class="github-link"><img src="/assets/github.svg" alt="GitHub">Source code</a>
-                                <span class="open-source-badge"><svg class="ico ico-yes" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-check"/></svg>Open Source</span>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-
-            </div>
-        </section>
-
-        <!-- Stats Section -->
-        <section class="stats-section">
-            <div class="container">
-                <div class="stats-grid">
-                    <div class="stat-item">
-                        <h3>58</h3>
-                        <p>Apps available</p>
-                    </div>
-                    <div class="stat-item">
-                        <h3>5</h3>
-                        <p>Categories</p>
-                    </div>
-                    <div class="stat-item">
-                        <h3>51</h3>
-                        <p>Open source</p>
-                    </div>
-                    <div class="stat-item">
-                        <h3>0 Ft</h3>
-                        <p>Licence cost</p>
-                    </div>
-                </div>
-            </div>
-        </section>
-
-        <!-- CTA Section -->
-        <section class="cta-section">
-            <div class="container">
-                <h2>Can't find what you are looking for?</h2>
-                <p>This is the whole catalog. If you need something specific, get in touch – we will look at whether the right app can join it.</p>
-                <a href="/en/contact" class="cta-button">Get in touch →</a>
-            </div>
-        </section>
-    </main>
-
-    <script>
-    (function() {
-        var hamburger = document.getElementById('hamburger');
-        var navLinks = document.querySelector('.nav-links');
-        var overlay = document.getElementById('mobileOverlay');
-        var body = document.body;
-
-        if (!hamburger || !navLinks || !overlay) {
-            console.warn('[mobile-menu] Missing elements:', {
-                hamburger: !!hamburger,
-                navLinks: !!navLinks,
-                overlay: !!overlay
-            });
-            return;
-        }
-
-        function openMenu() {
-            hamburger.classList.add('is-active');
-            navLinks.classList.add('is-open');
-            overlay.classList.add('is-visible');
-            body.classList.add('menu-open');
-            hamburger.setAttribute('aria-expanded', 'true');
-            hamburger.setAttribute('aria-label', 'Close menu');
-        }
-
-        function closeMenu() {
-            hamburger.classList.remove('is-active');
-            navLinks.classList.remove('is-open');
-            overlay.classList.remove('is-visible');
-            body.classList.remove('menu-open');
-            hamburger.setAttribute('aria-expanded', 'false');
-            hamburger.setAttribute('aria-label', 'Open menu');
-        }
-
-        hamburger.addEventListener('click', function() {
-            if (navLinks.classList.contains('is-open')) {
-                closeMenu();
-            } else {
-                openMenu();
-            }
-        });
-
-        overlay.addEventListener('click', closeMenu);
-
-        navLinks.querySelectorAll('a').forEach(function(link) {
-            link.addEventListener('click', closeMenu);
-        });
-
-        document.addEventListener('keydown', function(e) {
-            if (e.key === 'Escape' && navLinks.classList.contains('is-open')) {
-                closeMenu();
-            }
-        });
-
-        window.addEventListener('resize', function() {
-            if (window.innerWidth > 900 && navLinks.classList.contains('is-open')) {
-                closeMenu();
-            }
-        });
-    })();
-    </script>
-<footer>
-        <div class="container">
-            <p>© 2026 felhom.eu – Your own cloud, your own rules. Felhom serves households in Hungary.</p>
-            <p class="footer-legal">Operated by Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Privacy notice (Hungarian)</a> · <a href="/feltetelek">Terms (Hungarian)</a></p>
-        </div>
-    </footer>
-    <script>
-    (function(){
-        var b=document.getElementById('navBurger'),s=document.getElementById('sidebar'),k=document.getElementById('navBackdrop');
-        if(!b||!s||!k)return;
-        function open(){s.classList.add('is-open');k.hidden=false;document.body.classList.add('nav-open');b.setAttribute('aria-expanded','true');}
-        function close(){s.classList.remove('is-open');k.hidden=true;document.body.classList.remove('nav-open');b.setAttribute('aria-expanded','false');}
-        b.addEventListener('click',function(){s.classList.contains('is-open')?close():open();});
-        k.addEventListener('click',close);
-        document.addEventListener('keydown',function(e){if(e.key==='Escape'&&s.classList.contains('is-open')){close();b.focus();}});
-        s.querySelectorAll('a').forEach(function(l){l.addEventListener('click',close);});
-        window.addEventListener('resize',function(){if(window.innerWidth>768)close();});
-    })();
-    document.addEventListener('click',function(e){
-        var btn=e.target.closest?e.target.closest('.nav-group-toggle'):null;
-        if(!btn)return;
-        var g=btn.closest('.nav-group');if(!g)return;
-        var willOpen=!g.classList.contains('is-open');
-        document.querySelectorAll('.nav-group.is-open').forEach(function(x){
-            x.classList.remove('is-open');
-            var t=x.querySelector('.nav-group-toggle');if(t)t.setAttribute('aria-expanded','false');
-        });
-        if(willOpen){g.classList.add('is-open');btn.setAttribute('aria-expanded','true');}
-    });
-    </script>
-</body>
-</html>
diff --git a/website/preview/m3/en/backups.html b/website/preview/m3/en/backups.html
deleted file mode 100644
index ace85e45..00000000
--- a/website/preview/m3/en/backups.html
+++ /dev/null
@@ -1,374 +0,0 @@
-<!DOCTYPE html>
-<html lang="en" class="no-js">
-<head>
-    <script>document.documentElement.className=document.documentElement.className.replace('no-js','js');</script>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Backups — a 3-2-1 backup strategy for home servers | Felhom.eu</title>
-    <meta name="description" content="Professional 3-2-1 backups for a home server in Hungary. Automatic backups on three levels: on the box, on a second drive, and encrypted on remote storage.">
-    <meta name="keywords" content="backup, 3-2-1 backup rule, off-site backup, data backup, home server backup, encrypted backup, automatic backup">
-    <meta name="robots" content="index, follow">
-    <link rel="canonical" href="https://felhom.eu/en/backups">
-    <link rel="alternate" hreflang="hu" href="https://felhom.eu/biztonsagimentes">
-    <link rel="alternate" hreflang="en" href="https://felhom.eu/en/backups">
-    <link rel="alternate" hreflang="x-default" href="https://felhom.eu/biztonsagimentes">
-
-    <meta property="og:type" content="article">
-    <meta property="og:url" content="https://felhom.eu/en/backups">
-    <meta property="og:title" content="3-2-1 backups for a home server">
-    <meta property="og:description" content="Professional-grade data safety at home. Automatic backups, and an encrypted copy far away too.">
-    <meta property="og:image" content="https://felhom.eu/assets/og-image-en.png">
-    <meta property="og:locale" content="en_GB">
-    <meta property="og:site_name" content="Felhom.eu">
-
-    <meta name="twitter:card" content="summary_large_image">
-    <meta name="twitter:title" content="3-2-1 backups for a home server">
-    <meta name="twitter:description" content="Professional data protection for your home server. Automatic backups, off-site copies.">
-    <meta name="twitter:image" content="https://felhom.eu/assets/og-image-en.png">
-
-    <script type="application/ld+json">
-    {
-      "@context": "https://schema.org",
-      "@type": "Article",
-      "headline": "A 3-2-1 backup strategy for home servers",
-      "description": "How to protect your data at home with a professional backup strategy.",
-      "author": {"@type": "Organization", "name": "Felhom.eu"},
-      "publisher": {"@type": "Organization", "name": "Felhom.eu", "logo": {"@type": "ImageObject", "url": "https://felhom.eu/assets/logo.png"}},
-      "mainEntityOfPage": "https://felhom.eu/en/backups"
-    }
-    </script>
-    <!-- shared assets: bump ?v= together on any site.css/icons.svg change -->
-    <link rel="stylesheet" href="/assets/site.css?v=21">
-    <link rel="stylesheet" href="/assets/shell.css?v=21">
-    <link rel="icon" type="image/png" href="/assets/logo_favicon_2.svg">
-    <script defer src="https://stats.felhom.eu/script.js" data-website-id="d419db57-5e1c-48df-bdb3-c29f25fb1661"></script>
-</head>
-<body class="shell page-biztonsagimentes">
-    <header class="mobile-topbar">
-        <a href="/preview/m3/en/" class="mobile-topbar-logo"><img src="/assets/logo_notext_white.svg" alt="Felhom.eu"></a>
-        <button type="button" class="nav-burger" id="navBurger" aria-expanded="false" aria-controls="sidebar" aria-label="Menu">
-            <span class="hamburger-box"><span class="hamburger-line"></span><span class="hamburger-line"></span><span class="hamburger-line"></span></span>
-        </button>
-    </header>
-    <div class="nav-backdrop" id="navBackdrop" hidden></div>
-    <nav class="sidebar" id="sidebar">
-        <div class="sidebar-header">
-            <a href="/preview/m3/en/" class="sidebar-logo-link">
-                <img src="/assets/logo_notext_white.svg" alt="" class="sidebar-logo" aria-hidden="true">
-                <img src="/assets/logo-wordmark.png" alt="felhom.eu" class="sidebar-word">
-            </a>
-        </div>
-        <ul class="nav-links">
-                <li><a href="/preview/m3/en/"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg>Home</a></li>
-                <li><a href="/preview/m3/en/#services"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rocket"/></svg>Services</a></li>
-                <li class="nav-group">
-                    <button type="button" class="nav-group-toggle" aria-expanded="false" aria-controls="nav-group-apps"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg>Applications<svg class="ico nav-chevron" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chevron-down"/></svg></button>
-                    <ul id="nav-group-apps" class="nav-links nav-links-sub nav-links-nested">
-                        <li><a href="/preview/m3/en/apps">All applications</a></li>
-                        <li><a href="/preview/m3/en/apps#files-office">Files &amp; Office</a></li>
-                        <li><a href="/preview/m3/en/apps#media-entertainment">Media &amp; Entertainment</a></li>
-                        <li><a href="/preview/m3/en/apps#home-lifestyle">Home &amp; Lifestyle</a></li>
-                        <li><a href="/preview/m3/en/apps#productivity-knowledge">Productivity &amp; Knowledge</a></li>
-                        <li><a href="/preview/m3/en/apps#system-development">System &amp; Development</a></li>
-                    </ul>
-                </li>
-                <li><a href="/preview/m3/en/technology"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg>Technology</a></li>
-                <li><a href="/preview/m3/en/backups" class="active"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg>Backups</a></li>
-        </ul>
-        <div class="sidebar-bottom">
-            <a href="/preview/m3/en/testing" class="btn btn-outline sidebar-cta">Apply as a tester →</a>
-            <div class="nav-group-label">About Felhom</div>
-            <ul class="nav-links nav-links-sub">
-                    <li><a href="/preview/m3/en/#how-it-works">How it works</a></li>
-                    <li><a href="/preview/m3/en/faq">FAQ</a></li>
-                    <li><a href="/preview/m3/en/contact">Contact</a></li>
-            </ul>
-            <div class="sidebar-footer">
-                <details class="lang-globe"><summary class="lang-globe-btn" aria-label="Language" title="Language"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/preview/m3/biztonsagimentes" lang="hu" hreflang="hu" class="lang-globe-item">Magyar</a></li><li><a href="/preview/m3/en/backups" lang="en" hreflang="en" class="lang-globe-item current" aria-current="true">English</a></li></ul></details>
-            </div>
-        </div>
-    </nav>
-<main class="content">
-                <div class="page-header">
-                <h1><span>Backups</span></h1>
-            </div>
-                <p class="page-lede">Your data's safety comes first. With a professional backup strategy, we make sure there is something to bring back from after a fault or an accident.</p>
-
-
-        <!-- Bevezető -->
-        <section class="content-section">
-            <div class="container">
-                <div class="info-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-circle-help"/></svg> Why does it matter?</h3>
-                    <p>When someone picks a cloud service – Google Drive, iCloud or any other – one of the most important things is <strong>data safety</strong>. The question is not whether someone can get at our data, but whether it <strong>survives</strong>.</p>
-                    <p>The big providers solve this with billion-dollar infrastructure: several data centres, redundant storage, automatic backups. But can a home server be just as safe?</p>
-                    <div class="highlight-box">
-                        <p><strong>The answer: yes.</strong> With the right backup strategy, your home server can be as safe as any cloud provider – and you are in charge of everything.</p>
-                    </div>
-                </div>
-            </div>
-        </section>
-
-        <!-- 3-2-1 szabály -->
-        <section class="content-section alt-bg">
-            <div class="container">
-                <div class="section-header">
-                    <h2>The 3-2-1 <span>backup rule</span></h2>
-                    <p>The industry standard that professional system administrators and companies use around the world</p>
-                </div>
-
-                <div class="backup-rule">
-                    <div class="rule-number">3</div>
-                    <div class="rule-content">
-                        <h3>Three copies of your data</h3>
-                        <p>Always keep at least three copies of everything important: the original and two backups. If one is damaged or lost, there are still two in reserve.</p>
-                        <div class="example-box">
-                            <div class="label">Example</div>
-                            <p>Your family photos are on the server (1), on an external hard drive (2), and in a remote place (3).</p>
-                        </div>
-                    </div>
-                </div>
-
-                <div class="backup-rule">
-                    <div class="rule-number">2</div>
-                    <div class="rule-content">
-                        <h3>Two different kinds of storage</h3>
-                        <p>Keep your data on at least two kinds of storage device. Different devices fail in different ways – if one kind breaks, the other is probably fine.</p>
-                        <div class="example-box">
-                            <div class="label">Example</div>
-                            <p>You keep your data on the server's internal SSD, and the backup goes to an external HDD or a NAS.</p>
-                        </div>
-                    </div>
-                </div>
-
-                <div class="backup-rule">
-                    <div class="rule-number">1</div>
-                    <div class="rule-content">
-                        <h3>One off-site (remote) copy</h3>
-                        <p>Keep at least one copy in a different physical place. That protects against local disasters: a fire, a flood, a burglary or even a lightning strike cannot put all your data at risk.</p>
-                        <div class="example-box">
-                            <div class="label">Example</div>
-                            <p>The backup is copied on its own to a friend's or relative's server, or goes encrypted into the cloud.</p>
-                        </div>
-                    </div>
-                </div>
-
-                <div class="backup-diagram">
-                    <h3>What it looks like in practice</h3>
-                    <div class="diagram-visual">
-                        <div class="diagram-node primary">
-                            <div class="icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-monitor"/></svg></div>
-                            <div class="label">Server</div>
-                            <div class="sublabel">Original data</div>
-                        </div>
-                        <div class="diagram-arrow">→</div>
-                        <div class="diagram-node">
-                            <div class="icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-hard-drive"/></svg></div>
-                            <div class="label">Local backup</div>
-                            <div class="sublabel">External HDD/NAS</div>
-                        </div>
-                        <div class="diagram-arrow">→</div>
-                        <div class="diagram-node">
-                            <div class="icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></div>
-                            <div class="label">Off-site backup</div>
-                            <div class="sublabel">Remote place</div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </section>
-
-        <!-- Offsite megoldások -->
-        <section class="content-section">
-            <div class="container">
-                <div class="section-header">
-                    <h2>Off-site <span>backup options</span></h2>
-                    <p>The "1" in the 3-2-1 rule – the most important, and often the most neglected</p>
-                </div>
-
-                <div class="methods-grid">
-                    <div class="method-card">
-                        <div class="method-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-users"/></svg></div>
-                        <h3>The "buddy system"</h3>
-                        <p>The simplest and cheapest option: swap backups with someone you trust. You back up to their server, they back up to yours.</p>
-                        <ul class="method-pros">
-                            <li>No monthly fee</li>
-                            <li>Full control over the data</li>
-                            <li>Safety for both of you</li>
-                            <li>End-to-end encryption is possible</li>
-                        </ul>
-                        <div class="example-box">
-                            <div class="label">How does it work?</div>
-                            <p>Encrypted backups sync on their own over a VPN connection.</p>
-                        </div>
-                    </div>
-
-                    <div class="method-card">
-                        <div class="method-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-building-2"/></svg></div>
-                        <h3>Home ↔ Office</h3>
-                        <p>If you have a workplace or your own office, use it! Two sites give you natural distance.</p>
-                        <ul class="method-pros">
-                            <li>Uses what is already there</li>
-                            <li>A safe, familiar place</li>
-                            <li>Quick to recover from when needed</li>
-                        </ul>
-                        <div class="example-box">
-                            <div class="label">Tip</div>
-                            <p>A small, quiet mini PC in a corner of the office can be a perfect backup target.</p>
-                        </div>
-                    </div>
-
-                    <div class="method-card">
-                        <div class="method-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-cloud"/></svg></div>
-                        <h3>Encrypted cloud backup</h3>
-                        <p>If there is no trusted friend or second site, the cloud is the answer. Important: the data is encrypted before it is uploaded!</p>
-                        <ul class="method-pros">
-                            <li>Professional infrastructure</li>
-                            <li>Storage spread across places</li>
-                            <li>No hardware needed</li>
-                        </ul>
-                        <ul class="method-pros method-cons">
-                            <li>A monthly or yearly fee (depending on how much is stored)</li>
-                        </ul>
-                        <div class="example-box">
-                            <div class="label">Note</div>
-                            <p>The storage fee depends on how much data is backed up. This is the option a Felhom box uses.</p>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </section>
-
-        <!-- Mi hogyan csináljuk -->
-        <section class="content-section alt-bg">
-            <div class="container">
-                <div class="section-header">
-                    <h2>How <span>we do it</span></h2>
-                    <p>Backups are set up by default on every server we install</p>
-                </div>
-
-                <div class="info-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-wrench"/></svg> Automatic backups</h3>
-                    <p>Every night the server makes backups by itself, on three levels: <strong>on the box</strong>, on a <strong>second drive</strong> (if there is one), and <strong>encrypted on remote storage</strong>. You do not have to remember anything – the system takes care of it.</p>
-                    <p>The backups are incremental: only the changes are saved. That saves space and time, and a full restore is still there when you need it.</p>
-
-                    <div class="highlight-box">
-                        <p><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-monitor"/></svg> <strong>Not only the data:</strong> thanks to the Proxmox base, not only your files and databases are backed up but your <strong>whole system</strong> too – the whole box goes into a backup, and it can be restored from it. If the box itself breaks, your apps' data can be brought back from the encrypted remote backup onto the reinstalled system – with the recovery code.</p>
-                    </div>
-
-                    <div class="highlight-box">
-                        <p><strong>Where the remote backup goes:</strong> on a Felhom box the remote copy goes, encrypted, to storage we provide. The "buddy system" and the office are general options for the 3-2-1 rule – we do not set them up today.</p>
-                    </div>
-
-                    <h3 style="margin-top: 24px;"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-lock"/></svg> The recovery code – only you know it</h3>
-                    <p>Your remote backup is encrypted, and the key to the encryption is a <strong>recovery code</strong>. The code appears exactly once: on your screen, when it is set up. We keep no copy of it.</p>
-                    <p>This is a deliberate choice, and it has two sides. One: <strong>nobody</strong> but you can read your remote backup – not even us. The other: if the box is destroyed and the code is lost too, then <strong>we cannot restore</strong> the remote backup either. So the code goes on paper, and somewhere safe.</p>
-
-                    <h3 style="margin-top: 24px;"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chart-column"/></svg> Monitoring and notifications</h3>
-                    <p>We watch the backups all the time. If there is a problem – a failed backup, storage filling up, a connection fault – it shows up in our monitoring, and an e-mail goes out about it. One aim of the closed test is to polish these notifications in real use.</p>
-                </div>
-            </div>
-        </section>
-
-        <!-- CTA -->
-        <section class="cta-section">
-            <div class="container">
-                <h2>A question about <span>backups?</span></h2>
-                <p>Let's talk about what is best in your situation. We help you find the balance between safety and cost.</p>
-                <a href="/en/contact" class="cta-button">Get in touch →</a>
-            </div>
-        </section>
-    </main>
-    <script>
-    (function() {
-        var hamburger = document.getElementById('hamburger');
-        var navLinks = document.querySelector('.nav-links');
-        var overlay = document.getElementById('mobileOverlay');
-        var body = document.body;
-
-        if (!hamburger || !navLinks || !overlay) {
-            console.warn('[mobile-menu] Missing elements:', {
-                hamburger: !!hamburger,
-                navLinks: !!navLinks,
-                overlay: !!overlay
-            });
-            return;
-        }
-
-        function openMenu() {
-            hamburger.classList.add('is-active');
-            navLinks.classList.add('is-open');
-            overlay.classList.add('is-visible');
-            body.classList.add('menu-open');
-            hamburger.setAttribute('aria-expanded', 'true');
-            hamburger.setAttribute('aria-label', 'Close menu');
-        }
-
-        function closeMenu() {
-            hamburger.classList.remove('is-active');
-            navLinks.classList.remove('is-open');
-            overlay.classList.remove('is-visible');
-            body.classList.remove('menu-open');
-            hamburger.setAttribute('aria-expanded', 'false');
-            hamburger.setAttribute('aria-label', 'Open menu');
-        }
-
-        hamburger.addEventListener('click', function() {
-            if (navLinks.classList.contains('is-open')) {
-                closeMenu();
-            } else {
-                openMenu();
-            }
-        });
-
-        overlay.addEventListener('click', closeMenu);
-
-        navLinks.querySelectorAll('a').forEach(function(link) {
-            link.addEventListener('click', closeMenu);
-        });
-
-        document.addEventListener('keydown', function(e) {
-            if (e.key === 'Escape' && navLinks.classList.contains('is-open')) {
-                closeMenu();
-            }
-        });
-
-        window.addEventListener('resize', function() {
-            if (window.innerWidth > 900 && navLinks.classList.contains('is-open')) {
-                closeMenu();
-            }
-        });
-    })();
-    </script>
-<footer>
-        <div class="container">
-            <p>© 2026 felhom.eu – Your own cloud, your own rules. Felhom serves households in Hungary.</p>
-            <p class="footer-legal">Operated by Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Privacy notice (Hungarian)</a> · <a href="/feltetelek">Terms (Hungarian)</a></p>
-        </div>
-    </footer>
-    <script>
-    (function(){
-        var b=document.getElementById('navBurger'),s=document.getElementById('sidebar'),k=document.getElementById('navBackdrop');
-        if(!b||!s||!k)return;
-        function open(){s.classList.add('is-open');k.hidden=false;document.body.classList.add('nav-open');b.setAttribute('aria-expanded','true');}
-        function close(){s.classList.remove('is-open');k.hidden=true;document.body.classList.remove('nav-open');b.setAttribute('aria-expanded','false');}
-        b.addEventListener('click',function(){s.classList.contains('is-open')?close():open();});
-        k.addEventListener('click',close);
-        document.addEventListener('keydown',function(e){if(e.key==='Escape'&&s.classList.contains('is-open')){close();b.focus();}});
-        s.querySelectorAll('a').forEach(function(l){l.addEventListener('click',close);});
-        window.addEventListener('resize',function(){if(window.innerWidth>768)close();});
-    })();
-    document.addEventListener('click',function(e){
-        var btn=e.target.closest?e.target.closest('.nav-group-toggle'):null;
-        if(!btn)return;
-        var g=btn.closest('.nav-group');if(!g)return;
-        var willOpen=!g.classList.contains('is-open');
-        document.querySelectorAll('.nav-group.is-open').forEach(function(x){
-            x.classList.remove('is-open');
-            var t=x.querySelector('.nav-group-toggle');if(t)t.setAttribute('aria-expanded','false');
-        });
-        if(willOpen){g.classList.add('is-open');btn.setAttribute('aria-expanded','true');}
-    });
-    </script>
-</body>
-</html>
diff --git a/website/preview/m3/en/contact.html b/website/preview/m3/en/contact.html
deleted file mode 100644
index 7076a14e..00000000
--- a/website/preview/m3/en/contact.html
+++ /dev/null
@@ -1,657 +0,0 @@
-<!DOCTYPE html>
-<html lang="en" class="no-js">
-<head>
-    <script>document.documentElement.className=document.documentElement.className.replace('no-js','js');</script>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Contact — ask for a personal offer for your home server | Felhom.eu</title>
-    <meta name="description" content="Write to us and we will make a personal offer for your home server in Hungary. A question? We help! E-mail: info@felhom.eu">
-
-    <meta name="keywords" content="contact, request an offer, home server offer, Felhom contact">
-    <meta name="robots" content="index, follow">
-    <link rel="canonical" href="https://felhom.eu/en/contact">
-    <link rel="alternate" hreflang="hu" href="https://felhom.eu/kapcsolat">
-    <link rel="alternate" hreflang="en" href="https://felhom.eu/en/contact">
-    <link rel="alternate" hreflang="x-default" href="https://felhom.eu/kapcsolat">
-
-    <meta property="og:type" content="website">
-    <meta property="og:url" content="https://felhom.eu/en/contact">
-    <meta property="og:title" content="Contact — Felhom.eu">
-    <meta property="og:description" content="Write to us and we will make a personal offer for your home server.">
-    <meta property="og:image" content="https://felhom.eu/assets/og-image-en.png">
-    <meta property="og:locale" content="en_GB">
-    <meta property="og:site_name" content="Felhom.eu">
-
-    <meta name="twitter:card" content="summary">
-    <meta name="twitter:title" content="Contact — Felhom.eu">
-    <meta name="twitter:description" content="A question? Write to us: info@felhom.eu">
-    <meta name="twitter:image" content="https://felhom.eu/assets/og-image-en.png">
-    <!-- shared assets: bump ?v= together on any site.css/icons.svg change -->
-    <link rel="stylesheet" href="/assets/site.css?v=21">
-    <link rel="stylesheet" href="/assets/shell.css?v=21">
-    <link rel="icon" type="image/png" href="/assets/logo_favicon_2.svg">
-    <script defer src="https://stats.felhom.eu/script.js" data-website-id="d419db57-5e1c-48df-bdb3-c29f25fb1661"></script>
-</head>
-<body class="shell page-kapcsolat">
-    <header class="mobile-topbar">
-        <a href="/preview/m3/en/" class="mobile-topbar-logo"><img src="/assets/logo_notext_white.svg" alt="Felhom.eu"></a>
-        <button type="button" class="nav-burger" id="navBurger" aria-expanded="false" aria-controls="sidebar" aria-label="Menu">
-            <span class="hamburger-box"><span class="hamburger-line"></span><span class="hamburger-line"></span><span class="hamburger-line"></span></span>
-        </button>
-    </header>
-    <div class="nav-backdrop" id="navBackdrop" hidden></div>
-    <nav class="sidebar" id="sidebar">
-        <div class="sidebar-header">
-            <a href="/preview/m3/en/" class="sidebar-logo-link">
-                <img src="/assets/logo_notext_white.svg" alt="" class="sidebar-logo" aria-hidden="true">
-                <img src="/assets/logo-wordmark.png" alt="felhom.eu" class="sidebar-word">
-            </a>
-        </div>
-        <ul class="nav-links">
-                <li><a href="/preview/m3/en/"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg>Home</a></li>
-                <li><a href="/preview/m3/en/#services"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rocket"/></svg>Services</a></li>
-                <li class="nav-group">
-                    <button type="button" class="nav-group-toggle" aria-expanded="false" aria-controls="nav-group-apps"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg>Applications<svg class="ico nav-chevron" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chevron-down"/></svg></button>
-                    <ul id="nav-group-apps" class="nav-links nav-links-sub nav-links-nested">
-                        <li><a href="/preview/m3/en/apps">All applications</a></li>
-                        <li><a href="/preview/m3/en/apps#files-office">Files &amp; Office</a></li>
-                        <li><a href="/preview/m3/en/apps#media-entertainment">Media &amp; Entertainment</a></li>
-                        <li><a href="/preview/m3/en/apps#home-lifestyle">Home &amp; Lifestyle</a></li>
-                        <li><a href="/preview/m3/en/apps#productivity-knowledge">Productivity &amp; Knowledge</a></li>
-                        <li><a href="/preview/m3/en/apps#system-development">System &amp; Development</a></li>
-                    </ul>
-                </li>
-                <li><a href="/preview/m3/en/technology"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg>Technology</a></li>
-                <li><a href="/preview/m3/en/backups"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg>Backups</a></li>
-        </ul>
-        <div class="sidebar-bottom">
-            <a href="/preview/m3/en/testing" class="btn btn-outline sidebar-cta">Apply as a tester →</a>
-            <div class="nav-group-label">About Felhom</div>
-            <ul class="nav-links nav-links-sub">
-                    <li><a href="/preview/m3/en/#how-it-works">How it works</a></li>
-                    <li><a href="/preview/m3/en/faq">FAQ</a></li>
-                    <li><a href="/preview/m3/en/contact" class="active">Contact</a></li>
-            </ul>
-            <div class="sidebar-footer">
-                <details class="lang-globe"><summary class="lang-globe-btn" aria-label="Language" title="Language"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/preview/m3/kapcsolat" lang="hu" hreflang="hu" class="lang-globe-item">Magyar</a></li><li><a href="/preview/m3/en/contact" lang="en" hreflang="en" class="lang-globe-item current" aria-current="true">English</a></li></ul></details>
-            </div>
-        </div>
-    </nav>
-<main class="content">
-<div class="page-header">
-                <h1>Write to <span>us!</span></h1>
-            </div>
-            <p class="page-lede">A question, or want to talk about what you need? Fill in the form and we will answer soon. We answer in English or Hungarian.</p>
-        <section class="content-section" style="padding-top: 0;">
-            <div class="container">
-                <div class="contact-layout">
-
-                    <!-- Form -->
-                    <div class="contact-form-card">
-                        <div id="formStatus" class="form-status"></div>
-
-                        <form id="contactForm" novalidate>
-                            <div style="position:absolute;left:-9999px;" aria-hidden="true">
-                                <input type="text" name="website" tabindex="-1" autocomplete="off">
-                            </div>
-                            <div class="form-row">
-                                <div class="form-group">
-                                    <label for="name">Name <span class="required">*</span></label>
-                                    <input type="text" id="name" name="name" placeholder="Your full name" required>
-                                    <div class="error-message" id="nameError">Enter your name.</div>
-                                </div>
-                                <div class="form-group">
-                                    <label for="email">E-mail <span class="required">*</span></label>
-                                    <input type="email" id="email" name="email" placeholder="you@example.com" required>
-                                    <div class="error-message" id="emailError">Enter a valid e-mail address.</div>
-                                </div>
-                            </div>
-
-                            <div class="form-group">
-                                <label for="subject">Subject <span class="required">*</span></label>
-                                <select id="subject" name="subject" required>
-                                    <option value="" disabled selected>Choose a topic...</option>
-                                    <option value="zart-teszt">Closed test – I want to be a tester</option>
-                                    <option value="erdeklodes">Interest – I would like to learn about the service</option>
-                                    <option value="arajanlat">Request a quote – I have specific needs</option>
-                                    <option value="tamogatas">Support – a question about my existing server</option>
-                                    <option value="egyeb">Other</option>
-                                </select>
-                                <div class="error-message" id="subjectError">Choose a topic.</div>
-                            </div>
-
-                            <div class="form-group">
-                                <label for="message">Message <span class="required">*</span></label>
-                                <textarea id="message" name="message" placeholder="Tell us how we can help..." required></textarea>
-                                <div class="error-message" id="messageError">Write your message.</div>
-                            </div>
-
-                            <div class="form-group">
-                                <label>Attach files <span style="color: var(--text-3); font-weight: 400;">(optional)</span></label>
-                                <div class="file-upload-zone" id="dropZone">
-                                    <input type="file" id="fileInput" multiple accept=".pdf,.doc,.docx,.xls,.xlsx,.png,.jpg,.jpeg,.gif,.webp,.txt,.csv,.zip,.7z">
-                                    <div class="upload-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-paperclip"/></svg></div>
-                                    <div class="upload-text">
-                                        <strong>Click here</strong> or drag your files here
-                                    </div>
-                                    <div class="upload-hint">PDF, images, documents · max. 20 MB in total</div>
-                                </div>
-                                <div class="file-list" id="fileList"></div>
-                                <div class="file-total-size" id="fileTotalSize"></div>
-                            </div>
-
-                            <div class="checkbox-group">
-                                <input type="checkbox" id="privacy" name="privacy" required>
-                                <label for="privacy">
-                                    I have read the <a href="/adatkezeles" target="_blank" rel="noopener">privacy notice (in Hungarian)</a> and agree that my name, e-mail address, message and attached files are used to answer my enquiry. The message is carried by mail-sending and mailbox providers. I can withdraw this consent at any time at info@felhom.eu.
-                                </label>
-                            </div>
-                            <div class="error-message" id="privacyError" style="margin-top: -16px; margin-bottom: 16px;">Your consent to the use of your details is needed.</div>
-
-                            <button type="submit" class="submit-button" id="submitBtn">
-                                <span class="btn-text">Send message →</span>
-                                <span class="spinner"></span>
-                            </button>
-                        </form>
-                    </div>
-
-                    <!-- Sidebar -->
-                    <div class="contact-sidebar">
-                        <div class="sidebar-card">
-                            <h3><span class="icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-mail"/></svg></span> E-mail us directly</h3>
-                            <p>If you would rather send an e-mail:</p>
-                            <a href="mailto:info@felhom.eu" class="direct-email">
-                                <svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-mail"/></svg> info@felhom.eu
-                            </a>
-                        </div>
-
-                        <div class="sidebar-card">
-                            <h3><span class="icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-clock"/></svg></span> Reply time</h3>
-                            <p>We usually answer <strong style="color: var(--blue-bright);">within 24 hours</strong> on working days.</p>
-                            <p>If a support question is urgent, say so in the subject.</p>
-                        </div>
-
-                        <div class="sidebar-card">
-                            <h3><span class="icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-lightbulb"/></svg></span> How can we help?</h3>
-                            <ul class="sidebar-list">
-                                <li><span class="li-icon"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-monitor"/></svg></span> Advice on a server set-up</li>
-                                <li><span class="li-icon"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg></span> Installing and setting up apps</li>
-                                <li><span class="li-icon"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-lock"/></svg></span> Setting up backups</li>
-                                <li><span class="li-icon"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></span> Setting up remote access</li>
-                                <li><span class="li-icon"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-wrench"/></svg></span> Maintaining an existing server</li>
-                            </ul>
-                        </div>
-                    </div>
-
-                </div>
-            </div>
-        </section>
-    <section class="content-section alt-bg" id="ki-all-mogotte">
-        <div class="container">
-            <div class="who">
-                <figure class="who-photo">
-                    <img src="/assets/operator-portrait.webp" alt="Viktor Nagyfenyvesi, who runs Felhom" width="720" height="900" loading="lazy">
-                </figure>
-                <div class="who-text">
-                    <h2>Who is <span>behind it</span></h2>
-                    <p><strong>I am Viktor Nagyfenyvesi.</strong> I have designed networks and infrastructure for ten years, I work as a DevOps engineer, and I have run my own server at home for years; the current one has been running for about a year.</p>
-                    <p>Felhom started because I could not find this service here. Plenty of people can build their own server, but afterwards someone has to back it up, update it and keep an eye on it. That is the part I take on.</p>
-                    <p>If you write, I answer, and I do not promise anything the box cannot do today.</p>
-                </div>
-            </div>
-        </div>
-    </section>
-    </main>
-
-    <script>
-    (() => {
-        'use strict';
-
-        // ==============================================
-        // CONFIGURATION
-        // ==============================================
-        const CONFIG = {
-            // TODO: Replace with your actual form backend endpoint.
-            // Options:
-            //   1. Self-hosted: Deploy a small container (e.g. Go/Python) that receives POST and sends via SMTP
-            //   2. Formspree:   'https://formspree.io/f/YOUR_FORM_ID'
-            //   3. Cloudflare Workers: Deploy a worker that forwards to email
-            //
-            // For now, falls back to mailto: if no endpoint is configured.
-            formEndpoint: '/api/contact',
-
-            maxTotalFileSize: 20 * 1024 * 1024,  // 20 MB
-            maxSingleFileSize: 10 * 1024 * 1024,  // 10 MB per file
-            maxFiles: 5,
-            allowedExtensions: ['pdf','doc','docx','xls','xlsx','png','jpg','jpeg','gif','webp','txt','csv','zip','7z'],
-        };
-
-        // ==============================================
-        // DOM REFS
-        // ==============================================
-        const form = document.getElementById('contactForm');
-        const submitBtn = document.getElementById('submitBtn');
-        const formStatus = document.getElementById('formStatus');
-        const dropZone = document.getElementById('dropZone');
-        const fileInput = document.getElementById('fileInput');
-        const fileListEl = document.getElementById('fileList');
-        const fileTotalSizeEl = document.getElementById('fileTotalSize');
-
-        let attachedFiles = [];
-
-        // Preselect the subject from ?tema= (the closed-test CTA on the landing page
-        // links here as /en/contact?tema=zart-teszt – the same values as the Hungarian page). Unknown values are ignored.
-        (function preselectSubject() {
-            const wanted = new URLSearchParams(window.location.search).get('tema');
-            if (!wanted) return;
-            const select = document.getElementById('subject');
-            if (!select) return;
-            const match = Array.from(select.options).some(o => o.value === wanted);
-            if (match) {
-                select.value = wanted;
-            } else {
-                console.warn('[contact] unknown ?tema= value, ignoring:', wanted);
-            }
-        })();
-
-        // ==============================================
-        // VALIDATION
-        // ==============================================
-        function validateField(field) {
-            const errorEl = document.getElementById(field.id + 'Error');
-            let valid = true;
-
-            if (field.type === 'checkbox') {
-                valid = field.checked;
-            } else if (field.required && !field.value.trim()) {
-                valid = false;
-            } else if (field.type === 'email' && field.value.trim()) {
-                valid = /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(field.value.trim());
-            }
-
-            if (valid) {
-                field.classList.remove('error');
-                if (errorEl) errorEl.classList.remove('visible');
-            } else {
-                field.classList.add('error');
-                if (errorEl) errorEl.classList.add('visible');
-            }
-
-            return valid;
-        }
-
-        function validateForm() {
-            const fields = ['name', 'email', 'subject', 'message', 'privacy'];
-            let allValid = true;
-
-            fields.forEach(id => {
-                const field = document.getElementById(id);
-                if (!validateField(field)) allValid = false;
-            });
-
-            return allValid;
-        }
-
-        // Live validation on blur
-        ['name', 'email', 'subject', 'message', 'privacy'].forEach(id => {
-            const el = document.getElementById(id);
-            const event = el.type === 'checkbox' ? 'change' : 'blur';
-            el.addEventListener(event, () => validateField(el));
-            // Clear error on input
-            el.addEventListener('input', () => {
-                if (el.classList.contains('error')) validateField(el);
-            });
-        });
-
-        // ==============================================
-        // FILE HANDLING
-        // ==============================================
-        function formatFileSize(bytes) {
-            if (bytes < 1024) return bytes + ' B';
-            if (bytes < 1024 * 1024) return (bytes / 1024).toFixed(1) + ' KB';
-            return (bytes / (1024 * 1024)).toFixed(1) + ' MB';
-        }
-
-        function getFileIcon(name) {
-            const ext = name.split('.').pop().toLowerCase();
-            const icons = {
-                pdf: '<svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-file-text"/></svg>', doc: '<svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-file-text"/></svg>', docx: '<svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-file-text"/></svg>', xls: '<svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chart-column"/></svg>', xlsx: '<svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chart-column"/></svg>',
-                png: '<svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-image"/></svg>', jpg: '<svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-image"/></svg>', jpeg: '<svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-image"/></svg>', gif: '<svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-image"/></svg>', webp: '<svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-image"/></svg>',
-                txt: '<svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-file-text"/></svg>', csv: '<svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chart-column"/></svg>', zip: '<svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg>', '7z': '<svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg>',
-            };
-            return icons[ext] || '<svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-paperclip"/></svg>';
-        }
-
-        function getTotalFileSize() {
-            return attachedFiles.reduce((sum, f) => sum + f.size, 0);
-        }
-
-        function addFiles(fileArray) {
-            for (const file of fileArray) {
-                // Check extension
-                const ext = file.name.split('.').pop().toLowerCase();
-                if (!CONFIG.allowedExtensions.includes(ext)) {
-                    showStatus(`The file type of "${file.name}" is not allowed.`, 'error-state');
-                    continue;
-                }
-
-                // Check single file size
-                if (file.size > CONFIG.maxSingleFileSize) {
-                    showStatus(`"${file.name}" is too large (max. ${formatFileSize(CONFIG.maxSingleFileSize)} per file).`, 'error-state');
-                    continue;
-                }
-
-                // Check max file count
-                if (attachedFiles.length >= CONFIG.maxFiles) {
-                    showStatus(`You can attach at most ${CONFIG.maxFiles} files.`, 'error-state');
-                    break;
-                }
-
-                // Check total size
-                if (getTotalFileSize() + file.size > CONFIG.maxTotalFileSize) {
-                    showStatus(`The files together are over the ${formatFileSize(CONFIG.maxTotalFileSize)} limit.`, 'error-state');
-                    break;
-                }
-
-                // Check duplicate
-                if (attachedFiles.some(f => f.name === file.name && f.size === file.size)) {
-                    continue;
-                }
-
-                attachedFiles.push(file);
-            }
-
-            renderFileList();
-        }
-
-        function removeFile(index) {
-            attachedFiles.splice(index, 1);
-            renderFileList();
-            // Reset file input so same file can be re-added
-            fileInput.value = '';
-        }
-
-        function renderFileList() {
-            if (attachedFiles.length === 0) {
-                fileListEl.innerHTML = '';
-                fileTotalSizeEl.textContent = '';
-                return;
-            }
-
-            fileListEl.innerHTML = attachedFiles.map((file, i) => `
-                <div class="file-item">
-                    <span class="file-icon">${getFileIcon(file.name)}</span>
-                    <div class="file-info">
-                        <div class="file-name" title="${file.name}">${file.name}</div>
-                        <div class="file-size">${formatFileSize(file.size)}</div>
-                    </div>
-                    <button type="button" class="file-remove" data-index="${i}" title="Remove">&#215;</button>
-                </div>
-            `).join('');
-
-            // Bind remove buttons
-            fileListEl.querySelectorAll('.file-remove').forEach(btn => {
-                btn.addEventListener('click', () => removeFile(parseInt(btn.dataset.index)));
-            });
-
-            // Total size indicator
-            const total = getTotalFileSize();
-            const pct = (total / CONFIG.maxTotalFileSize) * 100;
-            fileTotalSizeEl.textContent = `${formatFileSize(total)} / ${formatFileSize(CONFIG.maxTotalFileSize)}`;
-            fileTotalSizeEl.className = 'file-total-size';
-            if (pct > 90) fileTotalSizeEl.classList.add('error-text');
-            else if (pct > 70) fileTotalSizeEl.classList.add('warning');
-        }
-
-        // File input change
-        fileInput.addEventListener('change', () => {
-            if (fileInput.files.length) {
-                addFiles(Array.from(fileInput.files));
-                fileInput.value = '';
-            }
-        });
-
-        // Drag & drop
-        ['dragenter', 'dragover'].forEach(evt => {
-            dropZone.addEventListener(evt, e => {
-                e.preventDefault();
-                dropZone.classList.add('dragover');
-            });
-        });
-
-        ['dragleave', 'drop'].forEach(evt => {
-            dropZone.addEventListener(evt, e => {
-                e.preventDefault();
-                dropZone.classList.remove('dragover');
-            });
-        });
-
-        dropZone.addEventListener('drop', e => {
-            if (e.dataTransfer.files.length) {
-                addFiles(Array.from(e.dataTransfer.files));
-            }
-        });
-
-        // ==============================================
-        // STATUS MESSAGES
-        // ==============================================
-        function showStatus(message, type) {
-            formStatus.textContent = message;
-            formStatus.className = 'form-status ' + type;
-            formStatus.scrollIntoView({ behavior: 'smooth', block: 'nearest' });
-
-            if (type === 'error-state') {
-                setTimeout(() => {
-                    formStatus.className = 'form-status';
-                }, 6000);
-            }
-        }
-
-        // ==============================================
-        // FORM SUBMISSION
-        // ==============================================
-        form.addEventListener('submit', async (e) => {
-            e.preventDefault();
-            formStatus.className = 'form-status';
-
-            if (!validateForm()) {
-                // Build specific error message
-                const missing = [];
-                if (!document.getElementById('name').value.trim()) missing.push('name');
-                const emailVal = document.getElementById('email').value.trim();
-                if (!emailVal || !/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(emailVal)) missing.push('email');
-                if (!document.getElementById('subject').value) missing.push('subject');
-                if (!document.getElementById('message').value.trim()) missing.push('message');
-                if (!document.getElementById('privacy').checked) missing.push('consent');
-
-                if (missing.length === 1 && missing[0] === 'consent') {
-                    showStatus('Tick the consent box to send the form.', 'error-state');
-                } else {
-                    showStatus('Fill in every required field.', 'error-state');
-                }
-                return;
-            }
-
-            submitBtn.classList.add('loading');
-            submitBtn.disabled = true;
-
-            const formData = {
-                name: document.getElementById('name').value.trim(),
-                email: document.getElementById('email').value.trim(),
-                subject: document.getElementById('subject').value,
-                message: document.getElementById('message').value.trim(),
-            };
-
-            // Subject label mapping
-            const subjectLabels = {
-                'zart-teszt': 'Application – closed test (EN)',
-                erdeklodes: 'Interest (EN)',
-                arajanlat: 'Quote request (EN)',
-                tamogatas: 'Support (EN)',
-                egyeb: 'Other (EN)',
-            };
-
-            try {
-                if (CONFIG.formEndpoint) {
-                    // --- Backend submission ---
-                    const data = new FormData();
-                    data.append('name', formData.name);
-                    data.append('email', formData.email);
-                    data.append('subject', subjectLabels[formData.subject] || formData.subject);
-                    data.append('message', formData.message);
-
-                    attachedFiles.forEach(file => {
-                        data.append('attachments', file);
-                    });
-
-                    const response = await fetch(CONFIG.formEndpoint, {
-                        method: 'POST',
-                        body: data,
-                    });
-
-                    if (!response.ok) {
-                        throw new Error(`Server error: ${response.status}`);
-                    }
-
-                    showStatus('Your message has been sent. We will answer soon.', 'success');
-                    form.reset();
-                    attachedFiles = [];
-                    renderFileList();
-
-                } else {
-                    // --- Fallback: mailto ---
-                    const subjectLine = `[Felhom.eu] ${subjectLabels[formData.subject] || formData.subject}`;
-                    const body = [
-                        `Name: ${formData.name}`,
-                        `Email: ${formData.email}`,
-                        ``,
-                        formData.message,
-                    ].join('\n');
-
-                    const mailtoUrl = `mailto:info@felhom.eu?subject=${encodeURIComponent(subjectLine)}&body=${encodeURIComponent(body)}`;
-                    window.location.href = mailtoUrl;
-
-                    if (attachedFiles.length > 0) {
-                        showStatus('Your e-mail program has opened. Add the attached files to the e-mail by hand: a mailto: link cannot carry attachments.', 'error-state');
-                    } else {
-                        showStatus('Your e-mail program has opened with your message. Send the e-mail to get in touch.', 'success');
-                    }
-                }
-            } catch (err) {
-                console.error('Form submission error:', err);
-                showStatus(`Something went wrong while sending. Try again, or write to info@felhom.eu directly.`, 'error-state');
-            } finally {
-                submitBtn.classList.remove('loading');
-                submitBtn.disabled = false;
-            }
-        });
-
-        // ==============================================
-        // DEBUG HELPER
-        // ==============================================
-        // Uncomment to test form states:
-        // window.debugForm = {
-        //     showSuccess: () => showStatus('Your message has been sent.', 'success'),
-        //     showError: () => showStatus('Something went wrong.', 'error-state'),
-        //     getFiles: () => console.log(attachedFiles),
-        //     getFormData: () => {
-        //         const fd = new FormData(form);
-        //         for (const [k,v] of fd.entries()) console.log(k, v);
-        //     },
-        // };
-
-    })();
-    </script>
-    <script>
-    (function() {
-        var hamburger = document.getElementById('hamburger');
-        var navLinks = document.querySelector('.nav-links');
-        var overlay = document.getElementById('mobileOverlay');
-        var body = document.body;
-
-        if (!hamburger || !navLinks || !overlay) {
-            console.warn('[mobile-menu] Missing elements:', {
-                hamburger: !!hamburger,
-                navLinks: !!navLinks,
-                overlay: !!overlay
-            });
-            return;
-        }
-
-        function openMenu() {
-            hamburger.classList.add('is-active');
-            navLinks.classList.add('is-open');
-            overlay.classList.add('is-visible');
-            body.classList.add('menu-open');
-            hamburger.setAttribute('aria-expanded', 'true');
-            hamburger.setAttribute('aria-label', 'Close menu');
-        }
-
-        function closeMenu() {
-            hamburger.classList.remove('is-active');
-            navLinks.classList.remove('is-open');
-            overlay.classList.remove('is-visible');
-            body.classList.remove('menu-open');
-            hamburger.setAttribute('aria-expanded', 'false');
-            hamburger.setAttribute('aria-label', 'Open menu');
-        }
-
-        hamburger.addEventListener('click', function() {
-            if (navLinks.classList.contains('is-open')) {
-                closeMenu();
-            } else {
-                openMenu();
-            }
-        });
-
-        overlay.addEventListener('click', closeMenu);
-
-        navLinks.querySelectorAll('a').forEach(function(link) {
-            link.addEventListener('click', closeMenu);
-        });
-
-        document.addEventListener('keydown', function(e) {
-            if (e.key === 'Escape' && navLinks.classList.contains('is-open')) {
-                closeMenu();
-            }
-        });
-
-        window.addEventListener('resize', function() {
-            if (window.innerWidth > 900 && navLinks.classList.contains('is-open')) {
-                closeMenu();
-            }
-        });
-    })();
-    </script>
-<footer>
-        <div class="container">
-            <p>© 2026 felhom.eu – Your own cloud, your own rules. Felhom serves households in Hungary.</p>
-            <p class="footer-legal">Operated by Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Privacy notice (Hungarian)</a> · <a href="/feltetelek">Terms (Hungarian)</a></p>
-        </div>
-    </footer>
-    <script>
-    (function(){
-        var b=document.getElementById('navBurger'),s=document.getElementById('sidebar'),k=document.getElementById('navBackdrop');
-        if(!b||!s||!k)return;
-        function open(){s.classList.add('is-open');k.hidden=false;document.body.classList.add('nav-open');b.setAttribute('aria-expanded','true');}
-        function close(){s.classList.remove('is-open');k.hidden=true;document.body.classList.remove('nav-open');b.setAttribute('aria-expanded','false');}
-        b.addEventListener('click',function(){s.classList.contains('is-open')?close():open();});
-        k.addEventListener('click',close);
-        document.addEventListener('keydown',function(e){if(e.key==='Escape'&&s.classList.contains('is-open')){close();b.focus();}});
-        s.querySelectorAll('a').forEach(function(l){l.addEventListener('click',close);});
-        window.addEventListener('resize',function(){if(window.innerWidth>768)close();});
-    })();
-    document.addEventListener('click',function(e){
-        var btn=e.target.closest?e.target.closest('.nav-group-toggle'):null;
-        if(!btn)return;
-        var g=btn.closest('.nav-group');if(!g)return;
-        var willOpen=!g.classList.contains('is-open');
-        document.querySelectorAll('.nav-group.is-open').forEach(function(x){
-            x.classList.remove('is-open');
-            var t=x.querySelector('.nav-group-toggle');if(t)t.setAttribute('aria-expanded','false');
-        });
-        if(willOpen){g.classList.add('is-open');btn.setAttribute('aria-expanded','true');}
-    });
-    </script>
-</body>
-</html>
diff --git a/website/preview/m3/en/download.html b/website/preview/m3/en/download.html
deleted file mode 100644
index 756a11ce..00000000
--- a/website/preview/m3/en/download.html
+++ /dev/null
@@ -1,207 +0,0 @@
-<!DOCTYPE html>
-<html lang="en" class="no-js">
-<head>
-    <script>document.documentElement.className=document.documentElement.className.replace('no-js','js');</script>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Download — the Felhom installer | Felhom.eu</title>
-    <meta name="description" content="The Felhom home server installer: download, checksum, and what to check before you install.">
-    <meta name="robots" content="noindex, follow">
-    <link rel="canonical" href="https://felhom.eu/en/download">
-    <link rel="alternate" hreflang="hu" href="https://felhom.eu/letoltes">
-    <link rel="alternate" hreflang="en" href="https://felhom.eu/en/download">
-    <link rel="alternate" hreflang="x-default" href="https://felhom.eu/letoltes">
-
-    <meta property="og:type" content="website">
-    <meta property="og:url" content="https://felhom.eu/en/download">
-    <meta property="og:title" content="Download the Felhom installer">
-    <meta property="og:description" content="Download, checksum, and what to check before you install.">
-    <meta property="og:image" content="https://felhom.eu/assets/og-image.png">
-    <meta property="og:locale" content="en_GB">
-    <meta property="og:site_name" content="Felhom.eu">
-
-    <meta name="twitter:card" content="summary_large_image">
-    <meta name="twitter:title" content="Download the Felhom installer">
-    <meta name="twitter:description" content="Download, checksum, and what to check before you install.">
-    <meta name="twitter:image" content="https://felhom.eu/assets/og-image.png">
-    <!-- shared assets: bump ?v= together on any site.css/icons.svg change -->
-    <link rel="stylesheet" href="/assets/site.css?v=21">
-    <link rel="stylesheet" href="/assets/shell.css?v=21">
-    <link rel="icon" type="image/png" href="/assets/logo_favicon_2.svg">
-    <script defer src="https://stats.felhom.eu/script.js" data-website-id="d419db57-5e1c-48df-bdb3-c29f25fb1661"></script>
-</head>
-<body class="shell page-letoltes">
-    <header class="mobile-topbar">
-        <a href="/preview/m3/en/" class="mobile-topbar-logo"><img src="/assets/logo_notext_white.svg" alt="Felhom.eu"></a>
-        <button type="button" class="nav-burger" id="navBurger" aria-expanded="false" aria-controls="sidebar" aria-label="Menu">
-            <span class="hamburger-box"><span class="hamburger-line"></span><span class="hamburger-line"></span><span class="hamburger-line"></span></span>
-        </button>
-    </header>
-    <div class="nav-backdrop" id="navBackdrop" hidden></div>
-    <nav class="sidebar" id="sidebar">
-        <div class="sidebar-header">
-            <a href="/preview/m3/en/" class="sidebar-logo-link">
-                <img src="/assets/logo_notext_white.svg" alt="" class="sidebar-logo" aria-hidden="true">
-                <img src="/assets/logo-wordmark.png" alt="felhom.eu" class="sidebar-word">
-            </a>
-        </div>
-        <ul class="nav-links">
-                <li><a href="/preview/m3/en/"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg>Home</a></li>
-                <li><a href="/preview/m3/en/#services"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rocket"/></svg>Services</a></li>
-                <li class="nav-group">
-                    <button type="button" class="nav-group-toggle" aria-expanded="false" aria-controls="nav-group-apps"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg>Applications<svg class="ico nav-chevron" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chevron-down"/></svg></button>
-                    <ul id="nav-group-apps" class="nav-links nav-links-sub nav-links-nested">
-                        <li><a href="/preview/m3/en/apps">All applications</a></li>
-                        <li><a href="/preview/m3/en/apps#files-office">Files &amp; Office</a></li>
-                        <li><a href="/preview/m3/en/apps#media-entertainment">Media &amp; Entertainment</a></li>
-                        <li><a href="/preview/m3/en/apps#home-lifestyle">Home &amp; Lifestyle</a></li>
-                        <li><a href="/preview/m3/en/apps#productivity-knowledge">Productivity &amp; Knowledge</a></li>
-                        <li><a href="/preview/m3/en/apps#system-development">System &amp; Development</a></li>
-                    </ul>
-                </li>
-                <li><a href="/preview/m3/en/technology"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg>Technology</a></li>
-                <li><a href="/preview/m3/en/backups"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg>Backups</a></li>
-        </ul>
-        <div class="sidebar-bottom">
-            <a href="/preview/m3/en/testing" class="btn btn-outline sidebar-cta">Apply as a tester →</a>
-            <div class="nav-group-label">About Felhom</div>
-            <ul class="nav-links nav-links-sub">
-                    <li><a href="/preview/m3/en/#how-it-works">How it works</a></li>
-                    <li><a href="/preview/m3/en/faq">FAQ</a></li>
-                    <li><a href="/preview/m3/en/contact">Contact</a></li>
-            </ul>
-            <div class="sidebar-footer">
-                <details class="lang-globe"><summary class="lang-globe-btn" aria-label="Language" title="Language"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/preview/m3/letoltes" lang="hu" hreflang="hu" class="lang-globe-item">Magyar</a></li><li><a href="/preview/m3/en/download" lang="en" hreflang="en" class="lang-globe-item current" aria-current="true">English</a></li></ul></details>
-            </div>
-        </div>
-    </nav>
-<main class="content">
-                <div class="page-header">
-                <h1>The Felhom <span>installer</span></h1>
-            </div>
-                <p class="page-lede">This page is for someone who has received an installation guide from their operator. The installer turns a whole machine into a Felhom server.</p>
-
-
-        <section class="content-section">
-            <div class="container">
-                <div class="info-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-triangle-alert"/></svg> Before you download</h3>
-                    <p>Installing <strong>erases every piece of data</strong> on the disk you select. The installer never chooses for you: it lists the disks with their size and type, and overwrites the one you pick.</p>
-                    <p>Unplug the external drive you use for backups before you start. If you are not certain which disk is the right one, <strong>stop and call your operator</strong>.</p>
-                    <p>The guide from your operator describes every step, screen by screen. Do not start without it.</p>
-                </div>
-            </div>
-        </section>
-
-        <section class="content-section alt-bg">
-            <div class="container">
-                <div class="section-header">
-                    <h2>Download</h2>
-                    <p>Felhom installer 1.29.0 (based on Proxmox VE 9.2)</p>
-                </div>
-                <div class="info-card">
-                    <p><a href="https://iso.felhom.eu/felhom-installer-1.29.0-pve9.2-1.iso"><strong>felhom-installer-1.29.0-pve9.2-1.iso</strong></a> – 1.6 GB (1,705,324,544 bytes)</p>
-                    <p>Checksum (SHA-256):</p>
-                    <div class="highlight-box">
-                        <p><code>dceacae5da247d76cad065bf6c0d3bbefac8d8a5f8e571db2fd8449a97e94829</code></p>
-                    </div>
-                    <p>The same checksum as a file: <a href="https://iso.felhom.eu/felhom-installer-1.29.0-pve9.2-1.iso.sha256">felhom-installer-1.29.0-pve9.2-1.iso.sha256</a></p>
-                    <p>To check it on Linux or macOS: <code>sha256sum felhom-installer-1.29.0-pve9.2-1.iso</code>. On Windows, in PowerShell: <code>Get-FileHash felhom-installer-1.29.0-pve9.2-1.iso</code>. The string it prints must match the one above. If it does not match, do not use the file – download it again.</p>
-                    <p>The downloaded file has to be written to a USB stick of at least 4 GB (with Balena Etcher or Rufus, for example). The guide covers that too.</p>
-                </div>
-            </div>
-        </section>
-    </main>
-    <script>
-    (function() {
-        var hamburger = document.getElementById('hamburger');
-        var navLinks = document.querySelector('.nav-links');
-        var overlay = document.getElementById('mobileOverlay');
-        var body = document.body;
-
-        if (!hamburger || !navLinks || !overlay) {
-            console.warn('[mobile-menu] Missing elements:', {
-                hamburger: !!hamburger,
-                navLinks: !!navLinks,
-                overlay: !!overlay
-            });
-            return;
-        }
-
-        function openMenu() {
-            hamburger.classList.add('is-active');
-            navLinks.classList.add('is-open');
-            overlay.classList.add('is-visible');
-            body.classList.add('menu-open');
-            hamburger.setAttribute('aria-expanded', 'true');
-            hamburger.setAttribute('aria-label', 'Close menu');
-        }
-
-        function closeMenu() {
-            hamburger.classList.remove('is-active');
-            navLinks.classList.remove('is-open');
-            overlay.classList.remove('is-visible');
-            body.classList.remove('menu-open');
-            hamburger.setAttribute('aria-expanded', 'false');
-            hamburger.setAttribute('aria-label', 'Open menu');
-        }
-
-        hamburger.addEventListener('click', function() {
-            if (navLinks.classList.contains('is-open')) {
-                closeMenu();
-            } else {
-                openMenu();
-            }
-        });
-
-        overlay.addEventListener('click', closeMenu);
-
-        navLinks.querySelectorAll('a').forEach(function(link) {
-            link.addEventListener('click', closeMenu);
-        });
-
-        document.addEventListener('keydown', function(e) {
-            if (e.key === 'Escape' && navLinks.classList.contains('is-open')) {
-                closeMenu();
-            }
-        });
-
-        window.addEventListener('resize', function() {
-            if (window.innerWidth > 900 && navLinks.classList.contains('is-open')) {
-                closeMenu();
-            }
-        });
-    })();
-    </script>
-<footer>
-        <div class="container">
-            <p>© 2026 felhom.eu – Your own cloud, your own rules. Felhom serves households in Hungary.</p>
-            <p class="footer-legal">Operated by Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Privacy notice (Hungarian)</a> · <a href="/feltetelek">Terms (Hungarian)</a></p>
-        </div>
-    </footer>
-    <script>
-    (function(){
-        var b=document.getElementById('navBurger'),s=document.getElementById('sidebar'),k=document.getElementById('navBackdrop');
-        if(!b||!s||!k)return;
-        function open(){s.classList.add('is-open');k.hidden=false;document.body.classList.add('nav-open');b.setAttribute('aria-expanded','true');}
-        function close(){s.classList.remove('is-open');k.hidden=true;document.body.classList.remove('nav-open');b.setAttribute('aria-expanded','false');}
-        b.addEventListener('click',function(){s.classList.contains('is-open')?close():open();});
-        k.addEventListener('click',close);
-        document.addEventListener('keydown',function(e){if(e.key==='Escape'&&s.classList.contains('is-open')){close();b.focus();}});
-        s.querySelectorAll('a').forEach(function(l){l.addEventListener('click',close);});
-        window.addEventListener('resize',function(){if(window.innerWidth>768)close();});
-    })();
-    document.addEventListener('click',function(e){
-        var btn=e.target.closest?e.target.closest('.nav-group-toggle'):null;
-        if(!btn)return;
-        var g=btn.closest('.nav-group');if(!g)return;
-        var willOpen=!g.classList.contains('is-open');
-        document.querySelectorAll('.nav-group.is-open').forEach(function(x){
-            x.classList.remove('is-open');
-            var t=x.querySelector('.nav-group-toggle');if(t)t.setAttribute('aria-expanded','false');
-        });
-        if(willOpen){g.classList.add('is-open');btn.setAttribute('aria-expanded','true');}
-    });
-    </script>
-</body>
-</html>
diff --git a/website/preview/m3/en/faq.html b/website/preview/m3/en/faq.html
deleted file mode 100644
index 3800ef28..00000000
--- a/website/preview/m3/en/faq.html
+++ /dev/null
@@ -1,1090 +0,0 @@
-<!DOCTYPE html>
-<html lang="en" class="no-js">
-<head>
-    <script>document.documentElement.className=document.documentElement.className.replace('no-js','js');</script>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>FAQ — frequently asked questions about the home server service | Felhom.eu</title>
-    <meta name="description" content="Answers to the most common questions: hardware, installation, apps, security, backups, costs. Everything worth knowing about our home server service in Hungary.">
-
-    <meta name="keywords" content="FAQ, frequently asked questions, home server questions, self-hosting FAQ, server costs, server security">
-    <meta name="robots" content="index, follow">
-    <link rel="canonical" href="https://felhom.eu/en/faq">
-    <link rel="alternate" hreflang="hu" href="https://felhom.eu/gyik">
-    <link rel="alternate" hreflang="en" href="https://felhom.eu/en/faq">
-    <link rel="alternate" hreflang="x-default" href="https://felhom.eu/gyik">
-
-    <meta property="og:type" content="website">
-    <meta property="og:url" content="https://felhom.eu/en/faq">
-    <meta property="og:title" content="FAQ — home server service questions and answers">
-    <meta property="og:description" content="Hardware, installation, apps, security, costs — everything worth knowing.">
-    <meta property="og:image" content="https://felhom.eu/assets/og-image-en.png">
-    <meta property="og:locale" content="en_GB">
-    <meta property="og:site_name" content="Felhom.eu">
-
-    <meta name="twitter:card" content="summary">
-    <meta name="twitter:title" content="FAQ — home server questions and answers">
-    <meta name="twitter:description" content="Everything worth knowing about the home server service.">
-    <meta name="twitter:image" content="https://felhom.eu/assets/og-image-en.png">
-
-    <script type="application/ld+json">
-    {
-      "@context": "https://schema.org",
-      "@type": "FAQPage",
-      "mainEntity": [
-        {
-          "@type": "Question",
-          "name": "What is Felhom.eu, and what exactly do you do?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "Felhom.eu is a service for households in Hungary that helps install and run a home server. We offer turnkey set-ups: we choose the hardware, set up the software, take care of the backups, and keep an eye on the system all the time. The aim is simple: instead of the big cloud providers (Google, Microsoft, Apple), you keep your data on a server in your own home – without having to be an expert yourself."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Who is this service for?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "Anyone who wants to take back control of their digital life. Typical customers: Families who want their photos and videos safe, and do not want to pay for cloud storage every month. Privacy-minded people who do not want Google or Microsoft to have access to their documents. Media fans who want their own Netflix- or Spotify-like system for their films and music. Small businesses that need document management, an internal wiki or appointment booking – under their own control."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Do I need any technical knowledge?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "No. We do the whole installation and set-up. Your part is to use the apps – in a browser or on your phone, just like a Google or Apple service. After the installation we walk you through it in a short session, so you can use the system with confidence."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "How is Felhom.eu different from a Synology or QNAP NAS?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "Synology and QNAP make NAS (network storage) devices built mainly for storing files, with their own closed software. We offer an open, Docker-based system instead, where the catalog's apps install in a few clicks – from a photo manager to a media server to a password manager. A NAS offers a limited choice of apps and depends on the maker's software updates. With us you choose from 58 apps, and if something is missing, we look at whether it can be added."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "What does the process look like, from start to finish?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "1. A first talk – We talk about what you need: which apps you would use, how much storage you want, and what your budget is. 2. Choosing the hardware – We help you find the right machine for your needs and your budget. 3. Installation and set-up – We install the operating system, the container engine and the apps, and set up the backups and the monitoring. 4. Handover and training – We show you how to use the system and answer all your questions. 5. Ongoing care – We watch the backups, maintain the system, and help if anything goes wrong."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "What machine do I need?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "For most homes a mini PC (for example with an Intel N100 processor and 16-32 GB of RAM) is perfectly fine. They are quiet, energy-saving (15-35 W) and compact – one fits on the shelf next to the router. If you want more storage (for a film library, say), you can add a NAS or external hard drives. More detailed set-ups are on the Technology page."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Can I use an old machine I already have?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "Often, yes! An older desktop PC can make an excellent server. In our first talk we check whether your machine suits what you plan (enough RAM, storage, reliability). Power use and noise matter – an old gaming PC will work, but each month it uses far more power than a modern mini PC."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Where should the server go?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "Anywhere with a power socket and a network cable (Ethernet). A cupboard, a shelf or the spot next to the router is best. Mini PCs are so compact and quiet that they fit on a living-room shelf. It can work over Wi-Fi, but for reliability and speed we always recommend a cable."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "How much power does a server like this use?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "A modern mini PC typically uses around 15-35 watts under load, which comes to roughly 5,000–15,000 Ft of electricity a year (depending on your tariff). That is less than a light bulb, and a fraction of what a year of a cloud subscription would cost."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "How loud is a server like this?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "Mini PCs are almost silent – many models have no fan at all, or one that only turns on now and then. In everyday use you can keep one on your desk or on a bedroom shelf. Tower and rack servers are a different story – those are better off in a cellar or a storeroom."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "What happens if the power goes off?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "During the installation we set the server's BIOS (where the option exists) to switch on by itself after a power cut. The operating system and all the apps then start on their own too. This setting is a standard part of every installation we do. After a power cut the box recovers by itself – we have tried this with a real power cut. If reliability is critical, we can also suggest an uninterruptible power supply (UPS) to bridge a few minutes without power."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "What internet connection do I need?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "For use at home (on your home network) any internet connection will do, because the apps run on your home network – not over the internet. How fast photos, films and documents load depends on your router and your cabling. If you also want to reach your server from elsewhere (from work or on holiday, say), the upload speed matters: at least 10 Mbps is recommended, and more is better."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Which apps can I run?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "We offer 58 apps – the full list is on the Apps page. A few examples: Immich – a Google Photos alternative that backs up photos and videos automatically. Jellyfin/Plex – your own Netflix for films and series. Nextcloud – store and share files (instead of Google Drive). Vaultwarden – a password manager for the whole family. Paperless-ngx – scan documents and make them searchable. If something is not on the list, ask – we will look at whether it can join the catalog."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Can I add new apps later?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "Yes, any time! Any app installs from the Dashboard in a few clicks. If you get stuck, tell us and we will help you set it up."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Can I reach the apps from my phone?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "Yes! Most apps work perfectly well in a phone's browser. Many also have their own mobile apps (for both iOS and Android). Immich, Nextcloud, Jellyfin and Vaultwarden, for example, all have excellent mobile apps."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Can several family members use it at the same time?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "Yes, but know the current limit. Most of the apps (Immich, Nextcloud, Vaultwarden) support several users: in them every family member can have their own account and their own sign-in. The Felhom Dashboard, though, has one shared household password today – there are no separate family accounts on the Dashboard yet. The Dashboard is where you install apps and manage backups; for everyday use (photos, files) you use the apps' own accounts."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Can I bring over my existing data (Google Photos, iCloud, Dropbox)?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "Yes! Most services let you export your data. With Google Takeout you can download all your photos, documents and calendar, and Immich, Nextcloud and others can import them. We help with the move. How long it takes depends on how much data there is – moving a few hundred GB of photos can take a day or two, but afterwards the system works just the way you are used to from the cloud service."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Can I reach my server when I am not at home?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "Yes! The box is reached through an encrypted tunnel, over HTTPS, with no extra app. That means you can reach your photos, files and all your apps from anywhere – from work, on holiday or even abroad – as if you were at home."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "How safe is a home server?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "The systems we install get several layers of protection: automatic HTTPS encryption, regular security updates, a sign-in for every app, and a family gate in front of some apps. Your server is inside your home – we open no port there, and from outside it is reached only through an encrypted tunnel. Most home servers do not face targeted attacks; what they meet is automated scripts trying their luck. The right configuration protects very well against those."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Can you get at my data?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "That is an important, fair question, and we answer it honestly. For support and maintenance we normally have remote access to your server – as any IT provider has to the systems it manages. We need it to check backups, install updates and fix faults. The key to your remote backup, though, only you know: the recovery code appears once, on your screen, and we keep no copy of it. So we cannot read the remote backup either. Important: unlike the big cloud providers, we do no algorithmic analysis of your data and no profiling for advertising, and your data leaves your home only encrypted (the remote backup)."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "What if someone breaks into my network?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "The server's apps run in isolated containers, which limits the damage if one app has a weakness. Regular updates, and having no open port at home, keep the risk down. An encrypted copy of your backups is also kept in a separate place (off-site) – so even after a ransomware attack, there is a copy stored far away."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Is this all right under the GDPR?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "For personal use at home the GDPR does not apply directly (under the \"household exemption\"). Your data lives at home, on your own box. The box encrypts the backup copies before they leave your home; they are stored at Hetzner in the EU (in Germany), and the storage provider cannot read them. Remote access goes through Cloudflare's network, so Cloudflare could technically see that traffic. If you use it as a small business, our privacy notice says who handles what, and where. We are not lawyers, of course: for a specific legal question, ask a professional."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "How are backups done?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "We follow the 3-2-1 backup rule: 3 copies of the data, on 2 different kinds of storage, 1 of them far away. It is an industry standard the largest companies use too. On the box this means three levels: a backup on the box, a second copy on a second drive, and an encrypted copy on remote storage. The backups run automatically, at night. Databases and files are backed up incrementally – only the changes are saved, which saves space and time. The details are on the Backups page."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "What happens if a hard drive fails?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "That is what backups are for! Your apps' data can be brought back from the copies on the second drive and on remote storage. The box watches the drives' health and the free space, and warns ahead of time if there is a problem."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "How do I know the backups really work?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "We run a central monitoring system that checks every day whether the backups ran successfully. If there is any problem – a failed backup, low storage, or the server not answering – we are notified at once, and so are you when it matters. This is not a \"set it up and hope it works\" arrangement – we watch it actively, and we also run restore tests from time to time."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "What is an \"off-site backup\"?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "An off-site (remote) backup means a copy of your data also exists in a physically different place. On a Felhom box that is storage we provide, where the copy goes encrypted. If disaster struck at home (fire, theft, flood), the remote copy would still be there. The off-site backup is always encrypted – nobody at the remote place can read your data, even if they can reach the files."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "What happens after the installation? Am I left on my own?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "No! Felhom.eu is not an \"install and leave\" service. We keep running it for you: monitoring, software updates, backup checks, and support whenever you have a question or a problem."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "How are software updates done?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "The apps run in containers, which makes updating easier. We follow new versions, and a new version reaches you only after we have tried it. The box's system gets its security updates by itself. Before every app update a fresh backup is made, and if the new version does not start properly, the box puts the previous one back by itself, with your data."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "How do I ask for help if something does not work?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "Just e-mail support@felhom.eu. We can solve most problems remotely, without you having to do anything. For bigger hardware issues we also help in person."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "What if I want to cancel the service?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "The server and all the data are yours – they always were. If you decide you no longer want the service, the box keeps working on your home network, but you no longer get updates, monitoring or support. Remote access and the remote backup are part of the service: what happens to them, we agree when you cancel. No minimum term, no cancellation fee. If you have the technical know-how (or have picked it up along the way), you can even keep running the system yourself. The data and the apps stay with you."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "What happens if Felhom.eu shuts down?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "Your server and your data are yours. Almost all the apps are open source, which means anyone else can run them – you do not depend on a single provider. That is one of the biggest advantages of open-source software: no vendor lock-in. By contrast, when Google or Apple shuts down a service, your data disappears along with it."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "What if I move house?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "Your server is a compact box – unplug it, take it to your new home, plug it in, and everything carries on. If your internet provider changes, the remote access set-up may need updating – we help with that."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "How much does it all cost?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "The cost has two parts: One-off costs: the hardware (80,000–400,000+ Ft, depending on the set-up) and the installation fee. You buy the hardware – it is yours, for good. A monthly management fee: for monitoring, support, updates and backup supervision. It depends on the package you choose. We give an exact quote after our first talk – needs vary a lot. Write to us and we will make you a personal offer!"
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Is it worth it compared with cloud services?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "In the long run, almost always. A typical example: Google One 2 TB is about 36,000 Ft a year, iCloud 2 TB about 45,000 Ft, Spotify Family about 30,000 Ft, a password manager about 15,000 Ft. Together that is 120,000+ Ft a year – and that is only a few services. A mini PC server \"pays for itself\" in 2-3 years, and after that you mostly pay for electricity. And your storage has no fixed cap – not 2 TB, but as much as your disks hold."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Are there hidden costs?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "No. The costs are: hardware (one-off), installation (one-off), monthly management (optional), and electricity (a few thousand forints a month). The apps are free to use, and almost all of them are open source – there is no licence fee for the apps. (A few have paid extras, such as Plex Pass; those are optional.) The remote backup's storage has a monthly cost that depends on how much data is backed up – we state it in the offer up front."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "What operating system runs on the server?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "The server's base is Proxmox VE – a professional, Debian-based virtualisation system the whole Felhom system is built on. Your apps run in Docker containers in a separate system environment installed on the Proxmox base. So the whole system environment can be backed up too, and restored from that backup."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "What is Proxmox, and why do you use it?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "Proxmox is a professional virtualisation base – the same kind of technology data centres and companies use. It is on every Felhom box, quietly in the background; you do not need to deal with it. It makes the most important safety features possible: A backup before each update – before an app is updated, a fresh backup is made, and if the new version does not start, the box puts the previous one back by itself. The whole system can be backed up and restored – not only your data: the whole box goes into a backup too. Clean separation – the control layer and your apps run apart, which makes the system more stable and safer."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "What is Docker / a container?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "A container is a \"box\" in which an app lives together with everything it depends on. Think of it as every app living in its own little flat – they do not disturb each other, they are easy to update or remove, and if one breaks, the others are not affected. There is more about this on the Technology page."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Can I use my own domain name?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "Yes! If you have your own domain name (for example myserver.hu), we can make your apps reachable through it (for example photos.myserver.hu, films.myserver.hu). If you do not have one, we help you get one – it costs a few thousand forints a year."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Can I add storage later?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "Yes! Adding a new hard drive or SSD is usually a simple upgrade. You can even add an external USB drive if your machine has no free bays left. The system is built to grow with your needs."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Can I use a VPN to reach the server?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "You do not need one: by default the box is reached from anywhere through an encrypted tunnel, over HTTPS, with no extra app. We do not set up household VPN access on the box today (where your phone or laptop connects as if it were at home). If you need that, ask us."
-          }
-        }
-      ]
-    }
-    </script>
-    <!-- shared assets: bump ?v= together on any site.css/icons.svg change -->
-    <link rel="stylesheet" href="/assets/site.css?v=21">
-    <link rel="stylesheet" href="/assets/shell.css?v=21">
-    <link rel="icon" type="image/png" href="/assets/logo_favicon_2.svg">
-    <script defer src="https://stats.felhom.eu/script.js" data-website-id="d419db57-5e1c-48df-bdb3-c29f25fb1661"></script>
-</head>
-<body class="shell page-gyik">
-    <header class="mobile-topbar">
-        <a href="/preview/m3/en/" class="mobile-topbar-logo"><img src="/assets/logo_notext_white.svg" alt="Felhom.eu"></a>
-        <button type="button" class="nav-burger" id="navBurger" aria-expanded="false" aria-controls="sidebar" aria-label="Menu">
-            <span class="hamburger-box"><span class="hamburger-line"></span><span class="hamburger-line"></span><span class="hamburger-line"></span></span>
-        </button>
-    </header>
-    <div class="nav-backdrop" id="navBackdrop" hidden></div>
-    <nav class="sidebar" id="sidebar">
-        <div class="sidebar-header">
-            <a href="/preview/m3/en/" class="sidebar-logo-link">
-                <img src="/assets/logo_notext_white.svg" alt="" class="sidebar-logo" aria-hidden="true">
-                <img src="/assets/logo-wordmark.png" alt="felhom.eu" class="sidebar-word">
-            </a>
-        </div>
-        <ul class="nav-links">
-                <li><a href="/preview/m3/en/"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg>Home</a></li>
-                <li><a href="/preview/m3/en/#services"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rocket"/></svg>Services</a></li>
-                <li class="nav-group">
-                    <button type="button" class="nav-group-toggle" aria-expanded="false" aria-controls="nav-group-apps"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg>Applications<svg class="ico nav-chevron" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chevron-down"/></svg></button>
-                    <ul id="nav-group-apps" class="nav-links nav-links-sub nav-links-nested">
-                        <li><a href="/preview/m3/en/apps">All applications</a></li>
-                        <li><a href="/preview/m3/en/apps#files-office">Files &amp; Office</a></li>
-                        <li><a href="/preview/m3/en/apps#media-entertainment">Media &amp; Entertainment</a></li>
-                        <li><a href="/preview/m3/en/apps#home-lifestyle">Home &amp; Lifestyle</a></li>
-                        <li><a href="/preview/m3/en/apps#productivity-knowledge">Productivity &amp; Knowledge</a></li>
-                        <li><a href="/preview/m3/en/apps#system-development">System &amp; Development</a></li>
-                    </ul>
-                </li>
-                <li><a href="/preview/m3/en/technology"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg>Technology</a></li>
-                <li><a href="/preview/m3/en/backups"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg>Backups</a></li>
-        </ul>
-        <div class="sidebar-bottom">
-            <a href="/preview/m3/en/testing" class="btn btn-outline sidebar-cta">Apply as a tester →</a>
-            <div class="nav-group-label">About Felhom</div>
-            <ul class="nav-links nav-links-sub">
-                    <li><a href="/preview/m3/en/#how-it-works">How it works</a></li>
-                    <li><a href="/preview/m3/en/faq" class="active">FAQ</a></li>
-                    <li><a href="/preview/m3/en/contact">Contact</a></li>
-            </ul>
-            <div class="sidebar-footer">
-                <details class="lang-globe"><summary class="lang-globe-btn" aria-label="Language" title="Language"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/preview/m3/gyik" lang="hu" hreflang="hu" class="lang-globe-item">Magyar</a></li><li><a href="/preview/m3/en/faq" lang="en" hreflang="en" class="lang-globe-item current" aria-current="true">English</a></li></ul></details>
-            </div>
-        </div>
-    </nav>
-<main class="content">
-                <div class="page-header">
-                <h1>Frequently asked <span>questions</span></h1>
-            </div>
-                <p class="page-lede">Everything worth knowing about our home server service – in one place, in plain words.</p>
-
-
-        <section class="content-section" style="padding-top: 0;">
-            <div class="container">
-
-                <!-- Table of Contents -->
-                <div class="faq-toc">
-                    <h3>Topics</h3>
-                    <ul class="faq-toc-links">
-                        <li><a href="#basics">The basics</a></li>
-                        <li><a href="#hardware">Hardware & Installation</a></li>
-                        <li><a href="#apps">Apps & Everyday use</a></li>
-                        <li><a href="#security">Security & Privacy</a></li>
-                        <li><a href="#backups">Backups & Data safety</a></li>
-                        <li><a href="#support">Running & Support</a></li>
-                        <li><a href="#costs">Costs</a></li>
-                        <li><a href="#technical">Technical questions</a></li>
-                    </ul>
-                </div>
-
-                <!-- ==================== ALAPKÉRDÉSEK ==================== -->
-                <div class="faq-category" id="basics">
-                    <div class="faq-category-header">
-                        <span class="faq-category-icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-lightbulb"/></svg></span>
-                        <h2>The basics</h2>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            What is Felhom.eu, and what exactly do you do?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>Felhom.eu is a service for households in Hungary that helps install and run a home server. We offer turnkey set-ups: we choose the hardware, set up the software, take care of the backups, and keep an eye on the system all the time.</p>
-                            <p>The aim is simple: instead of the big cloud providers (Google, Microsoft, Apple), you keep your data on a server in your own home – without having to be an expert yourself.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Who is this service for?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>Anyone who wants to take back control of their digital life. Typical customers:</p>
-                            <p><strong>Families</strong> who want their photos and videos safe, and do not want to pay for cloud storage every month.</p>
-                            <p><strong>Privacy-minded people</strong> who do not want Google or Microsoft to have access to their documents.</p>
-                            <p><strong>Media fans</strong> who want their own Netflix- or Spotify-like system for their films and music.</p>
-                            <p><strong>Small businesses</strong> that need document management, an internal wiki or appointment booking – under their own control.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Do I need any technical knowledge?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p><strong>No.</strong> We do the whole installation and set-up. Your part is to use the apps – in a browser or on your phone, just like a Google or Apple service.</p>
-                            <p>After the installation we walk you through it in a short session, so you can use the system with confidence.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            How is Felhom.eu different from a Synology or QNAP NAS?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>Synology and QNAP make NAS (network storage) devices built mainly for storing files, with their own closed software. We offer an open, Docker-based system instead, where the catalog's apps install in a few clicks – from a photo manager to a media server to a password manager.</p>
-                            <p>A NAS offers a limited choice of apps and depends on the maker's software updates. With us you choose from 58 apps, and if something is missing, we look at whether it can be added.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            What does the process look like, from start to finish?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p><strong>1. A first talk</strong> – We talk about what you need: which apps you would use, how much storage you want, and what your budget is.</p>
-                            <p><strong>2. Choosing the hardware</strong> – We help you find the right machine for your needs and your budget.</p>
-                            <p><strong>3. Installation and set-up</strong> – We install the operating system, the container engine and the apps, and set up the backups and the monitoring.</p>
-                            <p><strong>4. Handover and training</strong> – We show you how to use the system and answer all your questions.</p>
-                            <p><strong>5. Ongoing care</strong> – We watch the backups, maintain the system, and help if anything goes wrong.</p>
-                        </div></div>
-                    </div>
-                </div>
-
-                <!-- ==================== HARDVER & TELEPÍTÉS ==================== -->
-                <div class="faq-category" id="hardware">
-                    <div class="faq-category-header">
-                        <span class="faq-category-icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-monitor"/></svg></span>
-                        <h2>Hardware & Installation</h2>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            What machine do I need?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>For most homes a <strong>mini PC</strong> (for example with an Intel N100 processor and 16-32 GB of RAM) is perfectly fine. They are quiet, energy-saving (15-35 W) and compact – one fits on the shelf next to the router.</p>
-                            <p>If you want more storage (for a film library, say), you can add a NAS or external hard drives. More detailed set-ups are on the <a href="/en/technology#hardware">Technology</a> page.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Can I use an old machine I already have?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>Often, yes! An older desktop PC can make an excellent server. In our first talk we check whether your machine suits what you plan (enough RAM, storage, reliability).</p>
-                            <p><strong>Power use</strong> and <strong>noise</strong> matter – an old gaming PC will work, but each month it uses far more power than a modern mini PC.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Where should the server go?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>Anywhere with a <strong>power socket</strong> and a <strong>network cable</strong> (Ethernet). A cupboard, a shelf or the spot next to the router is best. Mini PCs are so compact and quiet that they fit on a living-room shelf.</p>
-                            <p>It can work over Wi-Fi, but for reliability and speed we always recommend a cable.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            How much power does a server like this use?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>A modern mini PC typically uses around <strong>15-35 watts</strong> under load, which comes to roughly <strong>5,000–15,000 Ft</strong> of electricity a year (depending on your tariff). That is less than a light bulb, and a fraction of what a year of a cloud subscription would cost.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            How loud is a server like this?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>Mini PCs are almost silent – many models have no fan at all, or one that only turns on now and then. In everyday use you can keep one on your desk or on a bedroom shelf.</p>
-                            <p>Tower and rack servers are a different story – those are better off in a cellar or a storeroom.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            What happens if the power goes off?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>During the installation we set the server's BIOS (where the option exists) to switch on by itself after a power cut. The operating system and all the apps then start on their own too. This setting is a standard part of every installation we do.</p>
-                            <p>After a power cut the box recovers by itself – we have tried this with a real power cut. If reliability is critical, we can also suggest an uninterruptible power supply (UPS) to bridge a few minutes without power.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            What internet connection do I need?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>For use at home (on your home network) any internet connection will do, because the apps run on your home network – not over the internet. How fast photos, films and documents load depends on your router and your cabling.</p>
-                            <p>If you <strong>also want to reach</strong> your server from elsewhere (from work or on holiday, say), the upload speed matters: at least 10 Mbps is recommended, and more is better.</p>
-                        </div></div>
-                    </div>
-                </div>
-
-                <!-- ==================== ALKALMAZÁSOK & HASZNÁLAT ==================== -->
-                <div class="faq-category" id="apps">
-                    <div class="faq-category-header">
-                        <span class="faq-category-icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-smartphone"/></svg></span>
-                        <h2>Apps & Everyday use</h2>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Which apps can I run?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>We offer <strong>58 apps</strong> – the full list is on the <a href="/en/apps">Apps</a> page. A few examples:</p>
-                            <p><strong>Immich</strong> – a Google Photos alternative that backs up photos and videos automatically. <strong>Jellyfin/Plex</strong> – your own Netflix for films and series. <strong>Nextcloud</strong> – store and share files (instead of Google Drive). <strong>Vaultwarden</strong> – a password manager for the whole family. <strong>Paperless-ngx</strong> – scan documents and make them searchable.</p>
-                            <p>If something is not on the list, ask – we will look at whether it can join the catalog.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Can I add new apps later?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p><strong>Yes, any time!</strong> Any app installs from the Dashboard in a few clicks. If you get stuck, tell us and we will help you set it up.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Can I reach the apps from my phone?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>Yes! Most apps work perfectly well in a phone's browser. Many also have their own mobile apps (for both iOS and Android). Immich, Nextcloud, Jellyfin and Vaultwarden, for example, all have excellent mobile apps.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Can several family members use it at the same time?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p><strong>Yes, but know the current limit.</strong> Most of the apps (Immich, Nextcloud, Vaultwarden) support several users: in them every family member can have their own account and their own sign-in. The Felhom <strong>Dashboard</strong>, though, has <strong>one shared household password</strong> today – there are no separate family accounts on the Dashboard yet. The Dashboard is where you install apps and manage backups; for everyday use (photos, files) you use the apps' own accounts.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Can I bring over my existing data (Google Photos, iCloud, Dropbox)?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>Yes! Most services let you export your data. With Google Takeout you can download all your photos, documents and calendar, and Immich, Nextcloud and others can import them. We help with the move.</p>
-                            <p>How long it takes depends on how much data there is – moving a few hundred GB of photos can take a day or two, but afterwards the system works just the way you are used to from the cloud service.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Can I reach my server when I am not at home?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>Yes! The box is reached through an encrypted tunnel, over HTTPS, with no extra app. That means you can reach your photos, files and all your apps from anywhere – from work, on holiday or even abroad – as if you were at home.</p>
-                        </div></div>
-                    </div>
-                </div>
-
-                <!-- ==================== BIZTONSÁG & ADATVÉDELEM ==================== -->
-                <div class="faq-category" id="security">
-                    <div class="faq-category-header">
-                        <span class="faq-category-icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-lock"/></svg></span>
-                        <h2>Security & Privacy</h2>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            How safe is a home server?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>The systems we install get several layers of protection: automatic HTTPS encryption, regular security updates, a sign-in for every app, and a family gate in front of some apps. Your server is inside your home – we open no port there, and from outside it is reached only through an encrypted tunnel.</p>
-                            <p>Most home servers do not face targeted attacks; what they meet is automated scripts trying their luck. The right configuration protects very well against those.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Can you get at my data?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>That is an important, fair question, and we answer it honestly.</p>
-                            <p>For support and maintenance we normally have remote access to your server – as any IT provider has to the systems it manages. We need it to check backups, install updates and fix faults.</p>
-                            <p>The key to your remote backup, though, <strong>only you know</strong>: the recovery code appears once, on your screen, and we keep no copy of it. So we cannot read the remote backup either.</p>
-                            <p>Important: unlike the big cloud providers, we do <strong>no algorithmic analysis of your data</strong> and no profiling for advertising, and your data leaves your home only encrypted (the remote backup).</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            What if someone breaks into my network?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>The server's apps run in isolated containers, which limits the damage if one app has a weakness. Regular updates, and having no open port at home, keep the risk down.</p>
-                            <p>An encrypted copy of your backups is also kept in a separate place (off-site) – so even after a ransomware attack, there is a copy stored far away.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Is this all right under the GDPR?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>For personal use at home the GDPR does not apply directly (under the "household exemption"). Your data lives at home, on your own box. The box encrypts the backup copies before they leave your home; they are stored at Hetzner in the EU (in Germany), and the storage provider cannot read them. Remote access goes through Cloudflare's network, so Cloudflare could technically see that traffic. If you use it as a small business, our privacy notice says who handles what, and where. We are not lawyers, of course: for a specific legal question, ask a professional.</p>
-                        </div></div>
-                    </div>
-                </div>
-
-                <!-- ==================== MENTÉSEK & ADATBIZTONSÁG ==================== -->
-                <div class="faq-category" id="backups">
-                    <div class="faq-category-header">
-                        <span class="faq-category-icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-hard-drive"/></svg></span>
-                        <h2>Backups & Data safety</h2>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            How are backups done?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>We follow the <strong>3-2-1 backup rule</strong>: 3 copies of the data, on 2 different kinds of storage, 1 of them far away. It is an industry standard the largest companies use too. On the box this means three levels: a backup on the box, a second copy on a second drive, and an encrypted copy on remote storage.</p>
-                            <p>The backups run <strong>automatically</strong>, at night. Databases and files are backed up incrementally – only the changes are saved, which saves space and time. The details are on the <a href="/en/backups">Backups</a> page.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            What happens if a hard drive fails?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>That is what backups are for! Your apps' data can be brought back from the copies on the second drive and on remote storage. The box watches the drives' health and the free space, and warns ahead of time if there is a problem.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            How do I know the backups really work?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>We run a central monitoring system that checks <strong>every day</strong> whether the backups ran successfully. If there is any problem – a failed backup, low storage, or the server not answering – we are notified at once, and so are you when it matters.</p>
-                            <p>This is not a "set it up and hope it works" arrangement – we watch it actively, and we also run restore tests from time to time.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            What is an "off-site backup"?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>An off-site (remote) backup means a copy of your data also exists in a physically different place. On a Felhom box that is storage we provide, where the copy goes encrypted. If disaster struck at home (fire, theft, flood), the remote copy would still be there.</p>
-                            <p>The off-site backup is always <strong>encrypted</strong> – nobody at the remote place can read your data, even if they can reach the files.</p>
-                        </div></div>
-                    </div>
-                </div>
-
-                <!-- ==================== ÜZEMELTETÉS & TÁMOGATÁS ==================== -->
-                <div class="faq-category" id="support">
-                    <div class="faq-category-header">
-                        <span class="faq-category-icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-wrench"/></svg></span>
-                        <h2>Running & Support</h2>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            What happens after the installation? Am I left on my own?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p><strong>No!</strong> Felhom.eu is not an "install and leave" service. We keep running it for you: monitoring, software updates, backup checks, and support whenever you have a question or a problem.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            How are software updates done?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>The apps run in containers, which makes updating easier. We follow new versions, and a new version reaches you only after we have tried it. The box's system gets its security updates by itself.</p>
-                            <p>Before every app update a fresh backup is made, and if the new version does not start properly, the box puts the previous one back by itself, with your data.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            How do I ask for help if something does not work?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>Just e-mail <strong>support@felhom.eu</strong>. We can solve most problems remotely, without you having to do anything. For bigger hardware issues we also help in person.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            What if I want to cancel the service?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>The server and all the data are yours – they always were. If you decide you no longer want the service, the box keeps working on your home network, but you no longer get updates, monitoring or support. Remote access and the remote backup are part of the service: what happens to them, we agree when you cancel.</p>
-                            <p>No minimum term, no cancellation fee. If you have the technical know-how (or have picked it up along the way), you can even keep running the system yourself. The data and the apps stay with you.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            What happens if Felhom.eu shuts down?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>Your server and your data are yours. Almost all the apps are open source, which means anyone else can run them – you do not depend on a single provider. That is one of the biggest advantages of open-source software: <strong>no vendor lock-in</strong>.</p>
-                            <p>By contrast, when Google or Apple shuts down a service, your data disappears along with it.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            What if I move house?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>Your server is a compact box – unplug it, take it to your new home, plug it in, and everything carries on. If your internet provider changes, the remote access set-up may need updating – we help with that.</p>
-                        </div></div>
-                    </div>
-                </div>
-
-                <!-- ==================== KÖLTSÉGEK ==================== -->
-                <div class="faq-category" id="costs">
-                    <div class="faq-category-header">
-                        <span class="faq-category-icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-coins"/></svg></span>
-                        <h2>Costs</h2>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            How much does it all cost?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>The cost has two parts:</p>
-                            <p><strong>One-off costs:</strong> the hardware (80,000–400,000+ Ft, depending on the set-up) and the installation fee. You buy the hardware – it is yours, for good.</p>
-                            <p><strong>A monthly management fee:</strong> for monitoring, support, updates and backup supervision. It depends on the package you choose.</p>
-                            <p>We give an exact quote after our first talk – needs vary a lot. Write to us and we will make you a personal offer!</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Is it worth it compared with cloud services?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>In the long run, <strong>almost always</strong>. A typical example: Google One 2 TB is about 36,000 Ft a year, iCloud 2 TB about 45,000 Ft, Spotify Family about 30,000 Ft, a password manager about 15,000 Ft. Together that is 120,000+ Ft a year – and that is only a few services.</p>
-                            <p>A mini PC server "pays for itself" in 2-3 years, and after that you mostly pay for electricity. And your storage has no fixed cap – not 2 TB, but as much as your disks hold.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Are there hidden costs?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>No. The costs are: hardware (one-off), installation (one-off), monthly management (optional), and electricity (a few thousand forints a month). The apps are free to use, and almost all of them are <strong>open source</strong> – there is no licence fee for the apps. (A few have paid extras, such as Plex Pass; those are optional.)</p>
-                            <p>The remote backup's storage has a monthly cost that depends on how much data is backed up – we state it in the offer up front.</p>
-                        </div></div>
-                    </div>
-                </div>
-
-                <!-- ==================== TECHNIKAI KÉRDÉSEK ==================== -->
-                <div class="faq-category" id="technical">
-                    <div class="faq-category-header">
-                        <span class="faq-category-icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-settings"/></svg></span>
-                        <h2>Technical questions</h2>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            What operating system runs on the server?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>The server's base is <strong>Proxmox VE</strong> – a professional, Debian-based virtualisation system the whole Felhom system is built on. Your apps run in Docker containers in a separate system environment installed on the Proxmox base. So the whole system environment can be backed up too, and restored from that backup.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            What is Proxmox, and why do you use it?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>Proxmox is a professional virtualisation base – the same kind of technology data centres and companies use. It is on every Felhom box, quietly in the background; you do not need to deal with it. It makes the most important safety features possible:</p>
-                            <p><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield"/></svg> <strong>A backup before each update</strong> – before an app is updated, a fresh backup is made, and if the new version does not start, the box puts the previous one back by itself.</p>
-                            <p><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-hard-drive"/></svg> <strong>The whole system can be backed up and restored</strong> – not only your data: the whole box goes into a backup too.</p>
-                            <p><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg> <strong>Clean separation</strong> – the control layer and your apps run apart, which makes the system more stable and safer.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            What is Docker / a container?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>A container is a "box" in which an app lives together with everything it depends on. Think of it as every app living in its own little flat – they do not disturb each other, they are easy to update or remove, and if one breaks, the others are not affected.</p>
-                            <p>There is more about this on the <a href="/en/technology#containers">Technology</a> page.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Can I use my own domain name?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>Yes! If you have your own domain name (for example <em>myserver.hu</em>), we can make your apps reachable through it (for example <em>photos.myserver.hu</em>, <em>films.myserver.hu</em>). If you do not have one, we help you get one – it costs a few thousand forints a year.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Can I add storage later?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p><strong>Yes!</strong> Adding a new hard drive or SSD is usually a simple upgrade. You can even add an external USB drive if your machine has no free bays left. The system is built to grow with your needs.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Can I use a VPN to reach the server?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>You do not need one: by default the box is reached from anywhere through an encrypted tunnel, over HTTPS, with no extra app.</p>
-                            <p>We do not set up household VPN access on the box today (where your phone or laptop connects as if it were at home). If you need that, ask us.</p>
-                        </div></div>
-                    </div>
-                </div>
-            </div>
-        </section>
-
-        <!-- CTA -->
-        <section class="cta-section alt-bg">
-            <div class="container">
-                <h2>Didn't find <span>your answer?</span></h2>
-                <p>Just write to us – we are happy to answer any question.</p>
-                <a href="/en/contact" class="cta-button">Get in touch →</a>
-            </div>
-        </section>
-    </main>
-
-    <script>
-        // FAQ Accordion
-        document.querySelectorAll('.faq-question').forEach(button => {
-            button.addEventListener('click', () => {
-                const item = button.parentElement;
-                const wasOpen = item.classList.contains('open');
-                
-                // Close all items in the same category
-                item.closest('.faq-category').querySelectorAll('.faq-item.open').forEach(openItem => {
-                    openItem.classList.remove('open');
-                });
-                
-                // Toggle current item
-                if (!wasOpen) {
-                    item.classList.add('open');
-                }
-            });
-        });
-
-        // Open FAQ from URL hash (e.g., /en/faq#backups)
-        if (window.location.hash) {
-            const target = document.querySelector(window.location.hash);
-            if (target) {
-                setTimeout(() => {
-                    target.scrollIntoView({ behavior: 'smooth', block: 'start' });
-                }, 100);
-            }
-        }
-    </script>
-    <script>
-    (function() {
-        var hamburger = document.getElementById('hamburger');
-        var navLinks = document.querySelector('.nav-links');
-        var overlay = document.getElementById('mobileOverlay');
-        var body = document.body;
-
-        if (!hamburger || !navLinks || !overlay) {
-            console.warn('[mobile-menu] Missing elements:', {
-                hamburger: !!hamburger,
-                navLinks: !!navLinks,
-                overlay: !!overlay
-            });
-            return;
-        }
-
-        function openMenu() {
-            hamburger.classList.add('is-active');
-            navLinks.classList.add('is-open');
-            overlay.classList.add('is-visible');
-            body.classList.add('menu-open');
-            hamburger.setAttribute('aria-expanded', 'true');
-            hamburger.setAttribute('aria-label', 'Close menu');
-        }
-
-        function closeMenu() {
-            hamburger.classList.remove('is-active');
-            navLinks.classList.remove('is-open');
-            overlay.classList.remove('is-visible');
-            body.classList.remove('menu-open');
-            hamburger.setAttribute('aria-expanded', 'false');
-            hamburger.setAttribute('aria-label', 'Open menu');
-        }
-
-        hamburger.addEventListener('click', function() {
-            if (navLinks.classList.contains('is-open')) {
-                closeMenu();
-            } else {
-                openMenu();
-            }
-        });
-
-        overlay.addEventListener('click', closeMenu);
-
-        navLinks.querySelectorAll('a').forEach(function(link) {
-            link.addEventListener('click', closeMenu);
-        });
-
-        document.addEventListener('keydown', function(e) {
-            if (e.key === 'Escape' && navLinks.classList.contains('is-open')) {
-                closeMenu();
-            }
-        });
-
-        window.addEventListener('resize', function() {
-            if (window.innerWidth > 900 && navLinks.classList.contains('is-open')) {
-                closeMenu();
-            }
-        });
-    })();
-    </script>
-<footer>
-        <div class="container">
-            <p>© 2026 felhom.eu – Your own cloud, your own rules. Felhom serves households in Hungary.</p>
-            <p class="footer-legal">Operated by Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Privacy notice (Hungarian)</a> · <a href="/feltetelek">Terms (Hungarian)</a></p>
-        </div>
-    </footer>
-    <script>
-    (function(){
-        var b=document.getElementById('navBurger'),s=document.getElementById('sidebar'),k=document.getElementById('navBackdrop');
-        if(!b||!s||!k)return;
-        function open(){s.classList.add('is-open');k.hidden=false;document.body.classList.add('nav-open');b.setAttribute('aria-expanded','true');}
-        function close(){s.classList.remove('is-open');k.hidden=true;document.body.classList.remove('nav-open');b.setAttribute('aria-expanded','false');}
-        b.addEventListener('click',function(){s.classList.contains('is-open')?close():open();});
-        k.addEventListener('click',close);
-        document.addEventListener('keydown',function(e){if(e.key==='Escape'&&s.classList.contains('is-open')){close();b.focus();}});
-        s.querySelectorAll('a').forEach(function(l){l.addEventListener('click',close);});
-        window.addEventListener('resize',function(){if(window.innerWidth>768)close();});
-    })();
-    document.addEventListener('click',function(e){
-        var btn=e.target.closest?e.target.closest('.nav-group-toggle'):null;
-        if(!btn)return;
-        var g=btn.closest('.nav-group');if(!g)return;
-        var willOpen=!g.classList.contains('is-open');
-        document.querySelectorAll('.nav-group.is-open').forEach(function(x){
-            x.classList.remove('is-open');
-            var t=x.querySelector('.nav-group-toggle');if(t)t.setAttribute('aria-expanded','false');
-        });
-        if(willOpen){g.classList.add('is-open');btn.setAttribute('aria-expanded','true');}
-    });
-    </script>
-</body>
-</html>
diff --git a/website/preview/m3/en/index.html b/website/preview/m3/en/index.html
deleted file mode 100644
index 65a32a7d..00000000
--- a/website/preview/m3/en/index.html
+++ /dev/null
@@ -1,371 +0,0 @@
-<!DOCTYPE html>
-<html lang="en" class="no-js">
-<head>
-    <script>document.documentElement.className=document.documentElement.className.replace('no-js','js');</script>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-
-    <meta name="description" content="A home server in your own home in Hungary: photos, documents, media. 58 apps to install, automatic backups on three levels, a dashboard in English or Hungarian. A closed test is starting now.">
-    <title>Felhom.eu — Your own cloud, your own rules | A home server service in Hungary</title>
-
-    <!-- SEO meta -->
-    <meta name="keywords" content="home server, own cloud, self-hosting, Google Drive alternative, iCloud alternative, privacy, open source, server installation, server management, Nextcloud, Immich, Hungary">
-    <meta name="author" content="Felhom.eu">
-    <meta name="robots" content="index, follow">
-    <link rel="canonical" href="https://felhom.eu/en/">
-    <link rel="alternate" hreflang="hu" href="https://felhom.eu/">
-    <link rel="alternate" hreflang="en" href="https://felhom.eu/en/">
-    <link rel="alternate" hreflang="x-default" href="https://felhom.eu/">
-
-    <!-- Open Graph (Facebook, LinkedIn) -->
-    <meta property="og:type" content="website">
-    <meta property="og:url" content="https://felhom.eu/en/">
-    <meta property="og:title" content="Felhom.eu — Your own cloud, your own rules">
-    <meta property="og:description" content="A home server in your own home in Hungary: photos, documents, media — with automatic backups and a recovery code only you know. A closed test is starting now.">
-    <meta property="og:image" content="https://felhom.eu/assets/og-image-en.png">
-    <meta property="og:image:width" content="1200">
-    <meta property="og:image:height" content="630">
-    <meta property="og:image:alt" content="Felhom.eu — Your own cloud, your own rules. Closed test starting.">
-    <meta property="og:locale" content="en_GB">
-    <meta property="og:site_name" content="Felhom.eu">
-
-    <!-- Twitter/X Card -->
-    <meta name="twitter:card" content="summary_large_image">
-    <meta name="twitter:title" content="Felhom.eu — Your own cloud, your own rules">
-    <meta name="twitter:description" content="A home server in your own home in Hungary: photos, documents, media — with automatic backups and a recovery code only you know.">
-    <meta name="twitter:image" content="https://felhom.eu/assets/og-image-en.png">
-
-    <!-- Structured Data (JSON-LD) -->
-    <script type="application/ld+json">
-    {
-      "@context": "https://schema.org",
-      "@type": "LocalBusiness",
-      "name": "Felhom.eu",
-      "description": "Professional home server installation and management in Hungary.",
-      "url": "https://felhom.eu",
-      "logo": "https://felhom.eu/assets/logo.png",
-      "email": "info@felhom.eu",
-      "areaServed": {
-        "@type": "Country",
-        "name": "Hungary"
-      },
-      "serviceType": ["Server installation", "Server management", "Self-hosting"],
-      "knowsLanguage": ["hu", "en"],
-      "sameAs": []
-    }
-    </script>
-    <!-- shared assets: bump ?v= together on any site.css/icons.svg change -->
-    <link rel="stylesheet" href="/assets/site.css?v=21">
-    <link rel="stylesheet" href="/assets/shell.css?v=21">
-    <link rel="icon" type="image/png" href="/assets/logo_favicon_2.svg">
-    <script defer src="/assets/gallery.js?v=2"></script>
-    <script defer src="https://stats.felhom.eu/script.js" data-website-id="d419db57-5e1c-48df-bdb3-c29f25fb1661"></script>
-</head>
-<body class="shell page-index">
-    <header class="mobile-topbar">
-        <a href="/preview/m3/en/" class="mobile-topbar-logo"><img src="/assets/logo_notext_white.svg" alt="Felhom.eu"></a>
-        <button type="button" class="nav-burger" id="navBurger" aria-expanded="false" aria-controls="sidebar" aria-label="Menu">
-            <span class="hamburger-box"><span class="hamburger-line"></span><span class="hamburger-line"></span><span class="hamburger-line"></span></span>
-        </button>
-    </header>
-    <div class="nav-backdrop" id="navBackdrop" hidden></div>
-    <nav class="sidebar" id="sidebar">
-        <div class="sidebar-header">
-            <a href="/preview/m3/en/" class="sidebar-logo-link">
-                <img src="/assets/logo_notext_white.svg" alt="" class="sidebar-logo" aria-hidden="true">
-                <img src="/assets/logo-wordmark.png" alt="felhom.eu" class="sidebar-word">
-            </a>
-        </div>
-        <ul class="nav-links">
-                <li><a href="/preview/m3/en/" class="active"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg>Home</a></li>
-                <li><a href="/preview/m3/en/#services"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rocket"/></svg>Services</a></li>
-                <li class="nav-group">
-                    <button type="button" class="nav-group-toggle" aria-expanded="false" aria-controls="nav-group-apps"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg>Applications<svg class="ico nav-chevron" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chevron-down"/></svg></button>
-                    <ul id="nav-group-apps" class="nav-links nav-links-sub nav-links-nested">
-                        <li><a href="/preview/m3/en/apps">All applications</a></li>
-                        <li><a href="/preview/m3/en/apps#files-office">Files &amp; Office</a></li>
-                        <li><a href="/preview/m3/en/apps#media-entertainment">Media &amp; Entertainment</a></li>
-                        <li><a href="/preview/m3/en/apps#home-lifestyle">Home &amp; Lifestyle</a></li>
-                        <li><a href="/preview/m3/en/apps#productivity-knowledge">Productivity &amp; Knowledge</a></li>
-                        <li><a href="/preview/m3/en/apps#system-development">System &amp; Development</a></li>
-                    </ul>
-                </li>
-                <li><a href="/preview/m3/en/technology"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg>Technology</a></li>
-                <li><a href="/preview/m3/en/backups"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg>Backups</a></li>
-        </ul>
-        <div class="sidebar-bottom">
-            <a href="/preview/m3/en/testing" class="btn btn-outline sidebar-cta">Apply as a tester →</a>
-            <div class="nav-group-label">About Felhom</div>
-            <ul class="nav-links nav-links-sub">
-                    <li><a href="/preview/m3/en/#how-it-works">How it works</a></li>
-                    <li><a href="/preview/m3/en/faq">FAQ</a></li>
-                    <li><a href="/preview/m3/en/contact">Contact</a></li>
-            </ul>
-            <div class="sidebar-footer">
-                <details class="lang-globe"><summary class="lang-globe-btn" aria-label="Language" title="Language"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/preview/m3/" lang="hu" hreflang="hu" class="lang-globe-item">Magyar</a></li><li><a href="/preview/m3/en/" lang="en" hreflang="en" class="lang-globe-item current" aria-current="true">English</a></li></ul></details>
-            </div>
-        </div>
-    </nav>
-    <main class="content">
-        <div class="page-header">
-            <h1>Your own cloud, your own rules</h1>
-            <span class="domain-badge">Home server service</span>
-        </div>
-
-        <section class="hero-row">
-            <div class="hero-copy">
-                <p class="hero-lede">A small machine in your home: your photos, your documents, your films. A backup is made every night. We watch it, you use it.</p>
-                <a href="/preview/m3/en/testing" class="btn btn-primary btn-lg">Apply as a tester →</a>
-            </div>
-                <div class="hero-window" aria-label="A picture of the Dashboard">
-                    <div class="hero-window-bar">
-                        <span class="hw-dot"></span><span class="hw-dot"></span><span class="hw-dot"></span>
-                        <span class="hero-window-title">yourhome.hu <span class="sample">sample</span></span>
-                    </div>
-                    <div class="hero-window-body">
-                        <p class="hero-window-lede">This is what the box's Dashboard looks like.</p>
-                        <div class="launch-grid launch-grid--mini">
-                        <a class="launch-cell" href="/preview/m3/en/apps#immich">
-                            <span class="launch-tile" style="background: hsl(18, 45%, 38%)"><span class="launch-mono">I</span><img class="launch-logo" src="/assets/immich-logo.svg" alt="" loading="lazy"></span>
-                            <span class="launch-name">Immich</span>
-                        </a>
-                        <a class="launch-cell" href="/preview/m3/en/apps#jellyfin">
-                            <span class="launch-tile" style="background: hsl(348, 45%, 38%)"><span class="launch-mono">J</span><img class="launch-logo" src="/assets/jellyfin-logo.svg" alt="" loading="lazy"></span>
-                            <span class="launch-name">Jellyfin</span>
-                        </a>
-                        <a class="launch-cell" href="/preview/m3/en/apps#nextcloud">
-                            <span class="launch-tile" style="background: hsl(201, 45%, 38%)"><span class="launch-mono">N</span><img class="launch-logo" src="/assets/nextcloud-logo.svg" alt="" loading="lazy"></span>
-                            <span class="launch-name">Nextcloud</span>
-                        </a>
-                        <a class="launch-cell" href="/preview/m3/en/apps#vaultwarden">
-                            <span class="launch-tile" style="background: hsl(66, 45%, 38%)"><span class="launch-mono">V</span><img class="launch-logo" src="/assets/vaultwarden-logo.svg" alt="" loading="lazy"></span>
-                            <span class="launch-name">Vaultwarden</span>
-                        </a>
-                        </div>
-                    </div>
-                </div>
-        </section>
-
-        <section class="shell-section" id="services">
-            <div class="sec-head">
-                <h2>What the box does today</h2>
-                <p>Not a plan, not a promise — these work today on a live Felhom box</p>
-            </div>
-            <div class="caps">
-                <div class="caps-group">
-                    <h3>What you use every day</h3>
-                    <ul class="caps-list">
-                        <li class="caps-item">
-                            <h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-camera"/></svg> Photos, documents, media</h4>
-                            <p>Your phone's photos upload to your own machine on their own. Your scanned papers are read and made searchable. Your films and music play in the browser and in mobile apps.</p>
-                        </li>
-                        <li class="caps-item">
-                            <h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-folder"/></svg> Network shares</h4>
-                            <p>The box's folders appear in Windows File Explorer and the Mac Finder — you drag files onto them like onto any other folder. Each share can be set to read-only.</p>
-                        </li>
-                        <li class="caps-item">
-                            <h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg> 58 apps to install</h4>
-                            <p>You install them from the Dashboard in a few clicks — no command line. Almost all of them are open source (the exceptions are marked on the apps page), and every one runs on your machine.</p>
-                        </li>
-                        <li class="caps-item">
-                            <h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg> In English or Hungarian</h4>
-                            <p>The Dashboard works in English and in Hungarian. The household picks the language, and the e-mails about the box follow it.</p>
-                        </li>
-                    </ul>
-                </div>
-                <div class="caps-group">
-                    <h3>What protects you in the background</h3>
-                    <ul class="caps-list">
-                        <li class="caps-item">
-                            <h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg> Automatic backups on three levels</h4>
-                            <p>Every night the box makes a backup on the box, a second copy on a second drive (if there is one), and an encrypted copy on remote storage. Your shared folders are in the second-drive copy and in the remote copy too.</p>
-                        </li>
-                        <li class="caps-item">
-                            <h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-lock"/></svg> A recovery code only you know</h4>
-                            <p>The key to your remote backup's encryption is a recovery code that appears exactly once — on your screen. We do not know it and cannot recreate it. That also means that without the code, we cannot read the remote backup either: keep it somewhere safe.</p>
-                        </li>
-                        <li class="caps-item">
-                            <h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rotate-cw"/></svg> Restore when something goes wrong</h4>
-                            <p>A deleted file can be brought back from the backup. If the box itself breaks, your apps' data can be brought back from the encrypted remote backup onto the reinstalled system — with the recovery code.</p>
-                        </li>
-                        <li class="caps-item">
-                            <h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg> Works when the internet is down</h4>
-                            <p>The box is in your home. If the internet goes down, you still reach your photos and files on your home network — they do not depend on a faraway provider's permission.</p>
-                        </li>
-                    </ul>
-                </div>
-                <div class="caps-group">
-                    <h3>What we take care of</h3>
-                    <ul class="caps-list">
-                        <li class="caps-item">
-                            <h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-stethoscope"/></svg> Remote monitoring, automatic updates</h4>
-                            <p>We watch how the box is doing. The Dashboard updates itself to the latest release, and the box's system gets its security updates too — you do not have to do anything. If something breaks, we see it.</p>
-                        </li>
-                        <li class="caps-item">
-                            <h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rotate-cw"/></svg> Careful app updates</h4>
-                            <p>A new version of an app reaches you only after we have tried it. Before the update the box makes a fresh backup, and if the new version does not start properly, the box puts the previous one back by itself, with your data.</p>
-                        </li>
-                    </ul>
-                </div>
-            </div>
-        </section>
-
-        <section class="shell-section" id="dashboard">
-            <div class="sec-head">
-                <h2>What the Dashboard looks like</h2>
-                <p>Real pictures from a Felhom box — click one for the full size</p>
-            </div>
-            <div class="dash-grid">
-                <figure class="dash-shot">
-                    <a href="/assets/dashboard-start-en.webp" data-gallery="dashboard"><img src="/assets/dashboard-start-en.webp" alt="The Dashboard's Launcher: tiles of the apps installed at home" width="1440" height="900" loading="lazy"></a>
-                    <figcaption><strong>Launcher</strong> — every app you have, one click away.</figcaption>
-                </figure>
-                <figure class="dash-shot">
-                    <a href="/assets/dashboard-apps-en.webp" data-gallery="dashboard"><img src="/assets/dashboard-apps-en.webp" alt="The Apps page: cards of installed and installable apps, with their status" width="1440" height="900" loading="lazy"></a>
-                    <figcaption><strong>Apps</strong> — install in a few clicks, and see what runs and what is up to date.</figcaption>
-                </figure>
-                <figure class="dash-shot">
-                    <a href="/assets/dashboard-app-en.webp" data-gallery="dashboard"><img src="/assets/dashboard-app-en.webp" alt="An app's own page: what it is for, pictures, and the first steps" width="1440" height="900" loading="lazy"></a>
-                    <figcaption><strong>An app's page</strong> — what it is for, where your files go, and how to start.</figcaption>
-                </figure>
-                <figure class="dash-shot">
-                    <a href="/assets/dashboard-backups-en.webp" data-gallery="dashboard"><img src="/assets/dashboard-backups-en.webp" alt="The backups page: each app's database backed up overnight, and checked" width="1440" height="900" loading="lazy"></a>
-                    <figcaption><strong>Backups</strong> — every night each app's database is backed up and checked.</figcaption>
-                </figure>
-            </div>
-        </section>
-
-        <section class="shell-section" id="how-it-works">
-            <div class="sec-head">
-                <h2>How it works</h2>
-                <p>From the first conversation to a working system.</p>
-            </div>
-            <div class="flow">
-                <div class="flow-step">
-                    <h3>A first talk</h3>
-                    <p>We talk about what you need: which apps, and how much storage.</p>
-                </div>
-                <div class="flow-step">
-                    <h3>Choosing the hardware</h3>
-                    <p>We help you find the machine with the best value for what you need.</p>
-                </div>
-                <div class="flow-step">
-                    <h3>Installation</h3>
-                    <p>We install and set up the apps, the backups and the monitoring.</p>
-                </div>
-                <div class="flow-step">
-                    <h3>Handover</h3>
-                    <p>We show you the system, help you bring over your existing data, and answer all your questions.</p>
-                </div>
-                <div class="flow-step">
-                    <h3>Running it</h3>
-                    <p>We watch the system, update it and check the backups. You just use it.</p>
-                </div>
-            </div>
-        </section>
-
-        <section class="shell-section" id="why">
-            <div class="sec-head">
-                <h2>Why your own?</h2>
-                <p>The same convenience, on different terms.</p>
-            </div>
-            <div class="vs">
-                <div class="vs-head">
-                    <div>With a cloud provider</div>
-                    <div>On your own box</div>
-                </div>
-                <div class="vs-row">
-                    <div>You pay every month for storage and premium features, and the prices only go up.</div>
-                    <div><strong>The machine is yours, for good.</strong> No storage subscription that gets dearer every year: you pay for the electricity and, if you want it, for the management.</div>
-                </div>
-                <div class="vs-row">
-                    <div>Your photos, documents and personal data sit on other people's servers, in other people's hands.</div>
-                    <div><strong>Your data stays in your home</strong>, not on Google's or Microsoft's servers. It goes into the remote backup only encrypted.</div>
-                </div>
-                <div class="vs-row">
-                    <div>The storage runs out, and when it is full you pay again.</div>
-                    <div><strong>No 15 GB limit.</strong> Add space as your needs grow — terabytes, if you need them.</div>
-                </div>
-                <div class="vs-row">
-                    <div>You do not decide which services you get, or when they are switched off.</div>
-                    <div><strong>You decide which services you run.</strong> You are the boss, not the provider.</div>
-                </div>
-            </div>
-            <div class="band">
-                <div class="band-item">
-                    <h3>What you can install</h3>
-                    <p>58 apps — almost all of them open source</p>
-                    <a href="/preview/m3/en/apps" class="btn btn-outline">See all applications →</a>
-                </div>
-                <div class="band-item">
-                    <h3>What runs underneath</h3>
-                    <p>Docker containers on a Proxmox base, three-level backups, an encrypted tunnel with no open port, a Dashboard in English or Hungarian. Matched to your needs, <strong>from the simplest to the most serious</strong>.</p>
-                    <a href="/preview/m3/en/technology" class="btn btn-outline">More about the technology →</a>
-                </div>
-            </div>
-        </section>
-
-        <section class="shell-section" id="closed-test">
-            <div class="sec-head">
-                <h2>Closed test</h2>
-                <p>We are starting to use the system for real with a few households in Hungary</p>
-            </div>
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Real use</h3>
-                    <p>Not a demo: the box stays with you, and you put your real photos and documents on it. We help with the installation and the move, and then you use it every day.</p>
-                </div>
-                <div class="app-info-card">
-                    <h3>Feedback</h3>
-                    <p>In return we ask you to tell us what annoys you, what is unclear and what does not work. An "I couldn't find this button" is worth the most to us — it tells us what to fix.</p>
-                </div>
-            </div>
-            <div class="alerts-container">
-                <div class="alert-banner alert-banner-warning">
-                    <span class="alert-icon"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-triangle-alert"/></svg></span>
-                    <span class="alert-message"><strong>Known limits, honestly.</strong> Honestly: the Dashboard has one shared household password today; there are no separate accounts for family members yet (each app can have its own users, though). Streaming to the TV (DLNA) is not there yet: for now the media library plays in the browser and in mobile apps. And because this is a test, expect to find bugs — that is the point.</span>
-                </div>
-            </div>
-            <div class="close-cta">
-                <p>If this interests you, write. <strong>It commits you to nothing</strong>, we just talk first.</p>
-                <a href="/preview/m3/en/testing" class="btn btn-primary btn-lg">Apply as a tester →</a>
-                <div class="who-mini">
-                    <img src="/assets/operator-portrait-small.webp" alt="Viktor Nagyfenyvesi, who runs Felhom" width="160" height="200" loading="lazy">
-                    <p>There is one person behind Felhom: <strong>Viktor Nagyfenyvesi</strong>. If you write, he answers. <a href="/preview/m3/en/contact#ki-all-mogotte">Who is behind it →</a></p>
-                </div>
-            </div>
-        </section>
-
-<footer>
-        <div class="container">
-            <p>© 2026 felhom.eu – Your own cloud, your own rules. Felhom serves households in Hungary.</p>
-            <p class="footer-legal">Operated by Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Privacy notice (Hungarian)</a> · <a href="/feltetelek">Terms (Hungarian)</a></p>
-        </div>
-    </footer>
-    </main>
-    <script>
-    (function(){
-        var b=document.getElementById('navBurger'),s=document.getElementById('sidebar'),k=document.getElementById('navBackdrop');
-        if(!b||!s||!k)return;
-        function open(){s.classList.add('is-open');k.hidden=false;document.body.classList.add('nav-open');b.setAttribute('aria-expanded','true');}
-        function close(){s.classList.remove('is-open');k.hidden=true;document.body.classList.remove('nav-open');b.setAttribute('aria-expanded','false');}
-        b.addEventListener('click',function(){s.classList.contains('is-open')?close():open();});
-        k.addEventListener('click',close);
-        document.addEventListener('keydown',function(e){if(e.key==='Escape'&&s.classList.contains('is-open')){close();b.focus();}});
-        s.querySelectorAll('a').forEach(function(l){l.addEventListener('click',close);});
-        window.addEventListener('resize',function(){if(window.innerWidth>768)close();});
-    })();
-    document.addEventListener('click',function(e){
-        var btn=e.target.closest?e.target.closest('.nav-group-toggle'):null;
-        if(!btn)return;
-        var g=btn.closest('.nav-group');if(!g)return;
-        var willOpen=!g.classList.contains('is-open');
-        document.querySelectorAll('.nav-group.is-open').forEach(function(x){
-            x.classList.remove('is-open');
-            var t=x.querySelector('.nav-group-toggle');if(t)t.setAttribute('aria-expanded','false');
-        });
-        if(willOpen){g.classList.add('is-open');btn.setAttribute('aria-expanded','true');}
-    });
-    </script>
-</body>
-</html>
diff --git a/website/preview/m3/en/technology.html b/website/preview/m3/en/technology.html
deleted file mode 100644
index b228d2a8..00000000
--- a/website/preview/m3/en/technology.html
+++ /dev/null
@@ -1,553 +0,0 @@
-<!DOCTYPE html>
-<html lang="en" class="no-js">
-<head>
-    <script>document.documentElement.className=document.documentElement.className.replace('no-js','js');</script>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Technology — Docker, the Dashboard and Proxmox for a home server | Felhom.eu</title>
-    <meta name="description" content="Industry-grade technology at home, in Hungary: Docker containers, a Dashboard in English or Hungarian, Proxmox virtualisation. HTTPS and an encrypted tunnel — with no open port.">
-    
-    <meta name="keywords" content="Docker, dashboard, Proxmox, container, virtualisation, reverse proxy, HTTPS, encrypted tunnel, home server technology">
-    <meta name="robots" content="index, follow">
-    <link rel="canonical" href="https://felhom.eu/en/technology">
-    <link rel="alternate" hreflang="hu" href="https://felhom.eu/technologiak">
-    <link rel="alternate" hreflang="en" href="https://felhom.eu/en/technology">
-    <link rel="alternate" hreflang="x-default" href="https://felhom.eu/technologiak">
-
-    <meta property="og:type" content="article">
-    <meta property="og:url" content="https://felhom.eu/en/technology">
-    <meta property="og:title" content="Professional technology for a home server">
-    <meta property="og:description" content="Docker, a Dashboard in English or Hungarian, Proxmox — industry-grade tools at home.">
-    <meta property="og:image" content="https://felhom.eu/assets/og-image-en.png">
-    <meta property="og:locale" content="en_GB">
-    <meta property="og:site_name" content="Felhom.eu">
-
-    <meta name="twitter:card" content="summary_large_image">
-    <meta name="twitter:title" content="Professional technology for a home server">
-    <meta name="twitter:description" content="Docker, a Dashboard in English or Hungarian, Proxmox — industry tools, at home.">
-    <meta name="twitter:image" content="https://felhom.eu/assets/og-image-en.png">
-
-    <script type="application/ld+json">
-    {
-      "@context": "https://schema.org",
-      "@type": "Article",
-      "headline": "The technology behind a Felhom home server",
-      "description": "Docker containers, a Dashboard in English or Hungarian and Proxmox virtualisation for a home server.",
-      "author": {"@type": "Organization", "name": "Felhom.eu"},
-      "publisher": {"@type": "Organization", "name": "Felhom.eu", "logo": {"@type": "ImageObject", "url": "https://felhom.eu/assets/logo.png"}},
-      "mainEntityOfPage": "https://felhom.eu/en/technology"
-    }
-    </script>
-    <!-- shared assets: bump ?v= together on any site.css/icons.svg change -->
-    <link rel="stylesheet" href="/assets/site.css?v=21">
-    <link rel="stylesheet" href="/assets/shell.css?v=21">
-    <link rel="icon" type="image/png" href="/assets/logo_favicon_2.svg">
-    <script defer src="/assets/gallery.js?v=2"></script>
-    <script defer src="https://stats.felhom.eu/script.js" data-website-id="d419db57-5e1c-48df-bdb3-c29f25fb1661"></script>
-</head>
-<body class="shell page-technologiak">
-    <header class="mobile-topbar">
-        <a href="/preview/m3/en/" class="mobile-topbar-logo"><img src="/assets/logo_notext_white.svg" alt="Felhom.eu"></a>
-        <button type="button" class="nav-burger" id="navBurger" aria-expanded="false" aria-controls="sidebar" aria-label="Menu">
-            <span class="hamburger-box"><span class="hamburger-line"></span><span class="hamburger-line"></span><span class="hamburger-line"></span></span>
-        </button>
-    </header>
-    <div class="nav-backdrop" id="navBackdrop" hidden></div>
-    <nav class="sidebar" id="sidebar">
-        <div class="sidebar-header">
-            <a href="/preview/m3/en/" class="sidebar-logo-link">
-                <img src="/assets/logo_notext_white.svg" alt="" class="sidebar-logo" aria-hidden="true">
-                <img src="/assets/logo-wordmark.png" alt="felhom.eu" class="sidebar-word">
-            </a>
-        </div>
-        <ul class="nav-links">
-                <li><a href="/preview/m3/en/"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg>Home</a></li>
-                <li><a href="/preview/m3/en/#services"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rocket"/></svg>Services</a></li>
-                <li class="nav-group">
-                    <button type="button" class="nav-group-toggle" aria-expanded="false" aria-controls="nav-group-apps"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg>Applications<svg class="ico nav-chevron" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chevron-down"/></svg></button>
-                    <ul id="nav-group-apps" class="nav-links nav-links-sub nav-links-nested">
-                        <li><a href="/preview/m3/en/apps">All applications</a></li>
-                        <li><a href="/preview/m3/en/apps#files-office">Files &amp; Office</a></li>
-                        <li><a href="/preview/m3/en/apps#media-entertainment">Media &amp; Entertainment</a></li>
-                        <li><a href="/preview/m3/en/apps#home-lifestyle">Home &amp; Lifestyle</a></li>
-                        <li><a href="/preview/m3/en/apps#productivity-knowledge">Productivity &amp; Knowledge</a></li>
-                        <li><a href="/preview/m3/en/apps#system-development">System &amp; Development</a></li>
-                    </ul>
-                </li>
-                <li><a href="/preview/m3/en/technology" class="active"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg>Technology</a></li>
-                <li><a href="/preview/m3/en/backups"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg>Backups</a></li>
-        </ul>
-        <div class="sidebar-bottom">
-            <a href="/preview/m3/en/testing" class="btn btn-outline sidebar-cta">Apply as a tester →</a>
-            <div class="nav-group-label">About Felhom</div>
-            <ul class="nav-links nav-links-sub">
-                    <li><a href="/preview/m3/en/#how-it-works">How it works</a></li>
-                    <li><a href="/preview/m3/en/faq">FAQ</a></li>
-                    <li><a href="/preview/m3/en/contact">Contact</a></li>
-            </ul>
-            <div class="sidebar-footer">
-                <details class="lang-globe"><summary class="lang-globe-btn" aria-label="Language" title="Language"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/preview/m3/technologiak" lang="hu" hreflang="hu" class="lang-globe-item">Magyar</a></li><li><a href="/preview/m3/en/technology" lang="en" hreflang="en" class="lang-globe-item current" aria-current="true">English</a></li></ul></details>
-            </div>
-        </div>
-    </nav>
-<main class="content">
-                <div class="page-header">
-                <h1>The <span>technology</span></h1>
-            </div>
-                <p class="page-lede">Modern, proven tools for running a home server. This is how we build the system.</p>
-
-
-        <!-- Table of Contents -->
-        <section class="content-section" style="padding-top: 0;">
-            <div class="container">
-                <div class="toc-nav">
-                    <h3>Contents</h3>
-                    <ul class="toc-links">
-                        <li><a href="#containers">Why containers?</a></li>
-                        <li><a href="#dashboard">The control layer (Dashboard)</a></li>
-                        <li><a href="#proxmox">Virtualisation (Proxmox)</a></li>
-                        <li><a href="#network">Network and security</a></li>
-                        <li><a href="#storage">Storage</a></li>
-                        <li><a href="#hardware">Hardware set-ups</a></li>
-                    </ul>
-                </div>
-            </div>
-        </section>
-
-        <!-- Miért konténerek? -->
-        <section class="content-section alt-bg" id="containers">
-            <div class="container">
-                <div class="section-header">
-                    <h2>Why <span>containers?</span></h2>
-                    <p>The cornerstone of running a modern server</p>
-                </div>
-
-                <div class="info-card">
-                    <h3><span class="icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg></span> What is a container?</h3>
-                    <p>Imagine that every app runs in its own sealed "box". The box holds the app and everything it depends on – so it works the same way anywhere, on any server.</p>
-                    <p>Containers (Docker) changed how servers are run: simpler installs, easier updates, and more reliable operation.</p>
-                    
-                    <div class="highlight-box">
-                        <p><strong>An analogy:</strong> as if every app lived in its own flat in a block of flats. It has its own front door and its own meters, and it does not bother the neighbours – but they still share one building.</p>
-                    </div>
-                </div>
-
-                <div class="comparison-grid">
-                    <div class="comparison-card">
-                        <div class="card-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-monitor"/></svg></div>
-                        <h3>Traditional install</h3>
-                        <div class="subtitle">"Straight onto the system"</div>
-                        <p>The apps are installed straight onto the operating system. They can clash with each other, and they are hard to remove.</p>
-                        <ul class="feature-list cons">
-                            <li>Dependencies can get tangled</li>
-                            <li>Hard to reproduce on another server</li>
-                            <li>Update = risk</li>
-                            <li>Removing an app leaves "rubbish" behind</li>
-                        </ul>
-                    </div>
-
-                    <div class="comparison-card recommended">
-                        <div class="card-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-container"/></svg></div>
-                        <h3>Container install</h3>
-                        <div class="subtitle">Docker</div>
-                        <p>Every app runs on its own. A clean, tidy system that is easy to manage.</p>
-                        <ul class="feature-list">
-                            <li>Fully isolated apps</li>
-                            <li>One command = installed</li>
-                            <li>Simple updates, and a simple way back</li>
-                            <li>Reproducible anywhere</li>
-                        </ul>
-                    </div>
-                </div>
-            </div>
-        </section>
-
-        <!-- Single Node - vezérlőpult -->
-        <section class="content-section" id="dashboard">
-            <div class="container">
-                <div class="section-header">
-                    <h2>The control layer: <span>the Dashboard</span></h2>
-                    <p>The interface of every Felhom box, in English or Hungarian</p>
-                </div>
-
-                <div class="info-card">
-                    <h3><span class="icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-target"/></svg></span> What does the Dashboard do?</h3>
-                    <p>The Dashboard is on every Felhom box: it is the interface, in English or Hungarian, that runs your system on its Proxmox base. It was designed for home servers: you install apps in a few clicks and never touch a command line – Docker and Proxmox do the work in the background.</p>
-                    
-                    <ul class="feature-list">
-                        <li>A web interface in English or Hungarian – the household chooses, and no command-line knowledge is needed</li>
-                        <li>App catalog – 58 apps to install in a few clicks</li>
-                        <li>Resource view – memory and storage use as it happens</li>
-                        <li>Automatic backups – databases and files, with their status watched</li>
-                        <li>App updates – only versions we have tried, a fresh backup first, and if the new version does not start, the box goes back to the previous one by itself</li>
-                        <li>System monitoring – health watched all the time, with alerts</li>
-                    </ul>
-
-                    <div class="dash-grid">
-                    <figure class="dash-shot">
-                        <a href="/assets/dashboard-apps-en.webp" data-gallery="dashboard"><img src="/assets/dashboard-apps-en.webp" alt="The Apps page: cards of installed and installable apps, with their status" width="1440" height="900" loading="lazy"></a>
-                        <figcaption><strong>Apps</strong> – install in a few clicks, and see what runs and what is up to date.</figcaption>
-                    </figure>
-                    <figure class="dash-shot">
-                        <a href="/assets/dashboard-backups-en.webp" data-gallery="dashboard"><img src="/assets/dashboard-backups-en.webp" alt="The backups page: each app's database backed up overnight, and checked" width="1440" height="900" loading="lazy"></a>
-                        <figcaption><strong>Backups</strong> – every night each app's database is backed up and checked.</figcaption>
-                    </figure>
-                    </div>
-
-                    <div class="highlight-box">
-                        <p><strong>Good for:</strong> a home media server, a family cloud, personal projects, a small office.</p>
-                    </div>
-                </div>
-
-                <div class="stack-diagram">
-                    <h3>How a Felhom box is built</h3>
-                    <div class="stack-layers">
-                        <div class="stack-layer">
-                            <div class="layer-label">Control + apps</div>
-                            <div class="layer-content highlight">
-                                <div class="layer-name">Dashboard + Apps</div>
-                                <div class="layer-tech">An interface in English or Hungarian · Nextcloud, Jellyfin, Immich…</div>
-                            </div>
-                        </div>
-                        <div class="stack-layer">
-                            <div class="layer-label">Container engine</div>
-                            <div class="layer-content">
-                                <div class="layer-name">Docker</div>
-                                <div class="layer-tech">The apps run in isolated containers</div>
-                            </div>
-                        </div>
-                        <div class="stack-layer">
-                            <div class="layer-label">System environment</div>
-                            <div class="layer-content">
-                                <div class="layer-name">Isolated system environment</div>
-                                <div class="layer-tech">Your box – a cleanly separated system</div>
-                            </div>
-                        </div>
-                        <div class="stack-layer">
-                            <div class="layer-label">Base layer</div>
-                            <div class="layer-content">
-                                <div class="layer-name">Proxmox VE</div>
-                                <div class="layer-tech">Virtualisation base · backing up the whole box, restoring</div>
-                            </div>
-                        </div>
-                        <div class="stack-layer">
-                            <div class="layer-label">Hardware</div>
-                            <div class="layer-content">
-                                <div class="layer-name">The server machine</div>
-                                <div class="layer-tech">Mini PC, tower or server</div>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </section>
-
-        <!-- Proxmox -->
-        <section class="content-section alt-bg" id="proxmox">
-            <div class="container">
-                <div class="section-header">
-                    <h2>The base layer: <span>Proxmox</span></h2>
-                    <p>Every Felhom machine is built on this stable base</p>
-                </div>
-
-                <div class="info-card">
-                    <h3><span class="icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg></span> What is Proxmox?</h3>
-                    <p>Proxmox VE is a free, professional virtualisation platform – the same kind of technology data centres and companies use. It is the base of every Felhom system: we build every machine on it, and the isolated system environment your apps run in sits on top of it.</p>
-
-                    <div class="highlight-box">
-                        <p><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg> <strong>The base, not an option:</strong> Proxmox is on every Felhom box. You do not need to know about it or deal with it – it works quietly in the background, and it is what makes your system safe and able to be backed up.</p>
-                    </div>
-                </div>
-
-                <div class="info-card">
-                    <h3><span class="icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-target"/></svg></span> What does the Proxmox base give you?</h3>
-
-                    <ul class="feature-list">
-                        <li><strong>A backup before each update</strong> – before an app is updated, a fresh backup is made, and if the new version does not start, the box puts the previous one back by itself</li>
-                        <li><strong>The whole system is backed up</strong> – not only your data: the whole box goes into a backup too, and it can be restored from it</li>
-                        <li><strong>Clean separation</strong> – the control layer and your apps run well apart, which makes the system more stable and safer</li>
-                        <li><strong>A fast, repeatable install</strong> – setting up a new box is quick and predictable, the same way every time</li>
-                    </ul>
-
-                    <div class="highlight-box">
-                        <p><strong>One base, one job:</strong> on a Felhom box, Proxmox runs a single isolated system environment – the one your apps work in.</p>
-                    </div>
-                </div>
-            </div>
-        </section>
-
-        <!-- Hálózat -->
-        <section class="content-section alt-bg" id="network">
-            <div class="container">
-                <div class="section-header">
-                    <h2>Network and <span>security</span></h2>
-                    <p>How do you reach your server safely, from anywhere?</p>
-                </div>
-
-                <div class="info-card">
-                    <h3><span class="icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rotate-cw"/></svg></span> Reverse Proxy</h3>
-                    <p>A reverse proxy is a "doorkeeper" that takes incoming requests and passes them to the right app. It also handles the HTTPS encryption.</p>
-                    
-                    <div class="network-flow">
-                        <div class="flow-node">
-                            <div class="node-icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></div>
-                            <div class="node-label">Internet</div>
-                        </div>
-                        <div class="flow-arrow">→</div>
-                        <div class="flow-node">
-                            <div class="node-icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-lock"/></svg></div>
-                            <div class="node-label">Reverse Proxy</div>
-                            <div class="node-tech">Traefik</div>
-                        </div>
-                        <div class="flow-arrow">→</div>
-                        <div class="flow-node">
-                            <div class="node-icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg></div>
-                            <div class="node-label">App</div>
-                        </div>
-                    </div>
-
-                    <ul class="feature-list">
-                        <li><strong>Traefik</strong> – every app on its own subdomain, over HTTPS</li>
-                        <li><strong>Encrypted tunnel</strong> – the box itself builds the connection outwards, so no port has to be opened at home</li>
-                    </ul>
-                </div>
-
-                <div class="info-card">
-                    <h3><span class="icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield"/></svg></span> Protection</h3>
-                    <ul class="feature-list">
-                        <li><strong>No open port</strong> – from outside, the box is reached only through the encrypted tunnel</li>
-                        <li><strong>Own sign-in</strong> – every app has its own accounts, and the Dashboard has a password</li>
-                        <li><strong>Family gate</strong> – some apps sit behind each family member's own sign-in, so a stranger never even reaches the app</li>
-                        <li><strong>Security updates</strong> – the box's system gets them by itself</li>
-                    </ul>
-                </div>
-            </div>
-        </section>
-
-        <!-- Tárolás -->
-        <section class="content-section" id="storage">
-            <div class="container">
-                <div class="section-header">
-                    <h2>Storage and <span>data safety</span></h2>
-                    <p>Where and how should you keep your data?</p>
-                </div>
-
-                <div class="comparison-grid">
-                    <div class="comparison-card">
-                        <div class="card-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-zap"/></svg></div>
-                        <h3>SSD (NVMe/SATA)</h3>
-                        <div class="subtitle">Fast storage</div>
-                        <ul class="feature-list">
-                            <li>Operating system</li>
-                            <li>Databases</li>
-                            <li>Apps</li>
-                        </ul>
-                    </div>
-                    <div class="comparison-card">
-                        <div class="card-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-database"/></svg></div>
-                        <h3>HDD</h3>
-                        <div class="subtitle">Large capacity</div>
-                        <ul class="feature-list">
-                            <li>Media library</li>
-                            <li>Photo archive</li>
-                            <li>Backups</li>
-                        </ul>
-                    </div>
-                </div>
-
-                <div class="info-card" style="margin-top: 32px;">
-                    <h3><span class="icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rotate-cw"/></svg></span> Backups on three levels – how we protect your data</h3>
-                    <p>Every night a Felhom box makes a <strong>backup on the box</strong>, a <strong>second copy on a second drive</strong>, and an <strong>encrypted copy on remote storage</strong>. The levels protect together: the local one is fast, and the remote one survives even if the box itself is physically harmed.</p>
-
-                    <div class="warning-box">
-                        <p><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-triangle-alert"/></svg> <strong>More disks are not a backup on their own!</strong> RAID-like set-ups protect against hardware failure, but not against an accidental delete or ransomware. That is why our backups always sit on a separate level, not in the disks.</p>
-                    </div>
-                </div>
-            </div>
-        </section>
-
-        <!-- Hardver konfigurációk -->
-        <section class="content-section alt-bg" id="hardware">
-            <div class="container">
-                <div class="section-header">
-                    <h2>Hardware <span>set-ups</span></h2>
-                    <p>Which machine do you need? A few example set-ups</p>
-                </div>
-
-                <div class="hardware-grid">
-                    <div class="hardware-card">
-                        <div class="hardware-card-header">
-                            <div class="hw-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg></div>
-                            <h3>Mini PC + NAS</h3>
-                            <div class="hw-subtitle">Starter / Home</div>
-                        </div>
-                        <div class="hardware-card-body">
-                            <p>Compact, quiet and energy-saving.</p>
-                            <ul class="spec-list">
-                                <li><span class="spec-label">CPU</span><span class="spec-value">Intel N100</span></li>
-                                <li><span class="spec-label">RAM</span><span class="spec-value">16-32 GB</span></li>
-                                <li><span class="spec-label">SSD</span><span class="spec-value">256-512 GB</span></li>
-                                <li><span class="spec-label">Power use</span><span class="spec-value">15-35W</span></li>
-                            </ul>
-                            <div class="price-range">
-                                <div class="label">Estimated cost</div>
-                                <div class="price">80.000 - 150.000 Ft</div>
-                            </div>
-                        </div>
-                    </div>
-
-                    <div class="hardware-card">
-                        <div class="hardware-card-header">
-                            <div class="hw-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-radio-tower"/></svg></div>
-                            <h3>Tower server</h3>
-                            <div class="hw-subtitle">Advanced / Family</div>
-                        </div>
-                        <div class="hardware-card-body">
-                            <p>More power and more storage.</p>
-                            <ul class="spec-list">
-                                <li><span class="spec-label">CPU</span><span class="spec-value">Intel i5/i7</span></li>
-                                <li><span class="spec-label">RAM</span><span class="spec-value">32-64 GB</span></li>
-                                <li><span class="spec-label">Storage</span><span class="spec-value">4-8 TB</span></li>
-                                <li><span class="spec-label">Power use</span><span class="spec-value">50-120W</span></li>
-                            </ul>
-                            <div class="price-range">
-                                <div class="label">Estimated cost</div>
-                                <div class="price">200.000 - 400.000 Ft</div>
-                            </div>
-                        </div>
-                    </div>
-
-                    <div class="hardware-card">
-                        <div class="hardware-card-header">
-                            <div class="hw-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-building-2"/></svg></div>
-                            <h3>Rack server</h3>
-                            <div class="hw-subtitle">Business / on request</div>
-                        </div>
-                        <div class="hardware-card-body">
-                            <p>Industrial quality, high reliability.</p>
-                            <ul class="spec-list">
-                                <li><span class="spec-label">CPU</span><span class="spec-value">Xeon / EPYC</span></li>
-                                <li><span class="spec-label">RAM</span><span class="spec-value">64-256 GB ECC</span></li>
-                                <li><span class="spec-label">Storage</span><span class="spec-value">8-24 bay</span></li>
-                                <li><span class="spec-label">Extra</span><span class="spec-value">IPMI, red. PSU</span></li>
-                            </ul>
-                            <div class="price-range">
-                                <div class="label">Estimated cost (used)</div>
-                                <div class="price">150.000 - 600.000 Ft</div>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-
-                <div class="info-card" style="margin-top: 48px;">
-                    <h3><span class="icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-lightbulb"/></svg></span> Which one should you choose?</h3>
-                    <div class="highlight-box">
-                        <p><strong>Our advice:</strong> start small! A good mini PC is enough for most homes, and you can expand it later. A rack server is a business / on-request set-up – a home rarely needs one.</p>
-                    </div>
-                </div>
-            </div>
-        </section>
-
-        <!-- CTA -->
-        <section class="cta-section">
-            <div class="container">
-                <h2>Not sure which <span>set-up is right for you?</span></h2>
-                <p>Let's talk through what you need, and we will help you find the right set-up.</p>
-                <a href="/en/contact" class="cta-button">Get in touch →</a>
-                <a href="/en/apps" class="cta-button-secondary">Browse the apps →</a>
-            </div>
-        </section>
-    </main>
-    <script>
-    (function() {
-        var hamburger = document.getElementById('hamburger');
-        var navLinks = document.querySelector('.nav-links');
-        var overlay = document.getElementById('mobileOverlay');
-        var body = document.body;
-
-        if (!hamburger || !navLinks || !overlay) {
-            console.warn('[mobile-menu] Missing elements:', {
-                hamburger: !!hamburger,
-                navLinks: !!navLinks,
-                overlay: !!overlay
-            });
-            return;
-        }
-
-        function openMenu() {
-            hamburger.classList.add('is-active');
-            navLinks.classList.add('is-open');
-            overlay.classList.add('is-visible');
-            body.classList.add('menu-open');
-            hamburger.setAttribute('aria-expanded', 'true');
-            hamburger.setAttribute('aria-label', 'Close menu');
-        }
-
-        function closeMenu() {
-            hamburger.classList.remove('is-active');
-            navLinks.classList.remove('is-open');
-            overlay.classList.remove('is-visible');
-            body.classList.remove('menu-open');
-            hamburger.setAttribute('aria-expanded', 'false');
-            hamburger.setAttribute('aria-label', 'Open menu');
-        }
-
-        hamburger.addEventListener('click', function() {
-            if (navLinks.classList.contains('is-open')) {
-                closeMenu();
-            } else {
-                openMenu();
-            }
-        });
-
-        overlay.addEventListener('click', closeMenu);
-
-        navLinks.querySelectorAll('a').forEach(function(link) {
-            link.addEventListener('click', closeMenu);
-        });
-
-        document.addEventListener('keydown', function(e) {
-            if (e.key === 'Escape' && navLinks.classList.contains('is-open')) {
-                closeMenu();
-            }
-        });
-
-        window.addEventListener('resize', function() {
-            if (window.innerWidth > 900 && navLinks.classList.contains('is-open')) {
-                closeMenu();
-            }
-        });
-    })();
-    </script>
-<footer>
-        <div class="container">
-            <p>© 2026 felhom.eu – Your own cloud, your own rules. Felhom serves households in Hungary.</p>
-            <p class="footer-legal">Operated by Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Privacy notice (Hungarian)</a> · <a href="/feltetelek">Terms (Hungarian)</a></p>
-        </div>
-    </footer>
-    <script>
-    (function(){
-        var b=document.getElementById('navBurger'),s=document.getElementById('sidebar'),k=document.getElementById('navBackdrop');
-        if(!b||!s||!k)return;
-        function open(){s.classList.add('is-open');k.hidden=false;document.body.classList.add('nav-open');b.setAttribute('aria-expanded','true');}
-        function close(){s.classList.remove('is-open');k.hidden=true;document.body.classList.remove('nav-open');b.setAttribute('aria-expanded','false');}
-        b.addEventListener('click',function(){s.classList.contains('is-open')?close():open();});
-        k.addEventListener('click',close);
-        document.addEventListener('keydown',function(e){if(e.key==='Escape'&&s.classList.contains('is-open')){close();b.focus();}});
-        s.querySelectorAll('a').forEach(function(l){l.addEventListener('click',close);});
-        window.addEventListener('resize',function(){if(window.innerWidth>768)close();});
-    })();
-    document.addEventListener('click',function(e){
-        var btn=e.target.closest?e.target.closest('.nav-group-toggle'):null;
-        if(!btn)return;
-        var g=btn.closest('.nav-group');if(!g)return;
-        var willOpen=!g.classList.contains('is-open');
-        document.querySelectorAll('.nav-group.is-open').forEach(function(x){
-            x.classList.remove('is-open');
-            var t=x.querySelector('.nav-group-toggle');if(t)t.setAttribute('aria-expanded','false');
-        });
-        if(willOpen){g.classList.add('is-open');btn.setAttribute('aria-expanded','true');}
-    });
-    </script>
-</body>
-</html>
diff --git a/website/preview/m3/en/testing.html b/website/preview/m3/en/testing.html
deleted file mode 100644
index 9cfd5505..00000000
--- a/website/preview/m3/en/testing.html
+++ /dev/null
@@ -1,333 +0,0 @@
-<!DOCTYPE html>
-<html lang="en" class="no-js">
-<head>
-    <script>document.documentElement.className=document.documentElement.className.replace('no-js','js');</script>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Looking for testers — a home server, free during the test | Felhom.eu</title>
-    <meta name="description" content="We are looking for households in Hungary to try our home server. No fee during the test, we do the setup, and we pay for the domain for two years. Up to 5 households.">
-    <meta name="keywords" content="home server test, tester wanted, own cloud, NAS for home, closed test, self-hosting Hungary">
-    <meta name="robots" content="index, follow">
-    <link rel="canonical" href="https://felhom.eu/en/testing">
-    <link rel="alternate" hreflang="hu" href="https://felhom.eu/teszteles">
-    <link rel="alternate" hreflang="en" href="https://felhom.eu/en/testing">
-    <link rel="alternate" hreflang="x-default" href="https://felhom.eu/teszteles">
-
-    <meta property="og:type" content="article">
-    <meta property="og:url" content="https://felhom.eu/en/testing">
-    <meta property="og:title" content="Looking for testers — your own cloud at home, free during the test">
-    <meta property="og:description" content="Your photos and documents on your own machine, at home. We do the setup and pay for the domain for two years. Up to 5 households.">
-    <meta property="og:image" content="https://felhom.eu/assets/og-image.png">
-    <meta property="og:locale" content="en_GB">
-    <meta property="og:site_name" content="Felhom.eu">
-
-    <meta name="twitter:card" content="summary_large_image">
-    <meta name="twitter:title" content="Looking for testers — your own cloud at home">
-    <meta name="twitter:description" content="No fee during the test. We do the setup and pay for the domain for two years.">
-    <meta name="twitter:image" content="https://felhom.eu/assets/og-image.png">
-
-    <script type="application/ld+json">
-    {
-      "@context": "https://schema.org",
-      "@type": "Article",
-      "headline": "Looking for testers for the Felhom closed test",
-      "description": "What you need, what you get, what we ask for, and how to apply to the Felhom closed test.",
-      "author": {"@type": "Organization", "name": "Felhom.eu"},
-      "publisher": {"@type": "Organization", "name": "Felhom.eu", "logo": {"@type": "ImageObject", "url": "https://felhom.eu/assets/logo.png"}},
-      "mainEntityOfPage": "https://felhom.eu/en/testing"
-    }
-    </script>
-    <!-- shared assets: bump ?v= together on any site.css/icons.svg change -->
-    <link rel="stylesheet" href="/assets/site.css?v=21">
-    <link rel="stylesheet" href="/assets/shell.css?v=21">
-    <link rel="icon" type="image/png" href="/assets/logo_favicon_2.svg">
-    <script defer src="https://stats.felhom.eu/script.js" data-website-id="d419db57-5e1c-48df-bdb3-c29f25fb1661"></script>
-</head>
-<body class="shell page-teszteles">
-    <header class="mobile-topbar">
-        <a href="/preview/m3/en/" class="mobile-topbar-logo"><img src="/assets/logo_notext_white.svg" alt="Felhom.eu"></a>
-        <button type="button" class="nav-burger" id="navBurger" aria-expanded="false" aria-controls="sidebar" aria-label="Menu">
-            <span class="hamburger-box"><span class="hamburger-line"></span><span class="hamburger-line"></span><span class="hamburger-line"></span></span>
-        </button>
-    </header>
-    <div class="nav-backdrop" id="navBackdrop" hidden></div>
-    <nav class="sidebar" id="sidebar">
-        <div class="sidebar-header">
-            <a href="/preview/m3/en/" class="sidebar-logo-link">
-                <img src="/assets/logo_notext_white.svg" alt="" class="sidebar-logo" aria-hidden="true">
-                <img src="/assets/logo-wordmark.png" alt="felhom.eu" class="sidebar-word">
-            </a>
-        </div>
-        <ul class="nav-links">
-                <li><a href="/preview/m3/en/"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg>Home</a></li>
-                <li><a href="/preview/m3/en/#services"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rocket"/></svg>Services</a></li>
-                <li class="nav-group">
-                    <button type="button" class="nav-group-toggle" aria-expanded="false" aria-controls="nav-group-apps"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg>Applications<svg class="ico nav-chevron" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chevron-down"/></svg></button>
-                    <ul id="nav-group-apps" class="nav-links nav-links-sub nav-links-nested">
-                        <li><a href="/preview/m3/en/apps">All applications</a></li>
-                        <li><a href="/preview/m3/en/apps#files-office">Files &amp; Office</a></li>
-                        <li><a href="/preview/m3/en/apps#media-entertainment">Media &amp; Entertainment</a></li>
-                        <li><a href="/preview/m3/en/apps#home-lifestyle">Home &amp; Lifestyle</a></li>
-                        <li><a href="/preview/m3/en/apps#productivity-knowledge">Productivity &amp; Knowledge</a></li>
-                        <li><a href="/preview/m3/en/apps#system-development">System &amp; Development</a></li>
-                    </ul>
-                </li>
-                <li><a href="/preview/m3/en/technology"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg>Technology</a></li>
-                <li><a href="/preview/m3/en/backups"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg>Backups</a></li>
-        </ul>
-        <div class="sidebar-bottom">
-            <a href="/preview/m3/en/testing" class="btn btn-outline sidebar-cta">Apply as a tester →</a>
-            <div class="nav-group-label">About Felhom</div>
-            <ul class="nav-links nav-links-sub">
-                    <li><a href="/preview/m3/en/#how-it-works">How it works</a></li>
-                    <li><a href="/preview/m3/en/faq">FAQ</a></li>
-                    <li><a href="/preview/m3/en/contact">Contact</a></li>
-            </ul>
-            <div class="sidebar-footer">
-                <details class="lang-globe"><summary class="lang-globe-btn" aria-label="Language" title="Language"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/preview/m3/teszteles" lang="hu" hreflang="hu" class="lang-globe-item">Magyar</a></li><li><a href="/preview/m3/en/testing" lang="en" hreflang="en" class="lang-globe-item current" aria-current="true">English</a></li></ul></details>
-            </div>
-        </div>
-    </nav>
-<main class="content">
-                <div class="page-header">
-                <h1>Become a <span>tester</span></h1>
-            </div>
-                <p class="page-lede">We are starting to run the system for real in a few households. There is no fee during the test, we do the setup, and we pay for the domain. In return we ask you to tell us what does not work.</p>
-
-
-        <!-- Hungary only -->
-        <section class="content-section">
-            <div class="container">
-                <div class="info-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-map"/></svg> The closed test is for households in Hungary</h3>
-                    <p>We set the server up in person and support it in Hungarian, so the closed test is open to households in Hungary only. This page describes the same offer as the <a href="/teszteles">Hungarian tester page</a>; the legal texts exist in Hungarian only.</p>
-                </div>
-            </div>
-        </section>
-
-        <!-- Who it is for -->
-        <section class="content-section alt-bg">
-            <div class="container">
-                <div class="section-header">
-                    <h2>Who it is <span>for</span></h2>
-                    <p>We are not looking for IT people – we are looking for families who will really use it</p>
-                </div>
-                <div class="info-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg> A household that wants its data back at home</h3>
-                    <p>If your photos, your scanned paperwork and your films live with a foreign provider today, and you would rather keep them at home on your own machine – we are looking for you.</p>
-                    <p><strong>No IT knowledge is needed.</strong> We set the server up at your home and we operate it. You use it from the browser, like any other site.</p>
-                    <div class="highlight-box">
-                        <p>What you do need is <strong>patience</strong>. This is a test, not a finished product. You will find faults – that is the point of it.</p>
-                    </div>
-                </div>
-            </div>
-        </section>
-
-        <!-- What you need -->
-        <section class="content-section">
-            <div class="container">
-                <div class="section-header">
-                    <h2>What you <span>need</span></h2>
-                    <p>Three things – and we pay for the third</p>
-                </div>
-
-                <div class="info-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-cpu"/></svg> 1. A machine that can stay on</h3>
-                    <!-- source: website/en/faq.html – same answers as the Hungarian FAQ -->
-                    <p>The server sits in your home and runs all the time, so it has to be quiet and economical. From the FAQ: most households are well served by a mini PC (for example an Intel N100 with 16-32 GB of RAM) – quiet, economical at 15-35 W, and small enough for the shelf next to the router.</p>
-                    <p>An older machine can work too: a former desktop PC can make a good server. During the first conversation we check whether the machine you have is up to the job (enough RAM, storage and reliability). Power draw and noise matter – an old gaming PC works, but it costs considerably more per month than a modern mini PC.</p>
-                    <p>If you have no machine, that is not a blocker – we work out what suits you during the first conversation. More detailed configurations are on the <a href="/en/technology">Technology</a> page.</p>
-                </div>
-
-                <div class="info-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-radio-tower"/></svg> 2. Home internet</h3>
-                    <!-- source: website/en/faq.html – „What internet connection do I need?" -->
-                    <p>For use at home, any connection is enough, because the apps run on your own local network rather than over the internet. If you also want to reach your server from elsewhere – from work, or on holiday – then upload speed is what counts: at least 10 Mbps is recommended, and more is better.</p>
-                </div>
-
-                <div class="info-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg> 3. A domain – which we pay for</h3>
-                    <!-- source: operator ruling D1, 2026-10-10 (CONTEXT.md); documentation/architecture/01-topology-and-trust.md §7 -->
-                    <p>Your server and your apps are reached through <strong>your own domain</strong> – never a name under felhom.eu. Your dashboard becomes <code>felhom.your-domain.hu</code>, and every app gets its own subdomain.</p>
-                    <div class="highlight-box">
-                        <p><strong>The domain is registered in your name, and we pay the fee for two years during the test.</strong> So the domain is yours: when the test ends, or if you leave, <strong>you keep the domain</strong> and carry on paying for it yourself. We do not ask for it back and we do not take it with us.</p>
-                    </div>
-                    <p>We manage the domain's DNS settings during the test with an access token that <strong>can see that one domain only</strong> – it reaches nothing else.</p>
-                </div>
-            </div>
-        </section>
-
-        <!-- What you get -->
-        <section class="content-section alt-bg">
-            <div class="container">
-                <div class="section-header">
-                    <h2>What you <span>get</span></h2>
-                    <p>The same list as section 3 of the test terms – no more and no less</p>
-                </div>
-                <div class="info-card">
-                    <!-- source: documentation/legal/feltetelek-1.0.md §3 (same promises, no new ones) -->
-                    <ul>
-                        <li>We <strong>set up a home server</strong> at your home and bring it into working order.</li>
-                        <li>We <strong>install apps</strong> on it from our catalogue, through the dashboard.</li>
-                        <li>The apps are <strong>reachable over the internet</strong> as well.</li>
-                        <li>We <strong>watch the server.</strong> If something is wrong, we tell you.</li>
-                        <li><strong>Backups are made</strong> at several levels: on the box, and encrypted on remote storage.</li>
-                        <li>We <strong>update</strong> the apps and the system, usually at night, in a window you choose.</li>
-                        <li>And as above: <strong>we pay for the domain for two years.</strong></li>
-                    </ul>
-                    <p>What we do <strong>not</strong> promise – we commit to no availability and no response time – is in section 5 of the <a href="/feltetelek">test terms (Hungarian)</a>. It is worth reading before you apply.</p>
-                </div>
-            </div>
-        </section>
-
-        <!-- What we ask for -->
-        <section class="content-section">
-            <div class="container">
-                <div class="section-header">
-                    <h2>What we <span>ask for</span></h2>
-                    <p>Not money – neither from you nor to us</p>
-                </div>
-                <div class="info-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-message-square"/></svg> Tell us what is wrong</h3>
-                    <p>This is the only thing we ask in return. What is annoying, what is unclear, what does not work. A "I could not find that button" is worth the most to us – that is how we learn what to fix.</p>
-
-                    <h3 style="margin-top: 24px;"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg> Keep a copy of your own</h3>
-                    <!-- source: documentation/legal/feltetelek-1.0.md §4 -->
-                    <p>From the test terms: <strong>whatever you cannot afford to lose, keep a copy of it yourself as well. Do not let the test be its only home.</strong> Backups are made and we test them, but during a test anything can break.</p>
-                </div>
-            </div>
-        </section>
-
-        <!-- How many places -->
-        <section class="content-section alt-bg">
-            <div class="container">
-                <div class="section-header">
-                    <h2>How many <span>places</span></h2>
-                </div>
-                <div class="info-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-users"/></svg> Up to 5 households</h3>
-                    <!-- source: operator ruling D2, 2026-10-10 (CONTEXT.md) -->
-                    <p>The closed test runs with <strong>up to 5 households</strong>. The number is small because one person operates the system, and we want time for every tester. The test is <strong>just starting</strong>, so <strong>all 5 places are open</strong>.</p>
-                    <p>If it fills up, we will say so – and tell you when a place opens again.</p>
-                </div>
-            </div>
-        </section>
-
-        <!-- Apply -->
-        <section class="cta-section">
-            <div class="container">
-                <h2>Interested? <span>Apply</span></h2>
-                <p>Send us a message – it <strong>commits you to nothing</strong>, we just talk first. We go through whether you have a suitable machine, and what you would use it for.</p>
-                <a href="/en/contact?tema=zart-teszt" class="cta-button">Apply as a tester →</a>
-            </div>
-        </section>
-
-        <!-- Worth reading -->
-        <section class="content-section">
-            <div class="container">
-                <div class="section-header">
-                    <h2>Worth <span>reading</span></h2>
-                </div>
-                <div class="info-card">
-                    <ul>
-                        <li><a href="/feltetelek">The closed test terms (Hungarian)</a> – what you get, what we do not promise, and how to leave.</li>
-                        <li><a href="/adatkezeles">Privacy notice (Hungarian)</a> – what data we handle, for how long, and why.</li>
-                        <li><a href="/en/faq">FAQ</a> – the most common questions, from the machine to the backups.</li>
-                    </ul>
-                </div>
-            </div>
-        </section>
-    </main>
-    <script>
-    (function() {
-        var hamburger = document.getElementById('hamburger');
-        var navLinks = document.querySelector('.nav-links');
-        var overlay = document.getElementById('mobileOverlay');
-        var body = document.body;
-
-        if (!hamburger || !navLinks || !overlay) {
-            console.warn('[mobile-menu] Missing elements:', {
-                hamburger: !!hamburger,
-                navLinks: !!navLinks,
-                overlay: !!overlay
-            });
-            return;
-        }
-
-        function openMenu() {
-            hamburger.classList.add('is-active');
-            navLinks.classList.add('is-open');
-            overlay.classList.add('is-visible');
-            body.classList.add('menu-open');
-            hamburger.setAttribute('aria-expanded', 'true');
-            hamburger.setAttribute('aria-label', 'Close menu');
-        }
-
-        function closeMenu() {
-            hamburger.classList.remove('is-active');
-            navLinks.classList.remove('is-open');
-            overlay.classList.remove('is-visible');
-            body.classList.remove('menu-open');
-            hamburger.setAttribute('aria-expanded', 'false');
-            hamburger.setAttribute('aria-label', 'Open menu');
-        }
-
-        hamburger.addEventListener('click', function() {
-            if (navLinks.classList.contains('is-open')) {
-                closeMenu();
-            } else {
-                openMenu();
-            }
-        });
-
-        overlay.addEventListener('click', closeMenu);
-
-        navLinks.querySelectorAll('a').forEach(function(link) {
-            link.addEventListener('click', closeMenu);
-        });
-
-        document.addEventListener('keydown', function(e) {
-            if (e.key === 'Escape' && navLinks.classList.contains('is-open')) {
-                closeMenu();
-            }
-        });
-
-        window.addEventListener('resize', function() {
-            if (window.innerWidth > 900 && navLinks.classList.contains('is-open')) {
-                closeMenu();
-            }
-        });
-    })();
-    </script>
-<footer>
-        <div class="container">
-            <p>© 2026 felhom.eu – Your own cloud, your own rules. Felhom serves households in Hungary.</p>
-            <p class="footer-legal">Operated by Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Privacy notice (Hungarian)</a> · <a href="/feltetelek">Terms (Hungarian)</a></p>
-        </div>
-    </footer>
-    <script>
-    (function(){
-        var b=document.getElementById('navBurger'),s=document.getElementById('sidebar'),k=document.getElementById('navBackdrop');
-        if(!b||!s||!k)return;
-        function open(){s.classList.add('is-open');k.hidden=false;document.body.classList.add('nav-open');b.setAttribute('aria-expanded','true');}
-        function close(){s.classList.remove('is-open');k.hidden=true;document.body.classList.remove('nav-open');b.setAttribute('aria-expanded','false');}
-        b.addEventListener('click',function(){s.classList.contains('is-open')?close():open();});
-        k.addEventListener('click',close);
-        document.addEventListener('keydown',function(e){if(e.key==='Escape'&&s.classList.contains('is-open')){close();b.focus();}});
-        s.querySelectorAll('a').forEach(function(l){l.addEventListener('click',close);});
-        window.addEventListener('resize',function(){if(window.innerWidth>768)close();});
-    })();
-    document.addEventListener('click',function(e){
-        var btn=e.target.closest?e.target.closest('.nav-group-toggle'):null;
-        if(!btn)return;
-        var g=btn.closest('.nav-group');if(!g)return;
-        var willOpen=!g.classList.contains('is-open');
-        document.querySelectorAll('.nav-group.is-open').forEach(function(x){
-            x.classList.remove('is-open');
-            var t=x.querySelector('.nav-group-toggle');if(t)t.setAttribute('aria-expanded','false');
-        });
-        if(willOpen){g.classList.add('is-open');btn.setAttribute('aria-expanded','true');}
-    });
-    </script>
-</body>
-</html>
diff --git a/website/preview/m3/feltetelek.html b/website/preview/m3/feltetelek.html
deleted file mode 100644
index b8dc69c1..00000000
--- a/website/preview/m3/feltetelek.html
+++ /dev/null
@@ -1,312 +0,0 @@
-<!DOCTYPE html>
-<html lang="hu" class="no-js">
-<head>
-    <script>document.documentElement.className=document.documentElement.className.replace('no-js','js');</script>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>A zárt teszt feltételei | Felhom.eu</title>
-    <meta name="description" content="Mit kapsz a Felhom.eu ingyenes zárt tesztjében, mit nem ígérünk, és hogyan tudsz bármikor kiszállni.">
-    <meta name="robots" content="index, follow">
-    <link rel="canonical" href="https://felhom.eu/feltetelek">
-    <link rel="alternate" hreflang="hu" href="https://felhom.eu/feltetelek">
-    <link rel="alternate" hreflang="x-default" href="https://felhom.eu/feltetelek">
-
-    <meta property="og:type" content="article">
-    <meta property="og:url" content="https://felhom.eu/feltetelek">
-    <meta property="og:title" content="A zárt teszt feltételei — Felhom.eu">
-    <meta property="og:description" content="Mit kapsz a Felhom.eu ingyenes zárt tesztjében, mit nem ígérünk, és hogyan tudsz bármikor kiszállni.">
-    <meta property="og:image" content="https://felhom.eu/assets/og-image.png">
-    <meta property="og:locale" content="hu_HU">
-    <meta property="og:site_name" content="Felhom.eu">
-
-    <!-- shared assets: bump ?v= together on any site.css/icons.svg change -->
-    <link rel="stylesheet" href="/assets/site.css?v=21">
-    <link rel="stylesheet" href="/assets/shell.css?v=21">
-    <link rel="icon" type="image/png" href="/assets/logo_favicon_2.svg">
-    <script defer src="https://stats.felhom.eu/script.js" data-website-id="d419db57-5e1c-48df-bdb3-c29f25fb1661"></script>
-</head>
-<body class="shell page-feltetelek">
-    <header class="mobile-topbar">
-        <a href="/preview/m3/" class="mobile-topbar-logo"><img src="/assets/logo_notext_white.svg" alt="Felhom.eu"></a>
-        <button type="button" class="nav-burger" id="navBurger" aria-expanded="false" aria-controls="sidebar" aria-label="Menü">
-            <span class="hamburger-box"><span class="hamburger-line"></span><span class="hamburger-line"></span><span class="hamburger-line"></span></span>
-        </button>
-    </header>
-    <div class="nav-backdrop" id="navBackdrop" hidden></div>
-    <nav class="sidebar" id="sidebar">
-        <div class="sidebar-header">
-            <a href="/preview/m3/" class="sidebar-logo-link">
-                <img src="/assets/logo_notext_white.svg" alt="" class="sidebar-logo" aria-hidden="true">
-                <img src="/assets/logo-wordmark.png" alt="felhom.eu" class="sidebar-word">
-            </a>
-        </div>
-        <ul class="nav-links">
-                <li><a href="/preview/m3/"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg>Kezdőlap</a></li>
-                <li><a href="/preview/m3/#szolgaltatasok"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rocket"/></svg>Szolgáltatások</a></li>
-                <li class="nav-group">
-                    <button type="button" class="nav-group-toggle" aria-expanded="false" aria-controls="nav-group-apps"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg>Alkalmazások<svg class="ico nav-chevron" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chevron-down"/></svg></button>
-                    <ul id="nav-group-apps" class="nav-links nav-links-sub nav-links-nested">
-                        <li><a href="/preview/m3/alkalmazasok">Minden alkalmazás</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#fajlkezeles-irodai">Fájlkezelés &amp; Irodai</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#media-szorakozas">Média &amp; Szórakozás</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#otthon-eletmod">Otthon &amp; Életmód</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#produktivitas-tudaskezeles">Produktivitás &amp; Tudáskezelés</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#rendszer-fejlesztes">Rendszer &amp; Fejlesztés</a></li>
-                    </ul>
-                </li>
-                <li><a href="/preview/m3/technologiak"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg>Technológiák</a></li>
-                <li><a href="/preview/m3/biztonsagimentes"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg>Biztonsági mentés</a></li>
-        </ul>
-        <div class="sidebar-bottom">
-            <a href="/preview/m3/teszteles" class="btn btn-outline sidebar-cta">Jelentkezem tesztelőnek →</a>
-            <div class="nav-group-label">A Felhomról</div>
-            <ul class="nav-links nav-links-sub">
-                    <li><a href="/preview/m3/#hogyan-mukodik">Hogyan működik</a></li>
-                    <li><a href="/preview/m3/gyik">GYIK</a></li>
-                    <li><a href="/preview/m3/kapcsolat">Kapcsolat</a></li>
-            </ul>
-            <div class="sidebar-footer">
-                <details class="lang-globe"><summary class="lang-globe-btn" aria-label="Nyelv" title="Nyelv"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/preview/m3/feltetelek" lang="hu" hreflang="hu" class="lang-globe-item current" aria-current="true">Magyar</a></li><li><a href="#" lang="en" hreflang="en" class="lang-globe-item">English</a></li></ul></details>
-            </div>
-        </div>
-    </nav>
-<main class="content">
-
-
-        <header class="page-header">
-        <div class="container">
-            <h1>A zárt teszt feltételei</h1>
-            <p>Rövid és őszinte: mit kapsz, mit nem ígérünk, és hogyan tudsz kiszállni.</p>
-        </div>
-    </header>
-
-    <section class="section">
-        <div class="container legal">
-
-            <p class="legal-version"><strong>Zárt teszt — 1.1 verzió, hatályos: 2026. október 10.</strong></p>
-
-            <h2>1. Ki vagyunk</h2>
-            <!-- source: operator ruling 2026-10-09 (no company yet) -->
-            <p>
-                A Felhomot <strong>Nagyfenyvesi Viktor</strong> magánszemélyként működteti. A Felhom ma még
-                <strong>nem cég</strong>. Elérhetőség: <a href="mailto:info@felhom.eu">info@felhom.eu</a>.
-            </p>
-
-            <h2>2. Mi ez</h2>
-            <p>
-                Ez egy <strong>ingyenes zárt teszt</strong> egy otthoni szerver szolgáltatásról. Néhány magyar
-                háztartással próbáljuk ki, hogy működik-e a gyakorlatban. Nem termék, amit megvettél — egy
-                teszt, amiben részt veszel.
-            </p>
-
-            <h2>3. Mit kapsz a teszt alatt</h2>
-            <!-- source: DRAFT-aszf.md §3, limited to the items the system does today -->
-            <ul>
-                <li>Egy <strong>otthoni szervert beállítunk</strong> nálad, és működőképes állapotba hozzuk.
-                    <!-- source: documentation/architecture/01-topology-and-trust.md:182-183 --></li>
-                <li><strong>Alkalmazásokat telepítünk</strong> rá a katalógusunkból, a vezérlőpulton keresztül.
-                    <!-- source: documentation/architecture/01-topology-and-trust.md:85 --></li>
-                <li>Az alkalmazások <strong>elérhetők lesznek az interneten</strong> is.
-                    <!-- source: documentation/architecture/01-topology-and-trust.md:202-215 --></li>
-                <li><strong>Figyeljük a szervert.</strong> Ha baj van, szólunk.
-                    <!-- source: documentation/architecture/05-hub-architecture.md:71-103, :308-318 --></li>
-                <li><strong>Mentés készül</strong> több szinten: a szerveren, és titkosítva egy távoli tárhelyen is.
-                    A részleteket az <a href="/adatkezeles">Adatkezelési tájékoztató</a> 7. pontja írja le.
-                    <!-- source: documentation/architecture/07-backup-architecture.md:373-379 --></li>
-                <li><strong>Frissítjük</strong> az alkalmazásokat és a rendszert, jellemzően éjszaka, egy általad
-                    beállítható időablakban.
-                    <!-- source: documentation/architecture/07-backup-architecture.md:420 --></li>
-            </ul>
-
-            <h2>4. A domain</h2>
-            <!-- source: operator ruling D1, 2026-10-10 (CONTEXT.md); documentation/architecture/01-topology-and-trust.md §7 -->
-            <p>
-                A szerveredet és az alkalmazásaidat a <strong>saját domainedről</strong> érjük el, nem egy
-                felhom.eu alatti névről. A vezérlőpultod <code>felhom.a-te-domained.hu</code>, minden alkalmazás
-                pedig egy saját aldomain.
-            </p>
-            <ul>
-                <li><strong>A domain a te nevedre szól.</strong> Nem a mi nevünkre vesszük meg — a tiéd.</li>
-                <li><strong>A díját a teszt alatt mi fizetjük, két évre.</strong></li>
-                <li><strong>Ha a teszt véget ér, vagy ha kiszállsz, a domain nálad marad</strong>, és onnantól
-                    te fizeted tovább. Nem kérjük vissza, és nem visszük magunkkal.</li>
-                <li>A domain DNS-beállításait a teszt alatt mi kezeljük, egy olyan hozzáféréssel, ami
-                    <strong>kizárólag ezt az egy domaint látja</strong>.</li>
-            </ul>
-
-            <h2>5. Mit nem ígérünk</h2>
-            <p>Ezt fontos elolvasni, mert egy teszt nem ugyanaz, mint egy kész szolgáltatás.</p>
-            <ul>
-                <li><strong>Nincs díj</strong> a teszt alatt — se tőled, se felénk. Árat nem ajánlunk és nem kérünk.</li>
-                <li><strong>Nem ígérünk rendelkezésre állást.</strong> A szerver leállhat, és előfordulhat, hogy nem
-                    vesszük észre azonnal.</li>
-                <li><strong>Nem ígérünk válaszidőt.</strong> Igyekszünk gyorsan segíteni, de határidőt nem vállalunk.</li>
-                <li><strong>Nem garantáljuk, hogy minden fájl visszaállítható.</strong> Mentés készül, és teszteljük
-                    is, de egy teszt alatt bármi elromolhat.</li>
-            </ul>
-            <p class="legal-callout">
-                <strong>Ezért kérünk valamit:</strong> amit nem veszíthetsz el, abból tarts meg egy saját
-                másolatot magadnál is. Ne a teszt legyen az egyetlen helye.
-            </p>
-
-            <h2>6. Hozzáférünk a szerveredhez</h2>
-            <p>
-                <strong>Rendszergazdai (root) hozzáférésünk van a szerverhez.</strong> Ez kell a frissítésekhez,
-                a mentés ellenőrzéséhez és a hibák javításához. Ezzel a szerveren lévő adatok elérhetők. Csak
-                üzemeltetésre és hibaelhárításra használjuk.
-            </p>
-            <!-- source: documentation/architecture/07-backup-architecture.md:49-52 -->
-            <p>
-                A veszélyes, adatvesztéssel járó műveletekhez a rendszerünk külön aláírást kér, és a szerver
-                maga kezdeményezi a kapcsolatot felénk.
-            </p>
-            <!-- source: documentation/architecture/01-topology-and-trust.md:97-105 (box-initiated control, signed jobs) -->
-
-            <h2>7. A mentésed kulcsa nálad van</h2>
-            <p>
-                A távoli mentésed titkosítva készül. A kulcsát egy <strong>helyreállító kód</strong> zárja, amit
-                csak te ismersz — nálunk nincs meg, és nem tudjuk pótolni. <strong>Ha elveszíted, a távoli
-                mentésed nem nyitható ki.</strong> Tedd el jól.
-            </p>
-            <!-- source: documentation/architecture/07-backup-architecture.md:67-83 -->
-
-            <h2>8. Az alkalmazások nem a mieink</h2>
-            <p>
-                A katalógusunkban mások által írt, nyílt forráskódú programok vannak. Ezeket nem mi adjuk el és
-                nem mi írtuk; mindegyikre a <strong>saját licencfeltételei</strong> vonatkoznak, és azok rád is
-                érvényesek.
-            </p>
-            <!-- source: DRAFT-aszf.md §5.4; documentation/backlog/OPEN-ITEMS.md (R-802 non-OSI licence list) -->
-
-            <h2>9. Az adataid a tieid</h2>
-            <p>
-                A szervereden lévő adatok és alkalmazások a tieid. Nem tartjuk vissza őket: a teszt után is
-                visszaállíthatók a helyreállító kódoddal.
-            </p>
-            <!-- source: documentation/architecture/01-topology-and-trust.md:300-302 ("Never hold data hostage") -->
-
-            <h2>10. Ha ki akarsz szállni</h2>
-            <p>
-                <strong>Bármikor abbahagyhatod</strong>, indoklás nélkül. Írj egy e-mailt az
-                <a href="mailto:info@felhom.eu">info@felhom.eu</a> címre, és leállítjuk.
-            </p>
-            <p>Ami ezután az adataiddal nálunk történik:</p>
-            <ul>
-                <li>a teljes szervermentésed a mentőszerverünkön a törléseddel <strong>törlődik</strong>;</li>
-                <li>ennek nálunk tárolt másolata <strong>legfeljebb 30 napon belül</strong> törlődik — ezt egy
-                    naponta futó feladat végzi;
-                    <!-- source: MEASURED 2026-10-09 on DooPlex: felhom-ep0-copy-gc.timer active, last run Fri 2026-10-09 08:00 CEST, Result=success, ExecMainStatus=0 --></li>
-                <li>a kiküldött értesítések naplója a törlésed után <strong>1 évig</strong> marad meg, aztán törlődik;</li>
-                <li>a visszaállítások és a szervertörlés naplóját <strong>megőrizzük</strong>, hogy utólag is
-                    látható legyen, ki mit tett.</li>
-            </ul>
-            <p>A részletes lista az <a href="/adatkezeles">Adatkezelési tájékoztató</a> 6. és 7. pontjában van.</p>
-
-            <h2>11. Ha változnak a feltételek</h2>
-            <p>
-                Ezek a feltételek változhatnak. Ha lényeges változás lesz, a teszt résztvevőinek
-                <strong>előtte e-mailt küldünk</strong>, és a tetején lévő verziószámot megemeljük.
-            </p>
-
-            <h2>12. Kapcsolat</h2>
-            <p>
-                <a href="mailto:info@felhom.eu">info@felhom.eu</a> — adatkezelés:
-                <a href="/adatkezeles">Adatkezelési tájékoztató</a>.
-            </p>
-
-        </div>
-    </section>
-    <script>
-    (function() {
-        var hamburger = document.getElementById('hamburger');
-        var navLinks = document.querySelector('.nav-links');
-        var overlay = document.getElementById('mobileOverlay');
-        var body = document.body;
-
-        if (!hamburger || !navLinks || !overlay) {
-            console.warn('[mobile-menu] Missing elements:', {
-                hamburger: !!hamburger,
-                navLinks: !!navLinks,
-                overlay: !!overlay
-            });
-            return;
-        }
-
-        function openMenu() {
-            hamburger.classList.add('is-active');
-            navLinks.classList.add('is-open');
-            overlay.classList.add('is-visible');
-            body.classList.add('menu-open');
-            hamburger.setAttribute('aria-expanded', 'true');
-            hamburger.setAttribute('aria-label', 'Menü bezárása');
-        }
-
-        function closeMenu() {
-            hamburger.classList.remove('is-active');
-            navLinks.classList.remove('is-open');
-            overlay.classList.remove('is-visible');
-            body.classList.remove('menu-open');
-            hamburger.setAttribute('aria-expanded', 'false');
-            hamburger.setAttribute('aria-label', 'Menü megnyitása');
-        }
-
-        hamburger.addEventListener('click', function() {
-            if (navLinks.classList.contains('is-open')) {
-                closeMenu();
-            } else {
-                openMenu();
-            }
-        });
-
-        overlay.addEventListener('click', closeMenu);
-
-        navLinks.querySelectorAll('a').forEach(function(link) {
-            link.addEventListener('click', closeMenu);
-        });
-
-        document.addEventListener('keydown', function(e) {
-            if (e.key === 'Escape' && navLinks.classList.contains('is-open')) {
-                closeMenu();
-            }
-        });
-
-        window.addEventListener('resize', function() {
-            if (window.innerWidth > 900 && navLinks.classList.contains('is-open')) {
-                closeMenu();
-            }
-        });
-    })();
-    </script>
-<footer>
-        <div class="container">
-            <p>© 2026 felhom.eu – Saját felhőd, saját szabályaid</p>
-            <p class="footer-legal">Üzemeltető: Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Adatkezelési tájékoztató</a> · <a href="/feltetelek">Feltételek</a></p>
-        </div>
-    </footer>
-    </main>
-    <script>
-    (function(){
-        var b=document.getElementById('navBurger'),s=document.getElementById('sidebar'),k=document.getElementById('navBackdrop');
-        if(!b||!s||!k)return;
-        function open(){s.classList.add('is-open');k.hidden=false;document.body.classList.add('nav-open');b.setAttribute('aria-expanded','true');}
-        function close(){s.classList.remove('is-open');k.hidden=true;document.body.classList.remove('nav-open');b.setAttribute('aria-expanded','false');}
-        b.addEventListener('click',function(){s.classList.contains('is-open')?close():open();});
-        k.addEventListener('click',close);
-        document.addEventListener('keydown',function(e){if(e.key==='Escape'&&s.classList.contains('is-open')){close();b.focus();}});
-        s.querySelectorAll('a').forEach(function(l){l.addEventListener('click',close);});
-        window.addEventListener('resize',function(){if(window.innerWidth>768)close();});
-    })();
-    document.addEventListener('click',function(e){
-        var btn=e.target.closest?e.target.closest('.nav-group-toggle'):null;
-        if(!btn)return;
-        var g=btn.closest('.nav-group');if(!g)return;
-        var willOpen=!g.classList.contains('is-open');
-        document.querySelectorAll('.nav-group.is-open').forEach(function(x){
-            x.classList.remove('is-open');
-            var t=x.querySelector('.nav-group-toggle');if(t)t.setAttribute('aria-expanded','false');
-        });
-        if(willOpen){g.classList.add('is-open');btn.setAttribute('aria-expanded','true');}
-    });
-    </script>
-</body>
-</html>
diff --git a/website/preview/m3/gyik.html b/website/preview/m3/gyik.html
deleted file mode 100644
index cd3eb7bf..00000000
--- a/website/preview/m3/gyik.html
+++ /dev/null
@@ -1,1090 +0,0 @@
-<!DOCTYPE html>
-<html lang="hu" class="no-js">
-<head>
-    <script>document.documentElement.className=document.documentElement.className.replace('no-js','js');</script>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>GYIK — Gyakran ismételt kérdések otthoni szerver szolgáltatásról | Felhom.eu</title>
-    <meta name="description" content="Válaszok a leggyakoribb kérdésekre: hardver, telepítés, alkalmazások, biztonság, mentések, költségek. Minden, amit az otthoni szerver szolgáltatásunkról tudni érdemes.">
-
-    <meta name="keywords" content="GYIK, gyakran ismételt kérdések, otthoni szerver kérdések, self-hosting FAQ, szerver költségek, szerver biztonság">
-    <meta name="robots" content="index, follow">
-    <link rel="canonical" href="https://felhom.eu/gyik">
-    <link rel="alternate" hreflang="hu" href="https://felhom.eu/gyik">
-    <link rel="alternate" hreflang="en" href="https://felhom.eu/en/faq">
-    <link rel="alternate" hreflang="x-default" href="https://felhom.eu/gyik">
-
-    <meta property="og:type" content="website">
-    <meta property="og:url" content="https://felhom.eu/gyik">
-    <meta property="og:title" content="GYIK — Otthoni szerver szolgáltatás kérdések és válaszok">
-    <meta property="og:description" content="Hardver, telepítés, alkalmazások, biztonság, költségek — minden, amit tudni érdemes.">
-    <meta property="og:image" content="https://felhom.eu/assets/og-image.png">
-    <meta property="og:locale" content="hu_HU">
-    <meta property="og:site_name" content="Felhom.eu">
-
-    <meta name="twitter:card" content="summary">
-    <meta name="twitter:title" content="GYIK — Otthoni szerver kérdések és válaszok">
-    <meta name="twitter:description" content="Minden, amit az otthoni szerver szolgáltatásról tudni érdemes.">
-    <meta name="twitter:image" content="https://felhom.eu/assets/og-image.png">
-
-    <script type="application/ld+json">
-    {
-      "@context": "https://schema.org",
-      "@type": "FAQPage",
-      "mainEntity": [
-        {
-          "@type": "Question",
-          "name": "Mi az a Felhom.eu, és mit csináltok pontosan?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "A Felhom.eu egy olyan szolgáltatást nyújt, amely segít az otthoni szerver(ek) telepítésében és üzemeltetésében. Kulcsrakész megoldásokat kínálunk: megválasztjuk a hardvert, beállítjuk a szoftvereket, biztosítjuk a mentéseket, és folyamatosan figyelemmel kísérjük a rendszert. A cél egyszerű: a nagy felhőszolgáltatók (Google, Microsoft, Apple) helyett a saját otthonodban futó szerveren tárolhatod az adataidat – anélkül, hogy neked kellene szakértőnek lenned."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Kinek való ez a szolgáltatás?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "Mindenkinek, aki szeretné visszavenni az irányítást a digitális élete felett. Tipikus ügyfeleink: Családok, akik szeretnék a fotóikat, videóikat biztonságban tudni, és nem akarnak havonta fizetni a felhőtárhelyért. Adatvédelem-tudatos felhasználók, akik nem akarják, hogy a Google vagy a Microsoft hozzáférjen a dokumentumaikhoz. Médiarajongók, akik saját Netflix/Spotify-szerű rendszert szeretnének a filmjeikhez és zenéjükhöz. Kisvállalkozások, amelyeknek szükségük van dokumentumkezelésre, belső wikire, vagy időpontfoglalásra – saját kontroll alatt."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Kell hozzá bármilyen technikai tudás?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "Nem. A teljes telepítést és beállítást mi végezzük. A te dolgod annyi, hogy használod az alkalmazásokat – böngészőn vagy mobilon keresztül, pont úgy, mint egy Google vagy Apple szolgáltatást. A telepítés után egy rövid bemutatón végigvezetünk, hogy magabiztosan használd a rendszert."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Mi a különbség a Felhom.eu és a Synology/QNAP NAS szolgáltatásai között?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "A Synology és QNAP elsősorban fájltárolásra készült NAS (hálózati adattároló) eszközök, saját zárt szoftverrel. Mi ezzel szemben egy nyílt, Docker-alapú rendszert kínálunk, amelyre a katalógus alkalmazásai pár kattintással telepíthetők – fotókezelőtől a média szerveren át a jelszókezelőig. A NAS-ok korlátozott alkalmazás-választékot kínálnak és a gyártó szoftverfrissítéseitől függenek. Nálunk 58 alkalmazásból válogathatsz, és ha valami hiányzik, megnézzük, felvehető-e."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Hogyan néz ki a folyamat az elejétől a végéig?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "1. Egyeztetés – Megbeszéljük, mire van szükséged: milyen alkalmazásokat használnál, mennyi tárhelyet szeretnél, és mi a költségkereted. 2. Hardver kiválasztás – Segítünk megtalálni az optimális gépet, ami illeszkedik az igényeidhez és a büdzsédhez. 3. Telepítés és beállítás – Feltelepítjük az operációs rendszert, a konténerkezelőt, az alkalmazásokat, beállítjuk a mentéseket és a monitoringot. 4. Átadás és betanítás – Bemutatjuk, hogyan használd a rendszert, és válaszolunk minden kérdésedre. 5. Folyamatos üzemeltetés – Figyeljük a mentéseket, karbantartjuk a rendszert, és segítünk, ha bármi gond van."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Milyen gépre van szükségem?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "A legtöbb otthoni felhasználónak egy mini PC (pl. Intel N100 processzorral, 16-32 GB RAM-mal) tökéletesen megfelel. Ezek csendesek, energiatakarékosak (15-35W fogyasztás), és kompaktak – elfér a polcon a router mellett. Ha nagyobb tárhelyet szeretnél (pl. filmes könyvtárhoz), egy NAS-al vagy külső merevlemezekkel bővíthető. Részletesebb konfigurációkat a Technológiák oldalon találsz."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Használhatom a már meglévő régi gépemet?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "Sok esetben igen! Egy korábbi asztali PC kiváló szerver lehet. Az egyeztetés során felmérjük, hogy a meglévő géped alkalmas-e a tervezett feladatokra (elég RAM, tároló kapacitás, megbízhatóság). Fontos szempont a fogyasztás és a zajszint – egy régi gamer PC működik ugyan, de havi szinten jóval többet fogyaszt, mint egy modern mini PC."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Hova kell tenni a szervert?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "Bárhova, ahol van áramcsatlakozó és hálózati kábel (ethernet). A legjobb hely egy szekrény, polc, vagy a router melletti terület. A mini PC-k annyira kompaktak és csendesek, hogy a nappali polcán is elférnek. WiFi-n is működhet, de a megbízhatóság és sebesség érdekében mindig kábeles kapcsolatot javaslunk."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Mennyi áramot fogyaszt egy ilyen szerver?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "Egy modern mini PC tipikusan 15-35 watt körül fogyaszt terhelés alatt, ami éves szinten nagyjából 5.000–15.000 Ft villanyszámlát jelent (a tarifától függően). Ez kevesebb, mint egy izzó, és töredéke annak, amit egy felhőszolgáltatás éves előfizetése költene."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Mennyire hangos egy ilyen szerver?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "A mini PC-k szinte hangtalan működnek – sok modell ventilátort sem tartalmaz, vagy csak néha kapcsol be rövid időre. Hétköznapi használat mellett nyugodtan tarthatod az íróasztalon vagy a hálószoba polcán. A tower szerverek és rack szervereknél ez már más – ezeket inkább pincébe, kamrába érdemes helyezni."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Mi történik, ha elmegy az áram?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "A telepítés során a szerver BIOS-át úgy konfiguráljuk (amennyiben az opció rendelkezésre áll), hogy áramszünet után automatikusan bekapcsoljon. Az operációs rendszer és az összes alkalmazás szintén automatikusan elindul a bekapcsolást követően. Ez a beállítás minden telepítésünk alapértelmezett része. Áramszünet után a doboz magától helyreáll – ezt valódi áramszünettel is kipróbáltuk. Ha a megbízhatóság kritikus, szünetmentes tápegységet (UPS) is tudunk javasolni, ami néhány perc szünet áthidalására elegendő."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Milyen internet kapcsolat szükséges?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "Otthoni használathoz (helyi hálózaton belül) bármilyen internet elég, mert az alkalmazások a helyi hálózatodon futnak – nem az interneten keresztül. A fotók, filmek, dokumentumok sebessége a routeredtől és a kábeles kapcsolattól függ. Ha távolról is el szeretnéd érni a szerveredet (pl. munkahelyről vagy nyaralásból), akkor a feltöltési sebesség (upload) számít: minimum 10 Mbps ajánlott, de minél több, annál jobb."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Milyen alkalmazásokat tudok futtatni?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "58 alkalmazást kínálunk – a teljes listát az Alkalmazások oldalon találod. Néhány példa: Immich – Google Photos alternatíva fotók és videók automatikus mentésével. Jellyfin/Plex – saját Netflix filmekhez és sorozatokhoz. Nextcloud – fájlok tárolása és megosztása (Google Drive helyett). Vaultwarden – jelszókezelő az egész családnak. Paperless-ngx – dokumentumok digitalizálása és kereshetővé tétele. Ha valami nincs a listán, kérdezz – megnézzük, felvehető-e a katalógusba."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Tudok később új alkalmazásokat hozzáadni?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "Igen, bármikor! A vezérlőpultból bármelyik alkalmazás telepíthető, pár kattintással. Ha elakadsz, szólj, és segítünk beállítani."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Telefonról is elérem az alkalmazásokat?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "Igen! A legtöbb alkalmazás böngészőből is tökéletesen használható telefonon. Sok alkalmazásnak emellett dedikált mobilalkalmazása is van (iOS és Android egyaránt). Például az Immich, Nextcloud, Jellyfin, és Vaultwarden mind rendelkeznek kiváló mobil appokkal."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Több családtag is használhatja egyszerre?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "Igen, de érdemes tudni a jelenlegi korlátot. A telepített alkalmazások többsége (Immich, Nextcloud, Vaultwarden) támogatja a többfelhasználós működést: bennük minden családtag saját fiókot kaphat, saját bejelentkezéssel. A Felhom vezérlőpulthoz viszont jelenleg egy közös háztartási jelszó tartozik – külön családtagi fiókok a vezérlőpulton még nincsenek. A vezérlőpult az, ahonnan alkalmazást telepítesz és a mentéseket kezeled; a mindennapi használathoz (fotók, fájlok) az alkalmazások saját fiókjai kellenek."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Át tudom hozni a meglévő adataimat (Google Fotók, iCloud, Dropbox)?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "Igen! A legtöbb szolgáltatásból exportálhatók az adatok. A Google Takeout segítségével az összes fotódat, dokumentumodat, naptáradat letöltheted, és az Immich, Nextcloud, stb. importálni tudja ezeket. Segítünk a migrációban. A folyamat időigénye az adatmennyiségtől függ – néhány száz GB-nyi fotó átvitele akár egy-két napot is igénybe vehet, de a rendszer utána pontosan úgy működik, ahogy a felhőszolgáltatásnál megszoktad."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Elérem a szerveremet, ha nem vagyok otthon?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "Igen! A doboz egy titkosított alagúton át, HTTPS-sel érhető el, külön alkalmazás nélkül. Ez azt jelenti, hogy bárhonnan – munkahelyről, nyaralásból, vagy akár külföldről – elérheted a fotóidat, fájljaidat, és minden alkalmazásodat, mintha otthon lennél."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Mennyire biztonságos egy otthoni szerver?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "Az általunk telepített rendszerek több rétegű védelmet kapnak: automatikus HTTPS titkosítás, rendszeres biztonsági frissítések, saját bejelentkezés minden alkalmazásban, és egyes alkalmazások előtt családi kapu. A szervered a te otthonodon belül van – otthon nem nyitunk portot, kívülről csak egy titkosított alagúton keresztül érhető el. A legtöbb otthoni szerver ellen nem célzott támadások szoktak irányulni, hanem automatizált szkriptek próbálkoznak. Ezek ellen a megfelelő konfiguráció kiváló védelmet nyújt."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Ti hozzáfértek az adataimhoz?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "Ez egy fontos és jogos kérdés, amire őszintén válaszolunk. A támogatás és karbantartás érdekében alapesetben rendelkezünk távoli hozzáféréssel a szerveredhez – ahogy bármely IT szolgáltató a kezelt rendszerekhez. Ez szükséges a mentések ellenőrzéséhez, frissítések telepítéséhez, és hibaelhárításhoz. A távoli mentésed kulcsát viszont csak te ismered: a helyreállítási kód egyszer jelenik meg, a te képernyődön, és nálunk nem marad belőle másolat. A távoli mentést így mi sem tudjuk elolvasni. Fontos: szemben a nagy felhőszolgáltatókkal, nálunk nincs algoritmikus adatelemzés, nincs reklámcélú profilozás, és az adataid csak titkosítva hagyják el az otthonodat (a távoli mentés)."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Mi van, ha betörnek a hálózatomba?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "A szerver alkalmazásai izolált konténerekben futnak, ami korlátozza a kár mértékét, ha egy alkalmazás sérülékeny lenne. A rendszeres frissítések, és hogy otthon nincs nyitott port, csökkentik a kockázatot. A mentéseidből egy titkosított másolat külön helyen (offsite) is tárolódik – így egy zsarolóvírus-támadás után is van egy távol tárolt másolat."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "GDPR szempontból ez rendben van?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "Személyes, otthoni használatra a GDPR nem vonatkozik közvetlenül (a „háztartási kivétel\" alapján). Az adataid otthon, a saját dobozodon vannak. A mentések másolatait a doboz titkosítja, mielőtt elhagynák az otthonodat; ezeket a Hetzner tárolja az EU-ban (Németországban), és a tárhely üzemeltetője nem tudja elolvasni őket. A távoli elérés a Cloudflare hálózatán keresztül megy, így a Cloudflare technikailag láthatja ezt a forgalmat. Ha kisvállalkozásként használod, az adatkezelési tájékoztatóban leírjuk, ki mit kezel és hol. Természetesen nem vagyunk jogi tanácsadók, konkrét jogi kérdésekben szakembert érdemes keresni."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Hogyan oldják meg a mentéseket?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "A 3-2-1 mentési szabályt követjük: 3 másolat az adatokról, 2 különböző tárolón, 1 távoli helyen. Ez iparági szabvány, amit a legnagyobb cégek is alkalmaznak. A dobozon ez három szint: egy mentés a dobozon, egy másodpéldány egy második meghajtón, és egy titkosított másolat egy távoli tárhelyen. A mentések automatikusan, éjszaka futnak. Az adatbázisok és fájlok inkrementálisan mentődnek – tehát csak a változások kerülnek mentésre, ami helyet és időt takarít meg. Részletes leírást a Mentések oldalon találsz."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Mi történik, ha meghibásodik a merevlemez?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "Ezért vannak a mentések! A második meghajtón és a távoli tárhelyen lévő másolatokból az alkalmazásaid adatai visszahozhatók. A doboz figyeli a lemezek állapotát és a szabad helyet, és előre figyelmeztet, ha probléma van."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Honnan tudom, hogy a mentések valóban működnek?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "Központi monitoring rendszert üzemeltetünk, amely minden nap ellenőrzi, hogy a mentések sikeresen lefutottak-e. Ha bármi probléma van – sikertelen mentés, tárhelyhiány, vagy a szerver nem elérhető – azonnal értesítést kapunk, és szükség esetén te is. Ez nem egy „beállítom és remélem működik\" megoldás – aktívan figyeljük, és időszakosan visszaállítási teszteket is végzünk."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Mi az az „offsite backup\"?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "Az offsite (távoli) backup azt jelenti, hogy az adataidról egy másolat fizikailag más helyen is megvan. A Felhom dobozon ez egy általunk biztosított tárhely, ahova a másolat titkosítva kerül. Ha otthon bármi katasztrófa történne (tűz, lopás, vízkár), a távoli másolat akkor is megmarad. Az offsite mentés mindig titkosítva történik – a távoli helyen senki nem tudja elolvasni az adataidat, még ha hozzáfér is a fájlokhoz."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Mi történik a telepítés után? Magamra maradok?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "Nem! A Felhom.eu nem egy „telepítem és távozom\" szolgáltatást nyújt. Folyamatos üzemeltetést biztosítunk: monitorozás, szoftverfrissítések, mentés-ellenőrzés, és támogatás, ha bármi kérdésed vagy problémád van."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Hogyan történik a szoftverfrissítés?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "Az alkalmazások konténerekben futnak, ami megkönnyíti a frissítést. Mi figyelemmel kísérjük az új verziókat, és egy új verzió csak akkor jut el hozzád, ha előbb kipróbáltuk. A doboz rendszere a biztonsági frissítéseket magától megkapja. Minden alkalmazásfrissítés előtt friss mentés készül, és ha az új verzió nem indul el rendesen, a doboz magától visszaállítja az előzőt, az adataiddal együtt."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Hogyan kérjek segítséget, ha valami nem működik?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "Egyszerűen írj emailt a support@felhom.eu címre. A legtöbb problémát távolról, a te közreműködésed nélkül meg tudjuk oldani. Komolyabb hardveres kérdéseknél személyesen is segítünk."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Mi van, ha fel akarom mondani a szolgáltatást?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "A szerver és az összes adat a tiéd – mindig is az volt. Ha úgy döntesz, hogy nem kéred tovább a szolgáltatást, a doboz az otthoni hálózaton tovább működik, de nem kapod a frissítéseket, a felügyeletet és a támogatást. A távoli elérés és a távoli mentés a szolgáltatás része: hogy mi lesz velük, azt a felmondáskor egyeztetjük. Nincs hűségidő, nincs felmondási díj. Ha van technikai tudásod (vagy időközben szereztél), akár magad is üzemeltetheted tovább a rendszert. Az adatok és az alkalmazások nálad maradnak."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Mi történik, ha a Felhom.eu megszűnik?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "A szervered és az adataid a tiéd. Az alkalmazások szinte mind nyílt forráskódúak, ami azt jelenti, hogy bárki más is üzemeltetheti őket – nem függsz egyetlen szolgáltatótól sem. Ez éppen az egyik legnagyobb előnye a nyílt forráskódú megoldásoknak: nincs vendor lock-in. Ezzel szemben, ha a Google vagy az Apple megszünteti egy szolgáltatását, az adataid velük együtt tűnnek el."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Mi van, ha elköltözöm?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "A szervered egy kompakt doboz – lecsatlakoztatod, átviszed az új lakásba, becsatlakoztatod, és minden megy tovább. Ha változik az internet szolgáltatód, lehet, hogy a távoli elérés konfigurációját frissíteni kell – ebben segítünk."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Mennyibe kerül az egész?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "A költség két részből áll: Egyszeri költségek: A hardver ára (80.000–400.000+ Ft, konfigurációtól függően) és a telepítési díj. A hardvert te vásárolod meg – a tiéd, örökre. Havi üzemeltetési díj: A monitoring, támogatás, frissítések, és mentés-felügyelet díja. Ez a kiválasztott csomagtól függ. Pontos árajánlatot az egyeztetés után adunk – mert az igények nagyon eltérőek lehetnek. Írj nekünk, és személyre szabott ajánlatot készítünk!"
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Megéri anyagilag a felhőszolgáltatásokhoz képest?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "Hosszú távon szinte mindig. Egy tipikus példa: Google One 2TB évi ~36.000 Ft, iCloud 2TB évi ~45.000 Ft, Spotify család évi ~30.000 Ft, jelszókezelő évi ~15.000 Ft. Ezek együtt évi 120.000+ Ft – és ez csak néhány szolgáltatás. Egy mini PC-s szerver 2-3 év alatt „behozza\" az árát, és utána gyakorlatilag csak áramot fizetsz. Emellett korlátlan tárhelyed van – nem 2 TB, hanem amennyit a lemezeid bírnak."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Vannak rejtett költségek?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "Nincsenek. A felmerülő költségek: hardver (egyszeri), telepítés (egyszeri), havi üzemeltetés (opcionális), és villanyáram (havi néhány ezer forint). Az alkalmazások ingyenesen használhatók, és szinte mind nyílt forráskódú – nincs licencdíj az alkalmazásokért. (Néhánynak van fizetős extrája, például a Plex Pass; ez választható.) A távoli mentés tárhelyének van havi költsége, ami a mentett adatmennyiségtől függ – ezt az ajánlatban előre leírjuk."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Milyen operációs rendszer fut a szerveren?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "A szerver alapja a Proxmox VE – egy professzionális, Debian-alapú virtualizációs rendszer, amelyre a teljes Felhom rendszert építjük. Az alkalmazásaid Docker konténerekben futnak egy elkülönített rendszerkörnyezetben, a Proxmox alapra telepítve. Így a teljes rendszerkörnyezet is menthető, és ebből visszaállítható."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Mi az a Proxmox, és miért használjátok?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "A Proxmox egy professzionális virtualizációs alap – ugyanaz a fajta technológia, amelyet adatközpontok és cégek használnak. Minden Felhom dobozon ott van, csendben a háttérben; neked nem kell vele foglalkoznod. Ez teszi lehetővé a legfontosabb biztonsági funkciókat: Mentés frissítés előtt – egy alkalmazás frissítése előtt friss mentés készül, és ha az új verzió nem indul el, a doboz magától visszaállítja az előzőt. Az egész rendszer menthető és visszaállítható – nem csak az adataid, hanem a teljes dobozod is mentésbe kerül. Tiszta elkülönítés – a kezelőréteg és az alkalmazásaid elkülönítve futnak, így stabilabb és biztonságosabb a rendszer."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Mi az a Docker / konténer?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "A konténer egy „doboz\", amiben egy alkalmazás és minden függősége együtt él. Gondolj rá úgy, mintha minden alkalmazás a saját kis lakásában élne – nem zavarják egymást, egyszerű frissíteni vagy eltávolítani őket, és ha az egyik elromlik, a többi nem érinti. Erről bővebben a Technológiák oldalon olvashatsz."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Saját domain nevet is használhatok?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "Igen! Ha van saját domain neved (pl. enszerverem.hu), beállíthatjuk, hogy az alkalmazásaid azon keresztül legyenek elérhetők (pl. fotok.enszerverem.hu, filmek.enszerverem.hu). Ha nincs domain neved, segítünk az igényléssel – az éves költsége néhány ezer forint."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Később bővíthetem a tárhelyet?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "Igen! Egy új merevlemez vagy SSD hozzáadása a legtöbb esetben egyszerű bővítés. Akár USB-s külső meghajtóval is bővíthetsz, ha a gépedben elfogytak a helyek. A rendszer úgy van felépítve, hogy rugalmasan alkalmazkodjon a növekvő igényekhez."
-          }
-        },
-        {
-          "@type": "Question",
-          "name": "Használhatok VPN-t a szerver eléréséhez?",
-          "acceptedAnswer": {
-            "@type": "Answer",
-            "text": "Nem kell hozzá: a doboz alapból egy titkosított alagúton át, HTTPS-sel érhető el bárhonnan, külön alkalmazás nélkül. Háztartási VPN-elérést (amikor a telefonod vagy a laptopod úgy csatlakozik, mintha otthon lenne) ma nem állítunk be a dobozon. Ha erre van szükséged, kérdezz rá."
-          }
-        }
-      ]
-    }
-    </script>
-    <!-- shared assets: bump ?v= together on any site.css/icons.svg change -->
-    <link rel="stylesheet" href="/assets/site.css?v=21">
-    <link rel="stylesheet" href="/assets/shell.css?v=21">
-    <link rel="icon" type="image/png" href="/assets/logo_favicon_2.svg">
-    <script defer src="https://stats.felhom.eu/script.js" data-website-id="d419db57-5e1c-48df-bdb3-c29f25fb1661"></script>
-</head>
-<body class="shell page-gyik">
-    <header class="mobile-topbar">
-        <a href="/preview/m3/" class="mobile-topbar-logo"><img src="/assets/logo_notext_white.svg" alt="Felhom.eu"></a>
-        <button type="button" class="nav-burger" id="navBurger" aria-expanded="false" aria-controls="sidebar" aria-label="Menü">
-            <span class="hamburger-box"><span class="hamburger-line"></span><span class="hamburger-line"></span><span class="hamburger-line"></span></span>
-        </button>
-    </header>
-    <div class="nav-backdrop" id="navBackdrop" hidden></div>
-    <nav class="sidebar" id="sidebar">
-        <div class="sidebar-header">
-            <a href="/preview/m3/" class="sidebar-logo-link">
-                <img src="/assets/logo_notext_white.svg" alt="" class="sidebar-logo" aria-hidden="true">
-                <img src="/assets/logo-wordmark.png" alt="felhom.eu" class="sidebar-word">
-            </a>
-        </div>
-        <ul class="nav-links">
-                <li><a href="/preview/m3/"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg>Kezdőlap</a></li>
-                <li><a href="/preview/m3/#szolgaltatasok"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rocket"/></svg>Szolgáltatások</a></li>
-                <li class="nav-group">
-                    <button type="button" class="nav-group-toggle" aria-expanded="false" aria-controls="nav-group-apps"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg>Alkalmazások<svg class="ico nav-chevron" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chevron-down"/></svg></button>
-                    <ul id="nav-group-apps" class="nav-links nav-links-sub nav-links-nested">
-                        <li><a href="/preview/m3/alkalmazasok">Minden alkalmazás</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#fajlkezeles-irodai">Fájlkezelés &amp; Irodai</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#media-szorakozas">Média &amp; Szórakozás</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#otthon-eletmod">Otthon &amp; Életmód</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#produktivitas-tudaskezeles">Produktivitás &amp; Tudáskezelés</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#rendszer-fejlesztes">Rendszer &amp; Fejlesztés</a></li>
-                    </ul>
-                </li>
-                <li><a href="/preview/m3/technologiak"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg>Technológiák</a></li>
-                <li><a href="/preview/m3/biztonsagimentes"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg>Biztonsági mentés</a></li>
-        </ul>
-        <div class="sidebar-bottom">
-            <a href="/preview/m3/teszteles" class="btn btn-outline sidebar-cta">Jelentkezem tesztelőnek →</a>
-            <div class="nav-group-label">A Felhomról</div>
-            <ul class="nav-links nav-links-sub">
-                    <li><a href="/preview/m3/#hogyan-mukodik">Hogyan működik</a></li>
-                    <li><a href="/preview/m3/gyik" class="active">GYIK</a></li>
-                    <li><a href="/preview/m3/kapcsolat">Kapcsolat</a></li>
-            </ul>
-            <div class="sidebar-footer">
-                <details class="lang-globe"><summary class="lang-globe-btn" aria-label="Nyelv" title="Nyelv"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/preview/m3/gyik" lang="hu" hreflang="hu" class="lang-globe-item current" aria-current="true">Magyar</a></li><li><a href="/preview/m3/en/faq" lang="en" hreflang="en" class="lang-globe-item">English</a></li></ul></details>
-            </div>
-        </div>
-    </nav>
-<main class="content">
-                <div class="page-header">
-                <h1>Gyakran Ismételt <span>Kérdések</span></h1>
-            </div>
-                <p class="page-lede">Minden, amit az otthoni szerver szolgáltatásunkról tudni érdemes – egy helyen, érthetően.</p>
-
-
-        <section class="content-section" style="padding-top: 0;">
-            <div class="container">
-
-                <!-- Table of Contents -->
-                <div class="faq-toc">
-                    <h3>Kategóriák</h3>
-                    <ul class="faq-toc-links">
-                        <li><a href="#alapkerdesek">Alapkérdések</a></li>
-                        <li><a href="#hardver">Hardver & Telepítés</a></li>
-                        <li><a href="#alkalmazasok">Alkalmazások & Használat</a></li>
-                        <li><a href="#biztonsag">Biztonság & Adatvédelem</a></li>
-                        <li><a href="#mentesek">Mentések & Adatbiztonság</a></li>
-                        <li><a href="#uzemeltet">Üzemeltetés & Támogatás</a></li>
-                        <li><a href="#koltsegek">Költségek</a></li>
-                        <li><a href="#technikai">Technikai kérdések</a></li>
-                    </ul>
-                </div>
-
-                <!-- ==================== ALAPKÉRDÉSEK ==================== -->
-                <div class="faq-category" id="alapkerdesek">
-                    <div class="faq-category-header">
-                        <span class="faq-category-icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-lightbulb"/></svg></span>
-                        <h2>Alapkérdések</h2>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Mi az a Felhom.eu, és mit csináltok pontosan?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>A Felhom.eu egy olyan szolgáltatást nyújt, amely segít az otthoni szerver(ek) telepítésében és üzemeltetésében. Kulcsrakész megoldásokat kínálunk: megválasztjuk a hardvert, beállítjuk a szoftvereket, biztosítjuk a mentéseket, és folyamatosan figyelemmel kísérjük a rendszert.</p>
-                            <p>A cél egyszerű: a nagy felhőszolgáltatók (Google, Microsoft, Apple) helyett a saját otthonodban futó szerveren tárolhatod az adataidat – anélkül, hogy neked kellene szakértőnek lenned.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Kinek való ez a szolgáltatás?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>Mindenkinek, aki szeretné visszavenni az irányítást a digitális élete felett. Tipikus ügyfeleink:</p>
-                            <p><strong>Családok</strong>, akik szeretnék a fotóikat, videóikat biztonságban tudni, és nem akarnak havonta fizetni a felhőtárhelyért.</p>
-                            <p><strong>Adatvédelem-tudatos felhasználók</strong>, akik nem akarják, hogy a Google vagy a Microsoft hozzáférjen a dokumentumaikhoz.</p>
-                            <p><strong>Médiarajongók</strong>, akik saját Netflix/Spotify-szerű rendszert szeretnének a filmjeikhez és zenéjükhöz.</p>
-                            <p><strong>Kisvállalkozások</strong>, amelyeknek szükségük van dokumentumkezelésre, belső wikire, vagy időpontfoglalásra – saját kontroll alatt.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Kell hozzá bármilyen technikai tudás?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p><strong>Nem.</strong> A teljes telepítést és beállítást mi végezzük. A te dolgod annyi, hogy használod az alkalmazásokat – böngészőn vagy mobilon keresztül, pont úgy, mint egy Google vagy Apple szolgáltatást.</p>
-                            <p>A telepítés után egy rövid bemutatón végigvezetünk, hogy magabiztosan használd a rendszert.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Mi a különbség a Felhom.eu és a Synology/QNAP NAS szolgáltatásai között?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>A Synology és QNAP elsősorban fájltárolásra készült NAS (hálózati adattároló) eszközök, saját zárt szoftverrel. Mi ezzel szemben egy nyílt, Docker-alapú rendszert kínálunk, amelyre a katalógus alkalmazásai pár kattintással telepíthetők – fotókezelőtől a média szerveren át a jelszókezelőig.</p>
-                            <p>A NAS-ok korlátozott alkalmazás-választékot kínálnak és a gyártó szoftverfrissítéseitől függenek. Nálunk 58 alkalmazásból válogathatsz, és ha valami hiányzik, megnézzük, felvehető-e.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Hogyan néz ki a folyamat az elejétől a végéig?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p><strong>1. Egyeztetés</strong> – Megbeszéljük, mire van szükséged: milyen alkalmazásokat használnál, mennyi tárhelyet szeretnél, és mi a költségkereted.</p>
-                            <p><strong>2. Hardver kiválasztás</strong> – Segítünk megtalálni az optimális gépet, ami illeszkedik az igényeidhez és a büdzsédhez.</p>
-                            <p><strong>3. Telepítés és beállítás</strong> – Feltelepítjük az operációs rendszert, a konténerkezelőt, az alkalmazásokat, beállítjuk a mentéseket és a monitoringot.</p>
-                            <p><strong>4. Átadás és betanítás</strong> – Bemutatjuk, hogyan használd a rendszert, és válaszolunk minden kérdésedre.</p>
-                            <p><strong>5. Folyamatos üzemeltetés</strong> – Figyeljük a mentéseket, karbantartjuk a rendszert, és segítünk, ha bármi gond van.</p>
-                        </div></div>
-                    </div>
-                </div>
-
-                <!-- ==================== HARDVER & TELEPÍTÉS ==================== -->
-                <div class="faq-category" id="hardver">
-                    <div class="faq-category-header">
-                        <span class="faq-category-icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-monitor"/></svg></span>
-                        <h2>Hardver & Telepítés</h2>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Milyen gépre van szükségem?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>A legtöbb otthoni felhasználónak egy <strong>mini PC</strong> (pl. Intel N100 processzorral, 16-32 GB RAM-mal) tökéletesen megfelel. Ezek csendesek, energiatakarékosak (15-35W fogyasztás), és kompaktak – elfér a polcon a router mellett.</p>
-                            <p>Ha nagyobb tárhelyet szeretnél (pl. filmes könyvtárhoz), egy NAS-al vagy külső merevlemezekkel bővíthető. Részletesebb konfigurációkat a <a href="/technologiak#hardver">Technológiák</a> oldalon találsz.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Használhatom a már meglévő régi gépemet?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>Sok esetben igen! Egy korábbi asztali PC kiváló szerver lehet. Az egyeztetés során felmérjük, hogy a meglévő géped alkalmas-e a tervezett feladatokra (elég RAM, tároló kapacitás, megbízhatóság).</p>
-                            <p>Fontos szempont a <strong>fogyasztás</strong> és a <strong>zajszint</strong> – egy régi gamer PC működik ugyan, de havi szinten jóval többet fogyaszt, mint egy modern mini PC.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Hova kell tenni a szervert?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>Bárhova, ahol van <strong>áramcsatlakozó</strong> és <strong>hálózati kábel</strong> (ethernet). A legjobb hely egy szekrény, polc, vagy a router melletti terület. A mini PC-k annyira kompaktak és csendesek, hogy a nappali polcán is elférnek.</p>
-                            <p>WiFi-n is működhet, de a megbízhatóság és sebesség érdekében mindig kábeles kapcsolatot javaslunk.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Mennyi áramot fogyaszt egy ilyen szerver?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>Egy modern mini PC tipikusan <strong>15-35 watt</strong> körül fogyaszt terhelés alatt, ami éves szinten nagyjából <strong>5.000–15.000 Ft</strong> villanyszámlát jelent (a tarifától függően). Ez kevesebb, mint egy izzó, és töredéke annak, amit egy felhőszolgáltatás éves előfizetése költene.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Mennyire hangos egy ilyen szerver?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>A mini PC-k szinte hangtalan működnek – sok modell ventilátort sem tartalmaz, vagy csak néha kapcsol be rövid időre. Hétköznapi használat mellett nyugodtan tarthatod az íróasztalon vagy a hálószoba polcán.</p>
-                            <p>A tower szerverek és rack szervereknél ez már más – ezeket inkább pincébe, kamrába érdemes helyezni.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Mi történik, ha elmegy az áram?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>A telepítés során a szerver BIOS-át úgy konfiguráljuk (amennyiben az opció rendelkezésre áll), hogy áramszünet után automatikusan bekapcsoljon. Az operációs rendszer és az összes alkalmazás szintén automatikusan elindul a bekapcsolást követően. Ez a beállítás minden telepítésünk alapértelmezett része.</p>
-                            <p>Áramszünet után a doboz magától helyreáll – ezt valódi áramszünettel is kipróbáltuk. Ha a megbízhatóság kritikus, szünetmentes tápegységet (UPS) is tudunk javasolni, ami néhány perc szünet áthidalására elegendő.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Milyen internet kapcsolat szükséges?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>Otthoni használathoz (helyi hálózaton belül) bármilyen internet elég, mert az alkalmazások a helyi hálózatodon futnak – nem az interneten keresztül. A fotók, filmek, dokumentumok sebessége a routeredtől és a kábeles kapcsolattól függ.</p>
-                            <p>Ha <strong>távolról is el szeretnéd érni</strong> a szerveredet (pl. munkahelyről vagy nyaralásból), akkor a feltöltési sebesség (upload) számít: minimum 10 Mbps ajánlott, de minél több, annál jobb.</p>
-                        </div></div>
-                    </div>
-                </div>
-
-                <!-- ==================== ALKALMAZÁSOK & HASZNÁLAT ==================== -->
-                <div class="faq-category" id="alkalmazasok">
-                    <div class="faq-category-header">
-                        <span class="faq-category-icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-smartphone"/></svg></span>
-                        <h2>Alkalmazások & Használat</h2>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Milyen alkalmazásokat tudok futtatni?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p><strong>58 alkalmazást</strong> kínálunk – a teljes listát az <a href="/alkalmazasok">Alkalmazások</a> oldalon találod. Néhány példa:</p>
-                            <p><strong>Immich</strong> – Google Photos alternatíva fotók és videók automatikus mentésével. <strong>Jellyfin/Plex</strong> – saját Netflix filmekhez és sorozatokhoz. <strong>Nextcloud</strong> – fájlok tárolása és megosztása (Google Drive helyett). <strong>Vaultwarden</strong> – jelszókezelő az egész családnak. <strong>Paperless-ngx</strong> – dokumentumok digitalizálása és kereshetővé tétele.</p>
-                            <p>Ha valami nincs a listán, kérdezz – megnézzük, felvehető-e a katalógusba.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Tudok később új alkalmazásokat hozzáadni?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p><strong>Igen, bármikor!</strong> A vezérlőpultból bármelyik alkalmazás telepíthető, pár kattintással. Ha elakadsz, szólj, és segítünk beállítani.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Telefonról is elérem az alkalmazásokat?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>Igen! A legtöbb alkalmazás böngészőből is tökéletesen használható telefonon. Sok alkalmazásnak emellett dedikált mobilalkalmazása is van (iOS és Android egyaránt). Például az Immich, Nextcloud, Jellyfin, és Vaultwarden mind rendelkeznek kiváló mobil appokkal.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Több családtag is használhatja egyszerre?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p><strong>Igen, de érdemes tudni a jelenlegi korlátot.</strong> A telepített alkalmazások többsége (Immich, Nextcloud, Vaultwarden) támogatja a többfelhasználós működést: bennük minden családtag saját fiókot kaphat, saját bejelentkezéssel. A Felhom <strong>vezérlőpulthoz</strong> viszont jelenleg <strong>egy közös háztartási jelszó</strong> tartozik – külön családtagi fiókok a vezérlőpulton még nincsenek. A vezérlőpult az, ahonnan alkalmazást telepítesz és a mentéseket kezeled; a mindennapi használathoz (fotók, fájlok) az alkalmazások saját fiókjai kellenek.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Át tudom hozni a meglévő adataimat (Google Fotók, iCloud, Dropbox)?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>Igen! A legtöbb szolgáltatásból exportálhatók az adatok. A Google Takeout segítségével az összes fotódat, dokumentumodat, naptáradat letöltheted, és az Immich, Nextcloud, stb. importálni tudja ezeket. Segítünk a migrációban.</p>
-                            <p>A folyamat időigénye az adatmennyiségtől függ – néhány száz GB-nyi fotó átvitele akár egy-két napot is igénybe vehet, de a rendszer utána pontosan úgy működik, ahogy a felhőszolgáltatásnál megszoktad.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Elérem a szerveremet, ha nem vagyok otthon?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>Igen! A doboz egy titkosított alagúton át, HTTPS-sel érhető el, külön alkalmazás nélkül. Ez azt jelenti, hogy bárhonnan – munkahelyről, nyaralásból, vagy akár külföldről – elérheted a fotóidat, fájljaidat, és minden alkalmazásodat, mintha otthon lennél.</p>
-                        </div></div>
-                    </div>
-                </div>
-
-                <!-- ==================== BIZTONSÁG & ADATVÉDELEM ==================== -->
-                <div class="faq-category" id="biztonsag">
-                    <div class="faq-category-header">
-                        <span class="faq-category-icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-lock"/></svg></span>
-                        <h2>Biztonság & Adatvédelem</h2>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Mennyire biztonságos egy otthoni szerver?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>Az általunk telepített rendszerek több rétegű védelmet kapnak: automatikus HTTPS titkosítás, rendszeres biztonsági frissítések, saját bejelentkezés minden alkalmazásban, és egyes alkalmazások előtt családi kapu. A szervered a te otthonodon belül van – otthon nem nyitunk portot, kívülről csak egy titkosított alagúton keresztül érhető el.</p>
-                            <p>A legtöbb otthoni szerver ellen nem célzott támadások szoktak irányulni, hanem automatizált szkriptek próbálkoznak. Ezek ellen a megfelelő konfiguráció kiváló védelmet nyújt.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Ti hozzáfértek az adataimhoz?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>Ez egy fontos és jogos kérdés, amire őszintén válaszolunk.</p>
-                            <p>A támogatás és karbantartás érdekében alapesetben rendelkezünk távoli hozzáféréssel a szerveredhez – ahogy bármely IT szolgáltató a kezelt rendszerekhez. Ez szükséges a mentések ellenőrzéséhez, frissítések telepítéséhez, és hibaelhárításhoz.</p>
-                            <p>A távoli mentésed kulcsát viszont <strong>csak te ismered</strong>: a helyreállítási kód egyszer jelenik meg, a te képernyődön, és nálunk nem marad belőle másolat. A távoli mentést így mi sem tudjuk elolvasni.</p>
-                            <p>Fontos: szemben a nagy felhőszolgáltatókkal, nálunk <strong>nincs algoritmikus adatelemzés</strong>, nincs reklámcélú profilozás, és az adataid csak titkosítva hagyják el az otthonodat (a távoli mentés).</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Mi van, ha betörnek a hálózatomba?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>A szerver alkalmazásai izolált konténerekben futnak, ami korlátozza a kár mértékét, ha egy alkalmazás sérülékeny lenne. A rendszeres frissítések, és hogy otthon nincs nyitott port, csökkentik a kockázatot.</p>
-                            <p>A mentéseidből egy titkosított másolat külön helyen (offsite) is tárolódik – így egy zsarolóvírus-támadás után is van egy távol tárolt másolat.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            GDPR szempontból ez rendben van?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>Személyes, otthoni használatra a GDPR nem vonatkozik közvetlenül (a „háztartási kivétel" alapján). Az adataid otthon, a saját dobozodon vannak. A mentések másolatait a doboz titkosítja, mielőtt elhagynák az otthonodat; ezeket a Hetzner tárolja az EU-ban (Németországban), és a tárhely üzemeltetője nem tudja elolvasni őket. A távoli elérés a Cloudflare hálózatán keresztül megy, így a Cloudflare technikailag láthatja ezt a forgalmat. Ha kisvállalkozásként használod, az adatkezelési tájékoztatóban leírjuk, ki mit kezel és hol. Természetesen nem vagyunk jogi tanácsadók, konkrét jogi kérdésekben szakembert érdemes keresni.</p>
-                        </div></div>
-                    </div>
-                </div>
-
-                <!-- ==================== MENTÉSEK & ADATBIZTONSÁG ==================== -->
-                <div class="faq-category" id="mentesek">
-                    <div class="faq-category-header">
-                        <span class="faq-category-icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-hard-drive"/></svg></span>
-                        <h2>Mentések & Adatbiztonság</h2>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Hogyan oldják meg a mentéseket?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>A <strong>3-2-1 mentési szabályt</strong> követjük: 3 másolat az adatokról, 2 különböző tárolón, 1 távoli helyen. Ez iparági szabvány, amit a legnagyobb cégek is alkalmaznak. A dobozon ez három szint: egy mentés a dobozon, egy másodpéldány egy második meghajtón, és egy titkosított másolat egy távoli tárhelyen.</p>
-                            <p>A mentések <strong>automatikusan</strong>, éjszaka futnak. Az adatbázisok és fájlok inkrementálisan mentődnek – tehát csak a változások kerülnek mentésre, ami helyet és időt takarít meg. Részletes leírást a <a href="/biztonsagimentes">Mentések</a> oldalon találsz.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Mi történik, ha meghibásodik a merevlemez?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>Ezért vannak a mentések! A második meghajtón és a távoli tárhelyen lévő másolatokból az alkalmazásaid adatai visszahozhatók. A doboz figyeli a lemezek állapotát és a szabad helyet, és előre figyelmeztet, ha probléma van.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Honnan tudom, hogy a mentések valóban működnek?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>Központi monitoring rendszert üzemeltetünk, amely <strong>minden nap</strong> ellenőrzi, hogy a mentések sikeresen lefutottak-e. Ha bármi probléma van – sikertelen mentés, tárhelyhiány, vagy a szerver nem elérhető – azonnal értesítést kapunk, és szükség esetén te is.</p>
-                            <p>Ez nem egy „beállítom és remélem működik" megoldás – aktívan figyeljük, és időszakosan visszaállítási teszteket is végzünk.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Mi az az „offsite backup"?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>Az offsite (távoli) backup azt jelenti, hogy az adataidról egy másolat fizikailag más helyen is megvan. A Felhom dobozon ez egy általunk biztosított tárhely, ahova a másolat titkosítva kerül. Ha otthon bármi katasztrófa történne (tűz, lopás, vízkár), a távoli másolat akkor is megmarad.</p>
-                            <p>Az offsite mentés mindig <strong>titkosítva</strong> történik – a távoli helyen senki nem tudja elolvasni az adataidat, még ha hozzáfér is a fájlokhoz.</p>
-                        </div></div>
-                    </div>
-                </div>
-
-                <!-- ==================== ÜZEMELTETÉS & TÁMOGATÁS ==================== -->
-                <div class="faq-category" id="uzemeltet">
-                    <div class="faq-category-header">
-                        <span class="faq-category-icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-wrench"/></svg></span>
-                        <h2>Üzemeltetés & Támogatás</h2>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Mi történik a telepítés után? Magamra maradok?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p><strong>Nem!</strong> A Felhom.eu nem egy „telepítem és távozom" szolgáltatást nyújt. Folyamatos üzemeltetést biztosítunk: monitorozás, szoftverfrissítések, mentés-ellenőrzés, és támogatás, ha bármi kérdésed vagy problémád van.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Hogyan történik a szoftverfrissítés?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>Az alkalmazások konténerekben futnak, ami megkönnyíti a frissítést. Mi figyelemmel kísérjük az új verziókat, és egy új verzió csak akkor jut el hozzád, ha előbb kipróbáltuk. A doboz rendszere a biztonsági frissítéseket magától megkapja.</p>
-                            <p>Minden alkalmazásfrissítés előtt friss mentés készül, és ha az új verzió nem indul el rendesen, a doboz magától visszaállítja az előzőt, az adataiddal együtt.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Hogyan kérjek segítséget, ha valami nem működik?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>Egyszerűen írj emailt a <strong>support@felhom.eu</strong> címre. A legtöbb problémát távolról, a te közreműködésed nélkül meg tudjuk oldani. Komolyabb hardveres kérdéseknél személyesen is segítünk.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Mi van, ha fel akarom mondani a szolgáltatást?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>A szerver és az összes adat a tiéd – mindig is az volt. Ha úgy döntesz, hogy nem kéred tovább a szolgáltatást, a doboz az otthoni hálózaton tovább működik, de nem kapod a frissítéseket, a felügyeletet és a támogatást. A távoli elérés és a távoli mentés a szolgáltatás része: hogy mi lesz velük, azt a felmondáskor egyeztetjük.</p>
-                            <p>Nincs hűségidő, nincs felmondási díj. Ha van technikai tudásod (vagy időközben szereztél), akár magad is üzemeltetheted tovább a rendszert. Az adatok és az alkalmazások nálad maradnak.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Mi történik, ha a Felhom.eu megszűnik?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>A szervered és az adataid a tiéd. Az alkalmazások szinte mind nyílt forráskódúak, ami azt jelenti, hogy bárki más is üzemeltetheti őket – nem függsz egyetlen szolgáltatótól sem. Ez éppen az egyik legnagyobb előnye a nyílt forráskódú megoldásoknak: <strong>nincs vendor lock-in</strong>.</p>
-                            <p>Ezzel szemben, ha a Google vagy az Apple megszünteti egy szolgáltatását, az adataid velük együtt tűnnek el.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Mi van, ha elköltözöm?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>A szervered egy kompakt doboz – lecsatlakoztatod, átviszed az új lakásba, becsatlakoztatod, és minden megy tovább. Ha változik az internet szolgáltatód, lehet, hogy a távoli elérés konfigurációját frissíteni kell – ebben segítünk.</p>
-                        </div></div>
-                    </div>
-                </div>
-
-                <!-- ==================== KÖLTSÉGEK ==================== -->
-                <div class="faq-category" id="koltsegek">
-                    <div class="faq-category-header">
-                        <span class="faq-category-icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-coins"/></svg></span>
-                        <h2>Költségek</h2>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Mennyibe kerül az egész?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>A költség két részből áll:</p>
-                            <p><strong>Egyszeri költségek:</strong> A hardver ára (80.000–400.000+ Ft, konfigurációtól függően) és a telepítési díj. A hardvert te vásárolod meg – a tiéd, örökre.</p>
-                            <p><strong>Havi üzemeltetési díj:</strong> A monitoring, támogatás, frissítések, és mentés-felügyelet díja. Ez a kiválasztott csomagtól függ.</p>
-                            <p>Pontos árajánlatot az egyeztetés után adunk – mert az igények nagyon eltérőek lehetnek. Írj nekünk, és személyre szabott ajánlatot készítünk!</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Megéri anyagilag a felhőszolgáltatásokhoz képest?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>Hosszú távon <strong>szinte mindig</strong>. Egy tipikus példa: Google One 2TB évi ~36.000 Ft, iCloud 2TB évi ~45.000 Ft, Spotify család évi ~30.000 Ft, jelszókezelő évi ~15.000 Ft. Ezek együtt évi 120.000+ Ft – és ez csak néhány szolgáltatás.</p>
-                            <p>Egy mini PC-s szerver 2-3 év alatt „behozza" az árát, és utána gyakorlatilag csak áramot fizetsz. Emellett korlátlan tárhelyed van – nem 2 TB, hanem amennyit a lemezeid bírnak.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Vannak rejtett költségek?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>Nincsenek. A felmerülő költségek: hardver (egyszeri), telepítés (egyszeri), havi üzemeltetés (opcionális), és villanyáram (havi néhány ezer forint). Az alkalmazások ingyenesen használhatók, és szinte mind <strong>nyílt forráskódú</strong> – nincs licencdíj az alkalmazásokért. (Néhánynak van fizetős extrája, például a Plex Pass; ez választható.)</p>
-                            <p>A távoli mentés tárhelyének van havi költsége, ami a mentett adatmennyiségtől függ – ezt az ajánlatban előre leírjuk.</p>
-                        </div></div>
-                    </div>
-                </div>
-
-                <!-- ==================== TECHNIKAI KÉRDÉSEK ==================== -->
-                <div class="faq-category" id="technikai">
-                    <div class="faq-category-header">
-                        <span class="faq-category-icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-settings"/></svg></span>
-                        <h2>Technikai kérdések</h2>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Milyen operációs rendszer fut a szerveren?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>A szerver alapja a <strong>Proxmox VE</strong> – egy professzionális, Debian-alapú virtualizációs rendszer, amelyre a teljes Felhom rendszert építjük. Az alkalmazásaid Docker konténerekben futnak egy elkülönített rendszerkörnyezetben, a Proxmox alapra telepítve. Így a teljes rendszerkörnyezet is menthető, és ebből visszaállítható.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Mi az a Proxmox, és miért használjátok?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>A Proxmox egy professzionális virtualizációs alap – ugyanaz a fajta technológia, amelyet adatközpontok és cégek használnak. Minden Felhom dobozon ott van, csendben a háttérben; neked nem kell vele foglalkoznod. Ez teszi lehetővé a legfontosabb biztonsági funkciókat:</p>
-                            <p><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield"/></svg> <strong>Mentés frissítés előtt</strong> – egy alkalmazás frissítése előtt friss mentés készül, és ha az új verzió nem indul el, a doboz magától visszaállítja az előzőt.</p>
-                            <p><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-hard-drive"/></svg> <strong>Az egész rendszer menthető és visszaállítható</strong> – nem csak az adataid, hanem a teljes dobozod is mentésbe kerül.</p>
-                            <p><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg> <strong>Tiszta elkülönítés</strong> – a kezelőréteg és az alkalmazásaid elkülönítve futnak, így stabilabb és biztonságosabb a rendszer.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Mi az a Docker / konténer?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>A konténer egy „doboz", amiben egy alkalmazás és minden függősége együtt él. Gondolj rá úgy, mintha minden alkalmazás a saját kis lakásában élne – nem zavarják egymást, egyszerű frissíteni vagy eltávolítani őket, és ha az egyik elromlik, a többi nem érinti.</p>
-                            <p>Erről bővebben a <a href="/technologiak#kontenerek">Technológiák</a> oldalon olvashatsz.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Saját domain nevet is használhatok?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>Igen! Ha van saját domain neved (pl. <em>enszerverem.hu</em>), beállíthatjuk, hogy az alkalmazásaid azon keresztül legyenek elérhetők (pl. <em>fotok.enszerverem.hu</em>, <em>filmek.enszerverem.hu</em>). Ha nincs domain neved, segítünk az igényléssel – az éves költsége néhány ezer forint.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Később bővíthetem a tárhelyet?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p><strong>Igen!</strong> Egy új merevlemez vagy SSD hozzáadása a legtöbb esetben egyszerű bővítés. Akár USB-s külső meghajtóval is bővíthetsz, ha a gépedben elfogytak a helyek. A rendszer úgy van felépítve, hogy rugalmasan alkalmazkodjon a növekvő igényekhez.</p>
-                        </div></div>
-                    </div>
-
-                    <div class="faq-item">
-                        <button class="faq-question">
-                            Használhatok VPN-t a szerver eléréséhez?
-                            <svg class="faq-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"></polyline></svg>
-                        </button>
-                        <div class="faq-answer"><div class="faq-answer-inner">
-                            <p>Nem kell hozzá: a doboz alapból egy titkosított alagúton át, HTTPS-sel érhető el bárhonnan, külön alkalmazás nélkül.</p>
-                            <p>Háztartási VPN-elérést (amikor a telefonod vagy a laptopod úgy csatlakozik, mintha otthon lenne) ma nem állítunk be a dobozon. Ha erre van szükséged, kérdezz rá.</p>
-                        </div></div>
-                    </div>
-                </div>
-            </div>
-        </section>
-
-        <!-- CTA -->
-        <section class="cta-section alt-bg">
-            <div class="container">
-                <h2>Nem találtad a <span>válaszodat?</span></h2>
-                <p>Írj nekünk bátran – szívesen válaszolunk minden kérdésedre.</p>
-                <a href="/#kapcsolat" class="cta-button">Kapcsolatfelvétel →</a>
-            </div>
-        </section>
-    </main>
-
-    <script>
-        // FAQ Accordion
-        document.querySelectorAll('.faq-question').forEach(button => {
-            button.addEventListener('click', () => {
-                const item = button.parentElement;
-                const wasOpen = item.classList.contains('open');
-                
-                // Close all items in the same category
-                item.closest('.faq-category').querySelectorAll('.faq-item.open').forEach(openItem => {
-                    openItem.classList.remove('open');
-                });
-                
-                // Toggle current item
-                if (!wasOpen) {
-                    item.classList.add('open');
-                }
-            });
-        });
-
-        // Open FAQ from URL hash (e.g., gyik.html#mentesek)
-        if (window.location.hash) {
-            const target = document.querySelector(window.location.hash);
-            if (target) {
-                setTimeout(() => {
-                    target.scrollIntoView({ behavior: 'smooth', block: 'start' });
-                }, 100);
-            }
-        }
-    </script>
-    <script>
-    (function() {
-        var hamburger = document.getElementById('hamburger');
-        var navLinks = document.querySelector('.nav-links');
-        var overlay = document.getElementById('mobileOverlay');
-        var body = document.body;
-
-        if (!hamburger || !navLinks || !overlay) {
-            console.warn('[mobile-menu] Missing elements:', {
-                hamburger: !!hamburger,
-                navLinks: !!navLinks,
-                overlay: !!overlay
-            });
-            return;
-        }
-
-        function openMenu() {
-            hamburger.classList.add('is-active');
-            navLinks.classList.add('is-open');
-            overlay.classList.add('is-visible');
-            body.classList.add('menu-open');
-            hamburger.setAttribute('aria-expanded', 'true');
-            hamburger.setAttribute('aria-label', 'Menü bezárása');
-        }
-
-        function closeMenu() {
-            hamburger.classList.remove('is-active');
-            navLinks.classList.remove('is-open');
-            overlay.classList.remove('is-visible');
-            body.classList.remove('menu-open');
-            hamburger.setAttribute('aria-expanded', 'false');
-            hamburger.setAttribute('aria-label', 'Menü megnyitása');
-        }
-
-        hamburger.addEventListener('click', function() {
-            if (navLinks.classList.contains('is-open')) {
-                closeMenu();
-            } else {
-                openMenu();
-            }
-        });
-
-        overlay.addEventListener('click', closeMenu);
-
-        navLinks.querySelectorAll('a').forEach(function(link) {
-            link.addEventListener('click', closeMenu);
-        });
-
-        document.addEventListener('keydown', function(e) {
-            if (e.key === 'Escape' && navLinks.classList.contains('is-open')) {
-                closeMenu();
-            }
-        });
-
-        window.addEventListener('resize', function() {
-            if (window.innerWidth > 900 && navLinks.classList.contains('is-open')) {
-                closeMenu();
-            }
-        });
-    })();
-    </script>
-<footer>
-        <div class="container">
-            <p>© 2026 felhom.eu – Saját felhőd, saját szabályaid</p>
-            <p class="footer-legal">Üzemeltető: Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Adatkezelési tájékoztató</a> · <a href="/feltetelek">Feltételek</a></p>
-        </div>
-    </footer>
-    <script>
-    (function(){
-        var b=document.getElementById('navBurger'),s=document.getElementById('sidebar'),k=document.getElementById('navBackdrop');
-        if(!b||!s||!k)return;
-        function open(){s.classList.add('is-open');k.hidden=false;document.body.classList.add('nav-open');b.setAttribute('aria-expanded','true');}
-        function close(){s.classList.remove('is-open');k.hidden=true;document.body.classList.remove('nav-open');b.setAttribute('aria-expanded','false');}
-        b.addEventListener('click',function(){s.classList.contains('is-open')?close():open();});
-        k.addEventListener('click',close);
-        document.addEventListener('keydown',function(e){if(e.key==='Escape'&&s.classList.contains('is-open')){close();b.focus();}});
-        s.querySelectorAll('a').forEach(function(l){l.addEventListener('click',close);});
-        window.addEventListener('resize',function(){if(window.innerWidth>768)close();});
-    })();
-    document.addEventListener('click',function(e){
-        var btn=e.target.closest?e.target.closest('.nav-group-toggle'):null;
-        if(!btn)return;
-        var g=btn.closest('.nav-group');if(!g)return;
-        var willOpen=!g.classList.contains('is-open');
-        document.querySelectorAll('.nav-group.is-open').forEach(function(x){
-            x.classList.remove('is-open');
-            var t=x.querySelector('.nav-group-toggle');if(t)t.setAttribute('aria-expanded','false');
-        });
-        if(willOpen){g.classList.add('is-open');btn.setAttribute('aria-expanded','true');}
-    });
-    </script>
-</body>
-</html>
diff --git a/website/preview/m3/index.html b/website/preview/m3/index.html
deleted file mode 100644
index ac178437..00000000
--- a/website/preview/m3/index.html
+++ /dev/null
@@ -1,327 +0,0 @@
-<!DOCTYPE html>
-<html lang="hu" class="no-js">
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <script>document.documentElement.className=document.documentElement.className.replace('no-js','js');</script>
-    <meta name="robots" content="noindex, nofollow">
-    <meta name="description" content="Otthoni szerver a saját otthonodban: fényképek, dokumentumok, médiatár. 58 telepíthető alkalmazás, háromszintű automatikus mentés, magyar vagy angol nyelvű vezérlőpult. Most zárt teszt indul.">
-    <title>Felhom.eu — Saját felhőd, saját szabályaid | Otthoni szerver szolgáltatás</title>
-    <script defer src="/assets/gallery.js?v=2"></script>
-    <link rel="canonical" href="https://felhom.eu/">
-    <link rel="alternate" hreflang="hu" href="https://felhom.eu/">
-    <link rel="alternate" hreflang="en" href="https://felhom.eu/en/">
-    <link rel="alternate" hreflang="x-default" href="https://felhom.eu/">
-    <link rel="stylesheet" href="/assets/site.css?v=21">
-    <link rel="stylesheet" href="/assets/shell.css?v=21">
-    <link rel="icon" type="image/png" href="/assets/logo_favicon_2.svg">
-    <script defer src="https://stats.felhom.eu/script.js" data-website-id="d419db57-5e1c-48df-bdb3-c29f25fb1661"></script>
-</head>
-<body class="shell page-index">
-    <header class="mobile-topbar">
-        <a href="/preview/m3/" class="mobile-topbar-logo"><img src="/assets/logo_notext_white.svg" alt="Felhom.eu"></a>
-        <button type="button" class="nav-burger" id="navBurger" aria-expanded="false" aria-controls="sidebar" aria-label="Menü">
-            <span class="hamburger-box"><span class="hamburger-line"></span><span class="hamburger-line"></span><span class="hamburger-line"></span></span>
-        </button>
-    </header>
-    <div class="nav-backdrop" id="navBackdrop" hidden></div>
-    <nav class="sidebar" id="sidebar">
-        <div class="sidebar-header">
-            <a href="/preview/m3/" class="sidebar-logo-link">
-                <img src="/assets/logo_notext_white.svg" alt="" class="sidebar-logo" aria-hidden="true">
-                <img src="/assets/logo-wordmark.png" alt="felhom.eu" class="sidebar-word">
-            </a>
-        </div>
-        <ul class="nav-links">
-                <li><a href="/preview/m3/" class="active"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg>Kezdőlap</a></li>
-                <li><a href="/preview/m3/#szolgaltatasok"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rocket"/></svg>Szolgáltatások</a></li>
-                <li class="nav-group">
-                    <button type="button" class="nav-group-toggle" aria-expanded="false" aria-controls="nav-group-apps"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg>Alkalmazások<svg class="ico nav-chevron" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chevron-down"/></svg></button>
-                    <ul id="nav-group-apps" class="nav-links nav-links-sub nav-links-nested">
-                        <li><a href="/preview/m3/alkalmazasok">Minden alkalmazás</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#fajlkezeles-irodai">Fájlkezelés &amp; Irodai</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#media-szorakozas">Média &amp; Szórakozás</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#otthon-eletmod">Otthon &amp; Életmód</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#produktivitas-tudaskezeles">Produktivitás &amp; Tudáskezelés</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#rendszer-fejlesztes">Rendszer &amp; Fejlesztés</a></li>
-                    </ul>
-                </li>
-                <li><a href="/preview/m3/technologiak"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg>Technológiák</a></li>
-                <li><a href="/preview/m3/biztonsagimentes"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg>Biztonsági mentés</a></li>
-        </ul>
-        <div class="sidebar-bottom">
-            <a href="/preview/m3/teszteles" class="btn btn-outline sidebar-cta">Jelentkezem tesztelőnek →</a>
-            <div class="nav-group-label">A Felhomról</div>
-            <ul class="nav-links nav-links-sub">
-                    <li><a href="/preview/m3/#hogyan-mukodik">Hogyan működik</a></li>
-                    <li><a href="/preview/m3/gyik">GYIK</a></li>
-                    <li><a href="/preview/m3/kapcsolat">Kapcsolat</a></li>
-            </ul>
-            <div class="sidebar-footer">
-                <details class="lang-globe"><summary class="lang-globe-btn" aria-label="Nyelv" title="Nyelv"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/preview/m3/" lang="hu" hreflang="hu" class="lang-globe-item current" aria-current="true">Magyar</a></li><li><a href="/preview/m3/en/" lang="en" hreflang="en" class="lang-globe-item">English</a></li></ul></details>
-            </div>
-        </div>
-    </nav>
-    <main class="content">
-        <div class="page-header">
-            <h1>Saját felhőd, saját szabályaid</h1>
-            <span class="domain-badge">Otthoni szerver szolgáltatás</span>
-        </div>
-
-        <section class="hero-row">
-            <div class="hero-copy">
-                <p class="hero-lede">Egy kis gép az otthonodban: a fényképeid, a dokumentumaid, a filmjeid. Minden éjjel mentés készül. Mi figyeljük, te használod.</p>
-                <a href="/teszteles" class="btn btn-primary btn-lg">Jelentkezem tesztelőnek →</a>
-            </div>
-                <div class="hero-window" aria-label="A vezérlőpult képe">
-                    <div class="hero-window-bar">
-                        <span class="hw-dot"></span><span class="hw-dot"></span><span class="hw-dot"></span>
-                        <span class="hero-window-title">otthonod.hu <span class="sample">minta</span></span>
-                    </div>
-                    <div class="hero-window-body">
-                        <p class="hero-window-lede">Így néz ki a doboz vezérlőpultja.</p>
-                        <div class="launch-grid launch-grid--mini">
-                        <a class="launch-cell" href="/alkalmazasok#immich">
-                            <span class="launch-tile" style="background: hsl(18, 45%, 38%)"><span class="launch-mono">I</span><img class="launch-logo" src="/assets/immich-logo.svg" alt="" loading="lazy"></span>
-                            <span class="launch-name">Immich</span>
-                        </a>
-                        <a class="launch-cell" href="/alkalmazasok#jellyfin">
-                            <span class="launch-tile" style="background: hsl(348, 45%, 38%)"><span class="launch-mono">J</span><img class="launch-logo" src="/assets/jellyfin-logo.svg" alt="" loading="lazy"></span>
-                            <span class="launch-name">Jellyfin</span>
-                        </a>
-                        <a class="launch-cell" href="/alkalmazasok#nextcloud">
-                            <span class="launch-tile" style="background: hsl(201, 45%, 38%)"><span class="launch-mono">N</span><img class="launch-logo" src="/assets/nextcloud-logo.svg" alt="" loading="lazy"></span>
-                            <span class="launch-name">Nextcloud</span>
-                        </a>
-                        <a class="launch-cell" href="/alkalmazasok#vaultwarden">
-                            <span class="launch-tile" style="background: hsl(66, 45%, 38%)"><span class="launch-mono">V</span><img class="launch-logo" src="/assets/vaultwarden-logo.svg" alt="" loading="lazy"></span>
-                            <span class="launch-name">Vaultwarden</span>
-                        </a>
-                        </div>
-                    </div>
-                </div>
-        </section>
-
-        <section class="shell-section" id="szolgaltatasok">
-            <div class="sec-head">
-                <h2>Mit tud a doboz ma?</h2>
-                <p>Nem terv és nem ígéret: ezek ma működő funkciók egy éles Felhom dobozon.</p>
-            </div>
-            <div class="caps">
-                <div class="caps-group">
-                    <h3>Amit nap mint nap használsz</h3>
-                    <ul class="caps-list">
-                        <li class="caps-item">
-                            <h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-camera"/></svg> Fényképek, dokumentumok, média</h4>
-                            <p>A telefonod fotói automatikusan feltöltődnek a saját gépedre. A beszkennelt papírjaidat a rendszer felismeri és keresővé teszi. A filmjeid, zenéid böngészőből és mobil appból is mennek.</p>
-                        </li>
-                        <li class="caps-item">
-                            <h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-folder"/></svg> Hálózati megosztás</h4>
-                            <p>A doboz mappái megjelennek a Windows Intézőben és a Mac Finderben: úgy húzod rájuk a fájlokat, mint bármelyik másik mappára. Megosztásonként beállítható, hogy csak olvasható legyen.</p>
-                        </li>
-                        <li class="caps-item">
-                            <h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg> 58 telepíthető alkalmazás</h4>
-                            <p>A vezérlőpultból telepíthetők, pár kattintással, parancssor nélkül. Szinte mind nyílt forráskódú, és mind a te gépeden fut.</p>
-                        </li>
-                        <li class="caps-item">
-                            <h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg> Magyarul vagy angolul</h4>
-                            <p>A vezérlőpult magyarul és angolul is használható. A nyelvet a háztartás választja, és a dobozról érkező e-mailek is ezt a nyelvet követik.</p>
-                        </li>
-                    </ul>
-                </div>
-                <div class="caps-group">
-                    <h3>Ami a háttérben véd</h3>
-                    <ul class="caps-list">
-                        <li class="caps-item">
-                            <h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg> Háromszintű automatikus mentés</h4>
-                            <p>Minden éjjel készül egy mentés a dobozon, egy másodpéldány egy második meghajtóra (ha van), és egy titkosított másolat egy távoli tárhelyre. A megosztott mappáid a második meghajtón és a távoli másolatban is benne vannak.</p>
-                        </li>
-                        <li class="caps-item">
-                            <h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-lock"/></svg> Helyreállítási kód, amit csak te ismersz</h4>
-                            <p>A távoli mentésed titkosításának kulcsa egy helyreállítási kód, ami pontosan egyszer jelenik meg: a te képernyődön. Mi nem ismerjük, és nem tudjuk visszaállítani. Ez azt is jelenti, hogy a kód nélkül a távoli mentés nekünk sem olvasható: tedd el jól.</p>
-                        </li>
-                        <li class="caps-item">
-                            <h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rotate-cw"/></svg> Visszaállítás, ha baj van</h4>
-                            <p>Egy törölt fájl visszahozható a mentésből. Ha maga a doboz megy tönkre, az újratelepített rendszerre a titkosított távoli mentésből visszahozhatók az alkalmazásaid adatai, a helyreállítási kóddal.</p>
-                        </li>
-                        <li class="caps-item">
-                            <h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg> Internetkimaradáskor is működik</h4>
-                            <p>A doboz az otthonodban van. Ha elmegy a net, az otthoni hálózaton továbbra is eléred a fotóidat és a fájljaidat: nem egy távoli szolgáltató engedélyétől függenek.</p>
-                        </li>
-                    </ul>
-                </div>
-                <div class="caps-group">
-                    <h3>Amiről mi gondoskodunk</h3>
-                    <ul class="caps-list">
-                        <li class="caps-item">
-                            <h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-stethoscope"/></svg> Távoli felügyelet, automatikus frissítés</h4>
-                            <p>Figyeljük a doboz állapotát. A vezérlőpult magától frissül a legutóbbi kiadásra, és a doboz rendszere is megkapja a biztonsági frissítéseket. Neked nem kell csinálnod semmit. Ha valami elromlik, mi látjuk.</p>
-                        </li>
-                        <li class="caps-item">
-                            <h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rotate-cw"/></svg> Óvatos alkalmazásfrissítés</h4>
-                            <p>Egy alkalmazás új verziója csak akkor jut el hozzád, ha előbb kipróbáltuk. Frissítés előtt friss mentés készül, és ha az új verzió nem indul el rendesen, a doboz magától visszaállítja az előzőt, az adataiddal együtt.</p>
-                        </li>
-                    </ul>
-                </div>
-            </div>
-        </section>
-
-        <section class="shell-section" id="vezerlopult">
-            <div class="sec-head">
-                <h2>Így néz ki a vezérlőpult</h2>
-                <p>Valódi képek egy Felhom dobozról. Kattints rájuk a teljes mérethez.</p>
-            </div>
-            <div class="dash-grid">
-                <figure class="dash-shot">
-                    <a href="/assets/dashboard-start-hu.webp" data-gallery="dashboard"><img src="/assets/dashboard-start-hu.webp" alt="A vezérlőpult Indítópultja: az otthon telepített alkalmazások csempéi" width="1440" height="900" loading="lazy"></a>
-                    <figcaption><strong>Indítópult</strong>: minden alkalmazásod egy kattintásra.</figcaption>
-                </figure>
-                <figure class="dash-shot">
-                    <a href="/assets/dashboard-apps-hu.webp" data-gallery="dashboard"><img src="/assets/dashboard-apps-hu.webp" alt="Az Alkalmazások oldal: telepített és telepíthető alkalmazások kártyái, állapottal" width="1440" height="900" loading="lazy"></a>
-                    <figcaption><strong>Alkalmazások</strong>: telepítés pár kattintással, és látod, mi fut és mi naprakész.</figcaption>
-                </figure>
-                <figure class="dash-shot">
-                    <a href="/assets/dashboard-app-hu.webp" data-gallery="dashboard"><img src="/assets/dashboard-app-hu.webp" alt="Egy alkalmazás saját oldala: mire jó, képek, és az első lépések" width="1440" height="900" loading="lazy"></a>
-                    <figcaption><strong>Egy alkalmazás oldala</strong>: mire jó, hova tedd a fájlokat, és hogyan kezdj hozzá.</figcaption>
-                </figure>
-                <figure class="dash-shot">
-                    <a href="/assets/dashboard-backups-hu.webp" data-gallery="dashboard"><img src="/assets/dashboard-backups-hu.webp" alt="A mentések oldala: minden alkalmazás adatbázisának éjszakai mentése, ellenőrizve" width="1440" height="900" loading="lazy"></a>
-                    <figcaption><strong>Mentések</strong>: minden éjjel minden alkalmazás adatbázisa mentésre kerül, és ellenőrizzük.</figcaption>
-                </figure>
-            </div>
-        </section>
-
-        <section class="shell-section" id="hogyan-mukodik">
-            <div class="sec-head">
-                <h2>Hogyan működik?</h2>
-                <p>Az első beszélgetéstől a működő rendszerig.</p>
-            </div>
-            <div class="flow">
-                <div class="flow-step">
-                    <h3>Egyeztetés</h3>
-                    <p>Megbeszéljük az igényeidet: milyen alkalmazásokra van szükséged, és mekkora tárhelyet szeretnél.</p>
-                </div>
-                <div class="flow-step">
-                    <h3>Hardver kiválasztás</h3>
-                    <p>Segítünk megtalálni a legjobb ár-érték arányú gépet, ami az igényeidnek megfelel.</p>
-                </div>
-                <div class="flow-step">
-                    <h3>Telepítés</h3>
-                    <p>Feltelepítjük és bekonfiguráljuk az alkalmazásokat, a mentéseket, és a monitoringot.</p>
-                </div>
-                <div class="flow-step">
-                    <h3>Átadás</h3>
-                    <p>Bemutatjuk a rendszert, segítünk áthozni a meglévő adataidat, és válaszolunk minden kérdésedre.</p>
-                </div>
-                <div class="flow-step">
-                    <h3>Üzemeltetés</h3>
-                    <p>Figyeljük a rendszert, frissítünk, mentéseket ellenőrzünk. Te csak használod.</p>
-                </div>
-            </div>
-        </section>
-
-        <section class="shell-section" id="miert">
-            <div class="sec-head">
-                <h2>Miért a sajátod?</h2>
-                <p>Ugyanaz a kényelem, más feltételekkel.</p>
-            </div>
-            <div class="vs">
-                <div class="vs-head">
-                    <div>Felhőszolgáltatónál</div>
-                    <div>Saját dobozon</div>
-                </div>
-                <div class="vs-row">
-                    <div>Havonta fizetsz a tárhelyért és a prémium funkciókért, és az árak csak nőnek idővel.</div>
-                    <div><strong>A gép a tiéd, örökre.</strong> Nincs tárhely-előfizetés, ami évről évre drágul: az áramot fizeted, és ha kéred, az üzemeltetést.</div>
-                </div>
-                <div class="vs-row">
-                    <div>A fotóid, dokumentumaid, személyes adataid idegen szervereken vannak, idegen kezekben.</div>
-                    <div><strong>Az adataid az otthonodban maradnak</strong>, nem a Google vagy a Microsoft szerverein. A távoli mentésbe csak titkosítva kerülnek.</div>
-                </div>
-                <div class="vs-row">
-                    <div>A tárhely fogy, és ha betelt, megint fizetsz.</div>
-                    <div><strong>Nincs 15GB-os limit.</strong> Bővítheted ahogy nőnek az igényeid, TB-okkal, ha kell.</div>
-                </div>
-                <div class="vs-row">
-                    <div>Nem te döntöd el, milyen szolgáltatásokat használsz, és mikor szűnnek meg.</div>
-                    <div><strong>Te döntöd el, milyen szolgáltatásokat futtatsz.</strong> Te vagy a főnök, nem a szolgáltató.</div>
-                </div>
-            </div>
-            <div class="band">
-                <div class="band-item">
-                    <h3>Amit telepíthetsz</h3>
-                    <p>Fájlkezelés, fotók és média, dokumentumok, jelszókezelés, okosotthon, fejlesztői eszközök. Nextcloud, Immich, Jellyfin, Paperless-ngx, Vaultwarden, Home Assistant és még 52 másik: <strong>58 alkalmazás</strong>, szinte mind nyílt forráskódú.</p>
-                    <a href="/alkalmazasok" class="btn btn-outline">Összes alkalmazás megtekintése →</a>
-                </div>
-                <div class="band-item">
-                    <h3>Ami alatta fut</h3>
-                    <p>Docker konténerek egy Proxmox alapon, háromszintű mentés, titkosított alagút nyitott port nélkül, magyar vagy angol vezérlőpult. Az igényeidhez igazítjuk, a <strong>legegyszerűbbtől a legkomolyabbig</strong>.</p>
-                    <a href="/technologiak" class="btn btn-outline">Technológiákról bővebben →</a>
-                </div>
-            </div>
-        </section>
-
-        <section class="shell-section" id="zart-teszt">
-            <div class="sec-head">
-                <h2>Zárt teszt</h2>
-                <p>Néhány magyar háztartással most kezdjük el élesben használni a rendszert.</p>
-            </div>
-            <div class="app-info-grid">
-                <div class="app-info-card">
-                    <h3>Valódi használat</h3>
-                    <p>Nem demó: a doboz nálad marad, és az igazi fényképeidet, dokumentumaidat teszed rá. Segítünk a telepítésben és az átállásban, utána te használod a mindennapokban.</p>
-                </div>
-                <div class="app-info-card">
-                    <h3>Visszajelzés</h3>
-                    <p>Cserébe azt kérjük, hogy mondd el, mi zavaró, mi érthetetlen, mi nem működik. Egy „ezt a gombot nem találtam" ér nekünk a legtöbbet: abból tudjuk, mit kell kijavítani.</p>
-                </div>
-            </div>
-            <div class="alerts-container">
-                <div class="alert-banner alert-banner-warning">
-                    <span class="alert-icon"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-triangle-alert"/></svg></span>
-                    <span class="alert-message"><strong>Ismert korlátok, őszintén.</strong> A vezérlőpulthoz jelenleg <strong>egy közös háztartási jelszó</strong> tartozik, külön családtagi fiókok még nincsenek (az egyes alkalmazásoknak viszont saját felhasználóik lehetnek). A <strong>TV-re streamelés (DLNA)</strong> még nincs: egyelőre böngészőből és mobil appból megy a médiatár. És mivel ez teszt, számíts arra, hogy találsz hibát: ez a lényege.</span>
-                </div>
-            </div>
-            <div class="close-cta">
-                <p>Ha ez érdekel, írj. <strong>Nem kötelez semmire</strong>, először csak beszélgetünk.</p>
-                <a href="/teszteles" class="btn btn-primary btn-lg">Jelentkezem tesztelőnek →</a>
-                <div class="who-mini">
-                    <img src="/assets/operator-portrait-small.webp" alt="Nagyfenyvesi Viktor, a Felhom üzemeltetője" width="160" height="200" loading="lazy">
-                    <p>A Felhom mögött egy ember áll: <strong>Nagyfenyvesi Viktor</strong>. Ha írsz, ő válaszol. <a href="/kapcsolat#ki-all-mogotte">Ki áll mögötte →</a></p>
-                </div>
-            </div>
-        </section>
-
-<footer>
-        <div class="container">
-            <p>© 2026 felhom.eu – Saját felhőd, saját szabályaid</p>
-            <p class="footer-legal">Üzemeltető: Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Adatkezelési tájékoztató</a> · <a href="/feltetelek">Feltételek</a></p>
-        </div>
-    </footer>
-    </main>
-    <script>
-    (function(){
-        var b=document.getElementById('navBurger'),s=document.getElementById('sidebar'),k=document.getElementById('navBackdrop');
-        if(!b||!s||!k)return;
-        function open(){s.classList.add('is-open');k.hidden=false;document.body.classList.add('nav-open');b.setAttribute('aria-expanded','true');}
-        function close(){s.classList.remove('is-open');k.hidden=true;document.body.classList.remove('nav-open');b.setAttribute('aria-expanded','false');}
-        b.addEventListener('click',function(){s.classList.contains('is-open')?close():open();});
-        k.addEventListener('click',close);
-        document.addEventListener('keydown',function(e){if(e.key==='Escape'&&s.classList.contains('is-open')){close();b.focus();}});
-        s.querySelectorAll('a').forEach(function(l){l.addEventListener('click',close);});
-        window.addEventListener('resize',function(){if(window.innerWidth>768)close();});
-    })();
-    document.addEventListener('click',function(e){
-        var btn=e.target.closest?e.target.closest('.nav-group-toggle'):null;
-        if(!btn)return;
-        var g=btn.closest('.nav-group');if(!g)return;
-        var willOpen=!g.classList.contains('is-open');
-        document.querySelectorAll('.nav-group.is-open').forEach(function(x){
-            x.classList.remove('is-open');
-            var t=x.querySelector('.nav-group-toggle');if(t)t.setAttribute('aria-expanded','false');
-        });
-        if(willOpen){g.classList.add('is-open');btn.setAttribute('aria-expanded','true');}
-    });
-    </script>
-</body>
-</html>
diff --git a/website/preview/m3/kapcsolat.html b/website/preview/m3/kapcsolat.html
deleted file mode 100644
index fabfe1aa..00000000
--- a/website/preview/m3/kapcsolat.html
+++ /dev/null
@@ -1,657 +0,0 @@
-<!DOCTYPE html>
-<html lang="hu" class="no-js">
-<head>
-    <script>document.documentElement.className=document.documentElement.className.replace('no-js','js');</script>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Kapcsolat — Kérj személyre szabott ajánlatot otthoni szerveredhez | Felhom.eu</title>
-    <meta name="description" content="Írj nekünk és személyre szabott ajánlatot készítünk otthoni szerveredhez. Kérdésed van? Segítünk! Email: info@felhom.eu">
-
-    <meta name="keywords" content="kapcsolat, ajánlatkérés, otthoni szerver ajánlat, Felhom elérhetőség">
-    <meta name="robots" content="index, follow">
-    <link rel="canonical" href="https://felhom.eu/kapcsolat">
-    <link rel="alternate" hreflang="hu" href="https://felhom.eu/kapcsolat">
-    <link rel="alternate" hreflang="en" href="https://felhom.eu/en/contact">
-    <link rel="alternate" hreflang="x-default" href="https://felhom.eu/kapcsolat">
-
-    <meta property="og:type" content="website">
-    <meta property="og:url" content="https://felhom.eu/kapcsolat">
-    <meta property="og:title" content="Kapcsolat — Felhom.eu">
-    <meta property="og:description" content="Írj nekünk és személyre szabott ajánlatot készítünk otthoni szerveredhez.">
-    <meta property="og:image" content="https://felhom.eu/assets/og-image.png">
-    <meta property="og:locale" content="hu_HU">
-    <meta property="og:site_name" content="Felhom.eu">
-
-    <meta name="twitter:card" content="summary">
-    <meta name="twitter:title" content="Kapcsolat — Felhom.eu">
-    <meta name="twitter:description" content="Kérdésed van? Írj nekünk: info@felhom.eu">
-    <meta name="twitter:image" content="https://felhom.eu/assets/og-image.png">
-    <!-- shared assets: bump ?v= together on any site.css/icons.svg change -->
-    <link rel="stylesheet" href="/assets/site.css?v=21">
-    <link rel="stylesheet" href="/assets/shell.css?v=21">
-    <link rel="icon" type="image/png" href="/assets/logo_favicon_2.svg">
-    <script defer src="https://stats.felhom.eu/script.js" data-website-id="d419db57-5e1c-48df-bdb3-c29f25fb1661"></script>
-</head>
-<body class="shell page-kapcsolat">
-    <header class="mobile-topbar">
-        <a href="/preview/m3/" class="mobile-topbar-logo"><img src="/assets/logo_notext_white.svg" alt="Felhom.eu"></a>
-        <button type="button" class="nav-burger" id="navBurger" aria-expanded="false" aria-controls="sidebar" aria-label="Menü">
-            <span class="hamburger-box"><span class="hamburger-line"></span><span class="hamburger-line"></span><span class="hamburger-line"></span></span>
-        </button>
-    </header>
-    <div class="nav-backdrop" id="navBackdrop" hidden></div>
-    <nav class="sidebar" id="sidebar">
-        <div class="sidebar-header">
-            <a href="/preview/m3/" class="sidebar-logo-link">
-                <img src="/assets/logo_notext_white.svg" alt="" class="sidebar-logo" aria-hidden="true">
-                <img src="/assets/logo-wordmark.png" alt="felhom.eu" class="sidebar-word">
-            </a>
-        </div>
-        <ul class="nav-links">
-                <li><a href="/preview/m3/"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg>Kezdőlap</a></li>
-                <li><a href="/preview/m3/#szolgaltatasok"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rocket"/></svg>Szolgáltatások</a></li>
-                <li class="nav-group">
-                    <button type="button" class="nav-group-toggle" aria-expanded="false" aria-controls="nav-group-apps"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg>Alkalmazások<svg class="ico nav-chevron" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chevron-down"/></svg></button>
-                    <ul id="nav-group-apps" class="nav-links nav-links-sub nav-links-nested">
-                        <li><a href="/preview/m3/alkalmazasok">Minden alkalmazás</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#fajlkezeles-irodai">Fájlkezelés &amp; Irodai</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#media-szorakozas">Média &amp; Szórakozás</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#otthon-eletmod">Otthon &amp; Életmód</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#produktivitas-tudaskezeles">Produktivitás &amp; Tudáskezelés</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#rendszer-fejlesztes">Rendszer &amp; Fejlesztés</a></li>
-                    </ul>
-                </li>
-                <li><a href="/preview/m3/technologiak"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg>Technológiák</a></li>
-                <li><a href="/preview/m3/biztonsagimentes"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg>Biztonsági mentés</a></li>
-        </ul>
-        <div class="sidebar-bottom">
-            <a href="/preview/m3/teszteles" class="btn btn-outline sidebar-cta">Jelentkezem tesztelőnek →</a>
-            <div class="nav-group-label">A Felhomról</div>
-            <ul class="nav-links nav-links-sub">
-                    <li><a href="/preview/m3/#hogyan-mukodik">Hogyan működik</a></li>
-                    <li><a href="/preview/m3/gyik">GYIK</a></li>
-                    <li><a href="/preview/m3/kapcsolat" class="active">Kapcsolat</a></li>
-            </ul>
-            <div class="sidebar-footer">
-                <details class="lang-globe"><summary class="lang-globe-btn" aria-label="Nyelv" title="Nyelv"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/preview/m3/kapcsolat" lang="hu" hreflang="hu" class="lang-globe-item current" aria-current="true">Magyar</a></li><li><a href="/preview/m3/en/contact" lang="en" hreflang="en" class="lang-globe-item">English</a></li></ul></details>
-            </div>
-        </div>
-    </nav>
-<main class="content">
-<div class="page-header">
-                <h1>Írj nekünk <span>bátran!</span></h1>
-            </div>
-            <p class="page-lede">Kérdésed van, vagy szeretnéd megbeszélni az igényeidet? Töltsd ki az űrlapot, és hamarosan válaszolunk.</p>
-        <section class="content-section" style="padding-top: 0;">
-            <div class="container">
-                <div class="contact-layout">
-
-                    <!-- Form -->
-                    <div class="contact-form-card">
-                        <div id="formStatus" class="form-status"></div>
-
-                        <form id="contactForm" novalidate>
-                            <div style="position:absolute;left:-9999px;" aria-hidden="true">
-                                <input type="text" name="website" tabindex="-1" autocomplete="off">
-                            </div>
-                            <div class="form-row">
-                                <div class="form-group">
-                                    <label for="name">Név <span class="required">*</span></label>
-                                    <input type="text" id="name" name="name" placeholder="Teljes neved" required>
-                                    <div class="error-message" id="nameError">Kérlek, add meg a neved.</div>
-                                </div>
-                                <div class="form-group">
-                                    <label for="email">Email <span class="required">*</span></label>
-                                    <input type="email" id="email" name="email" placeholder="pelda@email.hu" required>
-                                    <div class="error-message" id="emailError">Kérlek, adj meg egy érvényes email címet.</div>
-                                </div>
-                            </div>
-
-                            <div class="form-group">
-                                <label for="subject">Tárgy <span class="required">*</span></label>
-                                <select id="subject" name="subject" required>
-                                    <option value="" disabled selected>Válassz témát...</option>
-                                    <option value="zart-teszt">Zárt teszt – jelentkezem tesztelőnek</option>
-                                    <option value="erdeklodes">Érdeklődés – szeretném megismerni a szolgáltatást</option>
-                                    <option value="arajanlat">Árajánlat kérés – konkrét igényeim vannak</option>
-                                    <option value="tamogatas">Támogatás – meglévő szerveremet érintő kérdés</option>
-                                    <option value="egyeb">Egyéb</option>
-                                </select>
-                                <div class="error-message" id="subjectError">Kérlek, válassz egy témát.</div>
-                            </div>
-
-                            <div class="form-group">
-                                <label for="message">Üzenet <span class="required">*</span></label>
-                                <textarea id="message" name="message" placeholder="Írd le, miben segíthetünk..." required></textarea>
-                                <div class="error-message" id="messageError">Kérlek, írd le az üzeneted.</div>
-                            </div>
-
-                            <div class="form-group">
-                                <label>Fájl csatolás <span style="color: var(--text-3); font-weight: 400;">(opcionális)</span></label>
-                                <div class="file-upload-zone" id="dropZone">
-                                    <input type="file" id="fileInput" multiple accept=".pdf,.doc,.docx,.xls,.xlsx,.png,.jpg,.jpeg,.gif,.webp,.txt,.csv,.zip,.7z">
-                                    <div class="upload-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-paperclip"/></svg></div>
-                                    <div class="upload-text">
-                                        <strong>Kattints ide</strong> vagy húzd ide a fájlokat
-                                    </div>
-                                    <div class="upload-hint">PDF, képek, dokumentumok · Max. 20 MB összesen</div>
-                                </div>
-                                <div class="file-list" id="fileList"></div>
-                                <div class="file-total-size" id="fileTotalSize"></div>
-                            </div>
-
-                            <div class="checkbox-group">
-                                <input type="checkbox" id="privacy" name="privacy" required>
-                                <label for="privacy">
-                                    Elolvastam az <a href="/adatkezeles" target="_blank" rel="noopener">Adatkezelési tájékoztatót</a>, és hozzájárulok, hogy a megadott nevemet, e-mail-címemet, üzenetemet és csatolt fájljaimat a megkeresésem megválaszolására kezeljék. Az üzenetet levélküldő és levelezési szolgáltatók továbbítják. A hozzájárulásomat bármikor visszavonhatom az info@felhom.eu címen.
-                                </label>
-                            </div>
-                            <div class="error-message" id="privacyError" style="margin-top: -16px; margin-bottom: 16px;">Az adatkezelési hozzájárulás szükséges.</div>
-
-                            <button type="submit" class="submit-button" id="submitBtn">
-                                <span class="btn-text">Üzenet küldése →</span>
-                                <span class="spinner"></span>
-                            </button>
-                        </form>
-                    </div>
-
-                    <!-- Sidebar -->
-                    <div class="contact-sidebar">
-                        <div class="sidebar-card">
-                            <h3><span class="icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-mail"/></svg></span> Közvetlen email</h3>
-                            <p>Ha inkább emailben írnál:</p>
-                            <a href="mailto:info@felhom.eu" class="direct-email">
-                                <svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-mail"/></svg> info@felhom.eu
-                            </a>
-                        </div>
-
-                        <div class="sidebar-card">
-                            <h3><span class="icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-clock"/></svg></span> Válaszidő</h3>
-                            <p>Általában <strong style="color: var(--blue-bright);">24 órán belül</strong> válaszolunk munkanapokon.</p>
-                            <p>Sürgős támogatási kérdés esetén jelezd a tárgyban.</p>
-                        </div>
-
-                        <div class="sidebar-card">
-                            <h3><span class="icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-lightbulb"/></svg></span> Miben segíthetünk?</h3>
-                            <ul class="sidebar-list">
-                                <li><span class="li-icon"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-monitor"/></svg></span> Szerver konfiguráció tanácsadás</li>
-                                <li><span class="li-icon"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg></span> Alkalmazás telepítés és beállítás</li>
-                                <li><span class="li-icon"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-lock"/></svg></span> Biztonsági mentés kialakítás</li>
-                                <li><span class="li-icon"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></span> Távoli elérés beállítása</li>
-                                <li><span class="li-icon"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-wrench"/></svg></span> Meglévő szerver karbantartás</li>
-                            </ul>
-                        </div>
-                    </div>
-
-                </div>
-            </div>
-        </section>
-    <section class="content-section alt-bg" id="ki-all-mogotte">
-        <div class="container">
-            <div class="who">
-                <figure class="who-photo">
-                    <img src="/assets/operator-portrait.webp" alt="Nagyfenyvesi Viktor, a Felhom üzemeltetője" width="720" height="900" loading="lazy">
-                </figure>
-                <div class="who-text">
-                    <h2>Ki áll <span>mögötte</span></h2>
-                    <p><strong>Nagyfenyvesi Viktor vagyok.</strong> Tíz éve tervezek hálózatokat és infrastruktúrát, ma DevOps mérnökként dolgozom, otthon pedig évek óta megy a saját szerverem; a mostani nagyjából egy éve fut.</p>
-                    <p>A Felhom onnan indult, hogy ilyen szolgáltatást itthon nem találtam. Saját szervert sokan meg tudnak építeni, de utána menteni, frissíteni és figyelni is kell valakinek. Ezt a részét vállalom át.</p>
-                    <p>Ha írsz, én válaszolok, és nem ígérek olyat, amit a doboz ma nem tud.</p>
-                </div>
-            </div>
-        </div>
-    </section>
-    </main>
-
-    <script>
-    (() => {
-        'use strict';
-
-        // ==============================================
-        // CONFIGURATION
-        // ==============================================
-        const CONFIG = {
-            // TODO: Replace with your actual form backend endpoint.
-            // Options:
-            //   1. Self-hosted: Deploy a small container (e.g. Go/Python) that receives POST and sends via SMTP
-            //   2. Formspree:   'https://formspree.io/f/YOUR_FORM_ID'
-            //   3. Cloudflare Workers: Deploy a worker that forwards to email
-            //
-            // For now, falls back to mailto: if no endpoint is configured.
-            formEndpoint: '/api/contact',
-
-            maxTotalFileSize: 20 * 1024 * 1024,  // 20 MB
-            maxSingleFileSize: 10 * 1024 * 1024,  // 10 MB per file
-            maxFiles: 5,
-            allowedExtensions: ['pdf','doc','docx','xls','xlsx','png','jpg','jpeg','gif','webp','txt','csv','zip','7z'],
-        };
-
-        // ==============================================
-        // DOM REFS
-        // ==============================================
-        const form = document.getElementById('contactForm');
-        const submitBtn = document.getElementById('submitBtn');
-        const formStatus = document.getElementById('formStatus');
-        const dropZone = document.getElementById('dropZone');
-        const fileInput = document.getElementById('fileInput');
-        const fileListEl = document.getElementById('fileList');
-        const fileTotalSizeEl = document.getElementById('fileTotalSize');
-
-        let attachedFiles = [];
-
-        // Preselect the subject from ?tema= (the „Zárt teszt" CTA on the landing page
-        // links here as /kapcsolat?tema=zart-teszt). Unknown values are ignored.
-        (function preselectSubject() {
-            const wanted = new URLSearchParams(window.location.search).get('tema');
-            if (!wanted) return;
-            const select = document.getElementById('subject');
-            if (!select) return;
-            const match = Array.from(select.options).some(o => o.value === wanted);
-            if (match) {
-                select.value = wanted;
-            } else {
-                console.warn('[kapcsolat] unknown ?tema= value, ignoring:', wanted);
-            }
-        })();
-
-        // ==============================================
-        // VALIDATION
-        // ==============================================
-        function validateField(field) {
-            const errorEl = document.getElementById(field.id + 'Error');
-            let valid = true;
-
-            if (field.type === 'checkbox') {
-                valid = field.checked;
-            } else if (field.required && !field.value.trim()) {
-                valid = false;
-            } else if (field.type === 'email' && field.value.trim()) {
-                valid = /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(field.value.trim());
-            }
-
-            if (valid) {
-                field.classList.remove('error');
-                if (errorEl) errorEl.classList.remove('visible');
-            } else {
-                field.classList.add('error');
-                if (errorEl) errorEl.classList.add('visible');
-            }
-
-            return valid;
-        }
-
-        function validateForm() {
-            const fields = ['name', 'email', 'subject', 'message', 'privacy'];
-            let allValid = true;
-
-            fields.forEach(id => {
-                const field = document.getElementById(id);
-                if (!validateField(field)) allValid = false;
-            });
-
-            return allValid;
-        }
-
-        // Live validation on blur
-        ['name', 'email', 'subject', 'message', 'privacy'].forEach(id => {
-            const el = document.getElementById(id);
-            const event = el.type === 'checkbox' ? 'change' : 'blur';
-            el.addEventListener(event, () => validateField(el));
-            // Clear error on input
-            el.addEventListener('input', () => {
-                if (el.classList.contains('error')) validateField(el);
-            });
-        });
-
-        // ==============================================
-        // FILE HANDLING
-        // ==============================================
-        function formatFileSize(bytes) {
-            if (bytes < 1024) return bytes + ' B';
-            if (bytes < 1024 * 1024) return (bytes / 1024).toFixed(1) + ' KB';
-            return (bytes / (1024 * 1024)).toFixed(1) + ' MB';
-        }
-
-        function getFileIcon(name) {
-            const ext = name.split('.').pop().toLowerCase();
-            const icons = {
-                pdf: '<svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-file-text"/></svg>', doc: '<svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-file-text"/></svg>', docx: '<svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-file-text"/></svg>', xls: '<svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chart-column"/></svg>', xlsx: '<svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chart-column"/></svg>',
-                png: '<svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-image"/></svg>', jpg: '<svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-image"/></svg>', jpeg: '<svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-image"/></svg>', gif: '<svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-image"/></svg>', webp: '<svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-image"/></svg>',
-                txt: '<svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-file-text"/></svg>', csv: '<svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chart-column"/></svg>', zip: '<svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg>', '7z': '<svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg>',
-            };
-            return icons[ext] || '<svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-paperclip"/></svg>';
-        }
-
-        function getTotalFileSize() {
-            return attachedFiles.reduce((sum, f) => sum + f.size, 0);
-        }
-
-        function addFiles(fileArray) {
-            for (const file of fileArray) {
-                // Check extension
-                const ext = file.name.split('.').pop().toLowerCase();
-                if (!CONFIG.allowedExtensions.includes(ext)) {
-                    showStatus(`A "${file.name}" fájltípus nem engedélyezett.`, 'error-state');
-                    continue;
-                }
-
-                // Check single file size
-                if (file.size > CONFIG.maxSingleFileSize) {
-                    showStatus(`A "${file.name}" túl nagy (max. ${formatFileSize(CONFIG.maxSingleFileSize)} / fájl).`, 'error-state');
-                    continue;
-                }
-
-                // Check max file count
-                if (attachedFiles.length >= CONFIG.maxFiles) {
-                    showStatus(`Maximum ${CONFIG.maxFiles} fájl csatolható.`, 'error-state');
-                    break;
-                }
-
-                // Check total size
-                if (getTotalFileSize() + file.size > CONFIG.maxTotalFileSize) {
-                    showStatus(`Összesített fájlméret meghaladja a ${formatFileSize(CONFIG.maxTotalFileSize)} limitet.`, 'error-state');
-                    break;
-                }
-
-                // Check duplicate
-                if (attachedFiles.some(f => f.name === file.name && f.size === file.size)) {
-                    continue;
-                }
-
-                attachedFiles.push(file);
-            }
-
-            renderFileList();
-        }
-
-        function removeFile(index) {
-            attachedFiles.splice(index, 1);
-            renderFileList();
-            // Reset file input so same file can be re-added
-            fileInput.value = '';
-        }
-
-        function renderFileList() {
-            if (attachedFiles.length === 0) {
-                fileListEl.innerHTML = '';
-                fileTotalSizeEl.textContent = '';
-                return;
-            }
-
-            fileListEl.innerHTML = attachedFiles.map((file, i) => `
-                <div class="file-item">
-                    <span class="file-icon">${getFileIcon(file.name)}</span>
-                    <div class="file-info">
-                        <div class="file-name" title="${file.name}">${file.name}</div>
-                        <div class="file-size">${formatFileSize(file.size)}</div>
-                    </div>
-                    <button type="button" class="file-remove" data-index="${i}" title="Eltávolítás">&#215;</button>
-                </div>
-            `).join('');
-
-            // Bind remove buttons
-            fileListEl.querySelectorAll('.file-remove').forEach(btn => {
-                btn.addEventListener('click', () => removeFile(parseInt(btn.dataset.index)));
-            });
-
-            // Total size indicator
-            const total = getTotalFileSize();
-            const pct = (total / CONFIG.maxTotalFileSize) * 100;
-            fileTotalSizeEl.textContent = `${formatFileSize(total)} / ${formatFileSize(CONFIG.maxTotalFileSize)}`;
-            fileTotalSizeEl.className = 'file-total-size';
-            if (pct > 90) fileTotalSizeEl.classList.add('error-text');
-            else if (pct > 70) fileTotalSizeEl.classList.add('warning');
-        }
-
-        // File input change
-        fileInput.addEventListener('change', () => {
-            if (fileInput.files.length) {
-                addFiles(Array.from(fileInput.files));
-                fileInput.value = '';
-            }
-        });
-
-        // Drag & drop
-        ['dragenter', 'dragover'].forEach(evt => {
-            dropZone.addEventListener(evt, e => {
-                e.preventDefault();
-                dropZone.classList.add('dragover');
-            });
-        });
-
-        ['dragleave', 'drop'].forEach(evt => {
-            dropZone.addEventListener(evt, e => {
-                e.preventDefault();
-                dropZone.classList.remove('dragover');
-            });
-        });
-
-        dropZone.addEventListener('drop', e => {
-            if (e.dataTransfer.files.length) {
-                addFiles(Array.from(e.dataTransfer.files));
-            }
-        });
-
-        // ==============================================
-        // STATUS MESSAGES
-        // ==============================================
-        function showStatus(message, type) {
-            formStatus.textContent = message;
-            formStatus.className = 'form-status ' + type;
-            formStatus.scrollIntoView({ behavior: 'smooth', block: 'nearest' });
-
-            if (type === 'error-state') {
-                setTimeout(() => {
-                    formStatus.className = 'form-status';
-                }, 6000);
-            }
-        }
-
-        // ==============================================
-        // FORM SUBMISSION
-        // ==============================================
-        form.addEventListener('submit', async (e) => {
-            e.preventDefault();
-            formStatus.className = 'form-status';
-
-            if (!validateForm()) {
-                // Build specific error message
-                const missing = [];
-                if (!document.getElementById('name').value.trim()) missing.push('név');
-                const emailVal = document.getElementById('email').value.trim();
-                if (!emailVal || !/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(emailVal)) missing.push('email');
-                if (!document.getElementById('subject').value) missing.push('tárgy');
-                if (!document.getElementById('message').value.trim()) missing.push('üzenet');
-                if (!document.getElementById('privacy').checked) missing.push('adatkezelési hozzájárulás');
-
-                if (missing.length === 1 && missing[0] === 'adatkezelési hozzájárulás') {
-                    showStatus('Kérlek, fogadd el az adatkezelési hozzájárulást a küldéshez.', 'error-state');
-                } else {
-                    showStatus('Kérlek, töltsd ki az összes kötelező mezőt.', 'error-state');
-                }
-                return;
-            }
-
-            submitBtn.classList.add('loading');
-            submitBtn.disabled = true;
-
-            const formData = {
-                name: document.getElementById('name').value.trim(),
-                email: document.getElementById('email').value.trim(),
-                subject: document.getElementById('subject').value,
-                message: document.getElementById('message').value.trim(),
-            };
-
-            // Subject label mapping
-            const subjectLabels = {
-                'zart-teszt': 'Jelentkezés – zárt teszt',
-                erdeklodes: 'Érdeklődés',
-                arajanlat: 'Árajánlat kérés',
-                tamogatas: 'Támogatás',
-                egyeb: 'Egyéb',
-            };
-
-            try {
-                if (CONFIG.formEndpoint) {
-                    // --- Backend submission ---
-                    const data = new FormData();
-                    data.append('name', formData.name);
-                    data.append('email', formData.email);
-                    data.append('subject', subjectLabels[formData.subject] || formData.subject);
-                    data.append('message', formData.message);
-
-                    attachedFiles.forEach(file => {
-                        data.append('attachments', file);
-                    });
-
-                    const response = await fetch(CONFIG.formEndpoint, {
-                        method: 'POST',
-                        body: data,
-                    });
-
-                    if (!response.ok) {
-                        throw new Error(`Szerver hiba: ${response.status}`);
-                    }
-
-                    showStatus('Üzeneted sikeresen elküldtük! Hamarosan válaszolunk.', 'success');
-                    form.reset();
-                    attachedFiles = [];
-                    renderFileList();
-
-                } else {
-                    // --- Fallback: mailto ---
-                    const subjectLine = `[Felhom.eu] ${subjectLabels[formData.subject] || formData.subject}`;
-                    const body = [
-                        `Név: ${formData.name}`,
-                        `Email: ${formData.email}`,
-                        ``,
-                        formData.message,
-                    ].join('\n');
-
-                    const mailtoUrl = `mailto:info@felhom.eu?subject=${encodeURIComponent(subjectLine)}&body=${encodeURIComponent(body)}`;
-                    window.location.href = mailtoUrl;
-
-                    if (attachedFiles.length > 0) {
-                        showStatus('Az email kliens megnyílt. A csatolt fájlokat kézzel kell hozzáadnod az emailhez, mert a mailto: link nem támogatja a mellékleteket.', 'error-state');
-                    } else {
-                        showStatus('Az email kliens megnyílt az üzeneteddel. Küld el az emailt a kapcsolatfelvételhez!', 'success');
-                    }
-                }
-            } catch (err) {
-                console.error('Form submission error:', err);
-                showStatus(`Hiba történt a küldés során. Kérlek, próbáld újra vagy írj közvetlenül az info@felhom.eu címre.`, 'error-state');
-            } finally {
-                submitBtn.classList.remove('loading');
-                submitBtn.disabled = false;
-            }
-        });
-
-        // ==============================================
-        // DEBUG HELPER
-        // ==============================================
-        // Uncomment to test form states:
-        // window.debugForm = {
-        //     showSuccess: () => showStatus('Üzeneted sikeresen elküldtük!', 'success'),
-        //     showError: () => showStatus('Hiba történt.', 'error-state'),
-        //     getFiles: () => console.log(attachedFiles),
-        //     getFormData: () => {
-        //         const fd = new FormData(form);
-        //         for (const [k,v] of fd.entries()) console.log(k, v);
-        //     },
-        // };
-
-    })();
-    </script>
-    <script>
-    (function() {
-        var hamburger = document.getElementById('hamburger');
-        var navLinks = document.querySelector('.nav-links');
-        var overlay = document.getElementById('mobileOverlay');
-        var body = document.body;
-
-        if (!hamburger || !navLinks || !overlay) {
-            console.warn('[mobile-menu] Missing elements:', {
-                hamburger: !!hamburger,
-                navLinks: !!navLinks,
-                overlay: !!overlay
-            });
-            return;
-        }
-
-        function openMenu() {
-            hamburger.classList.add('is-active');
-            navLinks.classList.add('is-open');
-            overlay.classList.add('is-visible');
-            body.classList.add('menu-open');
-            hamburger.setAttribute('aria-expanded', 'true');
-            hamburger.setAttribute('aria-label', 'Menü bezárása');
-        }
-
-        function closeMenu() {
-            hamburger.classList.remove('is-active');
-            navLinks.classList.remove('is-open');
-            overlay.classList.remove('is-visible');
-            body.classList.remove('menu-open');
-            hamburger.setAttribute('aria-expanded', 'false');
-            hamburger.setAttribute('aria-label', 'Menü megnyitása');
-        }
-
-        hamburger.addEventListener('click', function() {
-            if (navLinks.classList.contains('is-open')) {
-                closeMenu();
-            } else {
-                openMenu();
-            }
-        });
-
-        overlay.addEventListener('click', closeMenu);
-
-        navLinks.querySelectorAll('a').forEach(function(link) {
-            link.addEventListener('click', closeMenu);
-        });
-
-        document.addEventListener('keydown', function(e) {
-            if (e.key === 'Escape' && navLinks.classList.contains('is-open')) {
-                closeMenu();
-            }
-        });
-
-        window.addEventListener('resize', function() {
-            if (window.innerWidth > 900 && navLinks.classList.contains('is-open')) {
-                closeMenu();
-            }
-        });
-    })();
-    </script>
-<footer>
-        <div class="container">
-            <p>© 2026 felhom.eu – Saját felhőd, saját szabályaid</p>
-            <p class="footer-legal">Üzemeltető: Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Adatkezelési tájékoztató</a> · <a href="/feltetelek">Feltételek</a></p>
-        </div>
-    </footer>
-    <script>
-    (function(){
-        var b=document.getElementById('navBurger'),s=document.getElementById('sidebar'),k=document.getElementById('navBackdrop');
-        if(!b||!s||!k)return;
-        function open(){s.classList.add('is-open');k.hidden=false;document.body.classList.add('nav-open');b.setAttribute('aria-expanded','true');}
-        function close(){s.classList.remove('is-open');k.hidden=true;document.body.classList.remove('nav-open');b.setAttribute('aria-expanded','false');}
-        b.addEventListener('click',function(){s.classList.contains('is-open')?close():open();});
-        k.addEventListener('click',close);
-        document.addEventListener('keydown',function(e){if(e.key==='Escape'&&s.classList.contains('is-open')){close();b.focus();}});
-        s.querySelectorAll('a').forEach(function(l){l.addEventListener('click',close);});
-        window.addEventListener('resize',function(){if(window.innerWidth>768)close();});
-    })();
-    document.addEventListener('click',function(e){
-        var btn=e.target.closest?e.target.closest('.nav-group-toggle'):null;
-        if(!btn)return;
-        var g=btn.closest('.nav-group');if(!g)return;
-        var willOpen=!g.classList.contains('is-open');
-        document.querySelectorAll('.nav-group.is-open').forEach(function(x){
-            x.classList.remove('is-open');
-            var t=x.querySelector('.nav-group-toggle');if(t)t.setAttribute('aria-expanded','false');
-        });
-        if(willOpen){g.classList.add('is-open');btn.setAttribute('aria-expanded','true');}
-    });
-    </script>
-</body>
-</html>
diff --git a/website/preview/m3/letoltes.html b/website/preview/m3/letoltes.html
deleted file mode 100644
index 37e0951f..00000000
--- a/website/preview/m3/letoltes.html
+++ /dev/null
@@ -1,207 +0,0 @@
-<!DOCTYPE html>
-<html lang="hu" class="no-js">
-<head>
-    <script>document.documentElement.className=document.documentElement.className.replace('no-js','js');</script>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Letöltés — a Felhom telepítő | Felhom.eu</title>
-    <meta name="description" content="A Felhom otthoni szerver telepítője: letöltés, ellenőrző összeg, és mire figyelj a telepítés előtt.">
-    <meta name="robots" content="noindex, follow">
-    <link rel="canonical" href="https://felhom.eu/letoltes">
-    <link rel="alternate" hreflang="hu" href="https://felhom.eu/letoltes">
-    <link rel="alternate" hreflang="en" href="https://felhom.eu/en/download">
-    <link rel="alternate" hreflang="x-default" href="https://felhom.eu/letoltes">
-
-    <meta property="og:type" content="website">
-    <meta property="og:url" content="https://felhom.eu/letoltes">
-    <meta property="og:title" content="A Felhom telepítő letöltése">
-    <meta property="og:description" content="Letöltés, ellenőrző összeg, és mire figyelj a telepítés előtt.">
-    <meta property="og:image" content="https://felhom.eu/assets/og-image.png">
-    <meta property="og:locale" content="hu_HU">
-    <meta property="og:site_name" content="Felhom.eu">
-
-    <meta name="twitter:card" content="summary_large_image">
-    <meta name="twitter:title" content="A Felhom telepítő letöltése">
-    <meta name="twitter:description" content="Letöltés, ellenőrző összeg, és mire figyelj a telepítés előtt.">
-    <meta name="twitter:image" content="https://felhom.eu/assets/og-image.png">
-    <!-- shared assets: bump ?v= together on any site.css/icons.svg change -->
-    <link rel="stylesheet" href="/assets/site.css?v=21">
-    <link rel="stylesheet" href="/assets/shell.css?v=21">
-    <link rel="icon" type="image/png" href="/assets/logo_favicon_2.svg">
-    <script defer src="https://stats.felhom.eu/script.js" data-website-id="d419db57-5e1c-48df-bdb3-c29f25fb1661"></script>
-</head>
-<body class="shell page-letoltes">
-    <header class="mobile-topbar">
-        <a href="/preview/m3/" class="mobile-topbar-logo"><img src="/assets/logo_notext_white.svg" alt="Felhom.eu"></a>
-        <button type="button" class="nav-burger" id="navBurger" aria-expanded="false" aria-controls="sidebar" aria-label="Menü">
-            <span class="hamburger-box"><span class="hamburger-line"></span><span class="hamburger-line"></span><span class="hamburger-line"></span></span>
-        </button>
-    </header>
-    <div class="nav-backdrop" id="navBackdrop" hidden></div>
-    <nav class="sidebar" id="sidebar">
-        <div class="sidebar-header">
-            <a href="/preview/m3/" class="sidebar-logo-link">
-                <img src="/assets/logo_notext_white.svg" alt="" class="sidebar-logo" aria-hidden="true">
-                <img src="/assets/logo-wordmark.png" alt="felhom.eu" class="sidebar-word">
-            </a>
-        </div>
-        <ul class="nav-links">
-                <li><a href="/preview/m3/"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg>Kezdőlap</a></li>
-                <li><a href="/preview/m3/#szolgaltatasok"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rocket"/></svg>Szolgáltatások</a></li>
-                <li class="nav-group">
-                    <button type="button" class="nav-group-toggle" aria-expanded="false" aria-controls="nav-group-apps"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg>Alkalmazások<svg class="ico nav-chevron" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chevron-down"/></svg></button>
-                    <ul id="nav-group-apps" class="nav-links nav-links-sub nav-links-nested">
-                        <li><a href="/preview/m3/alkalmazasok">Minden alkalmazás</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#fajlkezeles-irodai">Fájlkezelés &amp; Irodai</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#media-szorakozas">Média &amp; Szórakozás</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#otthon-eletmod">Otthon &amp; Életmód</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#produktivitas-tudaskezeles">Produktivitás &amp; Tudáskezelés</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#rendszer-fejlesztes">Rendszer &amp; Fejlesztés</a></li>
-                    </ul>
-                </li>
-                <li><a href="/preview/m3/technologiak"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg>Technológiák</a></li>
-                <li><a href="/preview/m3/biztonsagimentes"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg>Biztonsági mentés</a></li>
-        </ul>
-        <div class="sidebar-bottom">
-            <a href="/preview/m3/teszteles" class="btn btn-outline sidebar-cta">Jelentkezem tesztelőnek →</a>
-            <div class="nav-group-label">A Felhomról</div>
-            <ul class="nav-links nav-links-sub">
-                    <li><a href="/preview/m3/#hogyan-mukodik">Hogyan működik</a></li>
-                    <li><a href="/preview/m3/gyik">GYIK</a></li>
-                    <li><a href="/preview/m3/kapcsolat">Kapcsolat</a></li>
-            </ul>
-            <div class="sidebar-footer">
-                <details class="lang-globe"><summary class="lang-globe-btn" aria-label="Nyelv" title="Nyelv"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/preview/m3/letoltes" lang="hu" hreflang="hu" class="lang-globe-item current" aria-current="true">Magyar</a></li><li><a href="/preview/m3/en/download" lang="en" hreflang="en" class="lang-globe-item">English</a></li></ul></details>
-            </div>
-        </div>
-    </nav>
-<main class="content">
-                <div class="page-header">
-                <h1>A Felhom <span>telepítő</span></h1>
-            </div>
-                <p class="page-lede">Ez az oldal annak szól, aki az üzemeltetőtől telepítési útmutatót kapott. A telepítő egy teljes gépet alakít át Felhom szerverré.</p>
-
-
-        <section class="content-section">
-            <div class="container">
-                <div class="info-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-triangle-alert"/></svg> Mielőtt letöltöd</h3>
-                    <p>A telepítés <strong>minden adatot töröl</strong> a lemezről, amelyet kiválasztasz. A telepítő soha nem választ helyetted: felsorolja a lemezeket méretükkel és típusukkal, és azt írja felül, amelyiket te kijelölöd.</p>
-                    <p>Húzd ki a gépből a mentésre használt külső lemezt, mielőtt elkezded. Ha nem vagy biztos benne, melyik a jó lemez, <strong>állj meg, és hívd az üzemeltetőt</strong>.</p>
-                    <p>A lépéseket az üzemeltetőtől kapott útmutató írja le, képernyőről képernyőre. Az útmutató nélkül ne kezdd el.</p>
-                </div>
-            </div>
-        </section>
-
-        <section class="content-section alt-bg">
-            <div class="container">
-                <div class="section-header">
-                    <h2>Letöltés</h2>
-                    <p>Felhom telepítő 1.29.0 (Proxmox VE 9.2 alapon)</p>
-                </div>
-                <div class="info-card">
-                    <p><a href="https://iso.felhom.eu/felhom-installer-1.29.0-pve9.2-1.iso"><strong>felhom-installer-1.29.0-pve9.2-1.iso</strong></a> – 1,6 GB (1 705 324 544 bájt)</p>
-                    <p>Ellenőrző összeg (SHA-256):</p>
-                    <div class="highlight-box">
-                        <p><code>dceacae5da247d76cad065bf6c0d3bbefac8d8a5f8e571db2fd8449a97e94829</code></p>
-                    </div>
-                    <p>Ugyanez letölthető fájlként is: <a href="https://iso.felhom.eu/felhom-installer-1.29.0-pve9.2-1.iso.sha256">felhom-installer-1.29.0-pve9.2-1.iso.sha256</a></p>
-                    <p>Ellenőrzés Linuxon vagy Macen: <code>sha256sum felhom-installer-1.29.0-pve9.2-1.iso</code>. Windowson PowerShellben: <code>Get-FileHash felhom-installer-1.29.0-pve9.2-1.iso</code>. A kiírt számsornak meg kell egyeznie a fentivel. Ha nem egyezik, ne használd a fájlt, és töltsd le újra.</p>
-                    <p>A letöltött fájlt egy legalább 4 GB-os USB kulcsra kell írni (például a Balena Etcher vagy a Rufus programmal). Az útmutató ezt is leírja.</p>
-                </div>
-            </div>
-        </section>
-    </main>
-    <script>
-    (function() {
-        var hamburger = document.getElementById('hamburger');
-        var navLinks = document.querySelector('.nav-links');
-        var overlay = document.getElementById('mobileOverlay');
-        var body = document.body;
-
-        if (!hamburger || !navLinks || !overlay) {
-            console.warn('[mobile-menu] Missing elements:', {
-                hamburger: !!hamburger,
-                navLinks: !!navLinks,
-                overlay: !!overlay
-            });
-            return;
-        }
-
-        function openMenu() {
-            hamburger.classList.add('is-active');
-            navLinks.classList.add('is-open');
-            overlay.classList.add('is-visible');
-            body.classList.add('menu-open');
-            hamburger.setAttribute('aria-expanded', 'true');
-            hamburger.setAttribute('aria-label', 'Menü bezárása');
-        }
-
-        function closeMenu() {
-            hamburger.classList.remove('is-active');
-            navLinks.classList.remove('is-open');
-            overlay.classList.remove('is-visible');
-            body.classList.remove('menu-open');
-            hamburger.setAttribute('aria-expanded', 'false');
-            hamburger.setAttribute('aria-label', 'Menü megnyitása');
-        }
-
-        hamburger.addEventListener('click', function() {
-            if (navLinks.classList.contains('is-open')) {
-                closeMenu();
-            } else {
-                openMenu();
-            }
-        });
-
-        overlay.addEventListener('click', closeMenu);
-
-        navLinks.querySelectorAll('a').forEach(function(link) {
-            link.addEventListener('click', closeMenu);
-        });
-
-        document.addEventListener('keydown', function(e) {
-            if (e.key === 'Escape' && navLinks.classList.contains('is-open')) {
-                closeMenu();
-            }
-        });
-
-        window.addEventListener('resize', function() {
-            if (window.innerWidth > 900 && navLinks.classList.contains('is-open')) {
-                closeMenu();
-            }
-        });
-    })();
-    </script>
-<footer>
-        <div class="container">
-            <p>© 2026 felhom.eu – Saját felhőd, saját szabályaid</p>
-            <p class="footer-legal">Üzemeltető: Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Adatkezelési tájékoztató</a> · <a href="/feltetelek">Feltételek</a></p>
-        </div>
-    </footer>
-    <script>
-    (function(){
-        var b=document.getElementById('navBurger'),s=document.getElementById('sidebar'),k=document.getElementById('navBackdrop');
-        if(!b||!s||!k)return;
-        function open(){s.classList.add('is-open');k.hidden=false;document.body.classList.add('nav-open');b.setAttribute('aria-expanded','true');}
-        function close(){s.classList.remove('is-open');k.hidden=true;document.body.classList.remove('nav-open');b.setAttribute('aria-expanded','false');}
-        b.addEventListener('click',function(){s.classList.contains('is-open')?close():open();});
-        k.addEventListener('click',close);
-        document.addEventListener('keydown',function(e){if(e.key==='Escape'&&s.classList.contains('is-open')){close();b.focus();}});
-        s.querySelectorAll('a').forEach(function(l){l.addEventListener('click',close);});
-        window.addEventListener('resize',function(){if(window.innerWidth>768)close();});
-    })();
-    document.addEventListener('click',function(e){
-        var btn=e.target.closest?e.target.closest('.nav-group-toggle'):null;
-        if(!btn)return;
-        var g=btn.closest('.nav-group');if(!g)return;
-        var willOpen=!g.classList.contains('is-open');
-        document.querySelectorAll('.nav-group.is-open').forEach(function(x){
-            x.classList.remove('is-open');
-            var t=x.querySelector('.nav-group-toggle');if(t)t.setAttribute('aria-expanded','false');
-        });
-        if(willOpen){g.classList.add('is-open');btn.setAttribute('aria-expanded','true');}
-    });
-    </script>
-</body>
-</html>
diff --git a/website/preview/m3/technologiak.html b/website/preview/m3/technologiak.html
deleted file mode 100644
index 89bc72f9..00000000
--- a/website/preview/m3/technologiak.html
+++ /dev/null
@@ -1,553 +0,0 @@
-<!DOCTYPE html>
-<html lang="hu" class="no-js">
-<head>
-    <script>document.documentElement.className=document.documentElement.className.replace('no-js','js');</script>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Technológiák — Docker, vezérlőpult, Proxmox otthoni szerverhez | Felhom.eu</title>
-    <meta name="description" content="Ipari szintű technológiák otthon: Docker konténerek, magyar vagy angol nyelvű vezérlőpult, Proxmox virtualizáció. HTTPS és titkosított alagút — nyitott port nélkül.">
-    
-    <meta name="keywords" content="Docker, vezérlőpult, Proxmox, konténer, virtualizáció, reverse proxy, HTTPS, titkosított alagút, otthoni szerver technológia">
-    <meta name="robots" content="index, follow">
-    <link rel="canonical" href="https://felhom.eu/technologiak">
-    <link rel="alternate" hreflang="hu" href="https://felhom.eu/technologiak">
-    <link rel="alternate" hreflang="en" href="https://felhom.eu/en/technology">
-    <link rel="alternate" hreflang="x-default" href="https://felhom.eu/technologiak">
-
-    <meta property="og:type" content="article">
-    <meta property="og:url" content="https://felhom.eu/technologiak">
-    <meta property="og:title" content="Professzionális technológiák otthoni szerverhez">
-    <meta property="og:description" content="Docker, magyar vagy angol nyelvű vezérlőpult, Proxmox — ipari szintű megoldások otthoni környezetben.">
-    <meta property="og:image" content="https://felhom.eu/assets/og-image.png">
-    <meta property="og:locale" content="hu_HU">
-    <meta property="og:site_name" content="Felhom.eu">
-
-    <meta name="twitter:card" content="summary_large_image">
-    <meta name="twitter:title" content="Professzionális technológiák otthoni szerverhez">
-    <meta name="twitter:description" content="Docker, magyar vagy angol nyelvű vezérlőpult, Proxmox — ipari megoldások, otthoni környezetben.">
-    <meta name="twitter:image" content="https://felhom.eu/assets/og-image.png">
-
-    <script type="application/ld+json">
-    {
-      "@context": "https://schema.org",
-      "@type": "Article",
-      "headline": "Alkalmazott technológiák otthoni szerverekhez",
-      "description": "Docker konténerek, magyar vagy angol nyelvű vezérlőpult és Proxmox virtualizáció otthoni szerverre.",
-      "author": {"@type": "Organization", "name": "Felhom.eu"},
-      "publisher": {"@type": "Organization", "name": "Felhom.eu", "logo": {"@type": "ImageObject", "url": "https://felhom.eu/assets/logo.png"}},
-      "mainEntityOfPage": "https://felhom.eu/technologiak"
-    }
-    </script>
-    <!-- shared assets: bump ?v= together on any site.css/icons.svg change -->
-    <link rel="stylesheet" href="/assets/site.css?v=21">
-    <link rel="stylesheet" href="/assets/shell.css?v=21">
-    <link rel="icon" type="image/png" href="/assets/logo_favicon_2.svg">
-    <script defer src="/assets/gallery.js?v=2"></script>
-    <script defer src="https://stats.felhom.eu/script.js" data-website-id="d419db57-5e1c-48df-bdb3-c29f25fb1661"></script>
-</head>
-<body class="shell page-technologiak">
-    <header class="mobile-topbar">
-        <a href="/preview/m3/" class="mobile-topbar-logo"><img src="/assets/logo_notext_white.svg" alt="Felhom.eu"></a>
-        <button type="button" class="nav-burger" id="navBurger" aria-expanded="false" aria-controls="sidebar" aria-label="Menü">
-            <span class="hamburger-box"><span class="hamburger-line"></span><span class="hamburger-line"></span><span class="hamburger-line"></span></span>
-        </button>
-    </header>
-    <div class="nav-backdrop" id="navBackdrop" hidden></div>
-    <nav class="sidebar" id="sidebar">
-        <div class="sidebar-header">
-            <a href="/preview/m3/" class="sidebar-logo-link">
-                <img src="/assets/logo_notext_white.svg" alt="" class="sidebar-logo" aria-hidden="true">
-                <img src="/assets/logo-wordmark.png" alt="felhom.eu" class="sidebar-word">
-            </a>
-        </div>
-        <ul class="nav-links">
-                <li><a href="/preview/m3/"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg>Kezdőlap</a></li>
-                <li><a href="/preview/m3/#szolgaltatasok"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rocket"/></svg>Szolgáltatások</a></li>
-                <li class="nav-group">
-                    <button type="button" class="nav-group-toggle" aria-expanded="false" aria-controls="nav-group-apps"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg>Alkalmazások<svg class="ico nav-chevron" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chevron-down"/></svg></button>
-                    <ul id="nav-group-apps" class="nav-links nav-links-sub nav-links-nested">
-                        <li><a href="/preview/m3/alkalmazasok">Minden alkalmazás</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#fajlkezeles-irodai">Fájlkezelés &amp; Irodai</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#media-szorakozas">Média &amp; Szórakozás</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#otthon-eletmod">Otthon &amp; Életmód</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#produktivitas-tudaskezeles">Produktivitás &amp; Tudáskezelés</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#rendszer-fejlesztes">Rendszer &amp; Fejlesztés</a></li>
-                    </ul>
-                </li>
-                <li><a href="/preview/m3/technologiak" class="active"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg>Technológiák</a></li>
-                <li><a href="/preview/m3/biztonsagimentes"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg>Biztonsági mentés</a></li>
-        </ul>
-        <div class="sidebar-bottom">
-            <a href="/preview/m3/teszteles" class="btn btn-outline sidebar-cta">Jelentkezem tesztelőnek →</a>
-            <div class="nav-group-label">A Felhomról</div>
-            <ul class="nav-links nav-links-sub">
-                    <li><a href="/preview/m3/#hogyan-mukodik">Hogyan működik</a></li>
-                    <li><a href="/preview/m3/gyik">GYIK</a></li>
-                    <li><a href="/preview/m3/kapcsolat">Kapcsolat</a></li>
-            </ul>
-            <div class="sidebar-footer">
-                <details class="lang-globe"><summary class="lang-globe-btn" aria-label="Nyelv" title="Nyelv"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/preview/m3/technologiak" lang="hu" hreflang="hu" class="lang-globe-item current" aria-current="true">Magyar</a></li><li><a href="/preview/m3/en/technology" lang="en" hreflang="en" class="lang-globe-item">English</a></li></ul></details>
-            </div>
-        </div>
-    </nav>
-<main class="content">
-                <div class="page-header">
-                <h1>Alkalmazott <span>Technológiák</span></h1>
-            </div>
-                <p class="page-lede">Modern, bevált megoldások az otthoni szerverek üzemeltetéséhez. Íme, hogyan építjük fel a rendszereket.</p>
-
-
-        <!-- Table of Contents -->
-        <section class="content-section" style="padding-top: 0;">
-            <div class="container">
-                <div class="toc-nav">
-                    <h3>Tartalom</h3>
-                    <ul class="toc-links">
-                        <li><a href="#kontenerek">Miért konténerek?</a></li>
-                        <li><a href="#single-node">A kezelőréteg (vezérlőpult)</a></li>
-                        <li><a href="#proxmox">Virtualizáció (Proxmox)</a></li>
-                        <li><a href="#halozat">Hálózat és biztonság</a></li>
-                        <li><a href="#tarolas">Tárolás</a></li>
-                        <li><a href="#hardver">Hardver konfigurációk</a></li>
-                    </ul>
-                </div>
-            </div>
-        </section>
-
-        <!-- Miért konténerek? -->
-        <section class="content-section alt-bg" id="kontenerek">
-            <div class="container">
-                <div class="section-header">
-                    <h2>Miért <span>konténerek?</span></h2>
-                    <p>A modern szerverüzemeltetés alapköve</p>
-                </div>
-
-                <div class="info-card">
-                    <h3><span class="icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg></span> Mi az a konténer?</h3>
-                    <p>Képzeld el, hogy minden alkalmazás egy saját, elszigetelt „dobozban" fut. Ez a doboz tartalmazza az alkalmazást és minden függőségét – így garantáltan ugyanúgy működik bárhol, bármilyen szerveren.</p>
-                    <p>A konténerek (Docker) forradalmasították a szerverüzemeltetést: egyszerűbb telepítés, könnyebb frissítés, és megbízhatóbb működés.</p>
-                    
-                    <div class="highlight-box">
-                        <p><strong>Analógia:</strong> Mintha minden alkalmazás a saját lakásában élne egy társasházban. Van saját bejárata, saját közműórája, és nem zavarja a szomszédokat – de mégis egy épületen osztoznak.</p>
-                    </div>
-                </div>
-
-                <div class="comparison-grid">
-                    <div class="comparison-card">
-                        <div class="card-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-monitor"/></svg></div>
-                        <h3>Hagyományos telepítés</h3>
-                        <div class="subtitle">„Közvetlenül a rendszerre"</div>
-                        <p>Az alkalmazások közvetlenül az operációs rendszerre települnek. Ütközhetnek egymással, nehéz eltávolítani őket.</p>
-                        <ul class="feature-list cons">
-                            <li>Függőségek összeakadhatnak</li>
-                            <li>Nehéz reprodukálni más szerveren</li>
-                            <li>Frissítés = kockázat</li>
-                            <li>Eltávolítás „szemetet" hagy</li>
-                        </ul>
-                    </div>
-
-                    <div class="comparison-card recommended">
-                        <div class="card-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-container"/></svg></div>
-                        <h3>Konténerizált telepítés</h3>
-                        <div class="subtitle">Docker</div>
-                        <p>Minden alkalmazás elszigetelten fut. Tiszta, rendezett, könnyen kezelhető rendszer.</p>
-                        <ul class="feature-list">
-                            <li>Teljesen izolált alkalmazások</li>
-                            <li>Egy parancs = telepítés</li>
-                            <li>Egyszerű frissítés és visszaállás</li>
-                            <li>Bárhol reprodukálható</li>
-                        </ul>
-                    </div>
-                </div>
-            </div>
-        </section>
-
-        <!-- Single Node - vezérlőpult -->
-        <section class="content-section" id="single-node">
-            <div class="container">
-                <div class="section-header">
-                    <h2>A kezelőréteg: <span>a vezérlőpult</span></h2>
-                    <p>Minden Felhom doboz kezelőfelülete, magyarul vagy angolul</p>
-                </div>
-
-                <div class="info-card">
-                    <h3><span class="icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-target"/></svg></span> Mit csinál a vezérlőpult?</h3>
-                    <p>A vezérlőpult minden Felhom dobozon ott van: ez a magyar vagy angol nyelvű kezelőfelület, amely a Proxmox alapra épülő rendszeredet vezérli. Egy kimondottan otthoni szerverekre tervezett felület, ahol pár kattintással telepíthetsz alkalmazásokat, és nem kell parancssorhoz nyúlnod – a háttérben a Docker és a Proxmox dolgozik helyetted.</p>
-                    
-                    <ul class="feature-list">
-                        <li>Magyar vagy angol webes felület – a háztartás választ, és nincs szükség parancssor ismeretre</li>
-                        <li>Alkalmazás katalógus – 58 app telepíthető pár kattintással</li>
-                        <li>Erőforrás figyelés – memória és tárhely használat valós időben</li>
-                        <li>Automatikus mentések – adatbázis és fájl backup, állapotfigyeléssel</li>
-                        <li>Alkalmazás frissítések – csak kipróbált verzió, előtte friss mentés, és ha az új verzió nem indul, a doboz magától visszaáll az előzőre</li>
-                        <li>Rendszer monitoring – folyamatos egészségfigyelés, riasztások</li>
-                    </ul>
-
-                    <div class="dash-grid">
-                    <figure class="dash-shot">
-                        <a href="/assets/dashboard-apps-hu.webp" data-gallery="dashboard"><img src="/assets/dashboard-apps-hu.webp" alt="Az Alkalmazások oldal: telepített és telepíthető alkalmazások kártyái, állapottal" width="1440" height="900" loading="lazy"></a>
-                        <figcaption><strong>Alkalmazások</strong> – telepítés pár kattintással, és látod, mi fut és mi naprakész.</figcaption>
-                    </figure>
-                    <figure class="dash-shot">
-                        <a href="/assets/dashboard-backups-hu.webp" data-gallery="dashboard"><img src="/assets/dashboard-backups-hu.webp" alt="A mentések oldala: minden alkalmazás adatbázisának éjszakai mentése, ellenőrizve" width="1440" height="900" loading="lazy"></a>
-                        <figcaption><strong>Mentések</strong> – minden éjjel minden alkalmazás adatbázisa mentésre kerül, és ellenőrizzük.</figcaption>
-                    </figure>
-                    </div>
-
-                    <div class="highlight-box">
-                        <p><strong>Tökéletes:</strong> Otthoni média szerver, családi felhő, személyes projektek, kis irodai használat.</p>
-                    </div>
-                </div>
-
-                <div class="stack-diagram">
-                    <h3>Egy Felhom doboz felépítése</h3>
-                    <div class="stack-layers">
-                        <div class="stack-layer">
-                            <div class="layer-label">Kezelő + appok</div>
-                            <div class="layer-content highlight">
-                                <div class="layer-name">Vezérlőpult + Alkalmazások</div>
-                                <div class="layer-tech">Magyar vagy angol kezelőfelület · Nextcloud, Jellyfin, Immich…</div>
-                            </div>
-                        </div>
-                        <div class="stack-layer">
-                            <div class="layer-label">Konténer motor</div>
-                            <div class="layer-content">
-                                <div class="layer-name">Docker</div>
-                                <div class="layer-tech">Az appok elszigetelt konténerekben futnak</div>
-                            </div>
-                        </div>
-                        <div class="stack-layer">
-                            <div class="layer-label">Rendszerkörnyezet</div>
-                            <div class="layer-content">
-                                <div class="layer-name">Izolált rendszerkörnyezet</div>
-                                <div class="layer-tech">A te dobozod – tisztán elkülönített rendszer</div>
-                            </div>
-                        </div>
-                        <div class="stack-layer">
-                            <div class="layer-label">Alapréteg</div>
-                            <div class="layer-content">
-                                <div class="layer-name">Proxmox VE</div>
-                                <div class="layer-tech">Virtualizációs alap · a teljes doboz mentése, visszaállítás</div>
-                            </div>
-                        </div>
-                        <div class="stack-layer">
-                            <div class="layer-label">Hardver</div>
-                            <div class="layer-content">
-                                <div class="layer-name">A szerver gépe</div>
-                                <div class="layer-tech">Mini PC, tower vagy szerver</div>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </section>
-
-        <!-- Proxmox -->
-        <section class="content-section alt-bg" id="proxmox">
-            <div class="container">
-                <div class="section-header">
-                    <h2>Az alapréteg: <span>Proxmox</span></h2>
-                    <p>Erre a stabil alapra építünk minden Felhom gépet</p>
-                </div>
-
-                <div class="info-card">
-                    <h3><span class="icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg></span> Mi az a Proxmox?</h3>
-                    <p>A Proxmox VE egy ingyenes, professzionális virtualizációs platform – ugyanaz a fajta technológia, amelyet adatközpontok és cégek használnak. Ez a Felhom rendszerek alapja: erre építünk minden gépet, és erre települ az izolált rendszerkörnyezet, amelyben az alkalmazásaid futnak.</p>
-
-                    <div class="highlight-box">
-                        <p><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg> <strong>Az alap, nem opció:</strong> A Proxmox minden Felhom dobozon ott van. Nem kell róla tudnod és nem kell vele foglalkoznod – csendben a háttérben dolgozik, és ez teszi a rendszeredet biztonságossá és menthetővé.</p>
-                    </div>
-                </div>
-
-                <div class="info-card">
-                    <h3><span class="icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-target"/></svg></span> Mit ad neked a Proxmox alap?</h3>
-
-                    <ul class="feature-list">
-                        <li><strong>Mentés frissítés előtt</strong> – egy alkalmazás frissítése előtt friss mentés készül, és ha az új verzió nem indul el, a doboz magától visszaállítja az előzőt</li>
-                        <li><strong>Az egész rendszer menthető</strong> – nem csak az adataid, hanem a teljes dobozod is biztonsági mentésbe kerül, és ebből visszaállítható</li>
-                        <li><strong>Tiszta elkülönítés</strong> – a kezelőréteg és az alkalmazásaid erősen elkülönítve futnak, így stabilabb és biztonságosabb a rendszer</li>
-                        <li><strong>Gyors, megismételhető telepítés</strong> – egy új doboz beüzemelése gyors és kiszámítható, mindig ugyanúgy</li>
-                    </ul>
-
-                    <div class="highlight-box">
-                        <p><strong>Egy alap, egy feladat:</strong> a Felhom dobozon a Proxmox egyetlen elkülönített rendszerkörnyezetet futtat – azt, amelyben az alkalmazásaid dolgoznak.</p>
-                    </div>
-                </div>
-            </div>
-        </section>
-
-        <!-- Hálózat -->
-        <section class="content-section alt-bg" id="halozat">
-            <div class="container">
-                <div class="section-header">
-                    <h2>Hálózat és <span>biztonság</span></h2>
-                    <p>Hogyan éred el a szervered biztonságosan, bárhonnan?</p>
-                </div>
-
-                <div class="info-card">
-                    <h3><span class="icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rotate-cw"/></svg></span> Reverse Proxy</h3>
-                    <p>A reverse proxy egy „kapus", aki fogadja a beérkező kéréseket és továbbítja a megfelelő alkalmazáshoz. Emellett kezeli a HTTPS titkosítást is.</p>
-                    
-                    <div class="network-flow">
-                        <div class="flow-node">
-                            <div class="node-icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></div>
-                            <div class="node-label">Internet</div>
-                        </div>
-                        <div class="flow-arrow">→</div>
-                        <div class="flow-node">
-                            <div class="node-icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-lock"/></svg></div>
-                            <div class="node-label">Reverse Proxy</div>
-                            <div class="node-tech">Traefik</div>
-                        </div>
-                        <div class="flow-arrow">→</div>
-                        <div class="flow-node">
-                            <div class="node-icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg></div>
-                            <div class="node-label">Alkalmazás</div>
-                        </div>
-                    </div>
-
-                    <ul class="feature-list">
-                        <li><strong>Traefik</strong> – minden alkalmazás a saját aldomainjén, HTTPS-sel</li>
-                        <li><strong>Titkosított alagút</strong> – a doboz maga épít kapcsolatot kifelé, így otthon nem kell portot nyitni</li>
-                    </ul>
-                </div>
-
-                <div class="info-card">
-                    <h3><span class="icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield"/></svg></span> Védelem</h3>
-                    <ul class="feature-list">
-                        <li><strong>Nincs nyitott port</strong> – kívülről csak a titkosított alagúton át érhető el a doboz</li>
-                        <li><strong>Saját bejelentkezés</strong> – minden alkalmazásnak saját fiókjai vannak, a vezérlőpultnak jelszava</li>
-                        <li><strong>Családi kapu</strong> – egyes alkalmazások elé a családtagok saját belépése kerül, idegen el sem jut az alkalmazásig</li>
-                        <li><strong>Biztonsági frissítések</strong> – a doboz rendszere magától megkapja őket</li>
-                    </ul>
-                </div>
-            </div>
-        </section>
-
-        <!-- Tárolás -->
-        <section class="content-section" id="tarolas">
-            <div class="container">
-                <div class="section-header">
-                    <h2>Tárolás és <span>adatvédelem</span></h2>
-                    <p>Hol és hogyan tárold az adataidat?</p>
-                </div>
-
-                <div class="comparison-grid">
-                    <div class="comparison-card">
-                        <div class="card-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-zap"/></svg></div>
-                        <h3>SSD (NVMe/SATA)</h3>
-                        <div class="subtitle">Gyors tárolás</div>
-                        <ul class="feature-list">
-                            <li>Operációs rendszer</li>
-                            <li>Adatbázisok</li>
-                            <li>Alkalmazások</li>
-                        </ul>
-                    </div>
-                    <div class="comparison-card">
-                        <div class="card-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-database"/></svg></div>
-                        <h3>HDD</h3>
-                        <div class="subtitle">Nagy kapacitás</div>
-                        <ul class="feature-list">
-                            <li>Média könyvtár</li>
-                            <li>Fotó archívum</li>
-                            <li>Mentések</li>
-                        </ul>
-                    </div>
-                </div>
-
-                <div class="info-card" style="margin-top: 32px;">
-                    <h3><span class="icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rotate-cw"/></svg></span> Háromszintű mentés – így védjük az adataidat</h3>
-                    <p>A Felhom dobozon minden éjjel készül egy <strong>mentés a dobozon</strong>, egy <strong>másodpéldány egy második meghajtóra</strong>, és egy <strong>titkosított másolat egy távoli tárhelyre</strong>. A szintek együtt védenek: a helyi gyors, a távoli túléli azt is, ha a doboznak fizikailag baja esik.</p>
-
-                    <div class="warning-box">
-                        <p><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-triangle-alert"/></svg> <strong>A több lemez önmagában nem mentés!</strong> A RAID-szerű megoldások a hardver meghibásodás ellen védenek, de nem a véletlen törlés vagy a zsarolóvírus ellen. Ezért nálunk a mentés mindig külön szinten van, nem a lemezekben.</p>
-                    </div>
-                </div>
-            </div>
-        </section>
-
-        <!-- Hardver konfigurációk -->
-        <section class="content-section alt-bg" id="hardver">
-            <div class="container">
-                <div class="section-header">
-                    <h2>Hardver <span>konfigurációk</span></h2>
-                    <p>Milyen gépre van szükséged? Néhány példa konfiguráció</p>
-                </div>
-
-                <div class="hardware-grid">
-                    <div class="hardware-card">
-                        <div class="hardware-card-header">
-                            <div class="hw-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg></div>
-                            <h3>Mini PC + NAS</h3>
-                            <div class="hw-subtitle">Kezdő / Otthoni</div>
-                        </div>
-                        <div class="hardware-card-body">
-                            <p>Kompakt, halk, energiatakarékos megoldás.</p>
-                            <ul class="spec-list">
-                                <li><span class="spec-label">CPU</span><span class="spec-value">Intel N100</span></li>
-                                <li><span class="spec-label">RAM</span><span class="spec-value">16-32 GB</span></li>
-                                <li><span class="spec-label">SSD</span><span class="spec-value">256-512 GB</span></li>
-                                <li><span class="spec-label">Fogyasztás</span><span class="spec-value">15-35W</span></li>
-                            </ul>
-                            <div class="price-range">
-                                <div class="label">Becsült költség</div>
-                                <div class="price">80.000 - 150.000 Ft</div>
-                            </div>
-                        </div>
-                    </div>
-
-                    <div class="hardware-card">
-                        <div class="hardware-card-header">
-                            <div class="hw-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-radio-tower"/></svg></div>
-                            <h3>Tower szerver</h3>
-                            <div class="hw-subtitle">Haladó / Családi</div>
-                        </div>
-                        <div class="hardware-card-body">
-                            <p>Nagyobb teljesítmény és tárolókapacitás.</p>
-                            <ul class="spec-list">
-                                <li><span class="spec-label">CPU</span><span class="spec-value">Intel i5/i7</span></li>
-                                <li><span class="spec-label">RAM</span><span class="spec-value">32-64 GB</span></li>
-                                <li><span class="spec-label">Tárolás</span><span class="spec-value">4-8 TB</span></li>
-                                <li><span class="spec-label">Fogyasztás</span><span class="spec-value">50-120W</span></li>
-                            </ul>
-                            <div class="price-range">
-                                <div class="label">Becsült költség</div>
-                                <div class="price">200.000 - 400.000 Ft</div>
-                            </div>
-                        </div>
-                    </div>
-
-                    <div class="hardware-card">
-                        <div class="hardware-card-header">
-                            <div class="hw-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-building-2"/></svg></div>
-                            <h3>Rack szerver</h3>
-                            <div class="hw-subtitle">Üzleti / igény szerint</div>
-                        </div>
-                        <div class="hardware-card-body">
-                            <p>Ipari minőség, nagy megbízhatóság.</p>
-                            <ul class="spec-list">
-                                <li><span class="spec-label">CPU</span><span class="spec-value">Xeon / EPYC</span></li>
-                                <li><span class="spec-label">RAM</span><span class="spec-value">64-256 GB ECC</span></li>
-                                <li><span class="spec-label">Tárolás</span><span class="spec-value">8-24 bay</span></li>
-                                <li><span class="spec-label">Extra</span><span class="spec-value">IPMI, red. PSU</span></li>
-                            </ul>
-                            <div class="price-range">
-                                <div class="label">Becsült költség (használt)</div>
-                                <div class="price">150.000 - 600.000 Ft</div>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-
-                <div class="info-card" style="margin-top: 48px;">
-                    <h3><span class="icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-lightbulb"/></svg></span> Melyiket válaszd?</h3>
-                    <div class="highlight-box">
-                        <p><strong>Tanácsunk:</strong> Kezdj kicsiben! Egy jó mini PC elegendő a legtöbb otthoni igényhez, és később bővítheted. A rack szerver üzleti / igény szerinti konfiguráció – otthonra ritkán szükséges.</p>
-                    </div>
-                </div>
-            </div>
-        </section>
-
-        <!-- CTA -->
-        <section class="cta-section">
-            <div class="container">
-                <h2>Nem vagy biztos, melyik <span>megoldás neked való?</span></h2>
-                <p>Beszéljük át az igényeidet, és segítünk megtalálni a tökéletes konfigurációt.</p>
-                <a href="/kapcsolat" class="cta-button">Kapcsolatfelvétel →</a>
-                <a href="/alkalmazasok" class="cta-button-secondary">Alkalmazások böngészése →</a>
-            </div>
-        </section>
-    </main>
-    <script>
-    (function() {
-        var hamburger = document.getElementById('hamburger');
-        var navLinks = document.querySelector('.nav-links');
-        var overlay = document.getElementById('mobileOverlay');
-        var body = document.body;
-
-        if (!hamburger || !navLinks || !overlay) {
-            console.warn('[mobile-menu] Missing elements:', {
-                hamburger: !!hamburger,
-                navLinks: !!navLinks,
-                overlay: !!overlay
-            });
-            return;
-        }
-
-        function openMenu() {
-            hamburger.classList.add('is-active');
-            navLinks.classList.add('is-open');
-            overlay.classList.add('is-visible');
-            body.classList.add('menu-open');
-            hamburger.setAttribute('aria-expanded', 'true');
-            hamburger.setAttribute('aria-label', 'Menü bezárása');
-        }
-
-        function closeMenu() {
-            hamburger.classList.remove('is-active');
-            navLinks.classList.remove('is-open');
-            overlay.classList.remove('is-visible');
-            body.classList.remove('menu-open');
-            hamburger.setAttribute('aria-expanded', 'false');
-            hamburger.setAttribute('aria-label', 'Menü megnyitása');
-        }
-
-        hamburger.addEventListener('click', function() {
-            if (navLinks.classList.contains('is-open')) {
-                closeMenu();
-            } else {
-                openMenu();
-            }
-        });
-
-        overlay.addEventListener('click', closeMenu);
-
-        navLinks.querySelectorAll('a').forEach(function(link) {
-            link.addEventListener('click', closeMenu);
-        });
-
-        document.addEventListener('keydown', function(e) {
-            if (e.key === 'Escape' && navLinks.classList.contains('is-open')) {
-                closeMenu();
-            }
-        });
-
-        window.addEventListener('resize', function() {
-            if (window.innerWidth > 900 && navLinks.classList.contains('is-open')) {
-                closeMenu();
-            }
-        });
-    })();
-    </script>
-<footer>
-        <div class="container">
-            <p>© 2026 felhom.eu – Saját felhőd, saját szabályaid</p>
-            <p class="footer-legal">Üzemeltető: Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Adatkezelési tájékoztató</a> · <a href="/feltetelek">Feltételek</a></p>
-        </div>
-    </footer>
-    <script>
-    (function(){
-        var b=document.getElementById('navBurger'),s=document.getElementById('sidebar'),k=document.getElementById('navBackdrop');
-        if(!b||!s||!k)return;
-        function open(){s.classList.add('is-open');k.hidden=false;document.body.classList.add('nav-open');b.setAttribute('aria-expanded','true');}
-        function close(){s.classList.remove('is-open');k.hidden=true;document.body.classList.remove('nav-open');b.setAttribute('aria-expanded','false');}
-        b.addEventListener('click',function(){s.classList.contains('is-open')?close():open();});
-        k.addEventListener('click',close);
-        document.addEventListener('keydown',function(e){if(e.key==='Escape'&&s.classList.contains('is-open')){close();b.focus();}});
-        s.querySelectorAll('a').forEach(function(l){l.addEventListener('click',close);});
-        window.addEventListener('resize',function(){if(window.innerWidth>768)close();});
-    })();
-    document.addEventListener('click',function(e){
-        var btn=e.target.closest?e.target.closest('.nav-group-toggle'):null;
-        if(!btn)return;
-        var g=btn.closest('.nav-group');if(!g)return;
-        var willOpen=!g.classList.contains('is-open');
-        document.querySelectorAll('.nav-group.is-open').forEach(function(x){
-            x.classList.remove('is-open');
-            var t=x.querySelector('.nav-group-toggle');if(t)t.setAttribute('aria-expanded','false');
-        });
-        if(willOpen){g.classList.add('is-open');btn.setAttribute('aria-expanded','true');}
-    });
-    </script>
-</body>
-</html>
diff --git a/website/preview/m3/teszteles.html b/website/preview/m3/teszteles.html
deleted file mode 100644
index 935cd972..00000000
--- a/website/preview/m3/teszteles.html
+++ /dev/null
@@ -1,324 +0,0 @@
-<!DOCTYPE html>
-<html lang="hu" class="no-js">
-<head>
-    <script>document.documentElement.className=document.documentElement.className.replace('no-js','js');</script>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Tesztelőket keresünk — otthoni szerver, saját felhő ingyen kipróbálva | Felhom.eu</title>
-    <meta name="description" content="Keresünk magyar háztartásokat, akik kipróbálják az otthoni szerverünket. A teszt alatt nincs díj, a beállítást mi végezzük, és a domaint is mi fizetjük két évre. Legfeljebb 5 háztartás.">
-    <meta name="keywords" content="otthoni szerver teszt, tesztelő jelentkezés, saját felhő, NAS otthonra, zárt teszt, otthoni szerver ingyen">
-    <meta name="robots" content="index, follow">
-    <link rel="canonical" href="https://felhom.eu/teszteles">
-    <link rel="alternate" hreflang="hu" href="https://felhom.eu/teszteles">
-    <link rel="alternate" hreflang="en" href="https://felhom.eu/en/testing">
-    <link rel="alternate" hreflang="x-default" href="https://felhom.eu/teszteles">
-
-    <meta property="og:type" content="article">
-    <meta property="og:url" content="https://felhom.eu/teszteles">
-    <meta property="og:title" content="Tesztelőket keresünk — saját felhő otthon, a teszt alatt ingyen">
-    <meta property="og:description" content="A fotóid és a dokumentumaid a saját gépeden, nálad. A beállítást mi végezzük, a domaint két évre mi fizetjük. Legfeljebb 5 háztartás.">
-    <meta property="og:image" content="https://felhom.eu/assets/og-image.png">
-    <meta property="og:locale" content="hu_HU">
-    <meta property="og:site_name" content="Felhom.eu">
-
-    <meta name="twitter:card" content="summary_large_image">
-    <meta name="twitter:title" content="Tesztelőket keresünk — saját felhő otthon">
-    <meta name="twitter:description" content="A teszt alatt nincs díj. A beállítást mi végezzük, a domaint két évre mi fizetjük.">
-    <meta name="twitter:image" content="https://felhom.eu/assets/og-image.png">
-
-    <script type="application/ld+json">
-    {
-      "@context": "https://schema.org",
-      "@type": "Article",
-      "headline": "Tesztelőket keresünk a Felhom zárt tesztjéhez",
-      "description": "Mi kell hozzá, mit kapsz, mit kérünk, és hogyan jelentkezhetsz a Felhom zárt tesztjébe.",
-      "author": {"@type": "Organization", "name": "Felhom.eu"},
-      "publisher": {"@type": "Organization", "name": "Felhom.eu", "logo": {"@type": "ImageObject", "url": "https://felhom.eu/assets/logo.png"}},
-      "mainEntityOfPage": "https://felhom.eu/teszteles"
-    }
-    </script>
-    <!-- shared assets: bump ?v= together on any site.css/icons.svg change -->
-    <link rel="stylesheet" href="/assets/site.css?v=21">
-    <link rel="stylesheet" href="/assets/shell.css?v=21">
-    <link rel="icon" type="image/png" href="/assets/logo_favicon_2.svg">
-    <script defer src="https://stats.felhom.eu/script.js" data-website-id="d419db57-5e1c-48df-bdb3-c29f25fb1661"></script>
-</head>
-<body class="shell page-teszteles">
-    <header class="mobile-topbar">
-        <a href="/preview/m3/" class="mobile-topbar-logo"><img src="/assets/logo_notext_white.svg" alt="Felhom.eu"></a>
-        <button type="button" class="nav-burger" id="navBurger" aria-expanded="false" aria-controls="sidebar" aria-label="Menü">
-            <span class="hamburger-box"><span class="hamburger-line"></span><span class="hamburger-line"></span><span class="hamburger-line"></span></span>
-        </button>
-    </header>
-    <div class="nav-backdrop" id="navBackdrop" hidden></div>
-    <nav class="sidebar" id="sidebar">
-        <div class="sidebar-header">
-            <a href="/preview/m3/" class="sidebar-logo-link">
-                <img src="/assets/logo_notext_white.svg" alt="" class="sidebar-logo" aria-hidden="true">
-                <img src="/assets/logo-wordmark.png" alt="felhom.eu" class="sidebar-word">
-            </a>
-        </div>
-        <ul class="nav-links">
-                <li><a href="/preview/m3/"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg>Kezdőlap</a></li>
-                <li><a href="/preview/m3/#szolgaltatasok"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rocket"/></svg>Szolgáltatások</a></li>
-                <li class="nav-group">
-                    <button type="button" class="nav-group-toggle" aria-expanded="false" aria-controls="nav-group-apps"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg>Alkalmazások<svg class="ico nav-chevron" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chevron-down"/></svg></button>
-                    <ul id="nav-group-apps" class="nav-links nav-links-sub nav-links-nested">
-                        <li><a href="/preview/m3/alkalmazasok">Minden alkalmazás</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#fajlkezeles-irodai">Fájlkezelés &amp; Irodai</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#media-szorakozas">Média &amp; Szórakozás</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#otthon-eletmod">Otthon &amp; Életmód</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#produktivitas-tudaskezeles">Produktivitás &amp; Tudáskezelés</a></li>
-                        <li><a href="/preview/m3/alkalmazasok#rendszer-fejlesztes">Rendszer &amp; Fejlesztés</a></li>
-                    </ul>
-                </li>
-                <li><a href="/preview/m3/technologiak"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg>Technológiák</a></li>
-                <li><a href="/preview/m3/biztonsagimentes"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg>Biztonsági mentés</a></li>
-        </ul>
-        <div class="sidebar-bottom">
-            <a href="/preview/m3/teszteles" class="btn btn-outline sidebar-cta">Jelentkezem tesztelőnek →</a>
-            <div class="nav-group-label">A Felhomról</div>
-            <ul class="nav-links nav-links-sub">
-                    <li><a href="/preview/m3/#hogyan-mukodik">Hogyan működik</a></li>
-                    <li><a href="/preview/m3/gyik">GYIK</a></li>
-                    <li><a href="/preview/m3/kapcsolat">Kapcsolat</a></li>
-            </ul>
-            <div class="sidebar-footer">
-                <details class="lang-globe"><summary class="lang-globe-btn" aria-label="Nyelv" title="Nyelv"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/preview/m3/teszteles" lang="hu" hreflang="hu" class="lang-globe-item current" aria-current="true">Magyar</a></li><li><a href="/preview/m3/en/testing" lang="en" hreflang="en" class="lang-globe-item">English</a></li></ul></details>
-            </div>
-        </div>
-    </nav>
-<main class="content">
-                <div class="page-header">
-                <h1>Legyél <span>tesztelő</span></h1>
-            </div>
-                <p class="page-lede">Néhány magyar háztartással most kezdjük el élesben használni a rendszert. A teszt alatt nincs díj, a beállítást mi végezzük, és a domaint is mi fizetjük. Cserébe azt kérjük, mondd el, mi nem jó.</p>
-
-
-        <!-- Kinek szól -->
-        <section class="content-section">
-            <div class="container">
-                <div class="section-header">
-                    <h2>Kinek <span>szól</span></h2>
-                    <p>Nem informatikusokat keresünk – családokat, akik tényleg használni fogják</p>
-                </div>
-                <div class="info-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg> Egy magyar háztartás, aki haza akarja tenni az adatait</h3>
-                    <p>Ha a fényképeid, a beszkennelt papírjaid és a filmjeid ma egy külföldi szolgáltatónál vannak, és szeretnéd, hogy inkább nálad, a saját gépeden legyenek – téged keresünk.</p>
-                    <p><strong>Informatikai tudás nem kell.</strong> A szervert mi állítjuk be nálad, és mi is üzemeltetjük. Neked a böngészőből kell használnod, úgy, mint bármelyik másik oldalt.</p>
-                    <div class="highlight-box">
-                        <p>Ami viszont kell: <strong>türelem</strong>. Ez teszt, nem kész termék. Találni fogsz hibát – pont ez a lényege.</p>
-                    </div>
-                </div>
-            </div>
-        </section>
-
-        <!-- Mi kell hozzá -->
-        <section class="content-section alt-bg">
-            <div class="container">
-                <div class="section-header">
-                    <h2>Mi kell <span>hozzá</span></h2>
-                    <p>Három dolog – és a harmadikat mi fizetjük</p>
-                </div>
-
-                <div class="info-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-cpu"/></svg> 1. Egy gép, ami bekapcsolva tud maradni</h3>
-                    <!-- source: website/gyik.html FAQ „Milyen gépre van szükségem?" (quoted, not invented) -->
-                    <p>A szerver a lakásodban áll, és folyamatosan megy – ezért fontos, hogy csendes és takarékos legyen. A GYIK-ből idézve: <em>„A legtöbb otthoni felhasználónak egy mini PC (pl. Intel N100 processzorral, 16-32 GB RAM-mal) tökéletesen megfelel. Ezek csendesek, energiatakarékosak (15-35W fogyasztás), és kompaktak – elfér a polcon a router mellett."</em></p>
-                    <!-- source: website/gyik.html FAQ „Használhatom a már meglévő régi gépemet?" (quoted) -->
-                    <p>Régi géped is lehet jó: <em>„Sok esetben igen! Egy korábbi asztali PC kiváló szerver lehet. Az egyeztetés során felmérjük, hogy a meglévő géped alkalmas-e a tervezett feladatokra (elég RAM, tároló kapacitás, megbízhatóság). Fontos szempont a fogyasztás és a zajszint – egy régi gamer PC működik ugyan, de havi szinten jóval többet fogyaszt, mint egy modern mini PC."</em></p>
-                    <p>Ha nincs géped, az nem kizáró ok – az egyeztetésen átbeszéljük, mi a legjobb a te helyzetedben. Részletesebb konfigurációk a <a href="/technologiak">Technológiák</a> oldalon.</p>
-                </div>
-
-                <div class="info-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-radio-tower"/></svg> 2. Otthoni internet</h3>
-                    <!-- source: website/gyik.html FAQ „Milyen internet kapcsolat szükséges?" (quoted) -->
-                    <p>A GYIK-ből idézve: <em>„Otthoni használathoz (helyi hálózaton belül) bármilyen internet elég, mert az alkalmazások a helyi hálózatodon futnak – nem az interneten keresztül. […] Ha távolról is el szeretnéd érni a szerveredet (pl. munkahelyről vagy nyaralásból), akkor a feltöltési sebesség (upload) számít: minimum 10 Mbps ajánlott, de minél több, annál jobb."</em></p>
-                </div>
-
-                <div class="info-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg> 3. Egy domain – amit mi fizetünk</h3>
-                    <!-- source: operator ruling D1, 2026-10-10 (CONTEXT.md); documentation/architecture/01-topology-and-trust.md §7 -->
-                    <p>A szerveredet és az alkalmazásaidat a <strong>saját domainedről</strong> érjük el – nem egy felhom.eu alatti névről. Így a vezérlőpultod <code>felhom.a-te-domained.hu</code> lesz, és minden alkalmazás egy saját aldomaint kap.</p>
-                    <div class="highlight-box">
-                        <p><strong>A domain a te nevedre szól, és a díját a teszt alatt mi fizetjük – két évre.</strong> A domain tehát a tiéd: ha a teszt véget ér, vagy ha kiszállsz, <strong>a domain nálad marad</strong>, és onnantól te fizeted tovább. Nem kérjük vissza, és nem visszük magunkkal.</p>
-                    </div>
-                    <p>A domain DNS-beállításait a teszt alatt mi kezeljük, egy olyan hozzáféréssel, ami <strong>kizárólag ezt az egy domaint látja</strong> – máshoz nem ér hozzá.</p>
-                </div>
-            </div>
-        </section>
-
-        <!-- Mit kapsz -->
-        <section class="content-section">
-            <div class="container">
-                <div class="section-header">
-                    <h2>Mit <span>kapsz</span></h2>
-                    <p>Ugyanaz a lista, ami a teszt feltételeinek 3. pontjában áll – se több, se kevesebb</p>
-                </div>
-                <div class="info-card">
-                    <!-- source: documentation/legal/feltetelek-1.0.md §3 (same promises, no new ones) -->
-                    <ul>
-                        <li>Egy <strong>otthoni szervert beállítunk</strong> nálad, és működőképes állapotba hozzuk.</li>
-                        <li><strong>Alkalmazásokat telepítünk</strong> rá a katalógusunkból, a vezérlőpulton keresztül.</li>
-                        <li>Az alkalmazások <strong>elérhetők lesznek az interneten</strong> is.</li>
-                        <li><strong>Figyeljük a szervert.</strong> Ha baj van, szólunk.</li>
-                        <li><strong>Mentés készül</strong> több szinten: a szerveren, és titkosítva egy távoli tárhelyen is.</li>
-                        <li><strong>Frissítjük</strong> az alkalmazásokat és a rendszert, jellemzően éjszaka, egy általad beállítható időablakban.</li>
-                        <li>És a fentiek szerint: <strong>a domaint két évre mi fizetjük.</strong></li>
-                    </ul>
-                    <p>Hogy mit <strong>nem</strong> ígérünk – rendelkezésre állást és válaszidőt nem vállalunk –, azt a <a href="/feltetelek">teszt feltételei</a> 5. pontja írja le. Érdemes elolvasni, mielőtt jelentkezel.</p>
-                </div>
-            </div>
-        </section>
-
-        <!-- Mit kérünk -->
-        <section class="content-section alt-bg">
-            <div class="container">
-                <div class="section-header">
-                    <h2>Mit <span>kérünk</span></h2>
-                    <p>Pénzt nem – se tőled, se felénk</p>
-                </div>
-                <div class="info-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-message-square"/></svg> Mondd el, mi nem jó</h3>
-                    <p>Ez az egyetlen, amit cserébe kérünk. Mi zavaró, mi érthetetlen, mi nem működik. Egy „ezt a gombot nem találtam" ér nekünk a legtöbbet – abból tudjuk, mit kell kijavítani.</p>
-
-                    <h3 style="margin-top: 24px;"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg> Tarts meg egy saját másolatot</h3>
-                    <!-- source: documentation/legal/feltetelek-1.0.md §4 („Ezért kérünk valamit") -->
-                    <p>A teszt feltételeiből: <strong>amit nem veszíthetsz el, abból tarts meg egy saját másolatot magadnál is. Ne a teszt legyen az egyetlen helye.</strong> Mentés készül és teszteljük is, de egy teszt alatt bármi elromolhat.</p>
-                </div>
-            </div>
-        </section>
-
-        <!-- Hány helyünk van -->
-        <section class="content-section">
-            <div class="container">
-                <div class="section-header">
-                    <h2>Hány <span>helyünk van</span></h2>
-                </div>
-                <div class="info-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-users"/></svg> Legfeljebb 5 háztartás</h3>
-                    <!-- source: operator ruling D2, 2026-10-10 (CONTEXT.md) -->
-                    <p>A zárt tesztben <strong>legfeljebb 5 háztartás</strong> vesz részt. Ez azért ilyen kevés, mert egy ember üzemelteti a rendszert, és minden tesztelőre akarunk időt fordítani. A teszt <strong>most indul</strong>, így jelenleg <strong>mind az 5 hely szabad</strong>.</p>
-                    <p>Ha betelik, azt megírjuk – és szólunk, amikor újra szabadul egy hely.</p>
-                </div>
-            </div>
-        </section>
-
-        <!-- Jelentkezés -->
-        <section class="cta-section">
-            <div class="container">
-                <h2>Érdekel? <span>Jelentkezz</span></h2>
-                <p>Írj egy üzenetet – <strong>nem kötelez semmire</strong>, először csak beszélgetünk. Átbeszéljük, van-e megfelelő géped, és mire használnád.</p>
-                <a href="/kapcsolat?tema=zart-teszt" class="cta-button">Jelentkezem tesztelőnek →</a>
-            </div>
-        </section>
-
-        <!-- Mit olvass el -->
-        <section class="content-section alt-bg">
-            <div class="container">
-                <div class="section-header">
-                    <h2>Mit érdemes <span>elolvasni</span></h2>
-                </div>
-                <div class="info-card">
-                    <ul>
-                        <li><a href="/feltetelek">A zárt teszt feltételei</a> – mit kapsz, mit nem ígérünk, és hogyan tudsz kiszállni.</li>
-                        <li><a href="/adatkezeles">Adatkezelési tájékoztató</a> – milyen adatot kezelünk, meddig, és miért.</li>
-                        <li><a href="/gyik">GYIK</a> – a géptől a mentésekig a leggyakoribb kérdések.</li>
-                    </ul>
-                </div>
-            </div>
-        </section>
-    </main>
-    <script>
-    (function() {
-        var hamburger = document.getElementById('hamburger');
-        var navLinks = document.querySelector('.nav-links');
-        var overlay = document.getElementById('mobileOverlay');
-        var body = document.body;
-
-        if (!hamburger || !navLinks || !overlay) {
-            console.warn('[mobile-menu] Missing elements:', {
-                hamburger: !!hamburger,
-                navLinks: !!navLinks,
-                overlay: !!overlay
-            });
-            return;
-        }
-
-        function openMenu() {
-            hamburger.classList.add('is-active');
-            navLinks.classList.add('is-open');
-            overlay.classList.add('is-visible');
-            body.classList.add('menu-open');
-            hamburger.setAttribute('aria-expanded', 'true');
-            hamburger.setAttribute('aria-label', 'Menü bezárása');
-        }
-
-        function closeMenu() {
-            hamburger.classList.remove('is-active');
-            navLinks.classList.remove('is-open');
-            overlay.classList.remove('is-visible');
-            body.classList.remove('menu-open');
-            hamburger.setAttribute('aria-expanded', 'false');
-            hamburger.setAttribute('aria-label', 'Menü megnyitása');
-        }
-
-        hamburger.addEventListener('click', function() {
-            if (navLinks.classList.contains('is-open')) {
-                closeMenu();
-            } else {
-                openMenu();
-            }
-        });
-
-        overlay.addEventListener('click', closeMenu);
-
-        navLinks.querySelectorAll('a').forEach(function(link) {
-            link.addEventListener('click', closeMenu);
-        });
-
-        document.addEventListener('keydown', function(e) {
-            if (e.key === 'Escape' && navLinks.classList.contains('is-open')) {
-                closeMenu();
-            }
-        });
-
-        window.addEventListener('resize', function() {
-            if (window.innerWidth > 900 && navLinks.classList.contains('is-open')) {
-                closeMenu();
-            }
-        });
-    })();
-    </script>
-<footer>
-        <div class="container">
-            <p>© 2026 felhom.eu – Saját felhőd, saját szabályaid</p>
-            <p class="footer-legal">Üzemeltető: Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Adatkezelési tájékoztató</a> · <a href="/feltetelek">Feltételek</a></p>
-        </div>
-    </footer>
-    <script>
-    (function(){
-        var b=document.getElementById('navBurger'),s=document.getElementById('sidebar'),k=document.getElementById('navBackdrop');
-        if(!b||!s||!k)return;
-        function open(){s.classList.add('is-open');k.hidden=false;document.body.classList.add('nav-open');b.setAttribute('aria-expanded','true');}
-        function close(){s.classList.remove('is-open');k.hidden=true;document.body.classList.remove('nav-open');b.setAttribute('aria-expanded','false');}
-        b.addEventListener('click',function(){s.classList.contains('is-open')?close():open();});
-        k.addEventListener('click',close);
-        document.addEventListener('keydown',function(e){if(e.key==='Escape'&&s.classList.contains('is-open')){close();b.focus();}});
-        s.querySelectorAll('a').forEach(function(l){l.addEventListener('click',close);});
-        window.addEventListener('resize',function(){if(window.innerWidth>768)close();});
-    })();
-    document.addEventListener('click',function(e){
-        var btn=e.target.closest?e.target.closest('.nav-group-toggle'):null;
-        if(!btn)return;
-        var g=btn.closest('.nav-group');if(!g)return;
-        var willOpen=!g.classList.contains('is-open');
-        document.querySelectorAll('.nav-group.is-open').forEach(function(x){
-            x.classList.remove('is-open');
-            var t=x.querySelector('.nav-group-toggle');if(t)t.setAttribute('aria-expanded','false');
-        });
-        if(willOpen){g.classList.add('is-open');btn.setAttribute('aria-expanded','true');}
-    });
-    </script>
-</body>
-</html>
diff --git a/website/preview/mockup.css b/website/preview/mockup.css
deleted file mode 100644
index 795b9227..00000000
--- a/website/preview/mockup.css
+++ /dev/null
@@ -1,1309 +0,0 @@
-/* ---------------------------------------------------------------------------
-   mockup.css - throwaway stylesheet for the /preview/m1 and /preview/m2 studies.
-   Delete it with the mockup directories once a direction is chosen.
-
-   THREE BLOCKS, kept apart on purpose so the shared-design report can count them:
-     1. BASE      - adapted: the controller's base, with the font paths repointed
-                    from /static/fonts/ to /assets/fonts/ (the website's copies).
-     2. CONTROLLER- verbatim from felhom-controller style.css @ dcd89364a4.
-     3. MOCKUP    - new: only what the studies need and the product has no answer for.
-   --------------------------------------------------------------------------- */
-
-/* ===== 1. BASE (adapted from the controller: font URLs repointed) ===== */
-@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:400 800;font-display:swap;
-  src:url('/assets/fonts/pjs-latin.woff2') format('woff2');
-  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
-@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:400 800;font-display:swap;
-  src:url('/assets/fonts/pjs-latin-ext.woff2') format('woff2');
-  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
-
-/* The 18 tokens are IDENTICAL in website/assets/site.css and the controller's style.css
-   (verified 2026-10-11, zero differences). Copied here so the mockup stands alone. */
-:root {
-  --bg-0: #0A1220;   --bg-1: #0F1B2E;   --bg-2: #16263F;
-  --line: #22344F;   --line-soft: #1A2A42;
-  --text-1: #EDF2F9; --text-2: #94A6BF; --text-3: #5E7392;
-  --blue: #0083D8;   --blue-bright: #2EA8F5; --blue-dim: rgba(0,131,216,.13);
-  --warn: #E0A93E;   --warn-dim: rgba(224,169,62,.12);
-  --crit: #E5534B;   --crit-dim: rgba(229,83,75,.12);
-  --radius: 2px;
-  --font-ui: 'Plus Jakarta Sans', -apple-system, sans-serif;
-  --font-data: 'JetBrains Mono', monospace;
-}
-* { margin: 0; padding: 0; box-sizing: border-box; }
-body.mockup {
-    font-family: var(--font-ui);
-    background: var(--bg-0);
-    color: var(--text-1);
-    display: flex;
-    min-height: 100vh;
-    line-height: 1.6;
-}
-body.mockup.m2 { display: block; }
-:focus-visible { outline: 2px solid var(--blue-bright); outline-offset: 1px; }
-a { color: var(--blue-bright); }
-
-/* ===== 2. CONTROLLER (verbatim) ===== */
-/* EXTRACTED VERBATIM from felhom-controller style.css @ dcd89364a4 - do not hand-edit
-   this section; adaptations go in the ADAPTED block the mockup appends after it. */
-
-.ico {
-    width: 16px;
-    height: 16px;
-    flex-shrink: 0;
-    vertical-align: -0.18em;
-}
-
-.ico-sm {
- width: 14px; height: 14px;
-}
-
-.sidebar {
-    width: 240px;
-    background: var(--bg-2);
-    color: var(--text-1);
-    display: flex;
-    flex-direction: column;
-    position: fixed;
-    height: 100vh;
-    overflow-y: auto;
-    border-right: 1px solid var(--line);
-}
-
-.sidebar-header {
-    padding: 1.5rem;
-    border-bottom: 1px solid var(--line);
-}
-
-.sidebar-logo {
-    width: 140px;
-    height: auto;
-    display: block;
-    margin: 0 auto 0.25rem;
-}
-
-.nav-links {
-    list-style: none;
-    padding: 1rem 0;
-    flex: 1;
-}
-
-.nav-links a {
-    display: flex;
-    align-items: center;
-    gap: .6rem;
-    padding: .75rem 1.5rem;
-    color: var(--text-2);
-    text-decoration: none;
-    font-size: .95rem;
-    font-weight: 500;
-    transition: color 0.2s ease, background 0.2s ease;
-}
-
-.nav-links a:hover {
-    color: var(--blue-bright);
-    background: var(--blue-dim);
-}
-
-.nav-links a.active {
-    color: var(--blue-bright);
-    background: var(--blue-dim);
-    border-left: 3px solid var(--blue);
-}
-
-.sidebar-footer {
-    padding: 1rem 1.5rem;
-    border-top: 1px solid var(--line);
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    font-size: .8rem;
-}
-
-.version {
- color: var(--text-3);
-}
-
-.logout-link {
- color: var(--text-3); text-decoration: none; transition: color 0.2s ease;
-}
-
-.logout-link:hover {
- color: var(--blue-bright);
-}
-
-.mobile-topbar {
- display: none;
-}
-
-.nav-backdrop {
- display: none;
-}
-
-.nav-burger {
-    display: flex;
-    align-items: center;
-    padding: .375rem;
-    background: none;
-    border: none;
-    color: var(--text-2);
-    cursor: pointer;
-    transition: color 0.2s ease;
-}
-
-.nav-burger:hover {
- color: var(--blue-bright);
-}
-
-.nav-burger:focus-visible {
-    outline: 2px solid var(--blue-bright);
-    outline-offset: -2px;
-}
-
-.nav-burger .ico {
- width: 24px; height: 24px;
-}
-
-.content {
-    margin-left: 240px;
-    padding: 2rem;
-    flex: 1;
-    max-width: 1200px;
-}
-
-.page-header {
-    display: flex;
-    align-items: center;
-    gap: 1rem;
-    margin-bottom: 1.5rem;
-}
-
-.page-header h2 {
-    font-size: 1.5rem;
-    font-weight: 600;
-    color: var(--text-1);
-}
-
-.domain-badge {
-    border: 1px solid var(--line);
-    color: var(--text-2);
-    padding: .2rem .6rem;
-    border-radius: var(--radius);
-    font-size: .8rem;
-    font-weight: 500;
-    font-family: var(--font-data);
-}
-
-.stack-grid {
-    display: grid;
-    grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
-    gap: 1rem;
-}
-
-.stack-detail-card {
-    background: var(--bg-1);
-    border-radius: var(--radius);
-    padding: 1.25rem;
-    border: 1px solid var(--line);
-    transition: border-color 0.3s ease, transform 0.3s ease;
-    display: flex;
-    flex-direction: column;
-}
-
-.stack-detail-card:hover {
-    border-color: var(--blue);
-    transform: translateY(-2px);
-}
-
-.stack-detail-card {
-    position: relative;
-}
-
-.stack-detail-card::before {
-    content: '';
-    position: absolute;
-    left: 0; top: 0; bottom: 0;
-    width: 2px;
-    background: transparent;
-}
-
-.stack-detail-card.stack-state-run::before,
-.stack-detail-card.stack-state-progress::before {
- background: var(--blue);
-}
-
-.stack-detail-card.stack-state-warn::before {
- background: var(--warn);
-}
-
-.stack-detail-header {
-    display: flex;
-    flex-direction: column;
-    gap: .6rem;
-    margin-bottom: .75rem;
-}
-
-.stack-title-row {
-    display: flex;
-    align-items: flex-start;
-    gap: .75rem;
-    min-width: 0;
-}
-
-.stack-title-text {
-    flex: 1;
-    min-width: 0;
-}
-
-.stack-title-text h3 {
- margin-bottom: .25rem; overflow-wrap: anywhere;
-}
-
-.stack-tags {
-    display: flex;
-    flex-wrap: wrap;
-    gap: .4rem;
-}
-
-.tag {
-    display: inline-flex;
-    align-items: center;
-    gap: .45rem;
-    padding: .15rem .55rem;
-    border: 1px solid var(--line);
-    border-radius: var(--radius);
-    font-size: .75rem;
-    font-weight: 600;
-    color: var(--text-2);
-    white-space: nowrap;
-    flex-shrink: 0;
-}
-
-.tag .dot {
-    width: 6px;
-    height: 6px;
-    border-radius: 50%;
-    background: var(--text-3);
-    flex-shrink: 0;
-}
-
-.tag-run {
- border-color: rgba(0,131,216,.45); color: var(--blue-bright);
-}
-
-.tag-run .dot {
- background: var(--blue);
-}
-
-.tag-progress {
- border-color: rgba(0,131,216,.45); color: var(--blue-bright);
-}
-
-.tag-progress .dot {
- background: var(--blue); animation: tag-pulse 1.2s ease-in-out infinite;
-}
-
-.tag-warn {
- border-color: var(--warn); color: var(--warn); background: var(--warn-dim);
-}
-
-.tag-warn .dot {
- background: var(--warn);
-}
-
-.tag-crit {
- border-color: var(--crit); color: var(--crit); background: var(--crit-dim);
-}
-
-.tag-crit .dot {
- background: var(--crit);
-}
-
-.tag-neutral .dot, .tag-off .dot {
- background: transparent; border: 1px solid var(--text-3);
-}
-
-.stack-detail-desc {
-    color: var(--text-2);
-    font-size: .85rem;
-    margin-bottom: .75rem;
-}
-
-.meta-badge {
-    color: var(--text-2);
-    padding: .1rem 0;
-    font-size: .78rem;
-}
-
-.meta-badge-ok {
-    color: var(--text-2);
-}
-
-.stack-detail-actions {
-    display: flex;
-    gap: .5rem;
-    margin-top: auto;
-    padding-top: 1rem;
-    flex-wrap: wrap;
-}
-
-.btn {
-    display: inline-flex;
-    align-items: center;
-    gap: .3rem;
-    padding: .5rem 1rem;
-    border: 1px solid var(--line);
-    border-radius: var(--radius);
-    font-size: .85rem;
-    font-weight: 600;
-    cursor: pointer;
-    transition: border-color 0.15s ease, background 0.15s ease, color 0.15s ease;
-    text-decoration: none;
-    color: var(--text-1);
-    font-family: inherit;
-    background: var(--bg-2);
-}
-
-.btn:hover {
- border-color: var(--blue);
-}
-
-.btn:active {
- opacity: .85;
-}
-
-.btn:disabled {
- opacity: .5; cursor: not-allowed; transform: none;
-}
-
-.btn.loading {
- opacity: .6;
-}
-
-.btn-sm {
- padding: .3rem .6rem; font-size: .8rem;
-}
-
-.btn-lg {
- padding: .65rem 1.5rem; font-size: 1rem;
-}
-
-.btn-full {
- width: 100%; justify-content: center;
-}
-
-.btn-primary {
-    background: var(--blue);
-    border-color: var(--blue);
-    color: #fff;
-}
-
-.btn-primary:hover {
- background: var(--blue-bright); border-color: var(--blue-bright);
-}
-
-.btn-danger {
-    background: transparent;
-    border: 1px solid var(--crit);
-    color: var(--crit);
-}
-
-.btn-danger:hover {
-    background: var(--crit-dim);
-}
-
-.btn-outline {
-    background: transparent;
-    border: 1px solid var(--line);
-    color: var(--text-2);
-}
-
-.btn-outline:hover {
-    border-color: var(--blue);
-    color: var(--blue-bright);
-    background: var(--blue-dim);
-}
-
-.badge {
-    display: inline-flex;
-    align-items: center;
-    gap: .25rem;
-    padding: .2rem .6rem;
-    border-radius: var(--radius);
-    font-size: .75rem;
-    font-weight: 500;
-}
-
-.form-section {
- margin-bottom: 1.5rem;
-}
-
-.form-section h4 {
- font-size: 1rem; margin-bottom: .5rem; color: var(--text-1);
-}
-
-.form-section-desc {
- color: var(--text-2); font-size: .85rem; margin-bottom: .75rem;
-}
-
-.form-group {
- margin-bottom: 1rem;
-}
-
-.form-group label {
- display: block; font-size: .85rem; font-weight: 500; margin-bottom: .4rem; color: var(--text-1);
-}
-
-.form-group-auto {
-    padding: .5rem .75rem;
-    background: var(--bg-2);
-    border: 1px solid var(--line);
-    border-radius: var(--radius);
-}
-
-.form-group-auto label {
- display: flex; align-items: center; gap: .5rem; margin-bottom: .4rem;
-}
-
-.form-group-auto .form-control[readonly] {
- background: var(--bg-0);
-}
-
-.checkbox-group {
-    display: flex;
-    flex-direction: column;
-    gap: .5rem;
-    margin-top: .25rem;
-}
-
-.form-control-narrow {
-    width: 80px;
-}
-
-.form-hint {
-    font-size: .85rem;
-    color: var(--text-3);
-}
-
-.form-actions {
-    display: flex;
-    gap: .75rem;
-    margin-top: 1rem;
-}
-
-.form-control {
-    width: 100%;
-    padding: .55rem .75rem;
-    border: 1px solid var(--line);
-    border-radius: var(--radius);
-    font-size: .9rem;
-    background: var(--bg-2);
-    color: var(--text-1);
-    font-family: inherit;
-    transition: border-color 0.2s ease;
-}
-
-.form-control:focus {
-    outline: none;
-    border-color: var(--blue);
-}
-
-.form-control:disabled {
-    background: var(--bg-0);
-    color: var(--text-3);
-    cursor: not-allowed;
-}
-
-select.form-control {
- appearance: auto;
-}
-
-select.form-control option {
- background: var(--bg-2); color: var(--text-1);
-}
-
-.form-row {
- margin-bottom: .75rem;
-}
-
-.form-row > label {
- display: block; font-size: .85rem; color: var(--text-2); margin-bottom: .3rem;
-}
-
-.input-with-button .form-control {
- flex: 1;
-}
-
-.form-hint {
- display: block; font-size: .8rem; color: var(--text-3); margin-top: .25rem;
-}
-
-.required {
- color: var(--crit);
-}
-
-.locked-hint {
- font-size: .75rem; color: var(--text-3); font-weight: 400; margin-left: .5rem;
-}
-
-.toggle {
- cursor: pointer; display: flex; align-items: center; gap: .5rem;
-}
-
-.toggle input[type="checkbox"] {
- accent-color: var(--blue);
-}
-
-.toggle-label {
- font-size: .9rem; color: var(--text-2);
-}
-
-.alert {
-    padding: .75rem 1rem;
-    border-radius: var(--radius);
-    margin-bottom: 1rem;
-    font-size: .85rem;
-    border: 1px solid;
-}
-
-.alert-error {
-    background: var(--crit-dim);
-    color: var(--crit);
-    border-color: var(--crit-dim);
-}
-
-.alert-info {
-    background: var(--blue-dim);
-    color: var(--blue-bright);
-    border-color: rgba(0,131,216,.35);
-}
-
-.alert-warning {
-    background: var(--warn-dim);
-    color: var(--warn);
-    border-color: var(--warn-dim);
-}
-
-.alerts-container {
- margin-bottom: 1rem;
-}
-
-.alert-banner {
-    display: flex;
-    align-items: center;
-    gap: 0.75rem;
-    padding: 0.75rem 1rem;
-    border-radius: var(--radius);
-    margin-bottom: 0.5rem;
-    font-size: 0.9rem;
-    border: 1px solid;
-}
-
-.alert-banner-error {
-    background: var(--crit-dim);
-    border-color: var(--crit-dim);
-    color: var(--crit);
-}
-
-.alert-banner-warning {
-    background: var(--warn-dim);
-    border-color: var(--warn-dim);
-    color: var(--warn);
-}
-
-.alert-banner-info {
-    background: var(--blue-dim);
-    border-color: var(--blue-dim);
-    color: var(--blue-bright);
-}
-
-.alert-icon {
- flex-shrink: 0;
-}
-
-.alert-message {
- flex: 1;
-}
-
-.alert-link {
- margin-left: auto; white-space: nowrap; color: inherit; text-decoration: none;
-}
-
-.alert-link:hover {
- text-decoration: underline;
-}
-
-.empty-state {
- text-align: center; padding: 3rem; color: var(--text-3);
-}
-
-.empty-state-link {
- color: var(--blue-bright);
-}
-
-.launch-grid {
-    display: grid;
-    grid-template-columns: repeat(auto-fill, minmax(112px, 1fr));
-    gap: 1.25rem;
-    margin-top: .5rem;
-}
-
-.launch-cell {
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    gap: .5rem;
-    text-decoration: none;
-    color: var(--text-1);
-}
-
-.launch-tile {
-    position: relative;
-    width: 100%;
-    aspect-ratio: 1 / 1;
-    border-radius: var(--radius);
-    border: 1px solid var(--line);
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    overflow: hidden;
-    transition: transform .12s ease, border-color .12s ease;
-}
-
-.launch-cell:hover .launch-tile {
-    transform: translateY(-2px);
-    border-color: var(--blue);
-}
-
-.launch-mono {
-    display: none;
-    position: absolute;
-    inset: 0;
-    align-items: center;
-    justify-content: center;
-    color: #fff;
-    font-family: var(--font-ui);
-    font-size: 2.4rem;
-    font-weight: 600;
-    line-height: 1;
-    user-select: none;
-}
-
-.launch-tile--noimg .launch-mono {
- display: flex;
-}
-
-.launch-logo {
-    position: relative;
-    width: 58%;
-    height: 58%;
-    object-fit: contain;
-}
-
-.launch-name {
-    max-width: 100%;
-    font-size: .85rem;
-    color: var(--text-1);
-    text-align: center;
-    white-space: nowrap;
-    overflow: hidden;
-    text-overflow: ellipsis;
-}
-
-.launch-cell--off {
- cursor: default;
-}
-
-.launch-tile--off {
- opacity: .4;
-}
-
-.launch-cell--off .launch-name {
- color: var(--text-3);
-}
-
-.app-info-hero {
-    display: flex;
-    align-items: center;
-    gap: 1.5rem;
-    padding: 1.5rem;
-    background: var(--bg-1);
-    border-radius: var(--radius);
-    border: 1px solid var(--line);
-    margin-bottom: 1.5rem;
-}
-
-.app-info-logo {
-    width: 80px;
-    height: 80px;
-    min-width: 80px;
-    min-height: 80px;
-    max-width: 80px;
-    max-height: 80px;
-    border-radius: var(--radius);
-    object-fit: contain;
-    background: var(--bg-2);
-    padding: 10px;
-    flex-shrink: 0;
-    overflow: hidden;
-}
-
-.app-info-tagline {
-    font-size: 1.1rem;
-    color: var(--text-1);
-    margin: 0 0 .75rem 0;
-}
-
-.app-screenshots {
-    display: flex;
-    gap: 1rem;
-    margin-bottom: 1.5rem;
-    overflow-x: auto;
-    padding-bottom: .5rem;
-}
-
-.app-screenshot {
-    max-height: 220px;
-    border-radius: var(--radius);
-    border: 1px solid var(--line);
-    object-fit: cover;
-}
-
-.app-info-grid {
-    display: grid;
-    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
-    gap: 1rem;
-    margin-bottom: 1.5rem;
-}
-
-.app-info-card {
-    background: var(--bg-1);
-    border-radius: var(--radius);
-    padding: 1.25rem;
-    border: 1px solid var(--line);
-}
-
-.app-info-card h3 {
-    margin: 0 0 .75rem 0;
-    font-size: .95rem;
-    color: var(--text-1);
-}
-
-.app-info-list {
-    margin: 0;
-    padding-left: 1.25rem;
-    color: var(--text-2);
-    font-size: .9rem;
-    line-height: 1.6;
-}
-
-.app-info-link {
-    color: var(--blue-bright);
-    text-decoration: none;
-}
-
-.app-info-link:hover {
- text-decoration: underline;
-}
-
-.meta-badge-warn {
-    background: var(--warn-dim) !important;
-    color: var(--warn) !important;
-}
-
-.meta-badge-ok {
-    background: var(--blue-dim) !important;
-    color: var(--blue) !important;
-}
-
-.modal-overlay {
-    position: fixed;
-    top: 0; left: 0;
-    width: 100%; height: 100%;
-    background: rgba(0, 0, 0, 0.7);
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    z-index: 1000;
-}
-
-.modal-card {
-    background: var(--bg-1);
-    border: 1px solid var(--line);
-    border-radius: var(--radius);
-    padding: 1.5rem;
-    max-width: 500px;
-    width: 90%;
-    max-height: 80vh;
-    overflow-y: auto;
-}
-
-.modal-card h3 {
-    margin-bottom: .75rem;
-}
-
-.modal-actions {
-    display: flex;
-    gap: .75rem;
-    margin-top: 1rem;
-    justify-content: flex-end;
-}
-
-.sidebar-bottom {
-    margin-top: auto;
-    border-top: 1px solid var(--line);
-}
-
-.btn-xs {
-    padding: .2rem .5rem;
-    font-size: .75rem;
-    border-radius: var(--radius);
-}
-
-.btn-ghost {
-    background: transparent;
-    border: none;
-    color: var(--text-3);
-    padding: .1rem .3rem;
-}
-
-.btn-ghost:hover {
-    color: var(--blue-bright);
-}
-
-.btn-danger-outline {
-    background: transparent;
-    border: 1px solid var(--crit-dim);
-    color: var(--crit);
-}
-
-.btn-danger-outline:hover {
-    background: var(--crit-dim);
-    border-color: var(--crit);
-}
-
-.badge-warn {
-    background: var(--warn-dim);
-    color: var(--warn);
-}
-
-.badge-error {
-    background: var(--crit-dim);
-    color: var(--crit);
-}
-
-.modal-actions .btn-danger {
-    background: var(--crit);
-    color: white;
-    border-color: var(--crit);
-}
-
-.modal-actions .btn-danger:hover {
-    opacity: 0.85;
-    background: var(--crit);
-    color: white;
-}
-
-.meta-badge-fail {
-    background: var(--crit-dim);
-    color: var(--crit);
-}
-
-.btn-xs {
-    padding: .15rem .5rem;
-    font-size: .75rem;
-    border-radius: var(--radius);
-}
-
-.text-muted {
- color: var(--text-3);
-}
-
-.btn-danger-outline {
-    background: transparent; color: var(--crit); border: 1px solid var(--crit);
-    border-radius: var(--radius); padding: 0.2rem 0.5rem; cursor: pointer; font-size: 0.8rem;
-}
-
-.btn-danger-outline:hover {
- background: var(--crit-dim);
-}
-
-.badge-ok {
- background: var(--blue-dim); color: var(--blue);
-}
-
-.badge-neutral {
- background: var(--bg-2); color: var(--text-2);
-}
-
-.badge-muted {
- background: var(--bg-2); color: var(--text-3);
-}
-
-.badge-info {
- background: var(--blue-dim); color: var(--blue-bright);
-}
-
-.confirm-box .form-actions {
- display: flex; gap: .6rem; margin-top: 1rem;
-}
-
-.nav-group-label {
-    padding: .75rem 1.5rem .25rem;
-    font-size: .68rem;
-    font-weight: 700;
-    letter-spacing: .1em;
-    text-transform: uppercase;
-    color: var(--text-3);
-}
-
-.nav-links-sub {
-    padding: 0 0 .5rem;
-    flex: none;
-}
-
-.nav-links-sub a {
-    padding: .5rem 1.5rem .5rem 1.75rem;
-    font-size: .88rem;
-}
-
-.nav-links-nested {
-    padding: 0;
-    list-style: none;
-}
-
-.nav-links-nested a {
-    padding: .4rem 1.5rem .4rem 3.1rem;
-    font-size: .85rem;
-}
-
-.nav-links-nested a.active {
-    border-left: 3px solid var(--blue);
-}
-
-.sidebar {
- scrollbar-color: var(--line) var(--bg-2);
-}
-
-.sidebar::-webkit-scrollbar-track {
- background: var(--bg-2);
-}
-
-.nav-group {
-    display: grid;
-    grid-template-rows: auto 0fr;
-    transition: grid-template-rows .18s ease;
-}
-
-.nav-group.is-open {
- grid-template-rows: auto 1fr;
-}
-
-.nav-group > .nav-links-nested {
-    overflow: hidden;
-    min-height: 0;
-}
-
-.nav-group-toggle {
-    display: flex;
-    align-items: center;
-    gap: .6rem;
-    width: 100%;
-    padding: .75rem 1.5rem;
-    background: none;
-    border: none;
-    border-left: 3px solid transparent;
-    color: var(--text-2);
-    font-family: inherit;
-    font-size: .95rem;
-    font-weight: 500;
-    text-align: left;
-    cursor: pointer;
-    transition: color 0.2s ease, background 0.2s ease;
-}
-
-.nav-group-toggle:hover {
-    color: var(--blue-bright);
-    background: var(--blue-dim);
-}
-
-.nav-group-toggle.active {
-    color: var(--blue-bright);
-    background: var(--blue-dim);
-    border-left-color: var(--blue);
-}
-
-.nav-group-toggle:focus-visible {
-    outline: 2px solid var(--blue-bright);
-    outline-offset: -2px;
-}
-
-.nav-chevron {
-    margin-left: auto;
-    width: 14px;
-    height: 14px;
-    color: var(--text-3);
-    transition: transform .18s ease;
-}
-
-.nav-group.is-open .nav-chevron {
- transform: rotate(180deg);
-}
-
-@media (prefers-reduced-motion: reduce) {
-
-    .tag-progress .dot {
-     animation: none;
-    }
-
-    .js .sidebar {
-     transition: none;
-    }
-
-    .nav-group {
-     transition: none;
-    }
-
-    .nav-chevron {
-     transition: none;
-    }
-}
-
-@media(max-width: 768px) {
-
-    .mobile-topbar {
-            display: flex;
-            align-items: center;
-            justify-content: space-between;
-            position: sticky;
-            top: 0;
-            z-index: 800;
-            background: var(--bg-2);
-            border-bottom: 1px solid var(--line);
-            padding: .5rem 1rem;
-    }
-
-    .mobile-topbar-logo img {
-     height: 36px; width: auto; display: block;
-    }
-
-    .js .sidebar {
-            position: fixed;
-            top: 0;
-            left: 0;
-            height: 100vh;
-            height: 100dvh;
-            width: min(280px, 85vw);
-            transform: translateX(-100%);
-            transition: transform .2s ease;
-            z-index: 950;
-            border-right: 1px solid var(--line);
-            border-bottom: none;
-    }
-
-    .js .sidebar.is-open {
-     transform: none;
-    }
-
-    .js .nav-backdrop:not([hidden]) {
-            display: block;
-            position: fixed;
-            inset: 0;
-            background: rgba(0, 0, 0, .5);
-            z-index: 900;
-    }
-
-    .no-js .sidebar {
-            position: static;
-            height: auto;
-            width: 100%;
-            border-right: none;
-            border-bottom: 1px solid var(--line);
-    }
-
-    .no-js .nav-burger {
-     display: none;
-    }
-
-    .content {
-     margin-left: 0; padding: 1rem;
-    }
-
-    .stack-grid {
-     grid-template-columns: 1fr;
-    }
-
-    .page-header {
-     flex-wrap: wrap; row-gap: .6rem;
-    }
-
-    .alert-banner {
-     flex-wrap: wrap;
-    }
-
-    .alert-message {
-     min-width: 0; overflow-wrap: anywhere;
-    }
-
-    .alert-link {
-     flex-basis: 100%; text-align: right;
-    }
-}
-
-
-/* ===== 3. MOCKUP-ONLY (new rules, nothing in either product to copy) ===== */
-
-/* the burger: the WEBSITE's three-span control, copied from site.css rather than
-   hand-rolling an SVG the shared sprite does not carry (it has no i-menu). */
-.hamburger {
-    display: none;
-    background: none;
-    border: none;
-    cursor: pointer;
-    padding: 8px;
-    z-index: 200;
-    -webkit-tap-highlight-color: transparent;
-}
-.hamburger-box {
-    width: 28px;
-    height: 20px;
-    display: flex;
-    flex-direction: column;
-    justify-content: space-between;
-}
-.hamburger-line {
-    display: block;
-    width: 100%;
-    height: 2px;
-    background: var(--text-1);
-    border-radius: var(--radius);
-    transition: transform 0.3s ease, opacity 0.3s ease;
-    transform-origin: center;
-}
-.hamburger.is-active .hamburger-line:nth-child(1) {
-    transform: translateY(9px) rotate(45deg);
-}
-.hamburger.is-active .hamburger-line:nth-child(2) {
-    opacity: 0;
-}
-.hamburger.is-active .hamburger-line:nth-child(3) {
-    transform: translateY(-9px) rotate(-45deg);
-}
-.nav-burger { display: none; background: none; border: 0; cursor: pointer; padding: .4rem; }
-@media (max-width: 768px) { .nav-burger { display: inline-flex; } }
-
-
-/* a disabled sidebar entry: a real controller page this study does not simulate.
-   Never a dead link (mockup rule 1) - it states where the thing works. */
-.nav-off {
-    display: flex; align-items: center; gap: .625rem; padding: .55rem .9rem;
-    color: var(--text-3); font-size: .9rem; cursor: not-allowed; position: relative;
-}
-.nav-off .ico { opacity: .5; }
-.nav-off-hint {
-    display: none; font-size: .7rem; color: var(--text-3);
-    border: 1px solid var(--line); background: var(--bg-2);
-    padding: .15rem .4rem; border-radius: var(--radius); margin-left: auto;
-}
-.nav-off:hover .nav-off-hint { display: inline-block; }
-.nav-off-hint.is-inline { display: inline-block; margin-left: .75rem; }
-
-/* every invented value on the page wears this */
-.sample {
-    font-family: var(--font-data); font-size: .68rem; text-transform: uppercase;
-    letter-spacing: .04em; color: var(--warn);
-    border: 1px solid var(--warn); background: var(--warn-dim);
-    padding: .05rem .3rem; border-radius: var(--radius); white-space: nowrap;
-}
-
-.welcome-card {
-    display: flex; flex-wrap: wrap; gap: 1.5rem; align-items: center;
-    justify-content: space-between;
-    border: 1px solid var(--blue); background: var(--blue-dim);
-    border-radius: var(--radius); padding: 1.5rem 1.75rem; margin-bottom: 2rem;
-}
-.welcome-text h1 { font-size: 1.5rem; font-weight: 700; margin-bottom: .35rem; letter-spacing: -.02em; }
-.welcome-text p { color: var(--text-2); font-size: .95rem; max-width: 46ch; }
-
-/* app panel: opened by :target so it works with JavaScript switched off */
-.app-panel {
-    display: none; position: fixed; inset: 0; z-index: 300;
-    background: rgba(5,9,16,.72); padding: 2rem 1rem; overflow-y: auto;
-}
-.app-panel:target { display: block; }
-.app-panel-card {
-    position: relative; max-width: 760px; margin: 0 auto;
-    background: var(--bg-1); border: 1px solid var(--line);
-    border-radius: var(--radius); padding: 1.75rem;
-}
-.app-panel-close {
-    position: absolute; top: .75rem; right: .75rem; color: var(--text-2);
-    display: inline-flex; padding: .35rem; border: 1px solid var(--line);
-    border-radius: var(--radius); background: var(--bg-2);
-}
-.app-panel-close:hover { color: var(--text-1); border-color: var(--blue); }
-.app-panel .app-screenshot { margin: 1rem 0; max-width: 100%; height: auto; border: 1px solid var(--line); }
-
-.bucket-head { font-size: 1.05rem; font-weight: 700; margin: 2rem 0 .85rem; }
-.bucket-count { color: var(--text-3); font-weight: 400; font-size: .85rem; }
-.app-search { margin-bottom: 1rem; max-width: 30rem; }
-.stack-detail-card.is-static { cursor: default; }
-.backup-sample { font-size: .85rem; color: var(--text-2); margin-top: .5rem; }
-.how-grid .app-info-card h3 { color: var(--blue-bright); }
-
-/* ---- M2 only ---- */
-.m2-top {
-    display: flex; align-items: center; justify-content: space-between;
-    padding: 1rem 1.5rem; border-bottom: 1px solid var(--line); background: var(--bg-1);
-}
-.m2-logo { display: flex; align-items: center; gap: .75rem; }
-.m2-logo img { height: 40px; width: auto; }
-.m2-logo .m2-word { height: 20px; }
-.m2-hero {
-    display: grid; grid-template-columns: 1fr 1.25fr; gap: 3rem; align-items: center;
-    max-width: 1180px; margin: 0 auto; padding: 4rem 1.5rem 3rem;
-}
-.m2-hero-text h1 { font-size: clamp(2rem, 4vw, 3rem); font-weight: 700; line-height: 1.1; letter-spacing: -.03em; margin-bottom: 1rem; }
-.m2-hero-text h1 span { color: var(--blue-bright); }
-.m2-hero-text p { color: var(--text-2); font-size: 1.05rem; margin-bottom: 1.5rem; max-width: 34ch; }
-.m2-window { border: 1px solid var(--line); border-radius: var(--radius); background: var(--bg-1); overflow: hidden; }
-.m2-window-bar {
-    display: flex; align-items: center; gap: .4rem;
-    padding: .6rem .85rem; background: var(--bg-2); border-bottom: 1px solid var(--line);
-}
-.m2-dot { width: 9px; height: 9px; border-radius: 50%; background: var(--line); display: inline-block; }
-.m2-window-title { margin-left: .75rem; font-size: .8rem; color: var(--text-3); display: flex; align-items: center; gap: .5rem; }
-.m2-window-body { padding: 1.25rem; }
-.m2-window-lede { font-size: .9rem; color: var(--text-2); margin-bottom: 1rem; }
-.launch-grid--mini { grid-template-columns: repeat(4, 1fr); gap: 1rem; margin-bottom: 1rem; }
-.m2-section { max-width: 1180px; margin: 0 auto; padding: 3rem 1.5rem; }
-.m2-section--alt { background: var(--bg-1); max-width: none; }
-.m2-section--alt > * { max-width: 1180px; margin-left: auto; margin-right: auto; }
-.m2-section h2 { font-size: 1.6rem; font-weight: 700; margin-bottom: .6rem; letter-spacing: -.02em; }
-.m2-section > p { color: var(--text-2); margin-bottom: 1.25rem; max-width: 70ch; }
-.m2-who { display: flex; gap: 1.5rem; align-items: flex-start; }
-.m2-who img { border: 1px solid var(--line); border-radius: var(--radius); flex: 0 0 auto; }
-.m2-who p { color: var(--text-2); max-width: 55ch; }
-.m2-foot { border-top: 1px solid var(--line); padding: 2rem 1.5rem; text-align: center; }
-.m2-foot p { color: var(--text-2); font-size: .85rem; display: inline-flex; gap: .6rem; align-items: center; flex-wrap: wrap; justify-content: center; }
-
-@media (max-width: 900px) {
-    /* the top-bar CTA wrapped to two lines at 390px; the hero carries the same one */
-    .m2-top .btn { display: none; }
-    .m2-hero { grid-template-columns: 1fr; gap: 2rem; padding-top: 2.5rem; }
-    .launch-grid--mini { grid-template-columns: repeat(3, 1fr); }
-    .m2-who { flex-direction: column; }
-}
-@media (max-width: 768px) {
-    /* ADAPTED from the controller, which carries it as a bare `body` rule - the kind an
-       extractor keyed on class names does not see. Without it the sticky mobile topbar
-       stays a ROW flex item, pushes .content 135px to the right, and the launcher grid
-       collapses to one column. Measured, then fixed. */
-    body.mockup { flex-direction: column; }
-    body.mockup.nav-open { overflow: hidden; }
-
-    .welcome-card { flex-direction: column; align-items: flex-start; }
-    .nav-off-hint { display: inline-block; margin-left: .5rem; }
-    .app-panel { padding: 1rem .5rem; }
-    .app-panel-card { padding: 1.25rem; }
-}
diff --git a/website/robots.txt b/website/robots.txt
index 8463c3b7..b0e0a8dc 100644
--- a/website/robots.txt
+++ b/website/robots.txt
@@ -1,9 +1,6 @@
 User-agent: *
 Allow: /
 Disallow: /szolgaltatasok-nonpublic
-# The redesigned home page, staged for review before it replaces /. Removed in the
-# same commit as the switch; the page also carries <meta name="robots" noindex>.
-Disallow: /preview/
 # /api/ is the contact form's POST endpoint, not a page: a GET returns 404 and Search
 # Console reported it as "Not found (404)" (seen 2026-10-10, first crawled 2026-04-29).
 Disallow: /api/
diff --git a/website/szolgaltatasok-nonpublic.html b/website/szolgaltatasok-nonpublic.html
index c8deeeef..4e644595 100644
--- a/website/szolgaltatasok-nonpublic.html
+++ b/website/szolgaltatasok-nonpublic.html
@@ -1,60 +1,79 @@
 <!DOCTYPE html>
-<html lang="hu">
+<html lang="hu" class="no-js">
 <head>
+    <script>document.documentElement.className=document.documentElement.className.replace('no-js','js');</script>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <meta name="description" content="Felhom.eu - Szolgáltatások és árak. Otthoni szerver telepítés, üzemeltetés, monitoring és támogatás.">
     <title>Szolgáltatások - Felhom.eu</title>
     <!-- shared assets: bump ?v= together on any site.css/icons.svg change -->
-    <link rel="stylesheet" href="/assets/site.css?v=21">
+    <link rel="stylesheet" href="/assets/site.css?v=22">
+    <link rel="stylesheet" href="/assets/shell.css?v=22">
     <link rel="icon" type="image/png" href="/assets/logo_favicon_2.svg">
     <!-- analytics intentionally omitted for draft page -->
 </head>
-<body class="page-szolgaltatasok">
-    <nav>
-        <div class="container">
-            <a href="/" class="logo">
-                <img class="logo-mark" src="/assets/logo-mark.svg" alt="" aria-hidden="true">
-                <img class="logo-word" src="/assets/logo-wordmark.png" alt="felhom.eu">
+<body class="shell page-szolgaltatasok">
+    <header class="mobile-topbar">
+        <a href="/" class="mobile-topbar-logo"><img src="/assets/logo_notext_white.svg" alt="Felhom.eu"></a>
+        <button type="button" class="nav-burger" id="navBurger" aria-expanded="false" aria-controls="sidebar" aria-label="Menü">
+            <span class="hamburger-box"><span class="hamburger-line"></span><span class="hamburger-line"></span><span class="hamburger-line"></span></span>
+        </button>
+    </header>
+    <div class="nav-backdrop" id="navBackdrop" hidden></div>
+    <nav class="sidebar" id="sidebar">
+        <div class="sidebar-header">
+            <a href="/" class="sidebar-logo-link">
+                <img src="/assets/logo_notext_white.svg" alt="" class="sidebar-logo" aria-hidden="true">
+                <img src="/assets/logo-wordmark.png" alt="felhom.eu" class="sidebar-word">
             </a>
-            <ul class="nav-links">
-                <li><a href="/#szolgaltatasok">Szolgáltatások</a></li>
-                <li><a href="/alkalmazasok">Alkalmazások</a></li>
-                <li><a href="/technologiak">Technológiák</a></li>
-                <li><a href="/biztonsagimentes">Mentések</a></li>
-                <li><a href="/gyik">GYIK</a></li>
-                <li><a href="/kapcsolat">Kapcsolat</a></li>
-                <li class="lang-globe-li"><details class="lang-globe"><summary class="lang-globe-btn" aria-label="Nyelv" title="Nyelv"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/szolgaltatasok-nonpublic" lang="hu" hreflang="hu" class="lang-globe-item current" aria-current="true">Magyar</a></li><li><a href="/en/" lang="en" hreflang="en" class="lang-globe-item">English</a></li></ul></details></li>
+        </div>
+        <ul class="nav-links">
+                <li><a href="/"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg>Kezdőlap</a></li>
+                <li><a href="/#szolgaltatasok"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rocket"/></svg>Szolgáltatások</a></li>
+                <li class="nav-group">
+                    <button type="button" class="nav-group-toggle" aria-expanded="false" aria-controls="nav-group-apps"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg>Alkalmazások<svg class="ico nav-chevron" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chevron-down"/></svg></button>
+                    <ul id="nav-group-apps" class="nav-links nav-links-sub nav-links-nested">
+                        <li><a href="/alkalmazasok">Minden alkalmazás</a></li>
+                        <li><a href="/alkalmazasok#fajlkezeles-irodai">Fájlkezelés &amp; Irodai</a></li>
+                        <li><a href="/alkalmazasok#media-szorakozas">Média &amp; Szórakozás</a></li>
+                        <li><a href="/alkalmazasok#otthon-eletmod">Otthon &amp; Életmód</a></li>
+                        <li><a href="/alkalmazasok#produktivitas-tudaskezeles">Produktivitás &amp; Tudáskezelés</a></li>
+                        <li><a href="/alkalmazasok#rendszer-fejlesztes">Rendszer &amp; Fejlesztés</a></li>
+                    </ul>
+                </li>
+                <li><a href="/technologiak"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg>Technológiák</a></li>
+                <li><a href="/biztonsagimentes"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg>Biztonsági mentés</a></li>
+        </ul>
+        <div class="sidebar-bottom">
+            <a href="/teszteles" class="btn btn-outline sidebar-cta">Jelentkezem tesztelőnek →</a>
+            <div class="nav-group-label">A Felhomról</div>
+            <ul class="nav-links nav-links-sub">
+                    <li><a href="/#hogyan-mukodik">Hogyan működik</a></li>
+                    <li><a href="/gyik">GYIK</a></li>
+                    <li><a href="/kapcsolat">Kapcsolat</a></li>
             </ul>
-            <button class="hamburger" id="hamburger" aria-label="Menü megnyitása" aria-expanded="false">
-                <span class="hamburger-box">
-                    <span class="hamburger-line"></span>
-                    <span class="hamburger-line"></span>
-                    <span class="hamburger-line"></span>
-                </span>
-            </button>
+            <div class="sidebar-footer">
+                <details class="lang-globe"><summary class="lang-globe-btn" aria-label="Nyelv" title="Nyelv"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/szolgaltatasok-nonpublic" lang="hu" hreflang="hu" class="lang-globe-item current" aria-current="true">Magyar</a></li><li><a href="#" lang="en" hreflang="en" class="lang-globe-item">English</a></li></ul></details>
+            </div>
         </div>
     </nav>
-    <div class="mobile-overlay" id="mobileOverlay"></div>
-
-    <main>
+<main class="content">
         <!-- Page Header -->
-        <section class="page-header">
-            <div class="container">
+                <div class="page-header">
                 <h1>Szolgáltatások és <span>Árak</span></h1>
-                <p>Átlátható árazás, tiszta feltételek. Tudod, mire fizetsz — sem több, sem kevesebb.</p>
+            </div>
+                <p class="page-lede">Átlátható árazás, tiszta feltételek. Tudod, mire fizetsz – sem több, sem kevesebb.</p>
 
                 <!-- Draft banner - remove when going live -->
                 <div class="draft-banner">
                     <span class="draft-icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-construction"/></svg></span>
-                    <p><strong>Belső tesztoldal</strong> — Ez az oldal még nem publikus. Az árak tájékoztató jellegűek, a végleges árazás a piaci visszajelzések alapján alakul.</p>
+                    <p><strong>Belső tesztoldal</strong> – Ez az oldal még nem publikus. Az árak tájékoztató jellegűek, a végleges árazás a piaci visszajelzések alapján alakul.</p>
                 </div>
 
                 <div class="pricing-note">
-                    <p>Az árak bruttó, végfelhasználói árak forintban. A feltüntetett összegek <strong>tájékoztató jellegűek</strong> és az adott szerver konfiguráció, az alkalmazások összetettsége, valamint a migrálandó adatmennyiség függvényében változhatnak. Minden projekt egyedi árajánlattal indul — a végső ár a konzultáció után kerül meghatározásra.</p>
+                    <p>Az árak bruttó, végfelhasználói árak forintban. A feltüntetett összegek <strong>tájékoztató jellegűek</strong> és az adott szerver konfiguráció, az alkalmazások összetettsége, valamint a migrálandó adatmennyiség függvényében változhatnak. Minden projekt egyedi árajánlattal indul – a végső ár a konzultáció után kerül meghatározásra.</p>
                 </div>
-            </div>
-        </section>
+
 
         <!-- =============================================
              SECTION: Indulócsomagok (Starter Packages)
@@ -63,7 +82,7 @@
             <div class="container">
                 <div class="section-header">
                     <h2>Induló <span>csomagok</span></h2>
-                    <p>Válaszd ki az igényeidhez legjobban illő csomagot — mindegyik tartalmazza a teljes rendszer telepítését</p>
+                    <p>Válaszd ki az igényeidhez legjobban illő csomagot – mindegyik tartalmazza a teljes rendszer telepítését</p>
                 </div>
 
                 <div class="package-grid">
@@ -71,7 +90,7 @@
                     <div class="package-card">
                         <div class="package-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-sprout"/></svg></div>
                         <h3>Alap</h3>
-                        <p class="package-tagline">Kezdj kicsiben — próbáld ki az önhostolást néhány alkalmazással.</p>
+                        <p class="package-tagline">Kezdj kicsiben – próbáld ki az önhostolást néhány alkalmazással.</p>
                         <div class="package-price">~75 000 Ft</div>
                         <p class="package-price-note">egyszeri telepítési költség</p>
                         <ul class="package-features">
@@ -111,7 +130,7 @@
                     <div class="package-card">
                         <div class="package-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rocket"/></svg></div>
                         <h3>Prémium</h3>
-                        <p class="package-tagline">Teljes digitális függetlenség — minden szolgáltatás, maximális támogatás.</p>
+                        <p class="package-tagline">Teljes digitális függetlenség – minden szolgáltatás, maximális támogatás.</p>
                         <div class="package-price">~200 000 Ft</div>
                         <p class="package-price-note">egyszeri telepítési költség</p>
                         <ul class="package-features">
@@ -148,7 +167,7 @@
                             <span class="service-card-badge badge-onetime">Egyszeri</span>
                         </div>
                         <h3>Hardver ellenőrzés és stresszteszt</h3>
-                        <p class="description">Mielőtt bármit telepítünk, alaposan leteszteljük a hardvered. CPU, memória, tárolóeszközök, hőmérséklet — mindent ellenőrzünk, hogy a szervered megbízhatóan működjön éveken át.</p>
+                        <p class="description">Mielőtt bármit telepítünk, alaposan leteszteljük a hardvered. CPU, memória, tárolóeszközök, hőmérséklet – mindent ellenőrzünk, hogy a szervered megbízhatóan működjön éveken át.</p>
                         <ul class="includes">
                             <li>CPU és memória stresszteszt (terheléspróba)</li>
                             <li>Tárolóeszközök SMART állapotfelmérése</li>
@@ -170,7 +189,7 @@
                             <span class="service-card-badge badge-onetime">Egyszeri</span>
                         </div>
                         <h3>Rendszer telepítés és konfigurálás</h3>
-                        <p class="description">Az operációs rendszer telepítésétől a teljes infrastruktúra kialakításáig — tűzfal, hálózat, tárhelykezelés, automatikus SSL tanúsítványok. Amikor elkészül, kész fogadni az alkalmazásokat.</p>
+                        <p class="description">Az operációs rendszer telepítésétől a teljes infrastruktúra kialakításáig – tűzfal, hálózat, tárhelykezelés, automatikus SSL tanúsítványok. Amikor elkészül, kész fogadni az alkalmazásokat.</p>
                         <ul class="includes">
                             <li>Operációs rendszer telepítés és hardening</li>
                             <li>Konténer infrastruktúra kialakítás</li>
@@ -182,7 +201,7 @@
                         <div class="price-box">
                             <div class="price-label">Induló ár</div>
                             <div class="price-value">35 000 Ft</div>
-                            <div class="price-note">Csomagban kedvezőbb — lásd az indulócsomagokat.</div>
+                            <div class="price-note">Csomagban kedvezőbb – lásd az indulócsomagokat.</div>
                         </div>
                     </div>
 
@@ -237,7 +256,7 @@
                             <span class="service-card-badge badge-free">Ajándék</span>
                         </div>
                         <h3>Domain regisztráció és DNS kezelés</h3>
-                        <p class="description">Minden ügyfél kap egy saját domaint, amit mi regisztrálunk és kezelünk. Ez nem csak kényelmes — a saját domain elengedhetetlen az SSL tanúsítványokhoz, és biztosítja, hogy minden alkalmazásod egyszerűen elérhető legyen.</p>
+                        <p class="description">Minden ügyfél kap egy saját domaint, amit mi regisztrálunk és kezelünk. Ez nem csak kényelmes – a saját domain elengedhetetlen az SSL tanúsítványokhoz, és biztosítja, hogy minden alkalmazásod egyszerűen elérhető legyen.</p>
                         <ul class="includes">
                             <li>Domain regisztráció (pl. .hu, .com, .eu)</li>
                             <li>DNS kezelés és karbantartás</li>
@@ -258,7 +277,7 @@
                             <span class="service-card-badge badge-onetime">Egyszeri</span>
                         </div>
                         <h3>VPN / Távoli hozzáférés beállítás</h3>
-                        <p class="description">Biztonságos hozzáférés a szerverhez otthonról távol is — VPN kapcsolaton keresztül, mintha otthon lennél. Ideális, ha utazás közben vagy munkahelyről is elérnéd az alkalmazásaidat.</p>
+                        <p class="description">Biztonságos hozzáférés a szerverhez otthonról távol is – VPN kapcsolaton keresztül, mintha otthon lennél. Ideális, ha utazás közben vagy munkahelyről is elérnéd az alkalmazásaidat.</p>
                         <ul class="includes">
                             <li>VPN szerver telepítés (WireGuard)</li>
                             <li>Kliens konfiguráció (telefon, laptop, tablet)</li>
@@ -282,7 +301,7 @@
             <div class="container">
                 <div class="section-header">
                     <h2>Havi <span>szolgáltatások</span></h2>
-                    <p>A szervered folyamatosan működik — mi pedig folyamatosan figyelünk rá.</p>
+                    <p>A szervered folyamatosan működik – mi pedig folyamatosan figyelünk rá.</p>
                 </div>
 
                 <div class="service-grid">
@@ -293,7 +312,7 @@
                             <span class="service-card-badge badge-monthly">Havi</span>
                         </div>
                         <h3>Rendszer monitoring és karbantartás</h3>
-                        <p class="description">Folyamatos figyelés, hogy ne kelljen neked. Automatikus riasztások, ha bármi rendellenességet észlelünk — és rendszeres frissítések, hogy minden naprakész maradjon.</p>
+                        <p class="description">Folyamatos figyelés, hogy ne kelljen neked. Automatikus riasztások, ha bármi rendellenességet észlelünk – és rendszeres frissítések, hogy minden naprakész maradjon.</p>
                         <ul class="includes">
                             <li>24/7 rendszer állapot monitoring</li>
                             <li>Tárhely, CPU, memória figyelés</li>
@@ -341,7 +360,7 @@
             <div class="container">
                 <div class="section-header">
                     <h2>Eseti <span>szolgáltatások</span></h2>
-                    <p>Ha változtatni szeretnél, vagy valami nem stimmel — itt vagyunk.</p>
+                    <p>Ha változtatni szeretnél, vagy valami nem stimmel – itt vagyunk.</p>
                 </div>
 
                 <div class="service-grid">
@@ -373,7 +392,7 @@
                             <span class="service-card-badge badge-ondemand">Igény szerint</span>
                         </div>
                         <h3>Incidens kezelés és hibaelhárítás</h3>
-                        <p class="description">Ha valami nem működik, nem az idő számít — a megoldás számít. Ezért esetnként számlázunk, nem óra alapon. Így nincs vita, nem kell az órát figyelni, és tudom, mit fogok számlázni.</p>
+                        <p class="description">Ha valami nem működik, nem az idő számít – a megoldás számít. Ezért esetnként számlázunk, nem óra alapon. Így nincs vita, nem kell az órát figyelni, és tudom, mit fogok számlázni.</p>
                         <ul class="includes">
                             <li>Hibadiagnosztika és elhárítás</li>
                             <li>Alkalmazás vagy szolgáltatás újraindítás</li>
@@ -394,7 +413,7 @@
                             <span class="service-card-badge badge-ondemand">Igény szerint</span>
                         </div>
                         <h3>Új alkalmazás telepítés (utólag)</h3>
-                        <p class="description">Találtál egy új alkalmazást, amit ki szeretnél próbálni? Bármikor bővítheted a szervered újabb alkalmazásokkal — ugyanolyan feltételekkel, mint az első telepítésnél.</p>
+                        <p class="description">Találtál egy új alkalmazást, amit ki szeretnél próbálni? Bármikor bővítheted a szervered újabb alkalmazásokkal – ugyanolyan feltételekkel, mint az első telepítésnél.</p>
                         <ul class="includes">
                             <li>Ugyanaz, mint az induló alkalmazás telepítésnél</li>
                             <li>Meglévő rendszerbe integrálás</li>
@@ -414,7 +433,7 @@
                             <span class="service-card-badge badge-ondemand">Igény szerint</span>
                         </div>
                         <h3>Alkalmazás eltávolítás</h3>
-                        <p class="description">Ha már nincs szükséged egy alkalmazásra, tisztán eltávolítjuk — beleértve az adatokat, konfigurációt és a hozzá tartozó erőforrásokat.</p>
+                        <p class="description">Ha már nincs szükséged egy alkalmazásra, tisztán eltávolítjuk – beleértve az adatokat, konfigurációt és a hozzá tartozó erőforrásokat.</p>
                         <ul class="includes">
                             <li>Alkalmazás és konfiguráció eltávolítás</li>
                             <li>Kapcsolódó adatok törlése vagy archiválása</li>
@@ -460,37 +479,37 @@
                 <div class="domain-section">
                     <div class="domain-text">
                         <h2>Miért kapsz <span>saját domaint?</span></h2>
-                        <p>A saját domain nem luxus — hanem a megbízható rendszer alapja. Az SSL tanúsítványok, a biztonságos HTTPS hozzáférés és az alkalmazásaid egyszerű elérhetősége mind ezen múlik.</p>
-                        <p>Az első évi domain regisztrációt mi álljuk. Utána a domain éves díját (jellemzően 3 000–6 000 Ft) költségen adjuk tovább — semmi rejtett felár.</p>
-                        <p style="color: var(--text-3); font-size: 0.9rem;">Meglévő domained is használhatjuk, ha van — ilyenkor a DNS beállítást mi végezzük el.</p>
+                        <p>A saját domain nem luxus – hanem a megbízható rendszer alapja. Az SSL tanúsítványok, a biztonságos HTTPS hozzáférés és az alkalmazásaid egyszerű elérhetősége mind ezen múlik.</p>
+                        <p>Az első évi domain regisztrációt mi álljuk. Utána a domain éves díját (jellemzően 3 000–6 000 Ft) költségen adjuk tovább – semmi rejtett felár.</p>
+                        <p style="color: var(--text-3); font-size: 0.9rem;">Meglévő domained is használhatjuk, ha van – ilyenkor a DNS beállítást mi végezzük el.</p>
                     </div>
                     <div class="domain-visual">
                         <div class="domain-example">
                             <span class="domain-icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-camera"/></svg></span>
                             <div>
                                 <div class="domain-url">photos.pelda-csalad.hu</div>
-                                <div class="domain-desc">Immich — családi fotók</div>
+                                <div class="domain-desc">Immich – családi fotók</div>
                             </div>
                         </div>
                         <div class="domain-example">
                             <span class="domain-icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-folder"/></svg></span>
                             <div>
                                 <div class="domain-url">cloud.pelda-csalad.hu</div>
-                                <div class="domain-desc">Nextcloud — fájlok és naptár</div>
+                                <div class="domain-desc">Nextcloud – fájlok és naptár</div>
                             </div>
                         </div>
                         <div class="domain-example">
                             <span class="domain-icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-clapperboard"/></svg></span>
                             <div>
                                 <div class="domain-url">media.pelda-csalad.hu</div>
-                                <div class="domain-desc">Jellyfin — filmek és sorozatok</div>
+                                <div class="domain-desc">Jellyfin – filmek és sorozatok</div>
                             </div>
                         </div>
                         <div class="domain-example">
                             <span class="domain-icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-lock"/></svg></span>
                             <div>
                                 <div class="domain-url">vault.pelda-csalad.hu</div>
-                                <div class="domain-desc">Vaultwarden — jelszókezelő</div>
+                                <div class="domain-desc">Vaultwarden – jelszókezelő</div>
                             </div>
                         </div>
                     </div>
@@ -505,7 +524,7 @@
             <div class="container">
                 <div class="section-header">
                     <h2>Hogyan <span>működik?</span></h2>
-                    <p>Az első megkereséstől a működő rendszerig — lépésről lépésre</p>
+                    <p>Az első megkereséstől a működő rendszerig – lépésről lépésre</p>
                 </div>
 
                 <div class="process-timeline">
@@ -520,7 +539,7 @@
                         <div class="step-number">2</div>
                         <div class="step-content">
                             <h4>Árajánlat</h4>
-                            <p>A konzultáció alapján részletes árajánlatot küldünk — pontosan tudni fogod, mit kapsz és mennyiért. Semmi apróbetű.</p>
+                            <p>A konzultáció alapján részletes árajánlatot küldünk – pontosan tudni fogod, mit kapsz és mennyiért. Semmi apróbetű.</p>
                         </div>
                     </div>
                     <div class="process-step">
@@ -562,7 +581,7 @@
             <div class="container">
                 <div class="cta-box">
                     <h2>Kérdésed van? <span>Beszéljünk!</span></h2>
-                    <p>Az egyedi árajánlat ingyenes és kötelezettségmentes. Írd meg, mire lenne szükséged — mi pedig megmondjuk, mennyibe kerül.</p>
+                    <p>Az egyedi árajánlat ingyenes és kötelezettségmentes. Írd meg, mire lenne szükséged – mi pedig megmondjuk, mennyibe kerül.</p>
                     <div class="cta-buttons">
                         <a href="/kapcsolat" class="cta-button"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-message-square"/></svg> Ajánlatot kérek</a>
                         <a href="mailto:info@felhom.eu" class="cta-button-secondary"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-mail"/></svg> info@felhom.eu</a>
@@ -571,13 +590,6 @@
             </div>
         </section>
     </main>
-
-    <footer>
-        <div class="container">
-            <p>© 2026 felhom.eu – Saját felhőd, saját szabályaid</p>
-            <p class="footer-legal">Üzemeltető: Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Adatkezelési tájékoztató</a> · <a href="/feltetelek">Feltételek</a></p>
-        </div>
-    </footer>
     <script>
     (function() {
         var hamburger = document.getElementById('hamburger');
@@ -639,5 +651,35 @@
         });
     })();
     </script>
+<footer>
+        <div class="container">
+            <p>© 2026 felhom.eu – Saját felhőd, saját szabályaid</p>
+            <p class="footer-legal">Üzemeltető: Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Adatkezelési tájékoztató</a> · <a href="/feltetelek">Feltételek</a></p>
+        </div>
+    </footer>
+    <script>
+    (function(){
+        var b=document.getElementById('navBurger'),s=document.getElementById('sidebar'),k=document.getElementById('navBackdrop');
+        if(!b||!s||!k)return;
+        function open(){s.classList.add('is-open');k.hidden=false;document.body.classList.add('nav-open');b.setAttribute('aria-expanded','true');}
+        function close(){s.classList.remove('is-open');k.hidden=true;document.body.classList.remove('nav-open');b.setAttribute('aria-expanded','false');}
+        b.addEventListener('click',function(){s.classList.contains('is-open')?close():open();});
+        k.addEventListener('click',close);
+        document.addEventListener('keydown',function(e){if(e.key==='Escape'&&s.classList.contains('is-open')){close();b.focus();}});
+        s.querySelectorAll('a').forEach(function(l){l.addEventListener('click',close);});
+        window.addEventListener('resize',function(){if(window.innerWidth>768)close();});
+    })();
+    document.addEventListener('click',function(e){
+        var btn=e.target.closest?e.target.closest('.nav-group-toggle'):null;
+        if(!btn)return;
+        var g=btn.closest('.nav-group');if(!g)return;
+        var willOpen=!g.classList.contains('is-open');
+        document.querySelectorAll('.nav-group.is-open').forEach(function(x){
+            x.classList.remove('is-open');
+            var t=x.querySelector('.nav-group-toggle');if(t)t.setAttribute('aria-expanded','false');
+        });
+        if(willOpen){g.classList.add('is-open');btn.setAttribute('aria-expanded','true');}
+    });
+    </script>
 </body>
-</html>
\ No newline at end of file
+</html>
diff --git a/website/technologiak.html b/website/technologiak.html
index 3cd1f807..00b57448 100644
--- a/website/technologiak.html
+++ b/website/technologiak.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html lang="hu">
+<html lang="hu" class="no-js">
 <head>
+    <script>document.documentElement.className=document.documentElement.className.replace('no-js','js');</script>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Technológiák — Docker, vezérlőpult, Proxmox otthoni szerverhez | Felhom.eu</title>
@@ -38,45 +39,63 @@
     }
     </script>
     <!-- shared assets: bump ?v= together on any site.css/icons.svg change -->
-    <link rel="stylesheet" href="/assets/site.css?v=21">
+    <link rel="stylesheet" href="/assets/site.css?v=22">
+    <link rel="stylesheet" href="/assets/shell.css?v=22">
     <link rel="icon" type="image/png" href="/assets/logo_favicon_2.svg">
     <script defer src="/assets/gallery.js?v=2"></script>
     <script defer src="https://stats.felhom.eu/script.js" data-website-id="d419db57-5e1c-48df-bdb3-c29f25fb1661"></script>
 </head>
-<body class="page-technologiak">
-    <nav>
-        <div class="container">
-            <a href="/" class="logo">
-                <img class="logo-mark" src="/assets/logo-mark.svg" alt="" aria-hidden="true">
-                <img class="logo-word" src="/assets/logo-wordmark.png" alt="felhom.eu">
+<body class="shell page-technologiak">
+    <header class="mobile-topbar">
+        <a href="/" class="mobile-topbar-logo"><img src="/assets/logo_notext_white.svg" alt="Felhom.eu"></a>
+        <button type="button" class="nav-burger" id="navBurger" aria-expanded="false" aria-controls="sidebar" aria-label="Menü">
+            <span class="hamburger-box"><span class="hamburger-line"></span><span class="hamburger-line"></span><span class="hamburger-line"></span></span>
+        </button>
+    </header>
+    <div class="nav-backdrop" id="navBackdrop" hidden></div>
+    <nav class="sidebar" id="sidebar">
+        <div class="sidebar-header">
+            <a href="/" class="sidebar-logo-link">
+                <img src="/assets/logo_notext_white.svg" alt="" class="sidebar-logo" aria-hidden="true">
+                <img src="/assets/logo-wordmark.png" alt="felhom.eu" class="sidebar-word">
             </a>
-            <ul class="nav-links">
-                <li><a href="/#szolgaltatasok">Szolgáltatások</a></li>
-                <li><a href="/alkalmazasok">Alkalmazások</a></li>
-                <li><a href="/technologiak" class="active">Technológiák</a></li>
-                <li><a href="/biztonsagimentes">Mentések</a></li>
-                <li><a href="/gyik">GYIK</a></li>
-                <li><a href="/kapcsolat">Kapcsolat</a></li>
-                <li class="lang-globe-li"><details class="lang-globe"><summary class="lang-globe-btn" aria-label="Nyelv" title="Nyelv"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/technologiak" lang="hu" hreflang="hu" class="lang-globe-item current" aria-current="true">Magyar</a></li><li><a href="/en/technology" lang="en" hreflang="en" class="lang-globe-item">English</a></li></ul></details></li>
+        </div>
+        <ul class="nav-links">
+                <li><a href="/"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg>Kezdőlap</a></li>
+                <li><a href="/#szolgaltatasok"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rocket"/></svg>Szolgáltatások</a></li>
+                <li class="nav-group">
+                    <button type="button" class="nav-group-toggle" aria-expanded="false" aria-controls="nav-group-apps"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg>Alkalmazások<svg class="ico nav-chevron" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chevron-down"/></svg></button>
+                    <ul id="nav-group-apps" class="nav-links nav-links-sub nav-links-nested">
+                        <li><a href="/alkalmazasok">Minden alkalmazás</a></li>
+                        <li><a href="/alkalmazasok#fajlkezeles-irodai">Fájlkezelés &amp; Irodai</a></li>
+                        <li><a href="/alkalmazasok#media-szorakozas">Média &amp; Szórakozás</a></li>
+                        <li><a href="/alkalmazasok#otthon-eletmod">Otthon &amp; Életmód</a></li>
+                        <li><a href="/alkalmazasok#produktivitas-tudaskezeles">Produktivitás &amp; Tudáskezelés</a></li>
+                        <li><a href="/alkalmazasok#rendszer-fejlesztes">Rendszer &amp; Fejlesztés</a></li>
+                    </ul>
+                </li>
+                <li><a href="/technologiak" class="active"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg>Technológiák</a></li>
+                <li><a href="/biztonsagimentes"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg>Biztonsági mentés</a></li>
+        </ul>
+        <div class="sidebar-bottom">
+            <a href="/teszteles" class="btn btn-outline sidebar-cta">Jelentkezem tesztelőnek →</a>
+            <div class="nav-group-label">A Felhomról</div>
+            <ul class="nav-links nav-links-sub">
+                    <li><a href="/#hogyan-mukodik">Hogyan működik</a></li>
+                    <li><a href="/gyik">GYIK</a></li>
+                    <li><a href="/kapcsolat">Kapcsolat</a></li>
             </ul>
-            <button class="hamburger" id="hamburger" aria-label="Menü megnyitása" aria-expanded="false">
-                <span class="hamburger-box">
-                    <span class="hamburger-line"></span>
-                    <span class="hamburger-line"></span>
-                    <span class="hamburger-line"></span>
-                </span>
-            </button>
+            <div class="sidebar-footer">
+                <details class="lang-globe"><summary class="lang-globe-btn" aria-label="Nyelv" title="Nyelv"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/technologiak" lang="hu" hreflang="hu" class="lang-globe-item current" aria-current="true">Magyar</a></li><li><a href="/en/technology" lang="en" hreflang="en" class="lang-globe-item">English</a></li></ul></details>
+            </div>
         </div>
     </nav>
-    <div class="mobile-overlay" id="mobileOverlay"></div>
-
-    <main>
-        <section class="page-header">
-            <div class="container">
+<main class="content">
+                <div class="page-header">
                 <h1>Alkalmazott <span>Technológiák</span></h1>
-                <p>Modern, bevált megoldások az otthoni szerverek üzemeltetéséhez. Íme, hogyan építjük fel a rendszereket.</p>
             </div>
-        </section>
+                <p class="page-lede">Modern, bevált megoldások az otthoni szerverek üzemeltetéséhez. Íme, hogyan építjük fel a rendszereket.</p>
+
 
         <!-- Table of Contents -->
         <section class="content-section" style="padding-top: 0;">
@@ -153,7 +172,7 @@
 
                 <div class="info-card">
                     <h3><span class="icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-target"/></svg></span> Mit csinál a vezérlőpult?</h3>
-                    <p>A vezérlőpult minden Felhom dobozon ott van: ez a magyar vagy angol nyelvű kezelőfelület, amely a Proxmox alapra épülő rendszeredet vezérli. Egy kimondottan otthoni szerverekre tervezett felület, ahol pár kattintással telepíthetsz alkalmazásokat, és nem kell parancssorhoz nyúlnod — a háttérben a Docker és a Proxmox dolgozik helyetted.</p>
+                    <p>A vezérlőpult minden Felhom dobozon ott van: ez a magyar vagy angol nyelvű kezelőfelület, amely a Proxmox alapra épülő rendszeredet vezérli. Egy kimondottan otthoni szerverekre tervezett felület, ahol pár kattintással telepíthetsz alkalmazásokat, és nem kell parancssorhoz nyúlnod – a háttérben a Docker és a Proxmox dolgozik helyetted.</p>
                     
                     <ul class="feature-list">
                         <li>Magyar vagy angol webes felület – a háztartás választ, és nincs szükség parancssor ismeretre</li>
@@ -167,11 +186,11 @@
                     <div class="dash-grid">
                     <figure class="dash-shot">
                         <a href="/assets/dashboard-apps-hu.webp" data-gallery="dashboard"><img src="/assets/dashboard-apps-hu.webp" alt="Az Alkalmazások oldal: telepített és telepíthető alkalmazások kártyái, állapottal" width="1440" height="900" loading="lazy"></a>
-                        <figcaption><strong>Alkalmazások</strong> — telepítés pár kattintással, és látod, mi fut és mi naprakész.</figcaption>
+                        <figcaption><strong>Alkalmazások</strong> – telepítés pár kattintással, és látod, mi fut és mi naprakész.</figcaption>
                     </figure>
                     <figure class="dash-shot">
                         <a href="/assets/dashboard-backups-hu.webp" data-gallery="dashboard"><img src="/assets/dashboard-backups-hu.webp" alt="A mentések oldala: minden alkalmazás adatbázisának éjszakai mentése, ellenőrizve" width="1440" height="900" loading="lazy"></a>
-                        <figcaption><strong>Mentések</strong> — minden éjjel minden alkalmazás adatbázisa mentésre kerül, és ellenőrizzük.</figcaption>
+                        <figcaption><strong>Mentések</strong> – minden éjjel minden alkalmazás adatbázisa mentésre kerül, és ellenőrizzük.</figcaption>
                     </figure>
                     </div>
 
@@ -201,7 +220,7 @@
                             <div class="layer-label">Rendszerkörnyezet</div>
                             <div class="layer-content">
                                 <div class="layer-name">Izolált rendszerkörnyezet</div>
-                                <div class="layer-tech">A te dobozod — tisztán elkülönített rendszer</div>
+                                <div class="layer-tech">A te dobozod – tisztán elkülönített rendszer</div>
                             </div>
                         </div>
                         <div class="stack-layer">
@@ -233,10 +252,10 @@
 
                 <div class="info-card">
                     <h3><span class="icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg></span> Mi az a Proxmox?</h3>
-                    <p>A Proxmox VE egy ingyenes, professzionális virtualizációs platform — ugyanaz a fajta technológia, amelyet adatközpontok és cégek használnak. Ez a Felhom rendszerek alapja: erre építünk minden gépet, és erre települ az izolált rendszerkörnyezet, amelyben az alkalmazásaid futnak.</p>
+                    <p>A Proxmox VE egy ingyenes, professzionális virtualizációs platform – ugyanaz a fajta technológia, amelyet adatközpontok és cégek használnak. Ez a Felhom rendszerek alapja: erre építünk minden gépet, és erre települ az izolált rendszerkörnyezet, amelyben az alkalmazásaid futnak.</p>
 
                     <div class="highlight-box">
-                        <p><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg> <strong>Az alap, nem opció:</strong> A Proxmox minden Felhom dobozon ott van. Nem kell róla tudnod és nem kell vele foglalkoznod — csendben a háttérben dolgozik, és ez teszi a rendszeredet biztonságossá és menthetővé.</p>
+                        <p><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg> <strong>Az alap, nem opció:</strong> A Proxmox minden Felhom dobozon ott van. Nem kell róla tudnod és nem kell vele foglalkoznod – csendben a háttérben dolgozik, és ez teszi a rendszeredet biztonságossá és menthetővé.</p>
                     </div>
                 </div>
 
@@ -251,7 +270,7 @@
                     </ul>
 
                     <div class="highlight-box">
-                        <p><strong>Egy alap, egy feladat:</strong> a Felhom dobozon a Proxmox egyetlen elkülönített rendszerkörnyezetet futtat — azt, amelyben az alkalmazásaid dolgoznak.</p>
+                        <p><strong>Egy alap, egy feladat:</strong> a Felhom dobozon a Proxmox egyetlen elkülönített rendszerkörnyezetet futtat – azt, amelyben az alkalmazásaid dolgoznak.</p>
                     </div>
                 </div>
             </div>
@@ -423,7 +442,7 @@
                 <div class="info-card" style="margin-top: 48px;">
                     <h3><span class="icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-lightbulb"/></svg></span> Melyiket válaszd?</h3>
                     <div class="highlight-box">
-                        <p><strong>Tanácsunk:</strong> Kezdj kicsiben! Egy jó mini PC elegendő a legtöbb otthoni igényhez, és később bővítheted. A rack szerver üzleti / igény szerinti konfiguráció — otthonra ritkán szükséges.</p>
+                        <p><strong>Tanácsunk:</strong> Kezdj kicsiben! Egy jó mini PC elegendő a legtöbb otthoni igényhez, és később bővítheted. A rack szerver üzleti / igény szerinti konfiguráció – otthonra ritkán szükséges.</p>
                     </div>
                 </div>
             </div>
@@ -439,13 +458,6 @@
             </div>
         </section>
     </main>
-
-    <footer>
-        <div class="container">
-            <p>© 2026 felhom.eu – Saját felhőd, saját szabályaid</p>
-            <p class="footer-legal">Üzemeltető: Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Adatkezelési tájékoztató</a> · <a href="/feltetelek">Feltételek</a></p>
-        </div>
-    </footer>
     <script>
     (function() {
         var hamburger = document.getElementById('hamburger');
@@ -507,5 +519,35 @@
         });
     })();
     </script>
+<footer>
+        <div class="container">
+            <p>© 2026 felhom.eu – Saját felhőd, saját szabályaid</p>
+            <p class="footer-legal">Üzemeltető: Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Adatkezelési tájékoztató</a> · <a href="/feltetelek">Feltételek</a></p>
+        </div>
+    </footer>
+    <script>
+    (function(){
+        var b=document.getElementById('navBurger'),s=document.getElementById('sidebar'),k=document.getElementById('navBackdrop');
+        if(!b||!s||!k)return;
+        function open(){s.classList.add('is-open');k.hidden=false;document.body.classList.add('nav-open');b.setAttribute('aria-expanded','true');}
+        function close(){s.classList.remove('is-open');k.hidden=true;document.body.classList.remove('nav-open');b.setAttribute('aria-expanded','false');}
+        b.addEventListener('click',function(){s.classList.contains('is-open')?close():open();});
+        k.addEventListener('click',close);
+        document.addEventListener('keydown',function(e){if(e.key==='Escape'&&s.classList.contains('is-open')){close();b.focus();}});
+        s.querySelectorAll('a').forEach(function(l){l.addEventListener('click',close);});
+        window.addEventListener('resize',function(){if(window.innerWidth>768)close();});
+    })();
+    document.addEventListener('click',function(e){
+        var btn=e.target.closest?e.target.closest('.nav-group-toggle'):null;
+        if(!btn)return;
+        var g=btn.closest('.nav-group');if(!g)return;
+        var willOpen=!g.classList.contains('is-open');
+        document.querySelectorAll('.nav-group.is-open').forEach(function(x){
+            x.classList.remove('is-open');
+            var t=x.querySelector('.nav-group-toggle');if(t)t.setAttribute('aria-expanded','false');
+        });
+        if(willOpen){g.classList.add('is-open');btn.setAttribute('aria-expanded','true');}
+    });
+    </script>
 </body>
-</html>
\ No newline at end of file
+</html>
diff --git a/website/teszteles.html b/website/teszteles.html
index d5786ff1..69d376e8 100644
--- a/website/teszteles.html
+++ b/website/teszteles.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html lang="hu">
+<html lang="hu" class="no-js">
 <head>
+    <script>document.documentElement.className=document.documentElement.className.replace('no-js','js');</script>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Tesztelőket keresünk — otthoni szerver, saját felhő ingyen kipróbálva | Felhom.eu</title>
@@ -37,58 +38,76 @@
     }
     </script>
     <!-- shared assets: bump ?v= together on any site.css/icons.svg change -->
-    <link rel="stylesheet" href="/assets/site.css?v=21">
+    <link rel="stylesheet" href="/assets/site.css?v=22">
+    <link rel="stylesheet" href="/assets/shell.css?v=22">
     <link rel="icon" type="image/png" href="/assets/logo_favicon_2.svg">
     <script defer src="https://stats.felhom.eu/script.js" data-website-id="d419db57-5e1c-48df-bdb3-c29f25fb1661"></script>
 </head>
-<body class="page-teszteles">
-    <nav>
-        <div class="container">
-            <a href="/" class="logo">
-                <img class="logo-mark" src="/assets/logo-mark.svg" alt="" aria-hidden="true">
-                <img class="logo-word" src="/assets/logo-wordmark.png" alt="felhom.eu">
+<body class="shell page-teszteles">
+    <header class="mobile-topbar">
+        <a href="/" class="mobile-topbar-logo"><img src="/assets/logo_notext_white.svg" alt="Felhom.eu"></a>
+        <button type="button" class="nav-burger" id="navBurger" aria-expanded="false" aria-controls="sidebar" aria-label="Menü">
+            <span class="hamburger-box"><span class="hamburger-line"></span><span class="hamburger-line"></span><span class="hamburger-line"></span></span>
+        </button>
+    </header>
+    <div class="nav-backdrop" id="navBackdrop" hidden></div>
+    <nav class="sidebar" id="sidebar">
+        <div class="sidebar-header">
+            <a href="/" class="sidebar-logo-link">
+                <img src="/assets/logo_notext_white.svg" alt="" class="sidebar-logo" aria-hidden="true">
+                <img src="/assets/logo-wordmark.png" alt="felhom.eu" class="sidebar-word">
             </a>
-            <ul class="nav-links">
-                <li><a href="/#szolgaltatasok">Szolgáltatások</a></li>
-                <li><a href="/alkalmazasok">Alkalmazások</a></li>
-                <li><a href="/technologiak">Technológiák</a></li>
-                <li><a href="/biztonsagimentes">Mentések</a></li>
-                <li><a href="/gyik">GYIK</a></li>
-                <li><a href="/kapcsolat">Kapcsolat</a></li>
-                <li class="lang-globe-li"><details class="lang-globe"><summary class="lang-globe-btn" aria-label="Nyelv" title="Nyelv"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/teszteles" lang="hu" hreflang="hu" class="lang-globe-item current" aria-current="true">Magyar</a></li><li><a href="/en/testing" lang="en" hreflang="en" class="lang-globe-item">English</a></li></ul></details></li>
+        </div>
+        <ul class="nav-links">
+                <li><a href="/"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg>Kezdőlap</a></li>
+                <li><a href="/#szolgaltatasok"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rocket"/></svg>Szolgáltatások</a></li>
+                <li class="nav-group">
+                    <button type="button" class="nav-group-toggle" aria-expanded="false" aria-controls="nav-group-apps"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg>Alkalmazások<svg class="ico nav-chevron" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chevron-down"/></svg></button>
+                    <ul id="nav-group-apps" class="nav-links nav-links-sub nav-links-nested">
+                        <li><a href="/alkalmazasok">Minden alkalmazás</a></li>
+                        <li><a href="/alkalmazasok#fajlkezeles-irodai">Fájlkezelés &amp; Irodai</a></li>
+                        <li><a href="/alkalmazasok#media-szorakozas">Média &amp; Szórakozás</a></li>
+                        <li><a href="/alkalmazasok#otthon-eletmod">Otthon &amp; Életmód</a></li>
+                        <li><a href="/alkalmazasok#produktivitas-tudaskezeles">Produktivitás &amp; Tudáskezelés</a></li>
+                        <li><a href="/alkalmazasok#rendszer-fejlesztes">Rendszer &amp; Fejlesztés</a></li>
+                    </ul>
+                </li>
+                <li><a href="/technologiak"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg>Technológiák</a></li>
+                <li><a href="/biztonsagimentes"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg>Biztonsági mentés</a></li>
+        </ul>
+        <div class="sidebar-bottom">
+            <a href="/teszteles" class="btn btn-outline sidebar-cta">Jelentkezem tesztelőnek →</a>
+            <div class="nav-group-label">A Felhomról</div>
+            <ul class="nav-links nav-links-sub">
+                    <li><a href="/#hogyan-mukodik">Hogyan működik</a></li>
+                    <li><a href="/gyik">GYIK</a></li>
+                    <li><a href="/kapcsolat">Kapcsolat</a></li>
             </ul>
-            <button class="hamburger" id="hamburger" aria-label="Menü megnyitása" aria-expanded="false">
-                <span class="hamburger-box">
-                    <span class="hamburger-line"></span>
-                    <span class="hamburger-line"></span>
-                    <span class="hamburger-line"></span>
-                </span>
-            </button>
+            <div class="sidebar-footer">
+                <details class="lang-globe"><summary class="lang-globe-btn" aria-label="Nyelv" title="Nyelv"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/teszteles" lang="hu" hreflang="hu" class="lang-globe-item current" aria-current="true">Magyar</a></li><li><a href="/en/testing" lang="en" hreflang="en" class="lang-globe-item">English</a></li></ul></details>
+            </div>
         </div>
     </nav>
-    <div class="mobile-overlay" id="mobileOverlay"></div>
-
-    <main>
-        <section class="page-header">
-            <div class="container">
+<main class="content">
+                <div class="page-header">
                 <h1>Legyél <span>tesztelő</span></h1>
-                <p>Néhány magyar háztartással most kezdjük el élesben használni a rendszert. A teszt alatt nincs díj, a beállítást mi végezzük, és a domaint is mi fizetjük. Cserébe azt kérjük, mondd el, mi nem jó.</p>
             </div>
-        </section>
+                <p class="page-lede">Néhány magyar háztartással most kezdjük el élesben használni a rendszert. A teszt alatt nincs díj, a beállítást mi végezzük, és a domaint is mi fizetjük. Cserébe azt kérjük, mondd el, mi nem jó.</p>
+
 
         <!-- Kinek szól -->
         <section class="content-section">
             <div class="container">
                 <div class="section-header">
                     <h2>Kinek <span>szól</span></h2>
-                    <p>Nem informatikusokat keresünk — családokat, akik tényleg használni fogják</p>
+                    <p>Nem informatikusokat keresünk – családokat, akik tényleg használni fogják</p>
                 </div>
                 <div class="info-card">
                     <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg> Egy magyar háztartás, aki haza akarja tenni az adatait</h3>
-                    <p>Ha a fényképeid, a beszkennelt papírjaid és a filmjeid ma egy külföldi szolgáltatónál vannak, és szeretnéd, hogy inkább nálad, a saját gépeden legyenek — téged keresünk.</p>
+                    <p>Ha a fényképeid, a beszkennelt papírjaid és a filmjeid ma egy külföldi szolgáltatónál vannak, és szeretnéd, hogy inkább nálad, a saját gépeden legyenek – téged keresünk.</p>
                     <p><strong>Informatikai tudás nem kell.</strong> A szervert mi állítjuk be nálad, és mi is üzemeltetjük. Neked a böngészőből kell használnod, úgy, mint bármelyik másik oldalt.</p>
                     <div class="highlight-box">
-                        <p>Ami viszont kell: <strong>türelem</strong>. Ez teszt, nem kész termék. Találni fogsz hibát — pont ez a lényege.</p>
+                        <p>Ami viszont kell: <strong>türelem</strong>. Ez teszt, nem kész termék. Találni fogsz hibát – pont ez a lényege.</p>
                     </div>
                 </div>
             </div>
@@ -99,32 +118,32 @@
             <div class="container">
                 <div class="section-header">
                     <h2>Mi kell <span>hozzá</span></h2>
-                    <p>Három dolog — és a harmadikat mi fizetjük</p>
+                    <p>Három dolog – és a harmadikat mi fizetjük</p>
                 </div>
 
                 <div class="info-card">
                     <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-cpu"/></svg> 1. Egy gép, ami bekapcsolva tud maradni</h3>
                     <!-- source: website/gyik.html FAQ „Milyen gépre van szükségem?" (quoted, not invented) -->
-                    <p>A szerver a lakásodban áll, és folyamatosan megy — ezért fontos, hogy csendes és takarékos legyen. A GYIK-ből idézve: <em>„A legtöbb otthoni felhasználónak egy mini PC (pl. Intel N100 processzorral, 16-32 GB RAM-mal) tökéletesen megfelel. Ezek csendesek, energiatakarékosak (15-35W fogyasztás), és kompaktak — elfér a polcon a router mellett."</em></p>
+                    <p>A szerver a lakásodban áll, és folyamatosan megy – ezért fontos, hogy csendes és takarékos legyen. A GYIK-ből idézve: <em>„A legtöbb otthoni felhasználónak egy mini PC (pl. Intel N100 processzorral, 16-32 GB RAM-mal) tökéletesen megfelel. Ezek csendesek, energiatakarékosak (15-35W fogyasztás), és kompaktak – elfér a polcon a router mellett."</em></p>
                     <!-- source: website/gyik.html FAQ „Használhatom a már meglévő régi gépemet?" (quoted) -->
-                    <p>Régi géped is lehet jó: <em>„Sok esetben igen! Egy korábbi asztali PC kiváló szerver lehet. Az egyeztetés során felmérjük, hogy a meglévő géped alkalmas-e a tervezett feladatokra (elég RAM, tároló kapacitás, megbízhatóság). Fontos szempont a fogyasztás és a zajszint — egy régi gamer PC működik ugyan, de havi szinten jóval többet fogyaszt, mint egy modern mini PC."</em></p>
-                    <p>Ha nincs géped, az nem kizáró ok — az egyeztetésen átbeszéljük, mi a legjobb a te helyzetedben. Részletesebb konfigurációk a <a href="/technologiak">Technológiák</a> oldalon.</p>
+                    <p>Régi géped is lehet jó: <em>„Sok esetben igen! Egy korábbi asztali PC kiváló szerver lehet. Az egyeztetés során felmérjük, hogy a meglévő géped alkalmas-e a tervezett feladatokra (elég RAM, tároló kapacitás, megbízhatóság). Fontos szempont a fogyasztás és a zajszint – egy régi gamer PC működik ugyan, de havi szinten jóval többet fogyaszt, mint egy modern mini PC."</em></p>
+                    <p>Ha nincs géped, az nem kizáró ok – az egyeztetésen átbeszéljük, mi a legjobb a te helyzetedben. Részletesebb konfigurációk a <a href="/technologiak">Technológiák</a> oldalon.</p>
                 </div>
 
                 <div class="info-card">
                     <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-radio-tower"/></svg> 2. Otthoni internet</h3>
                     <!-- source: website/gyik.html FAQ „Milyen internet kapcsolat szükséges?" (quoted) -->
-                    <p>A GYIK-ből idézve: <em>„Otthoni használathoz (helyi hálózaton belül) bármilyen internet elég, mert az alkalmazások a helyi hálózatodon futnak — nem az interneten keresztül. […] Ha távolról is el szeretnéd érni a szerveredet (pl. munkahelyről vagy nyaralásból), akkor a feltöltési sebesség (upload) számít: minimum 10 Mbps ajánlott, de minél több, annál jobb."</em></p>
+                    <p>A GYIK-ből idézve: <em>„Otthoni használathoz (helyi hálózaton belül) bármilyen internet elég, mert az alkalmazások a helyi hálózatodon futnak – nem az interneten keresztül. […] Ha távolról is el szeretnéd érni a szerveredet (pl. munkahelyről vagy nyaralásból), akkor a feltöltési sebesség (upload) számít: minimum 10 Mbps ajánlott, de minél több, annál jobb."</em></p>
                 </div>
 
                 <div class="info-card">
-                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg> 3. Egy domain — amit mi fizetünk</h3>
+                    <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg> 3. Egy domain – amit mi fizetünk</h3>
                     <!-- source: operator ruling D1, 2026-10-10 (CONTEXT.md); documentation/architecture/01-topology-and-trust.md §7 -->
-                    <p>A szerveredet és az alkalmazásaidat a <strong>saját domainedről</strong> érjük el — nem egy felhom.eu alatti névről. Így a vezérlőpultod <code>felhom.a-te-domained.hu</code> lesz, és minden alkalmazás egy saját aldomaint kap.</p>
+                    <p>A szerveredet és az alkalmazásaidat a <strong>saját domainedről</strong> érjük el – nem egy felhom.eu alatti névről. Így a vezérlőpultod <code>felhom.a-te-domained.hu</code> lesz, és minden alkalmazás egy saját aldomaint kap.</p>
                     <div class="highlight-box">
-                        <p><strong>A domain a te nevedre szól, és a díját a teszt alatt mi fizetjük — két évre.</strong> A domain tehát a tiéd: ha a teszt véget ér, vagy ha kiszállsz, <strong>a domain nálad marad</strong>, és onnantól te fizeted tovább. Nem kérjük vissza, és nem visszük magunkkal.</p>
+                        <p><strong>A domain a te nevedre szól, és a díját a teszt alatt mi fizetjük – két évre.</strong> A domain tehát a tiéd: ha a teszt véget ér, vagy ha kiszállsz, <strong>a domain nálad marad</strong>, és onnantól te fizeted tovább. Nem kérjük vissza, és nem visszük magunkkal.</p>
                     </div>
-                    <p>A domain DNS-beállításait a teszt alatt mi kezeljük, egy olyan hozzáféréssel, ami <strong>kizárólag ezt az egy domaint látja</strong> — máshoz nem ér hozzá.</p>
+                    <p>A domain DNS-beállításait a teszt alatt mi kezeljük, egy olyan hozzáféréssel, ami <strong>kizárólag ezt az egy domaint látja</strong> – máshoz nem ér hozzá.</p>
                 </div>
             </div>
         </section>
@@ -134,7 +153,7 @@
             <div class="container">
                 <div class="section-header">
                     <h2>Mit <span>kapsz</span></h2>
-                    <p>Ugyanaz a lista, ami a teszt feltételeinek 3. pontjában áll — se több, se kevesebb</p>
+                    <p>Ugyanaz a lista, ami a teszt feltételeinek 3. pontjában áll – se több, se kevesebb</p>
                 </div>
                 <div class="info-card">
                     <!-- source: documentation/legal/feltetelek-1.0.md §3 (same promises, no new ones) -->
@@ -147,7 +166,7 @@
                         <li><strong>Frissítjük</strong> az alkalmazásokat és a rendszert, jellemzően éjszaka, egy általad beállítható időablakban.</li>
                         <li>És a fentiek szerint: <strong>a domaint két évre mi fizetjük.</strong></li>
                     </ul>
-                    <p>Hogy mit <strong>nem</strong> ígérünk — rendelkezésre állást és válaszidőt nem vállalunk —, azt a <a href="/feltetelek">teszt feltételei</a> 5. pontja írja le. Érdemes elolvasni, mielőtt jelentkezel.</p>
+                    <p>Hogy mit <strong>nem</strong> ígérünk – rendelkezésre állást és válaszidőt nem vállalunk –, azt a <a href="/feltetelek">teszt feltételei</a> 5. pontja írja le. Érdemes elolvasni, mielőtt jelentkezel.</p>
                 </div>
             </div>
         </section>
@@ -157,11 +176,11 @@
             <div class="container">
                 <div class="section-header">
                     <h2>Mit <span>kérünk</span></h2>
-                    <p>Pénzt nem — se tőled, se felénk</p>
+                    <p>Pénzt nem – se tőled, se felénk</p>
                 </div>
                 <div class="info-card">
                     <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-message-square"/></svg> Mondd el, mi nem jó</h3>
-                    <p>Ez az egyetlen, amit cserébe kérünk. Mi zavaró, mi érthetetlen, mi nem működik. Egy „ezt a gombot nem találtam" ér nekünk a legtöbbet — abból tudjuk, mit kell kijavítani.</p>
+                    <p>Ez az egyetlen, amit cserébe kérünk. Mi zavaró, mi érthetetlen, mi nem működik. Egy „ezt a gombot nem találtam" ér nekünk a legtöbbet – abból tudjuk, mit kell kijavítani.</p>
 
                     <h3 style="margin-top: 24px;"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg> Tarts meg egy saját másolatot</h3>
                     <!-- source: documentation/legal/feltetelek-1.0.md §4 („Ezért kérünk valamit") -->
@@ -180,7 +199,7 @@
                     <h3><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-users"/></svg> Legfeljebb 5 háztartás</h3>
                     <!-- source: operator ruling D2, 2026-10-10 (CONTEXT.md) -->
                     <p>A zárt tesztben <strong>legfeljebb 5 háztartás</strong> vesz részt. Ez azért ilyen kevés, mert egy ember üzemelteti a rendszert, és minden tesztelőre akarunk időt fordítani. A teszt <strong>most indul</strong>, így jelenleg <strong>mind az 5 hely szabad</strong>.</p>
-                    <p>Ha betelik, azt megírjuk — és szólunk, amikor újra szabadul egy hely.</p>
+                    <p>Ha betelik, azt megírjuk – és szólunk, amikor újra szabadul egy hely.</p>
                 </div>
             </div>
         </section>
@@ -189,7 +208,7 @@
         <section class="cta-section">
             <div class="container">
                 <h2>Érdekel? <span>Jelentkezz</span></h2>
-                <p>Írj egy üzenetet — <strong>nem kötelez semmire</strong>, először csak beszélgetünk. Átbeszéljük, van-e megfelelő géped, és mire használnád.</p>
+                <p>Írj egy üzenetet – <strong>nem kötelez semmire</strong>, először csak beszélgetünk. Átbeszéljük, van-e megfelelő géped, és mire használnád.</p>
                 <a href="/kapcsolat?tema=zart-teszt" class="cta-button">Jelentkezem tesztelőnek →</a>
             </div>
         </section>
@@ -202,21 +221,14 @@
                 </div>
                 <div class="info-card">
                     <ul>
-                        <li><a href="/feltetelek">A zárt teszt feltételei</a> — mit kapsz, mit nem ígérünk, és hogyan tudsz kiszállni.</li>
-                        <li><a href="/adatkezeles">Adatkezelési tájékoztató</a> — milyen adatot kezelünk, meddig, és miért.</li>
-                        <li><a href="/gyik">GYIK</a> — a géptől a mentésekig a leggyakoribb kérdések.</li>
+                        <li><a href="/feltetelek">A zárt teszt feltételei</a> – mit kapsz, mit nem ígérünk, és hogyan tudsz kiszállni.</li>
+                        <li><a href="/adatkezeles">Adatkezelési tájékoztató</a> – milyen adatot kezelünk, meddig, és miért.</li>
+                        <li><a href="/gyik">GYIK</a> – a géptől a mentésekig a leggyakoribb kérdések.</li>
                     </ul>
                 </div>
             </div>
         </section>
     </main>
-
-    <footer>
-        <div class="container">
-            <p>© 2026 felhom.eu – Saját felhőd, saját szabályaid</p>
-            <p class="footer-legal">Üzemeltető: Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Adatkezelési tájékoztató</a> · <a href="/feltetelek">Feltételek</a></p>
-        </div>
-    </footer>
     <script>
     (function() {
         var hamburger = document.getElementById('hamburger');
@@ -278,5 +290,35 @@
         });
     })();
     </script>
+<footer>
+        <div class="container">
+            <p>© 2026 felhom.eu – Saját felhőd, saját szabályaid</p>
+            <p class="footer-legal">Üzemeltető: Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Adatkezelési tájékoztató</a> · <a href="/feltetelek">Feltételek</a></p>
+        </div>
+    </footer>
+    <script>
+    (function(){
+        var b=document.getElementById('navBurger'),s=document.getElementById('sidebar'),k=document.getElementById('navBackdrop');
+        if(!b||!s||!k)return;
+        function open(){s.classList.add('is-open');k.hidden=false;document.body.classList.add('nav-open');b.setAttribute('aria-expanded','true');}
+        function close(){s.classList.remove('is-open');k.hidden=true;document.body.classList.remove('nav-open');b.setAttribute('aria-expanded','false');}
+        b.addEventListener('click',function(){s.classList.contains('is-open')?close():open();});
+        k.addEventListener('click',close);
+        document.addEventListener('keydown',function(e){if(e.key==='Escape'&&s.classList.contains('is-open')){close();b.focus();}});
+        s.querySelectorAll('a').forEach(function(l){l.addEventListener('click',close);});
+        window.addEventListener('resize',function(){if(window.innerWidth>768)close();});
+    })();
+    document.addEventListener('click',function(e){
+        var btn=e.target.closest?e.target.closest('.nav-group-toggle'):null;
+        if(!btn)return;
+        var g=btn.closest('.nav-group');if(!g)return;
+        var willOpen=!g.classList.contains('is-open');
+        document.querySelectorAll('.nav-group.is-open').forEach(function(x){
+            x.classList.remove('is-open');
+            var t=x.querySelector('.nav-group-toggle');if(t)t.setAttribute('aria-expanded','false');
+        });
+        if(willOpen){g.classList.add('is-open');btn.setAttribute('aria-expanded','true');}
+    });
+    </script>
 </body>
 </html>