/* Image with text. */
.ph-mt {
	display: grid;
	grid-template-columns: 1fr 1fr;
	align-items: center;
	gap: clamp(24px, 5vw, 64px);
}

.ph-mt--right .ph-mt__media { order: 2; }

.ph-mt__media {
	overflow: hidden;
	border-radius: var(--pharmacy-radius);
	background: var(--pharmacy-muted);
}

.ph-mt__img { width: 100%; height: 100%; object-fit: cover; }

.ph-mt--ratio-1-1 .ph-mt__media { aspect-ratio: 1 / 1; }
.ph-mt--ratio-4-3 .ph-mt__media { aspect-ratio: 4 / 3; }
.ph-mt--ratio-3-4 .ph-mt__media { aspect-ratio: 3 / 4; }
.ph-mt--ratio-16-9 .ph-mt__media { aspect-ratio: 16 / 9; }

.ph-mt__placeholder {
	display: grid;
	place-items: center;
	aspect-ratio: 4 / 3;
	color: var(--pharmacy-border);
}

.ph-mt__eyebrow {
	margin: 0 0 8px;
	font-size: 0.76rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--pharmacy-primary);
}

.ph-mt__body { margin-bottom: 20px; }

.ph-mt__points {
	list-style: none;
	margin: 0 0 24px;
	padding: 0;
	display: grid;
	gap: 10px;
}

.ph-mt__points li { display: flex; align-items: flex-start; gap: 10px; }
.ph-mt__points svg { flex: 0 0 auto; margin-top: 2px; color: var(--pharmacy-primary); }

@media (max-width: 749px) {
	.ph-mt { grid-template-columns: 1fr; }
	/* Reset the order override, or the image lands below the copy on a phone, which
	   reads as an orphaned block. */
	.ph-mt--right .ph-mt__media { order: 0; }
}
