/*
 * tnk/feature-grid-linked-cards — stretched-link card overlay.
 *
 * The whole card is clickable while the actual <a> stays on the heading
 * (descriptive anchor text for SEO and screen readers). A pseudo-element
 * on the heading link covers the card via position:absolute. By design
 * this variant has no inner interactive elements; if a consumer site
 * adds one, that element needs position:relative;z-index:1 to stay
 * clickable above the overlay.
 *
 * Hover affordance is a border-color shift to contrast-3 (no shadow —
 * shadows are a discouraged pattern in the Thinkie design system; depth
 * comes from surface tone + 1px borders). Card uses :focus-within so
 * keyboard focus on the link surfaces a ring around the card; the link's
 * own focus ring is suppressed so we don't render two outlines.
 *
 * Scoped to .tnk-card-linked applied via the pattern's className so this
 * rule does not influence unrelated core/group usage on consumer sites.
 */
.wp-block-group.tnk-card-linked {
	position: relative;
	transition: transform 0.2s ease, border-color 0.2s ease;
}

.wp-block-group.tnk-card-linked .wp-block-heading a {
	color: inherit;
	text-decoration: none;
}

.wp-block-group.tnk-card-linked .wp-block-heading a::after {
	content: "";
	position: absolute;
	inset: 0;
}

.wp-block-group.tnk-card-linked:hover {
	transform: translateY(-2px);
	border-color: var(--wp--preset--color--contrast-3);
}

.wp-block-group.tnk-card-linked:focus-within {
	outline: 2px solid currentColor;
	outline-offset: 4px;
}

.wp-block-group.tnk-card-linked .wp-block-heading a:focus {
	outline: none;
}
