.split-cards {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: var(--s-sm);
	background-color: var(--c-bg-lt);

	@media (min-width: 768px) {
		gap: var(--s-md);
	}

	@media (min-width: 992px) {
		flex-direction: row;
		flex-wrap: wrap;
		gap: var(--s-lg);
	}

	> h2 {
		text-align: center;
		width: 100%;
	}

	> img {
		width: 100%;
		object-fit: cover;
		border-top-left-radius: var(--s-lg);
		border-bottom-right-radius: var(--s-lg);

		@media (max-width: 991px) {
			max-height: 35vh;
		}

		@media (min-width: 992px) {
			width: calc(50% - (var(--s-lg) / 2));
			max-height: 90vh;
			outline: var(--s-sm) solid var(--c-white);
			aspect-ratio: 3 / 4;
		}
	}

	> ul {
		@media (min-width: 992px) {
			display: flex;
			flex-direction: column;
			width: calc(50% - (var(--s-lg) / 2));
		}

		> li {
			max-width: var(--w-md);

			&:not(:first-child) {
				margin-top: var(--s-sm);
			}

			> div {
				margin-top: var(--s-xs);
			}
		}
	}
}