Update src/app/styles/variables.css

Merge version_1 into main

src/app/adopt/page.tsx

@@ -2,12 +2,12 @@
 
 import React from "react";
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
-import { PawPrint, HelpCircle, Star } from "lucide-react";
+import { PawPrint, HelpCircle, Star, MapPin } from "lucide-react";
 
 import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
 import ProductCardFour from '@/components/sections/product/ProductCardFour';
-import FaqBase from '@/components/sections/faq/FaqBase';
 import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
+import ContactFaq from '@/components/sections/contact/ContactFaq';
 import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
 
 export default function AdoptPage() {
@@ -38,7 +38,7 @@ export default function AdoptPage() {
       headingFontWeight="bold"
     >
       <div id="nav" data-section="nav">
-        <NavbarLayoutFloatingOverlay brandName="Paws & Hearts" navItems={navItems} button={{ text: "Adopt Now", href: "/adopt" }} />
+        <NavbarLayoutFloatingOverlay brandName="Golden Paws" navItems={navItems} button={{ text: "Adopt Now", href: "/adopt" }} />
       </div>
 
       <div id="pets-list" data-section="pets-list">
@@ -61,19 +61,18 @@ export default function AdoptPage() {
       </div>
 
       <div id="adoption-faq" data-section="adoption-faq">
-        <FaqBase 
+        <ContactFaq 
-          title="Adoption Questions" 
+          ctaTitle="Ready to Adopt?"
-          description="Everything you need to know about bringing a new family member home." 
+          ctaDescription="Our adoption counselors are here to help you find the perfect match for your lifestyle."
-          tag="Process" 
+          ctaButton={{ text: "Contact Counselors", href: "/contact" }}
-          tagIcon={HelpCircle}
+          ctaIcon={MapPin}
           faqs={[
             { id: 'f1', title: 'What is the adoption process?', content: 'Our process involves an application, a brief interview, and a meet-and-greet.' },
             { id: 'f2', title: 'What do the adoption fees cover?', content: 'Fees cover vaccinations, spay/neuter, microchipping, and a wellness exam.' },
             { id: 'f3', title: 'Can I foster an animal instead?', content: 'Yes! Fostering is a vital part of our mission.' }
-          ]} 
+          ]}
-          textboxLayout="default" 
+          useInvertedBackground={true}
-          useInvertedBackground={true} 
+          animationType="slide-up"
-          faqsAnimation="blur-reveal" 
         />
       </div>
 
@@ -93,8 +92,8 @@ export default function AdoptPage() {
       </div>
 
       <div id="footer" data-section="footer">
-        <FooterBaseCard logoText="Paws & Hearts" columns={footerColumns} copyrightText="© 2025 | Paws & Hearts Animal Shelter" />
+        <FooterBaseCard logoText="Golden Paws" columns={footerColumns} copyrightText="© 2025 | Golden Paws Animal Shelter" />
       </div>
     </ThemeProvider>
   );
-}
+}

src/app/contact/page.tsx

@@ -6,7 +6,6 @@ import { MapPin, HelpCircle, Heart } from "lucide-react";
 
 import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
 import ContactFaq from '@/components/sections/contact/ContactFaq';
-import FaqBase from '@/components/sections/faq/FaqBase';
 import MediaAbout from '@/components/sections/about/MediaAbout';
 import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
 
@@ -38,7 +37,7 @@ export default function ContactPage() {
       headingFontWeight="bold"
     >
       <div id="nav" data-section="nav">
-        <NavbarLayoutFloatingOverlay brandName="Paws & Hearts" navItems={navItems} button={{ text: "Adopt Now", href: "/adopt" }} />
+        <NavbarLayoutFloatingOverlay brandName="Golden Paws" navItems={navItems} button={{ text: "Adopt Now", href: "/adopt" }} />
       </div>
 
       <div id="visit-us" data-section="visit-us">
@@ -58,25 +57,24 @@ export default function ContactPage() {
       </div>
 
       <div id="general-faq" data-section="general-faq">
-        <FaqBase 
+        <ContactFaq 
-          title="Common Questions" 
+          ctaTitle="Help Center"
-          description="Find answers to common logistical and support questions." 
+          ctaDescription="Find answers to common logistical and support questions about our rescue operations."
-          tag="Help Center" 
+          ctaButton={{ text: "Message Support", href: "mailto:support@goldenpaws.org" }}
-          tagIcon={HelpCircle}
+          ctaIcon={HelpCircle}
           faqs={[
             { id: 'f4', title: 'What if the adoption doesn\'t work out?', content: 'We have a lifetime return policy. They are always welcome back.' },
             { id: 'f5', title: 'Do you take in stray animals?', content: 'Please contact local animal control for strays. We focus on shelter transfers and owner surrenders.' }
           ]} 
-          textboxLayout="default" 
           useInvertedBackground={true} 
-          faqsAnimation="slide-up" 
+          animationType="slide-up" 
         />
       </div>
 
       <div id="support-mission" data-section="support-mission">
         <MediaAbout 
           title="Support Our Cause" 
-          description="Your donations and time directly impact the lives of hundreds of animals every year. Join us in making a difference." 
+          description="Your donations and time directly impact the lives of hundreds of animals every year. Join us in making a difference."
           tag="Ways to Give" 
           tagIcon={Heart}
           imageSrc="https://img.b2bpic.net/free-photo/hipster-woman-smile-enjoy-playing-with-her-puppy-summer-field-vintage-tone-filter_1150-1188.jpg" 
@@ -87,8 +85,8 @@ export default function ContactPage() {
       </div>
 
       <div id="footer" data-section="footer">
-        <FooterBaseCard logoText="Paws & Hearts" columns={footerColumns} copyrightText="© 2025 | Paws & Hearts Animal Shelter" />
+        <FooterBaseCard logoText="Golden Paws" columns={footerColumns} copyrightText="© 2025 | Golden Paws Animal Shelter" />
       </div>
     </ThemeProvider>
   );
-}
+}

src/app/layout.tsx

@@ -10,8 +10,9 @@ const roboto = Roboto({
 });
 
 export const metadata: Metadata = {
-  title: "Paws & Hearts | Rescue & Adoption Shelter",  description: "Find your new best friend at Paws & Hearts. We rescue, rehabilitate, and rehome pets in need. Browse available dogs and cats for adoption today.",  openGraph: {
+  title: "Golden Paws Shelter | Rescue & Adoption",  description: "Find your new best friend at Golden Paws Shelter. We rescue, rehabilitate, and rehome pets in need. Browse available dogs and cats for adoption today.",  openGraph: {
-    title: "Paws & Hearts Animal Shelter",    description: "Giving animals a second chance at a forever home.",    siteName: "Paws & Hearts",    type: "website"},
+    title: "Golden Paws Animal Shelter",    description: "Giving animals a second chance at a forever home.",    siteName: "Golden Paws",    type: "website"
+  },
 };
 
 export default function RootLayout({
@@ -1247,4 +1248,4 @@ export default function RootLayout({
       </ServiceWrapper>
     </html>
   );
-}
+}

src/app/mission/page.tsx

@@ -38,13 +38,13 @@ export default function MissionPage() {
       headingFontWeight="bold"
     >
       <div id="nav" data-section="nav">
-        <NavbarLayoutFloatingOverlay brandName="Paws & Hearts" navItems={navItems} button={{ text: "Adopt Now", href: "/adopt" }} />
+        <NavbarLayoutFloatingOverlay brandName="Golden Paws" navItems={navItems} button={{ text: "Adopt Now", href: "/adopt" }} />
       </div>
 
       <div id="mission-hero" data-section="mission-hero">
         <MediaAbout 
           title="Our Mission to Save Every Life" 
-          description="At Paws & Hearts, we believe every animal deserves a second chance. Since 2010, we have provided medical care, love, and shelter to thousands of abandoned pets, ensuring they find the perfect family." 
+          description="At Golden Paws, we believe every animal deserves a second chance. Since 2010, we have provided medical care, love, and shelter to thousands of abandoned pets, ensuring they find the perfect family." 
           tag="Who We Are" 
           tagIcon={Heart}
           imageSrc="https://img.b2bpic.net/free-photo/hipster-woman-smile-enjoy-playing-with-her-puppy-summer-field-vintage-tone-filter_1150-1188.jpg" 
@@ -84,8 +84,8 @@ export default function MissionPage() {
       </div>
 
       <div id="footer" data-section="footer">
-        <FooterBaseCard logoText="Paws & Hearts" columns={footerColumns} copyrightText="© 2025 | Paws & Hearts Animal Shelter" />
+        <FooterBaseCard logoText="Golden Paws" columns={footerColumns} copyrightText="© 2025 | Golden Paws Animal Shelter" />
       </div>
     </ThemeProvider>
   );
-}
+}

src/app/page.tsx

@@ -42,7 +42,7 @@ export default function HomePage() {
     >
       <div id="nav" data-section="nav">
         <NavbarLayoutFloatingOverlay 
-          brandName="Paws & Hearts"
+          brandName="Golden Paws"
           navItems={navItems}
           button={{ text: "Adopt Now", href: "/adopt" }}
         />
@@ -50,7 +50,7 @@ export default function HomePage() {
 
       <div id="hero" data-section="hero">
         <HeroSignup 
-          title="Finding Forever Homes for Every Paw"
+          title="Finding Forever Homes for Every Golden Paw"
           description="Join our community of animal lovers. Sign up to get updates on new arrivals, adoption events, and ways you can help rescue animals in need."
           tag="Rescue. Rehabilitate. Rehome."
           tagIcon={Sparkles}
@@ -63,7 +63,7 @@ export default function HomePage() {
       <div id="mission" data-section="mission">
         <MediaAbout 
           title="Our Mission to Save Every Life" 
-          description="At Paws & Hearts, we believe every animal deserves a second chance. Since 2010, we have provided medical care, love, and shelter to thousands of abandoned pets." 
+          description="At Golden Paws, we believe every animal deserves a second chance. Since 2010, we have provided medical care, love, and shelter to thousands of abandoned pets."
           tag="Who We Are" 
           tagIcon={Heart}
           imageSrc="https://img.b2bpic.net/free-photo/hipster-woman-smile-enjoy-playing-with-her-puppy-summer-field-vintage-tone-filter_1150-1188.jpg" 
@@ -139,11 +139,11 @@ export default function HomePage() {
 
       <div id="footer" data-section="footer">
         <FooterBaseCard 
-          logoText="Paws & Hearts"
+          logoText="Golden Paws"
           columns={footerColumns}
-          copyrightText="© 2025 | Paws & Hearts Animal Shelter"
+          copyrightText="© 2025 | Golden Paws Animal Shelter"
         />
       </div>
     </ThemeProvider>
   );
-}
+}

src/app/styles/variables.css

@@ -2,21 +2,21 @@
   /* Base units */
   /* --vw is set by ThemeProvider */
 
-  /* --background: #ffffff;;
+  /* --background: #1a1a05;;
-  --card: #f9f9f9;;
+  --card: #26260a;;
-  --foreground: #000f06e6;;
+  --foreground: #fefce8;;
-  --primary-cta: #0a7039;;
+  --primary-cta: #facc15;;
-  --secondary-cta: #f9f9f9;;
+  --secondary-cta: #451a03;;
-  --accent: #e2e2e2;;
+  --accent: #eab308;;
-  --background-accent: #c4c4c4;; */
+  --background-accent: #713f12;; */
 
-  --background: #ffffff;;
+  --background: #1a1a05;;
-  --card: #f9f9f9;;
+  --card: #26260a;;
-  --foreground: #000f06e6;;
+  --foreground: #fefce8;;
-  --primary-cta: #0a7039;;
+  --primary-cta: #facc15;;
-  --secondary-cta: #f9f9f9;;
+  --secondary-cta: #451a03;;
-  --accent: #e2e2e2;;
+  --accent: #eab308;;
-  --background-accent: #c4c4c4;;
+  --background-accent: #713f12;;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);