/* Trustpilot reviews (homepage, 2026-10-30): the TrustScore card on the left, real reviews from
   trustpilot.com/review/hawknotch.com in a scroll-snap row on the right, moved by the arrow buttons
   (assets/js/tp-reviews.js). Reviews, score and count are copied by hand: update them when new reviews come in. */

/* Trustpilot-style stars: green squares with a white star; .half is the half-filled last square of a 4.5 score */
.tp-stars{display:inline-flex;gap:3px;flex:none}
.tp-stars i{position:relative;display:block;width:20px;height:20px;background:#00B67A}
.tp-stars i.half{background:linear-gradient(90deg,#00B67A 50%,#DCDCE6 50%)}
.tp-stars i::before{content:"";position:absolute;inset:16%;background:#fff;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 1.5l3.1 7.1 7.7.6-5.9 5 1.8 7.5L12 17.6l-6.7 4.1 1.8-7.5-5.9-5 7.7-.6z'/%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 1.5l3.1 7.1 7.7.6-5.9 5 1.8 7.5L12 17.6l-6.7 4.1 1.8-7.5-5.9-5 7.7-.6z'/%3E%3C/svg%3E") center/contain no-repeat}
.tp-stars.lg{gap:4px}
.tp-stars.lg i{width:36px;height:36px}

/* heading row: heading on the left, arrows on the right */
.tpr-head{max-width:none;display:flex;align-items:flex-end;justify-content:space-between;gap:32px}
.tpr-head > div{max-width:720px}
.tpr-head .lead{margin:0}
.tpr-mark{position:relative;white-space:nowrap}
.tpr-mark svg{position:absolute;left:-2%;bottom:-.2em;width:104%;height:.42em;overflow:visible;pointer-events:none}
.tpr-mark path{fill:none;stroke:var(--green-500);stroke-width:5;stroke-linecap:round}
.tpr-nav{display:flex;gap:10px;flex:none}
.tpr-btn{width:48px;height:48px;border-radius:50%;border:1px solid var(--slate-300);background:var(--white);color:var(--ink-800);
  display:grid;place-items:center;transition:background .2s var(--ease),border-color .2s var(--ease),opacity .2s var(--ease)}
.tpr-btn svg{width:20px;height:20px}
.tpr-btn.prev svg{transform:scaleX(-1)}
.tpr-btn:hover:not([aria-disabled="true"]){background:var(--slate-50);border-color:var(--ink-800)}
.tpr-btn[aria-disabled="true"]{opacity:.35;cursor:default}

/* score card + review row */
.tpr-row{display:grid;grid-template-columns:272px minmax(0,1fr);gap:20px;align-items:stretch}
.tpr-score{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:32px 20px;text-align:center;
  background:var(--white);border:1px solid var(--slate-200);border-radius:24px;box-shadow:0 18px 40px -28px rgba(20,26,34,.35);
  transition:border-color .2s var(--ease),box-shadow .2s var(--ease)}
.tpr-score:hover{border-color:var(--slate-300);box-shadow:0 22px 44px -26px rgba(20,26,34,.4)}
.tpr-word{font:600 28px/1 var(--display);letter-spacing:-.02em;color:var(--ink-900)}
.tpr-meta{font-size:15px;color:var(--slate-500)}
.tpr-meta b{color:var(--ink-800);font-weight:600}
.tpr-brand{display:inline-flex;align-items:center;gap:6px;font:700 19px/1 var(--body);letter-spacing:-.01em;color:var(--ink-900)}
.tpr-brand svg{width:24px;height:24px;color:#00B67A}
.tpr-score .link{margin-top:2px}

.tpr-track{overflow-x:auto;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;scrollbar-width:none;border-radius:24px}
.tpr-track::-webkit-scrollbar{display:none}
.tpr-list{list-style:none;margin:0;padding:0;display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 40px) / 2.5);gap:20px;height:100%}
.tpr-card{scroll-snap-align:start;display:flex;flex-direction:column;gap:12px;padding:24px;background:var(--white);border:1px solid var(--slate-200);border-radius:24px}
.tpr-top{display:flex;align-items:center;justify-content:space-between;gap:12px}
.tpr-top time{font-size:13px;color:var(--slate-500);white-space:nowrap}
.tpr-card h3{font:600 18px/1.35 var(--body);letter-spacing:-.01em;color:var(--ink-900);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.tpr-card blockquote{margin:0;font-size:15px;line-height:1.6;color:var(--ink-600);
  display:-webkit-box;-webkit-line-clamp:6;-webkit-box-orient:vertical;overflow:hidden}
.tpr-who{margin-top:auto;padding-top:4px;font-size:14px;font-weight:600;color:var(--ink-800)}

@media (max-width:1020px){
  .tpr-row{grid-template-columns:1fr}
  .tpr-score{flex-direction:row;flex-wrap:wrap;gap:10px 16px;padding:22px 20px}
  .tpr-list{grid-auto-columns:calc((100% - 20px) / 1.7)}
}
@media (max-width:600px){
  .tpr-head{flex-direction:column;align-items:flex-start;gap:24px}
  .tpr-mark{white-space:normal}
  .tp-stars.lg i{width:28px;height:28px}
  .tpr-list{grid-auto-columns:86%;gap:12px}
  .tpr-card{padding:20px}
}