/*
 * Photography presentation enhancements for Twenty Twenty-Five Photo.
 */

/* Smooth, slightly desaturated base — lets photos provide the color. */
body {
	background-color: var(--wp--preset--color--base);
}

/* Images: subtle zoom on hover, no harsh borders. */
.wp-block-image img,
.wp-block-gallery img,
.wp-block-post-featured-image img {
	transition: transform 0.6s ease, opacity 0.4s ease;
	backface-visibility: hidden;
}

.wp-block-image a:hover img,
.wp-block-gallery figure:hover img {
	transform: scale(1.015);
	opacity: 0.92;
}

/* Gallery grid: tight, even gutters, no rounded corners. */
.wp-block-gallery.has-nested-images figure.wp-block-image {
	margin: 0;
}

.wp-block-gallery .wp-block-image img {
	border-radius: 0;
}

/* Gallery grid: smaller tiles so more fit per row, brick/justified style
   (images keep their natural aspect ratio when "Crop images" is off,
   so row heights vary naturally). Overrides the columns-N width set by
   the block's column count. */
.wp-block-gallery.has-nested-images figure.wp-block-image {
	width: calc(16.6% - 0.5rem) !important;
	flex-grow: 1;
}

@media (max-width: 900px) {
	.wp-block-gallery.has-nested-images figure.wp-block-image {
		width: calc(25% - 0.5rem) !important;
	}
}

@media (max-width: 600px) {
	.wp-block-gallery.has-nested-images figure.wp-block-image {
		width: calc(33.3% - 0.4rem) !important;
	}
}

/* Captions: quiet, uppercase, letter-spaced — editorial feel. */
figcaption,
.wp-element-caption {
	margin-top: 0.6rem;
	opacity: 0.75;
}

/* Full-bleed / wide images get a touch of breathing room between sections. */
.wp-block-image.alignfull,
.wp-block-image.alignwide,
.wp-block-cover.alignfull,
.wp-block-cover.alignwide {
	margin-top: var(--wp--preset--spacing--50);
	margin-bottom: var(--wp--preset--spacing--50);
}

/* Cover blocks: darken overlay slightly for legible light text on photos. */
.wp-block-cover::before {
	background: rgba(0, 0, 0, 0.25);
}

.wp-block-cover .wp-block-cover__inner-container {
	color: var(--wp--preset--color--contrast);
}

/* Links on dark backgrounds: gold accent on hover, set globally via theme.json,
   but reinforce within cover/group blocks that may inherit differently. */
.wp-block-cover a:hover,
.wp-block-group a:hover {
	color: var(--wp--preset--color--accent-1);
}

/* Site header / footer: extra letter-spacing already set via theme.json;
   add a thin divider for separation against dark background. */
.wp-block-template-part[data-type="core/template-part"] header,
.site-header {
	border-bottom: 1px solid var(--wp--preset--color--accent-3);
}

/* Buttons: crisp rectangular outline-friendly style for a modern gallery feel. */
.wp-block-button__link {
	transition: background-color 0.3s ease, color 0.3s ease;
}

/* Selection highlight tuned for dark background. */
::selection {
	background: var(--wp--preset--color--accent-1);
	color: var(--wp--preset--color--base);
}