First Version

2026-04-17 00:26:03 +01:00
parent aecd1a5574
commit c826ed6502
37 changed files with 4862 additions and 19 deletions
--- a/css/responsive.css
+++ b/css/responsive.css
@@ -0,0 +1,146 @@
+/*
+ * Responsive Styles - Mobile/tablet breakpoints
+ */
+
+@media (max-width: 768px) {
+    .nav-links {
+        display: none;
+    }
+
+    .hamburger {
+        display: flex;
+    }
+
+    .hero h1 {
+        font-size: 3.5rem;
+        letter-spacing: -2px;
+    }
+
+    .hero-subtitle {
+        font-size: 1rem;
+    }
+
+    .stats-grid {
+        grid-template-columns: repeat(2, 1fr);
+        gap: 1.5rem;
+    }
+
+    .about h2,
+    .section-title {
+        font-size: 2rem;
+    }
+
+    .card-grid {
+        grid-template-columns: 1fr;
+    }
+
+    .footer-inner {
+        grid-template-columns: 1fr 1fr;
+        gap: 2rem;
+    }
+
+    .footer-brand {
+        grid-column: 1 / -1;
+    }
+
+    /* Legal pages */
+    .legal-wrap {
+        grid-template-columns: 1fr;
+    }
+
+    .legal-toc {
+        position: static;
+        background: var(--bg-card);
+        border: 1px solid var(--glass-border);
+        border-radius: 12px;
+        padding: 1.25rem 1.5rem;
+    }
+
+    .legal-toc ul {
+        flex-direction: row;
+        flex-wrap: wrap;
+        gap: 0.35rem;
+    }
+
+    .legal-toc a {
+        border-left: none;
+        border-bottom: 2px solid transparent;
+        padding: 0.3rem 0.5rem;
+        font-size: 0.8rem;
+    }
+
+    .legal-toc a:hover,
+    .legal-toc a.active {
+        border-left-color: transparent;
+        border-bottom-color: var(--accent);
+    }
+
+    .data-table {
+        display: block;
+        overflow-x: auto;
+    }
+
+    .summary-grid,
+    .comparison-grid,
+    .action-grid,
+    .answer-strip {
+        grid-template-columns: 1fr;
+    }
+
+    .legal-toc {
+        padding: 0;
+        background: transparent;
+        border: none;
+    }
+
+    .legal-toc-toggle {
+        display: flex;
+    }
+
+    .legal-toc-panel {
+        display: none;
+        margin-top: 0.75rem;
+        background: var(--bg-card);
+        border: 1px solid var(--glass-border);
+        border-radius: 12px;
+        padding: 1rem;
+    }
+
+    .legal-toc.open .legal-toc-panel {
+        display: block;
+    }
+
+    .legal-toc ul {
+        flex-direction: column;
+        gap: 0.2rem;
+    }
+
+    .legal-toc a {
+        border-bottom: none;
+        padding: 0.5rem 0.6rem;
+        font-size: 0.88rem;
+    }
+
+    .legal-hero h1 {
+        font-size: 2rem;
+        letter-spacing: -1px;
+    }
+}
+
+@media (max-width: 480px) {
+    .hero h1 {
+        font-size: 2.75rem;
+        letter-spacing: -1.5px;
+    }
+
+    .hero-cta {
+        flex-direction: column;
+        align-items: center;
+    }
+
+    .btn,
+    .btn-outline {
+        width: 100%;
+        justify-content: center;
+    }
+}