/* Customer supplied review media. Videos remain idle until a visitor presses play. */
.customer-review { min-width: 0; }
.customer-review .cr__player { position: relative; width: 345px; height: 455px; overflow: hidden; background: #151515; }
.customer-review .cr__player::before { content:""; position:absolute; inset:-24px; z-index:0; background:var(--cr-poster) center / cover no-repeat; filter:blur(18px); transform:scale(1.08); opacity:.62; }
.customer-review .cr__media { position:relative; z-index:1; display: block; width: 100%; height: 100%; border: 0; background: transparent; object-fit: contain; object-position: center; }
.customer-review .cr__play { z-index: 2; display: grid; place-items: center; padding: 0; border: 0; background: transparent; cursor: pointer; }
.customer-review .cr__play > img { display: block; width: 90px; height: 90px; }
.customer-review .cr__player.is-playing .cr__play { display: none; }
.customer-review .cr__media--photo { position: relative; width:345px; height:455px; }
.customer-review .cr__media--photo > img { position: static; display: block; width: 100%; height: 100%; object-fit: cover; }
.customer-review .review__cap { gap: 9px; }
.customer-review .review__name { line-height: 1.08; white-space: normal; }
.customer-review .review__city { width: auto; }
.customer-reviews__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.customer-reviews__grid .cr__player, .customer-reviews__grid .cr__media { width: 100%; }
.customer-reviews__grid .cr__media--photo { height:455px; }
.dz-review-lightbox[hidden] { display:none; }
.dz-review-lightbox {
  position:fixed; z-index:5000; inset:0; display:grid; place-items:center;
  padding:28px; background:rgba(0,0,0,.76); cursor:zoom-out;
}
.dz-review-lightbox > img {
  display:block; max-width:min(960px, calc(100vw - 56px)); max-height:calc(100vh - 56px);
  border-radius:20px; object-fit:contain; box-shadow:0 20px 70px rgba(0,0,0,.42); cursor:default;
}
.dz-review-lightbox__close {
  position:absolute; z-index:1; top:18px; right:18px; display:grid; width:44px; height:44px;
  place-items:center; border:0; border-radius:50%; background:#fff; color:#1d1d1d; cursor:pointer;
  font:400 34px/1 Arial, sans-serif;
}
body.dz-review-lightbox-open { overflow:hidden; }
@media (max-width:1169px) { .customer-reviews__grid { grid-template-columns:repeat(3,minmax(0,1fr)); } .customer-reviews__grid .cr__player, .customer-reviews__grid .cr__media--photo { height:clamp(300px,43vw,455px); } }
@media (max-width:767px) {
  .customer-review .cr__player, .customer-review .cr__media--photo { width:280px; height:370px; }
  .customer-reviews__grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px 16px; }
  .customer-reviews__grid .cr__player, .customer-reviews__grid .cr__media--photo { width:100%; height:min(58vw,370px); }
  .customer-review .review__name { font-size:17px; }
  .customer-review .review__city { font-size:15px; }

  /* Home and About use a horizontal review strip.  A flex item was allowed
     to shrink while its image stayed 280px wide, causing overlapping cards.
     Keep card and media as one non-shrinking unit. */
  .customer-reviews__home,
  .customer-reviews__about {
    flex-wrap:nowrap;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
  }
  .customer-reviews__home > .customer-review,
  .customer-reviews__about > .customer-review {
    flex:0 0 280px;
    width:280px;
    scroll-snap-align:start;
  }

  /* The source play coordinates were designed for a 345×455 card.  Mobile
     cards are smaller, so centre the control from the actual player size. */
  .customer-review .review__play,
  .customer-review .cr__play {
    left:50%; top:50%; width:64px; height:64px;
    transform:translate(-50%,-50%);
  }
  .customer-review .cr__play > img { width:64px; height:64px; }
  /* The desktop hover rule used scale() alone, which discarded the centring
     translation on touch browsers that keep :hover after a tap. */
  .customer-review .review__video:hover .review__play,
  .customer-review .review__video:focus-within .review__play {
    transform:translate(-50%,-50%) scale(1.05);
  }

  /* Rating cards on the reviews page must never retain desktop fit/zoom.
     Keep all text and the divider within the mobile container. */
  .revs .ratings--row {
    display:grid; grid-template-columns:minmax(0,1fr);
    width:100% !important; max-width:100%; height:auto; gap:12px;
    overflow:hidden;
  }
  .revs .ratings--row > .rating {
    box-sizing:border-box; width:100% !important; max-width:100%; zoom:1 !important;
  }
  .revs .ratings--row .rating__head,
  .revs .ratings--row .rating__row { left:22px; width:calc(100% - 44px); }
  .revs .ratings--row .rating__line { left:0; width:100%; }
}
