Update section backgrounds to align with the brand's selected color palette

Replaces Tailwind CSS background classes with inline styles and adds brand colors to `tailwind.config.ts`.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: acaf01d7-65a7-4fc5-901d-853488e196e8
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/af8dabca-e746-4e53-9c29-d8d4d9cf30f5/a0d4fe1f-319f-4ebd-a49e-0ddf038350b9.jpg

client/src/components/classes/classes-section.tsx

@@ -26,7 +26,7 @@ export function ClassesSection() {
   };
   
   return (
-    <section className="py-20 bg-teal bg-opacity-10">
+    <section className="py-20" style={{ backgroundColor: 'rgba(12, 137, 145, 0.1)' }}>
       <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-semibold text-gray-800 mb-4">

client/src/components/community/community-section.tsx

@@ -44,7 +44,7 @@ export function CommunitySection() {
   }, [user]);
   
   return (
-    <section className="py-20 bg-purple bg-opacity-10">
+    <section className="py-20" style={{ backgroundColor: 'rgba(157, 94, 155, 0.1)' }}>
       <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-semibold text-gray-800 mb-4">

client/src/components/home/cta-section.tsx

@@ -2,7 +2,7 @@ import { Link } from "wouter";
 
 export function CTASection() {
   return (
-    <section className="py-20 bg-purple text-white">
+    <section className="py-20 text-white" style={{ backgroundColor: '#9D5E9B' }}>
       <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
         <h2 className="text-3xl md:text-4xl font-playfair font-semibold mb-6">
           Ready to feel stronger, more connected, and at home in your body?

client/src/components/newsletter/newsletter-section.tsx

@@ -58,7 +58,7 @@ export function NewsletterSection() {
   };
 
   return (
-    <section className="py-20 bg-rose bg-opacity-10 text-gray-800">
+    <section className="py-20 text-gray-800" style={{ backgroundColor: 'rgba(181, 80, 118, 0.1)' }}>
       <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-semibold mb-4">

tailwind.config.ts

@@ -11,6 +11,12 @@ export default {
         sm: "calc(var(--radius) - 4px)",
       },
       colors: {
+        teal: "#0c8991",
+        purple: "#9D5E9B",
+        rose: "#B55076",
+        "teal-light": "rgba(12, 137, 145, 0.1)",
+        "purple-light": "rgba(157, 94, 155, 0.1)",
+        "rose-light": "rgba(181, 80, 118, 0.1)",
         background: "hsl(var(--background))",
         foreground: "hsl(var(--foreground))",
         card: {