diff --git a/partials/landing/main/faq.php b/partials/landing/main/faq.php
index a344857..7ce8c97 100644
--- a/partials/landing/main/faq.php
+++ b/partials/landing/main/faq.php
@@ -1,10 +1,11 @@
-<section id="faq" class="border-t border-brand-border/70 bg-brand-primarySoft/10">
-    <div class="mx-auto max-w-6xl px-4 sm:px-6 lg:px-8 py-16 sm:py-20 space-y-10">
+<section id="faq" class="border-t border-brand-border/60 bg-brand-primarySoft/10 py-16 sm:py-20">
+    <div class="px-4 sm:px-6 lg:px-8">
+        <div class="section-shell space-y-10">
         <div class="max-w-3xl space-y-4">
             <p class="text-xs font-heading font-semibold tracking-[0.3em] uppercase text-brand-primary" data-i18n="faq_kicker">
                 FAQ
             </p>
-            <h2 class="font-heading text-2xl sm:text-3xl font-bold text-white" data-i18n="faq_title">
+            <h2 class="font-heading text-2xl sm:text-3xl font-bold text-brand-text" data-i18n="faq_title">
                 Häufige Fragen zu USBCheck
             </h2>
             <p class="text-sm sm:text-base text-brand-muted" data-i18n="faq_intro">
@@ -13,7 +14,7 @@
         </div>
 
         <div class="space-y-4 text-sm text-brand-muted">
-            <details class="group rounded-xl2 border border-brand-border bg-brand-surface/80 px-5 py-4">
+            <details class="group card-frame">
                 <summary class="flex cursor-pointer list-none items-center justify-between gap-4">
                     <span class="font-semibold text-brand-text" data-i18n="faq_q1">Ist der Schnelltest wirklich komplett im Browser?</span>
                     <span class="ml-auto text-brand-muted group-open:hidden">+</span>
@@ -24,7 +25,7 @@
                 </div>
             </details>
 
-            <details class="group rounded-xl2 border border-brand-border bg-brand-surface/80 px-5 py-4">
+            <details class="group card-frame">
                 <summary class="flex cursor-pointer list-none items-center justify-between gap-4">
                     <span class="font-semibold text-brand-text" data-i18n="faq_q2">Brauche ich ein Konto, um den Schnelltest zu benutzen?</span>
                     <span class="ml-auto text-brand-muted group-open:hidden">+</span>
@@ -35,7 +36,7 @@
                 </div>
             </details>
 
-            <details class="group rounded-xl2 border border-brand-border bg-brand-surface/80 px-5 py-4">
+            <details class="group card-frame">
                 <summary class="flex cursor-pointer list-none items-center justify-between gap-4">
                     <span class="font-semibold text-brand-text" data-i18n="faq_q3">Kann USBCheck jeden Fake-Stick sicher erkennen?</span>
                     <span class="ml-auto text-brand-muted group-open:hidden">+</span>
@@ -46,7 +47,7 @@
                 </div>
             </details>
 
-            <details class="group rounded-xl2 border border-brand-border bg-brand-surface/80 px-5 py-4">
+            <details class="group card-frame">
                 <summary class="flex cursor-pointer list-none items-center justify-between gap-4">
                     <span class="font-semibold text-brand-text" data-i18n="faq_q4">Wie fügt sich das Tool in mein bestehendes System ein?</span>
                     <span class="ml-auto text-brand-muted group-open:hidden">+</span>
@@ -57,5 +58,6 @@
                 </div>
             </details>
         </div>
+        </div>
     </div>
 </section>
diff --git a/partials/landing/main/features.php b/partials/landing/main/features.php
index 38aafde..121f01a 100644
--- a/partials/landing/main/features.php
+++ b/partials/landing/main/features.php
@@ -1,10 +1,11 @@
-<section id="features" class="border-t border-brand-border/70 bg-brand-primarySoft/20">
-    <div class="mx-auto max-w-6xl px-4 sm:px-6 lg:px-8 py-16 sm:py-20 space-y-10">
+<section id="features" class="border-t border-brand-border/60 bg-brand-primarySoft/20 py-16 sm:py-20">
+    <div class="px-4 sm:px-6 lg:px-8">
+        <div class="section-shell space-y-10">
         <div class="max-w-3xl space-y-4">
             <p class="text-xs font-heading font-semibold tracking-[0.3em] uppercase text-brand-primary" data-i18n="features_kicker">
                 Free &amp; Pro features
             </p>
-            <h2 class="font-heading text-2xl sm:text-3xl font-bold text-white" data-i18n="features_title">
+            <h2 class="font-heading text-2xl sm:text-3xl font-bold text-brand-text" data-i18n="features_title">
                 Starte mit dem kostenlosen Schnelltest – wechsle in den Pro-Modus, wenn du mehr brauchst.
             </h2>
             <p class="text-sm sm:text-base text-brand-muted" data-i18n="features_intro">
@@ -14,9 +15,9 @@
 
         <div class="grid gap-6 md:grid-cols-2">
             <!-- Free -->
-            <div class="rounded-xl2 border border-brand-border bg-brand-surface/90 shadow-soft p-6 space-y-4">
+            <div class="card-frame card-frame--soft space-y-4">
                 <div class="flex items-center justify-between">
-                    <h3 class="font-heading text-xl font-semibold text-white" data-i18n="features_free_title">Free Quick Check</h3>
+                    <h3 class="font-heading text-xl font-semibold text-brand-text" data-i18n="features_free_title">Free Quick Check</h3>
                     <span class="inline-flex items-center rounded-full bg-emerald-500/10 px-3 py-1 text-xs font-semibold text-emerald-400" data-i18n="features_free_badge">
                         Recommended for most users
                     </span>
@@ -42,9 +43,9 @@
             </div>
 
             <!-- Pro -->
-            <div class="rounded-xl2 border border-brand-primary/60 bg-brand-surface shadow-soft p-6 space-y-4">
+            <div class="card-frame card-frame--accent space-y-4">
                 <div class="flex items-center justify-between">
-                    <h3 class="font-heading text-xl font-semibold text-white" data-i18n="features_pro_title">Pro Mode</h3>
+                    <h3 class="font-heading text-xl font-semibold text-brand-text" data-i18n="features_pro_title">Pro Mode</h3>
                     <span class="inline-flex items-center rounded-full bg-brand-primary/10 px-3 py-1 text-xs font-semibold text-brand-primary" data-i18n="features_pro_badge">
                         For power users &amp; teams
                     </span>
@@ -64,5 +65,6 @@
                 </p>
             </div>
         </div>
+        </div>
     </div>
 </section>
diff --git a/partials/landing/main/how.php b/partials/landing/main/how.php
index db04910..75e7da4 100644
--- a/partials/landing/main/how.php
+++ b/partials/landing/main/how.php
@@ -1,10 +1,11 @@
-<section id="how" class="border-t border-brand-border/70 bg-brand-primarySoft/30">
-    <div class="mx-auto max-w-6xl px-4 sm:px-6 lg:px-8 py-16 sm:py-20 grid gap-10 lg:grid-cols-[1.2fr,1fr]">
-        <div class="space-y-6">
+<section id="how" class="border-t border-brand-border/60 bg-brand-primarySoft/30 py-16 sm:py-20">
+    <div class="px-4 sm:px-6 lg:px-8">
+        <div class="section-shell grid gap-10 lg:grid-cols-[1.2fr,1fr]">
+            <div class="space-y-6">
             <p class="text-xs font-heading font-semibold tracking-[0.3em] uppercase text-brand-primary" data-i18n="how_kicker">
                 How USBCheck works
             </p>
-            <h2 class="font-heading text-2xl sm:text-3xl font-bold text-white" data-i18n="how_title">
+            <h2 class="font-heading text-2xl sm:text-3xl font-bold text-brand-text" data-i18n="how_title">
                 Schnelltest im Browser, Pro-Modus mit Tiefenanalyse.
             </h2>
             <p class="text-brand-muted text-sm sm:text-base" data-i18n="how_intro">
@@ -42,31 +43,32 @@
             </ol>
         </div>
 
-        <!-- Small feature card -->
-        <div class="rounded-xl2 border border-brand-border bg-brand-surface/80 shadow-soft p-6 space-y-5">
-            <h3 class="font-heading text-lg font-semibold text-white" data-i18n="how_side_title">
-                Free vs Pro at a glance
-            </h3>
-            <ul class="space-y-3 text-sm text-brand-muted">
-                <li class="flex gap-2">
-                    <span class="mt-1 h-5 w-5 rounded-full bg-emerald-500/10 text-emerald-400 flex items-center justify-center text-[10px]">F</span>
-                    <p data-i18n="how_side_free">
-                        <strong>Free Quick Check:</strong> Geschwindigkeit &amp; Integritätstest im Browser – ideal für schnelle Einschätzungen.
-                    </p>
-                </li>
-                <li class="flex gap-2">
-                    <span class="mt-1 h-5 w-5 rounded-full bg-sky-500/10 text-sky-400 flex items-center justify-center text-[10px]">P</span>
-                    <p data-i18n="how_side_pro">
-                        <strong>Pro-Modus:</strong> Tiefenscan, Kapazitätsvalidierung, erweiterte Berichte und API-Integration für Unternehmen.
-                    </p>
-                </li>
-                <li class="flex gap-2">
-                    <span class="mt-1 h-5 w-5 rounded-full bg-violet-500/10 text-violet-400 flex items-center justify-center text-[10px]">A</span>
-                    <p data-i18n="how_side_account">
-                        <strong>Account &amp; Login:</strong> Nach dem Login kannst du Tests speichern, Berichte exportieren und mehrere Geräte verwalten.
-                    </p>
-                </li>
-            </ul>
+            <!-- Small feature card -->
+            <div class="card-frame card-frame--soft space-y-5">
+                <h3 class="font-heading text-lg font-semibold text-brand-text" data-i18n="how_side_title">
+                    Free vs Pro at a glance
+                </h3>
+                <ul class="space-y-3 text-sm text-brand-muted">
+                    <li class="flex gap-2">
+                        <span class="mt-1 h-5 w-5 rounded-full bg-emerald-500/10 text-emerald-400 flex items-center justify-center text-[10px]">F</span>
+                        <p data-i18n="how_side_free">
+                            <strong>Free Quick Check:</strong> Geschwindigkeit &amp; Integritätstest im Browser – ideal für schnelle Einschätzungen.
+                        </p>
+                    </li>
+                    <li class="flex gap-2">
+                        <span class="mt-1 h-5 w-5 rounded-full bg-sky-500/10 text-sky-400 flex items-center justify-center text-[10px]">P</span>
+                        <p data-i18n="how_side_pro">
+                            <strong>Pro-Modus:</strong> Tiefenscan, Kapazitätsvalidierung, erweiterte Berichte und API-Integration für Unternehmen.
+                        </p>
+                    </li>
+                    <li class="flex gap-2">
+                        <span class="mt-1 h-5 w-5 rounded-full bg-violet-500/10 text-violet-400 flex items-center justify-center text-[10px]">A</span>
+                        <p data-i18n="how_side_account">
+                            <strong>Account &amp; Login:</strong> Nach dem Login kannst du Tests speichern, Berichte exportieren und mehrere Geräte verwalten.
+                        </p>
+                    </li>
+                </ul>
+            </div>
         </div>
     </div>
 </section>
diff --git a/partials/landing/main/problem.php b/partials/landing/main/problem.php
index 7842906..0463cfe 100644
--- a/partials/landing/main/problem.php
+++ b/partials/landing/main/problem.php
@@ -1,10 +1,11 @@
-<section id="problem" class="border-t border-brand-border/70">
-    <div class="mx-auto max-w-6xl px-4 sm:px-6 lg:px-8 py-16 sm:py-20 space-y-8">
+<section id="problem" class="border-t border-brand-border/60 bg-brand-primarySoft/20 py-16 sm:py-20">
+    <div class="px-4 sm:px-6 lg:px-8">
+        <div class="section-shell space-y-8">
         <div class="max-w-3xl space-y-4">
             <p class="text-xs font-heading font-semibold tracking-[0.3em] uppercase text-brand-primary" data-i18n="problem_kicker">
                 Why fake USB sticks are dangerous
             </p>
-            <h2 class="font-heading text-2xl sm:text-3xl font-bold text-white" data-i18n="problem_title">
+            <h2 class="font-heading text-2xl sm:text-3xl font-bold text-brand-text" data-i18n="problem_title">
                 Gefälschte USB-Sticks kosten Geld – und im schlimmsten Fall deine Daten.
             </h2>
             <p class="text-sm sm:text-base text-brand-muted" data-i18n="problem_p1">
@@ -16,19 +17,19 @@
         </div>
 
         <div class="grid gap-6 md:grid-cols-3 text-sm text-brand-muted">
-            <div class="rounded-xl2 border border-brand-border bg-brand-surface/80 p-5 space-y-2">
+            <div class="card-frame space-y-2">
                 <h3 class="font-semibold text-brand-text" data-i18n="problem_card1_title">Verlust wichtiger Dateien</h3>
                 <p data-i18n="problem_card1_text">
                     Fotos, Projektdateien, Backups – alles kann betroffen sein, wenn der Stick weniger speichert als behauptet. Defekte Sektoren bleiben oft unbemerkt, bis es zu spät ist.
                 </p>
             </div>
-            <div class="rounded-xl2 border border-brand-border bg-brand-surface/80 p-5 space-y-2">
+            <div class="card-frame space-y-2">
                 <h3 class="font-semibold text-brand-text" data-i18n="problem_card2_title">Kosten durch defekte Chargen</h3>
                 <p data-i18n="problem_card2_text">
                     Unternehmen, Reseller und Agenturen verteilen USB-Sticks oft in großer Stückzahl. Fakes bedeuten Reklamationen, Imageschaden und erneute Produktionskosten.
                 </p>
             </div>
-            <div class="rounded-xl2 border border-brand-border bg-brand-surface/80 p-5 space-y-2">
+            <div class="card-frame space-y-2">
                 <h3 class="font-semibold text-brand-text" data-i18n="problem_card3_title">Unsichere Performance</h3>
                 <p data-i18n="problem_card3_text">
                     Langsame Controller, instabile Firmware und schwankende Schreibraten sind typisch für Fake-Sticks. Das erhöht das Risiko von Fehlern – besonders bei großen Dateien.
@@ -37,4 +38,3 @@
         </div>
     </div>
 </section>
-
diff --git a/partials/landing/main/security.php b/partials/landing/main/security.php
index df92796..ff4202a 100644
--- a/partials/landing/main/security.php
+++ b/partials/landing/main/security.php
@@ -1,10 +1,11 @@
-<section id="security" class="border-t border-brand-border/70">
-    <div class="mx-auto max-w-6xl px-4 sm:px-6 lg:px-8 py-16 sm:py-20 space-y-8">
+<section id="security" class="border-t border-brand-border/60 bg-brand-primarySoft/20 py-16 sm:py-20">
+    <div class="px-4 sm:px-6 lg:px-8">
+        <div class="section-shell space-y-8">
         <div class="max-w-3xl space-y-4">
             <p class="text-xs font-heading font-semibold tracking-[0.3em] uppercase text-brand-primary" data-i18n="security_kicker">
                 Security &amp; privacy
             </p>
-            <h2 class="font-heading text-2xl sm:text-3xl font-bold text-white" data-i18n="security_title">
+            <h2 class="font-heading text-2xl sm:text-3xl font-bold text-brand-text" data-i18n="security_title">
                 Privacy-first-Design: Deine Testdaten gehören dir.
             </h2>
             <p class="text-sm sm:text-base text-brand-muted" data-i18n="security_intro">
@@ -13,24 +14,25 @@
         </div>
 
         <div class="grid gap-6 md:grid-cols-3 text-sm text-brand-muted">
-            <div class="rounded-xl2 border border-brand-border bg-brand-surface/80 p-5 space-y-2">
+            <div class="card-frame space-y-2">
                 <h3 class="font-semibold text-brand-text" data-i18n="security_card1_title">Local-only Tests</h3>
                 <p data-i18n="security_card1_text">
                     Alle Schreib- und Lesetests erfolgen lokal auf deinem USB-Stick. Der Browser greift nur auf die Testdateien zu – nicht auf deine privaten Inhalte.
                 </p>
             </div>
-            <div class="rounded-xl2 border border-brand-border bg-brand-surface/80 p-5 space-y-2">
+            <div class="card-frame space-y-2">
                 <h3 class="font-semibold text-brand-text" data-i18n="security_card2_title">Transparente Reports</h3>
                 <p data-i18n="security_card2_text">
                     Wenn du dich einloggst, kannst du Testberichte in deinem Account speichern, exportieren oder wieder löschen. Du entscheidest, welche Daten im System bleiben.
                 </p>
             </div>
-            <div class="rounded-xl2 border border-brand-border bg-brand-surface/80 p-5 space-y-2">
+            <div class="card-frame space-y-2">
                 <h3 class="font-semibold text-brand-text" data-i18n="security_card3_title">Schonend für deine Hardware</h3>
                 <p data-i18n="security_card3_text">
                     Der Schnelltest arbeitet mit moderaten Datenmengen, um unnötigen Verschleiß zu vermeiden. Der Pro-Modus warnt deutlich, wenn ein Vollscan mit hoher Schreiblast ausgeführt wird.
                 </p>
             </div>
         </div>
+        </div>
     </div>
 </section>
diff --git a/public/assets/css/main.css b/public/assets/css/main.css
index 3a8d48c..e55955a 100644
--- a/public/assets/css/main.css
+++ b/public/assets/css/main.css
@@ -529,6 +529,46 @@ body {
   color: #7a86a8;
 }
 
+.section-shell {
+  position: relative;
+  max-width: 1120px;
+  margin: 0 auto;
+  padding: clamp(1.75rem, 3.5vw, 3.25rem);
+  border-radius: 36px;
+  background: linear-gradient(155deg, #ffffff 0%, #f4f7ff 100%);
+  border: 1px solid rgba(58, 111, 248, 0.14);
+  box-shadow: 0 30px 60px rgba(15, 33, 66, 0.08);
+  backdrop-filter: blur(6px);
+  overflow: hidden;
+}
+
+.section-shell::after {
+  content: "";
+  position: absolute;
+  inset: 12% 8% auto auto;
+  width: 160px;
+  height: 160px;
+  background: radial-gradient(circle, rgba(255, 215, 166, 0.18), transparent 65%);
+  pointer-events: none;
+}
+
+.card-frame {
+  border-radius: 26px;
+  padding: 1.5rem;
+  background: linear-gradient(140deg, #ffffff 0%, #f5f7ff 100%);
+  border: 1px solid rgba(58, 111, 248, 0.14);
+  box-shadow: 0 18px 40px rgba(15, 33, 66, 0.08);
+}
+
+.card-frame--accent {
+  border-color: rgba(58, 111, 248, 0.3);
+  box-shadow: 0 22px 45px rgba(58, 111, 248, 0.15);
+}
+
+.card-frame--soft {
+  background: linear-gradient(140deg, #fbfcff 0%, #f2f6ff 100%);
+}
+
 /* Steps / Features / Pricing */
 
 .steps-grid,