#main section.section.section-banner {
	margin: 0;
	padding: 1em 0;
	color: #fff;
	background-color: #0071E3;
	font-size: 14px;
}
#main section.section.section-banner a {
	color: #fff;
}
@media only screen and (max-width: 735px) {
	#main section.section.section-banner {
		padding: 1em;
	}
}

.bg-gradient-skyblue {
	background: linear-gradient(to bottom, #ebf1f2 0%,#bde9ee 100%);
}

.row-header {
	margin-bottom: 4em;
}

.icon-homekit {
	width: 96px;
	height: 96px;
	background-size: 100% 100%;
	margin: 0 auto 1.5em;
	background-image: url("/assets/elements/icons/homekit/homekit-96x96.png");
}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-resolution: 1.5dppx), only screen and (min-resolution: 144dpi) {
	.icon-homekit {
		background-image: url("/assets/elements/icons/homekit/homekit-96x96_2x.png");
	}
}

.badge-homekit {
	margin-top: 1em;
	margin-bottom: 2em;
	width: 180px;
	height: 46px;
	background-size: 100% 100%;
	background-repeat: no-repeat;
	background-position: center;
	background-image: url("/homekit/images/homekit-badge.svg");
}

.lockup-hero {
	margin-top: 4em;
	width: 1017px;
	height: 489px;
	background-size: 100% 100%;
	background-repeat: no-repeat;
	background-position: center;
	background-image: url("/homekit/images/lockup-hero-large.jpg");
}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-resolution: 1.5dppx), only screen and (min-resolution: 144dpi) {
	.lockup-hero {
		background-image: url("/homekit/images/lockup-hero-large_2x.jpg");
	}
}

.icon-matter {
	margin-bottom: 1em;
	width: 280px;
	height: 97px;
	background-size: 100% 100%;
	background-repeat: no-repeat;
	background-position: center;
	background-image: url("/homekit/images/matter.png");
}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-resolution: 1.5dppx), only screen and (min-resolution: 144dpi) {
	.icon-matter {
		background-image: url("/homekit/images/matter_2x.png");
	}
}

@media only screen and (max-width: 1068px) {
	.lockup-hero {
		width: 663px;
		height: 325px;
		background-image: url("/homekit/images/lockup-hero-medium.jpg");
	}
	@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-resolution: 1.5dppx), only screen and (min-resolution: 144dpi) {
		.lockup-hero {
			background-image: url("/homekit/images/lockup-hero-medium_2x.jpg");
		}
	}
}

@media only screen and (max-width: 735px) {
	.row-header {
		margin-bottom: 0;
	}
	.section-developing h3 {
		margin-top: 1.6em;
	}
	.lockup-hero {
		margin-top: 1em;
		width: 335px;
		height: 164px;
		background-image: url("/homekit/images/lockup-hero-small.jpg");
	}
	@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-resolution: 1.5dppx), only screen and (min-resolution: 144dpi) {
		.lockup-hero {
			background-image: url("/homekit/images/lockup-hero-small_2x.jpg");
		}
	}
}

@media only screen and (max-width: 320px) {
	.lockup-hero {
		width: 280px;
		height: 135px;
	}
}


/* ========== Grid ========== */
#main section.section {
	padding-top: 4em;
	padding-bottom: 4em;
}
#main section.section.section-matter {
	padding-top: 2em;
}
#main section .section-content .row {
	margin-left: 0;
	margin-right: 0;
}
#main section .section-content .row > .column {
	padding: 0;
}
#main section .section-content .row > .column.column-split:first-of-type {
	padding-right: 1em;
}
#main section .section-content .row > .column.column-split:last-of-type {
	padding-left: 1em;
}

@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: 735px) {
	#main section.section {
		padding-top: 3em;
		padding-bottom: 3em;
	}#main section.section.section-matter {
		padding-top: 1em;
	}
	#main section .section-content .row {
		margin-left: 0;
		margin-right: 0;
	}
	#main section .section-content .row > .column {
		padding: 0;
	}
	#main section .section-content .row > .column.column-split:first-of-type {
		padding-right: 0;
	}
	#main section .section-content .row > .column.column-split:last-of-type {
		padding-left: 0;
	}
}



/* === DARK MODE === */
	body[data-color-scheme="dark"] .section-hero {background-color: var(--fill-override); color: var(--glyph-gray-override);}
	body[data-color-scheme="dark"] .section-hero h1 {color: var(--glyph-gray-override);}
	body[data-color-scheme="dark"] .bg-gradient-skyblue {background: linear-gradient(to bottom, #7ac6d4 0%, #0e3768 90%);}
	body[data-color-scheme="dark"] .section-matter figure {filter: invert(1);}