enhanced styles with the new logo

src/components/Card.jsx

@@ -20,7 +20,7 @@ export default function Card({ title, link }) {
         <div className={"col-md-6 col-lg-3"}>
             <div className={"card"}>
                 <div className={"card-body text-center"}>
-                    <img src={image} className={"card-img-top mb-3"}></img>
+                    <img src={image} className={"card-img-top mb-2 border"}></img>
                     <h5 className={"card-title"}>{title}</h5>
                     <a
                         href={link}

src/css/Card.css

@@ -6,7 +6,6 @@
 
 .card img {
     border-radius: 0px;
-    box-shadow: black ;
 }
 
 .card-title {
@@ -18,15 +17,15 @@
 }
 
 .btn-primary {
-    background: var(--orange-dark);
+    background: #1e1e1e;
     border-radius: 0px;
     padding: 10px 20px;
-    color: var(--text-dark);
+    color: var(--text-light);
     font-weight: bold;
     border: none;
 }
 
 .btn-primary:hover {
-    background: var(--blue);
+    background: #3e3e3e;
     color: var(--text-light)
 }

src/css/index.css

@@ -36,13 +36,14 @@
   --muted: #6c757d;
   --text-dark: #212529;
   --text-light: #ffffff;
+  --bg: #efefef;
 }
 
 html,
 body {
   font-family: "Open Sans", sans-serif;
   color: var(--text-dark);
-  background-color: var(--white);
+  background-color: var(--bg);
 }
 
 /* Tipografía global */
@@ -70,7 +71,7 @@ h6 {
 
 main {
   color: var(--text-dark);
-  background-color: var(--white);
+  background-color: var(--bg);
 }
 
 a {