/* ──────────────────────────────────────────────────────────────────────────
 * amir-membership — پوستهٔ مشترکِ صفحاتِ عضویت (معرفی + خرید).
 *
 * چرا این فایل هست: صفحاتِ عضویت صفحهٔ وردپرس‌اند و داخلِ قالبِ twentytwentyfive
 * رندر می‌شوند — یعنی فونتِ لاتینِ Manrope و پالتِ قالب. نتیجه این بود که مسیرِ پول
 * هیچ شباهتی به خودِ اپ («وی‌کلاب») نداشت. این‌جا همان زبانِ بصریِ سایت بازسازی می‌شود:
 * وزیرمتنِ self-hosted + پالتِ سرمه‌ای/مرجانی + همان شعاع‌ها و سایه‌ها.
 *
 * منبعِ توکن‌ها: amir-weclub/includes/app.php (:root) و amir-audio/assets/tokens.css.
 * توکن‌ها عمداً فقط زیرِ ریشه‌های خودمان تعریف می‌شوند تا به تمِ میزبان نشت نکنند.
 * ────────────────────────────────────────────────────────────────────────── */

@font-face{font-family:"Vazirmatn";src:url('fonts/Vazirmatn-Regular.woff2') format('woff2');font-weight:400;font-display:swap;font-style:normal}
@font-face{font-family:"Vazirmatn";src:url('fonts/Vazirmatn-Medium.woff2') format('woff2');font-weight:500;font-display:swap;font-style:normal}
@font-face{font-family:"Vazirmatn";src:url('fonts/Vazirmatn-SemiBold.woff2') format('woff2');font-weight:600;font-display:swap;font-style:normal}
@font-face{font-family:"Vazirmatn";src:url('fonts/Vazirmatn-Bold.woff2') format('woff2');font-weight:700;font-display:swap;font-style:normal}
@font-face{font-family:"Vazirmatn";src:url('fonts/Vazirmatn-ExtraBold.woff2') format('woff2');font-weight:800;font-display:swap;font-style:normal}

#amirSub,#amirSubLanding{
  --font-ui:"Vazirmatn",system-ui,-apple-system,"Segoe UI",Tahoma,sans-serif;
  --signature:linear-gradient(125deg,#1B2F6E 0%,#244AA8 55%,#3B74D6 100%);
  --accent:#1E3A8A; --accent-press:#162B66; --accent-tint:#E8EDF8; --accent-tint-bd:#CCD8EF;
  --dot:#F2674F;
  --ink:#16213A; --ink-2:#4C5670; --ink-3:#6B7283;
  --line:#E6E9F0; --line-2:#DBE0EC;
  --bg:#F4F6FB; --surface:#FFFFFF; --surface-2:#F8FAFD;
  --radius-lg:20px; --radius-md:16px; --radius-sm:12px;
  --sh-1:0 1px 2px rgba(20,30,55,.05),0 4px 12px rgba(20,30,55,.06);
  --sh-2:0 2px 6px rgba(20,30,55,.06),0 14px 34px rgba(20,30,55,.10);
  --accent-glow:0 8px 22px rgba(30,58,138,.30);
  --ok:#12633a; --ok-bg:#E8F7EE; --warn:#8A5A00; --warn-bg:#FFF3E0; --err:#B02121; --err-bg:#FDEAEA;

  font-family:var(--font-ui);
  color:var(--ink);
  line-height:1.9;
  -webkit-font-smoothing:antialiased;
  max-width:900px;
  margin:0 auto;
  text-align:start;
}
#amirSub *,#amirSubLanding *{box-sizing:border-box}

/* ── نوارِ وضعیت (بازگشتِ پرداخت / وضعیتِ عضویت) ───────────────────────────── */
/* T3: همین کلاس‌ها روی **هر دو** صفحه (خرید + معرفی) کار می‌کنند، چون بازگشتِ درگاه
   روی صفحهٔ معرفی می‌نشیند و آن‌جا هم باید نتیجهٔ پرداخت دیده شود. یک تعریف، دو صفحه. */
#amirSub .as-banner,#amirSubLanding .as-banner{display:none;border-radius:var(--radius-md);padding:14px 18px;margin:0 0 20px;
  font-weight:600;font-size:14.5px;border:1px solid transparent;box-shadow:var(--sh-1)}
#amirSub .as-banner.show,#amirSubLanding .as-banner.show{display:block}
#amirSub .as-banner a,#amirSubLanding .as-banner a{color:inherit;font-weight:700}
#amirSub .as-banner small,#amirSubLanding .as-banner small{display:inline-block;margin-top:4px;font-weight:500;opacity:.85}
#amirSub .as-b-info,#amirSubLanding .as-b-info{background:var(--accent-tint);border-color:var(--accent-tint-bd);color:var(--accent)}
#amirSub .as-b-ok,#amirSubLanding .as-b-ok{background:var(--ok-bg);border-color:#CBE8D8;color:var(--ok)}
#amirSub .as-b-warn,#amirSubLanding .as-b-warn{background:var(--warn-bg);border-color:#F2DFBC;color:var(--warn)}
#amirSub .as-b-err,#amirSubLanding .as-b-err{background:var(--err-bg);border-color:#F3CFCF;color:var(--err)}

/* ── شبکهٔ پلن‌ها ──────────────────────────────────────────────────────────── */
#amirSub .as-grid{display:flex;flex-wrap:wrap;gap:16px;justify-content:center;align-items:stretch}
#amirSub .as-load{color:var(--ink-3);padding:26px 4px;font-size:14.5px;text-align:center;width:100%}

#amirSub .as-card{flex:1 1 250px;max-width:330px;display:flex;flex-direction:column;
  background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);
  padding:22px 20px;box-shadow:var(--sh-1);transition:box-shadow .18s,transform .18s,border-color .18s}
#amirSub .as-card:hover{box-shadow:var(--sh-2);transform:translateY(-2px);border-color:var(--line-2)}
#amirSub .as-card h3{margin:0 0 4px;font-size:18px;font-weight:700;color:var(--ink);line-height:1.6}
#amirSub .as-days{color:var(--ink-3);font-size:13px;font-weight:600;margin-bottom:14px}
#amirSub .as-price{font-size:14px;margin-bottom:2px;min-height:21px}
#amirSub .as-price s{color:var(--ink-3);opacity:.75}
#amirSub .as-final{font-size:26px;font-weight:800;color:var(--ink);letter-spacing:-.01em;
  font-variant-numeric:tabular-nums}
#amirSub .as-final small{font-size:13px;font-weight:600;color:var(--ink-3);margin-inline-start:3px}
/* تخفیف تنها جای مرجانی است — لهجهٔ کمیابِ سایت، تا چشم دقیقاً همان‌جا برود. */
#amirSub .as-disc{display:inline-block;background:#FDECE8;color:#C24A31;border:1px solid #F8D6CD;
  font-weight:700;border-radius:999px;padding:3px 12px;font-size:12.5px;margin:9px 0 2px}
#amirSub .as-add{color:var(--ok);font-size:13px;font-weight:700;margin:9px 0 0}
/* «چقدر به‌صرفه‌تر» — سبز، چون خبرِ خوبِ صرفه‌جویی است و با مرجانیِ تخفیف قاطی نشود. */
#amirSub .as-save{margin:10px 0 0;padding:9px 11px;background:var(--ok-bg);border:1px solid #CBE8D8;
  border-radius:var(--radius-sm);font-size:12.5px;font-weight:600;color:var(--ok);line-height:1.75}
#amirSub .as-save b{display:block;font-size:13.5px;font-weight:800;margin-top:2px}
#amirSub .as-buy{margin-top:18px;border:0;border-radius:var(--radius-sm);padding:13px;
  font-family:inherit;font-size:15.5px;font-weight:700;cursor:pointer;color:#fff;
  background:var(--signature);box-shadow:var(--sh-1);transition:filter .15s,box-shadow .18s}
#amirSub .as-buy:hover{filter:brightness(1.07);box-shadow:var(--accent-glow)}
#amirSub .as-buy:focus-visible{outline:3px solid var(--accent-tint-bd);outline-offset:2px}
#amirSub .as-buy[disabled]{opacity:.55;cursor:default;filter:none;box-shadow:var(--sh-1)}
#amirSub .as-note{text-align:center;color:var(--ink-3);font-size:13px;margin-top:22px}

/* ── صفحهٔ معرفی ──────────────────────────────────────────────────────────── */
#amirSubLanding{padding-bottom:36px}
#amirSubLanding .asl-hero{text-align:center;padding:26px 0 6px}
#amirSubLanding .asl-h1{font-size:31px;font-weight:800;margin:0 0 12px;line-height:1.5;
  letter-spacing:-.015em;color:var(--ink);text-wrap:balance}
#amirSubLanding .asl-lead{font-size:16.5px;color:var(--ink-2);margin:0 auto;max-width:60ch;text-wrap:pretty}
#amirSubLanding .asl-sec{margin:34px 0 0}
#amirSubLanding .asl-h2{font-size:19px;font-weight:700;margin:0 0 16px;padding-bottom:10px;
  border-bottom:1px solid var(--line);color:var(--ink);display:flex;align-items:center;gap:9px}
/* نقطهٔ مرجانی به‌عنوانِ نشانهٔ سرفصل — همان لهجه‌ای که اپ در تیترها به کار می‌برد. */
#amirSubLanding .asl-h2::before{content:'';width:7px;height:7px;border-radius:50%;
  background:var(--dot);flex:none}
#amirSubLanding .asl-benefits{list-style:none;margin:0;padding:0;display:grid;gap:10px}
#amirSubLanding .asl-benefits li{display:flex;gap:12px;align-items:flex-start;
  background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-md);
  padding:13px 15px;font-size:15px;box-shadow:var(--sh-1)}
#amirSubLanding .asl-tick{flex:0 0 auto;width:23px;height:23px;border-radius:50%;
  background:var(--accent-tint);color:var(--accent);display:flex;align-items:center;
  justify-content:center;font-size:13px;font-weight:800;margin-top:4px}
#amirSubLanding .asl-plans{display:flex;flex-wrap:wrap;gap:14px}
#amirSubLanding .asl-load{color:var(--ink-3);padding:14px 2px;font-size:14.5px}
#amirSubLanding .asl-plan{flex:1 1 210px;border:1px solid var(--line);border-radius:var(--radius-lg);
  padding:18px;background:var(--surface);box-shadow:var(--sh-1)}
#amirSubLanding .asl-plan-label{font-weight:700;margin-bottom:5px;font-size:15px}
#amirSubLanding .asl-price{font-size:23px;font-weight:800;color:var(--ink);font-variant-numeric:tabular-nums}
#amirSubLanding .asl-price small{font-size:12.5px;font-weight:600;color:var(--ink-3)}
#amirSubLanding .asl-was{color:var(--ink-3);text-decoration:line-through;font-size:13.5px;
  font-weight:500;margin-inline-start:8px}
#amirSubLanding .asl-off{display:inline-block;background:#FDECE8;color:#C24A31;border:1px solid #F8D6CD;
  border-radius:999px;padding:1px 10px;font-size:12px;font-weight:700;margin-inline-start:6px}
#amirSubLanding .asl-period{color:var(--ink-3);font-size:13.5px;font-weight:600;margin-top:2px}
/* پلنِ به‌صرفه‌تر کمی برجسته می‌شود تا انتخاب بی‌فکرکردن هم درست باشد. */
#amirSubLanding .asl-plan--best{border-color:#CBE8D8;box-shadow:var(--sh-2)}
#amirSubLanding .asl-save{margin:10px 0 0;padding:9px 11px;background:var(--ok-bg);
  border:1px solid #CBE8D8;border-radius:var(--radius-sm);font-size:12.5px;font-weight:600;
  color:var(--ok);line-height:1.75}
#amirSubLanding .asl-save b{display:block;font-size:13.5px;font-weight:800;margin-top:2px}
#amirSubLanding .asl-faq-item{border:1px solid var(--line);border-radius:var(--radius-md);
  padding:12px 16px;margin-bottom:9px;background:var(--surface);font-size:15px;box-shadow:var(--sh-1)}
#amirSubLanding .asl-faq-item summary{cursor:pointer;font-weight:600;list-style:none;
  display:flex;align-items:center;gap:9px;color:var(--ink)}
#amirSubLanding .asl-faq-item summary::-webkit-details-marker{display:none}
#amirSubLanding .asl-faq-item summary::before{content:'+';color:var(--accent);font-weight:800;
  font-size:17px;line-height:1;width:15px;flex:none}
#amirSubLanding .asl-faq-item[open] summary::before{content:'–'}
#amirSubLanding .asl-faq-item summary:focus-visible{outline:3px solid var(--accent-tint-bd);
  outline-offset:3px;border-radius:6px}
#amirSubLanding .asl-faq-a{color:var(--ink-2);padding-top:7px;font-size:14.5px}
#amirSubLanding .asl-refund p{color:var(--ink-2);margin:0;font-size:15px}
#amirSubLanding .asl-cta-wrap{text-align:center;margin:38px 0 0}
#amirSubLanding .asl-cta{display:inline-block;background:var(--signature);color:#fff;
  border-radius:var(--radius-md);padding:15px 46px;font-size:17px;font-weight:700;
  text-decoration:none;box-shadow:var(--sh-1);transition:filter .15s,box-shadow .18s}
#amirSubLanding .asl-cta:hover{filter:brightness(1.07);box-shadow:var(--accent-glow);color:#fff}
#amirSubLanding .asl-cta:focus-visible{outline:3px solid var(--accent-tint-bd);outline-offset:3px}

/* حالتِ «به‌زودی» — وقتی هنوز چیزی برای فروش تعریف نشده. */
#amirSubLanding .asl-soon{text-align:center;background:var(--surface);border:1px solid var(--line);
  border-radius:var(--radius-lg);padding:34px 22px;margin:26px 0 0;box-shadow:var(--sh-1)}
#amirSubLanding .asl-soon-badge{display:inline-block;background:var(--accent-tint);
  border:1px solid var(--accent-tint-bd);color:var(--accent);border-radius:999px;
  padding:4px 18px;font-weight:700;font-size:13.5px;margin-bottom:14px}
#amirSubLanding .asl-soon-text{font-size:17px;font-weight:700;margin:0 0 7px;color:var(--ink)}
#amirSubLanding .asl-soon-sub{color:var(--ink-3);margin:0;font-size:15px}

@media(max-width:560px){
  #amirSubLanding .asl-h1{font-size:25px}
  #amirSubLanding .asl-cta{display:block}
  #amirSub .as-card{max-width:none}
}
@media(prefers-reduced-motion:reduce){
  #amirSub .as-card,#amirSub .as-buy,#amirSubLanding .asl-cta{transition:none}
  #amirSub .as-card:hover{transform:none}
}
