/* ==========================================================================
   elementor.css — پلِ المنتور به دیزاین‌سیستم
   ==========================================================================
   صفحه‌ها با «آینه‌ی DOM» ساخته می‌شوند: هر عنصر چیدمانیِ پیش‌نمایش یک
   کانتینر المنتور با همان class است و هر برگ یک ویجت هسته. یعنی ظاهر باید
   از components.css بیاید، نه از تنظیمات ویجت — تا هم طرح دقیق دربیاید و
   هم صفحه در پنل المنتور قابل ویرایش بماند.

   خنثی‌کردنِ پیش‌فرض‌های کانتینر در elementor-reset.css است که زودتر
   بارگذاری می‌شود. اینجا فقط چیزهایی می‌آید که باید از components.css و از
   شیت‌های تک‌ویجتیِ المنتور (widget-image, widget-heading) هم جلو بزند.
   ========================================================================== */

/* ── ۱. استثناها ──
   جایی که فرزندِ مستقیم باید جعبه‌ی واقعی باشد: متن روی زمینه‌ی تزیینی
   باید بالاتر از لایه‌ی absolute بنشیند و برای z-index جعبه لازم است. */
/* `.psy-hero__body > *` متن را بالای لایه‌ی تزیینیِ absolute می‌برد، ولی
   روی wrapperِ بی‌جسمِ ویجت بی‌اثر است. بلندکردنِ خودِ wrapper هم جواب
   نداد: آن‌وقت wrapper آیتمِ فلکس می‌شد و حاشیه‌ی پایینِ بندها را می‌بلعید
   و ستون ۳۷ پیکسل کوتاه‌تر می‌شد. پس خودِ عنصر بلند می‌شود. */
.psy-hero__body > .elementor-widget > .elementor-widget-container > *,
.psy-split-hero__body > .elementor-widget > .elementor-widget-container > * {
  position: relative;
  z-index: 1;
}

/* `.psy-prose > * + *` فاصله‌ی بین بلوک‌های متن را می‌دهد، ولی در المنتور
   روی wrapperِ بی‌جسمِ ویجت می‌افتد و بی‌اثر می‌ماند. عمداً فقط به بلوک‌های
   متنی زده می‌شود، نه تیترها: تیترها margin-block-start بزرگ‌ترِ خودشان را
   دارند و یک بار همین قاعده رویشان افتاد و همه را به ۱em کوچک کرد. */
.psy-prose > .elementor-widget + .elementor-widget > .elementor-widget-container
  > :is(p, ul, ol, blockquote, figure) {
  margin-block-start: 1em;
}

/* ── ۲. تیترها ──
   المنتور line-height:1 روی هر تیتر می‌گذارد؛ در فارسی دنباله‌ی «ج» و «ی»
   بریده می‌شود. اندازه و وزن از typography.css می‌آید و دست نمی‌خورد. */
.elementor-heading-title {
  line-height: var(--lh-tight);
  margin: 0;
  padding: 0;
}

/* ── ۳. تصویرها ──
   widget-image-rtl.css بعد از CSS پوسته چاپ می‌شود و تصویر را وسط‌چین و
   inline-block می‌کند؛ هر دو خلافِ طرح‌اند. */
.psy-el-box .elementor-widget-image { text-align: inherit; }
.psy-el-box .elementor-widget-image img { display: block; vertical-align: initial; }
.psy-el-box .elementor-widget-image a { display: contents; }

/* ── ۴. فرم تماس (Contact Form 7) ──
   CF7 هر فیلد را در یک <span class="wpcf7-form-control-wrap"> می‌پیچد.
   .psy-field یک گرید است و آن span آیتمش می‌شد، پس ورودی و آیکن جابه‌جا
   می‌شدند. مثل wrapperهای المنتور، از چیدمان حذفش می‌کنیم. */
.psy-field .wpcf7-form-control-wrap { display: contents; }
.psy-form .wpcf7 { margin: 0; }
.psy-form .wpcf7-form > p:empty { display: none; }

/* ── ۵. حاشیه‌ی بندها ──
   typography.css با `p:last-child { margin-bottom: 0 }` فاصله‌ی بندِ آخر را
   برمی‌دارد. در المنتور هر بند تنها فرزندِ ظرفِ ویجتِ خودش است، پس همه‌ی
   بندها «آخر» حساب می‌شوند و کلِ فاصله‌ها می‌رود — ستون‌های متنی حدود
   ۴۰ پیکسل کوتاه‌تر می‌شدند. فقط بندی باید صفر بماند که ویجتش هم واقعاً
   آخرین ویجتِ آن جعبه است. مقدار ۱em همان چیزی است که typography.css
   روی `p` می‌گذارد. */
.psy-el-box > .elementor-widget:not(:last-child) > .elementor-widget-container > p:last-child {
  margin-block-end: 1em;
}

/* ── ۶. رنگِ متن ──
   المنتور برای هر صفحه/قالب یک post-<id>.css می‌سازد که آخر از همه چاپ
   می‌شود و داخلش رنگِ سراسریِ کیت را روی ویجت‌های متن می‌گذارد. روی
   زمینه‌های تیره — پابرگ و نوارهای سرمه‌ای — متن همان سرمه‌ای می‌شد و
   عملاً نامرئی. رنگ باید ارثی بماند تا components.css تصمیم بگیرد. */
.psy-el-box .elementor-widget-text-editor,
.psy-el-box .elementor-widget-text-editor > .elementor-widget-container {
  color: inherit;
}

/* ── ۷. کانتینرِ سطحِ اول ──
   المنتور روی کانتینرهای سطحِ اول این را می‌گذارد:
     :is(.elementor-section-wrap, [data-elementor-id]) > .e-con
       { max-width: min(100%, var(--width)) }
   وزنش دو کلاس است و از `.psy-container` جلو می‌زند. هرجا ماکاپ یک
   .psy-container را مستقیم به‌عنوان بخش گذاشته (کارتِ هم‌پوشانِ صفحه‌ی
   درباره، کارتِ مشورت اولیه) قاب تمام‌عرض می‌شد. */
.e-con.psy-container { max-width: var(--container); }
.e-con.psy-container--wide { max-width: 1400px; }

/* سربرگ قابِ پهن‌تری دارد (`.psy-header > .psy-container` در
   components.css). آن قاعده وزنِ یک کلاس و یک تگ دارد و از قاعده‌ی بالا
   می‌بازد؛ نتیجه‌اش این شد که نوارِ سربرگ از ۱۳۵۲ به ۱۱۵۲ جمع شد و
   منو زیر لوگو و دکمه رفت. */
.psy-header > .e-con.psy-container { max-width: 1400px; }

/* ── ۸. عناصرِ پوسته‌ی مادر ──
   Archi دکمه‌ی «بازگشت به بالا» و نوارِ پیشرفتِ بارگذاری را زرد می‌کشد.
   هر دو بیرون از نشانه‌گذاریِ ما هستند ولی روی صفحه دیده می‌شوند. */
#back-to-top,
#back-to-top:hover,
#back-to-top:focus {
  background-color: var(--brand);
  border-color: var(--brand);
  color: #fff;
}

#back-to-top:hover { background-color: var(--dark); border-color: var(--dark); }

.pace .pace-progress,
#nprogress .bar,
.preloader-progress,
.archi-progress {
  background-color: var(--brand) !important;
}

#nprogress .peg { box-shadow: 0 0 10px var(--brand), 0 0 5px var(--brand); }
#nprogress .spinner-icon { border-top-color: var(--brand); border-left-color: var(--brand); }