Aligning text across List rows.md

I have a basic List row I am building that has a large number on the leading edge followed by a title and subtitle next to it:

I started with a simple implementation, like so:

HStack {
	Text("26")
		.font(.title)
	VStack(alignment: .leading) {
		Text("Some title")
			.font(.body)
			.bold()
		Text("Some subtitle")
			.font(.caption)
	}
}

However, because different numbers have different widths my alignment is less than ideal when viewed in the List:

To correct this I ended up using a GeometryReader to grab the height of the row, pad it by 20%, and set that as the width of the number text, like so:

GeometryReader { geometry in
	HStack {
		Text("26")
			.font(.title)
			.frame(width: geometry.size.height * 1.2)
		VStack(alignment: .leading) {
			Text("Some title")
				.font(.body)
				.bold()
			Text("Some subtitle")
				.font(.caption)
		}
	}
}

This works!

However, this approach feels kludgy.

My question to you, dear forum frequenters: Is there a better way? Perhaps using alignment guides or another tool I'm not yet aware of?