.wp-block-qterra-timeline {
	counter-reset: timeline-item;
	display: grid;
	gap: var(--wp--preset--spacing--50);
}

.wp-block-qterra-timeline.timeline--columns-1 {
	grid-template-columns: 1fr;
}

.wp-block-qterra-timeline.timeline--columns-2 {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.wp-block-qterra-timeline.timeline--columns-3 {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.wp-block-qterra-timeline.timeline--columns-4 {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

.wp-block-qterra-timeline > .wp-block-qterra-timeline-item {
	min-width: 0;
}

.wp-block-qterra-timeline.timeline--columns-2 > .wp-block-qterra-timeline-item:last-child:nth-child(odd) {
	grid-column: 1 / -1;
	width: calc(50% - (var(--wp--preset--spacing--50) / 2));
	margin-inline: auto;
}

/* Horizontal layout */
.wp-block-qterra-timeline.timeline--layout-horizontal .timeline-item__inner {
	display: grid;
	column-gap: var(--wp--preset--spacing--30);
	align-items: start;
	text-align: left;
}

.wp-block-qterra-timeline.timeline--layout-horizontal .timeline-item__inner::before {
	content: counter(timeline-item, decimal-leading-zero);
	position: static;
	grid-column: 1;
	grid-row: 1 / span 4;
	width: 40px;
	height: 40px;
	margin: 0;
	border-radius: 50%;
	transform: none;
	background-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--contrast);
	font-size: 20px;
	font-weight: 700;
}

.wp-block-qterra-timeline.timeline--layout-horizontal .timeline-item__icon {
	grid-column: 2;
	grid-row: 1 / span 4;
	width: 60px !important;
	max-width: 60px !important;
	height: 60px;
	margin: 0 0 var(--wp--preset--spacing--30);
	flex: 0 0 60px;
}

.wp-block-qterra-timeline.timeline--layout-horizontal .timeline-item__icon svg {
	width: 32px;
	height: auto;
}

.wp-block-qterra-timeline.timeline--layout-horizontal .timeline-item__inner > :not(.timeline-item__icon) {
	grid-column: 3;
	min-width: 0;
}

.wp-block-qterra-timeline.timeline--layout-horizontal .timeline-item__inner h1,
.wp-block-qterra-timeline.timeline--layout-horizontal .timeline-item__inner h2,
.wp-block-qterra-timeline.timeline--layout-horizontal .timeline-item__inner h3,
.wp-block-qterra-timeline.timeline--layout-horizontal .timeline-item__inner h4,
.wp-block-qterra-timeline.timeline--layout-horizontal .timeline-item__inner h5,
.wp-block-qterra-timeline.timeline--layout-horizontal .timeline-item__inner h6,
.wp-block-qterra-timeline.timeline--layout-horizontal .timeline-item__inner p {
	margin-top: 0;
}

.wp-block-qterra-timeline.timeline--layout-horizontal .timeline-item__list {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	column-gap: var(--wp--preset--spacing--50);
	row-gap: 8px;
	margin-top: var(--wp--preset--spacing--40);
}

/* Tablet */
@media (max-width: 1100px) {
	.wp-block-qterra-timeline.timeline--columns-4,
	.wp-block-qterra-timeline.timeline--columns-3 {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

/* Mobile */
@media (max-width: 781px) {
	.wp-block-qterra-timeline {
		grid-template-columns: 1fr !important;
	}

	.wp-block-qterra-timeline.timeline--columns-2 > .wp-block-qterra-timeline-item:last-child:nth-child(odd) {
		grid-column: auto;
		width: auto;
		margin-inline: 0;
	}

	.wp-block-qterra-timeline.timeline--layout-horizontal .timeline-item__inner {
		grid-template-columns: 52px minmax(0, 1fr);
	}

	.wp-block-qterra-timeline.timeline--layout-horizontal .timeline-item__inner::before {
		grid-column: 1;
		grid-row: 1;
		width: 52px;
		height: 52px;
		font-size: 20px;
	}

	.wp-block-qterra-timeline.timeline--layout-horizontal .timeline-item__icon {
		grid-column: 1;
		grid-row: 2;
		width: 52px !important;
		max-width: 52px !important;
		height: 52px;
		margin-top: var(--wp--preset--spacing--30);
	}

	.wp-block-qterra-timeline.timeline--layout-horizontal .timeline-item__inner > :not(.timeline-item__icon) {
		grid-column: 2;
	}

	.wp-block-qterra-timeline.timeline--layout-horizontal .timeline-item__list {
		grid-template-columns: 1fr;
	}
}