/* ============================================================
 * Run Reviews — Single review / post POLISH layer (2026)
 * ------------------------------------------------------------
 * Loaded AFTER css/modern.css (auto-enqueued as "css/single.css").
 * Scope: the SINGLE REVIEW + default POST templates only —
 *   .rr-review  (overview hero, specs, detail blocks, share)
 *   .rr-ftc-disclosure, .rr-related-reviews, .rr-comments
 *
 * Design direction: "modern editorial review authority" — ink-dominant
 * charcoal, brand RED as a sharp precise accent, generous editorial
 * whitespace, soft layered depth, clean data-forward tables.
 *
 * All values pull from the modern.css token system (var(--rr-*)).
 * No fonts or tokens are (re)defined here. No markup or rating/schema
 * elements are touched — this file is presentation only.
 *
 * SEO-SAFE NOTE: The Review JSON-LD emitter (functions.php) reads the
 * `rating_overall` postmeta and the `.runreviews-star-rating` markup.
 * Nothing here removes, hides, or restructures rating elements,
 * headings, or content — it only restyles them.
 *
 * Contents:
 *   1. Review spine — vertical rhythm
 *   2. Overview hero  (.rr-review-overview + .rr-cta-affiliate)
 *   3. FTC disclosure band
 *   4. Specs table    (.rr-specs / .rr-specs-table)
 *   5. Detail blocks  (.rr-review-detail*) + pros/cons affordances
 *   6. Share strip    (.rr-share)
 *   7. Related-reviews sidebar module
 *   8. Comments       (.rr-comments / form)
 *   9. Prose measure
 *  10. Responsive
 * ============================================================ */

/* ---------- 1. Review spine — generous editorial rhythm ---------- */
.rr-review {
  gap: clamp(var(--rr-space-6), 4vw, var(--rr-space-8));
  padding-block: var(--rr-space-4) 0;
}

/* ============================================================
 * 2. OVERVIEW HERO — confident review header
 * ============================================================ */
.rr-review-overview {
  position: relative;
  padding: clamp(var(--rr-space-5), 3vw, var(--rr-space-7));
  background:
    linear-gradient(180deg, var(--rr-bg) 0%, var(--rr-ink-50) 100%);
  border: 1px solid var(--rr-ink-200);
  border-radius: var(--rr-radius-lg);
  box-shadow: var(--rr-shadow-card);
}
@media (min-width: 900px) {
  .rr-review-overview {
    grid-template-columns: minmax(0, 440px) 1fr;
    gap: clamp(var(--rr-space-6), 4vw, var(--rr-space-8));
    align-items: center;
  }
}

/* Product image: clean white plate with soft inner depth so the
 * cut-out product photography reads as premium, not floating. */
.rr-review-overview__media {
  background: var(--rr-bg);
  border: 1px solid var(--rr-ink-200);
  border-radius: var(--rr-radius-md);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .8),
    0 1px 2px rgba(21, 23, 28, .04),
    0 12px 30px -16px rgba(21, 23, 28, .22);
  padding: clamp(var(--rr-space-3), 2vw, var(--rr-space-5));
  aspect-ratio: 4 / 3;
  transition: box-shadow .25s var(--rr-ease-out), transform .25s var(--rr-ease-out);
}
.rr-review-overview__media:hover {
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .8),
    0 2px 6px rgba(21, 23, 28, .06),
    0 22px 44px -16px rgba(21, 23, 28, .28);
}
.rr-review-overview__media img,
.rr-review-overview__image {
  /* keep object-fit:contain from main.css; just guard intrinsic sizing */
  filter: drop-shadow(0 8px 14px rgba(21, 23, 28, .10));
}

.rr-review-overview__copy {
  gap: clamp(var(--rr-space-3), 2vw, var(--rr-space-4));
  /* main.css left-margins exist on title/heading "for breathing room
   * from input field" — neutralize so copy aligns to the hero edge. */
}

/* Header stacks title over rating for a clean masthead read. */
.rr-review-overview__header {
  gap: var(--rr-space-3);
}
@media (min-width: 600px) {
  .rr-review-overview__header {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--rr-space-3);
  }
}

.rr-review-overview__title {
  font-family: var(--rr-font-display);
  font-weight: 600;
  letter-spacing: -0.025em;
  line-height: 1.08;
  font-size: clamp(1.85rem, 1.35rem + 1.9vw, 2.75rem);
  color: var(--rr-ink-900);
  margin: 0;
  text-wrap: balance;
}

/* Rating: lift the stars onto a soft pill chip so the score reads as a
 * deliberate "verdict" badge. Targets the WRAPPER only — the inner
 * .runreviews-star-rating / .rr-star* spans are left untouched. */
.rr-review-overview__rating {
  display: inline-flex;
  align-items: center;
  gap: var(--rr-space-2);
  padding: 0.4rem 0.8rem 0.4rem 0.7rem;
  background: var(--rr-bg);
  border: 1px solid var(--rr-ink-200);
  border-radius: var(--rr-radius-pill);
  box-shadow: var(--rr-shadow-card);
  font-size: 1.15rem;
  line-height: 1;
}

/* Overview heading: small editorial eyebrow-style label above the body. */
.rr-review-overview__heading {
  font-family: var(--rr-font-sans);
  font-weight: 700;
  font-size: 0.8rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--rr-ink-500);
  margin: var(--rr-space-2) 0 calc(-1 * var(--rr-space-1));
}

.rr-review-overview__body {
  color: var(--rr-ink-600);
  font-size: 1.0625rem;
  line-height: 1.7;
  max-width: var(--rr-measure);
}
.rr-review-overview__body p:last-child { margin-bottom: 0; }

/* ---------- Affiliate CTA — confident brand-red pill ---------- *
 * E: FORCE brand red. main.css consumes an inline --rr-cta-color set
 * from termmeta/postmeta (button_color). We intentionally re-fill with
 * var(--rr-red) so an off-brand author colour can never ship. The inline
 * custom property stays in the DOM but is no longer painted.            */
.rr-cta-affiliate {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.6rem;
  align-self: flex-start;
  margin-top: var(--rr-space-2);
  padding: 0.95rem 1.75rem;
  background: var(--rr-red);
  color: #fff;
  font-family: var(--rr-font-sans);
  font-weight: 700;
  font-size: 1rem;
  letter-spacing: 0.03em;
  text-transform: uppercase; /* G4: uppercase merchant CTAs */
  border: 0;
  border-radius: var(--rr-radius-pill);
  box-shadow:
    0 1px 2px rgba(154, 31, 26, .25),
    0 12px 24px -10px rgba(224, 50, 43, .55);
}
/* Trailing arrow affordance — pure CSS, no markup change. */
.rr-cta-affiliate::after {
  content: "→";
  font-size: 1.05em;
  line-height: 1;
  transition: transform .2s var(--rr-ease-out);
}
.rr-cta-affiliate:hover,
.rr-cta-affiliate:focus-visible {
  background: var(--rr-red-dark);
  color: #fff;
  transform: translateY(-2px);
  box-shadow:
    0 2px 4px rgba(154, 31, 26, .3),
    0 20px 36px -12px rgba(224, 50, 43, .6);
  filter: none;
}
.rr-cta-affiliate:hover::after,
.rr-cta-affiliate:focus-visible::after { transform: translateX(3px); }
.rr-cta-affiliate:focus-visible {
  outline: 2px solid var(--rr-red);
  outline-offset: 3px;
}

/* ============================================================
 * 3. FTC DISCLOSURE — quiet inline note (de-emphasized 2026)
 * ------------------------------------------------------------
 * Toned down from a red alert band to a subtle muted line so it stops competing
 * with the red CTA directly below it.
 * COMPLIANCE — read before changing: the disclosure is rendered directly ABOVE
 * the affiliate CTA (single-review-overview.php) and stays legible (muted but
 * AA-contrast, ~0.8rem). That placement-above-the-link + legibility IS the FTC
 * "clear and conspicuous" requirement — visual loudness is not. Keep it above
 * the link; do NOT move it below the CTA, hide it behind a click, or relegate it
 * to a footer.
 * ============================================================ */
.rr-ftc-disclosure {
  align-items: flex-start;
  gap: var(--rr-space-2);
  margin: var(--rr-space-4) 0 var(--rr-space-3); /* groups with the CTA below, separated from body above */
  padding: 0;
  background: none; /* drop the red-50 band */
  border: 0;        /* drop the red border + left rule */
  border-radius: 0;
}
.rr-ftc-disclosure__icon { margin-top: 0.15em; color: var(--rr-ink-400); } /* muted info glyph, was red */
.rr-ftc-disclosure__copy {
  font-size: 0.8rem;
  line-height: 1.55;
  color: var(--rr-ink-500);      /* muted, still AA on the card */
  max-width: var(--rr-measure);
}
.rr-ftc-disclosure__copy strong { color: var(--rr-ink-600); font-weight: 600; } /* gentle "Disclosure:" flag, not loud */

/* ---------- Repeat affiliate CTA — second buy prompt for scrollers ---------- *
 * David asked for a buy button "down below as well". Rendered after the detail
 * blocks (template-parts/single-review-cta.php) as a centered band so a reader
 * who scrolled past the hero still has a one-tap path to price. FTC disclosure
 * is repeated inside, above the button, per the compliance rule above.        */
.rr-review-cta-repeat {
  margin: var(--rr-space-7) 0 var(--rr-space-5);
  padding: clamp(1.5rem, 1rem + 2vw, 2.25rem);
  background: var(--rr-ink-50);
  border: 1px solid var(--rr-ink-200);
  border-radius: var(--rr-radius-lg);
  text-align: center;
}
.rr-review-cta-repeat__lead {
  margin: 0 0 var(--rr-space-3);
  font-family: var(--rr-font-display);
  font-weight: 700;
  font-size: clamp(1.2rem, 1.05rem + 0.6vw, 1.5rem);
  line-height: 1.25;
  color: var(--rr-ink-900);
}
/* Center the disclosure block within the band; keep its copy left-read. */
.rr-review-cta-repeat .rr-ftc-disclosure {
  justify-content: center;
  margin-inline: auto;
  max-width: 64ch;
}
.rr-review-cta-repeat .rr-ftc-disclosure__copy { max-width: none; text-align: left; }
.rr-review-cta-repeat .rr-cta-affiliate { align-self: center; margin-top: var(--rr-space-2); }

/* ============================================================
 * 4. SPECS TABLE — premium, data-forward
 * (modern.css already lightened the header; refine spacing/type/zebra)
 * ============================================================ */
.rr-specs__heading {
  font-size: clamp(1.4rem, 1.2rem + 0.8vw, 1.85rem);
  margin-left: 0;
}

.rr-specs-table {
  border: 1px solid var(--rr-ink-200);
  border-radius: var(--rr-radius-md);
  box-shadow: var(--rr-shadow-card);
  font-size: 0.975rem;
  /* main.css uses border-collapse:collapse; switch to separate so the
   * rounded corners + soft shadow read cleanly. */
  border-collapse: separate;
  border-spacing: 0;
  overflow: hidden;
}
.rr-specs-table thead th {
  padding: 0.85rem 1.15rem;
  background: var(--rr-ink-50);
  color: var(--rr-ink-700);
  font-family: var(--rr-font-sans);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  border-bottom: 1px solid var(--rr-ink-200);
}
.rr-specs-table tbody th,
.rr-specs-table tbody td {
  padding: 0.8rem 1.15rem;
  border-bottom: 1px solid var(--rr-ink-100);
  vertical-align: top;
  line-height: 1.5;
}
.rr-specs-table tbody th {
  width: 38%;
  color: var(--rr-ink-900);
  font-family: var(--rr-font-sans);
  font-weight: 600;
  background: transparent;
}
.rr-specs-table tbody td { color: var(--rr-ink-600); background: transparent; }
/* Zebra: only the row-label cell + value cell of even rows tint, soft. */
.rr-specs-table tbody tr:nth-child(even) th,
.rr-specs-table tbody tr:nth-child(even) td { background: var(--rr-ink-50); }
.rr-specs-table tbody tr:hover th,
.rr-specs-table tbody tr:hover td { background: var(--rr-red-50); }
.rr-specs-table tbody tr:last-child th,
.rr-specs-table tbody tr:last-child td { border-bottom: 0; }

/* ============================================================
 * 5. DETAIL BLOCKS — scannable modern editorial
 * (Best Features / Pros / Drawbacks / Conclusions)
 * ============================================================ */
.rr-review-detail { gap: clamp(var(--rr-space-6), 4vw, var(--rr-space-8)); }
.rr-review-detail__group { gap: var(--rr-space-5); }

.rr-review-detail__heading {
  font-size: clamp(1.4rem, 1.15rem + 0.9vw, 1.9rem);
  margin-left: 0;
}

/* Block: soft layered card with a precise red accent rail (replaces the
 * dated flat 3px left-border). Depth + rounding on all corners. */
.rr-review-detail__block {
  position: relative;
  gap: var(--rr-space-2);
  padding: var(--rr-space-4) var(--rr-space-5);
  background: var(--rr-bg);
  border: 1px solid var(--rr-ink-200);
  border-left: 0;
  border-radius: var(--rr-radius-md);
  box-shadow: var(--rr-shadow-card);
  overflow: hidden;
  transition:
    transform .2s var(--rr-ease-out),
    box-shadow .2s var(--rr-ease-out),
    border-color .2s var(--rr-ease-out);
}
.rr-review-detail__block::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 3px;
  background: var(--rr-ink-200);
  transition: background .2s var(--rr-ease-out);
}
.rr-review-detail__block:hover {
  transform: translateY(-2px);
  background: var(--rr-bg);
  box-shadow: var(--rr-shadow-card-hover);
  border-color: var(--rr-ink-300);
}
.rr-review-detail__block:hover::before { background: var(--rr-red); }

.rr-review-detail__subheading {
  font-family: var(--rr-font-display);
  font-weight: 600;
  letter-spacing: -0.01em;
  font-size: 1.2rem;
  color: var(--rr-ink-900);
  margin: 0;
}

.rr-review-detail__body {
  color: var(--rr-ink-600);
  line-height: 1.72;
  max-width: var(--rr-measure);
}
.rr-review-detail__body p:last-child { margin-bottom: 0; }

/* In-prose lists inside detail bodies: tasteful red custom markers so
 * any genuinely list-structured pros/cons read as scannable points.
 * (Most review bodies are prose paragraphs; this only fires when an
 * author used an actual <ul>.) */
.rr-review-detail__body ul {
  list-style: none;
  margin: var(--rr-space-2) 0;
  padding: 0;
  display: grid;
  gap: var(--rr-space-2);
}
.rr-review-detail__body ul li {
  position: relative;
  padding-left: 1.75rem;
}
.rr-review-detail__body ul li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.5em;
  width: 0.7rem;
  height: 0.7rem;
  border-radius: 3px;
  background: var(--rr-red);
  box-shadow: 0 0 0 4px var(--rr-red-50);
}

/* ---- High-confidence pros/cons heading affordances ----
 * PHP (single-review-detail.php) stamps data-rr-kind="pros|cons|
 * conclusion|features" on the GROUP ONLY for whole-word, unambiguous
 * heading matches. The check/x markers sit on the heading (accurate)
 * and recolor only that group's list bullets — never mislabelling prose.
 * No data-rr-kind => the neutral treatment above applies (graceful). */
.rr-review-detail__group[data-rr-kind] .rr-review-detail__heading {
  display: flex;
  align-items: center;
  gap: var(--rr-space-3);
}
.rr-review-detail__group[data-rr-kind] .rr-review-detail__heading::before {
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.85rem;
  height: 1.85rem;
  border-radius: 50%;
  font-family: var(--rr-font-sans);
  font-size: 1.05rem;
  font-weight: 800;
  line-height: 1;
}
/* Pros — affirmative green check */
.rr-review-detail__group[data-rr-kind="pros"] .rr-review-detail__heading::before {
  content: "✓";
  color: #1f7a4d;
  background: #e7f6ee;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, #1f7a4d 22%, transparent);
}
.rr-review-detail__group[data-rr-kind="pros"] .rr-review-detail__body ul li::before {
  background: #1f7a4d;
  box-shadow: 0 0 0 4px #e7f6ee;
}
/* Cons / drawbacks — brand-red caution mark (on-brand, not literal X-clutter) */
.rr-review-detail__group[data-rr-kind="cons"] .rr-review-detail__heading::before {
  content: "–";
  color: var(--rr-red-dark);
  background: var(--rr-red-50);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--rr-red) 24%, transparent);
}
/* Conclusion — editorial flag accent */
.rr-review-detail__group[data-rr-kind="conclusion"] .rr-review-detail__heading::before {
  content: "★";
  font-size: 0.9rem;
  color: var(--rr-red);
  background: var(--rr-red-50);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--rr-red) 24%, transparent);
}

/* ============================================================
 * 6. SHARE STRIP — refined, quieter chrome
 * ============================================================ */
.rr-share {
  gap: var(--rr-space-3);
  margin-top: var(--rr-space-6);
  padding: var(--rr-space-4) 0;
  border-top: 1px solid var(--rr-ink-200);
  border-bottom: 1px solid var(--rr-ink-200);
}
.rr-share::before {
  font-family: var(--rr-font-sans);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--rr-ink-500);
  margin-right: var(--rr-space-1);
}
.rr-share__link {
  width: 42px;
  height: 42px;
  background: var(--rr-bg);
  color: var(--rr-ink-700);
  border: 1px solid var(--rr-ink-200);
  border-radius: var(--rr-radius-pill);
  box-shadow: var(--rr-shadow-card);
}
.rr-share__link:hover,
.rr-share__link:focus-visible {
  background: var(--rr-red);
  color: #fff;
  border-color: var(--rr-red);
  transform: translateY(-2px);
  box-shadow:
    0 2px 4px rgba(154, 31, 26, .25),
    0 14px 24px -10px rgba(224, 50, 43, .5);
}
.rr-share__link:focus-visible {
  outline: 2px solid var(--rr-red);
  outline-offset: 2px;
}

/* ============================================================
 * 7. RELATED-REVIEWS SIDEBAR MODULE
 * (inherits .widget card from modern.css; refine the list cards)
 * ============================================================ */
.rr-related-reviews__list {
  margin-left: 0;
  gap: var(--rr-space-2);
}
.rr-related-reviews__item .rr-card {
  align-items: center;
  border: 1px solid var(--rr-ink-200);
  border-radius: var(--rr-radius-md);
  background: var(--rr-bg);
  overflow: hidden;
  transition:
    border-color .18s var(--rr-ease-out),
    box-shadow .18s var(--rr-ease-out),
    transform .18s var(--rr-ease-out);
}
.rr-related-reviews__item .rr-card:hover {
  border-color: var(--rr-ink-300);
  box-shadow: var(--rr-shadow-card);
  transform: translateY(-1px);
}
.rr-related-reviews__item .rr-card__media {
  flex: 0 0 76px;
  align-self: stretch;
  background: var(--rr-ink-50);
  border-right: 1px solid var(--rr-ink-100);
}
.rr-related-reviews__item .rr-card__media img { padding: 0.4rem; }
.rr-related-reviews__item .rr-card__title {
  padding: var(--rr-space-2) var(--rr-space-3);
  font-family: var(--rr-font-sans);
  font-weight: 600;
  font-size: 0.875rem;
  line-height: 1.35;
  color: var(--rr-ink-900);
}
.rr-related-reviews__item .rr-card:hover .rr-card__title { color: var(--rr-red-dark); }

/* ============================================================
 * 8. COMMENTS — editorial "reader letters"
 * (modern.css styles base; refine headings/cards/form to single-page polish)
 * ============================================================ */
.rr-comments {
  margin-top: clamp(var(--rr-space-7), 5vw, var(--rr-space-9));
  padding-top: var(--rr-space-7);
  border-top: 1px solid var(--rr-ink-200);
}
.rr-comments__heading {
  font-family: var(--rr-font-display);
  font-weight: 600;
  letter-spacing: -0.02em;
  text-transform: none;
  border-bottom: 1px solid var(--rr-ink-200);
  padding-bottom: var(--rr-space-3);
  position: relative;
}
.rr-comments__heading::after {
  content: "";
  position: absolute;
  left: 0; bottom: -1px;
  width: 2.5rem; height: 3px;
  background: var(--rr-red);
  border-radius: var(--rr-radius-pill);
}
.rr-comments__count { font-weight: 600; color: var(--rr-ink-900); }
.rr-comments__post { color: var(--rr-ink-900); }

.rr-comment .children { border-left-color: var(--rr-ink-200); }
.rr-comment-list > .rr-comment { border-top-color: var(--rr-ink-200); }
.rr-comment__author { font-family: var(--rr-font-sans); font-weight: 600; }
.rr-comment__avatar-img,
.rr-comment__avatar img { box-shadow: 0 0 0 1px var(--rr-ink-200); }
.rr-comment__body { color: var(--rr-ink-600); }
.rr-comment__body blockquote {
  border-left-color: var(--rr-red);
  background: var(--rr-ink-50);
  border-radius: 0 var(--rr-radius-sm) var(--rr-radius-sm) 0;
}

/* Comment form — modern card matching the review surfaces. */
.rr-comment-form {
  background: var(--rr-ink-50);
  border: 1px solid var(--rr-ink-200);
  border-radius: var(--rr-radius-lg);
  box-shadow: var(--rr-shadow-card);
}
.rr-comment-form__title {
  font-family: var(--rr-font-display);
  font-weight: 600;
  letter-spacing: -0.01em;
}
.rr-comment-form__field label {
  font-family: var(--rr-font-sans);
  font-size: 0.72rem;
  letter-spacing: 0.1em;
  color: var(--rr-ink-700);
}
.rr-comment-form__form input[type="text"],
.rr-comment-form__form input[type="email"],
.rr-comment-form__form input[type="url"],
.rr-comment-form__form textarea {
  border-color: var(--rr-ink-200);
  border-radius: var(--rr-radius-sm);
  background: var(--rr-bg);
}
.rr-comment-form__form input[type="text"]:focus,
.rr-comment-form__form input[type="email"]:focus,
.rr-comment-form__form input[type="url"]:focus,
.rr-comment-form__form textarea:focus {
  border-color: var(--rr-red);
  box-shadow: 0 0 0 3px var(--rr-red-50);
}
/* Submit button → brand-red pill, consistent with the affiliate CTA family. */
.rr-comment-form__submit {
  background: var(--rr-red);
  color: #fff;
  border: 0;
  border-radius: var(--rr-radius-pill);
  font-family: var(--rr-font-sans);
  font-weight: 700;
  padding: 0.8rem 1.75rem;
  box-shadow: 0 10px 20px -10px rgba(224, 50, 43, .5);
}
.rr-comment-form__submit:hover,
.rr-comment-form__submit:focus-visible {
  background: var(--rr-red-dark);
  transform: translateY(-1px);
  box-shadow: 0 16px 28px -12px rgba(224, 50, 43, .55);
}

/* Comment pagination active page → brand red (token-aligned). */
.rr-comments__pagination .page-numbers {
  border-color: var(--rr-ink-200);
  border-radius: var(--rr-radius-sm);
}
.rr-comments__pagination .page-numbers.current {
  background: var(--rr-red);
  border-color: var(--rr-red);
}

/* ============================================================
 * 9. PROSE MEASURE — keep long-form copy readable (Task E)
 * ============================================================ */
.rr-review .rr-review-overview__body,
.rr-review .rr-review-detail__body,
.rr-comment__body,
.rr-comment-form__intro { max-width: var(--rr-measure); }

/* ============================================================
 * 10. RESPONSIVE
 * ============================================================ */
@media (max-width: 899px) {
  .rr-review-overview__media {
    max-width: 460px;
    width: 100%;
    margin-inline: auto;
  }
}
@media (max-width: 599px) {
  .rr-review-overview { padding: var(--rr-space-4); }
  .rr-cta-affiliate {
    display: flex;
    width: 100%;
    align-self: stretch;
  }
  .rr-review-detail__block { padding: var(--rr-space-4); }
  /* Stacked specs: turn each row into a label/value pair card-style. */
  .rr-specs-table { font-size: 0.92rem; }
  .rr-specs-table tbody th { width: 46%; }
  .rr-share { gap: var(--rr-space-2); }
  .rr-share__link { width: 40px; height: 40px; }
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  .rr-review-overview__media,
  .rr-cta-affiliate,
  .rr-cta-affiliate::after,
  .rr-review-detail__block,
  .rr-review-detail__block::before,
  .rr-share__link,
  .rr-related-reviews__item .rr-card,
  .rr-comment-form__submit {
    transition: none;
  }
  .rr-review-overview__media:hover,
  .rr-cta-affiliate:hover,
  .rr-review-detail__block:hover,
  .rr-share__link:hover,
  .rr-related-reviews__item .rr-card:hover,
  .rr-comment-form__submit:hover { transform: none; }
}