Is it possible to make url-info into a link, or edit it so there's html content inside?

The extra-short answer:

No. (insert pensive emote here)

The relatively-long rundown:

For all of its nifty additions and pseudo-doohickeys and selectors and lord knows what else, CSS is ultimately meant for styling; nothing else. If JS was allowed, then sure, you could hack together a tidbit that'd replace that area with [whatever], but alas.

It doesn't help that half-answers aren't really satisfactory. For example's sake, you can hide the original text and then add something of your own, perhaps as such...

.profile .url-info p {
  font-size: 0px;
  user-select: none;
}
.profile .url-info p:first-of-type:after {
  font-size: 12px;
  content: "Here's a test link; https://example.com"
}

... but herein lies a problem; even if you were to reset that user-select property in :after, e.g. with user-select: all; for the hell of it, it still wouldn't let the reader/user select that text because anything under content doesn't show up in the DOM in the first place, so the best they can do is write your link down by hand in the URL bar, which is either fine or painstaking as hell depending on how long your link is in the first place.

Webdev's great, innit?