.sq-block--story-grid .sq-story-grid__content {
	--grid-padding: 1.6rem;
}

.sq-block--story-grid {
	padding: 0;
}

.sq-block--story-grid .sq-container {
	padding-left: 0;
	padding-right: 0;
}

.sq-block--story-grid .sq-story-grid {
	display: block;
	grid-template-columns: none;
	gap: 0;
}

.sq-block--story-grid .sq-story-grid__text p {
	margin: 0;
	font-size: 2.2rem;
	font-weight: 500;
	line-height: 1.5;
	letter-spacing: -0.03em;
	text-align: left;
}

.sq-block--story-grid .sq-story-grid__text p + p {
	margin-top: 1em;
}

.sq-block--story-grid .sq-story-grid__text-container--start .sq-story-grid__text :is(h1, h2, h3, h4, h5, h6) {
	text-align: center;
}

.sq-block--story-grid .sq-story-grid__figure {
	position: relative;
	overflow: hidden;
	margin: 0;
	border-radius: 0;
}

.sq-block--story-grid .sq-story-grid__image {
	position: absolute;
	inset: 0;
	display: block;
	max-width: none;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	border-radius: 0;
}

.sq-block--story-grid .sq-story-grid img {
	border-radius: 0;
}

.sq-block--story-grid .sq-story-grid__start {
	display: grid;
	grid-template-columns: var(--grid-padding) 16fr 89fr 73fr 183fr var(--grid-padding);
	grid-template-rows: 64fr 200fr 32fr 131fr 85fr 120fr;
}

.sq-block--story-grid .sq-story-grid__text-container--start {
	grid-area: 2 / 3 / 3 / 6;
}

.sq-block--story-grid .sq-story-grid__figure--start-one {
	grid-area: 4 / 4 / 6 / 7;
}

.sq-block--story-grid .sq-story-grid__figure--start-two {
	grid-area: 5 / 3 / 7 / 5;
}

.sq-block--story-grid .sq-story-grid__center {
	display: grid;
	grid-template-columns: var(--grid-padding) 16fr 48fr 105fr 42fr 48fr 86fr 16fr var(--grid-padding);
	grid-template-rows: 32fr 210fr 32fr 114fr 97fr 125fr 32fr 189fr 41fr 208fr 27fr 101fr;
}

.sq-block--story-grid .sq-story-grid__text-container--center-one {
	grid-area: 2 / 2 / 3 / 8;
}

.sq-block--story-grid .sq-story-grid__figure--center-one {
	grid-area: 5 / 5 / 7 / 8;
	z-index: 1;
}

.sq-block--story-grid .sq-story-grid__figure--center-two {
	grid-area: 4 / 1 / 6 / 7;
}

.sq-block--story-grid .sq-story-grid__text-container--center-two {
	grid-area: 8 / 2 / 9 / 9;
}

.sq-block--story-grid .sq-story-grid__figure--center-three {
	grid-area: 10 / 4 / 12 / 10;
}

.sq-block--story-grid .sq-story-grid__figure--center-four {
	grid-area: 11 / 3 / 13 / 6;
}

	/* Schakelt de oudere globale offset op even figuren uit style.css uit. */
	.sq-block--story-grid .sq-story-grid .sq-story-grid__figure {
		transform: none;
	}

.sq-block--story-grid .sq-story-grid__text-container--center-one,
.sq-block--story-grid .sq-story-grid__text-container--center-two {
	position: relative;
	overflow: hidden;
}

.sq-block--story-grid .sq-story-grid__end {
	display: grid;
	grid-template-columns: var(--grid-padding) 1fr var(--grid-padding);
	grid-template-rows: 3.2rem 1fr 6.4rem;
}

.sq-block--story-grid .sq-story-grid__text-container--end {
	grid-area: 2 / 2 / 3 / 3;
}

.sq-block--story-grid .sq-story-grid__figure--end-one {
	display: none;
}

.sq-block--story-grid .sq-story-grid__text-container--end img {
	width: auto;
	display: inline-block;
}

@media only screen and (min-width: 600px) {
	.sq-block--story-grid .sq-story-grid__content {
		--grid-padding: 3.2rem;
	}

	.sq-block--story-grid .sq-story-grid__start {
		grid-template-rows: 64fr 200fr 32fr 131fr 85fr 120fr;
	}

	.sq-block--story-grid .sq-story-grid__text-container--start .sq-story-grid__text,
	.sq-block--story-grid .sq-story-grid__text-container--start .sq-story-grid__text h2,
	.sq-block--story-grid .sq-story-grid__text-container--start .sq-story-grid__text span {
		text-align: center;
	}

	/* Volgt de verhoudingen van het bronbeeld tussen 600 en 767px. */
	.sq-block--story-grid .sq-story-grid__figure--start-one {
		aspect-ratio: 1.293;
	}

	.sq-block--story-grid .sq-story-grid__figure--start-two {
		aspect-ratio: 0.793;
	}

	.sq-block--story-grid .sq-story-grid__figure--center-one {
		aspect-ratio: 1.201;
	}

	.sq-block--story-grid .sq-story-grid__figure--center-two {
		aspect-ratio: 2.019;
	}

	.sq-block--story-grid .sq-story-grid__figure--center-three {
		aspect-ratio: 2.058;
	}

	.sq-block--story-grid .sq-story-grid__figure--center-four {
		aspect-ratio: 2.309;
	}
}

@media only screen and (min-width: 768px) and (max-width: 999px) {
	/* Volgt de verhoudingen van het bronbeeld vanaf 768px. */
	.sq-block--story-grid .sq-story-grid__figure--start-one {
		aspect-ratio: 2.795;
	}

	.sq-block--story-grid .sq-story-grid__figure--start-two {
		aspect-ratio: 1.749;
	}

	.sq-block--story-grid .sq-story-grid__figure--center-one {
		aspect-ratio: 1.986;
	}

	.sq-block--story-grid .sq-story-grid__figure--center-two {
		aspect-ratio: 3.274;
	}

	.sq-block--story-grid .sq-story-grid__figure--center-three {
		aspect-ratio: 3.345;
	}

	.sq-block--story-grid .sq-story-grid__figure--center-four {
		aspect-ratio: 3.817;
	}
}

@media only screen and (min-width: 1000px) {
	:where(body.scroll_horizontal) .sq-block--story-grid [class*="sq-story-grid__figure--"] {
        aspect-ratio: auto;
    }
}

@media only screen and (min-width: 1000px) {
	/* Paneelopmaak hangt aan de scrollrichting en niet aan de schermbreedte, dus
	   alles hieronder is op body.scroll_horizontal gescoopt; op een verticale
	   pagina valt het blok terug op de stroomlayout hierboven. `:where()` houdt de
	   specificiteit op nul, zodat de bredere media-queries verderop blijven winnen. */

	:where(body.scroll_horizontal) .sq-block--story-grid {
		padding: var(--header-height) 0;
		width: max-content;
		overflow-x: visible;
	}

	:where(body.scroll_horizontal) .sq-block--story-grid .sq-container {
		width: max-content;
		max-width: none;
	}

	:where(body.scroll_horizontal) .sq-block--story-grid .sq-story-grid__content {
		min-height: calc(var(--window-height) - (var(--header-height) * 2));
		height: calc(var(--window-height) - (var(--header-height) * 2));
		display: flex;
		flex-flow: row nowrap;
	}

	:where(body.scroll_horizontal) .sq-block--story-grid .sq-story-grid__content > * {
		flex-shrink: 0;
		height: 100%;
	}

	:where(body.scroll_horizontal) .sq-block--story-grid .sq-story-grid__start {
		width: calc(0.853 * var(--window-width));
		grid-template-columns: 280fr 32fr 360fr 300fr 188fr 68fr;
		grid-template-rows: 112fr 155fr 77fr 120fr 37fr 251fr 16fr;
	}

	:where(body.scroll_horizontal) .sq-block--story-grid .sq-story-grid__text-container--start {
		position: relative;
		grid-area: 3 / 2 / 6 / 6;
		z-index: 1;
		overflow: visible;
		display: flex;
		align-items: center;
	}

	:where(body.scroll_horizontal) .sq-block--story-grid .sq-story-grid__text-container--start .sq-story-grid__text,
	:where(body.scroll_horizontal) .sq-block--story-grid .sq-story-grid__text-container--center-one .sq-story-grid__text,
	:where(body.scroll_horizontal) .sq-block--story-grid .sq-story-grid__text-container--center-two .sq-story-grid__text,
	:where(body.scroll_horizontal) .sq-block--story-grid .sq-story-grid__text-container--end .sq-story-grid__text {
		position: absolute;
	}

	:where(body.scroll_horizontal) .sq-block--story-grid .sq-story-grid__figure--start-one {
		grid-area: 5 / 1 / 7 / 3;
	}

	:where(body.scroll_horizontal) .sq-block--story-grid .sq-story-grid__image--start-one {
		object-position: right center;
	}

	:where(body.scroll_horizontal) .sq-block--story-grid .sq-story-grid__figure--start-two {
		grid-area: 2 / 4 / 4 / 5;
	}

	:where(body.scroll_horizontal) .sq-block--story-grid .sq-story-grid__center {
		width: calc(1.382 * var(--window-width));
		grid-template-columns: 129fr 129fr 342fr 35fr 89fr 524fr 229fr 127fr 66fr 261fr 60fr;
		grid-template-rows: 80fr 11fr 102fr 178fr 59fr 17fr 44fr 126fr 79fr 9fr 63fr;
	}

	:where(body.scroll_horizontal) .sq-block--story-grid .sq-story-grid__text-container--center-one {
		grid-area: 4 / 4 / 7 / 7;
		z-index: 3;
	}

	:where(body.scroll_horizontal) .sq-block--story-grid .sq-story-grid__text-container--center-two {
		grid-area: 8 / 6 / 9 / 9;
		z-index: 3;
	}

	:where(body.scroll_horizontal) .sq-block--story-grid .sq-story-grid__figure--center-one {
		grid-area: 5 / 1 / 10 / 3;
		z-index: 1;
	}

	:where(body.scroll_horizontal) .sq-block--story-grid .sq-story-grid__figure--center-two {
		grid-area: 2 / 2 / 6 / 5;
		z-index: 2;
	}

	:where(body.scroll_horizontal) .sq-block--story-grid .sq-story-grid__figure--center-three {
		grid-area: 3 / 8 / 7 / 12;
		z-index: 2;
	}

	:where(body.scroll_horizontal) .sq-block--story-grid .sq-story-grid__figure--center-four {
		grid-area: 5 / 10 / 10 / 11;
		z-index: 1;
	}

	:where(body.scroll_horizontal) .sq-block--story-grid .sq-story-grid__end {
		width: calc(0.764 * var(--window-width));
		grid-template-columns: 57fr 584fr 64fr 292fr 103fr;
		grid-template-rows: 216fr 308fr 124fr 108fr 12fr;
	}

	:where(body.scroll_horizontal) .sq-block--story-grid .sq-story-grid__text-container--end {
		position: relative;
		grid-area: 2 / 2 / 4 / 4;
		z-index: 1;
	}

	:where(body.scroll_horizontal) .sq-block--story-grid .sq-story-grid__figure--end-one {
		display: block;
		grid-area: 3 / 3 / 5 / 5;
	}
}
