/* component.cards */
/* mixins.color		*/
/* vars.ci */
/* mixins.space */
/* utilities.hacks */
/* mixins.fallbacks */
/* mixins.numbers */
/* mixins.fallbacks */
/* component.card-deck */
.card-deck {
	--body-inset: 1ex;

	--_a: calc(100% / var(--deck-items, 1));
	--_b: calc(var(--gap-inline, 0px) * var(--deck-items, 1));
	--col-item: calc(var(--_a) - var(--_b));
	--gap-block: var(--gap, 0px);
	--gap-inline: var(--gap, 0px);
	padding-inline: 0;
	container: deck / inline-size;
}

@media (min-width: 58em) {
	.card-deck {
		grid-template-columns: repeat(var(--deck-items, 2), 1fr);
	}
}

/* component.cards */
.m_card {
	--card-layout: "h" "b";
	--card-columns: [L C-start] 1fr [C-end R];
	--card-rows: [T] calc(25em / var(--factor)) [M] 1fr [B] auto;
	container: card / inline-size;
	position: relative !important;
	height: 100%;
	min-height: 12rem;
	display: grid;
	grid-template-areas: var(--card-layout, initial);
	grid-template-columns: var(--card-columns, auto);
	grid-template-rows: var(--card-rows, auto);
	transition: outline-offset 150ms ease-out;
}
.m_card .card-head {
	grid-area: h;
}
.m_card .card-body {
	--font-lineheight-3: var(--font-lineheight-2);
	grid-area: h;
	align-self: end;
	outline-offset: 0;
	box-sizing: content-box;
	margin: var(--body-inset);
	margin-top: 32cqw;
}

@media (min-width:36em) {
	.m_card .card-body {
			grid-area: b;
			align-self: start;
			margin: 0;
			height: 100%;
			outline: none;
	}
}

.m_card .card-title {
	text-align: left;
}
.m_card :is(img,svg,video) {
	--aspect: var(--ultrawide);
	object-fit: cover;
	width: 100%;
	height: 100%;
}
.m_card .btn,
.m_card :is(button, [type=button], [type=submit], [type=reset]) {
	display: none !important;
}

@media (min-width: 36em) {
	.m_card {
		--card-columns: 1fr 3fr;
		--card-layout: "h b" "h f";
	}
	.m_card.-reverse {
		--card-columns: 3fr 1fr;
		--card-layout: "b h" "f h";
	}
	.m_card[data-cover] {
		--card-columns: 1fr 1.4fr;
  	--card-layout: "h b";
	}
}

.wrap-head,
.card-head {
	grid-area: h;
	position: unset !important;
}

.wrap-body,
.card-body {
	grid-area: b;
	position: unset;
}

.wrap-foot,
.card-foot {
	grid-area: f;
	position: unset !important;
	padding-block: 1em;
	&:has(.btn) {
		text-align: end;
	}
}

.card-body:focus-within :any-link:not(.card-link) {
	position: relative;
	&:focus {
		outline: var(--outline-focus, var(--outline-width) solid var(--outline-color, currentColor));
		outline-offset: var(--outline-focus-offset);
	}
	&:focus:not(:focus-visible) {
		outline: none;
	}
}

@supports (-apple-pay-button-style: inherit) {
	@supports (image-orientation: none) and (scale: 2) {
		.card-body:focus-within :any-link:not(.card-link):focus {
			outline: none;
			box-shadow: var(--outline-shadow);
		}
	}
}

.card-body :is(p, li) {
	-webkit-hyphens: auto;
	hyphens: auto;
}

.card-link {
	display: inline-block;
	position: var(--parent-position, unset);
	-webkit-text-decoration: none;
	text-decoration: none;

	@media (prefers-contrast: no-preference), (prefers-contrast:less) {
		&:focus-visible {
			outline: none;
		}
	}
}
.card-link::after {
	position: absolute;
	content: "";
	cursor: pointer;
	inset: 0;
	z-index: 1;
}

.card-title {
	display: block;
	margin-block: 0;
	padding-block: 0;
	-webkit-hyphens: none;
	hyphens: none;
}

.teaser-card .card-head {
	background-image: var(--hero-image);
	background-position: var(--hero-pos, center center);
	background-size: cover;
	background-repeat: no-repeat;
}

.card-deck .card-foot {
	--space-inside: var(--size-3);
	padding: var(--space-inside);
	margin: var(--body-inset, 1ex);
	place-items: start;
	max-width: 100%;
	overflow-x: auto;
}

/* fill bottom corner */
.related-wrapper {
	background-image: url("/assets/images/wave-of-change-logo-horizontal.png");
	background-size: 45% auto;
  background-position: 98% calc(100% - var(--spacer));
	background-repeat: no-repeat;
}
