/* Block style “Link cards” (columns): white cards like “Cards” (sections.css),
   each leading to the page its heading links to, e.g. the sub-pages on an
   overview page. A click anywhere on the card follows that link; it stays
   one link for screen readers and keyboards. Part of the RUB Chair theme. */

/* Under the mouse the card rises like the news cards (components.css). */
.is-style-rub-link-cards .wp-block-column {
	position: relative;
	transition: box-shadow var(--rub-transition);
}

.is-style-rub-link-cards .wp-block-column:focus-within {
	/* The library's focus: 2px RUB Blau, 4px outside the area. */
	outline: 2px solid var(--rub-accent-text);
	outline-offset: 4px;
}

.is-style-rub-link-cards h2,
.is-style-rub-link-cards h3 {
	font-size: var(--wp--preset--font-size--large);
	margin: 0 0 0.5rem;
}

.is-style-rub-link-cards :is(h2, h3) a {
	color: var(--rub-blue);
	text-decoration: none;
}

/* The heading's link stretches over the whole card. */
.is-style-rub-link-cards :is(h2, h3) a::before {
	content: "";
	inset: 0;
	position: absolute;
}

/* Its outline is drawn around the card instead (:focus-within above). */
.is-style-rub-link-cards :is(h2, h3) a:focus-visible {
	outline: none;
}

/* The arrow (Lucide) after the title: decoration, not read out. */
.is-style-rub-link-cards :is(h2, h3) a::after {
	background-color: var(--rub-light-mid);
	content: "";
	display: inline-block;
	height: 0.85em;
	margin-left: 0.35em;
	mask: url("../icons/arrow-right.svg") center / contain no-repeat;
	transition: transform var(--rub-transition);
	vertical-align: -0.05em;
	width: 0.85em;
}

.is-style-rub-link-cards .wp-block-column:hover :is(h2, h3) a::after {
	transform: translateX(3px);
}

.is-style-rub-link-cards p {
	font-size: 0.9375rem;
	margin: 0;
}

@media (prefers-reduced-motion: reduce) {
	.is-style-rub-link-cards .wp-block-column,
	.is-style-rub-link-cards :is(h2, h3) a::after {
		transition: none;
	}
}