<?php
/**
 * STB Deposit & Withdrawal — full bilingual page (EN/FA, RTL-aware)
 * Conventions mirror copy-trading.php / pamm.php (ip- scaffolding + scoped dw- styles).
 */
$lang = stb_lang(); $B = '/NewSite'; $fa = $lang === 'fa';
$dash_url  = $fa ? 'https://crm.stbbrokers.com/fa' : 'https://crm.stbbrokers.com/';
$guide_url = stb_url($B.'/how-to-deposit/'); // placeholder guide route — repoint later
$register_url = $fa ? 'https://crm.stbbrokers.com/fa/register' : 'https://crm.stbbrokers.com/register/';

/* ── METHOD DATA ──
   type: card accent. badge: chip on icon. */
$deposit_methods = $fa ? [
  ['key'=>'top',  'name'=>'Top Change',      'sub'=>'صرافی', 'fee'=>'۰',          'fee_note'=>'بدون کارمزد', 'time'=>'آنی', 'kind'=>'exchange'],
  ['key'=>'farsi','name'=>'Farsi Change',    'sub'=>'صرافی', 'fee'=>'۰',          'fee_note'=>'بدون کارمزد', 'time'=>'آنی', 'kind'=>'exchange'],
  ['key'=>'bep',  'name'=>'USDT BEP20',      'sub'=>'شبکه BSC','fee'=>'۰',         'fee_note'=>'بدون کارمزد', 'time'=>'آنی', 'kind'=>'crypto'],
  ['key'=>'trc',  'name'=>'USDT TRC20',      'sub'=>'شبکه Tron','fee'=>'۰',        'fee_note'=>'بدون کارمزد', 'time'=>'آنی', 'kind'=>'crypto'],
] : [
  ['key'=>'top',  'name'=>'Top Change',      'sub'=>'Exchange', 'fee'=>'0',        'fee_note'=>'No fee',      'time'=>'Instant', 'kind'=>'exchange'],
  ['key'=>'farsi','name'=>'Farsi Change',    'sub'=>'Exchange', 'fee'=>'0',        'fee_note'=>'No fee',      'time'=>'Instant', 'kind'=>'exchange'],
  ['key'=>'bep',  'name'=>'USDT BEP20',      'sub'=>'BSC Network','fee'=>'0',      'fee_note'=>'No fee',      'time'=>'Instant', 'kind'=>'crypto'],
  ['key'=>'trc',  'name'=>'USDT TRC20',      'sub'=>'Tron Network','fee'=>'0',     'fee_note'=>'No fee',      'time'=>'Instant', 'kind'=>'crypto'],
];

$withdraw_methods = $fa ? [
  ['key'=>'top', 'name'=>'Top Change',  'sub'=>'صرافی',     'fee'=>'۲٪',          'fee_note'=>'حداقل کارمزد ۲ دلار', 'time'=>'۱ تا ۲۴ ساعت کاری', 'kind'=>'exchange'],
  ['key'=>'bep', 'name'=>'USDT BEP20',  'sub'=>'شبکه BSC',  'fee'=>'کارمزد شبکه', 'fee_note'=>'کارمزد بلاکچین',      'time'=>'۱ تا ۲۴ ساعت کاری', 'kind'=>'crypto'],
  ['key'=>'trc', 'name'=>'USDT TRC20',  'sub'=>'شبکه Tron', 'fee'=>'کارمزد شبکه', 'fee_note'=>'کارمزد بلاکچین',      'time'=>'۱ تا ۲۴ ساعت کاری', 'kind'=>'crypto'],
] : [
  ['key'=>'top', 'name'=>'Top Change',  'sub'=>'Exchange',    'fee'=>'2%',          'fee_note'=>'Min fee $2',     'time'=>'1–24 working hours', 'kind'=>'exchange'],
  ['key'=>'bep', 'name'=>'USDT BEP20',  'sub'=>'BSC Network', 'fee'=>'Network fee', 'fee_note'=>'Blockchain fee', 'time'=>'1–24 working hours', 'kind'=>'crypto'],
  ['key'=>'trc', 'name'=>'USDT TRC20',  'sub'=>'Tron Network','fee'=>'Network fee', 'fee_note'=>'Blockchain fee', 'time'=>'1–24 working hours', 'kind'=>'crypto'],
];

// SVG glyphs per method kind
function dw_glyph($kind){
  if($kind==='crypto'){
    return '<path d="M12 2v20M7 5h7a3 3 0 010 6H7m0 0h8a3 3 0 010 6H7" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"/>';
  }
  return '<path d="M3 9l9-6 9 6M5 9v10a1 1 0 001 1h12a1 1 0 001-1V9M9 22V12h6v10" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round"/>';
}
?>
<style>
/* ════════════════ DEPOSIT & WITHDRAWAL ════════════════ */
.dw-wrap{background:#04060a;color:#fff;overflow:hidden}

/* HERO */
.dw-hero{position:relative;padding:128px 0 70px;background:#04060a;overflow:hidden}
.dw-hero-inner{max-width:1200px;margin:0 auto;padding:0 24px;position:relative;z-index:5;text-align:center}
.dw-hero-grid{position:absolute;inset:0;background-image:
  linear-gradient(rgba(200,16,46,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(200,16,46,.04) 1px,transparent 1px);
  background-size:56px 56px;mask-image:radial-gradient(ellipse 60% 60% at 50% 35%,#000 20%,transparent 75%);
  animation:dwgrid 26s linear infinite;pointer-events:none}
@keyframes dwgrid{to{transform:translate(56px,56px)}}
.dw-hero-glow{position:absolute;top:-12%;left:50%;transform:translateX(-50%);width:680px;height:480px;
  background:radial-gradient(ellipse,rgba(200,16,46,.10),transparent 65%);filter:blur(10px);pointer-events:none;
  animation:dwglow 9s ease-in-out infinite}
@keyframes dwglow{0%,100%{opacity:.6}50%{opacity:1}}
.dw-kicker{display:inline-flex;align-items:center;gap:9px;font-size:11px;font-weight:800;letter-spacing:.16em;
  text-transform:uppercase;color:rgba(200,16,46,.9);margin-bottom:22px}
.dw-kicker-dot{width:7px;height:7px;border-radius:50%;background:#C8102E;box-shadow:0 0 10px rgba(200,16,46,.8);animation:dwdot 2s infinite}
@keyframes dwdot{0%,100%{opacity:1}50%{opacity:.35}}
.dw-h1{font-size:clamp(36px,5.2vw,60px);font-weight:900;line-height:1.05;letter-spacing:-.03em;margin-bottom:18px}
.dw-h1 em{font-style:normal;color:#C8102E}
.dw-lead{font-size:clamp(15px,1.7vw,18px);color:rgba(255,255,255,.5);line-height:1.7;max-width:560px;margin:0 auto 34px}
.dw-hero-stats{display:flex;gap:40px;justify-content:center;flex-wrap:wrap}
.dw-hs-v{font-size:28px;font-weight:800;color:#fff;line-height:1;font-variant-numeric:tabular-nums}
.dw-hs-v em{font-style:normal;color:#14e0a3}
.dw-hs-l{font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.32);margin-top:8px}

/* TAB SWITCHER */
.dw-tabs-wrap{max-width:1200px;margin:0 auto;padding:0 24px}
.dw-tabs-center{display:flex;justify-content:center;margin-bottom:8px}
.dw-tabs{display:inline-flex;gap:6px;padding:6px;border-radius:16px;background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);position:relative}
.dw-tab{appearance:none;border:0;cursor:pointer;background:transparent;color:rgba(255,255,255,.55);
  font-size:14px;font-weight:700;padding:12px 30px;border-radius:11px;transition:color .25s;position:relative;z-index:2;
  display:inline-flex;align-items:center;gap:9px;font-family:inherit}
.dw-tab svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:2}
.dw-tab.active{color:#fff}
.dw-tab-ind{position:absolute;top:6px;bottom:6px;border-radius:11px;background:linear-gradient(135deg,#C8102E,#e0324d);
  z-index:1;transition:transform .35s cubic-bezier(.4,.1,.2,1),width .35s cubic-bezier(.4,.1,.2,1);
  box-shadow:0 6px 22px rgba(200,16,46,.35)}

/* PANELS */
.dw-panels{max-width:1200px;margin:0 auto;padding:40px 24px 20px}
.dw-panel{display:none}
.dw-panel.active{display:block;animation:dwfade .45s ease}
@keyframes dwfade{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}

.dw-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
@media(max-width:760px){.dw-cards{grid-template-columns:1fr}}

/* METHOD CARD */
.dw-card{position:relative;background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.08);
  border-radius:18px;padding:26px;overflow:hidden;transition:border-color .3s,transform .3s,box-shadow .3s}
.dw-card::before{content:'';position:absolute;top:0;inset-inline-start:0;width:100%;height:2px;
  background:linear-gradient(90deg,#C8102E,transparent);opacity:0;transition:opacity .3s}
.dw-card.crypto::before{background:linear-gradient(90deg,#14e0a3,transparent)}
.dw-card:hover{border-color:rgba(255,255,255,.18);transform:translateY(-4px);box-shadow:0 20px 50px rgba(0,0,0,.45)}
.dw-card:hover::before{opacity:1}
.dw-card-top{display:flex;align-items:center;gap:14px;margin-bottom:22px}
.dw-ico{width:50px;height:50px;border-radius:14px;display:flex;align-items:center;justify-content:center;flex:0 0 auto;
  background:rgba(200,16,46,.1);border:1px solid rgba(200,16,46,.18)}
.dw-card.crypto .dw-ico{background:rgba(20,224,163,.1);border-color:rgba(20,224,163,.2)}
.dw-ico svg{width:24px;height:24px;stroke:#ff5a73;fill:none}
.dw-card.crypto .dw-ico svg{stroke:#14e0a3}
.dw-card-name{font-size:18px;font-weight:700;color:#fff;line-height:1.2}
.dw-card-sub{font-size:12px;color:rgba(255,255,255,.4);margin-top:3px}
.dw-card-badge{margin-inline-start:auto;font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;
  padding:5px 11px;border-radius:20px;background:rgba(20,224,163,.12);color:#14e0a3;white-space:nowrap}
.dw-card-badge.warn{background:rgba(255,191,73,.12);color:#ffbf49}

/* spec rows */
.dw-specs{display:flex;gap:14px;margin-bottom:24px}
.dw-spec{flex:1;background:rgba(0,0,0,.25);border:1px solid rgba(255,255,255,.05);border-radius:12px;padding:14px 16px}
.dw-spec-l{font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.35);margin-bottom:7px;
  display:flex;align-items:center;gap:6px}
.dw-spec-l svg{width:13px;height:13px;stroke:rgba(255,255,255,.4);fill:none;stroke-width:2}
.dw-spec-v{font-size:17px;font-weight:800;color:#fff;line-height:1.1}
.dw-spec-v.free{color:#14e0a3}
.dw-spec-note{font-size:11px;color:rgba(255,255,255,.4);margin-top:4px;font-weight:500}

/* card actions */
.dw-actions{display:flex;gap:10px}
.dw-btn{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 16px;border-radius:11px;
  font-size:13px;font-weight:700;text-decoration:none;transition:transform .16s,box-shadow .16s,background .2s;white-space:nowrap}
.dw-btn svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2}
body.rtl .dw-btn-primary svg{transform:scaleX(-1)}
.dw-btn-primary{background:#C8102E;color:#fff;box-shadow:0 4px 18px rgba(200,16,46,.28)}
.dw-card.crypto .dw-btn-primary{background:#14e0a3;color:#04120e;box-shadow:0 4px 18px rgba(20,224,163,.28)}
.dw-btn-primary:hover{transform:translateY(-2px);box-shadow:0 8px 26px rgba(200,16,46,.4)}
.dw-card.crypto .dw-btn-primary:hover{box-shadow:0 8px 26px rgba(20,224,163,.4)}
.dw-btn-ghost{background:rgba(255,255,255,.05);color:rgba(255,255,255,.8);border:1px solid rgba(255,255,255,.12)}
.dw-btn-ghost:hover{border-color:rgba(255,255,255,.3);color:#fff;transform:translateY(-2px)}

/* summary comparison strip */
.dw-note{max-width:1200px;margin:8px auto 0;padding:0 24px}
.dw-note-box{display:flex;align-items:flex-start;gap:12px;background:rgba(255,255,255,.025);
  border:1px solid rgba(255,255,255,.07);border-radius:14px;padding:18px 20px}
.dw-note-box svg{width:18px;height:18px;flex:0 0 auto;stroke:#14e0a3;fill:none;stroke-width:2;margin-top:1px}
.dw-note-box p{font-size:13px;color:rgba(255,255,255,.5);line-height:1.65;margin:0}

/* reveal */
.js-anim .dw-rev{opacity:0;transform:translateY(24px);transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1)}
.dw-rev.in{opacity:1;transform:none}
.dw-rev.d1{transition-delay:.07s}.dw-rev.d2{transition-delay:.14s}.dw-rev.d3{transition-delay:.21s}.dw-rev.d4{transition-delay:.28s}

/* steps band */
.dw-steps-sec{padding:80px 0;background:#06080c}
.dw-c{max-width:1200px;margin:0 auto;padding:0 24px}
.dw-eyebrow{font-size:11px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:rgba(200,16,46,.85);margin-bottom:14px;text-align:center}
.dw-h2{font-size:clamp(26px,3.4vw,38px);font-weight:800;line-height:1.12;letter-spacing:-.02em;margin-bottom:14px;text-align:center}
.dw-h2 em{font-style:normal;color:#C8102E}
.dw-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:42px}
@media(max-width:760px){.dw-steps{grid-template-columns:1fr}}
.dw-step{background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.07);border-radius:16px;padding:28px 24px;transition:border-color .25s,transform .25s}
.dw-step:hover{border-color:rgba(200,16,46,.3);transform:translateY(-4px)}
.dw-step-n{width:38px;height:38px;border-radius:11px;background:rgba(200,16,46,.12);color:#ff5a73;
  display:flex;align-items:center;justify-content:center;font-weight:800;font-size:15px;margin-bottom:16px}
.dw-step-t{font-size:16px;font-weight:700;color:#fff;margin-bottom:9px}
.dw-step-d{font-size:13px;color:rgba(255,255,255,.46);line-height:1.65}

/* final cta */
.dw-final{position:relative;text-align:center;padding:88px 24px;background:#04060a;overflow:hidden}
.dw-final-glow{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:600px;height:300px;
  background:radial-gradient(ellipse,rgba(200,16,46,.1),transparent 70%);pointer-events:none}
.dw-final h2{font-size:clamp(28px,4vw,44px);font-weight:900;line-height:1.1;margin-bottom:14px;position:relative}
.dw-final p{font-size:16px;color:rgba(255,255,255,.5);max-width:500px;margin:0 auto 30px;position:relative}
.dw-final-cta{display:inline-flex;align-items:center;gap:9px;padding:15px 32px;border-radius:12px;background:#C8102E;color:#fff;
  font-size:15px;font-weight:700;text-decoration:none;box-shadow:0 6px 28px rgba(200,16,46,.32);position:relative;transition:transform .18s}
.dw-final-cta:hover{transform:translateY(-2px)}
.dw-final-cta svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2}
body.rtl .dw-final-cta svg{transform:scaleX(-1)}
</style>

<div class="dw-wrap">

  <!-- ═══ HERO ═══ -->
  <section class="dw-hero">
    <div class="dw-hero-grid"></div>
    <div class="dw-hero-glow"></div>
    <div class="dw-hero-inner">
      <nav class="ip-breadcrumb" style="justify-content:center;margin-bottom:24px;font-size:13px">
        <a href="<?php echo stb_url($B.'/'); ?>"><?php echo $fa?'خانه':'Home'; ?></a>
        <span class="ip-breadcrumb-sep">/</span>
        <span style="color:rgba(255,255,255,.6)"><?php echo $fa?'واریز و برداشت':'Deposit & Withdrawal'; ?></span>
      </nav>
      <div class="dw-kicker"><span class="dw-kicker-dot"></span><?php echo $fa?'STB بروکر · پرداخت‌ها':'STB BROKER · PAYMENTS'; ?></div>
      <h1 class="dw-h1"><?php echo $fa?'واریز فوری. <em>برداشت شفاف</em>':'Instant Deposits. <em>Transparent Withdrawals</em>'; ?></h1>
      <p class="dw-lead"><?php echo $fa?'همه روش‌های واریز و برداشت STB در یک‌جا — با کارمزد و زمان پردازش کاملاً مشخص. بدون کارمزد پنهان.':'Every STB deposit and withdrawal method in one place — with fees and processing times stated up front. No hidden charges.'; ?></p>
      <div class="dw-hero-stats">
        <div><div class="dw-hs-v"><em>0</em></div><div class="dw-hs-l"><?php echo $fa?'کارمزد واریز':'Deposit Fee'; ?></div></div>
        <div><div class="dw-hs-v"><?php echo $fa?'آنی':'Instant'; ?></div><div class="dw-hs-l"><?php echo $fa?'پردازش واریز':'Deposit Processing'; ?></div></div>
        <div><div class="dw-hs-v">4</div><div class="dw-hs-l"><?php echo $fa?'روش پرداخت':'Payment Methods'; ?></div></div>
        <div><div class="dw-hs-v">USDT</div><div class="dw-hs-l"><?php echo $fa?'BEP20 · TRC20':'BEP20 · TRC20'; ?></div></div>
      </div>
    </div>
  </section>

  <!-- ═══ TABS ═══ -->
  <div class="dw-tabs-wrap">
    <div class="dw-tabs-center">
    <div class="dw-tabs" role="tablist">
      <span class="dw-tab-ind" id="dwInd"></span>
      <button class="dw-tab active" data-tab="deposit" role="tab" aria-selected="true">
        <svg viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round"><path d="M12 5v14M5 12l7 7 7-7"/></svg>
        <?php echo $fa?'واریز':'Deposit'; ?>
      </button>
      <button class="dw-tab" data-tab="withdraw" role="tab" aria-selected="false">
        <svg viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round"><path d="M12 19V5M5 12l7-7 7 7"/></svg>
        <?php echo $fa?'برداشت':'Withdrawal'; ?>
      </button>
    </div>
    </div>
  </div>

  <!-- ═══ PANELS ═══ -->
  <div class="dw-panels">

    <!-- DEPOSIT -->
    <div class="dw-panel active" id="panel-deposit" role="tabpanel">
      <div class="dw-cards">
        <?php foreach($deposit_methods as $i=>$m): ?>
        <div class="dw-card <?php echo $m['kind']; ?> dw-rev d<?php echo ($i%4)+1; ?>">
          <div class="dw-card-top">
            <div class="dw-ico"><svg viewBox="0 0 24 24"><?php echo dw_glyph($m['kind']); ?></svg></div>
            <div>
              <div class="dw-card-name"><?php echo esc_html($m['name']); ?></div>
              <div class="dw-card-sub"><?php echo esc_html($m['sub']); ?></div>
            </div>
            <span class="dw-card-badge"><?php echo $fa?'آنی':'Instant'; ?></span>
          </div>
          <div class="dw-specs">
            <div class="dw-spec">
              <div class="dw-spec-l"><svg viewBox="0 0 24 24"><circle cx="12" cy="12" r="9"/><path d="M9 9h6M9 12h6M10 15h4"/></svg><?php echo $fa?'کارمزد':'Fee'; ?></div>
              <div class="dw-spec-v free"><?php echo esc_html($m['fee']); ?></div>
              <div class="dw-spec-note"><?php echo esc_html($m['fee_note']); ?></div>
            </div>
            <div class="dw-spec">
              <div class="dw-spec-l"><svg viewBox="0 0 24 24"><circle cx="12" cy="12" r="9"/><path d="M12 7v5l3 2"/></svg><?php echo $fa?'زمان پردازش':'Processing'; ?></div>
              <div class="dw-spec-v"><?php echo esc_html($m['time']); ?></div>
              <div class="dw-spec-note"><?php echo $fa?'تأیید سریع':'Fast confirmation'; ?></div>
            </div>
          </div>
          <div class="dw-actions">
            <a href="<?php echo esc_url($dash_url); ?>" class="dw-btn dw-btn-primary"><?php echo $fa?'واریز کنید':'Deposit Now'; ?>
              <svg viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M12 5l7 7-7 7"/></svg></a>
            <a href="<?php echo esc_url($guide_url); ?>" class="dw-btn dw-btn-ghost"><?php echo $fa?'راهنمای واریز':'How to Deposit'; ?></a>
          </div>
        </div>
        <?php endforeach; ?>
      </div>
      <div class="dw-note">
        <div class="dw-note-box dw-rev">
          <svg viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><path d="M12 16v-4M12 8h.01"/></svg>
          <p><?php echo $fa?'تمام واریزها بدون کارمزد و به‌صورت آنی پردازش می‌شوند. مبلغ واریز پس از تأیید بلافاصله در حساب معاملاتی شما قابل استفاده است.':'All deposits are processed instantly with zero fee. Funds are available in your trading account immediately after confirmation.'; ?></p>
        </div>
      </div>
    </div>

    <!-- WITHDRAW -->
    <div class="dw-panel" id="panel-withdraw" role="tabpanel">
      <div class="dw-cards">
        <?php foreach($withdraw_methods as $i=>$m): ?>
        <div class="dw-card <?php echo $m['kind']; ?> dw-rev d<?php echo ($i%4)+1; ?>">
          <div class="dw-card-top">
            <div class="dw-ico"><svg viewBox="0 0 24 24"><?php echo dw_glyph($m['kind']); ?></svg></div>
            <div>
              <div class="dw-card-name"><?php echo esc_html($m['name']); ?></div>
              <div class="dw-card-sub"><?php echo esc_html($m['sub']); ?></div>
            </div>
            <span class="dw-card-badge warn"><?php echo $fa?'۱–۲۴ ساعت':'1–24 hrs'; ?></span>
          </div>
          <div class="dw-specs">
            <div class="dw-spec">
              <div class="dw-spec-l"><svg viewBox="0 0 24 24"><circle cx="12" cy="12" r="9"/><path d="M9 9h6M9 12h6M10 15h4"/></svg><?php echo $fa?'کارمزد':'Fee'; ?></div>
              <div class="dw-spec-v"><?php echo esc_html($m['fee']); ?></div>
              <div class="dw-spec-note"><?php echo esc_html($m['fee_note']); ?></div>
            </div>
            <div class="dw-spec">
              <div class="dw-spec-l"><svg viewBox="0 0 24 24"><circle cx="12" cy="12" r="9"/><path d="M12 7v5l3 2"/></svg><?php echo $fa?'زمان پردازش':'Processing'; ?></div>
              <div class="dw-spec-v" style="font-size:14px"><?php echo esc_html($m['time']); ?></div>
              <div class="dw-spec-note"><?php echo $fa?'روزهای کاری':'Working days'; ?></div>
            </div>
          </div>
          <div class="dw-actions">
            <a href="<?php echo esc_url($dash_url); ?>" class="dw-btn dw-btn-primary"><?php echo $fa?'برداشت کنید':'Withdraw Now'; ?>
              <svg viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M12 5l7 7-7 7"/></svg></a>
            <a href="<?php echo esc_url($guide_url); ?>" class="dw-btn dw-btn-ghost"><?php echo $fa?'راهنمای برداشت':'How to Withdraw'; ?></a>
          </div>
        </div>
        <?php endforeach; ?>
      </div>
      <div class="dw-note">
        <div class="dw-note-box dw-rev">
          <svg viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><path d="M12 16v-4M12 8h.01"/></svg>
          <p><?php echo $fa?'برداشت‌ها در روزهای کاری بین ۱ تا ۲۴ ساعت پردازش می‌شوند. کارمزد شبکه USDT بسته به ازدحام بلاکچین متغیر است و توسط شبکه تعیین می‌شود — نه STB.':'Withdrawals are processed within 1–24 working hours. USDT network fees vary with blockchain congestion and are set by the network — not by STB.'; ?></p>
        </div>
      </div>
    </div>

  </div>

  <!-- ═══ HOW IT WORKS ═══ -->
  <section class="dw-steps-sec">
    <div class="dw-c">
      <div class="dw-eyebrow dw-rev"><?php echo $fa?'فرآیند':'PROCESS'; ?></div>
      <h2 class="dw-h2 dw-rev d1"><?php echo $fa?'تأمین حساب در <em>سه گام</em>':'Fund Your Account in <em>Three Steps</em>'; ?></h2>
      <div class="dw-steps">
        <?php
        $steps = $fa ? [
          ['1','وارد داشبورد شوید','به حساب کاربری STB خود وارد شوید و بخش واریز/برداشت را باز کنید.'],
          ['2','روش را انتخاب کنید','روش مورد نظر را انتخاب و مبلغ را وارد کنید. کارمزد و زمان پردازش پیش از تأیید نمایش داده می‌شود.'],
          ['3','تأیید و انجام','تراکنش را تأیید کنید. واریزها آنی و برداشت‌ها طی ۱ تا ۲۴ ساعت کاری پردازش می‌شوند.'],
        ] : [
          ['1','Open your dashboard','Log in to your STB account and open the Deposit / Withdrawal section.'],
          ['2','Choose a method','Select a method and enter the amount. Fee and processing time are shown before you confirm.'],
          ['3','Confirm & done','Confirm the transaction. Deposits are instant; withdrawals process within 1–24 working hours.'],
        ];
        foreach($steps as $i=>$s): ?>
        <div class="dw-step dw-rev d<?php echo $i+1; ?>">
          <div class="dw-step-n"><?php echo esc_html($s[0]); ?></div>
          <div class="dw-step-t"><?php echo esc_html($s[1]); ?></div>
          <div class="dw-step-d"><?php echo esc_html($s[2]); ?></div>
        </div>
        <?php endforeach; ?>
      </div>
    </div>
  </section>

  <!-- ═══ FINAL CTA ═══ -->
  <section class="dw-final">
    <div class="dw-final-glow"></div>
    <h2><?php echo $fa?'آماده شروع هستید؟':'Ready to fund your account?'; ?></h2>
    <p><?php echo $fa?'واریز آنی و بدون کارمزد. از داشبورد خود در چند ثانیه شروع کنید.':'Instant, zero-fee deposits. Get started from your dashboard in seconds.'; ?></p>
    <a href="<?php echo esc_url($dash_url); ?>" class="dw-final-cta"><?php echo $fa?'رفتن به داشبورد':'Go to Dashboard'; ?>
      <svg viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M12 5l7 7-7 7"/></svg></a>
  </section>

</div>

<script>
(function(){
  // reveal
  var io=new IntersectionObserver(function(es){es.forEach(function(e){if(e.isIntersecting){e.target.classList.add('in');io.unobserve(e.target);}});},{threshold:.12});
  document.querySelectorAll('.dw-rev').forEach(function(el){io.observe(el);});

  // tabs
  var tabs=document.querySelectorAll('.dw-tab'),ind=document.getElementById('dwInd');
  var panels={deposit:document.getElementById('panel-deposit'),withdraw:document.getElementById('panel-withdraw')};
  function moveInd(btn){ind.style.width=btn.offsetWidth+'px';ind.style.left=btn.offsetLeft+'px';}
  function activate(btn){
    tabs.forEach(function(t){t.classList.remove('active');t.setAttribute('aria-selected','false');});
    btn.classList.add('active');btn.setAttribute('aria-selected','true');
    Object.values(panels).forEach(function(p){p.classList.remove('active');});
    panels[btn.dataset.tab].classList.add('active');
    moveInd(btn);
    // re-trigger reveal for newly shown cards
    panels[btn.dataset.tab].querySelectorAll('.dw-rev').forEach(function(el){el.classList.add('in');});
  }
  tabs.forEach(function(t){t.addEventListener('click',function(){activate(t);});});
  // init indicator position (after layout)
  function init(){var a=document.querySelector('.dw-tab.active');if(a)moveInd(a);}
  if(document.readyState!=='loading')init();else document.addEventListener('DOMContentLoaded',init);
  window.addEventListener('resize',function(){var a=document.querySelector('.dw-tab.active');if(a)moveInd(a);});
  // RTL: indicator uses offsetLeft which is correct in RTL too; nudge after fonts load
  setTimeout(init,150);
})();
</script>
