feat: Enhance responsiveness and layout for service and pricing templates

Website/templates/dienstleistungen.html

@@ -163,12 +163,118 @@
 .module-panel .lede { color: #455e5e; font-weight: 600; }
 .module-panel h3 { margin-top: 1rem; color: #22595b; }
 .module-panel ol { margin-left: 1.1rem; }
+.module-panel p,
+.module-panel li,
+.module-panel dd {
+    line-height: 1.75;
+}
 
 @media (max-width: 900px) {
     .module-shell { grid-template-columns: 1fr; }
     .module-nav { order: 2; }
     .module-content { order: 1; }
 }
+
+@media (max-width: 700px) {
+    .page-hero {
+        padding: 1.15rem 1rem;
+        border-radius: 16px;
+    }
+
+    .page-hero h1 {
+        font-size: clamp(1.55rem, 7vw, 2rem);
+    }
+
+    .page-hero p {
+        max-width: none;
+        font-size: 1.02rem;
+        line-height: 1.72;
+    }
+
+    .module-shell {
+        gap: 0.75rem;
+        margin-top: 0.85rem;
+    }
+
+    .module-nav {
+        padding: 0.55rem;
+        border-radius: 14px;
+        overflow-x: auto;
+        -webkit-overflow-scrolling: touch;
+        scrollbar-width: none;
+        background: linear-gradient(180deg, #ffffff 0%, #f8fbf8 100%);
+    }
+
+    .module-nav::-webkit-scrollbar {
+        display: none;
+    }
+
+    .module-nav ul {
+        display: flex;
+        gap: 0.5rem;
+        min-width: max-content;
+    }
+
+    .module-nav li {
+        margin: 0;
+        flex: 0 0 auto;
+    }
+
+    .module-nav a {
+        padding: 0.8rem 1rem;
+        font-size: 0.96rem;
+        line-height: 1.2;
+        white-space: nowrap;
+    }
+
+    .module-nav li.active a {
+        box-shadow: 0 8px 20px rgba(23, 63, 70, 0.08);
+        background: linear-gradient(90deg, #e4f4f2, #f7fcfb);
+    }
+
+    .module-content {
+        padding: 1rem;
+        border-radius: 14px;
+    }
+
+    .module-panel {
+        max-width: none;
+    }
+
+    .module-panel h2 {
+        font-size: 1.32rem;
+        line-height: 1.2;
+    }
+
+    .module-panel h3 {
+        font-size: 1.02rem;
+        margin-top: 1rem;
+    }
+
+    .module-panel p,
+    .module-panel li,
+    .module-panel dd {
+        font-size: 1rem;
+    }
+
+    .module-panel ol {
+        margin-left: 1rem;
+        padding-left: 0.2rem;
+    }
+
+    .module-panel dl {
+        margin: 0;
+    }
+
+    .module-panel dt {
+        font-weight: 700;
+        margin-top: 0.6rem;
+    }
+
+    .module-panel dd {
+        margin: 0.2rem 0 0;
+    }
+}
 </style>
 
 <script>

Website/templates/preise.html

@@ -48,6 +48,7 @@
         grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
         gap: 1.4rem;
         margin-bottom: 1.8rem;
+        align-items: stretch;
     }
 
     .package-card {
@@ -56,7 +57,9 @@
         border-radius: 22px;
         box-shadow: 0 18px 40px rgba(23, 44, 57, 0.05);
         padding: 1.8rem;
-        display: grid;
+        display: flex;
+        flex-direction: column;
+        height: 100%;
         gap: 1.2rem;
         transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
     }
@@ -150,6 +153,7 @@
         list-style: none;
         display: grid;
         gap: 0.75rem;
+        flex: 1 1 auto;
     }
 
     .package-card__features li {
@@ -169,7 +173,8 @@
     }
 
     .package-card__actions {
-        margin-top: 0.5rem;
+        margin-top: auto;
+        padding-top: 0.25rem;
     }
 
     .package-card__actions form,