.button-pill {
	font-size: 17px;
	line-height: 1.17649;
	font-weight: 400;
	letter-spacing: -0.022em;
	font-family: "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica",
		"Arial", sans-serif;
	border-radius: 18px;
	padding: 7px 17px;
}

.bg-gradient {
	background: linear-gradient(to bottom, #ffffff -15%, #d5e4f3 100%);
}

.apple-arcade-logo {
	width: 128px;
	height: 128px;
	background-size: 100% 100%;
	background-repeat: no-repeat;
	background-position: center;
	background-image: url("/assets/elements/icons/arcade/arcade-128x128.png");
	margin-bottom: 1em;
}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
	only screen and (min-resolution: 1.5dppx),
	only screen and (min-resolution: 144dpi) {
	.apple-arcade-logo {
		background-image: url("/assets/elements/icons/arcade/arcade-128x128_2x.png");
	}
}

.callout + .callout {
	margin-top: 4em;
}

.callout {
	border: 1px solid #fff;
}
.callout h2 {
	margin-top: 1em;
}

.callout-apps {
	overflow-x: hidden;
	margin-top: 0;
}
.app-icons {
	margin: 0 0 0 -85px;
	width: 713px;
}
.app-icon {
	display: inline-block;
	margin: 4px;
	width: 90px;
	height: 90px;
	border-radius: 22.5%;
	background-size: 100% 100%;
	background-repeat: no-repeat;
	background-position: center;
}

.icon-angrybirdsreloaded {
	background-image: url("/apple-arcade/images/icon-angrybirdsreloaded.png");
}
.icon-crossyroadcastle {
	background-image: url("/apple-arcade/images/icon-crossyroadcastle.png");
}
.icon-cutheroperemastered {
	background-image: url("/apple-arcade/images/icon-cutheroperemastered.png");
}
.icon-fantasian {
	background-image: url("/apple-arcade/images/icon-fantasian.png");
}
.icon-legobrawls {
	background-image: url("/apple-arcade/images/icon-legobrawls.png");
}
.icon-minimotorways {
	background-image: url("/apple-arcade/images/icon-minimotorways.png");
}
.icon-oceanhorn2 {
	background-image: url("/apple-arcade/images/icon-oceanhorn2.png");
}
.icon-pacmanpartyroyale {
	background-image: url("/apple-arcade/images/icon-pacmanpartyroyale.png");
}
.icon-patterned {
	background-image: url("/apple-arcade/images/icon-patterned.png");
}
.icon-skatecity {
	background-image: url("/apple-arcade/images/icon-skatecity.png");
}
.icon-sneakysasquatch {
	background-image: url("/apple-arcade/images/icon-sneakysasquatch.png");
}
.icon-songpopparty {
	background-image: url("/apple-arcade/images/icon-songpopparty.png");
}
.icon-sonicracing {
	background-image: url("/apple-arcade/images/icon-sonicracing.png");
}
.icon-taikonotatsujinpoptapbeat {
	background-image: url("/apple-arcade/images/icon-taikonotatsujinpoptapbeat.png");
}
.icon-theoregontrail {
	background-image: url("/apple-arcade/images/icon-theoregontrail.png");
}

.platform-icons {
	margin: 0 -8% 0 -10%;
}
.platform-icon {
	display: inline-block;
	margin: 0;
	width: 96px;
	height: 96px;
	background-size: 100% 100%;
	background-repeat: no-repeat;
	background-position: center;
}
.platform-icon-macos {
	margin-right: 10px;
	background-image: url("/assets/elements/icons/platforms/icon-macos.svg");
}
.platform-icon-ios {
	margin-right: -20px;
	margin-left: -10px;
	background-image: url("/assets/elements/icons/platforms/icon-ios.svg");
}
.platform-icon-ipados {
	background-image: url("/assets/elements/icons/platforms/icon-ipados.svg");
}
.platform-icon-tvos {
	background-image: url("/assets/elements/icons/platforms/icon-tvos.svg");
}

@media only screen and (max-width: 1068px) {
	.app-icons {
		margin-left: -117px;
	}
}

@media only screen and (max-width: 734px) {
	.callout + .callout {
		margin-top: 3em;
	}
}

@media only screen and (max-width: 500px) {
	.app-icons {
		margin-left: -124px;
	}
}

@media only screen and (max-width: 414px) {
	.callout h2 {
		margin-top: 0.8em;
	}
	.app-icons {
		margin-left: -50px;
	}
	.platform-icons {
		margin-left: -13.5%;
	}
	.platform-icon {
		width: 68px;
		height: 68px;
	}
}

@media only screen and (max-width: 375px) {
	.app-icons {
		margin-left: -66px;
	}
}

@media only screen and (max-width: 320px) {
	.app-icons {
		margin-left: -86px;
	}
	.platform-icons {
		margin-left: -13.5%;
	}
	.platform-icon {
		width: 56px;
		height: 56px;
	}
	.platform-icon-ios {
		margin-right: -14px;
	}
}

/* ===== Grid ===== */
#main section.section {
	padding-top: 4em;
	padding-bottom: 4em;
}
#main section.section.section-hero,
#main section.section.section-arcade {
	padding-bottom: 0em;
}
#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;
	}
}

/* === DARK MODE === */
body[data-color-scheme="dark"] .platform-icon-macos {
	background-image: url("/assets/elements/icons/platforms/icon-macos-i.svg");
}
body[data-color-scheme="dark"] .platform-icon-ios {
	background-image: url("/assets/elements/icons/platforms/icon-ios-i.svg");
}
body[data-color-scheme="dark"] .platform-icon-ipados {
	background-image: url("/assets/elements/icons/platforms/icon-ipados-i.svg");
}
body[data-color-scheme="dark"] .platform-icon-tvos {
	background-image: url("/assets/elements/icons/platforms/icon-tvos-i.svg");
}
body[data-color-scheme="dark"] .icon-skatecity {
	border: 1px solid var(--fill-gray-quaternary);
}
body[data-color-scheme="dark"] .callout {
	border-color: var(--fill-gray-quaternary);
}