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

.lockup-hero {
	margin-top: 2em;
	width: 980px;
	height: auto;
}
@media only screen and (max-width: 1068px) {
	.lockup-hero {
		width: 692px;
	}
}
@media only screen and (max-width: 734px) {
	.lockup-hero {
		width: 100%;
		max-width: 692px;
	}
}

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

.section-testflight {
	margin-top: 1em;
	min-height: 450px;
	padding-top: 64px;
	padding-bottom: 64px;
}

@media only screen and (max-width: 734px) {
	.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;
	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: 734px) {
	.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: 734px) {
	.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: 734px) {
	.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: 734px) {
	.section-header {
		padding-top: 3em;
	}
}

.device-hero {
	margin-bottom: 1em;
	margin-top: 1em;
	padding-bottom: 2em;
}
.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: 734px) {
	.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;
	min-height: 450px;
	flex-grow: 1;
}

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

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

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

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

.section-right {
	padding-top: 64px;
	padding-bottom: 64px;
	flex-grow: 1;
	margin-left: 1em;
	min-height: 450px;
}

.section-right .section-content {
	/* width: 99%; */
	max-width: 490px;
}

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

@media only screen and (max-width: 734px) {
	.section-right {
		width: 100%;

		margin-left: 0;
	}
	.section-right .section-content {
		width: 87.5%;
		max-width: inherit;
	}
}

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

@media only screen and (max-width: 734px) {
	.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: 734px) {
	.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: 734px) {
	.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;
}

sf-symbol.resource-icon {
	font-size: 50px;
	color: #7d7d7d;
	margin-bottom: 0.25em;
	display: block;
}
body[data-color-scheme="dark"] sf-symbol.resource-icon {
	color: #fff;
}


/* === DARK MODE === */
html body[data-color-scheme="dark"] .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"] .bg-gradient-alt {
	background: linear-gradient(
		to bottom,
		var(--fill-secondary-alt) 0%,
		#000000 100%
	);
}
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);
}

