.photogrid {
	display: grid;
	place-items: center;
}

.photogrid .gallery_wrapper {
	--img-size: calc(100px - 0.5rem / 2); /* Adjusted image size for mobile */
	display: grid;
	gap: 0.5rem;
	grid-template-columns: repeat(6, var(--img-size));
	grid-template-rows: repeat(4, var(--img-size));
}

.photogrid .gallery_wrapper img {
	max-width: 100%;
	aspect-ratio: 1;
	object-fit: cover;
	grid-column: span 2;
	border-radius: 0.5rem;
	clip-path: path(
		"M 80 20 C 100 0 100 0 120 20 C 140 40 160 60 180 80 C 200 100 200 100 180 120 C 160 140 140 160 120 180 C 100 200 100 200 80 180 C 60 160 40 140 20 120 C 0 100 0 100 20 80 Z"
	);
	transition: filter 500ms, clip-path 500ms;
}

.photogrid .gallery_wrapper img:nth-of-type(4),
.photogrid .gallery_wrapper img:nth-of-type(9) {
	grid-column: 2 / span 2;
}

.photogrid .gallery_wrapper img:hover {
	z-index: 100;
	clip-path: path(
		"M 0 0 C 100 0 100 0 200 0 C 200 50 200 50 200 80 C 200 100 200 100 200 120 C 200 150 200 150 200 200 C 100 200 100 200 0 200 C 0 150 0 150 0 120 C 0 100 0 100 0 80 Z"
	);
}

.photogrid .gallery_wrapper img:not(:hover) {
	animation: zIndexFix 500ms;
}

.photogrid .gallery_wrapper .gallery_wrapper:hover > img {
	filter: brightness(0.5) saturate(0.5);
}

.photogrid .gallery_wrapper .gallery_wrapper > img:hover {
	filter: brightness(1) saturate(1.5);
}

@keyframes zIndexFix {
	0%,
	100% {
		z-index: 10;
	}
}

/* Media Query for Mobile View */
@media only screen and (max-width: 600px) {
	.photogrid .gallery_wrapper {
		--img-size: calc(50px - 0.5rem / 2); /* Adjusted image size for mobile */
	}
	
	.photogrid .gallery_wrapper img {
		clip-path: path(
			"M 40 10 C 50 0 50 0 60 10 C 70 20 80 30 90 40 C 100 50 100 50 90 60 C 80 70 70 80 60 90 C 50 100 50 100 40 90 C 30 80 20 70 10 60 C 0 50 0 50 10 40 Z"
		); /* Adjusted clip-path for mobile */
	}
	
	.photogrid .gallery_wrapper img:hover {
		clip-path: path(
			"M 0 0 C 50 0 50 0 100 0 C 100 25 100 25 100 40 C 100 50 100 50 100 60 C 100 75 100 75 100 100 C 50 100 50 100 0 100 C 0 75 0 75 0 60 C 0 50 0 50 0 40 Z"
		); /* Adjusted clip-path for mobile */
	}
}