.custom-mosaic {
	margin-bottom: var(--space-12);
}

.custom-mosaic .widget-title {
	font-size: 4.375rem;
	font-family: var(--font-display);
	font-weight: 700;
	text-transform: uppercase;
	line-height: calc(61/70);
	color: var(--dark-blue);
}

.custom-mosaic .widget-subtitle {
	font-size: 2.875rem;
	font-family: var(--font-display-alt);
	color: var(--dark-blue);
	line-height: calc(48/46);
}

@media (max-width: 374px) {
	.custom-mosaic .widget-title {
		font-size: 3.75rem;
	}

	.custom-mosaic .widget-subtitle {
		font-size: 2.5rem;
	}
}	


.custom-mosaic .widget-header {
	padding: 0px 43px;
	margin-bottom: var(--space-4);
}

.custom-mosaic .inner {
	position: relative;
	height: 100%;
}

.custom-mosaic .slide .img-cont,
.custom-mosaic .slide .img-cont img {
	width: 100%;
	height: 100%;
	position: relative;
	object-fit: cover;
}

.custom-mosaic .slide .img-cont::after {
	content: '';
	height: 100%;
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
	background: #000000 0% 0% no-repeat padding-box;
	opacity: 0.2;
	pointer-events: none;
}

.custom-mosaic .content-section {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 100%;
	margin: 0 auto;
	text-align: center;
	padding: 0 var(--space-5);
	display: flex;
	justify-content: center;
	flex-direction: column;
	align-items: center;
	pointer-events: none;
}

.custom-mosaic .cols {
	display: grid;
	gap: var(--space-2);
}

.custom-mosaic .icon-cont {
	height: 72px;
	width: 72px;
	background: var(--light-blue);
	border-radius: var(--rounded-circle);
	display: flex;
	justify-content: center;
	align-items: center;
}

.custom-mosaic .icon-cont .bike {
	height: 32px;
	width: 51px;
}
.custom-mosaic .icon-cont .museum {
	height: 35px;
	width: 35px;
}
.custom-mosaic .icon-cont .fork {
	height: 49px;
	width: 35px;
}
.custom-mosaic .icon-cont .bed {
	height: 29px;
	width: 44px;
}
.custom-mosaic .icon-cont .art {
	height: 42px;
	width: 42px;
}

.custom-mosaic .content-section .slide-title {
	font-size: 1.625rem;
	color: var(--white);
	font-weight: 700;
	text-shadow: 0px 2px 4px #000000A7;
	line-height: var(--leading-tighter);
	font-family: var(--font-display);
}

@media (min-width: 40em) {
	.custom-mosaic .cols {
		display: grid;
		grid-template-columns: 1.4667fr 1fr 1fr;
		grid-template-rows: .5fr 1fr .5fr;
		gap: min(calc(12px + (18 - 12) * ((100vw - 640px) / (1023 - 640))), 18px);
	}

	.custom-mosaic .widget-title {
		font-size: min(calc(60px + (80 - 60) * ((100vw - 640px) / (1023 - 640))), 80px);
		line-height: calc(92/106);
	}

	.custom-mosaic .widget-subtitle {
		font-size: min(calc(40px + (58 - 40) * ((100vw - 640px) / (1023 - 640))), 58px);
		line-height: calc(60/58);
	}

	.custom-mosaic .content-section .slide-title {
		font-size: min(calc(20px + (26 - 20) * ((100vw - 640px) / (1023 - 640))), 26px);
	}

	.custom-mosaic .cols .slide.promoted {
		grid-column: 1 / 2;
		grid-row: 2 / 4;
	}

	.custom-mosaic .cols .slide:nth-child(3) {
		grid-column: 2;
		grid-row: 1 / 2;
	}
	.custom-mosaic .cols .slide:nth-child(4) {
		grid-column: 2;
		grid-row: 2 / 4;
	}

	.custom-mosaic .cols .slide:nth-child(5) {
		grid-column: 3;
		grid-row: 1 / 3;
	}

	.custom-mosaic .widget-header {
		margin-bottom: 0;
		padding: 0px min(calc(5px + (43 - 5) * ((100vw - 640px) / (1023 - 640))), 43px);
	}

	.custom-mosaic .slide .img-cont::after {
		opacity: 0.35;
		transition: opacity ease-out .3s;
	}
	
}

@media (min-width: 64em) {
	.custom-mosaic {
		margin-bottom: 100px;
	}
	
	.custom-mosaic .widget-header {
		padding-left: min(calc(43px + (88 - 43) * ((100vw - 1024px) / (1440 - 1024))), 88px);
	}

	.custom-mosaic .cols {
		gap: 18px;
	}

	.custom-mosaic .widget-title {
		font-size: min(calc(75px + (106 - 75) * ((100vw - 1024px) / (1440 - 1024))), 106px);
		line-height: calc(92/106);
	}

	.custom-mosaic .widget-subtitle {
		font-size: min(calc(46px + (58 - 46) * ((100vw - 1024px) / (1440 - 1024))), 58px);
		line-height: calc(60/58);
	}

	.custom-mosaic .content-section .slide-title {
		font-size: 2.375rem;
	}

	.custom-mosaic .icon-cont {
		height: min(calc(72px + (96 - 72) * ((100vw - 1024px) / (1440 - 1024))), 96px);
		width: min(calc(72px + (96 - 72) * ((100vw - 1024px) / (1440 - 1024))), 96px);
	}

	.custom-mosaic .icon-cont .bike {
		height: min(calc(29px + (42 - 29) * ((100vw - 1024px) / (1440 - 1024))), 42px);
		width: min(calc(44px + (68 - 44) * ((100vw - 1024px) / (1440 - 1024))), 68px);
	}
	.custom-mosaic .icon-cont .museum {
		height: min(calc(35px + (47 - 35) * ((100vw - 1024px) / (1440 - 1024))), 47px);
		width: min(calc(35px + (47 - 35) * ((100vw - 1024px) / (1440 - 1024))), 47px);
	}
	.custom-mosaic .icon-cont .fork {
		height: min(calc(49px + (63 - 49) * ((100vw - 1024px) / (1440 - 1024))), 63px);
		width: min(calc(35px + (46 - 35) * ((100vw - 1024px) / (1440 - 1024))), 46px);
	}
	.custom-mosaic .icon-cont .bed {
		height: min(calc(29px + (37 - 29) * ((100vw - 1024px) / (1440 - 1024))), 37px);
		width: min(calc(44px + (56 - 44) * ((100vw - 1024px) / (1440 - 1024))), 56px);
	}
	.custom-mosaic .icon-cont .art {
		height: min(calc(42px + (56 - 42) * ((100vw - 1024px) / (1440 - 1024))), 56px);
		width: min(calc(42px + (56 - 42) * ((100vw - 1024px) / (1440 - 1024))), 56px);
	}

	.custom-mosaic .slide:hover .img-cont::after {
		opacity: 0;
	}
}

@media (min-width: 1700px) {
	.custom-mosaic .widget-title {
		font-size: 125px;
	}

	.custom-mosaic .widget-subtitle {
		font-size: 4.375rem;
	}
}
/* 
.custom_mosaic .mosaic-content-container {
	padding: 0 var(--space-5);
	max-width: 1188px;
	margin: 0 auto;
}

.custom_mosaic .cols {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	grid-template-rows: repeat(3, 1fr);
	gap: 15px;
}



.custom_mosaic .content-section {
	position: absolute;
	top: 50%;
	width: 100%;
	max-width: 85%;
	margin: 0 auto;
	text-align: center;
	left: 50%;
	transform: translate(-50%, -50%);
}

.custom_mosaic .slide.promoted {
	grid-column: 1 / 3;
	grid-row: 3;
}

.custom_mosaic .widget-title {
	font-size: 2.8125rem;
	line-height: var(--leading-tight);
	color: var(--blue-00);
}

.custom_mosaic .widget-header {
	margin-bottom: 15px;
}

.custom_mosaic .slide .content-section h4,
.custom_mosaic .slide .content-section .no-link, 
.custom_mosaic .slide .content-section h4 a {
	background-color: white;
	display: inline-block;
	color: var(--blue-00);
	border-radius: var(--rounded-full);
	font-size: var(--text-sm);
	letter-spacing: -.07em;
	line-height: var(--leading-tight);
}

.custom_mosaic .slide .content-section h4 a {
	padding: 10px 22px;
	transition: color var(--transition-appendix), text-decoration var(--transition-appendix), background-color var(--transition-appendix);
}

.custom_mosaic .slide .content-section .no-link {
	padding: 10px var(--space-5);
}

@media (min-width: 40em) {
	.custom_mosaic .slide .content-section h4, 
	.custom_mosaic .slide .content-section h4 a,
	.custom_mosaic .slide .content-section .no-link  {
		font-size: var(--text-xl);
		letter-spacing: var(--tracking-tight);
	}

	.custom_mosaic .slide .content-section h4 a,
	.custom_mosaic .slide .content-section .no-link {
		padding: 11px 34px;
	}

	.custom_mosaic .slide.promoted .content-section h4 a,
	.custom_mosaic .slide.promoted .content-section .no-link {
		font-size: var(--text-2xl);
		padding: 14px 51px;
	}

	.custom_mosaic .widget-title {
		font-size: 4.375rem;
	}
}

@media (min-width: 64em) {
	.custom_mosaic {
		margin-bottom: var(--space-16);
	}

	.custom_mosaic .cols {
		display: grid;
		grid-template-columns: 0.7201fr 0.495fr 0.72fr 1fr;
		grid-template-rows: repeat(2, 260px);
		gap: 30px;
	}

	.custom_mosaic .slide.promoted {
		grid-column: 4;
		grid-row: 1 / 3;
	}

	.custom_mosaic .slide:nth-child(2) {
		grid-column: 2 / 4;
		grid-row: 1
	}
	.custom_mosaic .slide:nth-child(3) {
		grid-column: 1 / 2;
		grid-row: 1
	}
	.custom_mosaic .slide:nth-child(4) {
		grid-column: 3 / 4;
		grid-row: 2
	}
	.custom_mosaic .slide:nth-child(5) {
		grid-column: 1 / 3;
		grid-row: 2
	}

	.custom_mosaic .slide .content-section h4 a:hover {
		color: var(--white);
		background-color: var(--orange-cf);
		text-decoration: underline;
		text-underline-offset: 3px;
		text-decoration-thickness: 2px;
	}
} */

/* Alternative Layout */
/* .custom_mosaic.alt-layout {
	position: relative;
	isolation: isolate;
	padding: 34px 0 100px;
}

.custom_mosaic.alt-layout .widget-header {
	margin-bottom: 30px;
}

.custom_mosaic.alt-layout .cols {
	padding: 15px;
	background-color: var(--white);
}

.custom_mosaic.alt-layout .slide.promoted {
	grid-row: 1;
}

.custom_mosaic.alt-layout::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	background-image: url('/includes/public/assets/shared/highlight_mosaic_background.png');
	background-size: cover;
	z-index: -1;
	background-position: center left 35%;
}
.custom_mosaic.alt-layout::after {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	background-color: var(--black-30);
	z-index: -2;
}

.custom_mosaic.alt-layout .widget-title {
	color: var(--white);
}

@media (min-width: 64em) {
	.custom_mosaic.alt-layout .mosaic-content-container {
		max-width: 1248px;
	}

	.custom_mosaic.alt-layout::before {
		background-position: center bottom 20%;
	}

	.custom_mosaic.alt-layout {
		padding: 64px 0 117px;
	}

	.custom_mosaic.alt-layout .widget-header {
		margin-bottom: 15px;
	}

	.custom_mosaic.alt-layout .cols {
		padding: 30px;
		grid-template-columns: 1fr 0.7201fr 0.495fr 0.72fr;
	}
	
	.custom_mosaic.alt-layout .slide.promoted {
		grid-column: 1;
		grid-row: 1 / 3;
	}
	
	.custom_mosaic.alt-layout .slide:nth-child(2) {
		grid-column: 2 / 4;
		grid-row: 1;
	}
	
	.custom_mosaic.alt-layout .slide:nth-child(3) {
		grid-column: 4 / 5;
		grid-row: 1;
	}
	
	.custom_mosaic.alt-layout .slide:nth-child(4) {
		grid-column: 2 / 3;
		grid-row: 2;
	}
	
	.custom_mosaic.alt-layout .slide:nth-child(5) {
		grid-column: 3 / 5;
		grid-row: 2;
	}
} */