.kranium-pf-wrap { --kranium-gutter: 10px; }

.kranium-pf-grid,
.kranium-pf-masonry {
	grid-template-columns: repeat(var(--kranium-columns-desktop, 4), 1fr);
	column-count: var(--kranium-columns-desktop, 4);
	gap: var(--kranium-gutter, 10px);
	column-gap: var(--kranium-gutter, 10px);
}

.kranium-pf-grid { display: grid; }
.kranium-pf-masonry { display: block; }
.kranium-pf-masonry .kranium-pf-item { break-inside: avoid; margin-bottom: var(--kranium-gutter, 10px); }

.kranium-pf-item { position: relative; overflow: hidden; }
.kranium-pf-item img { width: 100%; height: auto; display: block; border-radius: 4px; }
.kranium-pf-caption { display: block; font-size: 13px; padding: 6px 0; }

/* Hover theme */
.kranium-pf-theme-hover .kranium-pf-item .kranium-pf-caption {
	position: absolute; left: 0; right: 0; bottom: 0;
	background: rgba(0,0,0,.65); color: #fff; padding: 8px;
	transform: translateY(100%); transition: transform .25s ease;
}
.kranium-pf-theme-hover .kranium-pf-item:hover .kranium-pf-caption { transform: translateY(0); }

/* Grayscale theme */
.kranium-pf-theme-grayscale .kranium-pf-item img { filter: grayscale(100%); transition: filter .25s ease; }
.kranium-pf-theme-grayscale .kranium-pf-item:hover img { filter: grayscale(0%); }

/* Popup theme */
.kranium-pf-theme-popup .kranium-pf-item a { cursor: zoom-in; }
.kranium-pf-lightbox-overlay {
	position: fixed; inset: 0; background: rgba(0,0,0,.85);
	display: flex; align-items: center; justify-content: center; z-index: 99999;
}
.kranium-pf-lightbox-overlay img { max-width: 90%; max-height: 90%; border-radius: 4px; }
.kranium-pf-lightbox-close { position: absolute; top: 20px; right: 30px; color: #fff; font-size: 32px; cursor: pointer; }

/* Profile theme */
.kranium-pf-profile-header { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
.kranium-pf-profile-header a { font-weight: 600; text-decoration: none; }

/* Follow button widget */
.kranium-pf-follow-btn {
	display: inline-block; padding: 10px 18px; background: #e60023; color: #fff;
	border-radius: 24px; font-weight: 600; text-decoration: none;
}
.kranium-pf-follow-btn:hover { background: #ad081b; color: #fff; }

/* Responsive columns */
@media (max-width: 1024px) {
	.kranium-pf-grid, .kranium-pf-masonry {
		grid-template-columns: repeat(var(--kranium-columns-tablet, 3), 1fr);
		column-count: var(--kranium-columns-tablet, 3);
	}
}
@media (max-width: 767px) {
	.kranium-pf-grid, .kranium-pf-masonry {
		grid-template-columns: repeat(var(--kranium-columns-mobile-p, 2), 1fr);
		column-count: var(--kranium-columns-mobile-p, 2);
	}
}
@media (max-width: 480px) {
	.kranium-pf-grid, .kranium-pf-masonry {
		grid-template-columns: repeat(var(--kranium-columns-mobile, 1), 1fr);
		column-count: var(--kranium-columns-mobile, 1);
	}
}