**Pídele a la IA:**

Actúa como un analista de bases de datos, diseñador de sistemas de información, desarrollador web senior y experto en modelado de datos.

Basándote en el tema **"Mantenimiento de Equipos de Cómputo"**, diseña una base de datos compuesta por las siguientes tablas:

* Clientes
* Proveedores
* Suministros

Además de diseñar la estructura de la base de datos, genera una página web profesional que muestre las tablas de forma visual y organizada.

## Requisitos de las tablas

Para cada tabla incluye:

* Nombre de la tabla.
* Nombre de cada campo.
* Tipo de dato sugerido.
* Descripción de cada campo.
* Clave primaria (PK).
* Clave foránea (FK), cuando aplique.

### Datos de ejemplo

La página no debe mostrar únicamente los nombres de los campos.

Además, cada tabla debe incluir registros de ejemplo con datos ficticios realistas relacionados con el mantenimiento de equipos de cómputo.

Por ejemplo:

### Clientes

* Carlos Rodríguez
* María González
* Andrés Martínez
* Sofía Herrera
* Tecnología del Caribe S.A.S.
* Soluciones Digitales Ltda.

### Proveedores

* Computec Colombia
* Distribuciones Tecnológicas S.A.S.
* HP Colombia
* Dell Technologies
* RedCompu S.A.S.

### Suministros

* Disco SSD Kingston 1TB
* Memoria RAM DDR4 16GB
* Fuente de Poder EVGA 600W
* Pasta Térmica Cooler Master
* Kit de Limpieza Profesional
* Mouse Logitech M185
* Teclado Mecánico Redragon
* Cable de Red Cat6

Los datos deben parecer registros reales de una empresa de mantenimiento de equipos de cómputo.

## Diseño de la Interfaz

Crear una página web moderna y profesional con las siguientes características:

* Diseño corporativo tecnológico.
* Totalmente responsive.
* Compatible con computador, tablet y móvil.
* Encabezado principal con el título:

**"Sistema de Gestión de Mantenimiento de Equipos de Cómputo"**

* Tarjetas independientes para cada tabla.
* Iconos representativos.
* Sombras modernas.
* Bordes redondeados.
* Efectos hover.
* Animaciones suaves.
* Aparición progresiva de elementos al hacer scroll.
* Paleta de colores profesional (azules, blancos, grises y tonos tecnológicos).

## Funcionalidades

Implementar:

* Animaciones de carga.
* Resaltado visual de filas.
* Efectos interactivos.
* Búsqueda de registros (opcional).
* Aparición progresiva de las secciones.
* Diseño tipo dashboard empresarial.

## Código

Genera el código completamente separado en:

1. index.html
2. styles.css
3. script.js

No combines CSS ni JavaScript dentro del HTML.

Incluye comentarios explicativos dentro de cada archivo para facilitar futuras modificaciones.

Genera primero el archivo **index.html**, luego **styles.css** y finalmente **script.js**.

El resultado debe parecer una aplicación profesional utilizada por una empresa real de mantenimiento de equipos de cómputo para documentar y visualizar su base de datos.