/* ==========================================================================
   قارقارک — بریک‌پوینت‌ها، کنتراست بالا، چاپ
   موبایل‌اول: هرچه اینجاست، «افزودن» به چیدمان تک‌ستونه است.
   ========================================================================== */

/* ==========================================================================
   ۱. بدنه — بریک‌پوینت‌های min-width
   ========================================================================== */
/* زیر ۵۲rem نوار کنش چسبان دیده می‌شود؛ دکمه‌ی «بازگشت به بالا» باید بالاتر
   از آن بنشیند، وگرنه دو کنترل شناور روی هم می‌افتند. */
@media (max-width: 51.999rem) {
  .totop { inset-block-end: calc(var(--sp-5) + 64px); }
}

@media (min-width: 52rem) {          /* ≈ ۸۳۲px */
  .span-list { grid-template-columns: repeat(3, 1fr); gap: var(--sp-6); }
  .story__grid { grid-template-columns: 1fr 1fr; gap: var(--sp-10); }
  .rail ul { grid-template-columns: repeat(3, 1fr); gap: var(--sp-6); }
  .caps { grid-template-columns: 1fr; }
  .actionbar { display: none; }      /* روی دسکتاپ کنش‌ها همیشه در دیدند */
}

@media (min-width: 64rem) {          /* ≈ ۱۰۲۴px */
  .hero__grid { grid-template-columns: 1.02fr 1fr; gap: var(--sp-10); }
  .hero__trust { grid-column: 1 / -1; }
  .cta {
    grid-template-columns: 1.4fr auto;
    padding: var(--sp-12) var(--sp-10);
  }
  .cta__acts { justify-content: flex-end; }
}

/* رفتار لمسی اجزای اختصاصی صفحه؛ قواعد پوسته فقط در header.css نگهداری می‌شوند. */
@media (hover: none) {
  .btn--brass:hover::before { translate: -120% 0; }
  .trust__item:hover { transform: none; }
}

/* ---------- کنتراست بالا ---------- */
@media (prefers-contrast: more) {
  :root {
    --line: rgba(21,31,39,.28);
    --line-strong: rgba(21,31,39,.46);
    --text-muted: var(--qq-ink-600);
    --text-faint: var(--qq-ink-600);
    --glass: #fff;
    --glass-strong: #fff;
    --grain: 0;
  }
  :root[data-theme="dark"] {
    --line: rgba(255,255,255,.30);
    --line-strong: rgba(255,255,255,.48);
    --text-muted: #C7D0D9;
    --text-faint: #C7D0D9;
    --glass: #0E1720;
    --glass-strong: #0E1720;
  }
}

/* ---------- چاپ ---------- */
@media print {
  .totop, .qq-toast, .actionbar, .readbar, .ps__nav, .ps__rail, .ps__hint,
  .watermark { display: none !important; }
  body { background: #fff; color: #000; }
  body::after { display: none; }
  .ps__viewport { overflow: visible; mask-image: none; }
  .ps__track { inline-size: auto; flex-wrap: wrap; }
  .q > div { display: block !important; }
  /* نقشه‌ی فلاپ‌ها: چسبندگی و آمیختنِ رنگ روی کاغذ بی‌معنی است و بعضی
     درایورها multiply را خاکستری چاپ می‌کنند. */
  .fm__fig { position: static; break-inside: avoid; }
  .fm__stage { background: #fff; box-shadow: none; }
  .fm__photo { mix-blend-mode: normal; }
  .fm__legend button { break-inside: avoid; }
}

/* ---------- بخش‌های تازه‌ی محتوایی ---------- */
@media (min-width: 60rem) {          /* ≈ ۹۶۰px */
  /* نقشه سمت راست (شروع خط) و فهرست کنارش — نه زیرش */
  .fm { grid-template-columns: minmax(0, 1.25fr) minmax(19rem, .95fr); align-items: start; gap: var(--sp-8); }
  /* تصویر می‌چسبد، نه فهرست: فهرست بلندتر است و اسکرول می‌شود، پس نقشه باید
     در دید بماند تا انتخاب هر ردیف روی همان نقشه دیده شود. */
  .fm__fig { position: sticky; inset-block-start: calc(var(--header-total) + 1rem); }
}
@media (max-width: 29.999rem) {
  .fm__fig { padding: var(--sp-2); }
  .cat { padding: var(--sp-4); }
}

/* ========================================================================== 
   Stage 4 — hardening for touch, narrow screens and fixed UI layers
   ========================================================================== */
@media (max-width: 51.999rem) {
  body { padding-block-end: calc(76px + env(safe-area-inset-bottom)); }
  .actionbar { visibility: hidden; pointer-events: none; }
  .actionbar.is-on { visibility: visible; pointer-events: auto; }
  .section[id], main[id] { scroll-margin-block-start: calc(var(--header-total) + 1rem); }
}

@media (max-width: 47.999rem) {
  .section { padding-block: clamp(2.75rem, 10vw, 4.5rem); }
  .section__head { align-items: flex-start; }
  .section__head h2 { overflow-wrap: anywhere; }
  .hero__grid, .story__grid, .cta { min-inline-size: 0; }
  .ps__viewport { scroll-padding-inline: var(--gutter); }
  .pc { max-inline-size: calc(100vw - (var(--gutter) * 2)); }
  .qc__sheet {
    inline-size: 100%;
    max-block-size: 100dvh;
    margin: auto 0 0;
    border-radius: var(--r-xl) var(--r-xl) 0 0;
  }
  .qc__hd { padding: var(--sp-3) var(--sp-4); }
  .qc__bd { padding: var(--sp-4); padding-block-end: calc(var(--sp-5) + env(safe-area-inset-bottom)); }
  .zoom { inline-size: 100%; max-block-size: 100dvh; margin: auto 0 0; border-radius: var(--r-xl) var(--r-xl) 0 0; }
}

@media (max-width: 23rem) {
  :root { --gutter: .75rem; }
  .actionbar { padding-inline: .55rem; }
  .actionbar .btn { font-size: var(--fs-xs); }
  .qc__actions { grid-template-columns: 1fr; }
}

@media (hover: none) and (pointer: coarse) {
  :where(.qq-iconbtn, .ps__btn, .fm__pin, .zoom__x, .qc__del) { min-inline-size: 44px; min-block-size: 44px; }
}

@media (prefers-reduced-motion: reduce) {
  .actionbar { transition: none; }
  .rv { opacity: 1; translate: none; }
}