Feat(UI): Improved content and styling for home page.

static/css/pages/core/home.css

@@ -14,17 +14,13 @@ ul li {
     font-size: 16px;
 }
 
-section.problem,
 section.benefits,
-section.features,
-section.faq {
-    padding: 6rem 0;
+section.solution {
+    padding: 4rem 0;
     background: var(--colour-text-background);
 }
-section.problem .card.problem,
 section.benefits .card.benefits,
-section.features .card.features,
-section.faq .card.faq {
+section.solution .card.solution {
     padding: 2rem;
     background: var(--colour-page-background);
     border-radius: 8px;
@@ -32,13 +28,13 @@ section.faq .card.faq {
     display: block;
 }
 
-section.solution,
-section.social-proof {
-    padding: 6rem 0;
+section.problem,
+section.early-access {
+    padding: 4rem 0;
     background: var(--colour-page-background-1);
 }
-section.solution .card.solution,
-section.social-proof .card.social-proof {
+section.problem .card.problem,
+section.early-access .card.early-access {
     background: var(--colour-text-background);
     padding: 2rem;
     border-radius: 8px;
@@ -47,6 +43,13 @@ section.social-proof .card.social-proof {
     box-shadow: 0 4px 6px rgba(0,0,0,0.1);
 }
 
+
+section.benefits ul li,
+section.solution ul li,
+section.early-access ul li {
+    list-style: none;
+}
+
 /* Hero Section */
 .hero {
     padding: 8rem 0 4rem;
@@ -80,14 +83,19 @@ section.problem .problem.card:hover {
     transform: translateY(-5px);
 }
 */
+section.problem .section-subtitle {
+    /* font-size: 18px; */
+    font-weight: bold;
+}
 
 /* Solution Section */
 
-/* Benefits Section */
+/* Benefits Section * /
 section.benefits .section-subtitle {
     font-size: 18px;
     font-weight: bold;
 }
+*/
 
 /* Social Proof Section * /
 section.social-proof {

static/css/sections/core.css

@@ -28,7 +28,7 @@ header {
     gap: 2rem;
     display: flex;
     flex-wrap: wrap;
-    max-width: 70vw;
+    max-width: 58vw;
 }
 
 .nav-links a {
@@ -44,9 +44,9 @@ header {
 }
 
 .container {
-    max-width: 1200px;
+    max-width: min(2000px, 90vw);
     margin: 0 auto;
-    padding: 0 1.5rem;
+    padding: 0 5vw;
 }
 
 /* Header */
@@ -67,9 +67,9 @@ header {
 }
 
 .logo {
-    font-size: 1.5rem;
+    font-size: 2rem;
     font-weight: bold;
-    color: var(--primary);
+    color: var(--colour-secondary);
 }
 
 .nav-links {
@@ -105,6 +105,7 @@ header {
     color: #fff;
     margin-bottom: 1rem;
     font-size: 1.2rem;
+    text-align: center;
 }
 
 .footer-section ul {
@@ -138,6 +139,16 @@ header {
     color: aquamarine;
 }
 
+.footer-section.contact {
+    width: 100%;
+}
+.footer-section .container {
+    padding: 0;
+}
+.footer-section .container.row .container.column {
+    padding: 1vh 2vw;
+}
+
 @media (max-width: 768px) {
     .footer-content {
         grid-template-columns: 1fr;
@@ -145,7 +156,7 @@ header {
     }
 }
 
-@media (max-width: 515px) {
+@media (max-width: 450px) {
     .nav-links {
         display: none;
     }