/* =====================================================================
   Soransoft — بازطراحی صفحه اصلی (GSAP + Lenis + Swiper)
   همه استایل‌ها داخل .sn-home اسکوپ شده‌اند تا بقیه صفحات دست‌نخورده بمانند
   ===================================================================== */

/* ---------- Lenis ---------- */
html.lenis,
html.lenis body {
    height: auto;
}

.lenis.lenis-smooth {
    scroll-behavior: auto !important;
}

.lenis.lenis-smooth [data-lenis-prevent] {
    overscroll-behavior: contain;
}

.lenis.lenis-stopped {
    overflow: hidden;
}

/* ---------- بدنه صفحه اصلی ---------- */
.sn-home {
    overflow-x: clip;
}

/* ---------- بخش‌ها: ریتم و عنوان‌ها ---------- */
.sn-home .sn-section {
    padding: 4.5rem 0 4rem;
    position: relative;
}

.sn-home .sn-section-alt {
    background: linear-gradient(180deg, rgba(142, 188, 64, .05), rgba(142, 188, 64, 0) 60%);
}

.sn-home .sn-section-title {
    font-size: clamp(1.6rem, 3.2vw, 2.3rem);
    font-weight: 900;
    color: var(--sn-dark);
    position: relative;
    display: inline-block;
    padding-bottom: .9rem;
}

.sn-home .sn-section-title::after {
    content: "";
    position: absolute;
    bottom: 0;
    inset-inline-start: 50%;
    transform: translateX(50%);
    width: 64px;
    height: 4px;
    border-radius: 4px;
    background: linear-gradient(90deg, var(--sn-primary), #b7d979);
}

.sn-home .sn-section-subtitle {
    color: var(--sn-text);
    font-size: 1rem;
    margin-top: .4rem;
}

/* =====================================================================
   Hero
   ===================================================================== */
.sn-home #services {
    scroll-margin-top: 90px;
}

.sn-home .sn-hero-swiper .swiper-slide {
    min-height: var(--sn-slider-height, 380px);
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.sn-home .sn-hero-swiper .sn-hero-bg {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    opacity: var(--sn-slider-overlay-opacity, .14);
}

.sn-home .sn-hero {
    background:
        radial-gradient(900px 420px at 12% -10%, rgba(142, 188, 64, .16), transparent 60%),
        radial-gradient(700px 380px at 88% 110%, rgba(36, 215, 247, .10), transparent 55%),
        radial-gradient(520px 300px at 70% 10%, rgba(142, 188, 64, .08), transparent 55%),
        #fff;
    position: relative;
    overflow: hidden;
}

.sn-home .sn-hero-glow {
    position: absolute;
    width: 460px;
    height: 460px;
    border-radius: 50%;
    filter: blur(70px);
    pointer-events: none;
    opacity: .5;
}

.sn-home .sn-glow1 { background: radial-gradient(circle, rgba(142, 188, 64, .30), transparent 65%); top: -140px; inset-inline-start: -120px; }
.sn-home .sn-glow2 { background: radial-gradient(circle, rgba(36, 215, 247, .20), transparent 65%); bottom: -180px; inset-inline-end: -140px; }

.sn-home .sn-arc {
    position: absolute;
    border-radius: 50%;
    border: 42px solid rgba(142, 188, 64, .10);
    width: 400px;
    height: 400px;
    pointer-events: none;
    will-change: transform;
}

.sn-home .sn-arc.sn-arc1 { left: -150px; top: -170px; border-color: rgba(142, 188, 64, .14); }
.sn-home .sn-arc.sn-arc2 { right: -150px; top: -190px; border-color: rgba(36, 215, 247, .12); }

.sn-home .sn-float-icon {
    position: absolute;
    font-size: 2rem;
    color: var(--sn-primary);
    opacity: .85;
    pointer-events: none;
    filter: drop-shadow(0 10px 16px rgba(142, 188, 64, .25));
    will-change: transform;
    /* حرکت این آیکون‌ها الان با GSAP مدیریت می‌شود؛ CSS animation با آن تداخل می‌کرد */
    animation: none;
}

.sn-home .sn-float-icon.sn-f1 { top: 18%; right: 12%; }
.sn-home .sn-float-icon.sn-f2 { top: 55%; right: 22%; font-size: 1.5rem; color: #24d7f7; }
.sn-home .sn-float-icon.sn-f3 { top: 24%; left: 14%; font-size: 1.7rem; }
.sn-home .sn-float-icon.sn-f4 { top: 62%; left: 9%; color: #f5b301; }
.sn-home .sn-float-icon.sn-f5 { top: 40%; left: 26%; font-size: 1.2rem; color: var(--sn-muted); }

.sn-home .sn-hero-slide {
    padding: 4.5rem 1rem;
}

.sn-home .sn-hero-kicker {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    background: rgba(142, 188, 64, .12);
    color: var(--sn-primary-dark);
    border: 1px solid rgba(142, 188, 64, .28);
    border-radius: 999px;
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: 2px;
    padding: .3rem 1rem;
    margin-bottom: 1.1rem;
}

.sn-home .sn-hero-title {
    font-size: clamp(1.9rem, 4.6vw, 3.3rem);
    font-weight: 900;
    color: var(--sn-dark);
    line-height: 1.5;
    max-width: 820px;
    margin-inline: auto;
}

.sn-home .sn-hero-text {
    color: var(--sn-text);
    max-width: 640px;
    margin: 1rem auto 0;
    font-size: 1.08rem;
}

.sn-home .sn-hero .btn {
    box-shadow: 0 14px 30px rgba(142, 188, 64, .35);
}

/* ورود اسلاید فعال — با تعویض اسلاید دوباره اجرا می‌شود */
.sn-home .sn-hero-swiper .swiper-slide {
    opacity: .25;
    transition: opacity .9s ease;
}

.sn-home .sn-hero-swiper .swiper-slide-active {
    opacity: 1;
}

.sn-home .sn-hero-swiper .swiper-slide-active .sn-hero-kicker,
.sn-home .sn-hero-swiper .swiper-slide-active .sn-hero-title,
.sn-home .sn-hero-swiper .swiper-slide-active .sn-hero-text,
.sn-home .sn-hero-swiper .swiper-slide-active .btn {
    animation: snSlideIn .8s cubic-bezier(.22, .8, .3, 1) both;
}

.sn-home .sn-hero-swiper .swiper-slide-active .sn-hero-title { animation-delay: .1s; }
.sn-home .sn-hero-swiper .swiper-slide-active .sn-hero-text { animation-delay: .22s; }
.sn-home .sn-hero-swiper .swiper-slide-active .btn { animation-delay: .34s; }

@keyframes snSlideIn {
    from { opacity: 0; transform: translateY(26px); }
    to { opacity: 1; transform: translateY(0); }
}

/* راهنمای اسکرول */
.sn-home .sn-scroll-hint {
    position: absolute;
    bottom: 18px;
    inset-inline-start: 50%;
    transform: translateX(50%);
    z-index: 5;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    color: var(--sn-muted);
    text-decoration: none;
    font-size: .72rem;
}

.sn-home .sn-scroll-mouse {
    width: 22px;
    height: 34px;
    border: 2px solid var(--sn-muted);
    border-radius: 12px;
    position: relative;
}

.sn-home .sn-scroll-mouse::after {
    content: "";
    position: absolute;
    top: 6px;
    inset-inline-start: 50%;
    transform: translateX(50%);
    width: 3px;
    height: 7px;
    border-radius: 3px;
    background: var(--sn-primary);
    animation: snScrollDot 1.6s ease-in-out infinite;
}

@keyframes snScrollDot {
    0% { opacity: 0; transform: translate(50%, 0); }
    35% { opacity: 1; }
    100% { opacity: 0; transform: translate(50%, 12px); }
}

/* Pagination هیرو */
.sn-home .sn-hero-pagination {
    position: absolute;
    bottom: 46px !important;
    inset-inline-start: 50%;
    transform: translateX(50%);
    display: flex;
    gap: 6px;
}

.sn-home .sn-hero-pagination .swiper-pagination-bullet {
    width: 26px;
    height: 5px;
    border-radius: 4px;
    background: rgba(43, 43, 43, .18);
    opacity: 1;
    transition: all .3s;
}

.sn-home .sn-hero-pagination .swiper-pagination-bullet-active {
    width: 44px;
    background: var(--sn-primary);
}

/* =====================================================================
   نوار سبز سرویس‌ها
   ===================================================================== */
.sn-home .sn-btn-section {
    background: linear-gradient(135deg, var(--sn-primary), #7fae37);
    border-radius: 26px 26px 0 0;
    padding: 1.6rem 1rem 1.2rem;
    position: relative;
    overflow: hidden;
}

.sn-home .sn-btn-section::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(420px 160px at 20% 0%, rgba(255, 255, 255, .18), transparent 60%);
    pointer-events: none;
}

.sn-home .sn-btn-item {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    gap: .25rem;
    background: rgba(255, 255, 255, .12);
    border: 1px solid rgba(255, 255, 255, .22);
    color: #fff;
    border-radius: 16px;
    padding: .7rem 1.4rem;
    margin: .3rem;
    font-weight: 700;
    text-decoration: none;
    transition: all .3s;
    backdrop-filter: blur(4px);
}

.sn-home .sn-btn-item:hover {
    background: #fff;
    color: var(--sn-primary-dark);
    transform: translateY(-4px);
    box-shadow: 0 12px 24px rgba(0, 0, 0, .16);
}

.sn-home .sn-btn-item i { font-size: 1.2rem; }

/* =====================================================================
   کارت خدمات
   ===================================================================== */
.sn-home .sn-service-card {
    background: #fff;
    border: 1px solid rgba(142, 188, 64, .14);
    box-shadow: 0 10px 30px rgba(43, 43, 43, .07);
    border-radius: 22px;
    padding: 2rem 1.5rem;
    text-align: center;
    height: 100%;
    transition: transform .35s ease, box-shadow .35s ease, border-color .35s ease;
}

.sn-home .sn-service-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 24px 48px rgba(142, 188, 64, .18);
    border-color: rgba(142, 188, 64, .4);
}

.sn-home .sn-service-icon {
    width: 74px;
    height: 74px;
    margin: 0 auto 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 22px;
    font-size: 1.9rem;
    color: var(--sn-primary-dark);
    background: linear-gradient(145deg, rgba(142, 188, 64, .16), rgba(142, 188, 64, .05));
    transition: transform .35s ease;
}

.sn-home .sn-service-card:hover .sn-service-icon {
    transform: translateY(-4px) rotate(-6deg) scale(1.06);
}

/* =====================================================================
   تایم‌لاین
   ===================================================================== */
.sn-home .sn-timeline {
    position: relative;
    display: flex;
    justify-content: center;
    gap: .5rem;
    flex-wrap: wrap;
    padding-top: .5rem;
}

.sn-home .sn-timeline-progress {
    position: absolute;
    top: 32px;
    inset-inline: 8%;
    height: 3px;
    border-radius: 3px;
    background: linear-gradient(90deg, var(--sn-primary), rgba(142, 188, 64, .15));
    transform-origin: right center;
    transform: scaleX(0);
    z-index: 1;
}

.sn-home .sn-timeline-step {
    flex: 0 1 150px;
    text-align: center;
    position: relative;
    z-index: 2;
}

.sn-home .sn-timeline-num {
    width: 56px;
    height: 56px;
    margin: 0 auto .7rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 10px 22px rgba(43, 43, 43, .10);
    border: 2px solid rgba(142, 188, 64, .25);
    color: var(--sn-primary-dark);
    font-weight: 900;
    transition: all .3s;
}

.sn-home .sn-timeline-step:hover .sn-timeline-num {
    background: var(--sn-primary);
    color: #fff;
    border-color: transparent;
    transform: scale(1.1) rotate(-4deg);
    box-shadow: 0 14px 26px rgba(142, 188, 64, .4);
}

/* =====================================================================
   شمارش معکوس
   ===================================================================== */
.sn-home .sn-countdown {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .7rem;
    direction: ltr;
}

.sn-home .sn-count-item {
    background: rgba(43, 43, 43, .92);
    border-radius: 18px;
    color: #fff;
    min-width: 92px;
    padding: 1rem;
    text-align: center;
    box-shadow: 0 16px 32px rgba(43, 43, 43, .22);
    position: relative;
    overflow: hidden;
}

.sn-home .sn-count-item::after {
    content: "";
    position: absolute;
    inset-inline: 0;
    top: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--sn-primary), #24d7f7);
}

.sn-home .sn-count-item span {
    font-size: 1.9rem;
    font-weight: 900;
    display: block;
    font-variant-numeric: tabular-nums;
    line-height: 1.2;
}

.sn-home .sn-count-item small { color: rgba(255, 255, 255, .65); font-weight: 700; font-size: .78rem; }
.sn-home .sn-count-sep { color: var(--sn-primary); font-size: 1.5rem; font-weight: 900; }

/* =====================================================================
   نمونه‌کارها — Swiper
   ===================================================================== */
.sn-home .sn-portfolio-swiper {
    padding: .5rem .25rem 3.2rem;
}

.sn-home .sn-portfolio-swiper .swiper-slide {
    height: auto;
    display: flex;
}

.sn-home .sn-portfolio-card {
    background: #fff;
    border: 1px solid rgba(43, 43, 43, .06);
    box-shadow: 0 12px 28px rgba(43, 43, 43, .08);
    border-radius: 22px;
    overflow: hidden;
    width: 100%;
    transition: transform .35s ease, box-shadow .35s ease;
}

.sn-home .sn-portfolio-card:hover {
    transform: translateY(-7px);
    box-shadow: 0 26px 50px rgba(43, 43, 43, .16);
}

.sn-home .sn-portfolio-img {
    height: 185px;
    background: #f6f8f2;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 3rem;
    color: var(--sn-primary);
    position: relative;
}

.sn-home .sn-portfolio-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .6s ease;
}

.sn-home .sn-portfolio-card:hover .sn-portfolio-img img { transform: scale(1.07); }

.sn-home .sn-portfolio-body { padding: 1.2rem 1.3rem 1.4rem; text-align: center; }
.sn-home .sn-portfolio-body h3 { font-size: 1.05rem; font-weight: 800; color: var(--sn-dark); }
.sn-home .sn-portfolio-body p { color: var(--sn-text); font-size: .85rem; line-height: 1.9; min-height: 60px; }

/* دکمه‌های ناوبری نمونه‌کار */
.sn-home .sn-port-nav {
    width: 44px;
    height: 44px;
    border-radius: 14px;
    background: #fff;
    color: var(--sn-dark);
    box-shadow: 0 10px 24px rgba(43, 43, 43, .14);
    transition: all .3s;
    top: 42%;
}

.sn-home .sn-port-nav::after { font-size: 1rem; font-weight: 900; }
.sn-home .sn-port-nav:hover { background: var(--sn-primary); color: #fff; }

/* Pagination نمونه‌کار */
.sn-home .sn-port-pagination {
    position: absolute;
    bottom: 8px !important;
}

.sn-home .sn-port-pagination .swiper-pagination-bullet {
    width: 8px;
    height: 8px;
    background: rgba(43, 43, 43, .22);
    opacity: 1;
    transition: all .3s;
}

.sn-home .sn-port-pagination .swiper-pagination-bullet-active {
    width: 26px;
    border-radius: 5px;
    background: var(--sn-primary);
}

/* =====================================================================
   تعرفه — پالس نشان محبوب
   ===================================================================== */
.sn-home .sn-popular-badge {
    animation: snPulse 2.4s ease-in-out infinite;
}

@keyframes snPulse {
    0%, 100% { box-shadow: 0 6px 14px rgba(142, 188, 64, .35); }
    50% { box-shadow: 0 6px 22px rgba(142, 188, 64, .65); }
}

/* =====================================================================
   فرم مشاوره
   ===================================================================== */
.sn-home .sn-consultation-note {
    text-align: center;
    font-weight: 800;
    color: var(--sn-dark);
    margin-bottom: 1.2rem;
}

.sn-home .sn-consultation {
    background: #fff;
    border: 1px solid rgba(142, 188, 64, .2);
    border-radius: 26px;
    padding: 2.4rem 2rem;
    box-shadow: 0 22px 46px rgba(43, 43, 43, .09);
    position: relative;
    overflow: hidden;
}

.sn-home .sn-consultation::before {
    content: "";
    position: absolute;
    inset-inline-start: -80px;
    top: -80px;
    width: 240px;
    height: 240px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(142, 188, 64, .16), transparent 65%);
    pointer-events: none;
}

.sn-home .sn-consultation .form-control,
.sn-home .sn-consultation .form-select {
    background: #fafbf7;
    border: 1px solid rgba(43, 43, 43, .10);
    border-radius: 14px;
    padding: .7rem 1rem;
    transition: border-color .3s, box-shadow .3s;
}

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

/* =====================================================================
   مقالات
   ===================================================================== */
.sn-home .sn-article-card {
    background: #fff;
    border: 1px solid rgba(43, 43, 43, .06);
    box-shadow: 0 12px 28px rgba(43, 43, 43, .08);
    border-radius: 22px;
    overflow: hidden;
    height: 100%;
    transition: transform .35s ease, box-shadow .35s ease;
}

.sn-home .sn-article-card:hover {
    transform: translateY(-7px);
    box-shadow: 0 26px 50px rgba(43, 43, 43, .15);
}

.sn-home .sn-article-img {
    height: 210px;
    overflow: hidden;
    background: #f6f8f2;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 3rem;
    color: var(--sn-primary);
}

.sn-home .sn-article-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .6s ease;
}

.sn-home .sn-article-card:hover .sn-article-img img { transform: scale(1.06); }

/* =====================================================================
   دارک‌مود
   ===================================================================== */
body.dark_mode .sn-home .sn-hero {
    background:
        radial-gradient(900px 420px at 12% -10%, rgba(142, 188, 64, .12), transparent 60%),
        radial-gradient(700px 380px at 88% 110%, rgba(36, 215, 247, .07), transparent 55%),
        #1c1c1c;
}

body.dark_mode .sn-home .sn-hero-title,
body.dark_mode .sn-home .sn-section-title { color: #e8e8e8; }

body.dark_mode .sn-home .sn-hero-pagination .swiper-pagination-bullet { background: rgba(255, 255, 255, .22); }

body.dark_mode .sn-home .sn-service-card,
body.dark_mode .sn-home .sn-portfolio-card,
body.dark_mode .sn-home .sn-article-card {
    background: #2b2b2b;
    border-color: rgba(255, 255, 255, .06);
    box-shadow: 0 12px 30px rgba(0, 0, 0, .4);
}

body.dark_mode .sn-home .sn-service-icon {
    background: linear-gradient(145deg, rgba(142, 188, 64, .2), rgba(142, 188, 64, .07));
}

body.dark_mode .sn-home .sn-timeline-num { background: #2b2b2b; border-color: rgba(142, 188, 64, .3); }
body.dark_mode .sn-home .sn-timeline-progress { background: linear-gradient(90deg, var(--sn-primary), rgba(142, 188, 64, .1)); }

body.dark_mode .sn-home .sn-consultation { background: #2b2b2b; border-color: rgba(142, 188, 64, .22); }
body.dark_mode .sn-home .sn-consultation .form-control,
body.dark_mode .sn-home .sn-consultation .form-select { background: #343434; border-color: transparent; color: #ddd; }
body.dark_mode .sn-home .sn-consultation .form-control:focus,
body.dark_mode .sn-home .sn-consultation .form-select:focus { background: #3a3a3a; }

body.dark_mode .sn-home .sn-port-nav { background: #2b2b2b; color: #e8e8e8; }
body.dark_mode .sn-home .sn-port-nav:hover { background: var(--sn-primary); color: #fff; }
body.dark_mode .sn-home .sn-port-pagination .swiper-pagination-bullet { background: rgba(255, 255, 255, .25); }

body.dark_mode .sn-home .sn-portfolio-img,
body.dark_mode .sn-home .sn-article-img { background: #343434; }

/* =====================================================================
   موبایل
   ===================================================================== */
@media (max-width: 767.98px) {
    .sn-home .sn-hero-slide { padding: 3.4rem .8rem 3.8rem; }
    .sn-home .sn-float-icon { font-size: 1.4rem !important; }
    .sn-home .sn-float-icon.sn-f3 { font-size: 1.2rem !important; }
    .sn-home .sn-hero-pagination { bottom: 30px !important; }
    .sn-home .sn-timeline-progress { display: none; }
    .sn-home .sn-consultation { padding: 1.6rem 1.1rem; }
    .sn-home .sn-count-item { min-width: 76px; padding: .8rem .6rem; }
    .sn-home .sn-count-item span { font-size: 1.5rem; }
    .sn-home .sn-port-nav { display: none; }
}

/* =====================================================================
   کاهش حرکت — احترام به تنظیم کاربر
   ===================================================================== */
@media (prefers-reduced-motion: reduce) {
    .sn-home *,
    .sn-home *::before,
    .sn-home *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }
}
