/**
 * Reviewer byline.
 *
 * Every value is a Bricks design token — no raw hex, no raw spacing — so the
 * byline inherits the site's scale and palette rather than defining its own.
 */
.dental-review {
	margin-block: var(--space-m);
	padding-block: var(--space-s);
	border-top: 1px solid var(--neutral-200);
	border-bottom: 1px solid var(--neutral-200);
}

.dental-review__line {
	margin: 0;
	font-family: var(--font-body);
	font-size: var(--text-xs);
	color: var(--neutral-900);
}

.dental-review__author {
	color: var(--brand-primary);
	font-weight: 600;
	text-decoration: underline;
	text-underline-offset: 2px;
}

.dental-review__author:hover,
.dental-review__author:focus-visible {
	color: var(--brand-primary-accent);
}

.dental-review__date {
	color: var(--neutral-900);
	opacity: .75;
}

/*
 * In the hero the byline sits under the CTA, over a photograph. The hairline
 * rules and vertical rhythm belong to a body-copy context and only add clutter
 * there, and the palette inverts — so colour is inherited from the Bricks
 * element instead of restated, which keeps it correct in both the dark hero and
 * the light "For Body Content" variant without a second set of colour rules.
 */
.dental-review-hero .dental-review {
	margin-block: 0;
	padding-block: 0;
	border: 0;
}

.dental-review-hero .dental-review__line,
.dental-review-hero .dental-review__author,
.dental-review-hero .dental-review__date {
	color: inherit;
}

.dental-review-hero .dental-review__date {
	opacity: .85;
}