/* Boorman Lawyers – "What Clients Say" reviews marquee (DRAFT FOR JOSHUA'S APPROVAL)
   Scoped to .bl-rm. Brand: --red #C8102E, Barlow Condensed headings / Arial body. */
.bl-rm{--rm-accent:#C8102E;--rm-line:#e3e3e3;--rm-bg:#fff;--rm-text:#222;--rm-muted:#6b6b6b;--rm-card-w:340px;--rm-speed:60s;--rm-per-card:3.201s;
  background:var(--rm-bg);color:var(--rm-text);padding:56px 0 64px;contain:layout paint}
.bl-rm,.bl-rm *{box-sizing:border-box}
.bl-rm{-webkit-text-size-adjust:100%;text-size-adjust:100%}
.bl-rm__head{display:flex;justify-content:space-between;align-items:baseline;gap:16px;max-width:1200px;margin:0 auto 22px;padding:0 20px}
.bl-rm__label{font:700 14px/1 "Barlow Condensed","Arial Narrow",Arial,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--rm-accent);margin:0}
.bl-rm__all{font:600 14px Arial,Helvetica,sans-serif;color:var(--rm-text);text-decoration:none;white-space:nowrap}
.bl-rm__all:hover,.bl-rm__all:focus-visible{color:var(--rm-accent);text-decoration:underline}
.bl-rm__rows{border-top:1px solid var(--rm-line)}
.bl-rm__row{overflow:hidden;border-bottom:1px solid var(--rm-line);
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.bl-rm__track{display:flex;width:max-content;list-style:none;margin:0;padding:0;animation:bl-rm-l var(--rm-speed) linear infinite}
/* 22 Oct 2026: uniform speed everywhere = cards-per-loop x per-card time (30% slower than old compact 70s/67 cards) */
.bl-rm__track[style*="--rm-n"]{animation-duration:calc(var(--rm-n) * var(--rm-per-card))}
.bl-rm__row--r .bl-rm__track{animation-name:bl-rm-r}
.bl-rm__row:hover .bl-rm__track,.bl-rm__row:focus-within .bl-rm__track{animation-play-state:paused}
@keyframes bl-rm-l{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}
@keyframes bl-rm-r{from{transform:translate3d(-50%,0,0)}to{transform:translate3d(0,0,0)}}
.bl-rm__item{flex:0 0 var(--rm-card-w);border-right:1px solid var(--rm-line)}
.bl-rm__card{display:flex;flex-direction:column;gap:10px;height:100%;min-height:168px;padding:22px 24px;color:inherit;text-decoration:none;transition:background .2s}
.bl-rm__card:hover{background:#fafafa}
.bl-rm__card:focus-visible{outline:2px solid var(--rm-accent);outline-offset:-4px}
.bl-rm__meta{display:flex;white-space:nowrap;overflow:hidden;align-items:center;gap:8px;font:12px Arial,sans-serif;color:var(--rm-muted)}
.bl-rm__src{display:inline-flex;align-items:center;gap:5px}
.bl-rm__src svg{width:14px;height:14px;flex:none}
.bl-rm__stars{color:#E8A317;letter-spacing:1px;font-size:13px;margin-left:auto}
.bl-rm__quote{margin:0;font:15px/1.55 Arial,Helvetica,sans-serif;color:var(--rm-text);
  display:-webkit-box;-webkit-line-clamp:3;line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;height:calc(1.55em*3)}
.bl-rm__name{display:block;margin-top:auto;font:700 15px "Barlow Condensed","Arial Narrow",Arial,sans-serif;letter-spacing:.03em;color:var(--rm-accent)}
.bl-rm__rec{color:#1877F2;font:700 11px Arial;letter-spacing:.04em;text-transform:uppercase}
.bl-rm__sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.bl-rm__example{display:inline-block;margin-left:10px;background:#ffe9a8;color:#5a4300;font:700 11px Arial;padding:2px 6px;letter-spacing:.05em}
@media (max-width:640px){.bl-rm{--rm-card-w:270px;--rm-speed:45s;padding:40px 0 48px}.bl-rm__quote{font-size:14px}}
@media (prefers-reduced-motion:reduce){
  .bl-rm__track{animation:none;transform:none}
  .bl-rm__row{overflow-x:auto;scroll-snap-type:x mandatory;-webkit-mask-image:none;mask-image:none}
  .bl-rm__item{scroll-snap-align:start}
  .bl-rm__item[aria-hidden="true"]{display:none}}
/* ---- Single-row / compact variant (.bl-rm--compact) – content drafts (court + law pages), 20 Oct 2026 ----
   Same markup/behaviour as the full version (pure CSS, pause on hover/focus, reduced-motion fallback,
   duplicates aria-hidden) but one row, smaller cards and less padding. */
.bl-rm--compact{--rm-card-w:300px;--rm-speed:70s;padding:32px 0 36px;background:#fafafa;border-top:1px solid var(--rm-line)}
.bl-rm--compact .bl-rm__head{margin-bottom:14px}
.bl-rm--compact .bl-rm__label{font-size:13px}
.bl-rm--compact .bl-rm__card{min-height:132px;padding:16px 18px;gap:8px}
.bl-rm--compact .bl-rm__card:hover{background:#fff}
.bl-rm--compact .bl-rm__quote{font-size:14px;-webkit-line-clamp:2;line-clamp:2;height:calc(1.55em*2)}
.bl-rm--compact .bl-rm__name{font-size:14px}
@media (max-width:640px){.bl-rm--compact{--rm-card-w:250px;--rm-speed:55s;padding:24px 0 28px}}
/* ---- Two-row Google/Facebook variant (.bl-rm--two), 22 Oct 2026 ---- */
.bl-rm__links{display:flex;gap:18px}
.bl-rm{max-width:100vw;overflow:hidden}
@media (max-width:640px){.bl-rm__head{flex-wrap:wrap}}

/* ---- 22 Oct 2026 iOS/WebKit fix (STAGING): per-card animation, no wide moving track ----
   Old: one max-content track of 2 x N cards (34,000+ px) animated by -50%. WebKit sized that track wrongly and
   could not reliably paint the huge layer, so rows went blank/erratic on iPhone. Now each card (one card wide)
   is absolutely positioned and animated on its own; keyframes + literal durations come from gen_two.py inline. */
.bl-rm__row{position:relative;-webkit-mask-image:none;mask-image:none}
.bl-rm__row::before,.bl-rm__row::after{content:"";position:absolute;top:0;bottom:0;width:6%;z-index:2;pointer-events:none}
.bl-rm__row::before{left:0;background:linear-gradient(90deg,var(--rm-fade,#fff),rgba(255,255,255,0))}
.bl-rm__row::after{right:0;background:linear-gradient(270deg,var(--rm-fade,#fff),rgba(255,255,255,0))}
.bl-rm--compact{--rm-fade:#fafafa}
.bl-rm--compact .bl-rm__row::before{background:linear-gradient(90deg,#fafafa,rgba(250,250,250,0))}
.bl-rm--compact .bl-rm__row::after{background:linear-gradient(270deg,#fafafa,rgba(250,250,250,0))}
.bl-rm--two .bl-rm__track{position:relative;display:block;width:auto;height:168px;animation:none!important;transform:none}
.bl-rm--two.bl-rm--compact .bl-rm__track{height:132px}
.bl-rm--two .bl-rm__item{position:absolute;top:0;left:0;width:var(--rm-card-w);height:100%;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.bl-rm--two .bl-rm__row:hover .bl-rm__item,.bl-rm--two .bl-rm__row:focus-within .bl-rm__item{animation-play-state:paused}
@media (prefers-reduced-motion:reduce){
  .bl-rm--two .bl-rm__row{overflow-x:auto}.bl-rm__row::before,.bl-rm__row::after{display:none}
  .bl-rm--two .bl-rm__track{display:flex;width:max-content;height:auto}
  .bl-rm--two .bl-rm__item{position:relative;flex:0 0 var(--rm-card-w);transform:none}}
