<!DOCTYPE html>
<html lang="es">
<head>
  <meta charset="UTF-8">
  <title>Citas y Abreviaturas</title>
  <style>
    body { font-family: Arial, Helvetica, sans-serif; padding: 25px; line-height: 1.6; background: #fafafa; }
    .card { background: white; border: 1px solid #e5e7eb; border-radius: 8px; padding: 25px; max-width: 550px; }
    blockquote {
      margin: 20px 0;
      padding: 12px 20px;
      background: #f3f4f6;
      border-left: 4px solid #6366f1;
      font-style: italic;
      color: #374151;
    }
  </style>
</head>
<body>

  <!-- Tarjeta de presentación de citas académicas -->
  <div class="card">
    <h2>Citas y Fuentes de Información</h2>

    <p>
      Como solía decir Tim Berners-Lee: 
      <q>La Web no conecta máquinas, conecta personas.</q>
    </p>

    <blockquote cite="https://www.w3.org/Consortium/">
      "El poder de la Web está en su universalidad. El acceso por parte de todos, independientemente de la discapacidad, es un aspecto esencial."
    </blockquote>

    <p>
      El lenguaje estándar es 
      <abbr title="HyperText Markup Language versión 5">HTML5</abbr>, mantenido por el 
      <abbr title="World Wide Web Consortium">W3C</abbr>.
    </p>

    <hr style="border: 0; border-top: 1px solid #e5e7eb;">

    <address>
      Escrito por <strong>Equipo Pedagógico de Kilopolis</strong><br>
      Soporte: <a href="mailto:[email protected]">[email protected]</a><br>
      Campus Digital, 2026.
    </address>
  </div>

</body>
</html>