/* ===== APP ICONS ===== */
:root {
	--icon-grid-spacing: 30px;
}

.section-hero {
	overflow: hidden;
}

.icon-grid {
	--chiclet-size: 96px;
	display: grid;
	gap: var(--icon-grid-spacing);
	/* grid-template-rows: repeat(4, var(--chiclet-size)); */
	grid-template-columns: repeat(19, var(--chiclet-size));
	justify-content: center;
	margin-top: 8em;
	margin-bottom: -350px;
}

@media only screen and (max-width: 734px) {
	:root {
		--icon-grid-spacing: 15px;
	}

	.icon-grid {
		--chiclet-size: 48px;
		display: grid;
		gap: var(--icon-grid-spacing);
		/* grid-template-rows: repeat(4, var(--chiclet-size)); */
		grid-template-columns: repeat(19, var(--chiclet-size));
		justify-content: center;
		margin-top: 4em;
		margin-bottom: -180px;
	}
}

.icon-finalist {
	/* margin: 0 auto; */
	border-radius: 22.5%;
	width: 96px;
	height: 96px;
	margin-bottom: var(--icon-grid-spacing);
	background-size: 100% 100%;
	background-position: center 0;
	background-repeat: no-repeat;
	border: 1px solid var(--fill-background-app);
	opacity: 0;

	transform: translateY(100%);
	animation: slideIn 1s forwards;
}

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

@keyframes slideIn {
	to {
		opacity: 1;
		transform: translateY(0);
	}
}
.icon-grid-column:nth-child(1) {
	margin-top: -360px;
}
.icon-grid-column:nth-child(2) {
	margin-top: -320px;
}
.icon-grid-column:nth-child(3) {
	margin-top: -280px;
}
.icon-grid-column:nth-child(4) {
	margin-top: -240px;
}
.icon-grid-column:nth-child(5) {
	margin-top: -200px;
}
.icon-grid-column:nth-child(6) {
	margin-top: -160px;
}
.icon-grid-column:nth-child(7) {
	margin-top: -120px;
}
.icon-grid-column:nth-child(8) {
	margin-top: -80px;
}
.icon-grid-column:nth-child(9) {
	margin-top: -40px;
}
.icon-grid-column:nth-child(10) {
	margin-top: -40px;
}
.icon-grid-column:nth-child(11) {
	margin-top: -40px;
}
.icon-grid-column:nth-child(12) {
	margin-top: -80px;
}
.icon-grid-column:nth-child(13) {
	margin-top: -120px;
}
.icon-grid-column:nth-child(14) {
	margin-top: -160px;
}
.icon-grid-column:nth-child(15) {
	margin-top: -200px;
}
.icon-grid-column:nth-child(16) {
	margin-top: -240px;
}
.icon-grid-column:nth-child(17) {
	margin-top: -280px;
}
.icon-grid-column:nth-child(18) {
	margin-top: -320px;
}
.icon-grid-column:nth-child(19) {
	margin-top: -360px;
}

/* Apply delays: middle first, edges later for row 1 */
.icon-finalist:nth-child(1) {
	animation-delay: 0.6s;
}
.icon-finalist:nth-child(2) {
	animation-delay: 0.57s;
}
.icon-finalist:nth-child(3) {
	animation-delay: 0.54s;
}
.icon-finalist:nth-child(4) {
	animation-delay: 0.51s;
}
.icon-finalist:nth-child(5) {
	animation-delay: 0.48s;
}
.icon-finalist:nth-child(6) {
	animation-delay: 0.45s;
}
.icon-finalist:nth-child(7) {
	animation-delay: 0.42s;
}
.icon-finalist:nth-child(8) {
	animation-delay: 0.39s;
}
.icon-finalist:nth-child(9) {
	animation-delay: 0.36s;
}
.icon-finalist:nth-child(10) {
	animation-delay: 0.33s;
}
.icon-finalist:nth-child(11) {
	animation-delay: 0.3s;
}
.icon-finalist:nth-child(12) {
	animation-delay: 0.33s;
}
.icon-finalist:nth-child(13) {
	animation-delay: 0.36s;
}
.icon-finalist:nth-child(14) {
	animation-delay: 0.39s;
}
.icon-finalist:nth-child(15) {
	animation-delay: 0.42s;
}
.icon-finalist:nth-child(16) {
	animation-delay: 0.45s;
}
.icon-finalist:nth-child(17) {
	animation-delay: 0.48s;
}
.icon-finalist:nth-child(18) {
	animation-delay: 0.51s;
}
.icon-finalist:nth-child(19) {
	animation-delay: 0.54s;
}

/* Row 2: add 0.03s to the delay */
.icon-finalist:nth-child(20) {
	animation-delay: 0.63s;
}
.icon-finalist:nth-child(21) {
	animation-delay: 0.6s;
}
.icon-finalist:nth-child(22) {
	animation-delay: 0.57s;
}
.icon-finalist:nth-child(23) {
	animation-delay: 0.54s;
}
.icon-finalist:nth-child(24) {
	animation-delay: 0.51s;
}
.icon-finalist:nth-child(25) {
	animation-delay: 0.48s;
}
.icon-finalist:nth-child(26) {
	animation-delay: 0.45s;
}
.icon-finalist:nth-child(27) {
	animation-delay: 0.42s;
}
.icon-finalist:nth-child(28) {
	animation-delay: 0.39s;
}
.icon-finalist:nth-child(29) {
	animation-delay: 0.36s;
}
.icon-finalist:nth-child(30) {
	animation-delay: 0.33s;
}
.icon-finalist:nth-child(31) {
	animation-delay: 0.36s;
}
.icon-finalist:nth-child(32) {
	animation-delay: 0.39s;
}
.icon-finalist:nth-child(33) {
	animation-delay: 0.42s;
}
.icon-finalist:nth-child(34) {
	animation-delay: 0.45s;
}
.icon-finalist:nth-child(35) {
	animation-delay: 0.48s;
}
.icon-finalist:nth-child(36) {
	animation-delay: 0.51s;
}
.icon-finalist:nth-child(37) {
	animation-delay: 0.54s;
}
.icon-finalist:nth-child(38) {
	animation-delay: 0.57s;
}

/* Row 3: add 0.06s to the delay */
.icon-finalist:nth-child(39) {
	animation-delay: 0.66s;
}
.icon-finalist:nth-child(40) {
	animation-delay: 0.63s;
}
.icon-finalist:nth-child(41) {
	animation-delay: 0.6s;
}
.icon-finalist:nth-child(42) {
	animation-delay: 0.57s;
}
.icon-finalist:nth-child(43) {
	animation-delay: 0.54s;
}
.icon-finalist:nth-child(44) {
	animation-delay: 0.51s;
}
.icon-finalist:nth-child(45) {
	animation-delay: 0.48s;
}
.icon-finalist:nth-child(46) {
	animation-delay: 0.45s;
}
.icon-finalist:nth-child(47) {
	animation-delay: 0.42s;
}
.icon-finalist:nth-child(48) {
	animation-delay: 0.39s;
}
.icon-finalist:nth-child(49) {
	animation-delay: 0.36s;
}
.icon-finalist:nth-child(50) {
	animation-delay: 0.39s;
}
.icon-finalist:nth-child(51) {
	animation-delay: 0.42s;
}
.icon-finalist:nth-child(52) {
	animation-delay: 0.45s;
}
.icon-finalist:nth-child(53) {
	animation-delay: 0.48s;
}
.icon-finalist:nth-child(54) {
	animation-delay: 0.51s;
}
.icon-finalist:nth-child(55) {
	animation-delay: 0.54s;
}
.icon-finalist:nth-child(56) {
	animation-delay: 0.57s;
}
.icon-finalist:nth-child(57) {
	animation-delay: 0.6s;
}

/* Row 4: add 0.09s to the delay */
.icon-finalist:nth-child(58) {
	animation-delay: 0.69s;
}
.icon-finalist:nth-child(59) {
	animation-delay: 0.66s;
}
.icon-finalist:nth-child(60) {
	animation-delay: 0.63s;
}
.icon-finalist:nth-child(61) {
	animation-delay: 0.6s;
}
.icon-finalist:nth-child(62) {
	animation-delay: 0.57s;
}
.icon-finalist:nth-child(63) {
	animation-delay: 0.54s;
}
.icon-finalist:nth-child(64) {
	animation-delay: 0.51s;
}
.icon-finalist:nth-child(65) {
	animation-delay: 0.48s;
}
.icon-finalist:nth-child(66) {
	animation-delay: 0.45s;
}
.icon-finalist:nth-child(67) {
	animation-delay: 0.42s;
}
.icon-finalist:nth-child(68) {
	animation-delay: 0.39s;
}
.icon-finalist:nth-child(69) {
	animation-delay: 0.42s;
}
.icon-finalist:nth-child(70) {
	animation-delay: 0.45s;
}
.icon-finalist:nth-child(71) {
	animation-delay: 0.48s;
}
.icon-finalist:nth-child(72) {
	animation-delay: 0.51s;
}
.icon-finalist:nth-child(73) {
	animation-delay: 0.54s;
}
.icon-finalist:nth-child(74) {
	animation-delay: 0.57s;
}
.icon-finalist:nth-child(75) {
	animation-delay: 0.6s;
}
.icon-finalist:nth-child(76) {
	animation-delay: 0.63s;
}

/* 2024 */
.finalist-ahead {
	background-image: url("/distribute/images/app-icons/ahead_2x.png");
}
.finalist-arc-search {
	background-image: url("/distribute/images/app-icons/arc-search_2x.png");
}
.finalist-bear-gratitude {
	background-image: url("/distribute/images/app-icons/bear-gratitude_2x.png");
}
.finalist-call-of-duty {
	background-image: url("/distribute/images/app-icons/call-of-duty_2x.png");
}
.finalist-cityscapes {
	background-image: url("/distribute/images/app-icons/cityscapes_2x.png");
}
.finalist-complete-anatomy {
	background-image: url("/distribute/images/app-icons/complete-anatomy_2x.png");
}
.finalist-copilot-b {
	background-image: url("/distribute/images/app-icons/copilot-b_2x.png");
}
.finalist-copilot {
	background-image: url("/distribute/images/app-icons/copilot_2x.png");
}
.finalist-crayola {
	background-image: url("/distribute/images/app-icons/crayola_2x.png");
}
.finalist-crouton {
	background-image: url("/distribute/images/app-icons/crouton-b_2x.png");
}
.finalist-death-stranding {
	background-image: url("/distribute/images/app-icons/death-stranding_2x.png");
}

.finalist-dudel-draw {
	background-image: url("/distribute/images/app-icons/dudel-draw_2x.png");
}
.finalist-finity {
	background-image: url("/distribute/images/app-icons/finity_2x.png");
}
.finalist-gentler-streaks {
	background-image: url("/distribute/images/app-icons/gentler-streaks_2x.png");
}
.finalist-hello-kitty-island-adventure {
	background-image: url("/distribute/images/app-icons/hello-kitty-island-adventure_2x.png");
}
.finalist-honkai-star-rail {
	background-image: url("/distribute/images/app-icons/honkai-star-rail_2x.png");
}
.finalist-honkai-star-rail-cn {
	background-image: url("/distribute/images/app-icons/honkai-star-rail-cn_2x.png");
}
.finalist-how-we-feel {
	background-image: url("/distribute/images/app-icons/how-we-feel_2x.png");
}
.finalist-lies-of-p {
	background-image: url("/distribute/images/app-icons/lies-of-p_2x.png");
}
.finalist-little-nightmares {
	background-image: url("/distribute/images/app-icons/little-nightmares_2x.png");
}
.finalist-lost-in-play {
	background-image: url("/distribute/images/app-icons/lost-in-play_2x.png");
}
.finalist-meditate {
	background-image: url("/distribute/images/app-icons/meditate_2x.png");
}
.finalist-nyt-games {
	background-image: url("/distribute/images/app-icons/nyt-games_2x.png");
}
.finalist-oko {
	background-image: url("/distribute/images/app-icons/oko_2x.png");
}
.finalist-procreate-dreams {
	background-image: url("/distribute/images/app-icons/procreate-dreams_2x.png");
}
.finalist-quadline {
	background-image: url("/distribute/images/app-icons/quadline_2x.png");
}
.finalist-rooms {
	background-image: url("/distribute/images/app-icons/rooms_2x.png");
}
.finalist-rytmos {
	background-image: url("/distribute/images/app-icons/rytmos_2x.png");
}
.finalist-smart-gym {
	background-image: url("/distribute/images/app-icons/smart-gym_2x.png");
}
.finalist-sunlitt {
	background-image: url("/distribute/images/app-icons/sunlitt_2x.png");
}
.finalist-the-bear {
	background-image: url("/distribute/images/app-icons/the-bear_2x.png");
}
.finalist-the-wreck {
	background-image: url("/distribute/images/app-icons/the-wreck_2x.png");
}
.finalist-tiimo {
	background-image: url("/distribute/images/app-icons/tiimo_2x.png");
}
.finalist-unpacking {
	background-image: url("/distribute/images/app-icons/unpacking_2x.png");
}
.finalist-wavelength {
	background-image: url("/distribute/images/app-icons/wavelength_2x.png");
}
.finalist-what-the-car {
	background-image: url("/distribute/images/app-icons/what-the-car_2x.png");
}

/* 2023 */
.finalist-afterplace {
	background-image: url("/distribute/images/app-icons/afterplace_2x.png");
}
.finalist-ancient-board-game {
	background-image: url("/distribute/images/app-icons/ancient-board-game_2x.png");
}
.finalist-anne {
	background-image: url("/distribute/images/app-icons/anne_2x.png");
}
.finalist-any-distance {
	background-image: url("/distribute/images/app-icons/any-distance_2x.png");
}
.finalist-automatoys {
	background-image: url("/distribute/images/app-icons/automatoys_2x.png");
}
.finalist-beecarbonize {
	background-image: url("/distribute/images/app-icons/beecarbonize_2x.png");
}
.finalist-camo {
	background-image: url("/distribute/images/app-icons/camo_2x.png");
}
.finalist-chantlings {
	background-image: url("/distribute/images/app-icons/chantlings_2x.png");
}
.finalist-creme {
	background-image: url("/distribute/images/app-icons/creme_2x.png");
}
.finalist-duolingo {
	background-image: url("/distribute/images/app-icons/duolingo_2x.png");
}
.finalist-endling {
	background-image: url("/distribute/images/app-icons/endling_2x.png");
}
.finalist-finding-hannah {
	background-image: url("/distribute/images/app-icons/finding-hannah_2x.png");
}
.finalist-flighty {
	background-image: url("/distribute/images/app-icons/flighty_2x.png");
}
.finalist-gentler-streak {
	background-image: url("/distribute/images/app-icons/gentler-streak_2x.png");
}
.finalist-headspace {
	background-image: url("/distribute/images/app-icons/headspace_2x.png");
}
.finalist-hindsight {
	background-image: url("/distribute/images/app-icons/hindsight_2x.png");
}
.finalist-kimono-cats {
	background-image: url("/distribute/images/app-icons/kimono-cats_2x.png");
}
.finalist-knotwords {
	background-image: url("/distribute/images/app-icons/knotwords_2x.png");
}
.finalist-marvel-snap {
	background-image: url("/distribute/images/app-icons/marvel-snap_2x.png");
}
.finalist-passenger-assistance {
	background-image: url("/distribute/images/app-icons/passenger-assistance_2x.png");
}
.finalist-pocket-card-jockey {
	background-image: url("/distribute/images/app-icons/pocket-card-jockey_2x.png");
}
.finalist-railbound {
	background-image: url("/distribute/images/app-icons/railbound_2x.png");
}
.finalist-resident-evil-village {
	background-image: url("/distribute/images/app-icons/resident-evil-village_2x.png");
}
.finalist-resident-evil-bio {
	background-image: url("/distribute/images/app-icons/re-biohazard_2x.png");
}
.finalist-rise {
	background-image: url("/distribute/images/app-icons/rise_2x.png");
}
.finalist-riveo {
	background-image: url("/distribute/images/app-icons/riveo_2x.png");
}
.finalist-sago {
	background-image: url("/distribute/images/app-icons/sago_2x.png");
}
.finalist-shuffles {
	background-image: url("/distribute/images/app-icons/shuffles_2x.png");
}
.finalist-stitch {
	background-image: url("/distribute/images/app-icons/stitch_2x.png");
}
.finalist-swingvision {
	background-image: url("/distribute/images/app-icons/swingvision_2x.png");
}
.finalist-tide-guide {
	background-image: url("/distribute/images/app-icons/tide-guide_2x.png");
}
.finalist-universe {
	background-image: url("/distribute/images/app-icons/universe_2x.png");
}
.finalist-diablo {
	background-image: url("/distribute/images/app-icons/diablo_2x.png");
}
/* 2022 */

.finalist-wf {
	background-image: url("/distribute/images/app-icons/wylde-flowers_2x.png");
}
.finalist-navi {
	background-image: url("/distribute/images/app-icons/navi_2x.png");
}
.finalist-noted {
	background-image: url("/distribute/images/app-icons/noted_2x.png");
}
.finalist-fn {
	background-image: url("/distribute/images/app-icons/focus-noodles_2x.png");
}
.finalist-tint {
	background-image: url("/distribute/images/app-icons/tint_2x.png");
}
.finalist-overboard {
	background-image: url("/distribute/images/app-icons/overboard_2x.png");
}
.finalist-nbh {
	background-image: url("/distribute/images/app-icons/not-boring-habits_2x.png");
}
.finalist-chineasy {
	background-image: url("/distribute/images/app-icons/chineasy_2x.png");
}
.finalist-wl {
	background-image: url("/distribute/images/app-icons/water-llama_2x.png");
}
.finalist-ptta {
	background-image: url("/distribute/images/app-icons/touch-the-artwork_2x.png");
}
.finalist-moncage {
	background-image: url("/distribute/images/app-icons/moncage_2x.png");
}
.finalist-ams {
	background-image: url("/distribute/images/app-icons/a-musical-story_2x.png");
}
.finalist-slopes {
	background-image: url("/distribute/images/app-icons/slopes_2x.png");
}