[selectors-5]: Update heading specs based on resolutions in #10296 (#12404)

* [selectors-5]: allow :heading() to have An+B comma separated values

* [selectors-5]: Provide guidance on specificity of :heading/:heading()

Author: keithamus

selectors-5/Overview.bs

@@ -162,6 +162,8 @@ Heading Structures: the heading pseudo-classes '':heading'', and '':heading()''<
 	matches an element which has a <a>heading level</a>, with respect to the
 	semantics defined by the document language (e.g. [[HTML5]]).
 
+	The [=specificity=] of '':heading'' is that of a class.
+
 	<div class="example">
 		For example, the following sheet contains a rule applying to all heading
 		elements in the current page:
@@ -170,16 +172,26 @@ Heading Structures: the heading pseudo-classes '':heading'', and '':heading()''<
 	</div>
 
 	As a functional pseudo-class,
-	<dfn id='heading-functional-pseudo' lt=':heading()'>:heading(<var>An+B</var>)</dfn>
+	<dfn id='heading-functional-pseudo' lt=':heading()'>:heading()</dfn>
 	notation represents elements that have a <a>heading level</a> among <var>An+B</var>.
+	The syntax is:
+
+	<pre class=prod>
+		::heading() = ::heading( <<An+B>># )
+	</pre>
+
+	The [=specificity=] of '':heading()'' is that of a class.
 
 	<div class="example">
 		The following example styles headings with levels between 1 and 3 with a
 		font-weight of 900, while headings with levels 6 onward with font-weight of
-		500:
+		500, additionally heading levels 1 and 2 will be underlined, while 3 and
+		beyond will have no text-decoration:
 
 		<pre>:heading(-n+3) { font-weight: 900; }</pre>
 		<pre>:heading(n+6) { font-weight: 500; }</pre>
+		<pre>:heading(1, 2) { text-decoration: underline; }</pre>
+		<pre>:heading(n+3) { text-decoration: none; }</pre>
 	</div>
 
 	Note: The <a>heading level</a> might be different from an element's