diff --git a/client/src/components/about/about-section.tsx b/client/src/components/about/about-section.tsx
index 9476875..8a12d6c 100644
--- a/client/src/components/about/about-section.tsx
+++ b/client/src/components/about/about-section.tsx
@@ -1,5 +1,7 @@
 import { Link } from "wouter";
 import { ArabicDecoration } from "@/components/ui/arabic-decoration";
+import { SectionDivider, SectionDividerBottom, CrescentDivider } from "@/components/ui/section-divider";
+import { ArabesquePattern } from "@/components/ui/section-divider";
 
 export function AboutSection() {
   const certifications = [
@@ -30,69 +32,79 @@ export function AboutSection() {
   ];
 
   return (
-    <section id="about" className="py-16 bg-gray-50">
-      <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
-        <div className="text-center mb-16">
-          <ArabicDecoration>
-            <h2 className="text-3xl md:text-4xl font-playfair font-bold text-gray-800">About Fadia</h2>
-          </ArabicDecoration>
-          <p className="mt-8 max-w-3xl mx-auto text-gray-600 font-raleway">
-            Discover the journey, philosophy, and passion behind Pilates with Fadia.
-          </p>
-        </div>
+    <section className="relative overflow-hidden">
+      <SectionDivider color="purple" />
+      
+      <div className="relative py-20 purple-light-bg">
+        <ArabesquePattern color="purple" opacity={15} />
         
-        <div className="flex flex-col md:flex-row items-center">
-          <div className="md:w-1/2 md:pr-12 mb-8 md:mb-0">
-            <img 
-              src="https://images.unsplash.com/photo-1581122584612-713f89daa8eb?ixlib=rb-4.0.3&auto=format&fit=crop&w=800&h=900" 
-              alt="Pilates instructor demonstrating a pose with elegant form" 
-              className="rounded-lg shadow-lg" 
-            />
+        <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+          <div className="text-center mb-16">
+            <h2 className="text-3xl md:text-4xl font-playfair font-bold text-gray-800 relative inline-block">
+              <span className="relative z-10">About Fadia</span>
+              <div className="absolute -bottom-3 left-0 w-full h-1 bg-purple opacity-30"></div>
+            </h2>
+            <CrescentDivider color="purple" className="mt-4" />
+            <p className="mt-6 max-w-3xl mx-auto text-gray-600 font-raleway">
+              Discover the journey, philosophy, and passion behind Pilates with Fadia.
+            </p>
           </div>
           
-          <div className="md:w-1/2">
-            <div className="prose max-w-none">
-              <h3 className="text-2xl font-playfair font-semibold text-teal mb-4">My Pilates Journey</h3>
-              <p className="text-gray-600 mb-4">
-                With over a decade of experience in the art of Pilates, I have dedicated my life to understanding the profound connection between movement, breath, and wellness. My journey began in 2010 when I discovered how Pilates transformed not only my physical strength but my entire approach to well-being.
-              </p>
-              
-              <h3 className="text-2xl font-playfair font-semibold text-teal mb-4">My Teaching Philosophy</h3>
-              <p className="text-gray-600 mb-4">
-                I believe that Pilates is more than exercise—it's a path to self-discovery and inner harmony. My teaching combines classical techniques with modern approaches, always honoring the core principles of concentration, control, centering, flow, precision, and breath.
-              </p>
-              
-              <div className="mt-8">
-                <p className="italic text-gray-700 border-l-4 border-teal pl-4 py-2 font-aref text-lg">
-                  "Movement is medicine for creating change in a person's physical, emotional, and mental states."
+          <div className="flex flex-col md:flex-row items-center">
+            <div className="md:w-1/2 md:pr-12 mb-8 md:mb-0">
+              <img 
+                src="https://images.unsplash.com/photo-1581122584612-713f89daa8eb?ixlib=rb-4.0.3&auto=format&fit=crop&w=800&h=900" 
+                alt="Pilates instructor demonstrating a pose with elegant form" 
+                className="rounded-lg shadow-lg" 
+              />
+            </div>
+            
+            <div className="md:w-1/2">
+              <div className="prose max-w-none">
+                <h3 className="text-2xl font-playfair font-semibold text-purple mb-4">My Pilates Journey</h3>
+                <p className="text-gray-600 mb-4">
+                  With over a decade of experience in the art of Pilates, I have dedicated my life to understanding the profound connection between movement, breath, and wellness. My journey began in 2010 when I discovered how Pilates transformed not only my physical strength but my entire approach to well-being.
                 </p>
-              </div>
-              
-              <div className="mt-8">
-                <Link href="/contact">
-                  <a className="inline-block bg-teal text-white font-medium py-3 px-6 rounded-full hover:bg-opacity-90 transition duration-300">
-                    Connect with Me
-                  </a>
-                </Link>
+                
+                <h3 className="text-2xl font-playfair font-semibold text-purple mb-4">My Teaching Philosophy</h3>
+                <p className="text-gray-600 mb-4">
+                  I believe that Pilates is more than exercise—it's a path to self-discovery and inner harmony. My teaching combines classical techniques with modern approaches, always honoring the core principles of concentration, control, centering, flow, precision, and breath.
+                </p>
+                
+                <div className="mt-8">
+                  <p className="italic text-gray-700 border-l-4 border-purple pl-4 py-2 font-aref text-lg">
+                    "Movement is medicine for creating change in a person's physical, emotional, and mental states."
+                  </p>
+                </div>
+                
+                <div className="mt-8">
+                  <Link href="/contact">
+                    <span className="inline-block bg-purple text-white font-medium py-3 px-6 rounded-full hover:bg-opacity-90 transition duration-300">
+                      Connect with Me
+                    </span>
+                  </Link>
+                </div>
               </div>
             </div>
           </div>
-        </div>
-        
-        <div className="mt-20">
-          <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8">
-            {certifications.map((cert, index) => (
-              <div key={index} className="bg-white p-6 rounded-lg shadow-md text-center">
-                <div className={`w-16 h-16 bg-${cert.color}-light rounded-full flex items-center justify-center mx-auto mb-4`}>
-                  <i className={`fas ${cert.icon} text-${cert.color} text-xl`}></i>
+          
+          <div className="mt-20">
+            <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8">
+              {certifications.map((cert, index) => (
+                <div key={index} className="bg-white p-6 rounded-lg shadow-md text-center">
+                  <div className={`w-16 h-16 bg-${cert.color}-light rounded-full flex items-center justify-center mx-auto mb-4`}>
+                    <i className={`fas ${cert.icon} text-${cert.color} text-xl`}></i>
+                  </div>
+                  <h4 className="font-playfair font-semibold mb-2">{cert.title}</h4>
+                  <p className="text-sm text-gray-600">{cert.description}</p>
                 </div>
-                <h4 className="font-playfair font-semibold mb-2">{cert.title}</h4>
-                <p className="text-sm text-gray-600">{cert.description}</p>
-              </div>
-            ))}
+              ))}
+            </div>
           </div>
         </div>
       </div>
+      
+      <SectionDividerBottom color="purple" />
     </section>
   );
-}
+}
\ No newline at end of file
diff --git a/client/src/components/classes/classes-section.tsx b/client/src/components/classes/classes-section.tsx
index f6772e5..80a7e54 100644
--- a/client/src/components/classes/classes-section.tsx
+++ b/client/src/components/classes/classes-section.tsx
@@ -1,10 +1,11 @@
-import { useEffect, useState } from "react";
+import { useState } from "react";
 import { ClassCard } from "./class-card";
 import { BookingCalendar } from "./booking-calendar";
 import { useQuery } from "@tanstack/react-query";
 import { Class } from "@shared/schema";
-import { ArabicDecoration } from "@/components/ui/arabic-decoration";
 import { Skeleton } from "@/components/ui/skeleton";
+import { SectionDivider, SectionDividerBottom, StarDivider } from "@/components/ui/section-divider";
+import { IslamicPattern } from "@/components/ui/section-divider";
 
 export function ClassesSection() {
   const [selectedClassId, setSelectedClassId] = useState<number | null>(null);
@@ -29,7 +30,7 @@ export function ClassesSection() {
   
   if (error) {
     return (
-      <div className="py-16 islamic-pattern">
+      <div className="py-16">
         <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
           <p className="text-red-500">Error loading classes. Please try again later.</p>
         </div>
@@ -38,57 +39,67 @@ export function ClassesSection() {
   }
 
   return (
-    <section id="classes" className="py-16 islamic-pattern">
-      <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
-        <div className="text-center mb-16">
-          <ArabicDecoration>
-            <h2 className="text-3xl md:text-4xl font-playfair font-bold text-gray-800">Our Classes</h2>
-          </ArabicDecoration>
-          <p className="mt-8 max-w-3xl mx-auto text-gray-600">
-            Discover the perfect Pilates class tailored to your needs and wellness goals.
-          </p>
-        </div>
+    <section className="relative overflow-hidden">
+      <SectionDivider color="rose" />
+      
+      <div className="relative py-20 rose-light-bg">
+        <IslamicPattern color="rose" opacity={10} />
         
-        {isLoading ? (
-          <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
-            {[1, 2, 3].map((_, i) => (
-              <div key={i} className="bg-white rounded-lg overflow-hidden shadow-lg">
-                <Skeleton className="w-full h-48" />
-                <div className="p-6">
-                  <div className="flex justify-between items-center mb-3">
-                    <Skeleton className="h-6 w-32" />
-                    <Skeleton className="h-5 w-16 rounded-full" />
+        <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+          <div className="text-center mb-16">
+            <h2 className="text-3xl md:text-4xl font-playfair font-bold text-gray-800 relative inline-block">
+              <span className="relative z-10">Our Classes</span>
+              <div className="absolute -bottom-3 left-0 w-full h-1 bg-rose opacity-30"></div>
+            </h2>
+            <StarDivider color="rose" className="mt-4" />
+            <p className="mt-6 max-w-3xl mx-auto text-gray-600">
+              Discover the perfect Pilates class tailored to your needs and wellness goals.
+            </p>
+          </div>
+          
+          {isLoading ? (
+            <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
+              {[1, 2, 3].map((_, i) => (
+                <div key={i} className="bg-white rounded-lg overflow-hidden shadow-lg">
+                  <Skeleton className="w-full h-48" />
+                  <div className="p-6">
+                    <div className="flex justify-between items-center mb-3">
+                      <Skeleton className="h-6 w-32" />
+                      <Skeleton className="h-5 w-16 rounded-full" />
+                    </div>
+                    <Skeleton className="h-4 w-full my-2" />
+                    <Skeleton className="h-4 w-full my-2" />
+                    <Skeleton className="h-4 w-3/4 my-2" />
+                    <div className="flex justify-between items-center mt-4">
+                      <Skeleton className="h-4 w-24" />
+                      <Skeleton className="h-4 w-20" />
+                    </div>
+                    <Skeleton className="h-10 w-full mt-4 rounded-md" />
                   </div>
-                  <Skeleton className="h-4 w-full my-2" />
-                  <Skeleton className="h-4 w-full my-2" />
-                  <Skeleton className="h-4 w-3/4 my-2" />
-                  <div className="flex justify-between items-center mt-4">
-                    <Skeleton className="h-4 w-24" />
-                    <Skeleton className="h-4 w-20" />
-                  </div>
-                  <Skeleton className="h-10 w-full mt-4 rounded-md" />
                 </div>
-              </div>
-            ))}
-          </div>
-        ) : (
-          <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
-            {classes?.map(classItem => (
-              <ClassCard 
-                key={classItem.id} 
-                classData={classItem} 
-                onBookClick={handleBookClick}
-              />
-            ))}
-          </div>
-        )}
-        
-        <div id="booking-calendar" className="pt-8">
-          {selectedClass && (
-            <BookingCalendar selectedClass={selectedClass} />
+              ))}
+            </div>
+          ) : (
+            <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
+              {classes?.map(classItem => (
+                <ClassCard 
+                  key={classItem.id} 
+                  classData={classItem} 
+                  onBookClick={handleBookClick}
+                />
+              ))}
+            </div>
           )}
+          
+          <div id="booking-calendar" className="pt-8">
+            {selectedClass && (
+              <BookingCalendar selectedClass={selectedClass} />
+            )}
+          </div>
         </div>
       </div>
+      
+      <SectionDividerBottom color="rose" />
     </section>
   );
-}
+}
\ No newline at end of file
diff --git a/client/src/components/home/feature-card.tsx b/client/src/components/home/feature-card.tsx
index ec0d827..a0af680 100644
--- a/client/src/components/home/feature-card.tsx
+++ b/client/src/components/home/feature-card.tsx
@@ -1,4 +1,5 @@
 import React from "react";
+import { SectionDividerBottom, CrescentDivider } from "@/components/ui/section-divider";
 
 interface FeatureCardProps {
   title: string;
@@ -84,12 +85,33 @@ export function FeaturesSection() {
   ];
 
   return (
-    <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-12">
-      <div className="grid grid-cols-1 md:grid-cols-3 gap-8">
-        {features.map((feature, index) => (
-          <FeatureCard key={index} {...feature} />
-        ))}
+    <section className="relative py-20 overflow-hidden">
+      <div className="absolute inset-0 bg-white"></div>
+      
+      <div className="relative">
+        <div className="text-center mb-12">
+          <h2 className="text-3xl md:text-4xl font-playfair font-bold text-gray-800 relative inline-block">
+            <span className="relative z-10">Core Benefits</span>
+            <div className="absolute -bottom-3 left-0 w-full h-1 bg-purple opacity-20"></div>
+          </h2>
+          <CrescentDivider color="purple" className="mt-4" />
+          <p className="mt-4 max-w-2xl mx-auto text-gray-600">
+            Experience the transformative power of Pilates through these foundational principles
+          </p>
+        </div>
+        
+        <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+          <div className="grid grid-cols-1 md:grid-cols-3 gap-8">
+            {features.map((feature, index) => (
+              <FeatureCard key={index} {...feature} />
+            ))}
+          </div>
+        </div>
       </div>
-    </div>
+      
+      <div className="mt-16">
+        <SectionDividerBottom color="purple" />
+      </div>
+    </section>
   );
 }