.bg-dusk {
	background-color: #16263d;
}

body[data-color-scheme="light"] .bg-light {
	background-color: #f5f5f7;
}

body[data-color-scheme="light"] .callout {
	background-color: #fff;
}

.lighter {
	color: #999;
}

body[data-color-scheme="light"] .section-intent h2,
body[data-color-scheme="light"] .section-domains h4,
body[data-color-scheme="light"] .section-intent p {
	color: #fff;
}

body[data-color-scheme="light"] .section-intent a {
	color: var(--glyph-blue);
}

.callout {
	background-color: #e4edff;
	border: 1px solid #93c0ed;
}
body[data-color-scheme="dark"] .callout {
	background-color: #1b2332;
	border-color: #36445f;
}

/* ========== What's new ========== */
.section-content.callout-new {
	padding: 3em 0;
}

@media only screen and (max-width: 734px) {
	.section-content.callout-new {
		padding: 2em 1.5em;
	}
}

body[data-color-scheme="light"] .callout.callout-new {
	padding-top: 2em !important;
	padding-bottom: 2em !important;
	background-color: #f1f5fa;
}

body[data-color-scheme="dark"] .callout-new {
	background-color: var(--fill-tertiary) !important;
}

.callout-new h2 {
	display: flex;
	align-items: center;
}

body[data-color-scheme="dark"] .callout-title {
	color: #fff;
}

.whats-new-icon {
	width: 32px;
}

.siri-hero {
	max-width: 1150px;
	padding: 0 25px;
}

.shortcut-lockup {
	padding: 20px 100px;
}

figure + h3 {
	margin-top: 1.6em;
}

.badge-reduced.badge-inline {
	margin-left: 0;
	margin-bottom: 10px;
}

@media only screen and (max-width: 734px) {
	.shortcut-lockup {
		padding: 20px 0 0;
	}
}

.homepod-lockup {
	margin-top: 3em;
}

@media only screen and (max-width: 734px) {
	.homepod-lockup {
		margin-top: 2em;
	}
}

.hero-icon {
	margin-bottom: 1em;
}

.section-content.callout {
	padding: 3em 0;
}

.column-flex-center {
	align-self: center;
}

.device-wrap {
	margin-left: auto;
}

.device-hero {
	margin-top: 2em;
}

.device-iphone-13-pro-silver-container .device-screen {
	left: 18px;
}

.device-macbook-pro-16-space-gray {
	width: 904px;
	height: 529px;
}
.device-macbook-pro-16-space-gray .device-screen {
	top: 30px;
	left: 98px;
	width: 708px;
	height: 443px;
}

@media only screen and (max-width: 1068px) {
	.device-iphone-13-pro-silver-container .device-screen {
		top: 11.15px;
		left: 13.5px;
	}
	.device-macbook-pro-16-space-gray {
		width: 660px;
		height: 386px;
	}
	.device-macbook-pro-16-space-gray .device-screen {
		top: 20px;
		left: 70px;
		width: 520px;
		height: 325px;
	}
}

@media only screen and (max-width: 734px) {
	.section-content.callout {
		padding: 2em 1.5em;
	}
	.column-flex-center {
		align-self: unset;
	}
	.device-wrap {
		margin: 2em auto 1.5em;
	}
	.section-seamless .device-wrap {
		margin: 0;
	}
	.center-wrap {
		padding: 0 2em 2em;
		text-align: center;
	}
	.section-websites .callout {
		text-align: center;
	}
	.device-iphone-13-pro-silver-container.device-medium-for-small
		.device-screen {
		top: 11.15px;
		left: 13.5px;
	}
	.device-macbook-pro-16-space-gray {
		width: 375px;
		height: 220px;
	}
	.device-macbook-pro-16-space-gray .device-screen {
		top: 13px;
		left: 41px;
		width: 293px;
		height: 183px;
	}
}

@media only screen and (max-width: 414px) {
	.center-wrap {
		padding: 0 1em 2em;
	}
}

/* ========== Grid ========== */
/* #main section.section {
	padding-top: 0.5em;
	padding-bottom: 0.5em;
}
#main section.section.section-hero {
	padding-top: 3.5em;
	padding-bottom: 4em;
}
#main section.section:last-of-type {
	padding-bottom: 4em;
}
@media only screen and (max-width: 734px) {
	#main section.section.section-hero {
		padding-top: 3em;
		padding-bottom: 3em;
	}
	#main section.section:last-of-type {
		padding-bottom: 3em;
	}
} */

#main section.section {
	padding-top: 4em;
	padding-bottom: 4em;
}

@media only screen and (max-width: 734px) {
	#main section.section {
		padding-top: 2em;
		padding-bottom: 2em;
	}
}

#main section.section-hero {
	padding-bottom: 2em;
}

#main .section-apps {
	padding-top: 0.5em;
	padding-bottom: 0.5em;
}

#main section.section-intent {
	padding-bottom: 0;
}

#main .large-top-padding {
	padding-top: 3em;
}

#main section.section-domains .section-content .row {
	margin-left: -1.5em;
	margin-right: -1.5em;
}
#main section.section-domains .section-content .row > .column {
	padding: 1.5em 1.5em;
}

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

/* ========== Siri Animation ========== */

.siri-query {
	color: #c3c6f9;
}
.siri-query-icon {
	margin-bottom: 1em;
}
.siri-query-row {
	color: #efefef;
}

/* ========== Images ========== */
.icon-siri {
	margin-bottom: 1.5em;
	width: 84px;
	height: 84px;
	background-size: 100% 100%;
	background-repeat: no-repeat;
	background-position: center;
	/* visibility: hidden; */
}

@media only screen and (max-width: 734px) {
	.icon-siri {
		width: 76px;
		height: 76px;
	}
}

body[data-color-scheme="dark"] .icon-siri {
	background-image: url("/siri/images/siri-dark_2x.png");
}

body[data-color-scheme="light"] .icon-siri {
	background-image: url("/siri/images/siri-light_2x.png");
}

.icon-sirikit {
	margin-bottom: 1.5em;
	width: 96px;
	height: 96px;
	background-size: 100% 100%;
	background-repeat: no-repeat;
	background-position: center;
	background-image: url("/assets/elements/icons/sirikit/sirikit-96x96_2x.png");
}

.icon-shortcuts {
	margin-bottom: 1em;
	width: 64px;
	height: 64px;
	background-size: 100% 100%;
	background-repeat: no-repeat;
	background-position: center;
	background-image: url("/assets/elements/icons/shortcuts-app/shortcuts-app-64x64_2x.png");
}

.icon-app-intents {
	margin-bottom: 1.5em;
	width: 96px;
	height: 96px;
	background-size: 100% 100%;
	background-repeat: no-repeat;
	background-position: center;
	background-image: url("/assets/elements/icons/app-intents/app-intents-96x96_2x.png");
}

.text-large-left-small-center {
	text-align: left;
}

@media only screen and (max-width: 734px) {
	.text-large-left-small-center {
		margin-left: auto;
		margin-right: auto;
		float: none;
		display: block;
	}
}

.lockup-hero {
	margin: 0em auto 0;
	width: 100%;
	height: 785px;
	background-size: 1397px 786px;
	background-repeat: no-repeat;
	background-position: center 0;
	background-image: url("/siri/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("/siri/images/lockup-hero-large_2x.jpg");
	}
}

@media only screen and (max-width: 1068px) {
	.lockup-hero {
		height: 562px;
		background-size: 1000px auto;
	}
}

@media only screen and (max-width: 734px) {
	.lockup-hero {
		margin-top: 0;
		height: 56vw;
		background-size: cover;
		background-image: url("/siri/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("/siri/images/lockup-hero-medium_2x.jpg");
		}
	}
}

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

.icon-music {
	margin: 1em auto;
	width: 64px;
	height: 64px;
	background-size: 100% 100%;
	background-repeat: no-repeat;
	background-position: center;
	background-image: url("/assets/elements/icons/music/music.svg");
}

.icon-airplay-audio {
	margin: 0.5em auto 0.75em;
	width: 48px;
	height: 48px;
	background-size: 100% 100%;
	background-repeat: no-repeat;
	background-position: center;
	background-image: url("/assets/elements/icons/symbols/airplay-audio.svg");
}

body[data-color-scheme="dark"] .icon-bw {
	filter: brightness(0) saturate(100%) invert(100%) sepia(100%) saturate(0%)
		hue-rotate(219deg) brightness(103%) contrast(101%);
}

body[data-color-scheme="light"] .icon-bw {
	filter: brightness(0) saturate(100%);
}

.lockup-app-shortcuts {
	width: 408px;
	height: 549px;
	background-size: 100% 100%;
	background-repeat: no-repeat;
	background-position: center 0;
	background-image: url("/siri/images/lockup-app-shortcuts-large_2x.png");
}

@media only screen and (max-width: 1068px) {
	.lockup-app-shortcuts {
		width: 288px;
		height: 387px;
		background-image: url("/siri/images/lockup-app-shortcuts-medium_2x.png");
	}
}

/* @media only screen and (max-width: 734px) {
	.lockup-app-shortcuts {
		margin-bottom: 2em;
		width: 300px;
		height: 404px;
		background-image: url("/siri/images/lockup-app-shortcuts-small_2x.png");
	}
} */

@media only screen and (max-width: 375px) {
	.lockup-app-shortcuts {
		width: 275px;
		height: 370px;
	}
}

@media only screen and (max-width: 320px) {
	.lockup-app-shortcuts {
		width: 230px;
		height: 310px;
	}
}

.screen-shortcuts-hero {
	background: url("/siri/images/screen-shortcuts-hero-large_2x.jpg");
}

@media only screen and (max-width: 1068px) {
	.screen-shortcuts-hero {
		background: url("/siri/images/screen-shortcuts-hero-medium_2x.jpg");
	}
}

.lockup-shortcuts {
	width: 408px;
	height: 549px;
	background-size: 100% 100%;
	background-repeat: no-repeat;
	background-position: center 0;
	background-image: url("/siri/images/lockup-shortcuts-large_2x.png");
	margin-left: -20px;
}

@media only screen and (max-width: 1068px) {
	.lockup-shortcuts {
		width: 288px;
		height: 387px;
		background-image: url("/siri/images/lockup-shortcuts-medium_2x.png");
	}
}

@media only screen and (max-width: 734px) {
	.lockup-shortcuts {
		margin-bottom: 2em;
		width: 300px;
		height: 404px;
		background-image: url("/siri/images/lockup-shortcuts-small_2x.png");
		margin-left: auto;
		margin-right: auto;
	}
}

@media only screen and (max-width: 375px) {
	.lockup-shortcuts {
		width: 275px;
		height: 370px;
	}
}

@media only screen and (max-width: 320px) {
	.lockup-shortcuts {
		width: 230px;
		height: 310px;
	}
}

.siri-homepod {
	border-radius: 16em;
	margin-top: 2em;
	width: 453px;
	height: 453px;
	background-size: 100% 100%;
	background-repeat: no-repeat;
	background-position: center;
	background-image: url("/siri/images/homepod-hero-large_2x.png");
}

@media only screen and (max-width: 489px) {
	.siri-homepod {
		width: 300px;
		height: 300px;
		background-image: url("/siri/images/homepod-hero-small_2x.png");
	}
}