/* O mne — page-specific tweaks (prefix .p-o-mne-*) */

/* Hero: portrait with green blob behind */
.p-o-mne-hero {
	overflow: hidden;
}

.p-o-mne-hero .grid-2 {
	align-items: center;
}

.p-o-mne-hero__media {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	align-self: center;
	min-height: 340px;
}

/* Lime accent blob peeking out top-right behind the framed photo. */
.p-o-mne-hero__blob {
	width: min(260px, 60%);
	height: min(260px, 60vw);
	top: -8%;
	right: -6%;
	left: auto;
	transform: none;
}

/* Framed garden portrait — rounded card, not a bleed cutout. */
.p-o-mne-portret {
	position: relative;
	z-index: 1;
	width: 100%;
	max-width: 420px;
	aspect-ratio: 4 / 5;
	object-fit: cover;
	border-radius: 24px;
	box-shadow: 0 24px 40px rgba(4, 70, 83, 0.18);
}

/* Credentials line under the H1 */
.p-o-mne-credentials {
	margin: 0 0 1.1rem;
	font-size: 0.95rem;
	font-weight: 600;
	color: var(--mp-text-soft, #3D5F68);
}

/* Reading width capped on the text itself, block stays pinned left
   (the .container class would center a reduced-width block via margin:auto). */
.p-o-mne-prose {
	text-align: left;
}

.p-o-mne-prose > * {
	max-width: 760px;
	margin-inline: 0;
}

/* Spacing between the two story headings inside one section */
.p-o-mne-prose__next {
	margin-top: 2.5rem;
}

/* All O mne blocks left-aligned per wireframe */
.p-o-mne-head {
	margin-inline: 0;
	text-align: left;
}

.p-o-mne-head > * {
	max-width: 760px;
	margin-inline: 0;
}

/* The proof band sits between two white sections, so its own section padding
 * stacks with theirs into a 208px hole above and below. Zero it — the
 * neighbours already contribute one section pad on each side. */
.section:has(> .container > .p-o-mne-proof) {
	padding-block: 0;
}

/* Proof callout — narrow green card, left-aligned with the prose above it */
.p-o-mne-proof {
	margin-inline: 0;
	text-align: left;
}

.p-o-mne-proof p,
.p-o-mne-proof .proof-band__number {
	margin-inline: 0;
	max-width: 720px;
	text-align: left;
}

.p-o-mne-cta {
	text-align: center;
}

/* Pred a po photo pairs */
.p-o-mne-pair {
	display: flex;
	gap: 10px;
}

.p-o-mne-pair .ph {
	flex: 1;
}

.p-o-mne-pair__img {
	flex: 1;
	min-width: 0;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	border-radius: 12px;
}

.p-o-mne-pair__caption {
	margin: 14px 0 0;
	font-weight: 600;
	color: var(--wp--preset--color--petrol);
}

