.ribbon:not(#suggest-lang) {
	margin-top: 110px;
}

.bg-gradient {
	background: linear-gradient(to bottom, #d6e3f2 -10%, #ffffff 100%);
}
.bg-xcode {
	background-color: #fafafa;
}
.bg-xcode-cloud {
	background-color: #fafafa;
}
.bg-swift {
	background-color: #fbf2e8;
}
.bg-swiftui {
	background-color: #deedf4;
}

.icon-sdk {
	margin-bottom: 1.75em;
	width: 96px;
	height: 96px;
	background-size: 96px 96px;
	background-repeat: no-repeat;
	background-image: url("/assets/elements/icons/sdk-17/sdk-17-96x96_2x.png");
}

.section-testflight {
	margin-top: 1%;
	min-height: 450px;
	padding-top: 64px;
	padding-bottom: 64px;
	background-color: #f2f2f2;
}

.icon-testflight {
	margin-bottom: 1em;
	width: 96px;
	height: 96px;
	background-size: 96px 96px;
	background-repeat: no-repeat;
	background-image: url("/assets/elements/icons/testflight/testflight-96x96_2x.png");
}

@media only screen and (max-width: 735px) {
	.section-testflight {
		margin-top: 0;
	}
}

.link-theme-alt {
	list-style: none;
	padding-top: 0.7em;
	margin-left: 0;
	margin-bottom: 2.5em;
}
.link-theme-alt a {
	color: #333;
	line-height: 2.39;
	display: block;
	width: 100%;
	transition: color 100ms linear;
}
.link-theme-alt a:hover {
	color: #0070c9;
}
.link-theme-alt:last-of-type {
	margin-bottom: 0;
}
@media only screen and (max-width: 735px) {
	.link-theme-alt:last-of-type {
		margin-bottom: 2.5em;
	}
}

.main .section.side-by-side:not(:first-child) .section-content a.block {
	padding-left: 3em;
}
@media only screen and (max-width: 735px) {
	.main .section.side-by-side:not(:first-child) .section-content a.block {
		padding-left: initial;
	}
}

.main .section.side-by-side:not(:last-child) .section-content a.block {
	padding-right: 3em;
}

@media only screen and (max-width: 735px) {
	.main .section.side-by-side:not(:last-child) .section-content a.block {
		padding-right: initial;
	}
}

.section-header {
	padding-top: 4em;
}
@media only screen and (max-width: 735px) {
	.section-header {
		padding-top: 3em;
	}
}

.device-hero {
	margin-bottom: 2em;
	margin-top: 1em;
}
.screen-hero {
	background-image: url("/develop/images/screen-hero-large_2x.png");
}

@media only screen and (max-width: 1068px) {
	.screen-hero {
		background-image: url("/develop/images/screen-hero-medium_2x.png");
	}
}
@media only screen and (max-width: 735px) {
	.screen-hero {
		background-image: url("/develop/images/screen-hero-small_2x.png");
	}
}

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

.section-left {
	padding-top: 64px;
	padding-bottom: 64px;
	width: 50%;
	float: left;
	min-height: 450px;
}

.section-left .section-content {
	width: 100%;
	max-width: 490px;
	float: right;
}

@media only screen and (max-width: 1068px) {
	.section-left .section-content {
		max-width: 346px;
	}
}

@media only screen and (max-width: 735px) {
	.section-left {
		width: 100%;
		float: none;
		margin-left: 0;
	}
	.section-left .section-content {
		width: 87.5%;
		max-width: inherit;
		float: none;
	}
}

.section.side-by-side.bg-xcode,
.section.side-by-side.bg-xcode-cloud {
	margin-bottom: 1em;
}

.section-right {
	padding-top: 64px;
	padding-bottom: 64px;
	width: 49%;
	float: left;
	margin-left: 1%;
	min-height: 450px;
}
.section-right .section-content {
	width: 99%;
	max-width: 490px;
	float: left;
}

@media only screen and (max-width: 1068px) {
	.section-right .section-content {
		max-width: 346px;
	}
}

@media only screen and (max-width: 735px) {
	.section-right {
		width: 100%;
		float: none;
		margin-left: 0;
	}
	.section-right .section-content {
		width: 87.5%;
		max-width: inherit;
		float: none;
	}
}

.section-platforms {
	background-color: #489e9f;
	color: #fff;
	margin-top: 1%;
	text-align: center;
}

@media only screen and (max-width: 735px) {
	.section-platforms {
		/* text-align: left; */
		margin-top: 0;
	}
}

.section-platforms .more {
	color: #fff;
}
.section-platforms .chapternav-items {
	margin: 20px auto 0 !important;
	padding-right: 0 !important;
	padding-left: 0 !important;
	overflow: visible;
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	max-width: 850px;
	row-gap: 10px;
}
.section-platforms .chapternav-items .chapternav-item {
	animation: none;
	padding: 0 !important;
}

@media only screen and (max-width: 1068px) {
	.section-platforms .chapternav-items {
		grid-template-columns: repeat(3, 1fr);
	}
}

@media only screen and (max-width: 735px) {
	.section-platforms .chapternav-items .chapternav-item {
		margin: 0 -0.6em;
		padding: 0 16px;
		text-align: center;
	}
}

@media only screen and (max-width: 420px) {
	.section-platforms .chapternav-items {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media only screen and (max-width: 320px) {
	.section-platforms .chapternav-items .chapternav-item {
		padding: 0 12px;
	}
}
.section-platforms .chapternav-items .chapternav-link {
	color: #fff;
}
.section-platforms .chapternav-items .chapternav-link:hover .chapternav-label {
	text-decoration: underline;
}
.section-platforms .chapternav-items .chapternav-label {
	font-size: 17px;
}

@media only screen and (max-width: 735px) {
	.section-platforms .chapternav-items .chapternav-label {
		font-size: 15px;
	}
}

.section-platforms .chapternav-items .chapternav-icon {
	width: 54px;
	height: 54px;
	background-size: 100% 100%;
	background-repeat: no-repeat;
	background-position: center;
}
.section-platforms .chapternav-items .chapternav-item-macos .chapternav-icon {
	background-image: url("/assets/elements/icons/platforms/icon-macos-i.svg");
}
.section-platforms .chapternav-items .chapternav-item-ios .chapternav-icon {
	background-image: url("/assets/elements/icons/platforms/icon-ios-i.svg");
}
.section-platforms .chapternav-items .chapternav-item-ipados .chapternav-icon {
	background-image: url("/assets/elements/icons/platforms/icon-ipados-i.svg");
}
.section-platforms .chapternav-items .chapternav-item-watchos .chapternav-icon {
	background-image: url("/assets/elements/icons/platforms/icon-watchos-i.svg");
}
.section-platforms .chapternav-items .chapternav-item-visionos .chapternav-icon {
	background-image: url("/assets/elements/icons/platforms/icon-visionos-i.svg");
}
.section-platforms .chapternav-items .chapternav-item-tvos .chapternav-icon {
	background-image: url("/assets/elements/icons/platforms/icon-tvos-i.svg");
}
.section-platforms .chapternav-items .chapternav-item-program .chapternav-icon {
	background-image: url("/assets/elements/icons/chapternav/icon-program-i.svg");
}
.section-testflight img {
	margin-bottom: 1em;
}
.section-resources {
	padding-top: 64px;
	padding-bottom: 64px;
	clear: both;
}
.section-resources .icon-* {
	display: block;
	background-repeat: no-repeat;
}
.section-resources .icon-app-frameworks {
	margin-bottom: 1em;
	width: 50px;
	height: 50px;
	background-size: 100% 100%;
	background-repeat: no-repeat;
	background-position: bottom;
	background-image: url("/assets/elements/icons/wwdr/wwdr-framework.svg");
}
.section-resources .icon-media-and-web {
	margin-bottom: 1em;
	width: 50px;
	height: 50px;
	background-size: 100% 100%;
	background-repeat: no-repeat;
	background-position: bottom;
	background-image: url("/assets/elements/icons/wwdr/wwdr-media.svg");
}
.section-resources .icon-graphics-and-games {
	margin-bottom: 1em;
	width: 50px;
	height: 50px;
	background-size: 100% 100%;
	background-repeat: no-repeat;
	background-position: bottom;
	background-image: url("/assets/elements/icons/wwdr/wwdr-game.svg");
}

.section-resources .icon-developer-tools {
	margin-bottom: 1em;
	width: 50px;
	height: 50px;
	background-size: 100% 100%;
	background-repeat: no-repeat;
	background-position: bottom;
	background-image: url("/assets/elements/icons/wwdr/wwdr-tools.svg");
}

/* === DARK MODE === */
html body[data-color-scheme="dark"].dmf .bg-gradient {
	background: var(--fill);
}
body[data-color-scheme="dark"] .bg-xcode {
	background-color: var(--fill-secondary-alt);
}
body[data-color-scheme="dark"] .bg-xcode-cloud {
	background-color: var(--fill-secondary-alt);
}
body[data-color-scheme="dark"] .bg-swift {
	background: #d3655d;
	background: linear-gradient(320deg, #d3655d 0%, #e2a856 100%);
}
body[data-color-scheme="dark"] .bg-swiftui {
	background: #15266d;
	background: linear-gradient(320deg, #15266d 0%, #0a60d8 100%);
}
body[data-color-scheme="dark"] .section-left.bg-swift a.block .block-link {
	color: var(--glyph-blue-override);
}
body[data-color-scheme="dark"] .section-testflight {
	background-color: var(--fill-secondary-alt);
}
body[data-color-scheme="dark"] .section.section-platforms {
	background: #306668;
}
body[data-color-scheme="dark"] .link-theme-alt a {
	color: var(--glyph-gray-secondary-alt);
}
body[data-color-scheme="dark"] .icon-app-frameworks {
	background-image: url("/assets/elements/icons/wwdr/wwdr-framework-i.svg");
}
body[data-color-scheme="dark"] .icon-media-and-web {
	background-image: url("/assets/elements/icons/wwdr/wwdr-media-i.svg");
}
body[data-color-scheme="dark"] .icon-graphics-and-games {
	background-image: url("/assets/elements/icons/wwdr/wwdr-game-i.svg");
}
body[data-color-scheme="dark"] .icon-developer-tools {
	background-image: url("/assets/elements/icons/wwdr/wwdr-tools-i.svg");
}
