/** @format */

.acf_section.acf_section_references {
	background-color: var(--color-white);
}
.headline.headline--small.headline--color-blue {
	color: var(--color-blue);
}
.headline.headline--large {
	font-size: var(--fs-1);
}
.headline.headline--large.headline--color-black {
	color: var(--color-black);
}

.reference_text p {
	font-size: var(--fs-1);
	color: var(--color-black);
}

.limited_gallery__container,
.complete_gallery__container {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	grid-template-rows: repeat(3, min-content);
	grid-auto-rows: 0;
	overflow: hidden;
	column-gap: var(--universal-gap);
	margin: var(--universal-gap) 0;
}

.gallery_item_container {
	position: relative;
	display: grid;
	background-color: var(--color-black);
	margin: calc(var(--universal-gap) / 2) 0;
}

.slide .slide__image,
.gallery_item_container .gallery_item__image {
	transition-duration: 0.7s;
	transition-property: opacity;
}
.slide:hover .slide__image,
.gallery_item_container:hover .gallery_item__image {
	opacity: 0;
}

.slide .slide__text,
.gallery_item_container .gallery_item__text {
	transition-duration: 0.7s;
	transition-property: opacity, color;
}

.slide:hover .slide__text,
.gallery_item_container:hover .gallery_item__text {
	color: var(--color-white);
	opacity: 1;
}

.slide__contents .slide__text,
.limited_gallery__container .gallery_item__text,
.limited_gallery__container .gallery_item__image,
.complete_gallery__container .gallery_item__text,
.complete_gallery__container .gallery_item__image {
	grid-area: 1 / 1 / 1 / 1;
}

.slide__image img,
.limited_gallery__container .gallery_item__image img,
.complete_gallery__container .gallery_item__image img {
	max-width: 100%;
	height: auto;
	object-fit: cover;
	aspect-ratio: 1 / 1.15;
}

.slide__contents .slide__text,
.limited_gallery__container .gallery_item__text,
.complete_gallery__container .gallery_item__text {
	overflow: hidden;
	text-overflow: ellipsis;
	min-height: calc(var(--fs-1) * 3);
	line-height: var(--fs-1);
	align-self: end;
	padding: var(--fs-1);
	padding-right: calc(var(--fs-1) * 2);
	opacity: 0;
}

.slide__text::after,
.gallery_item__text::after {
	position: absolute;
	right: 0;
	content: var(--arrow-outward);
	font-size: var(--fs-1);
	font-family: var(--ff-icon-font);
	padding-right: var(--fs-1);
}