/* ==========================================================
econ-base.css
این فایل تا ۴ اکتبر ۲۰۲۶ به‌صورت inline در functions.php
(خط ۱۶۷۹۳) روی هر صفحه چاپ می‌شد — ۵۵٬۵۵۸ بایت.
چرا بیرون آمد: `` صفحهٔ نخست ۱۳۵KB بود، ۳۲٪ کل HTML،
که ۱۰۷KBاش CSS درون‌خطی بود. LCP ۳٫۲ ثانیه با Render Delay
۱٬۹۰۹ms، در حالی که ترد اصلی بی‌کار بود (TBT صفر) — یعنی
گلوگاه حجمِ هد بود نه محاسبه.
درون‌خطی دو هزینه داشت: کش نمی‌شد (هر بازدید دوباره)، و از
`remove_unused_css` پرفمترز بیرون می‌ماند چون آن سازوکار فقط
فایل‌ها را هرس می‌کند.
⚠ محتوای زیر بایت‌به‌بایت همان قبل است.
========================================================== */
/* ── ۱ فونت ──
قالبِ مادر روی برخی عنصرها sc_iransans می‌نشاند. یک صفحه با
دو فونتِ متفاوت، حتی اگر شبیه باشند، در وزن و ارتفاعِ x فرق
دارد و متن ناهموار دیده می‌شود. */
body.econ-learning-path .elementor *,
body.econ-learning-path .elementor-widget-container *,
body.econ-std-page .elementor *,
body.econ-std-page .elementor-widget-container *,
body.econ-cert-page .elementor *,
body.econ-cert-page .elementor-widget-container *,
body.econ-course-page .elementor *,
body.econ-course-page .elementor-widget-container *,
body.single-portfolio .elementor *,
body.single-portfolio .elementor-widget-container * {
font-family: var(--econ-font) !important;
}
/* ── econ-icon-font-rescue ──
⚠ قاعدهٔ بالا `font-family` را با `!important` روی یک
**ستاره** می‌گذارد، پس تگِ ِ آیکون هم فونتِ متن
می‌گیرد و گلیف Font Awesome مربعِ خالی می‌شود.
نمونهٔ سنجیده‌شده: `` در تیترِ
«کلید طلایی…» — کدپوینت U+F559 در زیرمجموعه **هست** و
`.fal{font-family:"Font Awesome 5 Pro"}` هم بار می‌شد؛
فقط این ستاره رویش می‌افتاد (۰٫۲٫۱ بر ۰٫۱٫۰).
اینجا با ویژگیِ بالاتر (۰٫۳٫۱) پس گرفته می‌شود، بدون
دست‌زدن به قاعدهٔ بالا. */
body.econ-learning-path .elementor .fal,
body.econ-learning-path .elementor .fas,
body.econ-learning-path .elementor .far,
body.econ-learning-path .elementor .fab,
body.econ-learning-path .elementor .fad,
body.econ-learning-path .elementor i[class*="fa-"],
body.econ-learning-path .elementor [class*="eicon-"],
body.econ-learning-path .elementor-widget-container .fal,
body.econ-learning-path .elementor-widget-container .fas,
body.econ-learning-path .elementor-widget-container .far,
body.econ-learning-path .elementor-widget-container .fab,
body.econ-learning-path .elementor-widget-container .fad,
body.econ-learning-path .elementor-widget-container i[class*="fa-"],
body.econ-learning-path .elementor-widget-container [class*="eicon-"],
body.econ-std-page .elementor .fal,
body.econ-std-page .elementor .fas,
body.econ-std-page .elementor .far,
body.econ-std-page .elementor .fab,
body.econ-std-page .elementor .fad,
body.econ-std-page .elementor i[class*="fa-"],
body.econ-std-page .elementor [class*="eicon-"],
body.econ-std-page .elementor-widget-container .fal,
body.econ-std-page .elementor-widget-container .fas,
body.econ-std-page .elementor-widget-container .far,
body.econ-std-page .elementor-widget-container .fab,
body.econ-std-page .elementor-widget-container .fad,
body.econ-std-page .elementor-widget-container i[class*="fa-"],
body.econ-std-page .elementor-widget-container [class*="eicon-"],
body.econ-cert-page .elementor .fal,
body.econ-cert-page .elementor .fas,
body.econ-cert-page .elementor .far,
body.econ-cert-page .elementor .fab,
body.econ-cert-page .elementor .fad,
body.econ-cert-page .elementor i[class*="fa-"],
body.econ-cert-page .elementor [class*="eicon-"],
body.econ-cert-page .elementor-widget-container .fal,
body.econ-cert-page .elementor-widget-container .fas,
body.econ-cert-page .elementor-widget-container .far,
body.econ-cert-page .elementor-widget-container .fab,
body.econ-cert-page .elementor-widget-container .fad,
body.econ-cert-page .elementor-widget-container i[class*="fa-"],
body.econ-cert-page .elementor-widget-container [class*="eicon-"],
body.econ-course-page .elementor .fal,
body.econ-course-page .elementor .fas,
body.econ-course-page .elementor .far,
body.econ-course-page .elementor .fab,
body.econ-course-page .elementor .fad,
body.econ-course-page .elementor i[class*="fa-"],
body.econ-course-page .elementor [class*="eicon-"],
body.econ-course-page .elementor-widget-container .fal,
body.econ-course-page .elementor-widget-container .fas,
body.econ-course-page .elementor-widget-container .far,
body.econ-course-page .elementor-widget-container .fab,
body.econ-course-page .elementor-widget-container .fad,
body.econ-course-page .elementor-widget-container i[class*="fa-"],
body.econ-course-page .elementor-widget-container [class*="eicon-"],
body.single-portfolio .elementor .fal,
body.single-portfolio .elementor .fas,
body.single-portfolio .elementor .far,
body.single-portfolio .elementor .fab,
body.single-portfolio .elementor .fad,
body.single-portfolio .elementor i[class*="fa-"],
body.single-portfolio .elementor [class*="eicon-"],
body.single-portfolio .elementor-widget-container .fal,
body.single-portfolio .elementor-widget-container .fas,
body.single-portfolio .elementor-widget-container .far,
body.single-portfolio .elementor-widget-container .fab,
body.single-portfolio .elementor-widget-container .fad,
body.single-portfolio .elementor-widget-container i[class*="fa-"],
body.single-portfolio .elementor-widget-container [class*="eicon-"] {
font-family: "Font Awesome 5 Pro","Font Awesome 5 Free","Font Awesome 6 Free","Font Awesome 5 Duotone" !important;
}
/* ── ۲ دکمه‌ها، هم‌شکلِ دکمه‌های صفحهٔ اصلی ──
⚠ رنگِ متن عمداً تعیین نمی‌شود: قاعدهٔ کیتِ المنتور آن را با
!important روی #3D2E0F می‌گذارد و تضادِ ۱۱.۹۹ می‌دهد. هر
رنگی که اینجا تحمیل کنیم از آن بدتر می‌شود. */
body.econ-learning-path .elementor-button,
body.econ-std-page .elementor-button:not([type="submit"]),
body.econ-cert-page .elementor-button:not([type="submit"]) {
background-color: var(--econ-cream) !important;
background-image: none !important;
border: 1px solid var(--econ-line) !important;
border-radius: var(--econ-btn-radius) !important;
padding: var(--econ-btn-pad);
font-weight: 500;
line-height: var(--econ-lh-tight);
box-shadow: none !important;
text-shadow: none !important;
transition: background-color .15s ease, border-color .15s ease;
}
body.econ-learning-path .elementor-button:hover,
body.econ-learning-path .elementor-button:focus-visible,
body.econ-std-page .elementor-button:not([type="submit"]):hover,
body.econ-std-page .elementor-button:not([type="submit"]):focus-visible,
body.econ-cert-page .elementor-button:not([type="submit"]):hover,
body.econ-cert-page .elementor-button:not([type="submit"]):focus-visible {
background-color: var(--econ-btn-hover-bg) !important;
border-color: var(--econ-btn-hover-bg) !important;
color: var(--econ-btn-hover-fg) !important;
}
body.econ-learning-path .elementor-button:focus-visible,
body.econ-std-page .elementor-button:focus-visible,
body.econ-cert-page .elementor-button:focus-visible {
outline: 2px solid var(--econ-focus);
outline-offset: 2px;
}
/* ⚠ دکمهٔ ارسالِ فرم استثناست: CTA اصلیِ صفحه است و طلاییِ
#CCB070 می‌ماند؛ فقط هندسه‌اش با بقیه یکی می‌شود. اگر
کرمش کنیم، تنها کنشِ صفحه از بقیهٔ لینک‌ها قابل تفکیک نیست. */
body.econ-std-page .elementor-button[type="submit"],
body.econ-cert-page .elementor-button[type="submit"] {
border-radius: var(--econ-btn-radius);
padding: var(--econ-btn-pad);
line-height: var(--econ-lh-tight);
box-shadow: none;
text-shadow: none;
}
/* روی موبایل، مثلِ همان دکمهٔ مرجع کمی جمع‌تر */
@media (max-width: 767px) {
body.econ-learning-path .elementor-button,
body.econ-std-page .elementor-button,
body.econ-cert-page .elementor-button {
border-radius: 10px !important;
padding: 12px 22px;
}
}
/* ── ۳ چیدمانِ متن ──
justify برای متنِ فارسی خوانایی را بالا می‌برد، ولی فقط با
text-align-last: right؛ وگرنه سطرِ آخرِ هر پاراگراف هم کشیده
می‌شود و فاصله‌های عجیب می‌سازد. */
body.econ-learning-path .elementor-widget-text-editor p,
body.econ-learning-path .elementor-widget-theme-post-content p,
body.econ-std-page .elementor-widget-text-editor p,
body.econ-std-page .elementor-widget-accordion p,
body.econ-std-page .elementor-widget-toggle p,
body.econ-std-page .elementor-widget-n-accordion p,
body.econ-std-page .e-n-accordion-item p,
body.econ-std-page .elementor-tab-content p,
body.econ-std-page .entry-content p {
text-align: justify;
text-align-last: right;
text-justify: inter-word;
}
/* ── اندازهٔ متن ──
استانداردِ متنِ نثر ۱۷ پیکسل است (همان --econ-text که
مقاله‌ها دارند). تا امروز این صفحه‌ها روی ۱۶ مانده بودند
چون قاعده فقط ریتم را می‌گذاشت نه اندازه را.
⚠ استثنا: صفحهٔ «تعیین وقت مشاوره» عمداً ۱۶ می‌ماند —
کارت‌های ۳۴۷ پیکسلی‌اش با ۱۷ حدود بیست نویسه در سطر
می‌گیرند و بدتر خوانده می‌شوند. قاعده‌اش ویژگیِ بالاتر دارد. */
body.econ-learning-path .elementor-widget-text-editor p,
body.econ-std-page .elementor-widget-text-editor p,
body.econ-std-page .entry-content p {
font-size: var(--econ-text);
}
/* ── ۵ ریتم، همان عددهای استانداردِ مقالات ── */
body.econ-learning-path .elementor-widget-text-editor p,
body.econ-std-page .elementor-widget-text-editor p,
body.econ-std-page .elementor-widget-accordion p,
body.econ-std-page .elementor-widget-n-accordion p,
body.econ-std-page .e-n-accordion-item p,
body.econ-std-page .elementor-tab-content p,
body.econ-std-page .entry-content p {
margin-block: 0 var(--econ-para-gap);
line-height: var(--econ-lh);
}
body.econ-learning-path .elementor-widget-text-editor > .elementor-widget-container > *:last-child {
margin-block-end: 0;
}
body.econ-learning-path .elementor-widget-heading h2,
body.econ-learning-path .elementor-widget-heading .elementor-heading-title {
line-height: 1.35;
}
body.econ-learning-path .elementor-widget-text-editor ul,
body.econ-learning-path .elementor-widget-text-editor ol {
margin-block: 0 var(--econ-para-gap);
line-height: 1.85;
}
body.econ-learning-path .elementor-widget-text-editor li {
margin-block-end: .45em;
}
/* ══ صفحهٔ «تعیین وقت مشاوره» ══
اندازهٔ متن روی این صفحه بین ۱۳ و ۱۷ پیکسل پخش بود:
زیست‌نامهٔ دکتر در ستونی به عرض ۷۸۷ پیکسل با ۱۳ پیکسل
ست شده بود و پاسخ‌های پرسش‌های متداول با ۱۴. یک اندازهٔ
واحد انتخاب شد نه بیشترین اندازه، چون کارت‌های باریکِ
۳۴۷ پیکسلی با ۱۷ پیکسل فقط حدود بیست نویسه در سطر
می‌گیرند و بدتر خوانده می‌شوند. */
/* ⚠ ویژگی عمداً بالا برده شده: قاعدهٔ درون‌خطیِ المنتور روی
«.elementor-element-xxxx .elementor-widget-container» می‌نشیند
و نسخهٔ ساده‌ترِ این قاعده را می‌برد. اندازه‌گیری نشان داد
شانزده پاراگرافِ آکاردئون روی ۱۴px مانده بودند. */
body.econ-consult-page .elementor-widget-text-editor p,
body.econ-consult-page .elementor-widget-n-accordion p,
body.econ-consult-page .e-n-accordion-item p,
body.econ-consult-page .elementor-element .elementor-widget-container p,
body.econ-consult-page .e-n-accordion-item .elementor-widget-container p {
font-size: 16px;
}
body.econ-consult-page .e-n-accordion-item .elementor-widget-container p {
margin-block-end: 1.45em;
}
body.econ-consult-page .e-n-accordion-item .elementor-widget-container p:last-child {
margin-block-end: 0;
}
/* دکمه‌ها: دو دکمه padding خودشان را از دادهٔ المنتور می‌گرفتند
(۱۸×۳۵ به‌جای ۱۷×۳۰) و اندازهٔ قلمشان هم فرق داشت. */
body.econ-std-page .elementor-widget-button .elementor-button:not([type="submit"]),
body.econ-cert-page .elementor-widget-button .elementor-button:not([type="submit"]) {
padding: var(--econ-btn-pad);
font-size: var(--econ-btn-size);
}
body.econ-consult-page .e-n-accordion-item-title,
body.econ-consult-page .e-n-accordion-item-title-text {
font-size: var(--econ-text);
}
/* ══ هیرو صفحهٔ مشاوره: تمام‌عرض و خوانا ══
⚠ عرض از `.site-content-inner.container` می‌آمد؛ سقف
۱۱۰۰ پیکسل دارد و **مارجین خودکار ندارد**، پس در RTL
به راست می‌چسبید و ۱۸۰ پیکسل فضای مرده در چپ می‌ماند.
سقف فقط روی همین صفحه برداشته می‌شود؛ هر بخش عرضش را
از `.e-con-inner` می‌گیرد، پس بقیهٔ صفحه همان ۱۱۰۰
می‌ماند — این بار وسط‌چین — و تنها هیرو تمام‌عرض می‌شود. */
body.econ-consult-page .site-content-inner.container {
max-width: none !important;
}
body.econ-consult-page .elementor-10572 > .elementor-element > .e-con-inner {
max-width: 1100px;
margin-inline: auto;
}
/* بخش «مشاوره به شرکت‌ها» `e-con-full` است و `.e-con-inner` ندارد */
body.econ-consult-page .elementor-10572 > .elementor-element-27de3009 {
max-width: 1100px;
margin-inline: auto;
}
/* ══ نوار سفیدِ بالای هیرو ══
⚠ `.main-page-content` پدینگ بالای ۴۰ پیکسل و پس‌زمینهٔ
`#F7F7F7` دارد، پس هیرو از y=۴۰ شروع می‌شد نه از لبهٔ
صفحه. تا وقتی هیرو داخل قابِ ۱۱۰۰ پیکسلی بود این نوار
بخشی از قاب خوانده می‌شد؛ با تمام‌عرض‌شدن، مثل یک نقص
دیده می‌شود. هیرو خودش `padding-top: 104px` دارد تا زیر
هدرِ چسبان جا بماند، پس بالا رفتنش چیزی را نمی‌پوشاند. */
body.econ-consult-page .main-page-content {
padding-block-start: 0;
}
/* ══ پس‌زمینهٔ صفحه ══
هم‌رنگِ بخشِ «مشاوره به شرکت‌ها» در انتهای صفحه (`27de3009`)
که `#FDFBF6` است — کرمِ گرم، به‌جای خاکستریِ سردِ `#F7F7F7`.
⚠ پیش از اعمال، روشنایی هر دو حساب شد: `#F7F7F7` برابر
۰٫۹۰۲ و `#FDFBF6` برابر ۰٫۹۶۹. یعنی رنگ تازه **روشن‌تر**
است، پس کنتراستِ هیچ متنی روی آن بدتر نمی‌شود. اگر
تیره‌تر بود، باید هر متنِ روی پس‌زمینه دوباره سنجیده
می‌شد. */
body.econ-consult-page,
body.econ-consult-page .wrap,
body.econ-consult-page .main-page-content {
background-color: #FDFBF6;
}
/* دو بخشی که مالک نام برد و باید هم‌رنگِ صفحه شوند:
25986e9 — «چه نتایجی از مشاوره … کسب خواهید کرد؟»
4af678b — «درخواست جلسه مشاوره»
⚠ بخش `333e889` («جلسه مشاوره سرمایه گذاری») عمداً سفید
ماند چون نام برده نشده بود. */
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-25986e9,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-4af678b,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-333e889 {
background-color: #FDFBF6;
}
/* شش کارتِ «چه نتایجی…» پس‌زمینه نداشتند و رنگِ کرمِ بخش را
نشان می‌دادند؛ حالا سفیدِ خالص می‌گیرند تا روی کرم جدا
دیده شوند. سایهٔ طلاییِ خودشان دست‌نخورده می‌ماند. */
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-c85bd00,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-e866657,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-80a7bf5,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-05be850,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-b3eff4e,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-8b8ce7a {
background-color: #FFFFFF;
}
/* ══ یکسان‌سازی کارت‌های صفحه ══
مرجع، شش کارتِ «چه نتایجی…» است:
شعاع ۱۵ · سایهٔ طلاییِ `0 8px 18px -7px #D4AF37`
۱۷ کارت شمرده شد با سه سبکِ متفاوت:
۶ کارتِ مرجع — شعاع ۱۵، سایهٔ طلایی
نوار اعداد و دو کارتِ جلسه — شعاع ۱۵/۲۴، **بدون سایه**
کارتِ فرم — شعاع ۱۲، سایهٔ `rgba(0,0,0,.5)`
شش کارتِ شرکتی — شعاع ۱۴، بدون سایه
⚠ آن سایهٔ `rgba(0,0,0,.5) 0 0 10px` روی کارتِ فرم از همه
تندتر بود و با لحنِ بقیه نمی‌خواند.
⚠ و ایرادی در خودِ کارتِ مرجع: هاورش فقط
`border-color: #D4AF37` می‌گذارد در حالی که کارت
`border-width: 0` دارد — یعنی هاور **هیچ‌وقت دیده
نمی‌شده**. به‌جای تکرار همان، هاورِ واقعی ساخته شد.
⚠ حلقهٔ هاور با `outline` است نه `border`: شش کارتِ شرکتی
حاشیهٔ ۱ پیکسلیِ `#E6DCC6` خودشان را دارند و دست‌کاریِ
`border` آن را می‌برد. `outline` نه جای می‌گیرد نه چیدمان
را جابه‌جا می‌کند. */
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-c85bd00,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-e866657,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-80a7bf5,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-05be850,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-b3eff4e,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-8b8ce7a,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-b6adc28,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-0a1829f,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-7c2d710,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-fd311fd,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-fb8848e,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-15f96e87,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-46910dff,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-4700f71d,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-4fc5ed68,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-f6aedc5,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-ba36b9d {
border-radius: 15px;
box-shadow: 0 8px 18px -7px rgba(212, 175, 55, .85);
transition: box-shadow .2s ease, outline-color .2s ease, transform .2s ease;
}
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-c85bd00:hover,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-e866657:hover,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-80a7bf5:hover,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-05be850:hover,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-b3eff4e:hover,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-8b8ce7a:hover,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-b6adc28:hover,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-0a1829f:hover,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-7c2d710:hover,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-fd311fd:hover,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-fb8848e:hover,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-15f96e87:hover,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-46910dff:hover,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-4700f71d:hover,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-4fc5ed68:hover,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-f6aedc5:hover,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-ba36b9d:hover,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-c85bd00:focus-within,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-e866657:focus-within,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-80a7bf5:focus-within,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-05be850:focus-within,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-b3eff4e:focus-within,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-8b8ce7a:focus-within,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-b6adc28:focus-within,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-0a1829f:focus-within,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-7c2d710:focus-within,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-fd311fd:focus-within,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-fb8848e:focus-within,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-15f96e87:focus-within,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-46910dff:focus-within,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-4700f71d:focus-within,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-4fc5ed68:focus-within,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-f6aedc5:focus-within,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-ba36b9d:focus-within {
box-shadow: 0 12px 26px -8px rgba(212, 175, 55, .95);
outline: 1px solid #D4AF37;
outline-offset: -1px;
transform: translateY(-3px);
}
/* حرکت فقط برای کسی که خواسته است. */
@media (prefers-reduced-motion: reduce) {
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-c85bd00,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-e866657,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-80a7bf5,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-05be850,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-b3eff4e,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-8b8ce7a,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-b6adc28,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-0a1829f,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-7c2d710,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-fd311fd,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-fb8848e,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-15f96e87,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-46910dff,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-4700f71d,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-4fc5ed68,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-f6aedc5,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-ba36b9d {
transition: none;
}
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-c85bd00:hover,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-e866657:hover,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-80a7bf5:hover,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-05be850:hover,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-b3eff4e:hover,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-8b8ce7a:hover,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-b6adc28:hover,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-0a1829f:hover,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-7c2d710:hover,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-fd311fd:hover,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-fb8848e:hover,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-15f96e87:hover,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-46910dff:hover,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-4700f71d:hover,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-4fc5ed68:hover,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-f6aedc5:hover,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-ba36b9d:hover,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-c85bd00:focus-within,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-e866657:focus-within,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-80a7bf5:focus-within,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-05be850:focus-within,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-b3eff4e:focus-within,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-8b8ce7a:focus-within,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-b6adc28:focus-within,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-0a1829f:focus-within,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-7c2d710:focus-within,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-fd311fd:focus-within,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-fb8848e:focus-within,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-15f96e87:focus-within,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-46910dff:focus-within,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-4700f71d:focus-within,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-4fc5ed68:focus-within,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-f6aedc5:focus-within,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-ba36b9d:focus-within {
transform: none;
}
}
/* ══ ارتفاع هیرو ══
⚠ `min-height: 100vh` روی نمایشگر بلند یعنی نوارِ ۱۱۰۰
پیکسلی با محتوای ۱۰۳۰ پیکسلی وسطش — فضای خالی آن‌قدر زیاد
می‌شود که بخش «ناتمام» خوانده می‌شود، و نوار اعداد که ۴۰
پیکسل روی هیرو می‌افتد زیر خط تا می‌رود.
`clamp` سه کار می‌کند: روی نمایشگر کوتاه کف ۵۶۰ را نگه
می‌دارد، روی معمولی با ارتفاع صفحه می‌آید، و روی بلند
بیشتر از ۷۸۰ کش نمی‌آید. */
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-16a83f6 {
/* سقف و کف ۸۰ پیکسل بالاتر رفت تا زیر دو دکمه هوا بماند. */
min-height: clamp(640px, 88vh, 860px);
/* ⚠ این فضا عمداً **پدینگِ پایینِ خودِ هیرو**ست، نه مارجینِ
نوار اعداد. اگر نوار را با مارجین پایین می‌بردم،
همپوشانیِ ۴۰ پیکسلی‌اش با هیرو — که بخشی از طراحی
است — به هم می‌خورد. این‌طور، هم تصویر بلندتر می‌شود،
هم دکمه‌ها نفس می‌کشند، هم همپوشانی سر جایش می‌ماند. */
padding-block-end: 96px;
}
/* محتوا به‌جای چسبیدن به بالا، در ارتفاعِ هیرو وسط می‌نشیند —
وگرنه ویدئو به کفِ نوار می‌چسبد. */
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-16a83f6 > .e-con-inner {
align-items: center;
}
/* هیرو از سقف بیرون می‌زند: `.main-page-content` سقف ۱۲۰۰ و
padding ۷۰ دارد و `.container` ۱۵ دیگر؛ روی‌هم ۱۲۵ پیکسل
از هر طرف. حالا که والد وسط‌چین است، منفی‌کردن همین مقدار
با `50% - 50vw` دقیقاً لبه‌به‌لبه می‌شود. محتوا همچنان در
۱۱۰۰ وسط می‌ماند تا با بقیهٔ صفحه هم‌تراز بماند. */
body.econ-consult-page .elementor-10572 > .elementor-element-16a83f6 {
margin-inline: calc(50% - 50vw);
width: auto;
max-width: none;
}
/* ⚠ `!important` اینجا ناچاری است، نه سلیقه: قالب خودش
`.e-con-inner{max-width:var(--site-max-width)!important}`
می‌گذارد و هیچ ویژگی‌ای آن را نمی‌برد. عدد از حسابِ
خودِ صفحه می‌آید تا با بقیهٔ بخش‌ها هم‌تراز بماند:
سقف ۱۲۰۰ منهای padding ۷۰+۷۰ قالب و ۱۵+۱۵ کانتینر. */
body.econ-consult-page .elementor-10572 > .elementor-element-16a83f6 > .e-con-inner {
max-width: calc(var(--site-max-width, 1200px) - 170px) !important;
margin-inline: auto;
padding-inline: 16px;
}
/* در عرضِ بیشتر، عکس با `background-size: auto` کاشی می‌شد */
body.econ-consult-page .elementor-element-16a83f6 {
background-size: cover;
background-position: center;
background-repeat: no-repeat;
}
/* ⚠ نقطهٔ شکست باید **دقیقاً** با `media` دو تگ preload یکی
باشد. اگر یکی ۷۶۷ باشد و دیگری ۷۶۸، مرورگر هر دو فایل را
می‌گیرد و نتیجه از حالت بدون بهینه‌سازی هم بدتر می‌شود.
ویژگی عمداً ۰٫۵٫۱ است تا قاعدهٔ درون‌خطیِ خودِ المنتور
(۰٫۳٫۰) را ببرد. */
@media (max-width: 767px) {
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-16a83f6 {
background-image: url("https://econclinic.com/wp-content/uploads/2024/10/%D8%A8%DA%A9-%D9%85%D8%B4%D8%A7%D9%88%D8%B1%D9%87-768x512.webp");
}
}
/* ⚠ کنتراست روی **خودِ عکس** اندازه‌گیری شد، نه روی رنگِ
والد — والد `#f7f7f7` است و عددِ آن گمراه‌کننده بود.
پاراگراف `#5a5959` نسبت ۱٫۸۸ داد (بدترین نقطه ۱٫۲۶) و
تیتر طلایی در روشن‌ترین نقطهٔ عکس ۳٫۲۸. پرده از سمت
آغاز — که متن آنجاست — پررنگ‌تر است تا عکس در سمت
دیگر دیده بماند. */
body.econ-consult-page .elementor-element-16a83f6::before {
content: "";
position: absolute;
inset: 0;
background: linear-gradient(to left,
rgba(10, 8, 48, .78) 0%,
rgba(10, 8, 48, .58) 45%,
rgba(10, 8, 48, .28) 100%);
pointer-events: none;
z-index: 0;
}
body.econ-consult-page .elementor-element-16a83f6 > .e-con-inner {
position: relative;
z-index: 1;
}
/* فقط همین یک ویجت خاکستری بود؛ دکمه‌های هیرو زمینهٔ کرمِ
خودشان را دارند و دست‌نخورده می‌مانند. */
/* ⚠ ویژگی عمداً یک کلاس بالاتر رفت. نسخهٔ ساده‌تر دقیقاً
هم‌ویژگیِ `body.econ-std-page .elementor-widget-text-editor p`
بود (هر دو ۰٫۲٫۲) و چون آن قاعده پایین‌ترِ همین فایل است،
با ترتیبِ منبع می‌برد و رنگ خاکستری می‌ماند. */
body.econ-consult-page .elementor-element-b6a8d2b.elementor-widget-text-editor p {
color: #fff;
}
/* ══ متنِ کارت‌های سرمه‌ای ══
⚠ همان قاعدهٔ خاکستریِ سراسری دوباره روی زمینهٔ تیره
افتاده بود: `#5A5959` روی `#0A0830` نسبت **۲٫۷۶** می‌داد.
ویژگی یک کلاس بالاتر از رقیب گرفته شده (۰٫۳٫۱ در برابر
۰٫۲٫۲)، چون در تساوی، قاعدهٔ پایین‌ترِ فایل می‌بُرد. */
body.econ-consult-page .elementor-element-0a1829f .elementor-widget-text-editor p,
body.econ-consult-page .elementor-element-7c2d710 .elementor-widget-text-editor p,
body.econ-consult-page .elementor-element-fb8848e .elementor-widget-text-editor p {
color: #fff;
}
/* ══ دو دکمه‌ای که از سبک سایت بیرون بودند ══
«تأیید اطلاعات» طلاییِ توپرِ `#CCB070` با شعاع ۱۵ بود —
یعنی سبکِ *قهرمان* که در هر صفحه فقط یکی مجاز است، و
روی دکمهٔ ارسالِ فرم پررنگ می‌افتد. «درخواست جلسهٔ
مشاورهٔ شرکتی» هم قهوه‌ایِ توپر بود. هر دو به سبکِ
*استاندارد* می‌روند — همان چیزی که دکمهٔ «سوالات
احتمالی مشاوره» در همین صفحه از قبل دارد.
مقادیر از توکن‌های خودِ سایت می‌آیند، نه از حدس. */
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-253eab7 .elementor-button,
body.econ-consult-page .elementor-element-27de3009 > a.e-button-base {
background-color: var(--econ-cream) !important;
color: var(--econ-btn-text) !important;
border: 1px solid var(--econ-line) !important;
border-radius: var(--econ-btn-radius) !important;
padding: var(--econ-btn-pad) !important;
font-size: var(--econ-btn-size) !important;
font-weight: var(--econ-btn-weight) !important;
box-shadow: none !important;
}
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-253eab7 .elementor-button:hover,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-253eab7 .elementor-button:focus-visible,
body.econ-consult-page .elementor-element-27de3009 > a.e-button-base:hover,
body.econ-consult-page .elementor-element-27de3009 > a.e-button-base:focus-visible {
background-color: var(--econ-btn-hover-bg) !important;
border-color: var(--econ-btn-hover-bg) !important;
color: var(--econ-btn-hover-fg) !important;
}
/* دکمهٔ شرکتی وسطِ بخشِ خودش می‌نشیند */
body.econ-consult-page .elementor-element-27de3009 > a.e-button-base {
display: block;
width: fit-content;
margin-inline: auto;
}
/* ══ تیتر «درخواست جلسه مشاوره» ══
`text-align: justify` روی یک تیترِ تک‌خطی بی‌معناست و
آن را به لبهٔ آغاز می‌چسباند. */
/* ⚠ `text-align: center` تنها کافی نبود و متن همچنان به
لبهٔ آغاز می‌چسبید (اندازه‌گیری: فاصلهٔ آغاز ۰، پایان ۷۵۰).
علت: قاعده‌ای دیگر `text-align-last: right` می‌گذارد و
روی پاراگرافِ **تک‌خطی** همان حرفِ آخر را می‌زند، چون آن
تنها خط، «خطِ آخر» هم هست. */
body.econ-consult-page .elementor-element-28107da .elementor-heading-title {
text-align: center;
text-align-last: center;
}
/* ══ دکمهٔ «سوالات احتمالی مشاوره» ══
فضای سفیدِ بالای آن ۵۸ پیکسل اندازه‌گیری شد و پایینش صفر
بود، پس ته بخش می‌چسبید. همان ۵۸ به پایین هم داده می‌شود
تا در میانهٔ نوارِ سفید بنشیند. */
/* ⚠ مارجین روی خودِ ویجت نگرفت: قاعدهٔ المنتور
`.elementor-10572 .elementor-element.elementor-element-…`
ویژگیِ ۰٫۳٫۰ دارد و نسخهٔ ۰٫۲٫۱ را می‌برد. پدینگِ خودِ
بخش هم بالاتر است و هم در فلکس قابل نادیده‌گرفتن نیست. */
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-25986e9 {
padding-block-end: 58px;
}
/* ══ نوارِ اعداد ══
شش ستونِ ۱۲۳ پیکسلی `text-align: start` داشتند، پس عدد و
برچسب هر دو به لبهٔ آغاز می‌چسبیدند و ستون‌ها ناهموار
دیده می‌شدند. خودِ کارت از قبل وسط است (۵۲/۵۲ روی ۱۲۸۰
و ۷۰/۷۰ روی ۱۰۲۴)؛ چیزی که وسط نبود، متنِ درونِ ستون بود. */
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-b6adc28 > .elementor-element,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-b6adc28 .elementor-heading-title,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-b6adc28 p {
text-align: center;
}
/* ⚠ کنتراست شمارنده‌ها: `#CCB070` روی سفید نسبت **۲٫۱۰**
می‌داد. ۲۰px با وزن ۸۰۰ از نظر WCAG «متنِ درشت» حساب
می‌شود و آستانه‌اش ۳٫۰ است — باز هم مردود.
جایگزین از طلاییِ مستندِ خودِ سایت گرفته شد (`#8a6a28`،
همان طلاییِ h2 مقالهٔ مرجع) نه از یک رنگِ تازه:
روی سفید **۵٫۰۷** و روی `#F7F7F7` **۴٫۵۹**. */
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-b6adc28 .elementor-counter-number,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-b6adc28 .elementor-counter-number-prefix,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-b6adc28 .elementor-counter-number-suffix {
color: #8a6a28 !important;
}
/* ⚠ همان طلایی، این بار در بخشِ زیست‌نامه (`5cab1a3`).
این بخش **تصویر پس‌زمینه ندارد**، پس برخلاف هیرو،
عددِ روی رنگِ والد اینجا واقعی است و دروغ نمی‌گوید:
`#D4AF37` و `#CCB070` روی `#F7F7F7` هر دو **۱٫۹۶**.
با `#8a6a28` می‌شود **۴٫۷۳**.
فقط همین سه ویجت هدف‌اند، نه کل بخش — تیترهای سرمه‌ایِ
همین بخش از قبل قبول‌اند و نباید عوض شوند. */
/* تیتر طلاییِ «سوالاتی که شما از ما پرسیده‌اید» ۶۹ پیکسل
از تیترِ بالایش فاصله داشت. فاصله از مارجینِ خودِ تیتر
می‌آمد (۳۷٫۲ بالا) نه از فاصلهٔ ویجت‌ها (که ۱۰ بود).
با ۸ پیکسل، فاصلهٔ مرکّب حدود ۴۰ می‌شود — همان‌قدر که
دو تیتر را یک گروه نشان دهد نه دو بخش جدا. */
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-dfcb4fc .elementor-heading-title {
margin-block-start: 8px;
}
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-5597fff .elementor-heading-title,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-0167766 .elementor-heading-title,
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-e6b0549 a {
color: #8a6a28 !important;
}
/* ══ لینکِ درونِ متن باید بدونِ رنگ هم دیده شود ══
⚠ «Links rely on color to be distinguishable»: تفاوتِ
رنگِ لینک با متنِ پیرامونش اندازه‌گیری شد — `#8a6a28`
در برابر `#5A5959` فقط **۱٫۳۷** است و آستانه ۳٫۰.
یعنی کسی که رنگ را تشخیص نمی‌دهد اصلاً نمی‌فهمد اینجا
لینکی هست. راهِ درست یا بردنِ آن نسبت بالای ۳ است یا
یک نشانهٔ غیررنگی؛ زیرخط انتخاب شد چون رنگِ طلایی
هویتِ صفحه است و نباید عوض شود.
⚠ فاصلهٔ زیرخط عمدی است: در فارسی دنباله‌های حروف
(«ی»، «ج»، «ع») پایین می‌آیند و زیرخطِ چسبیده رویشان
می‌افتد و متن را ناخوانا می‌کند. */
body.econ-consult-page .elementor-10572 .elementor-widget-text-editor a[href]:not(.elementor-button),
body.econ-consult-page .elementor-10572 .elementor-widget-theme-post-content a[href]:not(.elementor-button) {
text-decoration: underline;
text-decoration-thickness: 1px;
text-underline-offset: 0.22em;
text-decoration-skip-ink: auto;
}
body.econ-consult-page .elementor-10572 .elementor-widget-text-editor a[href]:not(.elementor-button):hover,
body.econ-consult-page .elementor-10572 .elementor-widget-text-editor a[href]:not(.elementor-button):focus-visible {
text-decoration-thickness: 2px;
}
/* ══ دکمهٔ ارسالِ فرمِ مشاوره ══
دو ایراد اندازه‌گیری‌شده:
۱) آیکونِ «دستِ اشاره» (`fad fa-hand-point-up`). متنِ دکمه
خودش نتیجه را می‌گوید؛ دستِ اشاره کلیپ‌آرت است و به
معنا چیزی اضافه نمی‌کند.
۲) عرضِ دکمه ۲۸۳ در ستونِ ۴۲۱ بود و به لبهٔ پایان چسبیده
بود، پس ۱۳۸ پیکسل فضای ناهموار کنارش می‌ماند. کنشِ
اصلیِ یک فرم به شبکهٔ فیلدهای بالایش تراز می‌شود. */
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-253eab7 .elementor-button-icon {
display: none;
}
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-253eab7 .elementor-button {
width: 100%;
justify-content: center;
}
/* فاصلهٔ دکمه از فیلد بالایی ۵ پیکسل بود — همان فاصلهٔ
بینِ خودِ فیلدها. کنشِ نهایی باید از گروهِ فیلدها جدا
دیده شود، پس ۲۰ پیکسل (روی شبکهٔ ۴) به آن داده می‌شود. */
body.econ-consult-page .elementor-10572 .elementor-element.elementor-element-253eab7 .elementor-field-type-submit {
width: 100%;
margin-block-start: 20px;
}
/* ══ صفحه‌های مدرک ══
متنِ اصلی این دوازده صفحه هم‌اندازهٔ متنِ مقاله‌ها می‌شود. */
body.econ-cert-page .elementor-widget-text-editor p {
font-size: var(--econ-text);
line-height: var(--econ-lh);
margin-block: 0 var(--econ-para-gap);
text-align: justify;
text-align-last: right;
text-justify: inter-word;
}
body.econ-cert-page .elementor-widget-text-editor > .elementor-widget-container > *:last-child {
margin-block-end: 0;
}
/* تیترهای درون متن: پیش از این h1 دستی با ۳۸ پیکسل بودند.
تگشان در دادهٔ المنتور به h2 تغییر کرد و اندازه‌شان هم
همان ۲۷ پیکسلِ h2 بقیهٔ سایت می‌شود. */
body.econ-cert-page .elementor-widget-text-editor h2 {
font-size: var(--econ-h2);
line-height: 1.35;
font-weight: 700;
margin-block: 1.7em .5em;
}
body.econ-cert-page .elementor-widget-text-editor > .elementor-widget-container > h2:first-child {
margin-block-start: 0;
}
body.econ-cert-page .elementor-widget-text-editor ul,
body.econ-cert-page .elementor-widget-text-editor ol {
margin-block: 0 var(--econ-para-gap);
line-height: 1.85;
}
body.econ-cert-page .elementor-widget-text-editor li {
margin-block-end: .45em;
}
@media (max-width: 767px) {
body.econ-cert-page .elementor-widget-text-editor h2 {
font-size: 22px;
}
}
/* ══ صفحه‌های محصولِ دوره ══
«آموزش فارکس» ۲۹۵ پاراگراف چپ‌وراست‌نشده، پنج شکل دکمه
(شعاعِ ۷، ۸، ۹، ۱۲ و ۱۵) و اندازهٔ تیترِ ۱۶ تا ۲۷ داشت. */
body.econ-course-page .elementor-widget-text-editor p {
font-size: var(--econ-text);
line-height: var(--econ-lh);
margin-block: 0 var(--econ-para-gap);
text-align: justify;
text-align-last: right;
text-justify: inter-word;
}
body.econ-course-page .elementor-widget-text-editor > .elementor-widget-container > *:last-child {
margin-block-end: 0;
}
body.econ-course-page .elementor-widget-text-editor ul,
body.econ-course-page .elementor-widget-text-editor ol {
margin-block: 0 var(--econ-para-gap);
line-height: 1.85;
}
body.econ-course-page .elementor-widget-text-editor li {
margin-block-end: .45em;
}
/* ⚠ دکمهٔ «افزودن به سبد خرید» ووکامرس عمداً دست نمی‌خورد:
رنگِ فیروزه‌ایِ #79CACA کنشِ اصلیِ همهٔ صفحه‌های فروشگاه
است (تضادِ ۱۰٫۱۹، قبول) و یکدست‌کردنش تصمیمی سراسری است. */
/* ⚠ اندازهٔ قلم جدا از رنگ تنظیم می‌شود: روی «آموزش فارکس»
دکمه‌ها ۱۲، ۱۵، ۲۰ و ۲۲ پیکسل بودند. رنگِ طلاییِ #CCB070
عمداً می‌ماند — کنشِ اصلیِ صفحه است و تفکیکش از لینک‌های
کرم، سلسله‌مراتب را نگه می‌دارد. */
body.econ-course-page .elementor-button:not([type="submit"]) {
border-radius: var(--econ-btn-radius) !important;
padding: var(--econ-btn-pad);
font-size: var(--econ-btn-size);
font-weight: 500;
line-height: var(--econ-lh-tight);
box-shadow: none !important;
text-shadow: none !important;
}
body.econ-course-page .elementor-widget-button .elementor-button {
background-color: var(--econ-cream) !important;
background-image: none !important;
color: var(--econ-btn-text) !important;
border: 1px solid var(--econ-line) !important;
border-radius: var(--econ-btn-radius) !important;
padding: var(--econ-btn-pad);
font-size: var(--econ-btn-size);
font-weight: 500;
line-height: var(--econ-lh-tight);
box-shadow: none !important;
text-shadow: none !important;
}
body.econ-course-page .elementor-widget-button .elementor-button:hover,
body.econ-course-page .elementor-widget-button .elementor-button:focus-visible {
background-color: var(--econ-btn-hover-bg) !important;
border-color: var(--econ-btn-hover-bg) !important;
color: var(--econ-btn-hover-fg) !important;
}
body.econ-course-page .elementor-widget-button .elementor-button:focus-visible {
outline: 2px solid var(--econ-focus);
outline-offset: 2px;
}
/* تیترها: پلکانِ یکدست به‌جای ۱۶/۱۷/۱۸/۲۴/۲۷ */
body.econ-course-page .elementor-widget-heading h2,
body.econ-course-page .elementor-widget-heading .elementor-heading-title {
line-height: 1.35;
}
/* تیترِ تهی چیزی نمی‌گوید و فقط فاصله می‌سازد */
body.econ-course-page .elementor-widget-heading .elementor-heading-title:empty {
display: none;
}
/* ══ صفحه‌های ویدئو (portfolio) ══ */
body.single-portfolio .elementor-widget-text-editor p,
body.single-portfolio .elementor-widget-text-editor li {
line-height: var(--econ-lh);
margin-block: 0 var(--econ-para-gap);
text-align: justify;
text-align-last: right;
text-justify: inter-word;
}
body.single-portfolio .elementor-widget-text-editor > .elementor-widget-container > *:last-child {
margin-block-end: 0;
}
/* پخش‌کننده: ۸۱۰ پیکسل برای ویدئویی که در ستونِ ۱۰۳۰ نشسته
زیادی بزرگ است و تیترِ بالایش را کوچک نشان می‌دهد. */
body.single-portfolio .econ-watch-player,
body.single-portfolio .elementor-widget-video .elementor-wrapper {
max-width: 680px;
margin-inline: auto;
}
/* کارتِ فراخوان روی نوارِ سرمه‌ای: متن وسط‌چین و دکمهٔ
هم‌شکلِ صفحهٔ اول. پیش از این تیتر از راست شروع می‌شد و
روی عرضِ ۹۳۷ پیکسل رها بود. */
body.single-portfolio .elementor-widget-button .elementor-button {
background-color: var(--econ-cream) !important;
background-image: none !important;
color: var(--econ-btn-text) !important;
border: 1px solid var(--econ-line) !important;
border-radius: var(--econ-btn-radius) !important;
padding: var(--econ-btn-pad);
font-size: var(--econ-btn-size);
font-weight: 500;
line-height: var(--econ-lh-tight);
box-shadow: none !important;
text-shadow: none !important;
}
/* ⚠ این هاور پیش از این فقط پس‌زمینه را عوض می‌کرد و `color`
را دست‌نخورده می‌گذاشت؛ قاعدهٔ عمومی‌ترِ بالا رنگِ متن را
طلایی کرده بود، پس نتیجه **طلایی روی کرم = ۱٫۶۸** می‌شد.
این CTA روی نوارِ سرمه‌ای می‌نشیند، پس پُرشدگیِ سرمه‌ای با
نوار یکی می‌شود و مرزِ طلایی شکل را نگه می‌دارد:
متن کرم روی سرمه‌ای ۱۷٫۵۵ · مرز طلایی روی سرمه‌ای ۱۲٫۰۰ */
body.single-portfolio .elementor-widget-button .elementor-button:hover,
body.single-portfolio .elementor-widget-button .elementor-button:focus-visible {
background-color: var(--econ-navy) !important;
color: var(--econ-cream) !important;
border-color: var(--econ-line) !important;
}
body.single-portfolio .elementor-widget-button .elementor-button:hover .elementor-button-text,
body.single-portfolio .elementor-widget-button .elementor-button:focus-visible .elementor-button-text {
color: var(--econ-cream) !important;
}
/* ⚠ ظرفِ دکمه margin-top: -7px داشت، پس فاصله‌اش تا تیترِ
بالا با فاصله‌اش تا لبهٔ پایینِ نوار برابر نبود و دکمه
«چسبیده به بالا» دیده می‌شد. */
body.single-portfolio .elementor-widget-button {
margin-block: 0 !important;
}
body.single-portfolio .e-con:has( > .elementor-widget-button ),
body.single-portfolio .e-con-inner:has( > .elementor-widget-button ) {
justify-content: center;
}
body.single-portfolio .elementor-widget-button .elementor-button:focus-visible {
outline: 2px solid var(--econ-focus);
outline-offset: 2px;
}
/* ══ کارتِ تبلیغ دوره در ظرفِ المنتور ══
اندازه‌گیری: کارت ۵۲۰ پیکسلی در ظرفِ ۹۵۴ پیکسلی روی
left=677 می‌نشست — یعنی چسبیده به لبه، نه وسط. علتش این
است که «.elementor-shortcode» بلوکی است و کارت خودش
flex با عرضِ ثابت. */
/* ⚠ اندازه‌گیری نشان داد وسط‌چینیِ درونِ ویجت بی‌اثر است:
خودِ ویجت ۵۲۰ پیکسل است، نه ۹۶۰. یعنی ویجت به‌عنوان یک
آیتمِ flex به اندازهٔ محتوایش جمع شده و کنارِ لبه نشسته.
حاشیهٔ خودکار روی خودِ ویجت آن را وسط می‌برد. */
.e-con-inner > .elementor-widget-shortcode:has(.ec-cc),
.e-con > .elementor-widget-shortcode:has(.ec-cc),
.elementor-widget-shortcode:has(.ec-cc) {
margin-inline: auto;
}
.elementor-widget-shortcode .elementor-shortcode {
display: flex;
justify-content: center;
}
/* ══ سطرهای رزومه و برچسب‌ها ══
۲۸۰ عنصر با نوشته شده بودند فقط برای ظاهر: سطرهای
رزومهٔ مدرس، «نویسنده:»، «ناظر علمی:» و برچسب‌های صفحهٔ
اول. هیچ‌کدام تیترِ بخش نبودند و درختِ h2→h6 برای گوگل
بی‌معنی بود. حالا
هستند و این قاعده
همان ظاهرِ h6 را نگه می‌دارد. */
/* ⚠ ویژگی عمداً بالا: قاعدهٔ «.econ-course-page … p» با (۰،۳،۱)
بر کلاسِ تنها می‌چربد و سطرهای رزومه را ۱۷px با فاصلهٔ ۳۰
می‌کرد. اندازه‌گیریِ پیش از تبدیل: ۱۴px / ۷۰۰ / ۲۱ / #7A5D22. */
.econ-cred,
body.econ-course-page .elementor-widget-text-editor p.econ-cred,
body.econ-cert-page .elementor-widget-text-editor p.econ-cred,
body.single-portfolio .elementor-widget-text-editor p.econ-cred,
body.econ-learning-path .elementor-widget-text-editor p.econ-cred,
body.econ-std-page .elementor-widget-text-editor p.econ-cred {
font-size: var(--econ-text-xs);
font-weight: 700;
line-height: 1.5;
margin: 0 0 12px;
text-align: right;
text-align-last: right;
}
/* رنگِ طلاییِ تیره فقط جایی که پیش از تبدیل هم همان بود:
سطرهای رزومهٔ مدرس روی صفحه‌های دوره. تضاد روی سفید ۵٫۶۰. */
body.econ-course-page p.econ-cred,
body.econ-cert-page p.econ-cred {
color: #7A5D22;
}
/* ==========================================================
econ-transition-narrow
قالبِ مادر یک قاعدهٔ سراسری دارد: a{ transition: .3s }
که شورتهند است و به `transition-property: all` باز می‌شود —
یعنی **هر** خصیصه‌ای انیمیت می‌شود، از جمله چیدمانی‌ها
(width، padding، font-size).
دو هزینهٔ اندازه‌گیری‌شده روی صفحهٔ نخست:
۱) لایت‌هاوس `a.eh-cta` را «انیمیشنِ غیرکامپوزیتی» می‌گیرد.
۲) دو تا سه `layout-shift` در `header .eh-tools` ثبت می‌شود
(CLS کل هنوز صفر است، یعنی زیر آستانه — ولی واقعی است).
علتش این است که CSS مرحله‌ای می‌رسد و هر تفاوتِ مقدار،
۰٫۳ ثانیه انیمیتِ چیدمان می‌شود.
قاعدهٔ خودِ پروژه هم همین را می‌گوید: حرکت فقط روی `transform`
و `opacity`، نه `top`/`left`/`width`.
⚠ فقط `transition-property` محدود می‌شود، نه `duration`. هیچ
افکتِ هاوری از دست نمی‌رود: رنگ، پس‌زمینه، کادر، سایه، شفافیت
و ترنسفورم همگی می‌مانند. آنچه می‌رود، انیمیتِ خصیصه‌های
چیدمانی است که اصلاً نباید انیمیت می‌شد.
========================================================== */
a {
transition-property: color, background-color, border-color, box-shadow, opacity, transform;
}