/* OpenPress Reviews directory (/reviews/). Loaded on the Review archive only, after tools.css (page header, content spacing). Uses existing tokens/components. */

/* Breadcrumb sits above the title in the page header */
.op-reviews__crumbs { margin-bottom: var(--op-space-4); }

/* Review card ------------------------------------------------------------ */
/* Builds on .op-card / .op-card--link / .op-card__media / .op-card__body above. */
.op-review-card__media {
	display: flex;
	align-items: center;
	justify-content: center;
	border-bottom: 1px solid var(--op-border);
}
.op-review-card__monogram {
	color: var(--op-text-muted);
	font-size: 2.5rem;
	font-weight: var(--op-weight-semibold);
	line-height: 1;
}

.op-review-card__body { gap: var(--op-space-3); }
.op-review-card__tool { max-width: 100%; white-space: normal; overflow-wrap: anywhere; }

/* Two-line title and three-line excerpt keep cards in a row the same height. */
.op-review-card__title,
.op-review-card__excerpt {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	overflow: hidden;
	overflow-wrap: anywhere;
}
.op-review-card__title { -webkit-line-clamp: 2; line-clamp: 2; }
.op-review-card__excerpt { -webkit-line-clamp: 3; line-clamp: 3; }

/* Facts stay at the bottom of the body so footers align across a row. */
.op-review-card__facts {
	flex-direction: column;
	margin-top: auto;
	padding-top: var(--op-space-2);
}
.op-review-card__facts .op-meta__label { color: var(--op-text-muted); }
.op-review-card__facts .op-meta__label::after { content: ":"; }
.op-review-card__facts .op-meta__item { color: var(--op-text); font-weight: var(--op-weight-medium); overflow-wrap: anywhere; }

/* Review card: editorial. Image first, a "Review" label, the rating only when one exists. */
.op-review-card__media { aspect-ratio: 16 / 10; border-bottom: 0; }
.op-review-card__title { font-size: var(--op-text-h3); letter-spacing: -0.025em; line-height: 1.15; }
.op-review-card__excerpt { font-size: var(--op-text-small); }
.op-review-card__facts { padding-top: var(--op-space-3); border-top: 1px dashed var(--op-border); }
.op-review-card__rating { --op-star-size: 1.25rem; }
.op-review-card__rating .op-rating__value { font-family: var(--op-font-display); font-size: 1.125rem; }