/* =====================================================================================================
   ATROPI — Payments (page-templates/payments.php). Scoped under the page body class and the page's section ids
   (#hero #methods #fiat #withdrawal). Tokens only — except the payment-method identity colours below (the
   methods' own brand colours, as on the live page's logos), lightened in Night. RTL twin by tools/build.mjs.
   Signature: the deposit flow (deposit → processing → credited) with method chips in the hero.
   ===================================================================================================== */

/* ---------------------------------------------------------------- payment-method marks (identity colours) */
.atropi-tpl-payments .pm-c--btc { --c: #F7931A; }
.atropi-tpl-payments .pm-c--eth { --c: #627EEA; }
.atropi-tpl-payments .pm-c--usdt { --c: #1BA27A; }
.atropi-tpl-payments .pm-c--usdc { --c: #2775CA; }
.atropi-tpl-payments .pm-c--ltc { --c: #345D9D; }
.atropi-tpl-payments .pm-c--bnb { --c: #D9A40A; }
.atropi-tpl-payments .pm-c--trx { --c: #E3112E; }
.atropi-tpl-payments .pm-c--xrp { --c: var(--ink); }
.atropi-tpl-payments .pm-c--paypal { --c: #0070E0; }
.atropi-tpl-payments .pm-c--pm { --c: #E2241A; }
.atropi-tpl-payments .pm-c--visa { --c: #1A1F71; }
.atropi-tpl-payments .pm-c--mc { --c: #EB001B; }
.atropi-tpl-payments .pm-c--wire { --c: var(--brand); }
:root[data-theme="dark"] .atropi-tpl-payments .pm-c--ltc { --c: #7FA2E6; }
:root[data-theme="dark"] .atropi-tpl-payments .pm-c--usdc { --c: #5C9BE6; }
:root[data-theme="dark"] .atropi-tpl-payments .pm-c--eth { --c: #8EA2F5; }
:root[data-theme="dark"] .atropi-tpl-payments .pm-c--paypal { --c: #4DA3FF; }
:root[data-theme="dark"] .atropi-tpl-payments .pm-c--visa { --c: var(--ink); }
:root[data-theme="dark"] .atropi-tpl-payments .pm-c--trx { --c: #FF4D63; }
.atropi-tpl-payments .pm-mc-a { fill: #EB001B; }
.atropi-tpl-payments .pm-mc-b { fill: #F79E1B; mix-blend-mode: multiply; opacity: .92; }
:root[data-theme="dark"] .atropi-tpl-payments .pm-mc-b { mix-blend-mode: screen; }
.atropi-tpl-payments .pm-glyph { display: block; width: 20px; height: 20px; }

/* ---------------------------------------------------------------- 01 hero — the deposit flow */
#hero .pm-flow { --pm-dir: 1; position: relative; width: 100%; max-width: 480px; margin-inline: auto; padding-block: 24px; }
:root[dir="rtl"] #hero .pm-flow { --pm-dir: -1; }
#hero .pm-flow-glow { position: absolute; inset: 6% -10% 0; z-index: -1; border-radius: 50%; background: radial-gradient(closest-side, color-mix(in srgb, var(--brand) 20%, transparent), transparent); pointer-events: none; }
#hero .pm-flow-panel {
  position: relative; padding: 18px;
  border-radius: var(--r-xl); border: 1px solid var(--line);
  background: var(--surface-glass); -webkit-backdrop-filter: blur(18px) saturate(140%); backdrop-filter: blur(18px) saturate(140%);
  box-shadow: var(--shadow-lg), inset 0 1px 0 rgba(255, 255, 255, .6);
}
:root[data-theme="dark"] #hero .pm-flow-panel { box-shadow: var(--shadow-lg), inset 0 1px 0 rgba(255, 255, 255, .06); }
#hero .pm-flow-bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 0 2px 14px; border-bottom: 1px solid var(--line); }
#hero .pm-flow-k { display: inline-flex; align-items: center; gap: 8px; font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
#hero .pm-flow-live { width: 6px; height: 6px; border-radius: 50%; background: var(--bull-vivid); box-shadow: 0 0 0 3px var(--bull-bg); }
#hero .pm-flow-tab { display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px; border-radius: var(--r-pill); background: var(--brand-50); color: var(--brand-ink); font-size: 10.5px; letter-spacing: .1em; text-transform: uppercase; }
#hero .pm-flow-tab .ico { width: 12px; height: 12px; }

#hero .pm-chips-wrap { position: relative; margin-top: 16px; }
#hero .pm-chips { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 6px; }
#hero .pm-chip { position: relative; display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 10px 2px 8px; border-radius: var(--r-sm); border: 1px solid var(--line); background: var(--surface); min-width: 0; }
#hero .pm-chip-ico { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; color: var(--c); background: color-mix(in srgb, var(--c) 11%, var(--surface)); transition: transform .5s var(--ease-spring); }
#hero .pm-chip-ico .pm-glyph { width: 18px; height: 18px; }
#hero .pm-chip-t { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-family: var(--font-mono); font-size: 9.5px; letter-spacing: .04em; color: var(--muted); transition: color .4s; }
#hero .pm-chip.is-on .pm-chip-t { color: var(--ink); }
#hero .pm-chip.is-on .pm-chip-ico { transform: scale(1.08); }
/*rtl:begin:ignore*/
#hero .pm-chips-ind { position: absolute; top: 0; left: 0; bottom: 0; width: var(--w, 0px); border-radius: var(--r-sm); box-shadow: 0 0 0 1.5px var(--brand), 0 8px 22px -10px var(--brand); transform: translate3d(var(--x, 0px), 0, 0); opacity: 0; transition: transform .6s var(--ease-out), width .6s var(--ease-out), opacity .3s; pointer-events: none; }
/*rtl:end:ignore*/
#hero .pm-chips-wrap.is-ready .pm-chips-ind { opacity: 1; }
html:not(.js) #hero .pm-chip.is-on { border-color: var(--brand); }

#hero .pm-pipe { position: relative; margin-top: 14px; padding: 16px 8px 12px; border-radius: var(--r-md); background: var(--surface-2); border: 1px solid var(--line); }
#hero .pm-pipe-track { position: absolute; top: 34px; inset-inline: calc(16.666% + 2px); height: 2px; }
#hero .pm-pipe-base { position: absolute; inset: 0; background: repeating-linear-gradient(90deg, var(--line-strong) 0 4px, transparent 4px 8px); }
#hero .pm-pipe-fill { position: absolute; inset: 0; border-radius: 2px; background: linear-gradient(90deg, var(--brand), var(--bull-vivid)); transform-origin: left center; transform: scaleX(var(--x, 1)); transition: transform 1s var(--ease-io); }
/*rtl:begin:ignore*/
#hero .pm-pipe-run { position: absolute; inset: 0; transform: translate3d(calc(var(--x, 1) * var(--pm-dir, 1) * 100%), 0, 0); transition: transform 1s var(--ease-io); }
/*rtl:end:ignore*/
#hero .pm-pipe.no-tr .pm-pipe-run, #hero .pm-pipe.no-tr .pm-pipe-fill { transition: none; }
#hero .pm-coin { position: absolute; top: 50%; inset-inline-start: 0; z-index: 2; display: grid; place-items: center; width: 32px; height: 32px; margin-top: -16px; margin-inline-start: -16px; border-radius: 50%; background: var(--surface); color: var(--c); box-shadow: 0 0 0 1px color-mix(in srgb, var(--c) 40%, transparent), 0 8px 18px -6px color-mix(in srgb, var(--c) 60%, transparent); }
#hero .pm-coin .pm-glyph { width: 18px; height: 18px; }
#hero .pm-st { position: relative; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
#hero .pm-st-i { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; gap: 7px; text-align: center; min-width: 0; }
#hero .pm-st-dot { position: relative; display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; background: var(--surface); border: 1px solid var(--line-strong); color: var(--faint); transition: color .4s, border-color .4s, background-color .4s; }
#hero .pm-st-dot .ico { width: 16px; height: 16px; }
#hero .pm-st-i.is-on .pm-st-dot { border-color: var(--brand); background: var(--brand-50); color: var(--brand); }
#hero .pm-st-i[data-i="3"].is-on .pm-st-dot { border-color: var(--bull-vivid); background: var(--bull-bg); color: var(--bull); }
#hero .pm-st-t { font-size: 12px; font-weight: 600; color: var(--muted); transition: color .4s; }
#hero .pm-st-i.is-on .pm-st-t { color: var(--ink); }
#hero .pm-st-spin { position: absolute; inset: -5px; border-radius: 50%; border: 1.5px solid transparent; border-top-color: var(--brand); opacity: 0; transition: opacity .3s; }
#hero .pm-flow[data-step="2"] .pm-st-spin { opacity: 1; }
#hero .pm-conf { display: flex; gap: 3px; height: 3px; visibility: hidden; }
#hero .pm-flow.is-crypto .pm-conf { visibility: visible; }
#hero .pm-conf i { position: relative; overflow: hidden; width: 12px; height: 3px; border-radius: 2px; background: var(--line-strong); }
#hero .pm-conf i::after { content: ""; position: absolute; inset: 0; background: var(--brand); transform-origin: left center; transform: scaleX(0); transition: transform .35s var(--ease-out); }
#hero .pm-flow[data-step="3"] .pm-conf i::after, #hero .pm-conf i.is-on::after { transform: none; }
#hero .pm-flow[data-step="3"] .pm-conf i::after { background: var(--bull-vivid); }

#hero .pm-rcpt { margin: 12px 0 0; }
#hero .pm-rcpt-r { display: flex; align-items: baseline; justify-content: space-between; gap: 14px; padding: 9px 2px; border-bottom: 1px dashed var(--line); }
#hero .pm-rcpt dt { font-size: 10px; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); white-space: nowrap; }
#hero .pm-rcpt dd { margin: 0; min-width: 0; font-size: 13.5px; font-weight: 500; color: var(--ink); text-align: end; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#hero .pm-rcpt dd.num { font-size: 13px; }
#hero .pm-status { display: inline-flex; align-items: center; gap: 8px; }
#hero .pm-sdot { flex: none; width: 7px; height: 7px; border-radius: 50%; background: var(--brand); transition: background-color .4s, box-shadow .4s; }
#hero .pm-flow[data-step="3"] .pm-sdot { background: var(--bull-vivid); box-shadow: 0 0 0 3px var(--bull-bg); }
#hero .pm-bal {
  display: flex; align-items: center; gap: 12px; margin-top: 14px; padding: 14px 16px;
  border-radius: var(--r-md); background: var(--grad-ink); color: var(--on-brand);
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--on-brand) 10%, transparent);
}
#hero .pm-bal-k { font-size: 10px; letter-spacing: .14em; text-transform: uppercase; color: color-mix(in srgb, var(--on-brand) 62%, transparent); }
#hero .pm-bal-v { display: inline-flex; align-items: baseline; gap: 6px; }
#hero .pm-bal-v .num { font-size: 22px; font-weight: 600; letter-spacing: -.03em; color: var(--on-brand); }
#hero .pm-bal-v small { font-size: 10.5px; color: color-mix(in srgb, var(--on-brand) 62%, transparent); }
#hero .pm-bal-d { margin-inline-start: auto; padding: 4px 9px; border-radius: var(--r-pill); background: color-mix(in srgb, var(--bull-vivid) 22%, transparent); color: color-mix(in srgb, var(--bull-vivid) 55%, white); font-size: 12px; font-weight: 600; opacity: 0; transform: translate3d(0, 4px, 0); transition: opacity .4s var(--ease-out), transform .5s var(--ease-out); }
#hero .pm-flow[data-step="3"] .pm-bal-d { opacity: 1; transform: none; }
#hero .pm-tag { position: absolute; z-index: 2; display: inline-flex; align-items: center; gap: 6px; padding: 7px 12px; border-radius: var(--r-pill); background: var(--surface-float); border: 1px solid var(--line); box-shadow: var(--shadow-md); font-size: 12px; font-weight: 600; color: var(--ink); white-space: nowrap; transition: opacity .45s var(--ease-out), transform .6s var(--ease-out); }
#hero .pm-tag .ico { width: 14px; height: 14px; }
#hero .pm-tag--a { top: 2px; inset-inline-end: -14px; color: var(--bull); }
#hero .pm-flow:not(.is-crypto) .pm-tag--a { opacity: 0; transform: translate3d(0, 6px, 0); }
#hero .pm-tag--b { bottom: 4px; inset-inline-start: -18px; }
#hero .pm-tag-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--brand); }
@media (prefers-reduced-motion: no-preference) {
  #hero .pm-flow[data-step="2"] .pm-st-spin { animation: pm-spin .9s linear infinite; }
  #hero .pm-flow-live { animation: pm-live 2.4s var(--ease-io) infinite; }
}
#hero.ac-paused .pm-st-spin, #hero.ac-paused .pm-flow-live { animation-play-state: paused; }
@keyframes pm-spin { to { transform: rotate(360deg); } }
@keyframes pm-live { 50% { box-shadow: 0 0 0 6px transparent; } }
@media (max-width: 1099px) and (min-width: 900px) { #hero .pm-tag--a { inset-inline-end: 0; } #hero .pm-tag--b { inset-inline-start: 0; } }
@media (max-width: 480px) {
  #hero .pm-flow-panel { padding: 14px; border-radius: var(--r-lg); }
  #hero .pm-chips { gap: 4px; }
  #hero .pm-chip { padding: 8px 1px 6px; }
  #hero .pm-chip-ico { width: 26px; height: 26px; }
  #hero .pm-chip-ico .pm-glyph { width: 15px; height: 15px; }
  #hero .pm-chip-t { font-size: 8.5px; }
  #hero .pm-tag--a { inset-inline-end: 0; }
  #hero .pm-tag--b { inset-inline-start: 0; }
  #hero .pm-bal-v .num { font-size: 19px; }
}

/* ---------------------------------------------------------------- 02 deposit methods — the crypto orbit */
#methods .pm-methods-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(40px, 6vw, 96px); align-items: center; }
#methods .chapter-head { margin-bottom: clamp(28px, 3vw, 40px); }
#methods .pm-group { display: flex; align-items: center; gap: 10px; margin-bottom: 4px; padding-bottom: 12px; font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
#methods .pm-group b { margin-inline-start: auto; font-weight: 500; color: var(--ink); }
#methods .pm-group-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--bull-vivid); box-shadow: 0 0 0 3px var(--bull-bg); }
#methods .pm-coins { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 28px; border-top: 1px solid var(--line-strong); }
#methods .pm-coins-i { display: flex; align-items: center; gap: 14px; min-width: 0; padding: 14px 2px; border-bottom: 1px solid var(--line); }
#methods .pm-coin-mark { flex: none; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; color: var(--c); background: color-mix(in srgb, var(--c) 10%, var(--surface)); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--c) 24%, transparent); }
#methods .pm-coin-mark .pm-glyph { width: 22px; height: 22px; }
#methods .pm-coin-txt { display: flex; flex-direction: column; min-width: 0; line-height: 1.3; }
#methods .pm-coin-sym { font-size: 14.5px; font-weight: 600; color: var(--ink); letter-spacing: .02em; }
#methods .pm-coin-name { font-size: 13.5px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#methods .pm-orbit-wrap { position: relative; min-width: 0; }
/*rtl:begin:ignore*/
#methods .pm-orbit { position: relative; width: min(100%, 540px); aspect-ratio: 1; margin-inline: auto; container-type: inline-size; }
#methods .pm-orbit::before { content: ""; position: absolute; inset: 14%; z-index: -1; border-radius: 50%; background: radial-gradient(closest-side, color-mix(in srgb, var(--brand) 16%, transparent), transparent); }
#methods .pm-orbit-ring { position: absolute; border-radius: 50%; border: 1px solid var(--line-strong); }
#methods .pm-orbit-ring--1 { inset: 8%; }
#methods .pm-orbit-ring--2 { inset: 24%; border-style: dashed; border-color: var(--line-strong); }
#methods .pm-orbit-ticks { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
#methods .pm-orbit-ticks line { stroke: var(--line-strong); stroke-width: .6; }
#methods .pm-orbit-ticks line.is-major { stroke: var(--faint); stroke-width: .9; }
#methods .pm-orbit-core { position: absolute; inset: 37%; z-index: 2; display: grid; place-items: center; border-radius: 50%; background: var(--surface); box-shadow: var(--shadow-lg), 0 0 0 1px var(--line), 0 0 0 9px var(--brand-50); }
#methods .pm-orbit-core-in { display: grid; place-items: center; width: 64%; }
#methods .pm-core-logo { display: block; width: 100%; height: auto; }
#methods .pm-orbit-ripple { position: absolute; inset: 37%; z-index: 1; border-radius: 50%; border: 1.5px solid var(--brand); opacity: 0; }
#methods .pm-orbit.is-ping .pm-orbit-ripple { animation: pm-ripple 1.4s var(--ease-out); }
#methods .pm-orbit-track { position: absolute; inset: 0; z-index: 3; }
#methods .pm-orbit-track--a { --r: 42cqi; --dur: 96s; }
#methods .pm-orbit-track--b { --r: 26cqi; --dur: 72s; }
#methods .pm-orb { position: absolute; left: 50%; top: 50%; width: 12.5cqi; height: 12.5cqi; margin: -6.25cqi 0 0 -6.25cqi; transform: rotate(var(--a)) translate(var(--r)) rotate(calc(-1 * var(--a))); }
#methods .pm-orb-in { position: relative; display: grid; place-items: center; width: 100%; height: 100%; border-radius: 50%; background: var(--surface); color: var(--c); box-shadow: var(--shadow-md), inset 0 0 0 1px color-mix(in srgb, var(--c) 26%, transparent); }
#methods .pm-orb-in .pm-glyph { width: 46%; height: 46%; }
#methods .pm-orb-in::after { content: ""; position: absolute; inset: -6px; border-radius: 50%; border: 2px solid var(--c); box-shadow: 0 0 22px -2px color-mix(in srgb, var(--c) 60%, transparent); opacity: 0; transition: opacity .5s var(--ease-out); }
#methods .pm-orb.is-hot .pm-orb-in::after { opacity: 1; }
@media (prefers-reduced-motion: no-preference) {
  #methods .pm-orbit-track { animation: pm-orbit var(--dur) linear infinite; }
  #methods .pm-orbit-track--b { animation-direction: reverse; }
  #methods .pm-orbit-track--a .pm-orb-in { animation: pm-orbit var(--dur) linear infinite reverse; }
  #methods .pm-orbit-track--b .pm-orb-in { animation: pm-orbit var(--dur) linear infinite; }
}
#methods .pm-orbit.is-paused .pm-orbit-track, #methods .pm-orbit.is-paused .pm-orb-in { animation-play-state: paused; }
@keyframes pm-orbit { to { transform: rotate(360deg); } }
@keyframes pm-ripple { from { opacity: .8; transform: scale(1); } to { opacity: 0; transform: scale(2.1); } }
/*rtl:end:ignore*/
@media (max-width: 899px) {
  #methods .pm-methods-grid { grid-template-columns: minmax(0, 1fr); }
  #methods .pm-orbit { width: min(100%, 420px); }
}
@media (max-width: 420px) {
  #methods .pm-coins { column-gap: 14px; }
  #methods .pm-coins-i { gap: 10px; }
  #methods .pm-coin-mark { width: 38px; height: 38px; }
}

/* ---------------------------------------------------------------- 03 fiat & vouchers, bank wire, deposit terms */
#fiat .pm-fiat-grid { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr); gap: clamp(16px, 2vw, 24px); }
#fiat .pm-fiat-i { display: flex; min-width: 0; }
#fiat .pm-card { position: relative; isolation: isolate; overflow: hidden; display: flex; flex-direction: column; width: 100%; min-height: 360px; padding: clamp(26px, 3vw, 40px); border-radius: var(--r-lg); background: var(--surface); border: 1px solid var(--line); box-shadow: var(--shadow-sm); }
#fiat .pm-card-grid { position: absolute; inset: 0; z-index: -1; background-image: linear-gradient(var(--grid) 1px, transparent 1px), linear-gradient(90deg, var(--grid) 1px, transparent 1px); background-size: 32px 32px; -webkit-mask-image: radial-gradient(120% 80% at 100% 0%, #000, transparent 70%); mask-image: radial-gradient(120% 80% at 100% 0%, #000, transparent 70%); }
#fiat .pm-cards-art { position: absolute; top: clamp(22px, 2.6vw, 34px); inset-inline-end: clamp(22px, 2.6vw, 36px); width: 168px; height: 118px; pointer-events: none; }
#fiat .pm-art-card { position: absolute; width: 150px; height: 94px; border-radius: 14px; border: 1px solid var(--line); box-shadow: var(--shadow-md); transition: transform .8s var(--ease-out); }
#fiat .pm-art-card--b { top: 0; inset-inline-end: 0; background: linear-gradient(135deg, var(--brand-100), var(--surface-2)); transform: rotate(8deg); }
#fiat .pm-art-card--a { bottom: 0; inset-inline-start: 0; background: linear-gradient(135deg, var(--surface), var(--surface-2)); transform: rotate(-5deg); }
#fiat .pm-card--fiat:hover .pm-art-card--b { transform: rotate(11deg) translate3d(4px, -4px, 0); }
#fiat .pm-card--fiat:hover .pm-art-card--a { transform: rotate(-7deg) translate3d(-3px, 2px, 0); }
#fiat .pm-art-band { position: absolute; inset-inline: 0; top: 18px; height: 16px; background: color-mix(in srgb, var(--ink) 14%, transparent); }
#fiat .pm-art-chip { position: absolute; top: 18px; inset-inline-start: 16px; width: 26px; height: 20px; border-radius: 5px; background: linear-gradient(135deg, var(--gold-2), var(--gold)); opacity: .85; }
#fiat .pm-art-wave { position: absolute; top: 19px; inset-inline-end: 16px; width: 18px; height: 18px; border-radius: 50%; border: 2px solid transparent; border-inline-end-color: var(--faint); box-shadow: inset -4px 0 0 -2px transparent; }
#fiat .pm-art-line { position: absolute; bottom: 24px; inset-inline-start: 16px; width: 92px; height: 6px; border-radius: 3px; background: var(--line-strong); }
#fiat .pm-art-line.is-short { bottom: 12px; width: 48px; background: var(--line); }
#fiat .pm-card-k { display: inline-flex; align-items: center; gap: 8px; font-size: 11px; letter-spacing: .06em; color: var(--muted); }
#fiat .pm-card-k i { display: block; width: 18px; height: 1px; background: var(--line-strong); }
#fiat .pm-card-t { margin-top: 14px; font-size: clamp(26px, 2.6vw, 38px); font-weight: 700; line-height: 1.1; letter-spacing: -.03em; color: var(--ink); text-wrap: balance; }
#fiat .pm-card--fiat .pm-card-t { max-width: calc(100% - 170px); }
#fiat .pm-wallets { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: auto; padding-top: 32px; }
#fiat .pm-wallet { display: flex; align-items: center; gap: 12px; min-width: 0; padding: 14px; border-radius: var(--r-md); background: var(--surface-2); border: 1px solid var(--line); transition: transform .45s var(--ease-out), border-color .3s; }
#fiat .pm-wallet:hover { transform: translate3d(0, -2px, 0); border-color: color-mix(in srgb, var(--c) 30%, transparent); }
#fiat .pm-wallet-mark { flex: none; display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%; color: var(--c); background: color-mix(in srgb, var(--c) 10%, var(--surface)); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--c) 22%, transparent); }
#fiat .pm-wallet-mark .pm-glyph { width: 22px; height: 22px; }
#fiat .pm-wallet.pm-c--visa .pm-glyph, #fiat .pm-wallet.pm-c--pm .pm-glyph { width: 30px; height: 30px; }
#fiat .pm-wallet-t { font-size: 15px; font-weight: 600; color: var(--ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#fiat .pm-card--wire { background: var(--grad-ink); border-color: transparent; box-shadow: var(--shadow-lg); color: color-mix(in srgb, var(--on-brand) 74%, transparent); }
#fiat .pm-card--wire .pm-card-k { color: color-mix(in srgb, var(--on-brand) 56%, transparent); margin-top: auto; }
#fiat .pm-card--wire .pm-card-k i { background: color-mix(in srgb, var(--on-brand) 22%, transparent); }
#fiat .pm-card--wire .pm-card-t { color: var(--on-brand); }
#fiat .pm-card-x { margin-top: 12px; font-size: 16px; line-height: 1.6; text-wrap: pretty; }
#fiat .pm-card-x b { color: var(--on-brand); font-family: var(--font-mono); font-weight: 600; }
#fiat .pm-wire-vis { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 120px; margin-bottom: 28px; }
#fiat .pm-wire-ring { position: absolute; inset-inline-start: 36px; top: 50%; border-radius: 50%; border: 1px solid color-mix(in srgb, var(--on-brand) 12%, transparent); transform: translate(-50%, -50%); }
#fiat .pm-wire-ring--1 { width: 112px; height: 112px; }
#fiat .pm-wire-ring--2 { width: 160px; height: 160px; border-style: dashed; }
#fiat .pm-wire-med { position: relative; display: grid; place-items: center; width: 72px; height: 72px; border-radius: 50%; color: var(--on-brand); background: color-mix(in srgb, var(--on-brand) 9%, transparent); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--on-brand) 20%, transparent), 0 16px 40px -12px color-mix(in srgb, var(--brand) 80%, transparent); }
#fiat .pm-wire-med .pm-glyph { width: 32px; height: 32px; }
#fiat .pm-wire-fig { position: relative; font-size: clamp(34px, 3.4vw, 50px); font-weight: 600; line-height: 1; letter-spacing: -.045em; color: var(--on-brand); }
#fiat .pm-wire-fig i { font-style: normal; color: var(--brand-400); }
#fiat .pm-points { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(12px, 1.6vw, 20px); margin-top: clamp(16px, 2vw, 24px); }
#fiat .pm-point { display: flex; align-items: flex-start; gap: 12px; padding: 20px 22px; border-radius: var(--r-md); background: var(--surface); border: 1px solid var(--line); }
#fiat .pm-star { flex: none; width: 18px; height: 18px; margin-top: 2px; fill: var(--brand); }
#fiat .pm-point p { margin: 0; font-size: 14.5px; line-height: 1.55; color: var(--text); text-wrap: pretty; }
#fiat .pm-point b { color: var(--ink); font-family: var(--font-mono); font-weight: 600; }
@media (max-width: 899px) {
  #fiat .pm-fiat-grid, #fiat .pm-points { grid-template-columns: minmax(0, 1fr); }
  #fiat .pm-card { min-height: 0; }
}
@media (max-width: 560px) { #fiat .pm-cards-art { transform: scale(.72); transform-origin: 100% 0; } #fiat .pm-card--fiat .pm-card-t { max-width: calc(100% - 118px); } }
@media (max-width: 420px) {
  #fiat .pm-wallets { grid-template-columns: minmax(0, 1fr); }
  #fiat .pm-wire-ring--2 { display: none; }
}

/* ---------------------------------------------------------------- 04 withdrawal — the cut-off clock + at a glance */
#withdrawal .pm-wd-grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: clamp(40px, 6vw, 96px); align-items: center; }
#withdrawal .chapter-head { margin-bottom: clamp(28px, 3vw, 40px); }
#withdrawal .pm-wd-points { border-top: 1px solid var(--line-strong); }
#withdrawal .pm-wd-point { display: flex; align-items: flex-start; gap: 14px; padding: 16px 0; border-bottom: 1px solid var(--line); }
#withdrawal .pm-wd-ico { flex: none; display: grid; place-items: center; width: 36px; height: 36px; border-radius: 10px; background: var(--brand-50); color: var(--brand); }
#withdrawal .pm-wd-point p { margin: 0; padding-top: 6px; font-size: 15px; line-height: 1.6; color: var(--text); text-wrap: pretty; }
#withdrawal .pm-wd-vis { min-width: 0; }
#withdrawal .pm-clock { position: relative; max-width: 440px; margin-inline: auto; padding: 20px 20px 22px; border-radius: var(--r-xl); background: var(--surface); border: 1px solid var(--line); box-shadow: var(--shadow-lg); }
#withdrawal .pm-clock-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
#withdrawal .pm-clock-t { display: inline-flex; align-items: center; gap: 8px; font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
#withdrawal .pm-clock-t .ico { width: 14px; height: 14px; color: var(--brand); }
#withdrawal .pm-clock-cutl { padding: 4px 9px; border-radius: var(--r-pill); background: var(--surface-2); border: 1px solid var(--line); font-size: 11px; color: var(--ink); }
/*rtl:begin:ignore*/
#withdrawal .pm-clock-face { position: relative; width: 100%; max-width: 340px; aspect-ratio: 1; margin: 12px auto 0; }
#withdrawal .pm-clock-svg { display: block; width: 100%; height: 100%; overflow: visible; }
#withdrawal .pm-clock-plate { fill: var(--surface-2); stroke: var(--line); }
#withdrawal .pm-clock-zone { fill: none; stroke-width: 12; stroke-linecap: round; }
#withdrawal .pm-clock-zone--same { stroke: var(--brand); stroke-dasharray: 1; stroke-dashoffset: 0; }
html.js #withdrawal .pm-clock-zone--same { stroke-dashoffset: 1; transition: stroke-dashoffset 1.6s var(--ease-out) .2s; }
html.js #withdrawal .pm-wd-vis.is-in .pm-clock-zone--same { stroke-dashoffset: 0; }
#withdrawal .pm-clock-zone--next { stroke: var(--line-strong); stroke-width: 8; stroke-dasharray: 1.5 5; stroke-linecap: butt; }
#withdrawal .pm-clock-ticks line { stroke: var(--line-strong); stroke-width: 1; }
#withdrawal .pm-clock-ticks line.is-major { stroke: var(--faint); stroke-width: 1.4; }
#withdrawal .pm-clock-nums text { font-family: var(--font-mono); font-size: 11px; fill: var(--muted); }
#withdrawal .pm-clock-cut { stroke: var(--ink); stroke-width: 2.2; stroke-linecap: round; }
#withdrawal .pm-clock-hand { transform-box: view-box; transform-origin: 50% 50%; transform: rotate(var(--a, 0deg)); opacity: 0; transition: opacity .5s var(--ease-out); }
#withdrawal .pm-clock-hand line { stroke: var(--brand); stroke-width: 2.4; stroke-linecap: round; }
#withdrawal .pm-clock-hand circle { fill: var(--surface); stroke: var(--brand); stroke-width: 2.4; }
#withdrawal .pm-clock.is-next .pm-clock-hand line, #withdrawal .pm-clock.is-next .pm-clock-hand circle { stroke: var(--muted); }
#withdrawal .pm-clock.is-live .pm-clock-hand { opacity: 1; }
#withdrawal .pm-clock-pin { fill: var(--ink); }
#withdrawal .pm-clock-center { position: absolute; inset: 31%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px; border-radius: 50%; background: var(--surface); box-shadow: var(--shadow-sm), inset 0 0 0 1px var(--line); }
#withdrawal .pm-clock-now, #withdrawal .pm-clock-gmt { font-size: 9.5px; letter-spacing: .16em; text-transform: uppercase; color: var(--muted); }
#withdrawal .pm-clock-time { font-size: clamp(22px, 2.4vw, 30px); font-weight: 600; letter-spacing: -.03em; line-height: 1.1; color: var(--ink); }
/*rtl:end:ignore*/
#withdrawal .pm-clock-legend { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 20px; margin-top: 14px; }
#withdrawal .pm-clock-lg { display: inline-flex; align-items: center; gap: 8px; font-size: 12.5px; color: var(--muted); }
#withdrawal .pm-clock-lg i { display: block; width: 16px; height: 4px; border-radius: 2px; }
#withdrawal .pm-clock-lg.is-same i { background: var(--brand); }
#withdrawal .pm-clock-lg.is-next i { background: repeating-linear-gradient(90deg, var(--faint) 0 2px, transparent 2px 5px); }
#withdrawal .pm-clock-status { display: flex; align-items: center; justify-content: center; gap: 8px; width: fit-content; max-width: 100%; margin: 14px auto 0; padding: 9px 16px; border-radius: var(--r-pill); background: var(--brand-50); color: var(--brand-ink); font-size: 13.5px; font-weight: 600; opacity: 0; transition: opacity .5s var(--ease-out); }
#withdrawal .pm-clock.is-live .pm-clock-status { opacity: 1; }
#withdrawal .pm-clock.is-next .pm-clock-status { background: var(--surface-2); color: var(--text); }
#withdrawal .pm-clock-sdot { width: 7px; height: 7px; border-radius: 50%; background: var(--brand); box-shadow: 0 0 0 3px var(--brand-100); }
#withdrawal .pm-clock.is-next .pm-clock-sdot { background: var(--muted); box-shadow: 0 0 0 3px var(--line); }
html:not(.js) #withdrawal .pm-clock-status { display: none; }

#withdrawal .pm-glance { margin-top: clamp(56px, 6vw, 96px); border-radius: var(--r-lg); border: 1px solid var(--line); background: var(--surface); box-shadow: var(--shadow-sm); overflow: hidden; overflow: clip; }
#withdrawal .pm-gl { width: 100%; border-collapse: separate; border-spacing: 0; table-layout: fixed; }
#withdrawal .pm-gl-cap { caption-side: top; padding: 18px 24px 16px; text-align: start; background: var(--surface-2); border-bottom: 1px solid var(--line); }
#withdrawal .pm-gl-cap-t { display: block; font-size: 16px; font-weight: 650; letter-spacing: -.01em; color: var(--ink); }
#withdrawal .pm-gl-cap-s { display: block; margin-top: 3px; font-size: 12.5px; color: var(--muted); }
#withdrawal .pm-gl thead th { padding: 14px 24px; text-align: start; font-family: var(--font-mono); font-size: 11px; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); border-bottom: 1px solid var(--line-strong); }
#withdrawal .pm-gl thead .pm-gl-k0 { width: 18%; border-bottom: 1px solid var(--line-strong); }
#withdrawal .pm-gl tbody th { padding: 18px 24px; vertical-align: top; text-align: start; font-size: 14.5px; font-weight: 600; color: var(--ink); }
#withdrawal .pm-gl tbody td { padding: 18px 24px; vertical-align: top; font-size: 14.5px; line-height: 1.6; color: var(--text); text-wrap: pretty; }
#withdrawal .pm-gl tbody tr + tr > * { border-top: 1px solid var(--line); }
#withdrawal .pm-gl tbody tr:hover > * { background: var(--brand-50); }
@media (max-width: 899px) {
  #withdrawal .pm-wd-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 759px) {
  #withdrawal .pm-gl, #withdrawal .pm-gl tbody, #withdrawal .pm-gl tr, #withdrawal .pm-gl th, #withdrawal .pm-gl td { display: block; }
  #withdrawal .pm-gl thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
  #withdrawal .pm-gl-cap { display: block; }
  #withdrawal .pm-gl tbody tr { padding: 16px 18px; }
  #withdrawal .pm-gl tbody tr + tr { border-top: 1px solid var(--line); }
  #withdrawal .pm-gl tbody tr + tr > * { border-top: 0; }
  #withdrawal .pm-gl tbody th { padding: 0 0 8px; }
  #withdrawal .pm-gl tbody td { padding: 8px 0 0; font-size: 14px; }
  #withdrawal .pm-gl tbody td::before { content: attr(data-label); display: block; margin-bottom: 2px; font-family: var(--font-mono); font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
  #withdrawal .pm-gl tbody tr:hover > * { background: none; }
}

/* ---------------------------------------------------------------- key facts: word values ("Instant", "No limit") stay on one line */
.atropi-tpl-payments #facts .ac-fact-v .num { font-size: clamp(22px, 2vw, 32px); white-space: nowrap; }
.atropi-tpl-payments .pm-word { font-family: var(--font-sans); letter-spacing: 0; font-weight: 700; }

/* ---------------------------------------------------------------- RTL: Arabic-script labels use the sans face (the mono face has no
   Arabic glyphs), no tracking, no uppercase. Market marks, the clock and the orbit stay LTR. */
:root[dir="rtl"] :is(#hero .pm-flow-k, #hero .pm-flow-tab, #hero .pm-rcpt dt, #hero .pm-bal-k, #methods .pm-group, #withdrawal .pm-clock-t,
  #withdrawal .pm-clock-now, #withdrawal .pm-gl thead th, #withdrawal .pm-gl tbody td::before) { font-family: var(--font-sans); letter-spacing: 0; text-transform: none; }
:root[dir="rtl"] :is(#hero .pm-flow-k, #hero .pm-flow-tab, #hero .pm-rcpt dt, #hero .pm-bal-k) { font-size: 11.5px; }
:root[dir="rtl"] :is(#methods .pm-group, #withdrawal .pm-clock-t, #withdrawal .pm-gl thead th, #withdrawal .pm-gl tbody td::before) { font-size: 12.5px; }
:root[dir="rtl"] #withdrawal .pm-clock-now { font-size: 11px; }
:root[dir="rtl"] :is(#fiat .pm-card-x b, #fiat .pm-point b) { font-family: var(--font-sans); font-weight: 700; }

/* shared hero proof strip: Arabic-script labels leave the mono face (component-level RTL gap, worked around here) */
:root[dir="rtl"] #hero .ac-hero-proof li > span { font-family: var(--font-sans); letter-spacing: 0; text-transform: none; font-size: 12px; }

/* ---------------------------------------------------------------- reduced motion */
@media (prefers-reduced-motion: reduce) {
  #hero .pm-pipe-run, #hero .pm-pipe-fill, #hero .pm-chips-ind { transition: none; }
  html.js #withdrawal .pm-clock-zone--same { transition: none; stroke-dashoffset: 0; }
}

/* ---------------------------------------------------------------- ru: word values in the key facts ("Без лимита", "Мгновенно")
   are longer than the mono cell allows — sans face, one step smaller (same treatment as .pm-word in fa/ar) */
html[lang^="ru"] .atropi-tpl-payments #facts .ac-fact-v .num:not([data-count]):only-child { font-family: var(--font-sans); font-weight: 700; letter-spacing: -0.02em; font-size: clamp(20px, 1.7vw, 26px); }