/**
 * core/post-title — the content listing card's call to action.
 *
 * Loaded by xperience_starter_enqueue_core_block_styles() in functions.php through
 * wp_enqueue_block_style( 'core/post-title', … ), the same mechanism and for the same
 * reason as assets/css/blocks/core-navigation.css: it is core's theme-side counterpart of
 * block.json's `style` key, one stylesheet attached to one block, enqueued on render. It is
 * NOT appended to the theme's root style.css, which this theme serves as a minified stub on
 * any request where SCRIPT_DEBUG is off — a rule added there would never be served.
 *
 * WHAT THIS FIXES, AND WHY IT IS NOT A STYLING PREFERENCE. The card CTA is built as a
 * second core/post-title at level 0 with isLink true (see patterns/content-page-listing.php
 * for why core/button cannot carry a per-post label). render_block_core_post_title puts
 * get_block_wrapper_attributes() on the ROOT element and the <a> INSIDE it, so every box
 * attribute the block carries — background, border, padding — lands on the <p> and the
 * anchor stays a bare text run. Measured before this file existed, at 1440 and 390:
 *
 *   <p>  163x46, background rgb(240,100,0), padding 10px 20px, border 1px solid rgb(240,100,0)
 *   <a>  121x24, background transparent, padding 0, border 0
 *
 * The source paints all three on a.btn.btn-secondary — the ANCHOR is the padded box. So the
 * build's bordered rectangle, its pointer hit area and its focus ring were three different
 * boxes: a keyboard user's focus ring outlined a 121x24 text run inside a button that looks
 * 163x46. That is a WCAG 2.2 AA defect (2.4.11 Focus Not Obscured / 2.4.13 Focus Appearance
 * both reason about the focus indicator's relation to the component), not a 2px difference.
 *
 * WHY CSS AND NOT A BLOCK ATTRIBUTE, checked before reaching for a rung. There is no
 * attribute, support or setting on core/post-title that targets its inner <a>: block
 * supports serialise onto the wrapper by construction, and style.elements.link — the one
 * thing that does reach the anchor — carries colour and typography only, never spacing or
 * border (WP_Theme_JSON's element style schema). The rung above this is core block
 * composition, which is where the unit stays; the rungs below are block bindings and a
 * custom block, both of them PHP this theme would own forever for a link.
 *
 * SCOPED BY className, NOT BY THE BLOCK'S OWN CLASS. `.wp-block-post-title` alone would
 * repaint the card's real heading and every post title on the site. `card-cta` is a
 * customClassName on the CTA block only — core/post-title declares no
 * supports.customClassName: false, so it defaults to true and reaches the rendered wrapper.
 *
 * @package WordPress
 * @subpackage Xperience_Starter
 * @since Xperience Starter 1.0
 */

.wp-block-post-title.card-cta > a {
	/*
	 * THE BOX, MOVED HERE FROM THE WRAPPER. Every value below is the one the block
	 * attribute carried and the one the source measures on a.btn.btn-secondary.
	 *
	 * The two colours are preset custom properties, not hex literals: `secondary` is
	 * #f06400 and `white` is #ffffff in theme.json, so the token holds the exact value.
	 * 10px and 20px are NOT spacing presets — the scale is 4/8/16/24/48px and holds
	 * neither — so they stay literals, exactly as they were in the block attribute.
	 *
	 * The 1px border is the source's, not decoration: components/_buttons.scss gives
	 * .btn-secondary Bootstrap's button-variant($brand-secondary, $brand-secondary) over
	 * an unoverridden $btn-border-width of 1px, so the source's anchor carries a 1px
	 * border the same colour as its background. It is invisible and it is worth exactly
	 * the 2px between the 44px content box and the measured 46px.
	 */
	display: inline-block;
	padding: 10px 20px;
	border: 1px solid var( --wp--preset--color--secondary );
	border-radius: 0;
	background-color: var( --wp--preset--color--secondary );
	color: var( --wp--preset--color--white );

	/*
	 * vertical-align, and it is load-bearing rather than tidiness. An inline-block on the
	 * default `baseline` sits its bottom margin edge on the line's baseline, so the
	 * <p>'s line box becomes the anchor's 46px PLUS the 16px/1.5 strut's descender and
	 * the card grows by ~4px for nothing. `top` makes the line box the tallest aligned
	 * box, which is the anchor, and the wrapper measures the same 46 the box does.
	 */
	vertical-align: top;
}
