:root {
            --primary-yellow: #FFD700;
            --gradient-yellow: linear-gradient(135deg, #FFD700 0%, #FDB813 100%);
            --bg-color: #f8f9fa; 
            --text-color: #343a40;
            
            --glass-bg: rgba(255, 255, 255, 0.75); 
            --glass-border: rgba(255, 255, 255, 0.6);
            --nav-shadow: rgba(0, 0, 0, 0.08);
            
            --icon-inactive: #9ba4b5;
            --text-inactive: #6b7280;
        }

        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
            font-family: 'Vazirmatn', sans-serif;
            -webkit-tap-highlight-color: transparent;
        }

        html, body {
            background-color: var(--bg-color);
            color: var(--text-color);
            overflow: hidden;
            height: 100vh;
            height: 100dvh;
            width: 100vw;
            display: flex;
            flex-direction: column;
            touch-action: pan-x pan-y;
        }

        /* ---------------- اسپلش اسکرین ---------------- */
        #splashOverlay {
            position: fixed;
            top: 0;
            left: 0;
            width: 100vw;
            height: 100vh;
            height: 100dvh;
            background-color: #ffffff;
            z-index: 9999;
            display: flex;
            flex-direction: column;
            transition: opacity 0.5s ease, visibility 0.5s ease;
        }

        .splash-slide {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            opacity: 0;
            visibility: hidden;
            transition: opacity 0.4s ease, transform 0.4s ease;
            transform: translateY(15px);
            padding: 20px 20px 150px 20px;
        }

        .splash-slide.active {
            opacity: 1;
            visibility: visible;
            transform: translateY(0);
        }

        .splash-icon-wrapper {
            width: 100px;
            height: 100px;
            background: var(--gradient-yellow);
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            margin-bottom: 30px;
            box-shadow: 0 10px 25px rgba(253, 184, 19, 0.25);
            padding: 25px;
        }

        .splash-icon-wrapper svg {
            width: 100%;
            height: 100%;
            fill: #ffffff;
        }

        .splash-title {
            font-family: 'Vazirmatn', sans-serif;
            font-size: 1.3rem;
            font-weight: 800;
            margin-bottom: 12px;
            color: #212529;
            text-align: center;
        }

        .splash-desc {
            font-family: 'Vazirmatn', sans-serif;
            font-size: 0.9rem;
            color: #6c757d;
            text-align: center;
            max-width: 280px;
            line-height: 1.7;
        }

        .splash-controls {
            position: absolute;
            bottom: 90px;
            left: 0;
            width: 100%;
            padding: 0 30px;
            display: flex;
            justify-content: space-between;
            align-items: center;
            z-index: 10;
        }

        .splash-dots {
            display: flex;
            gap: 6px;
        }

        .splash-dot {
            width: 6px;
            height: 6px;
            border-radius: 50%;
            background-color: #dee2e6;
            transition: all 0.3s ease;
        }

        .splash-dot.active {
            width: 18px;
            border-radius: 4px;
            background: var(--gradient-yellow);
        }

        .splash-btn {
            font-family: 'Vazirmatn', sans-serif;
            background: #3a3a3a;
            color: #ffffff;
            border: none;
            padding: 10px 22px;
            border-radius: 20px;
            font-size: 0.9rem;
            font-weight: 700;
            cursor: pointer;
            box-shadow: 0 6px 15px rgba(0, 0, 0, 0.15);
            transition: transform 0.2s, box-shadow 0.2s;
        }

        .splash-btn:active {
            transform: scale(0.95);
        }

        /* ---------------- خطای اتصال اینترنت (بازطراحی‌شده) ---------------- */
        #offlineOverlay {
            position: fixed;
            top: 0;
            left: 0;
            width: 100vw;
            height: 100vh;
            height: 100dvh;
            background: radial-gradient(circle at 20% 15%, rgba(124, 58, 237, 0.08) 0%, transparent 45%),
                        radial-gradient(circle at 85% 85%, rgba(255, 215, 0, 0.1) 0%, transparent 50%),
                        #ffffff;
            z-index: 10000;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            transition: opacity 0.35s ease, visibility 0.35s ease;
            opacity: 0;
            visibility: hidden;
            padding: 24px;
        }

        #offlineOverlay.active {
            opacity: 1;
            visibility: visible;
        }

        .offline-card {
            width: 100%;
            max-width: 360px;
            text-align: center;
            background: #ffffff;
            border: 1.5px solid rgba(91, 33, 182, 0.1);
            border-radius: 28px;
            padding: clamp(32px, 8vw, 44px) clamp(24px, 6vw, 32px);
            box-shadow: 0 25px 60px rgba(46, 8, 84, 0.12);
        }

        .offline-brand {
            display: block;
            font-size: 1.1rem;
            font-weight: 900;
            margin-bottom: 22px;
            background: linear-gradient(135deg, #4c1d95 0%, #FDB813 100%);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
        }

        .offline-icon-wrap {
            position: relative;
            width: 84px;
            height: 84px;
            margin: 0 auto 22px;
        }

        .offline-icon-ring {
            position: absolute;
            inset: 0;
            border-radius: 50%;
            background: rgba(239, 68, 68, 0.12);
            animation: offlinePulse 2s ease-out infinite;
        }

        @keyframes offlinePulse {
            0%   { transform: scale(0.85); opacity: 0.9; }
            70%  { transform: scale(1.35); opacity: 0; }
            100% { transform: scale(1.35); opacity: 0; }
        }

        .offline-icon-badge {
            position: relative;
            z-index: 1;
            width: 100%;
            height: 100%;
            border-radius: 50%;
            background: linear-gradient(135deg, #fee2e2 0%, #fecaca 100%);
            display: flex;
            align-items: center;
            justify-content: center;
            box-shadow: 0 10px 24px rgba(220, 38, 38, 0.15);
        }

        .offline-icon {
            width: 38px;
            height: 38px;
            fill: #dc2626;
        }

        .offline-title {
            font-size: 1.15rem;
            font-weight: 900;
            color: var(--dl-purple-deep, #2e0854);
            margin-bottom: 10px;
            text-align: center;
        }

        .offline-desc {
            font-size: 0.88rem;
            color: #6b6280;
            text-align: center;
            margin-bottom: 26px;
            line-height: 1.9;
        }

        .offline-btn {
            width: 100%;
            font-family: 'Vazirmatn', sans-serif;
            background: linear-gradient(135deg, #FFD700 0%, #FDB813 100%);
            color: #2e0854;
            border: none;
            padding: 13px 20px;
            border-radius: 16px;
            font-size: 0.92rem;
            font-weight: 800;
            cursor: pointer;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 8px;
            box-shadow: 0 10px 24px rgba(253, 184, 19, 0.35);
            transition: transform 0.2s ease, box-shadow 0.2s ease;
        }

        .offline-btn svg { width: 18px; height: 18px; fill: #2e0854; }

        .offline-btn:hover { transform: translateY(-2px); box-shadow: 0 14px 30px rgba(253, 184, 19, 0.45); }
        .offline-btn:active { transform: scale(0.96); }

        /* ---------------- پاپ‌آپ اطلاع‌رسانی مجوزها ---------------- */
        .license-notice-overlay {
            position: fixed;
            inset: 0;
            z-index: 10050;
            background: rgba(20, 8, 40, 0.55);
            backdrop-filter: blur(4px);
            -webkit-backdrop-filter: blur(4px);
            display: flex;
            align-items: flex-start;
            justify-content: center;
            padding: clamp(70px, 14vw, 110px) 18px 18px;
            opacity: 0;
            visibility: hidden;
            transition: opacity 0.35s ease, visibility 0.35s ease;
        }

        .license-notice-overlay.show {
            opacity: 1;
            visibility: visible;
        }

        .license-notice-card {
            position: relative;
            width: 100%;
            max-width: 380px;
            background: linear-gradient(160deg, #ffffff 0%, #faf7ff 100%);
            border: 1.5px solid rgba(124, 58, 237, 0.15);
            border-radius: 24px;
            padding: clamp(26px, 6vw, 34px) clamp(22px, 5vw, 28px) clamp(22px, 5vw, 26px);
            text-align: center;
            box-shadow: 0 30px 70px rgba(46, 8, 84, 0.35);
            transform: translateY(-24px) scale(0.97);
            transition: transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
        }

        .license-notice-overlay.show .license-notice-card {
            transform: translateY(0) scale(1);
        }

        .license-notice-close {
            position: absolute;
            top: 12px;
            left: 12px;
            width: 30px;
            height: 30px;
            border-radius: 50%;
            border: none;
            background: rgba(91, 33, 182, 0.08);
            display: flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            padding: 7px;
            transition: background 0.2s ease;
        }

        .license-notice-close svg { width: 100%; height: 100%; fill: var(--dl-purple-royal); }
        .license-notice-close:hover { background: rgba(91, 33, 182, 0.16); }

        .license-notice-icon {
            width: 62px;
            height: 62px;
            margin: 0 auto 16px;
            border-radius: 50%;
            background: var(--dl-gradient-gold);
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 15px;
            box-shadow: 0 10px 24px rgba(253, 184, 19, 0.4);
        }

        .license-notice-icon svg { width: 100%; height: 100%; fill: var(--dl-purple-deep); }

        .license-notice-title {
            font-size: 1.05rem;
            font-weight: 900;
            color: var(--dl-purple-deep);
            margin-bottom: 10px;
        }

        .license-notice-text {
            font-size: 0.86rem;
            line-height: 1.9;
            color: var(--dl-text-muted);
            margin-bottom: 22px;
        }

        .license-notice-btn {
            font-family: 'Vazirmatn', sans-serif;
            width: 100%;
            border: none;
            background: var(--dl-gradient-gold);
            color: var(--dl-purple-deep);
            font-weight: 800;
            font-size: 0.9rem;
            padding: 12px 20px;
            border-radius: 14px;
            cursor: pointer;
            box-shadow: 0 8px 20px rgba(253, 184, 19, 0.35);
            transition: transform 0.25s ease, box-shadow 0.25s ease;
        }

        .license-notice-btn:hover { transform: translateY(-2px); box-shadow: 0 12px 26px rgba(253, 184, 19, 0.45); }
        .license-notice-btn:active { transform: scale(0.97); }

        /* ---------------- بدنه اصلی اپلیکیشن ---------------- */
        .content-wrapper {
            flex-grow: 1;
            position: relative;
            overflow-y: auto;
            -webkit-overflow-scrolling: touch;
            padding-bottom: 90px;
            scroll-behavior: smooth;
        }

        .tab-content {
            display: none;
            width: 100%;
            height: 100%;
            position: absolute;
            top: 0;
            left: 0;
            background-color: var(--bg-color);
        }
        
        .tab-content.active {
            display: block;
        }
        
        iframe {
            width: 100%;
            height: 100%;
            border: none;
            pointer-events: auto;
        }

        /* ---------------- استایل منوی پایین ---------------- */
        .bottom-nav {
            position: fixed;
            bottom: 20px;
            left: 50%;
            transform: translateX(-50%);
            width: 90%;
            max-width: 400px;
            background: var(--glass-bg);
            backdrop-filter: blur(20px);
            -webkit-backdrop-filter: blur(20px);
            border-radius: 30px;
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 0 10px;
            box-shadow: 0 10px 30px var(--nav-shadow);
            border: 1.5px solid var(--glass-border);
            height: 65px;
            transition: transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.3s ease;
            z-index: 1000;
        }

        .bottom-nav.hidden {
            transform: translateX(-50%) translateY(120px);
            opacity: 0;
            pointer-events: none;
        }

        .nav-item {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            flex: 1;
            position: relative;
            height: 100%;
        }

        .icon-wrapper {
            display: flex;
            align-items: center;
            justify-content: center;
            width: 42px;
            height: 42px;
            border-radius: 50%;
            color: var(--icon-inactive);
            transition: all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
            background: transparent;
            position: absolute;
            top: 7px;
        }

        .nav-item svg {
            width: 20px;
            height: 20px;
            fill: currentColor;
            transition: transform 0.3s ease;
        }

        .nav-text {
            font-size: 10px;
            font-weight: 700;
            color: var(--text-inactive);
            position: absolute;
            bottom: 6px;
            transition: all 0.3s ease;
            opacity: 1;
        }

        .nav-item.active .icon-wrapper {
            transform: translateY(-28px);
            background: var(--gradient-yellow);
            color: #ffffff;
            box-shadow: 0 6px 15px rgba(253, 184, 19, 0.4);
            border: 3px solid #ffffff;
        }

        .nav-item.active .nav-text {
            color: #1a1a1a;
            transform: translateY(1px);
            font-size: 11px;
        }

        /* بدنه اصلی اپ (داشبورد/نمودار/معامله) — پیش‌فرض مخفی؛ فقط بعد از ورود از صفحه لندینگ نمایش داده می‌شود */
        .app-view {
            display: none;
            flex-direction: column;
            flex-grow: 1;
            height: 100%;
            width: 100%;
        }

        .app-view.show { display: flex; }

        /* ==================================================================
           صفحه لندینگ دسکتاپ (Desktop Landing Page)
           فقط در نمایشگرهای بزرگ (دسکتاپ) نمایش داده می‌شود
           رنگ‌بندی: سفید + بنفش پولداری + طلایی به‌عنوان رنگ‌های غالب؛ مشکی فقط در فوتر و به مقدار کم
        ================================================================== */
        :root {
            --dl-purple-deep: #2e0854;
            --dl-purple-royal: #4c1d95;
            --dl-purple-light: #7c3aed;
            --dl-purple-soft: #a78bfa;
            --dl-gold: #FFD700;
            --dl-gold-deep: #FDB813;
            --dl-black: #120a1f;
            --dl-white: #ffffff;
            --dl-text-dark: #221338;
            --dl-text-muted: #6b6280;
            --dl-gradient-hero: #240b41;
            --dl-gradient-gold: linear-gradient(135deg, #FFD700 0%, #FDB813 100%);
            --dl-gradient-tagline: linear-gradient(120deg, #0f0620 0%, #3b0f6e 55%, #4c1d95 100%);
            --dl-gradient-footer: linear-gradient(160deg, #3b0f6e 0%, #1a0733 55%, #120a1f 100%);
            --dl-gutter: clamp(16px, 4vw, 48px);
        }

        /* لندینگ: با کمک اسپلش‌اسکرین (تمام‌صفحه و مات) از دید کاربر پنهان می‌ماند؛
           دیگر با display:none مخفی نمی‌شود تا ویجت‌های المنتور (مثل نمودار قیمت)
           از همان لحظه بارگذاری صفحه اندازه واقعی کانتینر را ببینند و درست رسم شوند.
           فقط وقتی کاربر وارد اپلیکیشن معاملاتی شد (کلاس dl-hide)، واقعاً از DOM جمع می‌شود.
           رنگ‌بندی: سفید + بنفش پولداری + طلایی به‌عنوان رنگ‌های اصلی، مشکی فقط به‌صورت محدود (فوتر)
           ریسپانسیو با واحدهای سیال (clamp) و گرید auto-fit برای انطباق روان با هر اندازه صفحه */
        .desktop-landing {
            width: 100%;
            min-height: 100vh;
            min-height: 100dvh;
            background: var(--dl-white);
            color: var(--dl-text-dark);
            direction: rtl;
            overflow-x: hidden;
        }

        .desktop-landing.dl-hide { display: none; }

        html.landing-active, body.landing-active { overflow: auto; height: auto; }
        html.landing-active { scroll-behavior: smooth; }

        #dlHome, #dlTrust, #dlDownload { scroll-margin-top: clamp(80px, 22vw, 120px); }

        .dl-section { max-width: 1220px; margin: 0 auto; padding: 0 var(--dl-gutter); }

        .dl-download-outer.dl-section { max-width: none; padding: 0; }

        /* ---------- هدر ---------- */
        .dl-header {
            position: fixed;
            top: 0;
            left: 0;
            right: 0;
            z-index: 500;
            padding: 0;
            background: #ffffff;
            border-bottom: 1px solid rgba(91, 33, 182, 0.12);
            box-shadow: 0 4px 20px rgba(46, 8, 84, 0.06);
            transition: background-color 0.6s ease;
        }

        .dl-header.dl-header--glass {
            background: rgba(255, 255, 255, 0.72);
            backdrop-filter: blur(22px) saturate(160%);
            -webkit-backdrop-filter: blur(22px) saturate(160%);
        }

        .dl-header-inner {
            max-width: 1220px;
            margin: 0 auto;
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 10px;
            flex-wrap: wrap;
            padding: 14px var(--dl-gutter);
        }

        /* فاصله بالای صفحه به‌اندازه ارتفاع هدر ثابت، تا محتوا زیر آن پنهان نشود */
        .dl-header-spacer {
            width: 100%;
        }

        .dl-logo { display: flex; align-items: center; justify-content: center; gap: 8px; order: 2; flex: 1 1 auto; min-width: 0; }

        .dl-logo-icon {
            width: clamp(34px, 4vw, 46px);
            height: clamp(34px, 4vw, 46px);
            display: flex;
            align-items: center;
            justify-content: center;
            flex-shrink: 0;
        }

        .dl-logo-icon svg { width: 100%; height: 100%; fill: var(--dl-purple-deep); }
        .dl-logo-icon img { width: 100%; height: 100%; object-fit: contain; display: block; }

        .dl-logo-text {
            font-size: clamp(0.95rem, 2vw, 1.3rem);
            font-weight: 900;
            color: var(--dl-purple-deep);
            letter-spacing: 0.3px;
        }

        /* منوی دسکتاپ داخل خود هدر ثابت (در موبایل مخفی و به‌جایش منوی کشویی همبرگری) */
        .dl-header-nav { display: none; }

        .dl-header-menu {
            list-style: none;
            display: flex;
            align-items: center;
            justify-content: center;
            gap: clamp(16px, 2.2vw, 34px);
            margin: 0;
            padding: 0;
        }

        .dl-header-menu a {
            display: inline-flex;
            align-items: center;
            line-height: 1;
            padding: 8px 2px;
            font-size: 0.86rem;
            font-weight: 800;
            color: var(--dl-text-dark);
            text-decoration: none;
            position: relative;
            transition: color 0.25s ease;
        }

        .dl-header-menu a::after {
            content: '';
            position: absolute;
            right: 0;
            left: 0;
            bottom: -4px;
            height: 2px;
            border-radius: 2px;
            background: var(--dl-gradient-gold);
            transform: scaleX(0);
            transition: transform 0.3s ease;
        }

        .dl-header-menu a:hover { color: var(--dl-purple-royal); }
        .dl-header-menu a:hover::after { transform: scaleX(1); }

        /* گروه اقدامات هدر در موبایل: قیمت لحظه‌ای بلافاصله از سمت راست دکمه نصب اپلیکیشن شروع می‌شود */
        .dl-header-actions {
            order: 4;
            width: 100%;
            display: flex;
            align-items: center;
            justify-content: space-between;
            flex-wrap: wrap;
            gap: 10px;
        }

        .dl-price-widget {
            display: inline-flex;
            align-items: center;
            min-width: 0;
            gap: 10px;
        }

        .dl-price-icon-btn {
            position: relative;
            flex-shrink: 0;
            width: 40px;
            height: 40px;
            border-radius: 12px;
            border: 1px solid rgba(91, 33, 182, 0.18);
            background: #ffffff;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .dl-price-icon-btn svg { width: 20px; height: 20px; color: var(--dl-purple-royal); }

        .dl-price-icon-badge {
            position: absolute;
            top: -3px;
            left: -3px;
            width: 12px;
            height: 12px;
            border-radius: 50%;
            background: var(--dl-purple-royal);
            border: 1.5px solid var(--dl-purple-royal);
            box-sizing: border-box;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .dl-price-icon-badge .dl-price-dot {
            position: relative;
            width: 6px;
            height: 6px;
            border-radius: 50%;
            background: #F6C000;
            animation: dlBlink 0.9s infinite;
            -webkit-animation: dlBlink 0.9s infinite;
        }

        .dl-price-icon-badge .dl-price-dot::after {
            content: "";
            position: absolute;
            inset: 0;
            border-radius: 50%;
            background: #F6C000;
            animation: dlHalo 0.9s infinite;
            -webkit-animation: dlHalo 0.9s infinite;
            will-change: transform, opacity;
        }

        @keyframes dlBlink {
            0%, 100% { opacity: 1; }
            50% { opacity: 0.15; }
        }

        @-webkit-keyframes dlBlink {
            0%, 100% { opacity: 1; }
            50% { opacity: 0.15; }
        }

        @keyframes dlHalo {
            0% { transform: scale(1); opacity: 0.55; }
            50% { transform: scale(2.4); opacity: 0; }
            100% { transform: scale(1); opacity: 0; }
        }

        @-webkit-keyframes dlHalo {
            0% { -webkit-transform: scale(1); opacity: 0.55; }
            50% { -webkit-transform: scale(2.4); opacity: 0; }
            100% { -webkit-transform: scale(1); opacity: 0; }
        }

        .dl-price-text {
            display: flex;
            flex-direction: column;
            gap: 2px;
            min-width: 0;
        }

        .dl-price-main {
            font-size: 1.05rem;
            font-weight: 900;
            color: var(--dl-text-dark);
            white-space: nowrap;
        }

        .dl-price-main .dl-price-currency {
            font-size: 0.72rem;
            font-weight: 700;
            color: var(--dl-text-muted);
            margin-right: 4px;
        }

        .dl-price-sub {
            font-size: 0.7rem;
            font-weight: 600;
            color: var(--dl-text-muted);
            white-space: nowrap;
        }

        /* دکمه همبرگری (فقط موبایل/تبلت) */
        .dl-hamburger-btn {
            order: 1;
            flex-shrink: 0;
            width: 40px;
            height: 40px;
            border-radius: 12px;
            border: 1px solid rgba(91, 33, 182, 0.18);
            background: #ffffff;
            display: flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            padding: 0;
            transition: transform 0.2s ease, box-shadow 0.2s ease;
        }

        .dl-hamburger-btn svg { width: 19px; height: 19px; fill: var(--dl-purple-royal); }
        .dl-hamburger-btn:hover { transform: translateY(-2px); box-shadow: 0 8px 16px rgba(76, 29, 149, 0.18); }

        .dl-header-cta {
            order: 3;
            font-family: 'Vazirmatn', sans-serif;
            flex-shrink: 0;
            width: 40px;
            height: 40px;
            padding: 0;
            border-radius: 12px;
            border: 1px solid rgba(91, 33, 182, 0.18);
            background: #ffffff;
            color: var(--dl-purple-royal);
            cursor: pointer;
            text-decoration: none;
            display: flex;
            align-items: center;
            justify-content: center;
            white-space: nowrap;
            box-shadow: none;
            transition: transform 0.2s ease, box-shadow 0.2s ease;
        }

        .dl-header-cta:hover { transform: translateY(-2px); box-shadow: 0 8px 16px rgba(76, 29, 149, 0.18); }

        .dl-header-cta-icon { width: 19px; height: 19px; fill: var(--dl-purple-royal); flex-shrink: 0; }
        .dl-header-cta-text { display: none; }

        .dl-header-install {
            font-family: 'Vazirmatn', sans-serif;
            display: inline-flex;
            align-items: center;
            height: 40px;
            gap: 5px;
            background: linear-gradient(135deg, var(--dl-purple-royal) 0%, var(--dl-purple-light) 100%);
            color: #ffffff;
            border: none;
            padding: 0 12px;
            border-radius: 10px;
            font-size: 0.7rem;
            font-weight: 800;
            cursor: pointer;
            text-decoration: none;
            white-space: nowrap;
            box-shadow: 0 8px 20px rgba(124, 58, 237, 0.35);
            transition: transform 0.25s ease, box-shadow 0.25s ease;
        }

        .dl-header-install-icon { width: 14px; height: 14px; flex-shrink: 0; fill: #ffffff; }
        .dl-header-install-text { display: inline; }
        .dl-header-install:hover { transform: translateY(-2px); box-shadow: 0 12px 26px rgba(124, 58, 237, 0.5); }

        @media (min-width: 992px) {
            .dl-header-inner { padding: 20px var(--dl-gutter); gap: 20px; }
            .dl-logo-icon { width: 54px; height: 54px; }
            .dl-logo-text { font-size: 1.5rem; }
            .dl-logo { order: 0; flex: 0 1 auto; justify-content: flex-start; }
            .dl-header-nav { display: none; }
            .dl-hamburger-btn { display: none; }
            .dl-header-actions { display: contents; }
            .dl-price-widget { order: 1; flex: 1 1 auto; width: auto; justify-content: center; }
            .dl-price-icon-btn { width: 46px; height: 46px; background: #ffffff; }
            .dl-price-icon-btn svg { width: 22px; height: 22px; }
            .dl-price-main { font-size: 1.15rem; }
            .dl-price-main .dl-price-currency { font-size: 0.75rem; }
            .dl-price-sub { font-size: 0.76rem; }
            .dl-header-cta {
                order: 3;
                width: auto;
                height: auto;
                padding: 13px 26px;
                border-radius: 10px;
                border: none;
                background: var(--dl-gradient-gold);
                color: var(--dl-purple-deep);
                font-size: 0.92rem;
                box-shadow: 0 8px 20px rgba(253, 184, 19, 0.35);
            }
            .dl-header-cta:hover { box-shadow: 0 12px 26px rgba(253, 184, 19, 0.5); }
            .dl-header-cta-icon { display: none; }
            .dl-header-cta-text { display: inline; }
            .dl-header-install {
                order: 2;
                width: auto;
                height: auto;
                padding: 13px 22px;
                border-radius: 10px;
                border: none;
                background: linear-gradient(135deg, var(--dl-purple-royal) 0%, var(--dl-purple-light) 100%);
                color: #ffffff;
                font-size: 0.86rem;
                gap: 6px;
                box-shadow: 0 8px 20px rgba(124, 58, 237, 0.35);
            }
            .dl-header-install:hover { box-shadow: 0 12px 26px rgba(124, 58, 237, 0.5); }
            .dl-header-install-icon { width: 17px; height: 17px; fill: #ffffff; }
            .dl-header-install-text { display: inline; }
        }

        /* ---------- منوی دسکتاپ (چسبیده به زیر هدر ثابت، هم‌رنگ با هدر) ---------- */
        .dl-subnav {
            display: none;
            z-index: 2;
            background: var(--dl-gradient-hero);
            border-bottom: 1px solid rgba(255, 255, 255, 0.14);
            margin-bottom: clamp(32px, 5vw, 52px);
        }

        .dl-subnav-inner {
            max-width: 1220px;
            margin: 0 auto;
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 16px var(--dl-gutter);
        }

        .dl-subnav-list {
            list-style: none;
            display: flex;
            align-items: center;
            gap: clamp(22px, 3vw, 44px);
        }

        .dl-subnav-list li { position: relative; }

        .dl-subnav-list a {
            display: inline-flex;
            align-items: center;
            line-height: 1;
            padding: 10px 2px;
            font-size: 0.86rem;
            font-weight: 800;
            color: rgba(255, 255, 255, 0.85);
            text-decoration: none;
            position: relative;
            transition: color 0.25s ease;
        }

        .dl-subnav-list a::after {
            content: '';
            position: absolute;
            right: 0;
            left: 0;
            bottom: -4px;
            height: 2px;
            border-radius: 2px;
            background: var(--dl-gradient-gold);
            transform: scaleX(0);
            transition: transform 0.3s ease;
        }

        .dl-subnav-list a:hover { color: var(--dl-gold); }
        .dl-subnav-list a:hover::after { transform: scaleX(1); }

        /* خط زرد زیر «صفحه اصلی» به‌صورت پیش‌فرض نمایان است (چون همیشه در همین صفحه هستیم) */
        .dl-subnav-list li:first-child a { color: var(--dl-gold); }
        .dl-subnav-list li:first-child a::after { transform: scaleX(1); }

        @media (min-width: 992px) {
            .dl-subnav {
                display: block;
                position: fixed;
                left: 0;
                right: 0;
                z-index: 499;
                margin-bottom: 0;
                transition: top 0.15s ease;
            }
        }

        /* ---------- منوی همبرگری (موبایل/تبلت) ---------- */
        .dl-mobile-menu-overlay {
            position: fixed;
            inset: 0;
            z-index: 700;
            background: rgba(20, 8, 40, 0.55);
            backdrop-filter: blur(3px);
            -webkit-backdrop-filter: blur(3px);
            opacity: 0;
            visibility: hidden;
            transition: opacity 0.3s ease, visibility 0.3s ease;
        }

        .dl-mobile-menu-overlay.show { opacity: 1; visibility: visible; }

        .dl-mobile-menu-panel {
            position: absolute;
            top: 0;
            right: 0;
            width: 78%;
            max-width: 320px;
            height: 100%;
            background: linear-gradient(180deg, #ffffff 0%, #faf7ff 100%);
            box-shadow: -18px 0 40px rgba(46, 8, 84, 0.25);
            padding: 22px 22px 26px;
            display: flex;
            flex-direction: column;
            transform: translateX(100%);
            transition: transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
        }

        .dl-mobile-menu-overlay.show .dl-mobile-menu-panel { transform: translateX(0); }

        .dl-mobile-menu-head {
            display: flex;
            align-items: center;
            justify-content: space-between;
            margin-bottom: 20px;
            padding-bottom: 16px;
            border-bottom: 1px solid rgba(91, 33, 182, 0.1);
        }

        .dl-mobile-menu-close {
            width: 34px;
            height: 34px;
            border-radius: 50%;
            border: none;
            background: rgba(91, 33, 182, 0.08);
            display: flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            padding: 8px;
        }

        .dl-mobile-menu-close svg { width: 100%; height: 100%; fill: var(--dl-purple-royal); }

        .dl-mobile-menu-list { list-style: none; display: flex; flex-direction: column; gap: 2px; }

        .dl-mobile-menu-list a {
            display: flex;
            align-items: center;
            padding: 15px 8px;
            font-size: 0.95rem;
            font-weight: 800;
            color: var(--dl-purple-deep);
            text-decoration: none;
            border-bottom: 1px solid rgba(91, 33, 182, 0.08);
            transition: color 0.2s ease, padding-right 0.2s ease;
        }

        .dl-mobile-menu-list a:hover { color: var(--dl-gold-deep); padding-right: 14px; }

        .dl-mobile-menu-foot {
            margin-top: auto;
            padding-top: 18px;
        }

        .dl-mobile-support {
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 12px;
            padding: 14px 16px;
            border-radius: 16px;
            background: linear-gradient(135deg, rgba(124, 58, 237, 0.08), rgba(255, 215, 0, 0.1));
            border: 1px solid rgba(91, 33, 182, 0.14);
            text-align: right;
        }

        .dl-mobile-support-icon {
            flex-shrink: 0;
            width: 44px;
            height: 44px;
            border-radius: 50%;
            background: var(--dl-gradient-gold);
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 10px;
            box-shadow: 0 8px 18px rgba(253, 184, 19, 0.35);
        }

        .dl-mobile-support-icon svg { width: 100%; height: 100%; fill: var(--dl-purple-deep); }

        .dl-mobile-support-text {
            display: flex;
            flex-direction: column;
            gap: 3px;
            min-width: 0;
        }

        .dl-mobile-support-label {
            font-size: 0.78rem;
            font-weight: 800;
            color: var(--dl-purple-deep);
        }

        .dl-mobile-support-number {
            display: inline-flex;
            align-items: center;
            gap: 6px;
            font-size: 0.95rem;
            font-weight: 900;
            color: var(--dl-purple-royal);
            text-decoration: none;
            direction: ltr;
            justify-content: flex-end;
        }

        .dl-mobile-support-number:hover { color: var(--dl-gold-deep); }

        .dl-mobile-menu-copyright {
            margin-top: 14px;
            text-align: center;
            font-size: 0.68rem;
            color: var(--dl-text-muted);
        }

        @media (min-width: 992px) {
            .dl-mobile-menu-overlay { display: none !important; }
        }

        /* ---------- هیرو ---------- */
        .dl-hero {
            position: relative;
            background: var(--dl-gradient-hero);
            padding: clamp(46px, 9vw, 130px) var(--dl-gutter) clamp(48px, 8vw, 100px);
            text-align: center;
            overflow: hidden;
        }

        .dl-hero-inner { position: relative; z-index: 2; max-width: 800px; margin: 0 auto; }

        .dl-hero-badge {
            display: inline-flex;
            align-items: center;
            gap: 6px;
            background: rgba(255, 215, 0, 0.15);
            border: 1px solid rgba(255, 215, 0, 0.5);
            color: var(--dl-gold);
            padding: 7px 18px;
            border-radius: 30px;
            font-size: clamp(0.68rem, 1.4vw, 0.82rem);
            font-weight: 700;
            margin-bottom: clamp(14px, 3vw, 26px);
        }

        .dl-hero-badge svg { width: 14px; height: 14px; flex-shrink: 0; fill: var(--dl-gold); }

        .dl-hero h1 {
            font-size: clamp(0.88rem, 4vw, 1.9rem);
            font-weight: 900;
            line-height: 1.5;
            margin-bottom: clamp(14px, 3vw, 22px);
            color: var(--dl-white);
            white-space: nowrap;
            text-shadow: 0 2px 14px rgba(0, 0, 0, 0.2);
        }

        .dl-hero h1 span {
            background: var(--dl-gradient-gold);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
        }

        .dl-hero p {
            font-size: clamp(0.86rem, 1.8vw, 1.08rem);
            line-height: 2;
            color: rgba(255, 255, 255, 0.88);
            max-width: 660px;
            margin: 0 auto clamp(18px, 3vw, 24px);
        }

        .dl-hero-local {
            position: relative;
            display: block;
            width: fit-content;
            font-size: clamp(0.7rem, 1.5vw, 0.85rem);
            font-weight: 700;
            line-height: 1.85;
            color: var(--dl-gold);
            max-width: 620px;
            margin: 0 auto clamp(22px, 4vw, 34px);
            padding: 14px 24px;
            background: linear-gradient(135deg, rgba(255, 215, 0, 0.14), rgba(255, 215, 0, 0.05));
            border: 1px solid rgba(255, 215, 0, 0.4);
            border-radius: 16px;
            text-align: center;
            box-shadow: 0 8px 22px rgba(0, 0, 0, 0.12);
        }

        .dl-hero-local-quote {
            width: 16px;
            height: 16px;
            fill: rgba(255, 215, 0, 0.55);
            vertical-align: -2px;
            margin-left: 4px;
        }

        .dl-hero-actions { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }

        .dl-btn-primary {
            background: var(--dl-gradient-gold);
            color: var(--dl-purple-deep);
            font-weight: 800;
            padding: clamp(12px, 2vw, 16px) clamp(24px, 4vw, 40px);
            border-radius: 12px;
            text-decoration: none;
            font-size: clamp(0.85rem, 1.6vw, 1.02rem);
            box-shadow: 0 10px 25px rgba(253, 184, 19, 0.4);
            transition: transform 0.25s ease;
        }

        .dl-btn-primary:hover { transform: translateY(-3px); }

        .dl-btn-secondary {
            background: rgba(255, 255, 255, 0.1);
            border: 1.5px solid rgba(255, 255, 255, 0.5);
            color: var(--dl-white);
            font-weight: 700;
            padding: clamp(12px, 2vw, 16px) clamp(24px, 4vw, 40px);
            border-radius: 30px;
            text-decoration: none;
            font-size: clamp(0.85rem, 1.6vw, 1.02rem);
            transition: all 0.25s ease;
        }

        .dl-btn-secondary:hover { background: rgba(255, 255, 255, 0.22); }

        /* ---------- ویژگی‌ها ---------- */
        .dl-features { background: linear-gradient(180deg, #ffffff 0%, #fbf9ff 100%); padding: clamp(30px, 5.5vw, 56px) clamp(18px, 5vw, 40px); }

        .dl-features-header { text-align: center; max-width: 640px; margin: 0 auto clamp(20px, 3vw, 30px); }

        .dl-features-eyebrow {
            display: inline-block;
            background: rgba(124, 58, 237, 0.08);
            border: 1px solid rgba(124, 58, 237, 0.18);
            color: var(--dl-purple-royal);
            font-weight: 800;
            font-size: 0.72rem;
            padding: 6px 16px;
            border-radius: 20px;
            margin-bottom: 12px;
            letter-spacing: 0.3px;
        }

        .dl-features-header h2 {
            font-size: clamp(1.15rem, 2.6vw, 1.7rem);
            font-weight: 900;
            color: var(--dl-purple-deep);
            line-height: 1.6;
        }

        .dl-features-header h2 span {
            background: var(--dl-gradient-gold);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
        }

        .dl-features-grid {
            display: grid;
            grid-template-columns: 1fr;
            gap: 14px;
            max-width: 1180px;
            margin: 0 auto;
        }

        /* موبایل: هر باکس فقط یک ردیف با عنوان است؛ با کلیک باز/بسته می‌شود */
        .dl-feature-card {
            position: relative;
            overflow: hidden;
            background: linear-gradient(180deg, #ffffff 0%, #fdfbff 100%);
            border: 1.5px solid rgba(91, 33, 182, 0.12);
            border-radius: 20px;
            padding: 16px 20px;
            text-align: right;
            cursor: pointer;
            box-shadow: 0 8px 22px rgba(46, 8, 84, 0.06);
            transition: box-shadow 0.3s ease, border-color 0.3s ease, transform 0.3s ease;
        }

        .dl-feature-card::before {
            content: '';
            position: absolute;
            top: 0;
            right: 0;
            left: 0;
            height: 4px;
            background: var(--dl-gradient-gold);
            transform: scaleX(0);
            transform-origin: right;
            transition: transform 0.4s ease;
        }

        .dl-feature-card:hover { border-color: rgba(255, 215, 0, 0.5); }
        .dl-feature-card:hover::before { transform: scaleX(1); }

        .dl-feature-card.open { border-color: rgba(255, 215, 0, 0.6); box-shadow: 0 14px 30px rgba(46, 8, 84, 0.1); }
        .dl-feature-card.open::before { transform: scaleX(1); }

        .dl-feature-top {
            display: flex;
            align-items: center;
            gap: 12px;
        }

        .dl-feature-icon {
            width: 46px;
            height: 46px;
            flex-shrink: 0;
            border-radius: 15px;
            background: var(--dl-gradient-gold);
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 11px;
            box-shadow: 0 8px 20px rgba(253, 184, 19, 0.35), 0 0 0 6px rgba(255, 215, 0, 0.08);
            transition: transform 0.35s cubic-bezier(0.34, 1.56, 0.64, 1);
        }

        .dl-feature-card:hover .dl-feature-icon { transform: scale(1.08) rotate(-4deg); }

        .dl-feature-icon svg { width: 100%; height: 100%; fill: var(--dl-purple-deep); }

        .dl-feature-top h3 {
            flex: 1;
            font-size: 0.96rem;
            font-weight: 800;
            color: var(--dl-purple-deep);
            letter-spacing: 0.2px;
        }

        .dl-feature-chevron {
            flex-shrink: 0;
            width: 20px;
            height: 20px;
            fill: var(--dl-purple-royal);
            transition: transform 0.3s ease;
        }

        .dl-feature-card.open .dl-feature-chevron { transform: rotate(180deg); }

        .dl-feature-desc {
            max-height: 0;
            overflow: hidden;
            font-size: 0.85rem;
            line-height: 1.95;
            color: var(--dl-text-muted);
            transition: max-height 0.35s ease, margin-top 0.35s ease;
        }

        .dl-feature-card.open .dl-feature-desc { max-height: 200px; margin-top: 12px; }

        /* فقط دسکتاپ: کارت‌های ویژگی جمع‌وجورتر و هماهنگ‌تر شوند */
        @media (min-width: 992px) {
            .dl-features {
                padding-top: 36px;
                padding-bottom: 42px;
            }

            .dl-features-header {
                max-width: 360px;
                margin-bottom: 18px;
            }

            .dl-features-grid {
                grid-template-columns: repeat(3, minmax(0, 1fr));
                gap: 18px;
                max-width: 1040px;
            }

            .dl-feature-card {
                text-align: right;
                cursor: default;
                padding: 18px 18px 16px;
                border-radius: 18px;
                min-height: 100%;
                transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
            }

            .dl-feature-card:hover {
                transform: translateY(-4px);
                box-shadow: 0 14px 28px rgba(46, 8, 84, 0.1);
            }

            .dl-feature-top {
                flex-direction: row;
                align-items: center;
                gap: 10px;
            }

            .dl-feature-icon {
                width: 42px;
                height: 42px;
                margin: 0;
                border-radius: 14px;
                padding: 10px;
                box-shadow: 0 7px 16px rgba(253, 184, 19, 0.28), 0 0 0 4px rgba(255, 215, 0, 0.06);
            }

            .dl-feature-top h3 {
                font-size: 0.98rem;
                line-height: 1.7;
                margin-bottom: 0;
            }

            .dl-feature-chevron { display: none; }

            .dl-feature-desc {
                max-height: none !important;
                overflow: visible;
                margin-top: 10px !important;
                font-size: 0.82rem;
                line-height: 1.85;
            }
        }

        /* ---------- راهنمای خرید ---------- */
        .dl-guide { background: #ffffff; padding: clamp(30px, 5.5vw, 56px) clamp(18px, 5vw, 40px); }

        .dl-guide-grid {
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: clamp(28px, 5vw, 48px);
            max-width: 1180px;
            margin: 0 auto;
        }

        .dl-guide-visual { width: 100%; display: flex; justify-content: center; }

        .dl-guide-image-wrap {
            position: relative;
            width: clamp(260px, 85vw, 520px);
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .dl-guide-circle-1, .dl-guide-circle-2 {
            position: absolute;
            border-radius: 50%;
            z-index: 0;
        }

        .dl-guide-circle-1 {
            width: 78%;
            height: 78%;
            background: radial-gradient(circle, rgba(255, 215, 0, 0.22) 0%, transparent 72%);
            top: 4%;
            right: 6%;
        }

        .dl-guide-circle-2 {
            width: 55%;
            height: 55%;
            background: radial-gradient(circle, rgba(124, 58, 237, 0.18) 0%, transparent 72%);
            bottom: 0;
            left: 4%;
        }

        .dl-guide-img {
            position: relative;
            z-index: 1;
            width: 100%;
            max-width: 480px;
            height: auto;
            display: block;
            border-radius: 20px;
            filter: drop-shadow(0 20px 40px rgba(76, 29, 149, 0.18));
        }

        .dl-guide-text { width: 100%; text-align: center; }

        .dl-guide-text h2 {
            font-size: clamp(1.15rem, 2.6vw, 1.7rem);
            font-weight: 900;
            color: var(--dl-purple-deep);
            line-height: 1.6;
            margin-bottom: 14px;
        }

        .dl-guide-text h2 span {
            background: var(--dl-gradient-gold);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
        }

        .dl-guide-text > p {
            font-size: clamp(0.85rem, 1.5vw, 0.95rem);
            line-height: 1.95;
            color: var(--dl-text-muted);
            max-width: 560px;
            margin: 0 auto clamp(22px, 4vw, 30px);
        }

        .dl-guide-steps {
            list-style: none;
            display: flex;
            flex-direction: column;
            gap: 10px;
            max-width: 560px;
            margin: 0 auto;
            text-align: right;
        }

        .dl-guide-step {
            display: flex;
            align-items: center;
            gap: 14px;
            padding: 14px 18px;
            border-radius: 16px;
            background: transparent;
            transition: background 0.3s ease;
        }

        .dl-guide-step.active {
            background: linear-gradient(135deg, rgba(255, 215, 0, 0.14), rgba(124, 58, 237, 0.06));
        }

        .dl-guide-step-icon {
            flex-shrink: 0;
            width: 48px;
            height: 48px;
            border-radius: 14px;
            background: var(--dl-gradient-gold);
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 11px;
            box-shadow: 0 8px 18px rgba(253, 184, 19, 0.3);
        }

        .dl-guide-step-icon svg { width: 100%; height: 100%; fill: var(--dl-purple-deep); }

        .dl-guide-step strong {
            display: block;
            font-size: 0.98rem;
            font-weight: 800;
            color: var(--dl-purple-deep);
            margin-bottom: 3px;
        }

        .dl-guide-step p {
            font-size: 0.78rem;
            line-height: 1.7;
            color: var(--dl-text-muted);
        }

        @media (min-width: 992px) {
            .dl-guide-grid {
                display: grid;
                grid-template-columns: 1fr 1fr;
                align-items: center;
                gap: clamp(30px, 5vw, 70px);
            }

            .dl-guide-text { text-align: right; }
            .dl-guide-text > p { margin: 0 0 clamp(22px, 3vw, 30px); }
            .dl-guide-steps { margin: 0; }
        }

        /* ---------- نمادهای اعتماد ---------- */
        .dl-trust {
            background: linear-gradient(180deg, #f7f2ff 0%, #fff9e8 100%);
            padding: clamp(14px, 3vw, 28px) clamp(12px, 5vw, 40px) clamp(28px, 6vw, 64px);
            text-align: center;
        }

        .dl-trust-title { font-size: clamp(0.82rem, 1.8vw, 1.08rem); font-weight: 800; color: var(--dl-purple-royal); margin-bottom: clamp(14px, 3vw, 34px); }

        /* موبایل: هر سه نماد در یک ردیف افقی، فشرده و کنار هم */
        .dl-trust-grid {
            display: flex;
            flex-direction: row;
            flex-wrap: nowrap;
            justify-content: flex-start;
            gap: 12px;
            max-width: 1220px;
            margin: 0 auto;
            overflow-x: auto;
            overflow-y: hidden;
            padding-bottom: 6px;
            scrollbar-width: thin;
            -webkit-overflow-scrolling: touch;
        }

        .dl-trust-grid::-webkit-scrollbar {
            height: 4px;
        }

        .dl-trust-grid::-webkit-scrollbar-thumb {
            background: rgba(91, 33, 182, 0.25);
            border-radius: 4px;
        }

        .dl-trust-badge {
            flex: 0 0 29%;
            min-width: 29%;
            background: var(--dl-white);
            border: 1px solid rgba(91, 33, 182, 0.15);
            border-radius: 14px;
            padding: 12px 10px;
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 6px;
            justify-content: flex-start;
            box-shadow: 0 6px 16px rgba(46, 8, 84, 0.06);
            transition: transform 0.25s ease, box-shadow 0.25s ease;
            text-decoration: none;
        }

        .dl-trust-badge:hover { transform: translateY(-4px); box-shadow: 0 14px 30px rgba(46, 8, 84, 0.1); }

        .dl-trust-badge .dl-trust-icon {
            width: 56px;
            height: 56px;
            flex-shrink: 0;
            display: flex;
            align-items: center;
            justify-content: center;
            overflow: hidden;
        }

        .dl-trust-badge .dl-trust-icon svg { width: 100%; height: 100%; fill: var(--dl-purple-deep); }
        .dl-trust-badge .dl-trust-icon img { width: 100%; height: 100%; object-fit: contain; }

        .dl-trust-badge span.dl-trust-label {
            font-size: 0.7rem;
            line-height: 1.5;
            font-weight: 700;
            color: var(--dl-purple-deep);
            text-align: center;
        }

        @media (min-width: 992px) {
            .dl-trust-grid {
                overflow: visible;
                flex-wrap: wrap;
                justify-content: center;
                gap: 18px;
                padding-bottom: 0;
            }

            .dl-trust-badge {
                flex: 0 1 190px;
                min-width: 0;
                padding: 16px 14px;
            }

            .dl-trust-badge .dl-trust-icon { width: 58px; height: 58px; }
            .dl-trust-badge span.dl-trust-label { font-size: 0.8rem; }
        }

        /* ---------- تگ‌لاین یک خطی ---------- */
        .dl-tagline {
            position: relative;
            background: var(--dl-gradient-tagline);
            padding: clamp(26px, 5vw, 42px) 18px;
            text-align: center;
            overflow: hidden;
        }

        .dl-tagline::before {
            content: '';
            position: absolute;
            inset: 0;
            background: radial-gradient(circle at 30% 20%, rgba(255,255,255,0.18) 0%, transparent 55%),
                        radial-gradient(circle at 80% 80%, rgba(255,215,0,0.25) 0%, transparent 50%);
        }

        .dl-tagline p {
            position: relative;
            z-index: 1;
            display: inline-block;
            font-size: clamp(1rem, 2.4vw, 1.4rem);
            font-weight: 900;
            color: var(--dl-white);
            letter-spacing: 0.3px;
            text-shadow: 0 2px 12px rgba(0,0,0,0.15);
        }

        .dl-tagline p::after {
            content: '';
            display: block;
            width: 56px;
            height: 3px;
            margin: 14px auto 0;
            border-radius: 3px;
            background: var(--dl-gold);
        }

        /* ---------- نمودار ---------- */
        .th-chart-section {
            padding: 22px 16px 110px;
            background:
                radial-gradient(circle at top right, rgba(253,184,19,0.16), transparent 34%),
                linear-gradient(180deg, #f8f4ff 0%, #ffffff 100%);
            min-height: 100%;
        }

        .th-chart-section--landing {
            padding: clamp(28px, 5vw, 44px) clamp(16px, 3vw, 22px) 0;
            background: transparent;
        }

        .th-chart-shell {
            max-width: 960px;
            margin: 0 auto;
        }

        .th-chart-shell--landing {
            display: block;
            max-width: 1320px;
        }

        .th-chart-card {
            --th-gold-rgb: 59, 15, 110;
            --th-gold-solid: #3b0f6e;
            --th-red: #d74f4f;
            --th-red-soft: rgba(215, 79, 79, 0.12);
            --th-green: #198754;
            --th-green-soft: rgba(25, 135, 84, 0.12);
            --th-border: rgba(128, 128, 128, 0.12);
            --th-muted: #666f7d;
            --th-dark: #1f2937;
            position: relative;
            width: 100%;
            display: flex;
            flex-direction: column;
            gap: 16px;
            padding: clamp(18px, 2.5vw, 26px);
            border-radius: 18px;
            border: none;
            background: #fff;
            box-shadow: 0 18px 40px rgba(30, 41, 59, 0.12);
        }

        .th-chart-header {
            display: flex;
            flex-direction: column;
            gap: 10px;
        }

        .th-chart-title-row {
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 10px;
            text-align: center;
        }

        .th-chart-title {
            margin: 0;
            font-size: 1.125rem;
            line-height: 2rem;
            font-weight: 800;
            color: var(--th-dark);
            text-align: center;
        }

        .th-chart-price-wrap {
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            justify-content: center;
            gap: 10px 14px;
            width: 100%;
        }

        .th-chart-change-badge {
            display: inline-flex;
            align-items: center;
            gap: 4px;
            padding: 6px 10px;
            border-radius: 10px;
            font-size: 0.72rem;
            font-weight: 700;
            background: var(--th-red-soft);
            color: var(--th-red);
        }

        .th-chart-change-badge.is-positive {
            background: var(--th-green-soft);
            color: var(--th-green);
        }

        .th-chart-live-price {
            display: inline-flex;
            align-items: baseline;
            justify-content: center;
            gap: 6px;
            flex-wrap: wrap;
            color: var(--th-dark);
        }

        .th-chart-live-price-value {
            font-size: clamp(1.35rem, 3vw, 1.75rem);
            line-height: 1.5;
            font-weight: 900;
            direction: ltr;
        }

        .th-chart-live-price-unit {
            font-size: 0.72rem;
            font-weight: 600;
            color: var(--th-muted);
        }

        .th-chart-figure {
            position: relative;
            min-height: 250px;
            width: 100%;
            overflow: visible;
            border-radius: 14px;
            background: linear-gradient(180deg, rgba(255,255,255,0.9) 0%, rgba(252,248,236,0.85) 100%);
        }

        .th-chart-svg {
            width: 100%;
            height: 100%;
            min-height: 250px;
            display: block;
            cursor: crosshair;
        }

        .th-chart-empty {
            position: absolute;
            inset: 0;
            display: flex;
            align-items: center;
            justify-content: center;
            text-align: center;
            padding: 24px;
            color: var(--th-muted);
            font-size: 0.88rem;
            font-weight: 700;
            background: rgba(255,255,255,0.88);
        }

        .th-chart-empty.is-hidden { display: none; }

        .th-chart-summary {
            position: relative;
            display: grid;
            gap: 8px;
            margin: 0;
            padding: 0;
            list-style: none;
            justify-items: center;
        }

        .th-chart-summary-row {
            display: flex;
            align-items: center;
            justify-content: center;
            flex-wrap: nowrap;
            gap: 14px;
            width: 100%;
            list-style: none;
        }

        .th-chart-summary-item {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            color: var(--th-muted);
            font-size: 0.78rem;
            white-space: nowrap;
        }

        .th-chart-summary-item--change {
            width: 100%;
            justify-content: center;
            text-align: center;
            padding-top: 2px;
        }

        .th-chart-summary-divider {
            width: 1px;
            align-self: stretch;
            min-height: 22px;
            background: rgba(128, 128, 128, 0.22);
        }

        .th-chart-summary-icon,
        .th-chart-change-icon {
            width: 16px;
            height: 16px;
            flex-shrink: 0;
        }

        .th-chart-summary-icon.is-low,
        .th-chart-change-badge.is-negative,
        .th-chart-tooltip-price.is-negative,
        .th-chart-stat-change.is-negative { color: var(--th-red); }

        .th-chart-summary-icon.is-high,
        .th-chart-tooltip-price.is-positive,
        .th-chart-stat-change.is-positive { color: var(--th-green); }

        .th-chart-summary strong,
        .th-chart-summary b {
            color: var(--th-dark);
            font-weight: 700;
        }

        .th-chart-tabs {
            display: flex;
            align-items: center;
            gap: 6px;
            margin: 0;
            padding: 6px;
            list-style: none;
            border: 1px solid var(--th-border);
            border-radius: 12px;
            background: transparent;
        }

        .th-chart-tabs li {
            flex: 1 1 0;
            display: flex;
        }

        .th-chart-period-btn {
            width: 100%;
            height: 40px;
            border: 0;
            border-radius: 8px;
            background: transparent;
            color: #6b7280;
            font: inherit;
            font-size: 0.78rem;
            font-weight: 700;
            cursor: pointer;
            transition: background 0.2s ease, color 0.2s ease;
        }

        .th-chart-period-btn:hover {
            background: rgba(148, 163, 184, 0.12);
            color: var(--th-dark);
        }

        .th-chart-period-btn.is-active {
            background: rgba(255, 184, 19, 0.12);
            color: var(--th-dark);
        }

        .th-chart-meta {
            font-size: 0.76rem;
            color: var(--th-muted);
            text-align: center;
        }

        .th-chart-tooltip {
            position: absolute;
            top: 0;
            left: 0;
            min-width: 148px;
            max-width: 190px;
            padding: 8px 10px;
            border-radius: 12px;
            border: 1px solid rgba(91, 33, 182, 0.12);
            background: rgba(255, 255, 255, 0.95);
            box-shadow: 0 16px 38px rgba(46, 8, 84, 0.14);
            backdrop-filter: blur(10px);
            -webkit-backdrop-filter: blur(10px);
            pointer-events: none;
            opacity: 1;
            visibility: visible;
            transform: translate(-50%, calc(-100% - 14px));
            transition: opacity 0.2s ease, transform 0.2s ease;
            z-index: 3;
        }

        .th-chart-tooltip.is-hidden {
            opacity: 0;
            visibility: hidden;
        }

        .th-chart-tooltip.is-left-edge { transform: translate(0, calc(-100% - 14px)); }
        .th-chart-tooltip.is-right-edge { transform: translate(-100%, calc(-100% - 14px)); }
        .th-chart-tooltip.is-below { transform: translate(-50%, 14px); }
        .th-chart-tooltip.is-below.is-left-edge { transform: translate(0, 14px); }
        .th-chart-tooltip.is-below.is-right-edge { transform: translate(-100%, 14px); }

        .th-chart-tooltip::after {
            content: '';
            position: absolute;
            left: 50%;
            bottom: -7px;
            width: 14px;
            height: 14px;
            background: rgba(255, 255, 255, 0.95);
            border-left: 1px solid rgba(91, 33, 182, 0.12);
            border-bottom: 1px solid rgba(91, 33, 182, 0.12);
            transform: translateX(-50%) rotate(-45deg);
        }

        .th-chart-tooltip.is-below::after {
            top: -7px;
            bottom: auto;
            border-left: none;
            border-bottom: none;
            border-right: 1px solid rgba(91, 33, 182, 0.12);
            border-top: 1px solid rgba(91, 33, 182, 0.12);
            transform: translateX(-50%) rotate(-45deg);
        }

        .th-chart-tooltip-price {
            display: block;
            margin-bottom: 4px;
            font-size: 0.78rem;
            font-weight: 800;
            color: var(--th-dark);
            direction: ltr;
            text-align: left;
        }

        .th-chart-tooltip-date {
            display: block;
            font-size: 0.7rem;
            line-height: 1.8;
            color: var(--th-muted);
            direction: ltr;
            text-align: left;
        }

        .th-chart-copy {
            display: grid;
            gap: 14px;
            align-content: start;
            color: var(--dl-text-body);
        }

        .th-chart-copy-badge {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            width: fit-content;
            padding: 8px 14px;
            border-radius: 999px;
            background: rgba(253, 184, 19, 0.12);
            color: var(--dl-purple-deep);
            font-size: 0.76rem;
            font-weight: 800;
        }

        .th-chart-copy h3 {
            margin: 0;
            color: var(--dl-purple-deep);
            font-size: clamp(1.2rem, 2.8vw, 1.8rem);
            line-height: 1.9;
        }

        .th-chart-copy p {
            margin: 0;
            color: var(--dl-text-muted);
            line-height: 2;
            font-size: 0.92rem;
        }

        .th-chart-copy-list {
            margin: 0;
            padding: 0;
            list-style: none;
            display: grid;
            gap: 10px;
        }

        .th-chart-copy-list li {
            display: flex;
            align-items: flex-start;
            gap: 10px;
            color: var(--dl-text-body);
            line-height: 1.9;
            font-size: 0.88rem;
        }

        .th-chart-copy-list svg {
            width: 18px;
            height: 18px;
            flex-shrink: 0;
            color: var(--dl-gold-deep);
            margin-top: 4px;
        }

        @media (min-width: 1280px) {
            .th-chart-title-row {
                flex-direction: row;
                align-items: flex-start;
                justify-content: space-between;
            }

            .th-chart-title {
                flex: 1 1 auto;
                min-height: 100%;
                display: flex;
                align-items: center;
                white-space: nowrap;
            }
        }

        @media (min-width: 992px) {
            .th-chart-shell--landing {
                display: grid;
                grid-template-columns: minmax(0, 1.45fr) minmax(360px, 0.95fr);
                gap: clamp(28px, 4vw, 64px);
                align-items: start;
                direction: ltr;
            }

            .th-chart-shell--landing .th-chart-card {
                direction: rtl;
                order: 1;
                max-width: none;
                width: 100%;
                justify-self: stretch;
            }

            .th-chart-shell--landing .th-chart-copy {
                direction: rtl;
                order: 2;
                padding: 24px 0 24px 0;
                align-self: center;
            }
        }

        @media (max-width: 767px) {
            .th-chart-section { padding-bottom: 96px; }
            .th-chart-section--landing { padding-bottom: 12px; }
            .th-chart-card { padding: 18px 16px; }
            .th-chart-figure,
            .th-chart-svg { min-height: 210px; }
            .th-chart-tabs { flex-wrap: nowrap; gap: 4px; padding: 4px; }
            .th-chart-tabs li { flex: 1 1 0; }
            .th-chart-period-btn { height: 34px; padding: 0 2px; font-size: 0.68rem; }
            .th-chart-summary { gap: 8px; }
            .th-chart-summary-row { gap: 10px; }
            .th-chart-summary-item { font-size: 0.74rem; }
            .th-chart-summary-item--change { margin-top: 2px; }
            .th-chart-shell--landing .th-chart-copy { display: none; }
        }

        /* ---------- ماشین‌حساب طلا و تومان ---------- */
        .dl-calc-section { padding-top: clamp(28px, 5vw, 48px); padding-bottom: clamp(28px, 5vw, 48px); background: var(--dl-white); }

        .dl-calc-card {
            max-width: 780px;
            margin: 0 auto;
            background: linear-gradient(160deg, #ffffff 0%, #faf7ff 100%);
            border: 1.5px solid rgba(91, 33, 182, 0.15);
            border-radius: 20px;
            padding: clamp(16px, 3vw, 26px);
            box-shadow: 0 16px 40px rgba(46, 8, 84, 0.1);
        }

        .dl-calc-header {
            display: flex;
            align-items: center;
            gap: 10px;
            margin-bottom: clamp(14px, 2.5vw, 20px);
            text-align: right;
        }

        .dl-calc-icon {
            flex-shrink: 0;
            width: 38px;
            height: 38px;
            border-radius: 12px;
            background: var(--dl-gradient-gold);
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 9px;
            box-shadow: 0 8px 18px rgba(253, 184, 19, 0.3);
        }

        .dl-calc-icon svg { width: 100%; height: 100%; fill: var(--dl-purple-deep); }

        .dl-calc-header h2 { font-size: clamp(0.95rem, 2vw, 1.15rem); font-weight: 900; color: var(--dl-purple-deep); margin-bottom: 3px; }

        .dl-calc-header h2 span {
            background: var(--dl-gradient-gold);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
        }

        .dl-calc-header p { font-size: clamp(0.7rem, 1.2vw, 0.8rem); color: var(--dl-text-muted); }

        .dl-calc-body {
            display: flex;
            flex-direction: column;
            align-items: stretch;
            gap: 8px;
        }

        .dl-calc-field { display: flex; flex-direction: column; gap: 4px; flex: 1; min-width: 0; }

        .dl-calc-field label { font-size: 0.74rem; font-weight: 700; color: var(--dl-purple-royal); }

        .dl-calc-field input {
            font-family: 'Vazirmatn', sans-serif;
            border: 1.5px solid rgba(91, 33, 182, 0.25);
            border-radius: 12px;
            padding: 10px 12px;
            font-size: 0.92rem;
            font-weight: 800;
            color: var(--dl-purple-deep);
            background: var(--dl-white);
            text-align: right;
            transition: border-color 0.25s ease, box-shadow 0.25s ease;
            direction: ltr;
            text-align: left;
        }

        .dl-calc-field input:focus {
            outline: none;
            border-color: var(--dl-gold-deep);
            box-shadow: 0 0 0 4px rgba(253, 184, 19, 0.15);
        }

        /* یکسان‌سازی ظاهر اینپوت عددی بین مرورگرها: کروم/فایرفاکس فلش بالا-پایین نشون می‌دن، سافاری نه */
        .dl-calc-field input[type="number"]::-webkit-outer-spin-button,
        .dl-calc-field input[type="number"]::-webkit-inner-spin-button {
            -webkit-appearance: none;
            margin: 0;
        }

        .dl-calc-field input[type="number"] {
            -moz-appearance: textfield;
            appearance: textfield;
        }

        .dl-calc-swap {
            align-self: center;
            width: 28px;
            height: 28px;
            border-radius: 50%;
            background: var(--dl-gradient-gold);
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 5px;
            box-shadow: 0 6px 14px rgba(253, 184, 19, 0.35);
            flex-shrink: 0;
        }

        .dl-calc-swap svg { width: 100%; height: 100%; fill: var(--dl-purple-deep); }

        .dl-calc-note {
            margin-top: 12px;
            text-align: center;
            font-size: 0.76rem;
            font-weight: 700;
            color: var(--dl-purple-royal);
        }

        .dl-calc-note span { color: var(--dl-gold-deep); font-weight: 900; }

        .dl-calc-card--hero .dl-calc-note { color: var(--dl-purple-royal) !important; }
        .dl-calc-card--hero .dl-calc-note span { color: var(--dl-gold-deep) !important; }

        @media (min-width: 640px) {
            .dl-calc-body { flex-direction: row; align-items: flex-end; }
            .dl-calc-swap { align-self: flex-end; margin-bottom: 11px; transform: rotate(-90deg); }
        }

        .dl-calc-cta {
            display: block;
            width: 100%;
            margin-top: 12px;
            text-align: center;
            background: var(--dl-gradient-gold);
            color: var(--dl-purple-deep);
            font-weight: 800;
            padding: 11px 18px;
            border-radius: 12px;
            text-decoration: none;
            font-size: 0.82rem;
            box-shadow: 0 8px 20px rgba(253, 184, 19, 0.35);
            transition: transform 0.25s ease, box-shadow 0.25s ease;
        }

        .dl-calc-cta:hover { transform: translateY(-2px); box-shadow: 0 12px 26px rgba(253, 184, 19, 0.45); }

        /* نسخهٔ ماشین‌حساب داخل هیرو فقط برای دسکتاپ است؛ در موبایل بخش مستقل زیر هیرو (دست‌نخورده) دیده می‌شود */
        .dl-calc-card--hero { display: none; }

        @media (min-width: 992px) {
            .dl-calc-section { display: none; }

            /* چون منوی دسکتاپ حالا بالای همین بخش قرار دارد، پدینگ بالای هیرو را
               کم می‌کنیم تا بین منو و بالای بخش، فضای خالی زیادی نماند */
            .dl-hero { padding-top: 18px; }

            .dl-hero-grid {
                display: grid;
                grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
                gap: clamp(24px, 4vw, 56px);
                align-items: start;
                justify-items: center;
                max-width: 1220px;
                margin: 0 auto;
            }

            .dl-hero-grid .dl-hero-inner {
                text-align: center;
                margin: 0;
                max-width: 520px;
                display: flex;
                flex-direction: column;
                align-items: center;
                padding-top: 6px;
                justify-self: center;
            }

            .dl-hero-grid .dl-hero-actions { justify-content: center; width: 100%; }

            .dl-calc-card--hero {
                display: block;
                text-align: right;
                background: var(--dl-white);
                width: 100%;
                max-width: 600px;
                justify-self: center;
                box-sizing: border-box;
            }

            .dl-calc-card--hero .dl-calc-body {
                flex-direction: row;
                align-items: flex-end;
            }

            .dl-calc-card--hero .dl-calc-swap {
                align-self: flex-end;
                margin-bottom: 13px;
                transform: rotate(-90deg);
            }
        }

        /* ---------- دانلود اپلیکیشن ---------- */
        .dl-download-outer {
            background:
                radial-gradient(circle at 90% -10%, rgba(255, 215, 0, 0.16) 0%, transparent 45%),
                radial-gradient(circle at -8% 110%, rgba(124, 58, 237, 0.14) 0%, transparent 50%),
                linear-gradient(180deg, #ffffff 0%, #f9f4ff 45%, #ffffff 100%);
            padding: clamp(24px, 4.5vw, 44px) 0;
        }

        .dl-download-card {
            position: relative;
            width: 100%;
            max-width: none;
            margin: 0;
            border-radius: 0;
            overflow: visible;
            background: transparent;
            box-shadow: none;
            border: none;
            padding: clamp(16px, 3vw, 24px) var(--dl-gutter) clamp(20px, 4vw, 28px);
        }

        .dl-download-card::before,
        .dl-download-card::after {
            content: none;
        }

        @media (min-width: 992px) {
            .dl-download-card {
                padding-left: clamp(40px, 6vw, 90px);
                padding-right: clamp(40px, 6vw, 90px);
            }
        }

        .dl-download-grid {
            position: relative;
            z-index: 1;
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: clamp(20px, 4.5vw, 32px);
        }

        .dl-download-visual { order: 1; width: 100%; display: flex; justify-content: center; }
        .dl-download-text { order: 2; width: 100%; text-align: center; }

        .dl-download-badge {
            display: inline-flex;
            align-items: center;
            gap: 6px;
            background: rgba(124, 58, 237, 0.1);
            border: 1px solid rgba(124, 58, 237, 0.3);
            color: var(--dl-purple-royal);
            padding: 7px 18px;
            border-radius: 30px;
            font-size: clamp(0.68rem, 1.4vw, 0.8rem);
            font-weight: 700;
            margin-bottom: clamp(14px, 3vw, 20px);
        }

        .dl-download-badge svg { width: 14px; height: 14px; flex-shrink: 0; fill: var(--dl-purple-royal); }

        .dl-download-text h2 {
            font-size: clamp(1.3rem, 3.2vw, 2.1rem);
            font-weight: 900;
            line-height: 1.5;
            color: var(--dl-purple-deep);
            margin-bottom: clamp(18px, 3.5vw, 26px);
        }

        .dl-download-text h2 span {
            background: var(--dl-gradient-gold);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
        }

        .dl-store-group { margin-bottom: clamp(18px, 3.5vw, 26px); }

        .dl-store-group-title {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 8px;
            font-size: 0.82rem;
            font-weight: 800;
            color: var(--dl-purple-royal);
            letter-spacing: 0.3px;
            margin-bottom: 12px;
        }

        .dl-store-group-title svg { width: 18px; height: 18px; flex-shrink: 0; fill: var(--dl-purple-royal); }

        .dl-store-buttons {
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
            gap: 10px;
        }

        .dl-store-btn {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 9px;
            background: #ffffff;
            border: 1.5px solid rgba(91, 33, 182, 0.16);
            border-radius: 12px;
            padding: 11px 20px;
            text-decoration: none;
            flex: 1 1 auto;
            min-width: 150px;
            box-shadow: 0 8px 18px rgba(46, 8, 84, 0.08);
            transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease, background 0.25s ease;
        }

        .dl-store-btn:hover {
            transform: translateY(-3px);
            background: #faf6ff;
            border-color: rgba(255, 215, 0, 0.6);
            box-shadow: 0 14px 26px rgba(46, 8, 84, 0.14);
        }

        .dl-store-btn-icon {
            flex-shrink: 0;
            width: 22px;
            height: 22px;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .dl-store-btn-icon svg { width: 100%; height: 100%; }

        .dl-store-btn-label {
            font-size: 0.85rem;
            font-weight: 700;
            color: var(--dl-purple-deep);
            white-space: nowrap;
        }

        .dl-phone-mock-wrap {
            position: relative;
            width: clamp(190px, 50vw, 260px);
            margin: 8px 0;
        }

        .dl-phone-mock-glow {
            position: absolute;
            inset: -10%;
            background: radial-gradient(circle, rgba(124, 58, 237, 0.22) 0%, transparent 65%);
            filter: blur(10px);
            z-index: 0;
        }

        .dl-phone-mock {
            position: relative;
            z-index: 1;
            width: 100%;
            height: auto;
            display: block;
            filter: drop-shadow(0 30px 50px rgba(76, 29, 149, 0.25));
        }

        .dl-float-badge {
            position: absolute;
            z-index: 3;
            display: flex;
            align-items: center;
            gap: 6px;
            background: rgba(255, 255, 255, 0.96);
            border-radius: 14px;
            padding: 7px 11px;
            box-shadow: 0 10px 22px rgba(46, 8, 84, 0.2);
        }

        .dl-float-badge-icon {
            width: 24px;
            height: 24px;
            border-radius: 50%;
            background: var(--dl-gradient-gold);
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 5px;
            flex-shrink: 0;
        }

        .dl-float-badge-icon svg { width: 100%; height: 100%; fill: var(--dl-purple-deep); }
        .dl-float-badge strong { display: block; font-size: 0.7rem; font-weight: 900; color: var(--dl-purple-deep); }
        .dl-float-badge span { display: block; font-size: 0.58rem; color: var(--dl-text-muted); }

        .dl-float-badge--rating { top: 0; right: 2%; }
        .dl-float-badge--downloads { bottom: 2%; left: 2%; }

        @media (min-width: 992px) {
            .dl-download-grid {
                display: grid;
                grid-template-columns: 1fr 1fr;
                flex-direction: row;
                align-items: center;
                justify-items: center;
                text-align: center;
                gap: clamp(30px, 5vw, 70px);
            }

            .dl-download-text { order: 0; text-align: center; }
            .dl-download-visual { order: 0; width: 100%; justify-content: center; }

            .dl-store-btn { flex: 0 1 auto; min-width: 170px; }
            .dl-store-btn-label { font-size: 0.9rem; }

            /* گوشی از بالا و پایین پس‌زمینه بیرون می‌زند */
            .dl-phone-mock-wrap {
                width: clamp(230px, 17vw, 300px);
                margin: -70px 0 -46px;
            }

            .dl-float-badge {
                padding: 10px 14px;
                border-radius: 16px;
                gap: 8px;
            }

            .dl-float-badge-icon { width: 30px; height: 30px; padding: 6px; }
            .dl-float-badge strong { font-size: 0.82rem; }
            .dl-float-badge span { font-size: 0.66rem; }

            .dl-float-badge--rating { top: 6%; right: -8%; }
            .dl-float-badge--downloads { bottom: 10%; left: -12%; }
        }

        /* ---------- فوتر ---------- */
        .dl-footer {
            background: var(--dl-gradient-footer);
            padding: clamp(36px, 6vw, 56px) clamp(18px, 5vw, 40px) clamp(22px, 4vw, 32px);
        }

        .dl-footer-grid {
            max-width: 1180px;
            margin: 0 auto;
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
            gap: clamp(20px, 4vw, 32px);
            margin-bottom: clamp(20px, 4vw, 30px);
        }

        .dl-footer-brand .dl-logo-text { font-size: clamp(1rem, 2vw, 1.2rem); color: var(--dl-white); }

        .dl-footer-brand p { margin-top: 12px; font-size: 0.85rem; line-height: 1.9; color: rgba(255, 255, 255, 0.7); }

        .dl-footer-social {
            display: flex;
            gap: 10px;
            margin-top: 18px;
        }

        .dl-footer-social-icon {
            width: 38px;
            height: 38px;
            border-radius: 50%;
            background: rgba(255, 255, 255, 0.08);
            border: 1px solid rgba(255, 255, 255, 0.15);
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 9px;
            transition: transform 0.25s ease, background 0.25s ease, border-color 0.25s ease;
        }

        .dl-footer-social-icon svg { width: 100%; height: 100%; fill: rgba(255, 255, 255, 0.85); }

        .dl-footer-social-icon:hover {
            transform: translateY(-3px);
            background: var(--dl-gradient-gold);
            border-color: transparent;
        }

        .dl-footer-social-icon:hover svg { fill: var(--dl-purple-deep); }

        .dl-footer-trust {
            max-width: 1180px;
            margin: 0 auto clamp(16px, 3vw, 24px);
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            justify-content: center;
            gap: 10px;
            padding-top: 16px;
            border-top: 1px solid rgba(255, 255, 255, 0.1);
        }

        .dl-footer-trust-badge {
            display: flex;
            align-items: center;
            justify-content: center;
            width: 64px;
            height: 64px;
            border-radius: 12px;
            background: rgba(255, 255, 255, 0.9);
            padding: 6px;
            opacity: 0.85;
            transition: opacity 0.25s ease, transform 0.25s ease;
        }

        .dl-footer-trust-badge:hover { opacity: 1; transform: translateY(-2px); }
        .dl-footer-trust-badge img { width: 100%; height: 100%; object-fit: contain; }

        .dl-footer-trust--grid {
            max-width: none;
            margin: 0;
            padding-top: 0;
            border-top: none;
            display: grid;
            grid-template-columns: repeat(2, 64px);
            gap: 12px;
            justify-content: start;
        }

        .dl-footer-social--row {
            max-width: 1180px;
            margin: 0 auto clamp(16px, 3vw, 24px);
            justify-content: center;
            padding-top: 16px;
            border-top: 1px solid rgba(255, 255, 255, 0.1);
        }

        @media (max-width: 767px) {
            .dl-footer-trust-badge { width: 46px; height: 46px; border-radius: 10px; }
            .dl-footer-trust--grid { grid-template-columns: repeat(4, 46px); gap: 8px; justify-content: center; }

            /* ترتیب فوتر در موبایل: برند، تماس با ما، مجوزها و نمادها (یک ردیف)، دسترسی سریع */
            .dl-footer-grid > div:nth-child(1) { order: 1; }
            .dl-footer-grid > div:nth-child(2) { order: 2; }
            .dl-footer-grid > .dl-footer-trust-col { order: 3; }
            .dl-footer-grid > div:nth-child(3) { order: 4; }
        }

        .dl-footer-col h4 { font-size: 0.9rem; font-weight: 800; color: var(--dl-gold); margin-bottom: 12px; }

        .dl-footer-col p, .dl-footer-col a {
            display: block;
            font-size: 0.85rem;
            color: rgba(255, 255, 255, 0.78);
            line-height: 2;
            text-decoration: none;
        }

        .dl-footer-col a:hover { color: var(--dl-gold); }

        .dl-footer-contact-item {
            display: flex !important;
            align-items: center;
            gap: 10px;
            margin-bottom: 4px;
        }

        .dl-footer-contact-item--address { align-items: flex-start; }

        .dl-footer-contact-icon {
            flex-shrink: 0;
            width: 28px;
            height: 28px;
            border-radius: 50%;
            background: rgba(255, 215, 0, 0.12);
            border: 1px solid rgba(255, 215, 0, 0.3);
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 6px;
            margin-top: 2px;
        }

        .dl-footer-contact-icon svg { width: 100%; height: 100%; fill: var(--dl-gold); }

        .dl-footer-bottom {
            max-width: 1180px;
            margin: 0 auto;
            padding-top: 18px;
            border-top: 1px solid rgba(255, 255, 255, 0.12);
            text-align: center;
            font-size: 0.75rem;
            color: rgba(255, 255, 255, 0.55);
        }

        /* ---------- بهبود چیدمان در صفحات بزرگ‌تر ---------- */