/* =====================================================================
   Soransoft — چیدمان حرفه‌ای صفحه‌ی هر سرویس (/Service/{slug}، /SiteProject، ...)
   همه‌ی قواعد زیر .sn-svc اسکوپ شده‌اند تا سایر صفحات دست‌نخورده بمانند.
   تِم: همان توکن‌های site.css (سبز #8EBC40، نئومورفیسم، حالت شب)
   ===================================================================== */

.sn-svc { overflow-x: clip; }
.sn-svc [id^="svc-"] { scroll-margin-top: 132px; }

/* =====================================================================
   هیرو سرویس — دو ستونه: روایت + کارت تصویری/شناسه
   ===================================================================== */
.sn-svc-hero { padding: clamp(2.6rem, 6vw, 4.4rem) 0 clamp(2.8rem, 6vw, 4.2rem); }

.sn-svc-hero-grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(280px, .9fr);
    align-items: center;
    gap: clamp(1.6rem, 4vw, 3.2rem);
}

.sn-svc-hero-copy { max-width: 660px; }

.sn-svc-hero-title {
    margin: .8rem 0 .7rem;
    color: var(--sn-dark);
    font-size: clamp(1.9rem, 4.2vw, 3.05rem);
    font-weight: 900;
    line-height: 1.45;
}

.sn-svc-hero-slogan {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    margin: 0 0 1.1rem;
    padding: .5rem .95rem;
    color: var(--sn-primary-dark);
    background: rgba(142, 188, 64, .13);
    border-radius: 12px;
    font-size: .84rem;
    font-weight: 800;
}

.sn-svc-hero-slogan i { font-size: .95rem; }

.sn-svc-hero-lead {
    max-width: 600px;
    margin: 0 0 1.2rem;
    color: #78837c;
    font-size: 1rem;
    line-height: 2.15;
}

.sn-svc-hero-meta {
    display: flex;
    flex-wrap: wrap;
    gap: .6rem;
    margin: 0 0 1.5rem;
}

.sn-svc-hero-meta li {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .5rem .8rem;
    color: #718078;
    background: rgba(255, 255, 255, .82);
    border: 1px solid rgba(255, 255, 255, .95);
    border-radius: 11px;
    box-shadow: 3px 5px 12px rgba(54, 75, 56, .07);
    font-size: .74rem;
}

.sn-svc-hero-meta strong { color: var(--sn-primary-dark); font-size: 1rem; }

.sn-svc-hero-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .7rem;
}

.sn-svc-hero-actions .btn { display: inline-flex; align-items: center; gap: .4rem; }

/* کارت هنری هیرو */
.sn-svc-hero-art {
    position: relative;
    display: grid;
    place-items: center;
    min-height: 320px;
}

.sn-svc-orb {
    position: absolute;
    border-radius: 50%;
    border: 1px solid rgba(142, 188, 64, .4);
    transform: rotate(-23deg);
    pointer-events: none;
}

.sn-svc-orb-one { width: 350px; height: 140px; animation: snSvcOrbit 13s linear infinite; }
.sn-svc-orb-two { width: 170px; height: 340px; border-color: rgba(36, 215, 247, .22); animation: snSvcOrbit 17s linear reverse infinite; }

@keyframes snSvcOrbit { to { transform: rotate(337deg); } }

.sn-svc-hero-photo {
    position: relative;
    z-index: 1;
    width: 100%;
    max-height: 330px;
    object-fit: cover;
    border-radius: 24px;
    box-shadow: 10px 16px 34px rgba(40, 56, 42, .18);
}

.sn-svc-art-card {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: .5rem;
    width: min(300px, 84%);
    padding: 1.5rem 1.35rem;
    background: rgba(255, 255, 255, .88);
    border: 1px solid rgba(255, 255, 255, .95);
    border-radius: 22px;
    box-shadow: 10px 14px 30px rgba(46, 71, 51, .13), inset 2px 2px 9px rgba(255, 255, 255, .95);
    backdrop-filter: blur(8px);
}

.sn-svc-art-icon {
    display: grid;
    place-items: center;
    width: 54px;
    height: 54px;
    margin-bottom: .3rem;
    color: #fff;
    background: var(--sn-primary);
    border-radius: 16px;
    box-shadow: 4px 6px 14px rgba(142, 188, 64, .32);
    font-size: 1.5rem;
}

.sn-svc-art-kicker { color: #87958d; font-size: .72rem; }
.sn-svc-art-card strong { color: var(--sn-dark); font-size: 1.02rem; line-height: 1.9; }

.sn-svc-art-list { display: grid; gap: .45rem; margin: .6rem 0 0; }
.sn-svc-art-list li { display: flex; align-items: flex-start; gap: .4rem; color: #7c8981; font-size: .76rem; line-height: 1.9; }
.sn-svc-art-list i { color: var(--sn-primary-dark); margin-top: .28rem; }

/* =====================================================================
   نوار لنگرها — پیمایش سریع بین بخش‌های همان خدمت
   ===================================================================== */
.sn-svc-anchors {
    position: sticky;
    top: 72px;
    z-index: 900;
    padding: .5rem 0;
    background: rgba(255, 255, 255, .92);
    border-bottom: 1px solid rgba(142, 188, 64, .18);
    backdrop-filter: blur(10px);
}

.sn-svc-anchor-row {
    display: flex;
    gap: .5rem;
    overflow-x: auto;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.sn-svc-anchor-row::-webkit-scrollbar { display: none; }

.sn-svc-anchor {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .45rem .9rem;
    color: var(--sn-text);
    background: #f5f7f2;
    border: 1px solid #e5eade;
    border-radius: 11px;
    font-size: .76rem;
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
    transition: color .25s, background .25s, border-color .25s, transform .25s;
}

.sn-svc-anchor:hover {
    color: var(--sn-primary-dark);
    background: rgba(142, 188, 64, .14);
    border-color: rgba(142, 188, 64, .4);
    transform: translateY(-2px);
}

.sn-svc-anchor.is-active {
    color: #fff;
    background: var(--sn-primary);
    border-color: var(--sn-primary);
    box-shadow: 3px 5px 12px rgba(142, 188, 64, .34);
}

.sn-svc-anchor.is-active:hover { color: #fff; }

/* =====================================================================
   بخش‌ها + سرصفحه‌ی بخش‌ها
   ===================================================================== */
.sn-svc-section { padding: clamp(3rem, 6vw, 4.6rem) 0; }
.sn-svc-section-alt { background: linear-gradient(180deg, #f7f9f3 0%, #fbfcf9 100%); }

.sn-svc-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 2rem;
    margin-bottom: 1.9rem;
}

/* عنوان چپ‌چین با خط تأکید راست‌چین (بدون دست‌زدن به سایر صفحات) */
.sn-svc-head .sn-section-title {
    margin: .35rem 0 0;
    padding-bottom: .8rem;
    text-align: right;
    font-size: clamp(1.4rem, 2.6vw, 2rem);
}

.sn-svc-head .sn-section-title::after { right: 0; transform: none; }

.sn-svc-head p {
    max-width: 420px;
    margin: 0;
    color: #8b9690;
    font-size: .84rem;
    line-height: 2;
}

/* =====================================================================
   راهنمای خدمت — فهرست مطالب چسبان در کنار فصل‌های شماره‌دار
   (جایگزین «متن پیوسته»: هر بخش از محتوا یک کارت فصل قابل‌اسکن می‌شود)
   ===================================================================== */
.sn-svc-guide-grid {
    display: grid;
    grid-template-columns: minmax(0, 640px) minmax(260px, 320px);
    justify-content: space-between;
    align-items: start;
    gap: clamp(1.4rem, 3.5vw, 3rem);
}

/* minmax(0,1fr) → ستون هرگز از محتوای حداقلی (جدول‌ها/متن‌های بلند) بزرگ‌تر نمی‌شود و
   کل راهنما در موبایل بیرون نمی‌زند؛ اسکرول افقی داخل خود قاب انجام می‌شود. */
.sn-svc-guide-main {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: clamp(1rem, 2vw, 1.35rem);
}

/* ----- پنل روایت ابتدای راهنما ----- */
.sn-svc-guide-intro-card {
    position: relative;
    min-width: 0;
    overflow: hidden;
    padding: clamp(1.4rem, 3vw, 2.1rem);
    background: linear-gradient(150deg, rgba(142, 188, 64, .12) 0%, rgba(142, 188, 64, .03) 46%, transparent 78%), var(--sn-card);
    border: 1px solid rgba(142, 188, 64, .2);
    border-radius: 22px;
    box-shadow: var(--sn-neu);
}

.sn-svc-guide-kicker {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    color: var(--sn-primary-dark);
    font-size: .72rem;
    font-weight: 900;
    letter-spacing: .01em;
    text-transform: uppercase;
}

.sn-svc-guide-title {
    margin: .7rem 0 .6rem;
    color: var(--sn-dark);
    font-size: clamp(1.2rem, 2.4vw, 1.6rem);
    font-weight: 900;
    line-height: 1.75;
}

.sn-svc-guide-summary {
    margin: 0 0 .35rem;
    padding-inline-start: .95rem;
    border-inline-start: 4px solid var(--sn-primary);
    color: #6d7a72;
    font-size: .88rem;
    line-height: 2.15;
}

.sn-svc-guide-intro { margin-top: 1rem; }

/* ----- کارت هر فصل ----- */
.sn-svc-guide-chapters {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: clamp(.9rem, 2vw, 1.35rem);
}

.sn-svc-chapter {
    min-width: 0;
    padding: clamp(1.25rem, 2.6vw, 1.9rem);
    background: var(--sn-card);
    border: 1px solid rgba(43, 43, 43, .06);
    border-radius: 20px;
    box-shadow: var(--sn-neu);
    transition: box-shadow .3s ease, border-color .3s ease;
}

.sn-svc-chapter:hover { border-color: rgba(142, 188, 64, .38); box-shadow: var(--sn-shadow-hover); }

.sn-svc-chapter-head {
    display: flex;
    align-items: center;
    gap: .7rem;
    margin-bottom: .35rem;
    padding-bottom: .85rem;
    border-bottom: 1px dashed rgba(142, 188, 64, .38);
}

.sn-svc-chapter-num {
    flex: 0 0 38px;
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    color: #fff;
    background: linear-gradient(160deg, var(--sn-primary) 0%, #a8cf5c 100%);
    border-radius: 13px;
    box-shadow: 4px 6px 14px rgba(142, 188, 64, .34);
    font-size: 1rem;
    font-weight: 900;
}

.sn-svc-chapter-title {
    display: flex;
    align-items: center;
    gap: .5rem;
    margin: 0;
    color: var(--sn-dark);
    font-size: clamp(1rem, 2vw, 1.16rem);
    font-weight: 900;
    line-height: 1.8;
}

.sn-svc-chapter-title i { color: var(--sn-primary-dark); font-size: .95rem; }

.sn-svc-chapter-body { padding-top: .3rem; }

/* ----- گام داخل فصل (متناظر با مراحل شماره‌دار محتوا) ----- */
.sn-svc-step { margin-top: 1.25rem; }
.sn-svc-step + .sn-svc-step { margin-top: 1.1rem; }

.sn-svc-step-head {
    display: flex;
    align-items: center;
    gap: .5rem;
    margin: 0 0 .4rem;
    color: var(--sn-dark);
    font-size: .95rem;
    font-weight: 900;
    line-height: 1.85;
}

.sn-svc-step-dot {
    flex: 0 0 10px;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--sn-primary);
    box-shadow: 0 0 0 4px rgba(142, 188, 64, .16);
}

/* ----- زیربخش ----- */
.sn-svc-subhead {
    position: relative;
    margin: 1.4rem 0 .55rem;
    padding-inline-start: .9rem;
    color: var(--sn-dark);
    font-size: .95rem;
    font-weight: 800;
    line-height: 1.9;
}

.sn-svc-subhead::before {
    content: "";
    position: absolute;
    inset-inline-start: 0;
    top: .5rem;
    width: 5px;
    height: 1rem;
    border-radius: 4px;
    background: linear-gradient(180deg, var(--sn-primary), #b7d979);
}

/* ----- اجزای داخل متن راهنما ----- */
.sn-svc-guide-main { color: var(--sn-text); font-size: .95rem; line-height: 2.1; }

.sn-svc-guide-main p { margin: 0 0 .85rem; }
.sn-svc-guide-main p:last-child { margin-bottom: 0; }
.sn-svc-guide-main strong { color: var(--sn-dark); font-weight: 800; }

/* جمله کلیدی / پرسش کلیدی — پاراگرافی که تمامش تأکید است */
.sn-svc-keyline,
.sn-svc-keyquestion {
    position: relative;
    display: flex;
    align-items: flex-start;
    gap: .55rem;
    margin: 1rem 0 !important;
    padding: .75rem 1rem;
    border-radius: 14px;
    font-size: .92rem;
    line-height: 2;
}

.sn-svc-keyline { color: var(--sn-dark); background: rgba(142, 188, 64, .09); border-inline-start: 4px solid var(--sn-primary); }
.sn-svc-keyquestion { color: #5c6b62; background: #f6f8f2; border: 1px dashed rgba(142, 188, 64, .45); }

.sn-svc-keyline i,
.sn-svc-keyquestion i { margin-top: .45rem; color: var(--sn-primary-dark); font-size: .95rem; }
.sn-svc-keyline > strong,
.sn-svc-keyquestion > strong { flex: 1 1 auto; }

/* پاراگراف معرف فهرست — چسبیده به فهرست پایین خود */
.sn-svc-lead-in { margin-bottom: .5rem !important; color: var(--sn-dark); font-weight: 800; }

/* فهرست تیک‌دار → شبکه دو ستونه (خروج از حالت متن پیوسته) */
.sn-svc-checks {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .6rem;
    margin: .55rem 0 1.15rem;
    padding: 0;
    list-style: none;
}

.sn-svc-checks li {
    /* grid به‌جای flex: متنِ بدون span هم تمام عرض ستون را می‌گیرد تا هم‌ترازی دوطرفه اثر کند */
    display: grid;
    grid-template-columns: 20px minmax(0, 1fr);
    align-items: start;
    column-gap: .5rem;
    padding: .6rem .8rem;
    color: var(--sn-dark);
    background: #f7f9f4;
    border: 1px solid #e6ecdf;
    border-radius: 13px;
    font-size: .84rem;
    line-height: 1.95;
}

.sn-svc-checks li::before {
    content: "";
    flex: 0 0 20px;
    width: 20px;
    height: 20px;
    margin-top: .3rem;
    border-radius: 50%;
    background: rgba(142, 188, 64, .16) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%237CA835'%3E%3Cpath d='M13.485 1.929a.75.75 0 1 1 1.06 1.06l-7.5 7.5a.75.75 0 0 1-1.06 0l-3.5-3.5a.75.75 0 1 1 1.06-1.06L6.5 8.879z'/%3E%3C/svg%3E") center/12px 12px no-repeat;
}

/* گام‌های شماره‌دار داخل متن */
.sn-svc-guide-main .sn-svc-steps {
    margin: .55rem 0 1.15rem;
    padding: 0;
    list-style: none;
    counter-reset: svc-ol;
}

.sn-svc-guide-main .sn-svc-steps li {
    position: relative;
    margin-bottom: .5rem;
    padding: .6rem .85rem .6rem 2.6rem;
    color: var(--sn-dark);
    background: #f7f9f4;
    border: 1px solid #e6ecdf;
    border-radius: 13px;
    font-size: .85rem;
}

.sn-svc-guide-main .sn-svc-steps li::before {
    counter-increment: svc-ol;
    content: counter(svc-ol);
    position: absolute;
    inset-inline-start: .7rem;
    top: .55rem;
    display: grid;
    place-items: center;
    width: 24px;
    height: 24px;
    color: #fff;
    background: var(--sn-primary);
    border-radius: 8px;
    font-size: .74rem;
    font-weight: 900;
}

/* نقل‌قول و نکته تأکیدی */
.sn-svc-quote {
    margin: 1.1rem 0;
    padding: .9rem 1.1rem;
    color: var(--sn-dark);
    background: rgba(142, 188, 64, .07);
    border-inline-start: 4px solid rgba(142, 188, 64, .55);
    border-radius: 0 14px 14px 0;
}

.sn-svc-quote p:last-child { margin-bottom: 0; }

.sn-svc-quote-key {
    background: linear-gradient(135deg, rgba(142, 188, 64, .14), rgba(142, 188, 64, .05));
    border: 1px solid rgba(142, 188, 64, .3);
    border-inline-start: 4px solid var(--sn-primary);
    border-radius: 16px;
    font-size: .93rem;
}

/* جدول مقایسه — ریسپانسیو با قاب مستقل */
.sn-svc-table-wrap {
    max-width: 100%;
    margin: 1.1rem 0 1.3rem;
    overflow-x: auto;
    border: 1px solid #e4e9dc;
    border-radius: 16px;
    background: #fbfcf9;
}

.sn-svc-guide-main table.sn-svc-compare {
    width: 100%;
    min-width: 520px;
    margin: 0;
    border-collapse: collapse;
    font-size: .84rem;
}

.sn-svc-compare th,
.sn-svc-compare td {
    padding: .7rem .9rem;
    border-bottom: 1px solid #e8ede1;
    text-align: right;
    vertical-align: top;
}

.sn-svc-compare thead th,
.sn-svc-compare tr:first-child th {
    color: var(--sn-dark);
    background: rgba(142, 188, 64, .14);
    font-weight: 900;
}

.sn-svc-compare td:first-child { color: var(--sn-dark); font-weight: 700; background: rgba(142, 188, 64, .05); }
.sn-svc-compare tr:last-child td,
.sn-svc-compare tr:last-child th { border-bottom: 0; }

.sn-svc-guide-closing {
    margin: 1rem 0 0;
    padding: .9rem 1.1rem;
    color: var(--sn-primary-dark);
    background: rgba(142, 188, 64, .1);
    border-radius: 14px;
    font-size: .9rem;
    font-weight: 800;
    text-align: center;
}

/* ----- فهرست مطالب چسبان در ستون کنار ----- */
.sn-svc-guide-toc ol {
    display: block;
    margin: 0;
    padding: 0;
    list-style: none;
    counter-reset: svc-toc;
    max-height: min(58vh, 520px);
    overflow-y: auto;
    scrollbar-width: thin;
}

/* فقط فصل‌ها شماره می‌گیرند تا شماره‌ی فصل‌ها با شماره‌ی کارت‌های فصل یکی بماند
   (گام‌ها با نقطه نمایش داده می‌شوند و نباید شماره‌ی فصل‌ها را جابه‌جا کنند) */
.sn-svc-guide-toc li.is-chapter { counter-increment: svc-toc; }

.sn-svc-guide-toc li.is-step { margin-inline-start: 1.15rem; }

.sn-svc-guide-toc a {
    display: flex;
    align-items: flex-start;
    gap: .5rem;
    padding: .3rem .35rem;
    color: var(--sn-text);
    border-radius: 9px;
    font-size: .79rem;
    line-height: 1.85;
    text-decoration: none;
    transition: color .2s, background .2s;
}

.sn-svc-guide-toc li.is-chapter > a { font-weight: 800; color: var(--sn-dark); }
.sn-svc-guide-toc li.is-step > a { font-size: .75rem; }

.sn-svc-guide-toc a::before {
    flex: 0 0 22px;
    display: grid;
    place-items: center;
    width: 22px;
    height: 22px;
    margin-top: .12rem;
    border-radius: 7px;
    font-size: .66rem;
    font-weight: 900;
}

.sn-svc-guide-toc li.is-chapter > a::before {
    content: counter(svc-toc);
    color: var(--sn-primary-dark);
    background: rgba(142, 188, 64, .16);
}

.sn-svc-guide-toc li.is-step > a::before {
    content: "";
    width: 8px;
    height: 8px;
    flex-basis: 8px;
    margin-top: .55rem;
    margin-inline-start: .45rem;
    border-radius: 50%;
    background: rgba(142, 188, 64, .55);
}

.sn-svc-guide-toc a:hover { color: var(--sn-primary-dark); background: rgba(142, 188, 64, .08); }
.sn-svc-guide-toc a.is-target,
.sn-svc-guide-toc a.is-active { color: var(--sn-primary-dark); background: rgba(142, 188, 64, .12); font-weight: 800; }

/* ستون کنار: مزایا + آمار واقعی */
.sn-svc-aside { position: sticky; top: 138px; display: grid; gap: 1rem; }

.sn-svc-aside-card {
    padding: 1.35rem 1.25rem;
    background: var(--sn-card);
    border-radius: var(--sn-radius);
    box-shadow: var(--sn-neu);
}

.sn-svc-aside-card h3 {
    display: flex;
    align-items: center;
    gap: .45rem;
    margin: 0 0 1rem;
    color: var(--sn-dark);
    font-size: .96rem;
    font-weight: 900;
}

.sn-svc-aside-card h3 i { color: var(--sn-primary-dark); }

.sn-svc-aside-list { display: grid; gap: .6rem; margin: 0 0 1.1rem; }
.sn-svc-aside-list li { display: flex; align-items: flex-start; gap: .5rem; color: var(--sn-text); font-size: .82rem; line-height: 1.9; }
.sn-svc-aside-list i { margin-top: .3rem; color: var(--sn-primary-dark); }

/* عنوان و توضیح مزیت در دو سطر جدا — خوانایی بهتر در موبایل */
.sn-svc-aside-item { display: grid; gap: .12rem; }
.sn-svc-aside-item strong { color: var(--sn-dark); font-weight: 800; }
.sn-svc-aside-item small { color: #8b9690; font-size: .74rem; line-height: 1.85; }

.sn-svc-aside-stats { display: grid; gap: .55rem; margin: 0; }
.sn-svc-aside-stats > div,
.sn-svc-aside-stats li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .6rem;
    padding: .55rem .75rem;
    background: #f7f9f4;
    border-radius: 12px;
    color: var(--sn-text);
    font-size: .8rem;
}
.sn-svc-aside-stats strong { color: var(--sn-primary-dark); font-size: .95rem; }

/* =====================================================================
   مزایا — کارت‌های نئومورفیک هم‌زبان با صفحه اصلی
   ===================================================================== */
.sn-svc-feature-card { padding: 1.9rem 1.4rem; }
.sn-svc-feature-card .sn-service-desc { min-height: 0; margin-bottom: 0; }

/* =====================================================================
   مراحل اجرا — تایم‌لاین با خط رابط
   ===================================================================== */
.sn-svc-process-wrap { position: relative; padding-top: .5rem; }

.sn-svc-progress-line {
    position: absolute;
    top: 26px;
    inset-inline: 8%;
    height: 3px;
    border-radius: 3px;
    background: linear-gradient(90deg, var(--sn-primary), rgba(142, 188, 64, .12));
    pointer-events: none;
    z-index: 1;
}

.sn-svc-process { position: relative; z-index: 2; }
.sn-svc-process .sn-timeline-step { flex: 0 1 165px; }
.sn-svc-process .sn-timeline-text { color: var(--sn-dark); font-weight: 700; line-height: 1.9; }

.sn-svc-process-note {
    margin: 2rem auto 0;
    max-width: 520px;
    color: #8b9690;
    font-size: .78rem;
    line-height: 2;
    text-align: center;
}

/* =====================================================================
   نمونه‌کارها — کارت‌های تصویری خدمات
   ===================================================================== */
.sn-svc-portfolios .sn-portfolio-img { height: 150px; }

.sn-svc-portfolios .sn-portfolio-body p {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

.sn-svc-portfolio-tag {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    margin-bottom: .55rem;
    padding: .22rem .55rem;
    color: #758a54;
    background: #e4eed4;
    border-radius: 8px;
    font-size: .62rem;
    font-weight: 800;
}

/* =====================================================================
   تعرفه‌ها — همان کارت‌های قیمت سایت
   ===================================================================== */
.sn-svc-pricing .sn-price-features { min-height: 120px; }

/* =====================================================================
   بخش پایانی — فراخوان + فرم مشاوره
   ===================================================================== */
.sn-svc-order {
    position: relative;
    overflow: hidden;
    padding: clamp(2rem, 5vw, 3.2rem);
    background: linear-gradient(135deg, #f3f6ef 0%, #eef4e6 100%);
    border-radius: 26px;
    box-shadow: var(--sn-neu);
    text-align: center;
}

.sn-svc-order::before {
    content: "";
    position: absolute;
    inset-inline-start: -90px;
    top: -90px;
    width: 260px;
    height: 260px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(142, 188, 64, .18), transparent 65%);
    pointer-events: none;
}

.sn-svc-order > * { position: relative; }

.sn-svc-order h2 {
    margin: .5rem 0 .6rem;
    color: var(--sn-dark);
    font-size: clamp(1.3rem, 2.6vw, 1.9rem);
    font-weight: 900;
}

.sn-svc-order-text { margin: 0 auto; max-width: 560px; color: #78837c; font-size: .9rem; line-height: 2.1; }

.sn-svc-order-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: .7rem;
    margin-top: 1.4rem;
}

.sn-svc-order-actions .btn { display: inline-flex; align-items: center; gap: .4rem; }

/* فرم مشاوره در این صفحه — هم‌زبان با صفحه اصلی */
.sn-svc .sn-consultation {
    background: #fff;
    border: 1px solid rgba(142, 188, 64, .18);
    border-radius: 26px;
    box-shadow: 0 22px 46px rgba(43, 43, 43, .08);
}

.sn-svc .sn-consultation .form-control,
.sn-svc .sn-consultation .form-select {
    padding: .7rem 1rem;
    background: #fafbf7;
    border: 1px solid rgba(43, 43, 43, .1);
    border-radius: 14px;
}

.sn-svc .sn-consultation .form-control:focus,
.sn-svc .sn-consultation .form-select:focus {
    background: #fff;
    border-color: var(--sn-primary);
    box-shadow: 0 0 0 4px rgba(142, 188, 64, .14);
}

/* =====================================================================
   ریسپانسیو
   ===================================================================== */
@media (max-width: 991px) {
    .sn-svc-hero-grid { grid-template-columns: 1fr; gap: 2rem; }
    .sn-svc-hero-art { min-height: 260px; }
    .sn-svc-orb-one { width: 290px; height: 118px; }
    .sn-svc-orb-two { width: 140px; height: 285px; }
    .sn-svc-anchors { top: 64px; }
    .sn-svc-head { align-items: flex-start; flex-direction: column; gap: .6rem; }
    .sn-svc-head p { max-width: none; }
    .sn-svc-progress-line { display: none; }

    /* راهنما: تک‌ستونه — فهرست مطالب به بالای فصل‌ها می‌آید و چسبان نمی‌ماند */
    .sn-svc-guide-grid { grid-template-columns: minmax(0, 1fr); }
    .sn-svc-guide-aside { position: static; }
    .sn-svc-guide-aside .sn-svc-guide-toc { order: -1; }
    .sn-svc-guide-toc ol { max-height: min(42vh, 320px); }
}

@media (max-width: 600px) {
    .sn-svc-hero { padding: 2.4rem 0 2.6rem; }
    .sn-svc-hero-title { font-size: 1.85rem; }
    .sn-svc-hero-actions .btn { width: 100%; justify-content: center; }
    .sn-svc-hero-art { min-height: 225px; }
    .sn-svc-art-card { width: min(270px, 90%); padding: 1.25rem 1.1rem; }
    .sn-svc-anchor { padding: .4rem .7rem; font-size: .72rem; }
    .sn-svc-pricing .sn-price-features { min-height: 0; }
    .sn-svc-order-actions .btn { width: 100%; justify-content: center; }

    /* راهنما: فهرست‌های تیک‌دار تک‌ستونه، فصل‌ها جمع‌وجور‌تر */
    .sn-svc-checks { grid-template-columns: 1fr; }
    .sn-svc-chapter,
    .sn-svc-guide-intro-card { padding: 1.15rem 1rem; }
    .sn-svc-chapter { border-radius: 16px; }
    .sn-svc-chapter-num { flex-basis: 32px; width: 32px; height: 32px; border-radius: 11px; font-size: .88rem; }
    .sn-svc-guide-main table.sn-svc-compare { min-width: 440px; font-size: .78rem; }
    .sn-svc-compare th, .sn-svc-compare td { padding: .55rem .7rem; }
}

/* =====================================================================
   حالت شب
   ===================================================================== */
body.dark_mode .sn-svc-hero-title,
body.dark_mode .sn-svc-head .sn-section-title,
body.dark_mode .sn-svc-aside-card h3,
body.dark_mode .sn-svc-order h2,
body.dark_mode .sn-svc-art-card strong { color: #e8e8e8; }

body.dark_mode .sn-svc-hero-lead,
body.dark_mode .sn-svc-head p,
body.dark_mode .sn-svc-order-text,
body.dark_mode .sn-svc-art-kicker,
body.dark_mode .sn-svc-art-list li { color: #a49f9f; }

body.dark_mode .sn-svc-hero-slogan { color: #c6dd92; background: rgba(142, 188, 64, .16); }

body.dark_mode .sn-svc-hero-meta li {
    color: #b9b4b4;
    background: rgba(43, 43, 43, .85);
    border-color: #3c4638;
    box-shadow: 4px 6px 14px rgba(0, 0, 0, .45);
}

body.dark_mode .sn-svc-art-card { background: rgba(43, 43, 43, .92); border-color: #434d40; }

body.dark_mode .sn-svc-anchors { background: rgba(28, 28, 28, .92); border-bottom-color: #3a3a3a; }

body.dark_mode .sn-svc-anchor { color: #b9b4b4; background: #2b2b2b; border-color: #3c3c3c; }
body.dark_mode .sn-svc-anchor:hover { color: #c6dd92; background: rgba(142, 188, 64, .16); border-color: rgba(142, 188, 64, .45); }

body.dark_mode .sn-svc-section-alt { background: linear-gradient(180deg, #242424 0%, #1f1f1f 100%); }

body.dark_mode .sn-svc-aside-card {
    background: #2b2b2b;
    box-shadow: 5px 7px 14px rgba(0, 0, 0, .5), inset 1px 1px 6px rgba(255, 255, 255, .04);
}

body.dark_mode .sn-svc-anchor.is-active { background: var(--sn-primary); border-color: var(--sn-primary); color: #fff; }

body.dark_mode .sn-svc-guide-intro-card {
    background: linear-gradient(150deg, rgba(142, 188, 64, .16) 0%, rgba(142, 188, 64, .04) 46%, transparent 78%), #2b2b2b;
    border-color: rgba(142, 188, 64, .28);
}

body.dark_mode .sn-svc-guide-title,
body.dark_mode .sn-svc-chapter-title,
body.dark_mode .sn-svc-step-head,
body.dark_mode .sn-svc-subhead,
body.dark_mode .sn-svc-guide-main strong,
body.dark_mode .sn-svc-keyline,
body.dark_mode .sn-svc-lead-in,
body.dark_mode .sn-svc-checks li { color: #e8e8e8; }

body.dark_mode .sn-svc-guide-summary,
body.dark_mode .sn-svc-guide-main { color: #b9b4b4; }

body.dark_mode .sn-svc-chapter {
    background: #2b2b2b;
    border-color: #3a3a3a;
    box-shadow: 5px 7px 14px rgba(0, 0, 0, .5), inset 1px 1px 6px rgba(255, 255, 255, .04);
}

body.dark_mode .sn-svc-chapter-head { border-bottom-color: rgba(142, 188, 64, .3); }

body.dark_mode .sn-svc-keyline { background: rgba(142, 188, 64, .12); }
body.dark_mode .sn-svc-keyquestion { color: #c6dd92; background: #232a20; border-color: rgba(142, 188, 64, .4); }

body.dark_mode .sn-svc-checks li { background: #232a20; border-color: #3c4638; }
body.dark_mode .sn-svc-guide-main .sn-svc-steps li { color: #ddd8d7; background: #232a20; border-color: #3c4638; }

body.dark_mode .sn-svc-quote { color: #ddd8d7; background: rgba(142, 188, 64, .12); }
body.dark_mode .sn-svc-quote-key { background: linear-gradient(135deg, rgba(142, 188, 64, .2), rgba(142, 188, 64, .07)); border-color: rgba(142, 188, 64, .34); }

body.dark_mode .sn-svc-table-wrap { background: #262626; border-color: #3a3a3a; }
body.dark_mode .sn-svc-compare th,
body.dark_mode .sn-svc-compare td { border-bottom-color: #3a3a3a; }
body.dark_mode .sn-svc-compare thead th,
body.dark_mode .sn-svc-compare tr:first-child th { color: #e8e8e8; background: rgba(142, 188, 64, .18); }
body.dark_mode .sn-svc-compare td:first-child { color: #e8e8e8; background: rgba(142, 188, 64, .08); }

body.dark_mode .sn-svc-guide-closing { color: #c6dd92; background: rgba(142, 188, 64, .14); }

body.dark_mode .sn-svc-guide-toc li.is-chapter > a { color: #e8e8e8; }
body.dark_mode .sn-svc-guide-toc li.is-chapter > a::before { color: #c6dd92; background: rgba(142, 188, 64, .22); }
body.dark_mode .sn-svc-guide-toc a:hover,
body.dark_mode .sn-svc-guide-toc a.is-target,
body.dark_mode .sn-svc-guide-toc a.is-active { color: #c6dd92; background: rgba(142, 188, 64, .16); }

body.dark_mode .sn-svc-aside-list li { color: #b9b4b4; }
body.dark_mode .sn-svc-aside-item strong { color: #e8e8e8; }
body.dark_mode .sn-svc-aside-item small { color: #938e8e; }
body.dark_mode .sn-svc-aside-stats > div,
body.dark_mode .sn-svc-aside-stats li { color: #b9b4b4; background: #232a20; }

body.dark_mode .sn-svc-process .sn-timeline-text { color: #ddd8d7; }
body.dark_mode .sn-svc-progress-line { background: linear-gradient(90deg, var(--sn-primary), rgba(142, 188, 64, .1)); }
body.dark_mode .sn-svc-process-note { color: #938e8e; }

body.dark_mode .sn-svc-portfolio-tag { color: #c6dd92; background: rgba(142, 188, 64, .16); }

body.dark_mode .sn-svc-order { background: linear-gradient(135deg, #20271d 0%, #1f1f1f 100%); }

body.dark_mode .sn-svc .sn-consultation { background: #2b2b2b; border-color: rgba(142, 188, 64, .22); }

body.dark_mode .sn-svc .sn-consultation .form-control,
body.dark_mode .sn-svc .sn-consultation .form-select { color: #ddd; background: #343434; border-color: transparent; }

body.dark_mode .sn-svc .sn-consultation .form-control:focus,
body.dark_mode .sn-svc .sn-consultation .form-select:focus { background: #3a3a3a; }

/* =====================================================================
   کاهش حرکت — احترام به تنظیم کاربر
   ===================================================================== */
@media (prefers-reduced-motion: reduce) {
    .sn-svc-orb,
    .sn-svc-anchor { animation: none !important; transition: none !important; }
}