Refactor App component styles and remove highlights section

- Updated background gradient colors for a lighter theme.
- Changed button styles to improve visibility.
- Removed the highlights section to streamline the layout.
- Adjusted text colors for better contrast and readability.

src/routes/index.tsx

@@ -1,6 +1,5 @@
 import { createFileRoute, Link } from '@tanstack/react-router'
 import { Button } from "@/components/ui/button"
-import { Card, CardContent } from "@/components/ui/card"
 import { ArrowRight } from "lucide-react"
 import '../App.css'
 
@@ -10,12 +9,12 @@ export const Route = createFileRoute('/')({
 
 function App() {
   return (
-    <div className="min-h-screen flex flex-col bg-gradient-to-br from-slate-950 via-slate-900 to-slate-800 text-white">
+    <div className="min-h-screen flex flex-col bg-gradient-to-br from-slate-150 via-slate-200 to-primary">
       {/* Navbar */}
       <header className="flex items-center justify-between px-10 py-6 border-b border-slate-700/50">
         <h1 className="text-2xl font-mono tracking-tight">Génesis</h1>
         <Link to="/login" search={{ redirect: '/planes' }}>
-          <Button variant="outline" className="text-white border-slate-500 hover:bg-slate-700/50">
+          <Button variant="outline" className="border-slate-500 hover:bg-slate-700/50">
             Iniciar sesión
           </Button>
         </Link>
@@ -24,10 +23,10 @@ function App() {
       {/* Hero */}
       <main className="flex-1 flex flex-col items-center justify-center text-center px-6">
         <h2 className="text-5xl md:text-6xl font-mono font-bold mb-6">
-          Bienvenido a <span className="text-cyan-400">Génesis</span>
+          Bienvenido a <span className="text-primary">Génesis</span>
         </h2>
-        <p className="text-lg md:text-xl text-slate-300 max-w-2xl mb-8">
-          El sistema académico diseñado para transformar la gestión universitaria 🚀.
+        <p className="text-lg md:text-xl max-w-2xl mb-8">
+          El sistema académico diseñado para transformar la gestión universitaria.
           Seguro, moderno y hecho para crecer contigo.
         </p>
 
@@ -37,30 +36,14 @@ function App() {
               Comenzar <ArrowRight className="ml-2 h-5 w-5" />
             </Button>
           </Link>
-          <Button size="lg" variant="outline" className="rounded-2xl px-6 py-3 text-lg font-mono border-slate-600 text-slate-200 hover:bg-slate-700/50">
+          <Button size="lg" variant="outline" className="rounded-2xl px-6 py-3 text-lg font-mono border-slate-600 hover:bg-slate-100/50">
             Conoce más
           </Button>
         </div>
       </main>
 
-      {/* Highlights */}
-      <section className="grid md:grid-cols-3 gap-6 px-10 py-16 bg-slate-900/60 backdrop-blur-md border-t border-slate-700/50">
-        {[
-          { title: "Gestión Académica", desc: "Administra planes de estudio, carreras y facultades con total control." },
-          { title: "Tecnología Moderna", desc: "Construido con React, Supabase y prácticas seguras de última generación." },
-          { title: "Escalable", desc: "Diseñado para crecer junto con tu institución." }
-        ].map((item, i) => (
-          <Card key={i} className="bg-slate-800/60 border-slate-700 hover:border-cyan-500 transition-colors duration-300">
-            <CardContent className="p-6">
-              <h3 className="font-mono text-xl mb-3 text-cyan-400">{item.title}</h3>
-              <p className="text-slate-300">{item.desc}</p>
-            </CardContent>
-          </Card>
-        ))}
-      </section>
-
       {/* Footer */}
-      <footer className="py-6 text-center text-slate-400 text-sm border-t border-slate-700/50">
+      <footer className="py-6 text-center text-sm border-t border-slate-700/50">
         © {new Date().getFullYear()} Génesis — Universidad La Salle
       </footer>
     </div>