.fm-photo-gallery {
	--fm-gallery-gap: clamp(.75rem, 1.5vw, 1.25rem);
	display: grid !important;
	grid-template-columns: repeat(var(--fm-gallery-columns-desktop, 3), minmax(0, 1fr));
	gap: var(--fm-gallery-gap) !important;
}

.fm-photo-gallery .wp-block-image {
	width: 100% !important;
	margin: 0 !important;
	overflow: hidden;
	cursor: zoom-in;
	border-radius: clamp(.5rem, 1vw, .875rem);
	background: #f1f1f1;
	transition: transform .25s ease, box-shadow .25s ease;
	transform-origin: center;
}

.fm-photo-gallery .wp-block-image img {
	display: block;
	width: 100%;
	height: 100%;
	aspect-ratio: var(--fm-gallery-ratio, 4 / 3);
	object-fit: var(--fm-gallery-fit, cover);
}

.fm-photo-gallery[data-fm-ratio="original"] .wp-block-image img {
	height: auto;
	aspect-ratio: auto;
}

.fm-photo-gallery .wp-block-image:hover {
	position: relative;
	z-index: 1;
	transform: scale(1.02);
	box-shadow: 0 .75rem 2rem rgba(0, 0, 0, .14);
}
.fm-photo-gallery .wp-block-image:focus-visible { outline: 3px solid currentColor; outline-offset: 3px; }
.fm-photo-gallery-is-open { overflow: hidden; }

.fm-photo-gallery--masonry {
	display: block !important;
	columns: 3 15rem;
	column-gap: var(--fm-gallery-gap);
}

.fm-photo-gallery--masonry .wp-block-image {
	display: inline-block !important;
	margin: 0 0 var(--fm-gallery-gap) !important;
	break-inside: avoid;
}

.fm-photo-gallery--masonry .wp-block-image img {
	height: auto;
	aspect-ratio: auto;
}

.fm-photo-gallery--flex {
	display: flex !important;
	flex-wrap: wrap;
	align-items: stretch;
}

.fm-photo-gallery--flex .wp-block-image {
	flex: 1 1 calc((100% - (var(--fm-gallery-columns-desktop, 3) - 1) * var(--fm-gallery-gap)) / var(--fm-gallery-columns-desktop, 3));
	width: auto !important;
	aspect-ratio: var(--fm-gallery-ratio, 4 / 3);
}

.fm-photo-gallery--flex .wp-block-image img {
	width: 100%;
	height: 100%;
	aspect-ratio: var(--fm-gallery-ratio, 4 / 3);
	object-fit: var(--fm-gallery-fit, cover);
}

.fm-photo-gallery__lightbox {
	--fm-ui-foreground: #fff;
	--fm-ui-muted: rgba(255, 255, 255, .72);
	--fm-ui-surface: rgba(255, 255, 255, .11);
	--fm-ui-surface-hover: rgba(255, 255, 255, .2);
	--fm-ui-border: rgba(255, 255, 255, .28);
	--fm-ui-shadow: rgba(0, 0, 0, .28);
	width: 100vw;
	max-width: none;
	height: 100dvh;
	max-height: none;
	margin: 0;
	padding: 0;
	border: 0;
	background: color-mix(in srgb, var(--fm-lightbox-background, #0c0d10) var(--fm-lightbox-opacity, 98%), transparent);
	color: var(--fm-ui-foreground);
}

.fm-photo-gallery__lightbox[data-fm-ui-tone="light"] {
	--fm-ui-foreground: #111318;
	--fm-ui-muted: rgba(17, 19, 24, .68);
	--fm-ui-surface: rgba(17, 19, 24, .09);
	--fm-ui-surface-hover: rgba(17, 19, 24, .17);
	--fm-ui-border: rgba(17, 19, 24, .24);
	--fm-ui-shadow: rgba(17, 19, 24, .18);
}

.fm-photo-gallery__lightbox::backdrop { background: color-mix(in srgb, var(--fm-lightbox-background, #000) var(--fm-lightbox-opacity, 88%), transparent); }
.fm-photo-gallery__stage { position: relative; display: grid; grid-template-rows: minmax(0, 1fr) auto; width: 100%; height: 100%; }
.fm-photo-gallery__slide { display: grid; place-items: center; width: 100%; min-height: 0; padding: clamp(4.5rem, 7vw, 6rem) clamp(4rem, 8vw, 8rem) 1.5rem; box-sizing: border-box; }
.fm-photo-gallery__large { display: block; width: 100%; height: 100%; max-width: 100%; max-height: calc(100dvh - 12rem); object-fit: contain; filter: drop-shadow(0 24px 40px rgba(0,0,0,.4)); }
.fm-photo-gallery__caption { position: absolute; left: 50%; bottom: 7.25rem; translate: -50% 0; max-width: min(80vw, 50rem); padding: .55rem .9rem; border: 1px solid var(--fm-ui-border); border-radius: 999px; background: var(--fm-ui-surface); color: var(--fm-ui-foreground); box-shadow: 0 .35rem 1.25rem var(--fm-ui-shadow); backdrop-filter: blur(14px); text-align: center; font: 500 .875rem/1.4 system-ui, sans-serif; }
.fm-photo-gallery__counter { position: absolute; z-index: 2; top: 1.75rem; left: 50%; translate: -50% 0; color: var(--fm-ui-muted); font: 600 .8125rem/1.2 system-ui, sans-serif; letter-spacing: .08em; }

.fm-photo-gallery__close,
.fm-photo-gallery__arrow,
.fm-photo-gallery__thumb {
	appearance: none;
	box-sizing: border-box;
	margin: 0;
	padding: 0;
	border: 1px solid var(--fm-ui-border);
	color: var(--fm-ui-foreground);
	background: var(--fm-ui-surface);
	box-shadow: 0 .4rem 1.4rem var(--fm-ui-shadow);
	backdrop-filter: blur(12px);
	cursor: pointer;
	font-family: system-ui, sans-serif;
	transition: color .2s ease, background-color .2s ease, border-color .2s ease, opacity .2s ease, transform .2s ease;
}

.fm-photo-gallery__close { position: absolute; z-index: 2; top: 1.25rem; right: 1.25rem; width: 2.875rem; height: 2.875rem; overflow: hidden; border-radius: 50%; color: transparent; font-size: 0; line-height: 0; }
.fm-photo-gallery__close::before,
.fm-photo-gallery__close::after { content: ""; position: absolute; top: 50%; left: 50%; width: 1.15rem; height: 2px; border-radius: 999px; background: var(--fm-ui-foreground); }
.fm-photo-gallery__close::before { transform: translate(-50%, -50%) rotate(45deg); }
.fm-photo-gallery__close::after { transform: translate(-50%, -50%) rotate(-45deg); }
.fm-photo-gallery__arrow { position: absolute; z-index: 2; top: 50%; translate: 0 -50%; width: 3rem; height: 3rem; border-radius: 50%; font-size: 1.35rem; line-height: 1; }
.fm-photo-gallery__arrow--prev { left: 1rem; }
.fm-photo-gallery__arrow--next { right: 1rem; }
.fm-photo-gallery__close:hover,
.fm-photo-gallery__arrow:hover { background: var(--fm-ui-surface-hover); transform: scale(1.06); }
.fm-photo-gallery__close:focus-visible,
.fm-photo-gallery__arrow:focus-visible,
.fm-photo-gallery__thumb:focus-visible { outline: 3px solid var(--fm-ui-foreground); outline-offset: 3px; }

.fm-photo-gallery__thumbs {
	display: flex;
	gap: .55rem;
	justify-content: safe center;
	justify-self: center;
	width: min(90vw, 62rem);
	overflow-x: auto;
	margin: 0 0 1.25rem;
	padding: .25rem;
	box-sizing: border-box;
	scrollbar-width: thin;
}

.fm-photo-gallery__thumb { flex: 0 0 4.5rem; height: 3.5rem; padding: 0; border-radius: .45rem; overflow: hidden; opacity: .48; }
.fm-photo-gallery__thumb:hover { opacity: .82; transform: translateY(-1px); }
.fm-photo-gallery__thumb[aria-current="true"] { opacity: 1; border-color: var(--fm-ui-foreground); box-shadow: 0 0 0 2px var(--fm-ui-foreground), 0 .4rem 1.4rem var(--fm-ui-shadow); transform: translateY(-2px); }
.fm-photo-gallery__thumb img { width: 100%; height: 100%; object-fit: cover; }
.fm-photo-gallery__counter[hidden],
.fm-photo-gallery__caption[hidden],
.fm-photo-gallery__thumbs[hidden] { display: none !important; }

@media (max-width: 40rem) {
	.fm-photo-gallery { grid-template-columns: repeat(var(--fm-gallery-columns-mobile, 1), minmax(0, 1fr)); }
	.fm-photo-gallery--flex .wp-block-image { flex-basis: calc((100% - (var(--fm-gallery-columns-mobile, 1) - 1) * var(--fm-gallery-gap)) / var(--fm-gallery-columns-mobile, 1)); }
	.fm-photo-gallery__slide { padding: 4.5rem .75rem 1rem; }
	.fm-photo-gallery__large { max-height: calc(100dvh - 11rem); }
	.fm-photo-gallery__arrow { top: 48%; width: 2.5rem; height: 2.5rem; }
	.fm-photo-gallery__arrow--prev { left: .25rem; }
	.fm-photo-gallery__arrow--next { right: .25rem; }
	.fm-photo-gallery__thumb { flex-basis: 4rem; height: 3.25rem; }
}

@media (min-width: 40.01rem) and (max-width: 64rem) {
	.fm-photo-gallery { grid-template-columns: repeat(var(--fm-gallery-columns-tablet, 2), minmax(0, 1fr)); }
	.fm-photo-gallery--flex .wp-block-image { flex-basis: calc((100% - (var(--fm-gallery-columns-tablet, 2) - 1) * var(--fm-gallery-gap)) / var(--fm-gallery-columns-tablet, 2)); }
}

.fm-photo-gallery[data-fm-disable-animations="true"] *,
.fm-photo-gallery__lightbox[data-fm-disable-animations="true"] * { scroll-behavior: auto !important; transition: none !important; }

@media (prefers-reduced-motion: reduce) {
	.fm-photo-gallery * { scroll-behavior: auto !important; transition: none !important; }
}
