.das-post-gallery__grid {
	display: grid;
}

.das-post-gallery__item {
	position: relative;
	display: block;
	width: 100%;
	min-width: 0;
	padding: 0;
	overflow: hidden;
	appearance: none;
	color: inherit;
	text-decoration: none;
	cursor: pointer;
}

.das-post-gallery__item::after {
	position: absolute;
	inset: 0;
	content: "";
	opacity: 0;
	transition: opacity var(--das-post-gallery-hover-duration, 350ms) ease;
}

.das-post-gallery__item:hover::after,
.das-post-gallery__item:focus-visible::after {
	opacity: 1;
}

.das-post-gallery__item img,
.das-post-gallery__item video,
.das-post-gallery__placeholder {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	pointer-events: none;
}

.das-post-gallery__item img,
.das-post-gallery__item video {
	transition: transform var(--das-post-gallery-hover-duration, 350ms) ease, opacity var(--das-post-gallery-hover-duration, 350ms) ease;
}

.das-post-gallery-hover-zoom-in .das-post-gallery__item:hover img,
.das-post-gallery-hover-zoom-in .das-post-gallery__item:hover video,
.das-post-gallery-hover-zoom-in .das-post-gallery__item:focus-visible img,
.das-post-gallery-hover-zoom-in .das-post-gallery__item:focus-visible video,
.das-post-gallery-hover-zoom-fade .das-post-gallery__item:hover img,
.das-post-gallery-hover-zoom-fade .das-post-gallery__item:hover video,
.das-post-gallery-hover-zoom-fade .das-post-gallery__item:focus-visible img,
.das-post-gallery-hover-zoom-fade .das-post-gallery__item:focus-visible video {
	transform: scale(1.08);
}

.das-post-gallery-hover-zoom-out .das-post-gallery__item img,
.das-post-gallery-hover-zoom-out .das-post-gallery__item video {
	transform: scale(1.08);
}

.das-post-gallery-hover-zoom-out .das-post-gallery__item:hover img,
.das-post-gallery-hover-zoom-out .das-post-gallery__item:hover video,
.das-post-gallery-hover-zoom-out .das-post-gallery__item:focus-visible img,
.das-post-gallery-hover-zoom-out .das-post-gallery__item:focus-visible video {
	transform: scale(1);
}

.das-post-gallery-hover-zoom-fade .das-post-gallery__item:hover img,
.das-post-gallery-hover-zoom-fade .das-post-gallery__item:hover video,
.das-post-gallery-hover-zoom-fade .das-post-gallery__item:focus-visible img,
.das-post-gallery-hover-zoom-fade .das-post-gallery__item:focus-visible video,
.das-post-gallery-hover-fade .das-post-gallery__item:hover img,
.das-post-gallery-hover-fade .das-post-gallery__item:hover video,
.das-post-gallery-hover-fade .das-post-gallery__item:focus-visible img,
.das-post-gallery-hover-fade .das-post-gallery__item:focus-visible video {
	opacity: .72;
}

.das-post-gallery__placeholder {
	display: flex;
	align-items: center;
	justify-content: center;
}

.das-post-gallery__play {
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transform: translate(-50%, -50%);
	pointer-events: none;
}

.das-post-gallery__play svg {
	display: block;
}

.das-post-gallery__lightbox {
	position: fixed;
	inset: 0;
	z-index: 99999;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 64px 92px;
}

.das-post-gallery__lightbox[hidden] {
	display: none !important;
}

.das-post-gallery-lightbox-animation-fade .das-post-gallery__lightbox,
.das-post-gallery-lightbox-animation-fade-zoom .das-post-gallery__lightbox {
	animation: dasPostGalleryLightboxFade var(--das-post-gallery-lightbox-duration, 280ms) ease both;
}

.das-post-gallery-lightbox-animation-fade-zoom .das-post-gallery__dialog {
	animation: dasPostGalleryLightboxZoom var(--das-post-gallery-lightbox-duration, 280ms) cubic-bezier(.2, .8, .2, 1) both;
}

.das-post-gallery-lightbox-animation-fade .das-post-gallery__stage > *,
.das-post-gallery-lightbox-animation-fade-zoom .das-post-gallery__stage > * {
	animation: dasPostGalleryMediaIn var(--das-post-gallery-lightbox-duration, 280ms) ease both;
}

@keyframes dasPostGalleryLightboxFade {
	from { opacity: 0; }
	to { opacity: 1; }
}

@keyframes dasPostGalleryLightboxZoom {
	from { opacity: .65; transform: scale(.96); }
	to { opacity: 1; transform: scale(1); }
}

@keyframes dasPostGalleryMediaIn {
	from { opacity: 0; transform: scale(.985); }
	to { opacity: 1; transform: scale(1); }
}

.das-post-gallery__backdrop {
	position: absolute;
	inset: 0;
}

.das-post-gallery__dialog {
	position: relative;
	z-index: 1;
	display: flex;
	width: 100%;
	height: 100%;
	align-items: center;
	justify-content: center;
}

.das-post-gallery__stage {
	display: flex;
	max-width: 100%;
	max-height: 100%;
	align-items: center;
	justify-content: center;
}

.das-post-gallery__stage img,
.das-post-gallery__stage video,
.das-post-gallery__stage iframe {
	display: block;
	max-width: 100%;
	max-height: 100%;
	border: 0;
}

.das-post-gallery__stage iframe {
	width: min(1120px, 82vw);
	aspect-ratio: 16 / 9;
}

.das-post-gallery__control {
	position: absolute;
	z-index: 3;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	border: 0;
	border-radius: 50%;
	color: #fff;
	cursor: pointer;
}

.das-post-gallery__control svg {
	display: block;
	width: 22px;
	height: 22px;
	flex: 0 0 22px;
	overflow: visible;
}

.das-post-gallery__control svg path {
	stroke: currentColor;
}

.das-post-gallery__close {
	top: 22px;
	right: 22px;
}

.das-post-gallery__previous,
.das-post-gallery__next {
	top: 50%;
	transform: translateY(-50%);
}

.das-post-gallery__previous {
	left: 22px;
}

.das-post-gallery__next {
	right: 22px;
}

.das-post-gallery__counter,
.das-post-gallery__caption {
	position: absolute;
	z-index: 3;
	left: 50%;
	transform: translateX(-50%);
}

.das-post-gallery__counter {
	bottom: 18px;
}

.das-post-gallery__caption {
	bottom: 48px;
	max-width: min(760px, 80vw);
	text-align: center;
}

body.das-post-gallery-open {
	overflow: hidden;
}

@media (prefers-reduced-motion: reduce) {
	.das-post-gallery__item::after,
	.das-post-gallery__item img,
	.das-post-gallery__item video,
	.das-post-gallery__lightbox,
	.das-post-gallery__dialog,
	.das-post-gallery__stage > * {
		animation: none !important;
		transition: none !important;
	}
}

@media (max-width: 767px) {
	.das-post-gallery__lightbox {
		padding: 64px 16px 84px;
	}

	.das-post-gallery__previous {
		left: 12px;
	}

	.das-post-gallery__next {
		right: 12px;
	}
}
