.card-section {
}

	.card-section h2 {
		margin-top: 40px;
		margin-bottom: 10px;
		font-weight: bold;
		font-size: 1rem;
		color: black;
		text-align: center;
		letter-spacing: 0;
	}

	.card-section .cards {
		display: flex;
		justify-content: space-between;
		gap: 20px;
	}

		.card-section .cards > div {
			border: solid 2px #0F9ED5;
			border-radius: 50px;
			padding: 20px 20px 15px;
			flex: 1;
			display: flex;
			flex-direction: column;
			justify-content: flex-start;
		}

		.card-section .cards h3 {
			font-size: 0.95rem;
			margin-top: 0;
			padding-bottom: 5px;
			color: var(--color-text-primary);
			font-weight: 700;
			text-align: center;
			border-bottom: solid 1px var(--bs-border-color);
			letter-spacing: -0.5px;
		}

		.card-section .cards .card-content {
			flex-grow: 1;
			display: flex;
			flex-direction: column;
			gap: 15px;
		}

			.card-section .cards .card-content p:last-of-type {
				margin-bottom: 0;
			}

			.card-section .cards .card-content .card-img-wrapper {
				flex-grow: 1;
				display: flex;
				justify-content: center;
			}

				.card-section .cards .card-content .card-img-wrapper img {
					max-width: 70px;
					align-self: flex-end;
				}

@media (max-width: 640px) {
	.card-section .cards .card-content .card-img-wrapper {
		display: none;
	}
}

@media (max-width: 1050px) {
	.card-section .cards {
		flex-direction: column;
	}

		.card-section .cards > div {
			padding: 10px 20px 15px;
		}

		.card-section .cards .card-content {
			flex-direction: row;
		}

			.card-section .cards .card-content .card-img-wrapper {
				margin-top: 0;
				order: -1;
				align-self: center;
			}

				.card-section .cards .card-content .card-img-wrapper img {
					align-self: flex-start;
				}
}