Update src/app/styles/variables.css

Merge version_1 into main

src/app/about/page.tsx

@@ -0,0 +1,245 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
+import HeroLogo from '@/components/sections/hero/HeroLogo';
+import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
+import FeatureCardTen from '@/components/sections/feature/FeatureCardTen';
+import TeamCardTwo from '@/components/sections/team/TeamCardTwo';
+import ContactCenter from '@/components/sections/contact/ContactCenter';
+import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
+import { Heart, Users } from "lucide-react";
+import { Linkedin, Twitter, Globe } from "lucide-react";
+
+export default function AboutPage() {
+  return (
+    <ThemeProvider
+      defaultButtonVariant="icon-arrow"
+      defaultTextAnimation="entrance-slide"
+      borderRadius="rounded"
+      contentWidth="smallMedium"
+      sizing="largeSizeMediumTitles"
+      background="aurora"
+      cardStyle="soft-shadow"
+      primaryButtonStyle="double-inset"
+      secondaryButtonStyle="radial-glow"
+      headingFontWeight="extrabold"
+    >
+      <div id="nav" data-section="nav">
+        <NavbarStyleFullscreen
+          navItems={[
+            { name: "Home", id: "hero" },
+            { name: "About", id: "about" },
+            { name: "Adopt", id: "product" },
+            { name: "Testimonials", id: "testimonial" },
+            { name: "Contact", id: "contact" }
+          ]}
+          brandName="PawShelter"
+          bottomLeftText="Saving Lives, One Paw at a Time"
+          bottomRightText="info@pawshelter.org"
+        />
+      </div>
+
+      <div id="hero" data-section="hero">
+        <HeroLogo
+          logoText="About PawShelter"
+          description="Dedicated to rescuing, caring for, and finding forever homes for abandoned and neglected pets since 2010."
+          buttons={[
+            { text: "Our Mission", href: "#about" },
+            { text: "Join Us", href: "#contact" }
+          ]}
+          imageSrc="http://img.b2bpic.net/free-photo/group-volunteers-playing-with-cute-dogs_1157-21449.jpg"
+          imageAlt="Our dedicated team caring for rescued pets"
+          showDimOverlay={false}
+        />
+      </div>
+
+      <div id="about" data-section="about">
+        <TextSplitAbout
+          title="Our Story"
+          description={[
+            "Founded in 2010, PawShelter began as a small initiative by a group of animal lovers who couldn't stand to see pets suffering on the streets. What started with just a handful of rescued animals has grown into a comprehensive rescue and rehabilitation center serving our entire region.",            "Today, we're proud to have helped over 10,000 animals find their forever homes. Our state-of-the-art facility provides veterinary care, behavioral training, and rehabilitation services. Every member of our team is passionate about animal welfare and committed to making a difference in the lives of vulnerable pets."
+          ]}
+          buttons={[
+            { text: "Become a Volunteer", href: "/" }
+          ]}
+          showBorder={true}
+          useInvertedBackground={false}
+        />
+      </div>
+
+      <div id="values" data-section="values">
+        <FeatureCardTen
+          title="Our Core Values"
+          description="The principles that guide everything we do at PawShelter"
+          tag="What Drives Us"
+          tagIcon={Heart}
+          features={[
+            {
+              id: "1",              title: "Compassion",              description: "Every animal deserves kindness, respect, and dignified care. We treat each pet as a valued individual with unique needs and personality.",              media: { imageSrc: "http://img.b2bpic.net/free-photo/woman-volunteering-shelter_1157-21450.jpg" },
+              items: [
+                { icon: Heart, text: "Empathetic animal care" },
+                { icon: Heart, text: "Individual attention" },
+                { icon: Heart, text: "Pain-free treatment" }
+              ],
+              reverse: false
+            },
+            {
+              id: "2",              title: "Excellence",              description: "We maintain the highest standards in veterinary care, training, and facility management. Quality is never compromised.",              media: { imageSrc: "http://img.b2bpic.net/free-photo/veterinary-professionals_1157-21451.jpg" },
+              items: [
+                { icon: Heart, text: "Professional expertise" },
+                { icon: Heart, text: "Advanced facilities" },
+                { icon: Heart, text: "Continuous improvement" }
+              ],
+              reverse: true
+            },
+            {
+              id: "3",              title: "Integrity",              description: "Transparency, honesty, and accountability guide our operations. We're trusted by our community and donors to do what's right.",              media: { imageSrc: "http://img.b2bpic.net/free-photo/team-meeting-shelter_1157-21452.jpg" },
+              items: [
+                { icon: Heart, text: "Transparent operations" },
+                { icon: Heart, text: "Ethical practices" },
+                { icon: Heart, text: "Community trust" }
+              ],
+              reverse: false
+            }
+          ]}
+          textboxLayout="default"
+          animationType="slide-up"
+          useInvertedBackground={false}
+        />
+      </div>
+
+      <div id="team" data-section="team">
+        <TeamCardTwo
+          title="Meet Our Leadership Team"
+          description="The dedicated professionals leading PawShelter's mission to save and support animals"
+          tag="Our Team"
+          tagIcon={Users}
+          members={[
+            {
+              id: "1",              name: "Dr. Sarah Mitchell",              role: "Executive Director & Founder",              description: "Former veterinary surgeon with 20+ years of experience in animal rescue and rehabilitation. Founded PawShelter with a vision to create a comprehensive rescue center.",              imageSrc: "http://img.b2bpic.net/free-photo/professional-woman-portrait_1157-21453.jpg",              imageAlt: "Dr. Sarah Mitchell",              socialLinks: [
+                { icon: Linkedin, url: "https://linkedin.com/in/sarahmitchell" },
+                { icon: Twitter, url: "https://twitter.com/sarahmitchell" },
+                { icon: Globe, url: "https://example.com" }
+              ]
+            },
+            {
+              id: "2",              name: "Michael Chen",              role: "Director of Animal Care",              description: "Certified animal behaviorist specializing in trauma recovery and rehabilitation. Michael has trained over 100 rescue animals and coordinates our behavioral programs.",              imageSrc: "http://img.b2bpic.net/free-photo/professional-man-portrait_1157-21454.jpg",              imageAlt: "Michael Chen",              socialLinks: [
+                { icon: Linkedin, url: "https://linkedin.com/in/michaelchen" },
+                { icon: Twitter, url: "https://twitter.com/michaelchen" }
+              ]
+            },
+            {
+              id: "3",              name: "Jessica Rodriguez",              role: "Director of Community Outreach",              description: "Passionate advocate for animal adoption and education. Jessica manages our adoption programs and community partnerships to increase pet placements.",              imageSrc: "http://img.b2bpic.net/free-photo/professional-woman-smiling_1157-21455.jpg",              imageAlt: "Jessica Rodriguez",              socialLinks: [
+                { icon: Linkedin, url: "https://linkedin.com/in/jessicarodriguez" },
+                { icon: Globe, url: "https://example.com" }
+              ]
+            },
+            {
+              id: "4",              name: "David Thompson",              role: "Chief Operations Officer",              description: "Operations expert with 15 years in non-profit management. David ensures our facility runs smoothly and efficiently to maximize our rescue capacity.",              imageSrc: "http://img.b2bpic.net/free-photo/professional-man-smiling_1157-21456.jpg",              imageAlt: "David Thompson",              socialLinks: [
+                { icon: Linkedin, url: "https://linkedin.com/in/davidthompson" },
+                { icon: Twitter, url: "https://twitter.com/davidthompson" }
+              ]
+            }
+          ]}
+          gridVariant="four-items-2x2-equal-grid"
+          textboxLayout="default"
+          animationType="slide-up"
+          useInvertedBackground={false}
+        />
+      </div>
+
+      <div id="impact" data-section="impact">
+        <FeatureCardTen
+          title="Our Impact"
+          description="By the numbers: How PawShelter makes a difference every day"
+          tag="Success Metrics"
+          tagIcon={Heart}
+          features={[
+            {
+              id: "1",              title: "Over 10,000 Animals Rescued",              description: "Since our founding in 2010, we've rescued and rehomed more than 10,000 animals, giving them second chances at happiness.",              media: { imageSrc: "http://img.b2bpic.net/free-photo/happy-rescued-pets_1157-21457.jpg" },
+              items: [
+                { icon: Heart, text: "Dogs, cats, and small animals" },
+                { icon: Heart, text: "All ages and backgrounds" },
+                { icon: Heart, text: "100% placement success rate" }
+              ],
+              reverse: false
+            },
+            {
+              id: "2",              title: "98% Adoption Success Rate",              description: "Our careful matching process and post-adoption support ensure lasting, happy relationships between pets and their families.",              media: { imageSrc: "http://img.b2bpic.net/free-photo/happy-families-with-pets_1157-21458.jpg" },
+              items: [
+                { icon: Heart, text: "Lifetime support" },
+                { icon: Heart, text: "Return policy if needed" },
+                { icon: Heart, text: "Follow-up care programs" }
+              ],
+              reverse: true
+            },
+            {
+              id: "3",              title: "$2M+ Invested in Animal Care Annually",              description: "Our comprehensive programs including veterinary care, training, and rehabilitation ensure every animal receives the best possible treatment.",              media: { imageSrc: "http://img.b2bpic.net/free-photo/modern-shelter-facilities_1157-21459.jpg" },
+              items: [
+                { icon: Heart, text: "Advanced medical equipment" },
+                { icon: Heart, text: "Professional staff" },
+                { icon: Heart, text: "State-of-the-art facilities" }
+              ],
+              reverse: false
+            }
+          ]}
+          textboxLayout="default"
+          animationType="slide-up"
+          useInvertedBackground={false}
+        />
+      </div>
+
+      <div id="contact" data-section="contact">
+        <ContactCenter
+          tag="Get in Touch"
+          title="Have Questions?"
+          description="Learn more about PawShelter, volunteer opportunities, or how you can support our mission."
+          tagIcon={Heart}
+          background={{ variant: "radial-gradient" }}
+          useInvertedBackground={false}
+          inputPlaceholder="Enter your email"
+          buttonText="Subscribe"
+          termsText="We respect your privacy. Unsubscribe at any time. By subscribing, you agree to receive updates about our work and mission."
+        />
+      </div>
+
+      <div id="footer" data-section="footer">
+        <FooterBaseCard
+          logoText="PawShelter"
+          columns={[
+            {
+              title: "Adopt",              items: [
+                { label: "Available Pets", href: "/" },
+                { label: "Adoption Process", href: "/" },
+                { label: "Success Stories", href: "/" }
+              ]
+            },
+            {
+              title: "Support",              items: [
+                { label: "Volunteer", href: "/" },
+                { label: "Donate", href: "/" },
+                { label: "Become a Sponsor", href: "/" }
+              ]
+            },
+            {
+              title: "About",              items: [
+                { label: "Our Mission", href: "/about" },
+                { label: "Meet the Team", href: "/about" },
+                { label: "Contact Us", href: "/" }
+              ]
+            },
+            {
+              title: "Resources",              items: [
+                { label: "Pet Care Tips", href: "/" },
+                { label: "Blog", href: "/" },
+                { label: "FAQ", href: "/" }
+              ]
+            }
+          ]}
+          copyrightText="© 2025 PawShelter. All rights reserved. Saving lives, one paw at a time."
+        />
+      </div>
+    </ThemeProvider>
+  );
+}

src/app/admin/page.tsx

@@ -0,0 +1,281 @@
+"use client";
+
+import { useState } from "react";
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
+import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
+import { BarChart3, Users, Heart, Settings, LogOut, Menu, X } from "lucide-react";
+
+export default function AdminPage() {
+  const [sidebarOpen, setSidebarOpen] = useState(true);
+  const [activeTab, setActiveTab] = useState("dashboard");
+
+  const stats = [
+    { label: "Total Pets", value: "234", icon: Heart, color: "#15479c" },
+    { label: "Active Adoptions", value: "42", icon: Users, color: "#0a7039" },
+    { label: "Pending Applications", value: "18", icon: BarChart3, color: "#e63946" },
+  ];
+
+  return (
+    <ThemeProvider
+      defaultButtonVariant="icon-arrow"
+      defaultTextAnimation="entrance-slide"
+      borderRadius="rounded"
+      contentWidth="smallMedium"
+      sizing="largeSizeMediumTitles"
+      background="aurora"
+      cardStyle="soft-shadow"
+      primaryButtonStyle="double-inset"
+      secondaryButtonStyle="radial-glow"
+      headingFontWeight="extrabold"
+    >
+      <div id="nav" data-section="nav">
+        <NavbarStyleFullscreen
+          navItems={[
+            { name: "Home", id: "/" },
+            { name: "Back to Site", id: "/" }
+          ]}
+          brandName="PawShelter Admin"
+          bottomLeftText="Admin Dashboard"
+          bottomRightText="admin@pawshelter.org"
+        />
+      </div>
+
+      <div className="min-h-screen bg-gradient-to-br from-blue-50 to-indigo-100">
+        <div className="flex">
+          {/* Sidebar */}
+          <div
+            className={`transition-all duration-300 ${sidebarOpen ? "w-64" : "w-20"} bg-white border-r border-gray-200 shadow-lg min-h-screen`}
+          >
+            <div className="p-6 flex items-center justify-between">
+              {sidebarOpen && <h2 className="text-xl font-bold text-gray-800">Admin</h2>}
+              <button
+                onClick={() => setSidebarOpen(!sidebarOpen)}
+                className="p-2 hover:bg-gray-100 rounded-lg transition-colors"
+              >
+                {sidebarOpen ? <X size={20} /> : <Menu size={20} />}
+              </button>
+            </div>
+
+            <nav className="space-y-2 px-3">
+              {[
+                { id: "dashboard", label: "Dashboard", icon: BarChart3 },
+                { id: "pets", label: "Manage Pets", icon: Heart },
+                { id: "users", label: "Users", icon: Users },
+                { id: "settings", label: "Settings", icon: Settings },
+              ].map((item) => (
+                <button
+                  key={item.id}
+                  onClick={() => setActiveTab(item.id)}
+                  className={`w-full flex items-center space-x-3 px-4 py-3 rounded-lg transition-all ${
+                    activeTab === item.id
+                      ? "bg-indigo-600 text-white"
+                      : "text-gray-600 hover:bg-gray-50"
+                  }`}
+                >
+                  <item.icon size={20} />
+                  {sidebarOpen && <span>{item.label}</span>}
+                </button>
+              ))}
+            </nav>
+
+            <div className="absolute bottom-6 left-3 right-3">
+              <button className="w-full flex items-center space-x-3 px-4 py-3 rounded-lg text-red-600 hover:bg-red-50 transition-colors">
+                <LogOut size={20} />
+                {sidebarOpen && <span>Logout</span>}
+              </button>
+            </div>
+          </div>
+
+          {/* Main Content */}
+          <div className="flex-1 p-8">
+            {/* Header */}
+            <div className="mb-8">
+              <h1 className="text-4xl font-bold text-gray-900 mb-2">Admin Dashboard</h1>
+              <p className="text-gray-600">Welcome back! Here's what's happening with your shelter today.</p>
+            </div>
+
+            {/* Stats Grid */}
+            {activeTab === "dashboard" && (
+              <div>
+                <div className="grid grid-cols-1 md:grid-cols-3 gap-6 mb-8">
+                  {stats.map((stat, index) => {
+                    const Icon = stat.icon;
+                    return (
+                      <div
+                        key={index}
+                        className="bg-white rounded-lg shadow-md p-6 hover:shadow-lg transition-shadow"
+                      >
+                        <div className="flex items-center justify-between">
+                          <div>
+                            <p className="text-gray-600 text-sm mb-2">{stat.label}</p>
+                            <p className="text-3xl font-bold text-gray-900">{stat.value}</p>
+                          </div>
+                          <div
+                            className="p-4 rounded-lg"
+                            style={{ backgroundColor: stat.color + "20" }}
+                          >
+                            <Icon size={24} style={{ color: stat.color }} />
+                          </div>
+                        </div>
+                      </div>
+                    );
+                  })}
+                </div>
+
+                {/* Recent Activity */}
+                <div className="bg-white rounded-lg shadow-md p-6">
+                  <h2 className="text-2xl font-bold text-gray-900 mb-4">Recent Activity</h2>
+                  <div className="space-y-4">
+                    {[
+                      { action: "New adoption application", pet: "Luna", time: "2 hours ago" },
+                      { action: "Pet added to system", pet: "Max", time: "4 hours ago" },
+                      { action: "Volunteer registered", pet: "Sarah M.", time: "6 hours ago" },
+                      { action: "Adoption completed", pet: "Whiskers", time: "1 day ago" },
+                    ].map((item, idx) => (
+                      <div
+                        key={idx}
+                        className="flex items-center justify-between py-3 border-b border-gray-100 last:border-b-0"
+                      >
+                        <div>
+                          <p className="font-medium text-gray-900">{item.action}</p>
+                          <p className="text-sm text-gray-500">{item.pet}</p>
+                        </div>
+                        <span className="text-sm text-gray-500">{item.time}</span>
+                      </div>
+                    ))}
+                  </div>
+                </div>
+              </div>
+            )}
+
+            {/* Manage Pets Tab */}
+            {activeTab === "pets" && (
+              <div className="bg-white rounded-lg shadow-md p-6">
+                <div className="flex justify-between items-center mb-6">
+                  <h2 className="text-2xl font-bold text-gray-900">Manage Pets</h2>
+                  <button className="px-4 py-2 bg-indigo-600 text-white rounded-lg hover:bg-indigo-700 transition-colors">
+                    + Add New Pet
+                  </button>
+                </div>
+                <div className="overflow-x-auto">
+                  <table className="w-full">
+                    <thead className="bg-gray-50 border-b border-gray-200">
+                      <tr>
+                        <th className="px-6 py-3 text-left text-sm font-semibold text-gray-900">Pet Name</th>
+                        <th className="px-6 py-3 text-left text-sm font-semibold text-gray-900">Type</th>
+                        <th className="px-6 py-3 text-left text-sm font-semibold text-gray-900">Status</th>
+                        <th className="px-6 py-3 text-left text-sm font-semibold text-gray-900">Actions</th>
+                      </tr>
+                    </thead>
+                    <tbody>
+                      {[
+                        { name: "Luna", type: "Dog", status: "Available" },
+                        { name: "Whiskers", type: "Cat", status: "Adopted" },
+                        { name: "Max", type: "Dog", status: "Available" },
+                      ].map((pet, idx) => (
+                        <tr key={idx} className="border-b border-gray-200 hover:bg-gray-50">
+                          <td className="px-6 py-4 text-sm text-gray-900">{pet.name}</td>
+                          <td className="px-6 py-4 text-sm text-gray-600">{pet.type}</td>
+                          <td className="px-6 py-4">
+                            <span
+                              className={`px-3 py-1 rounded-full text-sm font-medium ${
+                                pet.status === "Available"
+                                  ? "bg-green-100 text-green-800"
+                                  : "bg-gray-100 text-gray-800"
+                              }`}
+                            >
+                              {pet.status}
+                            </span>
+                          </td>
+                          <td className="px-6 py-4">
+                            <button className="text-indigo-600 hover:text-indigo-900 text-sm font-medium">Edit</button>
+                          </td>
+                        </tr>
+                      ))}
+                    </tbody>
+                  </table>
+                </div>
+              </div>
+            )}
+
+            {/* Users Tab */}
+            {activeTab === "users" && (
+              <div className="bg-white rounded-lg shadow-md p-6">
+                <h2 className="text-2xl font-bold text-gray-900 mb-6">User Management</h2>
+                <div className="space-y-4">
+                  {[
+                    { name: "Sarah Martinez", role: "Adopter", status: "Active" },
+                    { name: "John Volunteer", role: "Volunteer", status: "Active" },
+                    { name: "Dr. Smith", role: "Veterinarian", status: "Active" },
+                  ].map((user, idx) => (
+                    <div key={idx} className="flex items-center justify-between p-4 border border-gray-200 rounded-lg">
+                      <div>
+                        <p className="font-medium text-gray-900">{user.name}</p>
+                        <p className="text-sm text-gray-600">{user.role}</p>
+                      </div>
+                      <span className="px-3 py-1 bg-green-100 text-green-800 rounded-full text-sm font-medium">
+                        {user.status}
+                      </span>
+                    </div>
+                  ))}
+                </div>
+              </div>
+            )}
+
+            {/* Settings Tab */}
+            {activeTab === "settings" && (
+              <div className="bg-white rounded-lg shadow-md p-6">
+                <h2 className="text-2xl font-bold text-gray-900 mb-6">Settings</h2>
+                <div className="space-y-6">
+                  <div>
+                    <label className="block text-sm font-medium text-gray-700 mb-2">Organization Name</label>
+                    <input
+                      type="text"
+                      defaultValue="PawShelter"
+                      className="w-full px-4 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-indigo-600"
+                    />
+                  </div>
+                  <div>
+                    <label className="block text-sm font-medium text-gray-700 mb-2">Email</label>
+                    <input
+                      type="email"
+                      defaultValue="admin@pawshelter.org"
+                      className="w-full px-4 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-indigo-600"
+                    />
+                  </div>
+                  <div>
+                    <label className="block text-sm font-medium text-gray-700 mb-2">Phone</label>
+                    <input
+                      type="tel"
+                      defaultValue="+1 (555) 123-4567"
+                      className="w-full px-4 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-indigo-600"
+                    />
+                  </div>
+                  <button className="px-6 py-2 bg-indigo-600 text-white rounded-lg hover:bg-indigo-700 transition-colors font-medium">
+                    Save Changes
+                  </button>
+                </div>
+              </div>
+            )}
+          </div>
+        </div>
+      </div>
+
+      <div id="footer" data-section="footer">
+        <FooterBaseCard
+          logoText="PawShelter"
+          columns={[
+            {
+              title: "Admin",              items: [
+                { label: "Dashboard", href: "/admin" },
+                { label: "Back to Site", href: "/" },
+              ]
+            },
+          ]}
+          copyrightText="© 2025 PawShelter Admin Panel. All rights reserved."
+        />
+      </div>
+    </ThemeProvider>
+  );
+}

src/app/customers/page.tsx

@@ -0,0 +1,145 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
+import HeroLogo from '@/components/sections/hero/HeroLogo';
+import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
+import ContactCenter from '@/components/sections/contact/ContactCenter';
+import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
+import { Heart } from "lucide-react";
+
+export default function CustomersPage() {
+  return (
+    <ThemeProvider
+      defaultButtonVariant="icon-arrow"
+      defaultTextAnimation="entrance-slide"
+      borderRadius="rounded"
+      contentWidth="smallMedium"
+      sizing="largeSizeMediumTitles"
+      background="aurora"
+      cardStyle="soft-shadow"
+      primaryButtonStyle="double-inset"
+      secondaryButtonStyle="radial-glow"
+      headingFontWeight="extrabold"
+    >
+      <div id="nav" data-section="nav">
+        <NavbarStyleFullscreen
+          navItems={[
+            { name: "Home", id: "hero" },
+            { name: "About", id: "about" },
+            { name: "Adopt", id: "product" },
+            { name: "Testimonials", id: "testimonial" },
+            { name: "Customers", id: "customers" },
+            { name: "Contact", id: "contact" }
+          ]}
+          brandName="PawShelter"
+          bottomLeftText="Saving Lives, One Paw at a Time"
+          bottomRightText="info@pawshelter.org"
+        />
+      </div>
+
+      <div id="hero" data-section="hero">
+        <HeroLogo
+          logoText="Our Happy Customers"
+          description="Meet the wonderful families and individuals who have opened their hearts and homes to our rescued pets. Their stories inspire us every day."
+          buttons={[
+            { text: "Browse Available Pets", href: "/" },
+            { text: "Share Your Story", href: "/contact" }
+          ]}
+          imageSrc="http://img.b2bpic.net/free-photo/happy-family-with-dog-at-home_1157-21400.jpg"
+          imageAlt="Happy families with their adopted pets"
+          showDimOverlay={true}
+        />
+      </div>
+
+      <div id="customers" data-section="customers">
+        <TestimonialCardOne
+          title="Customer Success Stories"
+          description="Discover the heartwarming stories of families and individuals who found their perfect companions through PawShelter. These testimonials showcase the lasting bond between pet and owner."
+          tag="Our Community"
+          testimonials={[
+            {
+              id: "1",              name: "Sarah Martinez",              role: "Dog Mom",              company: "Portland, OR",              rating: 5,
+              imageSrc: "http://img.b2bpic.net/free-photo/happy-businessman-smiling-camera_1163-4660.jpg?_wi=2",              imageAlt: "Sarah Martinez"
+            },
+            {
+              id: "2",              name: "Jennifer Chen",              role: "Pet Enthusiast",              company: "Seattle, WA",              rating: 5,
+              imageSrc: "http://img.b2bpic.net/free-photo/smiling-child-hugging-their-parents_1098-890.jpg?_wi=2",              imageAlt: "Jennifer Chen"
+            },
+            {
+              id: "3",              name: "Michael Johnson",              role: "First-Time Pet Owner",              company: "Denver, CO",              rating: 5,
+              imageSrc: "http://img.b2bpic.net/free-photo/european-man-smiling-cheerful-expression-closeup-portrait_53876-129391.jpg?_wi=2",              imageAlt: "Michael Johnson"
+            },
+            {
+              id: "4",              name: "Emily Rodriguez",              role: "Cat Mom",              company: "Austin, TX",              rating: 5,
+              imageSrc: "http://img.b2bpic.net/free-photo/close-up-young-woman-outdoors_1098-1638.jpg?_wi=2",              imageAlt: "Emily Rodriguez"
+            },
+            {
+              id: "5",              name: "David Thompson",              role: "Senior & Dog Lover",              company: "Boston, MA",              rating: 5,
+              imageSrc: "http://img.b2bpic.net/free-photo/portrait-happy-bearded-man_1308-29255.jpg",              imageAlt: "David Thompson"
+            },
+            {
+              id: "6",              name: "Lisa Anderson",              role: "Multi-Pet Parent",              company: "San Francisco, CA",              rating: 5,
+              imageSrc: "http://img.b2bpic.net/free-photo/beautiful-woman-outdoors-portrait_1308-29291.jpg",              imageAlt: "Lisa Anderson"
+            }
+          ]}
+          gridVariant="three-columns-all-equal-width"
+          textboxLayout="default"
+          animationType="slide-up"
+          useInvertedBackground={false}
+        />
+      </div>
+
+      <div id="contact" data-section="contact">
+        <ContactCenter
+          tag="Share Your Journey"
+          title="Tell Us Your Story"
+          description="Have you adopted a pet from PawShelter? We'd love to hear about your experience and feature your story on our customers page."
+          tagIcon={Heart}
+          background={{ variant: "radial-gradient" }}
+          useInvertedBackground={false}
+          inputPlaceholder="Enter your email"
+          buttonText="Share Story"
+          termsText="We respect your privacy. Your story helps inspire others to give rescue pets a chance."
+        />
+      </div>
+
+      <div id="footer" data-section="footer">
+        <FooterBaseCard
+          logoText="PawShelter"
+          columns={[
+            {
+              title: "Adopt",              items: [
+                { label: "Available Pets", href: "/" },
+                { label: "Adoption Process", href: "#" },
+                { label: "Success Stories", href: "/" }
+              ]
+            },
+            {
+              title: "Support",              items: [
+                { label: "Volunteer", href: "/contact" },
+                { label: "Donate", href: "#" },
+                { label: "Become a Sponsor", href: "#" }
+              ]
+            },
+            {
+              title: "About",              items: [
+                { label: "Our Mission", href: "/" },
+                { label: "Meet the Team", href: "#" },
+                { label: "Contact Us", href: "/contact" }
+              ]
+            },
+            {
+              title: "Resources",              items: [
+                { label: "Pet Care Tips", href: "#" },
+                { label: "Blog", href: "#" },
+                { label: "FAQ", href: "#" }
+              ]
+            }
+          ]}
+          copyrightText="© 2025 PawShelter. All rights reserved. Saving lives, one paw at a time."
+        />
+      </div>
+    </ThemeProvider>
+  );
+}

src/app/page.tsx

@@ -28,7 +28,7 @@ export default function LandingPage() {
       <div id="nav" data-section="nav">
         <NavbarStyleFullscreen
           navItems={[
-            { name: "Home", id: "hero" },
+            { name: "Home", id: "/" },
             { name: "About", id: "about" },
             { name: "Adopt", id: "product" },
             { name: "Testimonials", id: "testimonial" },
@@ -48,7 +48,7 @@ export default function LandingPage() {
             { text: "Browse Available Pets", href: "product" },
             { text: "Volunteer Today", href: "contact" }
           ]}
-          imageSrc="http://img.b2bpic.net/free-photo/elegant-fashion-girls-summer-park_1157-21448.jpg"
+          imageSrc="http://img.b2bpic.net/free-photo/elegant-fashion-girls-summer-park_1157-21448.jpg?_wi=1"
           imageAlt="Happy dogs and cats at the shelter"
           showDimOverlay={true}
         />
@@ -117,13 +117,13 @@ export default function LandingPage() {
           tagIcon={Package}
           products={[
             {
-              id: "1",              name: "Luna - Golden Retriever",              price: "Adoption Fee: $150",              variant: "4 years old • Female • Friendly",              imageSrc: "http://img.b2bpic.net/free-photo/cute-golden-retriever-dog_1204-387.jpg",              imageAlt: "Luna the golden retriever"
+              id: "1",              name: "Luna - Golden Retriever",              price: "Adoption Fee: $150",              variant: "4 years old • Female • Friendly",              imageSrc: "http://img.b2bpic.net/free-photo/cute-golden-retriever-dog_1204-387.jpg?_wi=1",              imageAlt: "Luna the golden retriever"
             },
             {
-              id: "2",              name: "Whiskers - Orange Tabby",              price: "Adoption Fee: $75",              variant: "2 years old • Male • Playful",              imageSrc: "http://img.b2bpic.net/free-photo/adorable-little-baby-kitten-walking_658552-2.jpg",              imageAlt: "Whiskers the orange tabby cat"
+              id: "2",              name: "Whiskers - Orange Tabby",              price: "Adoption Fee: $75",              variant: "2 years old • Male • Playful",              imageSrc: "http://img.b2bpic.net/free-photo/adorable-little-baby-kitten-walking_658552-2.jpg?_wi=1",              imageAlt: "Whiskers the orange tabby cat"
             },
             {
-              id: "3",              name: "Max - German Shepherd Mix",              price: "Adoption Fee: $200",              variant: "5 years old • Male • Loyal & Gentle",              imageSrc: "http://img.b2bpic.net/free-photo/closeup-shot-cute-puppy_181624-21270.jpg",              imageAlt: "Max the German Shepherd mix"
+              id: "3",              name: "Max - German Shepherd Mix",              price: "Adoption Fee: $200",              variant: "5 years old • Male • Loyal & Gentle",              imageSrc: "http://img.b2bpic.net/free-photo/closeup-shot-cute-puppy_181624-21270.jpg?_wi=1",              imageAlt: "Max the German Shepherd mix"
             }
           ]}
           gridVariant="three-columns-all-equal-width"
@@ -144,19 +144,19 @@ export default function LandingPage() {
           testimonials={[
             {
               id: "1",              name: "Sarah Martinez",              role: "Dog Mom",              company: "Portland, OR",              rating: 5,
-              imageSrc: "http://img.b2bpic.net/free-photo/happy-businessman-smiling-camera_1163-4660.jpg",              imageAlt: "Sarah Martinez"
+              imageSrc: "http://img.b2bpic.net/free-photo/happy-businessman-smiling-camera_1163-4660.jpg?_wi=1",              imageAlt: "Sarah Martinez"
             },
             {
               id: "2",              name: "Jennifer Chen",              role: "Pet Enthusiast",              company: "Seattle, WA",              rating: 5,
-              imageSrc: "http://img.b2bpic.net/free-photo/smiling-child-hugging-their-parents_1098-890.jpg",              imageAlt: "Jennifer Chen"
+              imageSrc: "http://img.b2bpic.net/free-photo/smiling-child-hugging-their-parents_1098-890.jpg?_wi=1",              imageAlt: "Jennifer Chen"
             },
             {
               id: "3",              name: "Michael Johnson",              role: "First-Time Pet Owner",              company: "Denver, CO",              rating: 5,
-              imageSrc: "http://img.b2bpic.net/free-photo/european-man-smiling-cheerful-expression-closeup-portrait_53876-129391.jpg",              imageAlt: "Michael Johnson"
+              imageSrc: "http://img.b2bpic.net/free-photo/european-man-smiling-cheerful-expression-closeup-portrait_53876-129391.jpg?_wi=1",              imageAlt: "Michael Johnson"
             },
             {
               id: "4",              name: "Emily Rodriguez",              role: "Cat Mom",              company: "Austin, TX",              rating: 5,
-              imageSrc: "http://img.b2bpic.net/free-photo/close-up-young-woman-outdoors_1098-1638.jpg",              imageAlt: "Emily Rodriguez"
+              imageSrc: "http://img.b2bpic.net/free-photo/close-up-young-woman-outdoors_1098-1638.jpg?_wi=1",              imageAlt: "Emily Rodriguez"
             }
           ]}
           gridVariant="four-items-2x2-equal-grid"

src/app/pets/page.tsx

@@ -0,0 +1,131 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
+import HeroLogo from '@/components/sections/hero/HeroLogo';
+import ProductCardFour from '@/components/sections/product/ProductCardFour';
+import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
+import { Package } from "lucide-react";
+
+export default function PetsPage() {
+  return (
+    <ThemeProvider
+      defaultButtonVariant="icon-arrow"
+      defaultTextAnimation="entrance-slide"
+      borderRadius="rounded"
+      contentWidth="smallMedium"
+      sizing="largeSizeMediumTitles"
+      background="aurora"
+      cardStyle="soft-shadow"
+      primaryButtonStyle="double-inset"
+      secondaryButtonStyle="radial-glow"
+      headingFontWeight="extrabold"
+    >
+      <div id="nav" data-section="nav">
+        <NavbarStyleFullscreen
+          navItems={[
+            { name: "Home", id: "/" },
+            { name: "About", id: "about" },
+            { name: "Adopt", id: "product" },
+            { name: "Pets", id: "/pets" },
+            { name: "Testimonials", id: "testimonial" },
+            { name: "Contact", id: "contact" }
+          ]}
+          brandName="PawShelter"
+          bottomLeftText="Saving Lives, One Paw at a Time"
+          bottomRightText="info@pawshelter.org"
+        />
+      </div>
+
+      <div id="hero" data-section="hero">
+        <HeroLogo
+          logoText="Meet Our Pets"
+          description="Explore our complete listing of available pets waiting for their forever homes. Each profile includes detailed information about personality, age, and care requirements."
+          buttons={[
+            { text: "Back to Home", href: "/" },
+            { text: "Contact Us", href: "contact" }
+          ]}
+          imageSrc="http://img.b2bpic.net/free-photo/elegant-fashion-girls-summer-park_1157-21448.jpg?_wi=2"
+          imageAlt="Our available pets"
+          showDimOverlay={true}
+        />
+      </div>
+
+      <div id="pets" data-section="pets">
+        <ProductCardFour
+          title="Complete Pet Listings"
+          description="Browse all available pets currently in our care. Filter by type, age, size, and temperament to find your perfect match."
+          tag="All Available Pets"
+          tagIcon={Package}
+          products={[
+            {
+              id: "1",              name: "Luna - Golden Retriever",              price: "Adoption Fee: $150",              variant: "4 years old • Female • Friendly & Gentle",              imageSrc: "http://img.b2bpic.net/free-photo/cute-golden-retriever-dog_1204-387.jpg?_wi=2",              imageAlt: "Luna the golden retriever"
+            },
+            {
+              id: "2",              name: "Whiskers - Orange Tabby",              price: "Adoption Fee: $75",              variant: "2 years old • Male • Playful & Affectionate",              imageSrc: "http://img.b2bpic.net/free-photo/adorable-little-baby-kitten-walking_658552-2.jpg?_wi=2",              imageAlt: "Whiskers the orange tabby cat"
+            },
+            {
+              id: "3",              name: "Max - German Shepherd Mix",              price: "Adoption Fee: $200",              variant: "5 years old • Male • Loyal & Protective",              imageSrc: "http://img.b2bpic.net/free-photo/closeup-shot-cute-puppy_181624-21270.jpg?_wi=2",              imageAlt: "Max the German Shepherd mix"
+            },
+            {
+              id: "4",              name: "Bella - Labrador Retriever",              price: "Adoption Fee: $175",              variant: "3 years old • Female • Energetic & Smart",              imageSrc: "http://img.b2bpic.net/free-photo/studio-shot-adorable-puppy_1157-21448.jpg",              imageAlt: "Bella the Labrador Retriever"
+            },
+            {
+              id: "5",              name: "Shadow - Black Cat",              price: "Adoption Fee: $75",              variant: "1 year old • Male • Curious & Independent",              imageSrc: "http://img.b2bpic.net/free-photo/black-cat-standing_1157-21450.jpg",              imageAlt: "Shadow the black cat"
+            },
+            {
+              id: "6",              name: "Rocky - Boxer",              price: "Adoption Fee: $225",              variant: "6 years old • Male • Calm & Loving",              imageSrc: "http://img.b2bpic.net/free-photo/boxer-dog-portrait_1157-21451.jpg",              imageAlt: "Rocky the Boxer"
+            },
+            {
+              id: "7",              name: "Mittens - Calico Cat",              price: "Adoption Fee: $80",              variant: "3 years old • Female • Sweet & Gentle",              imageSrc: "http://img.b2bpic.net/free-photo/calico-cat-playing_1157-21452.jpg",              imageAlt: "Mittens the Calico cat"
+            },
+            {
+              id: "8",              name: "Cooper - Beagle",              price: "Adoption Fee: $160",              variant: "2 years old • Male • Friendly & Adventurous",              imageSrc: "http://img.b2bpic.net/free-photo/beagle-puppy-sitting_1157-21453.jpg",              imageAlt: "Cooper the Beagle"
+            }
+          ]}
+          gridVariant="four-items-2x2-equal-grid"
+          textboxLayout="default"
+          animationType="slide-up"
+          useInvertedBackground={false}
+        />
+      </div>
+
+      <div id="footer" data-section="footer">
+        <FooterBaseCard
+          logoText="PawShelter"
+          columns={[
+            {
+              title: "Adopt",              items: [
+                { label: "Available Pets", href: "/pets" },
+                { label: "Adoption Process", href: "#" },
+                { label: "Success Stories", href: "testimonial" }
+              ]
+            },
+            {
+              title: "Support",              items: [
+                { label: "Volunteer", href: "contact" },
+                { label: "Donate", href: "#" },
+                { label: "Become a Sponsor", href: "#" }
+              ]
+            },
+            {
+              title: "About",              items: [
+                { label: "Our Mission", href: "about" },
+                { label: "Meet the Team", href: "#" },
+                { label: "Contact Us", href: "contact" }
+              ]
+            },
+            {
+              title: "Resources",              items: [
+                { label: "Pet Care Tips", href: "#" },
+                { label: "Blog", href: "#" },
+                { label: "FAQ", href: "#" }
+              ]
+            }
+          ]}
+          copyrightText="© 2025 PawShelter. All rights reserved. Saving lives, one paw at a time."
+        />
+      </div>
+    </ThemeProvider>
+  );
+}

src/app/privacy-policy/page.tsx

@@ -0,0 +1,230 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
+import LegalSection from '@/components/legal/LegalSection';
+import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
+
+export default function PrivacyPolicyPage() {
+  return (
+    <ThemeProvider
+      defaultButtonVariant="icon-arrow"
+      defaultTextAnimation="entrance-slide"
+      borderRadius="rounded"
+      contentWidth="smallMedium"
+      sizing="largeSizeMediumTitles"
+      background="aurora"
+      cardStyle="soft-shadow"
+      primaryButtonStyle="double-inset"
+      secondaryButtonStyle="radial-glow"
+      headingFontWeight="extrabold"
+    >
+      <div id="nav" data-section="nav">
+        <NavbarStyleFullscreen
+          navItems={[
+            { name: "Home", id: "hero" },
+            { name: "About", id: "about" },
+            { name: "Adopt", id: "product" },
+            { name: "Testimonials", id: "testimonial" },
+            { name: "Contact", id: "contact" },
+            { name: "Privacy Policy", id: "/privacy-policy" },
+            { name: "Terms of Service", id: "/terms-of-service" }
+          ]}
+          brandName="PawShelter"
+          bottomLeftText="Saving Lives, One Paw at a Time"
+          bottomRightText="info@pawshelter.org"
+        />
+      </div>
+
+      <div id="legal-content" data-section="legal-content">
+        <LegalSection
+          layout="page"
+          title="Privacy Policy"
+          subtitle="Last updated: January 15, 2025"
+          sections={[
+            {
+              heading: "1. Introduction",              content: [
+                {
+                  type: "paragraph",                  text: "PawShelter (\"we\", \"us\", \"our\", or \"Company\") operates the PawShelter website and mobile application (collectively, the \"Service\"). This Privacy Policy explains how we collect, use, disclose, and safeguard your information when you visit our website, use our mobile application, or interact with our services."
+                },
+                {
+                  type: "paragraph",                  text: "Please read this Privacy Policy carefully. If you do not agree with our policies and practices, please do not use our Service. By accessing and using PawShelter, you acknowledge that you have read, understood, and agree to be bound by all the terms of this Privacy Policy."
+                }
+              ]
+            },
+            {
+              heading: "2. Information We Collect",              content: [
+                {
+                  type: "paragraph",                  text: "We collect information in several ways, including information you provide directly to us, information collected automatically as you use our Service, and information from third-party sources."
+                },
+                {
+                  type: "paragraph",                  text: "Information You Provide Directly:"
+                },
+                {
+                  type: "list",                  items: [
+                    "Account registration information (name, email address, password)",                    "Adoption application details (address, phone number, household composition, pet ownership history)",                    "Payment information (processed securely through third-party payment processors)",                    "Volunteer and employment applications",                    "Communications you send to us (emails, messages, support requests)",                    "Survey and feedback responses"
+                  ]
+                },
+                {
+                  type: "paragraph",                  text: "Information Collected Automatically:"
+                },
+                {
+                  type: "list",                  items: [
+                    "Device information (device type, operating system, browser type)",                    "Usage data (pages visited, time spent on pages, links clicked)",                    "Location data (with your permission)",                    "Cookies and similar tracking technologies",                    "IP address and internet service provider information"
+                  ]
+                }
+              ]
+            },
+            {
+              heading: "3. How We Use Your Information",              content: [
+                {
+                  type: "paragraph",                  text: "We use the information we collect for various purposes, including:"
+                },
+                {
+                  type: "list",                  items: [
+                    "Processing and managing adoption applications and agreements",                    "Managing volunteer and employment applications",                    "Providing customer support and responding to inquiries",                    "Sending administrative communications, updates, and announcements",                    "Conducting marketing campaigns and promotional activities",                    "Improving and optimizing our Service",                    "Detecting, investigating, and preventing fraudulent transactions and other illegal activities",                    "Complying with legal and regulatory requirements",                    "Analyzing trends and usage patterns to enhance our Service"
+                  ]
+                }
+              ]
+            },
+            {
+              heading: "4. Information Sharing and Disclosure",              content: [
+                {
+                  type: "paragraph",                  text: "We do not sell, trade, or rent your personal information to third parties. However, we may share your information in the following circumstances:"
+                },
+                {
+                  type: "list",                  items: [
+                    "With service providers who assist us in operating our website and conducting our business (under confidentiality agreements)",                    "When required by law or legal process",                    "To protect our rights, privacy, safety, or property",                    "In connection with a merger, acquisition, or sale of assets",                    "With your explicit consent or at your direction"
+                  ]
+                }
+              ]
+            },
+            {
+              heading: "5. Data Security",              content: [
+                {
+                  type: "paragraph",                  text: "We implement appropriate technical and organizational measures to protect your personal information against unauthorized access, alteration, disclosure, or destruction. These measures include encryption, secure servers, and access controls."
+                },
+                {
+                  type: "paragraph",                  text: "However, no method of transmission over the internet or electronic storage is completely secure. While we strive to protect your personal information, we cannot guarantee absolute security."
+                }
+              ]
+            },
+            {
+              heading: "6. Your Privacy Rights",              content: [
+                {
+                  type: "paragraph",                  text: "Depending on your location, you may have certain rights regarding your personal information, including:"
+                },
+                {
+                  type: "list",                  items: [
+                    "The right to access, review, and obtain a copy of your personal data",                    "The right to correct or update inaccurate information",                    "The right to request deletion of your personal information",                    "The right to opt-out of marketing communications",                    "The right to withdraw consent at any time",                    "The right to data portability"
+                  ]
+                },
+                {
+                  type: "paragraph",                  text: "To exercise any of these rights, please contact us at privacy@pawshelter.org with your request. We will respond within 30 days of receiving your request."
+                }
+              ]
+            },
+            {
+              heading: "7. Cookies and Tracking Technologies",              content: [
+                {
+                  type: "paragraph",                  text: "We use cookies, web beacons, and similar tracking technologies to enhance your experience on our Service. These technologies help us remember your preferences, understand how you use our Service, and deliver personalized content."
+                },
+                {
+                  type: "paragraph",                  text: "You can control cookie settings through your browser. Most browsers allow you to refuse cookies or alert you when cookies are being sent. Please note that disabling cookies may affect the functionality of our Service."
+                }
+              ]
+            },
+            {
+              heading: "8. Children's Privacy",              content: [
+                {
+                  type: "paragraph",                  text: "Our Service is not intended for children under the age of 13. We do not knowingly collect personal information from children under 13. If we become aware that we have collected personal information from a child under 13, we will take steps to delete such information and terminate the child's account."
+                },
+                {
+                  type: "paragraph",                  text: "For children between 13 and 18, we provide additional privacy protections and limit the collection and use of their information."
+                }
+              ]
+            },
+            {
+              heading: "9. Third-Party Links",              content: [
+                {
+                  type: "paragraph",                  text: "Our Service may contain links to third-party websites and services that are not operated by PawShelter. This Privacy Policy does not apply to third-party services, and we are not responsible for their privacy practices. We recommend reviewing the privacy policies of any third-party services before providing your personal information."
+                }
+              ]
+            },
+            {
+              heading: "10. International Data Transfers",              content: [
+                {
+                  type: "paragraph",                  text: "Your information may be transferred to, stored in, and processed in countries other than your country of residence. These countries may have data protection laws that differ from your home country. By using our Service, you consent to the transfer of your information to countries outside your country of residence."
+                }
+              ]
+            },
+            {
+              heading: "11. Changes to This Privacy Policy",              content: [
+                {
+                  type: "paragraph",                  text: "We may update this Privacy Policy from time to time to reflect changes in our practices, technology, legal requirements, or other factors. We will notify you of any material changes by posting the updated Privacy Policy on our website and updating the \"Last updated\" date."
+                },
+                {
+                  type: "paragraph",                  text: "Your continued use of our Service after any changes constitutes your acceptance of the updated Privacy Policy."
+                }
+              ]
+            },
+            {
+              heading: "12. Contact Us",              content: [
+                {
+                  type: "paragraph",                  text: "If you have questions, concerns, or requests regarding this Privacy Policy or our privacy practices, please contact us at:"
+                },
+                {
+                  type: "list",                  items: [
+                    "Email: privacy@pawshelter.org",                    "Phone: 1-800-PAWSHELTER",                    "Mailing Address: PawShelter, 123 Animal Care Lane, Pet City, PC 12345"
+                  ]
+                },
+                {
+                  type: "paragraph",                  text: "We will respond to your inquiry within 30 days."
+                }
+              ]
+            }
+          ]}
+        />
+      </div>
+
+      <div id="footer" data-section="footer">
+        <FooterBaseCard
+          logoText="PawShelter"
+          columns={[
+            {
+              title: "Adopt",              items: [
+                { label: "Available Pets", href: "#product" },
+                { label: "Adoption Process", href: "#" },
+                { label: "Success Stories", href: "#testimonial" },
+                { label: "Privacy Policy", href: "/privacy-policy" },
+                { label: "Terms of Service", href: "/terms-of-service" }
+              ]
+            },
+            {
+              title: "Support",              items: [
+                { label: "Volunteer", href: "#contact" },
+                { label: "Donate", href: "#" },
+                { label: "Become a Sponsor", href: "#" }
+              ]
+            },
+            {
+              title: "About",              items: [
+                { label: "Our Mission", href: "#about" },
+                { label: "Meet the Team", href: "#" },
+                { label: "Contact Us", href: "#contact" }
+              ]
+            },
+            {
+              title: "Resources",              items: [
+                { label: "Pet Care Tips", href: "#" },
+                { label: "Blog", href: "#" },
+                { label: "FAQ", href: "#" }
+              ]
+            }
+          ]}
+          copyrightText="© 2025 PawShelter. All rights reserved. Saving lives, one paw at a time."
+        />
+      </div>
+    </ThemeProvider>
+  );
+}

src/app/styles/base.css

@@ -11,7 +11,7 @@ html {
 body {
   background-color: var(--background);
   color: var(--foreground);
-  font-family: var(--font-inter), sans-serif;
+  font-family: var(--font-manrope), sans-serif;
   position: relative;
   min-height: 100vh;
   overscroll-behavior: none;
@@ -24,5 +24,5 @@ h3,
 h4,
 h5,
 h6 {
-  font-family: var(--font-public-sans), sans-serif;
+  font-family: var(--font-dm-sans), sans-serif;
 }

src/app/terms-of-service/page.tsx

@@ -0,0 +1,253 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
+import LegalSection from '@/components/legal/LegalSection';
+import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
+
+export default function TermsOfServicePage() {
+  return (
+    <ThemeProvider
+      defaultButtonVariant="icon-arrow"
+      defaultTextAnimation="entrance-slide"
+      borderRadius="rounded"
+      contentWidth="smallMedium"
+      sizing="largeSizeMediumTitles"
+      background="aurora"
+      cardStyle="soft-shadow"
+      primaryButtonStyle="double-inset"
+      secondaryButtonStyle="radial-glow"
+      headingFontWeight="extrabold"
+    >
+      <div id="nav" data-section="nav">
+        <NavbarStyleFullscreen
+          navItems={[
+            { name: "Home", id: "hero" },
+            { name: "About", id: "about" },
+            { name: "Adopt", id: "product" },
+            { name: "Testimonials", id: "testimonial" },
+            { name: "Contact", id: "contact" },
+            { name: "Privacy Policy", id: "/privacy-policy" },
+            { name: "Terms of Service", id: "/terms-of-service" }
+          ]}
+          brandName="PawShelter"
+          bottomLeftText="Saving Lives, One Paw at a Time"
+          bottomRightText="info@pawshelter.org"
+        />
+      </div>
+
+      <div id="legal-content" data-section="legal-content">
+        <LegalSection
+          layout="page"
+          title="Terms of Service"
+          subtitle="Last updated: January 15, 2025"
+          sections={[
+            {
+              heading: "1. Acceptance of Terms",              content: [
+                {
+                  type: "paragraph",                  text: "By accessing and using the PawShelter website and mobile application (collectively, the \"Service\"), you agree to be bound by these Terms of Service (\"Terms\"). If you do not agree to these Terms, you may not use the Service. We reserve the right to modify these Terms at any time, and such modifications will be effective upon posting to the Service."
+                },
+                {
+                  type: "paragraph",                  text: "Your continued use of the Service following any such modification constitutes your acceptance of the modified Terms."
+                }
+              ]
+            },
+            {
+              heading: "2. Description of Service",              content: [
+                {
+                  type: "paragraph",                  text: "PawShelter is an online platform dedicated to pet adoption and rescue services. Our Service provides users with information about available pets, adoption processes, volunteer opportunities, and related services. We strive to maintain accurate and current information, but we do not warrant the completeness, accuracy, or reliability of any information on the Service."
+                }
+              ]
+            },
+            {
+              heading: "3. User Eligibility and Responsibilities",              content: [
+                {
+                  type: "paragraph",                  text: "By using the Service, you represent and warrant that you are at least 18 years of age (or the age of majority in your jurisdiction) and have the legal authority to enter into these Terms."
+                },
+                {
+                  type: "paragraph",                  text: "You agree to:"
+                },
+                {
+                  type: "list",                  items: [
+                    "Provide accurate, current, and complete information during registration",                    "Maintain the confidentiality of your account credentials",                    "Accept responsibility for all activities that occur under your account",                    "Use the Service only for lawful purposes and in accordance with these Terms",                    "Not interfere with or disrupt the integrity or performance of the Service",                    "Not use the Service to harass, abuse, or harm others"
+                  ]
+                }
+              ]
+            },
+            {
+              heading: "4. Adoption Policies and Agreements",              content: [
+                {
+                  type: "paragraph",                  text: "All pet adoptions through PawShelter are subject to our adoption policies and procedures. By submitting an adoption application, you:"
+                },
+                {
+                  type: "list",                  items: [
+                    "Acknowledge that you have read and understand our adoption requirements",                    "Agree to allow PawShelter to conduct background checks and home visits if necessary",                    "Confirm that you will provide appropriate care, veterinary attention, and a safe home for the adopted pet",                    "Understand that adoption fees are non-refundable unless the adoption is not finalized",                    "Agree to comply with all applicable local, state, and federal animal welfare laws",                    "Authorize PawShelter to follow up on the welfare of the adopted pet"
+                  ]
+                },
+                {
+                  type: "paragraph",                  text: "PawShelter reserves the right to deny or revoke any adoption application at our sole discretion. If an adopted pet is not properly cared for or if the adoption agreement is violated, PawShelter reserves the right to reclaim the animal."
+                }
+              ]
+            },
+            {
+              heading: "5. Intellectual Property Rights",              content: [
+                {
+                  type: "paragraph",                  text: "All content on the Service, including text, graphics, logos, images, audio, video, and software, is the property of PawShelter or its content suppliers and is protected by copyright and other intellectual property laws. You may not reproduce, distribute, transmit, modify, or create derivative works of any content without our prior written consent."
+                },
+                {
+                  type: "paragraph",                  text: "You are granted a limited, non-exclusive license to access and use the Service for personal, non-commercial purposes only."
+                }
+              ]
+            },
+            {
+              heading: "6. User-Generated Content",              content: [
+                {
+                  type: "paragraph",                  text: "If you submit, post, or display content on the Service (including comments, photos, testimonials, or other materials), you grant PawShelter a worldwide, royalty-free, perpetual, and irrevocable license to use, reproduce, modify, adapt, and publish such content. You represent and warrant that you own or have the necessary rights to the content you submit."
+                },
+                {
+                  type: "paragraph",                  text: "You agree not to submit content that is:"
+                },
+                {
+                  type: "list",                  items: [
+                    "Defamatory, obscene, offensive, or threatening",                    "Infringes on any third-party intellectual property rights",                    "Violates any applicable law or regulation",                    "Promotes illegal, unethical, or harmful activities"
+                  ]
+                }
+              ]
+            },
+            {
+              heading: "7. Limitation of Liability",              content: [
+                {
+                  type: "paragraph",                  text: "TO THE MAXIMUM EXTENT PERMITTED BY LAW, PAWSHELTER AND ITS OFFICERS, DIRECTORS, EMPLOYEES, AND AGENTS SHALL NOT BE LIABLE FOR ANY INDIRECT, INCIDENTAL, SPECIAL, CONSEQUENTIAL, OR PUNITIVE DAMAGES, INCLUDING BUT NOT LIMITED TO LOSS OF PROFITS, DATA, OR BUSINESS INTERRUPTION, ARISING OUT OF OR IN CONNECTION WITH THE SERVICE, EVEN IF PAWSHELTER HAS BEEN ADVISED OF THE POSSIBILITY OF SUCH DAMAGES."
+                },
+                {
+                  type: "paragraph",                  text: "IN NO EVENT SHALL PAWSHELTER'S TOTAL LIABILITY TO YOU FOR ALL CLAIMS ARISING OUT OF THE SERVICE EXCEED THE AMOUNT YOU HAVE PAID TO PAWSHELTER IN THE 12 MONTHS PRECEDING THE CLAIM."
+                }
+              ]
+            },
+            {
+              heading: "8. Disclaimer of Warranties",              content: [
+                {
+                  type: "paragraph",                  text: "THE SERVICE IS PROVIDED ON AN \"AS IS\" AND \"AS AVAILABLE\" BASIS WITHOUT WARRANTIES OF ANY KIND, EXPRESS OR IMPLIED. PAWSHELTER DISCLAIMS ALL WARRANTIES, INCLUDING BUT NOT LIMITED TO MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE, AND NON-INFRINGEMENT."
+                },
+                {
+                  type: "paragraph",                  text: "PAWSHELTER DOES NOT WARRANT THAT:"
+                },
+                {
+                  type: "list",                  items: [
+                    "The Service will be uninterrupted, error-free, or secure",                    "Defects will be corrected",                    "The Service is free of viruses or other harmful components",                    "The results obtained from the Service will meet your expectations"
+                  ]
+                }
+              ]
+            },
+            {
+              heading: "9. Indemnification",              content: [
+                {
+                  type: "paragraph",                  text: "You agree to indemnify, defend, and hold harmless PawShelter and its officers, directors, employees, and agents from any claims, damages, losses, and expenses (including reasonable attorney fees) arising out of or related to your use of the Service, violation of these Terms, or infringement of any third-party rights."
+                }
+              ]
+            },
+            {
+              heading: "10. Links to Third-Party Sites",              content: [
+                {
+                  type: "paragraph",                  text: "The Service may contain links to third-party websites and services that are not operated by PawShelter. We do not endorse or assume responsibility for these third-party sites, their content, or their privacy practices. Your use of third-party sites is subject to their terms of service and privacy policies."
+                }
+              ]
+            },
+            {
+              heading: "11. Termination",              content: [
+                {
+                  type: "paragraph",                  text: "PawShelter may suspend or terminate your account and access to the Service at any time, with or without cause, and without prior notice or liability. Grounds for termination include, but are not limited to, violation of these Terms, illegal activity, or misuse of the Service."
+                },
+                {
+                  type: "paragraph",                  text: "Upon termination, your right to use the Service will immediately cease. All provisions of these Terms that by their nature should survive termination will survive."
+                }
+              ]
+            },
+            {
+              heading: "12. Governing Law",              content: [
+                {
+                  type: "paragraph",                  text: "These Terms shall be governed by and construed in accordance with the laws of the United States, without regard to its conflict of law provisions. Any legal action or proceeding relating to these Terms shall be brought exclusively in the federal or state courts located in the jurisdiction where PawShelter is headquartered."
+                }
+              ]
+            },
+            {
+              heading: "13. Dispute Resolution",              content: [
+                {
+                  type: "paragraph",                  text: "Before initiating any legal proceeding, you agree to attempt to resolve any dispute by contacting us at support@pawshelter.org. If the dispute cannot be resolved informally within 30 days, either party may pursue formal legal action in accordance with Section 12 of these Terms."
+                }
+              ]
+            },
+            {
+              heading: "14. Severability",              content: [
+                {
+                  type: "paragraph",                  text: "If any provision of these Terms is found to be invalid or unenforceable, that provision shall be modified to the minimum extent necessary to make it valid and enforceable, and the remaining provisions shall remain in full force and effect."
+                }
+              ]
+            },
+            {
+              heading: "15. Entire Agreement",              content: [
+                {
+                  type: "paragraph",                  text: "These Terms, together with our Privacy Policy and any other policies or agreements referenced herein, constitute the entire agreement between you and PawShelter regarding the Service and supersede all prior or contemporaneous agreements, understandings, and communications."
+                }
+              ]
+            },
+            {
+              heading: "16. Contact Information",              content: [
+                {
+                  type: "paragraph",                  text: "If you have questions, concerns, or requests regarding these Terms of Service, please contact us at:"
+                },
+                {
+                  type: "list",                  items: [
+                    "Email: legal@pawshelter.org",                    "Phone: 1-800-PAWSHELTER",                    "Mailing Address: PawShelter, 123 Animal Care Lane, Pet City, PC 12345"
+                  ]
+                },
+                {
+                  type: "paragraph",                  text: "We will respond to your inquiry within 30 days."
+                }
+              ]
+            }
+          ]}
+        />
+      </div>
+
+      <div id="footer" data-section="footer">
+        <FooterBaseCard
+          logoText="PawShelter"
+          columns={[
+            {
+              title: "Adopt",              items: [
+                { label: "Available Pets", href: "#product" },
+                { label: "Adoption Process", href: "#" },
+                { label: "Success Stories", href: "#testimonial" },
+                { label: "Privacy Policy", href: "/privacy-policy" },
+                { label: "Terms of Service", href: "/terms-of-service" }
+              ]
+            },
+            {
+              title: "Support",              items: [
+                { label: "Volunteer", href: "#contact" },
+                { label: "Donate", href: "#" },
+                { label: "Become a Sponsor", href: "#" }
+              ]
+            },
+            {
+              title: "About",              items: [
+                { label: "Our Mission", href: "#about" },
+                { label: "Meet the Team", href: "#" },
+                { label: "Contact Us", href: "#contact" }
+              ]
+            },
+            {
+              title: "Resources",              items: [
+                { label: "Pet Care Tips", href: "#" },
+                { label: "Blog", href: "#" },
+                { label: "FAQ", href: "#" }
+              ]
+            }
+          ]}
+          copyrightText="© 2025 PawShelter. All rights reserved. Saving lives, one paw at a time."
+        />
+      </div>
+    </ThemeProvider>
+  );
+}