/* Reviews section (#reviews) — editorial split, not a card grid.
   Relies on the homepage :root tokens (--gold, --line, --foil, ...). */

.reviews{
  display:grid;grid-template-columns:1fr;align-items:start;
  gap:clamp(34px,5vw,68px);margin-top:clamp(34px,4vw,52px);
}
@media(min-width:900px){
  .reviews{grid-template-columns:minmax(250px,.72fr) minmax(0,1.6fr)}
  .reviews__sum{position:sticky;top:124px}
}
/* polish.css sets overflow-x:hidden on html AND body, which turns body into its own
   scroll container and silently breaks position:sticky. `clip` hides the same
   horizontal overflow without creating a scroll container. Older browsers without
   `clip` keep polish's `hidden` (the summary just scrolls normally there). */
@supports (overflow:clip){
  :root{overflow-x:clip}
  :root body{overflow-x:clip}
}
/* No list (no reviews yet, or the fetch failed): summary + CTA only, never stretched. */
.reviews[data-state="solo"]{grid-template-columns:minmax(0,520px)}

.reviews__sum{min-width:0}
.reviews__sum .btn{margin-top:26px}

/* score block (filled by reviews.js) */
.reviews__avg{
  font-family:Anton,"Arial Narrow",Impact,sans-serif;font-weight:400;line-height:.85;
  font-size:clamp(84px,13vw,132px);letter-spacing:.005em;font-variant-numeric:tabular-nums;
  padding-bottom:.06em;
}
.reviews__from{margin:12px 0 0;color:var(--muted);font-size:15px}

/* empty / invite state (static HTML) */
.reviews__invite-h{
  font-family:Anton,"Arial Narrow",Impact,sans-serif;font-weight:400;text-transform:uppercase;
  font-size:clamp(30px,4.6vw,44px);line-height:1;margin:0;letter-spacing:.01em;
}
.reviews__invite-p{margin:14px 0 0;color:var(--muted);max-width:34ch}

/* stars drawn once, filled by a CSS variable (--fill: 0% .. 100%) */
.rstars{
  --fill:0%;
  display:block;flex:none;width:calc(5 * var(--sz,22px));height:var(--sz,22px);
  background:
    var(--foil) 0 0 / var(--fill) 100% no-repeat,
    linear-gradient(var(--line-2),var(--line-2));
  -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.6l2.94 6.1 6.7.92-4.9 4.68 1.2 6.62L12 17.6l-5.94 3.32 1.2-6.62-4.9-4.68 6.7-.92z'/%3E%3C/svg%3E") 0 0 / var(--sz,22px) var(--sz,22px) 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.6l2.94 6.1 6.7.92-4.9 4.68 1.2 6.62L12 17.6l-5.94 3.32 1.2-6.62-4.9-4.68 6.7-.92z'/%3E%3C/svg%3E") 0 0 / var(--sz,22px) var(--sz,22px) repeat-x;
}
.rstars--lg{--sz:30px;margin-top:14px}

/* the list: separated by 1px rules, no boxes */
.reviews__list{min-width:0}
.reviews__items{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.reviews__items > li{border-bottom:1px solid var(--line);padding:clamp(22px,3vw,32px) 0}
.reviews__items > li[hidden]{display:none}
.reviews__items > li:focus{outline:none}
.reviews__items > li:focus-visible{outline:2px solid var(--gold);outline-offset:-2px}
.review{margin:0}
.review .rstars{--sz:18px}
.review__text{
  margin:14px 0 0;padding:0;border:0;white-space:pre-line;overflow-wrap:anywhere;
  font-size:clamp(17px,2vw,19px);line-height:1.6;color:var(--silver-hi);max-width:62ch;
}
.review__who{
  margin:16px 0 0;font-size:12.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);
}
.review__who b{color:var(--gold-hi);font-weight:700}
.reviews__more{margin-top:28px}

/* .btn and friends set display, which would beat the [hidden] attribute. */
#reviews [hidden]{display:none!important}

/* Between two panel sections (gallery visible) keep the site's gold battlement divider. */
#work:not([hidden]) + #reviews::before{
  content:"";position:absolute;top:0;left:0;right:0;height:10px;background:var(--foil);
  -webkit-mask-image:repeating-linear-gradient(90deg,#000 0 26px,transparent 26px 52px);
  mask-image:repeating-linear-gradient(90deg,#000 0 26px,transparent 26px 52px);
}

@media(max-width:639px){
  .reviews__avg{font-size:clamp(76px,24vw,104px)}
  .reviews__sum .btn{width:100%}
  .reviews__more{width:100%}
}
