.module-services {
	padding-top: 50px;
	padding-bottom: 50px;
	position: relative;
	z-index: 2;
	background: linear-gradient(180deg, var(--color-black) 0%, var(--color-light-blue) 100%);
}

.module-services-inner {
	display: grid;
	gap: 20px;
	grid-template-columns: repeat(1, 1fr);
}

.module-services-single {
	padding: 60px 30px;
	font-size: 24px;
	color: var(--color-white);
	background-color: var(--color-blue);
	transition: all 0.3s;
}

.module-services-single:focus,
.module-services-single:hover {
	color: var(--color-white);
	background-color: var(--color-light-blue);
}

@media screen and (min-width: 768px) {
	.module-services-inner {
		grid-template-columns: repeat(3, 3fr);
	}

	.module-services-single {
		padding: 70px 20px;
	}
}

@media screen and (min-width: 1025px) {
	.module-services-single {
		padding: 100px 30px;
	}
}