<!DOCTYPE html>
<html lang="es">
<head>
  <meta charset="UTF-8">
  <title>Formulario Básico HTML5</title>
  <style>
    body { font-family: Arial, Helvetica, sans-serif; padding: 25px; background: #f8fafc; }
    .formulario-card {
      background: white;
      border: 1px solid #cbd5e1;
      border-radius: 8px;
      padding: 24px;
      max-width: 480px;
      box-shadow: 0 2px 4px rgba(0,0,0,0.05);
    }
    fieldset {
      border: 1px solid #94a3b8;
      border-radius: 6px;
      padding: 15px;
      margin-bottom: 15px;
    }
    legend {
      font-weight: bold;
      color: #0284c7;
      padding: 0 8px;
    }
    .campo-grupo {
      margin-bottom: 12px;
    }
    label {
      display: block;
      font-weight: 600;
      margin-bottom: 4px;
      font-size: 0.9rem;
      cursor: pointer;
    }
    input[type="text"], input[type="email"] {
      width: 100%;
      box-sizing: border-box;
      padding: 8px 12px;
      border: 1px solid #cbd5e1;
      border-radius: 6px;
      font-size: 0.95rem;
    }
    input:focus {
      outline: none;
      border-color: #0284c7;
      box-shadow: 0 0 0 3px rgba(2, 132, 199, 0.15);
    }
    .btn-submit {
      background: #0284c7;
      color: white;
      border: none;
      padding: 10px 20px;
      border-radius: 6px;
      font-weight: bold;
      cursor: pointer;
      width: 100%;
    }
    .btn-submit:hover { background: #0369a1; }
  </style>
</head>
<body>

  <div class="formulario-card">
    <h3 style="margin-top: 0; color: #0f172a;">Registro de Aspirantes</h3>

    <form action="#" method="POST" onsubmit="event.preventDefault(); alert('¡Formulario enviado correctamente!');">
      <fieldset>
        <legend>Datos Personales</legend>
        
        <div class="campo-grupo">
          <label for="nombre-completo">Nombre Completo:</label>
          <input type="text" id="nombre-completo" name="nombre" placeholder="Ej: Miguel Ángel González" required>
        </div>

        <div class="campo-grupo">
          <label for="correo-electronico">Correo Institucional:</label>
          <input type="email" id="correo-electronico" name="correo" placeholder="[email protected]" required>
        </div>
      </fieldset>

      <button type="submit" class="btn-submit">
        Enviar Solicitud de Inscripción
      </button>
    </form>
  </div>

</body>
</html>