.sss-main {
	display: block;
}

.sss-hero {
	background: var(--sss-cloud);
	padding-top: 80px;
	border-bottom: var(--sss-border-width) solid var(--sss-line);
	overflow: clip;
}

.sss-hero__message {
	max-width: 640px;
	padding-bottom: 56px;
}

/* Video-background hero: the video fills the section behind the text,
   with a dark scrim (below) for contrast. Text switches to white/light
   colors since it now sits over a dark video instead of the plain
   cloud background. */
.sss-hero--video-bg {
	position: relative;
	background: var(--sss-ink);
	padding-block: 128px 96px;
}

.sss-hero--video-bg .sss-container {
	position: relative;
	z-index: 1;
}

.sss-hero--video-bg .sss-hero__message {
	padding-bottom: 0;
}

.sss-hero--video-bg h1,
.sss-hero--video-bg .sss-hero__body,
.sss-hero--video-bg .sss-hero__location {
	color: var(--sss-white);
}

.sss-hero--video-bg .sss-hero__body {
	color: rgba(255, 255, 255, 0.86);
}

.sss-hero--video-bg .sss-hero__location {
	color: rgba(255, 255, 255, 0.72);
}

.sss-hero--video-bg .sss-hero__supporting a {
	color: var(--sss-cyan);
}

.sss-page-hero {
	background: var(--sss-navy);
	padding-block: 96px 104px;
}

.sss-page-hero__title {
	color: var(--sss-white);
	margin: 0;
}

.sss-page-placeholder {
	padding-block: var(--sss-space-6);
}

.sss-page-placeholder__note {
	font-family: var(--sss-font-mono);
	font-size: 0.8125rem;
	color: var(--sss-slate);
	border-top: 1px dashed var(--sss-line);
	padding-top: var(--sss-space-3);
	margin-top: var(--sss-space-4);
}