.wi-style-guide {
	height: 9058px;
	padding-top: 200px;
	position: relative;
}

.wi-style-guide__intro h1 {
	font-size: var(--wi-font-h1-size);
	line-height: var(--wi-line-h1);
	margin-bottom: 14px;
}

.wi-style-guide__intro p {
	font-size: var(--wi-font-paragraph-lg);
	line-height: var(--wi-line-paragraph-lg);
	margin: 0;
}

.wi-style-guide__intro img {
	height: 514px;
	margin-top: -27px;
	object-fit: cover;
	width: 757px;
}

.wi-style-guide__typography {
	padding-top: 40px;
}

.wi-style-guide__typography > * {
	margin-block: 0 52px;
}

.wi-style-guide__display {
	font-family: var(--wi-font-heading);
	font-size: 72px;
	font-weight: var(--wi-font-heading-weight);
	letter-spacing: -0.04em;
	line-height: 87.2px;
}

.wi-style-guide__p-large {
	font-size: var(--wi-font-paragraph-lg);
	line-height: var(--wi-line-paragraph-lg);
}

.wi-style-guide blockquote {
	margin: 80px 0;
	padding-top: 80px;
	position: relative;
}

.wi-style-guide blockquote::before {
	color: var(--wp--preset--color--primary-dark);
	content: "\"";
	font-family: "Cormorant", serif;
	font-size: 100px;
	font-style: italic;
	left: 0;
	position: absolute;
	top: -20px;
}

.wi-style-guide__separator {
	border-block: 1px solid var(--wp--preset--color--muted);
	margin-bottom: 32px;
	padding: 24px 0;
}

.wi-style-guide__separator h3 {
	font-size: 32px;
	line-height: 44.8px;
	margin: 0 0 24px;
}

.wi-style-guide__separator p {
	font-size: 16px;
	line-height: 22px;
	margin: 0;
}

.wi-style-guide__numbered-grid {
	display: grid;
	gap: 64px;
	grid-template-columns: repeat(2, 1fr);
	margin: 0 0 80px;
}

.wi-style-guide__numbered-grid article {
	border: 1px solid var(--wp--preset--color--muted);
	padding: 24px;
}

.wi-style-guide__numbered-grid span {
	display: block;
	font-size: 18px;
	line-height: 22px;
	margin-bottom: 36px;
}

.wi-style-guide__numbered-grid p {
	font-size: 16px;
	line-height: 25px;
	margin: 0;
}

.wi-style-guide__card-grid {
	display: grid;
	gap: 64px;
	grid-template-columns: repeat(2, 1fr);
	margin-block: 48px;
}

.wi-style-guide__card-grid article {
	border: 1px solid var(--wp--preset--color--muted);
	padding: 32px;
}

.wi-style-guide__media {
	padding-top: 100px;
}

.wi-style-guide__media-row {
	align-items: center;
	display: grid;
	gap: 64px;
	grid-template-columns: 1fr 1fr;
	margin-bottom: 80px;
}

.wi-style-guide__media-row img {
	height: 420px;
	object-fit: cover;
	width: 100%;
}

.wi-style-guide__wide {
	height: 514px;
	margin-bottom: 80px;
	object-fit: cover;
	width: 100%;
}

.wi-style-guide__gallery {
	height: 1918px;
	left: 50%;
	margin: 0;
	position: absolute;
	top: 6816px;
	transform: translateX(-50%);
	width: 1344px;
}

.wi-style-guide__gallery img {
	position: absolute;
	object-fit: cover;
}

.wi-style-guide__gallery-hero {
	height: 617px !important;
	left: 3px;
	top: 0;
	width: 1340px;
}

.wi-style-guide__gallery img:nth-child(2) {
	height: 412px;
	left: 3px;
	top: 637px;
	width: 563px;
}

.wi-style-guide__gallery img:nth-child(3) {
	height: 412px;
	left: 585px;
	top: 637px;
	width: 758px;
}

.wi-style-guide__gallery img:nth-child(4) {
	height: 417px;
	left: 0;
	top: 1069px;
	width: 372px;
}

.wi-style-guide__gallery img:nth-child(5) {
	height: 206px;
	left: 392px;
	top: 1069px;
	width: 366px;
}

.wi-style-guide__gallery img:nth-child(6) {
	height: 196px;
	left: 392px;
	top: 1290px;
	width: 366px;
}

.wi-style-guide__gallery img:nth-child(7) {
	height: 417px;
	left: 781px;
	top: 1069px;
	width: 563px;
}

.wi-style-guide__gallery img:nth-child(8) {
	height: 412px;
	left: 3px;
	top: 1506px;
	width: 951px;
}

.wi-style-guide__gallery img:nth-child(9) {
	height: 412px;
	left: 975px;
	top: 1506px;
	width: 369px;
}

@media (max-width: 767.98px) {
	.wi-style-guide {
		height: auto;
		padding-top: 100px;
	}

	.wi-style-guide__display {
		font-size: 48px;
		line-height: 52px;
	}

	.wi-style-guide__card-grid,
	.wi-style-guide__media-row,
	.wi-style-guide__gallery {
		grid-template-columns: 1fr;
	}

	.wi-style-guide__gallery {
		display: grid;
		height: auto;
		position: static;
		transform: none;
		width: auto;
	}

	.wi-style-guide__gallery img {
		height: auto !important;
		position: static;
		width: 100%;
	}

	.wi-style-guide__gallery-hero {
		grid-column: 1;
	}
}
