/* ===================================================================
   استایل‌های اختصاصی وب‌سایت تجارت دانه شهر سبز
   (مکمل قالب اصلی main.rtl.css)
   =================================================================== */

/* رنگ نارنجی برند در سه درجه (کنتراست WCAG AA):
   --brand-orange          #FF6D45 فقط برای شکل‌ها، آیکون‌ها، خط‌ها و متن روی زمینه‌ی تیره
   --brand-orange-strong   زمینه‌ی دکمه‌های متن‌دار (متن سفید ۴٫۸ به ۱) و متن کوچک نارنجی روی زمینه‌ی روشن
   --brand-orange-display  تیترهای درشت نارنجی روی زمینه‌ی روشن (دست‌کم ۳ به ۱) */
:root {
    --brand-orange: #FF6D45;
    --brand-orange-strong: #C84516;
    --brand-orange-display: #E4572A;
}

/* --- نوار مسیر (Breadcrumb) --- */
.breadcumb-area {
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: center bottom;
    background-image: url('../img/about-bg.webp');
    background-size: cover;
    padding: 200px 0 100px;
}

/* نوار عنوان صفحه‌های داخلی در دسکتاپ: هدر و نوار نرخ (۱۴۰ پیکسل؛ در حالت کارت
   شناور ۱۷۰) روی بالای همین نوار می‌نشینند. عنوان حدود ۴۵ پیکسل زیر نوار نرخ و
   ۵۰ پیکسل فاصله‌ی پایین؛ بخش دیدنی نوار حدود ۱۸۵ پیکسل به‌جای ۲۵۰. */
@media (min-width: 992px) {
    .breadcumb-area {
        padding: 185px 0 50px;
    }
}

@media (min-width: 1025px) and (max-width: 1169.98px), (min-width: 1821px) {
    .breadcumb-area {
        padding-top: 215px;
    }
}

.breadcumb-area .brpt h1,
.breadcumb-area .brpt h2,
.breadcumb-area .breadcumb-inner h2 {
    color: #ffffff;
    font-size: 42px;
    margin-bottom: 12px;
}

.breadcumb-area .breadcumb-inner ul {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    list-style: none;
    margin: 0;
    padding: 0;
}

.breadcumb-area .breadcumb-inner li,
.breadcumb-area .breadcumb-inner li a {
    color: #ffffff;
    font-size: 16px;
}

.breadcumb-area .breadcumb-inner li a:hover {
    opacity: .8;
}

/* --- فاصله‌گذاری استاندارد بخش‌ها در صفحات داخلی --- */
.section-pad {
    padding: 100px 0;
}

.section-pad-sm {
    padding: 60px 0;
}

@media (max-width: 767px) {
    .section-pad {
        padding: 60px 0;
    }

    .breadcumb-area {
        padding: 140px 0 60px;
    }

    .breadcumb-area .brpt h1,
    .breadcumb-area .brpt h2 {
        font-size: 30px;
    }
}

/* --- کارت محصول --- */
.product-card {
    background: #fff;
    border: 1px solid #eef0f3;
    border-radius: 16px;
    overflow: hidden;
    margin-bottom: 30px;
    transition: box-shadow .3s ease, transform .3s ease;
}

.product-card:hover {
    box-shadow: 0 18px 40px rgba(15, 35, 70, .10);
    transform: translateY(-4px);
}

.product-card .product-thumb img {
    width: 100%;
    height: 220px;
    object-fit: cover;
}

.product-card .product-body {
    padding: 24px;
}

.product-card .product-tag {
    display: inline-block;
    font-size: 13px;
    padding: 4px 12px;
    border-radius: 30px;
    background: rgba(255, 90, 30, .10);
    color: #B83E12;
    margin-bottom: 12px;
}

.product-card h3 {
    font-size: 20px;
    margin-bottom: 10px;
}

.product-card p {
    margin: 0;
    font-size: 15px;
    line-height: 1.9;
}

/* --- کارت شرکت زیرمجموعه --- */
.company-card {
    background: #fff;
    border: 1px solid #eef0f3;
    border-radius: 16px;
    overflow: hidden;
    margin-bottom: 30px;
    transition: box-shadow .3s ease, transform .3s ease;
}

.company-card:hover {
    box-shadow: 0 18px 40px rgba(15, 35, 70, .10);
    transform: translateY(-4px);
}

.company-card .company-thumb img {
    width: 100%;
    height: 240px;
    object-fit: cover;
}

.company-card .company-body {
    padding: 28px;
}

.company-card .company-cat {
    display: inline-block;
    font-size: 13px;
    padding: 4px 12px;
    border-radius: 30px;
    background: rgba(20, 60, 120, .08);
    color: #143c78;
    margin-bottom: 12px;
}

.company-card h3 {
    font-size: 22px;
    margin-bottom: 10px;
}

.company-card h3 a {
    color: inherit;
}

.company-card p {
    font-size: 15px;
    line-height: 1.9;
    margin-bottom: 18px;
}

/* --- صفحه‌ی فهرست زیرمجموعه‌ها (companies-filter.js) --- */
.holding-structure {
    margin: 0 auto 40px;
    max-width: 980px;
    text-align: center;
}

.holding-structure__root {
    display: inline-flex;
    flex-direction: column;
    gap: 4px;
    padding: 16px 28px;
    border-radius: 16px;
    background: #0B4654;
    color: #fff;
}

.holding-structure__root strong {
    font-size: 20px;
}

.holding-structure__root span {
    font-size: 14px;
    color: #cfe3e6;
}

.holding-structure__sectors {
    position: relative;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 16px;
    margin: 0;
    padding: 34px 0 0;
    list-style: none;
}

/* خط اتصال شرکت مادر به حوزه‌ها */
.holding-structure__sectors::before {
    content: '';
    position: absolute;
    top: 0;
    inset-inline-start: 50%;
    width: 2px;
    height: 34px;
    background: #d6e2e5;
}

.holding-structure__sectors a {
    display: flex;
    flex-direction: column;
    gap: 6px;
    height: 100%;
    padding: 16px 18px;
    border: 1px solid #e3ebee;
    border-top: 3px solid #FF6D45;
    border-radius: 14px;
    background: #f7f9fc;
    color: #1f2933;
    text-decoration: none;
    transition: box-shadow .3s ease;
}

.holding-structure__sectors a:hover,
.holding-structure__sectors a:focus-visible {
    box-shadow: 0 10px 26px rgba(11, 70, 84, .10);
}

.holding-structure__sectors strong {
    font-size: 17px;
    color: #0B4654;
}

.holding-structure__sectors span {
    font-size: 14px;
    line-height: 1.8;
    color: #64707f;
}

.companies-filter {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin: 0 0 36px;
    scroll-margin-top: 110px;
}

.companies-filter a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 18px;
    border: 1px solid #d6e2e5;
    border-radius: 30px;
    background: #fff;
    color: #0B4654;
    font-size: 15px;
    text-decoration: none;
}

.companies-filter a span {
    min-width: 24px;
    padding: 1px 7px;
    border-radius: 12px;
    background: #eef4f5;
    font-size: 13px;
    text-align: center;
}

.companies-filter a[aria-current="true"] {
    border-color: var(--brand-orange-strong);
    background: var(--brand-orange-strong);
    color: #fff;
}

.companies-filter a[aria-current="true"] span {
    background: rgba(255, 255, 255, .25);
}

.companies-sector {
    margin-bottom: 50px;
    scroll-margin-top: 110px;
}

.companies-sector__title {
    margin: 0 0 22px;
    padding-inline-start: 14px;
    border-inline-start: 4px solid #FF6D45;
    font-size: 24px;
}

/* ارتفاع کارت‌های یک ردیف یکسان است؛ دکمه همیشه پایین کارت */
.companies-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(300px, 100%), 1fr));
    gap: 26px;
}

.company-tile {
    display: flex;
    flex-direction: column;
    min-width: 0;
    height: 100%;
    border: 1px solid #eef0f3;
    border-radius: 16px;
    background: #fff;
    overflow: hidden;
    transition: box-shadow .3s ease, transform .3s ease;
}

.company-tile:hover {
    box-shadow: 0 18px 40px rgba(15, 35, 70, .10);
    transform: translateY(-4px);
}

.company-tile__media {
    position: relative;
    aspect-ratio: 16 / 7;
    background: linear-gradient(135deg, #0B4654 0%, #15505e 55%, #FF6D45 160%);
}

.company-tile__media.has-cover {
    aspect-ratio: 16 / 9;
}

.company-tile__cover {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.company-tile__logo {
    position: absolute;
    inset-inline-start: 22px;
    bottom: -34px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 76px;
    height: 76px;
    padding: 8px;
    border: 3px solid #fff;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 8px 22px rgba(11, 70, 84, .16);
}

.company-tile__logo img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.company-tile__monogram {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    border-radius: 12px;
    background: #fff1ec;
    color: var(--brand-orange-display);
    font-size: 30px;
    font-weight: 700;
    line-height: 1;
}

.company-tile__body {
    display: flex;
    flex: 1;
    flex-direction: column;
    padding: 50px 24px 24px;
}

.company-tile__body .company-cat {
    align-self: flex-start;
    display: inline-block;
    margin-bottom: 10px;
    padding: 4px 12px;
    border-radius: 30px;
    background: rgba(20, 60, 120, .08);
    color: #143c78;
    font-size: 13px;
}

.company-tile__body h3 {
    margin-bottom: 8px;
    font-size: 21px;
}

.company-tile__body p {
    margin-bottom: 20px;
    font-size: 15px;
    line-height: 1.9;
    color: #4d5b66;
}

.company-tile__cta {
    margin-top: auto;
}

.company-tile__cta .button {
    max-width: 100%;
}

/* --- جعبه اطلاعات تماس شرکت / جعبه اطلاعات ثبتی --- */
.info-box {
    background: #f7f9fc;
    border: 1px solid #eef0f3;
    border-radius: 16px;
    padding: 30px;
    margin-bottom: 30px;
}

.info-box h3 {
    font-size: 19px;
    margin-bottom: 18px;
}

.info-box ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.info-box ul li {
    padding: 9px 0;
    border-bottom: 1px dashed #e3e7ee;
    font-size: 15px;
    display: flex;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.info-box ul li:last-child {
    border-bottom: 0;
}

.info-box ul li span:first-child {
    color: #64707f;
}

.info-box ul li i {
    color: #fe5716;
    margin-inline-end: 8px;
}

/* لینک‌های کنار صفحه‌ی شرکت: رنگ سفید قالب برای ستون تیره بود و روی کادر روشن دیده نمی‌شد */
.info-box ul.item-list.style1 li {
    display: block;
    padding: 0;
    border-bottom: 0;
}

.info-box ul.item-list.style1 li a {
    padding: 11px 0;
    margin: 0;
    border-bottom: 1px dashed #e3e7ee;
    color: #15505e;
}

.info-box ul.item-list.style1 li:last-child a {
    border-bottom: 0;
}

.info-box ul.item-list.style1 li a:hover,
.info-box ul.item-list.style1 li a:focus-visible {
    color: var(--brand-orange-strong);
}

/* --- لیست ویژگی‌ها با تیک --- */
.check-list {
    list-style: none;
    margin: 0 0 25px;
    padding: 0;
}

.check-list li {
    position: relative;
    padding-inline-start: 30px;
    margin-bottom: 12px;
    font-size: 15.5px;
}

.check-list li::before {
    content: '✔';
    position: absolute;
    inset-inline-start: 0;
    top: 0;
    color: #fe5716;
    font-size: 14px;
}

/* --- کارت فرصت شغلی --- */
.job-card {
    background: #fff;
    border: 1px solid #eef0f3;
    border-inline-start: 4px solid #fe5716;
    border-radius: 12px;
    padding: 28px;
    margin-bottom: 24px;
    transition: box-shadow .3s ease;
}

.job-card:hover {
    box-shadow: 0 14px 34px rgba(15, 35, 70, .08);
}

.job-card h3 {
    font-size: 20px;
    margin-bottom: 8px;
}

.job-card .job-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    font-size: 14px;
    color: #64707f;
    margin-bottom: 14px;
}

.job-card .job-meta i {
    color: #fe5716;
    margin-inline-end: 5px;
}

.job-card p {
    margin: 0;
    font-size: 15px;
    line-height: 1.9;
}

/* --- فرم تماس --- */
.contact-form-wrap {
    background: #fff;
    border: 1px solid #eef0f3;
    border-radius: 16px;
    padding: 40px;
}

/* هر فیلد: برچسب بالا، کنترل، بعد راهنما یا خطای همان فیلد */
.contact-form-wrap .form-field {
    margin-bottom: 20px;
}

.contact-form-wrap .form-label {
    display: block;
    margin-bottom: 6px;
    color: #0B4654;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.6;
}

/* ۱۶ پیکسل: کمتر از این، سافاری آیفون هنگام تایپ صفحه را زوم می‌کند */
.contact-form-wrap .form-control {
    width: 100%;
    padding: 14px 18px;
    border: 1px solid #e3e7ee;
    border-radius: 10px;
    background: #f7f9fc;
    font-family: inherit;
    font-size: 16px;
}

.contact-form-wrap .form-control:focus {
    outline: none;
    border-color: var(--brand-orange-strong);
    box-shadow: 0 0 0 3px rgba(200, 69, 22, .18);
    background: #fff;
}

.contact-form-wrap .form-control[aria-invalid="true"] {
    border-color: #b3362f;
    background: #fff;
}

.contact-form-wrap textarea.form-control {
    min-height: 150px;
    resize: vertical;
}

.form-error {
    display: block;
    margin-top: 6px;
    color: #b3362f;
    font-size: 13px;
    line-height: 1.7;
}

.form-hint {
    display: block;
    margin-top: 6px;
    font-size: 13px;
    line-height: 1.8;
    color: #64707f;
}

.form-hint--warning {
    color: #8a5a00;
}

.form-hint[hidden] {
    display: none;
}

.form-alert {
    padding: 16px 22px;
    border-radius: 10px;
    margin-bottom: 25px;
    font-size: 15px;
}

.form-alert.success {
    background: #e8f7ee;
    color: #1c7c45;
    border: 1px solid #bfe8d0;
}

.form-alert.error {
    background: #fdeeee;
    color: #b3362f;
    border: 1px solid #f3cccc;
}

/* --- محتوای مقاله --- */
.post-content-wrap {
    max-width: 860px;
    margin: 0 auto;
}

.post-content-wrap .post-hero img {
    width: 100%;
    max-height: 420px;
    object-fit: cover;
    border-radius: 16px;
    margin-bottom: 30px;
}

.post-content-wrap .post-meta {
    display: flex;
    gap: 18px;
    flex-wrap: wrap;
    color: #64707f;
    font-size: 14px;
    margin-bottom: 20px;
}

.post-content-wrap .post-meta i {
    color: #fe5716;
    margin-inline-end: 6px;
}

.post-content-wrap p {
    font-size: 16px;
    line-height: 2.1;
    margin-bottom: 22px;
}

/* --- بخش عنوان صفحه داخلی --- */
/* هم‌تراز با تیتر بالایش (لبه‌ی شروع)، نه بلوک وسط‌چین */
.page-intro {
    max-width: 760px;
    margin: 0 0 50px;
    text-align: start;
}

.page-intro p {
    font-size: 16px;
    line-height: 2;
    color: #64707f;
}

/* --- گالری تصاویر شرکت (company-gallery.js) --- */
.company-gallery {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    margin: 30px 0;
}

@media (min-width: 992px) {
    .company-gallery {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

.company-gallery a {
    display: block;
    border-radius: 14px;
    overflow: hidden;
}

.company-gallery img {
    display: block;
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    transition: transform .3s ease;
}

.company-gallery a:hover img,
.company-gallery a:focus-visible img {
    transform: scale(1.04);
}

.lightbox {
    width: min(1100px, calc(100vw - 24px));
    max-height: calc(100vh - 24px);
    padding: 0;
    border: 0;
    border-radius: 14px;
    background: #0c2318;
    overflow: hidden;
}

.lightbox::backdrop {
    background: rgba(5, 15, 10, .88);
}

.lightbox figure {
    margin: 0;
}

.lightbox img {
    display: block;
    width: 100%;
    max-height: calc(100vh - 90px);
    object-fit: contain;
}

.lightbox figcaption {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 60px;
    color: #dfe7e3;
    font-size: 14px;
}

.lightbox__position {
    flex-shrink: 0;
    color: #9daaa4;
}

.lightbox button {
    position: absolute;
    width: 44px;
    height: 44px;
    border: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, .9);
    color: #0c2318;
    font-size: 28px;
    line-height: 1;
    cursor: pointer;
}

.lightbox__close {
    top: 10px;
    inset-inline-end: 10px;
}

.lightbox__prev,
.lightbox__next {
    top: calc(50% - 22px);
}

.lightbox__prev {
    inset-inline-start: 10px;
}

.lightbox__next {
    inset-inline-end: 10px;
}

[dir="rtl"] .lightbox__prev,
[dir="rtl"] .lightbox__next {
    transform: scaleX(-1);
}

/* --- گالری تصاویر: کارت آلبوم و صفحه‌ی آلبوم --- */
.album-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(300px, 100%), 1fr));
    gap: 26px;
}

.album-card {
    display: flex;
    flex-direction: column;
    height: 100%;
    border: 1px solid #eef0f3;
    border-radius: 16px;
    background: #fff;
    overflow: hidden;
    transition: box-shadow .3s ease, transform .3s ease;
}

.album-card:hover {
    box-shadow: 0 18px 40px rgba(15, 35, 70, .10);
    transform: translateY(-4px);
}

.album-card__cover {
    position: relative;
    display: block;
    aspect-ratio: 4 / 3;
    background: linear-gradient(135deg, #0B4654, #15505e);
}

.album-card__cover img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.album-card__count {
    position: absolute;
    bottom: 12px;
    inset-inline-start: 12px;
    padding: 3px 12px;
    border-radius: 20px;
    background: rgba(12, 35, 24, .75);
    color: #fff;
    font-size: 13px;
}

.album-card__body {
    padding: 20px 22px 22px;
}

.album-card__body .company-cat {
    display: inline-block;
    margin-bottom: 8px;
    padding: 4px 12px;
    border-radius: 30px;
    background: rgba(20, 60, 120, .08);
    color: #143c78;
    font-size: 13px;
}

.album-card__body h3 {
    margin-bottom: 8px;
    font-size: 20px;
}

.album-card__body h3 a {
    color: inherit;
}

.album-card__body p {
    margin: 0;
    font-size: 15px;
    line-height: 1.9;
    color: #4d5b66;
}

.album-head {
    margin-bottom: 30px;
}

.album-head__description {
    max-width: 760px;
    font-size: 16px;
    line-height: 2;
    color: #4d5b66;
}

.album-head__links a {
    color: var(--brand-orange-strong);
}

.album-photos {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(220px, 45%), 1fr));
    gap: 14px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.album-photos a {
    display: block;
    border-radius: 12px;
    overflow: hidden;
    background: #eef1f4;
}

.album-photos img {
    display: block;
    width: 100%;
    aspect-ratio: 4 / 3;
    height: auto;
    object-fit: cover;
    transition: transform .3s ease;
}

.album-photos a:hover img,
.album-photos a:focus-visible img {
    transform: scale(1.04);
}

.album-photos p {
    margin: 6px 2px 0;
    font-size: 13.5px;
    line-height: 1.7;
    color: #64707f;
}

.company-logo {
    display: block;
    max-width: 140px;
    max-height: 70px;
    margin-bottom: 12px;
    object-fit: contain;
}

.company-preview-notice {
    margin: 0 0 30px;
    padding: 12px 18px;
    border-radius: 10px;
    background: #fff7e0;
    border: 1px solid #f5dfa3;
    color: #7a5207;
}

/* --- جدول اطلاعات ثبتی درباره ما --- */
.legal-table {
    width: 100%;
    border-collapse: collapse;
    background: #fff;
    border-radius: 14px;
    overflow: hidden;
    border: 1px solid #eef0f3;
}

.legal-table th,
.legal-table td {
    padding: 15px 22px;
    text-align: start;
    font-size: 15px;
    border-bottom: 1px solid #f0f2f6;
}

.legal-table th {
    background: #f7f9fc;
    color: #64707f;
    font-weight: 500;
    width: 40%;
}

.legal-table tr:last-child th,
.legal-table tr:last-child td {
    border-bottom: 0;
}

/* ---------------------------------------------------------------
   H1 صفحه (کارت سئو تکنیکال): عنوان نوار مسیر از h2 به h1 رفت تا هر
   صفحه دقیقاً یک H1 داشته باشد؛ ظاهر همان قواعد .brpt h2 قالب است.
   --------------------------------------------------------------- */
.brpt h1 {
    font-size: 65px;
    margin-bottom: 7px;
    margin-top: 0;
    color: #fff;
    font-weight: 500;
}

@media (min-width: 576px) and (max-width: 767px) {
    .brpt h1 {
        font-size: 35px;
    }
}

@media (min-width: 320px) and (max-width: 575px) {
    .brpt h1 {
        font-size: 30px;
    }
}

/* پنهان از چشم ولی خوانا برای صفحه‌خوان و موتور جستجو (H1 خانه، برچسب فرم جستجو) */
.visually-hidden {
    border: 0;
    clip: rect(0, 0, 0, 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
    white-space: nowrap;
}

/* عدد بزرگ صفحه‌ی ۴۰۴ دیگر H1 نیست (H1 همان عنوان نوار مسیر است) */
.error-code {
    font-size: 110px;
    line-height: 1.1;
    font-weight: 700;
    color: var(--brand-orange-display);
    margin-bottom: 10px;
}

/* صفحه‌بندی فهرست اخبار */
.site-pagination ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
    margin: 30px 0 0;
    padding: 0;
    list-style: none;
}

.site-pagination a,
.site-pagination span {
    display: inline-block;
    min-width: 42px;
    padding: 8px 14px;
    border: 1px solid #e3e7ee;
    border-radius: 10px;
    text-align: center;
    color: #0B4654;
}

.site-pagination .is-active span {
    background: var(--brand-orange-strong);
    border-color: var(--brand-orange-strong);
    color: #fff;
}

.site-pagination .is-disabled span {
    opacity: .45;
}

/* جستجوی سایت */
.site-search {
    display: flex;
    gap: 8px;
    max-width: 640px;
    margin: 0 auto 30px;
}

.site-search input {
    flex: 1;
    min-width: 0;
    padding: 12px 16px;
    border: 1px solid #e3e7ee;
    border-radius: 12px;
    font-family: inherit;
    font-size: 15px;
}

.site-search button {
    padding: 12px 22px;
    border: 0;
    border-radius: 12px;
    background: var(--brand-orange-strong);
    color: #fff;
    font-family: inherit;
    font-weight: 600;
    cursor: pointer;
}

.search-page__title {
    font-size: 24px;
    margin: 10px 0 20px;
}

.search-page__note {
    text-align: center;
    color: #64707f;
}

.search-page__group {
    margin-bottom: 26px;
}

.search-page__group h3 {
    font-size: 19px;
    margin-bottom: 10px;
    color: #0B4654;
}

.search-page__group ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.search-page__group li {
    padding: 12px 0;
    border-bottom: 1px solid #eef0f3;
}

.search-page__group li a {
    font-weight: 600;
    font-size: 16px;
}

.search-page__group li p {
    margin: 4px 0 0;
    color: #64707f;
    font-size: 14px;
}

/* --- سلسله‌مراتب تیترها ---
   برچسب‌های تزئینی قالب (بالای بخش‌ها، شمارنده‌ها، نام و سمت در نظرات، عنوان‌های
   منوی کناری) دیگر تیتر نیستند و عنوان بخش‌ها یک سطح بالا رفته‌اند تا ترتیب
   H1 → H2 → H3 رعایت شود. قالب بسیاری از این عنصرها را با نام تگ استایل می‌داد؛
   قاعده‌های زیر همان ظاهر پیشین را روی تگ یا کلاس تازه بازمی‌سازند. */
p.subtitle {
    line-height: 1.2;
}

.section-title.style1 h2.title span {
    color: inherit;
}

.elementor-5403 .elementor-element.elementor-element-1255b48 .section-title h2.title,
.elementor-5403 .elementor-element.elementor-element-134d331 .section-title h2.title,
.elementor-5403 .elementor-element.elementor-element-4676355 .section-title h2.title {
    color: #0B4654;
}

.sidebar-title .sidebar-heading,
.sidebar-contact-info .sidebar-heading {
    color: #0B4654;
    font-size: 26px;
    font-weight: 600;
    line-height: 1.2;
    margin-top: 11px;
    margin-bottom: 25px;
}

.sidebar-title .sidebar-heading {
    margin-top: 15px;
    margin-bottom: 21px;
}

.icon-box.style7 h3.title {
    font-size: 18px;
    font-weight: 600;
    margin: 0;
    padding: 0 0 11px;
}

.elementor-5403 .elementor-element.elementor-element-c71ec66 .icon-box h3 {
    color: #0C2318;
    margin: 0;
    margin-inline-start: 9px;
    font-family: "Outfit", sans-serif;
    font-size: 22px;
    font-weight: 500;
    line-height: 30px;
}

.icon-box.style1 .icon-box-content h3 {
    margin: 0;
    font-size: 16px;
    color: #fff;
    font-weight: 500;
}

.elementor-5403 .elementor-element.elementor-element-02442fe .icon-box h3 {
    color: #9DAAA4;
    margin: 0 0 8px;
    font-family: "Noto Sans", sans-serif;
    font-size: 15px;
    font-weight: 400;
}

/* تلفن «با ما تماس بگیرید» حالا پیوند tel: است؛ همان رنگ سفید متن کادر */
.elementor-5403 .elementor-element.elementor-element-02442fe .description a {
    color: inherit;
}

.single-counter .counter-label,
.testimonial-item .name,
.testimonial-item .designation {
    color: #0B4654;
    font-style: normal;
    line-height: 1.2;
    font-weight: 600;
    margin: 11px 0 0;
}

.counter-content.counter .counter-label {
    font-weight: 400;
    font-size: 18px;
    color: #fff;
    margin: 6px 0 0;
}

.single-counter .counter-content .counter-label {
    color: #0C2318;
    font-family: Outfit, sans-serif;
    font-size: 20px;
    font-weight: 500;
    text-transform: capitalize;
    line-height: 26px;
}

.elementor-5403 .elementor-element.elementor-element-18a8a7f .single-counter .counter-label {
    color: #fff;
    font-family: Outfit, sans-serif;
    font-size: 20px;
    font-weight: 500;
    text-transform: uppercase;
    line-height: 30px;
}

.elementor-5403 .elementor-element.elementor-element-6c0ce62 .single-counter .counter-label {
    color: #1E1E1E;
    font-family: Outfit, sans-serif;
    font-size: 20px;
    font-weight: 500;
    text-transform: capitalize;
    line-height: 26px;
}

.elementor-5403 .elementor-element.elementor-element-18a8a7f .single-counter .counter-content .counter-label {
    margin: 85px 0 0;
}

.elementor-5403 .elementor-element.elementor-element-6c0ce62 .single-counter .counter-content .counter-label,
.elementor-5403 .elementor-element.elementor-element-48f023c .single-counter .counter-content .counter-label,
.elementor-5403 .elementor-element.elementor-element-9b86455 .single-counter .counter-content .counter-label,
.elementor-5403 .elementor-element.elementor-element-8dec54a .single-counter .counter-content .counter-label {
    margin: 40px 0 0;
}

.elementor-5403 .elementor-element.elementor-element-863fc91 .testimonial-item .name {
    color: #0C2318;
    font-family: Outfit, sans-serif;
    font-size: 24px;
    font-weight: 500;
}

.elementor-5403 .elementor-element.elementor-element-863fc91 .testimonial-item .designation {
    color: #4D6459;
    font-family: "Noto Sans", sans-serif;
    font-size: 16px;
    padding: 0;
}

/* عنوان ستون‌های فوتر: در قالب هم‌رنگ زمینه‌ی فوتر (#0B4654) و ناپیدا بود */
#colophon .heading.style1 h2.heading-text {
    color: #fff;
    font-size: 20px;
    line-height: 1.4;
    font-weight: 600;
    margin: 11px 0 0;
}

@media (max-width: 1366px) {
    .elementor-5403 .elementor-element.elementor-element-6c0ce62 .single-counter .counter-label {
        font-size: 17px;
    }

    .elementor-5403 .elementor-element.elementor-element-863fc91 .testimonial-item .name {
        font-size: 20px;
    }
}

@media (max-width: 1024px) {
    .elementor-5403 .elementor-element.elementor-element-863fc91 .testimonial-item .name {
        font-size: 22px;
    }
}

@media (min-width: 320px) and (max-width: 575px) {
    .icon-box.style1 .icon-box-content h3 {
        font-size: 14px;
    }
}

/* --- بلوک «پاسخ کوتاه» و بخش‌های AEO مقاله --- */
/* پهنای محدود: حدود ۷۵ تا ۸۰ نویسه در سطر (تمام‌عرض در لپ‌تاپ تا ۱۸۰ می‌شد) */
.short-answer {
    max-width: 600px;
    background: #f7f9fc;
    border: 1px solid #eef0f3;
    border-inline-start: 4px solid #fe5716;
    border-radius: 12px;
    padding: 22px 26px;
    margin: 0 0 30px;
}

.short-answer .short-answer__question {
    font-size: 20px;
    line-height: 1.6;
    margin: 0 0 10px;
}

.short-answer .short-answer__text {
    font-size: 17px;
    line-height: 2;
    margin: 0;
    color: #3a4a44;
}

.howto-steps,
.post-sources,
.post-author {
    margin: 0 0 30px;
}

.howto-steps h3,
.post-sources h3,
.post-author h3 {
    font-size: 20px;
    margin: 0 0 14px;
}

.howto-steps ol {
    margin: 0;
    padding-inline-start: 22px;
}

:lang(fa) .howto-steps ol {
    list-style-type: persian;
}

:lang(ar) .howto-steps ol {
    list-style-type: arabic-indic;
}

.howto-steps li {
    font-size: 15.5px;
    line-height: 2;
    margin-bottom: 8px;
}

.post-sources ul {
    margin: 0;
    padding-inline-start: 22px;
}

.post-sources li {
    font-size: 15px;
    line-height: 2;
}

.post-author {
    background: #f7f9fc;
    border-radius: 12px;
    padding: 22px 26px;
}

.post-author .post-author__name {
    font-weight: 600;
    margin-bottom: 6px;
}

.post-author .post-author__name span {
    font-weight: 400;
    color: #64707f;
}

.page-faq .my-accordion {
    margin-top: 10px;
}

/* --- بخش‌های لوگو: همکاران، خریداران، زیرمجموعه‌ها (partials/logo-wall) --- */
.logo-wall {
    padding: 70px 0;
}

.logo-wall__list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
    gap: 18px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.logo-wall__card {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    height: 100%;
    padding: 18px 14px;
    border: 1px solid #eef0f3;
    border-radius: 14px;
    background: #fff;
    color: #1f2933;
    text-align: center;
    text-decoration: none;
    transition: box-shadow .3s ease, border-color .3s ease;
}

a.logo-wall__card:hover,
a.logo-wall__card:focus-visible {
    border-color: #ffd2c4;
    box-shadow: 0 12px 28px rgba(11, 70, 84, .10);
}

/* لوگوها با هر نسبتی در قاب هم‌اندازه می‌نشینند؛ خاکستری و روی هاور رنگی */
.logo-wall__logo {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    aspect-ratio: 16 / 10;
}

/* قاب اندازه را تعیین می‌کند، نه ابعاد خود تصویر */
.logo-wall__logo img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    filter: grayscale(1);
    opacity: .75;
    transition: filter .3s ease, opacity .3s ease;
}

.logo-wall__card:hover .logo-wall__logo img,
.logo-wall__card:focus-visible .logo-wall__logo img {
    filter: none;
    opacity: 1;
}

.logo-wall__initial {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    border-radius: 16px;
    background: #eef4f5;
    color: #0B4654;
    font-size: 28px;
    font-weight: 700;
}

.logo-wall__name {
    font-weight: 700;
    font-size: 15px;
    line-height: 1.6;
}

.logo-wall__description {
    font-size: 13px;
    line-height: 1.7;
    color: #64707f;
}

.logo-wall__controls {
    display: flex;
    justify-content: center;
    gap: 12px;
    margin-top: 18px;
}

.logo-wall__controls button {
    width: 44px;
    height: 44px;
    border: 1px solid #d6e2e5;
    border-radius: 50%;
    background: #fff;
    color: #0B4654;
    cursor: pointer;
}

.logo-wall__controls button:hover {
    border-color: #FF6D45;
    color: #FF6D45;
}

/* دکمه‌ی «قبلی» فلش را برعکس نشان می‌دهد */
.logo-wall__controls [data-logo-wall-step="-1"] i {
    display: inline-block;
    transform: scaleX(-1);
}

[dir="rtl"] .logo-wall__controls i {
    display: inline-block;
    transform: scaleX(-1);
}

[dir="rtl"] .logo-wall__controls [data-logo-wall-step="-1"] i {
    transform: none;
}

/* اسلایدر: اسکرول افقی با snap؛ جای دکمه‌ها از اول نگه داشته می‌شود (CLS) */
.logo-wall--slider .logo-wall__list {
    display: flex;
    gap: 16px;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    padding-bottom: 4px;
}

.logo-wall--slider .logo-wall__list::-webkit-scrollbar {
    display: none;
}

.logo-wall--slider .logo-wall__item {
    flex: 0 0 clamp(150px, 42%, 210px);
    scroll-snap-align: start;
}

.logo-wall--slider .logo-wall__controls[hidden] {
    display: flex;
    visibility: hidden;
}

.logo-wall--grid .logo-wall__controls,
.logo-wall--grid .logo-wall__controls[hidden] {
    display: none;
}

@media (max-width: 767px) {
    .logo-wall {
        padding: 50px 0;
    }

    .logo-wall--auto .logo-wall__list {
        display: flex;
        gap: 16px;
        overflow-x: auto;
        overscroll-behavior-x: contain;
        scroll-snap-type: x mandatory;
        scrollbar-width: none;
        padding-bottom: 4px;
    }

    .logo-wall--auto .logo-wall__list::-webkit-scrollbar {
        display: none;
    }

    .logo-wall--auto .logo-wall__item {
        flex: 0 0 clamp(150px, 42%, 210px);
        scroll-snap-align: start;
    }

    .logo-wall--auto .logo-wall__controls[hidden] {
        display: flex;
        visibility: hidden;
    }
}

@media (min-width: 768px) {
    .logo-wall--auto .logo-wall__controls,
    .logo-wall--auto .logo-wall__controls[hidden] {
        display: none;
    }
}

/* --- فیلتر نوع و دسته‌ی اخبار (pages/news) --- */
.news-filter {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin: 0 0 18px;
}

.news-filter--categories {
    margin-bottom: 36px;
}

.news-filter a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 16px;
    border: 1px solid #d6e2e5;
    border-radius: 30px;
    background: #fff;
    color: #0B4654;
    font-size: 14.5px;
    text-decoration: none;
}

.news-filter--categories a {
    padding: 6px 14px;
    font-size: 13.5px;
}

.news-filter a span {
    min-width: 22px;
    padding: 1px 7px;
    border-radius: 12px;
    background: #eef4f5;
    font-size: 12.5px;
    text-align: center;
}

.news-filter a[aria-current="true"] {
    border-color: var(--brand-orange-strong);
    background: var(--brand-orange-strong);
    color: #fff;
}

.news-filter a[aria-current="true"] span {
    background: rgba(255, 255, 255, .25);
}

/* ===================================================================
   صفحه‌ی اصلی: اصلاح چیدمان قالب برای هر دو جهت و همه‌ی اندازه‌ها
   قالب گودیِ کنار دکمه‌ها را با تصویر ثابت می‌ساخت؛ تصویر نه با زبان
   چپ‌چین آینه می‌شد نه اندازه‌اش با دکمه جور بود. حالا گودی ماسک CSS
   است: دایره‌ای هم‌مرکز با دکمه، به شعاع دکمه + ۶px فاصله، با لبه‌های نرم.
   تکه‌ی گوشه (SVG) فقط در گوشه‌ی پایینِ سمت دکمه می‌نشیند و باقی کارت
   با دو گرادیان تخت پر می‌شود؛ پس کارت هر اندازه‌ای داشته باشد گودی
   همان اندازه می‌ماند. مسیرها برای دکمه‌ی ۵۲ و ۵۵ پیکسلی حساب شده‌اند.
   =================================================================== */
:root {
    --notch-card-ltr: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 80'%3E%3Cpath d='M0,0H80V18.28A8,8 0 0 1 68.4,25.42A32,32 0 0 0 25.42,68.4A8,8 0 0 1 18.28,80H0Z'/%3E%3C/svg%3E");
    --notch-card-rtl: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 80'%3E%3Cpath d='M80,0H0V18.28A8,8 0 0 0 11.6,25.42A32,32 0 0 1 54.58,68.4A8,8 0 0 0 61.72,80H80Z'/%3E%3C/svg%3E");
    --notch-panel-ltr: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 80'%3E%3Cpath d='M0,0H80V15.87A8,8 0 0 1 68.24,22.93A33.5,33.5 0 0 0 22.93,68.24A8,8 0 0 1 15.87,80H0Z'/%3E%3C/svg%3E");
    --notch-panel-rtl: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 80'%3E%3Cpath d='M80,0H0V15.87A8,8 0 0 0 11.76,22.93A33.5,33.5 0 0 1 57.07,68.24A8,8 0 0 0 64.13,80H80Z'/%3E%3C/svg%3E");
}

/* گوشه‌ی پایینِ سمت دکمه (inline-end): در راست‌چین چپ، در چپ‌چین راست */
[dir="ltr"] {
    --notch-card: var(--notch-card-ltr) right bottom / 80px 80px no-repeat,
        linear-gradient(#000 0 0) left top / 100% calc(100% - 80px) no-repeat,
        linear-gradient(#000 0 0) left bottom / calc(100% - 80px) 80px no-repeat;
    --notch-panel: var(--notch-panel-ltr) right bottom / 80px 80px no-repeat,
        linear-gradient(#000 0 0) left top / 100% calc(100% - 80px) no-repeat,
        linear-gradient(#000 0 0) left bottom / calc(100% - 80px) 80px no-repeat;
}

[dir="rtl"] {
    --notch-card: var(--notch-card-rtl) left bottom / 80px 80px no-repeat,
        linear-gradient(#000 0 0) left top / 100% calc(100% - 80px) no-repeat,
        linear-gradient(#000 0 0) right bottom / calc(100% - 80px) 80px no-repeat;
    --notch-panel: var(--notch-panel-rtl) left bottom / 80px 80px no-repeat,
        linear-gradient(#000 0 0) left top / 100% calc(100% - 80px) no-repeat,
        linear-gradient(#000 0 0) right bottom / calc(100% - 80px) 80px no-repeat;
}

/* --- نوار متحرک زیر «درباره ما»: متن ۱۲۰ پیکسلی به اندازه‌ی یک تیتر کوچک --- */
.elementor-5403 .elementor-element.elementor-element-18de25e .marquee.style1 .marquee-block h3 {
    font-size: clamp(20px, 2.4vw, 34px);
    font-weight: 700;
    white-space: nowrap;
}

.elementor-5403 .elementor-element.elementor-element-18de25e .marquee.style1 .marquee-block h3 img {
    width: .9em;
    height: auto;
    margin: 0 .9em;
    top: .1em;
}

.elementor-5403 .elementor-element.elementor-element-c5210b4 {
    padding-bottom: 40px;
}

/* --- کارت‌های «خدمات»: زمینه و رنگ هاور روی دو لایه‌ی ماسک‌شده؛ دکمه دست نمی‌خورد --- */
#services .service-box.style5 {
    background: none;
    border-end-end-radius: 0;
}

#services .service-box.style5::after,
#services .service-box.style5::before {
    content: '';
    position: absolute;
    inset: 0;
    width: auto;
    border-radius: 30px;
    border-end-end-radius: 0;
    -webkit-mask: var(--notch-card);
    mask: var(--notch-card);
}

#services .service-box.style5::after {
    z-index: -2;
    background: rgba(255, 255, 255, .15);
}

/* رنگ هاور از سمت متن به سمت دکمه پر می‌شود (به‌جای پهن‌شدن، که گودی را جابه‌جا می‌کرد) */
#services .service-box.style5::before {
    background: var(--brand-orange-strong);
    clip-path: inset(0 0 0 100%);
    transition: clip-path .5s ease;
}

[dir="ltr"] #services .service-box.style5::before {
    clip-path: inset(0 100% 0 0);
}

#services .service-box.style5:hover::before {
    width: auto;
    clip-path: inset(0);
}

/* دکمه درست در گوشه (پدینگ کارت: ۱۶px کنار، ۳۶px پایین) تا مرکزش با مرکز گودی یکی باشد؛
   flow-root نمی‌گذارد حاشیه‌ی پایین توضیح از .content بیرون بزند و دکمه را بالا بکشد */
#services .service-box.style5 .content {
    display: flow-root;
}

#services .service-box.style5 .service-btn a {
    left: auto;
    right: auto;
    inset-inline-end: -16px;
    bottom: -36px;
}

/* --- زیرمجموعه‌ها (اسلایدر تصویری): عکس و سایه‌اش روی لایه‌ی ماسک‌شده --- */
#subsidiaries .dreamit-image-panel {
    background-image: none;
}

#subsidiaries .dreamit-image-panel::before {
    background: linear-gradient(-180deg, rgba(12, 35, 24, 0) 30%, #0C2318 80%),
        url('/assets/img/Img-1-3.webp') center / cover no-repeat;
    border-radius: inherit;
}

#subsidiaries .dreamit-image-panel.active::before {
    -webkit-mask: var(--notch-panel);
    mask: var(--notch-panel);
}

#subsidiaries .dreamit-image-panel.active::after {
    content: none;
}

#subsidiaries .dreamit-image-panel.active .overlay-content {
    bottom: 30px;
}

#subsidiaries .dreamit-image-panel.active .overlay-content .dreamit-btn {
    left: auto;
    right: auto;
    inset-inline-end: 0;
    bottom: -30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    line-height: 1;
}

[dir="ltr"] #subsidiaries .dreamit-image-panel.active .overlay-content {
    text-align: left;
}

/* ستون‌های بسته: قالب محتوا را ۲۳۶px زیر لبه می‌برد تا فقط عنوان عمودی پیدا باشد؛
   نام‌های بلند («بازرگانی نسیم تجارت») از پایین بریده می‌شدند. حالا عنوان از
   ۳۰px بالای لبه شروع می‌شود و اگر جا نشد با «…» کوتاه می‌شود. */
#subsidiaries .dreamit-image-panel:not(.active) .overlay-content {
    bottom: 30px;
}

#subsidiaries .dreamit-image-panel:not(.active) .overlay-content p,
#subsidiaries .dreamit-image-panel:not(.active) .overlay-content .dreamit-btn {
    display: none;
}

/* ارتفاع اسلایدر در قالب همه‌جا ۵۵۰px است */
#subsidiaries .dreamit-image-panel:not(.active) .overlay-content h2 {
    max-height: 490px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

/* گوشی: ستون‌های بسته‌ی اسلایدر زیر ۵۷۶px باریک‌تر از نام عمودی ۴۰ پیکسلی‌اند
   (۲۶px در ۳۶۰، ۳۸px در ۵۰۰) و نام بریده می‌شد؛ از ۵۷۶ قالب آن‌ها را ۷۰px به بالا
   می‌کند. پس زیر ۵۷۶px اسلایدر فهرست عمودی کارت‌هاست؛ هر کارت شکل ستون باز را دارد
   (عکس، گودی گوشه، نام، شعار و دکمه) و ارتفاعش با متن بزرگ می‌شود.
   .dreamit-image-gallery-wrapper در انتخابگرها وزن را از قاعده‌های :not(.active) بالاتر می‌برد. */
@media (max-width: 575.98px) {
    #subsidiaries .dreamit-image-gallery-wrapper {
        flex-direction: column;
        gap: 16px;
        height: auto;
        overflow: visible;
        border-radius: 0;
    }

    #subsidiaries .dreamit-image-gallery-wrapper .dreamit-image-panel {
        display: flex;
        flex: none;
        flex-direction: column;
        justify-content: flex-end;
        min-height: 230px;
        padding-block: 120px 30px;
        padding-inline: 20px 0;
        cursor: default;
    }

    #subsidiaries .dreamit-image-gallery-wrapper .dreamit-image-panel::before {
        -webkit-mask: var(--notch-panel);
        mask: var(--notch-panel);
    }

    #subsidiaries .dreamit-image-gallery-wrapper .dreamit-image-panel::after {
        content: none;
    }

    #subsidiaries .dreamit-image-gallery-wrapper .dreamit-image-panel .overlay-content {
        position: relative;
        inset: auto;
        margin: 0;
        text-align: start;
    }

    #subsidiaries .dreamit-image-gallery-wrapper .dreamit-image-panel .overlay-content h2 {
        max-height: none;
        overflow: visible;
        white-space: normal;
        writing-mode: horizontal-tb;
        transform: none;
        display: block;
        font-size: 20px !important;
        line-height: 30px !important;
    }

    #subsidiaries .dreamit-image-gallery-wrapper .dreamit-image-panel .overlay-content p {
        display: block;
        width: 100%;
        margin: 8px 0 0;
        padding-inline-end: 64px;
        opacity: 1;
        transform: none;
    }

    #subsidiaries .dreamit-image-gallery-wrapper .dreamit-image-panel .overlay-content .dreamit-btn {
        position: absolute;
        left: auto;
        right: auto;
        inset-inline-end: 0;
        bottom: -30px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        padding: 0;
        line-height: 1;
        opacity: 1;
        transform: none;
        background: var(--brand-orange-strong);
    }
}

/* --- «چرا ما»: پله‌ی سفید کارت زیر شماره؛ مسیر قالب برای چپ‌چین کشیده شده --- */
[dir="rtl"] .service-box.style6::before {
    transform: scaleX(-1);
}

/* --- سوالات متداول: جای مربع +/− کنار سوال خالی می‌ماند تا روی متن نیفتد --- */
.my-accordion > li > a,
.my-accordion > li > a.active {
    padding-inline-end: 58px;
}

/* --- دعوت به تماس: متن فقط روی نیمه‌ی تیره‌ی تصویر (تصویر در هر دو جهت عکسش چپ است) --- */
@media (min-width: 992px) {
    #contact .elementor-element-2210da1 > .elementor-widget-wrap {
        padding-left: 48%;
    }
}

/* زیر ۹۹۲ عکس کل کادر را می‌پوشاند و متن روی بخش روشن عکس می‌افتد؛ لایه‌ی تیره خوانایی را نگه می‌دارد */
@media (max-width: 991px) {
    #contact .elementor-element-fd73955::before {
        content: '';
        position: absolute;
        inset: 0;
        border-radius: inherit;
        background: rgba(7, 42, 51, .55);
    }

    #contact .elementor-element-fd73955 > .elementor-container {
        z-index: 1;
    }
}

#contact .elementor-element-0af7f78 {
    position: relative;
}

.cta-phone-icon {
    position: absolute;
    inset-block-start: 24px;
    inset-inline-end: -9px;
    z-index: 2;
    width: 46px;
    height: 46px;
    pointer-events: none;
}

.cta-phone-icon img {
    display: block;
    width: 100%;
    height: 100%;
}

/* --- مدل‌های همکاری: برچسب نارنجی مطلق بود و در کارت باریک روی نام مدل می‌افتاد --- */
#cooperation .pricing .pricing-head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 33px 10px;
}

#cooperation .pricing .pricing-head h3.pricing-name {
    margin: 0;
}

#cooperation .pricing .pricing-head h4.category-name {
    position: static;
}

#cooperation .pricing .pricing-head .price-item {
    flex-basis: 100%;
}

/* --- موبایل و تبلت --- */
/* نوار منوی موبایل: نام قالب («loginet») جای نام سایت بود؛ لوگو همان بالاست */
.mean-container .mean-bar::before {
    content: none;
}

/* هدر موبایل و تبلت در یک ردیف ۵۶ پیکسلی: لوگو در سمت شروع، دکمه‌ی منو در سمت پایان.
   قالب لوگو را در ردیف ۸۷ پیکسلی جدا و دکمه را در نوار نارنجی ۶۰ پیکسلی جدا می‌گذاشت.
   نوار meanmenu (جاوااسکریپت قالب) روی ردیف لوگو می‌نشیند و فقط دکمه و فهرست بازشده
   کلیک می‌گیرند تا لوگو هم قابل کلیک بماند؛ فهرست باز زیر همین ردیف باز می‌شود. */
@media (max-width: 991px) {
    .mobile_menu_logo.text-center {
        justify-content: flex-start;
        padding: 10px 0;
    }

    .mobile_menu_logo a,
    .mobile_menu_logo img {
        display: block;
    }

    .mobile_menu_logo img {
        width: auto;
        height: 36px;
    }

    .em40_header_area_main .mbm {
        position: relative;
        z-index: 5;
        margin-top: -56px;
        pointer-events: none;
    }

    .mbm .mean-container .mean-bar {
        min-height: 56px;
        background: transparent;
    }

    /* فهرست باز از بالای همین ردیف شروع می‌شود (دکمه شناور است)؛ زمینه‌ی نارنجی‌اش ردیف لوگو را می‌پوشاند */
    .mbm .mean-container .mean-nav {
        background: transparent;
    }

    .mbm .mean-container a.meanmenu-reveal,
    .mbm .mean-container .mean-nav > ul {
        pointer-events: auto;
    }

    .mbm .mean-container a.meanmenu-reveal {
        margin-block: 6px;
        margin-inline: 15px;
        padding: 11px;
        border-radius: 12px;
        background: var(--brand-orange-strong);
    }

    .mbm .mean-container a.meanmenu-reveal.meanclose {
        font-size: 18px;
        line-height: 22px;
        text-indent: 0;
    }

    /* نوار عنوان صفحه‌های داخلی: هدر موبایل روی آن نمی‌افتد، پس فاصله‌ی ۲۰۰ پیکسلیِ بالا لازم نیست
       (قالب در موبایل ۱۰۰px را با !important می‌گذارد) */
    .breadcumb-area {
        padding: 56px 0 48px !important;
    }
}

@media (max-width: 767px) {
    .breadcumb-area {
        padding: 36px 0 32px !important;
    }

    .breadcumb-area .brpt h1 {
        font-size: 28px;
    }
}

/* عکس کوچک کنار «تجارت دانه» هم‌قدِ خط تیتر؛ بلندتر بود و زیر خط دوم فاصله می‌انداخت */
@media (max-width: 1024px) {
    .elementor-5403 .elementor-element.elementor-element-3b6a843 {
        align-self: center;
        margin-block: 0;
    }

    .elementor-5403 .elementor-element.elementor-element-3b6a843 img {
        width: auto;
        height: 72px;
    }
}

/* سرتیتر در ۹۹۲ تا ۱۰۲۴: چیدمان تبلت قالب توضیح را تمام‌عرض می‌کرد و متن از ۱۶٪ عرض
   روی کشتی می‌افتاد؛ از ۱۰۲۵ خود قالب آن را در نیمه‌ی تیره‌ی عکس (از ۵۳٪) نگه می‌دارد */
@media (min-width: 992px) and (max-width: 1024.98px) {
    .elementor-5403 .elementor-element.elementor-element-d5074d1 p.heading-text {
        max-width: 460px;
    }
}

@media (max-width: 991px) {
    /* «درباره ما»: قالب در تبلت و موبایل فقط سمت شروع ۱۰px فاصله می‌داد و سمت دیگر به لبه‌ی صفحه می‌چسبید */
    #about {
        padding-inline: 10px 20px;
    }

    /* هدر موبایل روی سرتیتر نمی‌افتد؛ فاصله‌ی ۱۵۱ پیکسلیِ بالای سرتیتر لازم نیست */
    .elementor-5403 .elementor-element.elementor-element-622b720 {
        padding: 70px 0 80px;
    }
}

/* فاصله‌ی کناری یکسان ۲۰ پیکسل در گوشی: صفحه‌های داخلی ۱۵ بودند و بخش‌های صفحه‌ی
   اصلی بسته به تعداد ستون‌های تودرتوی Elementor (هر لایه ۱۰px) بین ۱۰ تا ۴۰.
   کارت‌های سرتیتر و بنر تماس فاصله‌ی داخلی خودشان را دارند و دست نمی‌خورند. */
@media (max-width: 767px) {
    main .container {
        padding-inline: 20px;
    }

    #about {
        padding-inline: 20px;
    }

    /* خدمات، همکاری و آمار: سه لایه ستون (۳۰px). قاب رنگی گردگوشه ۱۰px از لبه‌ی صفحه
       می‌ماند و لایه‌ی اول درون قاب بی‌فاصله می‌شود تا محتوا روی ۲۰ بنشیند */
    .elementor-5403 :is([data-id="ac24f57"], [data-id="f45b175"], [data-id="b5bc060"]) > .elementor-container > .elementor-column > .elementor-widget-wrap {
        padding-inline: 0;
    }

    /* نظرات مشتریان: ۲۰px اضافه‌ی بخش داخلی (۴۰px)؛ اسلایدر هم یک لایه ستون بیشتر از تیتر دارد */
    .elementor-5403 .elementor-element.elementor-element-0842ab4 {
        padding-inline: 0;
    }

    .elementor-5403 .elementor-element.elementor-element-6b1f418 > .elementor-widget-wrap {
        padding-inline: 0;
    }

    /* معرفی هلدینگ: فاصله‌ی سمت شروع چیدمان دسکتاپ (تیتر ۱۰px، ستون کادرها و نوارها ۱۵px) */
    .elementor-5403 .elementor-element.elementor-element-1255b48 > .elementor-widget-container,
    .elementor-5403 .elementor-element.elementor-element-f79ef80 > .elementor-element-populated {
        padding-inline: 0;
    }

    /* تیتر زیرمجموعه‌ها، تیتر و آکاردئون پرسش‌ها و کارت‌های وبلاگ (۱۰px) */
    .elementor-5403 :is([data-id="84a4612"], [data-id="4676355"], [data-id="4114feb"], [data-id="ce057da"], [data-id="daf946b"]) {
        padding-inline: 10px;
    }

    /* عکس بخش آمار: ستونش در گوشی بی‌فاصله است و عکس ۱۰px جلوتر از متن کنارش می‌افتاد
       (شمارنده‌های همین ستون فاصله‌ی خودشان را دارند) */
    .elementor-5403 .elementor-element.elementor-element-7845af7 {
        padding-inline: 10px;
    }
}

@media (max-width: 767px) {
    .elementor-5403 .elementor-element.elementor-element-622b720 {
        padding: 48px 0 60px;
    }

    /* زیرمجموعه‌ها: ستون باز باریک است؛ شعار نباید زیر دکمه‌ی گرد برود */
    #subsidiaries .dreamit-image-panel.active .overlay-content p {
        padding-inline-end: 64px;
    }

    /* عکس کوچک کنار «تجارت دانه» هم‌قدِ همان خط */
    .elementor-5403 .elementor-element.elementor-element-3b6a843 {
        align-self: center;
        margin: 0;
        margin-inline-end: 12px;
    }

    .elementor-5403 .elementor-element.elementor-element-3b6a843 img {
        width: auto;
        height: 40px;
    }
}

/* «چرا ما» در گوشی: کارت ستونی است؛ فاصله‌ی کنار عکس (مال چیدمان افقی) عکس را کج می‌کرد */
@media (max-width: 575px) {
    .elementor-5403 .elementor-element.elementor-widget-service .service-box.style6 {
        padding: 14px 14px 18px;
    }

    .service-box.style6 .image {
        padding: 0;
    }

    .service-box.style6 .service-number {
        left: auto;
        right: auto;
        inset-inline-end: 0;
    }

    .service-box.style6 .image img {
        width: 100%;
    }
}

/* لایه‌ی هدر دسکتاپ ثابت می‌ماند: scrollToFixed هنگام برگشتن به بالای صفحه
   z-index اولیه‌ی عنصر را برمی‌گرداند؛ اگر در CSS چیزی نباشد «auto» می‌شود و
   ‎.trp_nav_area‎ با z-index 9999 روی منوی زبان نوار بالا می‌افتد. */
.loginet-main-menu {
    z-index: 1000;
}

/* ===================================================================
   هدر دسکتاپ: ردیف منو هرگز دوخطی نمی‌شود
   قالب فاصله‌ی لینک‌های منو را برای چند بازه‌ی عرض دستی تنظیم کرده بود
   و در ۱۱۷۲ تا ۱۲۳۶ و ۱۳۶۸ تا ۱۴۱۲ (از جمله لپ‌تاپ ۱۳۶۶) دکمه‌ی گرد منوی
   کناری به خط دوم می‌افتاد، هدر بلند می‌شد و نوار نرخ زیرش پنهان می‌ماند.
   حالا منو، دکمه‌ی استعلام و دکمه‌ی گرد یک ردیف flex بی‌شکست‌اند و فاصله‌ی
   لینک‌ها با عرض صفحه کم و زیاد می‌شود (در ۱۴۱۳ به بعد همان ۲۸/۱۰ قالب).
   =================================================================== */
@media (min-width: 992px) {
    .loginet_menu {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        flex-wrap: nowrap;
        gap: 12px;
    }

    .loginet_menu #mega-menu-wrap-menu-1 {
        flex: 0 1 auto;
        min-width: 0;
    }

    #mega-menu-wrap-menu-1 #mega-menu-menu-1 {
        display: flex;
        flex-wrap: nowrap;
    }

    #mega-menu-wrap-menu-1 #mega-menu-menu-1 > li.mega-menu-item > a.mega-menu-link {
        padding-inline: clamp(8px, 2.6vw - 12px, 28px) clamp(4px, .8vw - 2px, 10px) !important;
        white-space: nowrap;
    }

    .loginet_menu .donate-btn-header {
        flex: none;
        margin: 0 !important;
    }

    .loginet_menu .sidebar,
    .loginet_menu .sidebar .nav-btn.navSidebar-button {
        position: static;
        flex: none;
        width: auto;
        height: auto;
    }

    /* ستون لوگو فقط هم‌اندازه‌ی لوگو؛ باقی عرض مال منو */
    .trp_nav_area .row.logo-left {
        flex-wrap: nowrap;
    }

    .trp_nav_area .row.logo-left > .col-md-2 {
        flex: none;
        width: auto;
        max-width: none;
    }

    .trp_nav_area .row.logo-left > .col-md-10 {
        flex: 1 1 0;
        width: auto;
        max-width: none;
        min-width: 0;
    }

    /* حروف بزرگ قالب برای برچسب‌های لاتین منو را خیلی پهن می‌کرد */
    #mega-menu-wrap-menu-1 #mega-menu-menu-1 > li.mega-menu-item > a.mega-menu-link {
        text-transform: none;
    }

    /* اگر برچسب‌های ترجمه‌شده باز هم جا نشدند (app.js ← fitHeader) */
    .trp_nav_area.is-tight .loginet_menu .sidebar {
        display: none;
    }

    .trp_nav_area.is-tighter #mega-menu-wrap-menu-1 #mega-menu-menu-1 > li.mega-menu-item > a.mega-menu-link {
        font-size: 14px;
        padding-inline: 8px 4px !important;
    }

    .trp_nav_area.is-tighter a.dtbtn {
        padding-inline: 14px;
        font-size: 14px;
    }

    .trp_nav_area.is-tightest #mega-menu-wrap-menu-1 #mega-menu-menu-1 > li.mega-menu-item > a.mega-menu-link {
        font-size: 13px;
        padding-inline: 5px 3px !important;
    }

    .trp_nav_area.is-tightest a.dtbtn {
        padding-inline: 10px;
        font-size: 13px;
    }
}

/* ===================================================================
   کنتراست رنگ (WCAG AA) — عنصرهای قالب
   متن سفید روی نارنجی #FF6D45 فقط ۲٫۸ به ۱ است و متن نارنجی کوچک روی
   زمینه‌ی روشن هم همین‌قدر؛ دکمه‌های متن‌دار و متن‌های کوچک نارنجی درجه‌ی
   «strong» را می‌گیرند و تیترهای درشت نارنجی روی زمینه‌ی روشن درجه‌ی
   «display» را. نارنجی روشن برند برای شکل‌ها و متن روی زمینه‌ی تیره می‌ماند
   (مثلاً «شهر سبز» سرتیتر روی عکس تیره ۳٫۷ به ۱ است).
   =================================================================== */
a.dtbtn,
.dreamit-button.style1 a.button,
.dreamit-button.style1 button.button,
.mc4wp-form-fields button,
.blog-post.style1 .categories a {
    background-color: var(--brand-orange-strong);
}

a.dtbtn:hover {
    border-color: var(--brand-orange-strong);
}

#cooperation .pricing h4.category-name {
    background-color: var(--brand-orange-strong);
}

/* کنترل‌های فقط‌آیکونی کنار دکمه‌های متن‌دار: هم‌رنگ آن‌ها، و آیکون سفید دست‌کم ۳ به ۱ */
.nav-btn.navSidebar-button i,
#subsidiaries .dreamit-image-panel.active .overlay-content .dreamit-btn {
    background: var(--brand-orange-strong);
}

.section-title.style1 .subtitle {
    color: var(--brand-orange-strong);
    border-color: var(--brand-orange-strong);
}

#testimonials .testimonial-item p.ratting_text {
    color: var(--brand-orange-strong);
}

#mega-menu-wrap-menu-1 #mega-menu-menu-1 > li.mega-menu-item.mega-current-menu-item > a.mega-menu-link,
#mega-menu-wrap-menu-1 #mega-menu-menu-1 > li.mega-menu-item.mega-current-menu-ancestor > a.mega-menu-link,
#mega-menu-wrap-menu-1 #mega-menu-menu-1 > li.mega-menu-item > a.mega-menu-link:hover,
#mega-menu-wrap-menu-1 #mega-menu-menu-1 > li.mega-menu-item > a.mega-menu-link:focus {
    color: var(--brand-orange-strong);
}

/* کلمه‌های نارنجی تیترهای درشت روی زمینه‌ی روشن صفحه‌ی اصلی */
:is(#about, #subsidiaries, #faq, #testimonials, [data-id="9cd0641"], [data-id="a832532"]) h2 span {
    color: var(--brand-orange-display);
}

/* فوتر: متن‌ها #4D6459 روی زمینه‌ی #0B4654 بودند (۱٫۶ به ۱) و عنوان ستون‌ها
   («دسترسی سریع»، «زیرمجموعه‌ها»، «تماس با ما») هم‌رنگ زمینه و ناپیدا */
#colophon :is(.heading.style1 p.heading-text, .description p, .description a, .rate-ticker-note, .elementor-icon-list-text) {
    color: #C9D4D6;
}

#colophon .description a:hover,
#colophon .elementor-icon-list-item a:hover .elementor-icon-list-text {
    color: #fff;
}

/* تاریخ مطالب وبلاگ (#9DAAA4، ۲٫۳ به ۱) */
#blog .post-item .single_blog_post_content .meta .date,
.blog-post .date {
    color: #5C6A63;
}

/* نوار متحرک زیر «درباره ما» تزئینی است (شعار تکراری) و از صفحه‌خوان پنهان است؛
   کمی پررنگ‌تر تا روی زمینه‌ی روشن گم نشود */
.elementor-5403 .elementor-element.elementor-element-18de25e .marquee.style1 .marquee-block h3 {
    color: #A7B1A9;
}

/* ===================================================================
   دسترس‌پذیری کیبورد
   =================================================================== */

/* حلقه‌ی فوکوس دیدنی برای همه‌ی لینک‌ها و کنترل‌ها (فقط با کیبورد، نه با کلیک) */
a:focus-visible,
button:focus-visible,
summary:focus-visible,
[role="button"]:focus-visible,
[tabindex]:not([tabindex="-1"]):focus-visible {
    outline: 3px solid var(--brand-orange-strong);
    outline-offset: 2px;
}

/* قالب outline لینک‌های منوی دسکتاپ را با دو ID و li.mega-menu-item > a برمی‌دارد و در
   حالت کیبورد حلقه‌ی آبی خودش را می‌گذارد؛ این انتخابگر از هر دو سنگین‌تر است */
#mega-menu-wrap-menu-1 #mega-menu-menu-1 li.mega-menu-item > a.mega-menu-link.mega-menu-link:focus-visible {
    outline: 3px solid var(--brand-orange-strong);
    outline-offset: -3px;
    border-radius: 8px;
}

/* روی زمینه‌ی تیره (نوار بالا، فوتر، منوی موبایل) حلقه‌ی سفید */
:is(.site-topbar, #colophon, .mean-container .mean-nav) :is(a, button, summary):focus-visible {
    outline-color: #fff;
}

/* پرش به محتوا: تا فوکوس نگیرد بیرون از صفحه است */
.skip-link {
    position: absolute;
    inset-inline-start: 16px;
    top: -200px;
    z-index: 2000;
    padding: 10px 18px;
    border-radius: 0 0 10px 10px;
    background: #0B4654;
    color: #fff;
    font-size: 15px;
    font-weight: 600;
    /* قالب به همه‌ی لینک‌ها transition می‌دهد؛ این لینک باید فوراً دیده شود */
    transition: none;
}

.skip-link:focus {
    top: 0;
    color: #fff;
    outline: 3px solid #fff;
    outline-offset: -6px;
}

/* مقصد پرش: زیر هدر چسبان نرود */
#main-content {
    display: block;
    scroll-margin-top: 120px;
}

#main-content:focus {
    outline: none;
}

/* منوی کناری: دکمه‌ها حالا <button> واقعی‌اند و ظاهر قالب را نگه می‌دارند */
button.nav-btn.navSidebar-button,
.xs-sidebar-group .widget-top button.bar-close {
    padding: 0;
    border: 0;
    background: none;
    font-family: inherit;
    line-height: inherit;
}

.xs-sidebar-group .widget-top {
    background: var(--brand-orange-strong);
}

/* پرده‌ی پشت منوی کناری؛ کلاس رنگ قالب (bt-black) هیچ‌جا تعریف نشده بود و پرده شفاف می‌ماند */
.xs-sidebar-group .dt-overlay {
    background: rgba(12, 35, 24, .55);
    cursor: pointer;
}

.xs-sidebar-group .widget-top button.bar-close {
    width: 100%;
    height: 100%;
    font-size: inherit;
    cursor: pointer;
}

/* قالب محتوای منوی کناری را ۱٫۲ ثانیه بعد از باز شدن نشان می‌داد؛ فوکوس کیبورد
   تا آن موقع جایی نداشت. حالا پنل بی‌درنگ می‌آید و محتوا ۰٫۳ ثانیه بعد. */
.xs-sidebar-group.isActive .dt-sidebar-widget {
    transition: all .5s cubic-bezier(0.9, 0.03, 0, 0.96) 0s;
}

.xs-sidebar-group.isActive .sidebar-container {
    transition: all .4s ease-out .3s;
}

/* ===================================================================
   هدف‌های لمسی در گوشی: دست‌کم ۴۴×۴۴ پیکسل
   فقط زیر ۷۶۸ پیکسل؛ دسکتاپ دست نمی‌خورد. دو روش:
   - عنصرهای تکی که بزرگ‌شدنشان شکل را عوض می‌کرد (لوگو، برچسب، «ادامه مطلب»،
     مسیر صفحه، …): ناحیه‌ی لمس نامرئی ۴۴×۴۴ با ::after دور همان عنصر
   - فهرست‌های روی‌هم (لینک‌های فوتر، منابع مقاله، …): خود عنصر ۴۴ پیکسل می‌شود
     تا ناحیه‌ی لمس همسایه‌ها روی هم نیفتد
   =================================================================== */
@media (max-width: 767px) {
    .mobile_menu_logo a,
    #colophon .elementor-widget-image > a,
    .breadcumb-area .breadcumb-inner a,
    .blog-post .categories a,
    .blog-post a.read-more,
    .post-item .categories a,
    .post-item .blog_btn a.read-more,
    .company-card a.read-more,
    .company-card h3 a,
    .info-box li span a,
    .info-box > p > a,
    #colophon .elementor-icon-list-item a,
    .owl-dots .owl-dot {
        position: relative;
    }

    .mobile_menu_logo a::after,
    #colophon .elementor-widget-image > a::after,
    .breadcumb-area .breadcumb-inner a::after,
    .blog-post .categories a::after,
    .blog-post a.read-more::after,
    .post-item .categories a::after,
    .post-item .blog_btn a.read-more::after,
    .company-card a.read-more::after,
    .company-card h3 a::after,
    .info-box li span a::after,
    .info-box > p > a::after,
    #colophon .elementor-icon-list-item a::after,
    .owl-dots .owl-dot::after {
        content: '';
        position: absolute;
        top: 50%;
        left: 50%;
        width: max(100%, 44px);
        height: max(100%, 44px);
        transform: translate(-50%, -50%);
    }

    /* نقطه‌های اسلایدر ۱۶ پیکسل‌اند؛ فاصله‌ی ۴۴ (افقی و بین دو ردیف) تا ناحیه‌ی لمس هر نقطه جدا بماند */
    .owl-dots {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        row-gap: 28px;
    }

    .owl-dots .owl-dot {
        margin-inline: 14px !important;
    }

    /* فهرست‌های روی‌هم: خود لینک ۴۴ پیکسل */
    .service-item-list.style1 ul.item-list.style1 li a {
        display: flex;
        align-items: center;
        min-height: 44px;
    }

    .post-sources li a,
    #colophon .icon-box-content .description a {
        display: inline-block;
        padding-block: 10px;
    }

    .news-filter a {
        min-height: 44px;
    }

    /* عکس کارت بعدی درست زیر «ادامه مطلب» است؛ لمس زیر دکمه نباید مطلب بعدی را باز کند */
    .post-item .blog_btn {
        padding-bottom: 12px;
    }
}
