@font-face {
	font-family: 'Agipo Light';
	src: url('../fonts/AgipoLight.woff2') format('woff2'),
		url('../fonts/AgipoLight.woff') format('woff');
	font-weight: 300;
	font-style: normal;
	font-display: swap;
}

.text-blocks {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	column-gap: 49px;
	row-gap: 48px;
	width: 100%;
	margin: 0;
	color: #231f20;
	font-family: 'Agipo Light', sans-serif;
	overflow-wrap: break-word;
}

.text-blocks__intro {
	grid-column: 1 / -1;
	width: calc((100% - 98px) * 2 / 3 + 49px);
	font-size: 20px;
	font-style: normal;
	font-weight: 300;
	line-height: 30px;
}

.text-blocks__intro > *,
.renewal-content .text-blocks__intro > * {
	max-width: none;
	margin: 0;
}

.text-blocks__item {
	min-width: 0;
}

.text-blocks__heading {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	width: 100%;
	margin-bottom: 12px;
}

.text-blocks__number {
	display: flex;
	flex: 0 0 28px;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	background-color: #fa643c;
	color: #fff;
	font-family: 'Agipo Light', sans-serif;
	font-size: 18px;
	font-style: normal;
	font-weight: 300;
	line-height: 20px;
	text-align: center;
}

.text-blocks__title,
.renewal-content .text-blocks__title {
	display: flex;
	align-items: center;
	min-width: 0;
	min-height: 28px;
	margin: 0;
	color: #231f20;
	font-family: 'Agipo Light', sans-serif;
	font-size: 18px;
	font-style: normal;
	font-weight: 300;
	line-height: 20px;
	letter-spacing: 0;
	text-transform: uppercase;
}

.text-blocks__text, .text-blocks__text p, .text-blocks__text ul li,
.renewal-content .text-blocks__text, .renewal-content .text-blocks__text p, .renewal-content .text-blocks__text ul li {
	color: #231f20;
	font-family: 'Agipo Light', sans-serif;
	font-size: 16px;
	font-style: normal;
	font-weight: 300;
	line-height: 24px;
}

.text-blocks__text > *,
.renewal-content .text-blocks__text > * {
	max-width: none;
	margin: 0;
}

.text-blocks__text a {
	color: #fa643c;
	text-decoration: underline;
}

.text-blocks__text a:hover,
.text-blocks__text a:focus {
	text-decoration: none;
}

.text-blocks--empty {
	display: block;
	min-height: 100px;
	padding: 32px;
	border: 1px dashed #fa643c;
	text-align: center;
}

@media (min-width: 768px) and (max-width: 1023.98px) {
	.text-blocks {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		column-gap: 40px;
	}

	.text-blocks__intro {
		width: 100%;
	}
}

@media (max-width: 767.98px) {
	.text-blocks {
		grid-template-columns: minmax(0, 1fr);
		row-gap: 36px;
	}

	.text-blocks__intro {
		width: 100%;
	}
}
