From 28ae122bed15655be0c63d56fc01846557fb6bd2 Mon Sep 17 00:00:00 2001
From: jls846 <jlussanchez123@gmail.com>
Date: Tue, 18 Nov 2025 18:11:09 -0600
Subject: [PATCH] modificaciones a Pregunata3

---
 src/app/(Administrador)/reporte/page.tsx      |  39 +-
 src/app/styles/layout/reporte.scss            |   2 +-
 src/components/Equipo_Computo/Pregunta1.tsx   | 349 ++++++----
 src/components/Equipo_Computo/Pregunta1_1.tsx | 242 -------
 src/components/Equipo_Computo/Pregunta2.tsx   | 198 +++---
 src/components/Equipo_Computo/Pregunta3.tsx   | 634 ++++++++----------
 src/components/Equipo_Computo/Pregunta3_1.tsx | 248 -------
 src/components/Equipo_Computo/Pregunta3_2.tsx | 270 --------
 src/components/Equipo_Computo/Pregunta3_3.tsx | 271 --------
 src/components/Equipo_Computo/Pregunta3_4.tsx | 257 -------
 src/components/Equipo_Computo/Pregunta3_5.tsx | 209 ------
 .../Equipo_Computo/pregunta1.module.scss      |  70 +-
 ...a1_1.module.scss => pregunta2.module.scss} |  71 +-
 src/components/Equipo_Computo/pregunta2.scss  | 164 -----
 src/components/Equipo_Computo/pregunta3.css   | 167 -----
 .../Equipo_Computo/pregunta3.module.scss      | 220 ++++++
 src/components/Equipo_Computo/pregunta3_1.css | 171 -----
 src/components/Equipo_Computo/pregunta3_2.css | 170 -----
 src/components/Equipo_Computo/pregunta3_3.css | 170 -----
 src/components/Equipo_Computo/pregunta3_4.css | 166 -----
 src/components/Equipo_Computo/pregunta3_5.css | 201 ------
 tsconfig.json                                 |   2 +-
 22 files changed, 910 insertions(+), 3381 deletions(-)
 delete mode 100644 src/components/Equipo_Computo/Pregunta1_1.tsx
 delete mode 100644 src/components/Equipo_Computo/Pregunta3_1.tsx
 delete mode 100644 src/components/Equipo_Computo/Pregunta3_2.tsx
 delete mode 100644 src/components/Equipo_Computo/Pregunta3_3.tsx
 delete mode 100644 src/components/Equipo_Computo/Pregunta3_4.tsx
 delete mode 100644 src/components/Equipo_Computo/Pregunta3_5.tsx
 rename src/components/Equipo_Computo/{pregunta1_1.module.scss => pregunta2.module.scss} (70%)
 delete mode 100644 src/components/Equipo_Computo/pregunta2.scss
 delete mode 100644 src/components/Equipo_Computo/pregunta3.css
 create mode 100644 src/components/Equipo_Computo/pregunta3.module.scss
 delete mode 100644 src/components/Equipo_Computo/pregunta3_1.css
 delete mode 100644 src/components/Equipo_Computo/pregunta3_2.css
 delete mode 100644 src/components/Equipo_Computo/pregunta3_3.css
 delete mode 100644 src/components/Equipo_Computo/pregunta3_4.css
 delete mode 100644 src/components/Equipo_Computo/pregunta3_5.css

diff --git a/src/app/(Administrador)/reporte/page.tsx b/src/app/(Administrador)/reporte/page.tsx
index 19ca929..d8a1f6c 100644
--- a/src/app/(Administrador)/reporte/page.tsx
+++ b/src/app/(Administrador)/reporte/page.tsx
@@ -2,39 +2,26 @@
 
 import { useState } from "react";
 import Pregunta1 from "@/components/Equipo_Computo/Pregunta1";
-import Pregunta1_1 from "@/components/Equipo_Computo/Pregunta1_1";
+import Pregutna2 from "@/components/Equipo_Computo/Pregunta2";
 import Pregunta2_1 from "@/components/Equipo_Computo/Pregunta2_1";
 import Pregunta3 from "@/components/Equipo_Computo/Pregunta3";
-import Pregunta3_1 from "@/components/Equipo_Computo/Pregunta3_1";
-import Pregunta3_2 from "@/components/Equipo_Computo/Pregunta3_2";
-import Pregunta3_3 from "@/components/Equipo_Computo/Pregunta3_3";
-import Pregunta3_4 from "@/components/Equipo_Computo/Pregunta3_4";
-import Pregunta3_5 from "@/components/Equipo_Computo/Pregunta3_5";
 import Pregunta7EP from "@/components/Perifericos/Pregunta7EP";
 import Pregunta9 from "@/components/Equipo_Computo/Pregunta9";
 import "../../styles/layout/reporte.scss";
 
 type PreguntaKey =
   | "pregunta1"
+  | "pregunta2"
   | "pregunta2_1"
   | "pregunta3"
-  | "pregunta3_1"
-  | "pregunta3_2"
-  | "pregunta3_3"
-  | "pregunta3_4"
-  | "pregunta3_5"
   | "pregunta7EP"
   | "pregunta9";
 
 const LABELS: Record<PreguntaKey, string> = {
   pregunta1: "Pregunta 1 ",
+  pregunta2: "Pregunta 2",
   pregunta2_1: "Pregunta 2.1",
   pregunta3: "Pregunta 3",
-  pregunta3_1: "Pregunta 3.1",
-  pregunta3_2: "Pregunta 3.2",
-  pregunta3_3: "Pregunta 3.3",
-  pregunta3_4: "Pregunta 3.4",
-  pregunta3_5: "Pregunta 3.5",
   pregunta7EP: "Pregunta 7 EP",
   pregunta9: "Pregunta 9",
 };
@@ -42,13 +29,9 @@ const LABELS: Record<PreguntaKey, string> = {
 // Mapeo de fondo por pregunta (puedes personalizarlo)
 const TAB_BACKGROUNDS: Record<PreguntaKey, string> = {
   pregunta1: "bg-gray",
+  pregunta2: "bg-gray",
   pregunta2_1: "bg-gray",
   pregunta3: "bg-gray",
-  pregunta3_1: "bg-gray",
-  pregunta3_2: "bg-gray",
-  pregunta3_3: "bg-gray", 
-  pregunta3_4: "bg-gray",
-  pregunta3_5: "bg-gray",
   pregunta7EP: "bg-gray",
   pregunta9: "bg-blue",
 };
@@ -60,22 +43,12 @@ export default function Page() {
     switch (activeTab) {
       case "pregunta1":
         return <Pregunta1 />;
-      case "pregunta1":
-        return <Pregunta1 />;
+      case "pregunta2":
+        return <Pregutna2 />;
       case "pregunta2_1":
         return <Pregunta2_1 />;
       case "pregunta3":
         return <Pregunta3 />;
-      case "pregunta3_1":
-        return <Pregunta3_1 />;
-      case "pregunta3_2":
-        return <Pregunta3_2 />;
-      case "pregunta3_3":
-        return <Pregunta3_3 />;
-      case "pregunta3_4":
-        return <Pregunta3_4 />;
-      case "pregunta3_5":
-        return <Pregunta3_5 />;
       case "pregunta7EP":
         return <Pregunta7EP />;
       case "pregunta9":
diff --git a/src/app/styles/layout/reporte.scss b/src/app/styles/layout/reporte.scss
index f4841ab..2697f9c 100644
--- a/src/app/styles/layout/reporte.scss
+++ b/src/app/styles/layout/reporte.scss
@@ -88,7 +88,7 @@
 .data-table_reporte {
   padding: 20px;
   background-color: #f5f5f7;
-  
+
   border: none;
   min-height: 300px;
   animation: fadein 0.2s ease;
diff --git a/src/components/Equipo_Computo/Pregunta1.tsx b/src/components/Equipo_Computo/Pregunta1.tsx
index 56819d6..a13e83a 100644
--- a/src/components/Equipo_Computo/Pregunta1.tsx
+++ b/src/components/Equipo_Computo/Pregunta1.tsx
@@ -1,129 +1,242 @@
 "use client";
+import "./pregunta1.module.scss"
 
-import { useState } from "react";
-import styles from "./pregunta1.module.scss";
-
-type OsEntry = {
-  os: string;
-  count: number;
-  isTotal?: boolean;
-};
-
-type PlatformKey =
-  | "pc-desktop"
-  | "apple-desktop"
-  | "pc-laptop"
-  | "apple-laptop"
-  | "servers";
-
-type PlatformData = Record<PlatformKey, OsEntry[]>;
-
-const MOCK_DATA: PlatformData = {
-  "pc-desktop": [
-    { os: "Windows 11", count: 408 },
-    { os: "Windows 10", count: 1171 },
-    { os: "Windows 7/8", count: 177 },
-    { os: "Windows XP/Vista", count: 43 },
-    { os: "Linux", count: 45 },
-    { os: "Total", count: 1844, isTotal: true },
-  ],
-  "apple-desktop": [
-    { os: "Mac OS X (13 - Ventura, 14 - Sonoma)", count: 205 },
-    {
-      os: "Mac OS X (Mojave, Catalina, 11 - Big Sur, 12 - Monterrey)",
-      count: 180,
-    },
-    { os: "Mac OS X (Yosemite, El Capitan, Sierra, High Sierra)", count: 95 },
-    { os: "Mac OS X (Snow Leopard, Mountain Lion, Mavericks)", count: 6 },
-    { os: "Total", count: 480, isTotal: true },
-  ],
-  "pc-laptop": [
-    { os: "Windows 11", count: 40 },
-    { os: "Windows 10", count: 171 },
-    { os: "Windows 7/8", count: 17 },
-    { os: "Windows XP/Vista", count: 3 },
-    { os: "Linux", count: 5 },
-    { os: "Total", count: 236, isTotal: true },
-  ],
-  "apple-laptop": [
-    { os: "Mac OS X (13 - Ventura, 14 - Sonoma)", count: 205 },
-    {
-      os: "Mac OS X (Mojave, Catalina, 11 - Big Sur, 12 - Monterrey)",
-      count: 180,
-    },
-    { os: "Mac OS X (Yosemite, El Capitan, Sierra, High Sierra)", count: 95 },
-    { os: "Mac OS X (Snow Leopard, Mountain Lion, Mavericks)", count: 6 },
-    { os: "Total", count: 480, isTotal: true },
-  ],
-  servers: [
-    {
-      os: "Linux (CentOS, Fedora, Ubuntu, Red Hat Enterprise, entre otros)",
-      count: 120,
-    },
-    { os: "Unix (AIX, Mac OS Server, Solaris, etc.)", count: 80 },
-    { os: "Windows Server 2022/2023", count: 50 },
-    { os: "Windows Server 2016/2019", count: 80 },
-    { os: "Windows Server 2008/2012", count: 50 },
-    { os: "Windows Server 2000/2003", count: 12 },
-    { os: "Total", count: 392, isTotal: true },
-  ],
-};
-
-const PLATFORM_LABELS: Record<PlatformKey, string> = {
-  "pc-desktop": "Computadoras de escritorio Plataforma PC",
-  "apple-desktop": "Computadoras de escritorio Plataforma Apple",
-  "pc-laptop": "Computadoras portátiles Plataforma PC",
-  "apple-laptop": "Computadoras portátiles Plataforma Apple",
-  servers: "Servidores de alto rendimiento",
-};
-
-export default function Pregunta1() {
-  const [activeTab, setActiveTab] = useState<PlatformKey>("pc-desktop");
-
-  const currentData = MOCK_DATA[activeTab];
-
+export default function Pregunta1_1() {
   return (
-    <div className={styles.scanView_P1}>
-      <div className={styles.container_P1}>
-        <div className={styles.header_P1}>
-          Presione cada pestaña para ver la información de las plataformas.
-        </div>
+    <section>
+      <div>
+        <h1>Censo Equipos de computo</h1>
+        <p className="instructions">
+          Desglosa en cada renglon el número de equipos de cómputo dedicado por
+          cada categoría enlistada, de acuerdo con el perfil del usuario al que
+          se destina su uso primordialmente.
+        </p>
 
-        <div className={styles["main-content_P1"]}>
-          {/* Tabs */}
-          <div className={styles.tabs_P1}>
-            {Object.entries(PLATFORM_LABELS).map(([key, label]) => (
-              <button
-                key={key}
-                className={`${styles.tab_P1} ${
-                  activeTab === key ? styles.active_P1 : ""
-                }`}
-                onClick={() => setActiveTab(key as PlatformKey)}
-                aria-selected={activeTab === key}
-              >
-                {label}
-              </button>
-            ))}
+        <div className="container">
+
+          {/* ===================== */}
+          {/* 1. COMPUTADORAS DE ESCRITORIO */}
+          {/* ===================== */}
+          <div className="table-container">
+            <table>
+              <thead>
+                <tr>
+                  <th>Computadoras de escritorio</th>
+                  <th>Alumnos</th>
+                  <th>Profesores</th>
+                  <th>Tecnicos Academicos</th>
+                  <th>Investigadores</th>
+                  <th>Administrativos</th>
+                  <th>Total</th>
+                </tr>
+              </thead>
+
+              <tbody>
+
+                {/* Windows */}
+                <tr>
+                  <th>Windows</th>
+                  <td><input type="number" className="numero" /></td>
+                  <td><input type="number" className="numero" /></td>
+                  <td><input type="number" className="numero" /></td>
+                  <td><input type="number" className="numero" /></td>
+                  <td><input type="number" className="numero" /></td>
+                  <th>10</th>
+                </tr>
+
+                {/* Linux */}
+                <tr>
+                  <th>Linux</th>
+                  <td><input type="number" className="numero" /></td>
+                  <td><input type="number" className="numero" /></td>
+                  <td><input type="number" className="numero" /></td>
+                  <td><input type="number" className="numero" /></td>
+                  <td><input type="number" className="numero" /></td>
+                  <th>10</th>
+                </tr>
+
+                {/* Mac OS */}
+                <tr>
+                  <th>Mac OS</th>
+                  <td><input type="number" className="numero" /></td>
+                  <td><input type="number" className="numero" /></td>
+                  <td><input type="number" className="numero" /></td>
+                  <td><input type="number" className="numero" /></td>
+                  <td><input type="number" className="numero" /></td>
+                  <th>10</th>
+                </tr>
+
+                {/* Totales */}
+                <tr>
+                  <th>Total</th>
+                  <th>10</th>
+                  <th>10</th>
+                  <th>10</th>
+                  <th>10</th>
+                  <th>10</th>
+                  <th>10</th>
+                </tr>
+
+              </tbody>
+            </table>
           </div>
 
-          {/* Data Table */}
-          <div className={styles["data-table-wrapper_P1"]}>
-            <div className={styles["data-table_P1"]}>
-              {currentData.map((item, index) => (
-                <div
-                  key={index}
-                  className={`${styles["data-row_P1"]} ${
-                    item.isTotal ? styles["total-row_P1"] : ""
-                  }`}
-                >
-                  <div className={styles["os-name_P1"]}>{item.os}</div>
-                  <div className={styles["count-box_P1"]}>{item.count}</div>
-                </div>
-              ))}
-            </div>
+          {/* ===================== */}
+          {/* 2. COMPUTADORAS PORTÁTILES */}
+          {/* ===================== */}
+          <div className="table-container">
+            <table>
+              <thead>
+                <tr>
+                  <th>Computadoras portátiles</th>
+                  <th>Alumnos</th>
+                  <th>Profesores</th>
+                  <th>Tecnicos Academicos</th>
+                  <th>Investigadores</th>
+                  <th>Administrativos</th>
+                  <th>Total</th>
+                </tr>
+              </thead>
+
+              <tbody>
+
+                {/* Windows */}
+                <tr>
+                  <th>Windows</th>
+                  <td><input type="number" className="numero" /></td>
+                  <td><input type="number" className="numero" /></td>
+                  <td><input type="number" className="numero" /></td>
+                  <td><input type="number" className="numero" /></td>
+                  <td><input type="number" className="numero" /></td>
+                  <th>10</th>
+                </tr>
+
+                {/* Chromebook */}
+                <tr>
+                  <th>Chromebook</th>
+                  <td><input type="number" className="numero" /></td>
+                  <td><input type="number" className="numero" /></td>
+                  <td><input type="number" className="numero" /></td>
+                  <td><input type="number" className="numero" /></td>
+                  <td><input type="number" className="numero" /></td>
+                  <th>10</th>
+                </tr>
+
+                {/* Mac OS */}
+                <tr>
+                  <th>Mac OS</th>
+                  <td><input type="number" className="numero" /></td>
+                  <td><input type="number" className="numero" /></td>
+                  <td><input type="number" className="numero" /></td>
+                  <td><input type="number" className="numero" /></td>
+                  <td><input type="number" className="numero" /></td>
+                  <th>10</th>
+                </tr>
+
+                {/* Totales */}
+                <tr>
+                  <th>Total</th>
+                  <th>10</th><th>10</th><th>10</th><th>10</th><th>10</th>
+                  <th>10</th>
+                </tr>
+
+              </tbody>
+            </table>
           </div>
+
+          {/* ===================== */}
+          {/* 3. TABLETAS */}
+          {/* ===================== */}
+          <div className="table-container">
+            <table>
+              <thead>
+                <tr>
+                  <th>Tabletas</th>
+                  <th>Alumnos</th>
+                  <th>Profesores</th>
+                  <th>Tecnicos Academicos</th>
+                  <th>Investigadores</th>
+                  <th>Administrativos</th>
+                  <th>Total</th>
+                </tr>
+              </thead>
+
+              <tbody>
+
+                {/* Android */}
+                <tr>
+                  <th>Android</th>
+                  <td><input type="number" className="numero" /></td>
+                  <td><input type="number" className="numero" /></td>
+                  <td><input type="number" className="numero" /></td>
+                  <td><input type="number" className="numero" /></td>
+                  <td><input type="number" className="numero" /></td>
+                  <th>10</th>
+                </tr>
+
+                {/* iPad IOS */}
+                <tr>
+                  <th>iPad iOS</th>
+                  <td><input type="number" className="numero" /></td>
+                  <td><input type="number" className="numero" /></td>
+                  <td><input type="number" className="numero" /></td>
+                  <td><input type="number" className="numero" /></td>
+                  <td><input type="number" className="numero" /></td>
+                  <th>10</th>
+                </tr>
+
+                {/* Totales */}
+                <tr>
+                  <th>Total</th>
+                  <th>10</th><th>10</th><th>10</th><th>10</th><th>10</th>
+                  <th>10</th>
+                </tr>
+
+              </tbody>
+            </table>
+          </div>
+
+          {/* ===================== */}
+          {/* 4. ALTO RENDIMIENTO */}
+          {/* ===================== */}
+          <div className="table-container">
+            <table>
+              <thead>
+                <tr>
+                  <th>Alto Rendimiento</th>
+                  <th>Alumnos</th>
+                  <th>Profesores</th>
+                  <th>Tecnicos Academicos</th>
+                  <th>Investigadores</th>
+                  <th>Administrativos</th>
+                  <th>Total</th>
+                </tr>
+              </thead>
+
+              <tbody>
+
+                <tr>
+                  <th>Servidores</th>
+                  <td><input type="number" className="numero" /></td>
+                  <td><input type="number" className="numero" /></td>
+                  <td><input type="number" className="numero" /></td>
+                  <td><input type="number" className="numero" /></td>
+                  <td><input type="number" className="numero" /></td>
+                  <th>10</th>
+                </tr>
+
+                <tr>
+                  <th>Total</th>
+                  <th>10</th><th>10</th><th>10</th><th>10</th><th>10</th>
+                  <th>10</th>
+                </tr>
+
+              </tbody>
+            </table>
+          </div>
+
         </div>
       </div>
-    </div>
+    </section>
   );
 }
diff --git a/src/components/Equipo_Computo/Pregunta1_1.tsx b/src/components/Equipo_Computo/Pregunta1_1.tsx
deleted file mode 100644
index d16b1c3..0000000
--- a/src/components/Equipo_Computo/Pregunta1_1.tsx
+++ /dev/null
@@ -1,242 +0,0 @@
-"use client";
-import "./pregunta1_1.module.scss"
-
-export default function Pregunta1_1() {
-  return (
-    <section>
-      <div>
-        <h1>Censo Equipos de computo</h1>
-        <p className="instructions">
-          Desglosa en cada renglon el número de equipos de cómputo dedicado por
-          cada categoría enlistada, de acuerdo con el perfil del usuario al que
-          se destina su uso primordialmente.
-        </p>
-
-        <div className="container">
-
-          {/* ===================== */}
-          {/* 1. COMPUTADORAS DE ESCRITORIO */}
-          {/* ===================== */}
-          <div className="table-container">
-            <table>
-              <thead>
-                <tr>
-                  <th>Computadoras de escritorio</th>
-                  <th>Alumnos</th>
-                  <th>Profesores</th>
-                  <th>Tecnicos Academicos</th>
-                  <th>Investigadores</th>
-                  <th>Administrativos</th>
-                  <th>Total</th>
-                </tr>
-              </thead>
-
-              <tbody>
-
-                {/* Windows */}
-                <tr>
-                  <th>Windows</th>
-                  <td><input type="number" className="numero" /></td>
-                  <td><input type="number" className="numero" /></td>
-                  <td><input type="number" className="numero" /></td>
-                  <td><input type="number" className="numero" /></td>
-                  <td><input type="number" className="numero" /></td>
-                  <th>10</th>
-                </tr>
-
-                {/* Linux */}
-                <tr>
-                  <th>Linux</th>
-                  <td><input type="number" className="numero" /></td>
-                  <td><input type="number" className="numero" /></td>
-                  <td><input type="number" className="numero" /></td>
-                  <td><input type="number" className="numero" /></td>
-                  <td><input type="number" className="numero" /></td>
-                  <th>10</th>
-                </tr>
-
-                {/* Mac OS */}
-                <tr>
-                  <th>Mac OS</th>
-                  <td><input type="number" className="numero" /></td>
-                  <td><input type="number" className="numero" /></td>
-                  <td><input type="number" className="numero" /></td>
-                  <td><input type="number" className="numero" /></td>
-                  <td><input type="number" className="numero" /></td>
-                  <th>10</th>
-                </tr>
-
-                {/* Totales */}
-                <tr>
-                  <th>Total</th>
-                  <th>10</th>
-                  <th>10</th>
-                  <th>10</th>
-                  <th>10</th>
-                  <th>10</th>
-                  <th>10</th>
-                </tr>
-
-              </tbody>
-            </table>
-          </div>
-
-          {/* ===================== */}
-          {/* 2. COMPUTADORAS PORTÁTILES */}
-          {/* ===================== */}
-          <div className="table-container">
-            <table>
-              <thead>
-                <tr>
-                  <th>Computadoras portátiles</th>
-                  <th>Alumnos</th>
-                  <th>Profesores</th>
-                  <th>Tecnicos Academicos</th>
-                  <th>Investigadores</th>
-                  <th>Administrativos</th>
-                  <th>Total</th>
-                </tr>
-              </thead>
-
-              <tbody>
-
-                {/* Windows */}
-                <tr>
-                  <th>Windows</th>
-                  <td><input type="number" className="numero" /></td>
-                  <td><input type="number" className="numero" /></td>
-                  <td><input type="number" className="numero" /></td>
-                  <td><input type="number" className="numero" /></td>
-                  <td><input type="number" className="numero" /></td>
-                  <th>10</th>
-                </tr>
-
-                {/* Chromebook */}
-                <tr>
-                  <th>Chromebook</th>
-                  <td><input type="number" className="numero" /></td>
-                  <td><input type="number" className="numero" /></td>
-                  <td><input type="number" className="numero" /></td>
-                  <td><input type="number" className="numero" /></td>
-                  <td><input type="number" className="numero" /></td>
-                  <th>10</th>
-                </tr>
-
-                {/* Mac OS */}
-                <tr>
-                  <th>Mac OS</th>
-                  <td><input type="number" className="numero" /></td>
-                  <td><input type="number" className="numero" /></td>
-                  <td><input type="number" className="numero" /></td>
-                  <td><input type="number" className="numero" /></td>
-                  <td><input type="number" className="numero" /></td>
-                  <th>10</th>
-                </tr>
-
-                {/* Totales */}
-                <tr>
-                  <th>Total</th>
-                  <th>10</th><th>10</th><th>10</th><th>10</th><th>10</th>
-                  <th>10</th>
-                </tr>
-
-              </tbody>
-            </table>
-          </div>
-
-          {/* ===================== */}
-          {/* 3. TABLETAS */}
-          {/* ===================== */}
-          <div className="table-container">
-            <table>
-              <thead>
-                <tr>
-                  <th>Tabletas</th>
-                  <th>Alumnos</th>
-                  <th>Profesores</th>
-                  <th>Tecnicos Academicos</th>
-                  <th>Investigadores</th>
-                  <th>Administrativos</th>
-                  <th>Total</th>
-                </tr>
-              </thead>
-
-              <tbody>
-
-                {/* Android */}
-                <tr>
-                  <th>Android</th>
-                  <td><input type="number" className="numero" /></td>
-                  <td><input type="number" className="numero" /></td>
-                  <td><input type="number" className="numero" /></td>
-                  <td><input type="number" className="numero" /></td>
-                  <td><input type="number" className="numero" /></td>
-                  <th>10</th>
-                </tr>
-
-                {/* iPad IOS */}
-                <tr>
-                  <th>iPad iOS</th>
-                  <td><input type="number" className="numero" /></td>
-                  <td><input type="number" className="numero" /></td>
-                  <td><input type="number" className="numero" /></td>
-                  <td><input type="number" className="numero" /></td>
-                  <td><input type="number" className="numero" /></td>
-                  <th>10</th>
-                </tr>
-
-                {/* Totales */}
-                <tr>
-                  <th>Total</th>
-                  <th>10</th><th>10</th><th>10</th><th>10</th><th>10</th>
-                  <th>10</th>
-                </tr>
-
-              </tbody>
-            </table>
-          </div>
-
-          {/* ===================== */}
-          {/* 4. ALTO RENDIMIENTO */}
-          {/* ===================== */}
-          <div className="table-container">
-            <table>
-              <thead>
-                <tr>
-                  <th>Alto Rendimiento</th>
-                  <th>Alumnos</th>
-                  <th>Profesores</th>
-                  <th>Tecnicos Academicos</th>
-                  <th>Investigadores</th>
-                  <th>Administrativos</th>
-                  <th>Total</th>
-                </tr>
-              </thead>
-
-              <tbody>
-
-                <tr>
-                  <th>Servidores</th>
-                  <td><input type="number" className="numero" /></td>
-                  <td><input type="number" className="numero" /></td>
-                  <td><input type="number" className="numero" /></td>
-                  <td><input type="number" className="numero" /></td>
-                  <td><input type="number" className="numero" /></td>
-                  <th>10</th>
-                </tr>
-
-                <tr>
-                  <th>Total</th>
-                  <th>10</th><th>10</th><th>10</th><th>10</th><th>10</th>
-                  <th>10</th>
-                </tr>
-
-              </tbody>
-            </table>
-          </div>
-
-        </div>
-      </div>
-    </section>
-  );
-}
diff --git a/src/components/Equipo_Computo/Pregunta2.tsx b/src/components/Equipo_Computo/Pregunta2.tsx
index 42b3e52..243917a 100644
--- a/src/components/Equipo_Computo/Pregunta2.tsx
+++ b/src/components/Equipo_Computo/Pregunta2.tsx
@@ -1,158 +1,128 @@
 "use client";
 
-import { useState, useEffect } from "react";
-import "./pregunta2.scss";
+import { useState } from "react";
+import styles from "./pregunta2.module.scss";
 
-// Tipos
 type OsEntry = {
   os: string;
-  count: string; // o number si la API devuelve números
+  count: number;
   isTotal?: boolean;
 };
 
-type PlatformData = {
-  [key: string]: OsEntry[];
-};
+type PlatformKey =
+  | "pc-desktop"
+  | "apple-desktop"
+  | "pc-laptop"
+  | "apple-laptop"
+  | "servers";
+
+type PlatformData = Record<PlatformKey, OsEntry[]>;
 
-// === DATOS TEMPORALES (mock) ===
 const MOCK_DATA: PlatformData = {
   "pc-desktop": [
-    { os: "Windows 11", count: "408" },
-    { os: "Windows 10", count: "1171" },
-    { os: "Windows 7/8", count: "177" },
-    { os: "Windows XP/Vista", count: "43" },
-    { os: "Linux", count: "45" },
-    { os: "Total", count: "1844", isTotal: true },
+    { os: "Windows 11", count: 408 },
+    { os: "Windows 10", count: 1171 },
+    { os: "Windows 7/8", count: 177 },
+    { os: "Windows XP/Vista", count: 43 },
+    { os: "Linux", count: 45 },
+    { os: "Total", count: 1844, isTotal: true },
   ],
   "apple-desktop": [
-    { os: "Mac OS X(13 - Ventura, 14 - Sonoma)", count: "205" },
+    { os: "Mac OS X (13 - Ventura, 14 - Sonoma)", count: 205 },
     {
-      os: "Mac OS X(Mojave,Catalina,11 - Big Sur, 12 - Monterrey)",
-      count: "180",
+      os: "Mac OS X (Mojave, Catalina, 11 - Big Sur, 12 - Monterrey)",
+      count: 180,
     },
-    { os: "Mac OS X(Yosemite,El Capitan,Sierra,High Sierra)", count: "95" },
-    { os: "Mac OS X(Snow Leopard,Mountain Lion,Mavericks)", count: "6" },
-    { os: "Total", count: "480", isTotal: true },
+    { os: "Mac OS X (Yosemite, El Capitan, Sierra, High Sierra)", count: 95 },
+    { os: "Mac OS X (Snow Leopard, Mountain Lion, Mavericks)", count: 6 },
+    { os: "Total", count: 480, isTotal: true },
   ],
   "pc-laptop": [
-    { os: "Windows 11", count: "40" },
-    { os: "Windows 10", count: "171" },
-    { os: "Windows 7/8", count: "17" },
-    { os: "Windows XP/Vista", count: "3" },
-    { os: "Linux", count: "5" },
-    { os: "Total", count: "144", isTotal: true },
+    { os: "Windows 11", count: 40 },
+    { os: "Windows 10", count: 171 },
+    { os: "Windows 7/8", count: 17 },
+    { os: "Windows XP/Vista", count: 3 },
+    { os: "Linux", count: 5 },
+    { os: "Total", count: 236, isTotal: true },
   ],
   "apple-laptop": [
-    { os: "Mac OS X(13 - Ventura, 14 - Sonoma)", count: "39" },
+    { os: "Mac OS X (13 - Ventura, 14 - Sonoma)", count: 205 },
     {
-      os: "Mac OS X(Mojave,Catalina,11 - Big Sur, 12 - Monterrey)",
-      count: "23",
+      os: "Mac OS X (Mojave, Catalina, 11 - Big Sur, 12 - Monterrey)",
+      count: 180,
     },
-    { os: "Mac OS X(Yosemite,El Capitan,Sierra,High Sierra)", count: "0" },
-    { os: "Mac OS X(Snow Leopard,Mountain Lion,Mavericks)", count: "9" },
-    { os: "Total", count: "71", isTotal: true },
+    { os: "Mac OS X (Yosemite, El Capitan, Sierra, High Sierra)", count: 95 },
+    { os: "Mac OS X (Snow Leopard, Mountain Lion, Mavericks)", count: 6 },
+    { os: "Total", count: 480, isTotal: true },
   ],
   servers: [
     {
-      os: "Linux (CentOs,Fedora,Ubuntu,Red Hat Enterprise,entre otros)",
-      count: "21",
+      os: "Linux (CentOS, Fedora, Ubuntu, Red Hat Enterprise, entre otros)",
+      count: 120,
     },
-    { os: "Unix (AIX,MAC OS Server,Solaris,entre otros)", count: "2" },
-    { os: "Windows Server 2022/2023", count: "6" },
-    { os: "Windows Server 2016/2019", count: "3" },
-    { os: "Windows Server 2008/2012", count: "3" },
-    { os: "Windows Server 2000/2003", count: "2" },
-    { os: "Total", count: "37", isTotal: true },
+    { os: "Unix (AIX, Mac OS Server, Solaris, etc.)", count: 80 },
+    { os: "Windows Server 2022/2023", count: 50 },
+    { os: "Windows Server 2016/2019", count: 80 },
+    { os: "Windows Server 2008/2012", count: 50 },
+    { os: "Windows Server 2000/2003", count: 12 },
+    { os: "Total", count: 392, isTotal: true },
   ],
 };
 
-const API_ENDPOINT = "/api/platform-stats"; // ← ¡Reemplaza esto cuando sepas la URL real!
+const PLATFORM_LABELS: Record<PlatformKey, string> = {
+  "pc-desktop": "Computadoras de escritorio Plataforma PC",
+  "apple-desktop": "Computadoras de escritorio Plataforma Apple",
+  "pc-laptop": "Computadoras portátiles Plataforma PC",
+  "apple-laptop": "Computadoras portátiles Plataforma Apple",
+  servers: "Servidores de alto rendimiento",
+};
 
-const Pregunta2= () => {
-  const [activeTab, setActiveTab] = useState<string>("pc-desktop");
-  const [data, setData] = useState<PlatformData>(MOCK_DATA);
-  const [loading, setLoading] = useState<boolean>(true);
-  const [error, setError] = useState<string | null>(null);
+export default function Pregunta1() {
+  const [activeTab, setActiveTab] = useState<PlatformKey>("pc-desktop");
 
-  useEffect(() => {
-    const fetchData = async () => {
-      try {
-        // === DESCOMENTA ESTO CUANDO TENGAS LA API ===
-        // const response = await fetch(API_ENDPOINT);
-        // if (!response.ok) throw new Error('Error al cargar estadísticas');
-        // const apiData: PlatformData = await response.json();
-        // setData(apiData);
-        // setLoading(false);
-
-        // === POR AHORA: usa datos simulados (y simula un retraso si quieres) ===
-        // await new Promise(resolve => setTimeout(resolve, 300));
-        setData(MOCK_DATA);
-        setLoading(false);
-      } catch (err) {
-        console.error("Error al cargar datos:", err);
-        setError(
-          "No se pudieron cargar las estadísticas. Usando datos temporales."
-        );
-        setData(MOCK_DATA); // fallback en caso de error
-        setLoading(false);
-      }
-    };
-
-    fetchData();
-  }, []);
-
-  const currentData = data[activeTab] || [];
-
-  // Si quisieras mostrar un estado de carga (opcional)
-  // if (loading) return <div className="dashboardContainer"><p>Cargando...</p></div>;
-  // if (error) console.warn(error); // o muestra un toast, etc.
+  const currentData = MOCK_DATA[activeTab];
 
   return (
-    <div className="dashboardContainer">
+    <div className={styles.scanView_P1}>
+      <div className={styles.container_P1}>
+        <div className={styles.header_P1}>
+          Presione cada pestaña para ver la información de las plataformas.
+        </div>
 
-      <div className="scanView">
-        <div className="container">
-          <div className="header">
-            Presione cada pestaña para ver la información de las plataformas.
+        <div className={styles["main-content_P1"]}>
+          {/* Tabs */}
+          <div className={styles.tabs_P1}>
+            {Object.entries(PLATFORM_LABELS).map(([key, label]) => (
+              <button
+                key={key}
+                className={`${styles.tab_P1} ${
+                  activeTab === key ? styles.active_P1 : ""
+                }`}
+                onClick={() => setActiveTab(key as PlatformKey)}
+                aria-selected={activeTab === key}
+              >
+                {label}
+              </button>
+            ))}
           </div>
 
-          <div className="main-content">
-            <div className="tabs">
-              {Object.entries({
-                "pc-desktop": "Computadoras de escritorio Plataforma PC",
-                "apple-desktop": "Computadoras de escritorio Plataforma Apple",
-                "pc-laptop": "Computadoras portátiles Plataforma PC",
-                "apple-laptop": "Computadoras portátiles Plataforma Apple",
-                servers: "Servidores de alto rendimiento",
-              }).map(([key, label]) => (
+          {/* Data Table */}
+            <div className={styles["data-table_P1"]}>
+              {currentData.map((item, index) => (
                 <div
-                  key={key}
-                  className={`tab ${activeTab === key ? "active" : ""}`}
-                  onClick={() => setActiveTab(key)}
+                  key={index}
+                  className={`${styles["data-row_P1"]} ${
+                    item.isTotal ? styles["total-row_P1"] : ""
+                  }`}
                 >
-                  {label}
+                  <div className={styles["os-name_P1"]}>{item.os}</div>
+                  <div className={styles["count-box_P1"]}>{item.count}</div>
                 </div>
               ))}
             </div>
-
-            <div className="data-table-wrapper">
-              <div className="data-table">
-                {currentData.map((item, index) => (
-                  <div
-                    key={index}
-                    className={`data-row ${item.isTotal ? "total-row" : ""}`}
-                  >
-                    <div className="os-name">{item.os}</div>
-                    <div className="count-box">{item.count}</div>
-                  </div>
-                ))}
-              </div>
-            </div>
-          </div>
+      
         </div>
       </div>
     </div>
   );
-};
-
-export default Pregunta2;
+}
diff --git a/src/components/Equipo_Computo/Pregunta3.tsx b/src/components/Equipo_Computo/Pregunta3.tsx
index 27e6f21..e57a9c2 100644
--- a/src/components/Equipo_Computo/Pregunta3.tsx
+++ b/src/components/Equipo_Computo/Pregunta3.tsx
@@ -1,366 +1,326 @@
 "use client";
 
-import React, { useState } from "react";
-import Link from "next/link";
-import "./pregunta3.css";
+import { useState } from "react";
+import styles from "./pregunta3.module.scss";
 
-export default function Pregunta3() {
-  const [activeTab, setActiveTab] = useState(0);
+type ProcessorEntry = {
+  tipo: string;
+  alumnos: string;
+  profesores: string;
+  tecnicos: string;
+  investigadores: string;
+  administrativos: string;
+  total: string;
+  isTotal?: boolean;
+};
 
-  const tabs = [
-    "Computadoras de escritorio Plataforma PC",
-    "Computadoras de escritorio Plataforma Apple",
-    "Computadoras portátiles Plataforma PC",
-    "Computadoras portátiles Plataforma Apple",
-    "Alto rendimiento Servidores",
-  ];
+type PlatformKey =
+  | "pc-desktop"
+  | "apple-desktop"
+  | "pc-laptop"
+  | "apple-laptop"
+  | "servers";
 
-  // === DATOS DE CADA TABLA ===
-  const data = [
-    // === 1. PC Escritorio ===
+type PlatformData = Record<PlatformKey, ProcessorEntry[]>;
+
+// Datos: solo "apple-desktop" tiene información en este caso
+const MOCK_DATA: PlatformData = {
+  "pc-desktop": [],
+  "apple-desktop": [
     {
-      color: "#16a34a",
-      headerColor: "#15803d",
-      rows: [
-        {
-          tipo: "Core i9 / Ryzen 9",
-          alumnos: "",
-          profesores: "",
-          tecnicos: "",
-          investigadores: "",
-          administrativos: "",
-          total: "0",
-        },
-        {
-          tipo: "Core i7 / Ryzen 7",
-          alumnos: "15",
-          profesores: "8",
-          tecnicos: "",
-          investigadores: "",
-          administrativos: "",
-          total: "23",
-        },
-        {
-          tipo: "Core i5 / Ryzen 5",
-          alumnos: "10",
-          profesores: "5",
-          tecnicos: "",
-          investigadores: "",
-          administrativos: "2",
-          total: "17",
-        },
-      ],
-      total: {
-        alumnos: "25",
-        profesores: "13",
-        tecnicos: "0",
-        investigadores: "0",
-        administrativos: "2",
-        total: "40",
-      },
+      tipo: "Core Ultra (i3, i5, i7) Serie 2",
+      alumnos: "",
+      profesores: "",
+      tecnicos: "",
+      investigadores: "",
+      administrativos: "",
+      total: "0",
     },
-    // === 2. Apple Escritorio ===
     {
-      color: "#a855f7",
-      headerColor: "#7e22ce",
-      rows: [
-        {
-          tipo: "Familia M3",
-          alumnos: "10",
-          profesores: "2",
-          tecnicos: "",
-          investigadores: "",
-          administrativos: "",
-          total: "12",
-        },
-        {
-          tipo: "Familia M2",
-          alumnos: "5",
-          profesores: "3",
-          tecnicos: "",
-          investigadores: "",
-          administrativos: "",
-          total: "8",
-        },
-      ],
-      total: {
-        alumnos: "15",
-        profesores: "5",
-        tecnicos: "0",
-        investigadores: "0",
-        administrativos: "0",
-        total: "20",
-      },
+      tipo: "Core Ultra (i3, i5, i7) Serie 1",
+      alumnos: "",
+      profesores: "",
+      tecnicos: "",
+      investigadores: "",
+      administrativos: "",
+      total: "0",
     },
-    // === 3. PC Portátiles ===
     {
-      color: "#22c55e",
-      headerColor: "#15803d",
-      rows: [
-        {
-          tipo: "Core i5 (12a generación)",
-          alumnos: "12",
-          profesores: "5",
-          tecnicos: "",
-          investigadores: "",
-          administrativos: "",
-          total: "17",
-        },
-        {
-          tipo: "Core i7 (13a generación)",
-          alumnos: "6",
-          profesores: "4",
-          tecnicos: "",
-          investigadores: "",
-          administrativos: "1",
-          total: "11",
-        },
-      ],
-      total: {
-        alumnos: "18",
-        profesores: "9",
-        tecnicos: "0",
-        investigadores: "0",
-        administrativos: "1",
-        total: "28",
-      },
+      tipo: "Familia M4",
+      alumnos: "",
+      profesores: "",
+      tecnicos: "",
+      investigadores: "",
+      administrativos: "2",
+      total: "2",
     },
-    // === 4. Apple Portátiles ===
     {
-      color: "#9333ea",
-      headerColor: "#7e22ce",
-      rows: [
-        {
-          tipo: "Familia M2",
-          alumnos: "35",
-          profesores: "3",
-          tecnicos: "",
-          investigadores: "",
-          administrativos: "",
-          total: "38",
-        },
-        {
-          tipo: "Familia M1",
-          alumnos: "",
-          profesores: "5",
-          tecnicos: "",
-          investigadores: "",
-          administrativos: "1",
-          total: "6",
-        },
-        {
-          tipo: "i5 o equivalentes (12a generación en adelante)",
-          alumnos: "",
-          profesores: "14",
-          tecnicos: "",
-          investigadores: "",
-          administrativos: "",
-          total: "14",
-        },
-      ],
-      total: {
-        alumnos: "35",
-        profesores: "31",
-        tecnicos: "0",
-        investigadores: "0",
-        administrativos: "5",
-        total: "71",
-      },
+      tipo: "Familia M3",
+      alumnos: "",
+      profesores: "1",
+      tecnicos: "",
+      investigadores: "",
+      administrativos: "1",
+      total: "2",
     },
-    // === 5. Servidores ===
     {
-      color: "#2563eb",
-      headerColor: "#1e40af",
-      rows: [
-        {
-          tipo: "Xeon E3, E5, E7",
-          alumnos: "19",
-          profesores: "",
-          tecnicos: "",
-          investigadores: "16",
-          administrativos: "",
-          total: "35",
-        },
-        {
-          tipo: "Xeon Bronce, Plata, Oro 6a generación",
-          alumnos: "",
-          profesores: "",
-          tecnicos: "",
-          investigadores: "",
-          administrativos: "1",
-          total: "1",
-        },
-        {
-          tipo: "Xeon Phi",
-          alumnos: "",
-          profesores: "",
-          tecnicos: "",
-          investigadores: "",
-          administrativos: "1",
-          total: "1",
-        },
-      ],
-      total: {
-        alumnos: "19",
-        profesores: "0",
-        tecnicos: "0",
-        investigadores: "16",
-        administrativos: "2",
-        total: "37",
-      },
+      tipo: "Familia M2",
+      alumnos: "",
+      profesores: "2",
+      tecnicos: "",
+      investigadores: "",
+      administrativos: "",
+      total: "2",
     },
-  ];
+    {
+      tipo: "Familia M1",
+      alumnos: "51",
+      profesores: "1",
+      tecnicos: "",
+      investigadores: "",
+      administrativos: "",
+      total: "52",
+    },
+    {
+      tipo: "i9 o equivalentes (13a generación en adelante)",
+      alumnos: "",
+      profesores: "",
+      tecnicos: "",
+      investigadores: "",
+      administrativos: "",
+      total: "0",
+    },
+    {
+      tipo: "i7 o equivalentes (13a generación en adelante)",
+      alumnos: "",
+      profesores: "",
+      tecnicos: "",
+      investigadores: "",
+      administrativos: "",
+      total: "0",
+    },
+    {
+      tipo: "i7 o equivalentes (12a generación en adelante)",
+      alumnos: "",
+      profesores: "",
+      tecnicos: "",
+      investigadores: "",
+      administrativos: "1",
+      total: "1",
+    },
+    {
+      tipo: "i5 o equivalentes (13a generación en adelante)",
+      alumnos: "",
+      profesores: "",
+      tecnicos: "",
+      investigadores: "",
+      administrativos: "1",
+      total: "1",
+    },
+    {
+      tipo: "i5 o equivalentes (12a generación en adelante)",
+      alumnos: "11",
+      profesores: "1",
+      tecnicos: "",
+      investigadores: "",
+      administrativos: "",
+      total: "12",
+    },
+    {
+      tipo: "i3 o equivalentes (13a generación en adelante)",
+      alumnos: "175",
+      profesores: "5",
+      tecnicos: "",
+      investigadores: "",
+      administrativos: "26",
+      total: "206",
+    },
+    {
+      tipo: "i3 o equivalentes (12a generación en adelante)",
+      alumnos: "",
+      profesores: "",
+      tecnicos: "",
+      investigadores: "",
+      administrativos: "1",
+      total: "1",
+    },
+    {
+      tipo: "i3 o equivalentes (11a generación en adelante)",
+      alumnos: "",
+      profesores: "2",
+      tecnicos: "",
+      investigadores: "",
+      administrativos: "",
+      total: "2",
+    },
+    {
+      tipo: "Core2 Mac, Quad Core o anteriores",
+      alumnos: "12",
+      profesores: "3",
+      tecnicos: "3",
+      investigadores: "",
+      administrativos: "3",
+      total: "21",
+    },
+    {
+      tipo: "Total",
+      alumnos: "249",
+      profesores: "14",
+      tecnicos: "3",
+      investigadores: "0",
+      administrativos: "37",
+      total: "303",
+      isTotal: true,
+    },
+  ],
+  "pc-laptop": [],
+  "apple-laptop": [],
+  servers: [],
+};
+
+const PLATFORM_LABELS: Record<PlatformKey, string> = {
+  "pc-desktop": "Computadoras de escritorio Plataforma PC",
+  "apple-desktop": "Computadoras de escritorio Plataforma Apple",
+  "pc-laptop": "Computadoras portátiles Plataforma PC",
+  "apple-laptop": "Computadoras portátiles Plataforma Apple",
+  servers: "Alto rendimiento Servidores",
+};
+
+export default function Pregunta3_2() {
+  const [activeTab, setActiveTab] = useState<PlatformKey>("apple-desktop");
+
+  const currentData = MOCK_DATA[activeTab];
 
   return (
-    <main className="pregunta-page">
-      <div className="pregunta-container">
-        <h1 className="pregunta-titulo">PREGUNTA 3 (1/5 - 5/5)</h1>
-
-        <section className="pregunta-seccion">
-          <p className="pregunta-texto">
-            3. Desglose la cantidad de población beneficiada por plataforma y
-            tipo de procesador: *
+    <div className={styles.scanView_P3}>
+      <div className={styles.container_P3}>
+        <div className={styles.header_P3}>
+          <h1 className={styles.titulo}>PREGUNTA 3 (2/5)</h1>
+          <p className={styles.texto}>
+            3. Desglose la cantidad de población beneficiada por plataforma y tipo de procesador: *
           </p>
-          <p className="pregunta-subtexto">
+          <p className={styles.subtexto}>
             Presione cada pestaña para ingresar la información.
           </p>
+        </div>
 
-          {/* === PESTAÑAS === */}
-          <div className="tab-container">
-            {tabs.map((tab, index) => (
-              <div
-                key={index}
-                className={`tab ${activeTab === index ? "active" : "inactive"}`}
-                style={
-                  activeTab === index
-                    ? {
-                        borderBottomColor: data[index].color,
-                        color: data[index].color,
-                      }
-                    : {}
-                }
-                onClick={() => setActiveTab(index)}
+        {/* Contenido principal con pestañas a la izquierda */}
+        <div className={styles.mainContent_P3}>
+          {/* Pestañas verticales (izquierda) */}
+          <div className={styles.tabs_P3}>
+            {Object.entries(PLATFORM_LABELS).map(([key, label]) => (
+              <button
+                key={key}
+                className={`${styles.tab_P3} ${
+                  activeTab === key ? styles.active_P3 : ""
+                }`}
+                onClick={() => setActiveTab(key as PlatformKey)}
+                aria-selected={activeTab === key}
               >
-                {tab}
-              </div>
+                {label}
+              </button>
             ))}
           </div>
 
-          {/* === TABLA === */}
-          <div className="tabla-container">
-            <table className="tabla">
-              <thead>
-                <tr>
-                  <th
-                    rowSpan={2}
-                    className="header-procesador"
-                    style={{ backgroundColor: data[activeTab].color }}
-                  >
-                    Tipo de procesador
-                  </th>
-                  <th
-                    colSpan={5}
-                    className="header-poblacion"
-                    style={{ backgroundColor: data[activeTab].headerColor }}
-                  >
-                    Población Beneficiada
-                  </th>
-                  <th
-                    rowSpan={2}
-                    className="header-total"
-                    style={{ backgroundColor: data[activeTab].color }}
-                  >
-                    Total
-                  </th>
-                </tr>
-                <tr>
-                  <th className="sub-header">Alumnos</th>
-                  <th className="sub-header">Profesores</th>
-                  <th className="sub-header">Técnicos</th>
-                  <th className="sub-header">Investigadores</th>
-                  <th className="sub-header">Administrativos</th>
-                </tr>
-              </thead>
-              <tbody>
-                {data[activeTab].rows.map((item, i) => (
-                  <tr key={i}>
-                    <td className="tipo-procesador">{item.tipo}</td>
-                    <td>
-                      <input type="text" value={item.alumnos} readOnly />
-                    </td>
-                    <td>
-                      <input type="text" value={item.profesores} readOnly />
-                    </td>
-                    <td>
-                      <input type="text" value={item.tecnicos} readOnly />
-                    </td>
-                    <td>
-                      <input type="text" value={item.investigadores} readOnly />
-                    </td>
-                    <td>
-                      <input
-                        type="text"
-                        value={item.administrativos}
-                        readOnly
-                      />
-                    </td>
-                    <td className="total-celda">{item.total}</td>
-                  </tr>
-                ))}
-                <tr className="fila-total">
-                  <td className="tipo-procesador">Total</td>
-                  <td>
-                    <input
-                      type="text"
-                      value={data[activeTab].total.alumnos}
-                      readOnly
-                    />
-                  </td>
-                  <td>
-                    <input
-                      type="text"
-                      value={data[activeTab].total.profesores}
-                      readOnly
-                    />
-                  </td>
-                  <td>
-                    <input
-                      type="text"
-                      value={data[activeTab].total.tecnicos}
-                      readOnly
-                    />
-                  </td>
-                  <td>
-                    <input
-                      type="text"
-                      value={data[activeTab].total.investigadores}
-                      readOnly
-                    />
-                  </td>
-                  <td>
-                    <input
-                      type="text"
-                      value={data[activeTab].total.administrativos}
-                      readOnly
-                    />
-                  </td>
-                  <td className="total-celda">{data[activeTab].total.total}</td>
-                </tr>
-              </tbody>
-            </table>
-
-            <button className="boton-consultar">
-              Consultar las equivalencias de procesadores
-            </button>
+          {/* Contenido de la tabla (derecha) */}
+          <div className={styles.content_P3}>
+            {currentData.length > 0 ? (
+              <>
+                <div className={styles.tableWrapper_P3}>
+                  <table className={styles.table_P3}>
+                    <thead>
+                      <tr>
+                        <th rowSpan={2} className={styles.headerProcesador}>
+                          {activeTab.includes("apple")
+                            ? "Plataforma Apple"
+                            : "Plataforma PC"}{" "}
+                          <br />
+                          Tipo de procesador
+                        </th>
+                        <th colSpan={5} className={styles.headerPoblacion}>
+                          Población Beneficiada
+                        </th>
+                        <th rowSpan={2} className={styles.headerTotal}>
+                          Total
+                        </th>
+                      </tr>
+                      <tr>
+                        <th className={styles.subHeader}>Alumnos</th>
+                        <th className={styles.subHeader}>Profesores</th>
+                        <th className={styles.subHeader}>Técnicos Académicos</th>
+                        <th className={styles.subHeader}>Investigadores</th>
+                        <th className={styles.subHeader}>Administrativos</th>
+                      </tr>
+                    </thead>
+                    <tbody>
+                      {currentData.map((item, index) => (
+                        <tr
+                          key={index}
+                          className={
+                            item.isTotal ? styles.totalRow_P3 : styles.dataRow_P3
+                          }
+                        >
+                          <td className={styles.processor_P3}>{item.tipo}</td>
+                          <td>
+                            <input
+                              type="text"
+                              value={item.alumnos}
+                              readOnly
+                              className={styles.inputBox_P3}
+                            />
+                          </td>
+                          <td>
+                            <input
+                              type="text"
+                              value={item.profesores}
+                              readOnly
+                              className={styles.inputBox_P3}
+                            />
+                          </td>
+                          <td>
+                            <input
+                              type="text"
+                              value={item.tecnicos}
+                              readOnly
+                              className={styles.inputBox_P3}
+                            />
+                          </td>
+                          <td>
+                            <input
+                              type="text"
+                              value={item.investigadores}
+                              readOnly
+                              className={styles.inputBox_P3}
+                            />
+                          </td>
+                          <td>
+                            <input
+                              type="text"
+                              value={item.administrativos}
+                              readOnly
+                              className={styles.inputBox_P3}
+                            />
+                          </td>
+                          <td className={styles.totalCell_P3}>{item.total}</td>
+                        </tr>
+                      ))}
+                    </tbody>
+                  </table>
+                </div>
+                <button className={styles.consultarBtn_P3}>
+                  Consultar las equivalencias de procesadores
+                </button>
+              </>
+            ) : (
+              <div className={styles.emptyState_P3}>
+                No hay datos disponibles para esta plataforma.
+              </div>
+            )}
           </div>
-        </section>
-
-        <div className="boton-contenedor">
-          <Link href="/" className="boton volver">
-            ← Volver al inicio
-          </Link>
         </div>
+
+        
       </div>
-    </main>
+    </div>
   );
-}
+}
\ No newline at end of file
diff --git a/src/components/Equipo_Computo/Pregunta3_1.tsx b/src/components/Equipo_Computo/Pregunta3_1.tsx
deleted file mode 100644
index abaedfb..0000000
--- a/src/components/Equipo_Computo/Pregunta3_1.tsx
+++ /dev/null
@@ -1,248 +0,0 @@
-"use client";
-
-import React from "react";
-import Link from "next/link";
-import "./pregunta3_1.css";
-
-export default function pregunta3_1() {
-  const data = [
-    {
-      tipo: "Core Ultra (i3, i5, i7) Serie 2",
-      alumnos: "",
-      profesores: "",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "",
-      total: "0",
-    },
-    {
-      tipo: "Core Ultra (i3, i5, i7) Serie 1",
-      alumnos: "",
-      profesores: "",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "",
-      total: "0",
-    },
-    {
-      tipo: "i9 o equivalentes (13a generación en adelante)",
-      alumnos: "",
-      profesores: "",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "",
-      total: "0",
-    },
-    {
-      tipo: "i7 o equivalentes (13a generación en adelante)",
-      alumnos: "15",
-      profesores: "16",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "52",
-      total: "97",
-    },
-    {
-      tipo: "i7 o equivalentes (12a generación en adelante)",
-      alumnos: "29",
-      profesores: "16",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "52",
-      total: "97",
-    },
-    {
-      tipo: "i5 o equivalentes (13a generación en adelante)",
-      alumnos: "107",
-      profesores: "3",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "8",
-      total: "118",
-    },
-    {
-      tipo: "i5 o equivalentes (12a generación en adelante)",
-      alumnos: "250",
-      profesores: "59",
-      tecnicos: "3",
-      investigadores: "",
-      administrativos: "904",
-      total: "1216",
-    },
-    {
-      tipo: "i3 o equivalentes (13a generación en adelante)",
-      alumnos: "3",
-      profesores: "1",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "12",
-      total: "16",
-    },
-    {
-      tipo: "i3 o equivalentes (12a generación en adelante)",
-      alumnos: "36",
-      profesores: "19",
-      tecnicos: "2",
-      investigadores: "",
-      administrativos: "78",
-      total: "137",
-    },
-    {
-      tipo: "i3 o equivalentes (11a generación en adelante)",
-      alumnos: "264",
-      profesores: "66",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "410",
-      total: "740",
-    },
-    {
-      tipo: "Pentium Gold",
-      alumnos: "",
-      profesores: "",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "1",
-      total: "1",
-    },
-    {
-      tipo: "Pentium Serie J, G",
-      alumnos: "2",
-      profesores: "3",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "3",
-      total: "8",
-    },
-    {
-      tipo: "Celeron Dual Core, Pentium Dual Core o anteriores",
-      alumnos: "25",
-      profesores: "40",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "56",
-      total: "121",
-    },
-  ];
-
-  const total = {
-    alumnos: "774",
-    profesores: "227",
-    tecnicos: "5",
-    investigadores: "0",
-    administrativos: "838",
-    total: "1844",
-  };
-
-  return (
-    <main className="pregunta-page pregunta3">
-      <div className="pregunta-container">
-        <h1 className="pregunta-titulo">PREGUNTA 3 (1/5)</h1>
-
-        <section className="pregunta-seccion">
-          <p className="pregunta-texto">
-            3. Desglose la cantidad de población beneficiada por plataforma y
-            tipo de procesador: *
-          </p>
-          <p className="pregunta-subtexto">
-            Presione cada pestaña para ingresar la información.
-          </p>
-
-          {/* Pestañas */}
-          <div className="tab-container">
-            <div className="tab active">
-              Computadoras de escritorio Plataforma PC
-            </div>
-            <div className="tab inactive">
-              Computadoras de escritorio Plataforma Apple
-            </div>
-            <div className="tab inactive">
-              Computadoras portátiles Plataforma PC
-            </div>
-            <div className="tab inactive">
-              Computadoras portátiles Plataforma Apple
-            </div>
-            <div className="tab inactive">Alto rendimiento Servidores</div>
-          </div>
-
-          {/* Tabla */}
-          <div className="tabla-wrapper">
-            <table className="tabla-pc">
-              <thead>
-                <tr>
-                  <th rowSpan={2} className="header-procesador">
-                    Plataforma PC <br /> Tipo de procesador
-                  </th>
-                  <th colSpan={5} className="header-poblacion">
-                    Población Beneficiada
-                  </th>
-                  <th rowSpan={2} className="header-total">
-                    Total
-                  </th>
-                </tr>
-                <tr>
-                  <th>Alumnos</th>
-                  <th>Profesores</th>
-                  <th>Técnicos Académicos</th>
-                  <th>Investigadores</th>
-                  <th>Administrativos</th>
-                </tr>
-              </thead>
-              <tbody>
-                {data.map((item, i) => (
-                  <tr key={i}>
-                    <td className="tipo-procesador">{item.tipo}</td>
-                    <td>
-                      <input value={item.alumnos} readOnly />
-                    </td>
-                    <td>
-                      <input value={item.profesores} readOnly />
-                    </td>
-                    <td>
-                      <input value={item.tecnicos} readOnly />
-                    </td>
-                    <td>
-                      <input value={item.investigadores} readOnly />
-                    </td>
-                    <td>
-                      <input value={item.administrativos} readOnly />
-                    </td>
-                    <td className="total-celda">{item.total}</td>
-                  </tr>
-                ))}
-                <tr className="fila-total">
-                  <td className="tipo-procesador">Total</td>
-                  <td>
-                    <input value={total.alumnos} readOnly />
-                  </td>
-                  <td>
-                    <input value={total.profesores} readOnly />
-                  </td>
-                  <td>
-                    <input value={total.tecnicos} readOnly />
-                  </td>
-                  <td>
-                    <input value={total.investigadores} readOnly />
-                  </td>
-                  <td>
-                    <input value={total.administrativos} readOnly />
-                  </td>
-                  <td className="total-celda final-total">{total.total}</td>
-                </tr>
-              </tbody>
-            </table>
-            <button className="boton-consultar">
-              Consultar las equivalencias de procesadores
-            </button>
-          </div>
-        </section>
-
-        <div className="boton-contenedor">
-          <Link href="/pregunta3.2" className="boton siguiente">
-            Pregunta 3 (2/5) →
-          </Link>
-        </div>
-      </div>
-    </main>
-  );
-}
diff --git a/src/components/Equipo_Computo/Pregunta3_2.tsx b/src/components/Equipo_Computo/Pregunta3_2.tsx
deleted file mode 100644
index 1fb4fe1..0000000
--- a/src/components/Equipo_Computo/Pregunta3_2.tsx
+++ /dev/null
@@ -1,270 +0,0 @@
-"use client";
-
-import React from "react";
-import Link from "next/link";
-import "./pregunta3_2.css";
-
-export default function Pregunta3_2() {
-  const data = [
-    {
-      tipo: "Core Ultra (i3, i5, i7) Serie 2",
-      alumnos: "",
-      profesores: "",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "",
-      total: "0",
-    },
-    {
-      tipo: "Core Ultra (i3, i5, i7) Serie 1",
-      alumnos: "",
-      profesores: "",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "",
-      total: "0",
-    },
-    {
-      tipo: "Familia M4",
-      alumnos: "",
-      profesores: "",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "2",
-      total: "2",
-    },
-    {
-      tipo: "Familia M3",
-      alumnos: "",
-      profesores: "1",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "1",
-      total: "2",
-    },
-    {
-      tipo: "Familia M2",
-      alumnos: "",
-      profesores: "2",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "",
-      total: "2",
-    },
-    {
-      tipo: "Familia M1",
-      alumnos: "51",
-      profesores: "1",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "",
-      total: "52",
-    },
-    {
-      tipo: "i9 o equivalentes (13a generación en adelante)",
-      alumnos: "",
-      profesores: "",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "",
-      total: "0",
-    },
-    {
-      tipo: "i7 o equivalentes (13a generación en adelante)",
-      alumnos: "",
-      profesores: "",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "",
-      total: "0",
-    },
-    {
-      tipo: "i7 o equivalentes (12a generación en adelante)",
-      alumnos: "",
-      profesores: "",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "1",
-      total: "1",
-    },
-    {
-      tipo: "i5 o equivalentes (13a generación en adelante)",
-      alumnos: "",
-      profesores: "",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "1",
-      total: "1",
-    },
-    {
-      tipo: "i5 o equivalentes (12a generación en adelante)",
-      alumnos: "11",
-      profesores: "1",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "",
-      total: "12",
-    },
-    {
-      tipo: "i3 o equivalentes (13a generación en adelante)",
-      alumnos: "175",
-      profesores: "5",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "26",
-      total: "206",
-    },
-    {
-      tipo: "i3 o equivalentes (12a generación en adelante)",
-      alumnos: "",
-      profesores: "",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "1",
-      total: "1",
-    },
-    {
-      tipo: "i3 o equivalentes (11a generación en adelante)",
-      alumnos: "",
-      profesores: "2",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "",
-      total: "2",
-    },
-    {
-      tipo: "Core2 Mac, Quad Core o anteriores",
-      alumnos: "12",
-      profesores: "3",
-      tecnicos: "3",
-      investigadores: "",
-      administrativos: "3",
-      total: "21",
-    },
-  ];
-
-  const total = {
-    alumnos: "249",
-    profesores: "14",
-    tecnicos: "3",
-    investigadores: "0",
-    administrativos: "37",
-    total: "303",
-  };
-
-  return (
-    <main className="pregunta-page pregunta3">
-      <div className="pregunta-container">
-        <h1 className="pregunta-titulo">PREGUNTA 3 (2/5)</h1>
-
-        <section className="pregunta-seccion">
-          <p className="pregunta-texto">
-            3. Desglose la cantidad de población beneficiada por plataforma y
-            tipo de procesador: *
-          </p>
-          <p className="pregunta-subtexto">
-            Presione cada pestaña para ingresar la información.
-          </p>
-
-          {/* === PESTAÑAS === */}
-          <div className="tab-container">
-            <div className="tab inactive">
-              Computadoras de escritorio Plataforma PC
-            </div>
-            <div className="tab active">
-              Computadoras de escritorio Plataforma Apple
-            </div>
-            <div className="tab inactive">
-              Computadoras portátiles Plataforma PC
-            </div>
-            <div className="tab inactive">
-              Computadoras portátiles Plataforma Apple
-            </div>
-            <div className="tab inactive">Alto rendimiento Servidores</div>
-          </div>
-
-          {/* === TABLA === */}
-          <div className="tabla-apple-container">
-            <table className="tabla-apple">
-              <thead>
-                <tr>
-                  <th rowSpan={2} className="header-procesador">
-                    Plataforma Apple <br /> Tipo de procesador
-                  </th>
-                  <th colSpan={5} className="header-poblacion">
-                    Población Beneficiada
-                  </th>
-                  <th rowSpan={2} className="header-total">
-                    Total
-                  </th>
-                </tr>
-                <tr>
-                  <th className="sub-header">Alumnos</th>
-                  <th className="sub-header">Profesores</th>
-                  <th className="sub-header">Técnicos Académicos</th>
-                  <th className="sub-header">Investigadores</th>
-                  <th className="sub-header">Administrativos</th>
-                </tr>
-              </thead>
-              <tbody>
-                {data.map((item, index) => (
-                  <tr key={index}>
-                    <td className="tipo-procesador">{item.tipo}</td>
-                    <td>
-                      <input type="text" value={item.alumnos} readOnly />
-                    </td>
-                    <td>
-                      <input type="text" value={item.profesores} readOnly />
-                    </td>
-                    <td>
-                      <input type="text" value={item.tecnicos} readOnly />
-                    </td>
-                    <td>
-                      <input type="text" value={item.investigadores} readOnly />
-                    </td>
-                    <td>
-                      <input
-                        type="text"
-                        value={item.administrativos}
-                        readOnly
-                      />
-                    </td>
-                    <td className="total-celda">{item.total}</td>
-                  </tr>
-                ))}
-                <tr className="fila-total">
-                  <td className="tipo-procesador">Total</td>
-                  <td>
-                    <input type="text" value={total.alumnos} readOnly />
-                  </td>
-                  <td>
-                    <input type="text" value={total.profesores} readOnly />
-                  </td>
-                  <td>
-                    <input type="text" value={total.tecnicos} readOnly />
-                  </td>
-                  <td>
-                    <input type="text" value={total.investigadores} readOnly />
-                  </td>
-                  <td>
-                    <input type="text" value={total.administrativos} readOnly />
-                  </td>
-                  <td className="total-celda final-total">{total.total}</td>
-                </tr>
-              </tbody>
-            </table>
-            <button className="boton-consultar">
-              Consultar las equivalencias de procesadores
-            </button>
-          </div>
-        </section>
-
-        <div className="boton-contenedor">
-          <Link href="/pregunta3.3" className="boton siguiente">
-            Pregunta 3 (3/5) →
-          </Link>
-        </div>
-      </div>
-    </main>
-  );
-}
diff --git a/src/components/Equipo_Computo/Pregunta3_3.tsx b/src/components/Equipo_Computo/Pregunta3_3.tsx
deleted file mode 100644
index 96acfef..0000000
--- a/src/components/Equipo_Computo/Pregunta3_3.tsx
+++ /dev/null
@@ -1,271 +0,0 @@
-"use client";
-
-import React from "react";
-import Link from "next/link";
-import "./pregunta3_3.css";
-
-export default function Pregunta3_3() {
-  const data = [
-    {
-      tipo: "Core Ultra (i3, i5, i7) Serie 2",
-      alumnos: "",
-      profesores: "",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "",
-      total: "0",
-    },
-    {
-      tipo: "Core Ultra (i3, i5, i7) Serie 1",
-      alumnos: "",
-      profesores: "",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "",
-      total: "0",
-    },
-    {
-      tipo: "i9 o equivalentes (13a generación en adelante)",
-      alumnos: "",
-      profesores: "",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "",
-      total: "0",
-    },
-    {
-      tipo: "i7 o equivalentes (12a generación en adelante)",
-      alumnos: "16",
-      profesores: "",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "27",
-      total: "43",
-    },
-    {
-      tipo: "i7 o equivalentes (11a generación)",
-      alumnos: "",
-      profesores: "",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "1",
-      total: "1",
-    },
-    {
-      tipo: "i5 o equivalentes (13a generación en adelante)",
-      alumnos: "",
-      profesores: "1",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "1",
-      total: "2",
-    },
-    {
-      tipo: "i5 o equivalentes (12a generación en adelante)",
-      alumnos: "146",
-      profesores: "34",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "42",
-      total: "222",
-    },
-    {
-      tipo: "i5 o equivalentes (11a generación en adelante)",
-      alumnos: "",
-      profesores: "2",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "15",
-      total: "19",
-    },
-    {
-      tipo: "i3 o equivalentes (13a generación en adelante)",
-      alumnos: "",
-      profesores: "",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "12",
-      total: "12",
-    },
-    {
-      tipo: "i3 o equivalentes (12a generación en adelante)",
-      alumnos: "",
-      profesores: "8",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "23",
-      total: "31",
-    },
-    {
-      tipo: "i3 o equivalentes (11a generación en adelante)",
-      alumnos: "",
-      profesores: "",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "",
-      total: "0",
-    },
-    {
-      tipo: "Pentium Dual Core o anteriores",
-      alumnos: "",
-      profesores: "",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "",
-      total: "0",
-    },
-    {
-      tipo: "Celeron (equivalente 2018 hasta la fecha)",
-      alumnos: "299",
-      profesores: "8",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "4",
-      total: "311",
-    },
-    {
-      tipo: "Celeron anteriores",
-      alumnos: "",
-      profesores: "",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "",
-      total: "0",
-    },
-    {
-      tipo: "Core2 Duo, Quad Core, Pentium Dual Core o anteriores",
-      alumnos: "4",
-      profesores: "4",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "3",
-      total: "11",
-    },
-  ];
-
-  const total = {
-    alumnos: "445",
-    profesores: "132",
-    tecnicos: "0",
-    investigadores: "0",
-    administrativos: "139",
-    total: "716",
-  };
-
-  return (
-    <main className="pregunta-page pregunta3">
-      <div className="pregunta-container">
-        <h1 className="pregunta-titulo">PREGUNTA 3 (3/5)</h1>
-
-        <section className="pregunta-seccion">
-          <p className="pregunta-texto">
-            3. Desglose la cantidad de población beneficiada por plataforma y
-            tipo de procesador: *
-          </p>
-          <p className="pregunta-subtexto">
-            Presione cada pestaña para ingresar la información.
-          </p>
-
-          {/* === PESTAÑAS === */}
-          <div className="tab-container">
-            <div className="tab inactive">
-              Computadoras de escritorio Plataforma PC
-            </div>
-            <div className="tab inactive">
-              Computadoras de escritorio Plataforma Apple
-            </div>
-            <div className="tab active">
-              Computadoras portátiles Plataforma PC
-            </div>
-            <div className="tab inactive">
-              Computadoras portátiles Plataforma Apple
-            </div>
-            <div className="tab inactive">Alto rendimiento Servidores</div>
-          </div>
-
-          {/* === TABLA === */}
-          <div className="tabla-pc-container">
-            <table className="tabla-pc">
-              <thead>
-                <tr>
-                  <th rowSpan={2} className="header-procesador">
-                    Plataforma PC <br /> Tipo de procesador
-                  </th>
-                  <th colSpan={5} className="header-poblacion">
-                    Población Beneficiada
-                  </th>
-                  <th rowSpan={2} className="header-total">
-                    Total
-                  </th>
-                </tr>
-                <tr>
-                  <th className="sub-header">Alumnos</th>
-                  <th className="sub-header">Profesores</th>
-                  <th className="sub-header">Técnicos Académicos</th>
-                  <th className="sub-header">Investigadores</th>
-                  <th className="sub-header">Administrativos</th>
-                </tr>
-              </thead>
-
-              <tbody>
-                {data.map((item, index) => (
-                  <tr key={index}>
-                    <td className="tipo-procesador">{item.tipo}</td>
-                    <td>
-                      <input type="text" value={item.alumnos} readOnly />
-                    </td>
-                    <td>
-                      <input type="text" value={item.profesores} readOnly />
-                    </td>
-                    <td>
-                      <input type="text" value={item.tecnicos} readOnly />
-                    </td>
-                    <td>
-                      <input type="text" value={item.investigadores} readOnly />
-                    </td>
-                    <td>
-                      <input
-                        type="text"
-                        value={item.administrativos}
-                        readOnly
-                      />
-                    </td>
-                    <td className="total-celda">{item.total}</td>
-                  </tr>
-                ))}
-                <tr className="fila-total">
-                  <td className="tipo-procesador">Total</td>
-                  <td>
-                    <input type="text" value={total.alumnos} readOnly />
-                  </td>
-                  <td>
-                    <input type="text" value={total.profesores} readOnly />
-                  </td>
-                  <td>
-                    <input type="text" value={total.tecnicos} readOnly />
-                  </td>
-                  <td>
-                    <input type="text" value={total.investigadores} readOnly />
-                  </td>
-                  <td>
-                    <input type="text" value={total.administrativos} readOnly />
-                  </td>
-                  <td className="total-celda final-total">{total.total}</td>
-                </tr>
-              </tbody>
-            </table>
-            <button className="boton-consultar">
-              Consultar las equivalencias de procesadores
-            </button>
-          </div>
-        </section>
-
-        <div className="boton-contenedor">
-          <Link href="/pregunta3.4" className="boton siguiente">
-            Pregunta 3 (4/5) →
-          </Link>
-        </div>
-      </div>
-    </main>
-  );
-}
diff --git a/src/components/Equipo_Computo/Pregunta3_4.tsx b/src/components/Equipo_Computo/Pregunta3_4.tsx
deleted file mode 100644
index c968b82..0000000
--- a/src/components/Equipo_Computo/Pregunta3_4.tsx
+++ /dev/null
@@ -1,257 +0,0 @@
-"use client";
-
-import React from "react";
-import Link from "next/link";
-import "./pregunta3_4.css";
-
-export default function Pregunta3_4() {
-  const data = [
-    {
-      tipo: "Core Ultra (i3, i5, i7) Serie 2",
-      alumnos: "",
-      profesores: "",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "",
-      total: "0",
-    },
-    {
-      tipo: "Core Ultra (i3, i5, i7) Serie 1",
-      alumnos: "",
-      profesores: "",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "",
-      total: "0",
-    },
-    {
-      tipo: "Familia M4",
-      alumnos: "",
-      profesores: "",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "",
-      total: "0",
-    },
-    {
-      tipo: "Familia M3",
-      alumnos: "",
-      profesores: "",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "",
-      total: "0",
-    },
-    {
-      tipo: "Familia M2",
-      alumnos: "35",
-      profesores: "3",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "",
-      total: "38",
-    },
-    {
-      tipo: "Familia M1",
-      alumnos: "",
-      profesores: "5",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "1",
-      total: "6",
-    },
-    {
-      tipo: "i9 o equivalentes (13a generación en adelante)",
-      alumnos: "",
-      profesores: "",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "",
-      total: "0",
-    },
-    {
-      tipo: "i7 o equivalentes (13a generación en adelante)",
-      alumnos: "",
-      profesores: "",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "",
-      total: "0",
-    },
-    {
-      tipo: "i7 o equivalentes (12a generación en adelante)",
-      alumnos: "",
-      profesores: "",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "",
-      total: "0",
-    },
-    {
-      tipo: "i7 o equivalentes (11a generación en adelante)",
-      alumnos: "",
-      profesores: "",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "",
-      total: "0",
-    },
-    {
-      tipo: "i5 o equivalentes (13a generación en adelante)",
-      alumnos: "",
-      profesores: "",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "",
-      total: "0",
-    },
-    {
-      tipo: "i5 o equivalentes (12a generación en adelante)",
-      alumnos: "",
-      profesores: "14",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "",
-      total: "14",
-    },
-    {
-      tipo: "i5 o equivalentes (11a generación en adelante)",
-      alumnos: "",
-      profesores: "9",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "4",
-      total: "13",
-    },
-    {
-      tipo: "Core2 Mac, Quad Core o anteriores",
-      alumnos: "",
-      profesores: "",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "",
-      total: "0",
-    },
-  ];
-
-  const total = {
-    alumnos: "35",
-    profesores: "31",
-    tecnicos: "0",
-    investigadores: "0",
-    administrativos: "5",
-    total: "71",
-  };
-
-  return (
-    <main className="pregunta3-container">
-      <h1 className="pregunta3-titulo">PREGUNTA 3 (4/5)</h1>
-
-      <div className="pregunta3-descripcion">
-        <p>
-          <strong>3.</strong> Desglose la cantidad de población beneficiada por
-          plataforma y tipo de procesador:
-        </p>
-        <span className="subtexto">
-          Presione cada pestaña para ingresar la información.
-        </span>
-      </div>
-
-      {/* === PESTAÑAS === */}
-      <div className="tabs">
-        <button className="tab inactive">
-          Computadoras de escritorio Plataforma PC
-        </button>
-        <button className="tab inactive">
-          Computadoras de escritorio Plataforma Apple
-        </button>
-        <button className="tab inactive">
-          Computadoras portátiles Plataforma PC
-        </button>
-        <button className="tab active">
-          Computadoras portátiles Plataforma Apple
-        </button>
-        <button className="tab inactive">Alto rendimiento Servidores</button>
-      </div>
-
-      {/* === TABLA === */}
-      <div className="tabla-wrapper">
-        <table className="tabla-pregunta3">
-          <thead>
-            <tr>
-              <th rowSpan={2} className="header-procesador">
-                Plataforma Apple <br /> Tipo de procesador
-              </th>
-              <th colSpan={5} className="header-poblacion">
-                Población Beneficiada
-              </th>
-              <th rowSpan={2} className="header-total">
-                Total
-              </th>
-            </tr>
-            <tr>
-              <th>Alumnos</th>
-              <th>Profesores</th>
-              <th>Técnicos Académicos</th>
-              <th>Investigadores</th>
-              <th>Administrativos</th>
-            </tr>
-          </thead>
-
-          <tbody>
-            {data.map((item, index) => (
-              <tr key={index}>
-                <td className="tipo-procesador">{item.tipo}</td>
-                <td>
-                  <input type="text" value={item.alumnos} readOnly />
-                </td>
-                <td>
-                  <input type="text" value={item.profesores} readOnly />
-                </td>
-                <td>
-                  <input type="text" value={item.tecnicos} readOnly />
-                </td>
-                <td>
-                  <input type="text" value={item.investigadores} readOnly />
-                </td>
-                <td>
-                  <input type="text" value={item.administrativos} readOnly />
-                </td>
-                <td className="celda-total">{item.total}</td>
-              </tr>
-            ))}
-            <tr className="fila-total">
-              <td>Total</td>
-              <td>
-                <input type="text" value={total.alumnos} readOnly />
-              </td>
-              <td>
-                <input type="text" value={total.profesores} readOnly />
-              </td>
-              <td>
-                <input type="text" value={total.tecnicos} readOnly />
-              </td>
-              <td>
-                <input type="text" value={total.investigadores} readOnly />
-              </td>
-              <td>
-                <input type="text" value={total.administrativos} readOnly />
-              </td>
-              <td className="celda-total final">{total.total}</td>
-            </tr>
-          </tbody>
-        </table>
-
-        <button className="boton-consultar">
-          Consultar las equivalencias de procesadores
-        </button>
-      </div>
-
-      <div className="boton-siguiente">
-        <Link href="/pregunta3.5" className="next">
-          Pregunta 3 (5/5) →
-        </Link>
-      </div>
-    </main>
-  );
-}
diff --git a/src/components/Equipo_Computo/Pregunta3_5.tsx b/src/components/Equipo_Computo/Pregunta3_5.tsx
deleted file mode 100644
index ab38528..0000000
--- a/src/components/Equipo_Computo/Pregunta3_5.tsx
+++ /dev/null
@@ -1,209 +0,0 @@
-"use client";
-
-import React from "react";
-import Link from "next/link";
-import "./pregunta3_5.css";
-
-export default function Pregunta3_5() {
-  const data = [
-    {
-      tipo: "Xeon 6",
-      alumnos: "",
-      profesores: "",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "",
-      total: "0",
-    },
-    {
-      tipo: "Xeon Bronce, Plata, Oro 3a generación",
-      alumnos: "",
-      profesores: "",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "",
-      total: "0",
-    },
-    {
-      tipo: "Xeon Bronce, Plata, Oro 4a generación",
-      alumnos: "",
-      profesores: "",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "",
-      total: "0",
-    },
-    {
-      tipo: "Xeon Bronce, Plata, Oro 5a generación",
-      alumnos: "",
-      profesores: "",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "",
-      total: "0",
-    },
-    {
-      tipo: "Xeon Bronce, Plata, Oro 6a generación",
-      alumnos: "",
-      profesores: "",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "1",
-      total: "1",
-    },
-    {
-      tipo: "Xeon E3, E5, E7",
-      alumnos: "19",
-      profesores: "",
-      tecnicos: "",
-      investigadores: "16",
-      administrativos: "",
-      total: "35",
-    },
-    {
-      tipo: "Xeon Phi",
-      alumnos: "",
-      profesores: "",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "1",
-      total: "1",
-    },
-    {
-      tipo: "Xeon o anteriores",
-      alumnos: "",
-      profesores: "",
-      tecnicos: "",
-      investigadores: "",
-      administrativos: "",
-      total: "0",
-    },
-  ];
-
-  const total = {
-    alumnos: "19",
-    profesores: "0",
-    tecnicos: "0",
-    investigadores: "16",
-    administrativos: "2",
-    total: "37",
-  };
-
-  return (
-    <main className="pregunta-page pregunta3">
-      <div className="pregunta-container">
-        <h1 className="pregunta-titulo">PREGUNTA 3 (5/5)</h1>
-
-        <section className="pregunta-seccion">
-          <p className="pregunta-texto">
-            3. Desglose la cantidad de población beneficiada por plataforma y
-            tipo de procesador: *
-          </p>
-          <p className="pregunta-subtexto">
-            Presione cada pestaña para ingresar la información.
-          </p>
-
-          {/* === PESTAÑAS === */}
-          <div className="tab-container">
-            <div className="tab inactive">
-              Computadoras de escritorio Plataforma PC
-            </div>
-            <div className="tab inactive">
-              Computadoras de escritorio Plataforma Apple
-            </div>
-            <div className="tab inactive">
-              Computadoras portátiles Plataforma PC
-            </div>
-            <div className="tab inactive">
-              Computadoras portátiles Plataforma Apple
-            </div>
-            <div className="tab active">Alto rendimiento Servidores</div>
-          </div>
-
-          {/* === TABLA === */}
-          <div className="tabla-servidores-container">
-            <table className="tabla-servidores">
-              <thead>
-                <tr>
-                  <th rowSpan={2} className="header-procesador">
-                    Servidores <br /> Tipo de procesador
-                  </th>
-                  <th colSpan={5} className="header-poblacion">
-                    Población Beneficiada
-                  </th>
-                  <th rowSpan={2} className="header-total">
-                    Total
-                  </th>
-                </tr>
-                <tr>
-                  <th className="sub-header">Alumnos</th>
-                  <th className="sub-header">Profesores</th>
-                  <th className="sub-header">Técnicos Académicos</th>
-                  <th className="sub-header">Investigadores</th>
-                  <th className="sub-header">Administrativos</th>
-                </tr>
-              </thead>
-
-              <tbody>
-                {data.map((item, index) => (
-                  <tr key={index} className="tabla-fila">
-                    <td className="tipo-procesador">{item.tipo}</td>
-                    <td>
-                      <input type="text" value={item.alumnos} readOnly />
-                    </td>
-                    <td>
-                      <input type="text" value={item.profesores} readOnly />
-                    </td>
-                    <td>
-                      <input type="text" value={item.tecnicos} readOnly />
-                    </td>
-                    <td>
-                      <input type="text" value={item.investigadores} readOnly />
-                    </td>
-                    <td>
-                      <input
-                        type="text"
-                        value={item.administrativos}
-                        readOnly
-                      />
-                    </td>
-                    <td className="total-celda">{item.total}</td>
-                  </tr>
-                ))}
-                <tr className="fila-total">
-                  <td className="tipo-procesador">Total</td>
-                  <td>
-                    <input type="text" value={total.alumnos} readOnly />
-                  </td>
-                  <td>
-                    <input type="text" value={total.profesores} readOnly />
-                  </td>
-                  <td>
-                    <input type="text" value={total.tecnicos} readOnly />
-                  </td>
-                  <td>
-                    <input type="text" value={total.investigadores} readOnly />
-                  </td>
-                  <td>
-                    <input type="text" value={total.administrativos} readOnly />
-                  </td>
-                  <td className="total-celda final-total">{total.total}</td>
-                </tr>
-              </tbody>
-            </table>
-
-            <button className="boton-consultar">
-              Consultar las equivalencias de procesadores
-            </button>
-          </div>
-        </section>
-
-        <div className="boton-contenedor">
-          <Link href="/" className="boton volver">
-            ← Volver al inicio
-          </Link>
-        </div>
-      </div>
-    </main>
-  );
-}
diff --git a/src/components/Equipo_Computo/pregunta1.module.scss b/src/components/Equipo_Computo/pregunta1.module.scss
index 34b9b12..676f3b6 100644
--- a/src/components/Equipo_Computo/pregunta1.module.scss
+++ b/src/components/Equipo_Computo/pregunta1.module.scss
@@ -1,4 +1,4 @@
-.dashboardContainer_P1 {
+.dashboardContainer {
   display: flex;
   flex-direction: column;
   padding: 0;
@@ -7,13 +7,14 @@
   background-color: #f4f4f4;
 }
 
-.scanView_P1 {
+
+
+
+.scanView {
   padding: 20px;
   width: 100%;
-  display: flex;
-  justify-content: center;
 
-  .container_P1 {
+  .container {
     width: 100%;
     max-width: 900px;
     background: #fff;
@@ -25,7 +26,7 @@
     border: 1px solid #ddd;
   }
 
-  .header_P1 {
+  .header {
     padding: 16px 20px;
     background: #f7f7f7;
     border-bottom: 1px solid #e0e0e0;
@@ -35,12 +36,12 @@
     font-weight: 500;
   }
 
-  .main-content_P1 {
+  .main-content {
     display: flex;
     min-height: 420px;
   }
 
-  .tabs_P1 {
+  .tabs {
     width: 230px;
     background-color: #fafafa;
     display: flex;
@@ -48,26 +49,26 @@
     justify-content: space-evenly;
   }
 
-  .tab_P1 {
-    padding: 12px 16px;
-    cursor: pointer;
-    border-right: 1px solid #e0e0e0;
-    color: #555;
-    transition: all 0.3s ease;
-    border-left: 4px solid transparent;
-    font-size: 15px;
-    font-weight: 500;
-    background: none;
-    border: none;
-    text-align: left;
-  }
+  .tab {
+  padding: 12px 16px; /* ← CORREGIDO: "auto" no es válido */
+  cursor: pointer;
+  border-right: 1px solid #e0e0e0;
+  color: #555;
+  transition: all 0.3s ease;
+  border-left: 4px solid transparent;
+  font-size: 15px;
+  font-weight: 500;
+  background: none;
+  border: none;
+  text-align: left;
+}
 
-  .tab_P1:hover {
+  .tab:hover {
     background-color: #f0f0f0;
     color: #000;
   }
 
-  .active_P1 {
+  .tab.active {
     background-color: #fff;
     border-left: 4px solid #0056b3;
     border-right: none;
@@ -76,16 +77,16 @@
     font-weight: 600;
   }
 
-  .data-table-wrapper_P1 {
+  .data-table-wrapper {
     flex: 1;
     padding: 20px;
   }
 
-  .data-table_P1 {
+  .data-table {
     width: 100%;
   }
 
-  .data-row_P1 {
+  .data-row {
     display: flex;
     align-items: center;
     justify-content: space-between;
@@ -94,17 +95,17 @@
     transition: background 0.2s ease;
   }
 
-  .data-row_P1:hover {
+  .data-row:hover {
     background: #f1f1f1;
   }
 
-  .os-name_P1 {
+  .os-name {
     flex: 1;
     font-size: 15px;
     color: #333;
   }
 
-  .count-box_P1 {
+  .count-box {
     background: #ffffff;
     border: 1px solid #0056b3;
     padding: 6px 14px;
@@ -114,24 +115,25 @@
     min-width: 70px;
   }
 
-  .total-row_P1 {
+  .total-row {
     background: #eaf4ff;
     font-weight: bold;
 
-    .count-box_P1 {
+    .count-box {
       color: #0056b3;
     }
   }
 }
 
+/* ======== RESPONSIVE ======== */
 @media (max-width: 700px) {
-  .scanView_P1 .tabs_P1 {
+  .scanView .tabs {
     width: 160px;
   }
 
-  .scanView_P1 .tab_P1 {
+  .scanView .tab {
     font-size: 12px;
     padding: 10px 12px;
     text-align: left;
   }
-}
+}
\ No newline at end of file
diff --git a/src/components/Equipo_Computo/pregunta1_1.module.scss b/src/components/Equipo_Computo/pregunta2.module.scss
similarity index 70%
rename from src/components/Equipo_Computo/pregunta1_1.module.scss
rename to src/components/Equipo_Computo/pregunta2.module.scss
index 676f3b6..128c77e 100644
--- a/src/components/Equipo_Computo/pregunta1_1.module.scss
+++ b/src/components/Equipo_Computo/pregunta2.module.scss
@@ -1,4 +1,4 @@
-.dashboardContainer {
+.dashboardContainer_P1 {
   display: flex;
   flex-direction: column;
   padding: 0;
@@ -7,16 +7,14 @@
   background-color: #f4f4f4;
 }
 
-
-
-
-.scanView {
+.scanView_P1 {
   padding: 20px;
   width: 100%;
+  display: flex;
+  justify-content: center;
 
-  .container {
+  .container_P1 {
     width: 100%;
-    max-width: 900px;
     background: #fff;
     border-radius: 12px;
     box-shadow: 0 6px 18px rgba(0, 0, 0, 0.1);
@@ -26,7 +24,7 @@
     border: 1px solid #ddd;
   }
 
-  .header {
+  .header_P1 {
     padding: 16px 20px;
     background: #f7f7f7;
     border-bottom: 1px solid #e0e0e0;
@@ -36,12 +34,12 @@
     font-weight: 500;
   }
 
-  .main-content {
+  .main-content_P1 {
     display: flex;
     min-height: 420px;
   }
 
-  .tabs {
+  .tabs_P1 {
     width: 230px;
     background-color: #fafafa;
     display: flex;
@@ -49,26 +47,26 @@
     justify-content: space-evenly;
   }
 
-  .tab {
-  padding: 12px 16px; /* ← CORREGIDO: "auto" no es válido */
-  cursor: pointer;
-  border-right: 1px solid #e0e0e0;
-  color: #555;
-  transition: all 0.3s ease;
-  border-left: 4px solid transparent;
-  font-size: 15px;
-  font-weight: 500;
-  background: none;
-  border: none;
-  text-align: left;
-}
+  .tab_P1 {
+    padding: 12px 16px;
+    cursor: pointer;
+    border-right: 1px solid #e0e0e0;
+    color: #555;
+    transition: all 0.3s ease;
+    border-left: 4px solid transparent;
+    font-size: 15px;
+    font-weight: 500;
+    background: none;
+    border: none;
+    text-align: left;
+  }
 
-  .tab:hover {
+  .tab_P1:hover {
     background-color: #f0f0f0;
     color: #000;
   }
 
-  .tab.active {
+  .active_P1 {
     background-color: #fff;
     border-left: 4px solid #0056b3;
     border-right: none;
@@ -77,16 +75,16 @@
     font-weight: 600;
   }
 
-  .data-table-wrapper {
+  .data-table-wrapper_P1 {
     flex: 1;
     padding: 20px;
   }
 
-  .data-table {
+  .data-table_P1 {
     width: 100%;
   }
 
-  .data-row {
+  .data-row_P1 {
     display: flex;
     align-items: center;
     justify-content: space-between;
@@ -95,17 +93,17 @@
     transition: background 0.2s ease;
   }
 
-  .data-row:hover {
+  .data-row_P1:hover {
     background: #f1f1f1;
   }
 
-  .os-name {
+  .os-name_P1 {
     flex: 1;
     font-size: 15px;
     color: #333;
   }
 
-  .count-box {
+  .count-box_P1 {
     background: #ffffff;
     border: 1px solid #0056b3;
     padding: 6px 14px;
@@ -115,25 +113,24 @@
     min-width: 70px;
   }
 
-  .total-row {
+  .total-row_P1 {
     background: #eaf4ff;
     font-weight: bold;
 
-    .count-box {
+    .count-box_P1 {
       color: #0056b3;
     }
   }
 }
 
-/* ======== RESPONSIVE ======== */
 @media (max-width: 700px) {
-  .scanView .tabs {
+  .scanView_P1 .tabs_P1 {
     width: 160px;
   }
 
-  .scanView .tab {
+  .scanView_P1 .tab_P1 {
     font-size: 12px;
     padding: 10px 12px;
     text-align: left;
   }
-}
\ No newline at end of file
+}
diff --git a/src/components/Equipo_Computo/pregunta2.scss b/src/components/Equipo_Computo/pregunta2.scss
deleted file mode 100644
index 7c9f318..0000000
--- a/src/components/Equipo_Computo/pregunta2.scss
+++ /dev/null
@@ -1,164 +0,0 @@
-.dashboardContainer {
-  display: flex;
-  flex-direction: column;
-  padding: 0;
-  margin: 0;
-  min-height: 100vh;
-  background-color: #f4f4f4;
-}
-
-.header {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  padding: 16px 24px;
-  background-color: #ffffff;
-  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
-  position: sticky;
-  top: 0;
-  z-index: 10;
-
-  h2 {
-    margin: 0;
-    font-size: 1.5rem;
-    color: #0056b3;
-  }
-}
-
-.scanView {
-  flex: 1;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: flex-start;
-  padding: 20px;
-  width: 100%;
-  height: 100%;
-
-  .container {
-    width: 100%;
-    height: 500px;
-    max-width: 900px;
-    background: #fff;
-    border-radius: 12px;
-    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.1);
-    overflow: hidden;
-    display: flex;
-    flex-direction: column;
-    border: 1px solid #ddd;
-  }
-
-  .header {
-    padding: 16px 20px;
-    background: #f7f7f7;
-    border-bottom: 1px solid #e0e0e0;
-    font-size: 15px;
-    color: #0056b3;
-    text-align: center;
-    font-weight: 500;
-    display: block;
-    box-shadow: none;
-    position: static;
-  }
-
-  .main-content {
-    display: flex;
-    min-height: 420px;
-  }
-
-  .tabs {
-    height: 100%;
-    width: 230px;
-    background-color: #fafafa;
-    display: flex;
-    flex-direction: column;
-  }
-
-  .tab {
-    padding: 5%;
-    cursor: pointer;
-    color: #555;
-    transition: all 0.3s ease;
-    border-left: 4px solid transparent;
-    font-size: 15px;
-    font-weight: 500;
-  }
-
-  .tab:hover {
-    background-color: #f0f0f0;
-    color: #000;
-  }
-
-  .tab.active {
-    background-color: #fff;
-    border-left: 4px solid #0056b3;
-    border-right: none;
-    color: #0056b3;
-    font-weight: 600;
-  }
-
-  .data-table-wrapper {
-    flex: 1;
-    padding: 20px;
-  }
-
-  .data-table {
-    width: 100%;
-  }
-
-  .data-row {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    padding: 12px 16px;
-    background: #f9f9f9;
-    transition: background 0.2s ease;
-  }
-
-  .data-row:hover {
-    background: #f1f1f1;
-  }
-
-  .os-name {
-    flex: 1;
-    font-size: 15px;
-    color: #333;
-  }
-
-  .count-box {
-    background: #ffffff;
-    border: 1px solid #0056b3;
-    padding: 6px 14px;
-    font-weight: 600;
-    font-size: 15px;
-    text-align: center;
-    min-width: 70px;
-  }
-
-  .total-row {
-    background: #eaf4ff;
-    font-weight: bold;
-
-    .count-box {
-      color:#0056b3;
-    }
-  }
-}
-
-/* ======== RESPONSIVE ======== */
-@media (max-width: 700px) {
-  .scanView .main-content {
-    flex-direction: column;
-  }
-
-  .scanView .tabs {
-    flex-direction: row;
-    width: 100%;
-  }
-
-  .scanView .tab {
-    flex: 1;
-    text-align: center;
-    font-size: 13px;
-  }
-}
\ No newline at end of file
diff --git a/src/components/Equipo_Computo/pregunta3.css b/src/components/Equipo_Computo/pregunta3.css
deleted file mode 100644
index 1c0a843..0000000
--- a/src/components/Equipo_Computo/pregunta3.css
+++ /dev/null
@@ -1,167 +0,0 @@
-/* === CONTENEDOR GENERAL === */
-.pregunta-page {
-  display: flex;
-  justify-content: center;
-  padding: 2rem;
-}
-
-.pregunta-container {
-  width: 100%;
-  max-width: 1100px;
-}
-
-.pregunta-titulo {
-  text-align: center;
-  color: #1e3a8a;
-  margin-bottom: 1.2rem;
-  font-size: 1.6rem;
-  font-weight: 700;
-}
-
-.pregunta-texto {
-  font-size: 1rem;
-  font-weight: 500;
-  margin-bottom: 0.5rem;
-}
-
-.pregunta-subtexto {
-  font-size: 0.9rem;
-  color: #6b7280;
-  margin-bottom: 1rem;
-}
-
-/* === PESTAÑAS === */
-.tab-container {
-  display: flex;
-  overflow-x: auto;
-  border-bottom: 2px solid #e5e7eb;
-  margin-bottom: 1.5rem;
-}
-
-.tab {
-  padding: 0.8rem 1.2rem;
-  cursor: pointer;
-  white-space: nowrap;
-  font-weight: 500;
-  border-radius: 8px 8px 0 0;
-  transition: all 0.2s ease;
-  margin-right: 0.25rem;
-}
-
-.tab.active {
-  font-weight: 600;
-  background-color: #f3f4f6;
-}
-
-.tab.inactive {
-  color: #6b7280;
-  background-color: #ffffff;
-}
-
-.tab.inactive:hover {
-  background-color: #f9fafb;
-}
-
-/* === TABLA === */
-.tabla-container {
-  overflow-x: auto;
-  position: relative;
-}
-
-.tabla {
-  width: 100%;
-  border-collapse: collapse;
-  min-width: 950px;
-  font-size: 0.85rem;
-  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
-}
-
-.tabla th {
-  padding: 0.7rem 0.5rem;
-  text-align: center;
-  color: white;
-  font-weight: 600;
-  border: 1px solid #d1d5db;
-}
-
-.tabla .sub-header {
-  background-color: #9ca3af;
-}
-
-.tabla td {
-  border: 1px solid #e5e7eb;
-  text-align: center;
-  vertical-align: middle;
-}
-
-.tabla tr:hover td {
-  background-color: #f9fafb;
-}
-
-.tipo-procesador {
-  text-align: left;
-  font-weight: 500;
-  padding: 0.6rem 0.5rem;
-  background-color: #f9fafb;
-  color: #374151;
-}
-
-.tabla input[type="text"] {
-  width: 100%;
-  padding: 0.45rem 0.3rem;
-  border: none;
-  background-color: #f3f4f6;
-  text-align: center;
-  box-sizing: border-box;
-  color: #374151;
-}
-
-.total-celda {
-  font-weight: 600;
-  color: #111827;
-  background-color: #eef2ff;
-}
-
-.fila-total td {
-  background-color: #e0e7ff;
-  font-weight: 700;
-}
-
-/* === BOTONES === */
-.boton-consultar {
-  margin-top: 1rem;
-  background-color: #10b981;
-  color: white;
-  padding: 0.6rem 1.2rem;
-  border: none;
-  border-radius: 8px;
-  font-size: 0.9rem;
-  cursor: pointer;
-  box-shadow: 0 2px 5px rgba(16, 185, 129, 0.3);
-  transition: background-color 0.2s;
-  float: right;
-}
-
-.boton-consultar:hover {
-  background-color: #059669;
-}
-
-.boton-contenedor {
-  margin-top: 4rem;
-  text-align: right;
-}
-
-.boton.volver {
-  background-color: #2563eb;
-  color: white;
-  padding: 0.7rem 1.4rem;
-  border-radius: 8px;
-  text-decoration: none;
-  font-weight: 500;
-  box-shadow: 0 2px 5px rgba(37, 99, 235, 0.3);
-  transition: background-color 0.2s;
-}
-
-.boton.volver:hover {
-  background-color: #1d4ed8;
-}
diff --git a/src/components/Equipo_Computo/pregunta3.module.scss b/src/components/Equipo_Computo/pregunta3.module.scss
new file mode 100644
index 0000000..2409e0a
--- /dev/null
+++ b/src/components/Equipo_Computo/pregunta3.module.scss
@@ -0,0 +1,220 @@
+.scanView_P3 {
+  padding: 20px;
+  width: 100%;
+  display: flex;
+  justify-content: center;
+
+  .container_P3 {
+    width: 100%;
+    max-width: 1000px;
+    background: #fff;
+    border-radius: 12px;
+    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.1);
+    border: 1px solid #ddd;
+    overflow: hidden;
+    display: flex;
+    flex-direction: column;
+  }
+
+  .header_P3 {
+    padding: 16px 20px;
+    background: #f7f7f7;
+    border-bottom: 1px solid #e0e0e0;
+    text-align: center;
+
+    .titulo {
+      margin: 0 0 8px;
+      font-size: 20px;
+      color: #0056b3;
+    }
+
+    .texto {
+      margin: 0 0 6px;
+      font-size: 16px;
+      font-weight: 500;
+    }
+
+    .subtexto {
+      margin: 0;
+      font-size: 14px;
+      color: #666;
+    }
+  }
+
+  .mainContent_P3 {
+    display: flex;
+    min-height: 500px;
+  }
+
+  .tabs_P3 {
+    width: 230px;
+    background-color: #fafafa;
+    display: flex;
+    flex-direction: column;
+    border-right: 1px solid #ddd;
+  }
+
+  .tab_P3 {
+    padding: 12px 16px;
+    cursor: pointer;
+    color: #555;
+    background: none;
+    border: none;
+    text-align: left;
+    font-size: 14px;
+    font-weight: 500;
+    transition: all 0.2s ease;
+    border-left: 4px solid transparent;
+  }
+
+  .tab_P3:hover {
+    background-color: #f0f0f0;
+    color: #000;
+  }
+
+  .active_P3 {
+    background-color: #fff;
+    color: #0056b3;
+    font-weight: 600;
+    border-left: 4px solid #0056b3;
+  }
+
+  .content_P3 {
+    flex: 1;
+    padding: 20px;
+    display: flex;
+    flex-direction: column;
+  }
+
+.tableWrapper_P3 {
+  overflow-x: auto;
+  flex: 1;
+  padding-bottom: 10px;
+}
+
+.table_P3 {
+  width: 100%;
+  border-collapse: separate;
+  border-spacing: 0;
+  font-size: 14px;
+  background: #ffffff;
+  border-radius: 12px;
+  overflow: hidden;
+  min-width: 750px;
+
+  th {
+    background: #f1f5f9;
+    font-weight: 700;
+    padding: 12px 14px;
+    color: #003f80;
+    border-bottom: 2px solid #e2e8f0;
+    text-align: center;
+    white-space: nowrap;
+  }
+
+  td {
+    padding: 10px 12px;
+    border-bottom: 1px solid #e5e7eb;
+    text-align: center;
+    vertical-align: middle;
+  }
+
+  tr:last-child td {
+    border-bottom: none;
+  }
+
+  /* Primera columna */
+  .processor_P3 {
+    text-align: left;
+    font-weight: 600;
+    color: #334155;
+    max-width: 300px;
+  }
+}
+
+/* ----------- INPUTS ----------- */
+
+.inputBox_P3 {
+  width: 70px;
+  padding: 6px;
+  border-radius: 6px;
+  border: 1px solid #cbd5e1;
+  background: #f8fafc;
+  font-size: 14px;
+  transition: 0.2s ease;
+}
+
+.inputBox_P3:focus {
+  outline: none;
+  border-color: #3b82f6;
+  background: #ffffff;
+  box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.2);
+}
+
+/* -------- FILA NORMAL -------- */
+.dataRow_P3 {
+  background: #ffffff;
+
+  &:hover {
+    background: #f8fafc;
+  }
+}
+
+/* -------- FILA TOTAL -------- */
+.totalRow_P3 {
+  background: #e0f0ff !important;
+  font-weight: 700;
+
+  .totalCell_P3 {
+    color: #004a94;
+    font-weight: 800;
+  }
+}
+
+  .totalCell_P3 {
+    font-weight: 600;
+  }
+
+  .consultarBtn_P3 {
+    margin-top: 20px;
+    background: #0056b3;
+    color: white;
+    padding: 10px 20px;
+    border-radius: 6px;
+    border: none;
+    cursor: pointer;
+    font-weight: 600;
+    align-self: flex-start;
+  }
+
+  .emptyState_P3 {
+    color: #888;
+    font-style: italic;
+    padding: 40px 0;
+    text-align: center;
+  }
+
+}
+
+@media (max-width: 768px) {
+  .scanView_P3 .mainContent_P3 {
+    flex-direction: column;
+  }
+
+  .scanView_P3 .tabs_P3 {
+    width: 100%;
+    flex-direction: row;
+    border-right: none;
+    border-bottom: 1px solid #ddd;
+  }
+
+  .scanView_P3 .tab_P3 {
+    border-left: none;
+    border-bottom: 3px solid transparent;
+  }
+
+  .scanView_P3 .active_P3 {
+    border-left: none;
+    border-bottom: 3px solid #0056b3;
+  }
+}
\ No newline at end of file
diff --git a/src/components/Equipo_Computo/pregunta3_1.css b/src/components/Equipo_Computo/pregunta3_1.css
deleted file mode 100644
index 59fba05..0000000
--- a/src/components/Equipo_Computo/pregunta3_1.css
+++ /dev/null
@@ -1,171 +0,0 @@
-/* === CONTENEDOR GENERAL === */
-.pregunta-page {
-  display: flex;
-  justify-content: center;
-  padding: 2rem 0;
-}
-
-.pregunta-container {
-  width: 90%;
-  max-width: 1100px;
-  background-color: white;
-  padding: 1.5rem;
-  border-radius: 12px;
-  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
-}
-
-/* === TITULOS === */
-.pregunta-titulo {
-  text-align: center;
-  color: #0a2d6e;
-  margin-bottom: 1rem;
-  font-size: 1.6rem;
-  font-weight: 700;
-}
-
-.pregunta-texto {
-  font-size: 1rem;
-  font-weight: 600;
-  margin-bottom: 0.2rem;
-  color: #1f2937;
-}
-
-.pregunta-subtexto {
-  font-size: 0.9rem;
-  color: #6b7280;
-  margin-bottom: 1rem;
-}
-
-/* === PESTAÑAS === */
-.tab-container {
-  display: flex;
-  border-bottom: 3px solid #d1d5db;
-  margin-bottom: 1rem;
-}
-
-.tab {
-  padding: 0.6rem 1rem;
-  cursor: pointer;
-  font-weight: 600;
-  border-radius: 8px 8px 0 0;
-  margin-right: 0.25rem;
-  font-size: 0.9rem;
-}
-
-.tab.active {
-  color: #1e40af;
-  border: 2px solid #1e40af;
-  border-bottom: none;
-  background-color: #f3f4f6;
-}
-
-.tab.inactive {
-  color: #6b7280;
-  background-color: #fff;
-}
-
-/* === TABLA === */
-.tabla-wrapper {
-  overflow-x: auto;
-  display: flex;
-  justify-content: center;
-}
-
-.tabla-pc {
-  border-collapse: collapse;
-  width: 95%;
-  text-align: center;
-  font-size: 0.83rem;
-}
-
-.tabla-pc th,
-.tabla-pc td {
-  border: 1px solid #d1d5db;
-  padding: 0.4rem;
-}
-
-.header-procesador,
-.header-total {
-  background-color: #3b82f6;
-  color: white;
-  font-weight: 700;
-}
-
-.header-poblacion {
-  background-color: #9333ea;
-  color: white;
-  font-weight: 700;
-}
-
-.tabla-pc th {
-  text-align: center;
-}
-
-.tipo-procesador {
-  text-align: left;
-  background-color: #f9fafb;
-  font-weight: 600;
-  padding-left: 0.5rem;
-}
-
-.tabla-pc input {
-  width: 60px;
-  text-align: center;
-  border: none;
-  background-color: #f3f4f6;
-  border-radius: 4px;
-  padding: 0.2rem;
-  font-size: 0.8rem;
-  color: #111827;
-}
-
-.total-celda {
-  background-color: #e0f2fe;
-  font-weight: 600;
-  color: #1e3a8a;
-}
-
-.fila-total td {
-  background-color: #bfdbfe;
-  font-weight: 700;
-}
-
-.fila-total .total-celda {
-  background-color: #93c5fd;
-}
-
-/* === BOTONES === */
-.boton-consultar {
-  margin-top: 1rem;
-  background-color: #10b981;
-  color: white;
-  padding: 0.5rem 1rem;
-  border: none;
-  border-radius: 8px;
-  font-size: 0.9rem;
-  cursor: pointer;
-  float: right;
-  box-shadow: 0 2px 6px rgba(16, 185, 129, 0.3);
-}
-
-.boton-consultar:hover {
-  background-color: #059669;
-}
-
-.boton-contenedor {
-  text-align: right;
-  margin-top: 4rem;
-}
-
-.boton.siguiente {
-  background-color: #2563eb;
-  color: white;
-  padding: 0.6rem 1.2rem;
-  border-radius: 8px;
-  text-decoration: none;
-  font-weight: 500;
-}
-
-.boton.siguiente:hover {
-  background-color: #1e3a8a;
-}
diff --git a/src/components/Equipo_Computo/pregunta3_2.css b/src/components/Equipo_Computo/pregunta3_2.css
deleted file mode 100644
index 20173f9..0000000
--- a/src/components/Equipo_Computo/pregunta3_2.css
+++ /dev/null
@@ -1,170 +0,0 @@
-/* === ESTILOS PREGUNTA 3 (2/5) - Plataforma Apple === */
-
-.pregunta-titulo {
-  text-align: center;
-  color: #7e22ce;
-  margin-bottom: 1.2rem;
-  font-size: 1.5rem;
-  font-weight: 700;
-}
-
-.pregunta-texto {
-  font-size: 1rem;
-  font-weight: 500;
-  margin-bottom: 0.5rem;
-}
-
-.pregunta-subtexto {
-  font-size: 0.9rem;
-  color: #6b7280;
-  margin-bottom: 1rem;
-}
-
-/* === PESTAÑAS === */
-.tab-container {
-  display: flex;
-  overflow-x: auto;
-  border-bottom: 2px solid #e5e7eb;
-  margin-bottom: 1.5rem;
-}
-
-.tab {
-  padding: 0.8rem 1.2rem;
-  cursor: pointer;
-  white-space: nowrap;
-  font-weight: 500;
-  border-radius: 8px 8px 0 0;
-  transition: all 0.2s ease;
-  margin-right: 0.25rem;
-}
-
-.tab.active {
-  color: #7e22ce;
-  border-bottom: 3px solid #7e22ce;
-  background-color: #f3f4f6;
-}
-
-.tab.inactive {
-  color: #6b7280;
-  background-color: #ffffff;
-}
-
-.tab.inactive:hover {
-  color: #7e22ce;
-  background-color: #f9fafb;
-}
-
-/* === TABLA === */
-.tabla-apple-container {
-  overflow-x: auto;
-  margin-bottom: 2rem;
-  position: relative;
-}
-
-.tabla-apple {
-  width: 100%;
-  border-collapse: collapse;
-  min-width: 950px;
-  font-size: 0.85rem;
-}
-
-.tabla-apple th {
-  padding: 0.7rem 0.5rem;
-  text-align: center;
-  color: white;
-  font-weight: 600;
-  border: 1px solid #d1d5db;
-}
-
-.tabla-apple .header-procesador,
-.tabla-apple .header-total {
-  background-color: #9333ea;
-}
-
-.tabla-apple .header-poblacion {
-  background-color: #7e22ce;
-}
-
-.tabla-apple .sub-header {
-  background-color: #a855f7;
-  color: white;
-}
-
-.tabla-apple td {
-  border: 1px solid #e5e7eb;
-  text-align: center;
-  vertical-align: middle;
-}
-
-.tabla-apple .tipo-procesador {
-  text-align: left;
-  font-weight: 500;
-  padding: 0.6rem 0.5rem;
-  background-color: #faf5ff;
-  color: #4b5563;
-}
-
-.tabla-apple input[type="text"] {
-  width: 100%;
-  padding: 0.45rem 0.3rem;
-  border: none;
-  background-color: #f3f4f6;
-  text-align: center;
-  box-sizing: border-box;
-  color: #374151;
-}
-
-.tabla-apple .total-celda {
-  background-color: #f3e8ff;
-  font-weight: 600;
-  color: #7e22ce;
-}
-
-.tabla-apple .fila-total td {
-  background-color: #e9d5ff;
-  font-weight: 700;
-}
-
-.tabla-apple .fila-total .total-celda {
-  background-color: #d8b4fe;
-}
-
-/* === BOTONES === */
-.boton-consultar {
-  position: absolute;
-  bottom: -3.5rem;
-  right: 0;
-  background-color: #10b981;
-  color: white;
-  padding: 0.6rem 1.2rem;
-  border: none;
-  border-radius: 8px;
-  font-size: 0.9rem;
-  cursor: pointer;
-  box-shadow: 0 2px 5px rgba(16, 185, 129, 0.3);
-  transition: background-color 0.2s;
-}
-
-.boton-consultar:hover {
-  background-color: #059669;
-}
-
-.boton-contenedor {
-  margin-top: 5rem;
-  text-align: right;
-}
-
-.boton.siguiente {
-  background-color: #9333ea;
-  color: white;
-  padding: 0.7rem 1.4rem;
-  border-radius: 8px;
-  text-decoration: none;
-  font-weight: 500;
-  box-shadow: 0 2px 5px rgba(147, 51, 234, 0.3);
-  transition: background-color 0.2s;
-}
-
-.boton.siguiente:hover {
-  background-color: #7e22ce;
-}
diff --git a/src/components/Equipo_Computo/pregunta3_3.css b/src/components/Equipo_Computo/pregunta3_3.css
deleted file mode 100644
index 663c736..0000000
--- a/src/components/Equipo_Computo/pregunta3_3.css
+++ /dev/null
@@ -1,170 +0,0 @@
-/* === ESTILOS PREGUNTA 3 (3/5) - Portátiles Plataforma PC === */
-
-.pregunta-titulo {
-  text-align: center;
-  color: #dc2626;
-  margin-bottom: 1.2rem;
-  font-size: 1.5rem;
-  font-weight: 700;
-}
-
-.pregunta-texto {
-  font-size: 1rem;
-  font-weight: 500;
-  margin-bottom: 0.5rem;
-}
-
-.pregunta-subtexto {
-  font-size: 0.9rem;
-  color: #6b7280;
-  margin-bottom: 1rem;
-}
-
-/* === PESTAÑAS === */
-.tab-container {
-  display: flex;
-  overflow-x: auto;
-  border-bottom: 2px solid #e5e7eb;
-  margin-bottom: 1.5rem;
-}
-
-.tab {
-  padding: 0.8rem 1.2rem;
-  cursor: pointer;
-  white-space: nowrap;
-  font-weight: 500;
-  border-radius: 8px 8px 0 0;
-  transition: all 0.2s ease;
-  margin-right: 0.25rem;
-}
-
-.tab.active {
-  color: #dc2626;
-  border-bottom: 3px solid #dc2626;
-  background-color: #fef2f2;
-}
-
-.tab.inactive {
-  color: #6b7280;
-  background-color: #ffffff;
-}
-
-.tab.inactive:hover {
-  color: #dc2626;
-  background-color: #f9fafb;
-}
-
-/* === TABLA === */
-.tabla-pc-container {
-  overflow-x: auto;
-  margin-bottom: 2rem;
-  position: relative;
-}
-
-.tabla-pc {
-  width: 100%;
-  border-collapse: collapse;
-  min-width: 950px;
-  font-size: 0.85rem;
-}
-
-.tabla-pc th {
-  padding: 0.7rem 0.5rem;
-  text-align: center;
-  color: white;
-  font-weight: 600;
-  border: 1px solid #d1d5db;
-}
-
-.tabla-pc .header-procesador,
-.tabla-pc .header-total {
-  background-color: #b91c1c;
-}
-
-.tabla-pc .header-poblacion {
-  background-color: #dc2626;
-}
-
-.tabla-pc .sub-header {
-  background-color: #ef4444;
-  color: white;
-}
-
-.tabla-pc td {
-  border: 1px solid #e5e7eb;
-  text-align: center;
-  vertical-align: middle;
-}
-
-.tabla-pc .tipo-procesador {
-  text-align: left;
-  font-weight: 500;
-  padding: 0.6rem 0.5rem;
-  background-color: #fef2f2;
-  color: #4b5563;
-}
-
-.tabla-pc input[type="text"] {
-  width: 100%;
-  padding: 0.45rem 0.3rem;
-  border: none;
-  background-color: #f3f4f6;
-  text-align: center;
-  box-sizing: border-box;
-  color: #374151;
-}
-
-.tabla-pc .total-celda {
-  background-color: #fee2e2;
-  font-weight: 600;
-  color: #b91c1c;
-}
-
-.tabla-pc .fila-total td {
-  background-color: #fecaca;
-  font-weight: 700;
-}
-
-.tabla-pc .fila-total .total-celda {
-  background-color: #fca5a5;
-}
-
-/* === BOTONES === */
-.boton-consultar {
-  position: absolute;
-  bottom: -3.5rem;
-  right: 0;
-  background-color: #10b981;
-  color: white;
-  padding: 0.6rem 1.2rem;
-  border: none;
-  border-radius: 8px;
-  font-size: 0.9rem;
-  cursor: pointer;
-  box-shadow: 0 2px 5px rgba(16, 185, 129, 0.3);
-  transition: background-color 0.2s;
-}
-
-.boton-consultar:hover {
-  background-color: #059669;
-}
-
-.boton-contenedor {
-  margin-top: 5rem;
-  text-align: right;
-}
-
-.boton.siguiente {
-  background-color: #b91c1c;
-  color: white;
-  padding: 0.7rem 1.4rem;
-  border-radius: 8px;
-  text-decoration: none;
-  font-weight: 500;
-  box-shadow: 0 2px 5px rgba(220, 38, 38, 0.3);
-  transition: background-color 0.2s;
-}
-
-.boton.siguiente:hover {
-  background-color: #dc2626;
-}
diff --git a/src/components/Equipo_Computo/pregunta3_4.css b/src/components/Equipo_Computo/pregunta3_4.css
deleted file mode 100644
index 1f94b1f..0000000
--- a/src/components/Equipo_Computo/pregunta3_4.css
+++ /dev/null
@@ -1,166 +0,0 @@
-/* === CONTENEDOR GENERAL === */
-.pregunta3-container {
-  max-width: 1100px;
-  margin: 2rem auto;
-  padding: 2rem;
-  background: #fff;
-  border-radius: 16px;
-  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
-  font-family: "Inter", sans-serif;
-}
-
-.pregunta3-titulo {
-  text-align: left;
-  font-size: 1.3rem;
-  font-weight: 700;
-  color: #6d28d9;
-  margin-bottom: 1rem;
-}
-
-.pregunta3-descripcion p {
-  font-size: 1rem;
-  margin-bottom: 0.3rem;
-}
-
-.subtexto {
-  font-size: 0.9rem;
-  color: #6b7280;
-}
-
-/* === TABS === */
-.tabs {
-  display: flex;
-  flex-wrap: wrap;
-  margin: 1rem 0 1.5rem;
-  border-bottom: 2px solid #e5e7eb;
-}
-
-.tab {
-  padding: 0.8rem 1.1rem;
-  font-size: 0.9rem;
-  border: none;
-  cursor: pointer;
-  background: #fff;
-  color: #6b7280;
-  transition: all 0.2s ease;
-  border-radius: 8px 8px 0 0;
-  margin-right: 0.25rem;
-}
-
-.tab.active {
-  background: #f3f4f6;
-  color: #7e22ce;
-  border-bottom: 3px solid #9333ea;
-}
-
-.tab.inactive:hover {
-  background: #f9fafb;
-  color: #9333ea;
-}
-
-/* === TABLA === */
-.tabla-wrapper {
-  overflow-x: auto;
-  position: relative;
-  margin-bottom: 2.5rem;
-}
-
-.tabla-pregunta3 {
-  width: 100%;
-  border-collapse: collapse;
-  min-width: 950px;
-  font-size: 0.85rem;
-}
-
-.tabla-pregunta3 th,
-.tabla-pregunta3 td {
-  border: 1px solid #e5e7eb;
-  text-align: center;
-  padding: 0.5rem;
-}
-
-.header-procesador,
-.header-total {
-  background-color: #9333ea;
-  color: #fff;
-  font-weight: 600;
-}
-
-.header-poblacion {
-  background-color: #7e22ce;
-  color: #fff;
-  font-weight: 600;
-}
-
-.tabla-pregunta3 th {
-  padding: 0.7rem;
-}
-
-.tabla-pregunta3 input {
-  width: 100%;
-  padding: 0.4rem;
-  border: none;
-  background-color: #f3f4f6;
-  text-align: center;
-  font-size: 0.85rem;
-}
-
-.tipo-procesador {
-  text-align: left;
-  background-color: #faf5ff;
-  font-weight: 500;
-  color: #4b5563;
-}
-
-.celda-total {
-  background-color: #f3e8ff;
-  font-weight: 600;
-  color: #6b21a8;
-}
-
-.fila-total td {
-  background-color: #e9d5ff;
-  font-weight: 700;
-}
-
-.fila-total .celda-total.final {
-  background-color: #d8b4fe;
-}
-
-/* === BOTONES === */
-.boton-consultar {
-  position: absolute;
-  bottom: -3rem;
-  right: 0;
-  background-color: #10b981;
-  color: white;
-  padding: 0.6rem 1.1rem;
-  border: none;
-  border-radius: 8px;
-  font-size: 0.9rem;
-  cursor: pointer;
-  transition: all 0.2s;
-}
-
-.boton-consultar:hover {
-  background-color: #059669;
-}
-
-.boton-siguiente {
-  text-align: right;
-  margin-top: 4rem;
-}
-
-.next {
-  background-color: #9333ea;
-  color: white;
-  padding: 0.7rem 1.4rem;
-  border-radius: 8px;
-  text-decoration: none;
-  font-weight: 500;
-  transition: 0.2s;
-}
-
-.next:hover {
-  background-color: #7e22ce;
-}
diff --git a/src/components/Equipo_Computo/pregunta3_5.css b/src/components/Equipo_Computo/pregunta3_5.css
deleted file mode 100644
index efbc42d..0000000
--- a/src/components/Equipo_Computo/pregunta3_5.css
+++ /dev/null
@@ -1,201 +0,0 @@
-/* === ESTILOS PREGUNTA 3 (5/5) - Alto Rendimiento Servidores === */
-
-.pregunta-page {
-  display: flex;
-  justify-content: center;
-  padding: 2rem 1rem;
-  background-color: #f9fafb;
-}
-
-.pregunta-container {
-  width: 100%;
-  max-width: 1100px;
-  background-color: #ffffff;
-  border-radius: 12px;
-  padding: 2rem 2.5rem;
-  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
-}
-
-.pregunta-titulo {
-  text-align: center;
-  color: #2563eb;
-  margin-bottom: 1.5rem;
-  font-size: 1.6rem;
-  font-weight: 700;
-  border-bottom: 3px solid #2563eb;
-  display: inline-block;
-  padding-bottom: 0.3rem;
-}
-
-.pregunta-texto {
-  font-size: 1rem;
-  font-weight: 500;
-  margin-bottom: 0.5rem;
-  color: #1f2937;
-}
-
-.pregunta-subtexto {
-  font-size: 0.9rem;
-  color: #6b7280;
-  margin-bottom: 1.2rem;
-}
-
-/* === PESTAÑAS === */
-.tab-container {
-  display: flex;
-  overflow-x: auto;
-  border-bottom: 2px solid #e5e7eb;
-  margin-bottom: 1.5rem;
-}
-
-.tab {
-  padding: 0.8rem 1.2rem;
-  cursor: pointer;
-  white-space: nowrap;
-  font-weight: 500;
-  border-radius: 8px 8px 0 0;
-  transition: all 0.2s ease;
-  margin-right: 0.25rem;
-}
-
-.tab.active {
-  color: #2563eb;
-  border-bottom: 3px solid #2563eb;
-  background-color: #f3f4f6;
-  box-shadow: inset 0 -2px 4px rgba(37, 99, 235, 0.1);
-}
-
-.tab.inactive {
-  color: #6b7280;
-  background-color: #ffffff;
-}
-
-.tab.inactive:hover {
-  color: #2563eb;
-  background-color: #f9fafb;
-}
-
-/* === TABLA === */
-.tabla-servidores-container {
-  overflow-x: auto;
-  margin-bottom: 3rem;
-  position: relative;
-}
-
-.tabla-servidores {
-  width: 100%;
-  border-collapse: collapse;
-  min-width: 950px;
-  font-size: 0.85rem;
-  border-radius: 10px;
-  overflow: hidden;
-  box-shadow: 0 2px 6px rgba(37, 99, 235, 0.08);
-}
-
-.tabla-servidores th {
-  padding: 0.7rem 0.5rem;
-  text-align: center;
-  color: white;
-  font-weight: 600;
-  border: 1px solid #d1d5db;
-}
-
-.tabla-servidores .header-procesador,
-.tabla-servidores .header-total {
-  background-color: #2563eb;
-}
-
-.tabla-servidores .header-poblacion {
-  background-color: #1e40af;
-}
-
-.tabla-servidores .sub-header {
-  background-color: #3b82f6;
-  color: white;
-}
-
-.tabla-servidores td {
-  border: 1px solid #e5e7eb;
-  text-align: center;
-  vertical-align: middle;
-  background-color: #ffffff;
-  transition: background-color 0.2s;
-}
-
-.tabla-fila:hover td {
-  background-color: #f3f4f6;
-}
-
-.tabla-servidores .tipo-procesador {
-  text-align: left;
-  font-weight: 500;
-  padding: 0.6rem 0.7rem;
-  background-color: #eff6ff;
-  color: #374151;
-}
-
-.tabla-servidores input[type="text"] {
-  width: 100%;
-  padding: 0.45rem 0.3rem;
-  border: none;
-  background-color: #f9fafb;
-  text-align: center;
-  color: #374151;
-  border-radius: 4px;
-  font-weight: 500;
-}
-
-.tabla-servidores .total-celda {
-  background-color: #dbeafe;
-  font-weight: 600;
-  color: #1d4ed8;
-}
-
-.tabla-servidores .fila-total td {
-  background-color: #bfdbfe;
-  font-weight: 700;
-}
-
-.tabla-servidores .fila-total .total-celda {
-  background-color: #93c5fd;
-}
-
-/* === BOTONES === */
-.boton-consultar {
-  position: absolute;
-  bottom: -3.5rem;
-  right: 0;
-  background-color: #10b981;
-  color: white;
-  padding: 0.6rem 1.2rem;
-  border: none;
-  border-radius: 8px;
-  font-size: 0.9rem;
-  cursor: pointer;
-  box-shadow: 0 2px 5px rgba(16, 185, 129, 0.3);
-  transition: background-color 0.2s;
-}
-
-.boton-consultar:hover {
-  background-color: #059669;
-}
-
-.boton-contenedor {
-  margin-top: 5rem;
-  text-align: right;
-}
-
-.boton.volver {
-  background-color: #2563eb;
-  color: white;
-  padding: 0.7rem 1.4rem;
-  border-radius: 8px;
-  text-decoration: none;
-  font-weight: 500;
-  box-shadow: 0 2px 5px rgba(37, 99, 235, 0.3);
-  transition: background-color 0.2s;
-}
-
-.boton.volver:hover {
-  background-color: #1d4ed8;
-}
diff --git a/tsconfig.json b/tsconfig.json
index b575f7d..5d606a9 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -15,7 +15,7 @@
     "moduleResolution": "bundler",
     "resolveJsonModule": true,
     "isolatedModules": true,
-    "jsx": "react-jsx",
+    "jsx": "preserve",
     "incremental": true,
     "plugins": [
       {