.bg-gradient,
.theme-light .bg-gradient,
body[data-color-scheme="light"] .bg-gradient {
	background: linear-gradient(180deg, #666d77 0%, #d9e4ed 25%)!important;
}

.theme-dark .bg-gradient,
body[data-color-scheme="dark"] .bg-gradient {
	background: linear-gradient(180deg, #161617 0%, #1d1d1f 50%, #161617 100%)!important;
}

.eyebrow sf-symbol {
	font-size: 80px
}

section.section-hero {
	color: #ffffff;
}

.tile-full .tile-content {
	flex: 1;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: var(--tile-custom-gap, 2em);
	padding: 1.5em;
}

a.tile-link .tile-rounded {
	transition: box-shadow 0.2s ease-in-out;
}
a.tile-link:hover .tile-rounded {
	box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.01), 0 7px 14px 0 rgba(0, 0, 0, 0.1), 0 3px 6px 0 rgba(0, 0, 0, 0.02);
}

.theme-dark a.tile-link:hover .tile-rounded,
body[data-color-scheme="dark"] a.tile-link:hover .tile-rounded {
	box-shadow: 0 0 0 0 rgba(200, 200, 200, 0.1), 0 7px 14px 0 rgba(200, 200, 200, 0.2), 0 3px 6px 0 rgba(200, 200, 200, 0.2);
}

a.tile-link h5.link span.eyebrow.lighter {
	color: #86868B !important;
}
.theme-dark a.tile-link h5.link span.eyebrow.lighter,
body[data-color-scheme="dark"] a.tile-link h5.link span.typography-eyebrow.lighter {
	color: #6E6E73 !important;
}

a.tile-link:hover h5.link {
	text-decoration: underline;
}

.tile sf-symbol {
	font-size: 24px;
	width: 24px;
	display: inline-flex;
	vertical-align: text-bottom;
}

sf-symbol + p {
	display: inline-flex;
	position: relative;
}

sf-symbol.calendar-icon {
	margin-top: 6px
}
sf-symbol.calendar-icon + p {
	margin-top: -6px
}

.typography-eyebrow.smaller {
	font-weight: 500;
	font-size: 14px;
	line-height: 24px;
	margin-bottom: 0.25em;
}

.typography-eyebrow.lighter {
	color: #86868B;
} 

#main section.section {
	padding-top: 4em;
	padding-bottom: 4em;
}
#main section.section.section-wwdc-events {
	margin-top: 4em
}
#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.section-wwdc-events {
		margin-top: 3em
	}
	#main section .section-content .row {
		margin-left: 0;
		margin-right: 0;
	}
	#main section .section-content .row > .column {
		padding: 0;
	}
}