.peak-photo__hero {
	position: relative;
	margin-block-start: 0;
}

.peak-photo__image {
	margin: 0;
}

.peak-photo__image.is-landscape img {
	display: block;
	width: 100%;
	height: auto;
}

.peak-photo__image.is-portrait {
	display: flex;
	justify-content: center;
}

.peak-photo__image.is-portrait img {
	display: block;
	width: auto !important;
	max-width: 100%;
	height: min(92vh, 1600px) !important;
	object-fit: contain;
}

/* Translucent band near the top, date above title (as on photos.deansas.org). */
.peak-photo__band {
	position: absolute;
	top: clamp(1rem, 4vw, 2.5rem);
	left: 50%;
	transform: translateX(-50%);
	width: fit-content;
	max-width: min(90%, 48rem);
	padding: 0.6rem 1.75rem 0.8rem;
	background: rgb(40 36 30 / 0.42);
	color: #fff;
	text-align: center;
}

.peak-photo__band > * {
	margin: 0;
}

.peak-photo__band .wp-block-post-date {
	color: rgb(255 255 255 / 0.85);
}

.peak-photo__band .wp-block-post-title {
	color: #fff;
	font-size: var(--wp--preset--font-size--x-large);
}

/* No image at all, or small screens: the band sits above, in normal flow. */
.peak-photo__hero:not(:has(.peak-photo__image)) .peak-photo__band,
.peak-photo__hero:not(:has(img)) .peak-photo__band {
	position: static;
	transform: none;
	margin: var(--wp--preset--spacing--50) auto 0;
	background: none;
	color: inherit;
}

.peak-photo__hero:not(:has(img)) .peak-photo__band .wp-block-post-title {
	color: var(--wp--preset--color--primary);
}

.peak-photo__hero:not(:has(img)) .peak-photo__band .wp-block-post-date {
	color: var(--wp--preset--color--muted);
}

@media (max-width: 600px) {
	.peak-photo__band {
		position: static;
		transform: none;
		max-width: none;
		width: auto;
		background: none;
		color: inherit;
		padding: var(--wp--preset--spacing--30) var(--wp--preset--spacing--40);
	}

	.peak-photo__band .wp-block-post-title {
		color: var(--wp--preset--color--primary);
	}

	.peak-photo__band .wp-block-post-date {
		color: var(--wp--preset--color--muted);
	}

	.peak-photo__hero {
		display: flex;
		flex-direction: column-reverse;
	}
}

/* Older / newer photo links: thumbnail beside the label and title; newer mirrors to the right. */
.peak-photo-nav .wp-block-post-navigation-link {
	display: flex;
	align-items: center;
	gap: 0.75rem;
}

.peak-photo-nav .post-navigation-link-next {
	flex-direction: row-reverse;
}

.peak-photo-nav__thumb {
	flex: none;
	line-height: 0;
}

.peak-photo-nav__thumb img {
	width: 4rem;
	height: 4rem;
	object-fit: cover;
	border-radius: 3px;
}

/* Tags on photo posts, as chips linking to each tag's photo grid. */
.wp-block-post-terms.peak-tags {
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem;
	margin-top: var(--wp--preset--spacing--40);
	font-family: var(--wp--preset--font-family--ui);
	font-size: var(--wp--preset--font-size--small);
	text-transform: none;
	letter-spacing: normal;
}

.wp-block-post-terms.peak-tags .wp-block-post-terms__separator {
	display: none;
}

.wp-block-post-terms.peak-tags a {
	display: inline-block;
	padding: 0.15rem 0.75rem;
	border: 1px solid color-mix(in srgb, var(--wp--preset--color--muted) 50%, transparent);
	border-radius: 999px;
	color: var(--wp--preset--color--contrast);
	text-decoration: none;
}

.wp-block-post-terms.peak-tags a:hover {
	border-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--primary);
}
