/* Post Link
 *
 * Resource cards in the archive loops. The whole card is one link, so nothing
 * inside it may be a link of its own: the title, image and type label are plain
 * elements and the call to action is a paragraph drawn to look like the site's
 * Read More link.
--------------------------------------------- */

.wp-block-post-template .post-link.gtt-resource-card {
	display: flex;
	flex-direction: column;
	box-sizing: border-box;
	height: 100%;
	padding: var(--wp--preset--spacing--12);
	background-color: var(--wp--preset--color--white);
	border: 1px solid var(--wp--preset--color--silver-sand);
	border-radius: 8px;
	box-shadow: var(--wp--preset--shadow--small-dark);
	color: var(--wp--preset--color--shark);
	text-decoration: none;
	transition:
		box-shadow 0.25s ease,
		transform 0.25s ease;
}

.wp-block-post-template a.post-link.gtt-resource-card:hover,
.wp-block-post-template a.post-link.gtt-resource-card:focus-visible {
	box-shadow: var(--wp--preset--shadow--large-dark);
	transform: translateY(-2px);
}

/* The block's own hover underlines the title; the call to action carries it here. */
.wp-block-post-template a.post-link.gtt-resource-card:hover .wp-block-post-title,
.wp-block-post-template a.post-link.gtt-resource-card:focus .wp-block-post-title {
	text-decoration: none;
}

.wp-block-post-template a.post-link.gtt-resource-card:hover .gtt-resource-card__cta,
.wp-block-post-template a.post-link.gtt-resource-card:focus-visible .gtt-resource-card__cta {
	text-decoration: underline;
	text-decoration-thickness: 2px;
}

.wp-block-post-template .gtt-resource-card__inner {
	flex: 1 1 auto;
	min-height: 100%;
}

/* Image: clipped to its radius so the zoom stays inside the frame. */
.wp-block-post-template .gtt-resource-card .wp-block-post-featured-image {
	overflow: hidden;
	border-radius: 4px;
}

.wp-block-post-template .gtt-resource-card .wp-block-post-featured-image img {
	display: block;
	transition: transform 0.4s ease;
}

.wp-block-post-template a.post-link.gtt-resource-card:hover .wp-block-post-featured-image img,
.wp-block-post-template a.post-link.gtt-resource-card:focus-visible .wp-block-post-featured-image img {
	transform: scale(1.04);
}

/* Call to action, drawn like core_read-more.css but on a paragraph. */
.wp-block-post-template .gtt-resource-card__cta::after {
	content: "";
	display: inline-block;
	width: 12px;
	height: 12px;
	margin-left: 8px;
	vertical-align: middle;
	background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 12 10" fill="%23242729"><path d="m7.28.21.094.083 4 4 .062.068.075.103.057.104.03.066.028.083.026.109.013.115v.119l-.013.112-.026.111-.057.15-.079.134-.033.046-.083.094-4 4a1 1 0 0 1-1.497-1.32l.083-.094L8.25 6H1.333a1 1 0 0 1-.117-1.993L1.333 4h6.919L5.96 1.707A1 1 0 0 1 7.178.14l.102.07Z"/></svg>') right center / auto 12px no-repeat;
	transition: transform 0.2s ease;
}

.wp-block-post-template a.post-link.gtt-resource-card:hover .gtt-resource-card__cta::after {
	transform: translateX(3px);
}

/* List rows: content beside an optional publication logo. */
.wp-block-post-template .post-link.gtt-resource-card--list {
	flex-direction: row;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--wp--preset--spacing--32);
	padding: var(--wp--preset--spacing--24);
}

.wp-block-post-template .gtt-resource-card--list .gtt-resource-card__body {
	flex: 1 1 320px;
	min-width: 0;
}

.wp-block-post-template .gtt-resource-card--logo .gtt-resource-card__logo {
	flex: 0 0 200px;
	margin: 0;
	border-radius: 0;
}

.wp-block-post-template .gtt-resource-card--logo .gtt-resource-card__logo img {
	object-fit: contain;
	object-position: left center;
}

@media (prefers-reduced-motion: reduce) {
	.wp-block-post-template .post-link.gtt-resource-card,
	.wp-block-post-template .gtt-resource-card .wp-block-post-featured-image img,
	.wp-block-post-template .gtt-resource-card__cta::after {
		transition: none;
	}

	.wp-block-post-template a.post-link.gtt-resource-card:hover {
		transform: none;
	}

	.wp-block-post-template a.post-link.gtt-resource-card:hover .wp-block-post-featured-image img {
		transform: none;
	}
}
