Update src/app/page.tsx

Merge version_48 into main

src/app/page.tsx

@@ -19,10 +19,10 @@ export default function LandingPage() {
         borderRadius="pill"
         contentWidth="small"
         sizing="medium"
-        background="aurora"
-        cardStyle="outline"
-        primaryButtonStyle="gradient"
-        secondaryButtonStyle="radial-glow"
+        background="noise"
+        cardStyle="glass-depth"
+        primaryButtonStyle="primary-glow"
+        secondaryButtonStyle="glass"
         headingFontWeight="semibold"
     >
       <ReactLenis root>
@@ -78,7 +78,7 @@ export default function LandingPage() {
       features={[
         {
           title: "Roof Replacement",          description: "Full-scale roof replacements using premium materials designed for Alabama weather.",          media: {
-            imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CU9LXLTd45U3bRy6xudZUdJbpk/uploaded-1777397555725-hvallagy.jpg",            imageAlt: "Replacement project"},
+            imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CU9LXLTd45U3bRy6xudZUdJbpk/uploaded-1777397555725-hvallagy.jpg?_wi=1",            imageAlt: "Replacement project"},
           items: [
             { icon: CheckCircle, text: "Architectural Shingles" },
             { icon: CheckCircle, text: "Metal Roofing Options" },
@@ -88,7 +88,7 @@ export default function LandingPage() {
         },
         {
           title: "Storm & Hail Damage",          description: "Expert assessments and seamless insurance claim assistance for storm-damaged roofs.",          media: {
-            imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CU9LXLTd45U3bRy6xudZUdJbpk/uploaded-1777394430092-e9m33ied.jpg",            imageAlt: "Storm damage repair"},
+            imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CU9LXLTd45U3bRy6xudZUdJbpk/uploaded-1777394430092-e9m33ied.jpg?_wi=1",            imageAlt: "Storm damage repair"},
           items: [
             { icon: Shield, text: "Free Inspection" },
             { icon: Shield, text: "Insurance Coordination" },
@@ -98,7 +98,7 @@ export default function LandingPage() {
         },
         {
           title: "Routine Inspection",          description: "Keep your roof in pristine condition with our comprehensive local maintenance and inspection services.",          media: {
-            imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CU9LXLTd45U3bRy6xudZUdJbpk/uploaded-1777394101196-i8tpdvoq.jpg",            imageAlt: "Routine inspection"},
+            imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CU9LXLTd45U3bRy6xudZUdJbpk/uploaded-1777394101196-i8tpdvoq.jpg?_wi=1",            imageAlt: "Routine inspection"},
           items: [
             { icon: Star, text: "Detailed Reporting" },
             { icon: Star, text: "Preventive Maintenance" },
@@ -109,7 +109,6 @@ export default function LandingPage() {
       ]}
       title="Comprehensive Roofing Services"
       description="From storm damage repair to custom roof replacement, we handle your Gadsden roofing needs with precision and care."
-      textBoxTitleClassName="text-white"
     />
   </div>
 

src/app/services/page.tsx

@@ -6,6 +6,8 @@ import FaqDouble from '@/components/sections/faq/FaqDouble';
 import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
 import FooterSimple from '@/components/sections/footer/FooterSimple';
 import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
+import FeatureCardTen from '@/components/sections/feature/FeatureCardTen';
+import { CheckCircle, Shield, Star } from "lucide-react";
 
 export default function LandingPage() {
   return (
@@ -41,6 +43,48 @@ export default function LandingPage() {
     />
   </div>
 
+  <div id="services-list" data-section="services-list">
+      <FeatureCardTen
+      animationType="slide-up"
+      textboxLayout="split"
+      useInvertedBackground={true}
+      features={[
+        {
+          title: "Roof Replacement",          description: "Full-scale roof replacements using premium materials designed for Alabama weather.",          media: {
+            imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CU9LXLTd45U3bRy6xudZUdJbpk/uploaded-1777397555725-hvallagy.jpg?_wi=2",            imageAlt: "Replacement project"},
+          items: [
+            { icon: CheckCircle, text: "Architectural Shingles" },
+            { icon: CheckCircle, text: "Metal Roofing Options" },
+            { icon: CheckCircle, text: "Lifetime Warranty" },
+          ],
+          reverse: false,
+        },
+        {
+          title: "Storm & Hail Damage",          description: "Expert assessments and seamless insurance claim assistance for storm-damaged roofs.",          media: {
+            imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CU9LXLTd45U3bRy6xudZUdJbpk/uploaded-1777394430092-e9m33ied.jpg?_wi=2",            imageAlt: "Storm damage repair"},
+          items: [
+            { icon: Shield, text: "Free Inspection" },
+            { icon: Shield, text: "Insurance Coordination" },
+            { icon: Shield, text: "Urgent Response" },
+          ],
+          reverse: true,
+        },
+        {
+          title: "Routine Inspection",          description: "Keep your roof in pristine condition with our comprehensive local maintenance and inspection services.",          media: {
+            imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CU9LXLTd45U3bRy6xudZUdJbpk/uploaded-1777394101196-i8tpdvoq.jpg?_wi=2",            imageAlt: "Routine inspection"},
+          items: [
+            { icon: Star, text: "Detailed Reporting" },
+            { icon: Star, text: "Preventive Maintenance" },
+            { icon: Star, text: "Safety Checks" },
+          ],
+          reverse: false,
+        },
+      ]}
+      title="Comprehensive Roofing Services"
+      description="From storm damage repair to custom roof replacement, we handle your Gadsden roofing needs with precision and care."
+    />
+  </div>
+
   <div id="faq-body" data-section="faq-body">
       <FaqSplitMedia
       textboxLayout="split"

src/app/styles/variables.css

@@ -10,15 +10,15 @@
   --accent: #ffffff;
   --background-accent: #ffffff; */
 
-  --background: #000000;
-  --card: #000000;
-  --foreground: #ffffff;
-  --primary-cta: #c5a059;
-  --primary-cta-text: #ffffff;
-  --secondary-cta: #bfbebe;
-  --secondary-cta-text: #000000;
-  --accent: #c5a059;
-  --background-accent: #000000;
+  --background: #ffffff;
+  --card: #f9f9f9;
+  --foreground: #000612e6;
+  --primary-cta: #15479c;
+  --primary-cta-text: #000000;
+  --secondary-cta: #f9f9f9;
+  --secondary-cta-text: #1c1c1c;
+  --accent: #e2e2e2;
+  --background-accent: #c4c4c4;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);