diff --git a/css/style.css b/css/style.css
index ae25028..f7bb5f6 100644
--- a/css/style.css
+++ b/css/style.css
@@ -169,6 +169,34 @@ a:hover { text-decoration: underline; }
 
 
 /* ── Cuenta atrás ──────────────────────────────────────────── */
+.countdown-wrap-indice {
+  margin: 1.5rem 0;
+  text-align: center;
+  font-size: .95rem;
+  border-radius: 8px;
+  padding: .8rem 1.2rem;
+  font-size: large;
+  font-weight: 700;
+  font-family: consolas, 'Segoe UI Mono', monospace;
+  display: flex;
+  flex-direction: column;
+}
+
+.countdown-wrap-indice a {
+  color: var(--color-borde);
+  font-size: larger;
+}
+
+.countdown-wrap-indice #countdown {
+  font-size: x-large;
+  color: var(----success);
+  margin-top: .4rem;
+  font-family: console, monospace;
+  padding: .4rem .8rem;
+  text-align: center;
+  color: var(--accent-2) !important;
+}
+
 .countdown-wrap {
   margin-top: 2rem;
   display: flex;
@@ -176,12 +204,14 @@ a:hover { text-decoration: underline; }
   align-items: center;
   gap: .6rem;
 }
+
 .countdown-label {
   font-size: .8rem;
   color: var(--text-muted);
   letter-spacing: .05em;
   text-transform: uppercase;
 }
+
 .countdown-units {
   display: flex;
   align-items: center;
@@ -228,6 +258,7 @@ a:hover { text-decoration: underline; }
   border: none;
   transition: opacity .15s, transform .1s;
 }
+
 .btn:hover { opacity: .88; transform: translateY(-1px); text-decoration: none; }
 .btn-primary { background: var(--accent);   color: #fff; }
 .btn-outline { background: transparent; border: 1.5px solid var(--accent); color: var(--accent); }
diff --git a/index.html b/index.html
index 9a73528..052fe13 100644
--- a/index.html
+++ b/index.html
@@ -65,6 +65,10 @@
 
 <main class="container main-content py-5">
 
+    <div class="countdown-wrap-indice card bg-dark border-secondary p-3 shadow">
+        <span id="countdown" class="text-info"></span> <span class="card-text"> para el examen de <br><a href="https://taiage.tatvil.es">Tecnico Auxiliar de Informática <br> de la Administración General del Estado</a></span>
+    </div>
+
     <p class="text-success h5 font-monospace">
         /** <br>
         * Hola, soy Tatiana Villa Ema <!--(<span id="edad"></span> años)--> <br>
@@ -84,7 +88,7 @@
             <h3 class="text-primary">&lt;/sobre-mi&gt;</h3>
         </div>
 
-        <div class="col-md-4">
+        <div>
             <div class="card bg-dark border-secondary p-3 shadow">
                 <h5 class="text-info">// Conocimientos</h5>