:root {
	--betiton-grouped-info-table-background: #f0f0f0;
	--betiton-grouped-info-table-text-color: #2b2a33;
	--betiton-grouped-info-table-heading-background: #757575;
	--betiton-grouped-info-table-heading-text-color: #ffffff;
	--betiton-grouped-info-table-cell-background: #ffffff;
	--betiton-grouped-info-table-border-color: #e0e0e0;
	--betiton-grouped-info-table-box-shadow-color: rgba(0, 0, 0, 0.1);
}

.block__grouped-info-table {
	background-color: var(--betiton-grouped-info-table-background);
	color: var(--betiton-grouped-info-table-text-color);
	width: 100vw;
	position: relative;
	left: 50%;
	right: 50%;
	margin-left: -50vw;
	margin-right: -50vw;
	padding: 60px 0;

	.frame {
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 30px;
		max-width: 980px;
		margin: 0 auto;
	}

	.block__header {
		width: 100%;
		text-align: center;
	}

	.block__header h2 {
		margin-bottom: 5px;
	}

	.block__header p:last-child {
		margin-bottom: 0;
	}

	.block__content {
		width: 100%;
		display: flex;
		flex-direction: column;
		gap: 10px;
		align-items: center;
	}

	.block__content-title {
		font-family: Urbanist, sans-serif;
		font-size: 24px;
		font-weight: 800;
		line-height: 34px;
		letter-spacing: 0.12px;
		color: inherit;
		margin: 0;
		text-align: center;
	}

	.block__items-wrap {
		width: calc(100% + 40px);
		padding: 20px;
		margin: -20px;
	}

	.block__items {
		display: flex;
		flex-direction: column;
		background: var(--betiton-grouped-info-table-cell-background);
		border: 1px solid var(--betiton-grouped-info-table-border-color);
		border-radius: 20px;
		box-shadow: 0 3px 10px 0
			var(--betiton-grouped-info-table-box-shadow-color);
		overflow: hidden;
	}

	.block__item {
		display: flex;
		align-items: stretch;
		border-bottom: 1px solid var(--betiton-grouped-info-table-border-color);
	}

	.block__item:last-child {
		border-bottom: none;
	}

	.block__item--heading {
		flex: 0 0 200px;
		background: var(--betiton-grouped-info-table-heading-background);
		color: var(--betiton-grouped-info-table-heading-text-color);
		padding: 16px 20px;
		display: flex;
		align-items: flex-start;
	}

	.block__item--heading h3 {
		font-family: Inter, sans-serif;
		font-size: 18px;
		font-weight: 700;
		line-height: 27px;
		letter-spacing: 0;
		color: inherit;
		margin: 0;
	}

	.block__item--content {
		flex: 1 1 0;
		min-width: 0;
		padding: 16px 20px;
		background: var(--betiton-grouped-info-table-cell-background);
		color: var(--betiton-grouped-info-table-text-color);
		display: flex;
		flex-direction: column;
		justify-content: center;
	}

	.block__item--content > *:empty {
		display: none;
	}

	.block__item--content ul {
		padding-left: 24px;
		list-style: disc;
		margin: 0 !important;
	}

	.block__item--content ul li {
		margin: 0;
		padding: 0 !important;
	}

	.block__item--content ul li:before {
		display: none;
	}

	.block__item--content p {
		margin: 0;
	}

	.block__item--content p + p {
		margin-top: 8px;
	}

	/* ------------------------------------------------------------ *\
		Tablet (<= 1023px)
	\* ------------------------------------------------------------ */
	@media (max-width: 1023px) {
		padding: 30px 0;

		.frame {
			gap: 20px;
			max-width: 100%;
		}

		.block__content {
			align-items: stretch;
		}

		.block__content-title {
			font-family: Inter, sans-serif;
			font-size: 18px;
			font-weight: 700;
			line-height: 27px;
			letter-spacing: 0;
			text-align: left;
		}

		.block__items {
			border-radius: 16px;
		}

		.block__item--heading {
			flex: 0 0 160px;
		}
	}

	/* ------------------------------------------------------------ *\
		Mobile (<= 767px)
	\* ------------------------------------------------------------ */
	@media (max-width: 767px) {
		background-color: #ffffff;
		padding: 30px 0;

		.block__header {
			text-align: left;
			padding: 0;
		}

		.block__header h2 {
			text-align: left;
		}

		.block__items-wrap {
			overflow-x: auto;
			-webkit-overflow-scrolling: touch;
		}

		.block__items {
			min-width: 600px;
		}

		.block__item--heading {
			flex: 0 0 160px;
		}
	}
}