/* Reviews page styles */
.hero { display: grid; gap: var(--space-20); grid-template-columns: 1fr; overflow: hidden; }
.hero-media img { border-radius: var(--radius-lg); width: 100%; height: auto; object-fit: cover; }
.hero-content { display: grid; gap: var(--space-12); }
.filter-bar { display: grid; gap: var(--space-12); grid-template-columns: 1fr minmax(180px, 240px) max-content; align-items: center; }
.filter-bar .result-count { color: var(--gray-600); font-size: var(--text-sm); }
@media (max-width: 720px) {
  .filter-bar { grid-template-columns: 1fr; }
  .filter-bar .result-count { order: 3; }
}

/* Rating stars */
.rating { --rating: 0; --star-size: 1rem; --star-color: var(--gray-300); --star-fill: #f59e0b; position: relative; display: inline-block; font-size: var(--star-size); line-height: 1; }
.rating::before { content: "★★★★★"; letter-spacing: 2px; color: var(--star-color); }
.rating::after { content: "★★★★★"; letter-spacing: 2px; color: var(--star-fill); position: absolute; top: 0; left: 0; width: calc(var(--rating) / 5 * 100%); overflow: hidden; white-space: nowrap; }

/* Reviews grid */
.reviews-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-20); }
@media (max-width: 1000px) { .reviews-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .reviews-grid { grid-template-columns: 1fr; } }
.review-card .review-header { margin-bottom: var(--space-12); display: grid; gap: var(--space-8); }
.review-card .review-title { font-size: var(--h4-size); }
.review-card .review-meta { display: flex; gap: var(--space-12); align-items: center; color: var(--gray-600); font-size: var(--text-sm); }
.review-card .meta { color: var(--gray-600); }
.review-excerpt { color: var(--gray-800); }
.review-details { margin-top: var(--space-12); }
.review-details summary { cursor: pointer; width: fit-content; }
.review-actions { display: flex; justify-content: flex-end; margin-top: var(--space-12); }
.btn-helpful[aria-pressed="true"] { --btn-bg: var(--gray-200); --btn-color: var(--color-text); border-color: var(--gray-300); }

/* Top rated */
.top-rated-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-20); }
@media (max-width: 1000px) { .top-rated-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .top-rated-grid { grid-template-columns: 1fr; } }
.product-highlight img { border-radius: var(--radius-md); box-shadow: var(--shadow-sm); }
.muted { color: var(--gray-600); font-size: var(--text-sm); }

/* Quotes */
.quotes-grid, .experts-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-20); }
@media (max-width: 1000px) { .quotes-grid, .experts-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .quotes-grid, .experts-grid { grid-template-columns: 1fr; } }
blockquote p { font-style: italic; }
blockquote footer { margin-top: var(--space-8); color: var(--gray-600); font-size: var(--text-sm); }

/* Updates list */
.updates-list { display: grid; gap: var(--space-16); }
.updates-list h3 { font-size: var(--h5-size); margin-bottom: var(--space-4); }

/* Comparisons */
.compare-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-20); }
@media (max-width: 900px) { .compare-grid { grid-template-columns: 1fr; } }
.compare-table { display: grid; gap: var(--space-8); }
.compare-table .row { display: grid; grid-template-columns: 1.2fr 1fr 1fr; gap: var(--space-12); padding: var(--space-8) 0; border-bottom: 1px dashed var(--gray-200); }
.compare-table .row.head { font-weight: 700; border-bottom: 1px solid var(--gray-300); }

/* Tips */
.tips-list { display: grid; gap: var(--space-12); }

/* Submit form */
.form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-16); }
.form-field { display: grid; gap: var(--space-8); }
.form-field.full { grid-column: 1 / -1; }
.form-consent { grid-column: 1 / -1; display: flex; gap: var(--space-8); align-items: center; }
.form-actions { grid-column: 1 / -1; display: flex; gap: var(--space-12); align-items: center; }
.form-status { color: var(--color-success); font-weight: 600; }
@media (max-width: 720px) { .form-grid { grid-template-columns: 1fr; } }

/* Minor helpers */
.hero p { color: var(--gray-700); }
section h2 + p { color: var(--gray-700); }
