From 9e492b76cebb1e1d11250e395382d5cd4932248d Mon Sep 17 00:00:00 2001
From: CodeAriCos28 <arafaelacosta28@gmail.com>
Date: Sun, 25 Jan 2026 21:27:35 -0400
Subject: [PATCH] mejora en Accesibilidad

---
 index.html | 50 +++++++++++++++++++++++++++++++++++++-------------
 1 file changed, 37 insertions(+), 13 deletions(-)

diff --git a/index.html b/index.html
index feb1bc4..7d80a17 100644
--- a/index.html
+++ b/index.html
@@ -41,6 +41,18 @@
     />
 
     <style>
+      /* Solo para lectores de pantalla */
+      .sr-only {
+        position: absolute;
+        width: 1px;
+        height: 1px;
+        padding: 0;
+        margin: -1px;
+        overflow: hidden;
+        clip: rect(0, 0, 0, 0);
+        white-space: nowrap;
+        border: 0;
+      }
       /* =========================================
            1. VARIABLES Y CONFIGURACIÓN BASE
            ========================================= */
@@ -1230,7 +1242,7 @@
            8. FOOTER (LOGO Y REDES)
            ========================================= */
       footer {
-        background: #050710;
+        background: #181828;
         border-top: 1px solid var(--border-light);
         padding: 80px 0 30px;
         margin-top: 80px;
@@ -1276,7 +1288,7 @@
       }
 
       .footer-link {
-        color: var(--text-muted);
+        color: #e5e7eb;
         position: relative;
         padding: 5px 0;
         font-size: 0.9rem;
@@ -1296,7 +1308,7 @@
       }
 
       .footer-link:hover {
-        color: white;
+        color: #ffffff;
       }
       .footer-link:hover::after {
         width: 100%;
@@ -1361,7 +1373,9 @@
       .footer-bottom {
         display: flex;
         justify-content: space-between;
-        color: rgba(255, 255, 255, 0.3);
+        color: #f3f4f6;
+        background: #181828;
+        padding: 16px 0 0 0;
         font-size: 0.85rem;
       }
 
@@ -1468,7 +1482,6 @@
         }
         /* ensure the inline link text stays inline for underline sizing */
         .nav-links.active a .link-text {
-         
           display: inline-block;
         }
         .nav-links.active a::after {
@@ -1479,7 +1492,6 @@
         .nav-links.active a.active {
           background: rgba(1, 3, 54, 0.863);
           color: var(--primary);
-
         }
 
         #contact-form {
@@ -2016,24 +2028,36 @@ <h2>
                     href="https://www.instagram.com/derejsoft?utm_source=qr&igsh=djV2ZHVicjZ2eTFn"
                     target="_blank"
                     class="social-icon instagram"
-                    ><i class="fab fa-instagram"></i
-                  ></a>
+                    aria-label="Instagram de DerejSoft"
+                    title="Instagram de DerejSoft"
+                  >
+                    <i class="fab fa-instagram" aria-hidden="true"></i>
+                    <span class="sr-only">Instagram</span>
+                  </a>
                 </li>
                 <li>
                   <a
                     href="https://www.facebook.com/share/1JKws2oMEp"
                     target="_blank"
                     class="social-icon facebook"
-                    ><i class="fab fa-facebook-f"></i
-                  ></a>
+                    aria-label="Facebook de DerejSoft"
+                    title="Facebook de DerejSoft"
+                  >
+                    <i class="fab fa-facebook-f" aria-hidden="true"></i>
+                    <span class="sr-only">Facebook</span>
+                  </a>
                 </li>
                 <li>
                   <a
-                    href="https://www.tiktok.com/@derejsoft2003?_r=1&_t=ZS-912JRDQSIcr"
+                    href="https://www.tiktok.com/@derejsoft?_r=1&_t=ZS-912JRDQSIcr"
                     target="_blank"
                     class="social-icon tiktok"
-                    ><i class="fab fa-tiktok"></i
-                  ></a>
+                    aria-label="TikTok de DerejSoft"
+                    title="TikTok de DerejSoft"
+                  >
+                    <i class="fab fa-tiktok" aria-hidden="true"></i>
+                    <span class="sr-only">TikTok</span>
+                  </a>
                 </li>
               </ul>
             </div>