/* پرداخت ریسپانسیو و حرکت سبک موبایل برای کل سایت (فقط transform/opacity) */

/* منوی دسکتاپ: هیچ گزینه‌ای شکسته نشود و در عرض‌های متوسط فشرده‌تر شود */
@media (min-width: 992px) {
  .navbar-main .navbar-nav > li > a, .navbar-main .navbar-nav > li > .nav-link { white-space: nowrap; }
}
@media (min-width: 992px) and (max-width: 1399px) {
  .navbar-main .navbar-nav > li > a { font-size: 14.5px; padding-inline: 4px; }
  .navbar-main .navbar-brand .Middle-logo #logoText p { font-size: 2.7rem; }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .navbar-main .navbar-nav > li > a { font-size: 13px; padding-inline: 2px; }
  .navbar-main .navbar-brand .Middle-logo #logoText p { font-size: 2.1rem; }
}

/* نوار پیشرفت اسکرول بالای صفحه (موبایل) */
.vm-prog { position: fixed; inset: 0 0 auto 0; height: 3px; z-index: 2147; pointer-events: none; transform-origin: right; transform: scaleX(0); background: linear-gradient(90deg, #7b5cff, #22d3ee, #f472b6); opacity: 0; transition: opacity .25s; will-change: transform; }
.vm-prog.on { opacity: 1; }

@media (max-width: 991px) {
  /* ورود نرم بلوک‌ها هنگام اسکرول؛ بدون JS همه دیده می‌شوند */
  html.vm-on .vm-rv { opacity: 0; transform: translateY(26px) scale(.98); transition: opacity .6s cubic-bezier(.2,.7,.2,1), transform .6s cubic-bezier(.2,.7,.2,1); transition-delay: var(--vd, 0s); }
  html.vm-on .vm-rv.vm-in { opacity: 1; transform: none; }

  /* بازخورد لمس: فشرده شدن ملایم */
  .btn, .vs-btn, .vv-pk__cta, .vf__form button, .pp__more, .pp__tabbar button, .explore-item, .vv-pk__card, .vs-row, .pp__rcard, .vf__col a { -webkit-tap-highlight-color: transparent; }
  .btn:active, .vs-btn:active, .vv-pk__cta:active, .vf__form button:active, .pp__rcard:active, .vf__col a:active { transform: scale(.97); }
  .explore-item:active, .vv-pk__card:active { transform: scale(.985); }

  /* تصویرها و جدول‌ها هیچ‌وقت از قاب بیرون نزنند */
  main img, .pp img, .vs img { max-width: 100%; height: auto; }
  main table { max-width: 100%; }
  main iframe, main video { max-width: 100%; }
  /* متن‌های طولانی بدون فاصله قاب را نشکنند */
  main h1, main h2, main h3, main p, main li, main a { overflow-wrap: break-word; }
}

/* موبایل: بنر عنوان صفحه‌های داخلی کوتاه‌تر و بدون نوشته‌ی غول‌پیکر پس‌زمینه */
@media (max-width: 767px) {
  .breadcrumb { padding-block: 112px 34px !important; min-height: 0 !important; }
  .breadcrumb__title { font-size: 26px !important; line-height: 1.5; }
  .breadcrumb .shapes, .breadcrumb [class*="shape"], .breadcrumb__bg-text { opacity: .25; }
  .py-120 { padding-block: 56px !important; }
}

/* حرکت ملایم تزئینی روی عنوان‌های بخش‌ها در موبایل */
@media (max-width: 767px) {
  .vm-float { animation: vm-float 6s ease-in-out infinite; }
  @keyframes vm-float { 50% { transform: translateY(-5px); } }
}

@media (prefers-reduced-motion: reduce) {
  html.vm-on .vm-rv { opacity: 1 !important; transform: none !important; transition: none !important; }
  .vm-float, .vm-prog { animation: none !important; transition: none !important; }
}

/* ===== کارت‌های خدمات در موبایل: شیشه‌ای، عمق‌دار و سه‌بعدی (فقط transform) ===== */
@media (max-width: 767px) {
  .vp-bento { perspective: 1000px; gap: 16px; margin-top: 30px; }
  .vp-bento .vp-card, .vp-bento .vp-card.w6 { grid-column: span 12; display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: 14px; row-gap: 8px; align-items: center; padding: 20px 18px 18px; border-radius: 26px;
    background: linear-gradient(145deg, rgba(255,255,255,.1), rgba(255,255,255,.025)); border: 1px solid rgba(255,255,255,.14); transform-style: preserve-3d; transform: perspective(900px) rotateX(var(--rx, 0deg)) translateZ(0);
    box-shadow: 0 28px 44px -28px rgba(0,0,0,.95), inset 0 1px 0 rgba(255,255,255,.2), inset 0 -26px 40px -30px rgba(123,92,255,.7); will-change: transform; }
  .vp-bento .vp-card::after { content: ""; position: absolute; width: 170px; height: 170px; border-radius: 50%; inset-inline-start: -50px; top: -60px; background: radial-gradient(circle, rgba(123,92,255,.4), transparent 68%); pointer-events: none; }
  .vp-bento .vp-card__ic { grid-row: 1; grid-column: 1; width: 62px; height: 62px; border-radius: 20px; font-size: 25px; transform: translateZ(40px); box-shadow: 0 16px 28px -10px rgba(123,92,255,.95), inset 0 1px 0 rgba(255,255,255,.4); animation: vm-icfloat 5s ease-in-out infinite; }
  .vp-bento .vp-card:nth-child(even) .vp-card__ic { animation-delay: -2.2s; }
  .vp-bento .vp-card h3 { grid-row: 1; grid-column: 2; align-self: center; margin: 0; font-size: 19px; transform: translateZ(26px); overflow-wrap: normal; word-break: normal; hyphens: none; }
  .vp-bento .vp-card p { grid-column: 1 / -1; font-size: 14.5px; line-height: 1.9; }
  .vp-bento .vp-card small, .vp-bento .vp-card .vp-card__go { grid-column: 1 / -1; }
  .vp-bento .vp-card small { display: inline-block; justify-self: start; padding: 2px 12px; border-radius: 99px; background: rgba(52,211,153,.14); }
  .vp-bento .vp-card .vp-card__go { justify-self: start; padding: 8px 16px; border-radius: 99px; background: rgba(123,92,255,.22); border: 1px solid rgba(123,92,255,.45); color: #fff; }
  @keyframes vm-icfloat { 50% { transform: translateZ(40px) translateY(-5px); } }
}
@media (prefers-reduced-motion: reduce) { .vp-bento .vp-card__ic { animation: none !important; } }