/* REA Agency Reviews — override any of these variables in your theme, e.g.
   .rear-wrap { --rear-accent: #0a3d62; } */
.rear-wrap {
	--rear-star: #fdb913;
	--rear-star-empty: #dcdce0;
	--rear-accent: #e4002b;
	--rear-card-bg: #f4f4f6;
	--rear-chip-bg: #e9e9ed;
	--rear-border: #d6d6dc;
	--rear-text: #2d2d33;
	--rear-muted: #6b6b76;
	--rear-link: #0b6bb0;
	--rear-radius: 8px;
	--rear-gap: 12px;
	color: var(--rear-text);
	margin: 0 0 1.5em;
	font-size: 16px;
}
.rear-wrap * { box-sizing: border-box; }

/* Header */
.rear-title { font-size: 1.35rem; font-weight: 700; margin: 0 0 .6em; color: inherit; }
.rear-summary { display: flex; align-items: center; gap: 6px; margin-bottom: 14px; font-size: 1.05rem; }
.rear-star-one { color: var(--rear-star); font-size: 1.15em; line-height: 1; }
.rear-summary-score { font-weight: 700; }
.rear-tags-intro { margin: 0 0 8px; font-size: 1.05rem; }
.rear-tags { list-style: none; margin: 0 0 18px; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.rear-tags li { background: var(--rear-chip-bg); border-radius: 4px; padding: 4px 9px; font-size: .9rem; margin: 0; }

/* Tabs (CSS only) */
.rear-tabs { display: flex; flex-wrap: wrap; }
.rear-tab-input { position: absolute; opacity: 0; pointer-events: none; }
.rear-tab {
	flex: 1; text-align: center; padding: 12px 8px; cursor: pointer; color: var(--rear-muted); font-weight: 500;
	border-bottom: 1px solid var(--rear-border); margin-bottom: 12px; transition: color .15s;
}
.rear-tab:hover { color: var(--rear-text); }
.rear-panel { flex: 0 0 100%; display: none; }
.rear-tab-input:nth-of-type(1):checked ~ .rear-tab:nth-of-type(1),
.rear-tab-input:nth-of-type(2):checked ~ .rear-tab:nth-of-type(2),
.rear-tab-input:nth-of-type(3):checked ~ .rear-tab:nth-of-type(3),
.rear-tab-input:nth-of-type(4):checked ~ .rear-tab:nth-of-type(4) { color: var(--rear-text); border-bottom: 2px solid var(--rear-accent); }
.rear-tab-input:nth-of-type(1):checked ~ .rear-panel:nth-of-type(1),
.rear-tab-input:nth-of-type(2):checked ~ .rear-panel:nth-of-type(2),
.rear-tab-input:nth-of-type(3):checked ~ .rear-panel:nth-of-type(3),
.rear-tab-input:nth-of-type(4):checked ~ .rear-panel:nth-of-type(4) { display: block; }
.rear-tab-input:focus-visible + .rear-tab { outline: 2px solid var(--rear-accent); outline-offset: -2px; }

/* Layouts */
.rear-items { display: grid; gap: var(--rear-gap); }
.rear-layout-list .rear-items { grid-template-columns: 1fr; }
.rear-layout-grid .rear-items { grid-template-columns: repeat(var(--rear-cols, 3), minmax(0, 1fr)); }
.rear-layout-carousel .rear-items { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 8px; }
.rear-layout-carousel .rear-card {
	flex: 0 0 calc((100% - (var(--rear-cols, 3) - 1) * var(--rear-gap)) / var(--rear-cols, 3));
	scroll-snap-align: start;
}
@media (max-width: 900px) {
	.rear-layout-grid .rear-items { grid-template-columns: repeat(min(2, var(--rear-cols, 3)), minmax(0, 1fr)); }
	.rear-layout-carousel .rear-card { flex-basis: 70%; }
}
@media (max-width: 600px) {
	.rear-layout-grid .rear-items { grid-template-columns: 1fr; }
	.rear-layout-carousel .rear-card { flex-basis: 88%; }
}

/* Card */
.rear-card { background: var(--rear-card-bg); border-radius: var(--rear-radius); padding: 16px 16px 14px; display: flex; flex-direction: column; }
.rear-card-head { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-bottom: 8px; }
.rear-rating { display: inline-flex; align-items: center; gap: 8px; }
.rear-rating-num { font-size: .95rem; }
.rear-verified { display: inline-flex; align-items: center; gap: 5px; font-size: .8rem; color: var(--rear-text); white-space: nowrap; }
.rear-verified svg { color: #3c3c43; }
.rear-role { margin: 0; font-size: .92rem; }
.rear-role strong { font-weight: 600; }
.rear-date { display: block; color: var(--rear-muted); font-size: .8rem; margin: 2px 0 14px; }
.rear-text { flex: 1; font-size: .95rem; line-height: 1.65; }
.rear-text p { margin: 0 0 .6em; }
.rear-text p:last-child { margin-bottom: 0; }
.rear-text:has(.rear-more[open]) .rear-excerpt { display: none; }
.rear-more summary { cursor: pointer; color: var(--rear-link); font-weight: 500; font-size: .92rem; margin-top: 4px; list-style: none; display: inline-flex; align-items: center; gap: 6px; }
.rear-more summary::-webkit-details-marker { display: none; }
.rear-more summary::after { content: ""; width: 7px; height: 7px; border: solid currentColor; border-width: 0 1.5px 1.5px 0; transform: rotate(45deg) translateY(-3px); }
.rear-more[open] summary { display: none; }
.rear-agent { display: flex; align-items: center; gap: 10px; margin-top: 14px; font-size: .92rem; }
.rear-avatar {
	width: 26px; height: 26px; border-radius: 50%; background: #3c3c43; color: #fff;
	display: inline-flex; align-items: center; justify-content: center; font-size: .66rem; font-weight: 600; letter-spacing: .3px;
}

/* Load more */
.rear-card[hidden] { display: none !important; }
.rear-more-wrap { text-align: center; margin-top: 16px; }
.rear-load-more {
	background: #fff; color: var(--rear-text); border: 1px solid var(--rear-text); border-radius: 6px;
	padding: 10px 22px; font: inherit; font-weight: 600; font-size: .95rem; cursor: pointer;
}
.rear-load-more:hover { background: var(--rear-card-bg); }
.rear-load-count { font-weight: 400; color: var(--rear-muted); }
.rear-layout-carousel .rear-more-wrap { display: none; }
.rear-layout-carousel .rear-card[hidden] { display: flex !important; }

/* Stars (supports fractions) */
.rear-stars { position: relative; display: inline-block; font-size: 1.1rem; line-height: 1; letter-spacing: 1px; }
.rear-stars::before { content: "★★★★★"; color: var(--rear-star-empty); }
.rear-stars-fill { position: absolute; inset: 0 auto 0 0; overflow: hidden; white-space: nowrap; }
.rear-stars-fill::before { content: "★★★★★"; color: var(--rear-star); }

.rear-link { margin-top: 16px; }
.rear-link a { color: var(--rear-link); font-weight: 500; }
.rear-empty { font-style: italic; color: #888; }