/* ══════════════════════════════════════════════════════════════
   بطاقات الباقات (partials/pack-cards) — ملف واحد للصفحتين:
   /studio (studio.css) و /studio/app/buy (studio-app.css). يعتمد على متغيرات الألوان
   المعرّفة في الملفين بالأسماء نفسها: --ink --mut --line --card --soft --tint --brand --brand-d --btn --btn-ink --shadow.
   ══════════════════════════════════════════════════════════════ */
.spk-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(176px,1fr));gap:16px;max-width:1080px;margin:0 auto}
.spk{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;margin:0;
  background:var(--card);border:1px solid var(--line);border-radius:14px;padding:26px 18px 18px;
  transition:transform .2s ease,box-shadow .2s ease}
.spk:hover{transform:translateY(-2px);box-shadow:var(--shadow)}
.spk--hot{border-color:var(--ink);box-shadow:0 0 0 1px var(--ink)}
.spk__badge{position:absolute;top:-13px;inset-inline-start:50%;transform:translateX(50%);white-space:nowrap;
  background:var(--tint);color:var(--brand-d);font-size:13px;font-weight:600;padding:2px 14px;border-radius:999px}
[dir="ltr"] .spk__badge{transform:translateX(-50%)}
.spk__name{font-size:15px;font-weight:600;color:var(--mut);margin-bottom:8px;text-wrap:balance}

.spk__step{display:flex;align-items:center;justify-content:center;gap:6px}
.spk__btn{width:32px;height:32px;flex:none;border-radius:50%;border:1px solid var(--line);background:var(--card);color:var(--ink);
  font-family:inherit;font-weight:600;font-size:20px;line-height:1;padding:0;display:grid;place-items:center;
  cursor:pointer;touch-action:manipulation;user-select:none;transition:border-color .15s,background .15s}
.spk__btn:hover:not(:disabled){border-color:var(--ink);background:var(--soft)}
.spk__btn:disabled{opacity:.3;cursor:not-allowed}
.spk__btn:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
.spk__n{width:86px;min-width:0;text-align:center;font-family:inherit;font-weight:600;font-size:34px;line-height:1.15;
  color:var(--ink);background:transparent;border:0;border-bottom:2px solid transparent;padding:0;
  -moz-appearance:textfield;font-variant-numeric:tabular-nums}
.spk__n::-webkit-inner-spin-button,.spk__n::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.spk__n:focus{outline:none;border-bottom-color:var(--ink)}
.spk__unit{font-size:15px;color:var(--mut)}
.spk__ex{color:var(--brand-d);font-weight:600}

.spk__price{width:100%;margin-top:14px;padding-top:14px;border-top:1px solid var(--line);font-size:22px;font-weight:600;color:var(--ink)}
.spk__tot{font-weight:600;font-variant-numeric:tabular-nums}
.spk__note{font-size:14px;color:var(--mut);margin-top:4px}

/* الزر أسفل البطاقة على خط واحد في كل البطاقات، وبينه وبين ما فوقه مسافة ثابتة */
.spk > :nth-last-child(2){margin-bottom:18px}
.spk__buy{margin-top:auto;width:100%;padding:10px 16px;border-radius:8px;cursor:pointer;
  font-family:inherit;font-weight:600;font-size:16px;line-height:1.5;
  background:var(--card);color:var(--ink);border:1px solid var(--line);transition:border-color .15s,opacity .15s,transform .15s}
.spk__buy:hover:not(:disabled){border-color:var(--ink)}
.spk--hot .spk__buy{background:var(--btn);color:var(--btn-ink);border-color:var(--btn)}
.spk--hot .spk__buy:hover:not(:disabled){opacity:.92;transform:translateY(-1px)}
.spk__buy:disabled{opacity:.6;cursor:progress}

@media (max-width:820px){
  .spk-grid{max-width:420px;grid-template-columns:1fr}
}

/* محاولات الباقة المجانية (2026-10-25) */
.spk__tries{display:inline-block;align-self:center;padding:1px 12px;border-radius:999px;font-size:13.5px;font-weight:600;
  color:inherit;background:color-mix(in srgb,currentColor 9%,transparent)}

/* ── لسانا الأسعار (شراء لمرة | اشتراك) وبطاقات الاشتراك الشهري/السنوي — قرار المالك 2026-10-26 ── */
.ptabs{display:flex;gap:4px;width:max-content;max-width:100%;margin:0 auto 26px;padding:5px;border:1px solid var(--line);border-radius:999px;background:var(--card)}
.ptabs__t{display:inline-flex;align-items:center;gap:8px;border:0;background:transparent;color:var(--mut);font:inherit;font-weight:600;font-size:15px;
  padding:9px 22px;border-radius:999px;cursor:pointer;white-space:nowrap}
.ptabs__t.on{background:var(--btn);color:var(--btn-ink)}
.ptabs__tag{font-size:12px;font-weight:600;padding:1px 9px;border-radius:999px;background:var(--tint);color:var(--brand-d)}
.ptabs__t.on .ptabs__tag{background:rgba(255,255,255,.2);color:inherit}
.spc .spc__intro{text-align:center;color:var(--mut);max-width:640px;margin:0 auto 14px}
.spc__cycle{display:flex;gap:4px;width:max-content;margin:0 auto 22px;padding:4px;border:1px solid var(--line);border-radius:10px;background:var(--soft)}
.spc__cycle button{border:0;background:transparent;color:var(--mut);font:inherit;font-weight:600;font-size:14px;padding:6px 16px;border-radius:7px;cursor:pointer}
.spc__cycle button.on{background:var(--card);color:var(--ink);box-shadow:0 1px 4px rgba(0,0,0,.08)}
.spc__cycle span{font-size:12px;color:var(--brand-d);margin-inline-start:4px}
.spk-subs{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;max-width:860px;margin:0 auto}
.spc__pts{font-size:34px;font-weight:600;line-height:1.15;color:var(--ink)}
.spc__was{font-size:13.5px;color:var(--mut);margin-top:2px}
.spc__was s{opacity:.85}
.spc .spk > .spc__foot{margin-top:auto;margin-bottom:0;width:100%;display:flex;flex-direction:column;align-items:center}
.spc__foot .spk__price small{font-size:14px;font-weight:500;color:var(--mut)}
.spc__foot .spk__buy{margin-top:16px;display:block;text-align:center;text-decoration:none;color:var(--ink)}
.spc .spk--hot .spc__foot .spk__buy{color:var(--btn-ink)}
.spc__foot .spk__buy--off{opacity:.55;cursor:default}
.spc[data-cycle="month"] [data-c="year"],.spc[data-cycle="year"] [data-c="month"]{display:none!important}
.spc .spc__fine{text-align:center;font-size:13.5px;color:var(--mut);margin:14px auto 0;max-width:640px}
@media (max-width:560px){.ptabs__t{padding:8px 14px;font-size:14px}.ptabs__tag{display:none}}
