Refactor Finances component by removing unused insurance provider list and adjusting grid layout for improved responsiveness.

components/Finances.tsx

@@ -3,7 +3,7 @@
 import { motion } from "framer-motion";
 import { useInView } from "framer-motion";
 import { useRef } from "react";
-import { CreditCard, DollarSign, Shield } from "lucide-react";
+import { CreditCard, DollarSign } from "lucide-react";
 import { useAppTheme } from "@/components/ThemeProvider";
 
 export function Finances() {
@@ -19,31 +19,6 @@ export function Finances() {
     "Visa"
   ];
 
-  const insuranceProviders = [
-    "Aetna",
-    "Aetna - Medicare",
-    "Aetna - WebTPA",
-    "All Savers",
-    "Ambetter",
-    "AvMed",
-    "Cigna and Evernorth",
-    "EAP:Cigna",
-    "EAP:UnitedHealthcare/Optum",
-    "Golden Rule",
-    "Harvard Pilgrim/United",
-    "Humana",
-    "Humana - Medicare",
-    "Humana Dual- Medicaid/Medicare",
-    "Medicaid",
-    "Optum",
-    "Oscar Health",
-    "Oxford",
-    "Surest (formerly Bind)",
-    "Tufts Health/Cigna",
-    "UHC/Optum - Medicare",
-    "United Medical Resources (UMR)",
-    "UnitedHealthcare UHC | UBH"
-  ];
 
   return (
     <section 
@@ -132,7 +107,7 @@ export function Finances() {
           </motion.p>
         </motion.div>
 
-        <div className="grid md:grid-cols-3 gap-6 mb-8">
+        <div className="grid md:grid-cols-2 gap-6 mb-8">
           {/* Fees */}
           <motion.div
             initial={{ opacity: 0, y: 20 }}
@@ -178,33 +153,6 @@ export function Finances() {
             </div>
           </motion.div>
 
-          {/* Insurance */}
-          <motion.div
-            initial={{ opacity: 0, y: 20 }}
-            animate={isInView ? { opacity: 1, y: 0 } : {}}
-            transition={{ duration: 0.5, delay: 0.4 }}
-            className="bg-card/50 backdrop-blur-sm rounded-2xl p-6 border border-border/50 hover:border-rose-500/50 hover:shadow-lg hover:shadow-rose-500/10 hover:scale-105 transition-all duration-300"
-          >
-            <div className="flex items-center gap-3 mb-4">
-              <div className="bg-gradient-to-br from-rose-500/20 via-pink-500/20 to-orange-500/20 dark:from-rose-500/30 dark:via-pink-500/30 dark:to-orange-500/30 p-3 rounded-xl">
-                <Shield className="h-6 w-6 text-rose-600 dark:text-rose-400" />
-              </div>
-              <h3 className="text-xl font-semibold text-foreground">Insurance</h3>
-            </div>
-            <div className="max-h-64 overflow-y-auto space-y-2 pr-2">
-              {insuranceProviders.map((provider, index) => (
-                <motion.p
-                  key={provider}
-                  className="text-sm text-muted-foreground"
-                  initial={{ opacity: 0, x: -10 }}
-                  animate={isInView ? { opacity: 1, x: 0 } : {}}
-                  transition={{ duration: 0.3, delay: 0.5 + index * 0.02 }}
-                >
-                  {provider}
-                </motion.p>
-              ))}
-            </div>
-          </motion.div>
         </div>
       </div>
     </section>