/**
 * استایل طرح آکادمی (صفحهٔ نخست جدید).
 * توکن‌های دیزاین (--primary, --surface, …) به توکن‌های قالب (--bm-*) نگاشت می‌شوند
 * تا کل markup مو‌به‌مو بدون ویرایش با حالت روشن/تیرهٔ قالب کار کند.
 */
.pg-home {
    --bg: var(--bm-bg);
    --surface: var(--bm-surface);
    --surface-2: var(--bm-surface-2);
    --border: var(--bm-border);
    --border-strong: var(--bm-border-strong, var(--bm-border));
    --text: var(--bm-text);
    --text-2: var(--bm-text-sub);
    --text-3: var(--bm-text-mute);
    --primary: var(--bm-primary);
    --primary-hover: var(--bm-primary-hover);
    --primary-dark: var(--bm-primary-dark);
    --primary-soft: var(--bm-primary-soft);
    --secondary: var(--bm-secondary);
    --secondary-soft: var(--bm-secondary-soft);
    --accent: var(--bm-accent);
    --accent-soft: var(--bm-accent-soft);
    --success: var(--bm-success);
    --success-soft: var(--bm-success-soft, rgba(16,185,129,.12));
    --error: var(--bm-error, #EF4444);
    --shadow-sm: var(--bm-shadow-sm, 0 1px 2px rgba(15,23,42,.06));
    --shadow-md: var(--bm-shadow-md, 0 4px 14px rgba(15,23,42,.07));
    --shadow-lg: var(--bm-shadow-lg, 0 14px 34px rgba(15,23,42,.10));
    --shadow-xl: var(--bm-shadow-xl, 0 24px 56px rgba(15,23,42,.14));
    --shadow-primary: var(--bm-shadow-primary, 0 10px 24px rgba(79,70,229,.32));
    background: var(--bg);
    color: var(--text);
    overflow-x: hidden;
}
.pg-home * { box-sizing: border-box; }

/* کیفریم‌ها */
@keyframes pg-float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-16px); } }
@keyframes pg-float2 { 0%,100% { transform: translateY(0); } 50% { transform: translateY(13px); } }
@keyframes pg-pulse { 0%,100% { opacity: .5; transform: scale(1); } 50% { opacity: 1; transform: scale(1.12); } }
@keyframes pg-marquee { from { transform: translateX(0); } to { transform: translateX(50%); } }
@keyframes pg-drift { 0%,100% { transform: translate(0,0); } 50% { transform: translate(24px,-24px); } }

/* مارکی */
.pg-marquee-track { display: flex; width: max-content; animation: pg-marquee 26s linear infinite; }
.pg-marquee:hover .pg-marquee-track { animation-play-state: paused; }

/* FAQ */
.pg-faq-a { max-height: 0; overflow: hidden; transition: max-height .3s ease; }
.pg-faq-item.is-open .pg-faq-a { max-height: 420px; }
.pg-faq-item.is-open .pg-faq-icon { background: var(--primary); color: #fff; }
.pg-faq-item.is-open { border-color: var(--primary); box-shadow: var(--shadow-md); }
.pg-faq-q { cursor: pointer; }

/* ===================== ریسپانسیو (روی گریدهای inline دیزاین) ===================== */
@media (max-width: 980px) {
    .pg-home [style*="grid-template-columns:1.02fr .98fr"],
    .pg-home [style*="grid-template-columns:.9fr 1.1fr"],
    .pg-home [style*="grid-template-columns:1.15fr .85fr"],
    .pg-home [style*="grid-template-columns:1fr 1.12fr 1fr"] { grid-template-columns: 1fr !important; }
    .pg-home [style*="grid-template-columns:repeat(6,1fr)"],
    .pg-home [style*="grid-template-columns:repeat(4,1fr)"],
    .pg-home [style*="grid-template-columns:repeat(3,1fr)"] { grid-template-columns: repeat(2, 1fr) !important; }
    /* خط اتصال «۴ قدم» در حالت ستونی مزاحم نشود */
    .pg-home [style*="repeating-linear-gradient(90deg"] { display: none !important; }
}
@media (max-width: 640px) {
    .pg-home [style*="grid-template-columns:repeat(6,1fr)"],
    .pg-home [style*="grid-template-columns:repeat(4,1fr)"],
    .pg-home [style*="grid-template-columns:repeat(3,1fr)"],
    .pg-home [style*="grid-template-columns:repeat(2,1fr)"],
    .pg-home [style*="grid-template-columns:1fr 1fr"] { grid-template-columns: 1fr !important; }
    .pg-home section > div { padding-left: 18px !important; padding-right: 18px !important; }
    .pg-home h1 { font-size: 34px !important; }
}


/* ============================================================
   سکشن اپلیکیشن موبایل — بازطراحی کاربر (Claude Design)
   کل استایل زیر .pg-app2 اسکوپ شده تا با بقیه‌ی سایت تداخل/نشت نداشته باشد.
   ریست‌های سراسری و دکمه‌ی تاگل و لینک فونت حذف شدند.
   ============================================================ */
.pg-app2{
  --bg:#f3f4fa; --bg-2:#ffffff;
  --surface:rgba(20,22,50,.035); --surface-solid:#ffffff;
  --border:rgba(20,22,50,.09); --border-strong:rgba(20,22,50,.14);
  --text:#12142a; --text-dim:#5c6180; --text-faint:#8b90ac;
  --accent:#6a5bf0; --accent-2:#3f7ef2; --accent-3:#0eab86; --accent-gold:#dd9a15;
  --shadow-color:230 40% 70%;
  --bezel:linear-gradient(155deg,#3a3f5c,#14172a 55%,#282c46);
  --phone-bg-1:#161c34; --phone-bg-2:#0d1226;
  --phone-card:rgba(255,255,255,.065); --phone-card-strong:rgba(255,255,255,.11);
  --phone-border:rgba(255,255,255,.13);
  --phone-text:#f4f6fd; --phone-text-dim:#a6adc9; --phone-text-faint:#6b7392;
}
:root[data-theme="dark"] .pg-app2{
  --bg:#080b14; --bg-2:#0d1220;
  --surface:rgba(255,255,255,.045); --surface-solid:#12172a;
  --border:rgba(255,255,255,.08); --border-strong:rgba(255,255,255,.14);
  --text:#eef1fb; --text-dim:#f2f5fc; --text-faint:#dbe1f0;
  --accent:#7c6cf6; --accent-2:#4f8cff; --accent-3:#22d3aa; --accent-gold:#f2b134;
  --shadow-color:235 60% 3%;
  --bezel:linear-gradient(155deg,#2a2f45,#0c0f1c 55%,#1a1e30);
}

.pg-app2{ background:var(--bg); }

.pg-app2{
    position:relative;
    overflow:hidden;
    padding:110px 24px 120px;
  }
.pg-app2 .decor-blob{
    position:absolute; border-radius:50%;
    filter:blur(90px);
    opacity:.35;
    pointer-events:none;
  }
.pg-app2 .decor-blob.two{
    width:420px; height:420px; background:var(--accent-2);
    bottom:-160px; right:-100px; opacity:.12;
  }
.pg-app2 .decor-grid{
    position:absolute; inset:0;
    background-image: radial-gradient(var(--border-strong) 1px, transparent 1px);
    background-size: 34px 34px;
    -webkit-mask-image: radial-gradient(ellipse 60% 50% at 50% 40%, black 10%, transparent 70%);
    mask-image: radial-gradient(ellipse 60% 50% at 50% 40%, black 10%, transparent 70%);
    opacity:.5;
    pointer-events:none;
  }
.pg-app2 .container{
    max-width:1180px; margin:0 auto;
    display:grid; grid-template-columns: 0.95fr 1.05fr;
    gap:56px; align-items:center;
    position:relative; z-index:2;
    width:100%;
  }
.pg-app2 .text-col, .pg-app2 .phone-col{ min-width:0; }
.pg-app2 .text-col{ order:2; }
.pg-app2 .phone-col{ order:1; }
.pg-app2 .eyebrow{
    display:inline-flex; align-items:center; gap:8px;
    font-size:13px; font-weight:600; color:var(--accent);
    background:linear-gradient(90deg, color-mix(in srgb, var(--accent) 16%, transparent), transparent);
    border:1px solid color-mix(in srgb, var(--accent) 30%, transparent);
    padding:7px 16px 7px 12px; border-radius:999px;
    margin-bottom:22px;
  }
.pg-app2 .eyebrow .dot{
    width:6px; height:6px; border-radius:50%; background:var(--accent);
    box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 25%, transparent);
  }
.pg-app2 h1.headline{
    font-size:47px; font-weight:800; line-height:1.18;
    letter-spacing:-0.5px;
    margin-bottom:20px;
  }
.pg-app2 h1.headline .grad{
    background:linear-gradient(95deg, var(--accent), var(--accent-2));
    -webkit-background-clip:text; background-clip:text; color:transparent;
  }
.pg-app2 p.lead{
    font-size:16.5px; line-height:2; color:var(--text-dim);
    max-width:480px; margin-bottom:42px;
  }
.pg-app2 .features{
    list-style:none; display:flex; flex-direction:column;
    margin-bottom:40px;
    background:var(--surface); border:1px solid var(--border);
    border-radius:20px; overflow:hidden;
  }
.pg-app2 .feature-item{
    display:flex; align-items:flex-start; gap:16px;
    padding:19px 20px;
    border-bottom:1px solid var(--border);
  }
.pg-app2 .feature-item:last-child{ border-bottom:none; }
.pg-app2 .feature-icon{
    flex-shrink:0; width:46px; height:46px; border-radius:14px;
    display:flex; align-items:center; justify-content:center;
    border:1px solid var(--border);
  }
.pg-app2 .feature-icon svg{ width:21px; height:21px; }
.pg-app2 .feature-icon.violet{ background:color-mix(in srgb, var(--accent) 14%, transparent); }
.pg-app2 .feature-icon.violet svg{ stroke:var(--accent); }
.pg-app2 .feature-icon.blue{ background:color-mix(in srgb, var(--accent-2) 14%, transparent); }
.pg-app2 .feature-icon.blue svg{ stroke:var(--accent-2); }
.pg-app2 .feature-icon.gold{ background:color-mix(in srgb, var(--accent-gold) 16%, transparent); }
.pg-app2 .feature-icon.gold svg{ stroke:var(--accent-gold); }
.pg-app2 .feature-icon.green{ background:color-mix(in srgb, var(--accent-3) 15%, transparent); }
.pg-app2 .feature-icon.green svg{ stroke:var(--accent-3); }
.pg-app2 .feature-text h3{ font-size:16.5px; font-weight:700; margin-bottom:6px; }
.pg-app2 .feature-text p{ font-size:14px; line-height:1.9; color:var(--text-dim); max-width:400px; }
.pg-app2 .store-buttons{ display:flex; gap:14px; flex-wrap:wrap; }
.pg-app2 .store-buttons--mob{ display:none; } /* نسخه‌ی موبایلِ باکس‌های دانلود؛ فقط در ≤1080 نمایش داده می‌شود */
.pg-app2 .store-btn{
    display:flex; align-items:center; gap:10px;
    background:var(--surface-solid); border:1px solid var(--border);
    padding:12px 20px; border-radius:14px;
    transition:.25s; cursor:pointer;
  }
.pg-app2 .store-btn:hover{ border-color:var(--accent); transform:translateY(-2px); }
.pg-app2 .store-btn svg{ width:22px; height:22px; }
.pg-app2 .store-btn .labels{ display:flex; flex-direction:column; align-items:flex-start; line-height:1.3; }
.pg-app2 .store-btn .labels span:first-child{ font-size:10.5px; color:var(--text-faint); }
.pg-app2 .store-btn .labels span:last-child{ font-size:14px; font-weight:700; }
.pg-app2 .phone-col{ position:relative; display:flex; justify-content:center; }
.pg-app2 .phone-glow{
    position:absolute; width:340px; height:340px; border-radius:50%;
    background:radial-gradient(circle, var(--accent) 0%, transparent 70%);
    opacity:.28; filter:blur(50px); top:50%; left:50%;
    transform:translate(-50%,-50%);
  }
.pg-app2 .phone-frame{
    position:relative; width:min(266px, 100%); padding:12px;
    border-radius:42px; background:var(--bezel);
    box-shadow:
      0 36px 70px -20px hsl(var(--shadow-color) / .55),
      0 0 0 1px var(--border-strong) inset;
  }
.pg-app2 .phone-notch{
    position:absolute; top:12px; left:50%; transform:translateX(-50%);
    width:78px; height:19px; background:#000; border-radius:0 0 14px 14px;
    z-index:5;
  }
.pg-app2 .phone-screen{
    position:relative;
    background:linear-gradient(165deg, var(--phone-bg-1) 0%, var(--phone-bg-2) 65%, #080b18 100%);
    border-radius:30px;
    overflow:hidden;
    padding:28px 13px 18px;
    display:flex; flex-direction:column; gap:10px;
    color:var(--phone-text);
  }
.pg-app2 .screen-nav{ display:flex; align-items:center; justify-content:space-between; padding:0 3px; }
.pg-app2 .screen-nav svg{ width:17px; height:17px; stroke:var(--phone-text-dim); }
.pg-app2 .screen-nav .title{ text-align:center; }
.pg-app2 .screen-nav .title .t1{ font-size:12px; font-weight:700; color:var(--phone-text); }
.pg-app2 .screen-nav .title .t2{ font-size:9.5px; color:var(--phone-text-faint); margin-top:2px; }
.pg-app2 .video-card{
    position:relative; border-radius:18px; overflow:hidden;
    background:linear-gradient(135deg, var(--accent) 0%, var(--accent-2) 100%);
    padding:14px; min-height:130px;
    display:flex; flex-direction:column; justify-content:space-between;
  }
.pg-app2 .video-card::before{
    content:''; position:absolute; inset:0;
    background:
      radial-gradient(circle at 85% 15%, rgba(255,255,255,.25), transparent 45%),
      radial-gradient(circle at 10% 90%, rgba(0,0,0,.2), transparent 40%);
  }
.pg-app2 .video-top{ position:relative; display:flex; align-items:center; gap:6px; font-size:10px; color:#fff; z-index:2; }
.pg-app2 .live-dot{ width:5px; height:5px; border-radius:50%; background:#fff; box-shadow:0 0 0 0 rgba(255,255,255,.6); animation:pg-app2-pulse 1.8s infinite; }
@keyframes pg-app2-pulse{
    0%{ box-shadow:0 0 0 0 rgba(255,255,255,.55); }
    70%{ box-shadow:0 0 0 8px rgba(255,255,255,0); }
    100%{ box-shadow:0 0 0 0 rgba(255,255,255,0); }
  }
.pg-app2 .video-title{ position:relative; z-index:2; font-size:12px; font-weight:700; color:#fff; margin-top:5px; }
.pg-app2 .ring-play{
    position:relative; z-index:2; align-self:center;
    width:52px; height:52px; border-radius:50%;
    background:
      conic-gradient(#ffffff calc(var(--p,68) * 1%), rgba(255,255,255,.28) 0);
    display:flex; align-items:center; justify-content:center;
    margin:4px 0;
  }
.pg-app2 .ring-play::after{
    content:''; position:absolute; inset:4px; border-radius:50%;
    background:linear-gradient(135deg, var(--accent) 0%, var(--accent-2) 100%);
  }
.pg-app2 .ring-play svg{ position:relative; z-index:2; width:16px; height:16px; fill:#fff; margin-right:-2px; }
.pg-app2 .video-bottom{ position:relative; z-index:2; display:flex; justify-content:space-between; font-size:9.5px; color:rgba(255,255,255,.85); }
.pg-app2 .tabs{ display:flex; gap:5px; background:var(--phone-card); border:1px solid var(--phone-border); border-radius:11px; padding:3px; }
.pg-app2 .tabs span{ flex:1; text-align:center; font-size:10.5px; padding:7px 0; border-radius:8px; color:var(--phone-text-dim); }
.pg-app2 .tabs span.active{ background:var(--accent); color:#fff; font-weight:600; }
.pg-app2 .detail-stack{ display:flex; flex-direction:column; gap:8px; }
.pg-app2 .stat-card{
    background:var(--phone-card); border:1px solid var(--phone-border);
    border-radius:14px; padding:10px 13px;
    display:flex; align-items:center; justify-content:space-between; gap:9px;
    box-shadow:0 1px 0 rgba(255,255,255,.04) inset;
  }
.pg-app2 .stat-card .lbl{ font-size:9.5px; color:var(--phone-text-faint); margin-bottom:4px; letter-spacing:.2px; }
.pg-app2 .stat-card .val{ font-size:12.5px; font-weight:700; color:var(--phone-text); }
.pg-app2 .streak-dots{ display:flex; gap:3px; margin-top:7px; }
.pg-app2 .streak-dots i{ width:6px; height:6px; border-radius:50%; background:var(--accent-gold); display:block; }
.pg-app2 .streak-dots i.off{ background:var(--phone-border); }
.pg-app2 .mini-ring{
    width:34px; height:34px; border-radius:50%; flex-shrink:0;
    background:conic-gradient(var(--accent-3) calc(var(--pp,68) * 1%), var(--phone-border) 0);
    display:flex; align-items:center; justify-content:center;
  }
.pg-app2 .mini-ring span{ width:26px; height:26px; border-radius:50%; background:var(--phone-bg-2); display:flex; align-items:center; justify-content:center; font-size:8.5px; font-weight:700; color:var(--phone-text); }
.pg-app2 .next-lesson{
    display:flex; align-items:center; justify-content:space-between;
    background:var(--phone-card); border:1px solid var(--phone-border);
    border-radius:14px; padding:10px 13px;
  }
.pg-app2 .next-lesson .lbl{ font-size:9.5px; color:var(--phone-text-faint); margin-bottom:4px; }
.pg-app2 .next-lesson .val{ font-size:12px; font-weight:700; color:var(--phone-text); }
.pg-app2 .next-lesson .go{
    width:32px; height:32px; border-radius:50%; background:var(--accent);
    display:flex; align-items:center; justify-content:center; flex-shrink:0;
    box-shadow:0 4px 14px -4px var(--accent);
  }
.pg-app2 .next-lesson .go svg{ width:12px; height:12px; fill:#fff; margin-right:-1px; }
@media (max-width:1080px){
.pg-app2 .container{ grid-template-columns:1fr; gap:52px; justify-items:center; }
/* موبایل: نوشته‌ها بالا → گوشی وسط → دو باکس دانلود زیر گوشی (مثل نسخه‌ی قبلی) */
.pg-app2 .text-col{ text-align:center; max-width:600px; order:0; }
.pg-app2 .phone-col{ order:1; }
.pg-app2 .text-col .store-buttons{ display:none; }              /* باکس دانلودِ داخل ستون متن در موبایل مخفی */
.pg-app2 .store-buttons--mob{ display:flex; order:2; justify-content:center; }
.pg-app2 h1.headline{ font-size:40px; margin-bottom:14px; }
.pg-app2 p.lead{ max-width:100%; margin-left:auto; margin-right:auto; margin-bottom:28px; line-height:1.9; }
.pg-app2 .features{ margin-bottom:28px; text-align:right; }
.pg-app2 .feature-item{ padding:16px 16px; }
.pg-app2 .feature-text h3{ margin-bottom:4px; }
.pg-app2 .feature-text p{ line-height:1.75; }
.pg-app2{ padding:76px 20px 84px; }
}
@media (max-width:760px){
.pg-app2 .phone-frame{ width:min(240px, 78vw); }
.pg-app2 h1.headline{ font-size:34px; }
}
@media (max-width:600px){
.pg-app2 h1.headline{ font-size:29px; }
.pg-app2 .phone-frame{ width:min(320px, 86vw); }
.pg-app2 .phone-screen{ min-height:0; padding:24px 11px 14px; gap:9px; }
.pg-app2 .feature-text p{ max-width:100%; }
.pg-app2 .feature-item{ text-align:right; }
.pg-app2{ padding:64px 16px 64px; }
}
@media (max-width:380px){
.pg-app2 .phone-frame{ width:min(290px, 86vw); }
.pg-app2 .video-title{ font-size:11px; }
}

/* خنثی‌سازی قانون سراسری «.pg-home section>div{padding-inline:18px}» روی کانتینرِ این سکشن
   تا فاصله‌گذاری افقی دقیقاً مطابق طراحی کاربر بماند */
.pg-app2 > .container{ padding-left:0 !important; padding-right:0 !important; }

/* --- alpha.13: hero + stats + testimonials refinements --- */
.pg-hero__cta-primary:hover { transform: translateY(-2px); box-shadow: 0 18px 34px color-mix(in srgb, var(--primary) 38%, transparent); }
.pg-hero__cta-play:hover { border-color: var(--primary); color: var(--primary); }
.pg-stat:hover { background: color-mix(in srgb, var(--surface) 60%, transparent); }
.pg-testi article:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); }

@media (max-width: 900px) {
  .pg-hero__wrap { grid-template-columns: 1fr !important; gap: 40px !important; padding: 48px 20px 28px !important; }
  .pg-hero__mock { max-width: 460px; margin: 0 auto; }
  .pg-hero__chip--cert { top: -14px !important; right: -10px !important; }
  .pg-hero__chip--notif { bottom: -14px !important; left: -10px !important; }
  .pg-stats > div { grid-template-columns: repeat(2, 1fr) !important; }
  .pg-stat { border-right: none !important; }
  .pg-testi > div:last-child { grid-template-columns: 1fr !important; }
}

/* ============================================================
   اصلاحات نمایشی موبایل (alpha.14) — فقط پنج مورد درخواستی
   ============================================================ */

/* ۱) «آنچه دانشجویان می‌گویند» — ریسپانسیو */
@media (max-width: 1024px) {
  .pg-testi__grid { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 680px) {
  .pg-testi__grid { grid-template-columns: 1fr !important; }
  /* هدر سکشن (عنوان + بج امتیاز) در موبایل زیر هم و بدون بیرون‌زدگی */
  .pg-testi > div:first-child { flex-wrap: wrap !important; gap: 14px !important; }
}

/* ۲) حذف دو ویجت شناور بالا/پایین گوشیِ بخش اپلیکیشن در موبایل */
@media (max-width: 768px) {
  .pg-app__chip { display: none !important; }
}


/* ۴) حذف کارت‌های شناور «گواهی معتبر / با کد استعلام» و
      «درس ۱۲ تکمیل شد» از بالای صفحه در موبایل */
@media (max-width: 768px) {
  .pg-hero__chip--cert,
  .pg-hero__chip--notif { display: none !important; }
}

/* ۵) حذف بج «پخش زنده» در موبایل */
@media (max-width: 768px) {
  .pg-hero__live { display: none !important; }
}

/* ============================================================
   اصلاحات ریسپانسیو موبایل (alpha.16) — چهار مورد درخواستی
   ============================================================ */

/* --- ۱) سکشن آمار: وسط‌چین + ۲×۲ + بدون فضای اضافه --- */
@media (max-width: 900px) {
  .pg-stats > div {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 14px !important;
    padding: 26px 20px !important;
  }
  .pg-stat {
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    gap: 10px !important;
    padding: 12px 8px !important;
    border-right: none !important;
  }
  .pg-stat > span { width: 46px !important; height: 46px !important; }
  .pg-stat__num { font-size: 24px !important; }
}
@media (max-width: 380px) {
  .pg-stat__num { font-size: 21px !important; }
}

/* --- ۲) سکشن اپلیکیشن: گوشی سایز طبیعی، وسط، بدون به‌هم‌ریختگی --- */
@media (max-width: 960px) {
  .pg-app__halo { width: 300px; height: 300px; }
}
@media (max-width: 340px) {
  /* فقط صفحات خیلی باریک: کمی کوچک‌تر، بدون دفرمه‌شدن محتوا */
  .pg-app__phone { width: 256px; height: 566px; }
}

/* --- ۳) «آنچه دانشجویان می‌گویند»: بدون بیرون‌زدگی --- */
.pg-testi { overflow-x: clip; }
@media (max-width: 680px) {
  .pg-testi { padding: 56px 18px !important; }
  .pg-testi__head { align-items: flex-start !important; margin-bottom: 26px !important; }
  .pg-testi__score { flex-wrap: wrap !important; padding: 9px 12px !important; gap: 7px !important; }
  .pg-testi__score span { font-size: 12px !important; letter-spacing: 1px !important; white-space: normal !important; }
  .pg-testi__grid > article { padding: 20px 16px 16px !important; }
  .pg-testi__grid > article p { min-height: 0 !important; font-size: 13.5px !important; }
  .pg-testi__grid > article > div { min-width: 0; }
}

/* --- alpha.17: سنترکردن کارت‌های «آنچه دانشجویان می‌گویند» در موبایل --- */
@media (max-width: 680px) {
  .pg-testi__grid > article { text-align: center !important; }
  .pg-testi__grid > article > div:first-of-type { justify-content: center !important; } /* ستاره‌ها */
  .pg-testi__grid > article p { text-align: center !important; }
  .pg-testi__grid > article > div:last-of-type { /* فوتر: آواتار/نام/چیپ */
    flex-direction: column !important;
    align-items: center !important;
    gap: 10px !important;
    text-align: center !important;
  }
  .pg-testi__grid > article > div:last-of-type > div { text-align: center !important; }
  .pg-testi__grid > article > div:last-of-type span[aria-hidden] { display: none; }
}

/* ============================================================
   alpha.18 — کوچک‌سازی متقارن (~۱۲٪) المان‌های داخل موکاپ گوشی
   فقط موبایل؛ نسبت‌ها و تقارن حفظ شده. ضمناً flex-shrink:0 تا
   کارت پلیر دیگر له/بریده نشود.
   ============================================================ */
@media (max-width: 960px) {
  .pg-app__phone { height: 548px; }
  .pg-app__screen-content { padding: 22px 12px 11px; gap: 6px; }
  .pg-app__screen-content > * { flex-shrink: 0; }

  /* هدر */
  .pg-app__icon-btn { width: 28px; height: 28px; border-radius: 9px; }
  .pg-app__header-course { font-size: 10px; }
  .pg-app__header-sub { font-size: 7.5px; }

  /* پلیر */
  .pg-app__player { padding: 10px; border-radius: 14px; }
  .pg-app__player-status { margin-bottom: 8px; }
  .pg-app__player-dot { width: 5.5px; height: 5.5px; }
  .pg-app__player-status-text { font-size: 8px; }
  .pg-app__player-title { font-size: 10.5px; margin-bottom: 9px; }
  .pg-app__player-controls { gap: 17px; margin-bottom: 9px; }
  .pg-app__playbtn { width: 37px; height: 37px; }
  .pg-app__playbtn svg { width: 15px; height: 15px; }
  .pg-app__skip svg { width: 14px; height: 14px; }
  .pg-app__skip-label { font-size: 6px; }
  .pg-app__progress-track { height: 4.5px; margin-bottom: 5px; }
  .pg-app__progress-knob { width: 10px; height: 10px; }
  .pg-app__time { font-size: 8px; }
  .pg-app__speed { padding: 2px 7px; font-size: 8px; }

  /* تب‌ها */
  .pg-app__tab { padding: 5.5px 0; font-size: 8.5px; }

  /* زنجیره‌ی یادگیری */
  .pg-app__streak { padding: 9px; gap: 8px; border-radius: 13px; }
  .pg-app__streak-icon { width: 26px; height: 26px; border-radius: 9px; }
  .pg-app__streak-icon svg { width: 13px; height: 13px; }
  .pg-app__streak-title { font-size: 9px; margin-bottom: 4px; }
  .pg-app__streak-day { width: 9px; height: 9px; }
  .pg-app__streak-count { font-size: 9.5px; }

  /* پیشرفت دوره */
  .pg-app__course-progress { padding: 9px; border-radius: 13px; }
  .pg-app__cp-row { margin-bottom: 6px; }
  .pg-app__cp-label { font-size: 9px; }
  .pg-app__cp-value { font-size: 10px; }
  .pg-app__cp-track { height: 6px; }

  /* درس بعدی */
  .pg-app__nextlesson { padding: 9px; gap: 8px; border-radius: 13px; }
  .pg-app__nl-playbtn { width: 28px; height: 28px; }
  .pg-app__nl-playbtn svg { width: 12px; height: 12px; }
  .pg-app__nl-label { font-size: 8px; }
  .pg-app__nl-title { font-size: 10px; }
  .pg-app__nl-time { font-size: 8.5px; }

  /* مدال‌ها */
  .pg-app__medals { padding: 9px 10px; gap: 9px; border-radius: 13px; }
  .pg-app__medals-label { font-size: 9px; }
  .pg-app__medals-row { gap: 6px; }
  .pg-app__medal { width: 25px; height: 25px; }
  .pg-app__medal svg { width: 12px; height: 12px; }

  /* یادداشت */
  .pg-app__note { padding: 9px; gap: 8px; border-radius: 13px; }
  .pg-app__note-icon { width: 25px; height: 25px; border-radius: 8px; }
  .pg-app__note-icon svg { width: 12px; height: 12px; }
  .pg-app__note-label { font-size: 8.5px; }
  .pg-app__note-time { font-size: 7.5px; }
  .pg-app__note-text { font-size: 9px; line-height: 1.65; }

  /* جبران فضای scale با ارتفاع جدید */
  .pg-app__phone { margin-bottom: -48px; }
}

/* ============================================================
   alpha.19 — فقط دو کارت: «زنجیره‌ی یادگیری» و «مدال‌های من»
   کوچک‌تر + ریاضیِ عرض طوری که در هیچ عرضی بیرون‌زدگی ممکن نباشد
   ============================================================ */
@media (max-width: 960px) {
  /* زنجیره‌ی یادگیری */
  .pg-app__streak { padding: 8px; gap: 7px; overflow: hidden; }
  .pg-app__streak > div { min-width: 0; }
  .pg-app__streak-icon { width: 23px; height: 23px; border-radius: 8px; }
  .pg-app__streak-icon svg { width: 11px; height: 11px; }
  .pg-app__streak-title { font-size: 8.5px; margin-bottom: 3px; }
  .pg-app__streak-dots { gap: 2.5px; }
  .pg-app__streak-day { width: 8px; height: 8px; }
  .pg-app__streak-day--muted { border-width: 1px; }
  .pg-app__streak-count { font-size: 8.5px; }

  /* مدال‌های من */
  .pg-app__medals { padding: 8px 9px; gap: 8px; overflow: hidden; }
  .pg-app__medals-label { font-size: 8.5px; }
  .pg-app__medals-row { gap: 5px; }
  .pg-app__medal { width: 22px; height: 22px; }
  .pg-app__medal svg { width: 11px; height: 11px; }
}

/* ============================================================
   alpha.20 — دو اصلاح: حذف یادداشت در موبایل + پلیر دسکتاپ
   ============================================================ */
/* دسکتاپ: کارت پلیر دیگر توسط flex فشرده نمی‌شود؛ محتوایش
   (وضعیت/عنوان/کنترل‌ها/زمان‌ها) با فاصله‌ی طبیعی و سنتر مثل موبایل */
.pg-app__player { flex-shrink: 0; }

/* موبایل: کارت یادداشت جا نمی‌شود و بریده رندر می‌شد → حذف */
@media (max-width: 960px) {
  .pg-app__note { display: none !important; }
}

/* alpha.21 — فقط «زنجیره‌ی یادگیری» و «مدال‌های من»: کوچک قطعی */
@media (max-width: 960px) {
  .pg-app__streak { padding: 7px 8px !important; gap: 6px !important; overflow: hidden !important; }
  .pg-app__streak > div { flex: 1 1 auto !important; min-width: 0 !important; overflow: hidden !important; }
  .pg-app__streak-icon { width: 20px !important; height: 20px !important; border-radius: 7px !important; }
  .pg-app__streak-icon svg { width: 10px !important; height: 10px !important; }
  .pg-app__streak-title { font-size: 8px !important; margin-bottom: 3px !important; }
  .pg-app__streak-dots { gap: 2px !important; }
  .pg-app__streak-day { width: 7px !important; height: 7px !important; border-width: 1px !important; }
  .pg-app__streak-count { font-size: 8px !important; flex: 0 0 auto !important; }

  .pg-app__medals { padding: 7px 8px !important; gap: 7px !important; overflow: hidden !important; }
  .pg-app__medals-label { font-size: 8px !important; }
  .pg-app__medals-row { gap: 4px !important; }
  .pg-app__medal { width: 19px !important; height: 19px !important; }
  .pg-app__medal svg { width: 10px !important; height: 10px !important; }
}

/* alpha.22 — عنوان بالای گوشی زیر ناچ نرود؛ نمایش کامل تیتر */
@media (max-width: 960px) {
  .pg-app__screen-content { padding-top: 34px !important; }
  .pg-app__header-course { max-width: none !important; }
}

/* alpha.23 — کارت یادداشت در دسکتاپ هم نصفه می‌افتاد → حذف در همه‌ی نمایش‌ها */
.pg-app__note { display: none !important; }

/* ============================================================
   alpha.26 — فقط موبایل: کارت ماک‌آپ هیرو وسط‌چین واقعی
   ریشه: ردیف اعتماد (آواتار/امتیاز/برندها) بدون wrap عریض‌تر از
   صفحه می‌شد و کل ستون را در RTL به چپ سرریز می‌داد.
   ============================================================ */
@media (max-width: 900px) {
  .pg-hero__wrap { overflow-x: clip !important; }
  .pg-hero__wrap > * { min-width: 0 !important; }
  /* ردیف‌های flex ستون متن اجازه‌ی شکستن داشته باشند */
  .pg-hero__wrap > div:first-child > div[style*="display:flex"] {
    flex-wrap: wrap !important;
    row-gap: 10px !important;
  }
  /* جداکننده‌ی عمودی ردیف اعتماد در حالت شکسته لازم نیست */
  .pg-hero__wrap > div:first-child div[style*="width:1px"] { display: none !important; }
  /* خود کارت: هرگز از عرض صفحه بزرگ‌تر نشود و دقیقاً وسط بماند */
  .pg-hero__mock {
    max-width: min(460px, 100%) !important;
    margin: 0 auto !important;
    width: 100% !important;
  }
}

/* ============================================================
   3.0.27 — موبایل: چیدمان جدید هیرو
   ترتیب دلخواه: بج → عنوان → توضیحات → کارت پلیر → دکمه‌ها → نوار اعتماد
   یعنی پلیر می‌آید بالا (زیر توضیحات) و دکمه‌های «شروع یادگیری /
   تماشای ویدیو» می‌روند زیر پلیر. برای اینکه بتوان اجزای ستون متن را
   جدا از پلیر جابه‌جا کرد، ستون متن با display:contents باز می‌شود
   (دقیقاً همان الگوی سکشن اپلیکیشن) و با order مرتب می‌شوند.
   ============================================================ */
@media (max-width: 900px) {
  .pg-hero__copy { display: contents; }
  .pg-hero__pill  { order: 1; }
  .pg-hero__title { order: 2; }
  .pg-hero__lead  { order: 3; }
  .pg-hero__mock  { order: 4; }
  .pg-hero__ctas  { order: 5; }
  .pg-hero__trust { order: 6; }
  /* در حالت باز شده، فاصله‌ها با مارجین خودِ اجزا کنترل شود نه gap شبکه */
  .pg-hero__wrap { gap: 0 !important; }
  /* پلیر: وسط‌چین + فاصله‌ی مناسب تا دکمه‌های زیرش */
  .pg-hero__mock {
    max-width: min(460px, 100%) !important;
    width: 100% !important;
    margin: 4px auto 30px !important;
  }
}

/* ============================================================
   3.0.28 — فقط موبایل: اصلاحات کارت پلیر + دکمهٔ بستن نوار اعلان
   ============================================================ */
@media (max-width: 900px) {
  /* ۱) دکمهٔ ضربدرِ نوار اعلان (موبایل): چون SVG روی بعضی مرورگرهای موبایل محو/نامرئی می‌شد،
        پس‌زمینهٔ تیره + آیکن متنی «✕» تضمینی (مستقل از رندر SVG) استفاده می‌شود */
  .pg-ann__close { background: rgba(15,23,42,.55) !important; }
  .pg-ann__close svg { display: none !important; }
  .pg-ann__close::after { content: "✕"; color: #fff; font-size: 15px; font-weight: 700; line-height: 1; }

  /* ۲) نوار پیشرفت (۷۲٪) روی پلیر در موبایل حذف شود */
  .pg-hero__vprog { display: none !important; }

  /* ۳) عنوان ویدیو: ۴px کوچک‌تر + به‌صورت نوار پایینی که دقیقاً به خط جداکننده می‌چسبد
        (تا دیگر روی دکمهٔ پخش وسط نیفتد و آن را ماسک نکند) */
  .pg-hero__vmeta  { left: 0 !important; right: 0 !important; bottom: 0 !important; }
  .pg-hero__vtitle {
    display: block !important;
    font-size: 11.5px !important;
    line-height: 1.45 !important;
    margin-bottom: 0 !important;
    padding: 5px 12px !important;
    border-radius: 8px 8px 0 0 !important;
  }
}

/* ============================================================
   3.0.30 — نرمال‌سازی فاصله‌گذاری عمودی/افقی سکشن‌ها (فقط spacing)
   Spacing Scale پایهٔ 8px: دسکتاپ 82 (بدون تغییر) → تبلت 60 → موبایل 44
   بدون تغییر HTML/کلاس/رنگ/فونت/انیمیشن — هدف‌گیری با attribute-selector
   روی همان inline styleهای موجود، بنابراین هیچ تغییری در مارک‌آپ لازم نیست.
   ============================================================ */

/* --- تبلت (≤960px) --- */
@media (max-width: 960px) {
  /* اصلاح‌شده: کاهش padding عمودی سکشن‌ها از 82px به 60px در تبلت - فاصله‌ی بیش از حد بین سکشن‌ها */
  .pg-home [style*="padding:82px 32px"] { padding-top: 60px !important; padding-bottom: 60px !important; }
  /* اصلاح‌شده: کاهش padding پایینِ سکشن CTA پایانی از 82px به 60px در تبلت */
  .pg-home [style*="padding:0 32px 82px"] { padding-bottom: 60px !important; }
}

/* --- موبایل (≤640px) --- */
@media (max-width: 640px) {
  /* اصلاح‌شده: کاهش padding عمودی سکشن‌ها از 82px به 44px در موبایل - علت اصلی فضای خالی زیاد بین سکشن‌ها */
  .pg-home [style*="padding:82px 32px"] { padding-top: 44px !important; padding-bottom: 44px !important; }
  /* اصلاح‌شده: کاهش padding پایینِ سکشن CTA پایانی از 82px به 44px در موبایل */
  .pg-home [style*="padding:0 32px 82px"] { padding-bottom: 44px !important; }

  /* اصلاح‌شده: رفع دوبل‌پدینگ افقی در سکشن‌های Type A (padding افقی روی خودِ <section>)
     صفرکردن افقیِ section تا فقط 18px قانون سراسریِ «.pg-home section>div» باقی بماند
     و افقی موبایل با سکشن‌های Type B یک‌دست شود (پیش‌تر ~50px می‌شد) */
  .pg-home > section[style*="padding:82px 32px"],
  .pg-home > section[style*="padding:0 32px 82px"] { padding-left: 0 !important; padding-right: 0 !important; }

  /* اصلاح‌شده: کاهش padding افقی نوار اعلان از 32px به 18px در موبایل
     (قانون سراسری فقط section>div را می‌گرفت و نوار اعلان داخل <section> نیست) */
  .pg-ann > div { padding-left: 18px !important; padding-right: 18px !important; }
}