.tab-mosaic {
	margin-bottom: var(--space-12);
}

.tab-mosaic .widget-header {
	display: none;
	visibility: hidden;
}
.tab-mosaic .mosaic-content-container {
	max-width: 1440px;
	margin: 0 auto;
}

.tab-mosaic .cols {
	display: grid;
	gap: 3px;
}

.tab-mosaic .inner {
	position: relative;
	height: 100%;
}

.tab-mosaic .content-section {
	position: absolute;
    bottom: 0;
    width: 100%;
	padding: var(--space-2) var(--space-3);
	pointer-events: none;
}
.tab-mosaic .content-section .trip-builder-cont {
	pointer-events: none;
}
.tab-mosaic .content-section .trip-builder-cont .collection-trip-builder {
	background-color: transparent;
	padding: unset;
	pointer-events: all;
}
.tab-mosaic .content-section .trip-builder-cont .collection-trip-builder span {
	display: none;
}
.tab-mosaic .content-section .trip-builder-cont img {
	width: 30.05px;
}

.tab-mosaic .slide.item-1 {
	grid-column: 1 / span 2;
	grid-row: 1;
}
.tab-mosaic .slide.item-2 {
	grid-column: 1;
    grid-row: 2 / span 2;
}

.tab-mosaic .slide.item-3 {
	grid-column: 2;
	grid-row: 2;
}

.tab-mosaic .slide.item-4 {
	grid-column: 2;
	grid-row: 3;
}

.tab-mosaic .slide.item-5 {
	grid-column: 1 / span 2;
}

.tab-mosaic .slide .content-section h4,
.tab-mosaic .slide .content-section h4 a {
	color: var(--white);
	font-size: var(--text-sm);
	pointer-events: all;
}

.tab-mosaic .img-cont,
.tab-mosaic img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.tab-mosaic .img-cont::after {
	content: "";
	position: absolute;
	bottom: 0;
	width: 100%;
	height: 60%;
	background: transparent linear-gradient(180deg, #00000000 0%, #000000 100%) 0% 0% no-repeat padding-box;
	opacity: 0.5;
	pointer-events: none;
}

@media (min-width: 40em) {
	.tab-mosaic .slide .content-section h4, 
	.tab-mosaic .slide .content-section h4 a,
	.tab-mosaic .slide .content-section .no-link  {
		font-size: var(--text-xl);
		letter-spacing: var(--tracking-tight);
	}

	.tab-mosaic .widget-title {
		font-size: 4.375rem;
	}
}

@media (min-width: 64em) {
	.tab-mosaic {
		margin-bottom: var(--space-16);
	}
	.tab-mosaic .mosaic-content-container {
		padding: 0 60px;
	}
	.tab-mosaic .cols {
		display: grid;
		gap: 10px;
	}
	.tab-mosaic .slide {
		position: relative;
		background-color: var(--dark-blue);
		overflow: hidden;
	}
	.tab-mosaic .slide:after {
		content: "";
		background-image: url(/includes/public/assets/shared/b-assets/big-b-yellow-stroke.svg);
		background-size: cover;
		background-repeat: no-repeat;
		aspect-ratio: 512 / 686;
		height: calc(100% + 40px);
		max-height: 310px;
		width: auto;
		position: absolute;
		z-index: 15;
		left: -5px;
		bottom: -8px;
		transform: translateX(-100%);
		pointer-events: none;
		transition: all ease-in-out 400ms;
	}

	.tab-mosaic .slide:nth-child(1) {
		grid-column: 1 / span 2;
		grid-row: 1;
	}
	.tab-mosaic .slide:nth-child(2) {
		grid-column: 4;
		grid-row: 1 / span 2;
	}

	.tab-mosaic .slide:nth-child(3) {
		grid-column: 3;
		grid-row: 1
	}
	.tab-mosaic .slide:nth-child(4) {
		grid-column: 1;
		grid-row: 2;
	}
	.tab-mosaic .slide:nth-child(5) {
		grid-column: 2 / span 2;
		grid-row: 2
	}

	.tab-mosaic .slide:hover .img-cont img {
		transition: all ease 400ms;
	}
	
	.tab-mosaic .content-section {
		padding: var(--space-2) var(--space-4);
	}

	.tab-mosaic .content-section .trip-builder-cont .collection-trip-builder .icon-cont {
		position: relative;
		display: flex;
		gap: 6px;
	}
	.tab-mosaic .content-section .trip-builder-cont .collection-trip-builder span {
		display: block;
		font-size: var(--text-xs);
		line-height: 0.9;
		background-color: transparent;
		color: var(--white);
		text-align: left;
		max-width: 56px;
		place-self: end;
		margin-bottom: 1px;
		opacity: 0;

		transition: opacity var(--transition-appendix);
	}

	.tab-mosaic .content-section .trip-builder-cont img {
		width: 38.6px;
	}

	.tab-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;
	}

	@media (hover: hover) {
		.tab-mosaic .content-section .trip-builder-cont .collection-trip-builder:hover span {
			opacity: 1;
		}

		.tab-mosaic .slide:hover .img-cont img {
			opacity: 0.25;
		}
		.tab-mosaic .slide:hover:after {
			transform: translateX(0);
		}
	}
}