/* LLC Station — trust strip (audit DES-3). Markup: parts/trust-strip.php. Self-contained: works on the v3 service pages,
   the info pages and the orders checkout (no other stylesheet needed). RTL via [dir=rtl]. Motion: transform/opacity/clip only
   (no layout shift), only after html.ts-anim is set and never under prefers-reduced-motion. */
.ts {
  --ts-ink: #1A1530; --ts-ink-2: #4B4560; --ts-violet: #7C41D8; --ts-violet-d: #4A1F8C; --ts-wash: #F3EEFD; --ts-line: rgba(26, 21, 48, .10);
  --ts-green: #00B67A; --ts-green-d: #0B7A55; --ts-grey: #DCD9E6;
  --ts-display: 'Archivo', system-ui, -apple-system, 'Segoe UI', sans-serif; --ts-body: 'Public Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --ts-s: 1.12em; --ts-g: .14em;
  font-family: var(--ts-body); color: var(--ts-ink-2); -webkit-font-smoothing: antialiased; box-sizing: border-box;
}
.ts[dir="rtl"] { --ts-display: 'Alexandria', 'Archivo', system-ui, sans-serif; --ts-body: 'IBM Plex Sans Arabic', 'Public Sans', system-ui, sans-serif; }
.ts *, .ts *::before, .ts *::after { box-sizing: border-box; letter-spacing: 0; }
.ts :is(p, ul, li) { margin: 0; padding: 0; }
.ts ul { list-style: none; }
.ts a { text-decoration: none; }
.ts a:focus-visible { outline: 3px solid var(--ts-violet); outline-offset: 3px; border-radius: 8px; }
.ts .ic { height: 1em; width: auto; fill: currentColor; flex: none; overflow: visible; }

/* stars: grey base + green layer clipped to the score (4.3 -> 4 stars + 30 %) */
.ts-stars { position: relative; display: inline-flex; flex: none; line-height: 0; }
.ts-stars__base, .ts-stars__fill { display: inline-flex; gap: var(--ts-g); }
.ts-stars i { width: var(--ts-s); height: var(--ts-s); border-radius: .14em; display: grid; place-items: center; background: var(--ts-grey); color: #fff; }
.ts-stars i .ic { height: .66em; }
.ts-stars__fill { position: absolute; inset: 0; clip-path: inset(0 calc(5 * var(--ts-s) + 4 * var(--ts-g) - var(--ts-fill) * (var(--ts-s) + var(--ts-g))) 0 0); }
.ts[dir="rtl"] .ts-stars__fill { clip-path: inset(0 0 0 calc(5 * var(--ts-s) + 4 * var(--ts-g) - var(--ts-fill) * (var(--ts-s) + var(--ts-g)))); }
.ts-stars__fill i { background: var(--ts-green); }

.ts a.ts-rating { display: inline-flex; align-items: center; gap: 10px; min-height: 40px; color: var(--ts-ink); }
.ts-rating__txt { font-size: .92rem; }
.ts-score b { font: 800 1em var(--ts-display); color: var(--ts-ink); }
.ts-count { color: var(--ts-ink-2); }
.ts-score, .ts-count { unicode-bidi: isolate; }   /* RTL: keep "4.3 on Trustpilot" and "14 reviews" as two separate runs */
.ts-count::before { content: "·"; margin-inline-end: .4em; opacity: .55; }
.ts-rating:hover .ts-rating__txt { text-decoration: underline; text-underline-offset: 3px; text-decoration-color: rgba(26, 21, 48, .3); }
.ts a.ts-refund { display: inline-flex; align-items: center; gap: 7px; min-height: 40px; font-weight: 700; color: var(--ts-violet-d); }
.ts a.ts-refund span { text-decoration: underline; text-underline-offset: 3px; text-decoration-color: rgba(74, 31, 140, .35); }
.ts-refund:hover span { text-decoration-color: currentColor; }
.ts-refund .ic { color: var(--ts-violet); }

/* ── hero: one quiet line under the CTA, a hairline that draws itself ── */
.ts--hero { position: relative; display: flex; flex-wrap: wrap; align-items: center; gap: 2px 22px; margin-top: 1.4rem; padding-top: .9rem; font-size: .92rem; max-width: 640px; }
.ts--hero::before { content: ''; position: absolute; top: 0; inset-inline: 0; height: 1px; background: linear-gradient(90deg, rgba(124, 65, 216, .45), rgba(0, 182, 122, .35) 45%, transparent); transform-origin: left center; }
.ts--hero[dir="rtl"]::before { background: linear-gradient(270deg, rgba(124, 65, 216, .45), rgba(0, 182, 122, .35) 45%, transparent); transform-origin: right center; }
.ts--hero .ts-list { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 18px; }
.ts--hero .ts-list li { display: inline-flex; align-items: center; gap: 7px; min-height: 40px; font-weight: 600; }
.ts--hero .ts-list li > .ic { color: var(--ts-violet); font-size: .95em; }

/* ── panel: a card beside a single price card ── */
.ts--panel, .ts--band { position: relative; border-radius: 26px; border: 1px solid var(--ts-line); overflow: hidden; isolation: isolate;
  background: radial-gradient(420px 220px at 100% 0%, rgba(0, 182, 122, .08), transparent 70%), linear-gradient(170deg, #F6F1FE, #fff 55%); box-shadow: 0 30px 60px -44px rgba(26, 21, 48, .45); }
.ts--panel { display: flex; flex-direction: column; gap: 22px; padding: 30px 28px 24px; }
.ts--panel .ts-head { display: grid; gap: 8px; }
.ts--panel a.ts-rating { --ts-s: 1.5em; flex-wrap: wrap; gap: 8px 12px; }
.ts--panel .ts-rating__txt { font-size: 1rem; }
.ts--panel .ts-score b { font-size: 1.15em; }
.ts-h { font: 800 1.35rem/1.2 var(--ts-display); color: var(--ts-ink); margin-top: 6px !important; }
.ts-p { color: var(--ts-ink-2); font-size: .95rem; line-height: 1.5; max-width: 40ch; }
.ts--panel .ts-list, .ts--band .ts-list { display: grid; gap: 12px; }
.ts--panel .ts-list li, .ts--band .ts-list li { display: flex; align-items: center; gap: 12px; font-weight: 600; color: var(--ts-ink); }
.ts-ic { flex: none; width: 38px; height: 38px; border-radius: 12px; display: grid; place-items: center; background: var(--ts-wash); color: var(--ts-violet); font-size: 1rem; box-shadow: 0 0 0 1px rgba(124, 65, 216, .12) inset; }
.ts-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 18px; padding-top: 16px; border-top: 1px dashed rgba(26, 21, 48, .16); margin-top: auto; }
.ts-pay { display: flex; flex-wrap: wrap; gap: 6px; }

/* ── band: a row under several price cards ── */
.ts--band { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 14px 34px; padding: 20px 28px; margin-top: 26px; }
.ts--band .ts-list { display: flex; flex-wrap: wrap; gap: 10px 26px; }
.ts--band .ts-list li { white-space: nowrap; }
.ts--band .ts-ic { width: 34px; height: 34px; border-radius: 10px; }
.ts--band .ts-foot { grid-column: 1 / -1; margin: 0; padding-top: 14px; }
@media (max-width: 1000px) { .ts--band { grid-template-columns: minmax(0, 1fr); } .ts--band .ts-list li { white-space: normal; } }

/* card / wallet badges (same look as the footer's) */
.ts .sc-pay { display: inline-flex; align-items: center; justify-content: center; gap: 3px; height: 24px; min-width: 38px; padding: 0 7px; border-radius: 4px; background: #fff; color: #3c4043;
  font: 600 11.5px/1 -apple-system, 'Segoe UI', Roboto, Arial, sans-serif; box-shadow: 0 0 0 1px rgba(26, 21, 48, .14); }
.ts .sc-pay--svg { padding: 0; overflow: hidden; }
.ts .sc-pay svg { display: block; }
.ts .sc-pay .ic { height: 12.5px; }
.ts .sc-pay .ic-g { fill: #4285F4; }
.ts .sc-pay--dark { background: #000; color: #fff; box-shadow: none; }
.ts .sc-pay--usdt { background: #26A17B; color: #fff; box-shadow: none; }
.ts .sc-pay--usdt b { font-weight: 800; font-size: 12.5px; }

/* ── motion (html.ts-anim set by the strip's script when motion is allowed) ── */
html.ts-anim [data-ts]:not(.is-in) .ts-stars__fill { clip-path: inset(0 100% 0 0); }
html.ts-anim [data-ts][dir="rtl"]:not(.is-in) .ts-stars__fill { clip-path: inset(0 0 0 100%); }
html.ts-anim [data-ts]:not(.is-in) :is(.ts-rating__txt, .ts-list li, .ts-foot, .ts-h, .ts-p) { opacity: 0; transform: translateY(10px); }
html.ts-anim .ts--hero:not(.is-in)::before { transform: scaleX(0); }
html.ts-anim [data-ts] .ts-stars__fill { transition: clip-path 1.1s cubic-bezier(.65, 0, .35, 1) .25s; }
html.ts-anim [data-ts] :is(.ts-rating__txt, .ts-list li, .ts-foot, .ts-h, .ts-p) { transition: opacity .6s ease, transform .7s cubic-bezier(.2, .8, .2, 1); }
html.ts-anim .ts--hero::before { transition: transform 1.2s cubic-bezier(.65, 0, .35, 1); }
html.ts-anim [data-ts] .ts-h { transition-delay: .1s; } html.ts-anim [data-ts] .ts-p { transition-delay: .16s; }
html.ts-anim [data-ts] .ts-rating__txt { transition-delay: .15s; }
html.ts-anim [data-ts] .ts-list li:nth-child(1) { transition-delay: .25s; } html.ts-anim [data-ts] .ts-list li:nth-child(2) { transition-delay: .35s; }
html.ts-anim [data-ts] .ts-list li:nth-child(3) { transition-delay: .45s; } html.ts-anim [data-ts] .ts-list li:nth-child(4) { transition-delay: .55s; }
html.ts-anim [data-ts] .ts-foot { transition-delay: .6s; }
.ts .ts-ic { transition: transform .35s cubic-bezier(.2, .8, .2, 1), background-color .25s; }
.ts .ts-list li:hover .ts-ic { transform: translateY(-2px) rotate(-6deg); background: #EAE0FC; }
@media (prefers-reduced-motion: reduce) {
  .ts *, .ts::before { transition: none !important; animation: none !important; }
}
@media (max-width: 620px) {
  .ts--hero { gap: 0 18px; font-size: .88rem; }
  .ts--panel { padding: 24px 20px 20px; }
  .ts--band { padding: 20px; }
}
