.card-media {
	background-color: var(--card-background-color);
	border-radius: var(--card-border-radius);
	padding: 3.2rem;
	display: flex;
	text-decoration: none;
	transition: all var(--default-transition-params);

	&:hover {
		transform: var(--card-transform);
	}

	&.has-border {
		border: 1px solid var(--card-border-color);
	}

	&:nth-child(4n + 1) {
		border-color: #1aa8a8;
	}

	&:nth-child(4n + 2) {
		border-color: #9e4ec4;
	}

	&:nth-child(4n + 3) {
		border-color: #2c80ce;
	}

	&:nth-child(4n + 4) {
		border-color: #83120c;
	}

	&__icon-image {
		width: 6.4rem;
		height: 6.4rem;
		margin-right: 3.2rem;
	}

	&__icon-font {
		font-size: 6.4rem;
		margin-right: 3.2rem;
	}

	&__content {
		h3 {
			margin-bottom: 2rem;
			font-weight: var(--font-weight-semibold);
			font-size: 18px;
			line-height: 125%;
			color: var(--h3-color);
			@include media-min($medium) {
				font-size: 20px;
			}
		}
		p + * {
			margin-top: 1rem;
		}
	}
}