<commit_before>.mod-case4 {
	display: flex;
	flex-direction: column;
	padding: @s2-moduleGap-s @s2-moduleGap-s @s2-moduleGap-s-3;
	background-color: @s2-white;

	&.gradient {
		background: linear-gradient(-20deg, transparent 0%, transparent 33%, @s2-lightgrey 33%, @s2-lightgrey 66%, transparent 66%, transparent 100%), @s2-white;

		// don't like this
		&.invert {
			background: linear-gradient(-20deg, @s2-black 0%, @s2-black 50%, transparent 50%, transparent 100%), @s2-darkblack;
		}
	}

	&.invert {
		background-color: @s2-black;
	}

	.h2-2 {
		margin: 0 0 @s2-moduleGap-s 0;
		// change to margin-bottom
	}

	.h4 {
		display: inline;
	}

	&__funfact {
		position: relative;
		bottom: 90px;
		left: 46px;
		order: -1;
		padding: 15px @s2-moduleGap-s 5px;
		border-width: 6px;
		border-style: solid;

		[data-theme=white] & {
			border-color: var(--s2-white);
		}
		[data-theme=green] & {
			border-color: var(--s2-green);
		}
		[data-theme=blue] & {
			border-color: var(--s2-blue);
		}
		[data-theme=red] & {
			border-color: var(--s2-red);
		}

		.h3 {
			margin-bottom: @s2-moduleGap-s;

			[data-theme=white] & {
				color: var(--s2-white);
			}
			[data-theme=green] & {
				color: var(--s2-green);
			}
			[data-theme=blue] & {
				color: var(--s2-blue);
			}
			[data-theme=red] & {
				color: var(--s2-red);
			}
		}
	}

	&__details {
		padding-top: 15px;

		&-heading {
			font-weight: 700;
		}

		&-item {
			margin-bottom: 25px;
		}
	}

	@media @s2-mq-window-tablet {
		padding: @s2-moduleGap-m @s2-moduleGap-m @s2-moduleGap-m-3;

		.h2-2 {
			margin-bottom: @s2-moduleGap-m;
		}

		.copyTop {
			width: 65%;
		}

		.h2-2,
		.copyRight {
			padding: 0 0 0 20%;
		}

		&__funfact {
			bottom: 110px;
			max-width: 60%;
			margin-left: auto;
		}
	}

	@media @s2-mq-window-desktop {
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: space-between;
		padding: @s2-moduleGap-l-2;

		.h2-2 {
			padding: 0;
			margin-bottom: @s2-moduleGap-l;
		}

		.copyTop {
			min-height: 240px;
			width: auto;
		}

		.copyRight {
			flex: 0 1 100%;
			padding-left: 40%;
		}

		.details {
			flex: 1 0 60%;
			max-width: 60%;
		}

		&__funfact {
			flex: 1 0 35%;			
  			align-self: flex-start;
			order: 0;
			max-width: 35%;
			left: 0;
			bottom: 215px;
		}
	}
}
<commit_msg>fix(module): change to margin-bottom<commit_after>.mod-case4 {
	display: flex;
	flex-direction: column;
	padding: @s2-moduleGap-s @s2-moduleGap-s @s2-moduleGap-s-3;
	background-color: @s2-white;

	&.gradient {
		background: linear-gradient(-20deg, transparent 0%, transparent 33%, @s2-lightgrey 33%, @s2-lightgrey 66%, transparent 66%, transparent 100%), @s2-white;

		// don't like this
		&.invert {
			background: linear-gradient(-20deg, @s2-black 0%, @s2-black 50%, transparent 50%, transparent 100%), @s2-darkblack;
		}
	}

	&.invert {
		background-color: @s2-black;
	}

	.h2-2 {
		margin-bottom: @s2-moduleGap-s;
	}

	.h4 {
		display: inline;
	}

	&__funfact {
		position: relative;
		bottom: 90px;
		left: 46px;
		order: -1;
		padding: 15px @s2-moduleGap-s 5px;
		border-width: 6px;
		border-style: solid;

		[data-theme=white] & {
			border-color: var(--s2-white);
		}
		[data-theme=green] & {
			border-color: var(--s2-green);
		}
		[data-theme=blue] & {
			border-color: var(--s2-blue);
		}
		[data-theme=red] & {
			border-color: var(--s2-red);
		}

		.h3 {
			margin-bottom: @s2-moduleGap-s;

			[data-theme=white] & {
				color: var(--s2-white);
			}
			[data-theme=green] & {
				color: var(--s2-green);
			}
			[data-theme=blue] & {
				color: var(--s2-blue);
			}
			[data-theme=red] & {
				color: var(--s2-red);
			}
		}
	}

	&__details {
		padding-top: 15px;

		&-heading {
			font-weight: 700;
		}

		&-item {
			margin-bottom: 25px;
		}
	}

	@media @s2-mq-window-tablet {
		padding: @s2-moduleGap-m @s2-moduleGap-m @s2-moduleGap-m-3;

		.h2-2 {
			margin-bottom: @s2-moduleGap-m;
		}

		.copyTop {
			width: 65%;
		}

		.h2-2,
		.copyRight {
			padding: 0 0 0 20%;
		}

		&__funfact {
			bottom: 110px;
			max-width: 60%;
			margin-left: auto;
		}
	}

	@media @s2-mq-window-desktop {
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: space-between;
		padding: @s2-moduleGap-l-2;

		.h2-2 {
			padding: 0;
			margin-bottom: @s2-moduleGap-l;
		}

		.copyTop {
			min-height: 240px;
			width: auto;
		}

		.copyRight {
			flex: 0 1 100%;
			padding-left: 40%;
		}

		.details {
			flex: 1 0 60%;
			max-width: 60%;
		}

		&__funfact {
			flex: 1 0 35%;			
  			align-self: flex-start;
			order: 0;
			max-width: 35%;
			left: 0;
			bottom: 215px;
		}
	}
}

{'fraction_non_alphanumeric': 0.18368685764268533, 'fraction_numerical': 0.05488738246227859, 'mean_word_length': 2.444277108433735, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 3, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '6634617', 'n_tokens_mistral': 2476, 'n_tokens_neox': 1997, 'n_words': 367}