/* Ratings, customer reviews, the review form, and the homepage testimonials.
   Stars are a mask over a fill whose width is the rating, so a 4.5 is drawn as 4.5 and there is no star font to load. */

.vo .vo-stars{ display:inline-block; flex:0 0 auto; width:5.4em; height:1em; vertical-align:-.12em;
  background:linear-gradient(to right, #9A835A var(--vo-r,0%), rgba(41,37,31,.2) var(--vo-r,0%));
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2.5l2.9 6.1 6.6.8-4.9 4.6 1.3 6.5L12 17.3l-5.9 3.2 1.3-6.5L2.5 9.4l6.6-.8z'/%3E%3C/svg%3E") left center / 1.08em 1em repeat-x;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2.5l2.9 6.1 6.6.8-4.9 4.6 1.3 6.5L12 17.3l-5.9 3.2 1.3-6.5L2.5 9.4l6.6-.8z'/%3E%3C/svg%3E") left center / 1.08em 1em repeat-x; }
html[dir=rtl] .vo .vo-stars{ background:linear-gradient(to left, #9A835A var(--vo-r,0%), rgba(41,37,31,.2) var(--vo-r,0%));
  -webkit-mask-position:right center; mask-position:right center; }
.vo .vo-rating{ display:inline-flex; align-items:center; gap:6px; margin-top:8px; font-size:12.5px; line-height:1.3; color:inherit; text-decoration:none; }
.vo a.vo-rating{ min-height:24px; }
.vo a.vo-rating:hover .vo-rating-c, .vo a.vo-rating:focus-visible .vo-rating-c{ text-decoration:underline; text-underline-offset:3px; }
.vo a.vo-rating:focus-visible{ outline:2px solid var(--espresso); outline-offset:3px; }
.vo .vo-rating-n{ font-weight:500; }
.vo .vo-rating-c{ opacity:.72; }
.vo .card .vo-rating{ align-self:flex-start; }
.vo .pdp-head .vo-rating{ font-size:14px; margin:0 0 6px; }

/* ---------- the reviews section on a product page ---------- */
.vo .vo-reviews{ width:min(1240px,100%); box-sizing:border-box; padding-top:clamp(40px,6vw,72px); padding-bottom:clamp(40px,6vw,72px); }
.vo .vo-reviews-head{ display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:10px 24px; border-top:1px solid var(--rule); padding-top:clamp(24px,3vw,40px); margin-bottom:22px; }
.vo .vo-reviews-head h2{ margin:0; font-family:var(--rh-serif,'Fraunces',serif); font-weight:300; font-size:clamp(24px,2.6vw,32px); }
html[dir=rtl] .vo .vo-reviews-head h2{ font-family:'Amiri',serif; line-height:1.4; }
/* summary: the average as a figure, its stars and count, then the spread over 5…1 stars */
.vo .vo-reviews-sum{ margin:0 0 24px; }
.vo .vo-sum-score{ display:flex; align-items:center; gap:14px; margin-bottom:14px; }
.vo .vo-sum-avg{ font-size:clamp(40px,5vw,52px); line-height:1; font-weight:400; color:var(--espresso); }
.vo .vo-sum-side .vo-rating{ display:flex; flex-wrap:wrap; gap:4px 8px; margin:0; font-size:15px; }
.vo .vo-sum-side .vo-rating-n{ display:none; } /* the large figure already says it */
.vo .vo-sum-bars{ list-style:none; margin:0; padding:0; display:grid; gap:6px; max-width:320px; }
.vo .vo-sum-bars li{ display:grid; grid-template-columns:2.4em 1fr 2em; align-items:center; gap:10px; font-size:12.5px; }
.vo .vo-sum-label{ display:inline-flex; align-items:center; gap:3px; opacity:.8; }
.vo .vo-sum-star{ display:inline-block; width:.9em; height:.9em; background:#9A835A;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2.5l2.9 6.1 6.6.8-4.9 4.6 1.3 6.5L12 17.3l-5.9 3.2 1.3-6.5L2.5 9.4l6.6-.8z'/%3E%3C/svg%3E") center / contain no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2.5l2.9 6.1 6.6.8-4.9 4.6 1.3 6.5L12 17.3l-5.9 3.2 1.3-6.5L2.5 9.4l6.6-.8z'/%3E%3C/svg%3E") center / contain no-repeat; }
.vo .vo-sum-bar{ height:6px; background:rgba(41,37,31,.1); overflow:hidden; }
.vo .vo-sum-bar span{ display:block; height:100%; background:#9A835A; }
.vo .vo-sum-n{ text-align:end; opacity:.7; }
@media (min-width:900px){
  .vo .vo-reviews{ display:grid; grid-template-columns:minmax(220px,300px) minmax(0,1fr); column-gap:clamp(32px,5vw,72px); align-items:start; }
  .vo .vo-reviews > *{ grid-column:2; }
  .vo .vo-reviews > .vo-reviews-head{ grid-column:1 / -1; }
  .vo .vo-reviews > .vo-reviews-sum{ grid-column:1; grid-row:2 / span 6; }
}
.vo .vo-reviews-msg{ margin:0 0 20px; padding:12px 14px; border-inline-start:3px solid var(--olive); background:rgba(93,98,78,.08); }
.vo .vo-reviews-msg.is-bad{ border-color:var(--oxide); background:rgba(135,80,60,.08); }
.vo .vo-reviews-msg:focus{ outline:none; }
.vo .vo-reviews-none, .vo .vo-reviews-who{ margin:0 0 18px; opacity:.82; max-width:70ch; }
.vo .vo-review-list{ display:grid; max-width:900px; }
.vo .vo-review{ padding:20px 0; border-bottom:1px solid var(--rule); }
.vo .vo-review-head{ display:flex; align-items:center; gap:12px; }
.vo .vo-review-av{ flex:0 0 40px; width:40px; height:40px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center;
  background:rgba(154,131,90,.18); color:var(--walnut); font-family:'Fraunces','Amiri',serif; font-size:18px; line-height:1; }
.vo .vo-review-who{ display:grid; gap:3px; min-width:0; }
.vo .vo-review-line{ display:flex; flex-wrap:wrap; align-items:center; gap:4px 10px; }
.vo .vo-review-name{ font-weight:500; }
.vo .vo-review-badge{ font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--olive); border:1px solid currentColor; padding:2px 7px; }
html[dir=rtl] .vo .vo-review-badge{ letter-spacing:0; text-transform:none; font-size:12.5px; }
.vo .vo-review-date{ font-size:12.5px; opacity:.68; }
.vo .vo-review-product{ display:inline-block; margin-top:6px; font-size:13px; color:inherit; }
.vo .vo-review-text{ margin-top:10px; line-height:1.75; max-width:70ch; overflow-wrap:anywhere; }
.vo .vo-review-text p{ margin:0 0 .6em; }
.vo .vo-review-media{ display:flex; flex-wrap:wrap; gap:8px; margin-top:12px; }
.vo .vo-review-media img{ width:96px; height:96px; object-fit:cover; display:block; background:var(--bone); }
.vo .vo-review-media a:focus-visible{ outline:2px solid var(--espresso); outline-offset:2px; }
.vo .vo-review-media video{ width:min(320px,100%); max-height:240px; background:#000; }
.vo .vo-review-incentive{ margin:10px 0 0; font-size:12.5px; opacity:.78; }

/* ---------- the review form ---------- */
.vo .vo-review-form{ max-width:640px; margin-top:28px; padding:clamp(18px,3vw,28px); border:1px solid var(--rule); background:rgba(255,255,255,.35); }
.vo .vo-review-form h3{ margin:0 0 12px; font-family:var(--rh-serif,'Fraunces',serif); font-weight:300; font-size:22px; }
html[dir=rtl] .vo .vo-review-form h3{ font-family:'Amiri',serif; line-height:1.4; }
.vo .vo-review-offer{ margin:0 0 16px; font-size:13.5px; line-height:1.6; padding:10px 12px; background:rgba(154,131,90,.12); }
.vo .vo-rate{ border:0; margin:0 0 16px; padding:0; }
.vo .vo-rate legend, .vo .vo-field label{ display:block; margin-bottom:6px; font-size:13px; font-weight:500; }
.vo .vo-rate-stars{ display:inline-flex; gap:2px; position:relative; }
.vo .vo-rate-stars input{ position:absolute; opacity:0; width:1px; height:1px; margin:0; }
.vo .vo-rate-stars label{ width:44px; height:44px; margin:0; cursor:pointer; background:rgba(41,37,31,.24);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2.5l2.9 6.1 6.6.8-4.9 4.6 1.3 6.5L12 17.3l-5.9 3.2 1.3-6.5L2.5 9.4l6.6-.8z'/%3E%3C/svg%3E") center / 30px 30px no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2.5l2.9 6.1 6.6.8-4.9 4.6 1.3 6.5L12 17.3l-5.9 3.2 1.3-6.5L2.5 9.4l6.6-.8z'/%3E%3C/svg%3E") center / 30px 30px no-repeat; }
.vo .vo-rate-stars label:has(~ input:checked), .vo .vo-rate-stars input:checked + label{ background:#9A835A; }
.vo .vo-rate-stars:focus-within{ outline:2px solid var(--espresso); outline-offset:3px; }
.vo .vo-field{ margin:0 0 14px; }
.vo .vo-field input[type=text], .vo .vo-field textarea{ width:100%; box-sizing:border-box; padding:10px 12px; border:1px solid var(--rule); background:#fff; font:inherit; color:inherit; }
.vo .vo-field input[type=file]{ display:block; max-width:100%; font-size:13px; }
.vo .vo-field small{ display:block; margin-top:4px; font-size:12px; opacity:.72; }
.vo .vo-field input:focus-visible, .vo .vo-field textarea:focus-visible{ outline:2px solid var(--espresso); outline-offset:1px; }
.vo .vo-review-note{ font-size:12.5px; opacity:.78; margin:0 0 14px; }
.vo .vo-field-msg{ margin:0 0 12px; color:var(--oxide); font-size:13.5px; }

/* ---------- homepage testimonials ---------- */
.vo .rh-reviews .rh-track{ gap:16px; }
.vo .rh-review{ position:relative; flex:0 0 clamp(260px,31%,380px); scroll-snap-align:start; box-sizing:border-box; padding:22px; background:#fff; border:1px solid var(--rule); min-width:0; }
.vo .rh-review::after{ content:"\201D"; position:absolute; top:12px; inset-inline-end:18px; font-family:'Fraunces',serif; font-size:56px; line-height:1; color:rgba(154,131,90,.3); pointer-events:none; }
html[dir=rtl] .vo .rh-review::after{ content:"\201C"; }
.vo .rh-review .vo-review-head{ padding-inline-end:36px; }
.vo .rh-review .vo-review-product{ font-size:12px; letter-spacing:.06em; text-transform:uppercase; opacity:.75; text-decoration:none; }
html[dir=rtl] .vo .rh-review .vo-review-product{ letter-spacing:0; text-transform:none; font-size:13px; }
.vo .rh-review .vo-review-product:hover{ text-decoration:underline; }
.vo .rh-review .vo-review{ padding:0; border:0; }
.vo .rh-review .vo-review-text{ display:-webkit-box; -webkit-line-clamp:6; -webkit-box-orient:vertical; overflow:hidden; }
@media (max-width:760px){ .vo .rh-review{ flex-basis:84%; } }
/* in a card, customer media stay small: the full photo/video is on the product page */
.vo .rh-review .vo-review-media img{ width:64px; height:64px; }
.vo .rh-review .vo-review-media video{ width:100%; max-height:150px; }
