/* ==========================================================================
   responsive.css — بازطراحی موبایل‌محور (Mobile-First)
   ==========================================================================
   چیدمان دسکتاپ دست‌نخورده می‌ماند؛ این فایل فقط موبایل/تبلت را بهینه می‌کند.
   ترتیب: پایهٔ ارگونومی ← 1023px ← 767px ← 559px ← 560px+ ← 768px+ ← 1024px+

   نکتهٔ مهم: صفحات عمومی استایل‌های درون‌صفحه‌ای دارند که بعد از این فایل
   لود می‌شوند و برندهٔ کاسکید می‌شوند. برای غلبهٔ مطمئن، انتخاب‌گرهای
   کامپوننت‌های صفحه‌ای دو بار تکرار شده‌اند (specificity بالاتر).
   ========================================================================== */

/* --------------------------------------------------------------------------
   ۰) پایهٔ ارگونومی — در همهٔ عرض‌ها اعمال می‌شود (نوشته‌شده برای موبایل)
   -------------------------------------------------------------------------- */
html { -webkit-text-size-adjust: 100%; }
body, html { overflow-x: hidden; }
* { -webkit-tap-highlight-color: transparent; box-sizing: border-box; }
img, video, iframe { max-width: 100%; height: auto; }
input, select, textarea, button { font-family: inherit; }

/* جلوگیری از زوم خودکار ورودی‌ها در iOS */
input, select, textarea { font-size: 16px; }
button { touch-action: manipulation; }

/* نوار اسکرول مخفی برای ردیف‌های افقی (فیلترها، گالری و...) */
.hscroll, .filter-chips, .filter-chip, .pd-strip, .chip-row {
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.hscroll::-webkit-scrollbar, .filter-chips::-webkit-scrollbar,
.pd-strip::-webkit-scrollbar, .chip-row::-webkit-scrollbar { display: none; }

.leaflet-container { width: 100% !important; }

/* --------------------------------------------------------------------------
   ۱) موبایل و تبلت — بازچینی اصلی (تا 1023px)
   -------------------------------------------------------------------------- */
@media (max-width: 1023px) {

  /* ---------- کانتینر و تایپوگرافی ---------- */
  .container { width: 94%; }

  /* ---------- هدر: در موبایل مخفی — نوار پایین جایگزین است ---------- */
  .landing-header, .pl-header { display: none !important; }
  .pl-nav.pl-nav { padding: .6rem .9rem; gap: .6rem; }
  .pl-brand.pl-brand { font-size: 1.2rem; gap: .55rem; }
  .pl-brand.pl-brand img.brand-logo { height: 34px; }
  .brand-badge.brand-badge { width: 36px; height: 36px; border-radius: 11px; font-size: .95rem; }
  .btn-pl.btn-pl { padding: .55rem .9rem; font-size: .85rem; min-height: 40px; }

  /* ---------- هیرو (صفحه اصلی) ---------- */
  /* هیرو در موبایل: تمام‌صفحه و محتوا وسط (عمودی) */
  /* هیرو در موبایل: محتوا کمی بالاتر از مرکز — تراز بین برند و تب‌بار */
  .hero-section.hero-section {
    min-height: calc(100dvh - 70px);
    display: flex; align-items: center; justify-content: center;
    padding: .5rem 1rem 3.5rem;
  }
  .hero-section .container.container { width: 100%; max-width: 420px; margin: 0 auto; transform: translateY(-4vh); }
  .hero-section .container.container { width: 100%; max-width: 420px; margin: 0 auto; }
  .hero-copy.hero-copy h1 { font-size: clamp(1.8rem, 7vw, 2.6rem); }
  .hero-copy.hero-copy p { font-size: .98rem; max-width: 520px; margin-inline: auto; }
  .hero-eyebrow.hero-eyebrow { font-size: .75rem; padding: .4rem .85rem; }
  .hero-actions.hero-actions { flex-direction: column; align-items: stretch; width: min(100%, 360px); margin: 1.5rem auto 0; }
  .hero-actions.hero-actions .primary-btn, .hero-actions.hero-actions .secondary-btn { width: 100%; justify-content: center; min-height: 50px; }
  /* هیرو در موبایل نمایش داده شود — فقط کارت‌های شناور حذف می‌شوند */
  .hero-float { display: none !important; }
  .hero-anim { opacity: 1 !important; transform: none !important; animation: none !important; }

  /* ---------- بخش‌ها و کارت‌های عمومی ---------- */
  .section.section { padding: 2.6rem 0 !important; }
  .section-title.section-title h2 { font-size: 1.55rem; }
  .feature-grid.feature-grid { grid-template-columns: repeat(2, 1fr); gap: 1rem; }
  .feature-card.feature-card { padding: 1.3rem 1.1rem; }

  /* خانه: بخش‌های «چرا ما» و «قولنامه‌ها» فشرده در موبایل */
  #features .feature-grid, #clauses .feature-grid { grid-template-columns: 1fr !important; gap: .65rem !important; }
  #features .feature-card, #clauses .feature-card { display: flex; align-items: flex-start; gap: .8rem; padding: .85rem .95rem !important; border-radius: 16px; }
  #features .feature-card i, #clauses .feature-card i { width: 40px; height: 40px; font-size: 1.05rem; border-radius: 12px; margin-bottom: 0; flex-shrink: 0; }
  #features .feature-card h3, #clauses .feature-card h3 { margin: 0 0 .25rem; font-size: .98rem; }
  #features .feature-card p, #clauses .feature-card p { margin: 0; font-size: .8rem; line-height: 1.7; }
  #features .section-title, #clauses .section-title { margin-bottom: 1.2rem; }
  #features .section-title p, #clauses .section-title p { font-size: .85rem; }

  /* ---------- صفحه املاک (لیست) ---------- */
  .toolbar-card.toolbar-card { padding: 1.1rem; }
  .toolbar-card.toolbar-card form { flex-direction: column; align-items: stretch; gap: .55rem; }
  .toolbar-card.toolbar-card .search-input { width: 100%; min-width: 0; }
  .tool-btn.tool-btn { justify-content: center; width: 100%; min-height: 46px; }
  .adv-panel.adv-panel { padding: 1rem; }
  .adv-grid.adv-grid { grid-template-columns: 1fr 1fr; gap: .7rem; }
  .adv-field.adv-field { min-width: 0; }
  .result-head.result-head { flex-direction: column; align-items: flex-start; gap: .45rem; }
  .filter-chips, .chip-row { display: flex; flex-wrap: nowrap; overflow-x: auto; margin-inline: -1rem; padding-inline: 1rem; }
  .props-grid.props-grid { gap: 1rem; }
  .prop-card.prop-card { border-radius: 18px; }
  .prop-media.prop-media { height: 200px; }

  /* ---------- صفحه ملک ---------- */
  /* چیدمان موبایل صفحهٔ ملک به‌طور کامل به assets/css/property-mobile.css
     منتقل شد (تنها منبع حقیقت). اینجا فقط چیزهای مشترک با صفحات دیگر می‌ماند. */
  .pd-layout.pd-layout { grid-template-columns: 1fr; gap: 1.3rem; }
  .pd-aside.pd-aside { position: static !important; }

  /* ---------- مشاوران ---------- */
  .cs-hero.cs-hero { padding: 2.2rem 1rem 1.4rem; }
  .cs-featured.cs-featured { grid-template-columns: 1fr; text-align: center; padding: 1.7rem 1.3rem; gap: 1.2rem; }
  .cs-featured.cs-featured .cs-avatar-ring { margin-inline: auto; width: 132px; height: 132px; }
  .cs-featured.cs-featured .cs-request { width: 100%; }
  .cs-featured-channels.cs-featured-channels { justify-content: center; }
  .cs-channels.cs-channels { flex-wrap: wrap; }
  .cs-grid.cs-grid { gap: 1rem; }
  .cs-card.cs-card { padding: 1.6rem 1.1rem 1.4rem; }
  .cs-request.cs-request { min-height: 46px; }

  /* ---------- مقالات (لیست) ---------- */
  .ar-hero.ar-hero { padding: 2.2rem 1rem 1.4rem; }
  /* نوار جستجوی مقالات: جمع‌وجور، بدون بیرون‌زدگی */
  .ar-toolbar.ar-toolbar { margin: 1.4rem 0 1.6rem; }
  .ar-toolbar.ar-toolbar form { min-width: 0; padding: 4px; gap: 6px; }
  .ar-toolbar.ar-toolbar input[type=text] { min-width: 0; flex: 1 1 auto; width: 100%; padding: .55rem .85rem; font-size: 15px; }
  .ar-toolbar.ar-toolbar .ar-readmore { padding: .55rem .8rem !important; font-size: .8rem; white-space: nowrap; flex-shrink: 0; }
  .ar-grid.ar-grid { gap: 1rem; }
  .ar-card-media.ar-card-media { height: 190px; }
  .ar-featured.ar-featured { padding: 1.4rem 1.2rem; }

  /* ---------- صفحه مقاله ---------- */
  .article-hero.article-hero { padding: 2.2rem 1rem 1.5rem; }
  .article-hero-content.article-hero-content h1 { font-size: clamp(1.5rem, 5.5vw, 2.1rem); }
  .article-layout.article-layout { grid-template-columns: 1fr; gap: 1.4rem; }
  .article-body.article-body { font-size: 1.04rem; line-height: 2.05; }
  .article-meta-line.article-meta-line { flex-wrap: wrap; gap: .5rem; }
  .article-share.article-share { flex-wrap: wrap; }
  .ar-side.ar-side { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
  .ar-side-box.ar-side-box { margin: 0; }
  /* موبایل: سایدبار «پر بازدیدترین/جدیدترین مقالات» صفحهٔ مقالات پنهان می‌شود؛
     در دسکتاپ دست‌نخورده می‌ماند. دو ستون در موبایل باعث می‌شد کارت مقالهٔ
     ویژه پایین برود و صفحه هم شلوغ شود. */
  body.page-articles .ar-side.ar-side { display: none; }
  .article-related-grid.article-related-grid { grid-template-columns: 1fr; gap: .8rem; }
  /* کارت «مطالعه بیشتر» همان کارت فشردهٔ «مقالات مرتبط» صفحهٔ ملک است؛
     ارتفاع ثابت تصویر عمداً حذف شده تا کارت کوتاه بماند و اطلاعات بدهد. */
  .home-art-grid.home-art-grid { gap: 1rem; }

  /* ---------- صفحه تماس ---------- */
  .ct-hero.ct-hero { padding: 2.2rem 1rem 1.4rem; }
  .ct-grid.ct-grid { grid-template-columns: 1fr; gap: 1.1rem; margin-top: 1.4rem; }
  .ct-card.ct-card { padding: 1.2rem 1.1rem; }
  #contactMap { height: 240px; }

  /* ---------- داشبورد کاربری ---------- */
  .dashboard-shell { padding: 0; }
  .dash-navbar { flex-wrap: wrap; gap: .6rem; padding: .8rem 1rem; }
  .dash-user, .dash-welcome { flex-wrap: wrap; }
  .dash-inner { padding: 1.1rem; }
  .pdf-grid.pdf-grid { grid-template-columns: 1fr; gap: 1rem; }
  .pdf-card { padding: 1.1rem; }
  .pdf-actions, .pdf-metrics { flex-wrap: wrap; }
  .pdf-actions .btn-view, .pdf-actions .btn-download { flex: 1 1 auto; justify-content: center; min-height: 44px; }
  .btn-download.btn-download, .btn-view.btn-view { width: 100%; justify-content: center; }

  /* ---------- فوتر ---------- */
  .pl-footer-inner.pl-footer-inner { grid-template-columns: 1fr; gap: 1.8rem; padding: 2.2rem 1.2rem 1.8rem; }
  .pl-footermap.pl-footermap, .footer-map { height: 200px; }
  .pl-footer-bottom.pl-footer-bottom { padding: 1rem 1rem 1.6rem; }
  .pl-socials.pl-socials, .pl-contact-item.pl-contact-item { flex-wrap: wrap; }
  .footer-inner.footer-inner { grid-template-columns: 1fr; gap: 1.8rem; }

  /* ---------- مودال درخواست مشاوره ---------- */
  .consult-modal.consult-modal { padding: 0; align-items: flex-end; }
  .consult-card.consult-card { width: 100%; border-radius: 22px 22px 0 0; max-height: 88vh; overflow-y: auto; padding-bottom: calc(1.3rem + env(safe-area-inset-bottom)); }

  /* ---------- پنل ادمین ---------- */
  .admin-topbar { padding: 0 4%; }
  .admin-content { padding: 22px 4%; }
  .admin-sidebar { max-width: 82vw; }
  .metric-grid.metric-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .metric-card.metric-card { padding: 14px; }
  .quick-access.quick-access { grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .qa-card.qa-card { padding: 14px 12px; }
  .settings-grid.settings-grid { grid-template-columns: 1fr; }
  .setting-field.setting-field input, .setting-field.setting-field select,
  .setting-field.setting-field textarea { width: 100%; }
  .section-toolbar.section-toolbar { flex-direction: column; align-items: flex-start; gap: 10px; }
  .section-toolbar.section-toolbar .admin-button { width: 100%; justify-content: center; }
  .table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .table-wrap table, .table-card table, .admin-recent-table { min-width: 640px; }
  .pdf-search-bar { flex-direction: column; align-items: stretch; }
  .pdf-search-bar input[type="text"], .pdf-search-bar input[type="date"], .pdf-search-bar input[type="tel"] { width: 100%; min-width: 0 !important; }
  .admin-modal-card { padding: 18px; }
  .admin-modal-card form { grid-template-columns: 1fr; }
  .manage-library, .quick-add-wrap { grid-template-columns: 1fr !important; }
  .media-zone { grid-template-columns: 1fr; }
  .pf-grid { grid-template-columns: 1fr !important; }
  .property-form .pf-grid { grid-template-columns: 1fr; }
  .admin-card { padding: 18px; }
  .admin-card .settings-grid { grid-template-columns: 1fr; }
  .admin-toast { inset-inline: 14px; }

  /* نقشه‌های تمام‌صفحه */
  #amlakMapModal > div, .fm-wrap, #fullMapModal .fm-wrap { width: 100% !important; height: 100% !important; border-radius: 0 !important; }
}

/* --------------------------------------------------------------------------
   ۲) موبایل (تا 767px)
   -------------------------------------------------------------------------- */
@media (max-width: 767px) {

  body { font-size: 15px; }
  .container { width: 100%; padding-inline: 1rem; }

  /* هیرو فشرده (بدون شکستن وسط‌چینی عمودی) */
  .hero-section.hero-section { padding-block: 2.2rem 1.9rem; }
  .hero-copy.hero-copy h1 { font-size: clamp(1.65rem, 8vw, 2.3rem); }
  .hero-copy.hero-copy p { font-size: .92rem; }

  /* گریدهای تک‌ستونه */
  .feature-grid.feature-grid { grid-template-columns: 1fr; }
  .props-grid.props-grid { grid-template-columns: 1fr; }
  .cs-grid.cs-grid { grid-template-columns: 1fr; }
  .home-art-grid.home-art-grid { grid-template-columns: 1fr; }
  .ar-grid.ar-grid { grid-template-columns: 1fr; }
  .ar-side.ar-side { grid-template-columns: 1fr; }
  .article-related-grid.article-related-grid { grid-template-columns: 1fr; }

  /* املاک — فیلترها و نوار جستجو */
  .adv-grid.adv-grid { grid-template-columns: 1fr; }
  .adv-actions.adv-actions { flex-direction: column; }
  .adv-actions.adv-actions .tool-btn, .adv-actions.adv-actions button { width: 100%; }
  .prop-media.prop-media { height: 205px; }
  .prop-name.prop-name { font-size: 1.02rem; }
  .prop-cat-badge.prop-cat-badge, .prop-view-badge.prop-view-badge { font-size: .68rem; padding: .28rem .6rem; }

  /* ملک — قواعد موبایل به property-mobile.css منتقل شد */

  /* مشاوران */
  .cs-featured.cs-featured { padding: 1.5rem 1.1rem; }
  .cs-featured.cs-featured .cs-avatar-ring { width: 112px; height: 112px; }
  .cs-avatar-ring.cs-avatar-ring { width: 92px; height: 92px; }
  .cs-name.cs-name { font-size: 1.1rem; }

  /* مقاله */
  .article-body.article-body { font-size: 1rem; line-height: 2; padding-inline: 1.1rem; }
  .article-hero-content.article-hero-content { padding-inline: 1rem; }
  /* کارت «مقاله ویژه»: گرید دوستونهٔ دسکتاپ باید در موبایل تک‌ستونه شود —
     قبلاً فقط flex-direction ست می‌شد که روی grid هیچ اثری نداشت، پس کارت
     در موبایل دو ستون فشرده و به‌هم‌ریخته می‌شد. */
  .ar-featured.ar-featured { grid-template-columns: 1fr; text-align: right; }
  .ar-featured-media.ar-featured-media { height: 190px; min-height: 0; width: 100%; }
  .ar-featured-media.ar-featured-media .ar-flag { top: .7rem; right: .7rem; font-size: .7rem; padding: .3rem .7rem; }
  .ar-featured-body.ar-featured-body { padding: 1.15rem 1.15rem 1.3rem; }
  .ar-featured-body.ar-featured-body h2 { font-size: 1.22rem; line-height: 1.7; }
  .home-art-media.home-art-media { height: 180px; }

  /* تماس */
  #contactMap { height: 210px; }

  /* داشبورد */
  .dash-navbar { padding: .7rem .85rem; }
  .dash-user { justify-content: space-between; width: 100%; }
  .dash-inner { padding: .95rem; }
  .pdf-card-head { flex-wrap: wrap; gap: .6rem; }
  .pdf-title { font-size: 1rem; }

  /* فوتر */
  .pl-footer-inner.pl-footer-inner { padding: 2rem 1.1rem 1.6rem; gap: 1.5rem; }
  .enamad-badge { margin-inline: auto; }

  /* مودال مشاوره: کشوی پایین */
  .consult-card.consult-card { padding: 1.5rem 1.15rem calc(1.2rem + env(safe-area-inset-bottom)); }
  .consult-card.consult-card h3 { font-size: 1.35rem; }
  .consult-submit.consult-submit { min-height: 48px; }

  /* ادمین — لمس آسان‌تر */
  .metric-grid.metric-grid { grid-template-columns: 1fr 1fr; gap: 8px; }
  .metric-card.metric-card { padding: 12px 10px; }
  .metric-card.metric-card strong { font-size: 16px; }
  .quick-access.quick-access { grid-template-columns: 1fr 1fr; gap: 8px; }
  .qa-card.qa-card { padding: 12px 10px; font-size: 11px; }
  .admin-content { padding: 18px 12px; }
  .admin-button.admin-button { min-height: 42px; }
  .pdf-actions .admin-button, .pdf-actions .admin-button { width: 100%; }
  .recent-contract-grid { grid-template-columns: 1fr; }
  .dashboard-grid { grid-template-columns: 1fr !important; }
}

/* --------------------------------------------------------------------------
   ۳) موبایل‌های خیلی کوچک (تا 559px)
   -------------------------------------------------------------------------- */
@media (max-width: 559px) {
  .pl-nav.pl-nav { padding: .55rem .7rem; }
  .pl-brand.pl-brand { font-size: 1.08rem; }
  .brand-badge.brand-badge { width: 33px; height: 33px; font-size: .85rem; }
  .btn-pl.btn-pl { padding: .5rem .75rem; font-size: .8rem; }

  .hero-eyebrow.hero-eyebrow { font-size: .7rem; }
  .hero-actions.hero-actions { width: 100%; }

  .feature-card.feature-card { padding: 1.15rem .95rem; }
  .section-title.section-title h2 { font-size: 1.4rem; }


  .ar-card-media.ar-card-media { height: 175px; }
  .article-meta-line.article-meta-line { font-size: .8rem; }

  .ct-card.ct-card { padding: 1rem .95rem; }
  .ct-item.ct-item { gap: .7rem; }
  .ct-item.ct-item i { width: 38px; height: 38px; }

  .metric-grid.metric-grid { gap: 6px; }
  .metric-card.metric-card { padding: 11px 8px; }
  .metric-card.metric-card strong { font-size: 15px; }
  .table-wrap table, .table-card table, .admin-recent-table { min-width: 560px; }

  .logout-link { font-size: .78rem !important; padding: .3rem .45rem; }
}

/* --------------------------------------------------------------------------
   ۴) صفحه‌های بزرگ‌تر از موبایل — بهبود تدریجی (Mobile-First)
   -------------------------------------------------------------------------- */

/* 560px به بالا */
@media (min-width: 560px) {
  .adv-grid.adv-grid { grid-template-columns: 1fr 1fr; }
  .hero-actions.hero-actions { flex-direction: row; width: auto; }
  .hero-actions.hero-actions .primary-btn, .hero-actions.hero-actions .secondary-btn { width: auto; min-width: 170px; }
  .metric-grid.metric-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
  .quick-access.quick-access { grid-template-columns: repeat(3, 1fr); }
}

/* 768px به بالا — تبلت */
@media (min-width: 768px) {
  .container { width: 92%; }
  .hero-section.hero-section { padding-block: 3rem 2.6rem; }
  .hero-copy.hero-copy h1 { font-size: clamp(2.2rem, 5.5vw, 3rem); }
  .section.section { padding: 3.2rem 0 !important; }
  .feature-grid.feature-grid { grid-template-columns: repeat(2, 1fr); gap: 1.2rem; }
  .props-grid.props-grid { grid-template-columns: repeat(2, 1fr); gap: 1.2rem; }
  .cs-grid.cs-grid { grid-template-columns: repeat(2, 1fr); }
  .home-art-grid.home-art-grid { grid-template-columns: repeat(2, 1fr); }
  .ar-grid.ar-grid { grid-template-columns: repeat(2, 1fr); }
  .article-related-grid.article-related-grid { grid-template-columns: repeat(2, 1fr); }
  .pdf-grid.pdf-grid { grid-template-columns: repeat(2, 1fr); }
  .pl-footer-inner.pl-footer-inner { grid-template-columns: 1fr 1fr; }
  .pd-main-img.pd-main-img, .pd-main-video.pd-main-video { height: 400px; }
  .admin-content { padding: 26px 3%; }
  .settings-grid.settings-grid { grid-template-columns: 1fr 1fr; }
}

/* 1024px به بالا — دسکتاپ (چیدمان اصلی دست‌نخورده) */
@media (min-width: 1024px) {
  .container { width: min(1180px, 92%); }
  .feature-grid.feature-grid { grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); }
  .props-grid.props-grid { grid-template-columns: repeat(auto-fill, minmax(255px, 1fr)); gap: 1.4rem; }
  .cs-grid.cs-grid { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 1.4rem; }
  .home-art-grid.home-art-grid { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }
  .ar-grid.ar-grid { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }
  .article-related-grid.article-related-grid { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
  .pdf-grid.pdf-grid { grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); }
  .metric-grid.metric-grid { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
  .quick-access.quick-access { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }
  .settings-grid.settings-grid { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
  .pl-footer-inner.pl-footer-inner { grid-template-columns: 1.3fr 1fr 1.2fr; gap: 2.2rem; padding: 3rem 1.5rem 2rem; }
  .dashboard-grid { grid-template-columns: 240px 1fr; }
}

/* ==========================================================================
   ⚠ یادداشت نگهداری — صفحهٔ ملک (property) در موبایل
   --------------------------------------------------------------------------
   قواعد موبایل این صفحه «کاملاً از صفر» بازنویسی شد و تنها منبع حقیقت آن
   فایل جداگانهٔ assets/css/property-mobile.css است که فقط در property.php
   بعد از این فایل (و property.css) بارگذاری می‌شود.
   هر اصلاحی در چیدمان موبایل صفحهٔ ملک باید همان‌جا انجام شود.
   ========================================================================== */

/* ==========================================================================
   بازطراحی اختصاصی موبایل — صفحهٔ مقاله (article)
   ========================================================================== */
@media (max-width: 767px) {

  .article-editorial.article-editorial { padding: .4rem 0 4.5rem; }

  /* --- بردکرامب فشرده: یک خط، اسکرول افقی --- */
  .article-breadcrumb.article-breadcrumb { margin: .8rem .2rem .5rem; font-size: .72rem; flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; white-space: nowrap; }
  .article-breadcrumb.article-breadcrumb::-webkit-scrollbar { display: none; }

  /* --- هیرو تمام‌عرض با تیتر خوانا --- */
  .article-hero.article-hero { min-height: 0; height: min(58vw, 320px); border-radius: 0; margin-inline: -1rem; }
  .article-hero.article-hero::after { background: linear-gradient(180deg, rgba(15,23,42,.02) 20%, rgba(15,23,42,.88) 100%); }
  .article-hero-content.article-hero-content { padding: 1.1rem 1.05rem 1.2rem; }
  .article-hero-content.article-hero-content h1 { font-size: clamp(1.4rem, 6.4vw, 1.9rem); line-height: 1.5; }
  .article-kicker.article-kicker { font-size: .68rem; padding: .3rem .7rem; }
  .article-lead.article-lead { font-size: .9rem; line-height: 1.95; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
  .article-meta-line.article-meta-line { gap: .8rem; font-size: .74rem; margin-top: .8rem; }

  /* --- ردیف اشتراک‌گذاری زیر هیرو (به‌جای ستون کناری) --- */
  .article-layout.article-layout { gap: 0; }
  .article-share.article-share { position: static; flex-direction: row; align-items: center; order: -1; gap: .6rem; margin: .9rem 0 0; }
  .article-share.article-share a, .article-share.article-share button { width: 42px; height: 42px; border-radius: 12px; }
  .article-share.article-share small { font-size: .72rem; }

  /* --- تایپوگرافی مطالعه --- */
  .article-reading.article-reading { border-radius: 20px; padding: 1.25rem 1.1rem; margin-top: .9rem; }
  .article-reading.article-reading .reading-intro { font-size: .95rem; padding: .9rem 1rem; line-height: 2; }
  .article-reading.article-reading p { font-size: 1rem; line-height: 2.2; }
  .article-reading.article-reading h2 { font-size: 1.35rem; }
  .article-reading.article-reading h3 { font-size: 1.15rem; }
  .article-reading.article-reading img { border-radius: 14px; }

  /* --- «برای مطالعه بیشتر»: فهرست تک‌ستونه با همان کارت فشردهٔ «مقالات مرتبط»
         صفحهٔ ملک (تصویر کوچک کنار، تیتر دوخطی، دو خط خلاصه و تاریخ).
         کاروسل افقی قبلی کارت را ۷۴٪ عرض و تصویر را ۱۵۰px می‌کرد و در
         موبایل هم بزرگ بود و هم اطلاعات کمی می‌داد. */
  .article-related-editorial.article-related-editorial { margin-top: 2rem; }
  .article-related-editorial.article-related-editorial h2 { font-size: 1.3rem; }
  .article-related-grid.article-related-grid { display: grid; grid-template-columns: 1fr; gap: .7rem; padding-bottom: 0; }
  .article-related-card.article-related-card { flex-direction: row; gap: .7rem; border-radius: 14px; padding: .6rem; }
  .article-related-card .article-related-card-media { flex: 0 0 96px; height: auto; min-height: 92px; }
  .article-related-card .article-related-card-body { gap: .25rem; }
  .article-related-card .article-related-card h3 { font-size: .95rem; line-height: 1.7; }
  .article-related-card .article-related-card-body p { font-size: .76rem; line-height: 1.85; -webkit-line-clamp: 2; }
  .article-related-card .article-related-card small { font-size: .7rem; }

  /* --- جدول‌ها و بلوک‌های داخل متن مقاله: اسکرول افقی --- */
  .article-reading.article-reading :is(table, pre) { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
}

/* --------------------------------------------------------------------------
   کارت‌های فشردهٔ موبایل — املاک و مقالات به‌صورت افقی فشرده (عکس کوچک + متن)
   تا ۴-۵ کارت در هر قاب صفحه دیده شود و اسکرول به حداقل برسد.
   -------------------------------------------------------------------------- */
@media (max-width: 768px) {
  .prop-card,
  .ar-card,
  .home-art-card {
    display: flex !important;
    flex-direction: row !important;
    align-items: stretch;
    gap: 0;
    min-height: 108px;
  }
  .prop-card .prop-media,
  .ar-card .ar-card-media,
  .home-art-card .home-art-media {
    width: 108px !important;
    min-width: 108px;
    height: auto !important;
    min-height: 108px;
    flex-shrink: 0;
    border-radius: 0;
    align-self: stretch;
  }
  .prop-card .prop-media img,
  .ar-card .ar-card-media img,
  .home-art-card .home-art-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  .prop-card .prop-body,
  .ar-card .ar-card-body,
  .home-art-card .home-art-body {
    flex: 1;
    min-width: 0;
    padding: 10px 12px !important;
    display: flex;
    flex-direction: column;
    gap: 4px;
    justify-content: center;
  }
  .prop-card .prop-name,
  .ar-card .ar-card-title,
  .home-art-card .home-art-body h3 {
    font-size: .92rem !important;
    line-height: 1.5;
    margin: 0 !important;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .prop-card .prop-meta,
  .ar-card .ar-meta,
  .home-art-card .ar-meta {
    gap: .6rem !important;
    font-size: .72rem !important;
  }
  .prop-card .prop-consultant,
  .prop-card .prop-location,
  .ar-card .ar-author,
  .home-art-card .ar-author {
    font-size: .7rem !important;
  }
  .ar-card .ar-card-excerpt,
  .home-art-card .home-art-body p,
  .ar-card .ar-readmore,
  .home-art-card .home-art-more {
    display: none !important;
  }
  /* قیمت حالا داخل بدنهٔ کارت است (نه تگ روی تصویر) — فشردهٔ موبایل */
  .prop-card .prop-price { font-size: .85rem; }
  .prop-card .prop-price .prop-price-val { font-size: .88rem; }
  .prop-card .prop-price-line { font-size: .72rem; }
  .prop-card .prop-cat-badge { font-size: .6rem !important; padding: 2px 7px !important; }
  .prop-card .prop-view-badge { font-size: .62rem !important; }
  .properties-grid,
  .realistic-grid,
  .ar-grid,
  .props-grid,
  .home-art-grid,
  .articles-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: .6rem !important;
  }
}
@media (max-width: 360px) {
  .prop-card .prop-media,
  .ar-card .ar-card-media,
  .home-art-card .home-art-media { width: 92px !important; min-width: 92px; }
}

/* --------------------------------------------------------------------------
   اصلاح بج‌های کارت املاک در موبایل:
   بازدید چپ و دسته‌بندی راستِ بالا — بدون تداخل (قیمت دیگر روی تصویر نیست)
   -------------------------------------------------------------------------- */
@media (max-width: 768px) {
  .prop-card .prop-cat-badge.prop-cat-badge {
    top: 6px !important;
    right: 6px !important;
    left: auto !important;
    bottom: auto !important;
  }
  .prop-card .prop-view-badge.prop-view-badge {
    top: 6px !important;
    left: 6px !important;
    right: auto !important;
    bottom: auto !important;
    font-size: .62rem !important;
    padding: 2px 7px !important;
  }
}

/* --------------------------------------------------------------------------
   صفحهٔ مقالات در موبایل: باکس‌های «پر بازدیدترین» و «جدیدترین» اول،
   سپس مقاله ویژه و گرید مقالات زیر آن‌ها
   -------------------------------------------------------------------------- */
/* مقالات در موبایل: تب‌های «پر بازدیدترین | جدیدترین» بالای لیست — دسکتاپ هر دو باکس در ستون کنار */
@media (min-width: 981px) {
  .ar-tabs { display: none; }
}
@media (max-width: 980px) {
  .ar-main-cols.ar-main-cols { display: flex; flex-direction: column; }
  .ar-main-cols.ar-main-cols > div:first-child { order: 2; width: 100%; }
  .ar-main-cols.ar-main-cols > .ar-tabs { order: 0; }
  .ar-main-cols.ar-main-cols > .ar-side { order: 1; display: flex; flex-direction: column; gap: .8rem; }
  .ar-main-cols.ar-main-cols > .ar-side > .ar-side-box { width: 100%; }
  .ar-tabs { display: flex; gap: .5rem; margin-bottom: .8rem; }
  .ar-tab-btn { flex: 1; border: 1px solid rgba(148,163,184,.35); background: var(--tm-surface, #fff); border-radius: 12px; padding: .6rem .5rem; font: inherit; font-size: .85rem; font-weight: 700; color: var(--tm-muted, #64748b); cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: .4rem; transition: all .2s ease; }
  .ar-tab-btn.active { background: linear-gradient(135deg, var(--brand, #5b45e8), var(--brand-2, #7c3aed)); border-color: transparent; color: #fff; box-shadow: 0 8px 18px rgba(91,69,232,.25); }
}


/* ترتیب و چیدمان بخش‌های صفحهٔ ملک در موبایل → در تنها منبع حقیقت،
   بلوک «صفحهٔ ملک — موبایل/تبلت» (≤960px) پایین‌تر در همین فایل. */

/* املاک مرتبط صفحهٔ ملک در موبایل: کارت فشردهٔ ردیفی (مثل «مقالات مرتبط»).
   استایل کامل در assets/css/property-mobile.css است (تنها منبع حقیقتِ موبایل
   این صفحه) — کاروسل ۳کارتهٔ قبلی کارت را ۳۱٪ عرض می‌کرد و اطلاعاتی نمی‌داد. */

/* دکمه‌های شناور و جای‌گذاری نوار قیمتِ صفحهٔ ملک در موبایل → property-mobile.css */

/* ==========================================================================
   اسلایدرهای افقی موبایل — ۳ کارت در قاب، قابل کشیدن چپ/راست
   (املاک مرتبط، مقالات مرتبط، کارت‌های صفحهٔ مقالات و صفحهٔ خانه)
   دسکتاپ دست نمی‌خورد.
   ========================================================================== */
/* (بلوک ۳-کارتهٔ املاک مرتبط حذف شد — جایش در property-mobile.css با کارت
   فشردهٔ ردیفیِ همان‌شکل «مقالات مرتبط» پیاده شده است.) */

/* ==========================================================================
   دیزاین موبایل صفحهٔ ملک به‌طور کامل به assets/css/property-mobile.css منتقل
   شد (تنها منبع حقیقت، فقط در property.php بعد از property.css لود می‌شود).
   ========================================================================== */

/* ==========================================================================
   برچسب‌های روی تصویر کارت‌ها — جای مشخص برای هر برچسب (بدون تداخل)
   برچسب دسته‌بندی کارت‌های صفحهٔ اصلی: پایین-چب (قیمت پایین-راست است) و
   برچسب «به‌تازگی بازدید شده» در موبایل روی تگ قیمت می‌افتاد → کمی بالاتر و
   وسط‌چین می‌شود. دسکتاپ دست‌نخورده است.
   ========================================================================== */
.pl-main .hp-cat-badge { position:absolute; bottom:.7rem; left:.7rem; z-index:2; display:inline-flex; align-items:center; gap:.3rem; background:rgba(255,255,255,.92); color:#334155; font-size:.72rem; font-weight:800; padding:.28rem .7rem; border-radius:999px; max-width:calc(100% - 1.4rem); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

@media (max-width: 768px) {
  /* دو برچسب پایینِ کارت صفحهٔ اصلی نباید روی هم بیفتند */
  .pl-main .hp-cat-badge { max-width:46%; font-size:.66rem; padding:2px 7px; }
  .pl-main .hp-card .hp-price { font-size:.8rem; }
  /* «به‌تازگی بازدید شده» روی کارت‌های ملک (همهٔ صفحات جز خانه): در موبایل
     قبلاً وسطِ بالای تصویر می‌نشست و روی تگ بازدید (چپ) و دسته‌بندی (راست)
     می‌افتاد. حالا پایین-چپِ تصویر می‌آید؛ چون قیمت دیگر روی تصویر نیست،
     نوار پایین تصویر خالی است و تداخلی پیش نمی‌آید. */
  .prop-card .hist-badges--overlay-bottom.hist-badges--overlay {
    top: auto !important;
    bottom: .35rem !important;
    left: .35rem !important;
    right: auto !important;
    transform: none;
    justify-content: flex-start;
    flex-wrap: nowrap;
    max-width: calc(100% - .7rem);
    overflow: hidden;
  }
  .prop-card .hist-badges--overlay-bottom.hist-badges--overlay .hist-badge {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: .55rem;
    padding: .08rem .38rem;
    gap: .18rem;
  }
  /* نشان «دیده‌شده» در موبایل یکی‑دو پیکسل ریزتر می‌شود تا روی تصویر کارت جا شود */
  .pl-main .hist-badge, .prop-card .hist-badge { font-size: .55rem; }
  .pl-main .hist-badge-dot, .prop-card .hist-badge-dot { width: .3rem; height: .3rem; }
}