/**
 * Site-wide image safety.
 *
 * PERMANENT WOMEN WHO BUILD EDITORIAL PHOTOGRAPHY RULE
 * ====================================================
 * Important photographs must remain FULLY VISIBLE.
 * The layout adapts around the photograph.
 * Do not destructively crop faces, bodies, equipment, or group context.
 *
 * Use:
 *   width: auto; max-width: 100%; height: auto; object-fit: contain;
 *
 * Do NOT use object-fit: cover on major editorial portraits unless a
 * specific component has been explicitly approved for cropping.
 *
 * This rule applies from 320px through 2200px+, including phone portrait,
 * phone landscape, tablet, desktop, and ultra-wide.
 *
 * Apply class `.wwb-photo` (wrapper) and `.wwb-photo-img` (image)
 * to all important editorial photography.
 */

img,
picture,
video,
canvas,
svg {
	max-width: 100%;
}

img,
video {
	height: auto;
	aspect-ratio: auto;
}

img {
	display: block;
}

figure,
picture,
.wp-block-image,
.wp-block-gallery,
.wp-block-media-text,
.wp-block-media-text__media,
.wp-block-cover,
.wp-block-group,
.wp-block-column,
.wp-block-columns,
.entry-content,
.wwb-content-image,
.wwb-image-fit,
.wwb-logo-fit {
	min-width: 0;
	max-width: 100%;
	box-sizing: border-box;
}

/* Natural WordPress / Gutenberg content images — never stretch, never overflow. */
.entry-content img,
.wp-block-image img,
.wp-block-gallery img,
.wp-block-media-text__media img,
.wwb-content-image img,
img.size-thumbnail,
img.size-medium,
img.size-large,
img.size-full,
img.attachment-post-thumbnail {
	display: block;
	width: auto;
	max-width: 100%;
	height: auto;
	max-height: min(88vh, 880px);
	margin-inline: auto;
}

.wp-block-image,
.wwb-content-image,
.wp-block-gallery,
.wp-block-media-text {
	width: 100%;
}

.wp-block-image img,
.wwb-content-image img {
	margin-inline: auto;
}

.wp-block-media-text {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 1.5rem;
	align-items: center;
}

.wp-block-media-text__media img {
	width: auto;
	max-width: 100%;
	height: auto;
}

/* Logos, artwork, calendar designs, screenshots — never crop. */
.wwb-image-fit,
.wwb-logo-fit {
	display: block;
	position: relative;
	overflow: hidden;
}

.wwb-image-fit img,
.wwb-logo-fit img,
.split-panel-icon,
.action-card-icon-img,
.wordmark img,
.wordmark .wordmark-img,
.custom-logo {
	object-fit: contain;
}

.wwb-image-fit img,
.wwb-logo-fit img {
	width: 100%;
	height: 100%;
	object-position: center;
}

.wordmark img,
.wordmark .wordmark-img {
	width: 100%;
	height: auto;
	object-position: left center;
}

/* WordPress alignment — boxed, never 100vw. */
body.wwb-body .alignleft,
body.wwb-body .wp-block-image.alignleft {
	float: left;
	margin: 0 1.5em 1em 0;
	max-width: min(50%, 100%);
}

body.wwb-body .alignright,
body.wwb-body .wp-block-image.alignright {
	float: right;
	margin: 0 0 1em 1.5em;
	max-width: min(50%, 100%);
}

body.wwb-body .aligncenter,
body.wwb-body .wp-block-image.aligncenter,
body.wwb-body .wp-block-image .aligncenter {
	display: block;
	float: none;
	margin-inline: auto;
	margin-bottom: 1em;
}

body.wwb-body .alignwide,
body.wwb-body .wp-block-image.alignwide,
.entry-content .alignwide {
	width: min(100%, var(--wwb-container, 1520px));
	max-width: 100%;
	margin-inline: auto;
}

body.wwb-body .alignfull,
body.wwb-body .wp-block-image.alignfull,
body.wwb-body .wp-block-cover.alignfull,
body.wwb-body .wp-block-group.alignfull,
body.wwb-body .wp-block-gallery.alignfull,
body.wwb-body .wp-block-media-text.alignfull,
.entry-content .alignfull {
	width: 100%;
	max-width: 100%;
	margin-left: 0;
	margin-right: 0;
	left: auto;
	right: auto;
}

body.wwb-body .home-hero .alignfull,
body.wwb-body .home-hero-media .alignfull {
	width: 100%;
	max-width: 100%;
	margin: 0;
}

@media (max-width: 767px) {
	body.wwb-body .alignleft,
	body.wwb-body .alignright,
	body.wwb-body .wp-block-image.alignleft,
	body.wwb-body .wp-block-image.alignright {
		float: none;
		display: block;
		margin-inline: auto;
		max-width: 100%;
	}

	.wp-block-media-text {
		grid-template-columns: minmax(0, 1fr);
	}
}

.woocommerce img,
.woocommerce-product-gallery__image img {
	max-width: 100%;
	height: auto;
}

/* Global editorial photograph — full image, natural ratio, never cropped. */
.wwb-photo {
	line-height: 0;
	max-width: 100%;
	background: transparent;
	overflow: visible;
}

.wwb-photo img,
.wwb-photo-img {
	display: block;
	width: auto;
	max-width: 100%;
	height: auto;
	object-fit: contain;
	object-position: center top;
}
