Update src/pages/HomePage.tsx

Merge version_2_1781383416103 into main

src/index.css

@@ -5,15 +5,15 @@
 
 :root {
   /* @colorThemes/lightTheme/neutral */
-  --background: #ffffff;
-  --card: #f5f5f5;
-  --foreground: #171717;
-  --primary-cta: #171717;
+  --background: #f0fdf4;
+  --card: #dcfce7;
+  --foreground: #14532d;
+  --primary-cta: #16a34a;
   --primary-cta-text: #ffffff;
-  --secondary-cta: #f5f5f5;
-  --secondary-cta-text: #171717;
-  --accent: #171717;
-  --background-accent: #171717;
+  --secondary-cta: #bbf7d0;
+  --secondary-cta-text: #14532d;
+  --accent: #16a34a;
+  --background-accent: #16a34a;
 
   /* @layout/border-radius/rounded */
   --radius: 1rem;

src/pages/HomePage.tsx

@@ -49,19 +49,19 @@ export default function HomePage() {
             {
               title: "HydroFlow Product Launch",
               description: "Beverage brand shoot. Every frame engineered to sell.",
-              imageSrc: "https://storage.googleapis.com/webild/default/templates/creative-portfolio/screen-1.webp",
+              imageSrc: "https://storage.googleapis.com/webild/default/templates/creative-portfolio/screen-1.webp?_wi=1",
               tag: "Product Shot",
             },
             {
               title: "Webild Athlete Campaign",
               description: "Sports tech shoot. Wearables captured in raw motion.",
-              imageSrc: "https://storage.googleapis.com/webild/default/templates/creative-portfolio/screen-2.webp",
+              imageSrc: "https://storage.googleapis.com/webild/default/templates/creative-portfolio/screen-2.webp?_wi=1",
               tag: "Photography",
             },
             {
               title: "Maru Residence",
               description: "Architectural interior shoot. Minimal compositions.",
-              imageSrc: "https://storage.googleapis.com/webild/default/templates/creative-portfolio/screen-3.webp",
+              imageSrc: "https://storage.googleapis.com/webild/default/templates/creative-portfolio/screen-3.webp?_wi=1",
               tag: "Interior Design",
             },
           ]}
@@ -73,7 +73,7 @@ export default function HomePage() {
           rating={5}
           author="Thomas Weber — Co-founder of KYMA"
           avatars={[
-            { name: "Thomas Weber", imageSrc: "https://randomuser.me/api/portraits/men/75.jpg" },
+            { name: "Thomas Weber", imageSrc: "https://randomuser.me/api/portraits/men/75.jpg?_wi=1" },
           ]}
         />
 
@@ -98,10 +98,10 @@ export default function HomePage() {
             title="What I Bring to the Table"
             description="End-to-end creative services designed to make your brand impossible to ignore — from the first frame to the final pixel."
             features={[
-              { title: "Photography", description: "Art-directed shoots that capture your brand's personality. Every image is color-graded and built to stop the scroll.", imageSrc: "https://storage.googleapis.com/webild/default/templates/creative-portfolio/photography.webp" },
-              { title: "Product Design", description: "User-centered interfaces for apps and SaaS products. From wireframe to pixel-perfect UI — intuitive experiences that keep users coming back.", imageSrc: "https://storage.googleapis.com/webild/default/templates/creative-portfolio/product-design.webp" },
-              { title: "Website", description: "Conversion-focused websites that look sharp and perform. Clean layouts, strategic CTAs, and responsive design that turns traffic into revenue.", imageSrc: "https://storage.googleapis.com/webild/default/templates/creative-portfolio/website.webp" },
-              { title: "Videos", description: "Brand films and product videos engineered for engagement. Story-driven visuals that convert viewers into customers.", imageSrc: "https://storage.googleapis.com/webild/default/templates/creative-portfolio/videos.webp" },
+              { title: "Photography", description: "Art-directed shoots that capture your brand's personality. Every image is color-graded and built to stop the scroll.", imageSrc: "https://storage.googleapis.com/webild/default/templates/creative-portfolio/photography.webp?_wi=1" },
+              { title: "Product Design", description: "User-centered interfaces for apps and SaaS products. From wireframe to pixel-perfect UI — intuitive experiences that keep users coming back.", imageSrc: "https://storage.googleapis.com/webild/default/templates/creative-portfolio/product-design.webp?_wi=1" },
+              { title: "Website", description: "Conversion-focused websites that look sharp and perform. Clean layouts, strategic CTAs, and responsive design that turns traffic into revenue.", imageSrc: "https://storage.googleapis.com/webild/default/templates/creative-portfolio/website.webp?_wi=1" },
+              { title: "Videos", description: "Brand films and product videos engineered for engagement. Story-driven visuals that convert viewers into customers.", imageSrc: "https://storage.googleapis.com/webild/default/templates/creative-portfolio/videos.webp?_wi=1" },
             ]}
             ctaButton={{
               text: "Book a call with me",
@@ -174,7 +174,7 @@ export default function HomePage() {
             ]}
             textarea={{ name: "message", placeholder: "Tell me about your project...", rows: 5, required: true }}
             buttonText="Send Message"
-            imageSrc="https://storage.googleapis.com/webild/default/templates/creative-portfolio/contact.webp"
+            imageSrc="https://storage.googleapis.com/webild/default/templates/creative-portfolio/contact.webp?_wi=1"
             ctaLinks={[
               { icon: "Video", label: "Book a Call", href: "#" },
             ]}

src/pages/HomePage/sections/About.tsx

@@ -12,7 +12,7 @@ export default function AboutSection(): React.JSX.Element {
                 quote="I don't design to decorate — I design to solve. Sharp, intentional work that moves brands forward."
                 author="Joseph Alexander"
                 role="Independent Designer"
-                imageSrc="https://storage.googleapis.com/webild/default/templates/creative-portfolio/avatar.webp"
+                imageSrc="https://storage.googleapis.com/webild/default/templates/creative-portfolio/avatar.webp?_wi=1"
                 socialLinks={[
                   { icon: "Twitter", label: "Twitter", href: "#" },
                   { icon: "Linkedin", label: "LinkedIn", href: "#" },

src/pages/HomePage/sections/Contact.tsx

@@ -17,7 +17,7 @@ export default function ContactSection(): React.JSX.Element {
                 ]}
                 textarea={{ name: "message", placeholder: "Tell me about your project...", rows: 5, required: true }}
                 buttonText="Send Message"
-                imageSrc="https://storage.googleapis.com/webild/default/templates/creative-portfolio/contact.webp"
+                imageSrc="https://storage.googleapis.com/webild/default/templates/creative-portfolio/contact.webp?_wi=2"
                 ctaLinks={[
                   { icon: "Video", label: "Book a Call", href: "#" },
                 ]}

src/pages/HomePage/sections/Faq.tsx

@@ -50,7 +50,7 @@ export default function FaqSection(): React.JSX.Element {
                   },
                 ]}
                 cta={{
-                  imageSrc: "https://storage.googleapis.com/webild/default/templates/creative-portfolio/avatar.webp",
+                  imageSrc: "https://storage.googleapis.com/webild/default/templates/creative-portfolio/avatar.webp?_wi=2",
                   name: "More questions? Reach out anytime.",
                   role: "joseph@alexandercreative.com",
                   buttonText: "Book a call",

src/pages/HomePage/sections/Hero.tsx

@@ -28,19 +28,19 @@ export default function HeroSection(): React.JSX.Element {
                   {
                     title: "HydroFlow Product Launch",
                     description: "Beverage brand shoot. Every frame engineered to sell.",
-                    imageSrc: "https://storage.googleapis.com/webild/default/templates/creative-portfolio/screen-1.webp",
+                    imageSrc: "https://storage.googleapis.com/webild/default/templates/creative-portfolio/screen-1.webp?_wi=2",
                     tag: "Product Shot",
                   },
                   {
                     title: "Webild Athlete Campaign",
                     description: "Sports tech shoot. Wearables captured in raw motion.",
-                    imageSrc: "https://storage.googleapis.com/webild/default/templates/creative-portfolio/screen-2.webp",
+                    imageSrc: "https://storage.googleapis.com/webild/default/templates/creative-portfolio/screen-2.webp?_wi=2",
                     tag: "Photography",
                   },
                   {
                     title: "Maru Residence",
                     description: "Architectural interior shoot. Minimal compositions.",
-                    imageSrc: "https://storage.googleapis.com/webild/default/templates/creative-portfolio/screen-3.webp",
+                    imageSrc: "https://storage.googleapis.com/webild/default/templates/creative-portfolio/screen-3.webp?_wi=2",
                     tag: "Interior Design",
                   },
                 ]}

src/pages/HomePage/sections/Services.tsx

@@ -12,10 +12,10 @@ export default function ServicesSection(): React.JSX.Element {
                 title="What I Bring to the Table"
                 description="End-to-end creative services designed to make your brand impossible to ignore — from the first frame to the final pixel."
                 features={[
-                  { title: "Photography", description: "Art-directed shoots that capture your brand's personality. Every image is color-graded and built to stop the scroll.", imageSrc: "https://storage.googleapis.com/webild/default/templates/creative-portfolio/photography.webp" },
-                  { title: "Product Design", description: "User-centered interfaces for apps and SaaS products. From wireframe to pixel-perfect UI — intuitive experiences that keep users coming back.", imageSrc: "https://storage.googleapis.com/webild/default/templates/creative-portfolio/product-design.webp" },
-                  { title: "Website", description: "Conversion-focused websites that look sharp and perform. Clean layouts, strategic CTAs, and responsive design that turns traffic into revenue.", imageSrc: "https://storage.googleapis.com/webild/default/templates/creative-portfolio/website.webp" },
-                  { title: "Videos", description: "Brand films and product videos engineered for engagement. Story-driven visuals that convert viewers into customers.", imageSrc: "https://storage.googleapis.com/webild/default/templates/creative-portfolio/videos.webp" },
+                  { title: "Photography", description: "Art-directed shoots that capture your brand's personality. Every image is color-graded and built to stop the scroll.", imageSrc: "https://storage.googleapis.com/webild/default/templates/creative-portfolio/photography.webp?_wi=2" },
+                  { title: "Product Design", description: "User-centered interfaces for apps and SaaS products. From wireframe to pixel-perfect UI — intuitive experiences that keep users coming back.", imageSrc: "https://storage.googleapis.com/webild/default/templates/creative-portfolio/product-design.webp?_wi=2" },
+                  { title: "Website", description: "Conversion-focused websites that look sharp and perform. Clean layouts, strategic CTAs, and responsive design that turns traffic into revenue.", imageSrc: "https://storage.googleapis.com/webild/default/templates/creative-portfolio/website.webp?_wi=2" },
+                  { title: "Videos", description: "Brand films and product videos engineered for engagement. Story-driven visuals that convert viewers into customers.", imageSrc: "https://storage.googleapis.com/webild/default/templates/creative-portfolio/videos.webp?_wi=2" },
                 ]}
                 ctaButton={{
                   text: "Book a call with me",

src/pages/HomePage/sections/Testimonial.tsx

@@ -12,7 +12,7 @@ export default function TestimonialSection(): React.JSX.Element {
                 rating={5}
                 author="Thomas Weber — Co-founder of KYMA"
                 avatars={[
-                  { name: "Thomas Weber", imageSrc: "https://randomuser.me/api/portraits/men/75.jpg" },
+                  { name: "Thomas Weber", imageSrc: "https://randomuser.me/api/portraits/men/75.jpg?_wi=2" },
                 ]}
               />
     </div>