:root {
	--sk-tile-padding: 1.5em 2em;
}

@media only screen and (max-width: 1068px) {
	:root {
		--sk-tile-padding: 1.25em 1em;
	}
}

@media only screen and (max-width: 1068px) {
	.grid.grid-gutterless {
		grid-row-gap: 15px;
		grid-column-gap: 15px;
	}
}

.bg-grad {
	background: linear-gradient(to bottom, #c9e1e0 0%, #c2dbe4 100%);
}
body[data-color-scheme="dark"] .bg-grad {
	background: linear-gradient(to bottom, #052727 0%, #06222c 100%) !important;
}

.hero-lockup {
	width: 80%;
	max-width: 1400px;
}
@media only screen and (max-width: 1068px) {
	.hero-lockup {
		width: 87%;
	}
}

.router-content {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	grid-template-rows: 1fr;
	grid-column-gap: 1em;
	grid-row-gap: 1em;
}
@media only screen and (max-width: 1068px) {
	.router-content {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		grid-column-gap: 4em;
		grid-row-gap: 3em;
	}
}
@media only screen and (max-width: 734px) {
	.router-content {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		grid-column-gap: 2em;
		grid-row-gap: 2em;
	}
}

.tile-content.inline-router {
	padding: 3em !important;
}
@media only screen and (max-width: 1068px) {
	.tile-content.inline-router {
		padding: 2em !important;
	}
}
@media only screen and (max-width: 1068px) {
	.tile-content.inline-router {
		padding: 2em 1em !important;
	}
}

.router-content a sf-symbol {
	color: var(--color-fill-blue);
	font-size: 70px;
}

.router-content a:hover .link,
a.block:hover .link {
	text-decoration: underline;
}

sf-symbol + p,
img + p {
	margin-top: 0.8em;
}

/* ========== Grid ========== */
#main section.section {
	padding-top: 4em;
	padding-bottom: 4em;
}
#main section .section-content .row {
	margin-left: 0;
	margin-right: 0;
}
#main section .section-content .row > .column {
	padding: 0;
}

@media only screen and (max-width: 1068px) {
	#main section .section-content .row {
		margin-left: 0;
		margin-right: 0;
	}
	#main section .section-content .row > .column {
		padding: 0;
	}
}

@media only screen and (max-width: 734px) {
	#main section.section {
		padding-top: 3em;
		padding-bottom: 3em;
	}
	#main section .section-content .row {
		margin-left: 0;
		margin-right: 0;
	}
	#main section .section-content .row > .column {
		padding: 0;
	}
}
