/* Trustpilot rating band (homepage, after the review wall). Modelled on creatorlayer.com's
   rated panel: a flat Hawk-green panel with a rating seal sitting in a notch on its top edge,
   a centred statement, two CTAs and a row of four figures. Motion lives in trust-rating.js;
   the markup already holds the finished state. Classes are prefixed rt-. */
.rt{padding:clamp(128px,12vw,176px) 0 112px}
.rt-panel{--seal:clamp(140px,14vw,200px);position:relative;isolation:isolate;text-align:center;color:#fff;
  padding:clamp(108px,10vw,160px) clamp(20px,5vw,88px) 0;border-radius:clamp(24px,2.6vw,32px);background:var(--green-700);--focus:#fff}

/* the hawk mark, cropped by the panel's bottom-right corner */
.rt-bg{position:absolute;z-index:-1;inset:0;border-radius:inherit;overflow:hidden;pointer-events:none}
.rt-mark{position:absolute;right:-6%;bottom:-14%;width:min(48%,520px);aspect-ratio:553/404;opacity:.1;transform:rotate(-10deg)}

/* the seal: a static face, and the ring of text turning above it */
.rt-seal{position:absolute;left:0;right:0;top:calc(var(--seal) * -.46);width:var(--seal);aspect-ratio:1;margin-inline:auto;border-radius:50%;
  box-shadow:0 0 0 clamp(6px,.7vw,10px) var(--green-700),0 2px 4px rgba(15,20,25,.12),0 26px 38px -14px rgba(15,20,25,.5)}
.rt-seal svg{position:absolute;inset:0;display:block;width:100%;height:100%;overflow:visible}
.rt-disc{fill:#fff}
.rt-line{fill:none;stroke:var(--ink-800);stroke-width:1.5}
.rt-num{font:700 46px var(--display);letter-spacing:-1px;fill:var(--ink-800)}
/* the page's Trustpilot star colours (tp-reviews.css) */
.rt-star{color:#00B67A}
.rt-star-off{color:#DCDCE6}
.rt-ring{will-change:transform;animation:rt-orbit 40s linear infinite}
.rt-ring text{font:600 11.5px var(--display);fill:var(--ink-800)}
.rt.is-off .rt-ring{animation-play-state:paused}
@keyframes rt-orbit{to{transform:rotate(360deg)}}

.rt h2{max-width:20ch;margin:0 auto clamp(20px,2.2vw,32px);font-size:clamp(32px,4.6vw,64px);line-height:1.08;font-weight:500;letter-spacing:-.03em}
.rt-hl{display:block;color:#C9F0B2}
.rt-text{max-width:62ch;margin:0 auto clamp(32px,3.4vw,48px);font-size:clamp(16px,1.3vw,18px);line-height:1.65;color:rgba(255,255,255,.92);text-wrap:pretty}

/* CTAs: the shared .btn (white, and ghost restyled for the green panel), plus an arrow well on the right */
.rt-actions{position:relative;display:inline-flex;flex-wrap:wrap;justify-content:center;gap:12px}
.rt-btn{height:56px;padding:0 10px 0 24px;gap:16px}
.rt-btn .rt-well{display:grid;place-items:center;width:36px;height:36px;border-radius:8px;background:var(--slate-50);transition:background-color .2s var(--ease)}
.rt-btn .rt-well svg{width:14px;height:14px}
.rt-btn:hover .rt-well svg{transform:translate(1px,-1px)}
.rt-btn.btn-white:hover .rt-well{background:#fff}
.rt .rt-alt{color:#fff;border-color:rgba(255,255,255,.6)}
.rt-alt .rt-well{background:rgba(255,255,255,.14)}
.rt .rt-alt:hover{background:rgba(255,255,255,.1);border-color:#fff}
.rt-alt:hover .rt-well{background:rgba(255,255,255,.22)}
.rt-arrow{position:absolute;left:calc(100% + 16px);top:-6px;width:78px;height:auto;pointer-events:none}
.rt-arrow path{fill:none;stroke:#fff;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.rt-note{margin-top:22px;font-size:15px;line-height:22px;color:rgba(255,255,255,.88)}

/* the four figures */
.rt-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:clamp(48px,5.5vw,80px) 0 0;border-top:1px solid rgba(255,255,255,.24);text-align:left}
.rt-stats>div{display:flex;flex-direction:column-reverse;justify-content:flex-end;gap:8px;padding:clamp(24px,2.6vw,36px) clamp(12px,2vw,28px) clamp(28px,3vw,44px)}
.rt-stats>div+div{border-left:1px solid rgba(255,255,255,.24)}
.rt-stats>div:first-child{padding-left:0}
.rt-stats dt{font-size:clamp(14px,1.1vw,16px);line-height:1.4;font-weight:500;color:rgba(255,255,255,.9);text-wrap:balance}
.rt-stats dd{font-size:clamp(36px,4.4vw,60px);line-height:1;color:#fff;white-space:nowrap}  /* + the shared .num */
.rt-stats dd small{margin-left:.12em;font-size:.5em;font-weight:500;letter-spacing:-.01em}

@media (max-width:1024px){.rt-arrow{display:none}}
@media (max-width:720px){
  .rt{padding:104px 0 72px}
  .rt-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .rt-stats>div{padding:22px 12px 24px 0}
  .rt-stats>div:nth-child(2n){padding-left:18px}
  .rt-stats>div:nth-child(3){border-left:0}
  .rt-stats>div:nth-child(n+3){border-top:1px solid rgba(255,255,255,.24)}
  .rt-mark{width:78%;right:-16%;bottom:-3%}
}
@media (max-width:520px){
  .rt-actions{display:flex}
  .rt-btn{flex:1 1 100%;justify-content:space-between}
}
